@ionic/core
Version:
Base components for Ionic
32,626 lines • 1.81 MB
JavaScript
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
/*!
Stencil Mock Doc v2.5.0 | MIT Licensed | https://stenciljs.com
*/
const CONTENT_REF_ID = 'r';
const ORG_LOCATION_ID = 'o';
const SLOT_NODE_ID = 's';
const TEXT_NODE_ID = 't';
const XLINK_NS = 'http://www.w3.org/1999/xlink';
const attrHandler = {
get(obj, prop) {
if (prop in obj) {
return obj[prop];
}
if (typeof prop !== 'symbol' && !isNaN(prop)) {
return obj.__items[prop];
}
return undefined;
},
};
const createAttributeProxy = (caseInsensitive) => new Proxy(new MockAttributeMap(caseInsensitive), attrHandler);
class MockAttributeMap {
constructor(caseInsensitive = false) {
this.caseInsensitive = caseInsensitive;
this.__items = [];
}
get length() {
return this.__items.length;
}
item(index) {
return this.__items[index] || null;
}
setNamedItem(attr) {
attr.namespaceURI = null;
this.setNamedItemNS(attr);
}
setNamedItemNS(attr) {
if (attr != null && attr.value != null) {
attr.value = String(attr.value);
}
const existingAttr = this.__items.find(a => a.name === attr.name && a.namespaceURI === attr.namespaceURI);
if (existingAttr != null) {
existingAttr.value = attr.value;
}
else {
this.__items.push(attr);
}
}
getNamedItem(attrName) {
if (this.caseInsensitive) {
attrName = attrName.toLowerCase();
}
return this.getNamedItemNS(null, attrName);
}
getNamedItemNS(namespaceURI, attrName) {
namespaceURI = getNamespaceURI(namespaceURI);
return (this.__items.find(attr => attr.name === attrName && getNamespaceURI(attr.namespaceURI) === namespaceURI) || null);
}
removeNamedItem(attr) {
this.removeNamedItemNS(attr);
}
removeNamedItemNS(attr) {
for (let i = 0, ii = this.__items.length; i < ii; i++) {
if (this.__items[i].name === attr.name && this.__items[i].namespaceURI === attr.namespaceURI) {
this.__items.splice(i, 1);
break;
}
}
}
[Symbol.iterator]() {
let i = 0;
return {
next: () => ({
done: i === this.length,
value: this.item(i++),
}),
};
}
get [Symbol.toStringTag]() {
return 'MockAttributeMap';
}
}
function getNamespaceURI(namespaceURI) {
return namespaceURI === XLINK_NS ? null : namespaceURI;
}
function cloneAttributes(srcAttrs, sortByName = false) {
const dstAttrs = new MockAttributeMap(srcAttrs.caseInsensitive);
if (srcAttrs != null) {
const attrLen = srcAttrs.length;
if (sortByName && attrLen > 1) {
const sortedAttrs = [];
for (let i = 0; i < attrLen; i++) {
const srcAttr = srcAttrs.item(i);
const dstAttr = new MockAttr(srcAttr.name, srcAttr.value, srcAttr.namespaceURI);
sortedAttrs.push(dstAttr);
}
sortedAttrs.sort(sortAttributes).forEach(attr => {
dstAttrs.setNamedItemNS(attr);
});
}
else {
for (let i = 0; i < attrLen; i++) {
const srcAttr = srcAttrs.item(i);
const dstAttr = new MockAttr(srcAttr.name, srcAttr.value, srcAttr.namespaceURI);
dstAttrs.setNamedItemNS(dstAttr);
}
}
}
return dstAttrs;
}
function sortAttributes(a, b) {
if (a.name < b.name)
return -1;
if (a.name > b.name)
return 1;
return 0;
}
class MockAttr {
constructor(attrName, attrValue, namespaceURI = null) {
this._name = attrName;
this._value = String(attrValue);
this._namespaceURI = namespaceURI;
}
get name() {
return this._name;
}
set name(value) {
this._name = value;
}
get value() {
return this._value;
}
set value(value) {
this._value = String(value);
}
get nodeName() {
return this._name;
}
set nodeName(value) {
this._name = value;
}
get nodeValue() {
return this._value;
}
set nodeValue(value) {
this._value = String(value);
}
get namespaceURI() {
return this._namespaceURI;
}
set namespaceURI(namespaceURI) {
this._namespaceURI = namespaceURI;
}
}
class MockCustomElementRegistry {
constructor(win) {
this.win = win;
}
define(tagName, cstr, options) {
if (tagName.toLowerCase() !== tagName) {
throw new Error(`Failed to execute 'define' on 'CustomElementRegistry': "${tagName}" is not a valid custom element name`);
}
if (this.__registry == null) {
this.__registry = new Map();
}
this.__registry.set(tagName, { cstr, options });
if (this.__whenDefined != null) {
const whenDefinedResolveFns = this.__whenDefined.get(tagName);
if (whenDefinedResolveFns != null) {
whenDefinedResolveFns.forEach(whenDefinedResolveFn => {
whenDefinedResolveFn();
});
whenDefinedResolveFns.length = 0;
this.__whenDefined.delete(tagName);
}
}
const doc = this.win.document;
if (doc != null) {
const hosts = doc.querySelectorAll(tagName);
hosts.forEach(host => {
if (upgradedElements.has(host) === false) {
tempDisableCallbacks.add(doc);
const upgradedCmp = createCustomElement(this, doc, tagName);
for (let i = 0; i < host.childNodes.length; i++) {
const childNode = host.childNodes[i];
childNode.remove();
upgradedCmp.appendChild(childNode);
}
tempDisableCallbacks.delete(doc);
if (proxyElements.has(host)) {
proxyElements.set(host, upgradedCmp);
}
}
fireConnectedCallback(host);
});
}
}
get(tagName) {
if (this.__registry != null) {
const def = this.__registry.get(tagName.toLowerCase());
if (def != null) {
return def.cstr;
}
}
return undefined;
}
upgrade(_rootNode) {
//
}
clear() {
if (this.__registry != null) {
this.__registry.clear();
}
if (this.__whenDefined != null) {
this.__whenDefined.clear();
}
}
whenDefined(tagName) {
tagName = tagName.toLowerCase();
if (this.__registry != null && this.__registry.has(tagName) === true) {
return Promise.resolve();
}
return new Promise(resolve => {
if (this.__whenDefined == null) {
this.__whenDefined = new Map();
}
let whenDefinedResolveFns = this.__whenDefined.get(tagName);
if (whenDefinedResolveFns == null) {
whenDefinedResolveFns = [];
this.__whenDefined.set(tagName, whenDefinedResolveFns);
}
whenDefinedResolveFns.push(resolve);
});
}
}
function createCustomElement(customElements, ownerDocument, tagName) {
const Cstr = customElements.get(tagName);
if (Cstr != null) {
const cmp = new Cstr(ownerDocument);
cmp.nodeName = tagName.toUpperCase();
upgradedElements.add(cmp);
return cmp;
}
const host = new Proxy({}, {
get(obj, prop) {
const elm = proxyElements.get(host);
if (elm != null) {
return elm[prop];
}
return obj[prop];
},
set(obj, prop, val) {
const elm = proxyElements.get(host);
if (elm != null) {
elm[prop] = val;
}
else {
obj[prop] = val;
}
return true;
},
has(obj, prop) {
const elm = proxyElements.get(host);
if (prop in elm) {
return true;
}
if (prop in obj) {
return true;
}
return false;
},
});
const elm = new MockHTMLElement(ownerDocument, tagName);
proxyElements.set(host, elm);
return host;
}
const proxyElements = new WeakMap();
const upgradedElements = new WeakSet();
function connectNode(ownerDocument, node) {
node.ownerDocument = ownerDocument;
if (node.nodeType === 1 /* ELEMENT_NODE */) {
if (ownerDocument != null && node.nodeName.includes('-')) {
const win = ownerDocument.defaultView;
if (win != null && typeof node.connectedCallback === 'function' && node.isConnected) {
fireConnectedCallback(node);
}
const shadowRoot = node.shadowRoot;
if (shadowRoot != null) {
shadowRoot.childNodes.forEach(childNode => {
connectNode(ownerDocument, childNode);
});
}
}
node.childNodes.forEach(childNode => {
connectNode(ownerDocument, childNode);
});
}
else {
node.childNodes.forEach(childNode => {
childNode.ownerDocument = ownerDocument;
});
}
}
function fireConnectedCallback(node) {
if (typeof node.connectedCallback === 'function') {
if (tempDisableCallbacks.has(node.ownerDocument) === false) {
try {
node.connectedCallback();
}
catch (e) {
console.error(e);
}
}
}
}
function disconnectNode(node) {
if (node.nodeType === 1 /* ELEMENT_NODE */) {
if (node.nodeName.includes('-') === true && typeof node.disconnectedCallback === 'function') {
if (tempDisableCallbacks.has(node.ownerDocument) === false) {
try {
node.disconnectedCallback();
}
catch (e) {
console.error(e);
}
}
}
node.childNodes.forEach(disconnectNode);
}
}
function attributeChanged(node, attrName, oldValue, newValue) {
attrName = attrName.toLowerCase();
const observedAttributes = node.constructor.observedAttributes;
if (Array.isArray(observedAttributes) === true && observedAttributes.some(obs => obs.toLowerCase() === attrName) === true) {
try {
node.attributeChangedCallback(attrName, oldValue, newValue);
}
catch (e) {
console.error(e);
}
}
}
function checkAttributeChanged(node) {
return node.nodeName.includes('-') === true && typeof node.attributeChangedCallback === 'function';
}
const tempDisableCallbacks = new Set();
function dataset(elm) {
const ds = {};
const attributes = elm.attributes;
const attrLen = attributes.length;
for (let i = 0; i < attrLen; i++) {
const attr = attributes.item(i);
const nodeName = attr.nodeName;
if (nodeName.startsWith('data-')) {
ds[dashToPascalCase(nodeName)] = attr.nodeValue;
}
}
return new Proxy(ds, {
get(_obj, camelCaseProp) {
return ds[camelCaseProp];
},
set(_obj, camelCaseProp, value) {
const dataAttr = toDataAttribute(camelCaseProp);
elm.setAttribute(dataAttr, value);
return true;
},
});
}
function toDataAttribute(str) {
return ('data-' +
String(str)
.replace(/([A-Z0-9])/g, g => ' ' + g[0])
.trim()
.replace(/ /g, '-')
.toLowerCase());
}
function dashToPascalCase(str) {
str = String(str).substr(5);
return str
.split('-')
.map((segment, index) => {
if (index === 0) {
return segment.charAt(0).toLowerCase() + segment.slice(1);
}
return segment.charAt(0).toUpperCase() + segment.slice(1);
})
.join('');
}
// Sizzle 2.3.6
const Sizzle = (function() {
const window = {
document: {
createElement() {
return {};
},
nodeType: 9,
documentElement: {
nodeType: 1,
nodeName: 'HTML'
}
}
};
const module = { exports: {} };
/*! Sizzle v2.3.6 | (c) JS Foundation and other contributors | js.foundation */
!function(e){var t,n,r,i,o,u,l,a,c,s,d,f,p,h,g,m,y,v,w,b="sizzle"+1*new Date,N=e.document,C=0,x=0,E=ae(),A=ae(),S=ae(),D=ae(),T=function(e,t){return e===t&&(d=!0),0},L={}.hasOwnProperty,q=[],I=q.pop,B=q.push,R=q.push,$=q.slice,k=function(e,t){for(var n=0,r=e.length;n<r;n++)if(e[n]===t)return n;return -1},H="checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",M="[\\x20\\t\\r\\n\\f]",P="(?:\\\\[\\da-fA-F]{1,6}"+M+"?|\\\\[^\\r\\n\\f]|[\\w-]|[^\0-\\x7f])+",z="\\["+M+"*("+P+")(?:"+M+"*([*^$|!~]?=)"+M+"*(?:'((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\"|("+P+"))|)"+M+"*\\]",F=":("+P+")(?:\\((('((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\")|((?:\\\\.|[^\\\\()[\\]]|"+z+")*)|.*)\\)|)",O=new RegExp(M+"+","g"),j=new RegExp("^"+M+"+|((?:^|[^\\\\])(?:\\\\.)*)"+M+"+$","g"),G=new RegExp("^"+M+"*,"+M+"*"),U=new RegExp("^"+M+"*([>+~]|"+M+")"+M+"*"),V=new RegExp(M+"|>"),X=new RegExp(F),J=new RegExp("^"+P+"$"),K={ID:new RegExp("^#("+P+")"),CLASS:new RegExp("^\\.("+P+")"),TAG:new RegExp("^("+P+"|[*])"),ATTR:new RegExp("^"+z),PSEUDO:new RegExp("^"+F),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+M+"*(even|odd|(([+-]|)(\\d*)n|)"+M+"*(?:([+-]|)"+M+"*(\\d+)|))"+M+"*\\)|)","i"),bool:new RegExp("^(?:"+H+")$","i"),needsContext:new RegExp("^"+M+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+M+"*((?:-\\d)?\\d*)"+M+"*\\)|)(?=[^-]|$)","i")},Q=/HTML$/i,W=/^(?:input|select|textarea|button)$/i,Y=/^h\d$/i,Z=/^[^{]+\{\s*\[native \w/,_=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,ee=/[+~]/,te=new RegExp("\\\\[\\da-fA-F]{1,6}"+M+"?|\\\\([^\\r\\n\\f])","g"),ne=function(e,t){var n="0x"+e.slice(1)-65536;return t||(n<0?String.fromCharCode(n+65536):String.fromCharCode(n>>10|55296,1023&n|56320))},re=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ie=function(e,t){return t?"\0"===e?"\ufffd":e.slice(0,-1)+"\\"+e.charCodeAt(e.length-1).toString(16)+" ":"\\"+e},oe=function(){f();},ue=ve(function(e){return !0===e.disabled&&"fieldset"===e.nodeName.toLowerCase()},{dir:"parentNode",next:"legend"});try{R.apply(q=$.call(N.childNodes),N.childNodes),q[N.childNodes.length].nodeType;}catch(e){R={apply:q.length?function(e,t){B.apply(e,$.call(t));}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1;}};}function le(e,t,r,i){var o,l,c,s,d,h,y,v=t&&t.ownerDocument,N=t?t.nodeType:9;if(r=r||[],"string"!=typeof e||!e||1!==N&&9!==N&&11!==N)return r;if(!i&&(f(t),t=t||p,g)){if(11!==N&&(d=_.exec(e)))if(o=d[1]){if(9===N){if(!(c=t.getElementById(o)))return r;if(c.id===o)return r.push(c),r}else if(v&&(c=v.getElementById(o))&&w(t,c)&&c.id===o)return r.push(c),r}else {if(d[2])return R.apply(r,t.getElementsByTagName(e)),r;if((o=d[3])&&n.getElementsByClassName&&t.getElementsByClassName)return R.apply(r,t.getElementsByClassName(o)),r}if(n.qsa&&!D[e+" "]&&(!m||!m.test(e))&&(1!==N||"object"!==t.nodeName.toLowerCase())){if(y=e,v=t,1===N&&(V.test(e)||U.test(e))){(v=ee.test(e)&&ge(t.parentNode)||t)===t&&n.scope||((s=t.getAttribute("id"))?s=s.replace(re,ie):t.setAttribute("id",s=b)),l=(h=u(e)).length;while(l--)h[l]=(s?"#"+s:":scope")+" "+ye(h[l]);y=h.join(",");}try{return R.apply(r,v.querySelectorAll(y)),r}catch(t){D(e,!0);}finally{s===b&&t.removeAttribute("id");}}}return a(e.replace(j,"$1"),t,r,i)}function ae(){var e=[];function t(n,i){return e.push(n+" ")>r.cacheLength&&delete t[e.shift()],t[n+" "]=i}return t}function ce(e){return e[b]=!0,e}function se(e){var t=p.createElement("fieldset");try{return !!e(t)}catch(e){return !1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null;}}function de(e,t){var n=e.split("|"),i=n.length;while(i--)r.attrHandle[n[i]]=t;}function fe(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&e.sourceIndex-t.sourceIndex;if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return -1;return e?1:-1}function pe(e){return function(t){return "form"in t?t.parentNode&&!1===t.disabled?"label"in t?"label"in t.parentNode?t.parentNode.disabled===e:t.disabled===e:t.isDisabled===e||t.isDisabled!==!e&&ue(t)===e:t.disabled===e:"label"in t&&t.disabled===e}}function he(e){return ce(function(t){return t=+t,ce(function(n,r){var i,o=e([],n.length,t),u=o.length;while(u--)n[i=o[u]]&&(n[i]=!(r[i]=n[i]));})})}function ge(e){return e&&void 0!==e.getElementsByTagName&&e}n=le.support={},o=le.isXML=function(e){var t=e&&e.namespaceURI,n=e&&(e.ownerDocument||e).documentElement;return !Q.test(t||n&&n.nodeName||"HTML")},f=le.setDocument=function(e){var t,i,u=e?e.ownerDocument||e:N;return u!=p&&9===u.nodeType&&u.documentElement?(p=u,h=p.documentElement,g=!o(p),N!=p&&(i=p.defaultView)&&i.top!==i&&(i.addEventListener?i.addEventListener("unload",oe,!1):i.attachEvent&&i.attachEvent("onunload",oe)),n.scope=se(function(e){return h.appendChild(e).appendChild(p.createElement("div")),void 0!==e.querySelectorAll&&!e.querySelectorAll(":scope fieldset div").length}),n.attributes=se(function(e){return e.className="i",!e.getAttribute("className")}),n.getElementsByTagName=se(function(e){return e.appendChild(p.createComment("")),!e.getElementsByTagName("*").length}),n.getElementsByClassName=Z.test(p.getElementsByClassName),n.getById=se(function(e){return h.appendChild(e).id=b,!p.getElementsByName||!p.getElementsByName(b).length}),n.getById?(r.filter.ID=function(e){var t=e.replace(te,ne);return function(e){return e.getAttribute("id")===t}},r.find.ID=function(e,t){if(void 0!==t.getElementById&&g){var n=t.getElementById(e);return n?[n]:[]}}):(r.filter.ID=function(e){var t=e.replace(te,ne);return function(e){var n=void 0!==e.getAttributeNode&&e.getAttributeNode("id");return n&&n.value===t}},r.find.ID=function(e,t){if(void 0!==t.getElementById&&g){var n,r,i,o=t.getElementById(e);if(o){if((n=o.getAttributeNode("id"))&&n.value===e)return [o];i=t.getElementsByName(e),r=0;while(o=i[r++])if((n=o.getAttributeNode("id"))&&n.value===e)return [o]}return []}}),r.find.TAG=n.getElementsByTagName?function(e,t){return void 0!==t.getElementsByTagName?t.getElementsByTagName(e):n.qsa?t.querySelectorAll(e):void 0}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},r.find.CLASS=n.getElementsByClassName&&function(e,t){if(void 0!==t.getElementsByClassName&&g)return t.getElementsByClassName(e)},y=[],m=[],(n.qsa=Z.test(p.querySelectorAll))&&(se(function(e){var t;h.appendChild(e).innerHTML="<a id='"+b+"'></a><select id='"+b+"-\r\\' msallowcapture=''><option selected=''></option></select>",e.querySelectorAll("[msallowcapture^='']").length&&m.push("[*^$]="+M+"*(?:''|\"\")"),e.querySelectorAll("[selected]").length||m.push("\\["+M+"*(?:value|"+H+")"),e.querySelectorAll("[id~="+b+"-]").length||m.push("~="),(t=p.createElement("input")).setAttribute("name",""),e.appendChild(t),e.querySelectorAll("[name='']").length||m.push("\\["+M+"*name"+M+"*="+M+"*(?:''|\"\")"),e.querySelectorAll(":checked").length||m.push(":checked"),e.querySelectorAll("a#"+b+"+*").length||m.push(".#.+[+~]"),e.querySelectorAll("\\\f"),m.push("[\\r\\n\\f]");}),se(function(e){e.innerHTML="<a href='' disabled='disabled'></a><select disabled='disabled'><option/></select>";var t=p.createElement("input");t.setAttribute("type","hidden"),e.appendChild(t).setAttribute("name","D"),e.querySelectorAll("[name=d]").length&&m.push("name"+M+"*[*^$|!~]?="),2!==e.querySelectorAll(":enabled").length&&m.push(":enabled",":disabled"),h.appendChild(e).disabled=!0,2!==e.querySelectorAll(":disabled").length&&m.push(":enabled",":disabled"),e.querySelectorAll("*,:x"),m.push(",.*:");})),(n.matchesSelector=Z.test(v=h.matches||h.webkitMatchesSelector||h.mozMatchesSelector||h.oMatchesSelector||h.msMatchesSelector))&&se(function(e){n.disconnectedMatch=v.call(e,"*"),v.call(e,"[s!='']:x"),y.push("!=",F);}),m=m.length&&new RegExp(m.join("|")),y=y.length&&new RegExp(y.join("|")),t=Z.test(h.compareDocumentPosition),w=t||Z.test(h.contains)?function(e,t){var n=9===e.nodeType?e.documentElement:e,r=t&&t.parentNode;return e===r||!(!r||1!==r.nodeType||!(n.contains?n.contains(r):e.compareDocumentPosition&&16&e.compareDocumentPosition(r)))}:function(e,t){if(t)while(t=t.parentNode)if(t===e)return !0;return !1},T=t?function(e,t){if(e===t)return d=!0,0;var r=!e.compareDocumentPosition-!t.compareDocumentPosition;return r||(1&(r=(e.ownerDocument||e)==(t.ownerDocument||t)?e.compareDocumentPosition(t):1)||!n.sortDetached&&t.compareDocumentPosition(e)===r?e==p||e.ownerDocument==N&&w(N,e)?-1:t==p||t.ownerDocument==N&&w(N,t)?1:s?k(s,e)-k(s,t):0:4&r?-1:1)}:function(e,t){if(e===t)return d=!0,0;var n,r=0,i=e.parentNode,o=t.parentNode,u=[e],l=[t];if(!i||!o)return e==p?-1:t==p?1:i?-1:o?1:s?k(s,e)-k(s,t):0;if(i===o)return fe(e,t);n=e;while(n=n.parentNode)u.unshift(n);n=t;while(n=n.parentNode)l.unshift(n);while(u[r]===l[r])r++;return r?fe(u[r],l[r]):u[r]==N?-1:l[r]==N?1:0},p):p},le.matches=function(e,t){return le(e,null,null,t)},le.matchesSelector=function(e,t){if(f(e),n.matchesSelector&&g&&!D[t+" "]&&(!y||!y.test(t))&&(!m||!m.test(t)))try{var r=v.call(e,t);if(r||n.disconnectedMatch||e.document&&11!==e.document.nodeType)return r}catch(e){D(t,!0);}return le(t,p,null,[e]).length>0},le.contains=function(e,t){return (e.ownerDocument||e)!=p&&f(e),w(e,t)},le.attr=function(e,t){(e.ownerDocument||e)!=p&&f(e);var i=r.attrHandle[t.toLowerCase()],o=i&&L.call(r.attrHandle,t.toLowerCase())?i(e,t,!g):void 0;return void 0!==o?o:n.attributes||!g?e.getAttribute(t):(o=e.getAttributeNode(t))&&o.specified?o.value:null},le.escape=function(e){return (e+"").replace(re,ie)},le.error=function(e){throw new Error("Syntax error, unrecognized expression: "+e)},le.uniqueSort=function(e){var t,r=[],i=0,o=0;if(d=!n.detectDuplicates,s=!n.sortStable&&e.slice(0),e.sort(T),d){while(t=e[o++])t===e[o]&&(i=r.push(o));while(i--)e.splice(r[i],1);}return s=null,e},i=le.getText=function(e){var t,n="",r=0,o=e.nodeType;if(o){if(1===o||9===o||11===o){if("string"==typeof e.textContent)return e.textContent;for(e=e.firstChild;e;e=e.nextSibling)n+=i(e);}else if(3===o||4===o)return e.nodeValue}else while(t=e[r++])n+=i(t);return n},(r=le.selectors={cacheLength:50,createPseudo:ce,match:K,attrHandle:{},find:{},relative:{">":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(te,ne),e[3]=(e[3]||e[4]||e[5]||"").replace(te,ne),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||le.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&le.error(e[0]),e},PSEUDO:function(e){var t,n=!e[6]&&e[2];return K.CHILD.test(e[0])?null:(e[3]?e[2]=e[4]||e[5]||"":n&&X.test(n)&&(t=u(n,!0))&&(t=n.indexOf(")",n.length-t)-n.length)&&(e[0]=e[0].slice(0,t),e[2]=n.slice(0,t)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(te,ne).toLowerCase();return "*"===e?function(){return !0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=E[e+" "];return t||(t=new RegExp("(^|"+M+")"+e+"("+M+"|$)"))&&E(e,function(e){return t.test("string"==typeof e.className&&e.className||void 0!==e.getAttribute&&e.getAttribute("class")||"")})},ATTR:function(e,t,n){return function(r){var i=le.attr(r,e);return null==i?"!="===t:!t||(i+="","="===t?i===n:"!="===t?i!==n:"^="===t?n&&0===i.indexOf(n):"*="===t?n&&i.indexOf(n)>-1:"$="===t?n&&i.slice(-n.length)===n:"~="===t?(" "+i.replace(O," ")+" ").indexOf(n)>-1:"|="===t&&(i===n||i.slice(0,n.length+1)===n+"-"))}},CHILD:function(e,t,n,r,i){var o="nth"!==e.slice(0,3),u="last"!==e.slice(-4),l="of-type"===t;return 1===r&&0===i?function(e){return !!e.parentNode}:function(t,n,a){var c,s,d,f,p,h,g=o!==u?"nextSibling":"previousSibling",m=t.parentNode,y=l&&t.nodeName.toLowerCase(),v=!a&&!l,w=!1;if(m){if(o){while(g){f=t;while(f=f[g])if(l?f.nodeName.toLowerCase()===y:1===f.nodeType)return !1;h=g="only"===e&&!h&&"nextSibling";}return !0}if(h=[u?m.firstChild:m.lastChild],u&&v){w=(p=(c=(s=(d=(f=m)[b]||(f[b]={}))[f.uniqueID]||(d[f.uniqueID]={}))[e]||[])[0]===C&&c[1])&&c[2],f=p&&m.childNodes[p];while(f=++p&&f&&f[g]||(w=p=0)||h.pop())if(1===f.nodeType&&++w&&f===t){s[e]=[C,p,w];break}}else if(v&&(w=p=(c=(s=(d=(f=t)[b]||(f[b]={}))[f.uniqueID]||(d[f.uniqueID]={}))[e]||[])[0]===C&&c[1]),!1===w)while(f=++p&&f&&f[g]||(w=p=0)||h.pop())if((l?f.nodeName.toLowerCase()===y:1===f.nodeType)&&++w&&(v&&((s=(d=f[b]||(f[b]={}))[f.uniqueID]||(d[f.uniqueID]={}))[e]=[C,w]),f===t))break;return (w-=i)===r||w%r==0&&w/r>=0}}},PSEUDO:function(e,t){var n,i=r.pseudos[e]||r.setFilters[e.toLowerCase()]||le.error("unsupported pseudo: "+e);return i[b]?i(t):i.length>1?(n=[e,e,"",t],r.setFilters.hasOwnProperty(e.toLowerCase())?ce(function(e,n){var r,o=i(e,t),u=o.length;while(u--)e[r=k(e,o[u])]=!(n[r]=o[u]);}):function(e){return i(e,0,n)}):i}},pseudos:{not:ce(function(e){var t=[],n=[],r=l(e.replace(j,"$1"));return r[b]?ce(function(e,t,n,i){var o,u=r(e,null,i,[]),l=e.length;while(l--)(o=u[l])&&(e[l]=!(t[l]=o));}):function(e,i,o){return t[0]=e,r(t,null,o,n),t[0]=null,!n.pop()}}),has:ce(function(e){return function(t){return le(e,t).length>0}}),contains:ce(function(e){return e=e.replace(te,ne),function(t){return (t.textContent||i(t)).indexOf(e)>-1}}),lang:ce(function(e){return J.test(e||"")||le.error("unsupported lang: "+e),e=e.replace(te,ne).toLowerCase(),function(t){var n;do{if(n=g?t.lang:t.getAttribute("xml:lang")||t.getAttribute("lang"))return (n=n.toLowerCase())===e||0===n.indexOf(e+"-")}while((t=t.parentNode)&&1===t.nodeType);return !1}}),target:function(t){var n=e.location&&e.location.hash;return n&&n.slice(1)===t.id},root:function(e){return e===h},focus:function(e){return e===p.activeElement&&(!p.hasFocus||p.hasFocus())&&!!(e.type||e.href||~e.tabIndex)},enabled:pe(!1),disabled:pe(!0),checked:function(e){var t=e.nodeName.toLowerCase();return "input"===t&&!!e.checked||"option"===t&&!!e.selected},selected:function(e){return e.parentNode&&e.parentNode.selectedIndex,!0===e.selected},empty:function(e){for(e=e.firstChild;e;e=e.nextSibling)if(e.nodeType<6)return !1;return !0},parent:function(e){return !r.pseudos.empty(e)},header:function(e){return Y.test(e.nodeName)},input:function(e){return W.test(e.nodeName)},button:function(e){var t=e.nodeName.toLowerCase();return "input"===t&&"button"===e.type||"button"===t},text:function(e){var t;return "input"===e.nodeName.toLowerCase()&&"text"===e.type&&(null==(t=e.getAttribute("type"))||"text"===t.toLowerCase())},first:he(function(){return [0]}),last:he(function(e,t){return [t-1]}),eq:he(function(e,t,n){return [n<0?n+t:n]}),even:he(function(e,t){for(var n=0;n<t;n+=2)e.push(n);return e}),odd:he(function(e,t){for(var n=1;n<t;n+=2)e.push(n);return e}),lt:he(function(e,t,n){for(var r=n<0?n+t:n>t?t:n;--r>=0;)e.push(r);return e}),gt:he(function(e,t,n){for(var r=n<0?n+t:n;++r<t;)e.push(r);return e})}}).pseudos.nth=r.pseudos.eq;for(t in {radio:!0,checkbox:!0,file:!0,password:!0,image:!0})r.pseudos[t]=function(e){return function(t){return "input"===t.nodeName.toLowerCase()&&t.type===e}}(t);for(t in {submit:!0,reset:!0})r.pseudos[t]=function(e){return function(t){var n=t.nodeName.toLowerCase();return ("input"===n||"button"===n)&&t.type===e}}(t);function me(){}me.prototype=r.filters=r.pseudos,r.setFilters=new me,u=le.tokenize=function(e,t){var n,i,o,u,l,a,c,s=A[e+" "];if(s)return t?0:s.slice(0);l=e,a=[],c=r.preFilter;while(l){n&&!(i=G.exec(l))||(i&&(l=l.slice(i[0].length)||l),a.push(o=[])),n=!1,(i=U.exec(l))&&(n=i.shift(),o.push({value:n,type:i[0].replace(j," ")}),l=l.slice(n.length));for(u in r.filter)!(i=K[u].exec(l))||c[u]&&!(i=c[u](i))||(n=i.shift(),o.push({value:n,type:u,matches:i}),l=l.slice(n.length));if(!n)break}return t?l.length:l?le.error(e):A(e,a).slice(0)};function ye(e){for(var t=0,n=e.length,r="";t<n;t++)r+=e[t].value;return r}function ve(e,t,n){var r=t.dir,i=t.next,o=i||r,u=n&&"parentNode"===o,l=x++;return t.first?function(t,n,i){while(t=t[r])if(1===t.nodeType||u)return e(t,n,i);return !1}:function(t,n,a){var c,s,d,f=[C,l];if(a){while(t=t[r])if((1===t.nodeType||u)&&e(t,n,a))return !0}else while(t=t[r])if(1===t.nodeType||u)if(d=t[b]||(t[b]={}),s=d[t.uniqueID]||(d[t.uniqueID]={}),i&&i===t.nodeName.toLowerCase())t=t[r]||t;else {if((c=s[o])&&c[0]===C&&c[1]===l)return f[2]=c[2];if(s[o]=f,f[2]=e(t,n,a))return !0}return !1}}function we(e){return e.length>1?function(t,n,r){var i=e.length;while(i--)if(!e[i](t,n,r))return !1;return !0}:e[0]}function be(e,t,n){for(var r=0,i=t.length;r<i;r++)le(e,t[r],n);return n}function Ne(e,t,n,r,i){for(var o,u=[],l=0,a=e.length,c=null!=t;l<a;l++)(o=e[l])&&(n&&!n(o,r,i)||(u.push(o),c&&t.push(l)));return u}function Ce(e,t,n,r,i,o){return r&&!r[b]&&(r=Ce(r)),i&&!i[b]&&(i=Ce(i,o)),ce(function(o,u,l,a){var c,s,d,f=[],p=[],h=u.length,g=o||be(t||"*",l.nodeType?[l]:l,[]),m=!e||!o&&t?g:Ne(g,f,e,l,a),y=n?i||(o?e:h||r)?[]:u:m;if(n&&n(m,y,l,a),r){c=Ne(y,p),r(c,[],l,a),s=c.length;while(s--)(d=c[s])&&(y[p[s]]=!(m[p[s]]=d));}if(o){if(i||e){if(i){c=[],s=y.length;while(s--)(d=y[s])&&c.push(m[s]=d);i(null,y=[],c,a);}s=y.length;while(s--)(d=y[s])&&(c=i?k(o,d):f[s])>-1&&(o[c]=!(u[c]=d));}}else y=Ne(y===u?y.splice(h,y.length):y),i?i(null,u,y,a):R.apply(u,y);})}function xe(e){for(var t,n,i,o=e.length,u=r.relative[e[0].type],l=u||r.relative[" "],a=u?1:0,s=ve(function(e){return e===t},l,!0),d=ve(function(e){return k(t,e)>-1},l,!0),f=[function(e,n,r){var i=!u&&(r||n!==c)||((t=n).nodeType?s(e,n,r):d(e,n,r));return t=null,i}];a<o;a++)if(n=r.relative[e[a].type])f=[ve(we(f),n)];else {if((n=r.filter[e[a].type].apply(null,e[a].matches))[b]){for(i=++a;i<o;i++)if(r.relative[e[i].type])break;return Ce(a>1&&we(f),a>1&&ye(e.slice(0,a-1).concat({value:" "===e[a-2].type?"*":""})).replace(j,"$1"),n,a<i&&xe(e.slice(a,i)),i<o&&xe(e=e.slice(i)),i<o&&ye(e))}f.push(n);}return we(f)}function Ee(e,t){var n=t.length>0,i=e.length>0,o=function(o,u,l,a,s){var d,h,m,y=0,v="0",w=o&&[],b=[],N=c,x=o||i&&r.find.TAG("*",s),E=C+=null==N?1:Math.random()||.1,A=x.length;for(s&&(c=u==p||u||s);v!==A&&null!=(d=x[v]);v++){if(i&&d){h=0,u||d.ownerDocument==p||(f(d),l=!g);while(m=e[h++])if(m(d,u||p,l)){a.push(d);break}s&&(C=E);}n&&((d=!m&&d)&&y--,o&&w.push(d));}if(y+=v,n&&v!==y){h=0;while(m=t[h++])m(w,b,u,l);if(o){if(y>0)while(v--)w[v]||b[v]||(b[v]=I.call(a));b=Ne(b);}R.apply(a,b),s&&!o&&b.length>0&&y+t.length>1&&le.uniqueSort(a);}return s&&(C=E,c=N),w};return n?ce(o):o}l=le.compile=function(e,t){var n,r=[],i=[],o=S[e+" "];if(!o){t||(t=u(e)),n=t.length;while(n--)(o=xe(t[n]))[b]?r.push(o):i.push(o);(o=S(e,Ee(i,r))).selector=e;}return o},a=le.select=function(e,t,n,i){var o,a,c,s,d,f="function"==typeof e&&e,p=!i&&u(e=f.selector||e);if(n=n||[],1===p.length){if((a=p[0]=p[0].slice(0)).length>2&&"ID"===(c=a[0]).type&&9===t.nodeType&&g&&r.relative[a[1].type]){if(!(t=(r.find.ID(c.matches[0].replace(te,ne),t)||[])[0]))return n;f&&(t=t.parentNode),e=e.slice(a.shift().value.length);}o=K.needsContext.test(e)?0:a.length;while(o--){if(c=a[o],r.relative[s=c.type])break;if((d=r.find[s])&&(i=d(c.matches[0].replace(te,ne),ee.test(a[0].type)&&ge(t.parentNode)||t))){if(a.splice(o,1),!(e=i.length&&ye(a)))return R.apply(n,i),n;break}}}return (f||l(e,p))(i,t,!g,n,!t||ee.test(e)&&ge(t.parentNode)||t),n},n.sortStable=b.split("").sort(T).join("")===b,n.detectDuplicates=!!d,f(),n.sortDetached=se(function(e){return 1&e.compareDocumentPosition(p.createElement("fieldset"))}),se(function(e){return e.innerHTML="<a href='#'></a>","#"===e.firstChild.getAttribute("href")})||de("type|href|height|width",function(e,t,n){if(!n)return e.getAttribute(t,"type"===t.toLowerCase()?1:2)}),n.attributes&&se(function(e){return e.innerHTML="<input/>",e.firstChild.setAttribute("value",""),""===e.firstChild.getAttribute("value")})||de("value",function(e,t,n){if(!n&&"input"===e.nodeName.toLowerCase())return e.defaultValue}),se(function(e){return null==e.getAttribute("disabled")})||de(H,function(e,t,n){var r;if(!n)return !0===e[t]?t.toLowerCase():(r=e.getAttributeNode(t))&&r.specified?r.value:null});var Ae=e.Sizzle;le.noConflict=function(){return e.Sizzle===le&&(e.Sizzle=Ae),le},"function"==typeof define&&define.amd?define(function(){return le}):"undefined"!=typeof module&&module.exports?module.exports=le:e.Sizzle=le;}(window);
//# sourceMappingURL=sizzle.min.map
return module.exports;
})();
function matches(selector, elm) {
const r = Sizzle.matches(selector, [elm]);
return r.length > 0;
}
function selectOne(selector, elm) {
const r = Sizzle(selector, elm);
return r[0] || null;
}
function selectAll(selector, elm) {
return Sizzle(selector, elm);
}
class MockClassList {
constructor(elm) {
this.elm = elm;
}
add(...classNames) {
const clsNames = getItems(this.elm);
let updated = false;
classNames.forEach(className => {
className = String(className);
validateClass(className);
if (clsNames.includes(className) === false) {
clsNames.push(className);
updated = true;
}
});
if (updated) {
this.elm.setAttributeNS(null, 'class', clsNames.join(' '));
}
}
remove(...classNames) {
const clsNames = getItems(this.elm);
let updated = false;
classNames.forEach(className => {
className = String(className);
validateClass(className);
const index = clsNames.indexOf(className);
if (index > -1) {
clsNames.splice(index, 1);
updated = true;
}
});
if (updated) {
this.elm.setAttributeNS(null, 'class', clsNames.filter(c => c.length > 0).join(' '));
}
}
contains(className) {
className = String(className);
return getItems(this.elm).includes(className);
}
toggle(className) {
className = String(className);
if (this.contains(className) === true) {
this.remove(className);
}
else {
this.add(className);
}
}
get length() {
return getItems(this.elm).length;
}
item(index) {
return getItems(this.elm)[index];
}
toString() {
return getItems(this.elm).join(' ');
}
}
function validateClass(className) {
if (className === '') {
throw new Error('The token provided must not be empty.');
}
if (/\s/.test(className)) {
throw new Error(`The token provided ('${className}') contains HTML space characters, which are not valid in tokens.`);
}
}
function getItems(elm) {
const className = elm.getAttribute('class');
if (typeof className === 'string' && className.length > 0) {
return className
.trim()
.split(' ')
.filter(c => c.length > 0);
}
return [];
}
class MockCSSStyleDeclaration {
constructor() {
this._styles = new Map();
}
setProperty(prop, value) {
prop = jsCaseToCssCase(prop);
if (value == null || value === '') {
this._styles.delete(prop);
}
else {
this._styles.set(prop, String(value));
}
}
getPropertyValue(prop) {
prop = jsCaseToCssCase(prop);
return String(this._styles.get(prop) || '');
}
removeProperty(prop) {
prop = jsCaseToCssCase(prop);
this._styles.delete(prop);
}
get length() {
return this._styles.size;
}
get cssText() {
const cssText = [];
this._styles.forEach((value, prop) => {
cssText.push(`${prop}: ${value};`);
});
return cssText.join(' ').trim();
}
set cssText(cssText) {
if (cssText == null || cssText === '') {
this._styles.clear();
return;
}
cssText.split(';').forEach(rule => {
rule = rule.trim();
if (rule.length > 0) {
const splt = rule.split(':');
if (splt.length > 1) {
const prop = splt[0].trim();
const value = splt[1].trim();
if (prop !== '' && value !== '') {
this._styles.set(jsCaseToCssCase(prop), value);
}
}
}
});
}
}
function createCSSStyleDeclaration() {
return new Proxy(new MockCSSStyleDeclaration(), cssProxyHandler);
}
const cssProxyHandler = {
get(cssStyle, prop) {
if (prop in cssStyle) {
return cssStyle[prop];
}
prop = cssCaseToJsCase(prop);
return cssStyle.getPropertyValue(prop);
},
set(cssStyle, prop, value) {
if (prop in cssStyle) {
cssStyle[prop] = value;
}
else {
cssStyle.setProperty(prop, value);
}
return true;
},
};
function cssCaseToJsCase(str) {
// font-size to fontSize
if (str.length > 1 && str.includes('-') === true) {
str = str
.toLowerCase()
.split('-')
.map(segment => segment.charAt(0).toUpperCase() + segment.slice(1))
.join('');
str = str.substr(0, 1).toLowerCase() + str.substr(1);
}
return str;
}
function jsCaseToCssCase(str) {
// fontSize to font-size
if (str.length > 1 && str.includes('-') === false && /[A-Z]/.test(str) === true) {
str = str
.replace(/([A-Z])/g, g => ' ' + g[0])
.trim()
.replace(/ /g, '-')
.toLowerCase();
}
return str;
}
class MockEvent {
constructor(type, eventInitDict) {
this.bubbles = false;
this.cancelBubble = false;
this.cancelable = false;
this.composed = false;
this.currentTarget = null;
this.defaultPrevented = false;
this.srcElement = null;
this.target = null;
if (typeof type !== 'string') {
throw new Error(`Event type required`);
}
this.type = type;
this.timeStamp = Date.now();
if (eventInitDict != null) {
Object.assign(this, eventInitDict);
}
}
preventDefault() {
this.defaultPrevented = true;
}
stopPropagation() {
this.cancelBubble = true;
}
stopImmediatePropagation() {
this.cancelBubble = true;
}
}
class MockCustomEvent extends MockEvent {
constructor(type, customEventInitDic) {
super(type);
this.detail = null;
if (customEventInitDic != null) {
Object.assign(this, customEventInitDic);
}
}
}
class MockKeyboardEvent extends MockEvent {
constructor(type, keyboardEventInitDic) {
super(type);
this.code = '';
this.key = '';
this.altKey = false;
this.ctrlKey = false;
this.metaKey = false;
this.shiftKey = false;
this.location = 0;
this.repeat = false;
if (keyboardEventInitDic != null) {
Object.assign(this, keyboardEventInitDic);
}
}
}
class MockMouseEvent extends MockEvent {
constructor(type, mouseEventInitDic) {
super(type);
this.screenX = 0;
this.screenY = 0;
this.clientX = 0;
this.clientY = 0;
this.ctrlKey = false;
this.shiftKey = false;
this.altKey = false;
this.metaKey = false;
this.button = 0;
this.buttons = 0;
this.relatedTarget = null;
if (mouseEventInitDic != null) {
Object.assign(this, mouseEventInitDic);
}
}
}
class MockEventListener {
constructor(type, handler) {
this.type = type;
this.handler = handler;
}
}
function addEventListener(elm, type, handler) {
const target = elm;
if (target.__listeners == null) {
target.__listeners = [];
}
target.__listeners.push(new MockEventListener(type, handler));
}
function removeEventListener(elm, type, handler) {
const target = elm;
if (target != null && Array.isArray(target.__listeners) === true) {
const elmListener = target.__listeners.find(e => e.type === type && e.handler === handler);
if (elmListener != null) {
const index = target.__listeners.indexOf(elmListener);
target.__listeners.splice(index, 1);
}
}
}
function resetEventListeners(target) {
if (target != null && target.__listeners != null) {
target.__listeners = null;
}
}
function triggerEventListener(elm, ev) {
if (elm == null || ev.cancelBubble === true) {
return;
}
const target = elm;
ev.currentTarget = elm;
if (Array.isArray(target.__listeners) === true) {
const listeners = target.__listeners.filter(e => e.type === ev.type);
listeners.forEach(listener => {
try {
listener.handler.call(target, ev);
}
catch (err) {
console.error(err);
}
});
}
if (ev.bubbles === false) {
return;
}
if (elm.nodeName === "#document" /* DOCUMENT_NODE */) {
triggerEventListener(elm.defaultView, ev);
}
else {
triggerEventListener(elm.parentElement, ev);
}
}
function dispatchEvent(currentTarget, ev) {
ev.target = currentTarget;
triggerEventListener(currentTarget, ev);
return true;
}
function serializeNodeToHtml(elm, opts = {}) {
const output = {
currentLineWidth: 0,
indent: 0,
isWithinBody: false,
text: [],
};
if (opts.prettyHtml) {
if (typeof opts.indentSpaces !== 'number') {
opts.indentSpaces = 2;
}
if (typeof opts.newLines !== 'boolean') {
opts.newLines = true;
}
opts.approximateLineWidth = -1;
}
else {
opts.prettyHtml = false;
if (typeof opts.newLines !== 'boolean') {
opts.newLines = false;
}
if (typeof opts.indentSpaces !== 'number') {
opts.indentSpaces = 0;
}
}
if (typeof opts.approximateLineWidth !== 'number') {
opts.approximateLineWidth = -1;
}
if (typeof opts.removeEmptyAttributes !== 'boolean') {
opts.removeEmptyAttributes = true;
}
if (typeof opts.removeAttributeQuotes !== 'boolean') {
opts.removeAttributeQuotes = false;
}
if (typeof opts.removeBooleanAttributeQuotes !== 'boolean') {
opts.removeBooleanAttributeQuotes = false;
}
if (typeof opts.removeHtmlComments !== 'boolean') {
opts.removeHtmlComments = false;
}
if (typeof opts.serializeShadowRoot !== 'boolean') {
opts.serializeShadowRoot = false;
}
if (opts.outerHtml) {
serializeToHtml(elm, opts, output, false);
}
else {
for (let i = 0, ii = elm.childNodes.length; i < ii; i++) {
serializeToHtml(elm.childNodes[i], opts, output, false);
}
}
if (output.text[0] === '\n') {
output.text.shift();
}
if (output.text[output.text.length - 1] === '\n') {
output.text.pop();
}
return output.text.join('');
}
function serializeToHtml(node, opts, output, isShadowRoot) {
if (node.nodeType === 1 /* ELEMENT_NODE */ || isShadowRoot) {
const tagName = isShadowRoot ? 'mock:shadow-root' : getTagName(node);
if (tagName === 'body') {
output.isWithinBody = true;
}
const ignoreTag = opts.excludeTags != null && opts.excludeTags.includes(tagName);
if (ignoreTag === false) {
const isWithinWhitespaceSensitiveNode = opts.newLines || opts.indentSpaces > 0 ? isWithinWhitespaceSensitive(node) : false;
if (opts.newLines && !isWithinWhitespaceSensitiveNode) {
output.text.push('\n');
output.currentLineWidth = 0;
}
if (opts.indentSpaces > 0 && !isWithinWhitespaceSensitiveNode) {
for (let i = 0; i < output.indent; i++) {
output.text.push(' ');
}
output.currentLineWidth += output.indent;
}
output.text.push('<' + tagName);
output.currentLineWidth += tagName.length + 1;
const attrsLength = node.attributes.length;
const attributes = opts.prettyHtml && attrsLength > 1
? cloneAttributes(node.attributes, true)
: node.attributes;
for (let i = 0; i < attrsLength; i++) {
const attr = attributes.item(i);
const attrName = attr.name;
if (attrName === 'style') {
continue;
}
let attrValue = attr.value;
if (opts.removeEmptyAttributes && attrValue === '' && REMOVE_EMPTY_ATTR.has(attrName)) {
continue;
}
const attrNamespaceURI = attr.namespaceURI;
if (attrNamespaceURI == null) {
output.currentLineWidth += attrName.length + 1;
if (opts.approximateLineWidth > 0 && output.currentLineWidth > opts.approximateLineWidth) {
output.text.push('\n' + attrName);
output.currentLineWidth = 0;
}
else {
output.text.push(' ' + attrName);
}
}
else if (attrNamespaceURI === 'http://www.w3.org/XML/1998/namespace') {
output.text.push(' xml:' + attrName);
output.currentLineWidth += attrName.length + 5;
}
else if (attrNamespaceURI === 'http://www.w3.org/2000/xmlns/') {
if (attrName !== 'xmlns') {
output.text.push(' xmlns:' + attrName);
output.currentLineWidth += attrName.length + 7;
}
else {
output.text.push(' ' + attrName);
output.currentLineWidth += attrName.length + 1;
}
}
else if (attrNamespaceURI === XLINK_NS) {
output.text.push(' xlink:' + attrName);
output.currentLineWidth += attrName.length + 7;
}
else {
output.text.push(' ' + attrNamespaceURI + ':' + attrName);
output.currentLineWidth += attrNamespaceURI.length + attrName.length + 2;
}
if (opts.prettyHtml && attrName === 'class') {
attrValue = attr.value = attrValue
.split(' ')
.filter(t => t !== '')
.sort()
.join(' ')
.trim();
}
if (attrValue === '') {
if (opts.removeBooleanAttributeQuotes && BOOLEAN_ATTR.has(attrName)) {
continue;
}
if (opts.removeEmptyAttributes && attrName.startsWith('data-')) {
continue;
}
}
if (opts.removeAttributeQuotes && CAN_REMOVE_ATTR_QUOTES.test(attrValue)) {
output.text.push('=' + escapeString(attrValue, true));
output.currentLineWidth += attrValue.length + 1;
}
else {
output.text.push('="' + escapeString(attrValue, true) + '"');
output.currentLineWidth += attrValue.length + 3;
}
}
if (node.hasAttribute('style')) {
const cssText = node.style.cssText;
if (opts.approximateLineWidth > 0 &&
output.currentLineWidth + cssText.length + 10 > opts.approximateLineWidth) {
output.text.push(`\nstyle="${cssText}">`);
output.currentLineWidth = 0;
}
else {
output.text.push(` style="${cssText}">`);
output.currentLineWidth += cssText.length + 10;
}
}
else {
output.text.push('>');
output.currentLineWidth += 1;
}
}
if (EMPTY_ELEMENTS.has(tagName) === false) {
if (opts.serializeShadowRoot && node.shadowRoot != null) {
output.indent = output.indent + opts.indentSpaces;
serializeToHtml(node.shadowRoot, opts, output, true);
output.indent = output.indent - opts.indentSpaces;
if (opts.newLines &&
(node.childNodes.length === 0 ||
(node.childNodes.length === 1 &&
node.childNodes[0].nodeType === 3 /* TEXT_NODE */ &&
node.childNodes[0].nodeValue.trim() === ''))) {
output.text.push('\n');
output.currentLineWidth = 0;
for (let i = 0; i < output.indent; i++) {
output.text.push(' ');
}
output.currentLineWidth += output.indent;
}
}
if (opts.excludeTagContent == null || opts.excludeTagContent.includes(tagName) === false) {
const childNodes = tagName === 'template' ? node.content.childNodes : node.childNodes;
const childNodeLength = childNodes.length;
if (childNodeLength > 0) {
if (childNodeLength === 1 &&
childNodes[0].nodeType === 3 /* TEXT_NODE */ &&
(typeof childNodes[0].nodeValue !== 'string' || childNodes[0].nodeValue.trim() === '')) ;
else {
const isWithinWhitespaceSensitiveNode = opts.newLines || opts.indentSpaces > 0 ? isWithinWhitespaceSensitive(node) : false;
if (!isWithinWhitespaceSensitiveNode && opts.indentSpaces > 0 && ignoreTag === false) {
output.indent = output.indent + opts.indentSpaces;
}
for (let i = 0; i < childNodeLength; i++) {
serializeToHtml(childNodes[i], opts, output, false);
}
if (ignoreTag === false) {
if (opts.newLines && !isWithinWhitespaceSensitiveNode) {
output.text.push('\n');
output.currentLineWidth = 0;
}
if (opts.indentSpaces > 0 && !isWithinWhitespaceSensitiveNode) {
output.indent = output.indent - opts.indentSpaces;
for (let i = 0; i < output.indent; i++) {
output.text.push(' ');
}
output.currentLineWidth += output.indent;
}
}
}
}
if (ignoreTag === false) {
output.text.push('</' + tagName + '>');
output.currentLineWidth += tagName.length + 3;
}
}
}
if (opts.approximateLineWidth > 0 && STRUCTURE_ELEMENTS.has(tagName)) {
output.text.push('\n');
output.currentLineWidth = 0;
}
if (tagName === 'body') {
output.isWithinBody = false;
}
}
else if (node.nodeType === 3 /* TEXT_NODE */) {
let textContent = node.nodeValue;
if (typeof textContent === 'string') {
const trimmedTextContent = textContent.trim();
if (trimmedTextContent === '') {
// this text node is whitespace only
if (isWithinWhitespaceSensitive(node)) {
// whitespace matters within this element
// just add the exact text we were given
output.text.push(textContent);
output.currentLineWidth += textContent.length;
}
else if (opts.approximateLineWidth > 0 && !output.isWithinBody) ;
else if (!opts.prettyHtml) {
// this text node is only whitespace, and it's not
// within a whitespace sensitive element like <pre> or <code>
// so replace the entire white space with a single new line
output.currentLineWidth += 1;
if (opts.approximateLineWidth > 0 && output.currentLineWidth > opts.approximateLineWidth) {
// good enough for a new line
// for perf these are all just estimates
// we don't care to ensure exact line lengths
output.text.push('\n');
output.currentLineWidth = 0;
}
else {
// let's keep it all on the same line yet
output.text.push(' ');
}
}
}
else {
// this text node has text content
const isWithinWhitespaceSensitiveNode = opts.newLines || opts.indentSpaces > 0 || opts.prettyHtml ? isWithinWhitespaceSensitive(node) : false;
if (opts.newLines && !isWithinWhitespaceSensitiveNode) {
output.text.push('\n');
output.currentLineWidth = 0;
}
if (opts.indentSpaces > 0 && !isWithinWhitespaceSensitiveNode) {
for (let i = 0; i < output.indent; i++) {
output.text.push(' ');
}
output.currentLineWidth += output.indent;
}
let textContentLength = textContent.length;
if (textContentLength > 0) {
// this text node has text content
const parentTagName = node.parentNode != null && node.parentNode.nodeType === 1 /* ELEMENT_NODE */
? node.parentNode.nodeName
: null;
if (NON_ESCAPABLE_CONTENT.has(parentTagName)) {
// this text node cannot have its content escaped since it's going
// into an element like <style> or <script>
if (isWithinWhitespaceSensitive(node)) {
output.text.push(textContent);
}
else {
output.text.push(trimmedTextContent);
textContentLength = trimmedTextContent.length;
}
output.currentLineWidth += textContentLength;
}
else {
// this text node is going into a normal element and html can be escaped
if (opts.prettyHtml && !isWithinWhitespaceSensitiveNode) {
// pretty print the text node
output.text.push(escapeString(textContent.replace(/\s\s+/g, ' ').trim(), false));
output.currentLineWidth += textContentLength;
}
else {
// not pretty printing the text node
if (isWithinWhitespaceSensitive(node)) {
output.currentLineWidth += textContentLength;
}
else {
// this element is not a whitespace sensitive one, like <pre> or <code> so
// any whitespace at the start and end can be cleaned up to just be one space
if (/\s/.test(textContent.charAt(0))) {
textContent = ' ' + textContent.trimLeft();
}
textContentLength = textContent.length;
if (textContentLength > 1) {
if (/\s/.test(textContent.charAt(textContentLength - 1))) {
if (opts.approximateLineWidth > 0 &&
output.currentLineWidth + textContentLength > opts.approximateLineWidth) {
textContent = textContent.trimRight() + '\n';
output.currentLineWidth = 0;
}
else {
textContent = textContent.trimRight() + ' ';
}
}
}
output.currentLineWidth += textContentLength;
}
output.text.push(escapeString(textContent, false));
}
}
}
}
}
}
else if (node.nodeType === 8 /* COMMENT_NODE */) {
const nodeValue = node.nodeValue;
if (opts.removeHtmlComments) {
const isHydrateAnnotation = nodeValue.startsWith(CONTENT_REF_ID + '.') ||
nodeValue.startsWith(ORG_LOCATION_ID + '.') ||
nodeValue.startsWith(SLOT_NODE_ID + '.') ||
nodeValue.startsWith(TEXT_NODE_ID + '.');
if (!isHydrateAnnotation) {
return;
}
}
const isWithinWhitespaceSensitiveNode = opts.newLines || opts.indentSpaces > 0 ? isWithinWhitespaceSensitive(node) : false;
if (opts.newLines && !isWithinWhitespaceSensitiveNode) {
output.text.push('\n');
output.currentLineWidth = 0;
}
if (opts.indentSpaces > 0 && !isWithinWhitespaceSensitiveNode) {
for (let i = 0; i < output.indent; i++) {
output.text.push(' ');
}
output.currentLineWidth += output.indent;
}
output.text.push('<!--' + nodeValue + '-->');
output.currentLineWidth += nodeValue.length + 7;
}
else if (node.nodeType === 10 /* DOCUMENT_TYPE_NODE */) {
output.text.push('<!doctype html>');
}
}
const AMP_REGEX = /&/g;
const NBSP_REGEX = /\u00a0/g;
const DOUBLE_QUOTE_REGEX = /"/g;
const LT_REGEX = /</g;
const GT_REGEX = />/g;
const CAN_REMOVE_ATTR_QUOTES = /^[^ \t\n\f\r"'`=<>\/\\-]+$/;
function getTagName(element) {
if (element.namespaceURI === 'http://www.w3.org/1999/xhtml') {
return element.nodeName.toLowerCase();
}
else {
return element.nodeName;
}
}
function escapeString(str, attrMode) {
str = str.replace(AMP_REGEX, '&').replace(NBSP_REGEX, ' ');
if (attrMode) {
return str.replace(DOUBLE_QUOTE_REGEX, '"');
}
return str.replace(LT_REGEX, '<').replace(GT_REGEX, '>');
}
function isWithinWhitespaceSensitive(node) {
while (node != null) {
if (WHITESPACE_SENSITIVE.has(node.nodeName)) {
return true;
}
node = node.parentNode;
}
return false;
}
/*@__PURE__*/ const NON_ESCAPABLE_CONTENT = new Set([
'STYLE',
'SCRIPT',
'IFRAME',
'NOSCRIPT',
'XMP',
'NOEMBED',
'NOFRAMES',
'PLAINTEXT',
]);
/*@__PURE__*/ const WHITESPACE_SENSITIVE = new Set([
'CODE',
'OUTPUT',
'PLAINTEXT',
'PRE',
'SCRIPT',
'TEMPLATE',
'TEXTAREA',
]);
/*@__PURE__*/ const EMPTY_ELEMENTS = new Set([
'area',
'base',
'basefont',
'bgsound',
'br',
'col',
'embed',
'frame',
'hr',
'img',
'input',
'keygen',
'link',
'meta',
'param',
'source',
'trace',
'wbr',
]);
/*@__PURE__*/ const REMOVE_EMPTY_ATTR = new Set(['class', 'dir', 'id', 'lang', 'name', 'title']);
/*@__PURE__*/ const BOOLEAN_ATTR = new Set([
'allowfullscreen',
'async',
'autofocus',
'autoplay',
'checked',
'compact',
'controls',
'declare',
'default',
'defaultchecked',
'defaultmuted',
'defaultselected',
'defer',
'disabled',
'enabled',
'formnovalidate',
'hidden',
'indeterminate',
'inert',
'ismap',
'itemscope',
'loop',
'multiple',
'muted',
'nohref',
'nomodule',
'noresize',
'noshade',
'novalidate',
'nowrap',
'open',
'pauseonexit',
'readonly',
'required',
'reversed',
'scoped',
'seamless',
'selected',
'sortable',
'truespeed',
'typemustmatch',
'visible',
]);
/*@__PURE__*/ const STRUCTURE_ELEMENTS = new Set([
'html',
'body',
'head',
'iframe',
'meta',
'link',
'base',
'title',
'script',
'style',
]);
// Parse5 6.0.1
const e=function(e){const t=[65534,65535,131070,131071,196606,196607,262142,262143,327678,327679,393214,393215,458750,458751,524286,524287,589822,589823,655358,655359,720894,720895,786430,786431,851966,851967,917502,917503,983038,983039,1048574,1048575,1114110,1114111];var n="�",s={EOF:-1,NULL:0,TABULATION:9,CARRIAGE_RETURN:13,LINE_FEED:10,FORM_FEED:12,SPACE:32,EXCLAMATION_MARK:33,QUOTATION_MARK:34,NUMBER_SIGN:35,AMPERSAND:38,APOSTROPHE:39,HYPHEN_MINUS:45,SOLIDUS:47,DIGIT_0:48,DIGIT_9:57,SEMICOLON:59,LESS_THAN_SIGN:60,EQUALS_SIGN:61,GREATER_THAN_SIGN:62,QUESTION_MARK:63,LATIN_CAPITAL_A:65,LATIN_CAPITAL_F:70,LATIN_CAPITAL_X:88,LATIN_CAPITAL_Z:90,RIGHT_SQUARE_BRACKET:93,GRAVE_ACCENT:96,LATIN_SMALL_A:97,LATIN_SMALL_F:102,LATIN_SMALL_X:120,LATIN_SMALL_Z:122,REPLACEMENT_CHARACTER:65533},r=function(e){return e>=55296&&e<=57343},i=function(e){return 32!==e&&10!==e&&13!==e&&9!==e&&12!==e&&e>=1&&e<=31||e>=127&&e<=159},o=function(e){return e>=64976&&e<=65007||t.indexOf(e)>-1},a="unexpected-null-character",T="invalid-first-character-of-tag-name",E="missing-semicolon-after-character-reference",h="eof-before-tag-name",c="eof-in-tag",_="missing-whitespace-after-doctype-public-keyword",l="missing-whitespace-between-doctype-public-and-system-identifiers",m="missing-whitespace-after-doctype-system-keyword",p="missing-quote-before-doctype-public-identifier",A="missing-quote-before-doctype-system-identifier",u="missing-doctype-public-identifier",N="missing-doctype-system-identifier",d="abrupt-doctype-public-identifier",C="abrupt-doctype-system-identifier",O="eof-in-script-html-comment-like-text",f="eof-in-doctype",S="abrupt-closing-of-empty-comment",R="eof-in-comment",I="absence-of-digits-in-numeric-character-reference",L="end-tag-without-matching-open-element",k="misplaced-start-tag-for-head-element";const M=s;var g=new Uint16Array([4,52,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,97,98,99,100,101,102,103,104,105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,106,303,412,810,1432,1701,1796,1987,2114,2360,2420,2484,3170,3251,4140,4393,4575,4610,5106,5512,5728,6117,6274,6315,6345,6427,6516,7002,7910,8733,9323,9870,10170,10631,10893,11318,11386,11467,12773,13092,14474,14922,15448,15542,16419,17666,18166,18611,19004,19095,19298,19397,4,16,69,77,97,98,99,102,103,108,109,110,111,112,114,115,116,117,140,150,158,169,176,194,199,210,216,222,226,242,256,266,283,294,108,105,103,5,198,1,59,148,1,198,80,5,38,1,59,156,1,38,99,117,116,101,5,193,1,59,167,1,193,114,101,118,101,59,1,258,4,2,105,121,182,191,114,99,5,194,1,59,189,1,194,59,1,1040,114,59,3,55349,56580,114,97,118,101,5,192,1,59,208,1,192,112,104,97,59,1,913,97,99,114,59,1,256,100,59,1,10835,4,2,103,112,232,237,111,110,59,1,260,102,59,3,55349,56632,112,108,121,70,117,110,99,116,105,111,110,59,1,8289,105,110,103,5,197,1,59,264,1,197,4,2,99,115,272,277,114,59,3,55349,56476,105,103,110,59,1,8788,105,108,100,101,5,195,1,59,292,1,195,109,108,5,196,1,59,301,1,196,4,8,97,99,101,102,111,114,115,117,321,350,354,383,388,394,400,405,4,2,99,114,327,336,107,115,108,97,115,104,59,1,8726,4,2,118,119,342,345,59,1,10983,101,100,59,1,8966,121,59,1,1041,4,3,99,114,116,362,369,379,97,117,115,101,59,1,8757,110,111,117,108,108,105,115,59,1,8492,97,59,1,914,114,59,3,55349,56581,112,102,59,3,55349,56633,101,118,101,59,1,728,99,114,59,1,8492,109,112,101,113,59,1,8782,4,14,72,79,97,99,100,101,102,104,105,108,111,114,115,117,442,447,456,504,542,547,569,573,577,616,678,784,790,796,99,121,59,1,1063,80,89,5,169,1,59,454,1,169,4,3,99,112,121,464,470,497,117,116,101,59,1,262,4,2,59,105,476,478,1,8914,116,97,108,68,105,102,102,101,114,101,110,116,105,97,108,68,59,1,8517,108,101,121,115,59,1,8493,4,4,97,101,105,111,514,520,530,535,114,111,110,59,1,268,100,105,108,5,199,1,59,528,1,199,114,99,59,1,264,110,105,110,116,59,1,8752,111,116,59,1,266,4,2,100,110,553,560,105,108,108,97,59,1,184,116,101,114,68,111,116,59,1,183,114,59,1,8493,105,59,1,935,114,99,108,101,4,4,68,77,80,84,591,596,603,609,111,116,59,1,8857,105,110,117,115,59,1,8854,108,117,115,59,1,8853,105,109,101,115,59,1,8855,111,4,2,99,115,623,646,107,119,105,115,101,67,111,110,116,111,117,114,73,110,116,101,103,114,97,108,59,1,8754,101,67,117,114,108,121,4,2,68,81,658,671,111,117,98,108,101,81,117,111,116,101,59,1,8221,117,111,116,101,59,1,8217,4,4,108,110,112,117,688,701,736,753,111,110,4,2,59,101,696,698,1,8759,59,1,10868,4,3,103,105,116,709,717,722,114,117,101,110,116,59,1,8801,110,116,59,1,8751,111,117,114,73,110,116,101,103,114,97,108,59,1,8750,4,2,102,114,742,745,59,1,8450,111,100,117,99,116,59,1,8720,110,116,101,114,67,108,111,99,107,119,105,115,101,67,111,110,116,111,117,114,73,110,116,101,103,114,97,108,59,1,8755,111,115,115,59,1,10799,99,114,59,3,55349,56478,112,4,2,59,67,803,805,1,8915,97,112,59,1,8781,4,11,68,74,83,90,97,99,101,102,105,111,115,834,850,855,860,865,888,903,916,921,1011,1415,4,2,59,111,840,842,1,8517,116,114,97,104,100,59,1,10513,99,121,59,1,1026,99,121,59,1,1029,99,121,59,1,1039,4,3,103,114,115,873,879,883,103,101,114,59,1,8225,114,59,1,8609,104,118,59,1,10980,4,2,97,121,894,900,114,111,110,59,1,270,59,1,1044,108,4,2,59,116,910,912,1,8711,97,59,1,916,114,59,3,55349,56583,4,2,97,102,927,998,4,2,99,109,933,992,114,105,116,105,99,97,108,4,4,65,68,71,84,950,957,978,985,99,117,116,101,59,1,180,111,4,2,116,117,964,967,59,1,729,98,108,101,65,99,117,116,101,59,1,733,114,97,118,101,59,1,96,105,108,100,101,59,1,732,111,110,100,59,1,8900,102,101,114,101,110,116,105,97,108,68,59,1,8518,4,4,112,116,117,119,1021,1026,1048,1249,102,59,3,55349,56635,4,3,59,68,69,1034,1036,1041,1,168,111,116,59,1,8412,113,117,97,108,59,1,8784,98,108,101,4,6,67,68,76,82,85,86,1065,1082,1101,1189,1211,1236,111,110,116,111,117,114,73,110,116,101,103,114,97,108,59,1,8751,111,4,2,116,119,1089,1092,59,1,168,110,65,114,114,111,119,59,1,8659,4,2,101,111,1107,1141,102,116,4,3,65,82,84,1117,1124,1136,114,114,111,119,59,1,8656,105,103,104,116,65,114,114,111,119,59,1,8660,101,101,59,1,10980,110,103,4,2,76,82,1149,1177,101,102,116,4,2,65,82,1158,1165,114,114,111,119,59,1,10232,105,103,104,116,65,114,114,111,119,59,1,10234,105,103,104,116,65,114,114,111,119,59,1,10233,105,103,104,116,4,2,65,84,1199,1206,114,114,111,119,59,1,8658,101,101,59,1,8872,112,4,2,65,68,1218,1225,114,114,111,119,59,1,8657,111,119,110,65,114,114,111,119,59,1,8661,101,114,116,105,99,97,108,66,97,114,59,1,8741,110,4,6,65,66,76,82,84,97,1264,1292,1299,1352,1391,1408,114,114,111,119,4,3,59,66,85,1276,1278,1283,1,8595,97,114,59,1,10515,112,65,114,114,111,119,59,1,8693,114,101,118,101,59,1,785,101,102,116,4,3,82,84,86,1310,1323,1334,105,103,104,116,86,101,99,116,111,114,59,1,10576,101,101,86,101,99,116,111,114,59,1,10590,101,99,116,111,114,4,2,59,66,1345,1347,1,8637,97,114,59,1,10582,105,103,104,116,4,2,84,86,1362,1373,101,101,86,101,99,116,111,114,59,1,10591,101,99,116,111,114,4,2,59,66,1384,1386,1,8641,97,114,59,1,10583,101,101,4,2,59,65,1399,1401,1,8868,114,114,111,119,59,1,8615,114,114,111,119,59,1,8659,4,2,99,116,1421,1426,114,59,3,55349,56479,114,111,107,59,1,272,4,16,78,84,97,99,100,102,103,108,109,111,112,113,115,116,117,120,1466,1470,1478,1489,1515,1520,1525,1536,1544,1593,1609,1617,1650,1664,1668,1677,71,59,1,330,72,5,208,1,59,1476,1,208,99,117,116,101,5,201,1,59,1487,1,201,4,3,97,105,121,1497,1503,1512,114,111,110,59,1,282,114,99,5,202,1,59,1510,1,202,59,1,1069,111,116,59,1,278,114,59,3,55349,56584,114,97,118,101,5,200,1,59,1534,1,200,101,109,101,110,116,59,1,8712,4,2,97,112,1550,1555,99,114,59,1,274,116,121,4,2,83,86,1563,1576,109,97,108,108,83,113,117,97,114,101,59,1,9723,101,114,121,83,109,97,108,108,83,113,117,97,114,101,59,1,9643,4,2,103,112,1599,1604,111,110,59,1,280,102,59,3,55349,56636,115,105,108,111,110,59,1,917,117,4,2,97,105,1624,1640,108,4,2,59,84,1631,1633,1,10869,105,108,100,101,59,1,8770,108,105,98,114,105,117,109,59,1,8652,4,2,99,105,1656,1660,114,59,1,8496,109,59,1,10867,97,59,1,919,109,108,5,203,1,59,1675,1,203,4,2,105,112,1683,1689,115,116,115,59,1,8707,111,110,101,110,116,105,97,108,69,59,1,8519,4,5,99,102,105,111,115,1713,1717,1722,1762,1791,121,59,1,1060,114,59,3,55349,56585,108,108,101,100,4,2,83,86,1732,1745,109,97,108,108,83,113,117,97,114,101,59,1,9724,101,114,121,83,109,97,108,108,83,113,117,97,114,101,59,1,9642,4,3,112,114,117,1770,1775,1781,102,59,3,55349,56637,65,108,108,59,1,8704,114,105,101,114,116,114,102,59,1,8497,99,114,59,1,8497,4,12,74,84,97,98,99,100,102,103,111,114,115,116,1822,1827,1834,1848,1855,1877,1882,1887,1890,1896,1978,1984,99,121,59,1,1027,5,62,1,59,1832,1,62,109,109,97,4,2,59,100,1843,1845,1,915,59,1,988,114,101,118,101,59,1,286,4,3,101,105,121,1863,1869,1874,100,105,108,59,1,290,114,99,59,1,284,59,1,1043,111,116,59,1,288,114,59,3,55349,56586,59,1,8921,112,102,59,3,55349,56638,101,97,116,101,114,4,6,69,70,71,76,83,84,1915,1933,1944,1953,1959,1971,113,117,97,108,4,2,59,76,1925,1927,1,8805,101,115,115,59,1,8923,117,108,108,69,113,117,97,108,59,1,8807,114,101,97,116,101,114,59,1,10914,101,115,115,59,1,8823,108,97,110,116,69,113,117,97,108,59,1,10878,105,108,100,101,59,1,8819,99,114,59,3,55349,56482,59,1,8811,4,8,65,97,99,102,105,111,115,117,2005,2012,2026,2032,2036,2049,2073,2089,82,68,99,121,59,1,1066,4,2,99,116,2018,2023,101,107,59,1,711,59,1,94,105,114,99,59,1,292,114,59,1,8460,108,98,101,114,116,83,112,97,99,101,59,1,8459,4,2,112,114,2055,2059,102,59,1,8461,105,122,111,110,116,97,108,76,105,110,101,59,1,9472,4,2,99,116,2079,2083,114,59,1,8459,114,111,107,59,1,294,109,112,4,2,68,69,2097,2107,111,119,110,72,117,109,112,59,1,8782,113,117,97,108,59,1,8783,4,14,69,74,79,97,99,100,102,103,109,110,111,115,116,117,2144,2149,2155,2160,2171,2189,2194,2198,2209,2245,2307,2329,2334,2341,99,121,59,1,1045,108,105,103,59,1,306,99,121,59,1,1025,99,117,116,101,5,205,1,59,2169,1,205,4,2,105,121,2177,2186,114,99,5,206,1,59,2184,1,206,59,1,1048,111,116,59,1,304,114,59,1,8465,114,97,118,101,5,204,1,59,2207,1,204,4,3,59,97,112,2217,2219,2238,1,8465,4,2,99,103,2225,2229,114,59,1,298,105,110,97,114,121,73,59,1,8520,108,105,101,115,59,1,8658,4,2,116,118,2251,2281,4,2,59,101,2257,2259,1,8748,4,2,103,114,2265,2271,114,97,108,59,1,8747,115,101,99,116,105,111,110,59,1,8898,105,115,105,98,108,101,4,2,67,84,2293,2300,111,109,109,97,59,1,8291,105,109,101,115,59,1,8290,4,3,103,112,116,2315,2320,2325,111,110,59,1,302,102,59,3,55349,56640,97,59,1,921,99,114,59,1,8464,105,108,100,101,59,1,296,4,2,107,109,2347,2352,99,121,59,1,1030,108,5,207,1,59,2358,1,207,4,5,99,102,111,115,117,2372,2386,2391,2397,2414,4,2,105,121,2378,2383,114,99,59,1,308,59,1,1049,114,59,3,55349,56589,112,102,59,3,55349,56641,4,2,99,101,2403,2408,114,59,3,55349,56485,114,99,121,59,1,1032,107,99,121,59,1,1028,4,7,72,74,97,99,102,111,115,2436,2441,2446,2452,2467,2472,2478,99,121,59,1,1061,99,121,59,1,1036,112,112,97,59,1,922,4,2,101,121,2458,2464,100,105,108,59,1,310,59,1,1050,114,59,3,55349,56590,112,102,59,3,55349,56642,99,114,59,3,55349,56486,4,11,74,84,97,99,101,102,108,109,111,115,116,2508,2513,2520,2562,2585,2981,2986,3004,3011,3146,3167,99,121,59,1,1033,5,60,1,59,2518,1,60,4,5,99,109,110,112,114,2532,2538,2544,2548,2558,117,116,101,59,1,313,98,100,97,59,1,923,103,59,1,10218,108,97,99,101,116,114,102,59,1,8466,114,59,1,8606,4,3,97,101,121,2570,2576,2582,114,111,110,59,1,317,100,105,108,59,1,315,59,1,1051,4,2,102,115,2591,2907,116,4,10,65,67,68,70,82,84,85,86,97,114,2614,2663,2672,2728,2735,2760,2820,2870,2888,2895,4,2,110,114,2620,2633,103,108,101,66,114,97,99,107,101,116,59,1,10216,114,111,119,4,3,59,66,82,2644,2646,2651,1,8592,97,114,59,1,8676,105,103,104,116,65,114,114,111,119,59,1,8646,101,105,108,105,110,103,59,1,8968,111,4,2,117,119,2679,2692,98,108,101,66,114,97,99,107,101,116,59,1,10214,110,4,2,84,86,2699,2710,101,101,86,101,99,116,111,114,59,1,10593,101,99,116,111,114,4,2,59,66,2721,2723,1,8643,97,114,59,1,10585,108,111,111,114,59,1,8970,105,103,104,116,4,2,65,86,2745,2752,114,114,111,119,59,1,8596,101,99,116,111,114,59,1,10574,4,2,101,114,2766,2792,101,4,3,59,65,86,2775,2777,2784,1,8867,114,114,111,119,59,1,8612,101,99,116,111,114,59,1,10586,105,97,110,103,108,101,4,3,59,66,69,2806,2808,2813,1,8882,97,114,59,1,10703,113,117,97,108,59,1,8884,112,4,3,68,84,86,2829,2841,2852,111,119,110,86,101,99,116,111,114,59,1,10577,101,101,86,101,99,116,111,114,59,1,10592,101,99,116,111,114,4,2,59,66,2863,2865,1,8639,97,114,59,1,10584,101,99,116,111,114,4,2,59,66,2881,2883,1,8636,97,114,59,1,10578,114,114,111,119,59,1,8656,105,103,104,116,97,114,114,111,119,59,1,8660,115,4,6,69,70,71,76,83,84,2922,2936,2947,2956,2962,2974,113,117,97,108,71,114,101,97,116,101,114,59,1,8922,117,108,108,69,113,117,97,108,59,1,8806,114,101,97,116,101,114,59,1,8822,101,115,115,59,1,10913,108,97,110,116,69,113,117,97,108,59,1,10877,105,108,100,101,59,1,8818,114,59,3,55349,56591,4,2,59,101,2992,2994,1,8920,102,116,97,114,114,111,119,59,1,8666,105,100,111,116,59,1,319,4,3,110,112,119,3019,3110,3115,103,4,4,76,82,108,114,3030,3058,3070,3098,101,102,116,4,2,65,82,3039,3046,114,114,111,119,59,1,10229,105,103,104,116,65,114,114,111,119,59,1,10231,105,103,104,116,65,114,114,111,119,59,1,10230,101,102,116,4,2,97,114,3079,3086,114,114,111,119,59,1,10232,105,103,104,116,97,114,114,111,119,59,1,10234,105,103,104,116,97,114,114,111,119,59,1,10233,102,59,3,55349,56643,101,114,4,2,76,82,3123,3134,101,102,116,65,114,114,111,119,59,1,8601,105,103,104,116,65,114,114,111,119,59,1,8600,4,3,99,104,116,3154,3158,3161,114,59,1,8466,59,1,8624,114,111,107,59,1,321,59,1,8810,4,8,97,99,101,102,105,111,115,117,3188,3192,3196,3222,3227,3237,3243,3248,112,59,1,10501,121,59,1,1052,4,2,100,108,3202,3213,105,117,109,83,112,97,99,101,59,1,8287,108,105,110,116,114,102,59,1,8499,114,59,3,55349,56592,110,117,115,80,108,117,115,59,1,8723,112,102,59,3,55349,56644,99,114,59,1,8499,59,1,924,4,9,74,97,99,101,102,111,115,116,117,3271,3276,3283,3306,3422,3427,4120,4126,4137,99,121,59,1,1034,99,117,116,101,59,1,323,4,3,97,101,121,3291,3297,3303,114,111,110,59,1,327,100,105,108,59,1,325,59,1,1053,4,3,103,115,119,3314,3380,3415,97,116,105,118,101,4,3,77,84,86,3327,3340,3365,101,100,105,117,109,83,112,97,99,101,59,1,8203,104,105,4,2,99,110,3348,3357,107,83,112,97,99,101,59,1,8203,83,112,97,99,101,59,1,8203,101,114,121,84,104,105,110,83,112,97,99,101,59,1,8203,116,101,100,4,2,71,76,3389,3405,114,101,97,116,101,114,71,114,101,97,116,101,114,59,1,8811,101,115,115,76,101,115,115,59,1,8810,76,105,110,101,59,1,10,114,59,3,55349,56593,4,4,66,110,112,116,3437,3444,3460,3464,114,101,97,107,59,1,8288,66,114,101,97,107,105,110,103,83,112,97,99,101,59,1,160,102,59,1,8469,4,13,59,67,68,69,71,72,76,78,80,82,83,84,86,3492,3494,3517,3536,3578,3657,3685,3784,3823,3860,3915,4066,4107,1,10988,4,2,111,117,3500,3510,110,103,114,117,101,110,116,59,1,8802,112,67,97,112,59,1,8813,111,117,98,108,101,86,101,114,116,105,99,97,108,66,97,114,59,1,8742,4,3,108,113,120,3544,3552,3571,101,109,101,110,116,59,1,8713,117,97,108,4,2,59,84,3561,3563,1,8800,105,108,100,101,59,3,8770,824,105,115,116,115,59,1,8708,114,101,97,116,101,114,4,7,59,69,70,71,76,83,84,3600,3602,3609,3621,3631,3637,3650,1,8815,113,117,97,108,59,1,8817,117,108,108,69,113,117,97,108,59,3,8807,824,114,101,97,116,101,114,59,3,8811,824,101,115,115,59,1,8825,108,97,110,116,69,113,117,97,108,59,3,10878,824,105,108,100,101,59,1,8821,117,109,112,4,2,68,69,3666,3677,111,119,110,72,117,109,112,59,3,8782,824,113,117,97,108,59,3,8783,824,101,4,2,102,115,3692,3724,116,84,114,105,97,110,103,108,101,4,3,59,66,69,3709,3711,3717,1,8938,97,114,59,3,10703,824,113,117,97,108,59,1,8940,115,4,6,59,69,71,76,83,84,3739,3741,3748,3757,3764,3777,1,8814,113,117,97,108,59,1,8816,114,101,97,116,101,114,59,1,8824,101,115,115,59,3,8810,824,108,97,110,116,69,113,117,97,108,59,3,10877,824,105,108,100,101,59,1,8820,101,115,116,101,100,4,2,71,76,3795,3812,114,101,97,116,101,114,71,114,101,97,116,101,114,59,3,10914,824,101,115,115,76,101,115,115,59,3,10913,824,114,101,99,101,100,101,115,4,3,59,69,83,3838,3840,3848,1,8832,113,117,97,108,59,3,10927,824,108,97,110,116,69,113,117,97,108,59,1,8928,4,2,101,105,3866,3881,118,101,114,115,101,69,108,101,109,101,110,116,59,1,8716,103,104,116,84,114,105,97,110,103,108,101,4,3,59,66,69,3900,3902,3908,1,8939,97,114,59,3,10704,824,113,117,97,108,59,1,8941,4,2,113,117,3921,3973,117,97,114,101,83,117,4,2,98,112,3933,3952,115,101,116,4,2,59,69,3942,3945,3,8847,824,113,117,97,108,59,1,8930,101,114,115,101,116,4,2,59,69,3963,3966,3,8848,824,113,117,97,108,59,1,8931,4,3,98,99,112,3981,4e3,4045,115,101,116,4,2,59,69,3990,3993,3,8834,8402,113,117,97,108,59,1,8840,99,101,101,100,115,4,4,59,69,83,84,4015,4017,4025,4037,1,8833,113,117,97,108,59,3,10928,824,108,97,110,116,69,113,117,97,108,59,1,8929,105,108,100,101,59,3,8831,824,101,114,115,101,116,4,2,59,69,4056,4059,3,8835,8402,113,117,97,108,59,1,8841,105,108,100,101,4,4,59,69,70,84,4080,4082,4089,4100,1,8769,113,117,97,108,59,1,8772,117,108,108,69,113,117,97,108,59,1,8775,105,108,100,101,59,1,8777,101,114,116,105,99,97,108,66,97,114,59,1,8740,99,114,59,3,55349,56489,105,108,100,101,5,209,1,59,4135,1,209,59,1,925,4,14,69,97,99,100,102,103,109,111,112,114,115,116,117,118,4170,4176,4187,4205,4212,4217,4228,4253,4259,4292,4295,4316,4337,4346,108,105,103,59,1,338,99,117,116,101,5,211,1,59,4185,1,211,4,2,105,121,4193,4202,114,99,5,212,1,59,4200,1,212,59,1,1054,98,108,97,99,59,1,336,114,59,3,55349,56594,114,97,118,101,5,210,1,59,4226,1,210,4,3,97,101,105,4236,4241,4246,99,114,59,1,332,103,97,59,1,937,99,114,111,110,59,1,927,112,102,59,3,55349,56646,101,110,67,117,114,108,121,4,2,68,81,4272,4285,111,117,98,108,101,81,117,111,116,101,59,1,8220,117,111,116,101,59,1,8216,59,1,10836,4,2,99,108,4301,4306,114,59,3,55349,56490,97,115,104,5,216,1,59,4314,1,216,105,4,2,108,109,4323,4332,100,101,5,213,1,59,4330,1,213,101,115,59,1,10807,109,108,5,214,1,59,4344,1,214,101,114,4,2,66,80,4354,4380,4,2,97,114,4360,4364,114,59,1,8254,97,99,4,2,101,107,4372,4375,59,1,9182,101,116,59,1,9140,97,114,101,110,116,104,101,115,105,115,59,1,9180,4,9,97,99,102,104,105,108,111,114,115,4413,4422,4426,4431,4435,4438,4448,4471,4561,114,116,105,97,108,68,59,1,8706,121,59,1,1055,114,59,3,55349,56595,105,59,1,934,59,1,928,117,115,77,105,110,117,115,59,1,177,4,2,105,112,4454,4467,110,99,97,114,101,112,108,97,110,101,59,1,8460,102,59,1,8473,4,4,59,101,105,111,4481,4483,4526,4531,1,10939,99,101,100,101,115,4,4,59,69,83,84,4498,4500,4507,4519,1,8826,113,117,97,108,59,1,10927,108,97,110,116,69,113,117,97,108,59,1,8828,105,108,100,101,59,1,8830,109,101,59,1,8243,4,2,100,112,4537,4543,117,99,116,59,1,8719,111,114,116,105,111,110,4,2,59,97,4555,4557,1,8759,108,59,1,8733,4,2,99,105,4567,4572,114,59,3,55349,56491,59,1,936,4,4,85,102,111,115,4585,4594,4599,4604,79,84,5,34,1,59,4592,1,34,114,59,3,55349,56596,112,102,59,1,8474,99,114,59,3,55349,56492,4,12,66,69,97,99,101,102,104,105,111,114,115,117,4636,4642,4650,4681,4704,4763,4767,4771,5047,5069,5081,5094,97,114,114,59,1,10512,71,5,174,1,59,4648,1,174,4,3,99,110,114,4658,4664,4668,117,116,101,59,1,340,103,59,1,10219,114,4,2,59,116,4675,4677,1,8608,108,59,1,10518,4,3,97,101,121,4689,4695,4701,114,111,110,59,1,344,100,105,108,59,1,342,59,1,1056,4,2,59,118,4710,4712,1,8476,101,114,115,101,4,2,69,85,4722,4748,4,2,108,113,4728,4736,101,109,101,110,116,59,1,8715,117,105,108,105,98,114,105,117,109,59,1,8651,112,69,113,117,105,108,105,98,114,105,117,109,59,1,10607,114,59,1,8476,111,59,1,929,103,104,116,4,8,65,67,68,70,84,85,86,97,4792,4840,4849,4905,4912,4972,5022,5040,4,2,110,114,4798,4811,103,108,101,66,114,97,99,107,101,116,59,1,10217,114,111,119,4,3,59,66,76,4822,4824,4829,1,8594,97,114,59,1,8677,101,102,116,65,114,114,111,119,59,1,8644,101,105,108,105,110,103,59,1,8969,111,4,2,117,119,4856,4869,98,108,101,66,114,97,99,107,101,116,59,1,10215,110,4,2,84,86,4876,4887,101,101,86,101,99,116,111,114,59,1,10589,101,99,116,111,114,4,2,59,66,4898,4900,1,8642,97,114,59,1,10581,108,111,111,114,59,1,8971,4,2,101,114,4918,4944,101,4,3,59,65,86,4927,4929,4936,1,8866,114,114,111,119,59,1,8614,101,99,116,111,114,59,1,10587,105,97,110,103,108,101,4,3,59,66,69,4958,4960,4965,1,8883,97,114,59,1,10704,113,117,97,108,59,1,8885,112,4,3,68,84,86,4981,4993,5004,111,119,110,86,101,99,116,111,114,59,1,10575,101,101,86,101,99,116,111,114,59,1,10588,101,99,116,111,114,4,2,59,66,5015,5017,1,8638,97,114,59,1,10580,101,99,116,111,114,4,2,59,66,5033,5035,1,8640,97,114,59,1,10579,114,114,111,119,59,1,8658,4,2,112,117,5053,5057,102,59,1,8477,110,100,73,109,112,108,105,101,115,59,1,10608,105,103,104,116,97,114,114,111,119,59,1,8667,4,2,99,104,5087,5091,114,59,1,8475,59,1,8625,108,101,68,101,108,97,121,101,100,59,1,10740,4,13,72,79,97,99,102,104,105,109,111,113,115,116,117,5134,5150,5157,5164,5198,5203,5259,5265,5277,5283,5374,5380,5385,4,2,67,99,5140,5146,72,99,121,59,1,1065,121,59,1,1064,70,84,99,121,59,1,1068,99,117,116,101,59,1,346,4,5,59,97,101,105,121,5176,5178,5184,5190,5195,1,10940,114,111,110,59,1,352,100,105,108,59,1,350,114,99,59,1,348,59,1,1057,114,59,3,55349,56598,111,114,116,4,4,68,76,82,85,5216,5227,5238,5250,111,119,110,65,114,114,111,119,59,1,8595,101,102,116,65,114,114,111,119,59,1,8592,105,103,104,116,65,114,114,111,119,59,1,8594,112,65,114,114,111,119,59,1,8593,103,109,97,59,1,931,97,108,108,67,105,114,99,108,101,59,1,8728,112,102,59,3,55349,56650,4,2,114,117,5289,5293,116,59,1,8730,97,114,101,4,4,59,73,83,85,5306,5308,5322,5367,1,9633,110,116,101,114,115,101,99,116,105,111,110,59,1,8851,117,4,2,98,112,5329,5347,115,101,116,4,2,59,69,5338,5340,1,8847,113,117,97,108,59,1,8849,101,114,115,101,116,4,2,59,69,5358,5360,1,8848,113,117,97,108,59,1,8850,110,105,111,110,59,1,8852,99,114,59,3,55349,56494,97,114,59,1,8902,4,4,98,99,109,112,5395,5420,5475,5478,4,2,59,115,5401,5403,1,8912,101,116,4,2,59,69,5411,5413,1,8912,113,117,97,108,59,1,8838,4,2,99,104,5426,5468,101,101,100,115,4,4,59,69,83,84,5440,5442,5449,5461,1,8827,113,117,97,108,59,1,10928,108,97,110,116,69,113,117,97,108,59,1,8829,105,108,100,101,59,1,8831,84,104,97,116,59,1,8715,59,1,8721,4,3,59,101,115,5486,5488,5507,1,8913,114,115,101,116,4,2,59,69,5498,5500,1,8835,113,117,97,108,59,1,8839,101,116,59,1,8913,4,11,72,82,83,97,99,102,104,105,111,114,115,5536,5546,5552,5567,5579,5602,5607,5655,5695,5701,5711,79,82,78,5,222,1,59,5544,1,222,65,68,69,59,1,8482,4,2,72,99,5558,5563,99,121,59,1,1035,121,59,1,1062,4,2,98,117,5573,5576,59,1,9,59,1,932,4,3,97,101,121,5587,5593,5599,114,111,110,59,1,356,100,105,108,59,1,354,59,1,1058,114,59,3,55349,56599,4,2,101,105,5613,5631,4,2,114,116,5619,5627,101,102,111,114,101,59,1,8756,97,59,1,920,4,2,99,110,5637,5647,107,83,112,97,99,101,59,3,8287,8202,83,112,97,99,101,59,1,8201,108,100,101,4,4,59,69,70,84,5668,5670,5677,5688,1,8764,113,117,97,108,59,1,8771,117,108,108,69,113,117,97,108,59,1,8773,105,108,100,101,59,1,8776,112,102,59,3,55349,56651,105,112,108,101,68,111,116,59,1,8411,4,2,99,116,5717,5722,114,59,3,55349,56495,114,111,107,59,1,358,4,14,97,98,99,100,102,103,109,110,111,112,114,115,116,117,5758,5789,5805,5823,5830,5835,5846,5852,5921,5937,6089,6095,6101,6108,4,2,99,114,5764,5774,117,116,101,5,218,1,59,5772,1,218,114,4,2,59,111,5781,5783,1,8607,99,105,114,59,1,10569,114,4,2,99,101,5796,5800,121,59,1,1038,118,101,59,1,364,4,2,105,121,5811,5820,114,99,5,219,1,59,5818,1,219,59,1,1059,98,108,97,99,59,1,368,114,59,3,55349,56600,114,97,118,101,5,217,1,59,5844,1,217,97,99,114,59,1,362,4,2,100,105,5858,5905,101,114,4,2,66,80,5866,5892,4,2,97,114,5872,5876,114,59,1,95,97,99,4,2,101,107,5884,5887,59,1,9183,101,116,59,1,9141,97,114,101,110,116,104,101,115,105,115,59,1,9181,111,110,4,2,59,80,5913,5915,1,8899,108,117,115,59,1,8846,4,2,103,112,5927,5932,111,110,59,1,370,102,59,3,55349,56652,4,8,65,68,69,84,97,100,112,115,5955,5985,5996,6009,6026,6033,6044,6075,114,114,111,119,4,3,59,66,68,5967,5969,5974,1,8593,97,114,59,1,10514,111,119,110,65,114,114,111,119,59,1,8645,111,119,110,65,114,114,111,119,59,1,8597,113,117,105,108,105,98,114,105,117,109,59,1,10606,101,101,4,2,59,65,6017,6019,1,8869,114,114,111,119,59,1,8613,114,114,111,119,59,1,8657,111,119,110,97,114,114,111,119,59,1,8661,101,114,4,2,76,82,6052,6063,101,102,116,65,114,114,111,119,59,1,8598,105,103,104,116,65,114,114,111,119,59,1,8599,105,4,2,59,108,6082,6084,1,978,111,110,59,1,933,105,110,103,59,1,366,99,114,59,3,55349,56496,105,108,100,101,59,1,360,109,108,5,220,1,59,6115,1,220,4,9,68,98,99,100,101,102,111,115,118,6137,6143,6148,6152,6166,6250,6255,6261,6267,97,115,104,59,1,8875,97,114,59,1,10987,121,59,1,1042,97,115,104,4,2,59,108,6161,6163,1,8873,59,1,10982,4,2,101,114,6172,6175,59,1,8897,4,3,98,116,121,6183,6188,6238,97,114,59,1,8214,4,2,59,105,6194,6196,1,8214,99,97,108,4,4,66,76,83,84,6209,6214,6220,6231,97,114,59,1,8739,105,110,101,59,1,124,101,112,97,114,97,116,111,114,59,1,10072,105,108,100,101,59,1,8768,84,104,105,110,83,112,97,99,101,59,1,8202,114,59,3,55349,56601,112,102,59,3,55349,56653,99,114,59,3,55349,56497,100,97,115,104,59,1,8874,4,5,99,101,102,111,115,6286,6292,6298,6303,6309,105,114,99,59,1,372,100,103,101,59,1,8896,114,59,3,55349,56602,112,102,59,3,55349,56654,99,114,59,3,55349,56498,4,4,102,105,111,115,6325,6330,6333,6339,114,59,3,55349,56603,59,1,926,112,102,59,3,55349,56655,99,114,59,3,55349,56499,4,9,65,73,85,97,99,102,111,115,117,6365,6370,6375,6380,6391,6405,6410,6416,6422,99,121,59,1,1071,99,121,59,1,1031,99,121,59,1,1070,99,117,116,101,5,221,1,59,6389,1,221,4,2,105,121,6397,6402,114,99,59,1,374,59,1,1067,114,59,3,55349,56604,112,102,59,3,55349,56656,99,114,59,3,55349,56500,109,108,59,1,376,4,8,72,97,99,100,101,102,111,115,6445,6450,6457,6472,6477,6501,6505,6510,99,121,59,1,1046,99,117,116,101,59,1,377,4,2,97,121,6463,6469,114,111,110,59,1,381,59,1,1047,111,116,59,1,379,4,2,114,116,6483,6497,111,87,105,100,116,104,83,112,97,99,101,59,1,8203,97,59,1,918,114,59,1,8488,112,102,59,1,8484,99,114,59,3,55349,56501,4,16,97,98,99,101,102,103,108,109,110,111,112,114,115,116,117,119,6550,6561,6568,6612,6622,6634,6645,6672,6699,6854,6870,6923,6933,6963,6974,6983,99,117,116,101,5,225,1,59,6559,1,225,114,101,118,101,59,1,259,4,6,59,69,100,105,117,121,6582,6584,6588,6591,6600,6609,1,8766,59,3,8766,819,59,1,8767,114,99,5,226,1,59,6598,1,226,116,101,5,180,1,59,6607,1,180,59,1,1072,108,105,103,5,230,1,59,6620,1,230,4,2,59,114,6628,6630,1,8289,59,3,55349,56606,114,97,118,101,5,224,1,59,6643,1,224,4,2,101,112,6651,6667,4,2,102,112,6657,6663,115,121,109,59,1,8501,104,59,1,8501,104,97,59,1,945,4,2,97,112,6678,6692,4,2,99,108,6684,6688,114,59,1,257,103,59,1,10815,5,38,1,59,6697,1,38,4,2,100,103,6705,6737,4,5,59,97,100,115,118,6717,6719,6724,6727,6734,1,8743,110,100,59,1,10837,59,1,10844,108,111,112,101,59,1,10840,59,1,10842,4,7,59,101,108,109,114,115,122,6753,6755,6758,6762,6814,6835,6848,1,8736,59,1,10660,101,59,1,8736,115,100,4,2,59,97,6770,6772,1,8737,4,8,97,98,99,100,101,102,103,104,6790,6793,6796,6799,6802,6805,6808,6811,59,1,10664,59,1,10665,59,1,10666,59,1,10667,59,1,10668,59,1,10669,59,1,10670,59,1,10671,116,4,2,59,118,6821,6823,1,8735,98,4,2,59,100,6830,6832,1,8894,59,1,10653,4,2,112,116,6841,6845,104,59,1,8738,59,1,197,97,114,114,59,1,9084,4,2,103,112,6860,6865,111,110,59,1,261,102,59,3,55349,56658,4,7,59,69,97,101,105,111,112,6886,6888,6891,6897,6900,6904,6908,1,8776,59,1,10864,99,105,114,59,1,10863,59,1,8778,100,59,1,8779,115,59,1,39,114,111,120,4,2,59,101,6917,6919,1,8776,113,59,1,8778,105,110,103,5,229,1,59,6931,1,229,4,3,99,116,121,6941,6946,6949,114,59,3,55349,56502,59,1,42,109,112,4,2,59,101,6957,6959,1,8776,113,59,1,8781,105,108,100,101,5,227,1,59,6972,1,227,109,108,5,228,1,59,6981,1,228,4,2,99,105,6989,6997,111,110,105,110,116,59,1,8755,110,116,59,1,10769,4,16,78,97,98,99,100,101,102,105,107,108,110,111,112,114,115,117,7036,7041,7119,7135,7149,7155,7219,7224,7347,7354,7463,7489,7786,7793,7814,7866,111,116,59,1,10989,4,2,99,114,7047,7094,107,4,4,99,101,112,115,7058,7064,7073,7080,111,110,103,59,1,8780,112,115,105,108,111,110,59,1,1014,114,105,109,101,59,1,8245,105,109,4,2,59,101,7088,7090,1,8765,113,59,1,8909,4,2,118,119,7100,7105,101,101,59,1,8893,101,100,4,2,59,103,7113,7115,1,8965,101,59,1,8965,114,107,4,2,59,116,7127,7129,1,9141,98,114,107,59,1,9142,4,2,111,121,7141,7146,110,103,59,1,8780,59,1,1073,113,117,111,59,1,8222,4,5,99,109,112,114,116,7167,7181,7188,7193,7199,97,117,115,4,2,59,101,7176,7178,1,8757,59,1,8757,112,116,121,118,59,1,10672,115,105,59,1,1014,110,111,117,59,1,8492,4,3,97,104,119,7207,7210,7213,59,1,946,59,1,8502,101,101,110,59,1,8812,114,59,3,55349,56607,103,4,7,99,111,115,116,117,118,119,7241,7262,7288,7305,7328,7335,7340,4,3,97,105,117,7249,7253,7258,112,59,1,8898,114,99,59,1,9711,112,59,1,8899,4,3,100,112,116,7270,7275,7281,111,116,59,1,10752,108,117,115,59,1,10753,105,109,101,115,59,1,10754,4,2,113,116,7294,7300,99,117,112,59,1,10758,97,114,59,1,9733,114,105,97,110,103,108,101,4,2,100,117,7318,7324,111,119,110,59,1,9661,112,59,1,9651,112,108,117,115,59,1,10756,101,101,59,1,8897,101,100,103,101,59,1,8896,97,114,111,119,59,1,10509,4,3,97,107,111,7362,7436,7458,4,2,99,110,7368,7432,107,4,3,108,115,116,7377,7386,7394,111,122,101,110,103,101,59,1,10731,113,117,97,114,101,59,1,9642,114,105,97,110,103,108,101,4,4,59,100,108,114,7411,7413,7419,7425,1,9652,111,119,110,59,1,9662,101,102,116,59,1,9666,105,103,104,116,59,1,9656,107,59,1,9251,4,2,49,51,7442,7454,4,2,50,52,7448,7451,59,1,9618,59,1,9617,52,59,1,9619,99,107,59,1,9608,4,2,101,111,7469,7485,4,2,59,113,7475,7478,3,61,8421,117,105,118,59,3,8801,8421,116,59,1,8976,4,4,112,116,119,120,7499,7504,7517,7523,102,59,3,55349,56659,4,2,59,116,7510,7512,1,8869,111,109,59,1,8869,116,105,101,59,1,8904,4,12,68,72,85,86,98,100,104,109,112,116,117,118,7549,7571,7597,7619,7655,7660,7682,7708,7715,7721,7728,7750,4,4,76,82,108,114,7559,7562,7565,7568,59,1,9559,59,1,9556,59,1,9558,59,1,9555,4,5,59,68,85,100,117,7583,7585,7588,7591,7594,1,9552,59,1,9574,59,1,9577,59,1,9572,59,1,9575,4,4,76,82,108,114,7607,7610,7613,7616,59,1,9565,59,1,9562,59,1,9564,59,1,9561,4,7,59,72,76,82,104,108,114,7635,7637,7640,7643,7646,7649,7652,1,9553,59,1,9580,59,1,9571,59,1,9568,59,1,9579,59,1,9570,59,1,9567,111,120,59,1,10697,4,4,76,82,108,114,7670,7673,7676,7679,59,1,9557,59,1,9554,59,1,9488,59,1,9484,4,5,59,68,85,100,117,7694,7696,7699,7702,7705,1,9472,59,1,9573,59,1,9576,59,1,9516,59,1,9524,105,110,117,115,59,1,8863,108,117,115,59,1,8862,105,109,101,115,59,1,8864,4,4,76,82,108,114,7738,7741,7744,7747,59,1,9563,59,1,9560,59,1,9496,59,1,9492,4,7,59,72,76,82,104,108,114,7766,7768,7771,7774,7777,7780,7783,1,9474,59,1,9578,59,1,9569,59,1,9566,59,1,9532,59,1,9508,59,1,9500,114,105,109,101,59,1,8245,4,2,101,118,7799,7804,118,101,59,1,728,98,97,114,5,166,1,59,7812,1,166,4,4,99,101,105,111,7824,7829,7834,7846,114,59,3,55349,56503,109,105,59,1,8271,109,4,2,59,101,7841,7843,1,8765,59,1,8909,108,4,3,59,98,104,7855,7857,7860,1,92,59,1,10693,115,117,98,59,1,10184,4,2,108,109,7872,7885,108,4,2,59,101,7879,7881,1,8226,116,59,1,8226,112,4,3,59,69,101,7894,7896,7899,1,8782,59,1,10926,4,2,59,113,7905,7907,1,8783,59,1,8783,4,15,97,99,100,101,102,104,105,108,111,114,115,116,117,119,121,7942,8021,8075,8080,8121,8126,8157,8279,8295,8430,8446,8485,8491,8707,8726,4,3,99,112,114,7950,7956,8007,117,116,101,59,1,263,4,6,59,97,98,99,100,115,7970,7972,7977,7984,7998,8003,1,8745,110,100,59,1,10820,114,99,117,112,59,1,10825,4,2,97,117,7990,7994,112,59,1,10827,112,59,1,10823,111,116,59,1,10816,59,3,8745,65024,4,2,101,111,8013,8017,116,59,1,8257,110,59,1,711,4,4,97,101,105,117,8031,8046,8056,8061,4,2,112,114,8037,8041,115,59,1,10829,111,110,59,1,269,100,105,108,5,231,1,59,8054,1,231,114,99,59,1,265,112,115,4,2,59,115,8069,8071,1,10828,109,59,1,10832,111,116,59,1,267,4,3,100,109,110,8088,8097,8104,105,108,5,184,1,59,8095,1,184,112,116,121,118,59,1,10674,116,5,162,2,59,101,8112,8114,1,162,114,100,111,116,59,1,183,114,59,3,55349,56608,4,3,99,101,105,8134,8138,8154,121,59,1,1095,99,107,4,2,59,109,8146,8148,1,10003,97,114,107,59,1,10003,59,1,967,114,4,7,59,69,99,101,102,109,115,8174,8176,8179,8258,8261,8268,8273,1,9675,59,1,10691,4,3,59,101,108,8187,8189,8193,1,710,113,59,1,8791,101,4,2,97,100,8200,8223,114,114,111,119,4,2,108,114,8210,8216,101,102,116,59,1,8634,105,103,104,116,59,1,8635,4,5,82,83,97,99,100,8235,8238,8241,8246,8252,59,1,174,59,1,9416,115,116,59,1,8859,105,114,99,59,1,8858,97,115,104,59,1,8861,59,1,8791,110,105,110,116,59,1,10768,105,100,59,1,10991,99,105,114,59,1,10690,117,98,115,4,2,59,117,8288,8290,1,9827,105,116,59,1,9827,4,4,108,109,110,112,8305,8326,8376,8400,111,110,4,2,59,101,8313,8315,1,58,4,2,59,113,8321,8323,1,8788,59,1,8788,4,2,109,112,8332,8344,97,4,2,59,116,8339,8341,1,44,59,1,64,4,3,59,102,108,8352,8354,8358,1,8705,110,59,1,8728,101,4,2,109,120,8365,8371,101,110,116,59,1,8705,101,115,59,1,8450,4,2,103,105,8382,8395,4,2,59,100,8388,8390,1,8773,111,116,59,1,10861,110,116,59,1,8750,4,3,102,114,121,8408,8412,8417,59,3,55349,56660,111,100,59,1,8720,5,169,2,59,115,8424,8426,1,169,114,59,1,8471,4,2,97,111,8436,8441,114,114,59,1,8629,115,115,59,1,10007,4,2,99,117,8452,8457,114,59,3,55349,56504,4,2,98,112,8463,8474,4,2,59,101,8469,8471,1,10959,59,1,10961,4,2,59,101,8480,8482,1,10960,59,1,10962,100,111,116,59,1,8943,4,7,100,101,108,112,114,118,119,8507,8522,8536,8550,8600,8697,8702,97,114,114,4,2,108,114,8516,8519,59,1,10552,59,1,10549,4,2,112,115,8528,8532,114,59,1,8926,99,59,1,8927,97,114,114,4,2,59,112,8545,8547,1,8630,59,1,10557,4,6,59,98,99,100,111,115,8564,8566,8573,8587,8592,8596,1,8746,114,99,97,112,59,1,10824,4,2,97,117,8579,8583,112,59,1,10822,112,59,1,10826,111,116,59,1,8845,114,59,1,10821,59,3,8746,65024,4,4,97,108,114,118,8610,8623,8663,8672,114,114,4,2,59,109,8618,8620,1,8631,59,1,10556,121,4,3,101,118,119,8632,8651,8656,113,4,2,112,115,8639,8645,114,101,99,59,1,8926,117,99,99,59,1,8927,101,101,59,1,8910,101,100,103,101,59,1,8911,101,110,5,164,1,59,8670,1,164,101,97,114,114,111,119,4,2,108,114,8684,8690,101,102,116,59,1,8630,105,103,104,116,59,1,8631,101,101,59,1,8910,101,100,59,1,8911,4,2,99,105,8713,8721,111,110,105,110,116,59,1,8754,110,116,59,1,8753,108,99,116,121,59,1,9005,4,19,65,72,97,98,99,100,101,102,104,105,106,108,111,114,115,116,117,119,122,8773,8778,8783,8821,8839,8854,8887,8914,8930,8944,9036,9041,9058,9197,9227,9258,9281,9297,9305,114,114,59,1,8659,97,114,59,1,10597,4,4,103,108,114,115,8793,8799,8805,8809,103,101,114,59,1,8224,101,116,104,59,1,8504,114,59,1,8595,104,4,2,59,118,8816,8818,1,8208,59,1,8867,4,2,107,108,8827,8834,97,114,111,119,59,1,10511,97,99,59,1,733,4,2,97,121,8845,8851,114,111,110,59,1,271,59,1,1076,4,3,59,97,111,8862,8864,8880,1,8518,4,2,103,114,8870,8876,103,101,114,59,1,8225,114,59,1,8650,116,115,101,113,59,1,10871,4,3,103,108,109,8895,8902,8907,5,176,1,59,8900,1,176,116,97,59,1,948,112,116,121,118,59,1,10673,4,2,105,114,8920,8926,115,104,116,59,1,10623,59,3,55349,56609,97,114,4,2,108,114,8938,8941,59,1,8643,59,1,8642,4,5,97,101,103,115,118,8956,8986,8989,8996,9001,109,4,3,59,111,115,8965,8967,8983,1,8900,110,100,4,2,59,115,8975,8977,1,8900,117,105,116,59,1,9830,59,1,9830,59,1,168,97,109,109,97,59,1,989,105,110,59,1,8946,4,3,59,105,111,9009,9011,9031,1,247,100,101,5,247,2,59,111,9020,9022,1,247,110,116,105,109,101,115,59,1,8903,110,120,59,1,8903,99,121,59,1,1106,99,4,2,111,114,9048,9053,114,110,59,1,8990,111,112,59,1,8973,4,5,108,112,116,117,119,9070,9076,9081,9130,9144,108,97,114,59,1,36,102,59,3,55349,56661,4,5,59,101,109,112,115,9093,9095,9109,9116,9122,1,729,113,4,2,59,100,9102,9104,1,8784,111,116,59,1,8785,105,110,117,115,59,1,8760,108,117,115,59,1,8724,113,117,97,114,101,59,1,8865,98,108,101,98,97,114,119,101,100,103,101,59,1,8966,110,4,3,97,100,104,9153,9160,9172,114,114,111,119,59,1,8595,111,119,110,97,114,114,111,119,115,59,1,8650,97,114,112,111,111,110,4,2,108,114,9184,9190,101,102,116,59,1,8643,105,103,104,116,59,1,8642,4,2,98,99,9203,9211,107,97,114,111,119,59,1,10512,4,2,111,114,9217,9222,114,110,59,1,8991,111,112,59,1,8972,4,3,99,111,116,9235,9248,9252,4,2,114,121,9241,9245,59,3,55349,56505,59,1,1109,108,59,1,10742,114,111,107,59,1,273,4,2,100,114,9264,9269,111,116,59,1,8945,105,4,2,59,102,9276,9278,1,9663,59,1,9662,4,2,97,104,9287,9292,114,114,59,1,8693,97,114,59,1,10607,97,110,103,108,101,59,1,10662,4,2,99,105,9311,9315,121,59,1,1119,103,114,97,114,114,59,1,10239,4,18,68,97,99,100,101,102,103,108,109,110,111,112,113,114,115,116,117,120,9361,9376,9398,9439,9444,9447,9462,9495,9531,9585,9598,9614,9659,9755,9771,9792,9808,9826,4,2,68,111,9367,9372,111,116,59,1,10871,116,59,1,8785,4,2,99,115,9382,9392,117,116,101,5,233,1,59,9390,1,233,116,101,114,59,1,10862,4,4,97,105,111,121,9408,9414,9430,9436,114,111,110,59,1,283,114,4,2,59,99,9421,9423,1,8790,5,234,1,59,9428,1,234,108,111,110,59,1,8789,59,1,1101,111,116,59,1,279,59,1,8519,4,2,68,114,9453,9458,111,116,59,1,8786,59,3,55349,56610,4,3,59,114,115,9470,9472,9482,1,10906,97,118,101,5,232,1,59,9480,1,232,4,2,59,100,9488,9490,1,10902,111,116,59,1,10904,4,4,59,105,108,115,9505,9507,9515,9518,1,10905,110,116,101,114,115,59,1,9191,59,1,8467,4,2,59,100,9524,9526,1,10901,111,116,59,1,10903,4,3,97,112,115,9539,9544,9564,99,114,59,1,275,116,121,4,3,59,115,118,9554,9556,9561,1,8709,101,116,59,1,8709,59,1,8709,112,4,2,49,59,9571,9583,4,2,51,52,9577,9580,59,1,8196,59,1,8197,1,8195,4,2,103,115,9591,9594,59,1,331,112,59,1,8194,4,2,103,112,9604,9609,111,110,59,1,281,102,59,3,55349,56662,4,3,97,108,115,9622,9635,9640,114,4,2,59,115,9629,9631,1,8917,108,59,1,10723,117,115,59,1,10865,105,4,3,59,108,118,9649,9651,9656,1,949,111,110,59,1,949,59,1,1013,4,4,99,115,117,118,9669,9686,9716,9747,4,2,105,111,9675,9680,114,99,59,1,8790,108,111,110,59,1,8789,4,2,105,108,9692,9696,109,59,1,8770,97,110,116,4,2,103,108,9705,9710,116,114,59,1,10902,101,115,115,59,1,10901,4,3,97,101,105,9724,9729,9734,108,115,59,1,61,115,116,59,1,8799,118,4,2,59,68,9741,9743,1,8801,68,59,1,10872,112,97,114,115,108,59,1,10725,4,2,68,97,9761,9766,111,116,59,1,8787,114,114,59,1,10609,4,3,99,100,105,9779,9783,9788,114,59,1,8495,111,116,59,1,8784,109,59,1,8770,4,2,97,104,9798,9801,59,1,951,5,240,1,59,9806,1,240,4,2,109,114,9814,9822,108,5,235,1,59,9820,1,235,111,59,1,8364,4,3,99,105,112,9834,9838,9843,108,59,1,33,115,116,59,1,8707,4,2,101,111,9849,9859,99,116,97,116,105,111,110,59,1,8496,110,101,110,116,105,97,108,101,59,1,8519,4,12,97,99,101,102,105,106,108,110,111,112,114,115,9896,9910,9914,9921,9954,9960,9967,9989,9994,10027,10036,10164,108,108,105,110,103,100,111,116,115,101,113,59,1,8786,121,59,1,1092,109,97,108,101,59,1,9792,4,3,105,108,114,9929,9935,9950,108,105,103,59,1,64259,4,2,105,108,9941,9945,103,59,1,64256,105,103,59,1,64260,59,3,55349,56611,108,105,103,59,1,64257,108,105,103,59,3,102,106,4,3,97,108,116,9975,9979,9984,116,59,1,9837,105,103,59,1,64258,110,115,59,1,9649,111,102,59,1,402,4,2,112,114,1e4,10005,102,59,3,55349,56663,4,2,97,107,10011,10016,108,108,59,1,8704,4,2,59,118,10022,10024,1,8916,59,1,10969,97,114,116,105,110,116,59,1,10765,4,2,97,111,10042,10159,4,2,99,115,10048,10155,4,6,49,50,51,52,53,55,10062,10102,10114,10135,10139,10151,4,6,50,51,52,53,54,56,10076,10083,10086,10093,10096,10099,5,189,1,59,10081,1,189,59,1,8531,5,188,1,59,10091,1,188,59,1,8533,59,1,8537,59,1,8539,4,2,51,53,10108,10111,59,1,8532,59,1,8534,4,3,52,53,56,10122,10129,10132,5,190,1,59,10127,1,190,59,1,8535,59,1,8540,53,59,1,8536,4,2,54,56,10145,10148,59,1,8538,59,1,8541,56,59,1,8542,108,59,1,8260,119,110,59,1,8994,99,114,59,3,55349,56507,4,17,69,97,98,99,100,101,102,103,105,106,108,110,111,114,115,116,118,10206,10217,10247,10254,10268,10273,10358,10363,10374,10380,10385,10406,10458,10464,10470,10497,10610,4,2,59,108,10212,10214,1,8807,59,1,10892,4,3,99,109,112,10225,10231,10244,117,116,101,59,1,501,109,97,4,2,59,100,10239,10241,1,947,59,1,989,59,1,10886,114,101,118,101,59,1,287,4,2,105,121,10260,10265,114,99,59,1,285,59,1,1075,111,116,59,1,289,4,4,59,108,113,115,10283,10285,10288,10308,1,8805,59,1,8923,4,3,59,113,115,10296,10298,10301,1,8805,59,1,8807,108,97,110,116,59,1,10878,4,4,59,99,100,108,10318,10320,10324,10345,1,10878,99,59,1,10921,111,116,4,2,59,111,10332,10334,1,10880,4,2,59,108,10340,10342,1,10882,59,1,10884,4,2,59,101,10351,10354,3,8923,65024,115,59,1,10900,114,59,3,55349,56612,4,2,59,103,10369,10371,1,8811,59,1,8921,109,101,108,59,1,8503,99,121,59,1,1107,4,4,59,69,97,106,10395,10397,10400,10403,1,8823,59,1,10898,59,1,10917,59,1,10916,4,4,69,97,101,115,10416,10419,10434,10453,59,1,8809,112,4,2,59,112,10426,10428,1,10890,114,111,120,59,1,10890,4,2,59,113,10440,10442,1,10888,4,2,59,113,10448,10450,1,10888,59,1,8809,105,109,59,1,8935,112,102,59,3,55349,56664,97,118,101,59,1,96,4,2,99,105,10476,10480,114,59,1,8458,109,4,3,59,101,108,10489,10491,10494,1,8819,59,1,10894,59,1,10896,5,62,6,59,99,100,108,113,114,10512,10514,10527,10532,10538,10545,1,62,4,2,99,105,10520,10523,59,1,10919,114,59,1,10874,111,116,59,1,8919,80,97,114,59,1,10645,117,101,115,116,59,1,10876,4,5,97,100,101,108,115,10557,10574,10579,10599,10605,4,2,112,114,10563,10570,112,114,111,120,59,1,10886,114,59,1,10616,111,116,59,1,8919,113,4,2,108,113,10586,10592,101,115,115,59,1,8923,108,101,115,115,59,1,10892,101,115,115,59,1,8823,105,109,59,1,8819,4,2,101,110,10616,10626,114,116,110,101,113,113,59,3,8809,65024,69,59,3,8809,65024,4,10,65,97,98,99,101,102,107,111,115,121,10653,10658,10713,10718,10724,10760,10765,10786,10850,10875,114,114,59,1,8660,4,4,105,108,109,114,10668,10674,10678,10684,114,115,112,59,1,8202,102,59,1,189,105,108,116,59,1,8459,4,2,100,114,10690,10695,99,121,59,1,1098,4,3,59,99,119,10703,10705,10710,1,8596,105,114,59,1,10568,59,1,8621,97,114,59,1,8463,105,114,99,59,1,293,4,3,97,108,114,10732,10748,10754,114,116,115,4,2,59,117,10741,10743,1,9829,105,116,59,1,9829,108,105,112,59,1,8230,99,111,110,59,1,8889,114,59,3,55349,56613,115,4,2,101,119,10772,10779,97,114,111,119,59,1,10533,97,114,111,119,59,1,10534,4,5,97,109,111,112,114,10798,10803,10809,10839,10844,114,114,59,1,8703,116,104,116,59,1,8763,107,4,2,108,114,10816,10827,101,102,116,97,114,114,111,119,59,1,8617,105,103,104,116,97,114,114,111,119,59,1,8618,102,59,3,55349,56665,98,97,114,59,1,8213,4,3,99,108,116,10858,10863,10869,114,59,3,55349,56509,97,115,104,59,1,8463,114,111,107,59,1,295,4,2,98,112,10881,10887,117,108,108,59,1,8259,104,101,110,59,1,8208,4,15,97,99,101,102,103,105,106,109,110,111,112,113,115,116,117,10925,10936,10958,10977,10990,11001,11039,11045,11101,11192,11220,11226,11237,11285,11299,99,117,116,101,5,237,1,59,10934,1,237,4,3,59,105,121,10944,10946,10955,1,8291,114,99,5,238,1,59,10953,1,238,59,1,1080,4,2,99,120,10964,10968,121,59,1,1077,99,108,5,161,1,59,10975,1,161,4,2,102,114,10983,10986,59,1,8660,59,3,55349,56614,114,97,118,101,5,236,1,59,10999,1,236,4,4,59,105,110,111,11011,11013,11028,11034,1,8520,4,2,105,110,11019,11024,110,116,59,1,10764,116,59,1,8749,102,105,110,59,1,10716,116,97,59,1,8489,108,105,103,59,1,307,4,3,97,111,112,11053,11092,11096,4,3,99,103,116,11061,11065,11088,114,59,1,299,4,3,101,108,112,11073,11076,11082,59,1,8465,105,110,101,59,1,8464,97,114,116,59,1,8465,104,59,1,305,102,59,1,8887,101,100,59,1,437,4,5,59,99,102,111,116,11113,11115,11121,11136,11142,1,8712,97,114,101,59,1,8453,105,110,4,2,59,116,11129,11131,1,8734,105,101,59,1,10717,100,111,116,59,1,305,4,5,59,99,101,108,112,11154,11156,11161,11179,11186,1,8747,97,108,59,1,8890,4,2,103,114,11167,11173,101,114,115,59,1,8484,99,97,108,59,1,8890,97,114,104,107,59,1,10775,114,111,100,59,1,10812,4,4,99,103,112,116,11202,11206,11211,11216,121,59,1,1105,111,110,59,1,303,102,59,3,55349,56666,97,59,1,953,114,111,100,59,1,10812,117,101,115,116,5,191,1,59,11235,1,191,4,2,99,105,11243,11248,114,59,3,55349,56510,110,4,5,59,69,100,115,118,11261,11263,11266,11271,11282,1,8712,59,1,8953,111,116,59,1,8949,4,2,59,118,11277,11279,1,8948,59,1,8947,59,1,8712,4,2,59,105,11291,11293,1,8290,108,100,101,59,1,297,4,2,107,109,11305,11310,99,121,59,1,1110,108,5,239,1,59,11316,1,239,4,6,99,102,109,111,115,117,11332,11346,11351,11357,11363,11380,4,2,105,121,11338,11343,114,99,59,1,309,59,1,1081,114,59,3,55349,56615,97,116,104,59,1,567,112,102,59,3,55349,56667,4,2,99,101,11369,11374,114,59,3,55349,56511,114,99,121,59,1,1112,107,99,121,59,1,1108,4,8,97,99,102,103,104,106,111,115,11404,11418,11433,11438,11445,11450,11455,11461,112,112,97,4,2,59,118,11413,11415,1,954,59,1,1008,4,2,101,121,11424,11430,100,105,108,59,1,311,59,1,1082,114,59,3,55349,56616,114,101,101,110,59,1,312,99,121,59,1,1093,99,121,59,1,1116,112,102,59,3,55349,56668,99,114,59,3,55349,56512,4,23,65,66,69,72,97,98,99,100,101,102,103,104,106,108,109,110,111,112,114,115,116,117,118,11515,11538,11544,11555,11560,11721,11780,11818,11868,12136,12160,12171,12203,12208,12246,12275,12327,12509,12523,12569,12641,12732,12752,4,3,97,114,116,11523,11528,11532,114,114,59,1,8666,114,59,1,8656,97,105,108,59,1,10523,97,114,114,59,1,10510,4,2,59,103,11550,11552,1,8806,59,1,10891,97,114,59,1,10594,4,9,99,101,103,109,110,112,113,114,116,11580,11586,11594,11600,11606,11624,11627,11636,11694,117,116,101,59,1,314,109,112,116,121,118,59,1,10676,114,97,110,59,1,8466,98,100,97,59,1,955,103,4,3,59,100,108,11615,11617,11620,1,10216,59,1,10641,101,59,1,10216,59,1,10885,117,111,5,171,1,59,11634,1,171,114,4,8,59,98,102,104,108,112,115,116,11655,11657,11669,11673,11677,11681,11685,11690,1,8592,4,2,59,102,11663,11665,1,8676,115,59,1,10527,115,59,1,10525,107,59,1,8617,112,59,1,8619,108,59,1,10553,105,109,59,1,10611,108,59,1,8610,4,3,59,97,101,11702,11704,11709,1,10923,105,108,59,1,10521,4,2,59,115,11715,11717,1,10925,59,3,10925,65024,4,3,97,98,114,11729,11734,11739,114,114,59,1,10508,114,107,59,1,10098,4,2,97,107,11745,11758,99,4,2,101,107,11752,11755,59,1,123,59,1,91,4,2,101,115,11764,11767,59,1,10635,108,4,2,100,117,11774,11777,59,1,10639,59,1,10637,4,4,97,101,117,121,11790,11796,11811,11815,114,111,110,59,1,318,4,2,100,105,11802,11807,105,108,59,1,316,108,59,1,8968,98,59,1,123,59,1,1083,4,4,99,113,114,115,11828,11832,11845,11864,97,59,1,10550,117,111,4,2,59,114,11840,11842,1,8220,59,1,8222,4,2,100,117,11851,11857,104,97,114,59,1,10599,115,104,97,114,59,1,10571,104,59,1,8626,4,5,59,102,103,113,115,11880,11882,12008,12011,12031,1,8804,116,4,5,97,104,108,114,116,11895,11913,11935,11947,11996,114,114,111,119,4,2,59,116,11905,11907,1,8592,97,105,108,59,1,8610,97,114,112,111,111,110,4,2,100,117,11925,11931,111,119,110,59,1,8637,112,59,1,8636,101,102,116,97,114,114,111,119,115,59,1,8647,105,103,104,116,4,3,97,104,115,11959,11974,11984,114,114,111,119,4,2,59,115,11969,11971,1,8596,59,1,8646,97,114,112,111,111,110,115,59,1,8651,113,117,105,103,97,114,114,111,119,59,1,8621,104,114,101,101,116,105,109,101,115,59,1,8907,59,1,8922,4,3,59,113,115,12019,12021,12024,1,8804,59,1,8806,108,97,110,116,59,1,10877,4,5,59,99,100,103,115,12043,12045,12049,12070,12083,1,10877,99,59,1,10920,111,116,4,2,59,111,12057,12059,1,10879,4,2,59,114,12065,12067,1,10881,59,1,10883,4,2,59,101,12076,12079,3,8922,65024,115,59,1,10899,4,5,97,100,101,103,115,12095,12103,12108,12126,12131,112,112,114,111,120,59,1,10885,111,116,59,1,8918,113,4,2,103,113,12115,12120,116,114,59,1,8922,103,116,114,59,1,10891,116,114,59,1,8822,105,109,59,1,8818,4,3,105,108,114,12144,12150,12156,115,104,116,59,1,10620,111,111,114,59,1,8970,59,3,55349,56617,4,2,59,69,12166,12168,1,8822,59,1,10897,4,2,97,98,12177,12198,114,4,2,100,117,12184,12187,59,1,8637,4,2,59,108,12193,12195,1,8636,59,1,10602,108,107,59,1,9604,99,121,59,1,1113,4,5,59,97,99,104,116,12220,12222,12227,12235,12241,1,8810,114,114,59,1,8647,111,114,110,101,114,59,1,8990,97,114,100,59,1,10603,114,105,59,1,9722,4,2,105,111,12252,12258,100,111,116,59,1,320,117,115,116,4,2,59,97,12267,12269,1,9136,99,104,101,59,1,9136,4,4,69,97,101,115,12285,12288,12303,12322,59,1,8808,112,4,2,59,112,12295,12297,1,10889,114,111,120,59,1,10889,4,2,59,113,12309,12311,1,10887,4,2,59,113,12317,12319,1,10887,59,1,8808,105,109,59,1,8934,4,8,97,98,110,111,112,116,119,122,12345,12359,12364,12421,12446,12467,12474,12490,4,2,110,114,12351,12355,103,59,1,10220,114,59,1,8701,114,107,59,1,10214,103,4,3,108,109,114,12373,12401,12409,101,102,116,4,2,97,114,12382,12389,114,114,111,119,59,1,10229,105,103,104,116,97,114,114,111,119,59,1,10231,97,112,115,116,111,59,1,10236,105,103,104,116,97,114,114,111,119,59,1,10230,112,97,114,114,111,119,4,2,108,114,12433,12439,101,102,116,59,1,8619,105,103,104,116,59,1,8620,4,3,97,102,108,12454,12458,12462,114,59,1,10629,59,3,55349,56669,117,115,59,1,10797,105,109,101,115,59,1,10804,4,2,97,98,12480,12485,115,116,59,1,8727,97,114,59,1,95,4,3,59,101,102,12498,12500,12506,1,9674,110,103,101,59,1,9674,59,1,10731,97,114,4,2,59,108,12517,12519,1,40,116,59,1,10643,4,5,97,99,104,109,116,12535,12540,12548,12561,12564,114,114,59,1,8646,111,114,110,101,114,59,1,8991,97,114,4,2,59,100,12556,12558,1,8651,59,1,10605,59,1,8206,114,105,59,1,8895,4,6,97,99,104,105,113,116,12583,12589,12594,12597,12614,12635,113,117,111,59,1,8249,114,59,3,55349,56513,59,1,8624,109,4,3,59,101,103,12606,12608,12611,1,8818,59,1,10893,59,1,10895,4,2,98,117,12620,12623,59,1,91,111,4,2,59,114,12630,12632,1,8216,59,1,8218,114,111,107,59,1,322,5,60,8,59,99,100,104,105,108,113,114,12660,12662,12675,12680,12686,12692,12698,12705,1,60,4,2,99,105,12668,12671,59,1,10918,114,59,1,10873,111,116,59,1,8918,114,101,101,59,1,8907,109,101,115,59,1,8905,97,114,114,59,1,10614,117,101,115,116,59,1,10875,4,2,80,105,12711,12716,97,114,59,1,10646,4,3,59,101,102,12724,12726,12729,1,9667,59,1,8884,59,1,9666,114,4,2,100,117,12739,12746,115,104,97,114,59,1,10570,104,97,114,59,1,10598,4,2,101,110,12758,12768,114,116,110,101,113,113,59,3,8808,65024,69,59,3,8808,65024,4,14,68,97,99,100,101,102,104,105,108,110,111,112,115,117,12803,12809,12893,12908,12914,12928,12933,12937,13011,13025,13032,13049,13052,13069,68,111,116,59,1,8762,4,4,99,108,112,114,12819,12827,12849,12887,114,5,175,1,59,12825,1,175,4,2,101,116,12833,12836,59,1,9794,4,2,59,101,12842,12844,1,10016,115,101,59,1,10016,4,2,59,115,12855,12857,1,8614,116,111,4,4,59,100,108,117,12869,12871,12877,12883,1,8614,111,119,110,59,1,8615,101,102,116,59,1,8612,112,59,1,8613,107,101,114,59,1,9646,4,2,111,121,12899,12905,109,109,97,59,1,10793,59,1,1084,97,115,104,59,1,8212,97,115,117,114,101,100,97,110,103,108,101,59,1,8737,114,59,3,55349,56618,111,59,1,8487,4,3,99,100,110,12945,12954,12985,114,111,5,181,1,59,12952,1,181,4,4,59,97,99,100,12964,12966,12971,12976,1,8739,115,116,59,1,42,105,114,59,1,10992,111,116,5,183,1,59,12983,1,183,117,115,4,3,59,98,100,12995,12997,13e3,1,8722,59,1,8863,4,2,59,117,13006,13008,1,8760,59,1,10794,4,2,99,100,13017,13021,112,59,1,10971,114,59,1,8230,112,108,117,115,59,1,8723,4,2,100,112,13038,13044,101,108,115,59,1,8871,102,59,3,55349,56670,59,1,8723,4,2,99,116,13058,13063,114,59,3,55349,56514,112,111,115,59,1,8766,4,3,59,108,109,13077,13079,13087,1,956,116,105,109,97,112,59,1,8888,97,112,59,1,8888,4,24,71,76,82,86,97,98,99,100,101,102,103,104,105,106,108,109,111,112,114,115,116,117,118,119,13142,13165,13217,13229,13247,13330,13359,13414,13420,13508,13513,13579,13602,13626,13631,13762,13767,13855,13936,13995,14214,14285,14312,14432,4,2,103,116,13148,13152,59,3,8921,824,4,2,59,118,13158,13161,3,8811,8402,59,3,8811,824,4,3,101,108,116,13173,13200,13204,102,116,4,2,97,114,13181,13188,114,114,111,119,59,1,8653,105,103,104,116,97,114,114,111,119,59,1,8654,59,3,8920,824,4,2,59,118,13210,13213,3,8810,8402,59,3,8810,824,105,103,104,116,97,114,114,111,119,59,1,8655,4,2,68,100,13235,13241,97,115,104,59,1,8879,97,115,104,59,1,8878,4,5,98,99,110,112,116,13259,13264,13270,13275,13308,108,97,59,1,8711,117,116,101,59,1,324,103,59,3,8736,8402,4,5,59,69,105,111,112,13287,13289,13293,13298,13302,1,8777,59,3,10864,824,100,59,3,8779,824,115,59,1,329,114,111,120,59,1,8777,117,114,4,2,59,97,13316,13318,1,9838,108,4,2,59,115,13325,13327,1,9838,59,1,8469,4,2,115,117,13336,13344,112,5,160,1,59,13342,1,160,109,112,4,2,59,101,13352,13355,3,8782,824,59,3,8783,824,4,5,97,101,111,117,121,13371,13385,13391,13407,13411,4,2,112,114,13377,13380,59,1,10819,111,110,59,1,328,100,105,108,59,1,326,110,103,4,2,59,100,13399,13401,1,8775,111,116,59,3,10861,824,112,59,1,10818,59,1,1085,97,115,104,59,1,8211,4,7,59,65,97,100,113,115,120,13436,13438,13443,13466,13472,13478,13494,1,8800,114,114,59,1,8663,114,4,2,104,114,13450,13454,107,59,1,10532,4,2,59,111,13460,13462,1,8599,119,59,1,8599,111,116,59,3,8784,824,117,105,118,59,1,8802,4,2,101,105,13484,13489,97,114,59,1,10536,109,59,3,8770,824,105,115,116,4,2,59,115,13503,13505,1,8708,59,1,8708,114,59,3,55349,56619,4,4,69,101,115,116,13523,13527,13563,13568,59,3,8807,824,4,3,59,113,115,13535,13537,13559,1,8817,4,3,59,113,115,13545,13547,13551,1,8817,59,3,8807,824,108,97,110,116,59,3,10878,824,59,3,10878,824,105,109,59,1,8821,4,2,59,114,13574,13576,1,8815,59,1,8815,4,3,65,97,112,13587,13592,13597,114,114,59,1,8654,114,114,59,1,8622,97,114,59,1,10994,4,3,59,115,118,13610,13612,13623,1,8715,4,2,59,100,13618,13620,1,8956,59,1,8954,59,1,8715,99,121,59,1,1114,4,7,65,69,97,100,101,115,116,13647,13652,13656,13661,13665,13737,13742,114,114,59,1,8653,59,3,8806,824,114,114,59,1,8602,114,59,1,8229,4,4,59,102,113,115,13675,13677,13703,13725,1,8816,116,4,2,97,114,13684,13691,114,114,111,119,59,1,8602,105,103,104,116,97,114,114,111,119,59,1,8622,4,3,59,113,115,13711,13713,13717,1,8816,59,3,8806,824,108,97,110,116,59,3,10877,824,4,2,59,115,13731,13734,3,10877,824,59,1,8814,105,109,59,1,8820,4,2,59,114,13748,13750,1,8814,105,4,2,59,101,13757,13759,1,8938,59,1,8940,105,100,59,1,8740,4,2,112,116,13773,13778,102,59,3,55349,56671,5,172,3,59,105,110,13787,13789,13829,1,172,110,4,4,59,69,100,118,13800,13802,13806,13812,1,8713,59,3,8953,824,111,116,59,3,8949,824,4,3,97,98,99,13820,13823,13826,59,1,8713,59,1,8951,59,1,8950,105,4,2,59,118,13836,13838,1,8716,4,3,97,98,99,13846,13849,13852,59,1,8716,59,1,8958,59,1,8957,4,3,97,111,114,13863,13892,13899,114,4,4,59,97,115,116,13874,13876,13883,13888,1,8742,108,108,101,108,59,1,8742,108,59,3,11005,8421,59,3,8706,824,108,105,110,116,59,1,10772,4,3,59,99,101,13907,13909,13914,1,8832,117,101,59,1,8928,4,2,59,99,13920,13923,3,10927,824,4,2,59,101,13929,13931,1,8832,113,59,3,10927,824,4,4,65,97,105,116,13946,13951,13971,13982,114,114,59,1,8655,114,114,4,3,59,99,119,13961,13963,13967,1,8603,59,3,10547,824,59,3,8605,824,103,104,116,97,114,114,111,119,59,1,8603,114,105,4,2,59,101,13990,13992,1,8939,59,1,8941,4,7,99,104,105,109,112,113,117,14011,14036,14060,14080,14085,14090,14106,4,4,59,99,101,114,14021,14023,14028,14032,1,8833,117,101,59,1,8929,59,3,10928,824,59,3,55349,56515,111,114,116,4,2,109,112,14045,14050,105,100,59,1,8740,97,114,97,108,108,101,108,59,1,8742,109,4,2,59,101,14067,14069,1,8769,4,2,59,113,14075,14077,1,8772,59,1,8772,105,100,59,1,8740,97,114,59,1,8742,115,117,4,2,98,112,14098,14102,101,59,1,8930,101,59,1,8931,4,3,98,99,112,14114,14157,14171,4,4,59,69,101,115,14124,14126,14130,14133,1,8836,59,3,10949,824,59,1,8840,101,116,4,2,59,101,14141,14144,3,8834,8402,113,4,2,59,113,14151,14153,1,8840,59,3,10949,824,99,4,2,59,101,14164,14166,1,8833,113,59,3,10928,824,4,4,59,69,101,115,14181,14183,14187,14190,1,8837,59,3,10950,824,59,1,8841,101,116,4,2,59,101,14198,14201,3,8835,8402,113,4,2,59,113,14208,14210,1,8841,59,3,10950,824,4,4,103,105,108,114,14224,14228,14238,14242,108,59,1,8825,108,100,101,5,241,1,59,14236,1,241,103,59,1,8824,105,97,110,103,108,101,4,2,108,114,14254,14269,101,102,116,4,2,59,101,14263,14265,1,8938,113,59,1,8940,105,103,104,116,4,2,59,101,14279,14281,1,8939,113,59,1,8941,4,2,59,109,14291,14293,1,957,4,3,59,101,115,14301,14303,14308,1,35,114,111,59,1,8470,112,59,1,8199,4,9,68,72,97,100,103,105,108,114,115,14332,14338,14344,14349,14355,14369,14376,14408,14426,97,115,104,59,1,8877,97,114,114,59,1,10500,112,59,3,8781,8402,97,115,104,59,1,8876,4,2,101,116,14361,14365,59,3,8805,8402,59,3,62,8402,110,102,105,110,59,1,10718,4,3,65,101,116,14384,14389,14393,114,114,59,1,10498,59,3,8804,8402,4,2,59,114,14399,14402,3,60,8402,105,101,59,3,8884,8402,4,2,65,116,14414,14419,114,114,59,1,10499,114,105,101,59,3,8885,8402,105,109,59,3,8764,8402,4,3,65,97,110,14440,14445,14468,114,114,59,1,8662,114,4,2,104,114,14452,14456,107,59,1,10531,4,2,59,111,14462,14464,1,8598,119,59,1,8598,101,97,114,59,1,10535,4,18,83,97,99,100,101,102,103,104,105,108,109,111,112,114,115,116,117,118,14512,14515,14535,14560,14597,14603,14618,14643,14657,14662,14701,14741,14747,14769,14851,14877,14907,14916,59,1,9416,4,2,99,115,14521,14531,117,116,101,5,243,1,59,14529,1,243,116,59,1,8859,4,2,105,121,14541,14557,114,4,2,59,99,14548,14550,1,8858,5,244,1,59,14555,1,244,59,1,1086,4,5,97,98,105,111,115,14572,14577,14583,14587,14591,115,104,59,1,8861,108,97,99,59,1,337,118,59,1,10808,116,59,1,8857,111,108,100,59,1,10684,108,105,103,59,1,339,4,2,99,114,14609,14614,105,114,59,1,10687,59,3,55349,56620,4,3,111,114,116,14626,14630,14640,110,59,1,731,97,118,101,5,242,1,59,14638,1,242,59,1,10689,4,2,98,109,14649,14654,97,114,59,1,10677,59,1,937,110,116,59,1,8750,4,4,97,99,105,116,14672,14677,14693,14698,114,114,59,1,8634,4,2,105,114,14683,14687,114,59,1,10686,111,115,115,59,1,10683,110,101,59,1,8254,59,1,10688,4,3,97,101,105,14709,14714,14719,99,114,59,1,333,103,97,59,1,969,4,3,99,100,110,14727,14733,14736,114,111,110,59,1,959,59,1,10678,117,115,59,1,8854,112,102,59,3,55349,56672,4,3,97,101,108,14755,14759,14764,114,59,1,10679,114,112,59,1,10681,117,115,59,1,8853,4,7,59,97,100,105,111,115,118,14785,14787,14792,14831,14837,14841,14848,1,8744,114,114,59,1,8635,4,4,59,101,102,109,14802,14804,14817,14824,1,10845,114,4,2,59,111,14811,14813,1,8500,102,59,1,8500,5,170,1,59,14822,1,170,5,186,1,59,14829,1,186,103,111,102,59,1,8886,114,59,1,10838,108,111,112,101,59,1,10839,59,1,10843,4,3,99,108,111,14859,14863,14873,114,59,1,8500,97,115,104,5,248,1,59,14871,1,248,108,59,1,8856,105,4,2,108,109,14884,14893,100,101,5,245,1,59,14891,1,245,101,115,4,2,59,97,14901,14903,1,8855,115,59,1,10806,109,108,5,246,1,59,14914,1,246,98,97,114,59,1,9021,4,12,97,99,101,102,104,105,108,109,111,114,115,117,14948,14992,14996,15033,15038,15068,15090,15189,15192,15222,15427,15441,114,4,4,59,97,115,116,14959,14961,14976,14989,1,8741,5,182,2,59,108,14968,14970,1,182,108,101,108,59,1,8741,4,2,105,108,14982,14986,109,59,1,10995,59,1,11005,59,1,8706,121,59,1,1087,114,4,5,99,105,109,112,116,15009,15014,15019,15024,15027,110,116,59,1,37,111,100,59,1,46,105,108,59,1,8240,59,1,8869,101,110,107,59,1,8241,114,59,3,55349,56621,4,3,105,109,111,15046,15057,15063,4,2,59,118,15052,15054,1,966,59,1,981,109,97,116,59,1,8499,110,101,59,1,9742,4,3,59,116,118,15076,15078,15087,1,960,99,104,102,111,114,107,59,1,8916,59,1,982,4,2,97,117,15096,15119,110,4,2,99,107,15103,15115,107,4,2,59,104,15110,15112,1,8463,59,1,8462,118,59,1,8463,115,4,9,59,97,98,99,100,101,109,115,116,15140,15142,15148,15151,15156,15168,15171,15179,15184,1,43,99,105,114,59,1,10787,59,1,8862,105,114,59,1,10786,4,2,111,117,15162,15165,59,1,8724,59,1,10789,59,1,10866,110,5,177,1,59,15177,1,177,105,109,59,1,10790,119,111,59,1,10791,59,1,177,4,3,105,112,117,15200,15208,15213,110,116,105,110,116,59,1,10773,102,59,3,55349,56673,110,100,5,163,1,59,15220,1,163,4,10,59,69,97,99,101,105,110,111,115,117,15244,15246,15249,15253,15258,15334,15347,15367,15416,15421,1,8826,59,1,10931,112,59,1,10935,117,101,59,1,8828,4,2,59,99,15264,15266,1,10927,4,6,59,97,99,101,110,115,15280,15282,15290,15299,15303,15329,1,8826,112,112,114,111,120,59,1,10935,117,114,108,121,101,113,59,1,8828,113,59,1,10927,4,3,97,101,115,15311,15319,15324,112,112,114,111,120,59,1,10937,113,113,59,1,10933,105,109,59,1,8936,105,109,59,1,8830,109,101,4,2,59,115,15342,15344,1,8242,59,1,8473,4,3,69,97,115,15355,15358,15362,59,1,10933,112,59,1,10937,105,109,59,1,8936,4,3,100,102,112,15375,15378,15404,59,1,8719,4,3,97,108,115,15386,15392,15398,108,97,114,59,1,9006,105,110,101,59,1,8978,117,114,102,59,1,8979,4,2,59,116,15410,15412,1,8733,111,59,1,8733,105,109,59,1,8830,114,101,108,59,1,8880,4,2,99,105,15433,15438,114,59,3,55349,56517,59,1,968,110,99,115,112,59,1,8200,4,6,102,105,111,112,115,117,15462,15467,15472,15478,15485,15491,114,59,3,55349,56622,110,116,59,1,10764,112,102,59,3,55349,56674,114,105,109,101,59,1,8279,99,114,59,3,55349,56518,4,3,97,101,111,15499,15520,15534,116,4,2,101,105,15506,15515,114,110,105,111,110,115,59,1,8461,110,116,59,1,10774,115,116,4,2,59,101,15528,15530,1,63,113,59,1,8799,116,5,34,1,59,15540,1,34,4,21,65,66,72,97,98,99,100,101,102,104,105,108,109,110,111,112,114,115,116,117,120,15586,15609,15615,15620,15796,15855,15893,15931,15977,16001,16039,16183,16204,16222,16228,16285,16312,16318,16363,16408,16416,4,3,97,114,116,15594,15599,15603,114,114,59,1,8667,114,59,1,8658,97,105,108,59,1,10524,97,114,114,59,1,10511,97,114,59,1,10596,4,7,99,100,101,110,113,114,116,15636,15651,15656,15664,15687,15696,15770,4,2,101,117,15642,15646,59,3,8765,817,116,101,59,1,341,105,99,59,1,8730,109,112,116,121,118,59,1,10675,103,4,4,59,100,101,108,15675,15677,15680,15683,1,10217,59,1,10642,59,1,10661,101,59,1,10217,117,111,5,187,1,59,15694,1,187,114,4,11,59,97,98,99,102,104,108,112,115,116,119,15721,15723,15727,15739,15742,15746,15750,15754,15758,15763,15767,1,8594,112,59,1,10613,4,2,59,102,15733,15735,1,8677,115,59,1,10528,59,1,10547,115,59,1,10526,107,59,1,8618,112,59,1,8620,108,59,1,10565,105,109,59,1,10612,108,59,1,8611,59,1,8605,4,2,97,105,15776,15781,105,108,59,1,10522,111,4,2,59,110,15788,15790,1,8758,97,108,115,59,1,8474,4,3,97,98,114,15804,15809,15814,114,114,59,1,10509,114,107,59,1,10099,4,2,97,107,15820,15833,99,4,2,101,107,15827,15830,59,1,125,59,1,93,4,2,101,115,15839,15842,59,1,10636,108,4,2,100,117,15849,15852,59,1,10638,59,1,10640,4,4,97,101,117,121,15865,15871,15886,15890,114,111,110,59,1,345,4,2,100,105,15877,15882,105,108,59,1,343,108,59,1,8969,98,59,1,125,59,1,1088,4,4,99,108,113,115,15903,15907,15914,15927,97,59,1,10551,100,104,97,114,59,1,10601,117,111,4,2,59,114,15922,15924,1,8221,59,1,8221,104,59,1,8627,4,3,97,99,103,15939,15966,15970,108,4,4,59,105,112,115,15950,15952,15957,15963,1,8476,110,101,59,1,8475,97,114,116,59,1,8476,59,1,8477,116,59,1,9645,5,174,1,59,15975,1,174,4,3,105,108,114,15985,15991,15997,115,104,116,59,1,10621,111,111,114,59,1,8971,59,3,55349,56623,4,2,97,111,16007,16028,114,4,2,100,117,16014,16017,59,1,8641,4,2,59,108,16023,16025,1,8640,59,1,10604,4,2,59,118,16034,16036,1,961,59,1,1009,4,3,103,110,115,16047,16167,16171,104,116,4,6,97,104,108,114,115,116,16063,16081,16103,16130,16143,16155,114,114,111,119,4,2,59,116,16073,16075,1,8594,97,105,108,59,1,8611,97,114,112,111,111,110,4,2,100,117,16093,16099,111,119,110,59,1,8641,112,59,1,8640,101,102,116,4,2,97,104,16112,16120,114,114,111,119,115,59,1,8644,97,114,112,111,111,110,115,59,1,8652,105,103,104,116,97,114,114,111,119,115,59,1,8649,113,117,105,103,97,114,114,111,119,59,1,8605,104,114,101,101,116,105,109,101,115,59,1,8908,103,59,1,730,105,110,103,100,111,116,115,101,113,59,1,8787,4,3,97,104,109,16191,16196,16201,114,114,59,1,8644,97,114,59,1,8652,59,1,8207,111,117,115,116,4,2,59,97,16214,16216,1,9137,99,104,101,59,1,9137,109,105,100,59,1,10990,4,4,97,98,112,116,16238,16252,16257,16278,4,2,110,114,16244,16248,103,59,1,10221,114,59,1,8702,114,107,59,1,10215,4,3,97,102,108,16265,16269,16273,114,59,1,10630,59,3,55349,56675,117,115,59,1,10798,105,109,101,115,59,1,10805,4,2,97,112,16291,16304,114,4,2,59,103,16298,16300,1,41,116,59,1,10644,111,108,105,110,116,59,1,10770,97,114,114,59,1,8649,4,4,97,99,104,113,16328,16334,16339,16342,113,117,111,59,1,8250,114,59,3,55349,56519,59,1,8625,4,2,98,117,16348,16351,59,1,93,111,4,2,59,114,16358,16360,1,8217,59,1,8217,4,3,104,105,114,16371,16377,16383,114,101,101,59,1,8908,109,101,115,59,1,8906,105,4,4,59,101,102,108,16394,16396,16399,16402,1,9657,59,1,8885,59,1,9656,116,114,105,59,1,10702,108,117,104,97,114,59,1,10600,59,1,8478,4,19,97,98,99,100,101,102,104,105,108,109,111,112,113,114,115,116,117,119,122,16459,16466,16472,16572,16590,16672,16687,16746,16844,16850,16924,16963,16988,17115,17121,17154,17206,17614,17656,99,117,116,101,59,1,347,113,117,111,59,1,8218,4,10,59,69,97,99,101,105,110,112,115,121,16494,16496,16499,16513,16518,16531,16536,16556,16564,16569,1,8827,59,1,10932,4,2,112,114,16505,16508,59,1,10936,111,110,59,1,353,117,101,59,1,8829,4,2,59,100,16524,16526,1,10928,105,108,59,1,351,114,99,59,1,349,4,3,69,97,115,16544,16547,16551,59,1,10934,112,59,1,10938,105,109,59,1,8937,111,108,105,110,116,59,1,10771,105,109,59,1,8831,59,1,1089,111,116,4,3,59,98,101,16582,16584,16587,1,8901,59,1,8865,59,1,10854,4,7,65,97,99,109,115,116,120,16606,16611,16634,16642,16646,16652,16668,114,114,59,1,8664,114,4,2,104,114,16618,16622,107,59,1,10533,4,2,59,111,16628,16630,1,8600,119,59,1,8600,116,5,167,1,59,16640,1,167,105,59,1,59,119,97,114,59,1,10537,109,4,2,105,110,16659,16665,110,117,115,59,1,8726,59,1,8726,116,59,1,10038,114,4,2,59,111,16679,16682,3,55349,56624,119,110,59,1,8994,4,4,97,99,111,121,16697,16702,16716,16739,114,112,59,1,9839,4,2,104,121,16708,16713,99,121,59,1,1097,59,1,1096,114,116,4,2,109,112,16724,16729,105,100,59,1,8739,97,114,97,108,108,101,108,59,1,8741,5,173,1,59,16744,1,173,4,2,103,109,16752,16770,109,97,4,3,59,102,118,16762,16764,16767,1,963,59,1,962,59,1,962,4,8,59,100,101,103,108,110,112,114,16788,16790,16795,16806,16817,16828,16832,16838,1,8764,111,116,59,1,10858,4,2,59,113,16801,16803,1,8771,59,1,8771,4,2,59,69,16812,16814,1,10910,59,1,10912,4,2,59,69,16823,16825,1,10909,59,1,10911,101,59,1,8774,108,117,115,59,1,10788,97,114,114,59,1,10610,97,114,114,59,1,8592,4,4,97,101,105,116,16860,16883,16891,16904,4,2,108,115,16866,16878,108,115,101,116,109,105,110,117,115,59,1,8726,104,112,59,1,10803,112,97,114,115,108,59,1,10724,4,2,100,108,16897,16900,59,1,8739,101,59,1,8995,4,2,59,101,16910,16912,1,10922,4,2,59,115,16918,16920,1,10924,59,3,10924,65024,4,3,102,108,112,16932,16938,16958,116,99,121,59,1,1100,4,2,59,98,16944,16946,1,47,4,2,59,97,16952,16954,1,10692,114,59,1,9023,102,59,3,55349,56676,97,4,2,100,114,16970,16985,101,115,4,2,59,117,16978,16980,1,9824,105,116,59,1,9824,59,1,8741,4,3,99,115,117,16996,17028,17089,4,2,97,117,17002,17015,112,4,2,59,115,17009,17011,1,8851,59,3,8851,65024,112,4,2,59,115,17022,17024,1,8852,59,3,8852,65024,117,4,2,98,112,17035,17062,4,3,59,101,115,17043,17045,17048,1,8847,59,1,8849,101,116,4,2,59,101,17056,17058,1,8847,113,59,1,8849,4,3,59,101,115,17070,17072,17075,1,8848,59,1,8850,101,116,4,2,59,101,17083,17085,1,8848,113,59,1,8850,4,3,59,97,102,17097,17099,17112,1,9633,114,4,2,101,102,17106,17109,59,1,9633,59,1,9642,59,1,9642,97,114,114,59,1,8594,4,4,99,101,109,116,17131,17136,17142,17148,114,59,3,55349,56520,116,109,110,59,1,8726,105,108,101,59,1,8995,97,114,102,59,1,8902,4,2,97,114,17160,17172,114,4,2,59,102,17167,17169,1,9734,59,1,9733,4,2,97,110,17178,17202,105,103,104,116,4,2,101,112,17188,17197,112,115,105,108,111,110,59,1,1013,104,105,59,1,981,115,59,1,175,4,5,98,99,109,110,112,17218,17351,17420,17423,17427,4,9,59,69,100,101,109,110,112,114,115,17238,17240,17243,17248,17261,17267,17279,17285,17291,1,8834,59,1,10949,111,116,59,1,10941,4,2,59,100,17254,17256,1,8838,111,116,59,1,10947,117,108,116,59,1,10945,4,2,69,101,17273,17276,59,1,10955,59,1,8842,108,117,115,59,1,10943,97,114,114,59,1,10617,4,3,101,105,117,17299,17335,17339,116,4,3,59,101,110,17308,17310,17322,1,8834,113,4,2,59,113,17317,17319,1,8838,59,1,10949,101,113,4,2,59,113,17330,17332,1,8842,59,1,10955,109,59,1,10951,4,2,98,112,17345,17348,59,1,10965,59,1,10963,99,4,6,59,97,99,101,110,115,17366,17368,17376,17385,17389,17415,1,8827,112,112,114,111,120,59,1,10936,117,114,108,121,101,113,59,1,8829,113,59,1,10928,4,3,97,101,115,17397,17405,17410,112,112,114,111,120,59,1,10938,113,113,59,1,10934,105,109,59,1,8937,105,109,59,1,8831,59,1,8721,103,59,1,9834,4,13,49,50,51,59,69,100,101,104,108,109,110,112,115,17455,17462,17469,17476,17478,17481,17496,17509,17524,17530,17536,17548,17554,5,185,1,59,17460,1,185,5,178,1,59,17467,1,178,5,179,1,59,17474,1,179,1,8835,59,1,10950,4,2,111,115,17487,17491,116,59,1,10942,117,98,59,1,10968,4,2,59,100,17502,17504,1,8839,111,116,59,1,10948,115,4,2,111,117,17516,17520,108,59,1,10185,98,59,1,10967,97,114,114,59,1,10619,117,108,116,59,1,10946,4,2,69,101,17542,17545,59,1,10956,59,1,8843,108,117,115,59,1,10944,4,3,101,105,117,17562,17598,17602,116,4,3,59,101,110,17571,17573,17585,1,8835,113,4,2,59,113,17580,17582,1,8839,59,1,10950,101,113,4,2,59,113,17593,17595,1,8843,59,1,10956,109,59,1,10952,4,2,98,112,17608,17611,59,1,10964,59,1,10966,4,3,65,97,110,17622,17627,17650,114,114,59,1,8665,114,4,2,104,114,17634,17638,107,59,1,10534,4,2,59,111,17644,17646,1,8601,119,59,1,8601,119,97,114,59,1,10538,108,105,103,5,223,1,59,17664,1,223,4,13,97,98,99,100,101,102,104,105,111,112,114,115,119,17694,17709,17714,17737,17742,17749,17754,17860,17905,17957,17964,18090,18122,4,2,114,117,17700,17706,103,101,116,59,1,8982,59,1,964,114,107,59,1,9140,4,3,97,101,121,17722,17728,17734,114,111,110,59,1,357,100,105,108,59,1,355,59,1,1090,111,116,59,1,8411,108,114,101,99,59,1,8981,114,59,3,55349,56625,4,4,101,105,107,111,17764,17805,17836,17851,4,2,114,116,17770,17786,101,4,2,52,102,17777,17780,59,1,8756,111,114,101,59,1,8756,97,4,3,59,115,118,17795,17797,17802,1,952,121,109,59,1,977,59,1,977,4,2,99,110,17811,17831,107,4,2,97,115,17818,17826,112,112,114,111,120,59,1,8776,105,109,59,1,8764,115,112,59,1,8201,4,2,97,115,17842,17846,112,59,1,8776,105,109,59,1,8764,114,110,5,254,1,59,17858,1,254,4,3,108,109,110,17868,17873,17901,100,101,59,1,732,101,115,5,215,3,59,98,100,17884,17886,17898,1,215,4,2,59,97,17892,17894,1,8864,114,59,1,10801,59,1,10800,116,59,1,8749,4,3,101,112,115,17913,17917,17953,97,59,1,10536,4,4,59,98,99,102,17927,17929,17934,17939,1,8868,111,116,59,1,9014,105,114,59,1,10993,4,2,59,111,17945,17948,3,55349,56677,114,107,59,1,10970,97,59,1,10537,114,105,109,101,59,1,8244,4,3,97,105,112,17972,17977,18082,100,101,59,1,8482,4,7,97,100,101,109,112,115,116,17993,18051,18056,18059,18066,18072,18076,110,103,108,101,4,5,59,100,108,113,114,18009,18011,18017,18032,18035,1,9653,111,119,110,59,1,9663,101,102,116,4,2,59,101,18026,18028,1,9667,113,59,1,8884,59,1,8796,105,103,104,116,4,2,59,101,18045,18047,1,9657,113,59,1,8885,111,116,59,1,9708,59,1,8796,105,110,117,115,59,1,10810,108,117,115,59,1,10809,98,59,1,10701,105,109,101,59,1,10811,101,122,105,117,109,59,1,9186,4,3,99,104,116,18098,18111,18116,4,2,114,121,18104,18108,59,3,55349,56521,59,1,1094,99,121,59,1,1115,114,111,107,59,1,359,4,2,105,111,18128,18133,120,116,59,1,8812,104,101,97,100,4,2,108,114,18143,18154,101,102,116,97,114,114,111,119,59,1,8606,105,103,104,116,97,114,114,111,119,59,1,8608,4,18,65,72,97,98,99,100,102,103,104,108,109,111,112,114,115,116,117,119,18204,18209,18214,18234,18250,18268,18292,18308,18319,18343,18379,18397,18413,18504,18547,18553,18584,18603,114,114,59,1,8657,97,114,59,1,10595,4,2,99,114,18220,18230,117,116,101,5,250,1,59,18228,1,250,114,59,1,8593,114,4,2,99,101,18241,18245,121,59,1,1118,118,101,59,1,365,4,2,105,121,18256,18265,114,99,5,251,1,59,18263,1,251,59,1,1091,4,3,97,98,104,18276,18281,18287,114,114,59,1,8645,108,97,99,59,1,369,97,114,59,1,10606,4,2,105,114,18298,18304,115,104,116,59,1,10622,59,3,55349,56626,114,97,118,101,5,249,1,59,18317,1,249,4,2,97,98,18325,18338,114,4,2,108,114,18332,18335,59,1,8639,59,1,8638,108,107,59,1,9600,4,2,99,116,18349,18374,4,2,111,114,18355,18369,114,110,4,2,59,101,18363,18365,1,8988,114,59,1,8988,111,112,59,1,8975,114,105,59,1,9720,4,2,97,108,18385,18390,99,114,59,1,363,5,168,1,59,18395,1,168,4,2,103,112,18403,18408,111,110,59,1,371,102,59,3,55349,56678,4,6,97,100,104,108,115,117,18427,18434,18445,18470,18475,18494,114,114,111,119,59,1,8593,111,119,110,97,114,114,111,119,59,1,8597,97,114,112,111,111,110,4,2,108,114,18457,18463,101,102,116,59,1,8639,105,103,104,116,59,1,8638,117,115,59,1,8846,105,4,3,59,104,108,18484,18486,18489,1,965,59,1,978,111,110,59,1,965,112,97,114,114,111,119,115,59,1,8648,4,3,99,105,116,18512,18537,18542,4,2,111,114,18518,18532,114,110,4,2,59,101,18526,18528,1,8989,114,59,1,8989,111,112,59,1,8974,110,103,59,1,367,114,105,59,1,9721,99,114,59,3,55349,56522,4,3,100,105,114,18561,18566,18572,111,116,59,1,8944,108,100,101,59,1,361,105,4,2,59,102,18579,18581,1,9653,59,1,9652,4,2,97,109,18590,18595,114,114,59,1,8648,108,5,252,1,59,18601,1,252,97,110,103,108,101,59,1,10663,4,15,65,66,68,97,99,100,101,102,108,110,111,112,114,115,122,18643,18648,18661,18667,18847,18851,18857,18904,18909,18915,18931,18937,18943,18949,18996,114,114,59,1,8661,97,114,4,2,59,118,18656,18658,1,10984,59,1,10985,97,115,104,59,1,8872,4,2,110,114,18673,18679,103,114,116,59,1,10652,4,7,101,107,110,112,114,115,116,18695,18704,18711,18720,18742,18754,18810,112,115,105,108,111,110,59,1,1013,97,112,112,97,59,1,1008,111,116,104,105,110,103,59,1,8709,4,3,104,105,114,18728,18732,18735,105,59,1,981,59,1,982,111,112,116,111,59,1,8733,4,2,59,104,18748,18750,1,8597,111,59,1,1009,4,2,105,117,18760,18766,103,109,97,59,1,962,4,2,98,112,18772,18791,115,101,116,110,101,113,4,2,59,113,18784,18787,3,8842,65024,59,3,10955,65024,115,101,116,110,101,113,4,2,59,113,18803,18806,3,8843,65024,59,3,10956,65024,4,2,104,114,18816,18822,101,116,97,59,1,977,105,97,110,103,108,101,4,2,108,114,18834,18840,101,102,116,59,1,8882,105,103,104,116,59,1,8883,121,59,1,1074,97,115,104,59,1,8866,4,3,101,108,114,18865,18884,18890,4,3,59,98,101,18873,18875,18880,1,8744,97,114,59,1,8891,113,59,1,8794,108,105,112,59,1,8942,4,2,98,116,18896,18901,97,114,59,1,124,59,1,124,114,59,3,55349,56627,116,114,105,59,1,8882,115,117,4,2,98,112,18923,18927,59,3,8834,8402,59,3,8835,8402,112,102,59,3,55349,56679,114,111,112,59,1,8733,116,114,105,59,1,8883,4,2,99,117,18955,18960,114,59,3,55349,56523,4,2,98,112,18966,18981,110,4,2,69,101,18973,18977,59,3,10955,65024,59,3,8842,65024,110,4,2,69,101,18988,18992,59,3,10956,65024,59,3,8843,65024,105,103,122,97,103,59,1,10650,4,7,99,101,102,111,112,114,115,19020,19026,19061,19066,19072,19075,19089,105,114,99,59,1,373,4,2,100,105,19032,19055,4,2,98,103,19038,19043,97,114,59,1,10847,101,4,2,59,113,19050,19052,1,8743,59,1,8793,101,114,112,59,1,8472,114,59,3,55349,56628,112,102,59,3,55349,56680,59,1,8472,4,2,59,101,19081,19083,1,8768,97,116,104,59,1,8768,99,114,59,3,55349,56524,4,14,99,100,102,104,105,108,109,110,111,114,115,117,118,119,19125,19146,19152,19157,19173,19176,19192,19197,19202,19236,19252,19269,19286,19291,4,3,97,105,117,19133,19137,19142,112,59,1,8898,114,99,59,1,9711,112,59,1,8899,116,114,105,59,1,9661,114,59,3,55349,56629,4,2,65,97,19163,19168,114,114,59,1,10234,114,114,59,1,10231,59,1,958,4,2,65,97,19182,19187,114,114,59,1,10232,114,114,59,1,10229,97,112,59,1,10236,105,115,59,1,8955,4,3,100,112,116,19210,19215,19230,111,116,59,1,10752,4,2,102,108,19221,19225,59,3,55349,56681,117,115,59,1,10753,105,109,101,59,1,10754,4,2,65,97,19242,19247,114,114,59,1,10233,114,114,59,1,10230,4,2,99,113,19258,19263,114,59,3,55349,56525,99,117,112,59,1,10758,4,2,112,116,19275,19281,108,117,115,59,1,10756,114,105,59,1,9651,101,101,59,1,8897,101,100,103,101,59,1,8896,4,8,97,99,101,102,105,111,115,117,19316,19335,19349,19357,19362,19367,19373,19379,99,4,2,117,121,19323,19332,116,101,5,253,1,59,19330,1,253,59,1,1103,4,2,105,121,19341,19346,114,99,59,1,375,59,1,1099,110,5,165,1,59,19355,1,165,114,59,3,55349,56630,99,121,59,1,1111,112,102,59,3,55349,56682,99,114,59,3,55349,56526,4,2,99,109,19385,19389,121,59,1,1102,108,5,255,1,59,19395,1,255,4,10,97,99,100,101,102,104,105,111,115,119,19419,19426,19441,19446,19462,19467,19472,19480,19486,19492,99,117,116,101,59,1,378,4,2,97,121,19432,19438,114,111,110,59,1,382,59,1,1079,111,116,59,1,380,4,2,101,116,19452,19458,116,114,102,59,1,8488,97,59,1,950,114,59,3,55349,56631,99,121,59,1,1078,103,114,97,114,114,59,1,8669,112,102,59,3,55349,56683,99,114,59,3,55349,56527,4,2,106,110,19498,19501,59,1,8205,106,59,1,8204]);const P=s,H={DASH_DASH_STRING:[45,45],DOCTYPE_STRING:[68,79,67,84,89,80,69],CDATA_START_STRING:[91,67,68,65,84,65,91],SCRIPT_STRING:[115,99,114,105,112,116],PUBLIC_STRING:[80,85,66,76,73,67],SYSTEM_STRING:[83,89,83,84,69,77]},D={128:8364,130:8218,131:402,132:8222,133:8230,134:8224,135:8225,136:710,137:8240,138:352,139:8249,140:338,142:381,145:8216,146:8217,147:8220,148:8221,149:8226,150:8211,151:8212,152:732,153:8482,154:353,155:8250,156:339,158:382,159:376},F="DATA_STATE",U="RCDATA_STATE",G="RAWTEXT_STATE",B="SCRIPT_DATA_STATE",K="PLAINTEXT_STATE",b="TAG_OPEN_STATE",x="END_TAG_OPEN_STATE",y="TAG_NAME_STATE",v="RCDATA_LESS_THAN_SIGN_STATE",Y="RCDATA_END_TAG_OPEN_STATE",w="RCDATA_END_TAG_NAME_STATE",Q="RAWTEXT_LESS_THAN_SIGN_STATE",X="RAWTEXT_END_TAG_OPEN_STATE",W="RAWTEXT_END_TAG_NAME_STATE",V="SCRIPT_DATA_LESS_THAN_SIGN_STATE",j="SCRIPT_DATA_END_TAG_OPEN_STATE",z="SCRIPT_DATA_END_TAG_NAME_STATE",q="SCRIPT_DATA_ESCAPE_START_STATE",J="SCRIPT_DATA_ESCAPE_START_DASH_STATE",Z="SCRIPT_DATA_ESCAPED_STATE",$="SCRIPT_DATA_ESCAPED_DASH_STATE",ee="SCRIPT_DATA_ESCAPED_DASH_DASH_STATE",te="SCRIPT_DATA_ESCAPED_LESS_THAN_SIGN_STATE",ne="SCRIPT_DATA_ESCAPED_END_TAG_OPEN_STATE",se="SCRIPT_DATA_ESCAPED_END_TAG_NAME_STATE",re="SCRIPT_DATA_DOUBLE_ESCAPE_START_STATE",ie="SCRIPT_DATA_DOUBLE_ESCAPED_STATE",oe="SCRIPT_DATA_DOUBLE_ESCAPED_DASH_STATE",ae="SCRIPT_DATA_DOUBLE_ESCAPED_DASH_DASH_STATE",Te="SCRIPT_DATA_DOUBLE_ESCAPED_LESS_THAN_SIGN_STATE",Ee="SCRIPT_DATA_DOUBLE_ESCAPE_END_STATE",he="BEFORE_ATTRIBUTE_NAME_STATE",ce="ATTRIBUTE_NAME_STATE",_e="AFTER_ATTRIBUTE_NAME_STATE",le="BEFORE_ATTRIBUTE_VALUE_STATE",me="ATTRIBUTE_VALUE_DOUBLE_QUOTED_STATE",pe="ATTRIBUTE_VALUE_SINGLE_QUOTED_STATE",Ae="ATTRIBUTE_VALUE_UNQUOTED_STATE",ue="AFTER_ATTRIBUTE_VALUE_QUOTED_STATE",Ne="SELF_CLOSING_START_TAG_STATE",de="BOGUS_COMMENT_STATE",Ce="MARKUP_DECLARATION_OPEN_STATE",Oe="COMMENT_START_STATE",fe="COMMENT_START_DASH_STATE",Se="COMMENT_STATE",Re="COMMENT_LESS_THAN_SIGN_STATE",Ie="COMMENT_LESS_THAN_SIGN_BANG_STATE",Le="COMMENT_LESS_THAN_SIGN_BANG_DASH_STATE",ke="COMMENT_LESS_THAN_SIGN_BANG_DASH_DASH_STATE",Me="COMMENT_END_DASH_STATE",ge="COMMENT_END_STATE",Pe="COMMENT_END_BANG_STATE",He="DOCTYPE_STATE",De="BEFORE_DOCTYPE_NAME_STATE",Fe="DOCTYPE_NAME_STATE",Ue="AFTER_DOCTYPE_NAME_STATE",Ge="AFTER_DOCTYPE_PUBLIC_KEYWORD_STATE",Be="BEFORE_DOCTYPE_PUBLIC_IDENTIFIER_STATE",Ke="DOCTYPE_PUBLIC_IDENTIFIER_DOUBLE_QUOTED_STATE",be="DOCTYPE_PUBLIC_IDENTIFIER_SINGLE_QUOTED_STATE",xe="AFTER_DOCTYPE_PUBLIC_IDENTIFIER_STATE",ye="BETWEEN_DOCTYPE_PUBLIC_AND_SYSTEM_IDENTIFIERS_STATE",ve="AFTER_DOCTYPE_SYSTEM_KEYWORD_STATE",Ye="BEFORE_DOCTYPE_SYSTEM_IDENTIFIER_STATE",we="DOCTYPE_SYSTEM_IDENTIFIER_DOUBLE_QUOTED_STATE",Qe="DOCTYPE_SYSTEM_IDENTIFIER_SINGLE_QUOTED_STATE",Xe="AFTER_DOCTYPE_SYSTEM_IDENTIFIER_STATE",We="BOGUS_DOCTYPE_STATE",Ve="CDATA_SECTION_STATE",je="CDATA_SECTION_BRACKET_STATE",ze="CDATA_SECTION_END_STATE",qe="CHARACTER_REFERENCE_STATE",Je="NAMED_CHARACTER_REFERENCE_STATE",Ze="AMBIGUOS_AMPERSAND_STATE",$e="NUMERIC_CHARACTER_REFERENCE_STATE",et="HEXADEMICAL_CHARACTER_REFERENCE_START_STATE",tt="DECIMAL_CHARACTER_REFERENCE_START_STATE",nt="HEXADEMICAL_CHARACTER_REFERENCE_STATE",st="DECIMAL_CHARACTER_REFERENCE_STATE",rt="NUMERIC_CHARACTER_REFERENCE_END_STATE";function it(e){return e===P.SPACE||e===P.LINE_FEED||e===P.TABULATION||e===P.FORM_FEED}function ot(e){return e>=P.DIGIT_0&&e<=P.DIGIT_9}function at(e){return e>=P.LATIN_CAPITAL_A&&e<=P.LATIN_CAPITAL_Z}function Tt(e){return e>=P.LATIN_SMALL_A&&e<=P.LATIN_SMALL_Z}function Et(e){return Tt(e)||at(e)}function ht(e){return Et(e)||ot(e)}function ct(e){return e>=P.LATIN_CAPITAL_A&&e<=P.LATIN_CAPITAL_F}function _t(e){return e>=P.LATIN_SMALL_A&&e<=P.LATIN_SMALL_F}function lt(e){return e+32}function mt(e){return e<=65535?String.fromCharCode(e):(e-=65536,String.fromCharCode(e>>>10&1023|55296)+String.fromCharCode(56320|1023&e))}function pt(e){return String.fromCharCode(lt(e))}function At(e,t){const n=g[++e];let s=++e,r=s+n-1;for(;s<=r;){const e=s+r>>>1,i=g[e];if(i<t)s=e+1;else {if(!(i>t))return g[e+n];r=e-1;}}return -1}class ut{constructor(){this.preprocessor=new class{constructor(){this.html=null,this.pos=-1,this.lastGapPos=-1,this.lastCharPos=-1,this.gapStack=[],this.skipNextNewLine=!1,this.lastChunkWritten=!1,this.endOfChunkHit=!1,this.bufferWaterline=65536;}_err(){}_addGap(){this.gapStack.push(this.lastGapPos),this.lastGapPos=this.pos;}_processSurrogate(e){if(this.pos!==this.lastCharPos){const t=this.html.charCodeAt(this.pos+1);if(function(e){return e>=56320&&e<=57343}(t))return this.pos++,this._addGap(),1024*(e-55296)+9216+t}else if(!this.lastChunkWritten)return this.endOfChunkHit=!0,M.EOF;return this._err("surrogate-in-input-stream"),e}dropParsedChunk(){this.pos>this.bufferWaterline&&(this.lastCharPos-=this.pos,this.html=this.html.substring(this.pos),this.pos=0,this.lastGapPos=-1,this.gapStack=[]);}write(e,t){this.html?this.html+=e:this.html=e,this.lastCharPos=this.html.length-1,this.endOfChunkHit=!1,this.lastChunkWritten=t;}insertHtmlAtCurrentPos(e){this.html=this.html.substring(0,this.pos+1)+e+this.html.substring(this.pos+1,this.html.length),this.lastCharPos=this.html.length-1,this.endOfChunkHit=!1;}advance(){if(this.pos++,this.pos>this.lastCharPos)return this.endOfChunkHit=!this.lastChunkWritten,M.EOF;let e=this.html.charCodeAt(this.pos);return this.skipNextNewLine&&e===M.LINE_FEED?(this.skipNextNewLine=!1,this._addGap(),this.advance()):e===M.CARRIAGE_RETURN?(this.skipNextNewLine=!0,M.LINE_FEED):(this.skipNextNewLine=!1,r(e)&&(e=this._processSurrogate(e)),e>31&&e<127||e===M.LINE_FEED||e===M.CARRIAGE_RETURN||e>159&&e<64976||this._checkForProblematicCharacters(e),e)}_checkForProblematicCharacters(e){i(e)?this._err("control-character-in-input-stream"):o(e)&&this._err("noncharacter-in-input-stream");}retreat(){this.pos===this.lastGapPos&&(this.lastGapPos=this.gapStack.pop(),this.pos--),this.pos--;}},this.tokenQueue=[],this.allowCDATA=!1,this.state=F,this.returnState="",this.charRefCode=-1,this.tempBuff=[],this.lastStartTagName="",this.consumedAfterSnapshot=-1,this.active=!1,this.currentCharacterToken=null,this.currentToken=null,this.currentAttr=null;}_err(){}_errOnNextCodePoint(e){this._consume(),this._err(e),this._unconsume();}getNextToken(){for(;!this.tokenQueue.length&&this.active;){this.consumedAfterSnapshot=0;const e=this._consume();this._ensureHibernation()||this[this.state](e);}return this.tokenQueue.shift()}write(e,t){this.active=!0,this.preprocessor.write(e,t);}insertHtmlAtCurrentPos(e){this.active=!0,this.preprocessor.insertHtmlAtCurrentPos(e);}_ensureHibernation(){if(this.preprocessor.endOfChunkHit){for(;this.consumedAfterSnapshot>0;this.consumedAfterSnapshot--)this.preprocessor.retreat();return this.active=!1,this.tokenQueue.push({type:ut.HIBERNATION_TOKEN}),!0}return !1}_consume(){return this.consumedAfterSnapshot++,this.preprocessor.advance()}_unconsume(){this.consumedAfterSnapshot--,this.preprocessor.retreat();}_reconsumeInState(e){this.state=e,this._unconsume();}_consumeSequenceIfMatch(e,t,n){let s=0,r=!0;const i=e.length;let o,a=0,T=t;for(;a<i;a++){if(a>0&&(T=this._consume(),s++),T===P.EOF){r=!1;break}if(o=e[a],T!==o&&(n||T!==lt(o))){r=!1;break}}if(!r)for(;s--;)this._unconsume();return r}_isTempBufferEqualToScriptString(){if(this.tempBuff.length!==H.SCRIPT_STRING.length)return !1;for(let e=0;e<this.tempBuff.length;e++)if(this.tempBuff[e]!==H.SCRIPT_STRING[e])return !1;return !0}_createStartTagToken(){this.currentToken={type:ut.START_TAG_TOKEN,tagName:"",selfClosing:!1,ackSelfClosing:!1,attrs:[]};}_createEndTagToken(){this.currentToken={type:ut.END_TAG_TOKEN,tagName:"",selfClosing:!1,attrs:[]};}_createCommentToken(){this.currentToken={type:ut.COMMENT_TOKEN,data:""};}_createDoctypeToken(e){this.currentToken={type:ut.DOCTYPE_TOKEN,name:e,forceQuirks:!1,publicId:null,systemId:null};}_createCharacterToken(e,t){this.currentCharacterToken={type:e,chars:t};}_createEOFToken(){this.currentToken={type:ut.EOF_TOKEN};}_createAttr(e){this.currentAttr={name:e,value:""};}_leaveAttrName(e){null===ut.getTokenAttr(this.currentToken,this.currentAttr.name)?this.currentToken.attrs.push(this.currentAttr):this._err("duplicate-attribute"),this.state=e;}_leaveAttrValue(e){this.state=e;}_emitCurrentToken(){this._emitCurrentCharacterToken();const e=this.currentToken;this.currentToken=null,e.type===ut.START_TAG_TOKEN?this.lastStartTagName=e.tagName:e.type===ut.END_TAG_TOKEN&&(e.attrs.length>0&&this._err("end-tag-with-attributes"),e.selfClosing&&this._err("end-tag-with-trailing-solidus")),this.tokenQueue.push(e);}_emitCurrentCharacterToken(){this.currentCharacterToken&&(this.tokenQueue.push(this.currentCharacterToken),this.currentCharacterToken=null);}_emitEOFToken(){this._createEOFToken(),this._emitCurrentToken();}_appendCharToCurrentCharacterToken(e,t){this.currentCharacterToken&&this.currentCharacterToken.type!==e&&this._emitCurrentCharacterToken(),this.currentCharacterToken?this.currentCharacterToken.chars+=t:this._createCharacterToken(e,t);}_emitCodePoint(e){let t=ut.CHARACTER_TOKEN;it(e)?t=ut.WHITESPACE_CHARACTER_TOKEN:e===P.NULL&&(t=ut.NULL_CHARACTER_TOKEN),this._appendCharToCurrentCharacterToken(t,mt(e));}_emitSeveralCodePoints(e){for(let t=0;t<e.length;t++)this._emitCodePoint(e[t]);}_emitChars(e){this._appendCharToCurrentCharacterToken(ut.CHARACTER_TOKEN,e);}_matchNamedCharacterReference(e){let t=null,n=1,s=At(0,e);for(this.tempBuff.push(e);s>-1;){const e=g[s],r=e<7;r&&1&e&&(t=2&e?[g[++s],g[++s]]:[g[++s]],n=0);const i=this._consume();if(this.tempBuff.push(i),n++,i===P.EOF)break;s=r?4&e?At(s,i):-1:i===e?++s:-1;}for(;n--;)this.tempBuff.pop(),this._unconsume();return t}_isCharacterReferenceInAttribute(){return this.returnState===me||this.returnState===pe||this.returnState===Ae}_isCharacterReferenceAttributeQuirk(e){if(!e&&this._isCharacterReferenceInAttribute()){const e=this._consume();return this._unconsume(),e===P.EQUALS_SIGN||ht(e)}return !1}_flushCodePointsConsumedAsCharacterReference(){if(this._isCharacterReferenceInAttribute())for(let e=0;e<this.tempBuff.length;e++)this.currentAttr.value+=mt(this.tempBuff[e]);else this._emitSeveralCodePoints(this.tempBuff);this.tempBuff=[];}[F](e){this.preprocessor.dropParsedChunk(),e===P.LESS_THAN_SIGN?this.state=b:e===P.AMPERSAND?(this.returnState=F,this.state=qe):e===P.NULL?(this._err(a),this._emitCodePoint(e)):e===P.EOF?this._emitEOFToken():this._emitCodePoint(e);}[U](e){this.preprocessor.dropParsedChunk(),e===P.AMPERSAND?(this.returnState=U,this.state=qe):e===P.LESS_THAN_SIGN?this.state=v:e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?this._emitEOFToken():this._emitCodePoint(e);}[G](e){this.preprocessor.dropParsedChunk(),e===P.LESS_THAN_SIGN?this.state=Q:e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?this._emitEOFToken():this._emitCodePoint(e);}[B](e){this.preprocessor.dropParsedChunk(),e===P.LESS_THAN_SIGN?this.state=V:e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?this._emitEOFToken():this._emitCodePoint(e);}[K](e){this.preprocessor.dropParsedChunk(),e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?this._emitEOFToken():this._emitCodePoint(e);}[b](e){e===P.EXCLAMATION_MARK?this.state=Ce:e===P.SOLIDUS?this.state=x:Et(e)?(this._createStartTagToken(),this._reconsumeInState(y)):e===P.QUESTION_MARK?(this._err("unexpected-question-mark-instead-of-tag-name"),this._createCommentToken(),this._reconsumeInState(de)):e===P.EOF?(this._err(h),this._emitChars("<"),this._emitEOFToken()):(this._err(T),this._emitChars("<"),this._reconsumeInState(F));}[x](e){Et(e)?(this._createEndTagToken(),this._reconsumeInState(y)):e===P.GREATER_THAN_SIGN?(this._err("missing-end-tag-name"),this.state=F):e===P.EOF?(this._err(h),this._emitChars("</"),this._emitEOFToken()):(this._err(T),this._createCommentToken(),this._reconsumeInState(de));}[y](e){it(e)?this.state=he:e===P.SOLIDUS?this.state=Ne:e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):at(e)?this.currentToken.tagName+=pt(e):e===P.NULL?(this._err(a),this.currentToken.tagName+=n):e===P.EOF?(this._err(c),this._emitEOFToken()):this.currentToken.tagName+=mt(e);}[v](e){e===P.SOLIDUS?(this.tempBuff=[],this.state=Y):(this._emitChars("<"),this._reconsumeInState(U));}[Y](e){Et(e)?(this._createEndTagToken(),this._reconsumeInState(w)):(this._emitChars("</"),this._reconsumeInState(U));}[w](e){if(at(e))this.currentToken.tagName+=pt(e),this.tempBuff.push(e);else if(Tt(e))this.currentToken.tagName+=mt(e),this.tempBuff.push(e);else {if(this.lastStartTagName===this.currentToken.tagName){if(it(e))return void(this.state=he);if(e===P.SOLIDUS)return void(this.state=Ne);if(e===P.GREATER_THAN_SIGN)return this.state=F,void this._emitCurrentToken()}this._emitChars("</"),this._emitSeveralCodePoints(this.tempBuff),this._reconsumeInState(U);}}[Q](e){e===P.SOLIDUS?(this.tempBuff=[],this.state=X):(this._emitChars("<"),this._reconsumeInState(G));}[X](e){Et(e)?(this._createEndTagToken(),this._reconsumeInState(W)):(this._emitChars("</"),this._reconsumeInState(G));}[W](e){if(at(e))this.currentToken.tagName+=pt(e),this.tempBuff.push(e);else if(Tt(e))this.currentToken.tagName+=mt(e),this.tempBuff.push(e);else {if(this.lastStartTagName===this.currentToken.tagName){if(it(e))return void(this.state=he);if(e===P.SOLIDUS)return void(this.state=Ne);if(e===P.GREATER_THAN_SIGN)return this._emitCurrentToken(),void(this.state=F)}this._emitChars("</"),this._emitSeveralCodePoints(this.tempBuff),this._reconsumeInState(G);}}[V](e){e===P.SOLIDUS?(this.tempBuff=[],this.state=j):e===P.EXCLAMATION_MARK?(this.state=q,this._emitChars("<!")):(this._emitChars("<"),this._reconsumeInState(B));}[j](e){Et(e)?(this._createEndTagToken(),this._reconsumeInState(z)):(this._emitChars("</"),this._reconsumeInState(B));}[z](e){if(at(e))this.currentToken.tagName+=pt(e),this.tempBuff.push(e);else if(Tt(e))this.currentToken.tagName+=mt(e),this.tempBuff.push(e);else {if(this.lastStartTagName===this.currentToken.tagName){if(it(e))return void(this.state=he);if(e===P.SOLIDUS)return void(this.state=Ne);if(e===P.GREATER_THAN_SIGN)return this._emitCurrentToken(),void(this.state=F)}this._emitChars("</"),this._emitSeveralCodePoints(this.tempBuff),this._reconsumeInState(B);}}[q](e){e===P.HYPHEN_MINUS?(this.state=J,this._emitChars("-")):this._reconsumeInState(B);}[J](e){e===P.HYPHEN_MINUS?(this.state=ee,this._emitChars("-")):this._reconsumeInState(B);}[Z](e){e===P.HYPHEN_MINUS?(this.state=$,this._emitChars("-")):e===P.LESS_THAN_SIGN?this.state=te:e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):this._emitCodePoint(e);}[$](e){e===P.HYPHEN_MINUS?(this.state=ee,this._emitChars("-")):e===P.LESS_THAN_SIGN?this.state=te:e===P.NULL?(this._err(a),this.state=Z,this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):(this.state=Z,this._emitCodePoint(e));}[ee](e){e===P.HYPHEN_MINUS?this._emitChars("-"):e===P.LESS_THAN_SIGN?this.state=te:e===P.GREATER_THAN_SIGN?(this.state=B,this._emitChars(">")):e===P.NULL?(this._err(a),this.state=Z,this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):(this.state=Z,this._emitCodePoint(e));}[te](e){e===P.SOLIDUS?(this.tempBuff=[],this.state=ne):Et(e)?(this.tempBuff=[],this._emitChars("<"),this._reconsumeInState(re)):(this._emitChars("<"),this._reconsumeInState(Z));}[ne](e){Et(e)?(this._createEndTagToken(),this._reconsumeInState(se)):(this._emitChars("</"),this._reconsumeInState(Z));}[se](e){if(at(e))this.currentToken.tagName+=pt(e),this.tempBuff.push(e);else if(Tt(e))this.currentToken.tagName+=mt(e),this.tempBuff.push(e);else {if(this.lastStartTagName===this.currentToken.tagName){if(it(e))return void(this.state=he);if(e===P.SOLIDUS)return void(this.state=Ne);if(e===P.GREATER_THAN_SIGN)return this._emitCurrentToken(),void(this.state=F)}this._emitChars("</"),this._emitSeveralCodePoints(this.tempBuff),this._reconsumeInState(Z);}}[re](e){it(e)||e===P.SOLIDUS||e===P.GREATER_THAN_SIGN?(this.state=this._isTempBufferEqualToScriptString()?ie:Z,this._emitCodePoint(e)):at(e)?(this.tempBuff.push(lt(e)),this._emitCodePoint(e)):Tt(e)?(this.tempBuff.push(e),this._emitCodePoint(e)):this._reconsumeInState(Z);}[ie](e){e===P.HYPHEN_MINUS?(this.state=oe,this._emitChars("-")):e===P.LESS_THAN_SIGN?(this.state=Te,this._emitChars("<")):e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):this._emitCodePoint(e);}[oe](e){e===P.HYPHEN_MINUS?(this.state=ae,this._emitChars("-")):e===P.LESS_THAN_SIGN?(this.state=Te,this._emitChars("<")):e===P.NULL?(this._err(a),this.state=ie,this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):(this.state=ie,this._emitCodePoint(e));}[ae](e){e===P.HYPHEN_MINUS?this._emitChars("-"):e===P.LESS_THAN_SIGN?(this.state=Te,this._emitChars("<")):e===P.GREATER_THAN_SIGN?(this.state=B,this._emitChars(">")):e===P.NULL?(this._err(a),this.state=ie,this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):(this.state=ie,this._emitCodePoint(e));}[Te](e){e===P.SOLIDUS?(this.tempBuff=[],this.state=Ee,this._emitChars("/")):this._reconsumeInState(ie);}[Ee](e){it(e)||e===P.SOLIDUS||e===P.GREATER_THAN_SIGN?(this.state=this._isTempBufferEqualToScriptString()?Z:ie,this._emitCodePoint(e)):at(e)?(this.tempBuff.push(lt(e)),this._emitCodePoint(e)):Tt(e)?(this.tempBuff.push(e),this._emitCodePoint(e)):this._reconsumeInState(ie);}[he](e){it(e)||(e===P.SOLIDUS||e===P.GREATER_THAN_SIGN||e===P.EOF?this._reconsumeInState(_e):e===P.EQUALS_SIGN?(this._err("unexpected-equals-sign-before-attribute-name"),this._createAttr("="),this.state=ce):(this._createAttr(""),this._reconsumeInState(ce)));}[ce](e){it(e)||e===P.SOLIDUS||e===P.GREATER_THAN_SIGN||e===P.EOF?(this._leaveAttrName(_e),this._unconsume()):e===P.EQUALS_SIGN?this._leaveAttrName(le):at(e)?this.currentAttr.name+=pt(e):e===P.QUOTATION_MARK||e===P.APOSTROPHE||e===P.LESS_THAN_SIGN?(this._err("unexpected-character-in-attribute-name"),this.currentAttr.name+=mt(e)):e===P.NULL?(this._err(a),this.currentAttr.name+=n):this.currentAttr.name+=mt(e);}[_e](e){it(e)||(e===P.SOLIDUS?this.state=Ne:e===P.EQUALS_SIGN?this.state=le:e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(c),this._emitEOFToken()):(this._createAttr(""),this._reconsumeInState(ce)));}[le](e){it(e)||(e===P.QUOTATION_MARK?this.state=me:e===P.APOSTROPHE?this.state=pe:e===P.GREATER_THAN_SIGN?(this._err("missing-attribute-value"),this.state=F,this._emitCurrentToken()):this._reconsumeInState(Ae));}[me](e){e===P.QUOTATION_MARK?this.state=ue:e===P.AMPERSAND?(this.returnState=me,this.state=qe):e===P.NULL?(this._err(a),this.currentAttr.value+=n):e===P.EOF?(this._err(c),this._emitEOFToken()):this.currentAttr.value+=mt(e);}[pe](e){e===P.APOSTROPHE?this.state=ue:e===P.AMPERSAND?(this.returnState=pe,this.state=qe):e===P.NULL?(this._err(a),this.currentAttr.value+=n):e===P.EOF?(this._err(c),this._emitEOFToken()):this.currentAttr.value+=mt(e);}[Ae](e){it(e)?this._leaveAttrValue(he):e===P.AMPERSAND?(this.returnState=Ae,this.state=qe):e===P.GREATER_THAN_SIGN?(this._leaveAttrValue(F),this._emitCurrentToken()):e===P.NULL?(this._err(a),this.currentAttr.value+=n):e===P.QUOTATION_MARK||e===P.APOSTROPHE||e===P.LESS_THAN_SIGN||e===P.EQUALS_SIGN||e===P.GRAVE_ACCENT?(this._err("unexpected-character-in-unquoted-attribute-value"),this.currentAttr.value+=mt(e)):e===P.EOF?(this._err(c),this._emitEOFToken()):this.currentAttr.value+=mt(e);}[ue](e){it(e)?this._leaveAttrValue(he):e===P.SOLIDUS?this._leaveAttrValue(Ne):e===P.GREATER_THAN_SIGN?(this._leaveAttrValue(F),this._emitCurrentToken()):e===P.EOF?(this._err(c),this._emitEOFToken()):(this._err("missing-whitespace-between-attributes"),this._reconsumeInState(he));}[Ne](e){e===P.GREATER_THAN_SIGN?(this.currentToken.selfClosing=!0,this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(c),this._emitEOFToken()):(this._err("unexpected-solidus-in-tag"),this._reconsumeInState(he));}[de](e){e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):e===P.EOF?(this._emitCurrentToken(),this._emitEOFToken()):e===P.NULL?(this._err(a),this.currentToken.data+=n):this.currentToken.data+=mt(e);}[Ce](e){this._consumeSequenceIfMatch(H.DASH_DASH_STRING,e,!0)?(this._createCommentToken(),this.state=Oe):this._consumeSequenceIfMatch(H.DOCTYPE_STRING,e,!1)?this.state=He:this._consumeSequenceIfMatch(H.CDATA_START_STRING,e,!0)?this.allowCDATA?this.state=Ve:(this._err("cdata-in-html-content"),this._createCommentToken(),this.currentToken.data="[CDATA[",this.state=de):this._ensureHibernation()||(this._err("incorrectly-opened-comment"),this._createCommentToken(),this._reconsumeInState(de));}[Oe](e){e===P.HYPHEN_MINUS?this.state=fe:e===P.GREATER_THAN_SIGN?(this._err(S),this.state=F,this._emitCurrentToken()):this._reconsumeInState(Se);}[fe](e){e===P.HYPHEN_MINUS?this.state=ge:e===P.GREATER_THAN_SIGN?(this._err(S),this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(R),this._emitCurrentToken(),this._emitEOFToken()):(this.currentToken.data+="-",this._reconsumeInState(Se));}[Se](e){e===P.HYPHEN_MINUS?this.state=Me:e===P.LESS_THAN_SIGN?(this.currentToken.data+="<",this.state=Re):e===P.NULL?(this._err(a),this.currentToken.data+=n):e===P.EOF?(this._err(R),this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.data+=mt(e);}[Re](e){e===P.EXCLAMATION_MARK?(this.currentToken.data+="!",this.state=Ie):e===P.LESS_THAN_SIGN?this.currentToken.data+="!":this._reconsumeInState(Se);}[Ie](e){e===P.HYPHEN_MINUS?this.state=Le:this._reconsumeInState(Se);}[Le](e){e===P.HYPHEN_MINUS?this.state=ke:this._reconsumeInState(Me);}[ke](e){e!==P.GREATER_THAN_SIGN&&e!==P.EOF&&this._err("nested-comment"),this._reconsumeInState(ge);}[Me](e){e===P.HYPHEN_MINUS?this.state=ge:e===P.EOF?(this._err(R),this._emitCurrentToken(),this._emitEOFToken()):(this.currentToken.data+="-",this._reconsumeInState(Se));}[ge](e){e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):e===P.EXCLAMATION_MARK?this.state=Pe:e===P.HYPHEN_MINUS?this.currentToken.data+="-":e===P.EOF?(this._err(R),this._emitCurrentToken(),this._emitEOFToken()):(this.currentToken.data+="--",this._reconsumeInState(Se));}[Pe](e){e===P.HYPHEN_MINUS?(this.currentToken.data+="--!",this.state=Me):e===P.GREATER_THAN_SIGN?(this._err("incorrectly-closed-comment"),this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(R),this._emitCurrentToken(),this._emitEOFToken()):(this.currentToken.data+="--!",this._reconsumeInState(Se));}[He](e){it(e)?this.state=De:e===P.GREATER_THAN_SIGN?this._reconsumeInState(De):e===P.EOF?(this._err(f),this._createDoctypeToken(null),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err("missing-whitespace-before-doctype-name"),this._reconsumeInState(De));}[De](e){it(e)||(at(e)?(this._createDoctypeToken(pt(e)),this.state=Fe):e===P.NULL?(this._err(a),this._createDoctypeToken(n),this.state=Fe):e===P.GREATER_THAN_SIGN?(this._err("missing-doctype-name"),this._createDoctypeToken(null),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this._createDoctypeToken(null),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._createDoctypeToken(mt(e)),this.state=Fe));}[Fe](e){it(e)?this.state=Ue:e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):at(e)?this.currentToken.name+=pt(e):e===P.NULL?(this._err(a),this.currentToken.name+=n):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.name+=mt(e);}[Ue](e){it(e)||(e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this._consumeSequenceIfMatch(H.PUBLIC_STRING,e,!1)?this.state=Ge:this._consumeSequenceIfMatch(H.SYSTEM_STRING,e,!1)?this.state=ve:this._ensureHibernation()||(this._err("invalid-character-sequence-after-doctype-name"),this.currentToken.forceQuirks=!0,this._reconsumeInState(We)));}[Ge](e){it(e)?this.state=Be:e===P.QUOTATION_MARK?(this._err(_),this.currentToken.publicId="",this.state=Ke):e===P.APOSTROPHE?(this._err(_),this.currentToken.publicId="",this.state=be):e===P.GREATER_THAN_SIGN?(this._err(u),this.currentToken.forceQuirks=!0,this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(p),this.currentToken.forceQuirks=!0,this._reconsumeInState(We));}[Be](e){it(e)||(e===P.QUOTATION_MARK?(this.currentToken.publicId="",this.state=Ke):e===P.APOSTROPHE?(this.currentToken.publicId="",this.state=be):e===P.GREATER_THAN_SIGN?(this._err(u),this.currentToken.forceQuirks=!0,this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(p),this.currentToken.forceQuirks=!0,this._reconsumeInState(We)));}[Ke](e){e===P.QUOTATION_MARK?this.state=xe:e===P.NULL?(this._err(a),this.currentToken.publicId+=n):e===P.GREATER_THAN_SIGN?(this._err(d),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.publicId+=mt(e);}[be](e){e===P.APOSTROPHE?this.state=xe:e===P.NULL?(this._err(a),this.currentToken.publicId+=n):e===P.GREATER_THAN_SIGN?(this._err(d),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.publicId+=mt(e);}[xe](e){it(e)?this.state=ye:e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):e===P.QUOTATION_MARK?(this._err(l),this.currentToken.systemId="",this.state=we):e===P.APOSTROPHE?(this._err(l),this.currentToken.systemId="",this.state=Qe):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(A),this.currentToken.forceQuirks=!0,this._reconsumeInState(We));}[ye](e){it(e)||(e===P.GREATER_THAN_SIGN?(this._emitCurrentToken(),this.state=F):e===P.QUOTATION_MARK?(this.currentToken.systemId="",this.state=we):e===P.APOSTROPHE?(this.currentToken.systemId="",this.state=Qe):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(A),this.currentToken.forceQuirks=!0,this._reconsumeInState(We)));}[ve](e){it(e)?this.state=Ye:e===P.QUOTATION_MARK?(this._err(m),this.currentToken.systemId="",this.state=we):e===P.APOSTROPHE?(this._err(m),this.currentToken.systemId="",this.state=Qe):e===P.GREATER_THAN_SIGN?(this._err(N),this.currentToken.forceQuirks=!0,this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(A),this.currentToken.forceQuirks=!0,this._reconsumeInState(We));}[Ye](e){it(e)||(e===P.QUOTATION_MARK?(this.currentToken.systemId="",this.state=we):e===P.APOSTROPHE?(this.currentToken.systemId="",this.state=Qe):e===P.GREATER_THAN_SIGN?(this._err(N),this.currentToken.forceQuirks=!0,this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(A),this.currentToken.forceQuirks=!0,this._reconsumeInState(We)));}[we](e){e===P.QUOTATION_MARK?this.state=Xe:e===P.NULL?(this._err(a),this.currentToken.systemId+=n):e===P.GREATER_THAN_SIGN?(this._err(C),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.systemId+=mt(e);}[Qe](e){e===P.APOSTROPHE?this.state=Xe:e===P.NULL?(this._err(a),this.currentToken.systemId+=n):e===P.GREATER_THAN_SIGN?(this._err(C),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.systemId+=mt(e);}[Xe](e){it(e)||(e===P.GREATER_THAN_SIGN?(this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err("unexpected-character-after-doctype-system-identifier"),this._reconsumeInState(We)));}[We](e){e===P.GREATER_THAN_SIGN?(this._emitCurrentToken(),this.state=F):e===P.NULL?this._err(a):e===P.EOF&&(this._emitCurrentToken(),this._emitEOFToken());}[Ve](e){e===P.RIGHT_SQUARE_BRACKET?this.state=je:e===P.EOF?(this._err("eof-in-cdata"),this._emitEOFToken()):this._emitCodePoint(e);}[je](e){e===P.RIGHT_SQUARE_BRACKET?this.state=ze:(this._emitChars("]"),this._reconsumeInState(Ve));}[ze](e){e===P.GREATER_THAN_SIGN?this.state=F:e===P.RIGHT_SQUARE_BRACKET?this._emitChars("]"):(this._emitChars("]]"),this._reconsumeInState(Ve));}[qe](e){this.tempBuff=[P.AMPERSAND],e===P.NUMBER_SIGN?(this.tempBuff.push(e),this.state=$e):ht(e)?this._reconsumeInState(Je):(this._flushCodePointsConsumedAsCharacterReference(),this._reconsumeInState(this.returnState));}[Je](e){const t=this._matchNamedCharacterReference(e);if(this._ensureHibernation())this.tempBuff=[P.AMPERSAND];else if(t){const e=this.tempBuff[this.tempBuff.length-1]===P.SEMICOLON;this._isCharacterReferenceAttributeQuirk(e)||(e||this._errOnNextCodePoint(E),this.tempBuff=t),this._flushCodePointsConsumedAsCharacterReference(),this.state=this.returnState;}else this._flushCodePointsConsumedAsCharacterReference(),this.state=Ze;}[Ze](e){ht(e)?this._isCharacterReferenceInAttribute()?this.currentAttr.value+=mt(e):this._emitCodePoint(e):(e===P.SEMICOLON&&this._err("unknown-named-character-reference"),this._reconsumeInState(this.returnState));}[$e](e){this.charRefCode=0,e===P.LATIN_SMALL_X||e===P.LATIN_CAPITAL_X?(this.tempBuff.push(e),this.state=et):this._reconsumeInState(tt);}[et](e){!function(e){return ot(e)||ct(e)||_t(e)}(e)?(this._err(I),this._flushCodePointsConsumedAsCharacterReference(),this._reconsumeInState(this.returnState)):this._reconsumeInState(nt);}[tt](e){ot(e)?this._reconsumeInState(st):(this._err(I),this._flushCodePointsConsumedAsCharacterReference(),this._reconsumeInState(this.returnState));}[nt](e){ct(e)?this.charRefCode=16*this.charRefCode+e-55:_t(e)?this.charRefCode=16*this.charRefCode+e-87:ot(e)?this.charRefCode=16*this.charRefCode+e-48:e===P.SEMICOLON?this.state=rt:(this._err(E),this._reconsumeInState(rt));}[st](e){ot(e)?this.charRefCode=10*this.charRefCode+e-48:e===P.SEMICOLON?this.state=rt:(this._err(E),this._reconsumeInState(rt));}[rt](){if(this.charRefCode===P.NULL)this._err("null-character-reference"),this.charRefCode=P.REPLACEMENT_CHARACTER;else if(this.charRefCode>1114111)this._err("character-reference-outside-unicode-range"),this.charRefCode=P.REPLACEMENT_CHARACTER;else if(r(this.charRefCode))this._err("surrogate-character-reference"),this.charRefCode=P.REPLACEMENT_CHARACTER;else if(o(this.charRefCode))this._err("noncharacter-character-reference");else if(i(this.charRefCode)||this.charRefCode===P.CARRIAGE_RETURN){this._err("control-character-reference");const e=D[this.charRefCode];e&&(this.charRefCode=e);}this.tempBuff=[this.charRefCode],this._flushCodePointsConsumedAsCharacterReference(),this._reconsumeInState(this.returnState);}}ut.CHARACTER_TOKEN="CHARACTER_TOKEN",ut.NULL_CHARACTER_TOKEN="NULL_CHARACTER_TOKEN",ut.WHITESPACE_CHARACTER_TOKEN="WHITESPACE_CHARACTER_TOKEN",ut.START_TAG_TOKEN="START_TAG_TOKEN",ut.END_TAG_TOKEN="END_TAG_TOKEN",ut.COMMENT_TOKEN="COMMENT_TOKEN",ut.DOCTYPE_TOKEN="DOCTYPE_TOKEN",ut.EOF_TOKEN="EOF_TOKEN",ut.HIBERNATION_TOKEN="HIBERNATION_TOKEN",ut.MODE={DATA:F,RCDATA:U,RAWTEXT:G,SCRIPT_DATA:B,PLAINTEXT:K},ut.getTokenAttr=function(e,t){for(let n=e.attrs.length-1;n>=0;n--)if(e.attrs[n].name===t)return e.attrs[n].value;return null};var Nt=ut;function dt(e,t,n){return e(n={path:t,exports:{},require:function(e,t){return function(){throw new Error("Dynamic requires are not currently supported by @rollup/plugin-commonjs")}(null==t&&n.path)}},n.exports),n.exports}var Ct=dt((function(e,t){const n=t.NAMESPACES={HTML:"http://www.w3.org/1999/xhtml",MATHML:"http://www.w3.org/1998/Math/MathML",SVG:"http://www.w3.org/2000/svg",XLINK:"http://www.w3.org/1999/xlink",XML:"http://www.w3.org/XML/1998/namespace",XMLNS:"http://www.w3.org/2000/xmlns/"};t.ATTRS={TYPE:"type",ACTION:"action",ENCODING:"encoding",PROMPT:"prompt",NAME:"name",COLOR:"color",FACE:"face",SIZE:"size"},t.DOCUMENT_MODE={NO_QUIRKS:"no-quirks",QUIRKS:"quirks",LIMITED_QUIRKS:"limited-quirks"};const s=t.TAG_NAMES={A:"a",ADDRESS:"address",ANNOTATION_XML:"annotation-xml",APPLET:"applet",AREA:"area",ARTICLE:"article",ASIDE:"aside",B:"b",BASE:"base",BASEFONT:"basefont",BGSOUND:"bgsound",BIG:"big",BLOCKQUOTE:"blockquote",BODY:"body",BR:"br",BUTTON:"button",CAPTION:"caption",CENTER:"center",CODE:"code",COL:"col",COLGROUP:"colgroup",DD:"dd",DESC:"desc",DETAILS:"details",DIALOG:"dialog",DIR:"dir",DIV:"div",DL:"dl",DT:"dt",EM:"em",EMBED:"embed",FIELDSET:"fieldset",FIGCAPTION:"figcaption",FIGURE:"figure",FONT:"font",FOOTER:"footer",FOREIGN_OBJECT:"foreignObject",FORM:"form",FRAME:"frame",FRAMESET:"frameset",H1:"h1",H2:"h2",H3:"h3",H4:"h4",H5:"h5",H6:"h6",HEAD:"head",HEADER:"header",HGROUP:"hgroup",HR:"hr",HTML:"html",I:"i",IMG:"img",IMAGE:"image",INPUT:"input",IFRAME:"iframe",KEYGEN:"keygen",LABEL:"label",LI:"li",LINK:"link",LISTING:"listing",MAIN:"main",MALIGNMARK:"malignmark",MARQUEE:"marquee",MATH:"math",MENU:"menu",META:"meta",MGLYPH:"mglyph",MI:"mi",MO:"mo",MN:"mn",MS:"ms",MTEXT:"mtext",NAV:"nav",NOBR:"nobr",NOFRAMES:"noframes",NOEMBED:"noembed",NOSCRIPT:"noscript",OBJECT:"object",OL:"ol",OPTGROUP:"optgroup",OPTION:"option",P:"p",PARAM:"param",PLAINTEXT:"plaintext",PRE:"pre",RB:"rb",RP:"rp",RT:"rt",RTC:"rtc",RUBY:"ruby",S:"s",SCRIPT:"script",SECTION:"section",SELECT:"select",SOURCE:"source",SMALL:"small",SPAN:"span",STRIKE:"strike",STRONG:"strong",STYLE:"style",SUB:"sub",SUMMARY:"summary",SUP:"sup",TABLE:"table",TBODY:"tbody",TEMPLATE:"template",TEXTAREA:"textarea",TFOOT:"tfoot",TD:"td",TH:"th",THEAD:"thead",TITLE:"title",TR:"tr",TRACK:"track",TT:"tt",U:"u",UL:"ul",SVG:"svg",VAR:"var",WBR:"wbr",XMP:"xmp"};t.SPECIAL_ELEMENTS={[n.HTML]:{[s.ADDRESS]:!0,[s.APPLET]:!0,[s.AREA]:!0,[s.ARTICLE]:!0,[s.ASIDE]:!0,[s.BASE]:!0,[s.BASEFONT]:!0,[s.BGSOUND]:!0,[s.BLOCKQUOTE]:!0,[s.BODY]:!0,[s.BR]:!0,[s.BUTTON]:!0,[s.CAPTION]:!0,[s.CENTER]:!0,[s.COL]:!0,[s.COLGROUP]:!0,[s.DD]:!0,[s.DETAILS]:!0,[s.DIR]:!0,[s.DIV]:!0,[s.DL]:!0,[s.DT]:!0,[s.EMBED]:!0,[s.FIELDSET]:!0,[s.FIGCAPTION]:!0,[s.FIGURE]:!0,[s.FOOTER]:!0,[s.FORM]:!0,[s.FRAME]:!0,[s.FRAMESET]:!0,[s.H1]:!0,[s.H2]:!0,[s.H3]:!0,[s.H4]:!0,[s.H5]:!0,[s.H6]:!0,[s.HEAD]:!0,[s.HEADER]:!0,[s.HGROUP]:!0,[s.HR]:!0,[s.HTML]:!0,[s.IFRAME]:!0,[s.IMG]:!0,[s.INPUT]:!0,[s.LI]:!0,[s.LINK]:!0,[s.LISTING]:!0,[s.MAIN]:!0,[s.MARQUEE]:!0,[s.MENU]:!0,[s.META]:!0,[s.NAV]:!0,[s.NOEMBED]:!0,[s.NOFRAMES]:!0,[s.NOSCRIPT]:!0,[s.OBJECT]:!0,[s.OL]:!0,[s.P]:!0,[s.PARAM]:!0,[s.PLAINTEXT]:!0,[s.PRE]:!0,[s.SCRIPT]:!0,[s.SECTION]:!0,[s.SELECT]:!0,[s.SOURCE]:!0,[s.STYLE]:!0,[s.SUMMARY]:!0,[s.TABLE]:!0,[s.TBODY]:!0,[s.TD]:!0,[s.TEMPLATE]:!0,[s.TEXTAREA]:!0,[s.TFOOT]:!0,[s.TH]:!0,[s.THEAD]:!0,[s.TITLE]:!0,[s.TR]:!0,[s.TRACK]:!0,[s.UL]:!0,[s.WBR]:!0,[s.XMP]:!0},[n.MATHML]:{[s.MI]:!0,[s.MO]:!0,[s.MN]:!0,[s.MS]:!0,[s.MTEXT]:!0,[s.ANNOTATION_XML]:!0},[n.SVG]:{[s.TITLE]:!0,[s.FOREIGN_OBJECT]:!0,[s.DESC]:!0}};}));const Ot=Ct.TAG_NAMES,ft=Ct.NAMESPACES;function St(e){switch(e.length){case 1:return e===Ot.P;case 2:return e===Ot.RB||e===Ot.RP||e===Ot.RT||e===Ot.DD||e===Ot.DT||e===Ot.LI;case 3:return e===Ot.RTC;case 6:return e===Ot.OPTION;case 8:return e===Ot.OPTGROUP}return !1}function Rt(e){switch(e.length){case 1:return e===Ot.P;case 2:return e===Ot.RB||e===Ot.RP||e===Ot.RT||e===Ot.DD||e===Ot.DT||e===Ot.LI||e===Ot.TD||e===Ot.TH||e===Ot.TR;case 3:return e===Ot.RTC;case 5:return e===Ot.TBODY||e===Ot.TFOOT||e===Ot.THEAD;case 6:return e===Ot.OPTION;case 7:return e===Ot.CAPTION;case 8:return e===Ot.OPTGROUP||e===Ot.COLGROUP}return !1}function It(e,t){switch(e.length){case 2:if(e===Ot.TD||e===Ot.TH)return t===ft.HTML;if(e===Ot.MI||e===Ot.MO||e===Ot.MN||e===Ot.MS)return t===ft.MATHML;break;case 4:if(e===Ot.HTML)return t===ft.HTML;if(e===Ot.DESC)return t===ft.SVG;break;case 5:if(e===Ot.TABLE)return t===ft.HTML;if(e===Ot.MTEXT)return t===ft.MATHML;if(e===Ot.TITLE)return t===ft.SVG;break;case 6:return (e===Ot.APPLET||e===Ot.OBJECT)&&t===ft.HTML;case 7:return (e===Ot.CAPTION||e===Ot.MARQUEE)&&t===ft.HTML;case 8:return e===Ot.TEMPLATE&&t===ft.HTML;case 13:return e===Ot.FOREIGN_OBJECT&&t===ft.SVG;case 14:return e===Ot.ANNOTATION_XML&&t===ft.MATHML}return !1}class Lt{constructor(e){this.length=0,this.entries=[],this.treeAdapter=e,this.bookmark=null;}_getNoahArkConditionCandidates(e){const t=[];if(this.length>=3){const n=this.treeAdapter.getAttrList(e).length,s=this.treeAdapter.getTagName(e),r=this.treeAdapter.getNamespaceURI(e);for(let e=this.length-1;e>=0;e--){const i=this.entries[e];if(i.type===Lt.MARKER_ENTRY)break;const o=i.element,a=this.treeAdapter.getAttrList(o);this.treeAdapter.getTagName(o)===s&&this.treeAdapter.getNamespaceURI(o)===r&&a.length===n&&t.push({idx:e,attrs:a});}}return t.length<3?[]:t}_ensureNoahArkCondition(e){const t=this._getNoahArkConditionCandidates(e);let n=t.length;if(n){const s=this.treeAdapter.getAttrList(e),r=s.length,i=Object.create(null);for(let e=0;e<r;e++){const t=s[e];i[t.name]=t.value;}for(let e=0;e<r;e++)for(let s=0;s<n;s++){const r=t[s].attrs[e];if(i[r.name]!==r.value&&(t.splice(s,1),n--),t.length<3)return}for(let e=n-1;e>=2;e--)this.entries.splice(t[e].idx,1),this.length--;}}insertMarker(){this.entries.push({type:Lt.MARKER_ENTRY}),this.length++;}pushElement(e,t){this._ensureNoahArkCondition(e),this.entries.push({type:Lt.ELEMENT_ENTRY,element:e,token:t}),this.length++;}insertElementAfterBookmark(e,t){let n=this.length-1;for(;n>=0&&this.entries[n]!==this.bookmark;n--);this.entries.splice(n+1,0,{type:Lt.ELEMENT_ENTRY,element:e,token:t}),this.length++;}removeEntry(e){for(let t=this.length-1;t>=0;t--)if(this.entries[t]===e){this.entries.splice(t,1),this.length--;break}}clearToLastMarker(){for(;this.length;){const e=this.entries.pop();if(this.length--,e.type===Lt.MARKER_ENTRY)break}}getElementEntryInScopeWithTagName(e){for(let t=this.length-1;t>=0;t--){const n=this.entries[t];if(n.type===Lt.MARKER_ENTRY)return null;if(this.treeAdapter.getTagName(n.element)===e)return n}return null}getElementEntry(e){for(let t=this.length-1;t>=0;t--){const n=this.entries[t];if(n.type===Lt.ELEMENT_ENTRY&&n.element===e)return n}return null}}Lt.MARKER_ENTRY="MARKER_ENTRY",Lt.ELEMENT_ENTRY="ELEMENT_ENTRY";var kt=Lt;class Mt{constructor(e){const t={},n=this._getOverriddenMethods(this,t);for(const s of Object.keys(n))"function"==typeof n[s]&&(t[s]=e[s],e[s]=n[s]);}_getOverriddenMethods(){throw new Error("Not implemented")}}Mt.install=function(e,t,n){e.__mixins||(e.__mixins=[]);for(let n=0;n<e.__mixins.length;n++)if(e.__mixins[n].constructor===t)return e.__mixins[n];const s=new t(e,n);return e.__mixins.push(s),s};var gt=Mt,Pt=class extends gt{constructor(e){super(e),this.preprocessor=e,this.isEol=!1,this.lineStartPos=0,this.droppedBufferSize=0,this.offset=0,this.col=0,this.line=1;}_getOverriddenMethods(e,t){return {advance(){const n=this.pos+1,s=this.html[n];return e.isEol&&(e.isEol=!1,e.line++,e.lineStartPos=n),("\n"===s||"\r"===s&&"\n"!==this.html[n+1])&&(e.isEol=!0),e.col=n-e.lineStartPos+1,e.offset=e.droppedBufferSize+n,t.advance.call(this)},retreat(){t.retreat.call(this),e.isEol=!1,e.col=this.pos-e.lineStartPos+1;},dropParsedChunk(){const n=this.pos;t.dropParsedChunk.call(this);const s=n-this.pos;e.lineStartPos-=s,e.droppedBufferSize+=s,e.offset=e.droppedBufferSize+this.pos;}}}},Ht=class extends gt{constructor(e){super(e),this.tokenizer=e,this.posTracker=gt.install(e.preprocessor,Pt),this.currentAttrLocation=null,this.ctLoc=null;}_getCurrentLocation(){return {startLine:this.posTracker.line,startCol:this.posTracker.col,startOffset:this.posTracker.offset,endLine:-1,endCol:-1,endOffset:-1}}_attachCurrentAttrLocationInfo(){this.currentAttrLocation.endLine=this.posTracker.line,this.currentAttrLocation.endCol=this.posTracker.col,this.currentAttrLocation.endOffset=this.posTracker.offset;const e=this.tokenizer.currentToken,t=this.tokenizer.currentAttr;e.location.attrs||(e.location.attrs=Object.create(null)),e.location.attrs[t.name]=this.currentAttrLocation;}_getOverriddenMethods(e,t){const n={_createStartTagToken(){t._createStartTagToken.call(this),this.currentToken.location=e.ctLoc;},_createEndTagToken(){t._createEndTagToken.call(this),this.currentToken.location=e.ctLoc;},_createCommentToken(){t._createCommentToken.call(this),this.currentToken.location=e.ctLoc;},_createDoctypeToken(n){t._createDoctypeToken.call(this,n),this.currentToken.location=e.ctLoc;},_createCharacterToken(n,s){t._createCharacterToken.call(this,n,s),this.currentCharacterToken.location=e.ctLoc;},_createEOFToken(){t._createEOFToken.call(this),this.currentToken.location=e._getCurrentLocation();},_createAttr(n){t._createAttr.call(this,n),e.currentAttrLocation=e._getCurrentLocation();},_leaveAttrName(n){t._leaveAttrName.call(this,n),e._attachCurrentAttrLocationInfo();},_leaveAttrValue(n){t._leaveAttrValue.call(this,n),e._attachCurrentAttrLocationInfo();},_emitCurrentToken(){const n=this.currentToken.location;this.currentCharacterToken&&(this.currentCharacterToken.location.endLine=n.startLine,this.currentCharacterToken.location.endCol=n.startCol,this.currentCharacterToken.location.endOffset=n.startOffset),this.currentToken.type===Nt.EOF_TOKEN?(n.endLine=n.startLine,n.endCol=n.startCol,n.endOffset=n.startOffset):(n.endLine=e.posTracker.line,n.endCol=e.posTracker.col+1,n.endOffset=e.posTracker.offset+1),t._emitCurrentToken.call(this);},_emitCurrentCharacterToken(){const n=this.currentCharacterToken&&this.currentCharacterToken.location;n&&-1===n.endOffset&&(n.endLine=e.posTracker.line,n.endCol=e.posTracker.col,n.endOffset=e.posTracker.offset),t._emitCurrentCharacterToken.call(this);}};return Object.keys(Nt.MODE).forEach((s=>{const r=Nt.MODE[s];n[r]=function(n){e.ctLoc=e._getCurrentLocation(),t[r].call(this,n);};})),n}},Dt=class extends gt{constructor(e,t){super(e),this.onItemPop=t.onItemPop;}_getOverriddenMethods(e,t){return {pop(){e.onItemPop(this.current),t.pop.call(this);},popAllUpToHtmlElement(){for(let t=this.stackTop;t>0;t--)e.onItemPop(this.items[t]);t.popAllUpToHtmlElement.call(this);},remove(n){e.onItemPop(this.current),t.remove.call(this,n);}}}};const Ft=Ct.TAG_NAMES;var Ut=class extends gt{constructor(e){super(e),this.parser=e,this.treeAdapter=this.parser.treeAdapter,this.posTracker=null,this.lastStartTagToken=null,this.lastFosterParentingLocation=null,this.currentToken=null;}_setStartLocation(e){let t=null;this.lastStartTagToken&&(t=Object.assign({},this.lastStartTagToken.location),t.startTag=this.lastStartTagToken.location),this.treeAdapter.setNodeSourceCodeLocation(e,t);}_setEndLocation(e,t){if(this.treeAdapter.getNodeSourceCodeLocation(e)&&t.location){const n=t.location,s=this.treeAdapter.getTagName(e),r={};t.type===Nt.END_TAG_TOKEN&&s===t.tagName?(r.endTag=Object.assign({},n),r.endLine=n.endLine,r.endCol=n.endCol,r.endOffset=n.endOffset):(r.endLine=n.startLine,r.endCol=n.startCol,r.endOffset=n.startOffset),this.treeAdapter.updateNodeSourceCodeLocation(e,r);}}_getOverriddenMethods(e,t){return {_bootstrap(n,s){t._bootstrap.call(this,n,s),e.lastStartTagToken=null,e.lastFosterParentingLocation=null,e.currentToken=null;const r=gt.install(this.tokenizer,Ht);e.posTracker=r.posTracker,gt.install(this.openElements,Dt,{onItemPop:function(t){e._setEndLocation(t,e.currentToken);}});},_runParsingLoop(n){t._runParsingLoop.call(this,n);for(let t=this.openElements.stackTop;t>=0;t--)e._setEndLocation(this.openElements.items[t],e.currentToken);},_processTokenInForeignContent(n){e.currentToken=n,t._processTokenInForeignContent.call(this,n);},_processToken(n){if(e.currentToken=n,t._processToken.call(this,n),n.type===Nt.END_TAG_TOKEN&&(n.tagName===Ft.HTML||n.tagName===Ft.BODY&&this.openElements.hasInScope(Ft.BODY)))for(let t=this.openElements.stackTop;t>=0;t--){const s=this.openElements.items[t];if(this.treeAdapter.getTagName(s)===n.tagName){e._setEndLocation(s,n);break}}},_setDocumentType(e){t._setDocumentType.call(this,e);const n=this.treeAdapter.getChildNodes(this.document),s=n.length;for(let t=0;t<s;t++){const s=n[t];if(this.treeAdapter.isDocumentTypeNode(s)){this.treeAdapter.setNodeSourceCodeLocation(s,e.location);break}}},_attachElementToTree(n){e._setStartLocation(n),e.lastStartTagToken=null,t._attachElementToTree.call(this,n);},_appendElement(n,s){e.lastStartTagToken=n,t._appendElement.call(this,n,s);},_insertElement(n,s){e.lastStartTagToken=n,t._insertElement.call(this,n,s);},_insertTemplate(n){e.lastStartTagToken=n,t._insertTemplate.call(this,n);const s=this.treeAdapter.getTemplateContent(this.openElements.current);this.treeAdapter.setNodeSourceCodeLocation(s,null);},_insertFakeRootElement(){t._insertFakeRootElement.call(this),this.treeAdapter.setNodeSourceCodeLocation(this.openElements.current,null);},_appendCommentNode(e,n){t._appendCommentNode.call(this,e,n);const s=this.treeAdapter.getChildNodes(n),r=s[s.length-1];this.treeAdapter.setNodeSourceCodeLocation(r,e.location);},_findFosterParentingLocation(){return e.lastFosterParentingLocation=t._findFosterParentingLocation.call(this),e.lastFosterParentingLocation},_insertCharacters(n){t._insertCharacters.call(this,n);const s=this._shouldFosterParentOnInsertion(),r=s&&e.lastFosterParentingLocation.parent||this.openElements.currentTmplContent||this.openElements.current,i=this.treeAdapter.getChildNodes(r),o=s&&e.lastFosterParentingLocation.beforeElement?i.indexOf(e.lastFosterParentingLocation.beforeElement)-1:i.length-1,a=i[o];if(this.treeAdapter.getNodeSourceCodeLocation(a)){const{endLine:e,endCol:t,endOffset:s}=n.location;this.treeAdapter.updateNodeSourceCodeLocation(a,{endLine:e,endCol:t,endOffset:s});}else this.treeAdapter.setNodeSourceCodeLocation(a,n.location);}}}},Gt=class extends gt{constructor(e,t){super(e),this.posTracker=null,this.onParseError=t.onParseError;}_setErrorLocation(e){e.startLine=e.endLine=this.posTracker.line,e.startCol=e.endCol=this.posTracker.col,e.startOffset=e.endOffset=this.posTracker.offset;}_reportError(e){const t={code:e,startLine:-1,startCol:-1,startOffset:-1,endLine:-1,endCol:-1,endOffset:-1};this._setErrorLocation(t),this.onParseError(t);}_getOverriddenMethods(e){return {_err(t){e._reportError(t);}}}},Bt=class extends Gt{constructor(e,t){super(e,t),this.posTracker=gt.install(e,Pt),this.lastErrOffset=-1;}_reportError(e){this.lastErrOffset!==this.posTracker.offset&&(this.lastErrOffset=this.posTracker.offset,super._reportError(e));}},Kt=class extends Gt{constructor(e,t){super(e,t);const n=gt.install(e.preprocessor,Bt,t);this.posTracker=n.posTracker;}},bt=class extends Gt{constructor(e,t){super(e,t),this.opts=t,this.ctLoc=null,this.locBeforeToken=!1;}_setErrorLocation(e){this.ctLoc&&(e.startLine=this.ctLoc.startLine,e.startCol=this.ctLoc.startCol,e.startOffset=this.ctLoc.startOffset,e.endLine=this.locBeforeToken?this.ctLoc.startLine:this.ctLoc.endLine,e.endCol=this.locBeforeToken?this.ctLoc.startCol:this.ctLoc.endCol,e.endOffset=this.locBeforeToken?this.ctLoc.startOffset:this.ctLoc.endOffset);}_getOverriddenMethods(e,t){return {_bootstrap(n,s){t._bootstrap.call(this,n,s),gt.install(this.tokenizer,Kt,e.opts),gt.install(this.tokenizer,Ht);},_processInputToken(n){e.ctLoc=n.location,t._processInputToken.call(this,n);},_err(t,n){e.locBeforeToken=n&&n.beforeToken,e._reportError(t);}}}},xt=dt((function(e,t){const{DOCUMENT_MODE:n}=Ct;t.createDocument=function(){return {nodeName:"#document",mode:n.NO_QUIRKS,childNodes:[]}},t.createDocumentFragment=function(){return {nodeName:"#document-fragment",childNodes:[]}},t.createElement=function(e,t,n){return {nodeName:e,tagName:e,attrs:n,namespaceURI:t,childNodes:[],parentNode:null}},t.createCommentNode=function(e){return {nodeName:"#comment",data:e,parentNode:null}};const s=function(e){return {nodeName:"#text",value:e,parentNode:null}},r=t.appendChild=function(e,t){e.childNodes.push(t),t.parentNode=e;},i=t.insertBefore=function(e,t,n){const s=e.childNodes.indexOf(n);e.childNodes.splice(s,0,t),t.parentNode=e;};t.setTemplateContent=function(e,t){e.content=t;},t.getTemplateContent=function(e){return e.content},t.setDocumentType=function(e,t,n,s){let i=null;for(let t=0;t<e.childNodes.length;t++)if("#documentType"===e.childNodes[t].nodeName){i=e.childNodes[t];break}i?(i.name=t,i.publicId=n,i.systemId=s):r(e,{nodeName:"#documentType",name:t,publicId:n,systemId:s});},t.setDocumentMode=function(e,t){e.mode=t;},t.getDocumentMode=function(e){return e.mode},t.detachNode=function(e){if(e.parentNode){const t=e.parentNode.childNodes.indexOf(e);e.parentNode.childNodes.splice(t,1),e.parentNode=null;}},t.insertText=function(e,t){if(e.childNodes.length){const n=e.childNodes[e.childNodes.length-1];if("#text"===n.nodeName)return void(n.value+=t)}r(e,s(t));},t.insertTextBefore=function(e,t,n){const r=e.childNodes[e.childNodes.indexOf(n)-1];r&&"#text"===r.nodeName?r.value+=t:i(e,s(t),n);},t.adoptAttributes=function(e,t){const n=[];for(let t=0;t<e.attrs.length;t++)n.push(e.attrs[t].name);for(let s=0;s<t.length;s++)-1===n.indexOf(t[s].name)&&e.attrs.push(t[s]);},t.getFirstChild=function(e){return e.childNodes[0]},t.getChildNodes=function(e){return e.childNodes},t.getParentNode=function(e){return e.parentNode},t.getAttrList=function(e){return e.attrs},t.getTagName=function(e){return e.tagName},t.getNamespaceURI=function(e){return e.namespaceURI},t.getTextNodeContent=function(e){return e.value},t.getCommentNodeContent=function(e){return e.data},t.getDocumentTypeNodeName=function(e){return e.name},t.getDocumentTypeNodePublicId=function(e){return e.publicId},t.getDocumentTypeNodeSystemId=function(e){return e.systemId},t.isTextNode=function(e){return "#text"===e.nodeName},t.isCommentNode=function(e){return "#comment"===e.nodeName},t.isDocumentTypeNode=function(e){return "#documentType"===e.nodeName},t.isElementNode=function(e){return !!e.tagName},t.setNodeSourceCodeLocation=function(e,t){e.sourceCodeLocation=t;},t.getNodeSourceCodeLocation=function(e){return e.sourceCodeLocation},t.updateNodeSourceCodeLocation=function(e,t){e.sourceCodeLocation=Object.assign(e.sourceCodeLocation,t);};}));const{DOCUMENT_MODE:yt}=Ct,vt="html",Yt=["+//silmaril//dtd html pro v0r11 19970101//","-//as//dtd html 3.0 aswedit + extensions//","-//advasoft ltd//dtd html 3.0 aswedit + extensions//","-//ietf//dtd html 2.0 level 1//","-//ietf//dtd html 2.0 level 2//","-//ietf//dtd html 2.0 strict level 1//","-//ietf//dtd html 2.0 strict level 2//","-//ietf//dtd html 2.0 strict//","-//ietf//dtd html 2.0//","-//ietf//dtd html 2.1e//","-//ietf//dtd html 3.0//","-//ietf//dtd html 3.2 final//","-//ietf//dtd html 3.2//","-//ietf//dtd html 3//","-//ietf//dtd html level 0//","-//ietf//dtd html level 1//","-//ietf//dtd html level 2//","-//ietf//dtd html level 3//","-//ietf//dtd html strict level 0//","-//ietf//dtd html strict level 1//","-//ietf//dtd html strict level 2//","-//ietf//dtd html strict level 3//","-//ietf//dtd html strict//","-//ietf//dtd html//","-//metrius//dtd metrius presentational//","-//microsoft//dtd internet explorer 2.0 html strict//","-//microsoft//dtd internet explorer 2.0 html//","-//microsoft//dtd internet explorer 2.0 tables//","-//microsoft//dtd internet explorer 3.0 html strict//","-//microsoft//dtd internet explorer 3.0 html//","-//microsoft//dtd internet explorer 3.0 tables//","-//netscape comm. corp.//dtd html//","-//netscape comm. corp.//dtd strict html//","-//o'reilly and associates//dtd html 2.0//","-//o'reilly and associates//dtd html extended 1.0//","-//o'reilly and associates//dtd html extended relaxed 1.0//","-//sq//dtd html 2.0 hotmetal + extensions//","-//softquad software//dtd hotmetal pro 6.0::19990601::extensions to html 4.0//","-//softquad//dtd hotmetal pro 4.0::19971010::extensions to html 4.0//","-//spyglass//dtd html 2.0 extended//","-//sun microsystems corp.//dtd hotjava html//","-//sun microsystems corp.//dtd hotjava strict html//","-//w3c//dtd html 3 1995-03-24//","-//w3c//dtd html 3.2 draft//","-//w3c//dtd html 3.2 final//","-//w3c//dtd html 3.2//","-//w3c//dtd html 3.2s draft//","-//w3c//dtd html 4.0 frameset//","-//w3c//dtd html 4.0 transitional//","-//w3c//dtd html experimental 19960712//","-//w3c//dtd html experimental 970421//","-//w3c//dtd w3 html//","-//w3o//dtd w3 html 3.0//","-//webtechs//dtd mozilla html 2.0//","-//webtechs//dtd mozilla html//"],wt=Yt.concat(["-//w3c//dtd html 4.01 frameset//","-//w3c//dtd html 4.01 transitional//"]),Qt=["-//w3o//dtd w3 html strict 3.0//en//","-/w3c/dtd html 4.0 transitional/en","html"],Xt=["-//w3c//dtd xhtml 1.0 frameset//","-//w3c//dtd xhtml 1.0 transitional//"],Wt=Xt.concat(["-//w3c//dtd html 4.01 frameset//","-//w3c//dtd html 4.01 transitional//"]);function Vt(e,t){for(let n=0;n<t.length;n++)if(0===e.indexOf(t[n]))return !0;return !1}var jt=dt((function(e,t){const n=Ct.TAG_NAMES,s=Ct.NAMESPACES,r=Ct.ATTRS,i={attributename:"attributeName",attributetype:"attributeType",basefrequency:"baseFrequency",baseprofile:"baseProfile",calcmode:"calcMode",clippathunits:"clipPathUnits",diffuseconstant:"diffuseConstant",edgemode:"edgeMode",filterunits:"filterUnits",glyphref:"glyphRef",gradienttransform:"gradientTransform",gradientunits:"gradientUnits",kernelmatrix:"kernelMatrix",kernelunitlength:"kernelUnitLength",keypoints:"keyPoints",keysplines:"keySplines",keytimes:"keyTimes",lengthadjust:"lengthAdjust",limitingconeangle:"limitingConeAngle",markerheight:"markerHeight",markerunits:"markerUnits",markerwidth:"markerWidth",maskcontentunits:"maskContentUnits",maskunits:"maskUnits",numoctaves:"numOctaves",pathlength:"pathLength",patterncontentunits:"patternContentUnits",patterntransform:"patternTransform",patternunits:"patternUnits",pointsatx:"pointsAtX",pointsaty:"pointsAtY",pointsatz:"pointsAtZ",preservealpha:"preserveAlpha",preserveaspectratio:"preserveAspectRatio",primitiveunits:"primitiveUnits",refx:"refX",refy:"refY",repeatcount:"repeatCount",repeatdur:"repeatDur",requiredextensions:"requiredExtensions",requiredfeatures:"requiredFeatures",specularconstant:"specularConstant",specularexponent:"specularExponent",spreadmethod:"spreadMethod",startoffset:"startOffset",stddeviation:"stdDeviation",stitchtiles:"stitchTiles",surfacescale:"surfaceScale",systemlanguage:"systemLanguage",tablevalues:"tableValues",targetx:"targetX",targety:"targetY",textlength:"textLength",viewbox:"viewBox",viewtarget:"viewTarget",xchannelselector:"xChannelSelector",ychannelselector:"yChannelSelector",zoomandpan:"zoomAndPan"},o={"xlink:actuate":{prefix:"xlink",name:"actuate",namespace:s.XLINK},"xlink:arcrole":{prefix:"xlink",name:"arcrole",namespace:s.XLINK},"xlink:href":{prefix:"xlink",name:"href",namespace:s.XLINK},"xlink:role":{prefix:"xlink",name:"role",namespace:s.XLINK},"xlink:show":{prefix:"xlink",name:"show",namespace:s.XLINK},"xlink:title":{prefix:"xlink",name:"title",namespace:s.XLINK},"xlink:type":{prefix:"xlink",name:"type",namespace:s.XLINK},"xml:base":{prefix:"xml",name:"base",namespace:s.XML},"xml:lang":{prefix:"xml",name:"lang",namespace:s.XML},"xml:space":{prefix:"xml",name:"space",namespace:s.XML},xmlns:{prefix:"",name:"xmlns",namespace:s.XMLNS},"xmlns:xlink":{prefix:"xmlns",name:"xlink",namespace:s.XMLNS}},a=t.SVG_TAG_NAMES_ADJUSTMENT_MAP={altglyph:"altGlyph",altglyphdef:"altGlyphDef",altglyphitem:"altGlyphItem",animatecolor:"animateColor",animatemotion:"animateMotion",animatetransform:"animateTransform",clippath:"clipPath",feblend:"feBlend",fecolormatrix:"feColorMatrix",fecomponenttransfer:"feComponentTransfer",fecomposite:"feComposite",feconvolvematrix:"feConvolveMatrix",fediffuselighting:"feDiffuseLighting",fedisplacementmap:"feDisplacementMap",fedistantlight:"feDistantLight",feflood:"feFlood",fefunca:"feFuncA",fefuncb:"feFuncB",fefuncg:"feFuncG",fefuncr:"feFuncR",fegaussianblur:"feGaussianBlur",feimage:"feImage",femerge:"feMerge",femergenode:"feMergeNode",femorphology:"feMorphology",feoffset:"feOffset",fepointlight:"fePointLight",fespecularlighting:"feSpecularLighting",fespotlight:"feSpotLight",fetile:"feTile",feturbulence:"feTurbulence",foreignobject:"foreignObject",glyphref:"glyphRef",lineargradient:"linearGradient",radialgradient:"radialGradient",textpath:"textPath"},T={[n.B]:!0,[n.BIG]:!0,[n.BLOCKQUOTE]:!0,[n.BODY]:!0,[n.BR]:!0,[n.CENTER]:!0,[n.CODE]:!0,[n.DD]:!0,[n.DIV]:!0,[n.DL]:!0,[n.DT]:!0,[n.EM]:!0,[n.EMBED]:!0,[n.H1]:!0,[n.H2]:!0,[n.H3]:!0,[n.H4]:!0,[n.H5]:!0,[n.H6]:!0,[n.HEAD]:!0,[n.HR]:!0,[n.I]:!0,[n.IMG]:!0,[n.LI]:!0,[n.LISTING]:!0,[n.MENU]:!0,[n.META]:!0,[n.NOBR]:!0,[n.OL]:!0,[n.P]:!0,[n.PRE]:!0,[n.RUBY]:!0,[n.S]:!0,[n.SMALL]:!0,[n.SPAN]:!0,[n.STRONG]:!0,[n.STRIKE]:!0,[n.SUB]:!0,[n.SUP]:!0,[n.TABLE]:!0,[n.TT]:!0,[n.U]:!0,[n.UL]:!0,[n.VAR]:!0};t.causesExit=function(e){const t=e.tagName;return !(t!==n.FONT||null===Nt.getTokenAttr(e,r.COLOR)&&null===Nt.getTokenAttr(e,r.SIZE)&&null===Nt.getTokenAttr(e,r.FACE))||T[t]},t.adjustTokenMathMLAttrs=function(e){for(let t=0;t<e.attrs.length;t++)if("definitionurl"===e.attrs[t].name){e.attrs[t].name="definitionURL";break}},t.adjustTokenSVGAttrs=function(e){for(let t=0;t<e.attrs.length;t++){const n=i[e.attrs[t].name];n&&(e.attrs[t].name=n);}},t.adjustTokenXMLAttrs=function(e){for(let t=0;t<e.attrs.length;t++){const n=o[e.attrs[t].name];n&&(e.attrs[t].prefix=n.prefix,e.attrs[t].name=n.name,e.attrs[t].namespace=n.namespace);}},t.adjustTokenSVGTagName=function(e){const t=a[e.tagName];t&&(e.tagName=t);},t.isIntegrationPoint=function(e,t,i,o){return !(o&&o!==s.HTML||!function(e,t,i){if(t===s.MATHML&&e===n.ANNOTATION_XML)for(let e=0;e<i.length;e++)if(i[e].name===r.ENCODING){const t=i[e].value.toLowerCase();return "text/html"===t||"application/xhtml+xml"===t}return t===s.SVG&&(e===n.FOREIGN_OBJECT||e===n.DESC||e===n.TITLE)}(e,t,i))||!(o&&o!==s.MATHML||!function(e,t){return t===s.MATHML&&(e===n.MI||e===n.MO||e===n.MN||e===n.MS||e===n.MTEXT)}(e,t))};}));const zt=Ct.TAG_NAMES,qt=Ct.NAMESPACES,Jt=Ct.ATTRS,Zt={scriptingEnabled:!0,sourceCodeLocationInfo:!1,onParseError:null,treeAdapter:xt},$t="hidden",en="INITIAL_MODE",tn="BEFORE_HTML_MODE",nn="BEFORE_HEAD_MODE",sn="IN_HEAD_MODE",rn="IN_HEAD_NO_SCRIPT_MODE",on="AFTER_HEAD_MODE",an="IN_BODY_MODE",Tn="TEXT_MODE",En="IN_TABLE_MODE",hn="IN_TABLE_TEXT_MODE",cn="IN_CAPTION_MODE",_n="IN_COLUMN_GROUP_MODE",ln="IN_TABLE_BODY_MODE",mn="IN_ROW_MODE",pn="IN_CELL_MODE",An="IN_SELECT_MODE",un="IN_SELECT_IN_TABLE_MODE",Nn="IN_TEMPLATE_MODE",dn="AFTER_BODY_MODE",Cn="IN_FRAMESET_MODE",On="AFTER_FRAMESET_MODE",fn="AFTER_AFTER_BODY_MODE",Sn="AFTER_AFTER_FRAMESET_MODE",Rn={[zt.TR]:mn,[zt.TBODY]:ln,[zt.THEAD]:ln,[zt.TFOOT]:ln,[zt.CAPTION]:cn,[zt.COLGROUP]:_n,[zt.TABLE]:En,[zt.BODY]:an,[zt.FRAMESET]:Cn},In={[zt.CAPTION]:En,[zt.COLGROUP]:En,[zt.TBODY]:En,[zt.TFOOT]:En,[zt.THEAD]:En,[zt.COL]:_n,[zt.TR]:ln,[zt.TD]:mn,[zt.TH]:mn},Ln={[en]:{[Nt.CHARACTER_TOKEN]:vn,[Nt.NULL_CHARACTER_TOKEN]:vn,[Nt.WHITESPACE_CHARACTER_TOKEN]:Gn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:function(e,t){e._setDocumentType(t);const n=t.forceQuirks?Ct.DOCUMENT_MODE.QUIRKS:function(e){if(e.name!==vt)return yt.QUIRKS;const t=e.systemId;if(t&&"http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dtd"===t.toLowerCase())return yt.QUIRKS;let n=e.publicId;if(null!==n){if(n=n.toLowerCase(),Qt.indexOf(n)>-1)return yt.QUIRKS;let e=null===t?wt:Yt;if(Vt(n,e))return yt.QUIRKS;if(e=null===t?Xt:Wt,Vt(n,e))return yt.LIMITED_QUIRKS}return yt.NO_QUIRKS}(t);(function(e){return e.name===vt&&null===e.publicId&&(null===e.systemId||"about:legacy-compat"===e.systemId)})(t)||e._err("non-conforming-doctype"),e.treeAdapter.setDocumentMode(e.document,n),e.insertionMode=tn;},[Nt.START_TAG_TOKEN]:vn,[Nt.END_TAG_TOKEN]:vn,[Nt.EOF_TOKEN]:vn},[tn]:{[Nt.CHARACTER_TOKEN]:Yn,[Nt.NULL_CHARACTER_TOKEN]:Yn,[Nt.WHITESPACE_CHARACTER_TOKEN]:Gn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){t.tagName===zt.HTML?(e._insertElement(t,qt.HTML),e.insertionMode=nn):Yn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n!==zt.HTML&&n!==zt.HEAD&&n!==zt.BODY&&n!==zt.BR||Yn(e,t);},[Nt.EOF_TOKEN]:Yn},[nn]:{[Nt.CHARACTER_TOKEN]:wn,[Nt.NULL_CHARACTER_TOKEN]:wn,[Nt.WHITESPACE_CHARACTER_TOKEN]:Gn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Bn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.HEAD?(e._insertElement(t,qt.HTML),e.headElement=e.openElements.current,e.insertionMode=sn):wn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HEAD||n===zt.BODY||n===zt.HTML||n===zt.BR?wn(e,t):e._err(L);},[Nt.EOF_TOKEN]:wn},[sn]:{[Nt.CHARACTER_TOKEN]:Wn,[Nt.NULL_CHARACTER_TOKEN]:Wn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Bn,[Nt.START_TAG_TOKEN]:Qn,[Nt.END_TAG_TOKEN]:Xn,[Nt.EOF_TOKEN]:Wn},[rn]:{[Nt.CHARACTER_TOKEN]:Vn,[Nt.NULL_CHARACTER_TOKEN]:Vn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Bn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.BASEFONT||n===zt.BGSOUND||n===zt.HEAD||n===zt.LINK||n===zt.META||n===zt.NOFRAMES||n===zt.STYLE?Qn(e,t):n===zt.NOSCRIPT?e._err("nested-noscript-in-head"):Vn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.NOSCRIPT?(e.openElements.pop(),e.insertionMode=sn):n===zt.BR?Vn(e,t):e._err(L);},[Nt.EOF_TOKEN]:Vn},[on]:{[Nt.CHARACTER_TOKEN]:jn,[Nt.NULL_CHARACTER_TOKEN]:jn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Bn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.BODY?(e._insertElement(t,qt.HTML),e.framesetOk=!1,e.insertionMode=an):n===zt.FRAMESET?(e._insertElement(t,qt.HTML),e.insertionMode=Cn):n===zt.BASE||n===zt.BASEFONT||n===zt.BGSOUND||n===zt.LINK||n===zt.META||n===zt.NOFRAMES||n===zt.SCRIPT||n===zt.STYLE||n===zt.TEMPLATE||n===zt.TITLE?(e._err("abandoned-head-element-child"),e.openElements.push(e.headElement),Qn(e,t),e.openElements.remove(e.headElement)):n===zt.HEAD?e._err(k):jn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.BODY||n===zt.HTML||n===zt.BR?jn(e,t):n===zt.TEMPLATE?Xn(e,t):e._err(L);},[Nt.EOF_TOKEN]:jn},[an]:{[Nt.CHARACTER_TOKEN]:qn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:as,[Nt.END_TAG_TOKEN]:cs,[Nt.EOF_TOKEN]:_s},[Tn]:{[Nt.CHARACTER_TOKEN]:xn,[Nt.NULL_CHARACTER_TOKEN]:xn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Gn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:Gn,[Nt.END_TAG_TOKEN]:function(e,t){t.tagName===zt.SCRIPT&&(e.pendingScript=e.openElements.current),e.openElements.pop(),e.insertionMode=e.originalInsertionMode;},[Nt.EOF_TOKEN]:function(e,t){e._err("eof-in-element-that-can-contain-only-text"),e.openElements.pop(),e.insertionMode=e.originalInsertionMode,e._processToken(t);}},[En]:{[Nt.CHARACTER_TOKEN]:ls,[Nt.NULL_CHARACTER_TOKEN]:ls,[Nt.WHITESPACE_CHARACTER_TOKEN]:ls,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:ms,[Nt.END_TAG_TOKEN]:ps,[Nt.EOF_TOKEN]:_s},[hn]:{[Nt.CHARACTER_TOKEN]:function(e,t){e.pendingCharacterTokens.push(t),e.hasNonWhitespacePendingCharacterToken=!0;},[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:function(e,t){e.pendingCharacterTokens.push(t);},[Nt.COMMENT_TOKEN]:us,[Nt.DOCTYPE_TOKEN]:us,[Nt.START_TAG_TOKEN]:us,[Nt.END_TAG_TOKEN]:us,[Nt.EOF_TOKEN]:us},[cn]:{[Nt.CHARACTER_TOKEN]:qn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.CAPTION||n===zt.COL||n===zt.COLGROUP||n===zt.TBODY||n===zt.TD||n===zt.TFOOT||n===zt.TH||n===zt.THEAD||n===zt.TR?e.openElements.hasInTableScope(zt.CAPTION)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(zt.CAPTION),e.activeFormattingElements.clearToLastMarker(),e.insertionMode=En,e._processToken(t)):as(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.CAPTION||n===zt.TABLE?e.openElements.hasInTableScope(zt.CAPTION)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(zt.CAPTION),e.activeFormattingElements.clearToLastMarker(),e.insertionMode=En,n===zt.TABLE&&e._processToken(t)):n!==zt.BODY&&n!==zt.COL&&n!==zt.COLGROUP&&n!==zt.HTML&&n!==zt.TBODY&&n!==zt.TD&&n!==zt.TFOOT&&n!==zt.TH&&n!==zt.THEAD&&n!==zt.TR&&cs(e,t);},[Nt.EOF_TOKEN]:_s},[_n]:{[Nt.CHARACTER_TOKEN]:Ns,[Nt.NULL_CHARACTER_TOKEN]:Ns,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.COL?(e._appendElement(t,qt.HTML),t.ackSelfClosing=!0):n===zt.TEMPLATE?Qn(e,t):Ns(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.COLGROUP?e.openElements.currentTagName===zt.COLGROUP&&(e.openElements.pop(),e.insertionMode=En):n===zt.TEMPLATE?Xn(e,t):n!==zt.COL&&Ns(e,t);},[Nt.EOF_TOKEN]:_s},[ln]:{[Nt.CHARACTER_TOKEN]:ls,[Nt.NULL_CHARACTER_TOKEN]:ls,[Nt.WHITESPACE_CHARACTER_TOKEN]:ls,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.TR?(e.openElements.clearBackToTableBodyContext(),e._insertElement(t,qt.HTML),e.insertionMode=mn):n===zt.TH||n===zt.TD?(e.openElements.clearBackToTableBodyContext(),e._insertFakeElement(zt.TR),e.insertionMode=mn,e._processToken(t)):n===zt.CAPTION||n===zt.COL||n===zt.COLGROUP||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD?e.openElements.hasTableBodyContextInTableScope()&&(e.openElements.clearBackToTableBodyContext(),e.openElements.pop(),e.insertionMode=En,e._processToken(t)):ms(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD?e.openElements.hasInTableScope(n)&&(e.openElements.clearBackToTableBodyContext(),e.openElements.pop(),e.insertionMode=En):n===zt.TABLE?e.openElements.hasTableBodyContextInTableScope()&&(e.openElements.clearBackToTableBodyContext(),e.openElements.pop(),e.insertionMode=En,e._processToken(t)):(n!==zt.BODY&&n!==zt.CAPTION&&n!==zt.COL&&n!==zt.COLGROUP||n!==zt.HTML&&n!==zt.TD&&n!==zt.TH&&n!==zt.TR)&&ps(e,t);},[Nt.EOF_TOKEN]:_s},[mn]:{[Nt.CHARACTER_TOKEN]:ls,[Nt.NULL_CHARACTER_TOKEN]:ls,[Nt.WHITESPACE_CHARACTER_TOKEN]:ls,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.TH||n===zt.TD?(e.openElements.clearBackToTableRowContext(),e._insertElement(t,qt.HTML),e.insertionMode=pn,e.activeFormattingElements.insertMarker()):n===zt.CAPTION||n===zt.COL||n===zt.COLGROUP||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD||n===zt.TR?e.openElements.hasInTableScope(zt.TR)&&(e.openElements.clearBackToTableRowContext(),e.openElements.pop(),e.insertionMode=ln,e._processToken(t)):ms(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.TR?e.openElements.hasInTableScope(zt.TR)&&(e.openElements.clearBackToTableRowContext(),e.openElements.pop(),e.insertionMode=ln):n===zt.TABLE?e.openElements.hasInTableScope(zt.TR)&&(e.openElements.clearBackToTableRowContext(),e.openElements.pop(),e.insertionMode=ln,e._processToken(t)):n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD?(e.openElements.hasInTableScope(n)||e.openElements.hasInTableScope(zt.TR))&&(e.openElements.clearBackToTableRowContext(),e.openElements.pop(),e.insertionMode=ln,e._processToken(t)):(n!==zt.BODY&&n!==zt.CAPTION&&n!==zt.COL&&n!==zt.COLGROUP||n!==zt.HTML&&n!==zt.TD&&n!==zt.TH)&&ps(e,t);},[Nt.EOF_TOKEN]:_s},[pn]:{[Nt.CHARACTER_TOKEN]:qn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.CAPTION||n===zt.COL||n===zt.COLGROUP||n===zt.TBODY||n===zt.TD||n===zt.TFOOT||n===zt.TH||n===zt.THEAD||n===zt.TR?(e.openElements.hasInTableScope(zt.TD)||e.openElements.hasInTableScope(zt.TH))&&(e._closeTableCell(),e._processToken(t)):as(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.TD||n===zt.TH?e.openElements.hasInTableScope(n)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(n),e.activeFormattingElements.clearToLastMarker(),e.insertionMode=mn):n===zt.TABLE||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD||n===zt.TR?e.openElements.hasInTableScope(n)&&(e._closeTableCell(),e._processToken(t)):n!==zt.BODY&&n!==zt.CAPTION&&n!==zt.COL&&n!==zt.COLGROUP&&n!==zt.HTML&&cs(e,t);},[Nt.EOF_TOKEN]:_s},[An]:{[Nt.CHARACTER_TOKEN]:xn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:ds,[Nt.END_TAG_TOKEN]:Cs,[Nt.EOF_TOKEN]:_s},[un]:{[Nt.CHARACTER_TOKEN]:xn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.CAPTION||n===zt.TABLE||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD||n===zt.TR||n===zt.TD||n===zt.TH?(e.openElements.popUntilTagNamePopped(zt.SELECT),e._resetInsertionMode(),e._processToken(t)):ds(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.CAPTION||n===zt.TABLE||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD||n===zt.TR||n===zt.TD||n===zt.TH?e.openElements.hasInTableScope(n)&&(e.openElements.popUntilTagNamePopped(zt.SELECT),e._resetInsertionMode(),e._processToken(t)):Cs(e,t);},[Nt.EOF_TOKEN]:_s},[Nn]:{[Nt.CHARACTER_TOKEN]:qn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;if(n===zt.BASE||n===zt.BASEFONT||n===zt.BGSOUND||n===zt.LINK||n===zt.META||n===zt.NOFRAMES||n===zt.SCRIPT||n===zt.STYLE||n===zt.TEMPLATE||n===zt.TITLE)Qn(e,t);else {const s=In[n]||an;e._popTmplInsertionMode(),e._pushTmplInsertionMode(s),e.insertionMode=s,e._processToken(t);}},[Nt.END_TAG_TOKEN]:function(e,t){t.tagName===zt.TEMPLATE&&Xn(e,t);},[Nt.EOF_TOKEN]:Os},[dn]:{[Nt.CHARACTER_TOKEN]:fs,[Nt.NULL_CHARACTER_TOKEN]:fs,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:function(e,t){e._appendCommentNode(t,e.openElements.items[0]);},[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){t.tagName===zt.HTML?as(e,t):fs(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){t.tagName===zt.HTML?e.fragmentContext||(e.insertionMode=fn):fs(e,t);},[Nt.EOF_TOKEN]:yn},[Cn]:{[Nt.CHARACTER_TOKEN]:Gn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.FRAMESET?e._insertElement(t,qt.HTML):n===zt.FRAME?(e._appendElement(t,qt.HTML),t.ackSelfClosing=!0):n===zt.NOFRAMES&&Qn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){t.tagName!==zt.FRAMESET||e.openElements.isRootHtmlElementCurrent()||(e.openElements.pop(),e.fragmentContext||e.openElements.currentTagName===zt.FRAMESET||(e.insertionMode=On));},[Nt.EOF_TOKEN]:yn},[On]:{[Nt.CHARACTER_TOKEN]:Gn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.NOFRAMES&&Qn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){t.tagName===zt.HTML&&(e.insertionMode=Sn);},[Nt.EOF_TOKEN]:yn},[fn]:{[Nt.CHARACTER_TOKEN]:Ss,[Nt.NULL_CHARACTER_TOKEN]:Ss,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:bn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){t.tagName===zt.HTML?as(e,t):Ss(e,t);},[Nt.END_TAG_TOKEN]:Ss,[Nt.EOF_TOKEN]:yn},[Sn]:{[Nt.CHARACTER_TOKEN]:Gn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:bn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.NOFRAMES&&Qn(e,t);},[Nt.END_TAG_TOKEN]:Gn,[Nt.EOF_TOKEN]:yn}};var kn=class{constructor(e){this.options=function(e,t){return [e,t=t||Object.create(null)].reduce(((e,t)=>(Object.keys(t).forEach((n=>{e[n]=t[n];})),e)),Object.create(null))}(Zt,e),this.treeAdapter=this.options.treeAdapter,this.pendingScript=null,this.options.sourceCodeLocationInfo&>.install(this,Ut),this.options.onParseError&>.install(this,bt,{onParseError:this.options.onParseError});}parse(e){const t=this.treeAdapter.createDocument();return this._bootstrap(t,null),this.tokenizer.write(e,!0),this._runParsingLoop(null),t}parseFragment(e,t){t||(t=this.treeAdapter.createElement(zt.TEMPLATE,qt.HTML,[]));const n=this.treeAdapter.createElement("documentmock",qt.HTML,[]);this._bootstrap(n,t),this.treeAdapter.getTagName(t)===zt.TEMPLATE&&this._pushTmplInsertionMode(Nn),this._initTokenizerForFragmentParsing(),this._insertFakeRootElement(),this._resetInsertionMode(),this._findFormInFragmentContext(),this.tokenizer.write(e,!0),this._runParsingLoop(null);const s=this.treeAdapter.getFirstChild(n),r=this.treeAdapter.createDocumentFragment();return this._adoptNodes(s,r),r}_bootstrap(e,t){this.tokenizer=new Nt(this.options),this.stopped=!1,this.insertionMode=en,this.originalInsertionMode="",this.document=e,this.fragmentContext=t,this.headElement=null,this.formElement=null,this.openElements=new class{constructor(e,t){this.stackTop=-1,this.items=[],this.current=e,this.currentTagName=null,this.currentTmplContent=null,this.tmplCount=0,this.treeAdapter=t;}_indexOf(e){let t=-1;for(let n=this.stackTop;n>=0;n--)if(this.items[n]===e){t=n;break}return t}_isInTemplate(){return this.currentTagName===Ot.TEMPLATE&&this.treeAdapter.getNamespaceURI(this.current)===ft.HTML}_updateCurrentElement(){this.current=this.items[this.stackTop],this.currentTagName=this.current&&this.treeAdapter.getTagName(this.current),this.currentTmplContent=this._isInTemplate()?this.treeAdapter.getTemplateContent(this.current):null;}push(e){this.items[++this.stackTop]=e,this._updateCurrentElement(),this._isInTemplate()&&this.tmplCount++;}pop(){this.stackTop--,this.tmplCount>0&&this._isInTemplate()&&this.tmplCount--,this._updateCurrentElement();}replace(e,t){const n=this._indexOf(e);this.items[n]=t,n===this.stackTop&&this._updateCurrentElement();}insertAfter(e,t){const n=this._indexOf(e)+1;this.items.splice(n,0,t),n===++this.stackTop&&this._updateCurrentElement();}popUntilTagNamePopped(e){for(;this.stackTop>-1;){const t=this.currentTagName,n=this.treeAdapter.getNamespaceURI(this.current);if(this.pop(),t===e&&n===ft.HTML)break}}popUntilElementPopped(e){for(;this.stackTop>-1;){const t=this.current;if(this.pop(),t===e)break}}popUntilNumberedHeaderPopped(){for(;this.stackTop>-1;){const e=this.currentTagName,t=this.treeAdapter.getNamespaceURI(this.current);if(this.pop(),e===Ot.H1||e===Ot.H2||e===Ot.H3||e===Ot.H4||e===Ot.H5||e===Ot.H6&&t===ft.HTML)break}}popUntilTableCellPopped(){for(;this.stackTop>-1;){const e=this.currentTagName,t=this.treeAdapter.getNamespaceURI(this.current);if(this.pop(),e===Ot.TD||e===Ot.TH&&t===ft.HTML)break}}popAllUpToHtmlElement(){this.stackTop=0,this._updateCurrentElement();}clearBackToTableContext(){for(;this.currentTagName!==Ot.TABLE&&this.currentTagName!==Ot.TEMPLATE&&this.currentTagName!==Ot.HTML||this.treeAdapter.getNamespaceURI(this.current)!==ft.HTML;)this.pop();}clearBackToTableBodyContext(){for(;this.currentTagName!==Ot.TBODY&&this.currentTagName!==Ot.TFOOT&&this.currentTagName!==Ot.THEAD&&this.currentTagName!==Ot.TEMPLATE&&this.currentTagName!==Ot.HTML||this.treeAdapter.getNamespaceURI(this.current)!==ft.HTML;)this.pop();}clearBackToTableRowContext(){for(;this.currentTagName!==Ot.TR&&this.currentTagName!==Ot.TEMPLATE&&this.currentTagName!==Ot.HTML||this.treeAdapter.getNamespaceURI(this.current)!==ft.HTML;)this.pop();}remove(e){for(let t=this.stackTop;t>=0;t--)if(this.items[t]===e){this.items.splice(t,1),this.stackTop--,this._updateCurrentElement();break}}tryPeekProperlyNestedBodyElement(){const e=this.items[1];return e&&this.treeAdapter.getTagName(e)===Ot.BODY?e:null}contains(e){return this._indexOf(e)>-1}getCommonAncestor(e){let t=this._indexOf(e);return --t>=0?this.items[t]:null}isRootHtmlElementCurrent(){return 0===this.stackTop&&this.currentTagName===Ot.HTML}hasInScope(e){for(let t=this.stackTop;t>=0;t--){const n=this.treeAdapter.getTagName(this.items[t]),s=this.treeAdapter.getNamespaceURI(this.items[t]);if(n===e&&s===ft.HTML)return !0;if(It(n,s))return !1}return !0}hasNumberedHeaderInScope(){for(let e=this.stackTop;e>=0;e--){const t=this.treeAdapter.getTagName(this.items[e]),n=this.treeAdapter.getNamespaceURI(this.items[e]);if((t===Ot.H1||t===Ot.H2||t===Ot.H3||t===Ot.H4||t===Ot.H5||t===Ot.H6)&&n===ft.HTML)return !0;if(It(t,n))return !1}return !0}hasInListItemScope(e){for(let t=this.stackTop;t>=0;t--){const n=this.treeAdapter.getTagName(this.items[t]),s=this.treeAdapter.getNamespaceURI(this.items[t]);if(n===e&&s===ft.HTML)return !0;if((n===Ot.UL||n===Ot.OL)&&s===ft.HTML||It(n,s))return !1}return !0}hasInButtonScope(e){for(let t=this.stackTop;t>=0;t--){const n=this.treeAdapter.getTagName(this.items[t]),s=this.treeAdapter.getNamespaceURI(this.items[t]);if(n===e&&s===ft.HTML)return !0;if(n===Ot.BUTTON&&s===ft.HTML||It(n,s))return !1}return !0}hasInTableScope(e){for(let t=this.stackTop;t>=0;t--){const n=this.treeAdapter.getTagName(this.items[t]);if(this.treeAdapter.getNamespaceURI(this.items[t])===ft.HTML){if(n===e)return !0;if(n===Ot.TABLE||n===Ot.TEMPLATE||n===Ot.HTML)return !1}}return !0}hasTableBodyContextInTableScope(){for(let e=this.stackTop;e>=0;e--){const t=this.treeAdapter.getTagName(this.items[e]);if(this.treeAdapter.getNamespaceURI(this.items[e])===ft.HTML){if(t===Ot.TBODY||t===Ot.THEAD||t===Ot.TFOOT)return !0;if(t===Ot.TABLE||t===Ot.HTML)return !1}}return !0}hasInSelectScope(e){for(let t=this.stackTop;t>=0;t--){const n=this.treeAdapter.getTagName(this.items[t]);if(this.treeAdapter.getNamespaceURI(this.items[t])===ft.HTML){if(n===e)return !0;if(n!==Ot.OPTION&&n!==Ot.OPTGROUP)return !1}}return !0}generateImpliedEndTags(){for(;St(this.currentTagName);)this.pop();}generateImpliedEndTagsThoroughly(){for(;Rt(this.currentTagName);)this.pop();}generateImpliedEndTagsWithExclusion(e){for(;St(this.currentTagName)&&this.currentTagName!==e;)this.pop();}}(this.document,this.treeAdapter),this.activeFormattingElements=new kt(this.treeAdapter),this.tmplInsertionModeStack=[],this.tmplInsertionModeStackTop=-1,this.currentTmplInsertionMode=null,this.pendingCharacterTokens=[],this.hasNonWhitespacePendingCharacterToken=!1,this.framesetOk=!0,this.skipNextNewLine=!1,this.fosterParentingEnabled=!1;}_err(){}_runParsingLoop(e){for(;!this.stopped;){this._setupTokenizerCDATAMode();const t=this.tokenizer.getNextToken();if(t.type===Nt.HIBERNATION_TOKEN)break;if(this.skipNextNewLine&&(this.skipNextNewLine=!1,t.type===Nt.WHITESPACE_CHARACTER_TOKEN&&"\n"===t.chars[0])){if(1===t.chars.length)continue;t.chars=t.chars.substr(1);}if(this._processInputToken(t),e&&this.pendingScript)break}}runParsingLoopForCurrentChunk(e,t){if(this._runParsingLoop(t),t&&this.pendingScript){const e=this.pendingScript;return this.pendingScript=null,void t(e)}e&&e();}_setupTokenizerCDATAMode(){const e=this._getAdjustedCurrentElement();this.tokenizer.allowCDATA=e&&e!==this.document&&this.treeAdapter.getNamespaceURI(e)!==qt.HTML&&!this._isIntegrationPoint(e);}_switchToTextParsing(e,t){this._insertElement(e,qt.HTML),this.tokenizer.state=t,this.originalInsertionMode=this.insertionMode,this.insertionMode=Tn;}switchToPlaintextParsing(){this.insertionMode=Tn,this.originalInsertionMode=an,this.tokenizer.state=Nt.MODE.PLAINTEXT;}_getAdjustedCurrentElement(){return 0===this.openElements.stackTop&&this.fragmentContext?this.fragmentContext:this.openElements.current}_findFormInFragmentContext(){let e=this.fragmentContext;do{if(this.treeAdapter.getTagName(e)===zt.FORM){this.formElement=e;break}e=this.treeAdapter.getParentNode(e);}while(e)}_initTokenizerForFragmentParsing(){if(this.treeAdapter.getNamespaceURI(this.fragmentContext)===qt.HTML){const e=this.treeAdapter.getTagName(this.fragmentContext);e===zt.TITLE||e===zt.TEXTAREA?this.tokenizer.state=Nt.MODE.RCDATA:e===zt.STYLE||e===zt.XMP||e===zt.IFRAME||e===zt.NOEMBED||e===zt.NOFRAMES||e===zt.NOSCRIPT?this.tokenizer.state=Nt.MODE.RAWTEXT:e===zt.SCRIPT?this.tokenizer.state=Nt.MODE.SCRIPT_DATA:e===zt.PLAINTEXT&&(this.tokenizer.state=Nt.MODE.PLAINTEXT);}}_setDocumentType(e){const t=e.name||"",n=e.publicId||"",s=e.systemId||"";this.treeAdapter.setDocumentType(this.document,t,n,s);}_attachElementToTree(e){if(this._shouldFosterParentOnInsertion())this._fosterParentElement(e);else {const t=this.openElements.currentTmplContent||this.openElements.current;this.treeAdapter.appendChild(t,e);}}_appendElement(e,t){const n=this.treeAdapter.createElement(e.tagName,t,e.attrs);this._attachElementToTree(n);}_insertElement(e,t){const n=this.treeAdapter.createElement(e.tagName,t,e.attrs);this._attachElementToTree(n),this.openElements.push(n);}_insertFakeElement(e){const t=this.treeAdapter.createElement(e,qt.HTML,[]);this._attachElementToTree(t),this.openElements.push(t);}_insertTemplate(e){const t=this.treeAdapter.createElement(e.tagName,qt.HTML,e.attrs),n=this.treeAdapter.createDocumentFragment();this.treeAdapter.setTemplateContent(t,n),this._attachElementToTree(t),this.openElements.push(t);}_insertFakeRootElement(){const e=this.treeAdapter.createElement(zt.HTML,qt.HTML,[]);this.treeAdapter.appendChild(this.openElements.current,e),this.openElements.push(e);}_appendCommentNode(e,t){const n=this.treeAdapter.createCommentNode(e.data);this.treeAdapter.appendChild(t,n);}_insertCharacters(e){if(this._shouldFosterParentOnInsertion())this._fosterParentText(e.chars);else {const t=this.openElements.currentTmplContent||this.openElements.current;this.treeAdapter.insertText(t,e.chars);}}_adoptNodes(e,t){for(let n=this.treeAdapter.getFirstChild(e);n;n=this.treeAdapter.getFirstChild(e))this.treeAdapter.detachNode(n),this.treeAdapter.appendChild(t,n);}_shouldProcessTokenInForeignContent(e){const t=this._getAdjustedCurrentElement();if(!t||t===this.document)return !1;const n=this.treeAdapter.getNamespaceURI(t);if(n===qt.HTML)return !1;if(this.treeAdapter.getTagName(t)===zt.ANNOTATION_XML&&n===qt.MATHML&&e.type===Nt.START_TAG_TOKEN&&e.tagName===zt.SVG)return !1;const s=e.type===Nt.CHARACTER_TOKEN||e.type===Nt.NULL_CHARACTER_TOKEN||e.type===Nt.WHITESPACE_CHARACTER_TOKEN;return !((e.type===Nt.START_TAG_TOKEN&&e.tagName!==zt.MGLYPH&&e.tagName!==zt.MALIGNMARK||s)&&this._isIntegrationPoint(t,qt.MATHML)||(e.type===Nt.START_TAG_TOKEN||s)&&this._isIntegrationPoint(t,qt.HTML)||e.type===Nt.EOF_TOKEN)}_processToken(e){Ln[this.insertionMode][e.type](this,e);}_processTokenInBodyMode(e){Ln.IN_BODY_MODE[e.type](this,e);}_processTokenInForeignContent(e){e.type===Nt.CHARACTER_TOKEN?function(e,t){e._insertCharacters(t),e.framesetOk=!1;}(this,e):e.type===Nt.NULL_CHARACTER_TOKEN?function(e,t){t.chars=n,e._insertCharacters(t);}(this,e):e.type===Nt.WHITESPACE_CHARACTER_TOKEN?xn(this,e):e.type===Nt.COMMENT_TOKEN?Kn(this,e):e.type===Nt.START_TAG_TOKEN?function(e,t){if(jt.causesExit(t)&&!e.fragmentContext){for(;e.treeAdapter.getNamespaceURI(e.openElements.current)!==qt.HTML&&!e._isIntegrationPoint(e.openElements.current);)e.openElements.pop();e._processToken(t);}else {const n=e._getAdjustedCurrentElement(),s=e.treeAdapter.getNamespaceURI(n);s===qt.MATHML?jt.adjustTokenMathMLAttrs(t):s===qt.SVG&&(jt.adjustTokenSVGTagName(t),jt.adjustTokenSVGAttrs(t)),jt.adjustTokenXMLAttrs(t),t.selfClosing?e._appendElement(t,s):e._insertElement(t,s),t.ackSelfClosing=!0;}}(this,e):e.type===Nt.END_TAG_TOKEN&&function(e,t){for(let n=e.openElements.stackTop;n>0;n--){const s=e.openElements.items[n];if(e.treeAdapter.getNamespaceURI(s)===qt.HTML){e._processToken(t);break}if(e.treeAdapter.getTagName(s).toLowerCase()===t.tagName){e.openElements.popUntilElementPopped(s);break}}}(this,e);}_processInputToken(e){this._shouldProcessTokenInForeignContent(e)?this._processTokenInForeignContent(e):this._processToken(e),e.type===Nt.START_TAG_TOKEN&&e.selfClosing&&!e.ackSelfClosing&&this._err("non-void-html-element-start-tag-with-trailing-solidus");}_isIntegrationPoint(e,t){const n=this.treeAdapter.getTagName(e),s=this.treeAdapter.getNamespaceURI(e),r=this.treeAdapter.getAttrList(e);return jt.isIntegrationPoint(n,s,r,t)}_reconstructActiveFormattingElements(){const e=this.activeFormattingElements.length;if(e){let t=e,n=null;do{if(t--,n=this.activeFormattingElements.entries[t],n.type===kt.MARKER_ENTRY||this.openElements.contains(n.element)){t++;break}}while(t>0);for(let s=t;s<e;s++)n=this.activeFormattingElements.entries[s],this._insertElement(n.token,this.treeAdapter.getNamespaceURI(n.element)),n.element=this.openElements.current;}}_closeTableCell(){this.openElements.generateImpliedEndTags(),this.openElements.popUntilTableCellPopped(),this.activeFormattingElements.clearToLastMarker(),this.insertionMode=mn;}_closePElement(){this.openElements.generateImpliedEndTagsWithExclusion(zt.P),this.openElements.popUntilTagNamePopped(zt.P);}_resetInsertionMode(){for(let e=this.openElements.stackTop,t=!1;e>=0;e--){let n=this.openElements.items[e];0===e&&(t=!0,this.fragmentContext&&(n=this.fragmentContext));const s=this.treeAdapter.getTagName(n),r=Rn[s];if(r){this.insertionMode=r;break}if(!(t||s!==zt.TD&&s!==zt.TH)){this.insertionMode=pn;break}if(!t&&s===zt.HEAD){this.insertionMode=sn;break}if(s===zt.SELECT){this._resetInsertionModeForSelect(e);break}if(s===zt.TEMPLATE){this.insertionMode=this.currentTmplInsertionMode;break}if(s===zt.HTML){this.insertionMode=this.headElement?on:nn;break}if(t){this.insertionMode=an;break}}}_resetInsertionModeForSelect(e){if(e>0)for(let t=e-1;t>0;t--){const e=this.openElements.items[t],n=this.treeAdapter.getTagName(e);if(n===zt.TEMPLATE)break;if(n===zt.TABLE)return void(this.insertionMode=un)}this.insertionMode=An;}_pushTmplInsertionMode(e){this.tmplInsertionModeStack.push(e),this.tmplInsertionModeStackTop++,this.currentTmplInsertionMode=e;}_popTmplInsertionMode(){this.tmplInsertionModeStack.pop(),this.tmplInsertionModeStackTop--,this.currentTmplInsertionMode=this.tmplInsertionModeStack[this.tmplInsertionModeStackTop];}_isElementCausesFosterParenting(e){const t=this.treeAdapter.getTagName(e);return t===zt.TABLE||t===zt.TBODY||t===zt.TFOOT||t===zt.THEAD||t===zt.TR}_shouldFosterParentOnInsertion(){return this.fosterParentingEnabled&&this._isElementCausesFosterParenting(this.openElements.current)}_findFosterParentingLocation(){const e={parent:null,beforeElement:null};for(let t=this.openElements.stackTop;t>=0;t--){const n=this.openElements.items[t],s=this.treeAdapter.getTagName(n),r=this.treeAdapter.getNamespaceURI(n);if(s===zt.TEMPLATE&&r===qt.HTML){e.parent=this.treeAdapter.getTemplateContent(n);break}if(s===zt.TABLE){e.parent=this.treeAdapter.getParentNode(n),e.parent?e.beforeElement=n:e.parent=this.openElements.items[t-1];break}}return e.parent||(e.parent=this.openElements.items[0]),e}_fosterParentElement(e){const t=this._findFosterParentingLocation();t.beforeElement?this.treeAdapter.insertBefore(t.parent,e,t.beforeElement):this.treeAdapter.appendChild(t.parent,e);}_fosterParentText(e){const t=this._findFosterParentingLocation();t.beforeElement?this.treeAdapter.insertTextBefore(t.parent,e,t.beforeElement):this.treeAdapter.insertText(t.parent,e);}_isSpecialElement(e){const t=this.treeAdapter.getTagName(e),n=this.treeAdapter.getNamespaceURI(e);return Ct.SPECIAL_ELEMENTS[n][t]}};function Mn(e,t){let n=e.activeFormattingElements.getElementEntryInScopeWithTagName(t.tagName);return n?e.openElements.contains(n.element)?e.openElements.hasInScope(t.tagName)||(n=null):(e.activeFormattingElements.removeEntry(n),n=null):hs(e,t),n}function gn(e,t){let n=null;for(let s=e.openElements.stackTop;s>=0;s--){const r=e.openElements.items[s];if(r===t.element)break;e._isSpecialElement(r)&&(n=r);}return n||(e.openElements.popUntilElementPopped(t.element),e.activeFormattingElements.removeEntry(t)),n}function Pn(e,t,n){let s=t,r=e.openElements.getCommonAncestor(t);for(let i=0,o=r;o!==n;i++,o=r){r=e.openElements.getCommonAncestor(o);const n=e.activeFormattingElements.getElementEntry(o),a=n&&i>=3;!n||a?(a&&e.activeFormattingElements.removeEntry(n),e.openElements.remove(o)):(o=Hn(e,n),s===t&&(e.activeFormattingElements.bookmark=n),e.treeAdapter.detachNode(s),e.treeAdapter.appendChild(o,s),s=o);}return s}function Hn(e,t){const n=e.treeAdapter.getNamespaceURI(t.element),s=e.treeAdapter.createElement(t.token.tagName,n,t.token.attrs);return e.openElements.replace(t.element,s),t.element=s,s}function Dn(e,t,n){if(e._isElementCausesFosterParenting(t))e._fosterParentElement(n);else {const s=e.treeAdapter.getTagName(t),r=e.treeAdapter.getNamespaceURI(t);s===zt.TEMPLATE&&r===qt.HTML&&(t=e.treeAdapter.getTemplateContent(t)),e.treeAdapter.appendChild(t,n);}}function Fn(e,t,n){const s=e.treeAdapter.getNamespaceURI(n.element),r=n.token,i=e.treeAdapter.createElement(r.tagName,s,r.attrs);e._adoptNodes(t,i),e.treeAdapter.appendChild(t,i),e.activeFormattingElements.insertElementAfterBookmark(i,n.token),e.activeFormattingElements.removeEntry(n),e.openElements.remove(n.element),e.openElements.insertAfter(t,i);}function Un(e,t){let n;for(let s=0;s<8&&(n=Mn(e,t),n);s++){const t=gn(e,n);if(!t)break;e.activeFormattingElements.bookmark=n;const s=Pn(e,t,n.element),r=e.openElements.getCommonAncestor(n.element);e.treeAdapter.detachNode(s),Dn(e,r,s),Fn(e,t,n);}}function Gn(){}function Bn(e){e._err("misplaced-doctype");}function Kn(e,t){e._appendCommentNode(t,e.openElements.currentTmplContent||e.openElements.current);}function bn(e,t){e._appendCommentNode(t,e.document);}function xn(e,t){e._insertCharacters(t);}function yn(e){e.stopped=!0;}function vn(e,t){e._err("missing-doctype",{beforeToken:!0}),e.treeAdapter.setDocumentMode(e.document,Ct.DOCUMENT_MODE.QUIRKS),e.insertionMode=tn,e._processToken(t);}function Yn(e,t){e._insertFakeRootElement(),e.insertionMode=nn,e._processToken(t);}function wn(e,t){e._insertFakeElement(zt.HEAD),e.headElement=e.openElements.current,e.insertionMode=sn,e._processToken(t);}function Qn(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.BASE||n===zt.BASEFONT||n===zt.BGSOUND||n===zt.LINK||n===zt.META?(e._appendElement(t,qt.HTML),t.ackSelfClosing=!0):n===zt.TITLE?e._switchToTextParsing(t,Nt.MODE.RCDATA):n===zt.NOSCRIPT?e.options.scriptingEnabled?e._switchToTextParsing(t,Nt.MODE.RAWTEXT):(e._insertElement(t,qt.HTML),e.insertionMode=rn):n===zt.NOFRAMES||n===zt.STYLE?e._switchToTextParsing(t,Nt.MODE.RAWTEXT):n===zt.SCRIPT?e._switchToTextParsing(t,Nt.MODE.SCRIPT_DATA):n===zt.TEMPLATE?(e._insertTemplate(t,qt.HTML),e.activeFormattingElements.insertMarker(),e.framesetOk=!1,e.insertionMode=Nn,e._pushTmplInsertionMode(Nn)):n===zt.HEAD?e._err(k):Wn(e,t);}function Xn(e,t){const n=t.tagName;n===zt.HEAD?(e.openElements.pop(),e.insertionMode=on):n===zt.BODY||n===zt.BR||n===zt.HTML?Wn(e,t):n===zt.TEMPLATE&&e.openElements.tmplCount>0?(e.openElements.generateImpliedEndTagsThoroughly(),e.openElements.currentTagName!==zt.TEMPLATE&&e._err("closing-of-element-with-open-child-elements"),e.openElements.popUntilTagNamePopped(zt.TEMPLATE),e.activeFormattingElements.clearToLastMarker(),e._popTmplInsertionMode(),e._resetInsertionMode()):e._err(L);}function Wn(e,t){e.openElements.pop(),e.insertionMode=on,e._processToken(t);}function Vn(e,t){const n=t.type===Nt.EOF_TOKEN?"open-elements-left-after-eof":"disallowed-content-in-noscript-in-head";e._err(n),e.openElements.pop(),e.insertionMode=sn,e._processToken(t);}function jn(e,t){e._insertFakeElement(zt.BODY),e.insertionMode=an,e._processToken(t);}function zn(e,t){e._reconstructActiveFormattingElements(),e._insertCharacters(t);}function qn(e,t){e._reconstructActiveFormattingElements(),e._insertCharacters(t),e.framesetOk=!1;}function Jn(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML);}function Zn(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML),e.skipNextNewLine=!0,e.framesetOk=!1;}function $n(e,t){e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML),e.activeFormattingElements.pushElement(e.openElements.current,t);}function es(e,t){e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML),e.activeFormattingElements.insertMarker(),e.framesetOk=!1;}function ts(e,t){e._reconstructActiveFormattingElements(),e._appendElement(t,qt.HTML),e.framesetOk=!1,t.ackSelfClosing=!0;}function ns(e,t){e._appendElement(t,qt.HTML),t.ackSelfClosing=!0;}function ss(e,t){e._switchToTextParsing(t,Nt.MODE.RAWTEXT);}function rs(e,t){e.openElements.currentTagName===zt.OPTION&&e.openElements.pop(),e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML);}function is(e,t){e.openElements.hasInScope(zt.RUBY)&&e.openElements.generateImpliedEndTags(),e._insertElement(t,qt.HTML);}function os(e,t){e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML);}function as(e,t){const n=t.tagName;switch(n.length){case 1:n===zt.I||n===zt.S||n===zt.B||n===zt.U?$n(e,t):n===zt.P?Jn(e,t):n===zt.A?function(e,t){const n=e.activeFormattingElements.getElementEntryInScopeWithTagName(zt.A);n&&(Un(e,t),e.openElements.remove(n.element),e.activeFormattingElements.removeEntry(n)),e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML),e.activeFormattingElements.pushElement(e.openElements.current,t);}(e,t):os(e,t);break;case 2:n===zt.DL||n===zt.OL||n===zt.UL?Jn(e,t):n===zt.H1||n===zt.H2||n===zt.H3||n===zt.H4||n===zt.H5||n===zt.H6?function(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement();const n=e.openElements.currentTagName;n!==zt.H1&&n!==zt.H2&&n!==zt.H3&&n!==zt.H4&&n!==zt.H5&&n!==zt.H6||e.openElements.pop(),e._insertElement(t,qt.HTML);}(e,t):n===zt.LI||n===zt.DD||n===zt.DT?function(e,t){e.framesetOk=!1;const n=t.tagName;for(let t=e.openElements.stackTop;t>=0;t--){const s=e.openElements.items[t],r=e.treeAdapter.getTagName(s);let i=null;if(n===zt.LI&&r===zt.LI?i=zt.LI:n!==zt.DD&&n!==zt.DT||r!==zt.DD&&r!==zt.DT||(i=r),i){e.openElements.generateImpliedEndTagsWithExclusion(i),e.openElements.popUntilTagNamePopped(i);break}if(r!==zt.ADDRESS&&r!==zt.DIV&&r!==zt.P&&e._isSpecialElement(s))break}e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML);}(e,t):n===zt.EM||n===zt.TT?$n(e,t):n===zt.BR?ts(e,t):n===zt.HR?function(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._appendElement(t,qt.HTML),e.framesetOk=!1,t.ackSelfClosing=!0;}(e,t):n===zt.RB?is(e,t):n===zt.RT||n===zt.RP?function(e,t){e.openElements.hasInScope(zt.RUBY)&&e.openElements.generateImpliedEndTagsWithExclusion(zt.RTC),e._insertElement(t,qt.HTML);}(e,t):n!==zt.TH&&n!==zt.TD&&n!==zt.TR&&os(e,t);break;case 3:n===zt.DIV||n===zt.DIR||n===zt.NAV?Jn(e,t):n===zt.PRE?Zn(e,t):n===zt.BIG?$n(e,t):n===zt.IMG||n===zt.WBR?ts(e,t):n===zt.XMP?function(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._reconstructActiveFormattingElements(),e.framesetOk=!1,e._switchToTextParsing(t,Nt.MODE.RAWTEXT);}(e,t):n===zt.SVG?function(e,t){e._reconstructActiveFormattingElements(),jt.adjustTokenSVGAttrs(t),jt.adjustTokenXMLAttrs(t),t.selfClosing?e._appendElement(t,qt.SVG):e._insertElement(t,qt.SVG),t.ackSelfClosing=!0;}(e,t):n===zt.RTC?is(e,t):n!==zt.COL&&os(e,t);break;case 4:n===zt.HTML?function(e,t){0===e.openElements.tmplCount&&e.treeAdapter.adoptAttributes(e.openElements.items[0],t.attrs);}(e,t):n===zt.BASE||n===zt.LINK||n===zt.META?Qn(e,t):n===zt.BODY?function(e,t){const n=e.openElements.tryPeekProperlyNestedBodyElement();n&&0===e.openElements.tmplCount&&(e.framesetOk=!1,e.treeAdapter.adoptAttributes(n,t.attrs));}(e,t):n===zt.MAIN||n===zt.MENU?Jn(e,t):n===zt.FORM?function(e,t){const n=e.openElements.tmplCount>0;e.formElement&&!n||(e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML),n||(e.formElement=e.openElements.current));}(e,t):n===zt.CODE||n===zt.FONT?$n(e,t):n===zt.NOBR?function(e,t){e._reconstructActiveFormattingElements(),e.openElements.hasInScope(zt.NOBR)&&(Un(e,t),e._reconstructActiveFormattingElements()),e._insertElement(t,qt.HTML),e.activeFormattingElements.pushElement(e.openElements.current,t);}(e,t):n===zt.AREA?ts(e,t):n===zt.MATH?function(e,t){e._reconstructActiveFormattingElements(),jt.adjustTokenMathMLAttrs(t),jt.adjustTokenXMLAttrs(t),t.selfClosing?e._appendElement(t,qt.MATHML):e._insertElement(t,qt.MATHML),t.ackSelfClosing=!0;}(e,t):n===zt.MENU?function(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML);}(e,t):n!==zt.HEAD&&os(e,t);break;case 5:n===zt.STYLE||n===zt.TITLE?Qn(e,t):n===zt.ASIDE?Jn(e,t):n===zt.SMALL?$n(e,t):n===zt.TABLE?function(e,t){e.treeAdapter.getDocumentMode(e.document)!==Ct.DOCUMENT_MODE.QUIRKS&&e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML),e.framesetOk=!1,e.insertionMode=En;}(e,t):n===zt.EMBED?ts(e,t):n===zt.INPUT?function(e,t){e._reconstructActiveFormattingElements(),e._appendElement(t,qt.HTML);const n=Nt.getTokenAttr(t,Jt.TYPE);n&&n.toLowerCase()===$t||(e.framesetOk=!1),t.ackSelfClosing=!0;}(e,t):n===zt.PARAM||n===zt.TRACK?ns(e,t):n===zt.IMAGE?function(e,t){t.tagName=zt.IMG,ts(e,t);}(e,t):n!==zt.FRAME&&n!==zt.TBODY&&n!==zt.TFOOT&&n!==zt.THEAD&&os(e,t);break;case 6:n===zt.SCRIPT?Qn(e,t):n===zt.CENTER||n===zt.FIGURE||n===zt.FOOTER||n===zt.HEADER||n===zt.HGROUP||n===zt.DIALOG?Jn(e,t):n===zt.BUTTON?function(e,t){e.openElements.hasInScope(zt.BUTTON)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(zt.BUTTON)),e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML),e.framesetOk=!1;}(e,t):n===zt.STRIKE||n===zt.STRONG?$n(e,t):n===zt.APPLET||n===zt.OBJECT?es(e,t):n===zt.KEYGEN?ts(e,t):n===zt.SOURCE?ns(e,t):n===zt.IFRAME?function(e,t){e.framesetOk=!1,e._switchToTextParsing(t,Nt.MODE.RAWTEXT);}(e,t):n===zt.SELECT?function(e,t){e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML),e.framesetOk=!1,e.insertionMode===En||e.insertionMode===cn||e.insertionMode===ln||e.insertionMode===mn||e.insertionMode===pn?e.insertionMode=un:e.insertionMode=An;}(e,t):n===zt.OPTION?rs(e,t):os(e,t);break;case 7:n===zt.BGSOUND?Qn(e,t):n===zt.DETAILS||n===zt.ADDRESS||n===zt.ARTICLE||n===zt.SECTION||n===zt.SUMMARY?Jn(e,t):n===zt.LISTING?Zn(e,t):n===zt.MARQUEE?es(e,t):n===zt.NOEMBED?ss(e,t):n!==zt.CAPTION&&os(e,t);break;case 8:n===zt.BASEFONT?Qn(e,t):n===zt.FRAMESET?function(e,t){const n=e.openElements.tryPeekProperlyNestedBodyElement();e.framesetOk&&n&&(e.treeAdapter.detachNode(n),e.openElements.popAllUpToHtmlElement(),e._insertElement(t,qt.HTML),e.insertionMode=Cn);}(e,t):n===zt.FIELDSET?Jn(e,t):n===zt.TEXTAREA?function(e,t){e._insertElement(t,qt.HTML),e.skipNextNewLine=!0,e.tokenizer.state=Nt.MODE.RCDATA,e.originalInsertionMode=e.insertionMode,e.framesetOk=!1,e.insertionMode=Tn;}(e,t):n===zt.TEMPLATE?Qn(e,t):n===zt.NOSCRIPT?e.options.scriptingEnabled?ss(e,t):os(e,t):n===zt.OPTGROUP?rs(e,t):n!==zt.COLGROUP&&os(e,t);break;case 9:n===zt.PLAINTEXT?function(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML),e.tokenizer.state=Nt.MODE.PLAINTEXT;}(e,t):os(e,t);break;case 10:n===zt.BLOCKQUOTE||n===zt.FIGCAPTION?Jn(e,t):os(e,t);break;default:os(e,t);}}function Ts(e,t){const n=t.tagName;e.openElements.hasInScope(n)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(n));}function Es(e,t){const n=t.tagName;e.openElements.hasInScope(n)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(n),e.activeFormattingElements.clearToLastMarker());}function hs(e,t){const n=t.tagName;for(let t=e.openElements.stackTop;t>0;t--){const s=e.openElements.items[t];if(e.treeAdapter.getTagName(s)===n){e.openElements.generateImpliedEndTagsWithExclusion(n),e.openElements.popUntilElementPopped(s);break}if(e._isSpecialElement(s))break}}function cs(e,t){const n=t.tagName;switch(n.length){case 1:n===zt.A||n===zt.B||n===zt.I||n===zt.S||n===zt.U?Un(e,t):n===zt.P?function(e){e.openElements.hasInButtonScope(zt.P)||e._insertFakeElement(zt.P),e._closePElement();}(e):hs(e,t);break;case 2:n===zt.DL||n===zt.UL||n===zt.OL?Ts(e,t):n===zt.LI?function(e){e.openElements.hasInListItemScope(zt.LI)&&(e.openElements.generateImpliedEndTagsWithExclusion(zt.LI),e.openElements.popUntilTagNamePopped(zt.LI));}(e):n===zt.DD||n===zt.DT?function(e,t){const n=t.tagName;e.openElements.hasInScope(n)&&(e.openElements.generateImpliedEndTagsWithExclusion(n),e.openElements.popUntilTagNamePopped(n));}(e,t):n===zt.H1||n===zt.H2||n===zt.H3||n===zt.H4||n===zt.H5||n===zt.H6?function(e){e.openElements.hasNumberedHeaderInScope()&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilNumberedHeaderPopped());}(e):n===zt.BR?function(e){e._reconstructActiveFormattingElements(),e._insertFakeElement(zt.BR),e.openElements.pop(),e.framesetOk=!1;}(e):n===zt.EM||n===zt.TT?Un(e,t):hs(e,t);break;case 3:n===zt.BIG?Un(e,t):n===zt.DIR||n===zt.DIV||n===zt.NAV||n===zt.PRE?Ts(e,t):hs(e,t);break;case 4:n===zt.BODY?function(e){e.openElements.hasInScope(zt.BODY)&&(e.insertionMode=dn);}(e):n===zt.HTML?function(e,t){e.openElements.hasInScope(zt.BODY)&&(e.insertionMode=dn,e._processToken(t));}(e,t):n===zt.FORM?function(e){const t=e.openElements.tmplCount>0,n=e.formElement;t||(e.formElement=null),(n||t)&&e.openElements.hasInScope(zt.FORM)&&(e.openElements.generateImpliedEndTags(),t?e.openElements.popUntilTagNamePopped(zt.FORM):e.openElements.remove(n));}(e):n===zt.CODE||n===zt.FONT||n===zt.NOBR?Un(e,t):n===zt.MAIN||n===zt.MENU?Ts(e,t):hs(e,t);break;case 5:n===zt.ASIDE?Ts(e,t):n===zt.SMALL?Un(e,t):hs(e,t);break;case 6:n===zt.CENTER||n===zt.FIGURE||n===zt.FOOTER||n===zt.HEADER||n===zt.HGROUP||n===zt.DIALOG?Ts(e,t):n===zt.APPLET||n===zt.OBJECT?Es(e,t):n===zt.STRIKE||n===zt.STRONG?Un(e,t):hs(e,t);break;case 7:n===zt.ADDRESS||n===zt.ARTICLE||n===zt.DETAILS||n===zt.SECTION||n===zt.SUMMARY||n===zt.LISTING?Ts(e,t):n===zt.MARQUEE?Es(e,t):hs(e,t);break;case 8:n===zt.FIELDSET?Ts(e,t):n===zt.TEMPLATE?Xn(e,t):hs(e,t);break;case 10:n===zt.BLOCKQUOTE||n===zt.FIGCAPTION?Ts(e,t):hs(e,t);break;default:hs(e,t);}}function _s(e,t){e.tmplInsertionModeStackTop>-1?Os(e,t):e.stopped=!0;}function ls(e,t){const n=e.openElements.currentTagName;n===zt.TABLE||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD||n===zt.TR?(e.pendingCharacterTokens=[],e.hasNonWhitespacePendingCharacterToken=!1,e.originalInsertionMode=e.insertionMode,e.insertionMode=hn,e._processToken(t)):As(e,t);}function ms(e,t){const n=t.tagName;switch(n.length){case 2:n===zt.TD||n===zt.TH||n===zt.TR?function(e,t){e.openElements.clearBackToTableContext(),e._insertFakeElement(zt.TBODY),e.insertionMode=ln,e._processToken(t);}(e,t):As(e,t);break;case 3:n===zt.COL?function(e,t){e.openElements.clearBackToTableContext(),e._insertFakeElement(zt.COLGROUP),e.insertionMode=_n,e._processToken(t);}(e,t):As(e,t);break;case 4:n===zt.FORM?function(e,t){e.formElement||0!==e.openElements.tmplCount||(e._insertElement(t,qt.HTML),e.formElement=e.openElements.current,e.openElements.pop());}(e,t):As(e,t);break;case 5:n===zt.TABLE?function(e,t){e.openElements.hasInTableScope(zt.TABLE)&&(e.openElements.popUntilTagNamePopped(zt.TABLE),e._resetInsertionMode(),e._processToken(t));}(e,t):n===zt.STYLE?Qn(e,t):n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD?function(e,t){e.openElements.clearBackToTableContext(),e._insertElement(t,qt.HTML),e.insertionMode=ln;}(e,t):n===zt.INPUT?function(e,t){const n=Nt.getTokenAttr(t,Jt.TYPE);n&&n.toLowerCase()===$t?e._appendElement(t,qt.HTML):As(e,t),t.ackSelfClosing=!0;}(e,t):As(e,t);break;case 6:n===zt.SCRIPT?Qn(e,t):As(e,t);break;case 7:n===zt.CAPTION?function(e,t){e.openElements.clearBackToTableContext(),e.activeFormattingElements.insertMarker(),e._insertElement(t,qt.HTML),e.insertionMode=cn;}(e,t):As(e,t);break;case 8:n===zt.COLGROUP?function(e,t){e.openElements.clearBackToTableContext(),e._insertElement(t,qt.HTML),e.insertionMode=_n;}(e,t):n===zt.TEMPLATE?Qn(e,t):As(e,t);break;default:As(e,t);}}function ps(e,t){const n=t.tagName;n===zt.TABLE?e.openElements.hasInTableScope(zt.TABLE)&&(e.openElements.popUntilTagNamePopped(zt.TABLE),e._resetInsertionMode()):n===zt.TEMPLATE?Xn(e,t):n!==zt.BODY&&n!==zt.CAPTION&&n!==zt.COL&&n!==zt.COLGROUP&&n!==zt.HTML&&n!==zt.TBODY&&n!==zt.TD&&n!==zt.TFOOT&&n!==zt.TH&&n!==zt.THEAD&&n!==zt.TR&&As(e,t);}function As(e,t){const n=e.fosterParentingEnabled;e.fosterParentingEnabled=!0,e._processTokenInBodyMode(t),e.fosterParentingEnabled=n;}function us(e,t){let n=0;if(e.hasNonWhitespacePendingCharacterToken)for(;n<e.pendingCharacterTokens.length;n++)As(e,e.pendingCharacterTokens[n]);else for(;n<e.pendingCharacterTokens.length;n++)e._insertCharacters(e.pendingCharacterTokens[n]);e.insertionMode=e.originalInsertionMode,e._processToken(t);}function Ns(e,t){e.openElements.currentTagName===zt.COLGROUP&&(e.openElements.pop(),e.insertionMode=En,e._processToken(t));}function ds(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.OPTION?(e.openElements.currentTagName===zt.OPTION&&e.openElements.pop(),e._insertElement(t,qt.HTML)):n===zt.OPTGROUP?(e.openElements.currentTagName===zt.OPTION&&e.openElements.pop(),e.openElements.currentTagName===zt.OPTGROUP&&e.openElements.pop(),e._insertElement(t,qt.HTML)):n===zt.INPUT||n===zt.KEYGEN||n===zt.TEXTAREA||n===zt.SELECT?e.openElements.hasInSelectScope(zt.SELECT)&&(e.openElements.popUntilTagNamePopped(zt.SELECT),e._resetInsertionMode(),n!==zt.SELECT&&e._processToken(t)):n!==zt.SCRIPT&&n!==zt.TEMPLATE||Qn(e,t);}function Cs(e,t){const n=t.tagName;if(n===zt.OPTGROUP){const t=e.openElements.items[e.openElements.stackTop-1],n=t&&e.treeAdapter.getTagName(t);e.openElements.currentTagName===zt.OPTION&&n===zt.OPTGROUP&&e.openElements.pop(),e.openElements.currentTagName===zt.OPTGROUP&&e.openElements.pop();}else n===zt.OPTION?e.openElements.currentTagName===zt.OPTION&&e.openElements.pop():n===zt.SELECT&&e.openElements.hasInSelectScope(zt.SELECT)?(e.openElements.popUntilTagNamePopped(zt.SELECT),e._resetInsertionMode()):n===zt.TEMPLATE&&Xn(e,t);}function Os(e,t){e.openElements.tmplCount>0?(e.openElements.popUntilTagNamePopped(zt.TEMPLATE),e.activeFormattingElements.clearToLastMarker(),e._popTmplInsertionMode(),e._resetInsertionMode(),e._processToken(t)):e.stopped=!0;}function fs(e,t){e.insertionMode=an,e._processToken(t);}function Ss(e,t){e.insertionMode=an,e._processToken(t);}return Ct.TAG_NAMES,Ct.NAMESPACES,e.parse=function(e,t){return new kn(t).parse(e)},e.parseFragment=function(e,t,n){return "string"==typeof e&&(n=t,t=e,e=null),new kn(n).parseFragment(t,e)},Object.defineProperty(e,"__esModule",{value:!0}),e}({});const parse=e.parse;const parseFragment=e.parseFragment;
const docParser = new WeakMap();
function parseDocumentUtil(ownerDocument, html) {
const doc = parse(html.trim(), getParser(ownerDocument));
doc.documentElement = doc.firstElementChild;
doc.head = doc.documentElement.firstElementChild;
doc.body = doc.head.nextElementSibling;
return doc;
}
function parseFragmentUtil(ownerDocument, html) {
if (typeof html === 'string') {
html = html.trim();
}
else {
html = '';
}
const frag = parseFragment(html, getParser(ownerDocument));
return frag;
}
function getParser(ownerDocument) {
let parseOptions = docParser.get(ownerDocument);
if (parseOptions != null) {
return parseOptions;
}
const treeAdapter = {
createDocument() {
const doc = ownerDocument.createElement("#document" /* DOCUMENT_NODE */);
doc['x-mode'] = 'no-quirks';
return doc;
},
setNodeSourceCodeLocation(node, location) {
node.sourceCodeLocation = location;
},
getNodeSourceCodeLocation(node) {
return node.sourceCodeLocation;
},
createDocumentFragment() {
return ownerDocument.createDocumentFragment();
},
createElement(tagName, namespaceURI, attrs) {
const elm = ownerDocument.createElementNS(namespaceURI, tagName);
for (let i = 0; i < attrs.length; i++) {
const attr = attrs[i];
if (attr.namespace == null || attr.namespace === 'http://www.w3.org/1999/xhtml') {
elm.setAttribute(attr.name, attr.value);
}
else {
elm.setAttributeNS(attr.namespace, attr.name, attr.value);
}
}
return elm;
},
createCommentNode(data) {
return ownerDocument.createComment(data);
},
appendChild(parentNode, newNode) {
parentNode.appendChild(newNode);
},
insertBefore(parentNode, newNode, referenceNode) {
parentNode.insertBefore(newNode, referenceNode);
},
setTemplateContent(templateElement, contentElement) {
templateElement.content = contentElement;
},
getTemplateContent(templateElement) {
return templateElement.content;
},
setDocumentType(doc, name, publicId, systemId) {
let doctypeNode = doc.childNodes.find(n => n.nodeType === 10 /* DOCUMENT_TYPE_NODE */);
if (doctypeNode == null) {
doctypeNode = ownerDocument.createDocumentTypeNode();
doc.insertBefore(doctypeNode, doc.firstChild);
}
doctypeNode.nodeValue = '!DOCTYPE';
doctypeNode['x-name'] = name;
doctypeNode['x-publicId'] = publicId;
doctypeNode['x-systemId'] = systemId;
},
setDocumentMode(doc, mode) {
doc['x-mode'] = mode;
},
getDocumentMode(doc) {
return doc['x-mode'];
},
detachNode(node) {
node.remove();
},
insertText(parentNode, text) {
const lastChild = parentNode.lastChild;
if (lastChild != null && lastChild.nodeType === 3 /* TEXT_NODE */) {
lastChild.nodeValue += text;
}
else {
parentNode.appendChild(ownerDocument.createTextNode(text));
}
},
insertTextBefore(parentNode, text, referenceNode) {
const prevNode = parentNode.childNodes[parentNode.childNodes.indexOf(referenceNode) - 1];
if (prevNode != null && prevNode.nodeType === 3 /* TEXT_NODE */) {
prevNode.nodeValue += text;
}
else {
parentNode.insertBefore(ownerDocument.createTextNode(text), referenceNode);
}
},
adoptAttributes(recipient, attrs) {
for (let i = 0; i < attrs.length; i++) {
const attr = attrs[i];
if (recipient.hasAttributeNS(attr.namespace, attr.name) === false) {
recipient.setAttributeNS(attr.namespace, attr.name, attr.value);
}
}
},
getFirstChild(node) {
return node.childNodes[0];
},
getChildNodes(node) {
return node.childNodes;
},
getParentNode(node) {
return node.parentNode;
},
getAttrList(element) {
const attrs = element.attributes.__items.map(attr => {
return {
name: attr.name,
value: attr.value,
namespace: attr.namespaceURI,
prefix: null,
};
});
return attrs;
},
getTagName(element) {
if (element.namespaceURI === 'http://www.w3.org/1999/xhtml') {
return element.nodeName.toLowerCase();
}
else {
return element.nodeName;
}
},
getNamespaceURI(element) {
return element.namespaceURI;
},
getTextNodeContent(textNode) {
return textNode.nodeValue;
},
getCommentNodeContent(commentNode) {
return commentNode.nodeValue;
},
getDocumentTypeNodeName(doctypeNode) {
return doctypeNode['x-name'];
},
getDocumentTypeNodePublicId(doctypeNode) {
return doctypeNode['x-publicId'];
},
getDocumentTypeNodeSystemId(doctypeNode) {
return doctypeNode['x-systemId'];
},
isTextNode(node) {
return node.nodeType === 3 /* TEXT_NODE */;
},
isCommentNode(node) {
return node.nodeType === 8 /* COMMENT_NODE */;
},
isDocumentTypeNode(node) {
return node.nodeType === 10 /* DOCUMENT_TYPE_NODE */;
},
isElementNode(node) {
return node.nodeType === 1 /* ELEMENT_NODE */;
},
};
parseOptions = {
treeAdapter: treeAdapter,
};
docParser.set(ownerDocument, parseOptions);
return parseOptions;
}
class MockNode {
constructor(ownerDocument, nodeType, nodeName, nodeValue) {
this.ownerDocument = ownerDocument;
this.nodeType = nodeType;
this.nodeName = nodeName;
this._nodeValue = nodeValue;
this.parentNode = null;
this.childNodes = [];
}
appendChild(newNode) {
if (newNode.nodeType === 11 /* DOCUMENT_FRAGMENT_NODE */) {
const nodes = newNode.childNodes.slice();
for (const child of nodes) {
this.appendChild(child);
}
}
else {
newNode.remove();
newNode.parentNode = this;
this.childNodes.push(newNode);
connectNode(this.ownerDocument, newNode);
}
return newNode;
}
append(...items) {
items.forEach(item => {
const isNode = typeof item === 'object' && item !== null && 'nodeType' in item;
this.appendChild(isNode ? item : this.ownerDocument.createTextNode(String(item)));
});
}
prepend(...items) {
const firstChild = this.firstChild;
items.forEach(item => {
const isNode = typeof item === 'object' && item !== null && 'nodeType' in item;
this.insertBefore(isNode ? item : this.ownerDocument.createTextNode(String(item)), firstChild);
});
}
cloneNode(deep) {
throw new Error(`invalid node type to clone: ${this.nodeType}, deep: ${deep}`);
}
compareDocumentPosition(_other) {
// unimplemented
// https://developer.mozilla.org/en-US/docs/Web/API/Node/compareDocumentPosition
return -1;
}
get firstChild() {
return this.childNodes[0] || null;
}
insertBefore(newNode, referenceNode) {
if (newNode.nodeType === 11 /* DOCUMENT_FRAGMENT_NODE */) {
for (let i = 0, ii = newNode.childNodes.length; i < ii; i++) {
insertBefore(this, newNode.childNodes[i], referenceNode);
}
}
else {
insertBefore(this, newNode, referenceNode);
}
return newNode;
}
get isConnected() {
let node = this;
while (node != null) {
if (node.nodeType === 9 /* DOCUMENT_NODE */) {
return true;
}
node = node.parentNode;
if (node != null && node.nodeType === 11 /* DOCUMENT_FRAGMENT_NODE */) {
node = node.host;
}
}
return false;
}
isSameNode(node) {
return this === node;
}
get lastChild() {
return this.childNodes[this.childNodes.length - 1] || null;
}
get nextSibling() {
if (this.parentNode != null) {
const index = this.parentNode.childNodes.indexOf(this) + 1;
return this.parentNode.childNodes[index] || null;
}
return null;
}
get nodeValue() {
return this._nodeValue;
}
set nodeValue(value) {
this._nodeValue = value;
}
get parentElement() {
return this.parentNode || null;
}
set parentElement(value) {
this.parentNode = value;
}
get previousSibling() {
if (this.parentNode != null) {
const index = this.parentNode.childNodes.indexOf(this) - 1;
return this.parentNode.childNodes[index] || null;
}
return null;
}
contains(otherNode) {
return this.childNodes.includes(otherNode);
}
removeChild(childNode) {
const index = this.childNodes.indexOf(childNode);
if (index > -1) {
this.childNodes.splice(index, 1);
if (this.nodeType === 1 /* ELEMENT_NODE */) {
const wasConnected = this.isConnected;
childNode.parentNode = null;
if (wasConnected === true) {
disconnectNode(childNode);
}
}
else {
childNode.parentNode = null;
}
}
else {
throw new Error(`node not found within childNodes during removeChild`);
}
return childNode;
}
remove() {
if (this.parentNode != null) {
this.parentNode.removeChild(this);
}
}
replaceChild(newChild, oldChild) {
if (oldChild.parentNode === this) {
this.insertBefore(newChild, oldChild);
oldChild.remove();
return newChild;
}
return null;
}
get textContent() {
return this._nodeValue;
}
set textContent(value) {
this._nodeValue = String(value);
}
}
MockNode.ELEMENT_NODE = 1;
MockNode.TEXT_NODE = 3;
MockNode.PROCESSING_INSTRUCTION_NODE = 7;
MockNode.COMMENT_NODE = 8;
MockNode.DOCUMENT_NODE = 9;
MockNode.DOCUMENT_TYPE_NODE = 10;
MockNode.DOCUMENT_FRAGMENT_NODE = 11;
class MockNodeList {
constructor(ownerDocument, childNodes, length) {
this.ownerDocument = ownerDocument;
this.childNodes = childNodes;
this.length = length;
}
}
class MockElement extends MockNode {
constructor(ownerDocument, nodeName) {
super(ownerDocument, 1 /* ELEMENT_NODE */, typeof nodeName === 'string' ? nodeName : null, null);
this.namespaceURI = null;
}
addEventListener(type, handler) {
addEventListener(this, type, handler);
}
attachShadow(_opts) {
const shadowRoot = this.ownerDocument.createDocumentFragment();
this.shadowRoot = shadowRoot;
return shadowRoot;
}
get shadowRoot() {
return this.__shadowRoot || null;
}
set shadowRoot(shadowRoot) {
if (shadowRoot != null) {
shadowRoot.host = this;
this.__shadowRoot = shadowRoot;
}
else {
delete this.__shadowRoot;
}
}
get attributes() {
if (this.__attributeMap == null) {
this.__attributeMap = createAttributeProxy(false);
}
return this.__attributeMap;
}
set attributes(attrs) {
this.__attributeMap = attrs;
}
get children() {
return this.childNodes.filter(n => n.nodeType === 1 /* ELEMENT_NODE */);
}
get childElementCount() {
return this.childNodes.filter(n => n.nodeType === 1 /* ELEMENT_NODE */).length;
}
get className() {
return this.getAttributeNS(null, 'class') || '';
}
set className(value) {
this.setAttributeNS(null, 'class', value);
}
get classList() {
return new MockClassList(this);
}
click() {
dispatchEvent(this, new MockEvent('click', { bubbles: true, cancelable: true, composed: true }));
}
cloneNode(_deep) {
// implemented on MockElement.prototype from within element.ts
return null;
}
closest(selector) {
let elm = this;
while (elm != null) {
if (elm.matches(selector)) {
return elm;
}
elm = elm.parentNode;
}
return null;
}
get dataset() {
return dataset(this);
}
get dir() {
return this.getAttributeNS(null, 'dir') || '';
}
set dir(value) {
this.setAttributeNS(null, 'dir', value);
}
dispatchEvent(ev) {
return dispatchEvent(this, ev);
}
get firstElementChild() {
return this.children[0] || null;
}
getAttribute(attrName) {
if (attrName === 'style') {
if (this.__style != null && this.__style.length > 0) {
return this.style.cssText;
}
return null;
}
const attr = this.attributes.getNamedItem(attrName);
if (attr != null) {
return attr.value;
}
return null;
}
getAttributeNS(namespaceURI, attrName) {
const attr = this.attributes.getNamedItemNS(namespaceURI, attrName);
if (attr != null) {
return attr.value;
}
return null;
}
getBoundingClientRect() {
return { bottom: 0, height: 0, left: 0, right: 0, top: 0, width: 0, x: 0, y: 0 };
}
getRootNode(opts) {
const isComposed = opts != null && opts.composed === true;
let node = this;
while (node.parentNode != null) {
node = node.parentNode;
if (isComposed === true && node.parentNode == null && node.host != null) {
node = node.host;
}
}
return node;
}
get draggable() {
return this.getAttributeNS(null, 'draggable') === 'true';
}
set draggable(value) {
this.setAttributeNS(null, 'draggable', value);
}
hasChildNodes() {
return this.childNodes.length > 0;
}
get id() {
return this.getAttributeNS(null, 'id') || '';
}
set id(value) {
this.setAttributeNS(null, 'id', value);
}
get innerHTML() {
if (this.childNodes.length === 0) {
return '';
}
return serializeNodeToHtml(this, {
newLines: false,
indentSpaces: 0,
});
}
set innerHTML(html) {
if (NON_ESCAPABLE_CONTENT.has(this.nodeName) === true) {
setTextContent(this, html);
}
else {
for (let i = this.childNodes.length - 1; i >= 0; i--) {
this.removeChild(this.childNodes[i]);
}
if (typeof html === 'string') {
const frag = parseFragmentUtil(this.ownerDocument, html);
while (frag.childNodes.length > 0) {
this.appendChild(frag.childNodes[0]);
}
}
}
}
get innerText() {
const text = [];
getTextContent(this.childNodes, text);
return text.join('');
}
set innerText(value) {
setTextContent(this, value);
}
insertAdjacentElement(position, elm) {
if (position === 'beforebegin') {
insertBefore(this.parentNode, elm, this);
}
else if (position === 'afterbegin') {
this.prepend(elm);
}
else if (position === 'beforeend') {
this.appendChild(elm);
}
else if (position === 'afterend') {
insertBefore(this.parentNode, elm, this.nextSibling);
}
return elm;
}
insertAdjacentHTML(position, html) {
const frag = parseFragmentUtil(this.ownerDocument, html);
if (position === 'beforebegin') {
while (frag.childNodes.length > 0) {
insertBefore(this.parentNode, frag.childNodes[0], this);
}
}
else if (position === 'afterbegin') {
while (frag.childNodes.length > 0) {
this.prepend(frag.childNodes[frag.childNodes.length - 1]);
}
}
else if (position === 'beforeend') {
while (frag.childNodes.length > 0) {
this.appendChild(frag.childNodes[0]);
}
}
else if (position === 'afterend') {
while (frag.childNodes.length > 0) {
insertBefore(this.parentNode, frag.childNodes[frag.childNodes.length - 1], this.nextSibling);
}
}
}
insertAdjacentText(position, text) {
const elm = this.ownerDocument.createTextNode(text);
if (position === 'beforebegin') {
insertBefore(this.parentNode, elm, this);
}
else if (position === 'afterbegin') {
this.prepend(elm);
}
else if (position === 'beforeend') {
this.appendChild(elm);
}
else if (position === 'afterend') {
insertBefore(this.parentNode, elm, this.nextSibling);
}
}
hasAttribute(attrName) {
if (attrName === 'style') {
return this.__style != null && this.__style.length > 0;
}
return this.getAttribute(attrName) !== null;
}
hasAttributeNS(namespaceURI, name) {
return this.getAttributeNS(namespaceURI, name) !== null;
}
get hidden() {
return this.hasAttributeNS(null, 'hidden');
}
set hidden(isHidden) {
if (isHidden === true) {
this.setAttributeNS(null, 'hidden', '');
}
else {
this.removeAttributeNS(null, 'hidden');
}
}
get lang() {
return this.getAttributeNS(null, 'lang') || '';
}
set lang(value) {
this.setAttributeNS(null, 'lang', value);
}
get lastElementChild() {
const children = this.children;
return children[children.length - 1] || null;
}
matches(selector) {
return matches(selector, this);
}
get nextElementSibling() {
const parentElement = this.parentElement;
if (parentElement != null &&
(parentElement.nodeType === 1 /* ELEMENT_NODE */ || parentElement.nodeType === 11 /* DOCUMENT_FRAGMENT_NODE */ || parentElement.nodeType === 9 /* DOCUMENT_NODE */)) {
const children = parentElement.children;
const index = children.indexOf(this) + 1;
return parentElement.children[index] || null;
}
return null;
}
get outerHTML() {
return serializeNodeToHtml(this, {
newLines: false,
outerHtml: true,
indentSpaces: 0,
});
}
get previousElementSibling() {
const parentElement = this.parentElement;
if (parentElement != null &&
(parentElement.nodeType === 1 /* ELEMENT_NODE */ || parentElement.nodeType === 11 /* DOCUMENT_FRAGMENT_NODE */ || parentElement.nodeType === 9 /* DOCUMENT_NODE */)) {
const children = parentElement.children;
const index = children.indexOf(this) - 1;
return parentElement.children[index] || null;
}
return null;
}
getElementsByClassName(classNames) {
const classes = classNames
.trim()
.split(' ')
.filter(c => c.length > 0);
const results = [];
getElementsByClassName(this, classes, results);
return results;
}
getElementsByTagName(tagName) {
const results = [];
getElementsByTagName(this, tagName.toLowerCase(), results);
return results;
}
querySelector(selector) {
return selectOne(selector, this);
}
querySelectorAll(selector) {
return selectAll(selector, this);
}
removeAttribute(attrName) {
if (attrName === 'style') {
delete this.__style;
}
else {
const attr = this.attributes.getNamedItem(attrName);
if (attr != null) {
this.attributes.removeNamedItemNS(attr);
if (checkAttributeChanged(this) === true) {
attributeChanged(this, attrName, attr.value, null);
}
}
}
}
removeAttributeNS(namespaceURI, attrName) {
const attr = this.attributes.getNamedItemNS(namespaceURI, attrName);
if (attr != null) {
this.attributes.removeNamedItemNS(attr);
if (checkAttributeChanged(this) === true) {
attributeChanged(this, attrName, attr.value, null);
}
}
}
removeEventListener(type, handler) {
removeEventListener(this, type, handler);
}
setAttribute(attrName, value) {
if (attrName === 'style') {
this.style = value;
}
else {
const attributes = this.attributes;
let attr = attributes.getNamedItem(attrName);
const checkAttrChanged = checkAttributeChanged(this);
if (attr != null) {
if (checkAttrChanged === true) {
const oldValue = attr.value;
attr.value = value;
if (oldValue !== attr.value) {
attributeChanged(this, attr.name, oldValue, attr.value);
}
}
else {
attr.value = value;
}
}
else {
if (attributes.caseInsensitive) {
attrName = attrName.toLowerCase();
}
attr = new MockAttr(attrName, value);
attributes.__items.push(attr);
if (checkAttrChanged === true) {
attributeChanged(this, attrName, null, attr.value);
}
}
}
}
setAttributeNS(namespaceURI, attrName, value) {
const attributes = this.attributes;
let attr = attributes.getNamedItemNS(namespaceURI, attrName);
const checkAttrChanged = checkAttributeChanged(this);
if (attr != null) {
if (checkAttrChanged === true) {
const oldValue = attr.value;
attr.value = value;
if (oldValue !== attr.value) {
attributeChanged(this, attr.name, oldValue, attr.value);
}
}
else {
attr.value = value;
}
}
else {
attr = new MockAttr(attrName, value, namespaceURI);
attributes.__items.push(attr);
if (checkAttrChanged === true) {
attributeChanged(this, attrName, null, attr.value);
}
}
}
get style() {
if (this.__style == null) {
this.__style = createCSSStyleDeclaration();
}
return this.__style;
}
set style(val) {
if (typeof val === 'string') {
if (this.__style == null) {
this.__style = createCSSStyleDeclaration();
}
this.__style.cssText = val;
}
else {
this.__style = val;
}
}
get tabIndex() {
return parseInt(this.getAttributeNS(null, 'tabindex') || '-1', 10);
}
set tabIndex(value) {
this.setAttributeNS(null, 'tabindex', value);
}
get tagName() {
return this.nodeName;
}
set tagName(value) {
this.nodeName = value;
}
get textContent() {
const text = [];
getTextContent(this.childNodes, text);
return text.join('');
}
set textContent(value) {
setTextContent(this, value);
}
get title() {
return this.getAttributeNS(null, 'title') || '';
}
set title(value) {
this.setAttributeNS(null, 'title', value);
}
onanimationstart() {
/**/
}
onanimationend() {
/**/
}
onanimationiteration() {
/**/
}
onabort() {
/**/
}
onauxclick() {
/**/
}
onbeforecopy() {
/**/
}
onbeforecut() {
/**/
}
onbeforepaste() {
/**/
}
onblur() {
/**/
}
oncancel() {
/**/
}
oncanplay() {
/**/
}
oncanplaythrough() {
/**/
}
onchange() {
/**/
}
onclick() {
/**/
}
onclose() {
/**/
}
oncontextmenu() {
/**/
}
oncopy() {
/**/
}
oncuechange() {
/**/
}
oncut() {
/**/
}
ondblclick() {
/**/
}
ondrag() {
/**/
}
ondragend() {
/**/
}
ondragenter() {
/**/
}
ondragleave() {
/**/
}
ondragover() {
/**/
}
ondragstart() {
/**/
}
ondrop() {
/**/
}
ondurationchange() {
/**/
}
onemptied() {
/**/
}
onended() {
/**/
}
onerror() {
/**/
}
onfocus() {
/**/
}
onfocusin() {
/**/
}
onfocusout() {
/**/
}
onformdata() {
/**/
}
onfullscreenchange() {
/**/
}
onfullscreenerror() {
/**/
}
ongotpointercapture() {
/**/
}
oninput() {
/**/
}
oninvalid() {
/**/
}
onkeydown() {
/**/
}
onkeypress() {
/**/
}
onkeyup() {
/**/
}
onload() {
/**/
}
onloadeddata() {
/**/
}
onloadedmetadata() {
/**/
}
onloadstart() {
/**/
}
onlostpointercapture() {
/**/
}
onmousedown() {
/**/
}
onmouseenter() {
/**/
}
onmouseleave() {
/**/
}
onmousemove() {
/**/
}
onmouseout() {
/**/
}
onmouseover() {
/**/
}
onmouseup() {
/**/
}
onmousewheel() {
/**/
}
onpaste() {
/**/
}
onpause() {
/**/
}
onplay() {
/**/
}
onplaying() {
/**/
}
onpointercancel() {
/**/
}
onpointerdown() {
/**/
}
onpointerenter() {
/**/
}
onpointerleave() {
/**/
}
onpointermove() {
/**/
}
onpointerout() {
/**/
}
onpointerover() {
/**/
}
onpointerup() {
/**/
}
onprogress() {
/**/
}
onratechange() {
/**/
}
onreset() {
/**/
}
onresize() {
/**/
}
onscroll() {
/**/
}
onsearch() {
/**/
}
onseeked() {
/**/
}
onseeking() {
/**/
}
onselect() {
/**/
}
onselectstart() {
/**/
}
onstalled() {
/**/
}
onsubmit() {
/**/
}
onsuspend() {
/**/
}
ontimeupdate() {
/**/
}
ontoggle() {
/**/
}
onvolumechange() {
/**/
}
onwaiting() {
/**/
}
onwebkitfullscreenchange() {
/**/
}
onwebkitfullscreenerror() {
/**/
}
onwheel() {
/**/
}
toString(opts) {
return serializeNodeToHtml(this, opts);
}
}
function getElementsByClassName(elm, classNames, foundElms) {
const children = elm.children;
for (let i = 0, ii = children.length; i < ii; i++) {
const childElm = children[i];
for (let j = 0, jj = classNames.length; j < jj; j++) {
if (childElm.classList.contains(classNames[j])) {
foundElms.push(childElm);
}
}
getElementsByClassName(childElm, classNames, foundElms);
}
}
function getElementsByTagName(elm, tagName, foundElms) {
const children = elm.children;
for (let i = 0, ii = children.length; i < ii; i++) {
const childElm = children[i];
if (tagName === '*' || childElm.nodeName.toLowerCase() === tagName) {
foundElms.push(childElm);
}
getElementsByTagName(childElm, tagName, foundElms);
}
}
function resetElement(elm) {
resetEventListeners(elm);
delete elm.__attributeMap;
delete elm.__shadowRoot;
delete elm.__style;
}
function insertBefore(parentNode, newNode, referenceNode) {
if (newNode !== referenceNode) {
newNode.remove();
newNode.parentNode = parentNode;
newNode.ownerDocument = parentNode.ownerDocument;
if (referenceNode != null) {
const index = parentNode.childNodes.indexOf(referenceNode);
if (index > -1) {
parentNode.childNodes.splice(index, 0, newNode);
}
else {
throw new Error(`referenceNode not found in parentNode.childNodes`);
}
}
else {
parentNode.childNodes.push(newNode);
}
connectNode(parentNode.ownerDocument, newNode);
}
return newNode;
}
class MockHTMLElement extends MockElement {
constructor(ownerDocument, nodeName) {
super(ownerDocument, typeof nodeName === 'string' ? nodeName.toUpperCase() : null);
this.namespaceURI = 'http://www.w3.org/1999/xhtml';
}
get tagName() {
return this.nodeName;
}
set tagName(value) {
this.nodeName = value;
}
get attributes() {
if (this.__attributeMap == null) {
this.__attributeMap = createAttributeProxy(true);
}
return this.__attributeMap;
}
set attributes(attrs) {
this.__attributeMap = attrs;
}
}
class MockTextNode extends MockNode {
constructor(ownerDocument, text) {
super(ownerDocument, 3 /* TEXT_NODE */, "#text" /* TEXT_NODE */, text);
}
cloneNode(_deep) {
return new MockTextNode(null, this.nodeValue);
}
get textContent() {
return this.nodeValue;
}
set textContent(text) {
this.nodeValue = text;
}
get data() {
return this.nodeValue;
}
set data(text) {
this.nodeValue = text;
}
get wholeText() {
if (this.parentNode != null) {
const text = [];
for (let i = 0, ii = this.parentNode.childNodes.length; i < ii; i++) {
const childNode = this.parentNode.childNodes[i];
if (childNode.nodeType === 3 /* TEXT_NODE */) {
text.push(childNode.nodeValue);
}
}
return text.join('');
}
return this.nodeValue;
}
}
function getTextContent(childNodes, text) {
for (let i = 0, ii = childNodes.length; i < ii; i++) {
const childNode = childNodes[i];
if (childNode.nodeType === 3 /* TEXT_NODE */) {
text.push(childNode.nodeValue);
}
else if (childNode.nodeType === 1 /* ELEMENT_NODE */) {
getTextContent(childNode.childNodes, text);
}
}
}
function setTextContent(elm, text) {
for (let i = elm.childNodes.length - 1; i >= 0; i--) {
elm.removeChild(elm.childNodes[i]);
}
const textNode = new MockTextNode(elm.ownerDocument, text);
elm.appendChild(textNode);
}
class MockComment extends MockNode {
constructor(ownerDocument, data) {
super(ownerDocument, 8 /* COMMENT_NODE */, "#comment" /* COMMENT_NODE */, data);
}
cloneNode(_deep) {
return new MockComment(null, this.nodeValue);
}
get textContent() {
return this.nodeValue;
}
set textContent(text) {
this.nodeValue = text;
}
}
class MockDocumentFragment extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, null);
this.nodeName = "#document-fragment" /* DOCUMENT_FRAGMENT_NODE */;
this.nodeType = 11 /* DOCUMENT_FRAGMENT_NODE */;
}
getElementById(id) {
return getElementById(this, id);
}
cloneNode(deep) {
const cloned = new MockDocumentFragment(null);
if (deep) {
for (let i = 0, ii = this.childNodes.length; i < ii; i++) {
const childNode = this.childNodes[i];
if (childNode.nodeType === 1 /* ELEMENT_NODE */ || childNode.nodeType === 3 /* TEXT_NODE */ || childNode.nodeType === 8 /* COMMENT_NODE */) {
const clonedChildNode = this.childNodes[i].cloneNode(true);
cloned.appendChild(clonedChildNode);
}
}
}
return cloned;
}
}
class MockDocumentTypeNode extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, '!DOCTYPE');
this.nodeType = 10 /* DOCUMENT_TYPE_NODE */;
this.setAttribute('html', '');
}
}
class MockCSSRule {
constructor(parentStyleSheet) {
this.parentStyleSheet = parentStyleSheet;
this.cssText = '';
this.type = 0;
}
}
class MockCSSStyleSheet {
constructor(ownerNode) {
this.type = 'text/css';
this.parentStyleSheet = null;
this.cssRules = [];
this.ownerNode = ownerNode;
}
get rules() {
return this.cssRules;
}
set rules(rules) {
this.cssRules = rules;
}
deleteRule(index) {
if (index >= 0 && index < this.cssRules.length) {
this.cssRules.splice(index, 1);
updateStyleTextNode(this.ownerNode);
}
}
insertRule(rule, index = 0) {
if (typeof index !== 'number') {
index = 0;
}
if (index < 0) {
index = 0;
}
if (index > this.cssRules.length) {
index = this.cssRules.length;
}
const cssRule = new MockCSSRule(this);
cssRule.cssText = rule;
this.cssRules.splice(index, 0, cssRule);
updateStyleTextNode(this.ownerNode);
return index;
}
}
function getStyleElementText(styleElm) {
const output = [];
for (let i = 0; i < styleElm.childNodes.length; i++) {
output.push(styleElm.childNodes[i].nodeValue);
}
return output.join('');
}
function setStyleElementText(styleElm, text) {
// keeping the innerHTML and the sheet.cssRules connected
// is not technically correct, but since we're doing
// SSR we'll need to turn any assigned cssRules into
// real text, not just properties that aren't rendered
const sheet = styleElm.sheet;
sheet.cssRules.length = 0;
sheet.insertRule(text);
updateStyleTextNode(styleElm);
}
function updateStyleTextNode(styleElm) {
const childNodeLen = styleElm.childNodes.length;
if (childNodeLen > 1) {
for (let i = childNodeLen - 1; i >= 1; i--) {
styleElm.removeChild(styleElm.childNodes[i]);
}
}
else if (childNodeLen < 1) {
styleElm.appendChild(styleElm.ownerDocument.createTextNode(''));
}
const textNode = styleElm.childNodes[0];
textNode.nodeValue = styleElm.sheet.cssRules.map(r => r.cssText).join('\n');
}
function createElement(ownerDocument, tagName) {
if (typeof tagName !== 'string' || tagName === '' || !/^[a-z0-9-_:]+$/i.test(tagName)) {
throw new Error(`The tag name provided (${tagName}) is not a valid name.`);
}
tagName = tagName.toLowerCase();
switch (tagName) {
case 'a':
return new MockAnchorElement(ownerDocument);
case 'base':
return new MockBaseElement(ownerDocument);
case 'button':
return new MockButtonElement(ownerDocument);
case 'canvas':
return new MockCanvasElement(ownerDocument);
case 'form':
return new MockFormElement(ownerDocument);
case 'img':
return new MockImageElement(ownerDocument);
case 'input':
return new MockInputElement(ownerDocument);
case 'link':
return new MockLinkElement(ownerDocument);
case 'meta':
return new MockMetaElement(ownerDocument);
case 'script':
return new MockScriptElement(ownerDocument);
case 'style':
return new MockStyleElement(ownerDocument);
case 'template':
return new MockTemplateElement(ownerDocument);
case 'title':
return new MockTitleElement(ownerDocument);
}
if (ownerDocument != null && tagName.includes('-')) {
const win = ownerDocument.defaultView;
if (win != null && win.customElements != null) {
return createCustomElement(win.customElements, ownerDocument, tagName);
}
}
return new MockHTMLElement(ownerDocument, tagName);
}
function createElementNS(ownerDocument, namespaceURI, tagName) {
if (namespaceURI === 'http://www.w3.org/1999/xhtml') {
return createElement(ownerDocument, tagName);
}
else if (namespaceURI === 'http://www.w3.org/2000/svg') {
return new MockSVGElement(ownerDocument, tagName);
}
else {
return new MockElement(ownerDocument, tagName);
}
}
class MockAnchorElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'a');
}
get href() {
return fullUrl(this, 'href');
}
set href(value) {
this.setAttribute('href', value);
}
}
class MockButtonElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'button');
}
}
patchPropAttributes(MockButtonElement.prototype, {
type: String,
}, {
type: 'submit',
});
class MockImageElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'img');
}
get draggable() {
return this.getAttributeNS(null, 'draggable') !== 'false';
}
set draggable(value) {
this.setAttributeNS(null, 'draggable', value);
}
get src() {
return fullUrl(this, 'src');
}
set src(value) {
this.setAttribute('src', value);
}
}
patchPropAttributes(MockImageElement.prototype, {
height: Number,
width: Number,
});
class MockInputElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'input');
}
get list() {
const listId = this.getAttribute('list');
if (listId) {
return this.ownerDocument.getElementById(listId);
}
return null;
}
}
patchPropAttributes(MockInputElement.prototype, {
accept: String,
autocomplete: String,
autofocus: Boolean,
capture: String,
checked: Boolean,
disabled: Boolean,
form: String,
formaction: String,
formenctype: String,
formmethod: String,
formnovalidate: String,
formtarget: String,
height: Number,
inputmode: String,
max: String,
maxLength: Number,
min: String,
minLength: Number,
multiple: Boolean,
name: String,
pattern: String,
placeholder: String,
required: Boolean,
readOnly: Boolean,
size: Number,
spellCheck: Boolean,
src: String,
step: String,
type: String,
value: String,
width: Number,
}, {
type: 'text',
});
class MockFormElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'form');
}
}
patchPropAttributes(MockFormElement.prototype, {
name: String,
});
class MockLinkElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'link');
}
get href() {
return fullUrl(this, 'href');
}
set href(value) {
this.setAttribute('href', value);
}
}
patchPropAttributes(MockLinkElement.prototype, {
crossorigin: String,
media: String,
rel: String,
type: String,
});
class MockMetaElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'meta');
}
}
patchPropAttributes(MockMetaElement.prototype, {
charset: String,
content: String,
name: String,
});
class MockScriptElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'script');
}
get src() {
return fullUrl(this, 'src');
}
set src(value) {
this.setAttribute('src', value);
}
}
patchPropAttributes(MockScriptElement.prototype, {
type: String,
});
class MockStyleElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'style');
this.sheet = new MockCSSStyleSheet(this);
}
get innerHTML() {
return getStyleElementText(this);
}
set innerHTML(value) {
setStyleElementText(this, value);
}
get innerText() {
return getStyleElementText(this);
}
set innerText(value) {
setStyleElementText(this, value);
}
get textContent() {
return getStyleElementText(this);
}
set textContent(value) {
setStyleElementText(this, value);
}
}
class MockSVGElement extends MockElement {
// SVGElement properties and methods
get ownerSVGElement() {
return null;
}
get viewportElement() {
return null;
}
focus() {
/**/
}
onunload() {
/**/
}
// SVGGeometryElement properties and methods
get pathLength() {
return 0;
}
isPointInFill(_pt) {
return false;
}
isPointInStroke(_pt) {
return false;
}
getTotalLength() {
return 0;
}
}
class MockBaseElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'base');
}
get href() {
return fullUrl(this, 'href');
}
set href(value) {
this.setAttribute('href', value);
}
}
class MockTemplateElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'template');
this.content = new MockDocumentFragment(ownerDocument);
}
get innerHTML() {
return this.content.innerHTML;
}
set innerHTML(html) {
this.content.innerHTML = html;
}
cloneNode(deep) {
const cloned = new MockTemplateElement(null);
cloned.attributes = cloneAttributes(this.attributes);
const styleCssText = this.getAttribute('style');
if (styleCssText != null && styleCssText.length > 0) {
cloned.setAttribute('style', styleCssText);
}
cloned.content = this.content.cloneNode(deep);
if (deep) {
for (let i = 0, ii = this.childNodes.length; i < ii; i++) {
const clonedChildNode = this.childNodes[i].cloneNode(true);
cloned.appendChild(clonedChildNode);
}
}
return cloned;
}
}
class MockTitleElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'title');
}
get text() {
return this.textContent;
}
set text(value) {
this.textContent = value;
}
}
class MockCanvasElement extends MockHTMLElement {
constructor(ownerDocument) {
super(ownerDocument, 'canvas');
}
getContext() {
return {
fillRect() {
return;
},
clearRect() { },
getImageData: function (_, __, w, h) {
return {
data: new Array(w * h * 4),
};
},
putImageData() { },
createImageData: function () {
return [];
},
setTransform() { },
drawImage() { },
save() { },
fillText() { },
restore() { },
beginPath() { },
moveTo() { },
lineTo() { },
closePath() { },
stroke() { },
translate() { },
scale() { },
rotate() { },
arc() { },
fill() { },
measureText() {
return { width: 0 };
},
transform() { },
rect() { },
clip() { },
};
}
}
function fullUrl(elm, attrName) {
const val = elm.getAttribute(attrName) || '';
if (elm.ownerDocument != null) {
const win = elm.ownerDocument.defaultView;
if (win != null) {
const loc = win.location;
if (loc != null) {
try {
const url = new URL(val, loc.href);
return url.href;
}
catch (e) { }
}
}
}
return val.replace(/\'|\"/g, '').trim();
}
function patchPropAttributes(prototype, attrs, defaults = {}) {
Object.keys(attrs).forEach(propName => {
const attr = attrs[propName];
const defaultValue = defaults[propName];
if (attr === Boolean) {
Object.defineProperty(prototype, propName, {
get() {
return this.hasAttribute(propName);
},
set(value) {
if (value) {
this.setAttribute(propName, '');
}
else {
this.removeAttribute(propName);
}
},
});
}
else if (attr === Number) {
Object.defineProperty(prototype, propName, {
get() {
const value = this.getAttribute(propName);
return value ? parseInt(value, 10) : defaultValue === undefined ? 0 : defaultValue;
},
set(value) {
this.setAttribute(propName, value);
},
});
}
else {
Object.defineProperty(prototype, propName, {
get() {
return this.hasAttribute(propName) ? this.getAttribute(propName) : defaultValue || '';
},
set(value) {
this.setAttribute(propName, value);
},
});
}
});
}
MockElement.prototype.cloneNode = function (deep) {
// because we're creating elements, which extending specific HTML base classes there
// is a MockElement circular reference that bundling has trouble dealing with so
// the fix is to add cloneNode() to MockElement's prototype after the HTML classes
const cloned = createElement(this.ownerDocument, this.nodeName);
cloned.attributes = cloneAttributes(this.attributes);
const styleCssText = this.getAttribute('style');
if (styleCssText != null && styleCssText.length > 0) {
cloned.setAttribute('style', styleCssText);
}
if (deep) {
for (let i = 0, ii = this.childNodes.length; i < ii; i++) {
const clonedChildNode = this.childNodes[i].cloneNode(true);
cloned.appendChild(clonedChildNode);
}
}
return cloned;
};
let sharedDocument;
function parseHtmlToDocument(html, ownerDocument = null) {
if (ownerDocument == null) {
if (sharedDocument == null) {
sharedDocument = new MockDocument();
}
ownerDocument = sharedDocument;
}
return parseDocumentUtil(ownerDocument, html);
}
function parseHtmlToFragment(html, ownerDocument = null) {
if (ownerDocument == null) {
if (sharedDocument == null) {
sharedDocument = new MockDocument();
}
ownerDocument = sharedDocument;
}
return parseFragmentUtil(ownerDocument, html);
}
class MockHeaders {
constructor(init) {
this._values = [];
if (typeof init === 'object') {
if (typeof init[Symbol.iterator] === 'function') {
const kvs = [];
for (const kv of init) {
if (typeof kv[Symbol.iterator] === 'function') {
kvs.push([...kv]);
}
}
for (const kv of kvs) {
this.append(kv[0], kv[1]);
}
}
else {
for (const key in init) {
this.append(key, init[key]);
}
}
}
}
append(key, value) {
this._values.push([key, value + '']);
}
delete(key) {
key = key.toLowerCase();
for (let i = this._values.length - 1; i >= 0; i--) {
if (this._values[i][0].toLowerCase() === key) {
this._values.splice(i, 1);
}
}
}
entries() {
const entries = [];
for (const kv of this.keys()) {
entries.push([kv, this.get(kv)]);
}
let index = -1;
return {
next() {
index++;
return {
value: entries[index],
done: !entries[index],
};
},
[Symbol.iterator]() {
return this;
},
};
}
forEach(cb) {
for (const kv of this.entries()) {
cb(kv[1], kv[0]);
}
}
get(key) {
const rtn = [];
key = key.toLowerCase();
for (const kv of this._values) {
if (kv[0].toLowerCase() === key) {
rtn.push(kv[1]);
}
}
return rtn.length > 0 ? rtn.join(', ') : null;
}
has(key) {
key = key.toLowerCase();
for (const kv of this._values) {
if (kv[0].toLowerCase() === key) {
return true;
}
}
return false;
}
keys() {
const keys = [];
for (const kv of this._values) {
const key = kv[0].toLowerCase();
if (!keys.includes(key)) {
keys.push(key);
}
}
let index = -1;
return {
next() {
index++;
return {
value: keys[index],
done: !keys[index],
};
},
[Symbol.iterator]() {
return this;
},
};
}
set(key, value) {
for (const kv of this._values) {
if (kv[0].toLowerCase() === key.toLowerCase()) {
kv[1] = value + '';
return;
}
}
this.append(key, value);
}
values() {
const values = this._values;
let index = -1;
return {
next() {
index++;
const done = !values[index];
return {
value: done ? undefined : values[index][1],
done,
};
},
[Symbol.iterator]() {
return this;
},
};
}
[Symbol.iterator]() {
return this.entries();
}
}
class MockRequest {
constructor(input, init = {}) {
this._method = 'GET';
this._url = '/';
this.bodyUsed = false;
this.cache = 'default';
this.credentials = 'same-origin';
this.integrity = '';
this.keepalive = false;
this.mode = 'cors';
this.redirect = 'follow';
this.referrer = 'about:client';
this.referrerPolicy = '';
if (typeof input === 'string') {
this.url = input;
}
else if (input) {
Object.assign(this, input);
this.headers = new MockHeaders(input.headers);
}
Object.assign(this, init);
if (init.headers) {
this.headers = new MockHeaders(init.headers);
}
if (!this.headers) {
this.headers = new MockHeaders();
}
}
get url() {
if (typeof this._url === 'string') {
return new URL(this._url, location.href).href;
}
return new URL('/', location.href).href;
}
set url(value) {
this._url = value;
}
get method() {
if (typeof this._method === 'string') {
return this._method.toUpperCase();
}
return 'GET';
}
set method(value) {
this._method = value;
}
clone() {
const clone = { ...this };
clone.headers = new MockHeaders(this.headers);
return new MockRequest(clone);
}
}
class MockResponse {
constructor(body, init = {}) {
this.ok = true;
this.status = 200;
this.statusText = '';
this.type = 'default';
this.url = '';
this._body = body;
if (init) {
Object.assign(this, init);
}
this.headers = new MockHeaders(init.headers);
}
async json() {
return JSON.parse(this._body);
}
async text() {
return this._body;
}
clone() {
const initClone = { ...this };
initClone.headers = new MockHeaders(this.headers);
return new MockResponse(this._body, initClone);
}
}
function setupGlobal(gbl) {
if (gbl.window == null) {
const win = (gbl.window = new MockWindow());
WINDOW_FUNCTIONS.forEach(fnName => {
if (!(fnName in gbl)) {
gbl[fnName] = win[fnName].bind(win);
}
});
WINDOW_PROPS.forEach(propName => {
if (!(propName in gbl)) {
Object.defineProperty(gbl, propName, {
get() {
return win[propName];
},
set(val) {
win[propName] = val;
},
configurable: true,
enumerable: true,
});
}
});
GLOBAL_CONSTRUCTORS.forEach(([cstrName]) => {
gbl[cstrName] = win[cstrName];
});
}
return gbl.window;
}
function teardownGlobal(gbl) {
const win = gbl.window;
if (win && typeof win.close === 'function') {
win.close();
}
}
function patchWindow(winToBePatched) {
const mockWin = new MockWindow(false);
WINDOW_FUNCTIONS.forEach(fnName => {
if (typeof winToBePatched[fnName] !== 'function') {
winToBePatched[fnName] = mockWin[fnName].bind(mockWin);
}
});
WINDOW_PROPS.forEach(propName => {
if (winToBePatched === undefined) {
Object.defineProperty(winToBePatched, propName, {
get() {
return mockWin[propName];
},
set(val) {
mockWin[propName] = val;
},
configurable: true,
enumerable: true,
});
}
});
}
function addGlobalsToWindowPrototype(mockWinPrototype) {
GLOBAL_CONSTRUCTORS.forEach(([cstrName, Cstr]) => {
Object.defineProperty(mockWinPrototype, cstrName, {
get() {
return this['__' + cstrName] || Cstr;
},
set(cstr) {
this['__' + cstrName] = cstr;
},
configurable: true,
enumerable: true,
});
});
}
const WINDOW_FUNCTIONS = [
'addEventListener',
'alert',
'blur',
'cancelAnimationFrame',
'cancelIdleCallback',
'clearInterval',
'clearTimeout',
'close',
'confirm',
'dispatchEvent',
'focus',
'getComputedStyle',
'matchMedia',
'open',
'prompt',
'removeEventListener',
'requestAnimationFrame',
'requestIdleCallback',
'URL',
];
const WINDOW_PROPS = [
'customElements',
'devicePixelRatio',
'document',
'history',
'innerHeight',
'innerWidth',
'localStorage',
'location',
'navigator',
'pageXOffset',
'pageYOffset',
'performance',
'screenLeft',
'screenTop',
'screenX',
'screenY',
'scrollX',
'scrollY',
'sessionStorage',
'CSS',
'CustomEvent',
'Event',
'Element',
'HTMLElement',
'Node',
'NodeList',
'KeyboardEvent',
'MouseEvent',
];
const GLOBAL_CONSTRUCTORS = [
['CustomEvent', MockCustomEvent],
['Event', MockEvent],
['Headers', MockHeaders],
['KeyboardEvent', MockKeyboardEvent],
['MouseEvent', MockMouseEvent],
['Request', MockRequest],
['Response', MockResponse],
['HTMLAnchorElement', MockAnchorElement],
['HTMLBaseElement', MockBaseElement],
['HTMLButtonElement', MockButtonElement],
['HTMLCanvasElement', MockCanvasElement],
['HTMLFormElement', MockFormElement],
['HTMLImageElement', MockImageElement],
['HTMLInputElement', MockInputElement],
['HTMLLinkElement', MockLinkElement],
['HTMLMetaElement', MockMetaElement],
['HTMLScriptElement', MockScriptElement],
['HTMLStyleElement', MockStyleElement],
['HTMLTemplateElement', MockTemplateElement],
['HTMLTitleElement', MockTitleElement],
];
const consoleNoop = () => {
/**/
};
function createConsole() {
return {
debug: consoleNoop,
error: consoleNoop,
info: consoleNoop,
log: consoleNoop,
warn: consoleNoop,
dir: consoleNoop,
dirxml: consoleNoop,
table: consoleNoop,
trace: consoleNoop,
group: consoleNoop,
groupCollapsed: consoleNoop,
groupEnd: consoleNoop,
clear: consoleNoop,
count: consoleNoop,
countReset: consoleNoop,
assert: consoleNoop,
profile: consoleNoop,
profileEnd: consoleNoop,
time: consoleNoop,
timeLog: consoleNoop,
timeEnd: consoleNoop,
timeStamp: consoleNoop,
context: consoleNoop,
memory: consoleNoop,
};
}
class MockHistory {
constructor() {
this.items = [];
}
get length() {
return this.items.length;
}
back() {
this.go(-1);
}
forward() {
this.go(1);
}
go(_value) {
//
}
pushState(_state, _title, _url) {
//
}
replaceState(_state, _title, _url) {
//
}
}
class MockIntersectionObserver {
constructor() {
/**/
}
disconnect() {
/**/
}
observe() {
/**/
}
takeRecords() {
return [];
}
unobserve() {
/**/
}
}
class MockLocation {
constructor() {
this.ancestorOrigins = null;
this.protocol = '';
this.host = '';
this.hostname = '';
this.port = '';
this.pathname = '';
this.search = '';
this.hash = '';
this.username = '';
this.password = '';
this.origin = '';
this._href = '';
}
get href() {
return this._href;
}
set href(value) {
const url = new URL(value, 'http://mockdoc.stenciljs.com');
this._href = url.href;
this.protocol = url.protocol;
this.host = url.host;
this.hostname = url.hostname;
this.port = url.port;
this.pathname = url.pathname;
this.search = url.search;
this.hash = url.hash;
this.username = url.username;
this.password = url.password;
this.origin = url.origin;
}
assign(_url) {
//
}
reload(_forcedReload) {
//
}
replace(_url) {
//
}
toString() {
return this.href;
}
}
class MockNavigator {
constructor() {
this.appCodeName = 'MockNavigator';
this.appName = 'MockNavigator';
this.appVersion = 'MockNavigator';
this.platform = 'MockNavigator';
this.userAgent = 'MockNavigator';
}
}
/**
* https://developer.mozilla.org/en-US/docs/Web/API/Performance
*/
class MockPerformance {
constructor() {
this.timeOrigin = Date.now();
}
addEventListener() {
//
}
clearMarks() {
//
}
clearMeasures() {
//
}
clearResourceTimings() {
//
}
dispatchEvent() {
return true;
}
getEntries() {
return [];
}
getEntriesByName() {
return [];
}
getEntriesByType() {
return [];
}
mark() {
//
}
measure() {
//
}
get navigation() {
return {};
}
now() {
return Date.now() - this.timeOrigin;
}
get onresourcetimingbufferfull() {
return null;
}
removeEventListener() {
//
}
setResourceTimingBufferSize() {
//
}
get timing() {
return {};
}
toJSON() {
//
}
}
function resetPerformance(perf) {
if (perf != null) {
try {
perf.timeOrigin = Date.now();
}
catch (e) { }
}
}
class MockStorage {
constructor() {
this.items = new Map();
}
key(_value) {
//
}
getItem(key) {
key = String(key);
if (this.items.has(key)) {
return this.items.get(key);
}
return null;
}
setItem(key, value) {
if (value == null) {
value = 'null';
}
this.items.set(String(key), String(value));
}
removeItem(key) {
this.items.delete(String(key));
}
clear() {
this.items.clear();
}
}
const nativeClearInterval = clearInterval;
const nativeClearTimeout = clearTimeout;
const nativeSetInterval = setInterval;
const nativeSetTimeout = setTimeout;
const nativeURL = URL;
class MockWindow {
constructor(html = null) {
if (html !== false) {
this.document = new MockDocument(html, this);
}
else {
this.document = null;
}
this.performance = new MockPerformance();
this.customElements = new MockCustomElementRegistry(this);
this.console = createConsole();
resetWindowDefaults(this);
resetWindowDimensions(this);
}
addEventListener(type, handler) {
addEventListener(this, type, handler);
}
alert(msg) {
if (this.console) {
this.console.debug(msg);
}
else {
console.debug(msg);
}
}
blur() {
/**/
}
cancelAnimationFrame(id) {
this.__clearTimeout(id);
}
cancelIdleCallback(id) {
this.__clearTimeout(id);
}
get CharacterData() {
if (this.__charDataCstr == null) {
const ownerDocument = this.document;
this.__charDataCstr = class extends MockNode {
constructor() {
super(ownerDocument, 0, 'test', '');
throw new Error('Illegal constructor: cannot construct CharacterData');
}
};
}
return this.__charDataCstr;
}
set CharacterData(charDataCstr) {
this.__charDataCstr = charDataCstr;
}
clearInterval(id) {
this.__clearInterval(id);
}
clearTimeout(id) {
this.__clearTimeout(id);
}
close() {
resetWindow(this);
}
confirm() {
return false;
}
get CSS() {
return {
supports: () => true,
};
}
get Document() {
if (this.__docCstr == null) {
const win = this;
this.__docCstr = class extends MockDocument {
constructor() {
super(false, win);
throw new Error('Illegal constructor: cannot construct Document');
}
};
}
return this.__docCstr;
}
set Document(docCstr) {
this.__docCstr = docCstr;
}
get DocumentFragment() {
if (this.__docFragCstr == null) {
const ownerDocument = this.document;
this.__docFragCstr = class extends MockDocumentFragment {
constructor() {
super(ownerDocument);
throw new Error('Illegal constructor: cannot construct DocumentFragment');
}
};
}
return this.__docFragCstr;
}
set DocumentFragment(docFragCstr) {
this.__docFragCstr = docFragCstr;
}
get DocumentType() {
if (this.__docTypeCstr == null) {
const ownerDocument = this.document;
this.__docTypeCstr = class extends MockNode {
constructor() {
super(ownerDocument, 0, 'test', '');
throw new Error('Illegal constructor: cannot construct DocumentType');
}
};
}
return this.__docTypeCstr;
}
set DocumentType(docTypeCstr) {
this.__docTypeCstr = docTypeCstr;
}
get DOMTokenList() {
if (this.__domTokenListCstr == null) {
this.__domTokenListCstr = class MockDOMTokenList {
};
}
return this.__domTokenListCstr;
}
set DOMTokenList(domTokenListCstr) {
this.__domTokenListCstr = domTokenListCstr;
}
dispatchEvent(ev) {
return dispatchEvent(this, ev);
}
get Element() {
if (this.__elementCstr == null) {
const ownerDocument = this.document;
this.__elementCstr = class extends MockElement {
constructor() {
super(ownerDocument, '');
throw new Error('Illegal constructor: cannot construct Element');
}
};
}
return this.__elementCstr;
}
fetch(input, init) {
if (typeof fetch === 'function') {
return fetch(input, init);
}
throw new Error(`fetch() not implemented`);
}
focus() {
/**/
}
getComputedStyle(_) {
return {
cssText: '',
length: 0,
parentRule: null,
getPropertyPriority() {
return null;
},
getPropertyValue() {
return '';
},
item() {
return null;
},
removeProperty() {
return null;
},
setProperty() {
return null;
},
};
}
get globalThis() {
return this;
}
get history() {
if (this.__history == null) {
this.__history = new MockHistory();
}
return this.__history;
}
set history(hsty) {
this.__history = hsty;
}
get JSON() {
return JSON;
}
get HTMLElement() {
if (this.__htmlElementCstr == null) {
const ownerDocument = this.document;
this.__htmlElementCstr = class extends MockHTMLElement {
constructor() {
super(ownerDocument, '');
const observedAttributes = this.constructor.observedAttributes;
if (Array.isArray(observedAttributes) && typeof this.attributeChangedCallback === 'function') {
observedAttributes.forEach(attrName => {
const attrValue = this.getAttribute(attrName);
if (attrValue != null) {
this.attributeChangedCallback(attrName, null, attrValue);
}
});
}
}
};
}
return this.__htmlElementCstr;
}
set HTMLElement(htmlElementCstr) {
this.__htmlElementCstr = htmlElementCstr;
}
get IntersectionObserver() {
return MockIntersectionObserver;
}
get localStorage() {
if (this.__localStorage == null) {
this.__localStorage = new MockStorage();
}
return this.__localStorage;
}
set localStorage(locStorage) {
this.__localStorage = locStorage;
}
get location() {
if (this.__location == null) {
this.__location = new MockLocation();
}
return this.__location;
}
set location(val) {
if (typeof val === 'string') {
if (this.__location == null) {
this.__location = new MockLocation();
}
this.__location.href = val;
}
else {
this.__location = val;
}
}
matchMedia() {
return {
matches: false,
};
}
get Node() {
if (this.__nodeCstr == null) {
const ownerDocument = this.document;
this.__nodeCstr = class extends MockNode {
constructor() {
super(ownerDocument, 0, 'test', '');
throw new Error('Illegal constructor: cannot construct Node');
}
};
}
return this.__nodeCstr;
}
get NodeList() {
if (this.__nodeListCstr == null) {
const ownerDocument = this.document;
this.__nodeListCstr = class extends MockNodeList {
constructor() {
super(ownerDocument, [], 0);
throw new Error('Illegal constructor: cannot construct NodeList');
}
};
}
return this.__nodeListCstr;
}
get navigator() {
if (this.__navigator == null) {
this.__navigator = new MockNavigator();
}
return this.__navigator;
}
set navigator(nav) {
this.__navigator = nav;
}
get parent() {
return null;
}
prompt() {
return '';
}
open() {
return null;
}
get origin() {
return this.location.origin;
}
removeEventListener(type, handler) {
removeEventListener(this, type, handler);
}
requestAnimationFrame(callback) {
return this.setTimeout(() => {
callback(Date.now());
}, 0);
}
requestIdleCallback(callback) {
return this.setTimeout(() => {
callback({
didTimeout: false,
timeRemaining: () => 0,
});
}, 0);
}
scroll(_x, _y) {
/**/
}
scrollBy(_x, _y) {
/**/
}
scrollTo(_x, _y) {
/**/
}
get self() {
return this;
}
get sessionStorage() {
if (this.__sessionStorage == null) {
this.__sessionStorage = new MockStorage();
}
return this.__sessionStorage;
}
set sessionStorage(locStorage) {
this.__sessionStorage = locStorage;
}
setInterval(callback, ms, ...args) {
if (this.__timeouts == null) {
this.__timeouts = new Set();
}
ms = Math.min(ms, this.__maxTimeout);
if (this.__allowInterval) {
const intervalId = this.__setInterval(() => {
if (this.__timeouts) {
this.__timeouts.delete(intervalId);
try {
callback(...args);
}
catch (e) {
if (this.console) {
this.console.error(e);
}
else {
console.error(e);
}
}
}
}, ms);
if (this.__timeouts) {
this.__timeouts.add(intervalId);
}
return intervalId;
}
const timeoutId = this.__setTimeout(() => {
if (this.__timeouts) {
this.__timeouts.delete(timeoutId);
try {
callback(...args);
}
catch (e) {
if (this.console) {
this.console.error(e);
}
else {
console.error(e);
}
}
}
}, ms);
if (this.__timeouts) {
this.__timeouts.add(timeoutId);
}
return timeoutId;
}
setTimeout(callback, ms, ...args) {
if (this.__timeouts == null) {
this.__timeouts = new Set();
}
ms = Math.min(ms, this.__maxTimeout);
const timeoutId = this.__setTimeout(() => {
if (this.__timeouts) {
this.__timeouts.delete(timeoutId);
try {
callback(...args);
}
catch (e) {
if (this.console) {
this.console.error(e);
}
else {
console.error(e);
}
}
}
}, ms);
if (this.__timeouts) {
this.__timeouts.add(timeoutId);
}
return timeoutId;
}
get top() {
return this;
}
get window() {
return this;
}
onanimationstart() {
/**/
}
onanimationend() {
/**/
}
onanimationiteration() {
/**/
}
onabort() {
/**/
}
onauxclick() {
/**/
}
onbeforecopy() {
/**/
}
onbeforecut() {
/**/
}
onbeforepaste() {
/**/
}
onblur() {
/**/
}
oncancel() {
/**/
}
oncanplay() {
/**/
}
oncanplaythrough() {
/**/
}
onchange() {
/**/
}
onclick() {
/**/
}
onclose() {
/**/
}
oncontextmenu() {
/**/
}
oncopy() {
/**/
}
oncuechange() {
/**/
}
oncut() {
/**/
}
ondblclick() {
/**/
}
ondrag() {
/**/
}
ondragend() {
/**/
}
ondragenter() {
/**/
}
ondragleave() {
/**/
}
ondragover() {
/**/
}
ondragstart() {
/**/
}
ondrop() {
/**/
}
ondurationchange() {
/**/
}
onemptied() {
/**/
}
onended() {
/**/
}
onerror() {
/**/
}
onfocus() {
/**/
}
onfocusin() {
/**/
}
onfocusout() {
/**/
}
onformdata() {
/**/
}
onfullscreenchange() {
/**/
}
onfullscreenerror() {
/**/
}
ongotpointercapture() {
/**/
}
oninput() {
/**/
}
oninvalid() {
/**/
}
onkeydown() {
/**/
}
onkeypress() {
/**/
}
onkeyup() {
/**/
}
onload() {
/**/
}
onloadeddata() {
/**/
}
onloadedmetadata() {
/**/
}
onloadstart() {
/**/
}
onlostpointercapture() {
/**/
}
onmousedown() {
/**/
}
onmouseenter() {
/**/
}
onmouseleave() {
/**/
}
onmousemove() {
/**/
}
onmouseout() {
/**/
}
onmouseover() {
/**/
}
onmouseup() {
/**/
}
onmousewheel() {
/**/
}
onpaste() {
/**/
}
onpause() {
/**/
}
onplay() {
/**/
}
onplaying() {
/**/
}
onpointercancel() {
/**/
}
onpointerdown() {
/**/
}
onpointerenter() {
/**/
}
onpointerleave() {
/**/
}
onpointermove() {
/**/
}
onpointerout() {
/**/
}
onpointerover() {
/**/
}
onpointerup() {
/**/
}
onprogress() {
/**/
}
onratechange() {
/**/
}
onreset() {
/**/
}
onresize() {
/**/
}
onscroll() {
/**/
}
onsearch() {
/**/
}
onseeked() {
/**/
}
onseeking() {
/**/
}
onselect() {
/**/
}
onselectstart() {
/**/
}
onstalled() {
/**/
}
onsubmit() {
/**/
}
onsuspend() {
/**/
}
ontimeupdate() {
/**/
}
ontoggle() {
/**/
}
onvolumechange() {
/**/
}
onwaiting() {
/**/
}
onwebkitfullscreenchange() {
/**/
}
onwebkitfullscreenerror() {
/**/
}
onwheel() {
/**/
}
}
addGlobalsToWindowPrototype(MockWindow.prototype);
function resetWindowDefaults(win) {
win.__clearInterval = nativeClearInterval;
win.__clearTimeout = nativeClearTimeout;
win.__setInterval = nativeSetInterval;
win.__setTimeout = nativeSetTimeout;
win.__maxTimeout = 30000;
win.__allowInterval = true;
win.URL = nativeURL;
}
function cloneWindow(srcWin, opts = {}) {
if (srcWin == null) {
return null;
}
const clonedWin = new MockWindow(false);
if (!opts.customElementProxy) {
srcWin.customElements = null;
}
if (srcWin.document != null) {
const clonedDoc = new MockDocument(false, clonedWin);
clonedWin.document = clonedDoc;
clonedDoc.documentElement = srcWin.document.documentElement.cloneNode(true);
}
else {
clonedWin.document = new MockDocument(null, clonedWin);
}
return clonedWin;
}
function cloneDocument(srcDoc) {
if (srcDoc == null) {
return null;
}
const dstWin = cloneWindow(srcDoc.defaultView);
return dstWin.document;
}
/**
* Constrain setTimeout() to 1ms, but still async. Also
* only allow setInterval() to fire once, also constrained to 1ms.
*/
function constrainTimeouts(win) {
win.__allowInterval = false;
win.__maxTimeout = 0;
}
function resetWindow(win) {
if (win != null) {
if (win.__timeouts) {
win.__timeouts.forEach(timeoutId => {
nativeClearInterval(timeoutId);
nativeClearTimeout(timeoutId);
});
win.__timeouts.clear();
}
if (win.customElements && win.customElements.clear) {
win.customElements.clear();
}
resetDocument(win.document);
resetPerformance(win.performance);
for (const key in win) {
if (win.hasOwnProperty(key) && key !== 'document' && key !== 'performance' && key !== 'customElements') {
delete win[key];
}
}
resetWindowDefaults(win);
resetWindowDimensions(win);
resetEventListeners(win);
if (win.document != null) {
try {
win.document.defaultView = win;
}
catch (e) { }
}
// ensure we don't hold onto nodeFetch values
win.fetch = null;
win.Headers = null;
win.Request = null;
win.Response = null;
win.FetchError = null;
}
}
function resetWindowDimensions(win) {
try {
win.devicePixelRatio = 1;
win.innerHeight = 768;
win.innerWidth = 1366;
win.pageXOffset = 0;
win.pageYOffset = 0;
win.screenLeft = 0;
win.screenTop = 0;
win.screenX = 0;
win.screenY = 0;
win.scrollX = 0;
win.scrollY = 0;
win.screen = {
availHeight: win.innerHeight,
availLeft: 0,
availTop: 0,
availWidth: win.innerWidth,
colorDepth: 24,
height: win.innerHeight,
keepAwake: false,
orientation: {
angle: 0,
type: 'portrait-primary',
},
pixelDepth: 24,
width: win.innerWidth,
};
}
catch (e) { }
}
class MockDocument extends MockHTMLElement {
constructor(html = null, win = null) {
super(null, null);
this.nodeName = "#document" /* DOCUMENT_NODE */;
this.nodeType = 9 /* DOCUMENT_NODE */;
this.defaultView = win;
this.cookie = '';
this.referrer = '';
this.appendChild(this.createDocumentTypeNode());
if (typeof html === 'string') {
const parsedDoc = parseDocumentUtil(this, html);
const documentElement = parsedDoc.children.find(elm => elm.nodeName === 'HTML');
if (documentElement != null) {
this.appendChild(documentElement);
setOwnerDocument(documentElement, this);
}
}
else if (html !== false) {
const documentElement = new MockHTMLElement(this, 'html');
this.appendChild(documentElement);
documentElement.appendChild(new MockHTMLElement(this, 'head'));
documentElement.appendChild(new MockHTMLElement(this, 'body'));
}
}
get dir() {
return this.documentElement.dir;
}
set dir(value) {
this.documentElement.dir = value;
}
get location() {
if (this.defaultView != null) {
return this.defaultView.location;
}
return null;
}
set location(val) {
if (this.defaultView != null) {
this.defaultView.location = val;
}
}
get baseURI() {
const baseNode = this.head.childNodes.find(node => node.nodeName === 'BASE');
if (baseNode) {
return baseNode.href;
}
return this.URL;
}
get URL() {
return this.location.href;
}
get styleSheets() {
return this.querySelectorAll('style');
}
get scripts() {
return this.querySelectorAll('script');
}
get forms() {
return this.querySelectorAll('form');
}
get images() {
return this.querySelectorAll('img');
}
get scrollingElement() {
return this.documentElement;
}
get documentElement() {
for (let i = this.childNodes.length - 1; i >= 0; i--) {
if (this.childNodes[i].nodeName === 'HTML') {
return this.childNodes[i];
}
}
const documentElement = new MockHTMLElement(this, 'html');
this.appendChild(documentElement);
return documentElement;
}
set documentElement(documentElement) {
for (let i = this.childNodes.length - 1; i >= 0; i--) {
if (this.childNodes[i].nodeType !== 10 /* DOCUMENT_TYPE_NODE */) {
this.childNodes[i].remove();
}
}
if (documentElement != null) {
this.appendChild(documentElement);
setOwnerDocument(documentElement, this);
}
}
get head() {
const documentElement = this.documentElement;
for (let i = 0; i < documentElement.childNodes.length; i++) {
if (documentElement.childNodes[i].nodeName === 'HEAD') {
return documentElement.childNodes[i];
}
}
const head = new MockHTMLElement(this, 'head');
documentElement.insertBefore(head, documentElement.firstChild);
return head;
}
set head(head) {
const documentElement = this.documentElement;
for (let i = documentElement.childNodes.length - 1; i >= 0; i--) {
if (documentElement.childNodes[i].nodeName === 'HEAD') {
documentElement.childNodes[i].remove();
}
}
if (head != null) {
documentElement.insertBefore(head, documentElement.firstChild);
setOwnerDocument(head, this);
}
}
get body() {
const documentElement = this.documentElement;
for (let i = documentElement.childNodes.length - 1; i >= 0; i--) {
if (documentElement.childNodes[i].nodeName === 'BODY') {
return documentElement.childNodes[i];
}
}
const body = new MockHTMLElement(this, 'body');
documentElement.appendChild(body);
return body;
}
set body(body) {
const documentElement = this.documentElement;
for (let i = documentElement.childNodes.length - 1; i >= 0; i--) {
if (documentElement.childNodes[i].nodeName === 'BODY') {
documentElement.childNodes[i].remove();
}
}
if (body != null) {
documentElement.appendChild(body);
setOwnerDocument(body, this);
}
}
appendChild(newNode) {
newNode.remove();
newNode.parentNode = this;
this.childNodes.push(newNode);
return newNode;
}
createComment(data) {
return new MockComment(this, data);
}
createAttribute(attrName) {
return new MockAttr(attrName.toLowerCase(), '');
}
createAttributeNS(namespaceURI, attrName) {
return new MockAttr(attrName, '', namespaceURI);
}
createElement(tagName) {
if (tagName === "#document" /* DOCUMENT_NODE */) {
const doc = new MockDocument(false);
doc.nodeName = tagName;
doc.parentNode = null;
return doc;
}
return createElement(this, tagName);
}
createElementNS(namespaceURI, tagName) {
const elmNs = createElementNS(this, namespaceURI, tagName);
elmNs.namespaceURI = namespaceURI;
return elmNs;
}
createTextNode(text) {
return new MockTextNode(this, text);
}
createDocumentFragment() {
return new MockDocumentFragment(this);
}
createDocumentTypeNode() {
return new MockDocumentTypeNode(this);
}
getElementById(id) {
return getElementById(this, id);
}
getElementsByName(elmName) {
return getElementsByName(this, elmName.toLowerCase());
}
get title() {
const title = this.head.childNodes.find(elm => elm.nodeName === 'TITLE');
if (title != null && typeof title.textContent === 'string') {
return title.textContent.trim();
}
return '';
}
set title(value) {
const head = this.head;
let title = head.childNodes.find(elm => elm.nodeName === 'TITLE');
if (title == null) {
title = this.createElement('title');
head.appendChild(title);
}
title.textContent = value;
}
}
function createDocument(html = null) {
return new MockWindow(html).document;
}
function createFragment(html) {
return parseHtmlToFragment(html, null);
}
function resetDocument(doc) {
if (doc != null) {
resetEventListeners(doc);
const documentElement = doc.documentElement;
if (documentElement != null) {
resetElement(documentElement);
for (let i = 0, ii = documentElement.childNodes.length; i < ii; i++) {
const childNode = documentElement.childNodes[i];
resetElement(childNode);
childNode.childNodes.length = 0;
}
}
for (const key in doc) {
if (doc.hasOwnProperty(key) && !DOC_KEY_KEEPERS.has(key)) {
delete doc[key];
}
}
try {
doc.nodeName = "#document" /* DOCUMENT_NODE */;
}
catch (e) { }
try {
doc.nodeType = 9 /* DOCUMENT_NODE */;
}
catch (e) { }
try {
doc.cookie = '';
}
catch (e) { }
try {
doc.referrer = '';
}
catch (e) { }
}
}
const DOC_KEY_KEEPERS = new Set([
'nodeName',
'nodeType',
'nodeValue',
'ownerDocument',
'parentNode',
'childNodes',
'_shadowRoot',
]);
function getElementById(elm, id) {
const children = elm.children;
for (let i = 0, ii = children.length; i < ii; i++) {
const childElm = children[i];
if (childElm.id === id) {
return childElm;
}
const childElmFound = getElementById(childElm, id);
if (childElmFound != null) {
return childElmFound;
}
}
return null;
}
function getElementsByName(elm, elmName, foundElms = []) {
const children = elm.children;
for (let i = 0, ii = children.length; i < ii; i++) {
const childElm = children[i];
if (childElm.name && childElm.name.toLowerCase() === elmName) {
foundElms.push(childElm);
}
getElementsByName(childElm, elmName, foundElms);
}
return foundElms;
}
function setOwnerDocument(elm, ownerDocument) {
for (let i = 0, ii = elm.childNodes.length; i < ii; i++) {
elm.childNodes[i].ownerDocument = ownerDocument;
if (elm.childNodes[i].nodeType === 1 /* ELEMENT_NODE */) {
setOwnerDocument(elm.childNodes[i], ownerDocument);
}
}
}
function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResults, $stencilAfterHydrate, $stencilHydrateResolve) {
var globalThis = $stencilWindow;
var self = $stencilWindow;
var top = $stencilWindow;
var parent = $stencilWindow;
var addEventListener = $stencilWindow.addEventListener.bind($stencilWindow);
var alert = $stencilWindow.alert.bind($stencilWindow);
var blur = $stencilWindow.blur.bind($stencilWindow);
var cancelAnimationFrame = $stencilWindow.cancelAnimationFrame.bind($stencilWindow);
var cancelIdleCallback = $stencilWindow.cancelIdleCallback.bind($stencilWindow);
var clearInterval = $stencilWindow.clearInterval.bind($stencilWindow);
var clearTimeout = $stencilWindow.clearTimeout.bind($stencilWindow);
var close = () => {};
var confirm = $stencilWindow.confirm.bind($stencilWindow);
var dispatchEvent = $stencilWindow.dispatchEvent.bind($stencilWindow);
var focus = $stencilWindow.focus.bind($stencilWindow);
var getComputedStyle = $stencilWindow.getComputedStyle.bind($stencilWindow);
var matchMedia = $stencilWindow.matchMedia.bind($stencilWindow);
var open = $stencilWindow.open.bind($stencilWindow);
var prompt = $stencilWindow.prompt.bind($stencilWindow);
var removeEventListener = $stencilWindow.removeEventListener.bind($stencilWindow);
var requestAnimationFrame = $stencilWindow.requestAnimationFrame.bind($stencilWindow);
var requestIdleCallback = $stencilWindow.requestIdleCallback.bind($stencilWindow);
var setInterval = $stencilWindow.setInterval.bind($stencilWindow);
var setTimeout = $stencilWindow.setTimeout.bind($stencilWindow);
var CharacterData = $stencilWindow.CharacterData;
var CSS = $stencilWindow.CSS;
var CustomEvent = $stencilWindow.CustomEvent;
var Document = $stencilWindow.Document;
var DocumentFragment = $stencilWindow.DocumentFragment;
var DocumentType = $stencilWindow.DocumentType;
var DOMTokenList = $stencilWindow.DOMTokenList;
var Element = $stencilWindow.Element;
var Event = $stencilWindow.Event;
var HTMLAnchorElement = $stencilWindow.HTMLAnchorElement;
var HTMLBaseElement = $stencilWindow.HTMLBaseElement;
var HTMLButtonElement = $stencilWindow.HTMLButtonElement;
var HTMLCanvasElement = $stencilWindow.HTMLCanvasElement;
var HTMLElement = $stencilWindow.HTMLElement;
var HTMLFormElement = $stencilWindow.HTMLFormElement;
var HTMLImageElement = $stencilWindow.HTMLImageElement;
var HTMLInputElement = $stencilWindow.HTMLInputElement;
var HTMLLinkElement = $stencilWindow.HTMLLinkElement;
var HTMLMetaElement = $stencilWindow.HTMLMetaElement;
var HTMLScriptElement = $stencilWindow.HTMLScriptElement;
var HTMLStyleElement = $stencilWindow.HTMLStyleElement;
var HTMLTemplateElement = $stencilWindow.HTMLTemplateElement;
var HTMLTitleElement = $stencilWindow.HTMLTitleElement;
var IntersectionObserver = $stencilWindow.IntersectionObserver;
var KeyboardEvent = $stencilWindow.KeyboardEvent;
var MouseEvent = $stencilWindow.MouseEvent;
var Node = $stencilWindow.Node;
var NodeList = $stencilWindow.NodeList;
var URL = $stencilWindow.URL;
var console = $stencilWindow.console;
var customElements = $stencilWindow.customElements;
var history = $stencilWindow.history;
var localStorage = $stencilWindow.localStorage;
var location = $stencilWindow.location;
var navigator = $stencilWindow.navigator;
var performance = $stencilWindow.performance;
var sessionStorage = $stencilWindow.sessionStorage;
var devicePixelRatio = $stencilWindow.devicePixelRatio;
var innerHeight = $stencilWindow.innerHeight;
var innerWidth = $stencilWindow.innerWidth;
var origin = $stencilWindow.origin;
var pageXOffset = $stencilWindow.pageXOffset;
var pageYOffset = $stencilWindow.pageYOffset;
var screen = $stencilWindow.screen;
var screenLeft = $stencilWindow.screenLeft;
var screenTop = $stencilWindow.screenTop;
var screenX = $stencilWindow.screenX;
var screenY = $stencilWindow.screenY;
var scrollX = $stencilWindow.scrollX;
var scrollY = $stencilWindow.scrollY;
var exports = {};
var fetch, FetchError, Headers, Request, Response;
if (typeof $stencilWindow.fetch === 'function') {
fetch = $stencilWindow.fetch;
} else {
fetch = $stencilWindow.fetch = function() { throw new Error('fetch() is not implemented'); };
}
if (typeof $stencilWindow.FetchError === 'function') {
FetchError = $stencilWindow.FetchError;
} else {
FetchError = $stencilWindow.FetchError = class FetchError { constructor() { throw new Error('FetchError is not implemented'); } };
}
if (typeof $stencilWindow.Headers === 'function') {
Headers = $stencilWindow.Headers;
} else {
Headers = $stencilWindow.Headers = class Headers { constructor() { throw new Error('Headers is not implemented'); } };
}
if (typeof $stencilWindow.Request === 'function') {
Request = $stencilWindow.Request;
} else {
Request = $stencilWindow.Request = class Request { constructor() { throw new Error('Request is not implemented'); } };
}
if (typeof $stencilWindow.Response === 'function') {
Response = $stencilWindow.Response;
} else {
Response = $stencilWindow.Response = class Response { constructor() { throw new Error('Response is not implemented'); } };
}
function hydrateAppClosure($stencilWindow) {
const window = $stencilWindow;
const document = $stencilWindow.document;
/*hydrateAppClosure start*/
const NAMESPACE = 'ionic';
const BUILD = /* ionic */ { allRenderFn: false, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: true, cmpWillUpdate: false, connectedCallback: true, constructableCSS: false, cssAnnotations: true, cssVarShim: false, devTools: false, disconnectedCallback: true, dynamicImportShim: false, element: false, event: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: true, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: true, hydratedAttribute: false, hydratedClass: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: true, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, safari10: false, scoped: true, scriptDataOpts: false, shadowDelegatesFocus: true, shadowDom: true, shadowDomShim: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
const getPlatforms = (win) => setupPlatforms(win);
const isPlatform = (winOrPlatform, platform) => {
if (typeof winOrPlatform === 'string') {
platform = winOrPlatform;
winOrPlatform = undefined;
}
return getPlatforms(winOrPlatform).includes(platform);
};
const setupPlatforms = (win = window) => {
if (typeof win === 'undefined') {
return [];
}
win.Ionic = win.Ionic || {};
let platforms = win.Ionic.platforms;
if (platforms == null) {
platforms = win.Ionic.platforms = detectPlatforms(win);
platforms.forEach(p => win.document.documentElement.classList.add(`plt-${p}`));
}
return platforms;
};
const detectPlatforms = (win) => Object.keys(PLATFORMS_MAP).filter(p => PLATFORMS_MAP[p](win));
const isMobileWeb = (win) => isMobile(win) && !isHybrid(win);
const isIpad = (win) => {
// iOS 12 and below
if (testUserAgent(win, /iPad/i)) {
return true;
}
// iOS 13+
if (testUserAgent(win, /Macintosh/i) && isMobile(win)) {
return true;
}
return false;
};
const isIphone = (win) => testUserAgent(win, /iPhone/i);
const isIOS = (win) => testUserAgent(win, /iPhone|iPod/i) || isIpad(win);
const isAndroid = (win) => testUserAgent(win, /android|sink/i);
const isAndroidTablet = (win) => {
return isAndroid(win) && !testUserAgent(win, /mobile/i);
};
const isPhablet = (win) => {
const width = win.innerWidth;
const height = win.innerHeight;
const smallest = Math.min(width, height);
const largest = Math.max(width, height);
return (smallest > 390 && smallest < 520) &&
(largest > 620 && largest < 800);
};
const isTablet = (win) => {
const width = win.innerWidth;
const height = win.innerHeight;
const smallest = Math.min(width, height);
const largest = Math.max(width, height);
return (isIpad(win) ||
isAndroidTablet(win) ||
((smallest > 460 && smallest < 820) &&
(largest > 780 && largest < 1400)));
};
const isMobile = (win) => matchMedia(win, '(any-pointer:coarse)');
const isDesktop = (win) => !isMobile(win);
const isHybrid = (win) => isCordova(win) || isCapacitorNative(win);
const isCordova = (win) => !!(win['cordova'] || win['phonegap'] || win['PhoneGap']);
const isCapacitorNative = (win) => {
const capacitor = win['Capacitor'];
return !!(capacitor && capacitor.isNative);
};
const isElectron = (win) => testUserAgent(win, /electron/i);
const isPWA = (win) => !!(win.matchMedia('(display-mode: standalone)').matches || win.navigator.standalone);
const testUserAgent = (win, expr) => expr.test(win.navigator.userAgent);
const matchMedia = (win, query) => win.matchMedia(query).matches;
const PLATFORMS_MAP = {
'ipad': isIpad,
'iphone': isIphone,
'ios': isIOS,
'android': isAndroid,
'phablet': isPhablet,
'tablet': isTablet,
'cordova': isCordova,
'capacitor': isCapacitorNative,
'electron': isElectron,
'pwa': isPWA,
'mobile': isMobile,
'mobileweb': isMobileWeb,
'desktop': isDesktop,
'hybrid': isHybrid
};
class Config {
constructor() {
this.m = new Map();
}
reset(configObj) {
this.m = new Map(Object.entries(configObj));
}
get(key, fallback) {
const value = this.m.get(key);
return value !== undefined ? value : fallback;
}
getBoolean(key, fallback = false) {
const val = this.m.get(key);
if (val === undefined) {
return fallback;
}
if (typeof val === 'string') {
return val === 'true';
}
return !!val;
}
getNumber(key, fallback) {
const val = parseFloat(this.m.get(key));
return isNaN(val) ? (fallback !== undefined ? fallback : NaN) : val;
}
set(key, value) {
this.m.set(key, value);
}
}
const config = /*@__PURE__*/ new Config();
const configFromSession = (win) => {
try {
const configStr = win.sessionStorage.getItem(IONIC_SESSION_KEY);
return configStr !== null ? JSON.parse(configStr) : {};
}
catch (e) {
return {};
}
};
const saveConfig = (win, c) => {
try {
win.sessionStorage.setItem(IONIC_SESSION_KEY, JSON.stringify(c));
}
catch (e) {
return;
}
};
const configFromURL = (win) => {
const configObj = {};
win.location.search
.slice(1)
.split('&')
.map(entry => entry.split('='))
.map(([key, value]) => [decodeURIComponent(key), decodeURIComponent(value)])
.filter(([key]) => startsWith(key, IONIC_PREFIX))
.map(([key, value]) => [key.slice(IONIC_PREFIX.length), value])
.forEach(([key, value]) => {
configObj[key] = value;
});
return configObj;
};
const startsWith = (input, search) => {
return input.substr(0, search.length) === search;
};
const IONIC_PREFIX = 'ionic:';
const IONIC_SESSION_KEY = 'ionic-persist-config';
let defaultMode;
const getIonMode$1 = (ref) => {
return (ref && getMode(ref)) || defaultMode;
};
const initialize = (userConfig = {}) => {
if (typeof window === 'undefined') {
return;
}
const doc = window.document;
const win = window;
const Ionic = win.Ionic = win.Ionic || {};
// Setup platforms
setupPlatforms(win);
// create the Ionic.config from raw config object (if it exists)
// and convert Ionic.config into a ConfigApi that has a get() fn
const configObj = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, configFromSession(win)), { persistConfig: false }), Ionic.config), configFromURL(win)), userConfig);
config.reset(configObj);
if (config.getBoolean('persistConfig')) {
saveConfig(win, configObj);
}
// first see if the mode was set as an attribute on <html>
// which could have been set by the user, or by pre-rendering
// otherwise get the mode via config settings, and fallback to md
Ionic.config = config;
Ionic.mode = defaultMode = config.get('mode', (doc.documentElement.getAttribute('mode')) || (isPlatform(win, 'ios') ? 'ios' : 'md'));
config.set('mode', defaultMode);
doc.documentElement.setAttribute('mode', defaultMode);
doc.documentElement.classList.add(defaultMode);
if (config.getBoolean('_testing')) {
config.set('animated', false);
}
const isIonicElement = (elm) => elm.tagName && elm.tagName.startsWith('ION-');
const isAllowedIonicModeValue = (elmMode) => ['ios', 'md'].includes(elmMode);
setMode((elm) => {
while (elm) {
const elmMode = elm.mode || elm.getAttribute('mode');
if (elmMode) {
if (isAllowedIonicModeValue(elmMode)) {
return elmMode;
}
else if (isIonicElement(elm)) {
console.warn('Invalid ionic mode: "' + elmMode + '", expected: "ios" or "md"');
}
}
elm = elm.parentElement;
}
return defaultMode;
});
};
const globalScripts = initialize;
function componentOnReady$1() {
return getHostRef(this).$onReadyPromise$;
}
function forceUpdate() {}
function hydrateApp(e, t, o, n, s) {
function l() {
if (global.clearTimeout(p), i.clear(), r.clear(), !h) {
h = !0;
try {
t.clientHydrateAnnotations && insertVdomAnnotations(e.document, t.staticComponents),
e.dispatchEvent(new e.Event("DOMContentLoaded")), e.document.createElement = c,
e.document.createElementNS = $;
} catch (e) {
renderCatchError(t, o, e);
}
}
n(e, t, o, s);
}
function a(e) {
renderCatchError(t, o, e), l();
}
const r = new Set, i = new Set, d = new Set, c = e.document.createElement, $ = e.document.createElementNS, m = Promise.resolve();
let p, h = !1;
try {
function u() {
return g(this);
}
function f(e) {
if (isValidComponent(e, t) && !getHostRef(e)) {
const t = loadModule({
$tagName$: e.nodeName.toLowerCase(),
$flags$: null
});
null != t && null != t.cmpMeta && (i.add(e), e.connectedCallback = u, registerHost(e, t.cmpMeta),
function o(e, t) {
if ("function" != typeof e.componentOnReady && (e.componentOnReady = componentOnReady$1),
"function" != typeof e.forceUpdate && (e.forceUpdate = forceUpdate), 1 & t.$flags$ && (e.shadowRoot = e),
null != t.$members$) {
const o = getHostRef(e);
Object.entries(t.$members$).forEach((([n, s]) => {
const l = s[0];
if (31 & l) {
const a = s[1] || n, r = e.getAttribute(a);
if (null != r) {
const e = parsePropertyValue(r, l);
o.$instanceValues$.set(n, e);
}
const i = e[n];
void 0 !== i && (o.$instanceValues$.set(n, i), delete e[n]), Object.defineProperty(e, n, {
get() {
return getValue(this, n);
},
set(e) {
setValue(this, n, e, t);
},
configurable: !0,
enumerable: !0
});
} else 64 & l && Object.defineProperty(e, n, {
value() {
const e = getHostRef(this), t = arguments;
return e.$onInstancePromise$.then((() => e.$lazyInstance$[n].apply(e.$lazyInstance$, t))).catch(consoleError);
}
});
}));
}
}(e, t.cmpMeta));
}
}
function g(n) {
return i.delete(n), isValidComponent(n, t) && o.hydratedCount < t.maxHydrateCount && !r.has(n) && shouldHydrate(n) ? (r.add(n),
async function s(e, t, o, n, l) {
o = o.toLowerCase();
const a = loadModule({
$tagName$: o,
$flags$: null
});
if (null != a && null != a.cmpMeta) {
l.add(n);
try {
connectedCallback(n), await n.componentOnReady(), t.hydratedCount++;
const e = getHostRef(n), s = e.$modeName$ ? e.$modeName$ : "$";
t.components.some((e => e.tag === o && e.mode === s)) || t.components.push({
tag: o,
mode: s,
count: 0,
depth: -1
});
} catch (t) {
e.console.error(t);
}
l.delete(n);
}
}(e, o, n.nodeName, n, d)) : m;
}
e.document.createElement = function t(o) {
const n = c.call(e.document, o);
return f(n), n;
}, e.document.createElementNS = function t(o, n) {
const s = $.call(e.document, o, n);
return f(s), s;
}, p = global.setTimeout((function L() {
a(`Hydrate exceeded timeout${function e(t) {
return Array.from(t).map(waitingOnElementMsg);
}(d)}`);
}), t.timeout), plt.$resourcesUrl$ = new URL(t.resourcesUrl || "./", doc$1.baseURI).href,
globalScripts(), function e(t) {
if (null != t && 1 === t.nodeType) {
f(t);
const o = t.children;
for (let t = 0, n = o.length; t < n; t++) e(o[t]);
}
}(e.document.body), function e() {
const t = Array.from(i).filter((e => e.parentElement));
return t.length > 0 ? Promise.all(t.map(g)).then(e) : m;
}().then(l).catch(a);
} catch (e) {
a(e);
}
}
function isValidComponent(e, t) {
if (null != e && 1 === e.nodeType) {
const o = e.nodeName;
if ("string" == typeof o && o.includes("-")) return !t.excludeComponents.includes(o.toLowerCase());
}
return !1;
}
function shouldHydrate(e) {
if (9 === e.nodeType) return !0;
if (NO_HYDRATE_TAGS.has(e.nodeName)) return !1;
if (e.hasAttribute("no-prerender")) return !1;
const t = e.parentNode;
return null == t || shouldHydrate(t);
}
function renderCatchError(e, t, o) {
const n = {
level: "error",
type: "build",
header: "Hydrate Error",
messageText: "",
relFilePath: null,
absFilePath: null,
lines: []
};
if (e.url) try {
const t = new URL(e.url);
"/" !== t.pathname && (n.header += ": " + t.pathname);
} catch (e) {}
null != o && (null != o.stack ? n.messageText = o.stack.toString() : null != o.message ? n.messageText = o.message.toString() : n.messageText = o.toString()),
t.diagnostics.push(n);
}
function printTag(e) {
let t = `<${e.nodeName.toLowerCase()}`;
if (Array.isArray(e.attributes)) for (let o = 0; o < e.attributes.length; o++) {
const n = e.attributes[o];
t += ` ${n.name}`, "" !== n.value && (t += `="${n.value}"`);
}
return t += ">", t;
}
function waitingOnElementMsg(e) {
let t = "";
if (e) {
const o = [];
t = " - waiting on:";
let n = e;
for (;n && 9 !== n.nodeType && "BODY" !== n.nodeName; ) o.unshift(printTag(n)),
n = n.parentElement;
let s = "";
for (const e of o) s += " ", t += `\n${s}${e}`;
}
return t;
}
const addHostEventListeners = (e, t, o, n) => {
o && (o.map((([o, n, s]) => {
const l = getHostListenerTarget(e, o) , a = hostListenerProxy(t, s), r = hostListenerOpts(o);
plt.ael(l, n, a, r), (t.$rmListeners$ = t.$rmListeners$ || []).push((() => plt.rel(l, n, a, r)));
})));
}, hostListenerProxy = (e, t) => o => {
try {
256 & e.$flags$ ? e.$lazyInstance$[t](o) : (e.$queuedListeners$ = e.$queuedListeners$ || []).push([ t, o ]) ;
} catch (e) {
consoleError(e);
}
}, getHostListenerTarget = (e, t) => 4 & t ? doc$1 : 8 & t ? win$2 : 16 & t ? doc$1.body : e, hostListenerOpts = e => 0 != (2 & e), XLINK_NS = "http://www.w3.org/1999/xlink";
const createTime = (e, t = "") => {
return () => {};
}, rootAppliedStyles = new WeakMap, registerStyle = (e, t, o) => {
let n = styles$1.get(e);
n = t, styles$1.set(e, n);
}, addStyle = (e, t, o, n) => {
let s = getScopeId(t, o), l = styles$1.get(s);
if (e = 11 === e.nodeType ? e : doc$1, l) if ("string" == typeof l) {
e = e.head || e;
let o, a = rootAppliedStyles.get(e);
if (a || rootAppliedStyles.set(e, a = new Set), !a.has(s)) {
if (e.host && (o = e.querySelector(`[sty-id="${s}"]`))) o.innerHTML = l; else {
o = doc$1.createElement("style"), o.innerHTML = l;
o.setAttribute("sty-id", s),
e.insertBefore(o, e.querySelector("link"));
}
a && a.add(s);
}
}
return s;
}, attachStyles = e => {
const t = e.$cmpMeta$, o = e.$hostElement$, n = t.$flags$, s = createTime("attachStyles", t.$tagName$), l = addStyle(o.getRootNode(), t, e.$modeName$);
10 & n && (o["s-sc"] = l,
o.classList.add(l + "-h"), 2 & n && o.classList.add(l + "-s")),
s();
}, getScopeId = (e, t) => "sc-" + (t && 32 & e.$flags$ ? e.$tagName$ + "-" + t : e.$tagName$), computeMode = e => modeResolutionChain.map((t => t(e))).find((e => !!e)), setMode = e => modeResolutionChain.push(e), getMode = e => getHostRef(e).$modeName$, EMPTY_OBJ = {}, isComplexType = e => "object" == (e = typeof e) || "function" === e, isPromise = e => !!e && ("object" == typeof e || "function" == typeof e) && "function" == typeof e.then, h = (e, t, ...o) => {
let n = null, s = null, l = null, a = !1, r = !1, i = [];
const d = t => {
for (let o = 0; o < t.length; o++) n = t[o], Array.isArray(n) ? d(n) : null != n && "boolean" != typeof n && ((a = "function" != typeof e && !isComplexType(n)) ? n = String(n) : BUILD.isDev ,
a && r ? i[i.length - 1].$text$ += n : i.push(a ? newVNode(null, n) : n), r = a);
};
if (d(o), t && (t.key && (s = t.key),
t.name && (l = t.name), BUILD.vdomClass)) {
const e = t.className || t.class;
e && (t.class = "object" != typeof e ? e : Object.keys(e).filter((t => e[t])).join(" "));
}
if ("function" == typeof e) return e(null === t ? {} : t, i, vdomFnUtils);
const c = newVNode(e, null);
return c.$attrs$ = t, i.length > 0 && (c.$children$ = i), (c.$key$ = s),
(c.$name$ = l), c;
}, newVNode = (e, t) => {
const o = {
$flags$: 0,
$tag$: e,
$text$: t,
$elm$: null,
$children$: null
};
return (o.$attrs$ = null), (o.$key$ = null),
(o.$name$ = null), o;
}, Host = {}, isHost = e => e && e.$tag$ === Host, vdomFnUtils = {
forEach: (e, t) => e.map(convertToPublic).forEach(t),
map: (e, t) => e.map(convertToPublic).map(t).map(convertToPrivate)
}, convertToPublic = e => ({
vattrs: e.$attrs$,
vchildren: e.$children$,
vkey: e.$key$,
vname: e.$name$,
vtag: e.$tag$,
vtext: e.$text$
}), convertToPrivate = e => {
if ("function" == typeof e.vtag) {
const t = {
...e.vattrs
};
return e.vkey && (t.key = e.vkey), e.vname && (t.name = e.vname), h(e.vtag, t, ...e.vchildren || []);
}
const t = newVNode(e.vtag, e.vtext);
return t.$attrs$ = e.vattrs, t.$children$ = e.vchildren, t.$key$ = e.vkey, t.$name$ = e.vname,
t;
}, setAccessor = (e, t, o, n, s, l) => {
if (o !== n) {
let a = isMemberInElement(e, t), r = t.toLowerCase();
if ("class" === t) {
const t = e.classList, s = parseClassList(o), l = parseClassList(n);
t.remove(...s.filter((e => e && !l.includes(e)))), t.add(...l.filter((e => e && !s.includes(e))));
} else if ("style" === t) {
for (const t in o) n && null != n[t] || (e.style[t] = "");
for (const t in n) o && n[t] === o[t] || (e.style[t] = n[t]);
} else if ("key" === t) ; else if ("ref" === t) n && n(e); else if ((a ) || "o" !== t[0] || "n" !== t[1]) {
{
const i = isComplexType(n);
if ((a || i && null !== n) && !s) try {
if (e.tagName.includes("-")) e[t] = n; else {
let s = null == n ? "" : n;
"list" === t ? a = !1 : null != o && e[t] == s || (e[t] = s);
}
} catch (e) {}
let d = !1;
r !== (r = r.replace(/^xlink\:?/, "")) && (t = r, d = !0), null == n || !1 === n ? !1 === n && "" !== e.getAttribute(t) || (d ? e.removeAttributeNS(XLINK_NS, t) : e.removeAttribute(t)) : (!a || 4 & l || s) && !i && (n = !0 === n ? "" : n,
d ? e.setAttributeNS(XLINK_NS, t, n) : e.setAttribute(t, n));
}
} else t = "-" === t[2] ? t.slice(3) : isMemberInElement(win$2, r) ? r.slice(2) : r[2] + t.slice(3),
o && plt.rel(e, t, o, !1), n && plt.ael(e, t, n, !1);
}
}, parseClassListRegex = /\s/, parseClassList = e => e ? e.split(parseClassListRegex) : [], updateElement = (e, t, o, n) => {
const s = 11 === t.$elm$.nodeType && t.$elm$.host ? t.$elm$.host : t.$elm$, l = e && e.$attrs$ || EMPTY_OBJ, a = t.$attrs$ || EMPTY_OBJ;
for (n in l) n in a || setAccessor(s, n, l[n], void 0, o, t.$flags$);
for (n in a) setAccessor(s, n, l[n], a[n], o, t.$flags$);
};
let scopeId, contentRef, hostTagName, useNativeShadowDom = !1, checkSlotFallbackVisibility = !1, checkSlotRelocate = !1, isSvgMode = !1;
const createElm = (e, t, o, n) => {
let s, l, a, r = t.$children$[o], i = 0;
if (!useNativeShadowDom && (checkSlotRelocate = !0, "slot" === r.$tag$ && (scopeId && n.classList.add(scopeId + "-s"),
r.$flags$ |= r.$children$ ? 2 : 1)), null !== r.$text$) s = r.$elm$ = doc$1.createTextNode(r.$text$); else if (1 & r.$flags$) s = r.$elm$ = slotReferenceDebugNode(r) ; else {
if (!isSvgMode && (isSvgMode = "svg" === r.$tag$), s = r.$elm$ = doc$1.createElementNS(isSvgMode ? "http://www.w3.org/2000/svg" : "http://www.w3.org/1999/xhtml", 2 & r.$flags$ ? "slot-fb" : r.$tag$) ,
isSvgMode && "foreignObject" === r.$tag$ && (isSvgMode = !1), updateElement(null, r, isSvgMode),
null != scopeId && s["s-si"] !== scopeId && s.classList.add(s["s-si"] = scopeId),
r.$children$) for (i = 0; i < r.$children$.length; ++i) l = createElm(e, r, i, s),
l && s.appendChild(l);
("svg" === r.$tag$ ? isSvgMode = !1 : "foreignObject" === s.tagName && (isSvgMode = !0));
}
return (s["s-hn"] = hostTagName, 3 & r.$flags$ && (s["s-sr"] = !0,
s["s-cr"] = contentRef, s["s-sn"] = r.$name$ || "", a = e && e.$children$ && e.$children$[o],
a && a.$tag$ === r.$tag$ && e.$elm$ && putBackInOriginalLocation(e.$elm$, !1))),
s;
}, putBackInOriginalLocation = (e, t) => {
plt.$flags$ |= 1;
const o = e.childNodes;
for (let e = o.length - 1; e >= 0; e--) {
const n = o[e];
n["s-hn"] !== hostTagName && n["s-ol"] && (parentReferenceNode(n).insertBefore(n, referenceNode(n)),
n["s-ol"].remove(), n["s-ol"] = void 0, checkSlotRelocate = !0), t && putBackInOriginalLocation(n, t);
}
plt.$flags$ &= -2;
}, addVnodes = (e, t, o, n, s, l) => {
let a, r = e["s-cr"] && e["s-cr"].parentNode || e;
for (r.shadowRoot && r.tagName === hostTagName && (r = r.shadowRoot); s <= l; ++s) n[s] && (a = createElm(null, o, s, e),
a && (n[s].$elm$ = a, r.insertBefore(a, referenceNode(t) )));
}, removeVnodes = (e, t, o, n, s) => {
for (;t <= o; ++t) (n = e[t]) && (s = n.$elm$, callNodeRefs(n), (checkSlotFallbackVisibility = !0,
s["s-ol"] ? s["s-ol"].remove() : putBackInOriginalLocation(s, !0)), s.remove());
}, isSameVnode = (e, t) => e.$tag$ === t.$tag$ && ("slot" === e.$tag$ ? e.$name$ === t.$name$ : e.$key$ === t.$key$), referenceNode = e => e && e["s-ol"] || e, parentReferenceNode = e => (e["s-ol"] ? e["s-ol"] : e).parentNode, patch = (e, t) => {
const o = t.$elm$ = e.$elm$, n = e.$children$, s = t.$children$, l = t.$tag$, a = t.$text$;
let r;
null !== a ? (r = o["s-cr"]) ? r.parentNode.textContent = a : e.$text$ !== a && (o.data = a) : ((isSvgMode = "svg" === l || "foreignObject" !== l && isSvgMode),
("slot" === l || updateElement(e, t, isSvgMode)),
null !== n && null !== s ? ((e, t, o, n) => {
let s, l, a = 0, r = 0, i = 0, d = 0, c = t.length - 1, $ = t[0], m = t[c], p = n.length - 1, h = n[0], u = n[p];
for (;a <= c && r <= p; ) if (null == $) $ = t[++a]; else if (null == m) m = t[--c]; else if (null == h) h = n[++r]; else if (null == u) u = n[--p]; else if (isSameVnode($, h)) patch($, h),
$ = t[++a], h = n[++r]; else if (isSameVnode(m, u)) patch(m, u), m = t[--c], u = n[--p]; else if (isSameVnode($, u)) "slot" !== $.$tag$ && "slot" !== u.$tag$ || putBackInOriginalLocation($.$elm$.parentNode, !1),
patch($, u), e.insertBefore($.$elm$, m.$elm$.nextSibling), $ = t[++a], u = n[--p]; else if (isSameVnode(m, h)) "slot" !== $.$tag$ && "slot" !== u.$tag$ || putBackInOriginalLocation(m.$elm$.parentNode, !1),
patch(m, h), e.insertBefore(m.$elm$, $.$elm$), m = t[--c], h = n[++r]; else {
if (i = -1, BUILD.vdomKey) for (d = a; d <= c; ++d) if (t[d] && null !== t[d].$key$ && t[d].$key$ === h.$key$) {
i = d;
break;
}
i >= 0 ? (l = t[i], l.$tag$ !== h.$tag$ ? s = createElm(t && t[r], o, i, e) : (patch(l, h),
t[i] = void 0, s = l.$elm$), h = n[++r]) : (s = createElm(t && t[r], o, r, e), h = n[++r]),
s && (parentReferenceNode($.$elm$).insertBefore(s, referenceNode($.$elm$)) );
}
a > c ? addVnodes(e, null == n[p + 1] ? null : n[p + 1].$elm$, o, n, r, p) : r > p && removeVnodes(t, a, c);
})(o, n, t, s) : null !== s ? (null !== e.$text$ && (o.textContent = ""),
addVnodes(o, null, t, s, 0, s.length - 1)) : null !== n && removeVnodes(n, 0, n.length - 1),
isSvgMode && "svg" === l && (isSvgMode = !1));
}, updateFallbackSlotVisibility = e => {
let t, o, n, s, l, a, r = e.childNodes;
for (o = 0, n = r.length; o < n; o++) if (t = r[o], 1 === t.nodeType) {
if (t["s-sr"]) for (l = t["s-sn"], t.hidden = !1, s = 0; s < n; s++) if (a = r[s].nodeType,
r[s]["s-hn"] !== t["s-hn"] || "" !== l) {
if (1 === a && l === r[s].getAttribute("slot")) {
t.hidden = !0;
break;
}
} else if (1 === a || 3 === a && "" !== r[s].textContent.trim()) {
t.hidden = !0;
break;
}
updateFallbackSlotVisibility(t);
}
}, relocateNodes = [], relocateSlotContent = e => {
let t, o, n, s, l, a, r = 0, i = e.childNodes, d = i.length;
for (;r < d; r++) {
if (t = i[r], t["s-sr"] && (o = t["s-cr"]) && o.parentNode) for (n = o.parentNode.childNodes,
s = t["s-sn"], a = n.length - 1; a >= 0; a--) o = n[a], o["s-cn"] || o["s-nr"] || o["s-hn"] === t["s-hn"] || (isNodeLocatedInSlot(o, s) ? (l = relocateNodes.find((e => e.$nodeToRelocate$ === o)),
checkSlotFallbackVisibility = !0, o["s-sn"] = o["s-sn"] || s, l ? l.$slotRefNode$ = t : relocateNodes.push({
$slotRefNode$: t,
$nodeToRelocate$: o
}), o["s-sr"] && relocateNodes.map((e => {
isNodeLocatedInSlot(e.$nodeToRelocate$, o["s-sn"]) && (l = relocateNodes.find((e => e.$nodeToRelocate$ === o)),
l && !e.$slotRefNode$ && (e.$slotRefNode$ = l.$slotRefNode$));
}))) : relocateNodes.some((e => e.$nodeToRelocate$ === o)) || relocateNodes.push({
$nodeToRelocate$: o
}));
1 === t.nodeType && relocateSlotContent(t);
}
}, isNodeLocatedInSlot = (e, t) => 1 === e.nodeType ? null === e.getAttribute("slot") && "" === t || e.getAttribute("slot") === t : e["s-sn"] === t || "" === t, callNodeRefs = e => {
(e.$attrs$ && e.$attrs$.ref && e.$attrs$.ref(null), e.$children$ && e.$children$.map(callNodeRefs));
}, renderVdom = (e, t) => {
const o = e.$hostElement$, n = e.$cmpMeta$, s = e.$vnode$ || newVNode(null, null), l = isHost(t) ? t : h(null, null, t);
if (hostTagName = o.tagName, BUILD.isDev ) ;
if (n.$attrsToReflect$ && (l.$attrs$ = l.$attrs$ || {}, n.$attrsToReflect$.map((([e, t]) => l.$attrs$[t] = o[e]))),
l.$tag$ = null, l.$flags$ |= 4, e.$vnode$ = l, l.$elm$ = s.$elm$ = o.shadowRoot || o,
(scopeId = o["s-sc"]), (contentRef = o["s-cr"],
useNativeShadowDom = supportsShadow, checkSlotFallbackVisibility = !1), patch(s, l),
BUILD.slotRelocation) {
if (plt.$flags$ |= 1, checkSlotRelocate) {
let e, t, o, n, s, a;
relocateSlotContent(l.$elm$);
let r = 0;
for (;r < relocateNodes.length; r++) e = relocateNodes[r], t = e.$nodeToRelocate$,
t["s-ol"] || (o = originalLocationDebugNode(t) ,
o["s-nr"] = t, t.parentNode.insertBefore(t["s-ol"] = o, t));
for (r = 0; r < relocateNodes.length; r++) if (e = relocateNodes[r], t = e.$nodeToRelocate$,
e.$slotRefNode$) {
for (n = e.$slotRefNode$.parentNode, s = e.$slotRefNode$.nextSibling, o = t["s-ol"]; o = o.previousSibling; ) if (a = o["s-nr"],
a && a["s-sn"] === t["s-sn"] && n === a.parentNode && (a = a.nextSibling, !a || !a["s-nr"])) {
s = a;
break;
}
(!s && n !== t.parentNode || t.nextSibling !== s) && t !== s && (!t["s-hn"] && t["s-ol"] && (t["s-hn"] = t["s-ol"].parentNode.nodeName),
n.insertBefore(t, s));
} else 1 === t.nodeType && (t.hidden = !0);
}
checkSlotFallbackVisibility && updateFallbackSlotVisibility(l.$elm$), plt.$flags$ &= -2,
relocateNodes.length = 0;
}
}, slotReferenceDebugNode = e => doc$1.createComment(`<slot${e.$name$ ? ' name="' + e.$name$ + '"' : ""}> (host=${hostTagName.toLowerCase()})`), originalLocationDebugNode = e => doc$1.createComment("org-location for " + (e.localName ? `<${e.localName}> (host=${e["s-hn"]})` : `[${e.textContent}]`)), getElement = e => getHostRef(e).$hostElement$ , createEvent = (e, t, o) => {
const n = getElement(e);
return {
emit: e => (emitEvent(n, t, {
bubbles: !!(4 & o),
composed: !!(2 & o),
cancelable: !!(1 & o),
detail: e
}))
};
}, emitEvent = (e, t, o) => {
const n = plt.ce(t, o);
return e.dispatchEvent(n), n;
}, attachToAncestor = (e, t) => {
t && !e.$onRenderResolve$ && t["s-p"] && t["s-p"].push(new Promise((t => e.$onRenderResolve$ = t)));
}, scheduleUpdate = (e, t) => {
if ((e.$flags$ |= 16), 4 & e.$flags$) return void (e.$flags$ |= 512);
attachToAncestor(e, e.$ancestorComponent$);
const o = () => dispatchHooks(e, t);
return writeTask(o) ;
}, dispatchHooks = (e, t) => {
const n = createTime("scheduleUpdate", e.$cmpMeta$.$tagName$), s = e.$lazyInstance$ ;
let l;
return t ? ((e.$flags$ |= 256, e.$queuedListeners$ && (e.$queuedListeners$.map((([e, t]) => safeCall$1(s, e, t))),
e.$queuedListeners$ = null)), (l = safeCall$1(s, "componentWillLoad"))) : (BUILD.cmpWillUpdate ), (l = then(l, (() => safeCall$1(s, "componentWillRender")))),
n(), then(l, (() => updateComponent(e, s, t)));
}, updateComponent = async (e, t, o) => {
const n = e.$hostElement$, s = createTime("update", e.$cmpMeta$.$tagName$), l = n["s-rc"];
o && attachStyles(e);
const a = createTime("render", e.$cmpMeta$.$tagName$);
if (await callRender(e, t) ,
BUILD.hydrateServerSide) try {
serverSideConnected(n), o && (1 & e.$cmpMeta$.$flags$ ? n["s-en"] = "" : 2 & e.$cmpMeta$.$flags$ && (n["s-en"] = "c"));
} catch (e) {
consoleError(e, n);
}
if (l && (l.map((e => e())), n["s-rc"] = void 0), a(), s(),
BUILD.asyncLoading) {
const t = n["s-p"], o = () => postUpdateComponent(e);
0 === t.length ? o() : (Promise.all(t).then(o), e.$flags$ |= 4, t.length = 0);
}
};
const callRender = (e, t, o) => {
try {
if (t = (t.render) && t.render(), (e.$flags$ &= -17),
(e.$flags$ |= 2), BUILD.hasRenderFn ) {
return Promise.resolve(t).then((t => renderVdom(e, t)));
}
} catch (t) {
consoleError(t, e.$hostElement$);
}
return null;
}, postUpdateComponent = e => {
const t = e.$cmpMeta$.$tagName$, o = e.$hostElement$, n = createTime("postUpdate", t), s = e.$lazyInstance$ , l = e.$ancestorComponent$;
64 & e.$flags$ ? ((safeCall$1(s, "componentDidUpdate"),
BUILD.isDev ), n()) : (e.$flags$ |= 64, addHydratedFlag(o),
(safeCall$1(s, "componentDidLoad"),
BUILD.isDev ), n(), (e.$onReadyResolve$(o), l || appDidLoad())), e.$onInstanceResolve$(o), (e.$onRenderResolve$ && (e.$onRenderResolve$(),
e.$onRenderResolve$ = void 0), 512 & e.$flags$ && nextTick((() => scheduleUpdate(e, !1))),
e.$flags$ &= -517);
}, forceUpdate$1 = e => {
{
const t = getHostRef(e), o = t.$hostElement$.isConnected;
return o && 2 == (18 & t.$flags$) && scheduleUpdate(t, !1), o;
}
}, appDidLoad = e => {
addHydratedFlag(doc$1.documentElement), nextTick((() => emitEvent(win$2, "appload", {
detail: {
namespace: NAMESPACE
}
}))), BUILD.profile ;
}, safeCall$1 = (e, t, o) => {
if (e && e[t]) try {
return e[t](o);
} catch (e) {
consoleError(e);
}
}, then = (e, t) => e && e.then ? e.then(t) : t(), addHydratedFlag = e => e.classList.add("hydrated") , serverSideConnected = e => {
const t = e.children;
if (null != t) for (let e = 0, o = t.length; e < o; e++) {
const o = t[e];
"function" == typeof o.connectedCallback && o.connectedCallback(), serverSideConnected(o);
}
}, clientHydrate = (e, t, o, n, s, l, a) => {
let r, i, d, c;
if (1 === l.nodeType) {
for (r = l.getAttribute("c-id"), r && (i = r.split("."), i[0] !== a && "0" !== i[0] || (d = {
$flags$: 0,
$hostId$: i[0],
$nodeId$: i[1],
$depth$: i[2],
$index$: i[3],
$tag$: l.tagName.toLowerCase(),
$elm$: l,
$attrs$: null,
$children$: null,
$key$: null,
$name$: null,
$text$: null
}, t.push(d), l.removeAttribute("c-id"), e.$children$ || (e.$children$ = []), e.$children$[d.$index$] = d,
e = d, n && "0" === d.$depth$ && (n[d.$index$] = d.$elm$))), c = l.childNodes.length - 1; c >= 0; c--) clientHydrate(e, t, o, n, s, l.childNodes[c], a);
if (l.shadowRoot) for (c = l.shadowRoot.childNodes.length - 1; c >= 0; c--) clientHydrate(e, t, o, n, s, l.shadowRoot.childNodes[c], a);
} else if (8 === l.nodeType) i = l.nodeValue.split("."), i[1] !== a && "0" !== i[1] || (r = i[0],
d = {
$flags$: 0,
$hostId$: i[1],
$nodeId$: i[2],
$depth$: i[3],
$index$: i[4],
$elm$: l,
$attrs$: null,
$children$: null,
$key$: null,
$name$: null,
$tag$: null,
$text$: null
}, "t" === r ? (d.$elm$ = l.nextSibling, d.$elm$ && 3 === d.$elm$.nodeType && (d.$text$ = d.$elm$.textContent,
t.push(d), l.remove(), e.$children$ || (e.$children$ = []), e.$children$[d.$index$] = d,
n && "0" === d.$depth$ && (n[d.$index$] = d.$elm$))) : d.$hostId$ === a && ("s" === r ? (d.$tag$ = "slot",
i[5] ? l["s-sn"] = d.$name$ = i[5] : l["s-sn"] = "", l["s-sr"] = !0, n && (d.$elm$ = doc$1.createElement(d.$tag$),
d.$name$ && d.$elm$.setAttribute("name", d.$name$), l.parentNode.insertBefore(d.$elm$, l),
l.remove(), "0" === d.$depth$ && (n[d.$index$] = d.$elm$)), o.push(d), e.$children$ || (e.$children$ = []),
e.$children$[d.$index$] = d) : "r" === r && (n ? l.remove() : (s["s-cr"] = l,
l["s-cn"] = !0)))); else if (e && "style" === e.$tag$) {
const t = newVNode(null, l.textContent);
t.$elm$ = l, t.$index$ = "0", e.$children$ = [ t ];
}
}, initializeDocumentHydrate = (e, t) => {
if (1 === e.nodeType) {
let o = 0;
for (;o < e.childNodes.length; o++) initializeDocumentHydrate(e.childNodes[o], t);
if (e.shadowRoot) for (o = 0; o < e.shadowRoot.childNodes.length; o++) initializeDocumentHydrate(e.shadowRoot.childNodes[o], t);
} else if (8 === e.nodeType) {
const o = e.nodeValue.split(".");
"o" === o[0] && (t.set(o[1] + "." + o[2], e), e.nodeValue = "", e["s-en"] = o[3]);
}
}, parsePropertyValue = (e, t) => null == e || isComplexType(e) ? e : 4 & t ? "false" !== e && ("" === e || !!e) : 2 & t ? parseFloat(e) : 1 & t ? String(e) : e, getValue = (e, t) => getHostRef(e).$instanceValues$.get(t), setValue = (e, t, o, n) => {
const s = getHostRef(e), l = s.$hostElement$ , a = s.$instanceValues$.get(t), r = s.$flags$, i = s.$lazyInstance$ ;
if (o = parsePropertyValue(o, n.$members$[t][0]), !(8 & r && void 0 !== a || o === a) && (s.$instanceValues$.set(t, o),
i)) {
if (n.$watchers$ && 128 & r) {
const e = n.$watchers$[t];
e && e.map((e => {
try {
i[e](o, a, t);
} catch (e) {
consoleError(e, l);
}
}));
}
if (2 == (18 & r)) {
scheduleUpdate(s, !1);
}
}
}, proxyComponent = (e, t, o) => {
if (t.$members$) {
e.watchers && (t.$watchers$ = e.watchers);
const n = Object.entries(t.$members$), s = e.prototype;
if (n.map((([e, [n]]) => {
(31 & n || (2 & o) && 32 & n) ? Object.defineProperty(s, e, {
get() {
return getValue(this, e);
},
set(s) {
setValue(this, e, s, t);
},
configurable: !0,
enumerable: !0
}) : 1 & o && 64 & n && Object.defineProperty(s, e, {
value(...t) {
const o = getHostRef(this);
return o.$onInstancePromise$.then((() => o.$lazyInstance$[e](...t)));
}
});
})), (1 & o)) {
const o = new Map;
s.attributeChangedCallback = function(e, t, n) {
plt.jmp((() => {
const t = o.get(e);
this[t] = (null !== n || "boolean" != typeof this[t]) && n;
}));
}, e.observedAttributes = n.filter((([e, t]) => 15 & t[0])).map((([e, n]) => {
const s = n[1] || e;
return o.set(s, e), 512 & n[0] && t.$attrsToReflect$.push([ e, s ]),
s;
}));
}
}
return e;
}, initializeComponent = async (e, t, o, n, s) => {
if (0 == (32 & t.$flags$)) {
{
if (t.$flags$ |= 32, (s = loadModule(o)).then) {
const e = (() => {});
s = await s, e();
}
!s.isProxied && ((o.$watchers$ = s.watchers),
proxyComponent(s, o, 2), s.isProxied = !0);
const e = createTime("createInstance", o.$tagName$);
(t.$flags$ |= 8);
try {
new s(t);
} catch (e) {
consoleError(e);
}
(t.$flags$ &= -9), (t.$flags$ |= 128), e(),
fireConnectedCallback(t.$lazyInstance$);
}
if (s.style) {
let n = s.style;
"string" != typeof n && (n = n[t.$modeName$ = computeMode(e)], t.$modeName$ && e.setAttribute("s-mode", t.$modeName$));
const l = getScopeId(o, t.$modeName$);
if (!styles$1.has(l)) {
const e = createTime("registerStyles", o.$tagName$);
registerStyle(l, n), e();
}
}
}
const r = t.$ancestorComponent$, i = () => scheduleUpdate(t, !0);
r && r["s-rc"] ? r["s-rc"].push(i) : i();
}, fireConnectedCallback = e => {
safeCall$1(e, "connectedCallback");
}, connectedCallback = e => {
if (0 == (1 & plt.$flags$)) {
const t = getHostRef(e), o = t.$cmpMeta$, n = createTime("connectedCallback", o.$tagName$);
if (1 & t.$flags$) addHostEventListeners(e, t, o.$listeners$), fireConnectedCallback(t.$lazyInstance$); else {
let n;
if (t.$flags$ |= 1, (n = e.getAttribute("s-id"), n)) {
((e, t, o, n) => {
const s = createTime("hydrateClient", t), l = e.shadowRoot, a = [], r = l ? [] : null, i = n.$vnode$ = newVNode(t, null);
plt.$orgLocNodes$ || initializeDocumentHydrate(doc$1.body, plt.$orgLocNodes$ = new Map),
e["s-id"] = o, e.removeAttribute("s-id"), clientHydrate(i, a, [], r, e, e, o), a.map((e => {
const o = e.$hostId$ + "." + e.$nodeId$, n = plt.$orgLocNodes$.get(o), s = e.$elm$;
n && supportsShadow && "" === n["s-en"] && n.parentNode.insertBefore(s, n.nextSibling),
l || (s["s-hn"] = t, n && (s["s-ol"] = n, s["s-ol"]["s-nr"] = s)), plt.$orgLocNodes$.delete(o);
})), l && r.map((e => {
e && l.appendChild(e);
})), s();
})(e, o.$tagName$, n, t);
}
if (!n && (BUILD.hydrateServerSide ) && setContentReference(e),
BUILD.asyncLoading) {
let o = e;
for (;o = o.parentNode || o.host; ) if (1 === o.nodeType && o.hasAttribute("s-id") && o["s-p"] || o["s-p"]) {
attachToAncestor(t, t.$ancestorComponent$ = o);
break;
}
}
initializeComponent(e, t, o);
}
n();
}
}, setContentReference = e => {
const t = e["s-cr"] = doc$1.createComment("");
t["s-cn"] = !0, e.insertBefore(t, e.firstChild);
}, insertVdomAnnotations = (e, t) => {
if (null != e) {
const o = {
hostIds: 0,
rootLevelIds: 0,
staticComponents: new Set(t)
}, n = [];
parseVNodeAnnotations(e, e.body, o, n), n.forEach((t => {
if (null != t) {
const n = t["s-nr"];
let s = n["s-host-id"], l = n["s-node-id"], a = `${s}.${l}`;
if (null == s) if (s = 0, o.rootLevelIds++, l = o.rootLevelIds, a = `${s}.${l}`,
1 === n.nodeType) n.setAttribute("c-id", a); else if (3 === n.nodeType) {
if (0 === s && "" === n.nodeValue.trim()) return void t.remove();
const o = e.createComment(a);
o.nodeValue = `t.${a}`, n.parentNode.insertBefore(o, n);
}
let r = `o.${a}`;
const i = t.parentElement;
i && ("" === i["s-en"] ? r += "." : "c" === i["s-en"] && (r += ".c")), t.nodeValue = r;
}
}));
}
}, parseVNodeAnnotations = (e, t, o, n) => {
null != t && (null != t["s-nr"] && n.push(t), 1 === t.nodeType && t.childNodes.forEach((t => {
const s = getHostRef(t);
if (null != s && !o.staticComponents.has(t.nodeName.toLowerCase())) {
const n = {
nodeIds: 0
};
insertVNodeAnnotations(e, t, s.$vnode$, o, n);
}
parseVNodeAnnotations(e, t, o, n);
})));
}, insertVNodeAnnotations = (e, t, o, n, s) => {
if (null != o) {
const l = ++n.hostIds;
if (t.setAttribute("s-id", l), null != t["s-cr"] && (t["s-cr"].nodeValue = `r.${l}`),
null != o.$children$) {
const t = 0;
o.$children$.forEach(((o, n) => {
insertChildVNodeAnnotations(e, o, s, l, t, n);
}));
}
if (t && o && o.$elm$ && !t.hasAttribute("c-id")) {
const e = t.parentElement;
if (e && e.childNodes) {
const n = Array.from(e.childNodes), s = n.find((e => 8 === e.nodeType && e["s-sr"]));
if (s) {
const e = n.indexOf(t) - 1;
o.$elm$.setAttribute("c-id", `${s["s-host-id"]}.${s["s-node-id"]}.0.${e}`);
}
}
}
}
}, insertChildVNodeAnnotations = (e, t, o, n, s, l) => {
const a = t.$elm$;
if (null == a) return;
const r = o.nodeIds++, i = `${n}.${r}.${s}.${l}`;
if (a["s-host-id"] = n, a["s-node-id"] = r, 1 === a.nodeType) a.setAttribute("c-id", i); else if (3 === a.nodeType) {
const t = a.parentNode, o = t.nodeName;
if ("STYLE" !== o && "SCRIPT" !== o) {
const o = `t.${i}`, n = e.createComment(o);
t.insertBefore(n, a);
}
} else if (8 === a.nodeType && a["s-sr"]) {
const e = `s.${i}.${a["s-sn"] || ""}`;
a.nodeValue = e;
}
if (null != t.$children$) {
const l = s + 1;
t.$children$.forEach(((t, s) => {
insertChildVNodeAnnotations(e, t, o, n, l, s);
}));
}
}, NO_HYDRATE_TAGS = new Set([ "CODE", "HEAD", "IFRAME", "INPUT", "OBJECT", "OUTPUT", "NOSCRIPT", "PRE", "SCRIPT", "SELECT", "STYLE", "TEMPLATE", "TEXTAREA" ]), hAsync = (e, t, ...o) => {
if (Array.isArray(o) && o.length > 0) {
const n = o.flat(1 / 0);
return n.some(isPromise) ? Promise.all(n).then((o => h(e, t, ...o))).catch((o => h(e, t))) : h(e, t, ...o);
}
return h(e, t);
};
const cmpModules = new Map, getModule = e => {
if ("string" == typeof e) {
e = e.toLowerCase();
const t = cmpModules.get(e);
if (null != t) return t[e];
}
return null;
}, loadModule = (e, t, o) => getModule(e.$tagName$), isMemberInElement = (e, t) => {
if (null != e) {
if (t in e) return !0;
const o = getModule(e.nodeName);
if (null != o) {
const e = o;
if (null != e && null != e.cmpMeta && null != e.cmpMeta.$members$) return t in e.cmpMeta.$members$;
}
}
return !1;
}, registerComponents = e => {
for (const t of e) {
const e = t.cmpMeta.$tagName$;
cmpModules.set(e, {
[e]: t
});
}
}, win$2 = window, doc$1 = win$2.document, readTask = e => {
process.nextTick((() => {
try {
e();
} catch (e) {
consoleError(e);
}
}));
}, writeTask = e => {
process.nextTick((() => {
try {
e();
} catch (e) {
consoleError(e);
}
}));
}, resolved = Promise.resolve(), nextTick = e => resolved.then(e), defaultConsoleError = e => {
null != e && console.error(e.stack || e.message || e);
}, consoleError = (e, t) => (defaultConsoleError)(e, t), plt = {
$flags$: 0,
$resourcesUrl$: "",
jmp: e => e(),
raf: e => requestAnimationFrame(e),
ael: (e, t, o, n) => e.addEventListener(t, o, n),
rel: (e, t, o, n) => e.removeEventListener(t, o, n),
ce: (e, t) => new win$2.CustomEvent(e, t)
}, supportsShadow = !1, hostRefs = new WeakMap, getHostRef = e => hostRefs.get(e), registerInstance = (e, t) => hostRefs.set(t.$lazyInstance$ = e, t), registerHost = (e, t) => {
const o = {
$flags$: 0,
$cmpMeta$: t,
$hostElement$: e,
$instanceValues$: new Map,
$renderCount$: 0
};
return o.$onInstancePromise$ = new Promise((e => o.$onInstanceResolve$ = e)), o.$onReadyPromise$ = new Promise((e => o.$onReadyResolve$ = e)),
e["s-p"] = [], e["s-rc"] = [], addHostEventListeners(e, o, t.$listeners$), hostRefs.set(e, o);
}, Build = {
isDev: !1,
isBrowser: !1,
isServer: !0,
isTesting: !1
}, styles$1 = new Map, modeResolutionChain = [];
const HapticEngine = {
getEngine() {
const win = window;
return (win.TapticEngine) || (win.Capacitor && win.Capacitor.isPluginAvailable('Haptics') && win.Capacitor.Plugins.Haptics);
},
available() {
return !!this.getEngine();
},
isCordova() {
return !!window.TapticEngine;
},
isCapacitor() {
const win = window;
return !!win.Capacitor;
},
impact(options) {
const engine = this.getEngine();
if (!engine) {
return;
}
const style = this.isCapacitor() ? options.style.toUpperCase() : options.style;
engine.impact({ style });
},
notification(options) {
const engine = this.getEngine();
if (!engine) {
return;
}
const style = this.isCapacitor() ? options.style.toUpperCase() : options.style;
engine.notification({ style });
},
selection() {
this.impact({ style: 'light' });
},
selectionStart() {
const engine = this.getEngine();
if (!engine) {
return;
}
if (this.isCapacitor()) {
engine.selectionStart();
}
else {
engine.gestureSelectionStart();
}
},
selectionChanged() {
const engine = this.getEngine();
if (!engine) {
return;
}
if (this.isCapacitor()) {
engine.selectionChanged();
}
else {
engine.gestureSelectionChanged();
}
},
selectionEnd() {
const engine = this.getEngine();
if (!engine) {
return;
}
if (this.isCapacitor()) {
engine.selectionEnd();
}
else {
engine.gestureSelectionEnd();
}
}
};
/**
* Trigger a selection changed haptic event. Good for one-time events
* (not for gestures)
*/
const hapticSelection = () => {
HapticEngine.selection();
};
/**
* Tell the haptic engine that a gesture for a selection change is starting.
*/
const hapticSelectionStart = () => {
HapticEngine.selectionStart();
};
/**
* Tell the haptic engine that a selection changed during a gesture.
*/
const hapticSelectionChanged = () => {
HapticEngine.selectionChanged();
};
/**
* Tell the haptic engine we are done with a gesture. This needs to be
* called lest resources are not properly recycled.
*/
const hapticSelectionEnd = () => {
HapticEngine.selectionEnd();
};
/**
* Use this to indicate success/failure/warning to the user.
* options should be of the type `{ style: 'light' }` (or `medium`/`heavy`)
*/
const hapticImpact = (options) => {
HapticEngine.impact(options);
};
class GestureController {
constructor() {
this.gestureId = 0;
this.requestedStart = new Map();
this.disabledGestures = new Map();
this.disabledScroll = new Set();
}
/**
* Creates a gesture delegate based on the GestureConfig passed
*/
createGesture(config) {
return new GestureDelegate(this, this.newID(), config.name, config.priority || 0, !!config.disableScroll);
}
/**
* Creates a blocker that will block any other gesture events from firing. Set in the ion-gesture component.
*/
createBlocker(opts = {}) {
return new BlockerDelegate(this, this.newID(), opts.disable, !!opts.disableScroll);
}
start(gestureName, id, priority) {
if (!this.canStart(gestureName)) {
this.requestedStart.delete(id);
return false;
}
this.requestedStart.set(id, priority);
return true;
}
capture(gestureName, id, priority) {
if (!this.start(gestureName, id, priority)) {
return false;
}
const requestedStart = this.requestedStart;
let maxPriority = -10000;
requestedStart.forEach(value => {
maxPriority = Math.max(maxPriority, value);
});
if (maxPriority === priority) {
this.capturedId = id;
requestedStart.clear();
const event = new CustomEvent('ionGestureCaptured', { detail: { gestureName } });
document.dispatchEvent(event);
return true;
}
requestedStart.delete(id);
return false;
}
release(id) {
this.requestedStart.delete(id);
if (this.capturedId === id) {
this.capturedId = undefined;
}
}
disableGesture(gestureName, id) {
let set = this.disabledGestures.get(gestureName);
if (set === undefined) {
set = new Set();
this.disabledGestures.set(gestureName, set);
}
set.add(id);
}
enableGesture(gestureName, id) {
const set = this.disabledGestures.get(gestureName);
if (set !== undefined) {
set.delete(id);
}
}
disableScroll(id) {
this.disabledScroll.add(id);
if (this.disabledScroll.size === 1) {
document.body.classList.add(BACKDROP_NO_SCROLL);
}
}
enableScroll(id) {
this.disabledScroll.delete(id);
if (this.disabledScroll.size === 0) {
document.body.classList.remove(BACKDROP_NO_SCROLL);
}
}
canStart(gestureName) {
if (this.capturedId !== undefined) {
// a gesture already captured
return false;
}
if (this.isDisabled(gestureName)) {
return false;
}
return true;
}
isCaptured() {
return this.capturedId !== undefined;
}
isScrollDisabled() {
return this.disabledScroll.size > 0;
}
isDisabled(gestureName) {
const disabled = this.disabledGestures.get(gestureName);
if (disabled && disabled.size > 0) {
return true;
}
return false;
}
newID() {
this.gestureId++;
return this.gestureId;
}
}
class GestureDelegate {
constructor(ctrl, id, name, priority, disableScroll) {
this.id = id;
this.name = name;
this.disableScroll = disableScroll;
this.priority = priority * 1000000 + id;
this.ctrl = ctrl;
}
canStart() {
if (!this.ctrl) {
return false;
}
return this.ctrl.canStart(this.name);
}
start() {
if (!this.ctrl) {
return false;
}
return this.ctrl.start(this.name, this.id, this.priority);
}
capture() {
if (!this.ctrl) {
return false;
}
const captured = this.ctrl.capture(this.name, this.id, this.priority);
if (captured && this.disableScroll) {
this.ctrl.disableScroll(this.id);
}
return captured;
}
release() {
if (this.ctrl) {
this.ctrl.release(this.id);
if (this.disableScroll) {
this.ctrl.enableScroll(this.id);
}
}
}
destroy() {
this.release();
this.ctrl = undefined;
}
}
class BlockerDelegate {
constructor(ctrl, id, disable, disableScroll) {
this.id = id;
this.disable = disable;
this.disableScroll = disableScroll;
this.ctrl = ctrl;
}
block() {
if (!this.ctrl) {
return;
}
if (this.disable) {
for (const gesture of this.disable) {
this.ctrl.disableGesture(gesture, this.id);
}
}
if (this.disableScroll) {
this.ctrl.disableScroll(this.id);
}
}
unblock() {
if (!this.ctrl) {
return;
}
if (this.disable) {
for (const gesture of this.disable) {
this.ctrl.enableGesture(gesture, this.id);
}
}
if (this.disableScroll) {
this.ctrl.enableScroll(this.id);
}
}
destroy() {
this.unblock();
this.ctrl = undefined;
}
}
const BACKDROP_NO_SCROLL = 'backdrop-no-scroll';
const GESTURE_CONTROLLER = new GestureController();
const addEventListener$1 = (el, eventName, callback, opts) => {
// use event listener options when supported
// otherwise it's just a boolean for the "capture" arg
const listenerOpts = supportsPassive(el) ? {
'capture': !!opts.capture,
'passive': !!opts.passive,
} : !!opts.capture;
let add;
let remove;
if (el['__zone_symbol__addEventListener']) {
add = '__zone_symbol__addEventListener';
remove = '__zone_symbol__removeEventListener';
}
else {
add = 'addEventListener';
remove = 'removeEventListener';
}
el[add](eventName, callback, listenerOpts);
return () => {
el[remove](eventName, callback, listenerOpts);
};
};
const supportsPassive = (node) => {
if (_sPassive === undefined) {
try {
const opts = Object.defineProperty({}, 'passive', {
get: () => {
_sPassive = true;
}
});
node.addEventListener('optsTest', () => { return; }, opts);
}
catch (e) {
_sPassive = false;
}
}
return !!_sPassive;
};
let _sPassive;
const MOUSE_WAIT = 2000;
const createPointerEvents = (el, pointerDown, pointerMove, pointerUp, options) => {
let rmTouchStart;
let rmTouchMove;
let rmTouchEnd;
let rmTouchCancel;
let rmMouseStart;
let rmMouseMove;
let rmMouseUp;
let lastTouchEvent = 0;
const handleTouchStart = (ev) => {
lastTouchEvent = Date.now() + MOUSE_WAIT;
if (!pointerDown(ev)) {
return;
}
if (!rmTouchMove && pointerMove) {
rmTouchMove = addEventListener$1(el, 'touchmove', pointerMove, options);
}
/**
* Events are dispatched on the element that is tapped and bubble up to
* the reference element in the gesture. In the event that the element this
* event was first dispatched on is removed from the DOM, the event will no
* longer bubble up to our reference element. This leaves the gesture in an
* unusable state. To account for this, the touchend and touchcancel listeners
* should be added to the event target so that they still fire even if the target
* is removed from the DOM.
*/
if (!rmTouchEnd) {
rmTouchEnd = addEventListener$1(ev.target, 'touchend', handleTouchEnd, options);
}
if (!rmTouchCancel) {
rmTouchCancel = addEventListener$1(ev.target, 'touchcancel', handleTouchEnd, options);
}
};
const handleMouseDown = (ev) => {
if (lastTouchEvent > Date.now()) {
return;
}
if (!pointerDown(ev)) {
return;
}
if (!rmMouseMove && pointerMove) {
rmMouseMove = addEventListener$1(getDocument(el), 'mousemove', pointerMove, options);
}
if (!rmMouseUp) {
rmMouseUp = addEventListener$1(getDocument(el), 'mouseup', handleMouseUp, options);
}
};
const handleTouchEnd = (ev) => {
stopTouch();
if (pointerUp) {
pointerUp(ev);
}
};
const handleMouseUp = (ev) => {
stopMouse();
if (pointerUp) {
pointerUp(ev);
}
};
const stopTouch = () => {
if (rmTouchMove) {
rmTouchMove();
}
if (rmTouchEnd) {
rmTouchEnd();
}
if (rmTouchCancel) {
rmTouchCancel();
}
rmTouchMove = rmTouchEnd = rmTouchCancel = undefined;
};
const stopMouse = () => {
if (rmMouseMove) {
rmMouseMove();
}
if (rmMouseUp) {
rmMouseUp();
}
rmMouseMove = rmMouseUp = undefined;
};
const stop = () => {
stopTouch();
stopMouse();
};
const enable = (isEnabled = true) => {
if (!isEnabled) {
if (rmTouchStart) {
rmTouchStart();
}
if (rmMouseStart) {
rmMouseStart();
}
rmTouchStart = rmMouseStart = undefined;
stop();
}
else {
if (!rmTouchStart) {
rmTouchStart = addEventListener$1(el, 'touchstart', handleTouchStart, options);
}
if (!rmMouseStart) {
rmMouseStart = addEventListener$1(el, 'mousedown', handleMouseDown, options);
}
}
};
const destroy = () => {
enable(false);
pointerUp = pointerMove = pointerDown = undefined;
};
return {
enable,
stop,
destroy
};
};
const getDocument = (node) => {
return node instanceof Document ? node : node.ownerDocument;
};
const createPanRecognizer = (direction, thresh, maxAngle) => {
const radians = maxAngle * (Math.PI / 180);
const isDirX = direction === 'x';
const maxCosine = Math.cos(radians);
const threshold = thresh * thresh;
let startX = 0;
let startY = 0;
let dirty = false;
let isPan = 0;
return {
start(x, y) {
startX = x;
startY = y;
isPan = 0;
dirty = true;
},
detect(x, y) {
if (!dirty) {
return false;
}
const deltaX = (x - startX);
const deltaY = (y - startY);
const distance = deltaX * deltaX + deltaY * deltaY;
if (distance < threshold) {
return false;
}
const hypotenuse = Math.sqrt(distance);
const cosine = (isDirX ? deltaX : deltaY) / hypotenuse;
if (cosine > maxCosine) {
isPan = 1;
}
else if (cosine < -maxCosine) {
isPan = -1;
}
else {
isPan = 0;
}
dirty = false;
return true;
},
isGesture() {
return isPan !== 0;
},
getDirection() {
return isPan;
}
};
};
const createGesture = (config) => {
let hasCapturedPan = false;
let hasStartedPan = false;
let hasFiredStart = true;
let isMoveQueued = false;
const finalConfig = Object.assign({ disableScroll: false, direction: 'x', gesturePriority: 0, passive: true, maxAngle: 40, threshold: 10 }, config);
const canStart = finalConfig.canStart;
const onWillStart = finalConfig.onWillStart;
const onStart = finalConfig.onStart;
const onEnd = finalConfig.onEnd;
const notCaptured = finalConfig.notCaptured;
const onMove = finalConfig.onMove;
const threshold = finalConfig.threshold;
const passive = finalConfig.passive;
const blurOnStart = finalConfig.blurOnStart;
const detail = {
type: 'pan',
startX: 0,
startY: 0,
startTime: 0,
currentX: 0,
currentY: 0,
velocityX: 0,
velocityY: 0,
deltaX: 0,
deltaY: 0,
currentTime: 0,
event: undefined,
data: undefined
};
const pan = createPanRecognizer(finalConfig.direction, finalConfig.threshold, finalConfig.maxAngle);
const gesture = GESTURE_CONTROLLER.createGesture({
name: config.gestureName,
priority: config.gesturePriority,
disableScroll: config.disableScroll
});
const pointerDown = (ev) => {
const timeStamp = now(ev);
if (hasStartedPan || !hasFiredStart) {
return false;
}
updateDetail(ev, detail);
detail.startX = detail.currentX;
detail.startY = detail.currentY;
detail.startTime = detail.currentTime = timeStamp;
detail.velocityX = detail.velocityY = detail.deltaX = detail.deltaY = 0;
detail.event = ev;
// Check if gesture can start
if (canStart && canStart(detail) === false) {
return false;
}
// Release fallback
gesture.release();
// Start gesture
if (!gesture.start()) {
return false;
}
hasStartedPan = true;
if (threshold === 0) {
return tryToCapturePan();
}
pan.start(detail.startX, detail.startY);
return true;
};
const pointerMove = (ev) => {
// fast path, if gesture is currently captured
// do minimum job to get user-land even dispatched
if (hasCapturedPan) {
if (!isMoveQueued && hasFiredStart) {
isMoveQueued = true;
calcGestureData(detail, ev);
requestAnimationFrame(fireOnMove);
}
return;
}
// gesture is currently being detected
calcGestureData(detail, ev);
if (pan.detect(detail.currentX, detail.currentY)) {
if (!pan.isGesture() || !tryToCapturePan()) {
abortGesture();
}
}
};
const fireOnMove = () => {
// Since fireOnMove is called inside a RAF, onEnd() might be called,
// we must double check hasCapturedPan
if (!hasCapturedPan) {
return;
}
isMoveQueued = false;
if (onMove) {
onMove(detail);
}
};
const tryToCapturePan = () => {
if (gesture && !gesture.capture()) {
return false;
}
hasCapturedPan = true;
hasFiredStart = false;
// reset start position since the real user-land event starts here
// If the pan detector threshold is big, not resetting the start position
// will cause a jump in the animation equal to the detector threshold.
// the array of positions used to calculate the gesture velocity does not
// need to be cleaned, more points in the positions array always results in a
// more accurate value of the velocity.
detail.startX = detail.currentX;
detail.startY = detail.currentY;
detail.startTime = detail.currentTime;
if (onWillStart) {
onWillStart(detail).then(fireOnStart);
}
else {
fireOnStart();
}
return true;
};
const blurActiveElement = () => {
/* tslint:disable-next-line */
if (typeof document !== 'undefined') {
const activeElement = document.activeElement;
if (activeElement !== null && activeElement.blur) {
activeElement.blur();
}
}
};
const fireOnStart = () => {
if (blurOnStart) {
blurActiveElement();
}
if (onStart) {
onStart(detail);
}
hasFiredStart = true;
};
const reset = () => {
hasCapturedPan = false;
hasStartedPan = false;
isMoveQueued = false;
hasFiredStart = true;
gesture.release();
};
// END *************************
const pointerUp = (ev) => {
const tmpHasCaptured = hasCapturedPan;
const tmpHasFiredStart = hasFiredStart;
reset();
if (!tmpHasFiredStart) {
return;
}
calcGestureData(detail, ev);
// Try to capture press
if (tmpHasCaptured) {
if (onEnd) {
onEnd(detail);
}
return;
}
// Not captured any event
if (notCaptured) {
notCaptured(detail);
}
};
const pointerEvents = createPointerEvents(finalConfig.el, pointerDown, pointerMove, pointerUp, {
capture: false,
passive
});
const abortGesture = () => {
reset();
pointerEvents.stop();
if (notCaptured) {
notCaptured(detail);
}
};
return {
enable(enable = true) {
if (!enable) {
if (hasCapturedPan) {
pointerUp(undefined);
}
reset();
}
pointerEvents.enable(enable);
},
destroy() {
gesture.destroy();
pointerEvents.destroy();
}
};
};
const calcGestureData = (detail, ev) => {
if (!ev) {
return;
}
const prevX = detail.currentX;
const prevY = detail.currentY;
const prevT = detail.currentTime;
updateDetail(ev, detail);
const currentX = detail.currentX;
const currentY = detail.currentY;
const timestamp = detail.currentTime = now(ev);
const timeDelta = timestamp - prevT;
if (timeDelta > 0 && timeDelta < 100) {
const velocityX = (currentX - prevX) / timeDelta;
const velocityY = (currentY - prevY) / timeDelta;
detail.velocityX = velocityX * 0.7 + detail.velocityX * 0.3;
detail.velocityY = velocityY * 0.7 + detail.velocityY * 0.3;
}
detail.deltaX = currentX - detail.startX;
detail.deltaY = currentY - detail.startY;
detail.event = ev;
};
const updateDetail = (ev, detail) => {
// get X coordinates for either a mouse click
// or a touch depending on the given event
let x = 0;
let y = 0;
if (ev) {
const changedTouches = ev.changedTouches;
if (changedTouches && changedTouches.length > 0) {
const touch = changedTouches[0];
x = touch.clientX;
y = touch.clientY;
}
else if (ev.pageX !== undefined) {
x = ev.pageX;
y = ev.pageY;
}
}
detail.currentX = x;
detail.currentY = y;
};
const now = (ev) => {
return ev.timeStamp || Date.now();
};
var index$1 = /*#__PURE__*/Object.freeze({
__proto__: null,
createGesture: createGesture,
GESTURE_CONTROLLER: GESTURE_CONTROLLER
});
const createButtonActiveGesture = (el, isButton) => {
let currentTouchedButton;
let initialTouchedButton;
const activateButtonAtPoint = (x, y, hapticFeedbackFn) => {
if (typeof document === 'undefined') {
return;
}
const target = document.elementFromPoint(x, y);
if (!target || !isButton(target)) {
clearActiveButton();
return;
}
if (target !== currentTouchedButton) {
clearActiveButton();
setActiveButton(target, hapticFeedbackFn);
}
};
const setActiveButton = (button, hapticFeedbackFn) => {
currentTouchedButton = button;
if (!initialTouchedButton) {
initialTouchedButton = currentTouchedButton;
}
const buttonToModify = currentTouchedButton;
writeTask(() => buttonToModify.classList.add('ion-activated'));
hapticFeedbackFn();
};
const clearActiveButton = (dispatchClick = false) => {
if (!currentTouchedButton) {
return;
}
const buttonToModify = currentTouchedButton;
writeTask(() => buttonToModify.classList.remove('ion-activated'));
/**
* Clicking on one button, but releasing on another button
* does not dispatch a click event in browsers, so we
* need to do it manually here. Some browsers will
* dispatch a click if clicking on one button, dragging over
* another button, and releasing on the original button. In that
* case, we need to make sure we do not cause a double click there.
*/
if (dispatchClick && initialTouchedButton !== currentTouchedButton) {
currentTouchedButton.click();
}
currentTouchedButton = undefined;
};
return createGesture({
el,
gestureName: 'buttonActiveDrag',
threshold: 0,
onStart: ev => activateButtonAtPoint(ev.currentX, ev.currentY, hapticSelectionStart),
onMove: ev => activateButtonAtPoint(ev.currentX, ev.currentY, hapticSelectionChanged),
onEnd: () => {
clearActiveButton(true);
hapticSelectionEnd();
initialTouchedButton = undefined;
}
});
};
/**
* When hardwareBackButton: false in config,
* we need to make sure we also block the default
* webview behavior. If we don't then it will be
* possible for users to navigate backward while
* an overlay is still open. Additionally, it will
* give the appearance that the hardwareBackButton
* config is not working as the page transition
* will still happen.
*/
const OVERLAY_BACK_BUTTON_PRIORITY = 100;
const MENU_BACK_BUTTON_PRIORITY = 99; // 1 less than overlay priority since menu is displayed behind overlays
/**
* Waits for a component to be ready for
* both custom element and non-custom element builds.
* If non-custom element build, el.componentOnReady
* will be used.
* For custom element builds, we wait a frame
* so that the inner contents of the component
* have a chance to render.
*
* Use this utility rather than calling
* el.componentOnReady yourself.
*/
const componentOnReady = (el, callback) => {
if (el.componentOnReady) {
el.componentOnReady().then((resolvedEl) => callback(resolvedEl));
}
else {
raf(() => callback(el));
}
};
/**
* Elements inside of web components sometimes need to inherit global attributes
* set on the host. For example, the inner input in `ion-input` should inherit
* the `title` attribute that developers set directly on `ion-input`. This
* helper function should be called in componentWillLoad and assigned to a variable
* that is later used in the render function.
*
* This does not need to be reactive as changing attributes on the host element
* does not trigger a re-render.
*/
const inheritAttributes = (el, attributes = []) => {
const attributeObject = {};
attributes.forEach(attr => {
if (el.hasAttribute(attr)) {
const value = el.getAttribute(attr);
if (value !== null) {
attributeObject[attr] = el.getAttribute(attr);
}
el.removeAttribute(attr);
}
});
return attributeObject;
};
const addEventListener = (el, eventName, callback, opts) => {
if (typeof window !== 'undefined') {
const win = window;
const config = win && win.Ionic && win.Ionic.config;
if (config) {
const ael = config.get('_ael');
if (ael) {
return ael(el, eventName, callback, opts);
}
else if (config._ael) {
return config._ael(el, eventName, callback, opts);
}
}
}
return el.addEventListener(eventName, callback, opts);
};
const removeEventListener = (el, eventName, callback, opts) => {
if (typeof window !== 'undefined') {
const win = window;
const config = win && win.Ionic && win.Ionic.config;
if (config) {
const rel = config.get('_rel');
if (rel) {
return rel(el, eventName, callback, opts);
}
else if (config._rel) {
return config._rel(el, eventName, callback, opts);
}
}
}
return el.removeEventListener(eventName, callback, opts);
};
/**
* Gets the root context of a shadow dom element
* On newer browsers this will be the shadowRoot,
* but for older browser this may just be the
* element itself.
*
* Useful for whenever you need to explicitly
* do "myElement.shadowRoot!.querySelector(...)".
*/
const getElementRoot = (el, fallback = el) => {
return el.shadowRoot || fallback;
};
/**
* Patched version of requestAnimationFrame that avoids ngzone
* Use only when you know ngzone should not run
*/
const raf = (h) => {
if (typeof __zone_symbol__requestAnimationFrame === 'function') {
return __zone_symbol__requestAnimationFrame(h);
}
if (typeof requestAnimationFrame === 'function') {
return requestAnimationFrame(h);
}
return setTimeout(h);
};
const hasShadowDom = (el) => {
return !!el.shadowRoot && !!el.attachShadow;
};
const findItemLabel = (componentEl) => {
const itemEl = componentEl.closest('ion-item');
if (itemEl) {
return itemEl.querySelector('ion-label');
}
return null;
};
/**
* This method is used for Ionic's input components that use Shadow DOM. In
* order to properly label the inputs to work with screen readers, we need
* to get the text content of the label outside of the shadow root and pass
* it to the input inside of the shadow root.
*
* Referencing label elements by id from outside of the component is
* impossible due to the shadow boundary, read more here:
* https://developer.salesforce.com/blogs/2020/01/accessibility-for-web-components.html
*
* @param componentEl The shadow element that needs the aria label
* @param inputId The unique identifier for the input
*/
const getAriaLabel = (componentEl, inputId) => {
let labelText;
// If the user provides their own label via the aria-labelledby attr
// we should use that instead of looking for an ion-label
const labelledBy = componentEl.getAttribute('aria-labelledby');
// Grab the id off of the component in case they are using
// a custom label using the label element
const componentId = componentEl.id;
let labelId = labelledBy !== null && labelledBy.trim() !== ''
? labelledBy
: inputId + '-lbl';
let label = labelledBy !== null && labelledBy.trim() !== ''
? document.getElementById(labelledBy)
: findItemLabel(componentEl);
if (label) {
if (labelledBy === null) {
label.id = labelId;
}
labelText = label.textContent;
label.setAttribute('aria-hidden', 'true');
// if there is no label, check to see if the user has provided
// one by setting an id on the component and using the label element
}
else if (componentId.trim() !== '') {
label = document.querySelector(`label[for="${componentId}"]`);
if (label) {
if (label.id !== '') {
labelId = label.id;
}
else {
label.id = labelId = `${componentId}-lbl`;
}
labelText = label.textContent;
}
}
return { label, labelId, labelText };
};
/**
* This method is used to add a hidden input to a host element that contains
* a Shadow DOM. It does not add the input inside of the Shadow root which
* allows it to be picked up inside of forms. It should contain the same
* values as the host element.
*
* @param always Add a hidden input even if the container does not use Shadow
* @param container The element where the input will be added
* @param name The name of the input
* @param value The value of the input
* @param disabled If true, the input is disabled
*/
const renderHiddenInput = (always, container, name, value, disabled) => {
if (always || hasShadowDom(container)) {
let input = container.querySelector('input.aux-input');
if (!input) {
input = container.ownerDocument.createElement('input');
input.type = 'hidden';
input.classList.add('aux-input');
container.appendChild(input);
}
input.disabled = disabled;
input.name = name;
input.value = value || '';
}
};
const clamp = (min, n, max) => {
return Math.max(min, Math.min(n, max));
};
const assert = (actual, reason) => {
if (!actual) {
const message = 'ASSERT: ' + reason;
console.error(message);
debugger; // tslint:disable-line
throw new Error(message);
}
};
const pointerCoord = (ev) => {
// get X coordinates for either a mouse click
// or a touch depending on the given event
if (ev) {
const changedTouches = ev.changedTouches;
if (changedTouches && changedTouches.length > 0) {
const touch = changedTouches[0];
return { x: touch.clientX, y: touch.clientY };
}
if (ev.pageX !== undefined) {
return { x: ev.pageX, y: ev.pageY };
}
}
return { x: 0, y: 0 };
};
/**
* @hidden
* Given a side, return if it should be on the end
* based on the value of dir
* @param side the side
* @param isRTL whether the application dir is rtl
*/
const isEndSide = (side) => {
const isRTL = document.dir === 'rtl';
switch (side) {
case 'start': return isRTL;
case 'end': return !isRTL;
default:
throw new Error(`"${side}" is not a valid value for [side]. Use "start" or "end" instead.`);
}
};
const debounceEvent = (event, wait) => {
const original = event._original || event;
return {
_original: event,
emit: debounce(original.emit.bind(original), wait)
};
};
const debounce = (func, wait = 0) => {
let timer;
return (...args) => {
clearTimeout(timer);
timer = setTimeout(func, wait, ...args);
};
};
let lastId = 0;
const activeAnimations = new WeakMap();
const createController = (tagName) => {
return {
create(options) {
return createOverlay(tagName, options);
},
dismiss(data, role, id) {
return dismissOverlay(document, data, role, tagName, id);
},
async getTop() {
return getOverlay(document, tagName);
}
};
};
const alertController = /*@__PURE__*/ createController('ion-alert');
const actionSheetController = /*@__PURE__*/ createController('ion-action-sheet');
const pickerController = /*@__PURE__*/ createController('ion-picker');
const popoverController = /*@__PURE__*/ createController('ion-popover');
const prepareOverlay = (el) => {
/* tslint:disable-next-line */
if (typeof document !== 'undefined') {
connectListeners(document);
}
const overlayIndex = lastId++;
el.overlayIndex = overlayIndex;
if (!el.hasAttribute('id')) {
el.id = `ion-overlay-${overlayIndex}`;
}
};
const createOverlay = (tagName, opts) => {
/* tslint:disable-next-line */
if (typeof customElements !== 'undefined') {
return customElements.whenDefined(tagName).then(() => {
const element = document.createElement(tagName);
element.classList.add('overlay-hidden');
// convert the passed in overlay options into props
// that get passed down into the new overlay
Object.assign(element, opts);
// append the overlay element to the document body
getAppRoot(document).appendChild(element);
return new Promise(resolve => componentOnReady(element, resolve));
});
}
return Promise.resolve();
};
const focusableQueryString = '[tabindex]:not([tabindex^="-"]), input:not([type=hidden]):not([tabindex^="-"]), textarea:not([tabindex^="-"]), button:not([tabindex^="-"]), select:not([tabindex^="-"]), .ion-focusable:not([tabindex^="-"])';
const innerFocusableQueryString = 'input:not([type=hidden]), textarea, button, select';
const focusFirstDescendant = (ref, overlay) => {
let firstInput = ref.querySelector(focusableQueryString);
const shadowRoot = firstInput && firstInput.shadowRoot;
if (shadowRoot) {
// If there are no inner focusable elements, just focus the host element.
firstInput = shadowRoot.querySelector(innerFocusableQueryString) || firstInput;
}
if (firstInput) {
firstInput.focus();
}
else {
// Focus overlay instead of letting focus escape
overlay.focus();
}
};
const focusLastDescendant = (ref, overlay) => {
const inputs = Array.from(ref.querySelectorAll(focusableQueryString));
let lastInput = inputs.length > 0 ? inputs[inputs.length - 1] : null;
const shadowRoot = lastInput && lastInput.shadowRoot;
if (shadowRoot) {
// If there are no inner focusable elements, just focus the host element.
lastInput = shadowRoot.querySelector(innerFocusableQueryString) || lastInput;
}
if (lastInput) {
lastInput.focus();
}
else {
// Focus overlay instead of letting focus escape
overlay.focus();
}
};
/**
* Traps keyboard focus inside of overlay components.
* Based on https://w3c.github.io/aria-practices/examples/dialog-modal/alertdialog.html
* This includes the following components: Action Sheet, Alert, Loading, Modal,
* Picker, and Popover.
* Should NOT include: Toast
*/
const trapKeyboardFocus = (ev, doc) => {
const lastOverlay = getOverlay(doc);
const target = ev.target;
// If no active overlay, ignore this event
if (!lastOverlay || !target) {
return;
}
/**
* If we are focusing the overlay, clear
* the last focused element so that hitting
* tab activates the first focusable element
* in the overlay wrapper.
*/
if (lastOverlay === target) {
lastOverlay.lastFocus = undefined;
/**
* Otherwise, we must be focusing an element
* inside of the overlay. The two possible options
* here are an input/button/etc or the ion-focus-trap
* element. The focus trap element is used to prevent
* the keyboard focus from leaving the overlay when
* using Tab or screen assistants.
*/
}
else {
/**
* We do not want to focus the traps, so get the overlay
* wrapper element as the traps live outside of the wrapper.
*/
const overlayRoot = getElementRoot(lastOverlay);
if (!overlayRoot.contains(target)) {
return;
}
const overlayWrapper = overlayRoot.querySelector('.ion-overlay-wrapper');
if (!overlayWrapper) {
return;
}
/**
* If the target is inside the wrapper, let the browser
* focus as normal and keep a log of the last focused element.
*/
if (overlayWrapper.contains(target)) {
lastOverlay.lastFocus = target;
}
else {
/**
* Otherwise, we must have focused one of the focus traps.
* We need to wrap the focus to either the first element
* or the last element.
*/
/**
* Once we call `focusFirstDescendant` and focus the first
* descendant, another focus event will fire which will
* cause `lastOverlay.lastFocus` to be updated before
* we can run the code after that. We will cache the value
* here to avoid that.
*/
const lastFocus = lastOverlay.lastFocus;
// Focus the first element in the overlay wrapper
focusFirstDescendant(overlayWrapper, lastOverlay);
/**
* If the cached last focused element is the
* same as the active element, then we need
* to wrap focus to the last descendant. This happens
* when the first descendant is focused, and the user
* presses Shift + Tab. The previous line will focus
* the same descendant again (the first one), causing
* last focus to equal the active element.
*/
if (lastFocus === doc.activeElement) {
focusLastDescendant(overlayWrapper, lastOverlay);
}
lastOverlay.lastFocus = doc.activeElement;
}
}
};
const connectListeners = (doc) => {
if (lastId === 0) {
lastId = 1;
doc.addEventListener('focus', ev => trapKeyboardFocus(ev, doc), true);
// handle back-button click
doc.addEventListener('ionBackButton', ev => {
const lastOverlay = getOverlay(doc);
if (lastOverlay && lastOverlay.backdropDismiss) {
ev.detail.register(OVERLAY_BACK_BUTTON_PRIORITY, () => {
return lastOverlay.dismiss(undefined, BACKDROP);
});
}
});
// handle ESC to close overlay
doc.addEventListener('keyup', ev => {
if (ev.key === 'Escape') {
const lastOverlay = getOverlay(doc);
if (lastOverlay && lastOverlay.backdropDismiss) {
lastOverlay.dismiss(undefined, BACKDROP);
}
}
});
}
};
const dismissOverlay = (doc, data, role, overlayTag, id) => {
const overlay = getOverlay(doc, overlayTag, id);
if (!overlay) {
return Promise.reject('overlay does not exist');
}
return overlay.dismiss(data, role);
};
const getOverlays = (doc, selector) => {
if (selector === undefined) {
selector = 'ion-alert,ion-action-sheet,ion-loading,ion-modal,ion-picker,ion-popover,ion-toast';
}
return Array.from(doc.querySelectorAll(selector))
.filter(c => c.overlayIndex > 0);
};
const getOverlay = (doc, overlayTag, id) => {
const overlays = getOverlays(doc, overlayTag);
return (id === undefined)
? overlays[overlays.length - 1]
: overlays.find(o => o.id === id);
};
/**
* When an overlay is presented, the main
* focus is the overlay not the page content.
* We need to remove the page content from the
* accessibility tree otherwise when
* users use "read screen from top" gestures with
* TalkBack and VoiceOver, the screen reader will begin
* to read the content underneath the overlay.
*
* We need a container where all page components
* exist that is separate from where the overlays
* are added in the DOM. For most apps, this element
* is the top most ion-router-outlet. In the event
* that devs are not using a router,
* they will need to add the "ion-view-container-root"
* id to the element that contains all of their views.
*
* TODO: If Framework supports having multiple top
* level router outlets we would need to update this.
* Example: One outlet for side menu and one outlet
* for main content.
*/
const setRootAriaHidden = (hidden = false) => {
const root = getAppRoot(document);
const viewContainer = root.querySelector('ion-router-outlet, ion-nav, #ion-view-container-root');
if (!viewContainer) {
return;
}
if (hidden) {
viewContainer.setAttribute('aria-hidden', 'true');
}
else {
viewContainer.removeAttribute('aria-hidden');
}
};
const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation, opts) => {
if (overlay.presented) {
return;
}
setRootAriaHidden(true);
overlay.presented = true;
overlay.willPresent.emit();
const mode = getIonMode$1(overlay);
// get the user's animation fn if one was provided
const animationBuilder = (overlay.enterAnimation)
? overlay.enterAnimation
: config.get(name, mode === 'ios' ? iosEnterAnimation : mdEnterAnimation);
const completed = await overlayAnimation(overlay, animationBuilder, overlay.el, opts);
if (completed) {
overlay.didPresent.emit();
}
/**
* When an overlay that steals focus
* is dismissed, focus should be returned
* to the element that was focused
* prior to the overlay opening. Toast
* does not steal focus and is excluded
* from returning focus as a result.
*/
if (overlay.el.tagName !== 'ION-TOAST') {
focusPreviousElementOnDismiss(overlay.el);
}
if (overlay.keyboardClose) {
overlay.el.focus();
}
};
/**
* When an overlay component is dismissed,
* focus should be returned to the element
* that presented the overlay. Otherwise
* focus will be set on the body which
* means that people using screen readers
* or tabbing will need to re-navigate
* to where they were before they
* opened the overlay.
*/
const focusPreviousElementOnDismiss = async (overlayEl) => {
let previousElement = document.activeElement;
if (!previousElement) {
return;
}
const shadowRoot = previousElement && previousElement.shadowRoot;
if (shadowRoot) {
// If there are no inner focusable elements, just focus the host element.
previousElement = shadowRoot.querySelector(innerFocusableQueryString) || previousElement;
}
await overlayEl.onDidDismiss();
previousElement.focus();
};
const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLeaveAnimation, opts) => {
if (!overlay.presented) {
return false;
}
setRootAriaHidden(false);
overlay.presented = false;
try {
// Overlay contents should not be clickable during dismiss
overlay.el.style.setProperty('pointer-events', 'none');
overlay.willDismiss.emit({ data, role });
const mode = getIonMode$1(overlay);
const animationBuilder = (overlay.leaveAnimation)
? overlay.leaveAnimation
: config.get(name, mode === 'ios' ? iosLeaveAnimation : mdLeaveAnimation);
// If dismissed via gesture, no need to play leaving animation again
if (role !== 'gesture') {
await overlayAnimation(overlay, animationBuilder, overlay.el, opts);
}
overlay.didDismiss.emit({ data, role });
activeAnimations.delete(overlay);
}
catch (err) {
console.error(err);
}
overlay.el.remove();
return true;
};
const getAppRoot = (doc) => {
return doc.querySelector('ion-app') || doc.body;
};
const overlayAnimation = async (overlay, animationBuilder, baseEl, opts) => {
// Make overlay visible in case it's hidden
baseEl.classList.remove('overlay-hidden');
const aniRoot = baseEl.shadowRoot || overlay.el;
const animation = animationBuilder(aniRoot, opts);
if (!overlay.animated || !config.getBoolean('animated', true)) {
animation.duration(0);
}
if (overlay.keyboardClose) {
animation.beforeAddWrite(() => {
const activeElement = baseEl.ownerDocument.activeElement;
if (activeElement && activeElement.matches('input, ion-input, ion-textarea')) {
activeElement.blur();
}
});
}
const activeAni = activeAnimations.get(overlay) || [];
activeAnimations.set(overlay, [...activeAni, animation]);
await animation.play();
return true;
};
const eventMethod = (element, eventName) => {
let resolve;
const promise = new Promise(r => resolve = r);
onceEvent(element, eventName, (event) => {
resolve(event.detail);
});
return promise;
};
const onceEvent = (element, eventName, callback) => {
const handler = (ev) => {
removeEventListener(element, eventName, handler);
callback(ev);
};
addEventListener(element, eventName, handler);
};
const isCancel = (role) => {
return role === 'cancel' || role === BACKDROP;
};
const defaultGate = (h) => h();
const safeCall = (handler, arg) => {
if (typeof handler === 'function') {
const jmp = config.get('_zoneGate', defaultGate);
return jmp(() => {
try {
return handler(arg);
}
catch (e) {
console.error(e);
}
});
}
return undefined;
};
const BACKDROP = 'backdrop';
const hostContext = (selector, el) => {
return el.closest(selector) !== null;
};
/**
* Create the mode and color classes for the component based on the classes passed in
*/
const createColorClasses$1 = (color, cssClassMap) => {
return (typeof color === 'string' && color.length > 0) ? Object.assign({ 'ion-color': true, [`ion-color-${color}`]: true }, cssClassMap) : cssClassMap;
};
const getClassList = (classes) => {
if (classes !== undefined) {
const array = Array.isArray(classes) ? classes : classes.split(' ');
return array
.filter(c => c != null)
.map(c => c.trim())
.filter(c => c !== '');
}
return [];
};
const getClassMap = (classes) => {
const map = {};
getClassList(classes).forEach(c => map[c] = true);
return map;
};
const SCHEME = /^[a-z][a-z0-9+\-.]*:/;
const openURL = async (url, ev, direction, animation) => {
if (url != null && url[0] !== '#' && !SCHEME.test(url)) {
const router = document.querySelector('ion-router');
if (router) {
if (ev != null) {
ev.preventDefault();
}
return router.push(url, direction, animation);
}
}
return false;
};
let animationPrefix;
/**
* Web Animations requires hyphenated CSS properties
* to be written in camelCase when animating
*/
const processKeyframes = (keyframes) => {
keyframes.forEach(keyframe => {
for (const key in keyframe) {
if (keyframe.hasOwnProperty(key)) {
const value = keyframe[key];
if (key === 'easing') {
const newKey = 'animation-timing-function';
keyframe[newKey] = value;
delete keyframe[key];
}
else {
const newKey = convertCamelCaseToHypen(key);
if (newKey !== key) {
keyframe[newKey] = value;
delete keyframe[key];
}
}
}
}
});
return keyframes;
};
const convertCamelCaseToHypen = (str) => {
return str.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
};
const getAnimationPrefix = (el) => {
if (animationPrefix === undefined) {
const supportsUnprefixed = el.style.animationName !== undefined;
const supportsWebkitPrefix = el.style.webkitAnimationName !== undefined;
animationPrefix = (!supportsUnprefixed && supportsWebkitPrefix) ? '-webkit-' : '';
}
return animationPrefix;
};
const setStyleProperty = (element, propertyName, value) => {
const prefix = propertyName.startsWith('animation') ? getAnimationPrefix(element) : '';
element.style.setProperty(prefix + propertyName, value);
};
const removeStyleProperty = (element, propertyName) => {
const prefix = propertyName.startsWith('animation') ? getAnimationPrefix(element) : '';
element.style.removeProperty(prefix + propertyName);
};
const animationEnd = (el, callback) => {
let unRegTrans;
const opts = { passive: true };
const unregister = () => {
if (unRegTrans) {
unRegTrans();
}
};
const onTransitionEnd = (ev) => {
if (el === ev.target) {
unregister();
callback(ev);
}
};
if (el) {
el.addEventListener('webkitAnimationEnd', onTransitionEnd, opts);
el.addEventListener('animationend', onTransitionEnd, opts);
unRegTrans = () => {
el.removeEventListener('webkitAnimationEnd', onTransitionEnd, opts);
el.removeEventListener('animationend', onTransitionEnd, opts);
};
}
return unregister;
};
const generateKeyframeRules = (keyframes = []) => {
return keyframes.map(keyframe => {
const offset = keyframe.offset;
const frameString = [];
for (const property in keyframe) {
if (keyframe.hasOwnProperty(property) && property !== 'offset') {
frameString.push(`${property}: ${keyframe[property]};`);
}
}
return `${offset * 100}% { ${frameString.join(' ')} }`;
}).join(' ');
};
const keyframeIds = [];
const generateKeyframeName = (keyframeRules) => {
let index = keyframeIds.indexOf(keyframeRules);
if (index < 0) {
index = (keyframeIds.push(keyframeRules) - 1);
}
return `ion-animation-${index}`;
};
const getStyleContainer = (element) => {
const rootNode = element.getRootNode();
return (rootNode.head || rootNode);
};
const createKeyframeStylesheet = (keyframeName, keyframeRules, element) => {
const styleContainer = getStyleContainer(element);
const keyframePrefix = getAnimationPrefix(element);
const existingStylesheet = styleContainer.querySelector('#' + keyframeName);
if (existingStylesheet) {
return existingStylesheet;
}
const stylesheet = (element.ownerDocument || document).createElement('style');
stylesheet.id = keyframeName;
stylesheet.textContent = `@${keyframePrefix}keyframes ${keyframeName} { ${keyframeRules} } @${keyframePrefix}keyframes ${keyframeName}-alt { ${keyframeRules} }`;
styleContainer.appendChild(stylesheet);
return stylesheet;
};
const addClassToArray = (classes = [], className) => {
if (className !== undefined) {
const classNameToAppend = (Array.isArray(className)) ? className : [className];
return [...classes, ...classNameToAppend];
}
return classes;
};
const createAnimation = (animationId) => {
let _delay;
let _duration;
let _easing;
let _iterations;
let _fill;
let _direction;
let _keyframes = [];
let beforeAddClasses = [];
let beforeRemoveClasses = [];
let initialized = false;
let parentAnimation;
let beforeStylesValue = {};
let afterAddClasses = [];
let afterRemoveClasses = [];
let afterStylesValue = {};
let numAnimationsRunning = 0;
let shouldForceLinearEasing = false;
let shouldForceSyncPlayback = false;
let cssAnimationsTimerFallback;
let forceDirectionValue;
let forceDurationValue;
let forceDelayValue;
let willComplete = true;
let finished = false;
let shouldCalculateNumAnimations = true;
let keyframeName;
let ani;
const id = animationId;
const onFinishCallbacks = [];
const onFinishOneTimeCallbacks = [];
const elements = [];
const childAnimations = [];
const stylesheets = [];
const _beforeAddReadFunctions = [];
const _beforeAddWriteFunctions = [];
const _afterAddReadFunctions = [];
const _afterAddWriteFunctions = [];
const webAnimations = [];
const supportsAnimationEffect = (typeof AnimationEffect === 'function' || typeof window.AnimationEffect === 'function');
const supportsWebAnimations = (typeof Element === 'function') && (typeof Element.prototype.animate === 'function') && supportsAnimationEffect;
const ANIMATION_END_FALLBACK_PADDING_MS = 100;
const getWebAnimations = () => {
return webAnimations;
};
const destroy = (clearStyleSheets) => {
childAnimations.forEach(childAnimation => {
childAnimation.destroy(clearStyleSheets);
});
cleanUp(clearStyleSheets);
elements.length = 0;
childAnimations.length = 0;
_keyframes.length = 0;
clearOnFinish();
initialized = false;
shouldCalculateNumAnimations = true;
return ani;
};
/**
* Cancels any Web Animations, removes
* any animation properties from the
* animation's elements, and removes the
* animation's stylesheets from the DOM.
*/
const cleanUp = (clearStyleSheets) => {
cleanUpElements();
if (clearStyleSheets) {
cleanUpStyleSheets();
}
};
const resetFlags = () => {
shouldForceLinearEasing = false;
shouldForceSyncPlayback = false;
shouldCalculateNumAnimations = true;
forceDirectionValue = undefined;
forceDurationValue = undefined;
forceDelayValue = undefined;
numAnimationsRunning = 0;
finished = false;
willComplete = true;
};
const onFinish = (callback, opts) => {
const callbacks = (opts && opts.oneTimeCallback) ? onFinishOneTimeCallbacks : onFinishCallbacks;
callbacks.push({ c: callback, o: opts });
return ani;
};
const clearOnFinish = () => {
onFinishCallbacks.length = 0;
onFinishOneTimeCallbacks.length = 0;
return ani;
};
/**
* Cancels any Web Animations and removes
* any animation properties from the
* the animation's elements.
*/
const cleanUpElements = () => {
if (supportsWebAnimations) {
webAnimations.forEach(animation => {
animation.cancel();
});
webAnimations.length = 0;
}
else {
const elementsArray = elements.slice();
raf(() => {
elementsArray.forEach(element => {
removeStyleProperty(element, 'animation-name');
removeStyleProperty(element, 'animation-duration');
removeStyleProperty(element, 'animation-timing-function');
removeStyleProperty(element, 'animation-iteration-count');
removeStyleProperty(element, 'animation-delay');
removeStyleProperty(element, 'animation-play-state');
removeStyleProperty(element, 'animation-fill-mode');
removeStyleProperty(element, 'animation-direction');
});
});
}
};
/**
* Removes the animation's stylesheets
* from the DOM.
*/
const cleanUpStyleSheets = () => {
stylesheets.forEach(stylesheet => {
/**
* When sharing stylesheets, it's possible
* for another animation to have already
* cleaned up a particular stylesheet
*/
if (stylesheet && stylesheet.parentNode) {
stylesheet.parentNode.removeChild(stylesheet);
}
});
stylesheets.length = 0;
};
const beforeAddRead = (readFn) => {
_beforeAddReadFunctions.push(readFn);
return ani;
};
const beforeAddWrite = (writeFn) => {
_beforeAddWriteFunctions.push(writeFn);
return ani;
};
const afterAddRead = (readFn) => {
_afterAddReadFunctions.push(readFn);
return ani;
};
const afterAddWrite = (writeFn) => {
_afterAddWriteFunctions.push(writeFn);
return ani;
};
const beforeAddClass = (className) => {
beforeAddClasses = addClassToArray(beforeAddClasses, className);
return ani;
};
const beforeRemoveClass = (className) => {
beforeRemoveClasses = addClassToArray(beforeRemoveClasses, className);
return ani;
};
/**
* Set CSS inline styles to the animation's
* elements before the animation begins.
*/
const beforeStyles = (styles = {}) => {
beforeStylesValue = styles;
return ani;
};
/**
* Clear CSS inline styles from the animation's
* elements before the animation begins.
*/
const beforeClearStyles = (propertyNames = []) => {
for (const property of propertyNames) {
beforeStylesValue[property] = '';
}
return ani;
};
const afterAddClass = (className) => {
afterAddClasses = addClassToArray(afterAddClasses, className);
return ani;
};
const afterRemoveClass = (className) => {
afterRemoveClasses = addClassToArray(afterRemoveClasses, className);
return ani;
};
const afterStyles = (styles = {}) => {
afterStylesValue = styles;
return ani;
};
const afterClearStyles = (propertyNames = []) => {
for (const property of propertyNames) {
afterStylesValue[property] = '';
}
return ani;
};
const getFill = () => {
if (_fill !== undefined) {
return _fill;
}
if (parentAnimation) {
return parentAnimation.getFill();
}
return 'both';
};
const getDirection = () => {
if (forceDirectionValue !== undefined) {
return forceDirectionValue;
}
if (_direction !== undefined) {
return _direction;
}
if (parentAnimation) {
return parentAnimation.getDirection();
}
return 'normal';
};
const getEasing = () => {
if (shouldForceLinearEasing) {
return 'linear';
}
if (_easing !== undefined) {
return _easing;
}
if (parentAnimation) {
return parentAnimation.getEasing();
}
return 'linear';
};
const getDuration = () => {
if (shouldForceSyncPlayback) {
return 0;
}
if (forceDurationValue !== undefined) {
return forceDurationValue;
}
if (_duration !== undefined) {
return _duration;
}
if (parentAnimation) {
return parentAnimation.getDuration();
}
return 0;
};
const getIterations = () => {
if (_iterations !== undefined) {
return _iterations;
}
if (parentAnimation) {
return parentAnimation.getIterations();
}
return 1;
};
const getDelay = () => {
if (forceDelayValue !== undefined) {
return forceDelayValue;
}
if (_delay !== undefined) {
return _delay;
}
if (parentAnimation) {
return parentAnimation.getDelay();
}
return 0;
};
const getKeyframes = () => {
return _keyframes;
};
const direction = (animationDirection) => {
_direction = animationDirection;
update(true);
return ani;
};
const fill = (animationFill) => {
_fill = animationFill;
update(true);
return ani;
};
const delay = (animationDelay) => {
_delay = animationDelay;
update(true);
return ani;
};
const easing = (animationEasing) => {
_easing = animationEasing;
update(true);
return ani;
};
const duration = (animationDuration) => {
/**
* CSS Animation Durations of 0ms work fine on Chrome
* but do not run on Safari, so force it to 1ms to
* get it to run on both platforms.
*/
if (!supportsWebAnimations && animationDuration === 0) {
animationDuration = 1;
}
_duration = animationDuration;
update(true);
return ani;
};
const iterations = (animationIterations) => {
_iterations = animationIterations;
update(true);
return ani;
};
const parent = (animation) => {
parentAnimation = animation;
return ani;
};
const addElement = (el) => {
if (el != null) {
if (el.nodeType === 1) {
elements.push(el);
}
else if (el.length >= 0) {
for (let i = 0; i < el.length; i++) {
elements.push(el[i]);
}
}
else {
console.error('Invalid addElement value');
}
}
return ani;
};
const addAnimation = (animationToAdd) => {
if (animationToAdd != null) {
if (Array.isArray(animationToAdd)) {
for (const animation of animationToAdd) {
animation.parent(ani);
childAnimations.push(animation);
}
}
else {
animationToAdd.parent(ani);
childAnimations.push(animationToAdd);
}
}
return ani;
};
const keyframes = (keyframeValues) => {
_keyframes = keyframeValues;
return ani;
};
/**
* Run all "before" animation hooks.
*/
const beforeAnimation = () => {
// Runs all before read callbacks
_beforeAddReadFunctions.forEach(callback => callback());
// Runs all before write callbacks
_beforeAddWriteFunctions.forEach(callback => callback());
// Updates styles and classes before animation runs
const addClasses = beforeAddClasses;
const removeClasses = beforeRemoveClasses;
const styles = beforeStylesValue;
elements.forEach(el => {
const elementClassList = el.classList;
addClasses.forEach(c => elementClassList.add(c));
removeClasses.forEach(c => elementClassList.remove(c));
for (const property in styles) {
if (styles.hasOwnProperty(property)) {
setStyleProperty(el, property, styles[property]);
}
}
});
};
/**
* Run all "after" animation hooks.
*/
const afterAnimation = () => {
clearCSSAnimationsTimeout();
// Runs all after read callbacks
_afterAddReadFunctions.forEach(callback => callback());
// Runs all after write callbacks
_afterAddWriteFunctions.forEach(callback => callback());
// Updates styles and classes before animation ends
const currentStep = willComplete ? 1 : 0;
const addClasses = afterAddClasses;
const removeClasses = afterRemoveClasses;
const styles = afterStylesValue;
elements.forEach(el => {
const elementClassList = el.classList;
addClasses.forEach(c => elementClassList.add(c));
removeClasses.forEach(c => elementClassList.remove(c));
for (const property in styles) {
if (styles.hasOwnProperty(property)) {
setStyleProperty(el, property, styles[property]);
}
}
});
onFinishCallbacks.forEach(onFinishCallback => {
return onFinishCallback.c(currentStep, ani);
});
onFinishOneTimeCallbacks.forEach(onFinishCallback => {
return onFinishCallback.c(currentStep, ani);
});
onFinishOneTimeCallbacks.length = 0;
shouldCalculateNumAnimations = true;
if (willComplete) {
finished = true;
}
willComplete = true;
};
const animationFinish = () => {
if (numAnimationsRunning === 0) {
return;
}
numAnimationsRunning--;
if (numAnimationsRunning === 0) {
afterAnimation();
if (parentAnimation) {
parentAnimation.animationFinish();
}
}
};
const initializeCSSAnimation = (toggleAnimationName = true) => {
cleanUpStyleSheets();
const processedKeyframes = processKeyframes(_keyframes);
elements.forEach(element => {
if (processedKeyframes.length > 0) {
const keyframeRules = generateKeyframeRules(processedKeyframes);
keyframeName = (animationId !== undefined) ? animationId : generateKeyframeName(keyframeRules);
const stylesheet = createKeyframeStylesheet(keyframeName, keyframeRules, element);
stylesheets.push(stylesheet);
setStyleProperty(element, 'animation-duration', `${getDuration()}ms`);
setStyleProperty(element, 'animation-timing-function', getEasing());
setStyleProperty(element, 'animation-delay', `${getDelay()}ms`);
setStyleProperty(element, 'animation-fill-mode', getFill());
setStyleProperty(element, 'animation-direction', getDirection());
const iterationsCount = (getIterations() === Infinity)
? 'infinite'
: getIterations().toString();
setStyleProperty(element, 'animation-iteration-count', iterationsCount);
setStyleProperty(element, 'animation-play-state', 'paused');
if (toggleAnimationName) {
setStyleProperty(element, 'animation-name', `${stylesheet.id}-alt`);
}
raf(() => {
setStyleProperty(element, 'animation-name', stylesheet.id || null);
});
}
});
};
const initializeWebAnimation = () => {
elements.forEach(element => {
const animation = element.animate(_keyframes, {
id,
delay: getDelay(),
duration: getDuration(),
easing: getEasing(),
iterations: getIterations(),
fill: getFill(),
direction: getDirection()
});
animation.pause();
webAnimations.push(animation);
});
if (webAnimations.length > 0) {
webAnimations[0].onfinish = () => {
animationFinish();
};
}
};
const initializeAnimation = (toggleAnimationName = true) => {
beforeAnimation();
if (_keyframes.length > 0) {
if (supportsWebAnimations) {
initializeWebAnimation();
}
else {
initializeCSSAnimation(toggleAnimationName);
}
}
initialized = true;
};
const setAnimationStep = (step) => {
step = Math.min(Math.max(step, 0), 0.9999);
if (supportsWebAnimations) {
webAnimations.forEach(animation => {
animation.currentTime = animation.effect.getComputedTiming().delay + (getDuration() * step);
animation.pause();
});
}
else {
const animationDuration = `-${getDuration() * step}ms`;
elements.forEach(element => {
if (_keyframes.length > 0) {
setStyleProperty(element, 'animation-delay', animationDuration);
setStyleProperty(element, 'animation-play-state', 'paused');
}
});
}
};
const updateWebAnimation = (step) => {
webAnimations.forEach(animation => {
animation.effect.updateTiming({
delay: getDelay(),
duration: getDuration(),
easing: getEasing(),
iterations: getIterations(),
fill: getFill(),
direction: getDirection()
});
});
if (step !== undefined) {
setAnimationStep(step);
}
};
const updateCSSAnimation = (toggleAnimationName = true, step) => {
raf(() => {
elements.forEach(element => {
setStyleProperty(element, 'animation-name', keyframeName || null);
setStyleProperty(element, 'animation-duration', `${getDuration()}ms`);
setStyleProperty(element, 'animation-timing-function', getEasing());
setStyleProperty(element, 'animation-delay', (step !== undefined) ? `-${step * getDuration()}ms` : `${getDelay()}ms`);
setStyleProperty(element, 'animation-fill-mode', getFill() || null);
setStyleProperty(element, 'animation-direction', getDirection() || null);
const iterationsCount = (getIterations() === Infinity)
? 'infinite'
: getIterations().toString();
setStyleProperty(element, 'animation-iteration-count', iterationsCount);
if (toggleAnimationName) {
setStyleProperty(element, 'animation-name', `${keyframeName}-alt`);
}
raf(() => {
setStyleProperty(element, 'animation-name', keyframeName || null);
});
});
});
};
const update = (deep = false, toggleAnimationName = true, step) => {
if (deep) {
childAnimations.forEach(animation => {
animation.update(deep, toggleAnimationName, step);
});
}
if (supportsWebAnimations) {
updateWebAnimation(step);
}
else {
updateCSSAnimation(toggleAnimationName, step);
}
return ani;
};
const progressStart = (forceLinearEasing = false, step) => {
childAnimations.forEach(animation => {
animation.progressStart(forceLinearEasing, step);
});
pauseAnimation();
shouldForceLinearEasing = forceLinearEasing;
if (!initialized) {
initializeAnimation();
}
else {
update(false, true, step);
}
return ani;
};
const progressStep = (step) => {
childAnimations.forEach(animation => {
animation.progressStep(step);
});
setAnimationStep(step);
return ani;
};
const progressEnd = (playTo, step, dur) => {
shouldForceLinearEasing = false;
childAnimations.forEach(animation => {
animation.progressEnd(playTo, step, dur);
});
if (dur !== undefined) {
forceDurationValue = dur;
}
finished = false;
// tslint:disable-next-line: strict-boolean-conditions
willComplete = true;
if (playTo === 0) {
forceDirectionValue = (getDirection() === 'reverse') ? 'normal' : 'reverse';
if (forceDirectionValue === 'reverse') {
willComplete = false;
}
if (supportsWebAnimations) {
update();
setAnimationStep(1 - step);
}
else {
forceDelayValue = ((1 - step) * getDuration()) * -1;
update(false, false);
}
}
else if (playTo === 1) {
if (supportsWebAnimations) {
update();
setAnimationStep(step);
}
else {
forceDelayValue = (step * getDuration()) * -1;
update(false, false);
}
}
if (playTo !== undefined) {
onFinish(() => {
forceDurationValue = undefined;
forceDirectionValue = undefined;
forceDelayValue = undefined;
}, {
oneTimeCallback: true
});
if (!parentAnimation) {
play();
}
}
return ani;
};
const pauseAnimation = () => {
if (initialized) {
if (supportsWebAnimations) {
webAnimations.forEach(animation => {
animation.pause();
});
}
else {
elements.forEach(element => {
setStyleProperty(element, 'animation-play-state', 'paused');
});
}
}
};
const pause = () => {
childAnimations.forEach(animation => {
animation.pause();
});
pauseAnimation();
return ani;
};
const onAnimationEndFallback = () => {
cssAnimationsTimerFallback = undefined;
animationFinish();
};
const clearCSSAnimationsTimeout = () => {
if (cssAnimationsTimerFallback) {
clearTimeout(cssAnimationsTimerFallback);
}
};
const playCSSAnimations = () => {
clearCSSAnimationsTimeout();
raf(() => {
elements.forEach(element => {
if (_keyframes.length > 0) {
setStyleProperty(element, 'animation-play-state', 'running');
}
});
});
if (_keyframes.length === 0 || elements.length === 0) {
animationFinish();
}
else {
/**
* This is a catchall in the event that a CSS Animation did not finish.
* The Web Animations API has mechanisms in place for preventing this.
* CSS Animations will not fire an `animationend` event
* for elements with `display: none`. The Web Animations API
* accounts for this, but using raw CSS Animations requires
* this workaround.
*/
const animationDelay = getDelay() || 0;
const animationDuration = getDuration() || 0;
const animationIterations = getIterations() || 1;
// No need to set a timeout when animation has infinite iterations
if (isFinite(animationIterations)) {
cssAnimationsTimerFallback = setTimeout(onAnimationEndFallback, animationDelay + (animationDuration * animationIterations) + ANIMATION_END_FALLBACK_PADDING_MS);
}
animationEnd(elements[0], () => {
clearCSSAnimationsTimeout();
/**
* Ensure that clean up
* is always done a frame
* before the onFinish handlers
* are fired. Otherwise, there
* may be flickering if a new
* animation is started on the same
* element too quickly
*
* TODO: Is there a cleaner way to do this?
*/
raf(() => {
clearCSSAnimationPlayState();
raf(animationFinish);
});
});
}
};
const clearCSSAnimationPlayState = () => {
elements.forEach(element => {
removeStyleProperty(element, 'animation-duration');
removeStyleProperty(element, 'animation-delay');
removeStyleProperty(element, 'animation-play-state');
});
};
const playWebAnimations = () => {
webAnimations.forEach(animation => {
animation.play();
});
if (_keyframes.length === 0 || elements.length === 0) {
animationFinish();
}
};
const resetAnimation = () => {
if (supportsWebAnimations) {
setAnimationStep(0);
updateWebAnimation();
}
else {
updateCSSAnimation();
}
};
const play = (opts) => {
return new Promise(resolve => {
if (opts && opts.sync) {
shouldForceSyncPlayback = true;
onFinish(() => shouldForceSyncPlayback = false, { oneTimeCallback: true });
}
if (!initialized) {
initializeAnimation();
}
if (finished) {
resetAnimation();
finished = false;
}
if (shouldCalculateNumAnimations) {
numAnimationsRunning = childAnimations.length + 1;
shouldCalculateNumAnimations = false;
}
onFinish(() => resolve(), { oneTimeCallback: true });
childAnimations.forEach(animation => {
animation.play();
});
if (supportsWebAnimations) {
playWebAnimations();
}
else {
playCSSAnimations();
}
});
};
const stop = () => {
childAnimations.forEach(animation => {
animation.stop();
});
if (initialized) {
cleanUpElements();
initialized = false;
}
resetFlags();
};
const from = (property, value) => {
const firstFrame = _keyframes[0];
if (firstFrame !== undefined && (firstFrame.offset === undefined || firstFrame.offset === 0)) {
firstFrame[property] = value;
}
else {
_keyframes = [
{ offset: 0, [property]: value },
..._keyframes
];
}
return ani;
};
const to = (property, value) => {
const lastFrame = _keyframes[_keyframes.length - 1];
if (lastFrame !== undefined && (lastFrame.offset === undefined || lastFrame.offset === 1)) {
lastFrame[property] = value;
}
else {
_keyframes = [
..._keyframes,
{ offset: 1, [property]: value }
];
}
return ani;
};
const fromTo = (property, fromValue, toValue) => {
return from(property, fromValue).to(property, toValue);
};
return ani = {
parentAnimation,
elements,
childAnimations,
id,
animationFinish,
from,
to,
fromTo,
parent,
play,
pause,
stop,
destroy,
keyframes,
addAnimation,
addElement,
update,
fill,
direction,
iterations,
duration,
easing,
delay,
getWebAnimations,
getKeyframes,
getFill,
getDirection,
getDelay,
getIterations,
getEasing,
getDuration,
afterAddRead,
afterAddWrite,
afterClearStyles,
afterStyles,
afterRemoveClass,
afterAddClass,
beforeAddRead,
beforeAddWrite,
beforeClearStyles,
beforeStyles,
beforeRemoveClass,
beforeAddClass,
onFinish,
progressStart,
progressStep,
progressEnd
};
};
/**
* iOS Action Sheet Enter Animation
*/
const iosEnterAnimation$6 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
.beforeStyles({
'pointer-events': 'none'
})
.afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.action-sheet-wrapper'))
.fromTo('transform', 'translateY(100%)', 'translateY(0%)');
return baseAnimation
.addElement(baseEl)
.easing('cubic-bezier(.36,.66,.04,1)')
.duration(400)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* iOS Action Sheet Leave Animation
*/
const iosLeaveAnimation$6 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 'var(--backdrop-opacity)', 0);
wrapperAnimation
.addElement(baseEl.querySelector('.action-sheet-wrapper'))
.fromTo('transform', 'translateY(0%)', 'translateY(100%)');
return baseAnimation
.addElement(baseEl)
.easing('cubic-bezier(.36,.66,.04,1)')
.duration(450)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* MD Action Sheet Enter Animation
*/
const mdEnterAnimation$5 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
.beforeStyles({
'pointer-events': 'none'
})
.afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.action-sheet-wrapper'))
.fromTo('transform', 'translateY(100%)', 'translateY(0%)');
return baseAnimation
.addElement(baseEl)
.easing('cubic-bezier(.36,.66,.04,1)')
.duration(400)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* MD Action Sheet Leave Animation
*/
const mdLeaveAnimation$5 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 'var(--backdrop-opacity)', 0);
wrapperAnimation
.addElement(baseEl.querySelector('.action-sheet-wrapper'))
.fromTo('transform', 'translateY(0%)', 'translateY(100%)');
return baseAnimation
.addElement(baseEl)
.easing('cubic-bezier(.36,.66,.04,1)')
.duration(450)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
const actionSheetIosCss = ".sc-ion-action-sheet-ios-h{--color:initial;--button-color-activated:var(--button-color);--button-color-focused:var(--button-color);--button-color-hover:var(--button-color);--button-color-selected:var(--button-color);--min-width:auto;--width:100%;--max-width:500px;--min-height:auto;--height:100%;--max-height:calc(100% - (var(--ion-safe-area-top) + var(--ion-safe-area-bottom)));-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;left:0;right:0;top:0;bottom:0;display:block;position:fixed;outline:none;font-family:var(--ion-font-family, inherit);-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1001}.overlay-hidden.sc-ion-action-sheet-ios-h{display:none}.action-sheet-wrapper.sc-ion-action-sheet-ios{left:0;right:0;bottom:0;margin-left:auto;margin-right:auto;margin-top:auto;margin-bottom:auto;-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0);display:block;position:absolute;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);z-index:10;pointer-events:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.action-sheet-wrapper.sc-ion-action-sheet-ios{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}.action-sheet-button.sc-ion-action-sheet-ios{display:block;position:relative;width:100%;border:0;outline:none;background:var(--button-background);color:var(--button-color);font-family:inherit;overflow:hidden}.action-sheet-button-inner.sc-ion-action-sheet-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;pointer-events:none;width:100%;height:100%;z-index:1}.action-sheet-container.sc-ion-action-sheet-ios{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:end;justify-content:flex-end;height:100%;max-height:100%}.action-sheet-group.sc-ion-action-sheet-ios{-ms-flex-negative:2;flex-shrink:2;overscroll-behavior-y:contain;overflow-y:auto;-webkit-overflow-scrolling:touch;pointer-events:all;background:var(--background)}.action-sheet-group.sc-ion-action-sheet-ios::-webkit-scrollbar{display:none}.action-sheet-group-cancel.sc-ion-action-sheet-ios{-ms-flex-negative:0;flex-shrink:0;overflow:hidden}.action-sheet-button.sc-ion-action-sheet-ios::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}.action-sheet-selected.sc-ion-action-sheet-ios{color:var(--button-color-selected)}.action-sheet-selected.sc-ion-action-sheet-ios::after{background:var(--button-background-selected);opacity:var(--button-background-selected-opacity)}.action-sheet-button.ion-activated.sc-ion-action-sheet-ios{color:var(--button-color-activated)}.action-sheet-button.ion-activated.sc-ion-action-sheet-ios::after{background:var(--button-background-activated);opacity:var(--button-background-activated-opacity)}.action-sheet-button.ion-focused.sc-ion-action-sheet-ios{color:var(--button-color-focused)}.action-sheet-button.ion-focused.sc-ion-action-sheet-ios::after{background:var(--button-background-focused);opacity:var(--button-background-focused-opacity)}@media (any-hover: hover){.action-sheet-button.sc-ion-action-sheet-ios:hover{color:var(--button-color-hover)}.action-sheet-button.sc-ion-action-sheet-ios:hover::after{background:var(--button-background-hover);opacity:var(--button-background-hover-opacity)}}.sc-ion-action-sheet-ios-h{--background:var(--ion-overlay-background-color, var(--ion-color-step-100, #f9f9f9));--backdrop-opacity:var(--ion-backdrop-opacity, 0.4);--button-background:linear-gradient(0deg, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08), rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08) 50%, transparent 50%) bottom/100% 1px no-repeat transparent;--button-background-activated:var(--ion-text-color, #000);--button-background-activated-opacity:.08;--button-background-hover:currentColor;--button-background-hover-opacity:.04;--button-background-focused:currentColor;--button-background-focused-opacity:.12;--button-background-selected:var(--ion-color-step-150, var(--ion-background-color, #fff));--button-background-selected-opacity:1;--button-color:var(--ion-color-primary, #3880ff);--color:var(--ion-color-step-400, #999999);text-align:center}.action-sheet-wrapper.sc-ion-action-sheet-ios{margin-left:auto;margin-right:auto;margin-top:var(--ion-safe-area-top, 0);margin-bottom:var(--ion-safe-area-bottom, 0)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.action-sheet-wrapper.sc-ion-action-sheet-ios{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}.action-sheet-container.sc-ion-action-sheet-ios{padding-left:8px;padding-right:8px;padding-top:0;padding-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.action-sheet-container.sc-ion-action-sheet-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px}}.action-sheet-group.sc-ion-action-sheet-ios{border-radius:13px;margin-bottom:8px}.action-sheet-group.sc-ion-action-sheet-ios:first-child{margin-top:10px}.action-sheet-group.sc-ion-action-sheet-ios:last-child{margin-bottom:10px}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){.action-sheet-translucent.sc-ion-action-sheet-ios-h .action-sheet-group.sc-ion-action-sheet-ios{background-color:transparent;-webkit-backdrop-filter:saturate(280%) blur(20px);backdrop-filter:saturate(280%) blur(20px)}.action-sheet-translucent.sc-ion-action-sheet-ios-h .action-sheet-title.sc-ion-action-sheet-ios,.action-sheet-translucent.sc-ion-action-sheet-ios-h .action-sheet-button.sc-ion-action-sheet-ios{background-color:transparent;background-image:-webkit-gradient(linear, left bottom, left top, from(rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8)), to(rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8))), -webkit-gradient(linear, left bottom, left top, from(rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.4)), color-stop(50%, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.4)), color-stop(50%, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8)));background-image:linear-gradient(0deg, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8), rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8) 100%), linear-gradient(0deg, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.4), rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.4) 50%, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8) 50%);background-repeat:no-repeat;background-position:top, bottom;background-size:100% calc(100% - 1px), 100% 1px;-webkit-backdrop-filter:saturate(120%);backdrop-filter:saturate(120%)}.action-sheet-translucent.sc-ion-action-sheet-ios-h .action-sheet-button.ion-activated.sc-ion-action-sheet-ios{background-color:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.7);background-image:none}.action-sheet-translucent.sc-ion-action-sheet-ios-h .action-sheet-cancel.sc-ion-action-sheet-ios{background:var(--button-background-selected)}}.action-sheet-title.sc-ion-action-sheet-ios{background:-webkit-gradient(linear, left bottom, left top, from(rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08)), color-stop(50%, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08)), color-stop(50%, transparent)) bottom/100% 1px no-repeat transparent;background:linear-gradient(0deg, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08), rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08) 50%, transparent 50%) bottom/100% 1px no-repeat transparent}.action-sheet-title.sc-ion-action-sheet-ios{padding-left:10px;padding-right:10px;padding-top:14px;padding-bottom:13px;color:var(--color, var(--ion-color-step-400, #999999));font-size:13px;font-weight:400;text-align:center}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.action-sheet-title.sc-ion-action-sheet-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px}}.action-sheet-title.action-sheet-has-sub-title.sc-ion-action-sheet-ios{font-weight:600}.action-sheet-sub-title.sc-ion-action-sheet-ios{padding-left:0;padding-right:0;padding-top:6px;padding-bottom:0;font-size:13px;font-weight:400}.action-sheet-button.sc-ion-action-sheet-ios{padding-left:18px;padding-right:18px;padding-top:18px;padding-bottom:18px;height:56px;font-size:20px;contain:strict}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.action-sheet-button.sc-ion-action-sheet-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:18px;padding-inline-start:18px;-webkit-padding-end:18px;padding-inline-end:18px}}.action-sheet-button.sc-ion-action-sheet-ios .action-sheet-icon.sc-ion-action-sheet-ios{margin-right:0.3em;font-size:28px;pointer-events:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.action-sheet-button.sc-ion-action-sheet-ios .action-sheet-icon.sc-ion-action-sheet-ios{margin-right:unset;-webkit-margin-end:0.3em;margin-inline-end:0.3em}}.action-sheet-button.sc-ion-action-sheet-ios:last-child{background-image:none}.action-sheet-selected.sc-ion-action-sheet-ios{font-weight:bold}.action-sheet-cancel.sc-ion-action-sheet-ios{font-weight:600}.action-sheet-cancel.sc-ion-action-sheet-ios::after{background:var(--button-background-selected);opacity:var(--button-background-selected-opacity)}.action-sheet-destructive.sc-ion-action-sheet-ios,.action-sheet-destructive.ion-activated.sc-ion-action-sheet-ios,.action-sheet-destructive.ion-focused.sc-ion-action-sheet-ios{color:var(--ion-color-danger, #eb445a)}@media (any-hover: hover){.action-sheet-destructive.sc-ion-action-sheet-ios:hover{color:var(--ion-color-danger, #eb445a)}}";
const actionSheetMdCss = ".sc-ion-action-sheet-md-h{--color:initial;--button-color-activated:var(--button-color);--button-color-focused:var(--button-color);--button-color-hover:var(--button-color);--button-color-selected:var(--button-color);--min-width:auto;--width:100%;--max-width:500px;--min-height:auto;--height:100%;--max-height:calc(100% - (var(--ion-safe-area-top) + var(--ion-safe-area-bottom)));-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;left:0;right:0;top:0;bottom:0;display:block;position:fixed;outline:none;font-family:var(--ion-font-family, inherit);-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1001}.overlay-hidden.sc-ion-action-sheet-md-h{display:none}.action-sheet-wrapper.sc-ion-action-sheet-md{left:0;right:0;bottom:0;margin-left:auto;margin-right:auto;margin-top:auto;margin-bottom:auto;-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0);display:block;position:absolute;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);z-index:10;pointer-events:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.action-sheet-wrapper.sc-ion-action-sheet-md{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}.action-sheet-button.sc-ion-action-sheet-md{display:block;position:relative;width:100%;border:0;outline:none;background:var(--button-background);color:var(--button-color);font-family:inherit;overflow:hidden}.action-sheet-button-inner.sc-ion-action-sheet-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;pointer-events:none;width:100%;height:100%;z-index:1}.action-sheet-container.sc-ion-action-sheet-md{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:end;justify-content:flex-end;height:100%;max-height:100%}.action-sheet-group.sc-ion-action-sheet-md{-ms-flex-negative:2;flex-shrink:2;overscroll-behavior-y:contain;overflow-y:auto;-webkit-overflow-scrolling:touch;pointer-events:all;background:var(--background)}.action-sheet-group.sc-ion-action-sheet-md::-webkit-scrollbar{display:none}.action-sheet-group-cancel.sc-ion-action-sheet-md{-ms-flex-negative:0;flex-shrink:0;overflow:hidden}.action-sheet-button.sc-ion-action-sheet-md::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}.action-sheet-selected.sc-ion-action-sheet-md{color:var(--button-color-selected)}.action-sheet-selected.sc-ion-action-sheet-md::after{background:var(--button-background-selected);opacity:var(--button-background-selected-opacity)}.action-sheet-button.ion-activated.sc-ion-action-sheet-md{color:var(--button-color-activated)}.action-sheet-button.ion-activated.sc-ion-action-sheet-md::after{background:var(--button-background-activated);opacity:var(--button-background-activated-opacity)}.action-sheet-button.ion-focused.sc-ion-action-sheet-md{color:var(--button-color-focused)}.action-sheet-button.ion-focused.sc-ion-action-sheet-md::after{background:var(--button-background-focused);opacity:var(--button-background-focused-opacity)}@media (any-hover: hover){.action-sheet-button.sc-ion-action-sheet-md:hover{color:var(--button-color-hover)}.action-sheet-button.sc-ion-action-sheet-md:hover::after{background:var(--button-background-hover);opacity:var(--button-background-hover-opacity)}}.sc-ion-action-sheet-md-h{--background:var(--ion-overlay-background-color, var(--ion-background-color, #fff));--backdrop-opacity:var(--ion-backdrop-opacity, 0.32);--button-background:transparent;--button-background-selected:currentColor;--button-background-selected-opacity:0;--button-background-activated:transparent;--button-background-activated-opacity:0;--button-background-hover:currentColor;--button-background-hover-opacity:.04;--button-background-focused:currentColor;--button-background-focused-opacity:.12;--button-color:var(--ion-color-step-850, #262626);--color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54)}.action-sheet-title.sc-ion-action-sheet-md{padding-left:16px;padding-right:16px;padding-top:20px;padding-bottom:17px;min-height:60px;color:var(--color, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54));font-size:16px;text-align:start}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.action-sheet-title.sc-ion-action-sheet-md{padding-left:unset;padding-right:unset;-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px}}.action-sheet-sub-title.sc-ion-action-sheet-md{padding-left:0;padding-right:0;padding-top:16px;padding-bottom:0;font-size:14px}.action-sheet-group.sc-ion-action-sheet-md:first-child{padding-top:0}.action-sheet-group.sc-ion-action-sheet-md:last-child{padding-bottom:0}.action-sheet-button.sc-ion-action-sheet-md{padding-left:16px;padding-right:16px;padding-top:0;padding-bottom:0;position:relative;height:52px;font-size:16px;text-align:start;contain:strict;overflow:hidden}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.action-sheet-button.sc-ion-action-sheet-md{padding-left:unset;padding-right:unset;-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px}}.action-sheet-icon.sc-ion-action-sheet-md{padding-bottom:4px;margin-left:0;margin-right:32px;margin-top:0;margin-bottom:0;color:var(--color);font-size:24px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.action-sheet-icon.sc-ion-action-sheet-md{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:32px;margin-inline-end:32px}}.action-sheet-button-inner.sc-ion-action-sheet-md{-ms-flex-pack:start;justify-content:flex-start}.action-sheet-selected.sc-ion-action-sheet-md{font-weight:bold}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class ActionSheet {
constructor(hostRef) {
registerInstance(this, hostRef);
this.didPresent = createEvent(this, "ionActionSheetDidPresent", 7);
this.willPresent = createEvent(this, "ionActionSheetWillPresent", 7);
this.willDismiss = createEvent(this, "ionActionSheetWillDismiss", 7);
this.didDismiss = createEvent(this, "ionActionSheetDidDismiss", 7);
this.presented = false;
/**
* If `true`, the keyboard will be automatically dismissed when the overlay is presented.
*/
this.keyboardClose = true;
/**
* An array of buttons for the action sheet.
*/
this.buttons = [];
/**
* If `true`, the action sheet will be dismissed when the backdrop is clicked.
*/
this.backdropDismiss = true;
/**
* If `true`, the action sheet will be translucent.
* Only applies when the mode is `"ios"` and the device supports
* [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
*/
this.translucent = false;
/**
* If `true`, the action sheet will animate.
*/
this.animated = true;
this.onBackdropTap = () => {
this.dismiss(undefined, BACKDROP);
};
this.dispatchCancelHandler = (ev) => {
const role = ev.detail.role;
if (isCancel(role)) {
const cancelButton = this.getButtons().find(b => b.role === 'cancel');
this.callButtonHandler(cancelButton);
}
};
}
/**
* Present the action sheet overlay after it has been created.
*/
present() {
return present(this, 'actionSheetEnter', iosEnterAnimation$6, mdEnterAnimation$5);
}
connectedCallback() {
prepareOverlay(this.el);
}
/**
* Dismiss the action sheet overlay after it has been presented.
*
* @param data Any data to emit in the dismiss events.
* @param role The role of the element that is dismissing the action sheet.
* This can be useful in a button handler for determining which button was
* clicked to dismiss the action sheet.
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
*/
dismiss(data, role) {
return dismiss(this, data, role, 'actionSheetLeave', iosLeaveAnimation$6, mdLeaveAnimation$5);
}
/**
* Returns a promise that resolves when the action sheet did dismiss.
*/
onDidDismiss() {
return eventMethod(this.el, 'ionActionSheetDidDismiss');
}
/**
* Returns a promise that resolves when the action sheet will dismiss.
*
*/
onWillDismiss() {
return eventMethod(this.el, 'ionActionSheetWillDismiss');
}
async buttonClick(button) {
const role = button.role;
if (isCancel(role)) {
return this.dismiss(undefined, role);
}
const shouldDismiss = await this.callButtonHandler(button);
if (shouldDismiss) {
return this.dismiss(undefined, button.role);
}
return Promise.resolve();
}
async callButtonHandler(button) {
if (button) {
// a handler has been provided, execute it
// pass the handler the values from the inputs
const rtn = await safeCall(button.handler);
if (rtn === false) {
// if the return value of the handler is false then do not dismiss
return false;
}
}
return true;
}
getButtons() {
return this.buttons.map(b => {
return (typeof b === 'string')
? { text: b }
: b;
});
}
disconnectedCallback() {
if (this.gesture) {
this.gesture.destroy();
this.gesture = undefined;
}
}
componentDidLoad() {
/**
* Do not create gesture if:
* 1. A gesture already exists
* 2. App is running in MD mode
* 3. A wrapper ref does not exist
*/
const { groupEl, wrapperEl } = this;
if (this.gesture || getIonMode$1(this) === 'md' || !wrapperEl || !groupEl) {
return;
}
readTask(() => {
const isScrollable = groupEl.scrollHeight > groupEl.clientHeight;
if (!isScrollable) {
this.gesture = createButtonActiveGesture(wrapperEl, (refEl) => refEl.classList.contains('action-sheet-button'));
this.gesture.enable(true);
}
});
}
render() {
const mode = getIonMode$1(this);
const allButtons = this.getButtons();
const cancelButton = allButtons.find(b => b.role === 'cancel');
const buttons = allButtons.filter(b => b.role !== 'cancel');
return (hAsync(Host, { role: "dialog", "aria-modal": "true", tabindex: "-1", style: {
zIndex: `${20000 + this.overlayIndex}`,
}, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }, hAsync("ion-backdrop", { tappable: this.backdropDismiss }), hAsync("div", { tabindex: "0" }), hAsync("div", { class: "action-sheet-wrapper ion-overlay-wrapper", role: "dialog", ref: el => this.wrapperEl = el }, hAsync("div", { class: "action-sheet-container" }, hAsync("div", { class: "action-sheet-group", ref: el => this.groupEl = el }, this.header !== undefined &&
hAsync("div", { class: {
'action-sheet-title': true,
'action-sheet-has-sub-title': this.subHeader !== undefined
} }, this.header, this.subHeader && hAsync("div", { class: "action-sheet-sub-title" }, this.subHeader)), buttons.map(b => hAsync("button", { type: "button", class: buttonClass$3(b), onClick: () => this.buttonClick(b) }, hAsync("span", { class: "action-sheet-button-inner" }, b.icon && hAsync("ion-icon", { icon: b.icon, lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && hAsync("ion-ripple-effect", null)))), cancelButton &&
hAsync("div", { class: "action-sheet-group action-sheet-group-cancel" }, hAsync("button", { type: "button", class: buttonClass$3(cancelButton), onClick: () => this.buttonClick(cancelButton) }, hAsync("span", { class: "action-sheet-button-inner" }, cancelButton.icon &&
hAsync("ion-icon", { icon: cancelButton.icon, lazy: false, class: "action-sheet-icon" }), cancelButton.text), mode === 'md' && hAsync("ion-ripple-effect", null))))), hAsync("div", { tabindex: "0" })));
}
get el() { return getElement(this); }
static get style() { return {
ios: actionSheetIosCss,
md: actionSheetMdCss
}; }
static get cmpMeta() { return {
"$flags$": 34,
"$tagName$": "ion-action-sheet",
"$members$": {
"overlayIndex": [2, "overlay-index"],
"keyboardClose": [4, "keyboard-close"],
"enterAnimation": [16],
"leaveAnimation": [16],
"buttons": [16],
"cssClass": [1, "css-class"],
"backdropDismiss": [4, "backdrop-dismiss"],
"header": [1],
"subHeader": [1, "sub-header"],
"translucent": [4],
"animated": [4],
"present": [64],
"dismiss": [64],
"onDidDismiss": [64],
"onWillDismiss": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const buttonClass$3 = (button) => {
return Object.assign({ 'action-sheet-button': true, 'ion-activatable': true, 'ion-focusable': true, [`action-sheet-${button.role}`]: button.role !== undefined }, getClassMap(button.cssClass));
};
/**
* Does a simple sanitization of all elements
* in an untrusted string
*/
const sanitizeDOMString = (untrustedString) => {
try {
if (untrustedString instanceof IonicSafeString) {
return untrustedString.value;
}
if (!isSanitizerEnabled() || typeof untrustedString !== 'string' || untrustedString === '') {
return untrustedString;
}
/**
* Create a document fragment
* separate from the main DOM,
* create a div to do our work in
*/
const documentFragment = document.createDocumentFragment();
const workingDiv = document.createElement('div');
documentFragment.appendChild(workingDiv);
workingDiv.innerHTML = untrustedString;
/**
* Remove any elements
* that are blocked
*/
blockedTags.forEach(blockedTag => {
const getElementsToRemove = documentFragment.querySelectorAll(blockedTag);
for (let elementIndex = getElementsToRemove.length - 1; elementIndex >= 0; elementIndex--) {
const element = getElementsToRemove[elementIndex];
if (element.parentNode) {
element.parentNode.removeChild(element);
}
else {
documentFragment.removeChild(element);
}
/**
* We still need to sanitize
* the children of this element
* as they are left behind
*/
const childElements = getElementChildren(element);
/* tslint:disable-next-line */
for (let childIndex = 0; childIndex < childElements.length; childIndex++) {
sanitizeElement(childElements[childIndex]);
}
}
});
/**
* Go through remaining elements and remove
* non-allowed attribs
*/
// IE does not support .children on document fragments, only .childNodes
const dfChildren = getElementChildren(documentFragment);
/* tslint:disable-next-line */
for (let childIndex = 0; childIndex < dfChildren.length; childIndex++) {
sanitizeElement(dfChildren[childIndex]);
}
// Append document fragment to div
const fragmentDiv = document.createElement('div');
fragmentDiv.appendChild(documentFragment);
// First child is always the div we did our work in
const getInnerDiv = fragmentDiv.querySelector('div');
return (getInnerDiv !== null) ? getInnerDiv.innerHTML : fragmentDiv.innerHTML;
}
catch (err) {
console.error(err);
return '';
}
};
/**
* Clean up current element based on allowed attributes
* and then recursively dig down into any child elements to
* clean those up as well
*/
const sanitizeElement = (element) => {
// IE uses childNodes, so ignore nodes that are not elements
if (element.nodeType && element.nodeType !== 1) {
return;
}
for (let i = element.attributes.length - 1; i >= 0; i--) {
const attribute = element.attributes.item(i);
const attributeName = attribute.name;
// remove non-allowed attribs
if (!allowedAttributes.includes(attributeName.toLowerCase())) {
element.removeAttribute(attributeName);
continue;
}
// clean up any allowed attribs
// that attempt to do any JS funny-business
const attributeValue = attribute.value;
/* tslint:disable-next-line */
if (attributeValue != null && attributeValue.toLowerCase().includes('javascript:')) {
element.removeAttribute(attributeName);
}
}
/**
* Sanitize any nested children
*/
const childElements = getElementChildren(element);
/* tslint:disable-next-line */
for (let i = 0; i < childElements.length; i++) {
sanitizeElement(childElements[i]);
}
};
/**
* IE doesn't always support .children
* so we revert to .childNodes instead
*/
const getElementChildren = (el) => {
return (el.children != null) ? el.children : el.childNodes;
};
const isSanitizerEnabled = () => {
const win = window;
const config = win && win.Ionic && win.Ionic.config;
if (config) {
if (config.get) {
return config.get('sanitizerEnabled', true);
}
else {
return config.sanitizerEnabled === true || config.sanitizerEnabled === undefined;
}
}
return true;
};
const allowedAttributes = ['class', 'id', 'href', 'src', 'name', 'slot'];
const blockedTags = ['script', 'style', 'iframe', 'meta', 'link', 'object', 'embed'];
class IonicSafeString {
constructor(value) {
this.value = value;
}
}
/**
* iOS Alert Enter Animation
*/
const iosEnterAnimation$5 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
.beforeStyles({
'pointer-events': 'none'
})
.afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.alert-wrapper'))
.keyframes([
{ offset: 0, opacity: '0.01', transform: 'scale(1.1)' },
{ offset: 1, opacity: '1', transform: 'scale(1)' }
]);
return baseAnimation
.addElement(baseEl)
.easing('ease-in-out')
.duration(200)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* iOS Alert Leave Animation
*/
const iosLeaveAnimation$5 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 'var(--backdrop-opacity)', 0);
wrapperAnimation
.addElement(baseEl.querySelector('.alert-wrapper'))
.keyframes([
{ offset: 0, opacity: 0.99, transform: 'scale(1)' },
{ offset: 1, opacity: 0, transform: 'scale(0.9)' }
]);
return baseAnimation
.addElement(baseEl)
.easing('ease-in-out')
.duration(200)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* Md Alert Enter Animation
*/
const mdEnterAnimation$4 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
.beforeStyles({
'pointer-events': 'none'
})
.afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.alert-wrapper'))
.keyframes([
{ offset: 0, opacity: '0.01', transform: 'scale(0.9)' },
{ offset: 1, opacity: '1', transform: 'scale(1)' }
]);
return baseAnimation
.addElement(baseEl)
.easing('ease-in-out')
.duration(150)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* Md Alert Leave Animation
*/
const mdLeaveAnimation$4 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 'var(--backdrop-opacity)', 0);
wrapperAnimation
.addElement(baseEl.querySelector('.alert-wrapper'))
.fromTo('opacity', 0.99, 0);
return baseAnimation
.addElement(baseEl)
.easing('ease-in-out')
.duration(150)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
const alertIosCss = ".sc-ion-alert-ios-h{--min-width:250px;--width:auto;--min-height:auto;--height:auto;--max-height:90%;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;font-family:var(--ion-font-family, inherit);contain:strict;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1001}.overlay-hidden.sc-ion-alert-ios-h{display:none}.alert-top.sc-ion-alert-ios-h{padding-top:50px;-ms-flex-align:start;align-items:flex-start}.alert-wrapper.sc-ion-alert-ios{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);contain:content;opacity:0;z-index:10}.alert-title.sc-ion-alert-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}.alert-sub-title.sc-ion-alert-ios{margin-left:0;margin-right:0;margin-top:5px;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-weight:normal}.alert-message.sc-ion-alert-ios{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-overflow-scrolling:touch;overflow-y:auto;overscroll-behavior-y:contain}.alert-checkbox-group.sc-ion-alert-ios::-webkit-scrollbar,.alert-radio-group.sc-ion-alert-ios::-webkit-scrollbar,.alert-message.sc-ion-alert-ios::-webkit-scrollbar{display:none}.alert-input.sc-ion-alert-ios{padding-left:0;padding-right:0;padding-top:10px;padding-bottom:10px;width:100%;border:0;background:inherit;font:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}.alert-button-group.sc-ion-alert-ios{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;width:100%}.alert-button-group-vertical.sc-ion-alert-ios{-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.alert-button.sc-ion-alert-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;border:0;font-size:14px;line-height:20px;z-index:0}.alert-button.ion-focused.sc-ion-alert-ios,.alert-tappable.ion-focused.sc-ion-alert-ios{background:var(--ion-color-step-100, #e6e6e6)}.alert-button-inner.sc-ion-alert-ios{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%}.alert-input-disabled.sc-ion-alert-ios,.alert-checkbox-button-disabled.sc-ion-alert-ios .alert-button-inner.sc-ion-alert-ios,.alert-radio-button-disabled.sc-ion-alert-ios .alert-button-inner.sc-ion-alert-ios{cursor:default;opacity:0.5;pointer-events:none}.alert-tappable.sc-ion-alert-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:-ms-flexbox;display:flex;width:100%;border:0;background:transparent;font-size:inherit;line-height:initial;text-align:start;-webkit-appearance:none;-moz-appearance:none;appearance:none;contain:strict}.alert-button.sc-ion-alert-ios,.alert-checkbox.sc-ion-alert-ios,.alert-input.sc-ion-alert-ios,.alert-radio.sc-ion-alert-ios{outline:none}.alert-radio-icon.sc-ion-alert-ios,.alert-checkbox-icon.sc-ion-alert-ios,.alert-checkbox-inner.sc-ion-alert-ios{-webkit-box-sizing:border-box;box-sizing:border-box}textarea.alert-input.sc-ion-alert-ios{min-height:37px;resize:none}.sc-ion-alert-ios-h{--background:var(--ion-overlay-background-color, var(--ion-color-step-100, #f9f9f9));--max-width:270px;--backdrop-opacity:var(--ion-backdrop-opacity, 0.3);font-size:14px}.alert-wrapper.sc-ion-alert-ios{border-radius:13px;-webkit-box-shadow:none;box-shadow:none;overflow:hidden}.alert-button.sc-ion-alert-ios .alert-button-inner.sc-ion-alert-ios{pointer-events:none}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){.alert-translucent.sc-ion-alert-ios-h .alert-wrapper.sc-ion-alert-ios{background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.9);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}}.alert-head.sc-ion-alert-ios{padding-left:16px;padding-right:16px;padding-top:12px;padding-bottom:7px;text-align:center}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-head.sc-ion-alert-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px}}.alert-title.sc-ion-alert-ios{margin-top:8px;color:var(--ion-text-color, #000);font-size:17px;font-weight:600}.alert-sub-title.sc-ion-alert-ios{color:var(--ion-color-step-600, #666666);font-size:14px}.alert-message.sc-ion-alert-ios,.alert-input-group.sc-ion-alert-ios{padding-left:16px;padding-right:16px;padding-top:0;padding-bottom:21px;color:var(--ion-text-color, #000);font-size:13px;text-align:center}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-message.sc-ion-alert-ios,.alert-input-group.sc-ion-alert-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px}}.alert-message.sc-ion-alert-ios{max-height:240px}.alert-message.sc-ion-alert-ios:empty{padding-left:0;padding-right:0;padding-top:0;padding-bottom:12px}.alert-input.sc-ion-alert-ios{border-radius:4px;margin-top:10px;padding-left:6px;padding-right:6px;padding-top:6px;padding-bottom:6px;border:0.55px solid var(--ion-color-step-250, #bfbfbf);background-color:var(--ion-background-color, #fff);-webkit-appearance:none;-moz-appearance:none;appearance:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-input.sc-ion-alert-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:6px;padding-inline-start:6px;-webkit-padding-end:6px;padding-inline-end:6px}}.alert-input.sc-ion-alert-ios::-webkit-input-placeholder{color:var(--ion-placeholder-color, var(--ion-color-step-400, #999999));font-family:inherit;font-weight:inherit}.alert-input.sc-ion-alert-ios::-moz-placeholder{color:var(--ion-placeholder-color, var(--ion-color-step-400, #999999));font-family:inherit;font-weight:inherit}.alert-input.sc-ion-alert-ios:-ms-input-placeholder{color:var(--ion-placeholder-color, var(--ion-color-step-400, #999999));font-family:inherit;font-weight:inherit}.alert-input.sc-ion-alert-ios::-ms-input-placeholder{color:var(--ion-placeholder-color, var(--ion-color-step-400, #999999));font-family:inherit;font-weight:inherit}.alert-input.sc-ion-alert-ios::placeholder{color:var(--ion-placeholder-color, var(--ion-color-step-400, #999999));font-family:inherit;font-weight:inherit}.alert-input.sc-ion-alert-ios::-ms-clear{display:none}.alert-radio-group.sc-ion-alert-ios,.alert-checkbox-group.sc-ion-alert-ios{-ms-scroll-chaining:none;overscroll-behavior:contain;max-height:240px;border-top:0.55px solid rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.2);overflow-y:auto;-webkit-overflow-scrolling:touch}.alert-tappable.sc-ion-alert-ios{height:44px}.alert-radio-label.sc-ion-alert-ios{padding-left:13px;padding-right:13px;padding-top:13px;padding-bottom:13px;-ms-flex:1;flex:1;-ms-flex-order:0;order:0;color:var(--ion-text-color, #000);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-radio-label.sc-ion-alert-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:13px;padding-inline-start:13px;-webkit-padding-end:13px;padding-inline-end:13px}}[aria-checked=true].sc-ion-alert-ios .alert-radio-label.sc-ion-alert-ios{color:var(--ion-color-primary, #3880ff)}.alert-radio-icon.sc-ion-alert-ios{position:relative;-ms-flex-order:1;order:1;min-width:30px}[aria-checked=true].sc-ion-alert-ios .alert-radio-inner.sc-ion-alert-ios{left:7px;top:-7px;position:absolute;width:6px;height:12px;-webkit-transform:rotate(45deg);transform:rotate(45deg);border-width:2px;border-top-width:0;border-left-width:0;border-style:solid;border-color:var(--ion-color-primary, #3880ff)}[dir=rtl].sc-ion-alert-ios [aria-checked=true].sc-ion-alert-ios .alert-radio-inner.sc-ion-alert-ios,[dir=rtl].sc-ion-alert-ios-h [aria-checked=true].sc-ion-alert-ios .alert-radio-inner.sc-ion-alert-ios,[dir=rtl] .sc-ion-alert-ios-h [aria-checked=true].sc-ion-alert-ios .alert-radio-inner.sc-ion-alert-ios{left:unset;right:unset;right:7px}.alert-checkbox-label.sc-ion-alert-ios{padding-left:13px;padding-right:13px;padding-top:13px;padding-bottom:13px;-ms-flex:1;flex:1;color:var(--ion-text-color, #000);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-checkbox-label.sc-ion-alert-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:13px;padding-inline-start:13px;-webkit-padding-end:13px;padding-inline-end:13px}}.alert-checkbox-icon.sc-ion-alert-ios{border-radius:50%;margin-left:16px;margin-right:6px;margin-top:10px;margin-bottom:10px;position:relative;width:24px;height:24px;border-width:1px;border-style:solid;border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, #c8c7cc)));background-color:var(--ion-item-background, var(--ion-background-color, #fff));contain:strict}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-checkbox-icon.sc-ion-alert-ios{margin-left:unset;margin-right:unset;-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:6px;margin-inline-end:6px}}[aria-checked=true].sc-ion-alert-ios .alert-checkbox-icon.sc-ion-alert-ios{border-color:var(--ion-color-primary, #3880ff);background-color:var(--ion-color-primary, #3880ff)}[aria-checked=true].sc-ion-alert-ios .alert-checkbox-inner.sc-ion-alert-ios{left:9px;top:4px;position:absolute;width:5px;height:12px;-webkit-transform:rotate(45deg);transform:rotate(45deg);border-width:1px;border-top-width:0;border-left-width:0;border-style:solid;border-color:var(--ion-background-color, #fff)}[dir=rtl].sc-ion-alert-ios [aria-checked=true].sc-ion-alert-ios .alert-checkbox-inner.sc-ion-alert-ios,[dir=rtl].sc-ion-alert-ios-h [aria-checked=true].sc-ion-alert-ios .alert-checkbox-inner.sc-ion-alert-ios,[dir=rtl] .sc-ion-alert-ios-h [aria-checked=true].sc-ion-alert-ios .alert-checkbox-inner.sc-ion-alert-ios{left:unset;right:unset;right:9px}.alert-button-group.sc-ion-alert-ios{margin-right:-0.55px;-ms-flex-wrap:wrap;flex-wrap:wrap}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-button-group.sc-ion-alert-ios{margin-right:unset;-webkit-margin-end:-0.55px;margin-inline-end:-0.55px}}.alert-button.sc-ion-alert-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;border-radius:0;-ms-flex:1 1 auto;flex:1 1 auto;min-width:50%;height:44px;border-top:0.55px solid rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.2);border-right:0.55px solid rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.2);background-color:transparent;color:var(--ion-color-primary, #3880ff);font-size:17px;overflow:hidden}[dir=rtl].sc-ion-alert-ios .alert-button.sc-ion-alert-ios:first-child,[dir=rtl].sc-ion-alert-ios-h .alert-button.sc-ion-alert-ios:first-child,[dir=rtl] .sc-ion-alert-ios-h .alert-button.sc-ion-alert-ios:first-child{border-right:0}.alert-button.sc-ion-alert-ios:last-child{border-right:0;font-weight:bold}[dir=rtl].sc-ion-alert-ios .alert-button.sc-ion-alert-ios:last-child,[dir=rtl].sc-ion-alert-ios-h .alert-button.sc-ion-alert-ios:last-child,[dir=rtl] .sc-ion-alert-ios-h .alert-button.sc-ion-alert-ios:last-child{border-right:0.55px solid rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.2)}.alert-button.ion-activated.sc-ion-alert-ios{background-color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.1)}.alert-button-role-destructive.sc-ion-alert-ios,.alert-button-role-destructive.ion-activated.sc-ion-alert-ios,.alert-button-role-destructive.ion-focused.sc-ion-alert-ios{color:var(--ion-color-danger, #eb445a)}";
const alertMdCss = ".sc-ion-alert-md-h{--min-width:250px;--width:auto;--min-height:auto;--height:auto;--max-height:90%;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;font-family:var(--ion-font-family, inherit);contain:strict;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1001}.overlay-hidden.sc-ion-alert-md-h{display:none}.alert-top.sc-ion-alert-md-h{padding-top:50px;-ms-flex-align:start;align-items:flex-start}.alert-wrapper.sc-ion-alert-md{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);contain:content;opacity:0;z-index:10}.alert-title.sc-ion-alert-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}.alert-sub-title.sc-ion-alert-md{margin-left:0;margin-right:0;margin-top:5px;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-weight:normal}.alert-message.sc-ion-alert-md{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-overflow-scrolling:touch;overflow-y:auto;overscroll-behavior-y:contain}.alert-checkbox-group.sc-ion-alert-md::-webkit-scrollbar,.alert-radio-group.sc-ion-alert-md::-webkit-scrollbar,.alert-message.sc-ion-alert-md::-webkit-scrollbar{display:none}.alert-input.sc-ion-alert-md{padding-left:0;padding-right:0;padding-top:10px;padding-bottom:10px;width:100%;border:0;background:inherit;font:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}.alert-button-group.sc-ion-alert-md{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;width:100%}.alert-button-group-vertical.sc-ion-alert-md{-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.alert-button.sc-ion-alert-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;border:0;font-size:14px;line-height:20px;z-index:0}.alert-button.ion-focused.sc-ion-alert-md,.alert-tappable.ion-focused.sc-ion-alert-md{background:var(--ion-color-step-100, #e6e6e6)}.alert-button-inner.sc-ion-alert-md{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%}.alert-input-disabled.sc-ion-alert-md,.alert-checkbox-button-disabled.sc-ion-alert-md .alert-button-inner.sc-ion-alert-md,.alert-radio-button-disabled.sc-ion-alert-md .alert-button-inner.sc-ion-alert-md{cursor:default;opacity:0.5;pointer-events:none}.alert-tappable.sc-ion-alert-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:-ms-flexbox;display:flex;width:100%;border:0;background:transparent;font-size:inherit;line-height:initial;text-align:start;-webkit-appearance:none;-moz-appearance:none;appearance:none;contain:strict}.alert-button.sc-ion-alert-md,.alert-checkbox.sc-ion-alert-md,.alert-input.sc-ion-alert-md,.alert-radio.sc-ion-alert-md{outline:none}.alert-radio-icon.sc-ion-alert-md,.alert-checkbox-icon.sc-ion-alert-md,.alert-checkbox-inner.sc-ion-alert-md{-webkit-box-sizing:border-box;box-sizing:border-box}textarea.alert-input.sc-ion-alert-md{min-height:37px;resize:none}.sc-ion-alert-md-h{--background:var(--ion-overlay-background-color, var(--ion-background-color, #fff));--max-width:280px;--backdrop-opacity:var(--ion-backdrop-opacity, 0.32);font-size:14px}.alert-wrapper.sc-ion-alert-md{border-radius:4px;-webkit-box-shadow:0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);box-shadow:0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12)}.alert-head.sc-ion-alert-md{padding-left:23px;padding-right:23px;padding-top:20px;padding-bottom:15px;text-align:start}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-head.sc-ion-alert-md{padding-left:unset;padding-right:unset;-webkit-padding-start:23px;padding-inline-start:23px;-webkit-padding-end:23px;padding-inline-end:23px}}.alert-title.sc-ion-alert-md{color:var(--ion-text-color, #000);font-size:20px;font-weight:500}.alert-sub-title.sc-ion-alert-md{color:var(--ion-text-color, #000);font-size:16px}.alert-message.sc-ion-alert-md,.alert-input-group.sc-ion-alert-md{padding-left:24px;padding-right:24px;padding-top:20px;padding-bottom:20px;color:var(--ion-color-step-550, #737373)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-message.sc-ion-alert-md,.alert-input-group.sc-ion-alert-md{padding-left:unset;padding-right:unset;-webkit-padding-start:24px;padding-inline-start:24px;-webkit-padding-end:24px;padding-inline-end:24px}}.alert-message.sc-ion-alert-md{max-height:240px;font-size:16px}.alert-message.sc-ion-alert-md:empty{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}.alert-head.sc-ion-alert-md+.alert-message.sc-ion-alert-md{padding-top:0}.alert-input.sc-ion-alert-md{margin-left:0;margin-right:0;margin-top:5px;margin-bottom:5px;border-bottom:1px solid var(--ion-color-step-150, #d9d9d9);color:var(--ion-text-color, #000)}.alert-input.sc-ion-alert-md::-webkit-input-placeholder{color:var(--ion-placeholder-color, var(--ion-color-step-400, #999999));font-family:inherit;font-weight:inherit}.alert-input.sc-ion-alert-md::-moz-placeholder{color:var(--ion-placeholder-color, var(--ion-color-step-400, #999999));font-family:inherit;font-weight:inherit}.alert-input.sc-ion-alert-md:-ms-input-placeholder{color:var(--ion-placeholder-color, var(--ion-color-step-400, #999999));font-family:inherit;font-weight:inherit}.alert-input.sc-ion-alert-md::-ms-input-placeholder{color:var(--ion-placeholder-color, var(--ion-color-step-400, #999999));font-family:inherit;font-weight:inherit}.alert-input.sc-ion-alert-md::placeholder{color:var(--ion-placeholder-color, var(--ion-color-step-400, #999999));font-family:inherit;font-weight:inherit}.alert-input.sc-ion-alert-md::-ms-clear{display:none}.alert-input.sc-ion-alert-md:focus{margin-bottom:4px;border-bottom:2px solid var(--ion-color-primary, #3880ff)}.alert-radio-group.sc-ion-alert-md,.alert-checkbox-group.sc-ion-alert-md{position:relative;max-height:240px;border-top:1px solid var(--ion-color-step-150, #d9d9d9);border-bottom:1px solid var(--ion-color-step-150, #d9d9d9);overflow:auto}.alert-tappable.sc-ion-alert-md{position:relative;height:48px;overflow:hidden}.alert-radio-label.sc-ion-alert-md{padding-left:52px;padding-right:26px;padding-top:13px;padding-bottom:13px;-ms-flex:1;flex:1;color:var(--ion-color-step-850, #262626);font-size:16px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-radio-label.sc-ion-alert-md{padding-left:unset;padding-right:unset;-webkit-padding-start:52px;padding-inline-start:52px;-webkit-padding-end:26px;padding-inline-end:26px}}.alert-radio-icon.sc-ion-alert-md{left:26px;top:0;border-radius:50%;display:block;position:relative;width:20px;height:20px;border-width:2px;border-style:solid;border-color:var(--ion-color-step-550, #737373)}[dir=rtl].sc-ion-alert-md .alert-radio-icon.sc-ion-alert-md,[dir=rtl].sc-ion-alert-md-h .alert-radio-icon.sc-ion-alert-md,[dir=rtl] .sc-ion-alert-md-h .alert-radio-icon.sc-ion-alert-md{left:unset;right:unset;right:26px}.alert-radio-inner.sc-ion-alert-md{left:3px;top:3px;border-radius:50%;position:absolute;width:10px;height:10px;-webkit-transform:scale3d(0, 0, 0);transform:scale3d(0, 0, 0);-webkit-transition:-webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);transition:-webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 280ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);background-color:var(--ion-color-primary, #3880ff)}[dir=rtl].sc-ion-alert-md .alert-radio-inner.sc-ion-alert-md,[dir=rtl].sc-ion-alert-md-h .alert-radio-inner.sc-ion-alert-md,[dir=rtl] .sc-ion-alert-md-h .alert-radio-inner.sc-ion-alert-md{left:unset;right:unset;right:3px}[aria-checked=true].sc-ion-alert-md .alert-radio-label.sc-ion-alert-md{color:var(--ion-color-step-850, #262626)}[aria-checked=true].sc-ion-alert-md .alert-radio-icon.sc-ion-alert-md{border-color:var(--ion-color-primary, #3880ff)}[aria-checked=true].sc-ion-alert-md .alert-radio-inner.sc-ion-alert-md{-webkit-transform:scale3d(1, 1, 1);transform:scale3d(1, 1, 1)}.alert-checkbox-label.sc-ion-alert-md{padding-left:53px;padding-right:26px;padding-top:13px;padding-bottom:13px;-ms-flex:1;flex:1;color:var(--ion-color-step-850, #262626);font-size:16px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-checkbox-label.sc-ion-alert-md{padding-left:unset;padding-right:unset;-webkit-padding-start:53px;padding-inline-start:53px;-webkit-padding-end:26px;padding-inline-end:26px}}.alert-checkbox-icon.sc-ion-alert-md{left:26px;top:0;border-radius:2px;position:relative;width:16px;height:16px;border-width:2px;border-style:solid;border-color:var(--ion-color-step-550, #737373);contain:strict}[dir=rtl].sc-ion-alert-md .alert-checkbox-icon.sc-ion-alert-md,[dir=rtl].sc-ion-alert-md-h .alert-checkbox-icon.sc-ion-alert-md,[dir=rtl] .sc-ion-alert-md-h .alert-checkbox-icon.sc-ion-alert-md{left:unset;right:unset;right:26px}[aria-checked=true].sc-ion-alert-md .alert-checkbox-icon.sc-ion-alert-md{border-color:var(--ion-color-primary, #3880ff);background-color:var(--ion-color-primary, #3880ff)}[aria-checked=true].sc-ion-alert-md .alert-checkbox-inner.sc-ion-alert-md{left:3px;top:0;position:absolute;width:6px;height:10px;-webkit-transform:rotate(45deg);transform:rotate(45deg);border-width:2px;border-top-width:0;border-left-width:0;border-style:solid;border-color:var(--ion-color-primary-contrast, #fff)}[dir=rtl].sc-ion-alert-md [aria-checked=true].sc-ion-alert-md .alert-checkbox-inner.sc-ion-alert-md,[dir=rtl].sc-ion-alert-md-h [aria-checked=true].sc-ion-alert-md .alert-checkbox-inner.sc-ion-alert-md,[dir=rtl] .sc-ion-alert-md-h [aria-checked=true].sc-ion-alert-md .alert-checkbox-inner.sc-ion-alert-md{left:unset;right:unset;right:3px}.alert-button-group.sc-ion-alert-md{padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse;-ms-flex-pack:end;justify-content:flex-end}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-button-group.sc-ion-alert-md{padding-left:unset;padding-right:unset;-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px}}.alert-button.sc-ion-alert-md{border-radius:2px;margin-left:0;margin-right:8px;margin-top:0;margin-bottom:0;padding-left:10px;padding-right:10px;padding-top:10px;padding-bottom:10px;position:relative;background-color:transparent;color:var(--ion-color-primary, #3880ff);font-weight:500;text-align:end;text-transform:uppercase;overflow:hidden}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-button.sc-ion-alert-md{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:8px;margin-inline-end:8px}}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert-button.sc-ion-alert-md{padding-left:unset;padding-right:unset;-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px}}.alert-button-inner.sc-ion-alert-md{-ms-flex-pack:end;justify-content:flex-end}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Alert {
constructor(hostRef) {
registerInstance(this, hostRef);
this.didPresent = createEvent(this, "ionAlertDidPresent", 7);
this.willPresent = createEvent(this, "ionAlertWillPresent", 7);
this.willDismiss = createEvent(this, "ionAlertWillDismiss", 7);
this.didDismiss = createEvent(this, "ionAlertDidDismiss", 7);
this.processedInputs = [];
this.processedButtons = [];
this.presented = false;
/**
* If `true`, the keyboard will be automatically dismissed when the overlay is presented.
*/
this.keyboardClose = true;
/**
* Array of buttons to be added to the alert.
*/
this.buttons = [];
/**
* Array of input to show in the alert.
*/
this.inputs = [];
/**
* If `true`, the alert will be dismissed when the backdrop is clicked.
*/
this.backdropDismiss = true;
/**
* If `true`, the alert will be translucent.
* Only applies when the mode is `"ios"` and the device supports
* [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
*/
this.translucent = false;
/**
* If `true`, the alert will animate.
*/
this.animated = true;
this.onBackdropTap = () => {
this.dismiss(undefined, BACKDROP);
};
this.dispatchCancelHandler = (ev) => {
const role = ev.detail.role;
if (isCancel(role)) {
const cancelButton = this.processedButtons.find(b => b.role === 'cancel');
this.callButtonHandler(cancelButton);
}
};
}
onKeydown(ev) {
const inputTypes = new Set(this.processedInputs.map(i => i.type));
// The only inputs we want to navigate between using arrow keys are the radios
// ignore the keydown event if it is not on a radio button
if (!inputTypes.has('radio')
|| (ev.target && !this.el.contains(ev.target))
|| ev.target.classList.contains('alert-button')) {
return;
}
// Get all radios inside of the radio group and then
// filter out disabled radios since we need to skip those
const query = this.el.querySelectorAll('.alert-radio');
const radios = Array.from(query).filter(radio => !radio.disabled);
// The focused radio is the one that shares the same id as
// the event target
const index = radios.findIndex(radio => radio.id === ev.target.id);
// We need to know what the next radio element should
// be in order to change the focus
let nextEl;
// If hitting arrow down or arrow right, move to the next radio
// If we're on the last radio, move to the first radio
if (['ArrowDown', 'ArrowRight'].includes(ev.code)) {
nextEl = (index === radios.length - 1)
? radios[0]
: radios[index + 1];
}
// If hitting arrow up or arrow left, move to the previous radio
// If we're on the first radio, move to the last radio
if (['ArrowUp', 'ArrowLeft'].includes(ev.code)) {
nextEl = (index === 0)
? radios[radios.length - 1]
: radios[index - 1];
}
if (nextEl && radios.includes(nextEl)) {
const nextProcessed = this.processedInputs.find(input => input.id === (nextEl === null || nextEl === void 0 ? void 0 : nextEl.id));
if (nextProcessed) {
this.rbClick(nextProcessed);
nextEl.focus();
}
}
}
buttonsChanged() {
const buttons = this.buttons;
this.processedButtons = buttons.map(btn => {
return (typeof btn === 'string')
? { text: btn, role: btn.toLowerCase() === 'cancel' ? 'cancel' : undefined }
: btn;
});
}
inputsChanged() {
const inputs = this.inputs;
// Get the first input that is not disabled and the checked one
// If an enabled checked input exists, set it to be the focusable input
// otherwise we default to focus the first input
// This will only be used when the input is type radio
const first = inputs.find(input => !input.disabled);
const checked = inputs.find(input => input.checked && !input.disabled);
const focusable = checked || first;
// An alert can be created with several different inputs. Radios,
// checkboxes and inputs are all accepted, but they cannot be mixed.
const inputTypes = new Set(inputs.map(i => i.type));
if (inputTypes.has('checkbox') && inputTypes.has('radio')) {
console.warn(`Alert cannot mix input types: ${(Array.from(inputTypes.values()).join('/'))}. Please see alert docs for more info.`);
}
this.inputType = inputTypes.values().next().value;
this.processedInputs = inputs.map((i, index) => ({
type: i.type || 'text',
name: i.name || `${index}`,
placeholder: i.placeholder || '',
value: i.value,
label: i.label,
checked: !!i.checked,
disabled: !!i.disabled,
id: i.id || `alert-input-${this.overlayIndex}-${index}`,
handler: i.handler,
min: i.min,
max: i.max,
cssClass: i.cssClass || '',
attributes: i.attributes || {},
tabindex: (i.type === 'radio' && i !== focusable) ? -1 : 0
}));
}
connectedCallback() {
prepareOverlay(this.el);
}
componentWillLoad() {
this.inputsChanged();
this.buttonsChanged();
}
disconnectedCallback() {
if (this.gesture) {
this.gesture.destroy();
this.gesture = undefined;
}
}
componentDidLoad() {
/**
* Do not create gesture if:
* 1. A gesture already exists
* 2. App is running in MD mode
* 3. A wrapper ref does not exist
*/
if (this.gesture || getIonMode$1(this) === 'md' || !this.wrapperEl) {
return;
}
this.gesture = createButtonActiveGesture(this.wrapperEl, (refEl) => refEl.classList.contains('alert-button'));
this.gesture.enable(true);
}
/**
* Present the alert overlay after it has been created.
*/
present() {
return present(this, 'alertEnter', iosEnterAnimation$5, mdEnterAnimation$4);
}
/**
* Dismiss the alert overlay after it has been presented.
*
* @param data Any data to emit in the dismiss events.
* @param role The role of the element that is dismissing the alert.
* This can be useful in a button handler for determining which button was
* clicked to dismiss the alert.
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
*/
dismiss(data, role) {
return dismiss(this, data, role, 'alertLeave', iosLeaveAnimation$5, mdLeaveAnimation$4);
}
/**
* Returns a promise that resolves when the alert did dismiss.
*/
onDidDismiss() {
return eventMethod(this.el, 'ionAlertDidDismiss');
}
/**
* Returns a promise that resolves when the alert will dismiss.
*/
onWillDismiss() {
return eventMethod(this.el, 'ionAlertWillDismiss');
}
rbClick(selectedInput) {
for (const input of this.processedInputs) {
input.checked = input === selectedInput;
input.tabindex = input === selectedInput ? 0 : -1;
}
this.activeId = selectedInput.id;
safeCall(selectedInput.handler, selectedInput);
forceUpdate$1(this);
}
cbClick(selectedInput) {
selectedInput.checked = !selectedInput.checked;
safeCall(selectedInput.handler, selectedInput);
forceUpdate$1(this);
}
buttonClick(button) {
const role = button.role;
const values = this.getValues();
if (isCancel(role)) {
return this.dismiss({ values }, role);
}
const returnData = this.callButtonHandler(button, values);
if (returnData !== false) {
return this.dismiss(Object.assign({ values }, returnData), button.role);
}
return Promise.resolve(false);
}
callButtonHandler(button, data) {
if (button && button.handler) {
// a handler has been provided, execute it
// pass the handler the values from the inputs
const returnData = safeCall(button.handler, data);
if (returnData === false) {
// if the return value of the handler is false then do not dismiss
return false;
}
if (typeof returnData === 'object') {
return returnData;
}
}
return {};
}
getValues() {
if (this.processedInputs.length === 0) {
// this is an alert without any options/inputs at all
return undefined;
}
if (this.inputType === 'radio') {
// this is an alert with radio buttons (single value select)
// return the one value which is checked, otherwise undefined
const checkedInput = this.processedInputs.find(i => !!i.checked);
return checkedInput ? checkedInput.value : undefined;
}
if (this.inputType === 'checkbox') {
// this is an alert with checkboxes (multiple value select)
// return an array of all the checked values
return this.processedInputs.filter(i => i.checked).map(i => i.value);
}
// this is an alert with text inputs
// return an object of all the values with the input name as the key
const values = {};
this.processedInputs.forEach(i => {
values[i.name] = i.value || '';
});
return values;
}
renderAlertInputs() {
switch (this.inputType) {
case 'checkbox': return this.renderCheckbox();
case 'radio': return this.renderRadio();
default: return this.renderInput();
}
}
renderCheckbox() {
const inputs = this.processedInputs;
const mode = getIonMode$1(this);
if (inputs.length === 0) {
return null;
}
return (hAsync("div", { class: "alert-checkbox-group" }, inputs.map(i => (hAsync("button", { type: "button", onClick: () => this.cbClick(i), "aria-checked": `${i.checked}`, id: i.id, disabled: i.disabled, tabIndex: i.tabindex, role: "checkbox", class: Object.assign(Object.assign({}, getClassMap(i.cssClass)), { 'alert-tappable': true, 'alert-checkbox': true, 'alert-checkbox-button': true, 'ion-focusable': true, 'alert-checkbox-button-disabled': i.disabled || false }) }, hAsync("div", { class: "alert-button-inner" }, hAsync("div", { class: "alert-checkbox-icon" }, hAsync("div", { class: "alert-checkbox-inner" })), hAsync("div", { class: "alert-checkbox-label" }, i.label)), mode === 'md' && hAsync("ion-ripple-effect", null))))));
}
renderRadio() {
const inputs = this.processedInputs;
if (inputs.length === 0) {
return null;
}
return (hAsync("div", { class: "alert-radio-group", role: "radiogroup", "aria-activedescendant": this.activeId }, inputs.map(i => (hAsync("button", { type: "button", onClick: () => this.rbClick(i), "aria-checked": `${i.checked}`, disabled: i.disabled, id: i.id, tabIndex: i.tabindex, class: Object.assign(Object.assign({}, getClassMap(i.cssClass)), { 'alert-radio-button': true, 'alert-tappable': true, 'alert-radio': true, 'ion-focusable': true, 'alert-radio-button-disabled': i.disabled || false }), role: "radio" }, hAsync("div", { class: "alert-button-inner" }, hAsync("div", { class: "alert-radio-icon" }, hAsync("div", { class: "alert-radio-inner" })), hAsync("div", { class: "alert-radio-label" }, i.label)))))));
}
renderInput() {
const inputs = this.processedInputs;
if (inputs.length === 0) {
return null;
}
return (hAsync("div", { class: "alert-input-group" }, inputs.map(i => {
var _a, _b, _c, _d;
if (i.type === 'textarea') {
return (hAsync("div", { class: "alert-input-wrapper" }, hAsync("textarea", Object.assign({ placeholder: i.placeholder, value: i.value, id: i.id, tabIndex: i.tabindex }, i.attributes, { disabled: (_b = (_a = i.attributes) === null || _a === void 0 ? void 0 : _a.disabled) !== null && _b !== void 0 ? _b : i.disabled, class: inputClass(i), onInput: e => {
var _a;
i.value = e.target.value;
if ((_a = i.attributes) === null || _a === void 0 ? void 0 : _a.onInput) {
i.attributes.onInput(e);
}
} }))));
}
else {
return (hAsync("div", { class: "alert-input-wrapper" }, hAsync("input", Object.assign({ placeholder: i.placeholder, type: i.type, min: i.min, max: i.max, value: i.value, id: i.id, tabIndex: i.tabindex }, i.attributes, { disabled: (_d = (_c = i.attributes) === null || _c === void 0 ? void 0 : _c.disabled) !== null && _d !== void 0 ? _d : i.disabled, class: inputClass(i), onInput: e => {
var _a;
i.value = e.target.value;
if ((_a = i.attributes) === null || _a === void 0 ? void 0 : _a.onInput) {
i.attributes.onInput(e);
}
} }))));
}
})));
}
renderAlertButtons() {
const buttons = this.processedButtons;
const mode = getIonMode$1(this);
const alertButtonGroupClass = {
'alert-button-group': true,
'alert-button-group-vertical': buttons.length > 2
};
return (hAsync("div", { class: alertButtonGroupClass }, buttons.map(button => hAsync("button", { type: "button", class: buttonClass$2(button), tabIndex: 0, onClick: () => this.buttonClick(button) }, hAsync("span", { class: "alert-button-inner" }, button.text), mode === 'md' && hAsync("ion-ripple-effect", null)))));
}
render() {
const { overlayIndex, header, subHeader } = this;
const mode = getIonMode$1(this);
const hdrId = `alert-${overlayIndex}-hdr`;
const subHdrId = `alert-${overlayIndex}-sub-hdr`;
const msgId = `alert-${overlayIndex}-msg`;
return (hAsync(Host, { role: "dialog", "aria-modal": "true", tabindex: "-1", style: {
zIndex: `${20000 + overlayIndex}`,
}, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }, hAsync("ion-backdrop", { tappable: this.backdropDismiss }), hAsync("div", { tabindex: "0" }), hAsync("div", { class: "alert-wrapper ion-overlay-wrapper", ref: el => this.wrapperEl = el }, hAsync("div", { class: "alert-head" }, header && hAsync("h2", { id: hdrId, class: "alert-title" }, header), subHeader && hAsync("h2", { id: subHdrId, class: "alert-sub-title" }, subHeader)), hAsync("div", { id: msgId, class: "alert-message", innerHTML: sanitizeDOMString(this.message) }), this.renderAlertInputs(), this.renderAlertButtons()), hAsync("div", { tabindex: "0" })));
}
get el() { return getElement(this); }
static get watchers() { return {
"buttons": ["buttonsChanged"],
"inputs": ["inputsChanged"]
}; }
static get style() { return {
ios: alertIosCss,
md: alertMdCss
}; }
static get cmpMeta() { return {
"$flags$": 34,
"$tagName$": "ion-alert",
"$members$": {
"overlayIndex": [2, "overlay-index"],
"keyboardClose": [4, "keyboard-close"],
"enterAnimation": [16],
"leaveAnimation": [16],
"cssClass": [1, "css-class"],
"header": [1],
"subHeader": [1, "sub-header"],
"message": [1],
"buttons": [16],
"inputs": [1040],
"backdropDismiss": [4, "backdrop-dismiss"],
"translucent": [4],
"animated": [4],
"present": [64],
"dismiss": [64],
"onDidDismiss": [64],
"onWillDismiss": [64]
},
"$listeners$": [[4, "keydown", "onKeydown"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const inputClass = (input) => {
var _a, _b, _c;
return Object.assign(Object.assign({ 'alert-input': true, 'alert-input-disabled': ((_b = (_a = input.attributes) === null || _a === void 0 ? void 0 : _a.disabled) !== null && _b !== void 0 ? _b : input.disabled) || false }, getClassMap(input.cssClass)), getClassMap(input.attributes ? (_c = input.attributes.class) === null || _c === void 0 ? void 0 : _c.toString() : ''));
};
const buttonClass$2 = (button) => {
return Object.assign({ 'alert-button': true, 'ion-focusable': true, 'ion-activatable': true, [`alert-button-role-${button.role}`]: button.role !== undefined }, getClassMap(button.cssClass));
};
const appCss = "html.plt-mobile ion-app{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}html.plt-mobile ion-app [contenteditable]{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}ion-app.force-statusbar-padding{--ion-safe-area-top:20px}";
class App {
constructor(hostRef) {
registerInstance(this, hostRef);
}
componentDidLoad() {
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
'ion-page': true,
'force-statusbar-padding': config.getBoolean('_forceStatusbarPadding'),
} }));
}
get el() { return getElement(this); }
static get style() { return appCss; }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-app",
"$members$": undefined,
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const avatarIosCss = "/*!@:host*/.sc-ion-avatar-ios-h{border-radius:var(--border-radius);display:block}/*!@::slotted(ion-img),\n::slotted(img)*/.sc-ion-avatar-ios-s>ion-img,.sc-ion-avatar-ios-s>img{border-radius:var(--border-radius);width:100%;height:100%;-o-object-fit:cover;object-fit:cover;overflow:hidden}/*!@:host*/.sc-ion-avatar-ios-h{--border-radius:50%;width:48px;height:48px}";
const avatarMdCss = "/*!@:host*/.sc-ion-avatar-md-h{border-radius:var(--border-radius);display:block}/*!@::slotted(ion-img),\n::slotted(img)*/.sc-ion-avatar-md-s>ion-img,.sc-ion-avatar-md-s>img{border-radius:var(--border-radius);width:100%;height:100%;-o-object-fit:cover;object-fit:cover;overflow:hidden}/*!@:host*/.sc-ion-avatar-md-h{--border-radius:50%;width:64px;height:64px}";
class Avatar {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
return (hAsync(Host, { class: getIonMode$1(this) }, hAsync("slot", null)));
}
static get style() { return {
ios: avatarIosCss,
md: avatarMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-avatar",
"$members$": undefined,
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const backButtonIosCss = "/*!@:host*/.sc-ion-back-button-ios-h{--background:transparent;--color-focused:currentColor;--color-hover:currentColor;--icon-margin-top:0;--icon-margin-bottom:0;--icon-padding-top:0;--icon-padding-end:0;--icon-padding-bottom:0;--icon-padding-start:0;--margin-top:0;--margin-end:0;--margin-bottom:0;--margin-start:0;--min-width:auto;--min-height:auto;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;--opacity:1;--ripple-color:currentColor;--transition:background-color, opacity 100ms linear;display:none;min-width:var(--min-width);min-height:var(--min-height);color:var(--color);font-family:var(--ion-font-family, inherit);text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-font-kerning:none;font-kerning:none}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-back-button-ios{color:var(--ripple-color)}/*!@:host(.ion-color) .button-native*/.ion-color.sc-ion-back-button-ios-h .button-native.sc-ion-back-button-ios{color:var(--ion-color-base)}/*!@:host(.show-back-button)*/.show-back-button.sc-ion-back-button-ios-h{display:block}/*!@:host(.back-button-disabled)*/.back-button-disabled.sc-ion-back-button-ios-h{cursor:default;opacity:0.5;pointer-events:none}/*!@.button-native*/.button-native.sc-ion-back-button-ios{border-radius:var(--border-radius);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:var(--margin-start);margin-right:var(--margin-end);margin-top:var(--margin-top);margin-bottom:var(--margin-bottom);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;position:relative;width:100%;height:100%;min-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border:0;outline:none;background:var(--background);line-height:1;cursor:pointer;opacity:var(--opacity);overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-back-button-ios{margin-left:unset;margin-right:unset;-webkit-margin-start:var(--margin-start);margin-inline-start:var(--margin-start);-webkit-margin-end:var(--margin-end);margin-inline-end:var(--margin-end)}}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-back-button-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.button-inner*/.button-inner.sc-ion-back-button-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}/*!@ion-icon*/ion-icon.sc-ion-back-button-ios{padding-left:var(--icon-padding-start);padding-right:var(--icon-padding-end);padding-top:var(--icon-padding-top);padding-bottom:var(--icon-padding-bottom);margin-left:var(--icon-margin-start);margin-right:var(--icon-margin-end);margin-top:var(--icon-margin-top);margin-bottom:var(--icon-margin-bottom);display:inherit;font-size:var(--icon-font-size);font-weight:var(--icon-font-weight);pointer-events:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@ion-icon*/ion-icon.sc-ion-back-button-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--icon-padding-start);padding-inline-start:var(--icon-padding-start);-webkit-padding-end:var(--icon-padding-end);padding-inline-end:var(--icon-padding-end)}}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@ion-icon*/ion-icon.sc-ion-back-button-ios{margin-left:unset;margin-right:unset;-webkit-margin-start:var(--icon-margin-start);margin-inline-start:var(--icon-margin-start);-webkit-margin-end:var(--icon-margin-end);margin-inline-end:var(--icon-margin-end)}}/*!@:host(.ion-focused) .button-native*/.ion-focused.sc-ion-back-button-ios-h .button-native.sc-ion-back-button-ios{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-back-button-ios-h .button-native.sc-ion-back-button-ios::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}/*!@.button-native::after*/.button-native.sc-ion-back-button-ios::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}@media (any-hover: hover){/*!@:host(:hover) .button-native*/.sc-ion-back-button-ios-h:hover .button-native.sc-ion-back-button-ios{color:var(--color-hover)}/*!@:host(:hover) .button-native::after*/.sc-ion-back-button-ios-h:hover .button-native.sc-ion-back-button-ios::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}/*!@:host(.ion-color.ion-focused) .button-native*/.ion-color.ion-focused.sc-ion-back-button-ios-h .button-native.sc-ion-back-button-ios{color:var(--ion-color-base)}@media (any-hover: hover){/*!@:host(.ion-color:hover) .button-native*/.ion-color.sc-ion-back-button-ios-h:hover .button-native.sc-ion-back-button-ios{color:var(--ion-color-base)}}/*!@:host(.in-toolbar:not(.in-toolbar-color))*/.in-toolbar.sc-ion-back-button-ios-h:not(.in-toolbar-color){color:var(--ion-toolbar-color, var(--color))}/*!@:host*/.sc-ion-back-button-ios-h{--background-hover:transparent;--background-hover-opacity:1;--background-focused:currentColor;--background-focused-opacity:.1;--border-radius:4px;--color:var(--ion-color-primary, #3880ff);--icon-margin-end:-5px;--icon-margin-start:-4px;--icon-font-size:1.85em;--min-height:32px;font-size:17px}/*!@.button-native*/.button-native.sc-ion-back-button-ios{-webkit-transform:translateZ(0);transform:translateZ(0);overflow:visible;z-index:99}/*!@:host(.ion-activated) .button-native*/.ion-activated.sc-ion-back-button-ios-h .button-native.sc-ion-back-button-ios{opacity:0.4}@media (any-hover: hover){/*!@:host(:hover)*/.sc-ion-back-button-ios-h:hover{opacity:0.6}}/*!@:host(.ion-color.ion-focused) .button-native::after*/.ion-color.ion-focused.sc-ion-back-button-ios-h .button-native.sc-ion-back-button-ios::after{background:var(--ion-color-base)}";
const backButtonMdCss = "/*!@:host*/.sc-ion-back-button-md-h{--background:transparent;--color-focused:currentColor;--color-hover:currentColor;--icon-margin-top:0;--icon-margin-bottom:0;--icon-padding-top:0;--icon-padding-end:0;--icon-padding-bottom:0;--icon-padding-start:0;--margin-top:0;--margin-end:0;--margin-bottom:0;--margin-start:0;--min-width:auto;--min-height:auto;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;--opacity:1;--ripple-color:currentColor;--transition:background-color, opacity 100ms linear;display:none;min-width:var(--min-width);min-height:var(--min-height);color:var(--color);font-family:var(--ion-font-family, inherit);text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-font-kerning:none;font-kerning:none}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-back-button-md{color:var(--ripple-color)}/*!@:host(.ion-color) .button-native*/.ion-color.sc-ion-back-button-md-h .button-native.sc-ion-back-button-md{color:var(--ion-color-base)}/*!@:host(.show-back-button)*/.show-back-button.sc-ion-back-button-md-h{display:block}/*!@:host(.back-button-disabled)*/.back-button-disabled.sc-ion-back-button-md-h{cursor:default;opacity:0.5;pointer-events:none}/*!@.button-native*/.button-native.sc-ion-back-button-md{border-radius:var(--border-radius);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:var(--margin-start);margin-right:var(--margin-end);margin-top:var(--margin-top);margin-bottom:var(--margin-bottom);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;position:relative;width:100%;height:100%;min-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border:0;outline:none;background:var(--background);line-height:1;cursor:pointer;opacity:var(--opacity);overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-back-button-md{margin-left:unset;margin-right:unset;-webkit-margin-start:var(--margin-start);margin-inline-start:var(--margin-start);-webkit-margin-end:var(--margin-end);margin-inline-end:var(--margin-end)}}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-back-button-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.button-inner*/.button-inner.sc-ion-back-button-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}/*!@ion-icon*/ion-icon.sc-ion-back-button-md{padding-left:var(--icon-padding-start);padding-right:var(--icon-padding-end);padding-top:var(--icon-padding-top);padding-bottom:var(--icon-padding-bottom);margin-left:var(--icon-margin-start);margin-right:var(--icon-margin-end);margin-top:var(--icon-margin-top);margin-bottom:var(--icon-margin-bottom);display:inherit;font-size:var(--icon-font-size);font-weight:var(--icon-font-weight);pointer-events:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@ion-icon*/ion-icon.sc-ion-back-button-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--icon-padding-start);padding-inline-start:var(--icon-padding-start);-webkit-padding-end:var(--icon-padding-end);padding-inline-end:var(--icon-padding-end)}}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@ion-icon*/ion-icon.sc-ion-back-button-md{margin-left:unset;margin-right:unset;-webkit-margin-start:var(--icon-margin-start);margin-inline-start:var(--icon-margin-start);-webkit-margin-end:var(--icon-margin-end);margin-inline-end:var(--icon-margin-end)}}/*!@:host(.ion-focused) .button-native*/.ion-focused.sc-ion-back-button-md-h .button-native.sc-ion-back-button-md{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-back-button-md-h .button-native.sc-ion-back-button-md::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}/*!@.button-native::after*/.button-native.sc-ion-back-button-md::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}@media (any-hover: hover){/*!@:host(:hover) .button-native*/.sc-ion-back-button-md-h:hover .button-native.sc-ion-back-button-md{color:var(--color-hover)}/*!@:host(:hover) .button-native::after*/.sc-ion-back-button-md-h:hover .button-native.sc-ion-back-button-md::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}/*!@:host(.ion-color.ion-focused) .button-native*/.ion-color.ion-focused.sc-ion-back-button-md-h .button-native.sc-ion-back-button-md{color:var(--ion-color-base)}@media (any-hover: hover){/*!@:host(.ion-color:hover) .button-native*/.ion-color.sc-ion-back-button-md-h:hover .button-native.sc-ion-back-button-md{color:var(--ion-color-base)}}/*!@:host(.in-toolbar:not(.in-toolbar-color))*/.in-toolbar.sc-ion-back-button-md-h:not(.in-toolbar-color){color:var(--ion-toolbar-color, var(--color))}/*!@:host*/.sc-ion-back-button-md-h{--border-radius:4px;--background-focused:currentColor;--background-focused-opacity:.12;--background-hover:currentColor;--background-hover-opacity:0.04;--color:currentColor;--icon-margin-end:0;--icon-margin-start:0;--icon-font-size:24px;--icon-font-weight:normal;--min-height:32px;--min-width:44px;--padding-start:12px;--padding-end:12px;font-size:14px;font-weight:500;text-transform:uppercase}/*!@:host(.back-button-has-icon-only)*/.back-button-has-icon-only.sc-ion-back-button-md-h{--border-radius:50%;min-width:48px;height:48px}/*!@.button-native*/.button-native.sc-ion-back-button-md{-webkit-box-shadow:none;box-shadow:none}/*!@.button-text*/.button-text.sc-ion-back-button-md{padding-left:4px;padding-right:4px;padding-top:0;padding-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-text*/.button-text.sc-ion-back-button-md{padding-left:unset;padding-right:unset;-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px}}/*!@ion-icon*/ion-icon.sc-ion-back-button-md{line-height:0.67;text-align:start}@media (any-hover: hover){/*!@:host(.ion-color:hover) .button-native::after*/.ion-color.sc-ion-back-button-md-h:hover .button-native.sc-ion-back-button-md::after{background:var(--ion-color-base)}}/*!@:host(.ion-color.ion-focused) .button-native::after*/.ion-color.ion-focused.sc-ion-back-button-md-h .button-native.sc-ion-back-button-md::after{background:var(--ion-color-base)}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part native - The native HTML button element that wraps all child elements.
* @part icon - The back button icon (uses ion-icon).
* @part text - The back button text.
*/
class BackButton {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If `true`, the user cannot interact with the button.
*/
this.disabled = false;
/**
* The type of the button.
*/
this.type = 'button';
this.onClick = async (ev) => {
const nav = this.el.closest('ion-nav');
ev.preventDefault();
if (nav && await nav.canGoBack()) {
return nav.pop({ animationBuilder: this.routerAnimation, skipIfBusy: true });
}
return openURL(this.defaultHref, ev, 'back', this.routerAnimation);
};
}
componentWillLoad() {
if (this.defaultHref === undefined) {
this.defaultHref = config.get('backButtonDefaultHref');
}
}
get backButtonIcon() {
const icon = this.icon;
if (icon != null) {
// icon is set on the component or by the config
return icon;
}
if (getIonMode$1(this) === 'ios') {
// default ios back button icon
return config.get('backButtonIcon', 'chevron-back');
}
// default md back button icon
return config.get('backButtonIcon', 'arrow-back-sharp');
}
get backButtonText() {
const defaultBackButtonText = getIonMode$1(this) === 'ios' ? 'Back' : null;
return this.text != null ? this.text : config.get('backButtonText', defaultBackButtonText);
}
get hasIconOnly() {
return this.backButtonIcon && !this.backButtonText;
}
get rippleType() {
// If the button only has an icon we use the unbounded
// "circular" ripple effect
if (this.hasIconOnly) {
return 'unbounded';
}
return 'bounded';
}
render() {
const { color, defaultHref, disabled, type, hasIconOnly, backButtonIcon, backButtonText } = this;
const showBackButton = defaultHref !== undefined;
const mode = getIonMode$1(this);
return (hAsync(Host, { onClick: this.onClick, class: createColorClasses$1(color, {
[mode]: true,
'button': true,
'back-button-disabled': disabled,
'back-button-has-icon-only': hasIconOnly,
'in-toolbar': hostContext('ion-toolbar', this.el),
'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
'ion-activatable': true,
'ion-focusable': true,
'show-back-button': showBackButton
}) }, hAsync("button", { type: type, disabled: disabled, class: "button-native", part: "native", "aria-label": backButtonText || 'back' }, hAsync("span", { class: "button-inner" }, backButtonIcon && hAsync("ion-icon", { part: "icon", icon: backButtonIcon, "aria-hidden": "true", lazy: false }), backButtonText && hAsync("span", { part: "text", "aria-hidden": "true", class: "button-text" }, backButtonText)), mode === 'md' && hAsync("ion-ripple-effect", { type: this.rippleType }))));
}
get el() { return getElement(this); }
static get style() { return {
ios: backButtonIosCss,
md: backButtonMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-back-button",
"$members$": {
"color": [513],
"defaultHref": [1025, "default-href"],
"disabled": [516],
"icon": [1],
"text": [1],
"type": [1],
"routerAnimation": [16]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"], ["disabled", "disabled"]]
}; }
}
const backdropIosCss = "/*!@:host*/.sc-ion-backdrop-ios-h{left:0;right:0;top:0;bottom:0;display:block;position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0);contain:strict;cursor:pointer;opacity:0.01;-ms-touch-action:none;touch-action:none;z-index:2}/*!@:host(.backdrop-hide)*/.backdrop-hide.sc-ion-backdrop-ios-h{background:transparent}/*!@:host(.backdrop-no-tappable)*/.backdrop-no-tappable.sc-ion-backdrop-ios-h{cursor:auto}/*!@:host*/.sc-ion-backdrop-ios-h{background-color:var(--ion-backdrop-color, #000)}";
const backdropMdCss = "/*!@:host*/.sc-ion-backdrop-md-h{left:0;right:0;top:0;bottom:0;display:block;position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0);contain:strict;cursor:pointer;opacity:0.01;-ms-touch-action:none;touch-action:none;z-index:2}/*!@:host(.backdrop-hide)*/.backdrop-hide.sc-ion-backdrop-md-h{background:transparent}/*!@:host(.backdrop-no-tappable)*/.backdrop-no-tappable.sc-ion-backdrop-md-h{cursor:auto}/*!@:host*/.sc-ion-backdrop-md-h{background-color:var(--ion-backdrop-color, #000)}";
class Backdrop {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionBackdropTap = createEvent(this, "ionBackdropTap", 7);
this.blocker = GESTURE_CONTROLLER.createBlocker({
disableScroll: true
});
/**
* If `true`, the backdrop will be visible.
*/
this.visible = true;
/**
* If `true`, the backdrop will can be clicked and will emit the `ionBackdropTap` event.
*/
this.tappable = true;
/**
* If `true`, the backdrop will stop propagation on tap.
*/
this.stopPropagation = true;
}
connectedCallback() {
if (this.stopPropagation) {
this.blocker.block();
}
}
disconnectedCallback() {
this.blocker.unblock();
}
onMouseDown(ev) {
this.emitTap(ev);
}
emitTap(ev) {
if (this.stopPropagation) {
ev.preventDefault();
ev.stopPropagation();
}
if (this.tappable) {
this.ionBackdropTap.emit();
}
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { tabindex: "-1", "aria-hidden": "true", class: {
[mode]: true,
'backdrop-hide': !this.visible,
'backdrop-no-tappable': !this.tappable,
} }));
}
static get style() { return {
ios: backdropIosCss,
md: backdropMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-backdrop",
"$members$": {
"visible": [4],
"tappable": [4],
"stopPropagation": [4, "stop-propagation"]
},
"$listeners$": [[2, "click", "onMouseDown"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const badgeIosCss = "/*!@:host*/.sc-ion-badge-ios-h{--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff);--padding-top:3px;--padding-end:8px;--padding-bottom:3px;--padding-start:8px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:inline-block;min-width:10px;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);font-size:13px;font-weight:bold;line-height:1;text-align:center;white-space:nowrap;contain:content;vertical-align:baseline}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-badge-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@:host(.ion-color)*/.ion-color.sc-ion-badge-ios-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host(:empty)*/.sc-ion-badge-ios-h:empty{display:none}/*!@:host*/.sc-ion-badge-ios-h{border-radius:10px}";
const badgeMdCss = "/*!@:host*/.sc-ion-badge-md-h{--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff);--padding-top:3px;--padding-end:8px;--padding-bottom:3px;--padding-start:8px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:inline-block;min-width:10px;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);font-size:13px;font-weight:bold;line-height:1;text-align:center;white-space:nowrap;contain:content;vertical-align:baseline}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-badge-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@:host(.ion-color)*/.ion-color.sc-ion-badge-md-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host(:empty)*/.sc-ion-badge-md-h:empty{display:none}/*!@:host*/.sc-ion-badge-md-h{--padding-top:3px;--padding-end:4px;--padding-bottom:4px;--padding-start:4px;border-radius:4px}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Badge {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: createColorClasses$1(this.color, {
[mode]: true,
}) }, hAsync("slot", null)));
}
static get style() { return {
ios: badgeIosCss,
md: badgeMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-badge",
"$members$": {
"color": [513]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const buttonIosCss = "/*!@:host*/.sc-ion-button-ios-h{--overflow:hidden;--ripple-color:currentColor;--border-width:initial;--border-color:initial;--border-style:initial;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--box-shadow:none;display:inline-block;width:auto;color:var(--color);font-family:var(--ion-font-family, inherit);text-align:center;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:top;vertical-align:-webkit-baseline-middle;-webkit-font-kerning:none;font-kerning:none}/*!@:host(.button-disabled)*/.button-disabled.sc-ion-button-ios-h{cursor:default;opacity:0.5;pointer-events:none}/*!@:host(.button-solid)*/.button-solid.sc-ion-button-ios-h{--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff)}/*!@:host(.button-outline)*/.button-outline.sc-ion-button-ios-h{--border-color:var(--ion-color-primary, #3880ff);--background:transparent;--color:var(--ion-color-primary, #3880ff)}/*!@:host(.button-clear)*/.button-clear.sc-ion-button-ios-h{--border-width:0;--background:transparent;--color:var(--ion-color-primary, #3880ff)}/*!@:host(.button-block)*/.button-block.sc-ion-button-ios-h{display:block}/*!@:host(.button-block) .button-native*/.button-block.sc-ion-button-ios-h .button-native.sc-ion-button-ios{margin-left:0;margin-right:0;display:block;width:100%;clear:both;contain:content}/*!@:host(.button-block) .button-native::after*/.button-block.sc-ion-button-ios-h .button-native.sc-ion-button-ios::after{clear:both}/*!@:host(.button-full)*/.button-full.sc-ion-button-ios-h{display:block}/*!@:host(.button-full) .button-native*/.button-full.sc-ion-button-ios-h .button-native.sc-ion-button-ios{margin-left:0;margin-right:0;display:block;width:100%;contain:content}/*!@:host(.button-full:not(.button-round)) .button-native*/.button-full.sc-ion-button-ios-h:not(.button-round) .button-native.sc-ion-button-ios{border-radius:0;border-right-width:0;border-left-width:0}/*!@.button-native*/.button-native.sc-ion-button-ios{border-radius:var(--border-radius);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;position:relative;width:100%;height:100%;-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);line-height:1;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);contain:layout style;cursor:pointer;opacity:var(--opacity);overflow:var(--overflow);z-index:0;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-button-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.button-native::-moz-focus-inner*/.button-native.sc-ion-button-ios::-moz-focus-inner{border:0}/*!@.button-inner*/.button-inner.sc-ion-button-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}/*!@::slotted(ion-icon)*/.sc-ion-button-ios-s>ion-icon{font-size:1.4em;pointer-events:none}/*!@::slotted(ion-icon[slot=start])*/.sc-ion-button-ios-s>ion-icon[slot=start]{margin-left:-0.3em;margin-right:0.3em;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon[slot=start])*/.sc-ion-button-ios-s>ion-icon[slot=start]{margin-left:unset;margin-right:unset;-webkit-margin-start:-0.3em;margin-inline-start:-0.3em;-webkit-margin-end:0.3em;margin-inline-end:0.3em}}/*!@::slotted(ion-icon[slot=end])*/.sc-ion-button-ios-s>ion-icon[slot=end]{margin-left:0.3em;margin-right:-0.2em;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon[slot=end])*/.sc-ion-button-ios-s>ion-icon[slot=end]{margin-left:unset;margin-right:unset;-webkit-margin-start:0.3em;margin-inline-start:0.3em;-webkit-margin-end:-0.2em;margin-inline-end:-0.2em}}/*!@::slotted(ion-icon[slot=icon-only])*/.sc-ion-button-ios-s>ion-icon[slot=icon-only]{font-size:1.8em}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-button-ios{color:var(--ripple-color)}/*!@.button-native::after*/.button-native.sc-ion-button-ios::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}/*!@:host(.ion-activated)*/.ion-activated.sc-ion-button-ios-h{color:var(--color-activated)}/*!@:host(.ion-activated) .button-native::after*/.ion-activated.sc-ion-button-ios-h .button-native.sc-ion-button-ios::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}/*!@:host(.ion-focused)*/.ion-focused.sc-ion-button-ios-h{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-button-ios-h .button-native.sc-ion-button-ios::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){/*!@:host(:hover)*/.sc-ion-button-ios-h:hover{color:var(--color-hover)}/*!@:host(:hover) .button-native::after*/.sc-ion-button-ios-h:hover .button-native.sc-ion-button-ios::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}/*!@:host(.button-solid.ion-color) .button-native*/.button-solid.ion-color.sc-ion-button-ios-h .button-native.sc-ion-button-ios{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host(.button-outline.ion-color) .button-native*/.button-outline.ion-color.sc-ion-button-ios-h .button-native.sc-ion-button-ios{border-color:var(--ion-color-base);background:transparent;color:var(--ion-color-base)}/*!@:host(.button-clear.ion-color) .button-native*/.button-clear.ion-color.sc-ion-button-ios-h .button-native.sc-ion-button-ios{background:transparent;color:var(--ion-color-base)}/*!@:host(.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native*/.in-toolbar.sc-ion-button-ios-h:not(.ion-color):not(.in-toolbar-color) .button-native.sc-ion-button-ios{color:var(--ion-toolbar-color, var(--color))}/*!@:host(.button-outline.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native*/.button-outline.in-toolbar.sc-ion-button-ios-h:not(.ion-color):not(.in-toolbar-color) .button-native.sc-ion-button-ios{border-color:var(--ion-toolbar-color, var(--color, var(--border-color)))}/*!@:host(.button-solid.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native*/.button-solid.in-toolbar.sc-ion-button-ios-h:not(.ion-color):not(.in-toolbar-color) .button-native.sc-ion-button-ios{background:var(--ion-toolbar-color, var(--background));color:var(--ion-toolbar-background, var(--color))}/*!@:host*/.sc-ion-button-ios-h{--border-radius:10px;--padding-top:0;--padding-bottom:0;--padding-start:1em;--padding-end:1em;--transition:background-color, opacity 100ms linear;margin-left:2px;margin-right:2px;margin-top:4px;margin-bottom:4px;height:2.8em;font-size:16px;font-weight:500;letter-spacing:-0.03em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-button-ios-h{margin-left:unset;margin-right:unset;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px}}/*!@:host(.button-solid)*/.button-solid.sc-ion-button-ios-h{--background-activated:var(--ion-color-primary-shade, #3171e0);--background-focused:var(--ion-color-primary-shade, #3171e0);--background-hover:var(--ion-color-primary-tint, #4c8dff);--background-activated-opacity:1;--background-focused-opacity:1;--background-hover-opacity:1}/*!@:host(.button-outline)*/.button-outline.sc-ion-button-ios-h{--border-radius:10px;--border-width:1px;--border-style:solid;--background-activated:var(--ion-color-primary, #3880ff);--background-focused:var(--ion-color-primary, #3880ff);--background-hover:transparent;--background-focused-opacity:.1;--color-activated:var(--ion-color-primary-contrast, #fff)}/*!@:host(.button-clear)*/.button-clear.sc-ion-button-ios-h{--background-activated:transparent;--background-focused:var(--ion-color-primary, #3880ff);--background-hover:transparent;--background-focused-opacity:.1;font-size:17px;font-weight:normal;letter-spacing:0}/*!@:host(.button-large)*/.button-large.sc-ion-button-ios-h{--border-radius:12px;--padding-top:0;--padding-start:1em;--padding-end:1em;--padding-bottom:0;height:2.8em;font-size:20px}/*!@:host(.button-small)*/.button-small.sc-ion-button-ios-h{--border-radius:6px;--padding-top:0;--padding-start:0.9em;--padding-end:0.9em;--padding-bottom:0;height:2.1em;font-size:13px}/*!@:host(.button-round)*/.button-round.sc-ion-button-ios-h{--border-radius:64px;--padding-top:0;--padding-start:26px;--padding-end:26px;--padding-bottom:0}/*!@:host(.button-strong)*/.button-strong.sc-ion-button-ios-h{font-weight:600}/*!@:host(.button-clear.ion-activated)*/.button-clear.ion-activated.sc-ion-button-ios-h{opacity:0.4}/*!@:host(.button-outline.ion-activated.ion-color) .button-native*/.button-outline.ion-activated.ion-color.sc-ion-button-ios-h .button-native.sc-ion-button-ios{color:var(--ion-color-contrast)}/*!@:host(.button-outline.ion-activated.ion-color) .button-native::after*/.button-outline.ion-activated.ion-color.sc-ion-button-ios-h .button-native.sc-ion-button-ios::after{background:var(--ion-color-base)}/*!@:host(.button-solid.ion-color.ion-activated) .button-native::after*/.button-solid.ion-color.ion-activated.sc-ion-button-ios-h .button-native.sc-ion-button-ios::after{background:var(--ion-color-shade)}/*!@:host(.button-outline.ion-focused.ion-color) .button-native,\n:host(.button-clear.ion-focused.ion-color) .button-native*/.button-outline.ion-focused.ion-color.sc-ion-button-ios-h .button-native.sc-ion-button-ios,.button-clear.ion-focused.ion-color.sc-ion-button-ios-h .button-native.sc-ion-button-ios{color:var(--ion-color-base)}/*!@:host(.button-outline.ion-focused.ion-color) .button-native::after,\n:host(.button-clear.ion-focused.ion-color) .button-native::after*/.button-outline.ion-focused.ion-color.sc-ion-button-ios-h .button-native.sc-ion-button-ios::after,.button-clear.ion-focused.ion-color.sc-ion-button-ios-h .button-native.sc-ion-button-ios::after{background:var(--ion-color-base)}/*!@:host(.button-solid.ion-color.ion-focused) .button-native::after*/.button-solid.ion-color.ion-focused.sc-ion-button-ios-h .button-native.sc-ion-button-ios::after{background:var(--ion-color-shade)}@media (any-hover: hover){/*!@:host(.button-clear:hover),\n:host(.button-outline:hover)*/.button-clear.sc-ion-button-ios-h:hover,.button-outline.sc-ion-button-ios-h:hover{opacity:0.6}/*!@:host(.button-clear.ion-color:hover) .button-native,\n:host(.button-outline.ion-color:hover) .button-native*/.button-clear.ion-color.sc-ion-button-ios-h:hover .button-native.sc-ion-button-ios,.button-outline.ion-color.sc-ion-button-ios-h:hover .button-native.sc-ion-button-ios{color:var(--ion-color-base)}/*!@:host(.button-clear.ion-color:hover) .button-native::after,\n:host(.button-outline.ion-color:hover) .button-native::after*/.button-clear.ion-color.sc-ion-button-ios-h:hover .button-native.sc-ion-button-ios::after,.button-outline.ion-color.sc-ion-button-ios-h:hover .button-native.sc-ion-button-ios::after{background:transparent}/*!@:host(.button-solid.ion-color:hover) .button-native::after*/.button-solid.ion-color.sc-ion-button-ios-h:hover .button-native.sc-ion-button-ios::after{background:var(--ion-color-tint)}/*!@:host(:hover.button-solid.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native::after*/.sc-ion-button-ios-h:hover.button-solid.in-toolbar:not(.ion-color):not(.in-toolbar-color) .button-native.sc-ion-button-ios::after{background:#fff;opacity:0.1}}";
const buttonMdCss = "/*!@:host*/.sc-ion-button-md-h{--overflow:hidden;--ripple-color:currentColor;--border-width:initial;--border-color:initial;--border-style:initial;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--box-shadow:none;display:inline-block;width:auto;color:var(--color);font-family:var(--ion-font-family, inherit);text-align:center;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:top;vertical-align:-webkit-baseline-middle;-webkit-font-kerning:none;font-kerning:none}/*!@:host(.button-disabled)*/.button-disabled.sc-ion-button-md-h{cursor:default;opacity:0.5;pointer-events:none}/*!@:host(.button-solid)*/.button-solid.sc-ion-button-md-h{--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff)}/*!@:host(.button-outline)*/.button-outline.sc-ion-button-md-h{--border-color:var(--ion-color-primary, #3880ff);--background:transparent;--color:var(--ion-color-primary, #3880ff)}/*!@:host(.button-clear)*/.button-clear.sc-ion-button-md-h{--border-width:0;--background:transparent;--color:var(--ion-color-primary, #3880ff)}/*!@:host(.button-block)*/.button-block.sc-ion-button-md-h{display:block}/*!@:host(.button-block) .button-native*/.button-block.sc-ion-button-md-h .button-native.sc-ion-button-md{margin-left:0;margin-right:0;display:block;width:100%;clear:both;contain:content}/*!@:host(.button-block) .button-native::after*/.button-block.sc-ion-button-md-h .button-native.sc-ion-button-md::after{clear:both}/*!@:host(.button-full)*/.button-full.sc-ion-button-md-h{display:block}/*!@:host(.button-full) .button-native*/.button-full.sc-ion-button-md-h .button-native.sc-ion-button-md{margin-left:0;margin-right:0;display:block;width:100%;contain:content}/*!@:host(.button-full:not(.button-round)) .button-native*/.button-full.sc-ion-button-md-h:not(.button-round) .button-native.sc-ion-button-md{border-radius:0;border-right-width:0;border-left-width:0}/*!@.button-native*/.button-native.sc-ion-button-md{border-radius:var(--border-radius);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;position:relative;width:100%;height:100%;-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);line-height:1;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);contain:layout style;cursor:pointer;opacity:var(--opacity);overflow:var(--overflow);z-index:0;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-button-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.button-native::-moz-focus-inner*/.button-native.sc-ion-button-md::-moz-focus-inner{border:0}/*!@.button-inner*/.button-inner.sc-ion-button-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}/*!@::slotted(ion-icon)*/.sc-ion-button-md-s>ion-icon{font-size:1.4em;pointer-events:none}/*!@::slotted(ion-icon[slot=start])*/.sc-ion-button-md-s>ion-icon[slot=start]{margin-left:-0.3em;margin-right:0.3em;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon[slot=start])*/.sc-ion-button-md-s>ion-icon[slot=start]{margin-left:unset;margin-right:unset;-webkit-margin-start:-0.3em;margin-inline-start:-0.3em;-webkit-margin-end:0.3em;margin-inline-end:0.3em}}/*!@::slotted(ion-icon[slot=end])*/.sc-ion-button-md-s>ion-icon[slot=end]{margin-left:0.3em;margin-right:-0.2em;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon[slot=end])*/.sc-ion-button-md-s>ion-icon[slot=end]{margin-left:unset;margin-right:unset;-webkit-margin-start:0.3em;margin-inline-start:0.3em;-webkit-margin-end:-0.2em;margin-inline-end:-0.2em}}/*!@::slotted(ion-icon[slot=icon-only])*/.sc-ion-button-md-s>ion-icon[slot=icon-only]{font-size:1.8em}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-button-md{color:var(--ripple-color)}/*!@.button-native::after*/.button-native.sc-ion-button-md::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}/*!@:host(.ion-activated)*/.ion-activated.sc-ion-button-md-h{color:var(--color-activated)}/*!@:host(.ion-activated) .button-native::after*/.ion-activated.sc-ion-button-md-h .button-native.sc-ion-button-md::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}/*!@:host(.ion-focused)*/.ion-focused.sc-ion-button-md-h{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-button-md-h .button-native.sc-ion-button-md::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){/*!@:host(:hover)*/.sc-ion-button-md-h:hover{color:var(--color-hover)}/*!@:host(:hover) .button-native::after*/.sc-ion-button-md-h:hover .button-native.sc-ion-button-md::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}/*!@:host(.button-solid.ion-color) .button-native*/.button-solid.ion-color.sc-ion-button-md-h .button-native.sc-ion-button-md{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host(.button-outline.ion-color) .button-native*/.button-outline.ion-color.sc-ion-button-md-h .button-native.sc-ion-button-md{border-color:var(--ion-color-base);background:transparent;color:var(--ion-color-base)}/*!@:host(.button-clear.ion-color) .button-native*/.button-clear.ion-color.sc-ion-button-md-h .button-native.sc-ion-button-md{background:transparent;color:var(--ion-color-base)}/*!@:host(.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native*/.in-toolbar.sc-ion-button-md-h:not(.ion-color):not(.in-toolbar-color) .button-native.sc-ion-button-md{color:var(--ion-toolbar-color, var(--color))}/*!@:host(.button-outline.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native*/.button-outline.in-toolbar.sc-ion-button-md-h:not(.ion-color):not(.in-toolbar-color) .button-native.sc-ion-button-md{border-color:var(--ion-toolbar-color, var(--color, var(--border-color)))}/*!@:host(.button-solid.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native*/.button-solid.in-toolbar.sc-ion-button-md-h:not(.ion-color):not(.in-toolbar-color) .button-native.sc-ion-button-md{background:var(--ion-toolbar-color, var(--background));color:var(--ion-toolbar-background, var(--color))}/*!@:host*/.sc-ion-button-md-h{--border-radius:4px;--padding-top:0;--padding-bottom:0;--padding-start:1.1em;--padding-end:1.1em;--transition:box-shadow 280ms cubic-bezier(.4, 0, .2, 1),\n background-color 15ms linear,\n color 15ms linear;margin-left:2px;margin-right:2px;margin-top:4px;margin-bottom:4px;height:36px;font-size:14px;font-weight:500;letter-spacing:0.06em;text-transform:uppercase}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-button-md-h{margin-left:unset;margin-right:unset;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px}}/*!@:host(.button-solid)*/.button-solid.sc-ion-button-md-h{--background-activated:transparent;--background-hover:var(--ion-color-primary-contrast, #fff);--background-focused:var(--ion-color-primary-contrast, #fff);--background-activated-opacity:0;--background-focused-opacity:.24;--background-hover-opacity:.08;--box-shadow:0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12)}/*!@:host(.button-solid.ion-activated)*/.button-solid.ion-activated.sc-ion-button-md-h{--box-shadow:0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12)}/*!@:host(.button-outline)*/.button-outline.sc-ion-button-md-h{--border-width:2px;--border-style:solid;--box-shadow:none;--background-activated:transparent;--background-focused:var(--ion-color-primary, #3880ff);--background-hover:var(--ion-color-primary, #3880ff);--background-activated-opacity:0;--background-focused-opacity:.12;--background-hover-opacity:.04}/*!@:host(.button-outline.ion-activated.ion-color) .button-native*/.button-outline.ion-activated.ion-color.sc-ion-button-md-h .button-native.sc-ion-button-md{background:transparent}/*!@:host(.button-clear)*/.button-clear.sc-ion-button-md-h{--background-activated:transparent;--background-focused:var(--ion-color-primary, #3880ff);--background-hover:var(--ion-color-primary, #3880ff);--background-activated-opacity:0;--background-focused-opacity:.12;--background-hover-opacity:.04}/*!@:host(.button-round)*/.button-round.sc-ion-button-md-h{--border-radius:64px;--padding-top:0;--padding-start:26px;--padding-end:26px;--padding-bottom:0}/*!@:host(.button-large)*/.button-large.sc-ion-button-md-h{--padding-top:0;--padding-start:1em;--padding-end:1em;--padding-bottom:0;height:2.8em;font-size:20px}/*!@:host(.button-small)*/.button-small.sc-ion-button-md-h{--padding-top:0;--padding-start:0.9em;--padding-end:0.9em;--padding-bottom:0;height:2.1em;font-size:13px}/*!@:host(.button-strong)*/.button-strong.sc-ion-button-md-h{font-weight:bold}/*!@::slotted(ion-icon[slot=icon-only])*/.sc-ion-button-md-s>ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}/*!@:host(.button-solid.ion-color.ion-focused) .button-native::after*/.button-solid.ion-color.ion-focused.sc-ion-button-md-h .button-native.sc-ion-button-md::after{background:var(--ion-color-contrast)}/*!@:host(.button-clear.ion-color.ion-focused) .button-native::after,\n:host(.button-outline.ion-color.ion-focused) .button-native::after*/.button-clear.ion-color.ion-focused.sc-ion-button-md-h .button-native.sc-ion-button-md::after,.button-outline.ion-color.ion-focused.sc-ion-button-md-h .button-native.sc-ion-button-md::after{background:var(--ion-color-base)}@media (any-hover: hover){/*!@:host(.button-solid.ion-color:hover) .button-native::after*/.button-solid.ion-color.sc-ion-button-md-h:hover .button-native.sc-ion-button-md::after{background:var(--ion-color-contrast)}/*!@:host(.button-clear.ion-color:hover) .button-native::after,\n:host(.button-outline.ion-color:hover) .button-native::after*/.button-clear.ion-color.sc-ion-button-md-h:hover .button-native.sc-ion-button-md::after,.button-outline.ion-color.sc-ion-button-md-h:hover .button-native.sc-ion-button-md::after{background:var(--ion-color-base)}}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @slot - Content is placed between the named slots if provided without a slot.
* @slot icon-only - Should be used on an icon in a button that has no text.
* @slot start - Content is placed to the left of the button text in LTR, and to the right in RTL.
* @slot end - Content is placed to the right of the button text in LTR, and to the left in RTL.
*
* @part native - The native HTML button or anchor element that wraps all child elements.
*/
class Button {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionFocus = createEvent(this, "ionFocus", 7);
this.ionBlur = createEvent(this, "ionBlur", 7);
this.inItem = false;
this.inListHeader = false;
this.inToolbar = false;
this.inheritedAttributes = {};
/**
* The type of button.
*/
this.buttonType = 'button';
/**
* If `true`, the user cannot interact with the button.
*/
this.disabled = false;
/**
* When using a router, it specifies the transition direction when navigating to
* another page using `href`.
*/
this.routerDirection = 'forward';
/**
* If `true`, activates a button with a heavier font weight.
*/
this.strong = false;
/**
* The type of the button.
*/
this.type = 'button';
this.handleClick = (ev) => {
if (this.type === 'button') {
openURL(this.href, ev, this.routerDirection, this.routerAnimation);
}
else if (hasShadowDom(this.el)) {
// this button wants to specifically submit a form
// climb up the dom to see if we're in a <form>
// and if so, then use JS to submit it
const form = this.el.closest('form');
if (form) {
ev.preventDefault();
const fakeButton = document.createElement('button');
fakeButton.type = this.type;
fakeButton.style.display = 'none';
form.appendChild(fakeButton);
fakeButton.click();
fakeButton.remove();
}
}
};
this.onFocus = () => {
this.ionFocus.emit();
};
this.onBlur = () => {
this.ionBlur.emit();
};
}
componentWillLoad() {
this.inToolbar = !!this.el.closest('ion-buttons');
this.inListHeader = !!this.el.closest('ion-list-header');
this.inItem = !!this.el.closest('ion-item') || !!this.el.closest('ion-item-divider');
this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);
}
get hasIconOnly() {
return !!this.el.querySelector('[slot="icon-only"]');
}
get rippleType() {
const hasClearFill = this.fill === undefined || this.fill === 'clear';
// If the button is in a toolbar, has a clear fill (which is the default)
// and only has an icon we use the unbounded "circular" ripple effect
if (hasClearFill && this.hasIconOnly && this.inToolbar) {
return 'unbounded';
}
return 'bounded';
}
render() {
const mode = getIonMode$1(this);
const { buttonType, type, disabled, rel, target, size, href, color, expand, hasIconOnly, shape, strong, inheritedAttributes } = this;
const finalSize = size === undefined && this.inItem ? 'small' : size;
const TagType = href === undefined ? 'button' : 'a';
const attrs = (TagType === 'button')
? { type }
: {
download: this.download,
href,
rel,
target
};
let fill = this.fill;
if (fill === undefined) {
fill = this.inToolbar || this.inListHeader ? 'clear' : 'solid';
}
return (hAsync(Host, { onClick: this.handleClick, "aria-disabled": disabled ? 'true' : null, class: createColorClasses$1(color, {
[mode]: true,
[buttonType]: true,
[`${buttonType}-${expand}`]: expand !== undefined,
[`${buttonType}-${finalSize}`]: finalSize !== undefined,
[`${buttonType}-${shape}`]: shape !== undefined,
[`${buttonType}-${fill}`]: true,
[`${buttonType}-strong`]: strong,
'in-toolbar': hostContext('ion-toolbar', this.el),
'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
'button-has-icon-only': hasIconOnly,
'button-disabled': disabled,
'ion-activatable': true,
'ion-focusable': true,
}) }, hAsync(TagType, Object.assign({}, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur }, inheritedAttributes), hAsync("span", { class: "button-inner" }, hAsync("slot", { name: "icon-only" }), hAsync("slot", { name: "start" }), hAsync("slot", null), hAsync("slot", { name: "end" })), mode === 'md' && hAsync("ion-ripple-effect", { type: this.rippleType }))));
}
get el() { return getElement(this); }
static get style() { return {
ios: buttonIosCss,
md: buttonMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-button",
"$members$": {
"color": [513],
"buttonType": [1025, "button-type"],
"disabled": [516],
"expand": [513],
"fill": [1537],
"routerDirection": [1, "router-direction"],
"routerAnimation": [16],
"download": [1],
"href": [1],
"rel": [1],
"shape": [513],
"size": [513],
"strong": [4],
"target": [1],
"type": [1]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"], ["disabled", "disabled"], ["expand", "expand"], ["fill", "fill"], ["shape", "shape"], ["size", "size"]]
}; }
}
const buttonsIosCss = ".sc-ion-buttons-ios-h{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-webkit-transform:translateZ(0);transform:translateZ(0);z-index:99}.sc-ion-buttons-ios-s ion-button{--padding-top:0;--padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-buttons-ios-s ion-button{--padding-start:5px;--padding-end:5px;margin-left:2px;margin-right:2px;height:32px;font-size:17px;font-weight:400}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.sc-ion-buttons-ios-s ion-button{margin-left:unset;margin-right:unset;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px}}.sc-ion-buttons-ios-s ion-button:not(.button-round){--border-radius:4px}.sc-ion-buttons-ios-h.ion-color.sc-ion-buttons-ios-s .button,.ion-color .sc-ion-buttons-ios-h.sc-ion-buttons-ios-s .button{--color:initial;--border-color:initial;--background-focused:var(--ion-color-contrast)}.sc-ion-buttons-ios-h.ion-color.sc-ion-buttons-ios-s .button-solid,.ion-color .sc-ion-buttons-ios-h.sc-ion-buttons-ios-s .button-solid{--background:var(--ion-color-contrast);--background-focused:#000;--background-focused-opacity:.12;--background-activated:#000;--background-activated-opacity:.12;--background-hover:var(--ion-color-base);--background-hover-opacity:0.45;--color:var(--ion-color-base);--color-focused:var(--ion-color-base)}.sc-ion-buttons-ios-h.ion-color.sc-ion-buttons-ios-s .button-clear,.ion-color .sc-ion-buttons-ios-h.sc-ion-buttons-ios-s .button-clear{--color-activated:var(--ion-color-contrast);--color-focused:var(--ion-color-contrast)}.sc-ion-buttons-ios-h.ion-color.sc-ion-buttons-ios-s .button-outline,.ion-color .sc-ion-buttons-ios-h.sc-ion-buttons-ios-s .button-outline{--color-activated:var(--ion-color-base);--color-focused:var(--ion-color-contrast)}.sc-ion-buttons-ios-s .button-clear,.sc-ion-buttons-ios-s .button-outline{--background-activated:transparent;--background-focused:currentColor;--background-hover:transparent}.sc-ion-buttons-ios-s .button-solid:not(.ion-color){--background-focused:#000;--background-focused-opacity:.12;--background-activated:#000;--background-activated-opacity:.12}.sc-ion-buttons-ios-s ion-icon[slot=start]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;margin-right:0.3em;font-size:24px;line-height:0.67}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.sc-ion-buttons-ios-s ion-icon[slot=start]{margin-right:unset;-webkit-margin-end:0.3em;margin-inline-end:0.3em}}.sc-ion-buttons-ios-s ion-icon[slot=end]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;margin-left:0.4em;font-size:24px;line-height:0.67}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.sc-ion-buttons-ios-s ion-icon[slot=end]{margin-left:unset;-webkit-margin-start:0.4em;margin-inline-start:0.4em}}.sc-ion-buttons-ios-s ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;font-size:28px;line-height:0.67}";
const buttonsMdCss = ".sc-ion-buttons-md-h{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-webkit-transform:translateZ(0);transform:translateZ(0);z-index:99}.sc-ion-buttons-md-s ion-button{--padding-top:0;--padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-buttons-md-s ion-button{--padding-top:0;--padding-bottom:0;--padding-start:8px;--padding-end:8px;--box-shadow:none;margin-left:2px;margin-right:2px;height:32px;font-size:14px;font-weight:500}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.sc-ion-buttons-md-s ion-button{margin-left:unset;margin-right:unset;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px}}.sc-ion-buttons-md-s ion-button:not(.button-round){--border-radius:2px}.sc-ion-buttons-md-h.ion-color.sc-ion-buttons-md-s .button,.ion-color .sc-ion-buttons-md-h.sc-ion-buttons-md-s .button{--color:initial;--color-focused:var(--ion-color-contrast);--color-hover:var(--ion-color-contrast);--background-activated:transparent;--background-focused:var(--ion-color-contrast);--background-hover:var(--ion-color-contrast)}.sc-ion-buttons-md-h.ion-color.sc-ion-buttons-md-s .button-solid,.ion-color .sc-ion-buttons-md-h.sc-ion-buttons-md-s .button-solid{--background:var(--ion-color-contrast);--background-activated:transparent;--background-focused:var(--ion-color-shade);--background-hover:var(--ion-color-base);--color:var(--ion-color-base);--color-focused:var(--ion-color-base);--color-hover:var(--ion-color-base)}.sc-ion-buttons-md-h.ion-color.sc-ion-buttons-md-s .button-outline,.ion-color .sc-ion-buttons-md-h.sc-ion-buttons-md-s .button-outline{--border-color:var(--ion-color-contrast)}.sc-ion-buttons-md-s .button-has-icon-only.button-clear{--padding-top:12px;--padding-end:12px;--padding-bottom:12px;--padding-start:12px;--border-radius:50%;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;width:48px;height:48px}.sc-ion-buttons-md-s .button{--background-hover:currentColor}.sc-ion-buttons-md-s .button-solid{--color:var(--ion-toolbar-background, var(--ion-background-color, #fff));--background:var(--ion-toolbar-color, var(--ion-text-color, #424242));--background-activated:transparent;--background-focused:currentColor}.sc-ion-buttons-md-s .button-outline{--color:initial;--background:transparent;--background-activated:transparent;--background-focused:currentColor;--background-hover:currentColor;--border-color:currentColor}.sc-ion-buttons-md-s .button-clear{--color:initial;--background:transparent;--background-activated:transparent;--background-focused:currentColor;--background-hover:currentColor}.sc-ion-buttons-md-s ion-icon[slot=start]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;margin-right:0.3em;font-size:1.4em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.sc-ion-buttons-md-s ion-icon[slot=start]{margin-right:unset;-webkit-margin-end:0.3em;margin-inline-end:0.3em}}.sc-ion-buttons-md-s ion-icon[slot=end]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;margin-left:0.4em;font-size:1.4em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.sc-ion-buttons-md-s ion-icon[slot=end]{margin-left:unset;-webkit-margin-start:0.4em;margin-inline-start:0.4em}}.sc-ion-buttons-md-s ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;font-size:1.8em}";
class Buttons {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If true, buttons will disappear when its
* parent toolbar has fully collapsed if the toolbar
* is not the first toolbar. If the toolbar is the
* first toolbar, the buttons will be hidden and will
* only be shown once all toolbars have fully collapsed.
*
* Only applies in `ios` mode with `collapse` set to
* `true` on `ion-header`.
*
* Typically used for [Collapsible Large Titles](https://ionicframework.com/docs/api/title#collapsible-large-titles)
*/
this.collapse = false;
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
['buttons-collapse']: this.collapse
} }));
}
static get style() { return {
ios: buttonsIosCss,
md: buttonsMdCss
}; }
static get cmpMeta() { return {
"$flags$": 34,
"$tagName$": "ion-buttons",
"$members$": {
"collapse": [4]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const cardIosCss = "/*!@:host*/.sc-ion-card-ios-h{--ion-safe-area-left:0px;--ion-safe-area-right:0px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;position:relative;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);overflow:hidden}/*!@:host(.ion-color)*/.ion-color.sc-ion-card-ios-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host(.card-disabled)*/.card-disabled.sc-ion-card-ios-h{cursor:default;opacity:0.3;pointer-events:none}/*!@.card-native*/.card-native.sc-ion-card-ios{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;width:100%;min-height:var(--min-height);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:inherit}/*!@.card-native::-moz-focus-inner*/.card-native.sc-ion-card-ios::-moz-focus-inner{border:0}/*!@button, a*/button.sc-ion-card-ios,a.sc-ion-card-ios{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-card-ios{color:var(--ripple-color)}/*!@:host*/.sc-ion-card-ios-h{--background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));--color:var(--ion-card-color, var(--ion-item-color, var(--ion-color-step-600, #666666)));margin-left:16px;margin-right:16px;margin-top:24px;margin-bottom:24px;border-radius:8px;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition:-webkit-transform 500ms cubic-bezier(0.12, 0.72, 0.29, 1);transition:-webkit-transform 500ms cubic-bezier(0.12, 0.72, 0.29, 1);transition:transform 500ms cubic-bezier(0.12, 0.72, 0.29, 1);transition:transform 500ms cubic-bezier(0.12, 0.72, 0.29, 1), -webkit-transform 500ms cubic-bezier(0.12, 0.72, 0.29, 1);font-size:14px;-webkit-box-shadow:0 4px 16px rgba(0, 0, 0, 0.12);box-shadow:0 4px 16px rgba(0, 0, 0, 0.12)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-card-ios-h{margin-left:unset;margin-right:unset;-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:16px;margin-inline-end:16px}}/*!@:host(.ion-activated)*/.ion-activated.sc-ion-card-ios-h{-webkit-transform:scale3d(0.97, 0.97, 1);transform:scale3d(0.97, 0.97, 1)}";
const cardMdCss = "/*!@:host*/.sc-ion-card-md-h{--ion-safe-area-left:0px;--ion-safe-area-right:0px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;position:relative;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);overflow:hidden}/*!@:host(.ion-color)*/.ion-color.sc-ion-card-md-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host(.card-disabled)*/.card-disabled.sc-ion-card-md-h{cursor:default;opacity:0.3;pointer-events:none}/*!@.card-native*/.card-native.sc-ion-card-md{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;width:100%;min-height:var(--min-height);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:inherit}/*!@.card-native::-moz-focus-inner*/.card-native.sc-ion-card-md::-moz-focus-inner{border:0}/*!@button, a*/button.sc-ion-card-md,a.sc-ion-card-md{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-card-md{color:var(--ripple-color)}/*!@:host*/.sc-ion-card-md-h{--background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));--color:var(--ion-card-color, var(--ion-item-color, var(--ion-color-step-550, #737373)));margin-left:10px;margin-right:10px;margin-top:10px;margin-bottom:10px;border-radius:4px;font-size:14px;-webkit-box-shadow:0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);box-shadow:0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-card-md-h{margin-left:unset;margin-right:unset;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:10px;margin-inline-end:10px}}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part native - The native HTML button, anchor, or div element that wraps all child elements.
*/
class Card {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If `true`, a button tag will be rendered and the card will be tappable.
*/
this.button = false;
/**
* The type of the button. Only used when an `onclick` or `button` property is present.
*/
this.type = 'button';
/**
* If `true`, the user cannot interact with the card.
*/
this.disabled = false;
/**
* When using a router, it specifies the transition direction when navigating to
* another page using `href`.
*/
this.routerDirection = 'forward';
}
isClickable() {
return (this.href !== undefined || this.button);
}
renderCard(mode) {
const clickable = this.isClickable();
if (!clickable) {
return [
hAsync("slot", null)
];
}
const { href, routerAnimation, routerDirection } = this;
const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div';
const attrs = (TagType === 'button')
? { type: this.type }
: {
download: this.download,
href: this.href,
rel: this.rel,
target: this.target
};
return (hAsync(TagType, Object.assign({}, attrs, { class: "card-native", part: "native", disabled: this.disabled, onClick: (ev) => openURL(href, ev, routerDirection, routerAnimation) }), hAsync("slot", null), clickable && mode === 'md' && hAsync("ion-ripple-effect", null)));
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: createColorClasses$1(this.color, {
[mode]: true,
'card-disabled': this.disabled,
'ion-activatable': this.isClickable()
}) }, this.renderCard(mode)));
}
static get style() { return {
ios: cardIosCss,
md: cardMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-card",
"$members$": {
"color": [513],
"button": [4],
"type": [1],
"disabled": [4],
"download": [1],
"href": [1],
"rel": [1],
"routerDirection": [1, "router-direction"],
"routerAnimation": [16],
"target": [1]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const cardContentIosCss = "ion-card-content{display:block;position:relative}.card-content-ios{padding-left:20px;padding-right:20px;padding-top:20px;padding-bottom:20px;font-size:16px;line-height:1.4}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.card-content-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:20px;padding-inline-end:20px}}.card-content-ios h1{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:24px;font-weight:normal}.card-content-ios h2{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:16px;font-weight:normal}.card-content-ios h3,.card-content-ios h4,.card-content-ios h5,.card-content-ios h6{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:14px;font-weight:normal}.card-content-ios p{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:14px}ion-card-header+.card-content-ios{padding-top:0}";
const cardContentMdCss = "ion-card-content{display:block;position:relative}.card-content-md{padding-left:16px;padding-right:16px;padding-top:13px;padding-bottom:13px;font-size:14px;line-height:1.5}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.card-content-md{padding-left:unset;padding-right:unset;-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px}}.card-content-md h1{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:24px;font-weight:normal}.card-content-md h2{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:16px;font-weight:normal}.card-content-md h3,.card-content-md h4,.card-content-md h5,.card-content-md h6{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:14px;font-weight:normal}.card-content-md p{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:14px;font-weight:normal;line-height:1.5}ion-card-header+.card-content-md{padding-top:0}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class CardContent {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
// Used internally for styling
[`card-content-${mode}`]: true
} }));
}
static get style() { return {
ios: cardContentIosCss,
md: cardContentMdCss
}; }
static get cmpMeta() { return {
"$flags$": 32,
"$tagName$": "ion-card-content",
"$members$": undefined,
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const cardHeaderIosCss = "/*!@:host*/.sc-ion-card-header-ios-h{--background:transparent;--color:inherit;display:block;position:relative;background:var(--background);color:var(--color)}/*!@:host(.ion-color)*/.ion-color.sc-ion-card-header-ios-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host*/.sc-ion-card-header-ios-h{padding-left:20px;padding-right:20px;padding-top:20px;padding-bottom:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-card-header-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:20px;padding-inline-end:20px}}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){/*!@:host(.card-header-translucent)*/.card-header-translucent.sc-ion-card-header-ios-h{background-color:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.9);-webkit-backdrop-filter:saturate(180%) blur(30px);backdrop-filter:saturate(180%) blur(30px)}}";
const cardHeaderMdCss = "/*!@:host*/.sc-ion-card-header-md-h{--background:transparent;--color:inherit;display:block;position:relative;background:var(--background);color:var(--color)}/*!@:host(.ion-color)*/.ion-color.sc-ion-card-header-md-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host*/.sc-ion-card-header-md-h{padding-left:16px;padding-right:16px;padding-top:16px;padding-bottom:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-card-header-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px}}/*!@::slotted(ion-card-title:not(:first-child)),\n::slotted(ion-card-subtitle:not(:first-child))*/.sc-ion-card-header-md-s>ion-card-title:not(:first-child),.sc-ion-card-header-md-s>ion-card-subtitle:not(:first-child){margin-top:8px}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class CardHeader {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If `true`, the card header will be translucent.
* Only applies when the mode is `"ios"` and the device supports
* [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
*/
this.translucent = false;
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: createColorClasses$1(this.color, {
'card-header-translucent': this.translucent,
'ion-inherit-color': true,
[mode]: true
}) }, hAsync("slot", null)));
}
static get style() { return {
ios: cardHeaderIosCss,
md: cardHeaderMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-card-header",
"$members$": {
"color": [513],
"translucent": [4]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const cardSubtitleIosCss = "/*!@:host*/.sc-ion-card-subtitle-ios-h{display:block;position:relative;color:var(--color)}/*!@:host(.ion-color)*/.ion-color.sc-ion-card-subtitle-ios-h{color:var(--ion-color-base)}/*!@:host*/.sc-ion-card-subtitle-ios-h{--color:var(--ion-color-step-600, #666666);margin-left:0;margin-right:0;margin-top:0;margin-bottom:4px;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-size:12px;font-weight:700;letter-spacing:0.4px;text-transform:uppercase}";
const cardSubtitleMdCss = "/*!@:host*/.sc-ion-card-subtitle-md-h{display:block;position:relative;color:var(--color)}/*!@:host(.ion-color)*/.ion-color.sc-ion-card-subtitle-md-h{color:var(--ion-color-base)}/*!@:host*/.sc-ion-card-subtitle-md-h{--color:var(--ion-color-step-550, #737373);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-size:14px;font-weight:500}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class CardSubtitle {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { role: "heading", "aria-level": "3", class: createColorClasses$1(this.color, {
'ion-inherit-color': true,
[mode]: true
}) }, hAsync("slot", null)));
}
static get style() { return {
ios: cardSubtitleIosCss,
md: cardSubtitleMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-card-subtitle",
"$members$": {
"color": [513]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const cardTitleIosCss = "/*!@:host*/.sc-ion-card-title-ios-h{display:block;position:relative;color:var(--color)}/*!@:host(.ion-color)*/.ion-color.sc-ion-card-title-ios-h{color:var(--ion-color-base)}/*!@:host*/.sc-ion-card-title-ios-h{--color:var(--ion-text-color, #000);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-size:28px;font-weight:700;line-height:1.2}";
const cardTitleMdCss = "/*!@:host*/.sc-ion-card-title-md-h{display:block;position:relative;color:var(--color)}/*!@:host(.ion-color)*/.ion-color.sc-ion-card-title-md-h{color:var(--ion-color-base)}/*!@:host*/.sc-ion-card-title-md-h{--color:var(--ion-color-step-850, #262626);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-size:20px;font-weight:500;line-height:1.2}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class CardTitle {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { role: "heading", "aria-level": "2", class: createColorClasses$1(this.color, {
'ion-inherit-color': true,
[mode]: true
}) }, hAsync("slot", null)));
}
static get style() { return {
ios: cardTitleIosCss,
md: cardTitleMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-card-title",
"$members$": {
"color": [513]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const checkboxIosCss = "/*!@:host*/.sc-ion-checkbox-ios-h{--background-checked:var(--ion-color-primary, #3880ff);--border-color-checked:var(--ion-color-primary, #3880ff);--checkmark-color:var(--ion-color-primary-contrast, #fff);--checkmark-width:1;--transition:none;display:inline-block;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}/*!@:host(.ion-color)*/.ion-color.sc-ion-checkbox-ios-h{--background-checked:var(--ion-color-base);--border-color-checked:var(--ion-color-base);--checkmark-color:var(--ion-color-contrast)}/*!@label*/label.sc-ion-checkbox-ios{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:0}/*!@[dir=rtl] label, :host-context([dir=rtl]) label*/[dir=rtl].sc-ion-checkbox-ios label.sc-ion-checkbox-ios,[dir=rtl].sc-ion-checkbox-ios-h label.sc-ion-checkbox-ios,[dir=rtl] .sc-ion-checkbox-ios-h label.sc-ion-checkbox-ios{left:unset;right:unset;right:0}/*!@label::-moz-focus-inner*/label.sc-ion-checkbox-ios::-moz-focus-inner{border:0}/*!@input*/input.sc-ion-checkbox-ios{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}/*!@.checkbox-icon*/.checkbox-icon.sc-ion-checkbox-ios{border-radius:var(--border-radius);display:block;position:relative;width:100%;height:100%;-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-sizing:border-box;box-sizing:border-box}/*!@.checkbox-icon path*/.checkbox-icon.sc-ion-checkbox-ios path.sc-ion-checkbox-ios{fill:none;stroke:var(--checkmark-color);stroke-width:var(--checkmark-width);opacity:0}/*!@:host(.checkbox-checked) .checkbox-icon,\n:host(.checkbox-indeterminate) .checkbox-icon*/.checkbox-checked.sc-ion-checkbox-ios-h .checkbox-icon.sc-ion-checkbox-ios,.checkbox-indeterminate.sc-ion-checkbox-ios-h .checkbox-icon.sc-ion-checkbox-ios{border-color:var(--border-color-checked);background:var(--background-checked)}/*!@:host(.checkbox-checked) .checkbox-icon path,\n:host(.checkbox-indeterminate) .checkbox-icon path*/.checkbox-checked.sc-ion-checkbox-ios-h .checkbox-icon.sc-ion-checkbox-ios path.sc-ion-checkbox-ios,.checkbox-indeterminate.sc-ion-checkbox-ios-h .checkbox-icon.sc-ion-checkbox-ios path.sc-ion-checkbox-ios{opacity:1}/*!@:host(.checkbox-disabled)*/.checkbox-disabled.sc-ion-checkbox-ios-h{pointer-events:none}/*!@:host*/.sc-ion-checkbox-ios-h{--border-radius:50%;--border-width:1px;--border-style:solid;--border-color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.23);--background:var(--ion-item-background, var(--ion-background-color, #fff));--size:26px;width:var(--size);height:var(--size)}/*!@:host(.checkbox-disabled)*/.checkbox-disabled.sc-ion-checkbox-ios-h{opacity:0.3}/*!@:host(.in-item)*/.in-item.sc-ion-checkbox-ios-h{margin-left:0;margin-right:8px;margin-top:10px;margin-bottom:9px;display:block;position:static}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-item)*/.in-item.sc-ion-checkbox-ios-h{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:8px;margin-inline-end:8px}}/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-checkbox-ios-h{margin-left:2px;margin-right:20px;margin-top:8px;margin-bottom:8px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-checkbox-ios-h{margin-left:unset;margin-right:unset;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:20px;margin-inline-end:20px}}";
const checkboxMdCss = "/*!@:host*/.sc-ion-checkbox-md-h{--background-checked:var(--ion-color-primary, #3880ff);--border-color-checked:var(--ion-color-primary, #3880ff);--checkmark-color:var(--ion-color-primary-contrast, #fff);--checkmark-width:1;--transition:none;display:inline-block;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}/*!@:host(.ion-color)*/.ion-color.sc-ion-checkbox-md-h{--background-checked:var(--ion-color-base);--border-color-checked:var(--ion-color-base);--checkmark-color:var(--ion-color-contrast)}/*!@label*/label.sc-ion-checkbox-md{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:0}/*!@[dir=rtl] label, :host-context([dir=rtl]) label*/[dir=rtl].sc-ion-checkbox-md label.sc-ion-checkbox-md,[dir=rtl].sc-ion-checkbox-md-h label.sc-ion-checkbox-md,[dir=rtl] .sc-ion-checkbox-md-h label.sc-ion-checkbox-md{left:unset;right:unset;right:0}/*!@label::-moz-focus-inner*/label.sc-ion-checkbox-md::-moz-focus-inner{border:0}/*!@input*/input.sc-ion-checkbox-md{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}/*!@.checkbox-icon*/.checkbox-icon.sc-ion-checkbox-md{border-radius:var(--border-radius);display:block;position:relative;width:100%;height:100%;-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-sizing:border-box;box-sizing:border-box}/*!@.checkbox-icon path*/.checkbox-icon.sc-ion-checkbox-md path.sc-ion-checkbox-md{fill:none;stroke:var(--checkmark-color);stroke-width:var(--checkmark-width);opacity:0}/*!@:host(.checkbox-checked) .checkbox-icon,\n:host(.checkbox-indeterminate) .checkbox-icon*/.checkbox-checked.sc-ion-checkbox-md-h .checkbox-icon.sc-ion-checkbox-md,.checkbox-indeterminate.sc-ion-checkbox-md-h .checkbox-icon.sc-ion-checkbox-md{border-color:var(--border-color-checked);background:var(--background-checked)}/*!@:host(.checkbox-checked) .checkbox-icon path,\n:host(.checkbox-indeterminate) .checkbox-icon path*/.checkbox-checked.sc-ion-checkbox-md-h .checkbox-icon.sc-ion-checkbox-md path.sc-ion-checkbox-md,.checkbox-indeterminate.sc-ion-checkbox-md-h .checkbox-icon.sc-ion-checkbox-md path.sc-ion-checkbox-md{opacity:1}/*!@:host(.checkbox-disabled)*/.checkbox-disabled.sc-ion-checkbox-md-h{pointer-events:none}/*!@:host*/.sc-ion-checkbox-md-h{--border-radius:calc(var(--size) * .125);--border-width:2px;--border-style:solid;--border-color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.51);--checkmark-width:3;--background:var(--ion-item-background, var(--ion-background-color, #fff));--transition:background 180ms cubic-bezier(0.4, 0, 0.2, 1);--size:18px;width:var(--size);height:var(--size)}/*!@.checkbox-icon path*/.checkbox-icon.sc-ion-checkbox-md path.sc-ion-checkbox-md{stroke-dasharray:30;stroke-dashoffset:30}/*!@:host(.checkbox-checked) .checkbox-icon path,\n:host(.checkbox-indeterminate) .checkbox-icon path*/.checkbox-checked.sc-ion-checkbox-md-h .checkbox-icon.sc-ion-checkbox-md path.sc-ion-checkbox-md,.checkbox-indeterminate.sc-ion-checkbox-md-h .checkbox-icon.sc-ion-checkbox-md path.sc-ion-checkbox-md{stroke-dashoffset:0;-webkit-transition:stroke-dashoffset 90ms linear 90ms;transition:stroke-dashoffset 90ms linear 90ms}/*!@:host(.checkbox-disabled)*/.checkbox-disabled.sc-ion-checkbox-md-h{opacity:0.3}/*!@:host(.in-item)*/.in-item.sc-ion-checkbox-md-h{margin-left:0;margin-right:0;margin-top:18px;margin-bottom:18px;display:block;position:static}/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-checkbox-md-h{margin-left:4px;margin-right:36px;margin-top:18px;margin-bottom:18px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-checkbox-md-h{margin-left:unset;margin-right:unset;-webkit-margin-start:4px;margin-inline-start:4px;-webkit-margin-end:36px;margin-inline-end:36px}}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part container - The container for the checkbox mark.
* @part mark - The checkmark used to indicate the checked state.
*/
class Checkbox {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionChange = createEvent(this, "ionChange", 7);
this.ionFocus = createEvent(this, "ionFocus", 7);
this.ionBlur = createEvent(this, "ionBlur", 7);
this.ionStyle = createEvent(this, "ionStyle", 7);
this.inputId = `ion-cb-${checkboxIds++}`;
/**
* The name of the control, which is submitted with the form data.
*/
this.name = this.inputId;
/**
* If `true`, the checkbox is selected.
*/
this.checked = false;
/**
* If `true`, the checkbox will visually appear as indeterminate.
*/
this.indeterminate = false;
/**
* If `true`, the user cannot interact with the checkbox.
*/
this.disabled = false;
/**
* The value of the checkbox does not mean if it's checked or not, use the `checked`
* property for that.
*
* The value of a checkbox is analogous to the value of an `<input type="checkbox">`,
* it's only used when the checkbox participates in a native `<form>`.
*/
this.value = 'on';
this.onClick = (ev) => {
ev.preventDefault();
this.setFocus();
this.checked = !this.checked;
this.indeterminate = false;
};
this.onFocus = () => {
this.ionFocus.emit();
};
this.onBlur = () => {
this.ionBlur.emit();
};
}
componentWillLoad() {
this.emitStyle();
}
checkedChanged(isChecked) {
this.ionChange.emit({
checked: isChecked,
value: this.value
});
this.emitStyle();
}
disabledChanged() {
this.emitStyle();
}
emitStyle() {
this.ionStyle.emit({
'checkbox-checked': this.checked,
'interactive-disabled': this.disabled,
});
}
setFocus() {
if (this.focusEl) {
this.focusEl.focus();
}
}
render() {
const { color, checked, disabled, el, indeterminate, inputId, name, value } = this;
const mode = getIonMode$1(this);
const { label, labelId, labelText } = getAriaLabel(el, inputId);
renderHiddenInput(true, el, name, (checked ? value : ''), disabled);
let path = indeterminate
? hAsync("path", { d: "M6 12L18 12", part: "mark" })
: hAsync("path", { d: "M5.9,12.5l3.8,3.8l8.8-8.8", part: "mark" });
if (mode === 'md') {
path = indeterminate
? hAsync("path", { d: "M2 12H22", part: "mark" })
: hAsync("path", { d: "M1.73,12.91 8.1,19.28 22.79,4.59", part: "mark" });
}
return (hAsync(Host, { onClick: this.onClick, "aria-labelledby": label ? labelId : null, "aria-checked": `${checked}`, "aria-hidden": disabled ? 'true' : null, role: "checkbox", class: createColorClasses$1(color, {
[mode]: true,
'in-item': hostContext('ion-item', el),
'checkbox-checked': checked,
'checkbox-disabled': disabled,
'checkbox-indeterminate': indeterminate,
'interactive': true
}) }, hAsync("svg", { class: "checkbox-icon", viewBox: "0 0 24 24", part: "container" }, path), hAsync("label", { htmlFor: inputId }, labelText), hAsync("input", { type: "checkbox", "aria-checked": `${checked}`, disabled: disabled, id: inputId, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: focusEl => this.focusEl = focusEl })));
}
get el() { return getElement(this); }
static get watchers() { return {
"checked": ["checkedChanged"],
"disabled": ["disabledChanged"]
}; }
static get style() { return {
ios: checkboxIosCss,
md: checkboxMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-checkbox",
"$members$": {
"color": [513],
"name": [1],
"checked": [1028],
"indeterminate": [1028],
"disabled": [4],
"value": [1]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
let checkboxIds = 0;
const chipIosCss = "/*!@:host*/.sc-ion-chip-ios-h{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.12);--color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.87);border-radius:16px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:4px;margin-right:4px;margin-top:4px;margin-bottom:4px;padding-left:12px;padding-right:12px;padding-top:7px;padding-bottom:7px;display:-ms-inline-flexbox;display:inline-flex;position:relative;-ms-flex-align:center;align-items:center;height:32px;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);font-size:14px;line-height:1;cursor:pointer;overflow:hidden;vertical-align:middle;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-chip-ios-h{margin-left:unset;margin-right:unset;-webkit-margin-start:4px;margin-inline-start:4px;-webkit-margin-end:4px;margin-inline-end:4px}}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-chip-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px}}/*!@:host(.chip-disabled)*/.chip-disabled.sc-ion-chip-ios-h{cursor:default;opacity:0.4;pointer-events:none}/*!@:host(.ion-color)*/.ion-color.sc-ion-chip-ios-h{background:rgba(var(--ion-color-base-rgb), 0.08);color:var(--ion-color-shade)}/*!@:host(.ion-color:focus)*/.ion-color.sc-ion-chip-ios-h:focus{background:rgba(var(--ion-color-base-rgb), 0.12)}/*!@:host(.ion-color.ion-activated)*/.ion-color.ion-activated.sc-ion-chip-ios-h{background:rgba(var(--ion-color-base-rgb), 0.16)}/*!@:host(.chip-outline)*/.chip-outline.sc-ion-chip-ios-h{border-width:1px;border-style:solid}/*!@:host(.chip-outline)*/.chip-outline.sc-ion-chip-ios-h{border-color:rgba(0, 0, 0, 0.32);background:transparent}/*!@:host(.chip-outline.ion-color)*/.chip-outline.ion-color.sc-ion-chip-ios-h{border-color:rgba(var(--ion-color-base-rgb), 0.32)}/*!@:host(.chip-outline:not(.ion-color):focus)*/.chip-outline.sc-ion-chip-ios-h:not(.ion-color):focus{background:rgba(0, 0, 0, 0.04)}/*!@:host(.chip-outline.ion-activated:not(.ion-color))*/.chip-outline.ion-activated.sc-ion-chip-ios-h:not(.ion-color){background:rgba(0, 0, 0, 0.08)}/*!@::slotted(ion-icon)*/.sc-ion-chip-ios-s>ion-icon{font-size:20px}/*!@:host(:not(.ion-color)) ::slotted(ion-icon)*/.sc-ion-chip-ios-h:not(.ion-color) .sc-ion-chip-ios-s>ion-icon{color:rgba(0, 0, 0, 0.54)}/*!@::slotted(ion-icon:first-child)*/.sc-ion-chip-ios-s>ion-icon:first-child{margin-left:-4px;margin-right:8px;margin-top:-4px;margin-bottom:-4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon:first-child)*/.sc-ion-chip-ios-s>ion-icon:first-child{margin-left:unset;margin-right:unset;-webkit-margin-start:-4px;margin-inline-start:-4px;-webkit-margin-end:8px;margin-inline-end:8px}}/*!@::slotted(ion-icon:last-child)*/.sc-ion-chip-ios-s>ion-icon:last-child{margin-left:8px;margin-right:-4px;margin-top:-4px;margin-bottom:-4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon:last-child)*/.sc-ion-chip-ios-s>ion-icon:last-child{margin-left:unset;margin-right:unset;-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:-4px;margin-inline-end:-4px}}/*!@::slotted(ion-avatar)*/.sc-ion-chip-ios-s>ion-avatar{width:24px;height:24px}/*!@::slotted(ion-avatar:first-child)*/.sc-ion-chip-ios-s>ion-avatar:first-child{margin-left:-8px;margin-right:8px;margin-top:-4px;margin-bottom:-4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-avatar:first-child)*/.sc-ion-chip-ios-s>ion-avatar:first-child{margin-left:unset;margin-right:unset;-webkit-margin-start:-8px;margin-inline-start:-8px;-webkit-margin-end:8px;margin-inline-end:8px}}/*!@::slotted(ion-avatar:last-child)*/.sc-ion-chip-ios-s>ion-avatar:last-child{margin-left:8px;margin-right:-8px;margin-top:-4px;margin-bottom:-4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-avatar:last-child)*/.sc-ion-chip-ios-s>ion-avatar:last-child{margin-left:unset;margin-right:unset;-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:-8px;margin-inline-end:-8px}}/*!@:host(:focus)*/.sc-ion-chip-ios-h:focus{outline:none}/*!@:host(:focus)*/.sc-ion-chip-ios-h:focus{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.16)}/*!@:host(.ion-activated)*/.ion-activated.sc-ion-chip-ios-h{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.2)}@media (any-hover: hover){/*!@:host(:hover)*/.sc-ion-chip-ios-h:hover{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.16)}/*!@:host(.ion-color:hover)*/.ion-color.sc-ion-chip-ios-h:hover{background:rgba(var(--ion-color-base-rgb), 0.12)}/*!@:host(.chip-outline:not(.ion-color):hover)*/.chip-outline.sc-ion-chip-ios-h:not(.ion-color):hover{background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.04)}}";
const chipMdCss = "/*!@:host*/.sc-ion-chip-md-h{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.12);--color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.87);border-radius:16px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:4px;margin-right:4px;margin-top:4px;margin-bottom:4px;padding-left:12px;padding-right:12px;padding-top:7px;padding-bottom:7px;display:-ms-inline-flexbox;display:inline-flex;position:relative;-ms-flex-align:center;align-items:center;height:32px;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);font-size:14px;line-height:1;cursor:pointer;overflow:hidden;vertical-align:middle;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-chip-md-h{margin-left:unset;margin-right:unset;-webkit-margin-start:4px;margin-inline-start:4px;-webkit-margin-end:4px;margin-inline-end:4px}}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-chip-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px}}/*!@:host(.chip-disabled)*/.chip-disabled.sc-ion-chip-md-h{cursor:default;opacity:0.4;pointer-events:none}/*!@:host(.ion-color)*/.ion-color.sc-ion-chip-md-h{background:rgba(var(--ion-color-base-rgb), 0.08);color:var(--ion-color-shade)}/*!@:host(.ion-color:focus)*/.ion-color.sc-ion-chip-md-h:focus{background:rgba(var(--ion-color-base-rgb), 0.12)}/*!@:host(.ion-color.ion-activated)*/.ion-color.ion-activated.sc-ion-chip-md-h{background:rgba(var(--ion-color-base-rgb), 0.16)}/*!@:host(.chip-outline)*/.chip-outline.sc-ion-chip-md-h{border-width:1px;border-style:solid}/*!@:host(.chip-outline)*/.chip-outline.sc-ion-chip-md-h{border-color:rgba(0, 0, 0, 0.32);background:transparent}/*!@:host(.chip-outline.ion-color)*/.chip-outline.ion-color.sc-ion-chip-md-h{border-color:rgba(var(--ion-color-base-rgb), 0.32)}/*!@:host(.chip-outline:not(.ion-color):focus)*/.chip-outline.sc-ion-chip-md-h:not(.ion-color):focus{background:rgba(0, 0, 0, 0.04)}/*!@:host(.chip-outline.ion-activated:not(.ion-color))*/.chip-outline.ion-activated.sc-ion-chip-md-h:not(.ion-color){background:rgba(0, 0, 0, 0.08)}/*!@::slotted(ion-icon)*/.sc-ion-chip-md-s>ion-icon{font-size:20px}/*!@:host(:not(.ion-color)) ::slotted(ion-icon)*/.sc-ion-chip-md-h:not(.ion-color) .sc-ion-chip-md-s>ion-icon{color:rgba(0, 0, 0, 0.54)}/*!@::slotted(ion-icon:first-child)*/.sc-ion-chip-md-s>ion-icon:first-child{margin-left:-4px;margin-right:8px;margin-top:-4px;margin-bottom:-4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon:first-child)*/.sc-ion-chip-md-s>ion-icon:first-child{margin-left:unset;margin-right:unset;-webkit-margin-start:-4px;margin-inline-start:-4px;-webkit-margin-end:8px;margin-inline-end:8px}}/*!@::slotted(ion-icon:last-child)*/.sc-ion-chip-md-s>ion-icon:last-child{margin-left:8px;margin-right:-4px;margin-top:-4px;margin-bottom:-4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon:last-child)*/.sc-ion-chip-md-s>ion-icon:last-child{margin-left:unset;margin-right:unset;-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:-4px;margin-inline-end:-4px}}/*!@::slotted(ion-avatar)*/.sc-ion-chip-md-s>ion-avatar{width:24px;height:24px}/*!@::slotted(ion-avatar:first-child)*/.sc-ion-chip-md-s>ion-avatar:first-child{margin-left:-8px;margin-right:8px;margin-top:-4px;margin-bottom:-4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-avatar:first-child)*/.sc-ion-chip-md-s>ion-avatar:first-child{margin-left:unset;margin-right:unset;-webkit-margin-start:-8px;margin-inline-start:-8px;-webkit-margin-end:8px;margin-inline-end:8px}}/*!@::slotted(ion-avatar:last-child)*/.sc-ion-chip-md-s>ion-avatar:last-child{margin-left:8px;margin-right:-8px;margin-top:-4px;margin-bottom:-4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-avatar:last-child)*/.sc-ion-chip-md-s>ion-avatar:last-child{margin-left:unset;margin-right:unset;-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:-8px;margin-inline-end:-8px}}/*!@:host(:focus)*/.sc-ion-chip-md-h:focus{outline:none}/*!@:host(:focus)*/.sc-ion-chip-md-h:focus{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.16)}/*!@:host(.ion-activated)*/.ion-activated.sc-ion-chip-md-h{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.2)}@media (any-hover: hover){/*!@:host(:hover)*/.sc-ion-chip-md-h:hover{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.16)}/*!@:host(.ion-color:hover)*/.ion-color.sc-ion-chip-md-h:hover{background:rgba(var(--ion-color-base-rgb), 0.12)}/*!@:host(.chip-outline:not(.ion-color):hover)*/.chip-outline.sc-ion-chip-md-h:not(.ion-color):hover{background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.04)}}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Chip {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* Display an outline style button.
*/
this.outline = false;
/**
* If `true`, the user cannot interact with the chip.
*/
this.disabled = false;
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses$1(this.color, {
[mode]: true,
'chip-outline': this.outline,
'chip-disabled': this.disabled,
'ion-activatable': true,
}) }, hAsync("slot", null), mode === 'md' && hAsync("ion-ripple-effect", null)));
}
static get style() { return {
ios: chipIosCss,
md: chipMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-chip",
"$members$": {
"color": [513],
"outline": [4],
"disabled": [4]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const SIZE_TO_MEDIA = {
'xs': '(min-width: 0px)',
'sm': '(min-width: 576px)',
'md': '(min-width: 768px)',
'lg': '(min-width: 992px)',
'xl': '(min-width: 1200px)',
};
// Check if the window matches the media query
// at the breakpoint passed
// e.g. matchBreakpoint('sm') => true if screen width exceeds 576px
const matchBreakpoint = (breakpoint) => {
if (breakpoint === undefined || breakpoint === '') {
return true;
}
if (window.matchMedia) {
const mediaQuery = SIZE_TO_MEDIA[breakpoint];
return window.matchMedia(mediaQuery).matches;
}
return false;
};
const colCss = "/*!@:host*/.sc-ion-col-h{padding-left:var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));padding-right:var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));padding-top:var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));padding-bottom:var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;width:100%;max-width:100%;min-height:1px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-col-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));padding-inline-start:var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));-webkit-padding-end:var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));padding-inline-end:var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px))}}@media (min-width: 576px){/*!@:host*/.sc-ion-col-h{padding-left:var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));padding-right:var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));padding-top:var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));padding-bottom:var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px))}/*!@@supports (margin-inline-start: 0) or (-webkit-margin-start: 0)*/@supports .sc-ion-col (margin-inline-start.sc-ion-col: 0).sc-ion-col or.sc-ion-col (-webkit-margin-start.sc-ion-col: 0).sc-ion-col{.sc-ion-col-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));padding-inline-start:var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));-webkit-padding-end:var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));padding-inline-end:var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px))}}}@media (min-width: 768px){/*!@:host*/.sc-ion-col-h{padding-left:var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));padding-right:var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));padding-top:var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));padding-bottom:var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px))}/*!@@supports (margin-inline-start: 0) or (-webkit-margin-start: 0)*/@supports .sc-ion-col (margin-inline-start.sc-ion-col: 0).sc-ion-col or.sc-ion-col (-webkit-margin-start.sc-ion-col: 0).sc-ion-col{.sc-ion-col-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));padding-inline-start:var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));-webkit-padding-end:var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));padding-inline-end:var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px))}}}@media (min-width: 992px){/*!@:host*/.sc-ion-col-h{padding-left:var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));padding-right:var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));padding-top:var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));padding-bottom:var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px))}/*!@@supports (margin-inline-start: 0) or (-webkit-margin-start: 0)*/@supports .sc-ion-col (margin-inline-start.sc-ion-col: 0).sc-ion-col or.sc-ion-col (-webkit-margin-start.sc-ion-col: 0).sc-ion-col{.sc-ion-col-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));padding-inline-start:var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));-webkit-padding-end:var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));padding-inline-end:var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px))}}}@media (min-width: 1200px){/*!@:host*/.sc-ion-col-h{padding-left:var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));padding-right:var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));padding-top:var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));padding-bottom:var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px))}/*!@@supports (margin-inline-start: 0) or (-webkit-margin-start: 0)*/@supports .sc-ion-col (margin-inline-start.sc-ion-col: 0).sc-ion-col or.sc-ion-col (-webkit-margin-start.sc-ion-col: 0).sc-ion-col{.sc-ion-col-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));padding-inline-start:var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));-webkit-padding-end:var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));padding-inline-end:var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px))}}}";
const win$1 = window;
const SUPPORTS_VARS = !!(win$1.CSS && win$1.CSS.supports && win$1.CSS.supports('--a: 0'));
const BREAKPOINTS = ['', 'xs', 'sm', 'md', 'lg', 'xl'];
class Col {
constructor(hostRef) {
registerInstance(this, hostRef);
}
onResize() {
forceUpdate$1(this);
}
// Loop through all of the breakpoints to see if the media query
// matches and grab the column value from the relevant prop if so
getColumns(property) {
let matched;
for (const breakpoint of BREAKPOINTS) {
const matches = matchBreakpoint(breakpoint);
// Grab the value of the property, if it exists and our
// media query matches we return the value
const columns = this[property + breakpoint.charAt(0).toUpperCase() + breakpoint.slice(1)];
if (matches && columns !== undefined) {
matched = columns;
}
}
// Return the last matched columns since the breakpoints
// increase in size and we want to return the largest match
return matched;
}
calculateSize() {
const columns = this.getColumns('size');
// If size wasn't set for any breakpoint
// or if the user set the size without a value
// it means we need to stick with the default and return
// e.g. <ion-col size-md>
if (!columns || columns === '') {
return;
}
// If the size is set to auto then don't calculate a size
const colSize = (columns === 'auto')
? 'auto'
// If CSS supports variables we should use the grid columns var
: SUPPORTS_VARS ? `calc(calc(${columns} / var(--ion-grid-columns, 12)) * 100%)`
// Convert the columns to a percentage by dividing by the total number
// of columns (12) and then multiplying by 100
: ((columns / 12) * 100) + '%';
return {
'flex': `0 0 ${colSize}`,
'width': `${colSize}`,
'max-width': `${colSize}`
};
}
// Called by push, pull, and offset since they use the same calculations
calculatePosition(property, modifier) {
const columns = this.getColumns(property);
if (!columns) {
return;
}
// If the number of columns passed are greater than 0 and less than
// 12 we can position the column, else default to auto
const amount = SUPPORTS_VARS
// If CSS supports variables we should use the grid columns var
? `calc(calc(${columns} / var(--ion-grid-columns, 12)) * 100%)`
// Convert the columns to a percentage by dividing by the total number
// of columns (12) and then multiplying by 100
: (columns > 0 && columns < 12) ? (columns / 12 * 100) + '%' : 'auto';
return {
[modifier]: amount
};
}
calculateOffset(isRTL) {
return this.calculatePosition('offset', isRTL ? 'margin-right' : 'margin-left');
}
calculatePull(isRTL) {
return this.calculatePosition('pull', isRTL ? 'left' : 'right');
}
calculatePush(isRTL) {
return this.calculatePosition('push', isRTL ? 'right' : 'left');
}
render() {
const isRTL = document.dir === 'rtl';
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true
}, style: Object.assign(Object.assign(Object.assign(Object.assign({}, this.calculateOffset(isRTL)), this.calculatePull(isRTL)), this.calculatePush(isRTL)), this.calculateSize()) }, hAsync("slot", null)));
}
static get style() { return colCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-col",
"$members$": {
"offset": [1],
"offsetXs": [1, "offset-xs"],
"offsetSm": [1, "offset-sm"],
"offsetMd": [1, "offset-md"],
"offsetLg": [1, "offset-lg"],
"offsetXl": [1, "offset-xl"],
"pull": [1],
"pullXs": [1, "pull-xs"],
"pullSm": [1, "pull-sm"],
"pullMd": [1, "pull-md"],
"pullLg": [1, "pull-lg"],
"pullXl": [1, "pull-xl"],
"push": [1],
"pushXs": [1, "push-xs"],
"pushSm": [1, "push-sm"],
"pushMd": [1, "push-md"],
"pushLg": [1, "push-lg"],
"pushXl": [1, "push-xl"],
"size": [1],
"sizeXs": [1, "size-xs"],
"sizeSm": [1, "size-sm"],
"sizeMd": [1, "size-md"],
"sizeLg": [1, "size-lg"],
"sizeXl": [1, "size-xl"]
},
"$listeners$": [[9, "resize", "onResize"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const contentCss = "/*!@:host*/.sc-ion-content-h{--background:var(--ion-background-color, #fff);--color:var(--ion-text-color, #000);--padding-top:0px;--padding-bottom:0px;--padding-start:0px;--padding-end:0px;--keyboard-offset:0px;--offset-top:0px;--offset-bottom:0px;--overflow:auto;display:block;position:relative;-ms-flex:1;flex:1;width:100%;height:100%;margin:0 !important;padding:0 !important;font-family:var(--ion-font-family, inherit);contain:size style}/*!@:host(.ion-color) .inner-scroll*/.ion-color.sc-ion-content-h .inner-scroll.sc-ion-content{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host(.outer-content)*/.outer-content.sc-ion-content-h{--background:var(--ion-color-step-50, #f2f2f2)}/*!@#background-content*/#background-content.sc-ion-content{left:0px;right:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);position:absolute;background:var(--background)}/*!@.inner-scroll*/.inner-scroll.sc-ion-content{left:0px;right:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:calc(var(--padding-top) + var(--offset-top));padding-bottom:calc(var(--padding-bottom) + var(--keyboard-offset) + var(--offset-bottom));position:absolute;color:var(--color);-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.inner-scroll*/.inner-scroll.sc-ion-content{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.scroll-y,\n.scroll-x*/.scroll-y.sc-ion-content,.scroll-x.sc-ion-content{-webkit-overflow-scrolling:touch;z-index:0;will-change:scroll-position}/*!@.scroll-y*/.scroll-y.sc-ion-content{-ms-touch-action:pan-y;touch-action:pan-y;overflow-y:var(--overflow);overscroll-behavior-y:contain}/*!@.scroll-x*/.scroll-x.sc-ion-content{-ms-touch-action:pan-x;touch-action:pan-x;overflow-x:var(--overflow);overscroll-behavior-x:contain}/*!@.scroll-x.scroll-y*/.scroll-x.scroll-y.sc-ion-content{-ms-touch-action:auto;touch-action:auto}/*!@.overscroll::before,\n.overscroll::after*/.overscroll.sc-ion-content::before,.overscroll.sc-ion-content::after{position:absolute;width:1px;height:1px;content:\"\"}/*!@.overscroll::before*/.overscroll.sc-ion-content::before{bottom:-1px}/*!@.overscroll::after*/.overscroll.sc-ion-content::after{top:-1px}/*!@:host(.content-sizing)*/.content-sizing.sc-ion-content-h{contain:none}/*!@:host(.content-sizing) .inner-scroll*/.content-sizing.sc-ion-content-h .inner-scroll.sc-ion-content{position:relative}/*!@.transition-effect*/.transition-effect.sc-ion-content{display:none;position:absolute;left:-100%;width:100%;height:100vh;opacity:0;pointer-events:none}/*!@.transition-cover*/.transition-cover.sc-ion-content{position:absolute;right:0;width:100%;height:100%;background:black;opacity:0.1}/*!@.transition-shadow*/.transition-shadow.sc-ion-content{display:block;position:absolute;right:0;width:10px;height:100%;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAgCAYAAAAIXrg4AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MTE3MDgzRkQ5QTkyMTFFOUEwNzQ5MkJFREE1NUY2MjQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTE3MDgzRkU5QTkyMTFFOUEwNzQ5MkJFREE1NUY2MjQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxMTcwODNGQjlBOTIxMUU5QTA3NDkyQkVEQTU1RjYyNCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoxMTcwODNGQzlBOTIxMUU5QTA3NDkyQkVEQTU1RjYyNCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PmePEuQAAABNSURBVHjaYvz//z8DIxAwMDAwATGMhmFmPDQuOSZks0AMmoJBaQHjkPfB0Lfg/2gQjVow+HPy/yHvg9GiYjQfjMbBqAWjFgy/4hogwADYqwdzxy5BuwAAAABJRU5ErkJggg==);background-repeat:repeat-y;background-size:10px 16px}/*!@::slotted([slot=fixed])*/.sc-ion-content-s>[slot=fixed]{position:absolute}";
/**
* @slot - Content is placed in the scrollable area if provided without a slot.
* @slot fixed - Should be used for fixed content that should not scroll.
*
* @part background - The background of the content.
* @part scroll - The scrollable container of the content.
*/
class Content {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionScrollStart = createEvent(this, "ionScrollStart", 7);
this.ionScroll = createEvent(this, "ionScroll", 7);
this.ionScrollEnd = createEvent(this, "ionScrollEnd", 7);
this.isScrolling = false;
this.lastScroll = 0;
this.queued = false;
this.cTop = -1;
this.cBottom = -1;
this.isMainContent = true;
// Detail is used in a hot loop in the scroll event, by allocating it here
// V8 will be able to inline any read/write to it since it's a monomorphic class.
// https://mrale.ph/blog/2015/01/11/whats-up-with-monomorphism.html
this.detail = {
scrollTop: 0,
scrollLeft: 0,
type: 'scroll',
event: undefined,
startX: 0,
startY: 0,
startTime: 0,
currentX: 0,
currentY: 0,
velocityX: 0,
velocityY: 0,
deltaX: 0,
deltaY: 0,
currentTime: 0,
data: undefined,
isScrolling: true,
};
/**
* If `true`, the content will scroll behind the headers
* and footers. This effect can easily be seen by setting the toolbar
* to transparent.
*/
this.fullscreen = false;
/**
* If you want to enable the content scrolling in the X axis, set this property to `true`.
*/
this.scrollX = false;
/**
* If you want to disable the content scrolling in the Y axis, set this property to `false`.
*/
this.scrollY = true;
/**
* Because of performance reasons, ionScroll events are disabled by default, in order to enable them
* and start listening from (ionScroll), set this property to `true`.
*/
this.scrollEvents = false;
}
connectedCallback() {
this.isMainContent = this.el.closest('ion-menu, ion-popover, ion-modal') === null;
}
disconnectedCallback() {
this.onScrollEnd();
}
onAppLoad() {
this.resize();
}
onClick(ev) {
if (this.isScrolling) {
ev.preventDefault();
ev.stopPropagation();
}
}
shouldForceOverscroll() {
const { forceOverscroll } = this;
const mode = getIonMode$1(this);
return forceOverscroll === undefined
? mode === 'ios' && isPlatform('ios')
: forceOverscroll;
}
resize() {
if (this.fullscreen) {
readTask(() => this.readDimensions());
}
else if (this.cTop !== 0 || this.cBottom !== 0) {
this.cTop = this.cBottom = 0;
forceUpdate$1(this);
}
}
readDimensions() {
const page = getPageElement(this.el);
const top = Math.max(this.el.offsetTop, 0);
const bottom = Math.max(page.offsetHeight - top - this.el.offsetHeight, 0);
const dirty = top !== this.cTop || bottom !== this.cBottom;
if (dirty) {
this.cTop = top;
this.cBottom = bottom;
forceUpdate$1(this);
}
}
onScroll(ev) {
const timeStamp = Date.now();
const shouldStart = !this.isScrolling;
this.lastScroll = timeStamp;
if (shouldStart) {
this.onScrollStart();
}
if (!this.queued && this.scrollEvents) {
this.queued = true;
readTask(ts => {
this.queued = false;
this.detail.event = ev;
updateScrollDetail(this.detail, this.scrollEl, ts, shouldStart);
this.ionScroll.emit(this.detail);
});
}
}
/**
* Get the element where the actual scrolling takes place.
* This element can be used to subscribe to `scroll` events or manually modify
* `scrollTop`. However, it's recommended to use the API provided by `ion-content`:
*
* i.e. Using `ionScroll`, `ionScrollStart`, `ionScrollEnd` for scrolling events
* and `scrollToPoint()` to scroll the content into a certain point.
*/
getScrollElement() {
return Promise.resolve(this.scrollEl);
}
/**
* Scroll to the top of the component.
*
* @param duration The amount of time to take scrolling to the top. Defaults to `0`.
*/
scrollToTop(duration = 0) {
return this.scrollToPoint(undefined, 0, duration);
}
/**
* Scroll to the bottom of the component.
*
* @param duration The amount of time to take scrolling to the bottom. Defaults to `0`.
*/
scrollToBottom(duration = 0) {
const y = this.scrollEl.scrollHeight - this.scrollEl.clientHeight;
return this.scrollToPoint(undefined, y, duration);
}
/**
* Scroll by a specified X/Y distance in the component.
*
* @param x The amount to scroll by on the horizontal axis.
* @param y The amount to scroll by on the vertical axis.
* @param duration The amount of time to take scrolling by that amount.
*/
scrollByPoint(x, y, duration) {
return this.scrollToPoint(x + this.scrollEl.scrollLeft, y + this.scrollEl.scrollTop, duration);
}
/**
* Scroll to a specified X/Y location in the component.
*
* @param x The point to scroll to on the horizontal axis.
* @param y The point to scroll to on the vertical axis.
* @param duration The amount of time to take scrolling to that point. Defaults to `0`.
*/
async scrollToPoint(x, y, duration = 0) {
const el = this.scrollEl;
if (duration < 32) {
if (y != null) {
el.scrollTop = y;
}
if (x != null) {
el.scrollLeft = x;
}
return;
}
let resolve;
let startTime = 0;
const promise = new Promise(r => resolve = r);
const fromY = el.scrollTop;
const fromX = el.scrollLeft;
const deltaY = y != null ? y - fromY : 0;
const deltaX = x != null ? x - fromX : 0;
// scroll loop
const step = (timeStamp) => {
const linearTime = Math.min(1, ((timeStamp - startTime) / duration)) - 1;
const easedT = Math.pow(linearTime, 3) + 1;
if (deltaY !== 0) {
el.scrollTop = Math.floor((easedT * deltaY) + fromY);
}
if (deltaX !== 0) {
el.scrollLeft = Math.floor((easedT * deltaX) + fromX);
}
if (easedT < 1) {
// do not use DomController here
// must use nativeRaf in order to fire in the next frame
// TODO: remove as any
requestAnimationFrame(step);
}
else {
resolve();
}
};
// chill out for a frame first
requestAnimationFrame(ts => {
startTime = ts;
step(ts);
});
return promise;
}
onScrollStart() {
this.isScrolling = true;
this.ionScrollStart.emit({
isScrolling: true
});
if (this.watchDog) {
clearInterval(this.watchDog);
}
// watchdog
this.watchDog = setInterval(() => {
if (this.lastScroll < Date.now() - 120) {
this.onScrollEnd();
}
}, 100);
}
onScrollEnd() {
clearInterval(this.watchDog);
this.watchDog = null;
if (this.isScrolling) {
this.isScrolling = false;
this.ionScrollEnd.emit({
isScrolling: false
});
}
}
render() {
const { isMainContent, scrollX, scrollY } = this;
const mode = getIonMode$1(this);
const forceOverscroll = this.shouldForceOverscroll();
const TagType = isMainContent ? 'main' : 'div';
const transitionShadow = (mode === 'ios' && config.getBoolean('experimentalTransitionShadow', true));
this.resize();
return (hAsync(Host, { class: createColorClasses$1(this.color, {
[mode]: true,
'content-sizing': hostContext('ion-popover', this.el),
'overscroll': forceOverscroll,
}), style: {
'--offset-top': `${this.cTop}px`,
'--offset-bottom': `${this.cBottom}px`,
} }, hAsync("div", { id: "background-content", part: "background" }), hAsync(TagType, { class: {
'inner-scroll': true,
'scroll-x': scrollX,
'scroll-y': scrollY,
'overscroll': (scrollX || scrollY) && forceOverscroll
}, ref: (el) => this.scrollEl = el, onScroll: (this.scrollEvents) ? (ev) => this.onScroll(ev) : undefined, part: "scroll" }, hAsync("slot", null)), transitionShadow ? (hAsync("div", { class: "transition-effect" }, hAsync("div", { class: "transition-cover" }), hAsync("div", { class: "transition-shadow" }))) : null, hAsync("slot", { name: "fixed" })));
}
get el() { return getElement(this); }
static get style() { return contentCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-content",
"$members$": {
"color": [513],
"fullscreen": [4],
"forceOverscroll": [1028, "force-overscroll"],
"scrollX": [4, "scroll-x"],
"scrollY": [4, "scroll-y"],
"scrollEvents": [4, "scroll-events"],
"getScrollElement": [64],
"scrollToTop": [64],
"scrollToBottom": [64],
"scrollByPoint": [64],
"scrollToPoint": [64]
},
"$listeners$": [[8, "appload", "onAppLoad"], [2, "click", "onClick"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const getParentElement = (el) => {
if (el.parentElement) {
// normal element with a parent element
return el.parentElement;
}
if (el.parentNode && el.parentNode.host) {
// shadow dom's document fragment
return el.parentNode.host;
}
return null;
};
const getPageElement = (el) => {
const tabs = el.closest('ion-tabs');
if (tabs) {
return tabs;
}
const page = el.closest('ion-app,ion-page,.ion-page,page-inner');
if (page) {
return page;
}
return getParentElement(el);
};
// ******** DOM READ ****************
const updateScrollDetail = (detail, el, timestamp, shouldStart) => {
const prevX = detail.currentX;
const prevY = detail.currentY;
const prevT = detail.currentTime;
const currentX = el.scrollLeft;
const currentY = el.scrollTop;
const timeDelta = timestamp - prevT;
if (shouldStart) {
// remember the start positions
detail.startTime = timestamp;
detail.startX = currentX;
detail.startY = currentY;
detail.velocityX = detail.velocityY = 0;
}
detail.currentTime = timestamp;
detail.currentX = detail.scrollLeft = currentX;
detail.currentY = detail.scrollTop = currentY;
detail.deltaX = currentX - detail.startX;
detail.deltaY = currentY - detail.startY;
if (timeDelta > 0 && timeDelta < 100) {
const velocityX = (currentX - prevX) / timeDelta;
const velocityY = (currentY - prevY) / timeDelta;
detail.velocityX = velocityX * 0.7 + detail.velocityX * 0.3;
detail.velocityY = velocityY * 0.7 + detail.velocityY * 0.3;
}
};
/**
* Gets a date value given a format
* Defaults to the current date if
* no date given
*/
const getDateValue = (date, format) => {
const getValue = getValueFromFormat(date, format);
if (getValue !== undefined) {
if (format === FORMAT_A || format === FORMAT_a) {
date.ampm = getValue;
}
return getValue;
}
const defaultDate = parseDate(new Date().toISOString());
return getValueFromFormat(defaultDate, format);
};
const renderDatetime = (template, value, locale) => {
if (value === undefined) {
return undefined;
}
const tokens = [];
let hasText = false;
FORMAT_KEYS.forEach((format, index) => {
if (template.indexOf(format.f) > -1) {
const token = '{' + index + '}';
const text = renderTextFormat(format.f, value[format.k], value, locale);
if (!hasText && text !== undefined && value[format.k] != null) {
hasText = true;
}
tokens.push(token, text || '');
template = template.replace(format.f, token);
}
});
if (!hasText) {
return undefined;
}
for (let i = 0; i < tokens.length; i += 2) {
template = template.replace(tokens[i], tokens[i + 1]);
}
return template;
};
const renderTextFormat = (format, value, date, locale) => {
if ((format === FORMAT_DDDD || format === FORMAT_DDD)) {
try {
value = (new Date(date.year, date.month - 1, date.day)).getDay();
if (format === FORMAT_DDDD) {
return (locale.dayNames ? locale.dayNames : DAY_NAMES)[value];
}
return (locale.dayShortNames ? locale.dayShortNames : DAY_SHORT_NAMES)[value];
}
catch (e) {
// ignore
}
return undefined;
}
if (format === FORMAT_A) {
return date !== undefined && date.hour !== undefined
? (date.hour < 12 ? 'AM' : 'PM')
: value ? value.toUpperCase() : '';
}
if (format === FORMAT_a) {
return date !== undefined && date.hour !== undefined
? (date.hour < 12 ? 'am' : 'pm')
: value || '';
}
if (value == null) {
return '';
}
if (format === FORMAT_YY || format === FORMAT_MM ||
format === FORMAT_DD || format === FORMAT_HH ||
format === FORMAT_mm || format === FORMAT_ss) {
return twoDigit(value);
}
if (format === FORMAT_YYYY) {
return fourDigit(value);
}
if (format === FORMAT_MMMM) {
return (locale.monthNames ? locale.monthNames : MONTH_NAMES)[value - 1];
}
if (format === FORMAT_MMM) {
return (locale.monthShortNames ? locale.monthShortNames : MONTH_SHORT_NAMES)[value - 1];
}
if (format === FORMAT_hh || format === FORMAT_h) {
if (value === 0) {
return '12';
}
if (value > 12) {
value -= 12;
}
if (format === FORMAT_hh && value < 10) {
return ('0' + value);
}
}
return value.toString();
};
const dateValueRange = (format, min, max) => {
const opts = [];
if (format === FORMAT_YYYY || format === FORMAT_YY) {
// year
if (max.year === undefined || min.year === undefined) {
throw new Error('min and max year is undefined');
}
for (let i = max.year; i >= min.year; i--) {
opts.push(i);
}
}
else if (format === FORMAT_MMMM || format === FORMAT_MMM ||
format === FORMAT_MM || format === FORMAT_M ||
format === FORMAT_hh || format === FORMAT_h) {
// month or 12-hour
for (let i = 1; i < 13; i++) {
opts.push(i);
}
}
else if (format === FORMAT_DDDD || format === FORMAT_DDD ||
format === FORMAT_DD || format === FORMAT_D) {
// day
for (let i = 1; i < 32; i++) {
opts.push(i);
}
}
else if (format === FORMAT_HH || format === FORMAT_H) {
// 24-hour
for (let i = 0; i < 24; i++) {
opts.push(i);
}
}
else if (format === FORMAT_mm || format === FORMAT_m) {
// minutes
for (let i = 0; i < 60; i++) {
opts.push(i);
}
}
else if (format === FORMAT_ss || format === FORMAT_s) {
// seconds
for (let i = 0; i < 60; i++) {
opts.push(i);
}
}
else if (format === FORMAT_A || format === FORMAT_a) {
// AM/PM
opts.push('am', 'pm');
}
return opts;
};
const dateSortValue = (year, month, day, hour = 0, minute = 0) => {
return parseInt(`1${fourDigit(year)}${twoDigit(month)}${twoDigit(day)}${twoDigit(hour)}${twoDigit(minute)}`, 10);
};
const dateDataSortValue = (data) => {
return dateSortValue(data.year, data.month, data.day, data.hour, data.minute);
};
const daysInMonth = (month, year) => {
return (month === 4 || month === 6 || month === 9 || month === 11) ? 30 : (month === 2) ? isLeapYear(year) ? 29 : 28 : 31;
};
const isLeapYear = (year) => {
return (year % 4 === 0 && year % 100 !== 0) || (year % 400 === 0);
};
const ISO_8601_REGEXP = /^(\d{4}|[+\-]\d{6})(?:-(\d{2})(?:-(\d{2}))?)?(?:T(\d{2}):(\d{2})(?::(\d{2})(?:\.(\d{3}))?)?(?:(Z)|([+\-])(\d{2})(?::(\d{2}))?)?)?$/;
const TIME_REGEXP = /^((\d{2}):(\d{2})(?::(\d{2})(?:\.(\d{3}))?)?(?:(Z)|([+\-])(\d{2})(?::(\d{2}))?)?)?$/;
const parseDate = (val) => {
// manually parse IS0 cuz Date.parse cannot be trusted
// ISO 8601 format: 1994-12-15T13:47:20Z
let parse = null;
if (val != null && val !== '') {
// try parsing for just time first, HH:MM
parse = TIME_REGEXP.exec(val);
if (parse) {
// adjust the array so it fits nicely with the datetime parse
parse.unshift(undefined, undefined);
parse[2] = parse[3] = undefined;
}
else {
// try parsing for full ISO datetime
parse = ISO_8601_REGEXP.exec(val);
}
}
if (parse === null) {
// wasn't able to parse the ISO datetime
return undefined;
}
// ensure all the parse values exist with at least 0
for (let i = 1; i < 8; i++) {
parse[i] = parse[i] !== undefined ? parseInt(parse[i], 10) : undefined;
}
let tzOffset = 0;
if (parse[9] && parse[10]) {
// hours
tzOffset = parseInt(parse[10], 10) * 60;
if (parse[11]) {
// minutes
tzOffset += parseInt(parse[11], 10);
}
if (parse[9] === '-') {
// + or -
tzOffset *= -1;
}
}
return {
year: parse[1],
month: parse[2],
day: parse[3],
hour: parse[4],
minute: parse[5],
second: parse[6],
millisecond: parse[7],
tzOffset,
};
};
/**
* Converts a valid UTC datetime string to JS Date time object.
* By default uses the users local timezone, but an optional
* timezone can be provided.
* Note: This is not meant for time strings
* such as "01:47"
*/
const getDateTime = (dateString = '', timeZone = '') => {
/**
* If user passed in undefined
* or null, convert it to the
* empty string since the rest
* of this functions expects
* a string
*/
if (dateString === undefined || dateString === null) {
dateString = '';
}
/**
* Ensures that YYYY-MM-DD, YYYY-MM,
* YYYY-DD, YYYY, etc does not get affected
* by timezones and stays on the day/month
* that the user provided
*/
if (dateString.length === 10 ||
dateString.length === 7 ||
dateString.length === 4) {
dateString += ' ';
}
const date = (typeof dateString === 'string' && dateString.length > 0) ? new Date(dateString) : new Date();
const localDateTime = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), date.getMilliseconds()));
if (timeZone && timeZone.length > 0) {
return new Date(date.getTime() - getTimezoneOffset(localDateTime, timeZone));
}
return localDateTime;
};
const getTimezoneOffset = (localDate, timeZone) => {
const utcDateTime = new Date(localDate.toLocaleString('en-US', { timeZone: 'utc' }));
const tzDateTime = new Date(localDate.toLocaleString('en-US', { timeZone }));
return utcDateTime.getTime() - tzDateTime.getTime();
};
const updateDate = (existingData, newData, displayTimezone) => {
if (!newData || typeof newData === 'string') {
const dateTime = getDateTime(newData, displayTimezone);
if (!Number.isNaN(dateTime.getTime())) {
newData = dateTime.toISOString();
}
}
if (newData && newData !== '') {
if (typeof newData === 'string') {
// new date is a string, and hopefully in the ISO format
// convert it to our DatetimeData if a valid ISO
newData = parseDate(newData);
if (newData) {
// successfully parsed the ISO string to our DatetimeData
Object.assign(existingData, newData);
return true;
}
}
else if ((newData.year || newData.hour || newData.month || newData.day || newData.minute || newData.second)) {
// newData is from the datetime picker's selected values
// update the existing datetimeValue with the new values
if (newData.ampm !== undefined && newData.hour !== undefined) {
// change the value of the hour based on whether or not it is am or pm
// if the meridiem is pm and equal to 12, it remains 12
// otherwise we add 12 to the hour value
// if the meridiem is am and equal to 12, we change it to 0
// otherwise we use its current hour value
// for example: 8 pm becomes 20, 12 am becomes 0, 4 am becomes 4
newData.hour.value = (newData.ampm.value === 'pm')
? (newData.hour.value === 12 ? 12 : newData.hour.value + 12)
: (newData.hour.value === 12 ? 0 : newData.hour.value);
}
// merge new values from the picker's selection
// to the existing DatetimeData values
for (const key of Object.keys(newData)) {
existingData[key] = newData[key].value;
}
return true;
}
else if (newData.ampm) {
// Even though in the picker column hour values are between 1 and 12, the hour value is actually normalized
// to [0, 23] interval. Because of this when changing between AM and PM we have to update the hour so it points
// to the correct HH hour
newData.hour = {
value: newData.hour
? newData.hour.value
: (newData.ampm.value === 'pm'
? (existingData.hour < 12 ? existingData.hour + 12 : existingData.hour)
: (existingData.hour >= 12 ? existingData.hour - 12 : existingData.hour))
};
existingData['hour'] = newData['hour'].value;
existingData['ampm'] = newData['ampm'].value;
return true;
}
// eww, invalid data
console.warn(`Error parsing date: "${newData}". Please provide a valid ISO 8601 datetime format: https://www.w3.org/TR/NOTE-datetime`);
}
else {
// blank data, clear everything out
for (const k in existingData) {
if (existingData.hasOwnProperty(k)) {
delete existingData[k];
}
}
}
return false;
};
const parseTemplate = (template) => {
const formats = [];
template = template.replace(/[^\w\s]/gi, ' ');
FORMAT_KEYS.forEach(format => {
if (format.f.length > 1 && template.indexOf(format.f) > -1 && template.indexOf(format.f + format.f.charAt(0)) < 0) {
template = template.replace(format.f, ' ' + format.f + ' ');
}
});
const words = template.split(' ').filter(w => w.length > 0);
words.forEach((word, i) => {
FORMAT_KEYS.forEach(format => {
if (word === format.f) {
if (word === FORMAT_A || word === FORMAT_a) {
// this format is an am/pm format, so it's an "a" or "A"
if ((formats.indexOf(FORMAT_h) < 0 && formats.indexOf(FORMAT_hh) < 0) ||
VALID_AMPM_PREFIX.indexOf(words[i - 1]) === -1) {
// template does not already have a 12-hour format
// or this am/pm format doesn't have a hour, minute, or second format immediately before it
// so do not treat this word "a" or "A" as the am/pm format
return;
}
}
formats.push(word);
}
});
});
return formats;
};
const getValueFromFormat = (date, format) => {
if (format === FORMAT_A || format === FORMAT_a) {
return (date.hour < 12 ? 'am' : 'pm');
}
if (format === FORMAT_hh || format === FORMAT_h) {
return (date.hour > 12 ? date.hour - 12 : (date.hour === 0 ? 12 : date.hour));
}
return date[convertFormatToKey(format)];
};
const convertFormatToKey = (format) => {
for (const k in FORMAT_KEYS) {
if (FORMAT_KEYS[k].f === format) {
return FORMAT_KEYS[k].k;
}
}
return undefined;
};
const convertDataToISO = (data) => {
// https://www.w3.org/TR/NOTE-datetime
let rtn = '';
if (data.year !== undefined) {
// YYYY
rtn = fourDigit(data.year);
if (data.month !== undefined) {
// YYYY-MM
rtn += '-' + twoDigit(data.month);
if (data.day !== undefined) {
// YYYY-MM-DD
rtn += '-' + twoDigit(data.day);
if (data.hour !== undefined) {
// YYYY-MM-DDTHH:mm:SS
rtn += `T${twoDigit(data.hour)}:${twoDigit(data.minute)}:${twoDigit(data.second)}`;
if (data.millisecond > 0) {
// YYYY-MM-DDTHH:mm:SS.SSS
rtn += '.' + threeDigit(data.millisecond);
}
if (data.tzOffset === undefined) {
// YYYY-MM-DDTHH:mm:SSZ
rtn += 'Z';
}
else {
// YYYY-MM-DDTHH:mm:SS+/-HH:mm
rtn += (data.tzOffset > 0 ? '+' : '-') + twoDigit(Math.floor(Math.abs(data.tzOffset / 60))) + ':' + twoDigit(data.tzOffset % 60);
}
}
}
}
}
else if (data.hour !== undefined) {
// HH:mm
rtn = twoDigit(data.hour) + ':' + twoDigit(data.minute);
if (data.second !== undefined) {
// HH:mm:SS
rtn += ':' + twoDigit(data.second);
if (data.millisecond !== undefined) {
// HH:mm:SS.SSS
rtn += '.' + threeDigit(data.millisecond);
}
}
}
return rtn;
};
/**
* Use to convert a string of comma separated strings or
* an array of strings, and clean up any user input
*/
const convertToArrayOfStrings = (input, type) => {
if (input == null) {
return undefined;
}
if (typeof input === 'string') {
// convert the string to an array of strings
// auto remove any [] characters
input = input.replace(/\[|\]/g, '').split(',');
}
let values;
if (Array.isArray(input)) {
// trim up each string value
values = input.map(val => val.toString().trim());
}
if (values === undefined || values.length === 0) {
console.warn(`Invalid "${type}Names". Must be an array of strings, or a comma separated string.`);
}
return values;
};
/**
* Use to convert a string of comma separated numbers or
* an array of numbers, and clean up any user input
*/
const convertToArrayOfNumbers = (input, type) => {
if (typeof input === 'string') {
// convert the string to an array of strings
// auto remove any whitespace and [] characters
input = input.replace(/\[|\]|\s/g, '').split(',');
}
let values;
if (Array.isArray(input)) {
// ensure each value is an actual number in the returned array
values = input
.map((num) => parseInt(num, 10))
.filter(isFinite);
}
else {
values = [input];
}
if (values.length === 0) {
console.warn(`Invalid "${type}Values". Must be an array of numbers, or a comma separated string of numbers.`);
}
return values;
};
const twoDigit = (val) => {
return ('0' + (val !== undefined ? Math.abs(val) : '0')).slice(-2);
};
const threeDigit = (val) => {
return ('00' + (val !== undefined ? Math.abs(val) : '0')).slice(-3);
};
const fourDigit = (val) => {
return ('000' + (val !== undefined ? Math.abs(val) : '0')).slice(-4);
};
const FORMAT_YYYY = 'YYYY';
const FORMAT_YY = 'YY';
const FORMAT_MMMM = 'MMMM';
const FORMAT_MMM = 'MMM';
const FORMAT_MM = 'MM';
const FORMAT_M = 'M';
const FORMAT_DDDD = 'DDDD';
const FORMAT_DDD = 'DDD';
const FORMAT_DD = 'DD';
const FORMAT_D = 'D';
const FORMAT_HH = 'HH';
const FORMAT_H = 'H';
const FORMAT_hh = 'hh';
const FORMAT_h = 'h';
const FORMAT_mm = 'mm';
const FORMAT_m = 'm';
const FORMAT_ss = 'ss';
const FORMAT_s = 's';
const FORMAT_A = 'A';
const FORMAT_a = 'a';
const FORMAT_KEYS = [
{ f: FORMAT_YYYY, k: 'year' },
{ f: FORMAT_MMMM, k: 'month' },
{ f: FORMAT_DDDD, k: 'day' },
{ f: FORMAT_MMM, k: 'month' },
{ f: FORMAT_DDD, k: 'day' },
{ f: FORMAT_YY, k: 'year' },
{ f: FORMAT_MM, k: 'month' },
{ f: FORMAT_DD, k: 'day' },
{ f: FORMAT_HH, k: 'hour' },
{ f: FORMAT_hh, k: 'hour' },
{ f: FORMAT_mm, k: 'minute' },
{ f: FORMAT_ss, k: 'second' },
{ f: FORMAT_M, k: 'month' },
{ f: FORMAT_D, k: 'day' },
{ f: FORMAT_H, k: 'hour' },
{ f: FORMAT_h, k: 'hour' },
{ f: FORMAT_m, k: 'minute' },
{ f: FORMAT_s, k: 'second' },
{ f: FORMAT_A, k: 'ampm' },
{ f: FORMAT_a, k: 'ampm' },
];
const DAY_NAMES = [
'Sunday',
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday',
];
const DAY_SHORT_NAMES = [
'Sun',
'Mon',
'Tue',
'Wed',
'Thu',
'Fri',
'Sat',
];
const MONTH_NAMES = [
'January',
'February',
'March',
'April',
'May',
'June',
'July',
'August',
'September',
'October',
'November',
'December',
];
const MONTH_SHORT_NAMES = [
'Jan',
'Feb',
'Mar',
'Apr',
'May',
'Jun',
'Jul',
'Aug',
'Sep',
'Oct',
'Nov',
'Dec',
];
const VALID_AMPM_PREFIX = [
FORMAT_hh, FORMAT_h, FORMAT_mm, FORMAT_m, FORMAT_ss, FORMAT_s
];
const datetimeIosCss = "/*!@:host*/.sc-ion-datetime-ios-h{padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;position:relative;min-width:16px;min-height:1.2em;font-family:var(--ion-font-family, inherit);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;z-index:2}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-datetime-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@:host(.in-item)*/.in-item.sc-ion-datetime-ios-h{position:static}/*!@:host(.datetime-placeholder)*/.datetime-placeholder.sc-ion-datetime-ios-h{color:var(--placeholder-color)}/*!@:host(.datetime-disabled)*/.datetime-disabled.sc-ion-datetime-ios-h{opacity:0.3;pointer-events:none}/*!@:host(.datetime-readonly)*/.datetime-readonly.sc-ion-datetime-ios-h{pointer-events:none}/*!@button*/button.sc-ion-datetime-ios{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none}/*!@[dir=rtl] button, :host-context([dir=rtl]) button*/[dir=rtl].sc-ion-datetime-ios button.sc-ion-datetime-ios,[dir=rtl].sc-ion-datetime-ios-h button.sc-ion-datetime-ios,[dir=rtl] .sc-ion-datetime-ios-h button.sc-ion-datetime-ios{left:unset;right:unset;right:0}/*!@button::-moz-focus-inner*/button.sc-ion-datetime-ios::-moz-focus-inner{border:0}/*!@.datetime-text*/.datetime-text.sc-ion-datetime-ios{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;-ms-flex:1;flex:1;min-height:inherit;direction:ltr;overflow:inherit}/*!@[dir=rtl] .datetime-text, :host-context([dir=rtl]) .datetime-text*/[dir=rtl].sc-ion-datetime-ios .datetime-text.sc-ion-datetime-ios,[dir=rtl].sc-ion-datetime-ios-h .datetime-text.sc-ion-datetime-ios,[dir=rtl] .sc-ion-datetime-ios-h .datetime-text.sc-ion-datetime-ios{direction:rtl}/*!@:host*/.sc-ion-datetime-ios-h{--placeholder-color:var(--ion-color-step-400, #999999);--padding-top:10px;--padding-end:10px;--padding-bottom:10px;--padding-start:20px}";
const datetimeMdCss = "/*!@:host*/.sc-ion-datetime-md-h{padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;position:relative;min-width:16px;min-height:1.2em;font-family:var(--ion-font-family, inherit);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;z-index:2}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-datetime-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@:host(.in-item)*/.in-item.sc-ion-datetime-md-h{position:static}/*!@:host(.datetime-placeholder)*/.datetime-placeholder.sc-ion-datetime-md-h{color:var(--placeholder-color)}/*!@:host(.datetime-disabled)*/.datetime-disabled.sc-ion-datetime-md-h{opacity:0.3;pointer-events:none}/*!@:host(.datetime-readonly)*/.datetime-readonly.sc-ion-datetime-md-h{pointer-events:none}/*!@button*/button.sc-ion-datetime-md{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none}/*!@[dir=rtl] button, :host-context([dir=rtl]) button*/[dir=rtl].sc-ion-datetime-md button.sc-ion-datetime-md,[dir=rtl].sc-ion-datetime-md-h button.sc-ion-datetime-md,[dir=rtl] .sc-ion-datetime-md-h button.sc-ion-datetime-md{left:unset;right:unset;right:0}/*!@button::-moz-focus-inner*/button.sc-ion-datetime-md::-moz-focus-inner{border:0}/*!@.datetime-text*/.datetime-text.sc-ion-datetime-md{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;-ms-flex:1;flex:1;min-height:inherit;direction:ltr;overflow:inherit}/*!@[dir=rtl] .datetime-text, :host-context([dir=rtl]) .datetime-text*/[dir=rtl].sc-ion-datetime-md .datetime-text.sc-ion-datetime-md,[dir=rtl].sc-ion-datetime-md-h .datetime-text.sc-ion-datetime-md,[dir=rtl] .sc-ion-datetime-md-h .datetime-text.sc-ion-datetime-md{direction:rtl}/*!@:host*/.sc-ion-datetime-md-h{--placeholder-color:var(--ion-placeholder-color, var(--ion-color-step-400, #999999));--padding-top:10px;--padding-end:0;--padding-bottom:11px;--padding-start:16px}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part text - The value of the datetime.
* @part placeholder - The placeholder of the datetime.
*/
class Datetime {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionCancel = createEvent(this, "ionCancel", 7);
this.ionChange = createEvent(this, "ionChange", 7);
this.ionFocus = createEvent(this, "ionFocus", 7);
this.ionBlur = createEvent(this, "ionBlur", 7);
this.ionStyle = createEvent(this, "ionStyle", 7);
this.inputId = `ion-dt-${datetimeIds++}`;
this.locale = {};
this.datetimeMin = {};
this.datetimeMax = {};
this.datetimeValue = {};
this.isExpanded = false;
/**
* The name of the control, which is submitted with the form data.
*/
this.name = this.inputId;
/**
* If `true`, the user cannot interact with the datetime.
*/
this.disabled = false;
/**
* If `true`, the datetime appears normal but is not interactive.
*/
this.readonly = false;
/**
* The display format of the date and time as text that shows
* within the item. When the `pickerFormat` input is not used, then the
* `displayFormat` is used for both display the formatted text, and determining
* the datetime picker's columns. See the `pickerFormat` input description for
* more info. Defaults to `MMM D, YYYY`.
*/
this.displayFormat = 'MMM D, YYYY';
/**
* The text to display on the picker's cancel button.
*/
this.cancelText = 'Cancel';
/**
* The text to display on the picker's "Done" button.
*/
this.doneText = 'Done';
this.onClick = () => {
this.setFocus();
this.open();
};
this.onFocus = () => {
this.ionFocus.emit();
};
this.onBlur = () => {
this.ionBlur.emit();
};
}
disabledChanged() {
this.emitStyle();
}
/**
* Update the datetime value when the value changes
*/
valueChanged() {
this.updateDatetimeValue(this.value);
this.emitStyle();
this.ionChange.emit({
value: this.value
});
}
componentWillLoad() {
// first see if locale names were provided in the inputs
// then check to see if they're in the config
// if neither were provided then it will use default English names
this.locale = {
// this.locale[type] = convertToArrayOfStrings((this[type] ? this[type] : this.config.get(type), type);
monthNames: convertToArrayOfStrings(this.monthNames, 'monthNames'),
monthShortNames: convertToArrayOfStrings(this.monthShortNames, 'monthShortNames'),
dayNames: convertToArrayOfStrings(this.dayNames, 'dayNames'),
dayShortNames: convertToArrayOfStrings(this.dayShortNames, 'dayShortNames')
};
this.updateDatetimeValue(this.value);
this.emitStyle();
}
/**
* Opens the datetime overlay.
*/
async open() {
if (this.disabled || this.isExpanded) {
return;
}
const pickerOptions = this.generatePickerOptions();
const picker = await pickerController.create(pickerOptions);
this.isExpanded = true;
picker.onDidDismiss().then(() => {
this.isExpanded = false;
this.setFocus();
});
addEventListener(picker, 'ionPickerColChange', async (event) => {
const data = event.detail;
const colSelectedIndex = data.selectedIndex;
const colOptions = data.options;
const changeData = {};
changeData[data.name] = {
value: colOptions[colSelectedIndex].value
};
if (data.name !== 'ampm' && this.datetimeValue.ampm !== undefined) {
changeData['ampm'] = {
value: this.datetimeValue.ampm
};
}
this.updateDatetimeValue(changeData);
picker.columns = this.generateColumns();
});
await picker.present();
}
emitStyle() {
this.ionStyle.emit({
'interactive': true,
'datetime': true,
'has-placeholder': this.placeholder != null,
'has-value': this.hasValue(),
'interactive-disabled': this.disabled,
});
}
updateDatetimeValue(value) {
updateDate(this.datetimeValue, value, this.displayTimezone);
}
generatePickerOptions() {
const mode = getIonMode$1(this);
this.locale = {
monthNames: convertToArrayOfStrings(this.monthNames, 'monthNames'),
monthShortNames: convertToArrayOfStrings(this.monthShortNames, 'monthShortNames'),
dayNames: convertToArrayOfStrings(this.dayNames, 'dayNames'),
dayShortNames: convertToArrayOfStrings(this.dayShortNames, 'dayShortNames')
};
const pickerOptions = Object.assign(Object.assign({ mode }, this.pickerOptions), { columns: this.generateColumns() });
// If the user has not passed in picker buttons,
// add a cancel and ok button to the picker
const buttons = pickerOptions.buttons;
if (!buttons || buttons.length === 0) {
pickerOptions.buttons = [
{
text: this.cancelText,
role: 'cancel',
handler: () => {
this.updateDatetimeValue(this.value);
this.ionCancel.emit();
}
},
{
text: this.doneText,
handler: (data) => {
this.updateDatetimeValue(data);
/**
* Prevent convertDataToISO from doing any
* kind of transformation based on timezone
* This cancels out any change it attempts to make
*
* Important: Take the timezone offset based on
* the date that is currently selected, otherwise
* there can be 1 hr difference when dealing w/ DST
*/
const date = new Date(convertDataToISO(this.datetimeValue));
// If a custom display timezone is provided, use that tzOffset value instead
this.datetimeValue.tzOffset = (this.displayTimezone !== undefined && this.displayTimezone.length > 0)
? ((getTimezoneOffset(date, this.displayTimezone)) / 1000 / 60) * -1
: date.getTimezoneOffset() * -1;
this.value = convertDataToISO(this.datetimeValue);
}
}
];
}
return pickerOptions;
}
generateColumns() {
// if a picker format wasn't provided, then fallback
// to use the display format
let template = this.pickerFormat || this.displayFormat || DEFAULT_FORMAT;
if (template.length === 0) {
return [];
}
// make sure we've got up to date sizing information
this.calcMinMax();
// does not support selecting by day name
// automatically remove any day name formats
template = template.replace('DDDD', '{~}').replace('DDD', '{~}');
if (template.indexOf('D') === -1) {
// there is not a day in the template
// replace the day name with a numeric one if it exists
template = template.replace('{~}', 'D');
}
// make sure no day name replacer is left in the string
template = template.replace(/{~}/g, '');
// parse apart the given template into an array of "formats"
const columns = parseTemplate(template).map((format) => {
// loop through each format in the template
// create a new picker column to build up with data
const key = convertFormatToKey(format);
let values;
// check if they have exact values to use for this date part
// otherwise use the default date part values
const self = this;
values = self[key + 'Values']
? convertToArrayOfNumbers(self[key + 'Values'], key)
: dateValueRange(format, this.datetimeMin, this.datetimeMax);
const colOptions = values.map(val => {
return {
value: val,
text: renderTextFormat(format, val, undefined, this.locale),
};
});
// cool, we've loaded up the columns with options
// preselect the option for this column
const optValue = getDateValue(this.datetimeValue, format);
const selectedIndex = colOptions.findIndex(opt => opt.value === optValue);
return {
name: key,
selectedIndex: selectedIndex >= 0 ? selectedIndex : 0,
options: colOptions
};
});
// Normalize min/max
const min = this.datetimeMin;
const max = this.datetimeMax;
['month', 'day', 'hour', 'minute']
.filter(name => !columns.find(column => column.name === name))
.forEach(name => {
min[name] = 0;
max[name] = 0;
});
return this.validateColumns(divyColumns(columns));
}
validateColumns(columns) {
const today = new Date();
const minCompareVal = dateDataSortValue(this.datetimeMin);
const maxCompareVal = dateDataSortValue(this.datetimeMax);
const yearCol = columns.find(c => c.name === 'year');
let selectedYear = today.getFullYear();
if (yearCol) {
// default to the first value if the current year doesn't exist in the options
if (!yearCol.options.find(col => col.value === today.getFullYear())) {
selectedYear = yearCol.options[0].value;
}
const selectedIndex = yearCol.selectedIndex;
if (selectedIndex !== undefined) {
const yearOpt = yearCol.options[selectedIndex];
if (yearOpt) {
// they have a selected year value
selectedYear = yearOpt.value;
}
}
}
const selectedMonth = this.validateColumn(columns, 'month', 1, minCompareVal, maxCompareVal, [selectedYear, 0, 0, 0, 0], [selectedYear, 12, 31, 23, 59]);
const numDaysInMonth = daysInMonth(selectedMonth, selectedYear);
const selectedDay = this.validateColumn(columns, 'day', 2, minCompareVal, maxCompareVal, [selectedYear, selectedMonth, 0, 0, 0], [selectedYear, selectedMonth, numDaysInMonth, 23, 59]);
const selectedHour = this.validateColumn(columns, 'hour', 3, minCompareVal, maxCompareVal, [selectedYear, selectedMonth, selectedDay, 0, 0], [selectedYear, selectedMonth, selectedDay, 23, 59]);
this.validateColumn(columns, 'minute', 4, minCompareVal, maxCompareVal, [selectedYear, selectedMonth, selectedDay, selectedHour, 0], [selectedYear, selectedMonth, selectedDay, selectedHour, 59]);
return columns;
}
calcMinMax() {
const todaysYear = new Date().getFullYear();
if (this.yearValues !== undefined) {
const years = convertToArrayOfNumbers(this.yearValues, 'year');
if (this.min === undefined) {
this.min = Math.min(...years).toString();
}
if (this.max === undefined) {
this.max = Math.max(...years).toString();
}
}
else {
if (this.min === undefined) {
this.min = (todaysYear - 100).toString();
}
if (this.max === undefined) {
this.max = todaysYear.toString();
}
}
const min = this.datetimeMin = parseDate(this.min);
const max = this.datetimeMax = parseDate(this.max);
min.year = min.year || todaysYear;
max.year = max.year || todaysYear;
min.month = min.month || 1;
max.month = max.month || 12;
min.day = min.day || 1;
max.day = max.day || 31;
min.hour = min.hour || 0;
max.hour = max.hour === undefined ? 23 : max.hour;
min.minute = min.minute || 0;
max.minute = max.minute === undefined ? 59 : max.minute;
min.second = min.second || 0;
max.second = max.second === undefined ? 59 : max.second;
// Ensure min/max constraints
if (min.year > max.year) {
console.error('min.year > max.year');
min.year = max.year - 100;
}
if (min.year === max.year) {
if (min.month > max.month) {
console.error('min.month > max.month');
min.month = 1;
}
else if (min.month === max.month && min.day > max.day) {
console.error('min.day > max.day');
min.day = 1;
}
}
}
validateColumn(columns, name, index, min, max, lowerBounds, upperBounds) {
const column = columns.find(c => c.name === name);
if (!column) {
return 0;
}
const lb = lowerBounds.slice();
const ub = upperBounds.slice();
const options = column.options;
let indexMin = options.length - 1;
let indexMax = 0;
for (let i = 0; i < options.length; i++) {
const opts = options[i];
const value = opts.value;
lb[index] = opts.value;
ub[index] = opts.value;
const disabled = opts.disabled = (value < lowerBounds[index] ||
value > upperBounds[index] ||
dateSortValue(ub[0], ub[1], ub[2], ub[3], ub[4]) < min ||
dateSortValue(lb[0], lb[1], lb[2], lb[3], lb[4]) > max);
if (!disabled) {
indexMin = Math.min(indexMin, i);
indexMax = Math.max(indexMax, i);
}
}
const selectedIndex = column.selectedIndex = clamp(indexMin, column.selectedIndex, indexMax);
const opt = column.options[selectedIndex];
if (opt) {
return opt.value;
}
return 0;
}
get text() {
// create the text of the formatted data
const template = this.displayFormat || this.pickerFormat || DEFAULT_FORMAT;
if (this.value === undefined ||
this.value === null ||
this.value.length === 0) {
return;
}
return renderDatetime(template, this.datetimeValue, this.locale);
}
hasValue() {
return this.text !== undefined;
}
setFocus() {
if (this.buttonEl) {
this.buttonEl.focus();
}
}
render() {
const { inputId, text, disabled, readonly, isExpanded, el, placeholder } = this;
const mode = getIonMode$1(this);
const labelId = inputId + '-lbl';
const label = findItemLabel(el);
const addPlaceholderClass = (text === undefined && placeholder != null) ? true : false;
// If selected text has been passed in, use that first
// otherwise use the placeholder
const datetimeText = text === undefined
? (placeholder != null ? placeholder : '')
: text;
const datetimeTextPart = text === undefined
? (placeholder != null ? 'placeholder' : undefined)
: 'text';
if (label) {
label.id = labelId;
}
renderHiddenInput(true, el, this.name, this.value, this.disabled);
return (hAsync(Host, { onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, "aria-expanded": `${isExpanded}`, "aria-haspopup": "true", "aria-labelledby": label ? labelId : null, class: {
[mode]: true,
'datetime-disabled': disabled,
'datetime-readonly': readonly,
'datetime-placeholder': addPlaceholderClass,
'in-item': hostContext('ion-item', el)
} }, hAsync("div", { class: "datetime-text", part: datetimeTextPart }, datetimeText), hAsync("button", { type: "button", onFocus: this.onFocus, onBlur: this.onBlur, disabled: this.disabled, ref: btnEl => this.buttonEl = btnEl })));
}
get el() { return getElement(this); }
static get watchers() { return {
"disabled": ["disabledChanged"],
"value": ["valueChanged"]
}; }
static get style() { return {
ios: datetimeIosCss,
md: datetimeMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-datetime",
"$members$": {
"name": [1],
"disabled": [4],
"readonly": [4],
"min": [1025],
"max": [1025],
"displayFormat": [1, "display-format"],
"displayTimezone": [1, "display-timezone"],
"pickerFormat": [1, "picker-format"],
"cancelText": [1, "cancel-text"],
"doneText": [1, "done-text"],
"yearValues": [8, "year-values"],
"monthValues": [8, "month-values"],
"dayValues": [8, "day-values"],
"hourValues": [8, "hour-values"],
"minuteValues": [8, "minute-values"],
"monthNames": [1, "month-names"],
"monthShortNames": [1, "month-short-names"],
"dayNames": [1, "day-names"],
"dayShortNames": [1, "day-short-names"],
"pickerOptions": [16],
"placeholder": [1],
"value": [1025],
"isExpanded": [32],
"open": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const divyColumns = (columns) => {
const columnsWidth = [];
let col;
let width;
for (let i = 0; i < columns.length; i++) {
col = columns[i];
columnsWidth.push(0);
for (const option of col.options) {
width = option.text.length;
if (width > columnsWidth[i]) {
columnsWidth[i] = width;
}
}
}
if (columnsWidth.length === 2) {
width = Math.max(columnsWidth[0], columnsWidth[1]);
columns[0].align = 'right';
columns[1].align = 'left';
columns[0].optionsWidth = columns[1].optionsWidth = `${width * 17}px`;
}
else if (columnsWidth.length === 3) {
width = Math.max(columnsWidth[0], columnsWidth[2]);
columns[0].align = 'right';
columns[1].columnWidth = `${columnsWidth[1] * 17}px`;
columns[0].optionsWidth = columns[2].optionsWidth = `${width * 17}px`;
columns[2].align = 'left';
}
return columns;
};
const DEFAULT_FORMAT = 'MMM D, YYYY';
let datetimeIds = 0;
const fabCss = "/*!@:host*/.sc-ion-fab-h{position:absolute;z-index:999}/*!@:host(.fab-horizontal-center)*/.fab-horizontal-center.sc-ion-fab-h{left:50%;margin-left:-28px}/*!@:host-context([dir=rtl]):host(.fab-horizontal-center), :host-context([dir=rtl]).fab-horizontal-center*/[dir=rtl].sc-ion-fab-h -no-combinator.fab-horizontal-center.sc-ion-fab-h,[dir=rtl] .sc-ion-fab-h -no-combinator.fab-horizontal-center.sc-ion-fab-h,[dir=rtl].fab-horizontal-center.sc-ion-fab-h,[dir=rtl] .fab-horizontal-center.sc-ion-fab-h{left:unset;right:unset;right:50%}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.fab-horizontal-center)*/.fab-horizontal-center.sc-ion-fab-h{margin-left:unset;-webkit-margin-start:-28px;margin-inline-start:-28px}}/*!@:host(.fab-horizontal-start)*/.fab-horizontal-start.sc-ion-fab-h{left:calc(10px + var(--ion-safe-area-left, 0px))}/*!@:host-context([dir=rtl]):host(.fab-horizontal-start), :host-context([dir=rtl]).fab-horizontal-start*/[dir=rtl].sc-ion-fab-h -no-combinator.fab-horizontal-start.sc-ion-fab-h,[dir=rtl] .sc-ion-fab-h -no-combinator.fab-horizontal-start.sc-ion-fab-h,[dir=rtl].fab-horizontal-start.sc-ion-fab-h,[dir=rtl] .fab-horizontal-start.sc-ion-fab-h{left:unset;right:unset;right:calc(10px + var(--ion-safe-area-left, 0px))}/*!@:host(.fab-horizontal-end)*/.fab-horizontal-end.sc-ion-fab-h{right:calc(10px + var(--ion-safe-area-right, 0px))}/*!@:host-context([dir=rtl]):host(.fab-horizontal-end), :host-context([dir=rtl]).fab-horizontal-end*/[dir=rtl].sc-ion-fab-h -no-combinator.fab-horizontal-end.sc-ion-fab-h,[dir=rtl] .sc-ion-fab-h -no-combinator.fab-horizontal-end.sc-ion-fab-h,[dir=rtl].fab-horizontal-end.sc-ion-fab-h,[dir=rtl] .fab-horizontal-end.sc-ion-fab-h{left:unset;right:unset;left:calc(10px + var(--ion-safe-area-right, 0px))}/*!@:host(.fab-vertical-top)*/.fab-vertical-top.sc-ion-fab-h{top:10px}/*!@:host(.fab-vertical-top.fab-edge)*/.fab-vertical-top.fab-edge.sc-ion-fab-h{top:-28px}/*!@:host(.fab-vertical-bottom)*/.fab-vertical-bottom.sc-ion-fab-h{bottom:10px}/*!@:host(.fab-vertical-bottom.fab-edge)*/.fab-vertical-bottom.fab-edge.sc-ion-fab-h{bottom:-28px}/*!@:host(.fab-vertical-center)*/.fab-vertical-center.sc-ion-fab-h{margin-top:-28px;top:50%}";
class Fab {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If `true`, the fab will display on the edge of the header if
* `vertical` is `"top"`, and on the edge of the footer if
* it is `"bottom"`. Should be used with a `fixed` slot.
*/
this.edge = false;
/**
* If `true`, both the `ion-fab-button` and all `ion-fab-list` inside `ion-fab` will become active.
* That means `ion-fab-button` will become a `close` icon and `ion-fab-list` will become visible.
*/
this.activated = false;
this.onClick = () => {
const hasList = !!this.el.querySelector('ion-fab-list');
const getButton = this.getFab();
const isButtonDisabled = getButton && getButton.disabled;
if (hasList && !isButtonDisabled) {
this.activated = !this.activated;
}
};
}
activatedChanged() {
const activated = this.activated;
const fab = this.getFab();
if (fab) {
fab.activated = activated;
}
Array.from(this.el.querySelectorAll('ion-fab-list')).forEach(list => {
list.activated = activated;
});
}
componentDidLoad() {
if (this.activated) {
this.activatedChanged();
}
}
/**
* Close an active FAB list container.
*/
async close() {
this.activated = false;
}
getFab() {
return this.el.querySelector('ion-fab-button');
}
render() {
const { horizontal, vertical, edge } = this;
const mode = getIonMode$1(this);
return (hAsync(Host, { onClick: this.onClick, class: {
[mode]: true,
[`fab-horizontal-${horizontal}`]: horizontal !== undefined,
[`fab-vertical-${vertical}`]: vertical !== undefined,
'fab-edge': edge
} }, hAsync("slot", null)));
}
get el() { return getElement(this); }
static get watchers() { return {
"activated": ["activatedChanged"]
}; }
static get style() { return fabCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-fab",
"$members$": {
"horizontal": [1],
"vertical": [1],
"edge": [4],
"activated": [1028],
"close": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const fabButtonIosCss = "/*!@:host*/.sc-ion-fab-button-ios-h{--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--background-hover:var(--ion-color-primary-contrast, #fff);--background-hover-opacity:.08;--transition:background-color, opacity 100ms linear;--ripple-color:currentColor;--border-radius:50%;--border-width:0;--border-style:none;--border-color:initial;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;width:56px;height:56px;font-size:14px;text-align:center;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}/*!@.button-native*/.button-native.sc-ion-fab-button-ios{border-radius:var(--border-radius);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;position:relative;width:100%;height:100%;-webkit-transform:var(--transform);transform:var(--transform);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);background-clip:padding-box;color:var(--color);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);contain:strict;cursor:pointer;overflow:hidden;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-fab-button-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@::slotted(ion-icon)*/.sc-ion-fab-button-ios-s>ion-icon{line-height:1}/*!@.button-native::after*/.button-native.sc-ion-fab-button-ios::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}/*!@.button-inner*/.button-inner.sc-ion-fab-button-ios{left:0;right:0;top:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:100%;-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;z-index:1}/*!@:host(.fab-button-disabled)*/.fab-button-disabled.sc-ion-fab-button-ios-h{cursor:default;opacity:0.5;pointer-events:none}@media (any-hover: hover){/*!@:host(:hover) .button-native*/.sc-ion-fab-button-ios-h:hover .button-native.sc-ion-fab-button-ios{color:var(--color-hover)}/*!@:host(:hover) .button-native::after*/.sc-ion-fab-button-ios-h:hover .button-native.sc-ion-fab-button-ios::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}/*!@:host(.ion-focused) .button-native*/.ion-focused.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}/*!@:host(.ion-activated) .button-native*/.ion-activated.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios{color:var(--color-activated)}/*!@:host(.ion-activated) .button-native::after*/.ion-activated.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}/*!@::slotted(ion-icon)*/.sc-ion-fab-button-ios-s>ion-icon{line-height:1}/*!@:host(.fab-button-small)*/.fab-button-small.sc-ion-fab-button-ios-h{margin-left:8px;margin-right:8px;margin-top:8px;margin-bottom:8px;width:40px;height:40px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.fab-button-small)*/.fab-button-small.sc-ion-fab-button-ios-h{margin-left:unset;margin-right:unset;-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:8px;margin-inline-end:8px}}/*!@.close-icon*/.close-icon.sc-ion-fab-button-ios{margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0;left:0;right:0;top:0;position:absolute;height:100%;-webkit-transform:scale(0.4) rotateZ(-45deg);transform:scale(0.4) rotateZ(-45deg);-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;font-size:var(--close-icon-font-size);opacity:0;z-index:1}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.close-icon*/.close-icon.sc-ion-fab-button-ios{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}/*!@:host(.fab-button-close-active) .close-icon*/.fab-button-close-active.sc-ion-fab-button-ios-h .close-icon.sc-ion-fab-button-ios{-webkit-transform:scale(1) rotateZ(0deg);transform:scale(1) rotateZ(0deg);opacity:1}/*!@:host(.fab-button-close-active) .button-inner*/.fab-button-close-active.sc-ion-fab-button-ios-h .button-inner.sc-ion-fab-button-ios{-webkit-transform:scale(0.4) rotateZ(45deg);transform:scale(0.4) rotateZ(45deg);opacity:0}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-fab-button-ios{color:var(--ripple-color)}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){/*!@:host(.fab-button-translucent) .button-native*/.fab-button-translucent.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios{-webkit-backdrop-filter:var(--backdrop-filter);backdrop-filter:var(--backdrop-filter)}}/*!@:host(.ion-color) .button-native*/.ion-color.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host*/.sc-ion-fab-button-ios-h{--background:var(--ion-color-primary, #3880ff);--background-activated:var(--ion-color-primary-shade, #3171e0);--background-focused:var(--ion-color-primary-shade, #3171e0);--background-hover:var(--ion-color-primary-tint, #4c8dff);--background-activated-opacity:1;--background-focused-opacity:1;--background-hover-opacity:1;--color:var(--ion-color-primary-contrast, #fff);--box-shadow:0 4px 16px rgba(0, 0, 0, 0.12);--transition:0.2s transform cubic-bezier(0.25, 1.11, 0.78, 1.59);--close-icon-font-size:28px}/*!@:host(.ion-activated)*/.ion-activated.sc-ion-fab-button-ios-h{--box-shadow:0 4px 16px rgba(0, 0, 0, 0.12);--transform:scale(1.1);--transition:0.2s transform ease-out}/*!@::slotted(ion-icon)*/.sc-ion-fab-button-ios-s>ion-icon{font-size:28px}/*!@:host(.fab-button-in-list)*/.fab-button-in-list.sc-ion-fab-button-ios-h{--background:var(--ion-color-light, #f4f5f8);--background-activated:var(--ion-color-light-shade, #d7d8da);--background-focused:var(--background-activated);--background-hover:var(--ion-color-light-tint, #f5f6f9);--color:var(--ion-color-light-contrast, #000);--color-activated:var(--ion-color-light-contrast, #000);--color-focused:var(--color-activated);--transition:transform 200ms ease 10ms, opacity 200ms ease 10ms}/*!@:host(.fab-button-in-list) ::slotted(ion-icon)*/.sc-ion-fab-button-ios-h.fab-button-in-list .sc-ion-fab-button-ios-s>ion-icon{font-size:18px}/*!@:host(.ion-color.ion-focused) .button-native::after*/.ion-color.ion-focused.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios::after{background:var(--ion-color-shade)}/*!@:host(.ion-color.ion-focused) .button-native,\n:host(.ion-color.ion-activated) .button-native*/.ion-color.ion-focused.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios,.ion-color.ion-activated.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios{color:var(--ion-color-contrast)}/*!@:host(.ion-color.ion-focused) .button-native::after,\n:host(.ion-color.ion-activated) .button-native::after*/.ion-color.ion-focused.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios::after,.ion-color.ion-activated.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios::after{background:var(--ion-color-shade)}@media (any-hover: hover){/*!@:host(.ion-color:hover) .button-native*/.ion-color.sc-ion-fab-button-ios-h:hover .button-native.sc-ion-fab-button-ios{color:var(--ion-color-contrast)}/*!@:host(.ion-color:hover) .button-native::after*/.ion-color.sc-ion-fab-button-ios-h:hover .button-native.sc-ion-fab-button-ios::after{background:var(--ion-color-tint)}}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){/*!@:host(.fab-button-translucent)*/.fab-button-translucent.sc-ion-fab-button-ios-h{--background:rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.9);--background-hover:rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.8);--background-focused:rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.82);--backdrop-filter:saturate(180%) blur(20px)}/*!@:host(.fab-button-translucent-in-list)*/.fab-button-translucent-in-list.sc-ion-fab-button-ios-h{--background:rgba(var(--ion-color-light-rgb, 244, 245, 248), 0.9);--background-hover:rgba(var(--ion-color-light-rgb, 244, 245, 248), 0.8);--background-focused:rgba(var(--ion-color-light-rgb, 244, 245, 248), 0.82)}}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){/*!@@media (any-hover: hover)*/@media .sc-ion-fab-button-ios (any-hover.sc-ion-fab-button-ios: hover).sc-ion-fab-button-ios{.sc-ion-fab-button-ios-h.fab-button-translucent.ion-color:hover .button-native{background:rgba(var(--ion-color-base-rgb), 0.8)}}/*!@:host(.ion-color.fab-button-translucent) .button-native*/.ion-color.fab-button-translucent.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios{background:rgba(var(--ion-color-base-rgb), 0.9)}/*!@:host(.ion-color.ion-focused.fab-button-translucent) .button-native,\n:host(.ion-color.ion-activated.fab-button-translucent) .button-native*/.ion-color.ion-focused.fab-button-translucent.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios,.ion-color.ion-activated.fab-button-translucent.sc-ion-fab-button-ios-h .button-native.sc-ion-fab-button-ios{background:var(--ion-color-base)}}";
const fabButtonMdCss = "/*!@:host*/.sc-ion-fab-button-md-h{--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--background-hover:var(--ion-color-primary-contrast, #fff);--background-hover-opacity:.08;--transition:background-color, opacity 100ms linear;--ripple-color:currentColor;--border-radius:50%;--border-width:0;--border-style:none;--border-color:initial;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;width:56px;height:56px;font-size:14px;text-align:center;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}/*!@.button-native*/.button-native.sc-ion-fab-button-md{border-radius:var(--border-radius);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;position:relative;width:100%;height:100%;-webkit-transform:var(--transform);transform:var(--transform);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);background-clip:padding-box;color:var(--color);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);contain:strict;cursor:pointer;overflow:hidden;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-fab-button-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@::slotted(ion-icon)*/.sc-ion-fab-button-md-s>ion-icon{line-height:1}/*!@.button-native::after*/.button-native.sc-ion-fab-button-md::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}/*!@.button-inner*/.button-inner.sc-ion-fab-button-md{left:0;right:0;top:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:100%;-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;z-index:1}/*!@:host(.fab-button-disabled)*/.fab-button-disabled.sc-ion-fab-button-md-h{cursor:default;opacity:0.5;pointer-events:none}@media (any-hover: hover){/*!@:host(:hover) .button-native*/.sc-ion-fab-button-md-h:hover .button-native.sc-ion-fab-button-md{color:var(--color-hover)}/*!@:host(:hover) .button-native::after*/.sc-ion-fab-button-md-h:hover .button-native.sc-ion-fab-button-md::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}/*!@:host(.ion-focused) .button-native*/.ion-focused.sc-ion-fab-button-md-h .button-native.sc-ion-fab-button-md{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-fab-button-md-h .button-native.sc-ion-fab-button-md::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}/*!@:host(.ion-activated) .button-native*/.ion-activated.sc-ion-fab-button-md-h .button-native.sc-ion-fab-button-md{color:var(--color-activated)}/*!@:host(.ion-activated) .button-native::after*/.ion-activated.sc-ion-fab-button-md-h .button-native.sc-ion-fab-button-md::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}/*!@::slotted(ion-icon)*/.sc-ion-fab-button-md-s>ion-icon{line-height:1}/*!@:host(.fab-button-small)*/.fab-button-small.sc-ion-fab-button-md-h{margin-left:8px;margin-right:8px;margin-top:8px;margin-bottom:8px;width:40px;height:40px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.fab-button-small)*/.fab-button-small.sc-ion-fab-button-md-h{margin-left:unset;margin-right:unset;-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:8px;margin-inline-end:8px}}/*!@.close-icon*/.close-icon.sc-ion-fab-button-md{margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0;left:0;right:0;top:0;position:absolute;height:100%;-webkit-transform:scale(0.4) rotateZ(-45deg);transform:scale(0.4) rotateZ(-45deg);-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;font-size:var(--close-icon-font-size);opacity:0;z-index:1}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.close-icon*/.close-icon.sc-ion-fab-button-md{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}/*!@:host(.fab-button-close-active) .close-icon*/.fab-button-close-active.sc-ion-fab-button-md-h .close-icon.sc-ion-fab-button-md{-webkit-transform:scale(1) rotateZ(0deg);transform:scale(1) rotateZ(0deg);opacity:1}/*!@:host(.fab-button-close-active) .button-inner*/.fab-button-close-active.sc-ion-fab-button-md-h .button-inner.sc-ion-fab-button-md{-webkit-transform:scale(0.4) rotateZ(45deg);transform:scale(0.4) rotateZ(45deg);opacity:0}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-fab-button-md{color:var(--ripple-color)}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){/*!@:host(.fab-button-translucent) .button-native*/.fab-button-translucent.sc-ion-fab-button-md-h .button-native.sc-ion-fab-button-md{-webkit-backdrop-filter:var(--backdrop-filter);backdrop-filter:var(--backdrop-filter)}}/*!@:host(.ion-color) .button-native*/.ion-color.sc-ion-fab-button-md-h .button-native.sc-ion-fab-button-md{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host*/.sc-ion-fab-button-md-h{--background:var(--ion-color-primary, #3880ff);--background-activated:transparent;--background-focused:currentColor;--background-hover:currentColor;--background-activated-opacity:0;--background-focused-opacity:.24;--background-hover-opacity:.08;--color:var(--ion-color-primary-contrast, #fff);--box-shadow:0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);--transition:box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), background-color 280ms cubic-bezier(0.4, 0, 0.2, 1), color 280ms cubic-bezier(0.4, 0, 0.2, 1), opacity 15ms linear 30ms, transform 270ms cubic-bezier(0, 0, 0.2, 1) 0ms;--close-icon-font-size:24px}/*!@:host(.ion-activated)*/.ion-activated.sc-ion-fab-button-md-h{--box-shadow:0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12)}/*!@::slotted(ion-icon)*/.sc-ion-fab-button-md-s>ion-icon{font-size:24px}/*!@:host(.fab-button-in-list)*/.fab-button-in-list.sc-ion-fab-button-md-h{--color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54);--color-activated:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54);--color-focused:var(--color-activated);--background:var(--ion-color-light, #f4f5f8);--background-activated:transparent;--background-focused:var(--ion-color-light-shade, #d7d8da);--background-hover:var(--ion-color-light-tint, #f5f6f9)}/*!@:host(.fab-button-in-list) ::slotted(ion-icon)*/.sc-ion-fab-button-md-h.fab-button-in-list .sc-ion-fab-button-md-s>ion-icon{font-size:18px}/*!@:host(.ion-color.ion-focused) .button-native*/.ion-color.ion-focused.sc-ion-fab-button-md-h .button-native.sc-ion-fab-button-md{color:var(--ion-color-contrast)}/*!@:host(.ion-color.ion-focused) .button-native::after*/.ion-color.ion-focused.sc-ion-fab-button-md-h .button-native.sc-ion-fab-button-md::after{background:var(--ion-color-contrast)}/*!@:host(.ion-color.ion-activated) .button-native*/.ion-color.ion-activated.sc-ion-fab-button-md-h .button-native.sc-ion-fab-button-md{color:var(--ion-color-contrast)}/*!@:host(.ion-color.ion-activated) .button-native::after*/.ion-color.ion-activated.sc-ion-fab-button-md-h .button-native.sc-ion-fab-button-md::after{background:transparent}@media (any-hover: hover){/*!@:host(.ion-color:hover) .button-native*/.ion-color.sc-ion-fab-button-md-h:hover .button-native.sc-ion-fab-button-md{color:var(--ion-color-contrast)}/*!@:host(.ion-color:hover) .button-native::after*/.ion-color.sc-ion-fab-button-md-h:hover .button-native.sc-ion-fab-button-md::after{background:var(--ion-color-contrast)}}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part native - The native HTML button or anchor element that wraps all child elements.
* @part close-icon - The close icon that is displayed when a fab list opens (uses ion-icon).
*/
class FabButton {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionFocus = createEvent(this, "ionFocus", 7);
this.ionBlur = createEvent(this, "ionBlur", 7);
/**
* If `true`, the fab button will be show a close icon.
*/
this.activated = false;
/**
* If `true`, the user cannot interact with the fab button.
*/
this.disabled = false;
/**
* When using a router, it specifies the transition direction when navigating to
* another page using `href`.
*/
this.routerDirection = 'forward';
/**
* If `true`, the fab button will show when in a fab-list.
*/
this.show = false;
/**
* If `true`, the fab button will be translucent.
* Only applies when the mode is `"ios"` and the device supports
* [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
*/
this.translucent = false;
/**
* The type of the button.
*/
this.type = 'button';
/**
* The icon name to use for the close icon. This will appear when the fab button
* is pressed. Only applies if it is the main button inside of a fab containing a
* fab list.
*/
this.closeIcon = 'close';
this.onFocus = () => {
this.ionFocus.emit();
};
this.onBlur = () => {
this.ionBlur.emit();
};
}
render() {
const { el, disabled, color, href, activated, show, translucent, size } = this;
const inList = hostContext('ion-fab-list', el);
const mode = getIonMode$1(this);
const TagType = href === undefined ? 'button' : 'a';
const attrs = (TagType === 'button')
? { type: this.type }
: {
download: this.download,
href,
rel: this.rel,
target: this.target
};
return (hAsync(Host, { "aria-disabled": disabled ? 'true' : null, class: createColorClasses$1(color, {
[mode]: true,
'fab-button-in-list': inList,
'fab-button-translucent-in-list': inList && translucent,
'fab-button-close-active': activated,
'fab-button-show': show,
'fab-button-disabled': disabled,
'fab-button-translucent': translucent,
'ion-activatable': true,
'ion-focusable': true,
[`fab-button-${size}`]: size !== undefined,
}) }, hAsync(TagType, Object.assign({}, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur, onClick: (ev) => openURL(href, ev, this.routerDirection, this.routerAnimation) }), hAsync("ion-icon", { icon: this.closeIcon, part: "close-icon", class: "close-icon", lazy: false }), hAsync("span", { class: "button-inner" }, hAsync("slot", null)), mode === 'md' && hAsync("ion-ripple-effect", null))));
}
get el() { return getElement(this); }
static get style() { return {
ios: fabButtonIosCss,
md: fabButtonMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-fab-button",
"$members$": {
"color": [513],
"activated": [4],
"disabled": [4],
"download": [1],
"href": [1],
"rel": [1],
"routerDirection": [1, "router-direction"],
"routerAnimation": [16],
"target": [1],
"show": [4],
"translucent": [4],
"type": [1],
"size": [1],
"closeIcon": [1, "close-icon"]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const fabListCss = "/*!@:host*/.sc-ion-fab-list-h{margin-left:0;margin-right:0;margin-top:66px;margin-bottom:66px;display:none;position:absolute;top:0;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;min-width:56px;min-height:56px}/*!@:host(.fab-list-active)*/.fab-list-active.sc-ion-fab-list-h{display:-ms-flexbox;display:flex}/*!@::slotted(.fab-button-in-list)*/.sc-ion-fab-list-s>.fab-button-in-list{margin-left:0;margin-right:0;margin-top:8px;margin-bottom:8px;width:40px;height:40px;-webkit-transform:scale(0);transform:scale(0);opacity:0;visibility:hidden}/*!@:host(.fab-list-side-top) ::slotted(.fab-button-in-list),\n:host(.fab-list-side-bottom) ::slotted(.fab-button-in-list)*/.sc-ion-fab-list-h.fab-list-side-top .sc-ion-fab-list-s>.fab-button-in-list,.sc-ion-fab-list-h.fab-list-side-bottom .sc-ion-fab-list-s>.fab-button-in-list{margin-left:0;margin-right:0;margin-top:5px;margin-bottom:5px}/*!@:host(.fab-list-side-start) ::slotted(.fab-button-in-list),\n:host(.fab-list-side-end) ::slotted(.fab-button-in-list)*/.sc-ion-fab-list-h.fab-list-side-start .sc-ion-fab-list-s>.fab-button-in-list,.sc-ion-fab-list-h.fab-list-side-end .sc-ion-fab-list-s>.fab-button-in-list{margin-left:5px;margin-right:5px;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.fab-list-side-start) ::slotted(.fab-button-in-list),\n:host(.fab-list-side-end) ::slotted(.fab-button-in-list)*/.sc-ion-fab-list-h.fab-list-side-start .sc-ion-fab-list-s>.fab-button-in-list,.sc-ion-fab-list-h.fab-list-side-end .sc-ion-fab-list-s>.fab-button-in-list{margin-left:unset;margin-right:unset;-webkit-margin-start:5px;margin-inline-start:5px;-webkit-margin-end:5px;margin-inline-end:5px}}/*!@::slotted(.fab-button-in-list.fab-button-show)*/.sc-ion-fab-list-s>.fab-button-in-list.fab-button-show{-webkit-transform:scale(1);transform:scale(1);opacity:1;visibility:visible}/*!@:host(.fab-list-side-top)*/.fab-list-side-top.sc-ion-fab-list-h{top:auto;bottom:0;-ms-flex-direction:column-reverse;flex-direction:column-reverse}/*!@:host(.fab-list-side-start)*/.fab-list-side-start.sc-ion-fab-list-h{margin-left:66px;margin-right:66px;margin-top:0;margin-bottom:0;right:0;-ms-flex-direction:row-reverse;flex-direction:row-reverse}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.fab-list-side-start)*/.fab-list-side-start.sc-ion-fab-list-h{margin-left:unset;margin-right:unset;-webkit-margin-start:66px;margin-inline-start:66px;-webkit-margin-end:66px;margin-inline-end:66px}}/*!@:host-context([dir=rtl]):host(.fab-list-side-start), :host-context([dir=rtl]).fab-list-side-start*/[dir=rtl].sc-ion-fab-list-h -no-combinator.fab-list-side-start.sc-ion-fab-list-h,[dir=rtl] .sc-ion-fab-list-h -no-combinator.fab-list-side-start.sc-ion-fab-list-h,[dir=rtl].fab-list-side-start.sc-ion-fab-list-h,[dir=rtl] .fab-list-side-start.sc-ion-fab-list-h{left:unset;right:unset;left:0}/*!@:host(.fab-list-side-end)*/.fab-list-side-end.sc-ion-fab-list-h{margin-left:66px;margin-right:66px;margin-top:0;margin-bottom:0;left:0;-ms-flex-direction:row;flex-direction:row}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.fab-list-side-end)*/.fab-list-side-end.sc-ion-fab-list-h{margin-left:unset;margin-right:unset;-webkit-margin-start:66px;margin-inline-start:66px;-webkit-margin-end:66px;margin-inline-end:66px}}/*!@:host-context([dir=rtl]):host(.fab-list-side-end), :host-context([dir=rtl]).fab-list-side-end*/[dir=rtl].sc-ion-fab-list-h -no-combinator.fab-list-side-end.sc-ion-fab-list-h,[dir=rtl] .sc-ion-fab-list-h -no-combinator.fab-list-side-end.sc-ion-fab-list-h,[dir=rtl].fab-list-side-end.sc-ion-fab-list-h,[dir=rtl] .fab-list-side-end.sc-ion-fab-list-h{left:unset;right:unset;right:0}";
class FabList {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If `true`, the fab list will show all fab buttons in the list.
*/
this.activated = false;
/**
* The side the fab list will show on relative to the main fab button.
*/
this.side = 'bottom';
}
activatedChanged(activated) {
const fabs = Array.from(this.el.querySelectorAll('ion-fab-button'));
// if showing the fabs add a timeout, else show immediately
const timeout = activated ? 30 : 0;
fabs.forEach((fab, i) => {
setTimeout(() => fab.show = activated, i * timeout);
});
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
'fab-list-active': this.activated,
[`fab-list-side-${this.side}`]: true
} }, hAsync("slot", null)));
}
get el() { return getElement(this); }
static get watchers() { return {
"activated": ["activatedChanged"]
}; }
static get style() { return fabListCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-fab-list",
"$members$": {
"activated": [4],
"side": [1]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const footerIosCss = "ion-footer{display:block;position:relative;-ms-flex-order:1;order:1;width:100%;z-index:10}ion-footer ion-toolbar:last-of-type{padding-bottom:var(--ion-safe-area-bottom, 0)}.footer-ios ion-toolbar:first-of-type{--border-width:0.55px 0 0}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){.footer-background{left:0;right:0;top:0;bottom:0;position:absolute;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}.footer-translucent-ios ion-toolbar{--opacity:.8}}.footer-ios.ion-no-border ion-toolbar:first-of-type{--border-width:0}";
const footerMdCss = "ion-footer{display:block;position:relative;-ms-flex-order:1;order:1;width:100%;z-index:10}ion-footer ion-toolbar:last-of-type{padding-bottom:var(--ion-safe-area-bottom, 0)}.footer-md::before{left:0;top:-2px;bottom:auto;background-position:left 0 top 0;position:absolute;width:100%;height:2px;background-image:url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAHBAMAAADzDtBxAAAAD1BMVEUAAAAAAAAAAAAAAAAAAABPDueNAAAABXRSTlMUCS0gBIh/TXEAAAAaSURBVAjXYxCEAgY4UIICBmMogMsgFLtAAQCNSwXZKOdPxgAAAABJRU5ErkJggg==\");background-repeat:repeat-x;content:\"\"}[dir=rtl] .footer-md::before,:host-context([dir=rtl]) .footer-md::before{left:unset;right:unset;right:0}[dir=rtl] .footer-md::before,:host-context([dir=rtl]) .footer-md::before{background-position:right 0 top 0}.footer-md.ion-no-border::before{display:none}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Footer {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If `true`, the footer will be translucent.
* Only applies when the mode is `"ios"` and the device supports
* [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
*
* Note: In order to scroll content behind the footer, the `fullscreen`
* attribute needs to be set on the content.
*/
this.translucent = false;
}
render() {
const mode = getIonMode$1(this);
const translucent = this.translucent;
return (hAsync(Host, { role: "contentinfo", class: {
[mode]: true,
// Used internally for styling
[`footer-${mode}`]: true,
[`footer-translucent`]: translucent,
[`footer-translucent-${mode}`]: translucent,
} }, mode === 'ios' && translucent &&
hAsync("div", { class: "footer-background" }), hAsync("slot", null)));
}
static get style() { return {
ios: footerIosCss,
md: footerMdCss
}; }
static get cmpMeta() { return {
"$flags$": 36,
"$tagName$": "ion-footer",
"$members$": {
"translucent": [4]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const gridCss = "/*!@:host*/.sc-ion-grid-h{padding-left:var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));padding-right:var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));padding-top:var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));padding-bottom:var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));margin-left:auto;margin-right:auto;display:block;-ms-flex:1;flex:1}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-grid-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));padding-inline-start:var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));-webkit-padding-end:var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));padding-inline-end:var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px))}}@media (min-width: 576px){/*!@:host*/.sc-ion-grid-h{padding-left:var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));padding-right:var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));padding-top:var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));padding-bottom:var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px))}/*!@@supports (margin-inline-start: 0) or (-webkit-margin-start: 0)*/@supports .sc-ion-grid (margin-inline-start.sc-ion-grid: 0).sc-ion-grid or.sc-ion-grid (-webkit-margin-start.sc-ion-grid: 0).sc-ion-grid{.sc-ion-grid-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));padding-inline-start:var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));-webkit-padding-end:var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));padding-inline-end:var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px))}}}@media (min-width: 768px){/*!@:host*/.sc-ion-grid-h{padding-left:var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));padding-right:var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));padding-top:var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));padding-bottom:var(--ion-grid-padding-md, var(--ion-grid-padding, 5px))}/*!@@supports (margin-inline-start: 0) or (-webkit-margin-start: 0)*/@supports .sc-ion-grid (margin-inline-start.sc-ion-grid: 0).sc-ion-grid or.sc-ion-grid (-webkit-margin-start.sc-ion-grid: 0).sc-ion-grid{.sc-ion-grid-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));padding-inline-start:var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));-webkit-padding-end:var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));padding-inline-end:var(--ion-grid-padding-md, var(--ion-grid-padding, 5px))}}}@media (min-width: 992px){/*!@:host*/.sc-ion-grid-h{padding-left:var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));padding-right:var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));padding-top:var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));padding-bottom:var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px))}/*!@@supports (margin-inline-start: 0) or (-webkit-margin-start: 0)*/@supports .sc-ion-grid (margin-inline-start.sc-ion-grid: 0).sc-ion-grid or.sc-ion-grid (-webkit-margin-start.sc-ion-grid: 0).sc-ion-grid{.sc-ion-grid-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));padding-inline-start:var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));-webkit-padding-end:var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));padding-inline-end:var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px))}}}@media (min-width: 1200px){/*!@:host*/.sc-ion-grid-h{padding-left:var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));padding-right:var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));padding-top:var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));padding-bottom:var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px))}/*!@@supports (margin-inline-start: 0) or (-webkit-margin-start: 0)*/@supports .sc-ion-grid (margin-inline-start.sc-ion-grid: 0).sc-ion-grid or.sc-ion-grid (-webkit-margin-start.sc-ion-grid: 0).sc-ion-grid{.sc-ion-grid-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));padding-inline-start:var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));-webkit-padding-end:var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));padding-inline-end:var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px))}}}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-grid-h{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}/*!@:host(.grid-fixed)*/.grid-fixed.sc-ion-grid-h{width:var(--ion-grid-width-xs, var(--ion-grid-width, 100%));max-width:100%}@media (min-width: 576px){/*!@:host(.grid-fixed)*/.grid-fixed.sc-ion-grid-h{width:var(--ion-grid-width-sm, var(--ion-grid-width, 540px))}}@media (min-width: 768px){/*!@:host(.grid-fixed)*/.grid-fixed.sc-ion-grid-h{width:var(--ion-grid-width-md, var(--ion-grid-width, 720px))}}@media (min-width: 992px){/*!@:host(.grid-fixed)*/.grid-fixed.sc-ion-grid-h{width:var(--ion-grid-width-lg, var(--ion-grid-width, 960px))}}@media (min-width: 1200px){/*!@:host(.grid-fixed)*/.grid-fixed.sc-ion-grid-h{width:var(--ion-grid-width-xl, var(--ion-grid-width, 1140px))}}/*!@:host(.ion-no-padding)*/.ion-no-padding.sc-ion-grid-h{--ion-grid-column-padding:0;--ion-grid-column-padding-xs:0;--ion-grid-column-padding-sm:0;--ion-grid-column-padding-md:0;--ion-grid-column-padding-lg:0;--ion-grid-column-padding-xl:0}";
class Grid {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If `true`, the grid will have a fixed width based on the screen size.
*/
this.fixed = false;
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
'grid-fixed': this.fixed
} }, hAsync("slot", null)));
}
static get style() { return gridCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-grid",
"$members$": {
"fixed": [4]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const TRANSITION = 'all 0.2s ease-in-out';
const cloneElement = (tagName) => {
const getCachedEl = document.querySelector(`${tagName}.ion-cloned-element`);
if (getCachedEl !== null) {
return getCachedEl;
}
const clonedEl = document.createElement(tagName);
clonedEl.classList.add('ion-cloned-element');
clonedEl.style.setProperty('display', 'none');
document.body.appendChild(clonedEl);
return clonedEl;
};
const createHeaderIndex = (headerEl) => {
if (!headerEl) {
return;
}
const toolbars = headerEl.querySelectorAll('ion-toolbar');
return {
el: headerEl,
toolbars: Array.from(toolbars).map((toolbar) => {
const ionTitleEl = toolbar.querySelector('ion-title');
return {
el: toolbar,
background: toolbar.shadowRoot.querySelector('.toolbar-background'),
ionTitleEl,
innerTitleEl: (ionTitleEl) ? ionTitleEl.shadowRoot.querySelector('.toolbar-title') : null,
ionButtonsEl: Array.from(toolbar.querySelectorAll('ion-buttons')) || []
};
}) || []
};
};
const handleContentScroll = (scrollEl, scrollHeaderIndex, contentEl) => {
readTask(() => {
const scrollTop = scrollEl.scrollTop;
const scale = clamp(1, 1 + (-scrollTop / 500), 1.1);
// Native refresher should not cause titles to scale
const nativeRefresher = contentEl.querySelector('ion-refresher.refresher-native');
if (nativeRefresher === null) {
writeTask(() => {
scaleLargeTitles(scrollHeaderIndex.toolbars, scale);
});
}
});
};
const setToolbarBackgroundOpacity = (toolbar, opacity) => {
if (opacity === undefined) {
toolbar.background.style.removeProperty('--opacity');
}
else {
toolbar.background.style.setProperty('--opacity', opacity.toString());
}
};
const handleToolbarBorderIntersection = (ev, mainHeaderIndex, scrollTop) => {
if (!ev[0].isIntersecting) {
return;
}
/**
* There is a bug in Safari where overflow scrolling on a non-body element
* does not always reset the scrollTop position to 0 when letting go. It will
* set to 1 once the rubber band effect has ended. This causes the background to
* appear slightly on certain app setups.
*
* Additionally, we check if user is rubber banding (scrolling is negative)
* as this can mean they are using pull to refresh. Once the refresher starts,
* the content is transformed which can cause the intersection observer to erroneously
* fire here as well.
*/
const scale = (ev[0].intersectionRatio > 0.9 || scrollTop <= 0) ? 0 : ((1 - ev[0].intersectionRatio) * 100) / 75;
mainHeaderIndex.toolbars.forEach(toolbar => {
setToolbarBackgroundOpacity(toolbar, (scale === 1) ? undefined : scale);
});
};
/**
* If toolbars are intersecting, hide the scrollable toolbar content
* and show the primary toolbar content. If the toolbars are not intersecting,
* hide the primary toolbar content and show the scrollable toolbar content
*/
const handleToolbarIntersection = (ev, mainHeaderIndex, scrollHeaderIndex, scrollEl) => {
writeTask(() => {
const scrollTop = scrollEl.scrollTop;
handleToolbarBorderIntersection(ev, mainHeaderIndex, scrollTop);
const event = ev[0];
const intersection = event.intersectionRect;
const intersectionArea = intersection.width * intersection.height;
const rootArea = event.rootBounds.width * event.rootBounds.height;
const isPageHidden = intersectionArea === 0 && rootArea === 0;
const leftDiff = Math.abs(intersection.left - event.boundingClientRect.left);
const rightDiff = Math.abs(intersection.right - event.boundingClientRect.right);
const isPageTransitioning = intersectionArea > 0 && (leftDiff >= 5 || rightDiff >= 5);
if (isPageHidden || isPageTransitioning) {
return;
}
if (event.isIntersecting) {
setHeaderActive(mainHeaderIndex, false);
setHeaderActive(scrollHeaderIndex);
}
else {
/**
* There is a bug with IntersectionObserver on Safari
* where `event.isIntersecting === false` when cancelling
* a swipe to go back gesture. Checking the intersection
* x, y, width, and height provides a workaround. This bug
* does not happen when using Safari + Web Animations,
* only Safari + CSS Animations.
*/
const hasValidIntersection = (intersection.x === 0 && intersection.y === 0) || (intersection.width !== 0 && intersection.height !== 0);
if (hasValidIntersection && scrollTop > 0) {
setHeaderActive(mainHeaderIndex);
setHeaderActive(scrollHeaderIndex, false);
setToolbarBackgroundOpacity(mainHeaderIndex.toolbars[0]);
}
}
});
};
const setHeaderActive = (headerIndex, active = true) => {
if (active) {
headerIndex.el.classList.remove('header-collapse-condense-inactive');
}
else {
headerIndex.el.classList.add('header-collapse-condense-inactive');
}
};
const scaleLargeTitles = (toolbars = [], scale = 1, transition = false) => {
toolbars.forEach(toolbar => {
const ionTitle = toolbar.ionTitleEl;
const titleDiv = toolbar.innerTitleEl;
if (!ionTitle || ionTitle.size !== 'large') {
return;
}
titleDiv.style.transition = (transition) ? TRANSITION : '';
titleDiv.style.transform = `scale3d(${scale}, ${scale}, 1)`;
});
};
const headerIosCss = "ion-header{display:block;position:relative;-ms-flex-order:-1;order:-1;width:100%;z-index:10}ion-header ion-toolbar:first-of-type{padding-top:var(--ion-safe-area-top, 0)}.header-ios ion-toolbar:last-of-type{--border-width:0 0 0.55px}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){.header-background{left:0;right:0;top:0;bottom:0;position:absolute;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}.header-translucent-ios ion-toolbar{--opacity:.8}.header-collapse-condense-inactive .header-background{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}}.header-ios.ion-no-border ion-toolbar:last-of-type{--border-width:0}.header-collapse-condense{z-index:9}.header-collapse-condense ion-toolbar{position:-webkit-sticky;position:sticky;top:0}.header-collapse-condense ion-toolbar:first-of-type{padding-top:7px;z-index:1}.header-collapse-condense ion-toolbar{--background:var(--ion-background-color, #fff);z-index:0}.header-collapse-condense ion-toolbar ion-searchbar{height:48px;padding-top:0px;padding-bottom:13px}.header-collapse-main ion-toolbar.in-toolbar ion-title,.header-collapse-main ion-toolbar.in-toolbar ion-buttons{-webkit-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out}.header-collapse-condense-inactive:not(.header-collapse-condense) ion-toolbar.in-toolbar ion-title,.header-collapse-condense-inactive:not(.header-collapse-condense) ion-toolbar.in-toolbar ion-buttons.buttons-collapse{opacity:0;pointer-events:none}.header-collapse-condense-inactive.header-collapse-condense ion-toolbar.in-toolbar ion-title,.header-collapse-condense-inactive.header-collapse-condense ion-toolbar.in-toolbar ion-buttons.buttons-collapse{visibility:hidden}";
const headerMdCss = "ion-header{display:block;position:relative;-ms-flex-order:-1;order:-1;width:100%;z-index:10}ion-header ion-toolbar:first-of-type{padding-top:var(--ion-safe-area-top, 0)}.header-md::after{left:0;bottom:-5px;background-position:left 0 top -2px;position:absolute;width:100%;height:5px;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAHBAMAAADzDtBxAAAAD1BMVEUAAAAAAAAAAAAAAAAAAABPDueNAAAABXRSTlMUCS0gBIh/TXEAAAAaSURBVAjXYxCEAgY4UIICBmMogMsgFLtAAQCNSwXZKOdPxgAAAABJRU5ErkJggg==);background-repeat:repeat-x;content:\"\"}[dir=rtl] .header-md::after,:host-context([dir=rtl]) .header-md::after{left:unset;right:unset;right:0}[dir=rtl] .header-md::after,:host-context([dir=rtl]) .header-md::after{background-position:right 0 top -2px}.header-collapse-condense{display:none}.header-md.ion-no-border::after{display:none}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Header {
constructor(hostRef) {
registerInstance(this, hostRef);
this.collapsibleHeaderInitialized = false;
/**
* If `true`, the header will be translucent.
* Only applies when the mode is `"ios"` and the device supports
* [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
*
* Note: In order to scroll content behind the header, the `fullscreen`
* attribute needs to be set on the content.
*/
this.translucent = false;
}
async componentDidLoad() {
await this.checkCollapsibleHeader();
}
async componentDidUpdate() {
await this.checkCollapsibleHeader();
}
disconnectedCallback() {
this.destroyCollapsibleHeader();
}
async checkCollapsibleHeader() {
// Determine if the header can collapse
const hasCollapse = this.collapse === 'condense';
const canCollapse = (hasCollapse && getIonMode$1(this) === 'ios') ? hasCollapse : false;
if (!canCollapse && this.collapsibleHeaderInitialized) {
this.destroyCollapsibleHeader();
}
else if (canCollapse && !this.collapsibleHeaderInitialized) {
const pageEl = this.el.closest('ion-app,ion-page,.ion-page,page-inner');
const contentEl = (pageEl) ? pageEl.querySelector('ion-content') : null;
// Cloned elements are always needed in iOS transition
writeTask(() => {
const title = cloneElement('ion-title');
title.size = 'large';
cloneElement('ion-back-button');
});
await this.setupCollapsibleHeader(contentEl, pageEl);
}
}
destroyCollapsibleHeader() {
if (this.intersectionObserver) {
this.intersectionObserver.disconnect();
this.intersectionObserver = undefined;
}
if (this.scrollEl && this.contentScrollCallback) {
this.scrollEl.removeEventListener('scroll', this.contentScrollCallback);
this.contentScrollCallback = undefined;
}
if (this.collapsibleMainHeader) {
this.collapsibleMainHeader.classList.remove('header-collapse-main');
this.collapsibleMainHeader = undefined;
}
}
async setupCollapsibleHeader(contentEl, pageEl) {
if (!contentEl || !pageEl) {
console.error('ion-header requires a content to collapse, make sure there is an ion-content.');
return;
}
if (typeof IntersectionObserver === 'undefined') {
return;
}
this.scrollEl = await contentEl.getScrollElement();
const headers = pageEl.querySelectorAll('ion-header');
this.collapsibleMainHeader = Array.from(headers).find((header) => header.collapse !== 'condense');
if (!this.collapsibleMainHeader) {
return;
}
const mainHeaderIndex = createHeaderIndex(this.collapsibleMainHeader);
const scrollHeaderIndex = createHeaderIndex(this.el);
if (!mainHeaderIndex || !scrollHeaderIndex) {
return;
}
setHeaderActive(mainHeaderIndex, false);
mainHeaderIndex.toolbars.forEach(toolbar => {
setToolbarBackgroundOpacity(toolbar, 0);
});
/**
* Handle interaction between toolbar collapse and
* showing/hiding content in the primary ion-header
* as well as progressively showing/hiding the main header
* border as the top-most toolbar collapses or expands.
*/
const toolbarIntersection = (ev) => { handleToolbarIntersection(ev, mainHeaderIndex, scrollHeaderIndex, this.scrollEl); };
this.intersectionObserver = new IntersectionObserver(toolbarIntersection, { root: contentEl, threshold: [0.25, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1] });
this.intersectionObserver.observe(scrollHeaderIndex.toolbars[scrollHeaderIndex.toolbars.length - 1].el);
/**
* Handle scaling of large iOS titles and
* showing/hiding border on last toolbar
* in primary header
*/
this.contentScrollCallback = () => { handleContentScroll(this.scrollEl, scrollHeaderIndex, contentEl); };
this.scrollEl.addEventListener('scroll', this.contentScrollCallback);
writeTask(() => {
if (this.collapsibleMainHeader !== undefined) {
this.collapsibleMainHeader.classList.add('header-collapse-main');
}
});
this.collapsibleHeaderInitialized = true;
}
render() {
const { translucent } = this;
const mode = getIonMode$1(this);
const collapse = this.collapse || 'none';
return (hAsync(Host, { role: "banner", class: {
[mode]: true,
// Used internally for styling
[`header-${mode}`]: true,
[`header-translucent`]: this.translucent,
[`header-collapse-${collapse}`]: true,
[`header-translucent-${mode}`]: this.translucent,
} }, mode === 'ios' && translucent &&
hAsync("div", { class: "header-background" }), hAsync("slot", null)));
}
get el() { return getElement(this); }
static get style() { return {
ios: headerIosCss,
md: headerMdCss
}; }
static get cmpMeta() { return {
"$flags$": 36,
"$tagName$": "ion-header",
"$members$": {
"collapse": [1],
"translucent": [4]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const getName = (iconName, icon, mode, ios, md) => {
// default to "md" if somehow the mode wasn't set
mode = (mode && toLower(mode)) === 'ios' ? 'ios' : 'md';
// if an icon was passed in using the ios or md attributes
// set the iconName to whatever was passed in
if (ios && mode === 'ios') {
iconName = toLower(ios);
}
else if (md && mode === 'md') {
iconName = toLower(md);
}
else {
if (!iconName && icon && !isSrc(icon)) {
iconName = icon;
}
if (isStr(iconName)) {
iconName = toLower(iconName);
}
}
if (!isStr(iconName) || iconName.trim() === '') {
return null;
}
// only allow alpha characters and dash
const invalidChars = iconName.replace(/[a-z]|-|\d/gi, '');
if (invalidChars !== '') {
return null;
}
return iconName;
};
const isSrc = (str) => str.length > 0 && /(\/|\.)/.test(str);
const isStr = (val) => typeof val === 'string';
const toLower = (val) => val.toLowerCase();
const iconCss = "/*!@:host*/.sc-ion-icon-h{display:inline-block;width:1em;height:1em;contain:strict;fill:currentColor;-webkit-box-sizing:content-box !important;box-sizing:content-box !important}/*!@:host .ionicon*/.sc-ion-icon-h .ionicon.sc-ion-icon{stroke:currentColor}/*!@.ionicon-fill-none*/.ionicon-fill-none.sc-ion-icon{fill:none}/*!@.ionicon-stroke-width*/.ionicon-stroke-width.sc-ion-icon{stroke-width:32px;stroke-width:var(--ionicon-stroke-width, 32px)}/*!@.icon-inner,\n.ionicon,\nsvg*/.icon-inner.sc-ion-icon,.ionicon.sc-ion-icon,svg.sc-ion-icon{display:block;height:100%;width:100%}/*!@:host(.flip-rtl) .icon-inner*/.flip-rtl.sc-ion-icon-h .icon-inner.sc-ion-icon{-webkit-transform:scaleX(-1);transform:scaleX(-1)}/*!@:host(.icon-small)*/.icon-small.sc-ion-icon-h{font-size:18px !important}/*!@:host(.icon-large)*/.icon-large.sc-ion-icon-h{font-size:32px !important}/*!@:host(.ion-color)*/.ion-color.sc-ion-icon-h{color:var(--ion-color-base) !important}/*!@:host(.ion-color-primary)*/.ion-color-primary.sc-ion-icon-h{--ion-color-base:var(--ion-color-primary, #3880ff)}/*!@:host(.ion-color-secondary)*/.ion-color-secondary.sc-ion-icon-h{--ion-color-base:var(--ion-color-secondary, #0cd1e8)}/*!@:host(.ion-color-tertiary)*/.ion-color-tertiary.sc-ion-icon-h{--ion-color-base:var(--ion-color-tertiary, #f4a942)}/*!@:host(.ion-color-success)*/.ion-color-success.sc-ion-icon-h{--ion-color-base:var(--ion-color-success, #10dc60)}/*!@:host(.ion-color-warning)*/.ion-color-warning.sc-ion-icon-h{--ion-color-base:var(--ion-color-warning, #ffce00)}/*!@:host(.ion-color-danger)*/.ion-color-danger.sc-ion-icon-h{--ion-color-base:var(--ion-color-danger, #f14141)}/*!@:host(.ion-color-light)*/.ion-color-light.sc-ion-icon-h{--ion-color-base:var(--ion-color-light, #f4f5f8)}/*!@:host(.ion-color-medium)*/.ion-color-medium.sc-ion-icon-h{--ion-color-base:var(--ion-color-medium, #989aa2)}/*!@:host(.ion-color-dark)*/.ion-color-dark.sc-ion-icon-h{--ion-color-base:var(--ion-color-dark, #222428)}";
class Icon {
constructor(hostRef) {
registerInstance(this, hostRef);
this.iconName = null;
this.isVisible = false;
/**
* The mode determines which platform styles to use.
*/
this.mode = getIonMode();
/**
* If enabled, ion-icon will be loaded lazily when it's visible in the viewport.
* Default, `false`.
*/
this.lazy = false;
/**
* When set to `false`, SVG content that is HTTP fetched will not be checked
* if the response SVG content has any `<script>` elements, or any attributes
* that start with `on`, such as `onclick`.
* @default true
*/
this.sanitize = true;
}
connectedCallback() {
// purposely do not return the promise here because loading
// the svg file should not hold up loading the app
// only load the svg if it's visible
this.waitUntilVisible(this.el, '50px', () => {
this.isVisible = true;
this.loadIcon();
});
}
disconnectedCallback() {
if (this.io) {
this.io.disconnect();
this.io = undefined;
}
}
waitUntilVisible(el, rootMargin, cb) {
{
// browser doesn't support IntersectionObserver
// so just fallback to always show it
cb();
}
}
loadIcon() {
const label = this.iconName = getName(this.name, this.icon, this.mode, this.ios, this.md);
if (!this.ariaLabel && this.ariaHidden !== 'true') {
// user did not provide a label
// come up with the label based on the icon name
if (label) {
this.ariaLabel = label.replace(/\-/g, ' ');
}
}
}
render() {
const { iconName } = this;
const mode = this.mode || 'md';
const flipRtl = this.flipRtl ||
(iconName &&
(iconName.indexOf('arrow') > -1 || iconName.indexOf('chevron') > -1) &&
this.flipRtl !== false);
return (hAsync(Host, { role: "img", class: Object.assign(Object.assign({ [mode]: true }, createColorClasses(this.color)), { [`icon-${this.size}`]: !!this.size, 'flip-rtl': !!flipRtl && this.el.ownerDocument.dir === 'rtl' }) }, (hAsync("div", { class: "icon-inner" }))));
}
static get assetsDirs() { return ["svg"]; }
get el() { return getElement(this); }
static get watchers() { return {
"name": ["loadIcon"],
"src": ["loadIcon"],
"icon": ["loadIcon"]
}; }
static get style() { return iconCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-icon",
"$members$": {
"mode": [1025],
"color": [1],
"ariaLabel": [1537, "aria-label"],
"ariaHidden": [513, "aria-hidden"],
"ios": [1],
"md": [1],
"flipRtl": [4, "flip-rtl"],
"name": [513],
"src": [1],
"icon": [8],
"size": [1],
"lazy": [4],
"sanitize": [4],
"svgContent": [32],
"isVisible": [32]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["ariaLabel", "aria-label"], ["ariaHidden", "aria-hidden"], ["name", "name"]]
}; }
}
const getIonMode = () => 'md';
const createColorClasses = (color) => {
return color
? {
'ion-color': true,
[`ion-color-${color}`]: true,
}
: null;
};
const imgCss = "/*!@:host*/.sc-ion-img-h{display:block;-o-object-fit:contain;object-fit:contain}/*!@img*/img.sc-ion-img{display:block;width:100%;height:100%;-o-object-fit:inherit;object-fit:inherit;-o-object-position:inherit;object-position:inherit}";
/**
* @part image - The inner `img` element.
*/
class Img {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionImgWillLoad = createEvent(this, "ionImgWillLoad", 7);
this.ionImgDidLoad = createEvent(this, "ionImgDidLoad", 7);
this.ionError = createEvent(this, "ionError", 7);
this.onLoad = () => {
this.ionImgDidLoad.emit();
};
this.onError = () => {
this.ionError.emit();
};
}
srcChanged() {
this.addIO();
}
componentDidLoad() {
this.addIO();
}
addIO() {
if (this.src === undefined) {
return;
}
if (typeof window !== 'undefined' &&
'IntersectionObserver' in window &&
'IntersectionObserverEntry' in window &&
'isIntersecting' in window.IntersectionObserverEntry.prototype) {
this.removeIO();
this.io = new IntersectionObserver(data => {
/**
* On slower devices, it is possible for an intersection observer entry to contain multiple
* objects in the array. This happens when quickly scrolling an image into view and then out of
* view. In this case, the last object represents the current state of the component.
*/
if (data[data.length - 1].isIntersecting) {
this.load();
this.removeIO();
}
});
this.io.observe(this.el);
}
else {
// fall back to setTimeout for Safari and IE
setTimeout(() => this.load(), 200);
}
}
load() {
this.loadError = this.onError;
this.loadSrc = this.src;
this.ionImgWillLoad.emit();
}
removeIO() {
if (this.io) {
this.io.disconnect();
this.io = undefined;
}
}
render() {
return (hAsync(Host, { class: getIonMode$1(this) }, hAsync("img", { decoding: "async", src: this.loadSrc, alt: this.alt, onLoad: this.onLoad, onError: this.loadError, part: "image" })));
}
get el() { return getElement(this); }
static get watchers() { return {
"src": ["srcChanged"]
}; }
static get style() { return imgCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-img",
"$members$": {
"alt": [1],
"src": [1],
"loadSrc": [32],
"loadError": [32]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const infiniteScrollCss = "ion-infinite-scroll{display:none;width:100%}.infinite-scroll-enabled{display:block}";
class InfiniteScroll {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionInfinite = createEvent(this, "ionInfinite", 7);
this.thrPx = 0;
this.thrPc = 0;
this.didFire = false;
this.isBusy = false;
this.isLoading = false;
/**
* The threshold distance from the bottom
* of the content to call the `infinite` output event when scrolled.
* The threshold value can be either a percent, or
* in pixels. For example, use the value of `10%` for the `infinite`
* output event to get called when the user has scrolled 10%
* from the bottom of the page. Use the value `100px` when the
* scroll is within 100 pixels from the bottom of the page.
*/
this.threshold = '15%';
/**
* If `true`, the infinite scroll will be hidden and scroll event listeners
* will be removed.
*
* Set this to true to disable the infinite scroll from actively
* trying to receive new data while scrolling. This is useful
* when it is known that there is no more data that can be added, and
* the infinite scroll is no longer needed.
*/
this.disabled = false;
/**
* The position of the infinite scroll element.
* The value can be either `top` or `bottom`.
*/
this.position = 'bottom';
this.onScroll = () => {
const scrollEl = this.scrollEl;
if (!scrollEl || !this.canStart()) {
return 1;
}
const infiniteHeight = this.el.offsetHeight;
if (infiniteHeight === 0) {
// if there is no height of this element then do nothing
return 2;
}
const scrollTop = scrollEl.scrollTop;
const scrollHeight = scrollEl.scrollHeight;
const height = scrollEl.offsetHeight;
const threshold = this.thrPc !== 0 ? (height * this.thrPc) : this.thrPx;
const distanceFromInfinite = (this.position === 'bottom')
? scrollHeight - infiniteHeight - scrollTop - threshold - height
: scrollTop - infiniteHeight - threshold;
if (distanceFromInfinite < 0) {
if (!this.didFire) {
this.isLoading = true;
this.didFire = true;
this.ionInfinite.emit();
return 3;
}
}
else {
this.didFire = false;
}
return 4;
};
}
thresholdChanged() {
const val = this.threshold;
if (val.lastIndexOf('%') > -1) {
this.thrPx = 0;
this.thrPc = (parseFloat(val) / 100);
}
else {
this.thrPx = parseFloat(val);
this.thrPc = 0;
}
}
disabledChanged() {
const disabled = this.disabled;
if (disabled) {
this.isLoading = false;
this.isBusy = false;
}
this.enableScrollEvents(!disabled);
}
async connectedCallback() {
const contentEl = this.el.closest('ion-content');
if (!contentEl) {
console.error('<ion-infinite-scroll> must be used inside an <ion-content>');
return;
}
this.scrollEl = await contentEl.getScrollElement();
this.thresholdChanged();
this.disabledChanged();
if (this.position === 'top') {
writeTask(() => {
if (this.scrollEl) {
this.scrollEl.scrollTop = this.scrollEl.scrollHeight - this.scrollEl.clientHeight;
}
});
}
}
disconnectedCallback() {
this.enableScrollEvents(false);
this.scrollEl = undefined;
}
/**
* Call `complete()` within the `ionInfinite` output event handler when
* your async operation has completed. For example, the `loading`
* state is while the app is performing an asynchronous operation,
* such as receiving more data from an AJAX request to add more items
* to a data list. Once the data has been received and UI updated, you
* then call this method to signify that the loading has completed.
* This method will change the infinite scroll's state from `loading`
* to `enabled`.
*/
async complete() {
const scrollEl = this.scrollEl;
if (!this.isLoading || !scrollEl) {
return;
}
this.isLoading = false;
if (this.position === 'top') {
/**
* New content is being added at the top, but the scrollTop position stays the same,
* which causes a scroll jump visually. This algorithm makes sure to prevent this.
* (Frame 1)
* - complete() is called, but the UI hasn't had time to update yet.
* - Save the current content dimensions.
* - Wait for the next frame using _dom.read, so the UI will be updated.
* (Frame 2)
* - Read the new content dimensions.
* - Calculate the height difference and the new scroll position.
* - Delay the scroll position change until other possible dom reads are done using _dom.write to be performant.
* (Still frame 2, if I'm correct)
* - Change the scroll position (= visually maintain the scroll position).
* - Change the state to re-enable the InfiniteScroll.
* - This should be after changing the scroll position, or it could
* cause the InfiniteScroll to be triggered again immediately.
* (Frame 3)
* Done.
*/
this.isBusy = true;
// ******** DOM READ ****************
// Save the current content dimensions before the UI updates
const prev = scrollEl.scrollHeight - scrollEl.scrollTop;
// ******** DOM READ ****************
requestAnimationFrame(() => {
readTask(() => {
// UI has updated, save the new content dimensions
const scrollHeight = scrollEl.scrollHeight;
// New content was added on top, so the scroll position should be changed immediately to prevent it from jumping around
const newScrollTop = scrollHeight - prev;
// ******** DOM WRITE ****************
requestAnimationFrame(() => {
writeTask(() => {
scrollEl.scrollTop = newScrollTop;
this.isBusy = false;
});
});
});
});
}
}
canStart() {
return (!this.disabled &&
!this.isBusy &&
!!this.scrollEl &&
!this.isLoading);
}
enableScrollEvents(shouldListen) {
if (this.scrollEl) {
if (shouldListen) {
this.scrollEl.addEventListener('scroll', this.onScroll);
}
else {
this.scrollEl.removeEventListener('scroll', this.onScroll);
}
}
}
render() {
const mode = getIonMode$1(this);
const disabled = this.disabled;
return (hAsync(Host, { class: {
[mode]: true,
'infinite-scroll-loading': this.isLoading,
'infinite-scroll-enabled': !disabled
} }));
}
get el() { return getElement(this); }
static get watchers() { return {
"threshold": ["thresholdChanged"],
"disabled": ["disabledChanged"]
}; }
static get style() { return infiniteScrollCss; }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-infinite-scroll",
"$members$": {
"threshold": [1],
"disabled": [4],
"position": [1],
"isLoading": [32],
"complete": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const infiniteScrollContentIosCss = "ion-infinite-scroll-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;min-height:84px;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.infinite-loading{margin-left:0;margin-right:0;margin-top:0;margin-bottom:32px;display:none;width:100%}.infinite-loading-text{margin-left:32px;margin-right:32px;margin-top:4px;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.infinite-loading-text{margin-left:unset;margin-right:unset;-webkit-margin-start:32px;margin-inline-start:32px;-webkit-margin-end:32px;margin-inline-end:32px}}.infinite-scroll-loading ion-infinite-scroll-content>.infinite-loading{display:block}.infinite-scroll-content-ios .infinite-loading-text{color:var(--ion-color-step-600, #666666)}.infinite-scroll-content-ios .infinite-loading-spinner .spinner-lines-ios line,.infinite-scroll-content-ios .infinite-loading-spinner .spinner-lines-small-ios line,.infinite-scroll-content-ios .infinite-loading-spinner .spinner-crescent circle{stroke:var(--ion-color-step-600, #666666)}.infinite-scroll-content-ios .infinite-loading-spinner .spinner-bubbles circle,.infinite-scroll-content-ios .infinite-loading-spinner .spinner-circles circle,.infinite-scroll-content-ios .infinite-loading-spinner .spinner-dots circle{fill:var(--ion-color-step-600, #666666)}";
const infiniteScrollContentMdCss = "ion-infinite-scroll-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;min-height:84px;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.infinite-loading{margin-left:0;margin-right:0;margin-top:0;margin-bottom:32px;display:none;width:100%}.infinite-loading-text{margin-left:32px;margin-right:32px;margin-top:4px;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.infinite-loading-text{margin-left:unset;margin-right:unset;-webkit-margin-start:32px;margin-inline-start:32px;-webkit-margin-end:32px;margin-inline-end:32px}}.infinite-scroll-loading ion-infinite-scroll-content>.infinite-loading{display:block}.infinite-scroll-content-md .infinite-loading-text{color:var(--ion-color-step-600, #666666)}.infinite-scroll-content-md .infinite-loading-spinner .spinner-lines-md line,.infinite-scroll-content-md .infinite-loading-spinner .spinner-lines-small-md line,.infinite-scroll-content-md .infinite-loading-spinner .spinner-crescent circle{stroke:var(--ion-color-step-600, #666666)}.infinite-scroll-content-md .infinite-loading-spinner .spinner-bubbles circle,.infinite-scroll-content-md .infinite-loading-spinner .spinner-circles circle,.infinite-scroll-content-md .infinite-loading-spinner .spinner-dots circle{fill:var(--ion-color-step-600, #666666)}";
class InfiniteScrollContent {
constructor(hostRef) {
registerInstance(this, hostRef);
}
componentDidLoad() {
if (this.loadingSpinner === undefined) {
const mode = getIonMode$1(this);
this.loadingSpinner = config.get('infiniteLoadingSpinner', config.get('spinner', mode === 'ios' ? 'lines' : 'crescent'));
}
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
// Used internally for styling
[`infinite-scroll-content-${mode}`]: true
} }, hAsync("div", { class: "infinite-loading" }, this.loadingSpinner && (hAsync("div", { class: "infinite-loading-spinner" }, hAsync("ion-spinner", { name: this.loadingSpinner }))), this.loadingText && (hAsync("div", { class: "infinite-loading-text", innerHTML: sanitizeDOMString(this.loadingText) })))));
}
static get style() { return {
ios: infiniteScrollContentIosCss,
md: infiniteScrollContentMdCss
}; }
static get cmpMeta() { return {
"$flags$": 32,
"$tagName$": "ion-infinite-scroll-content",
"$members$": {
"loadingSpinner": [1025, "loading-spinner"],
"loadingText": [1, "loading-text"]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const inputIosCss = ".sc-ion-input-ios-h{--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:.5;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;--background:transparent;--color:initial;display:-ms-flexbox;display:flex;position:relative;-ms-flex:1;flex:1;-ms-flex-align:center;align-items:center;width:100%;padding:0 !important;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2}ion-item.sc-ion-input-ios-h:not(.item-label),ion-item:not(.item-label) .sc-ion-input-ios-h{--padding-start:0}.ion-color.sc-ion-input-ios-h{color:var(--ion-color-base)}.native-input.sc-ion-input-ios{border-radius:var(--border-radius);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:inline-block;-ms-flex:1;flex:1;width:100%;max-width:100%;max-height:100%;border:0;outline:none;background:transparent;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.native-input.sc-ion-input-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}.native-input.sc-ion-input-ios::-webkit-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios::-moz-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios:-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios::-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios:-webkit-autofill{background-color:transparent}.native-input.sc-ion-input-ios:invalid{-webkit-box-shadow:none;box-shadow:none}.native-input.sc-ion-input-ios::-ms-clear{display:none}.native-input[disabled].sc-ion-input-ios{opacity:0.4}.cloned-input.sc-ion-input-ios{left:0;top:0;position:absolute;pointer-events:none}[dir=rtl].sc-ion-input-ios .cloned-input.sc-ion-input-ios,[dir=rtl].sc-ion-input-ios-h .cloned-input.sc-ion-input-ios,[dir=rtl] .sc-ion-input-ios-h .cloned-input.sc-ion-input-ios{left:unset;right:unset;right:0}.input-clear-icon.sc-ion-input-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;background-position:center;border:0;outline:none;background-color:transparent;background-repeat:no-repeat;visibility:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}.input-clear-icon.sc-ion-input-ios:focus{opacity:0.5}.has-value.sc-ion-input-ios-h .input-clear-icon.sc-ion-input-ios{visibility:visible}.has-focus.sc-ion-input-ios-h{pointer-events:none}.has-focus.sc-ion-input-ios-h input.sc-ion-input-ios,.has-focus.sc-ion-input-ios-h a.sc-ion-input-ios,.has-focus.sc-ion-input-ios-h button.sc-ion-input-ios{pointer-events:auto}.item-label-floating.item-has-placeholder.sc-ion-input-ios-h:not(.item-has-value),.item-label-floating.item-has-placeholder:not(.item-has-value) .sc-ion-input-ios-h{opacity:0}.item-label-floating.item-has-placeholder.sc-ion-input-ios-h:not(.item-has-value).item-has-focus,.item-label-floating.item-has-placeholder:not(.item-has-value).item-has-focus .sc-ion-input-ios-h{-webkit-transition:opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1);opacity:1}.sc-ion-input-ios-h{--padding-top:10px;--padding-end:10px;--padding-bottom:10px;--padding-start:0;font-size:inherit}.item-label-stacked.sc-ion-input-ios-h,.item-label-stacked .sc-ion-input-ios-h,.item-label-floating.sc-ion-input-ios-h,.item-label-floating .sc-ion-input-ios-h{--padding-top:8px;--padding-bottom:8px;--padding-start:0px}.input-clear-icon.sc-ion-input-ios{background-image:url(\"data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='var(--ion-color-step-600,%20%23666666)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>\");width:30px;height:30px;background-size:18px}";
const inputMdCss = ".sc-ion-input-md-h{--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:.5;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;--background:transparent;--color:initial;display:-ms-flexbox;display:flex;position:relative;-ms-flex:1;flex:1;-ms-flex-align:center;align-items:center;width:100%;padding:0 !important;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2}ion-item.sc-ion-input-md-h:not(.item-label),ion-item:not(.item-label) .sc-ion-input-md-h{--padding-start:0}.ion-color.sc-ion-input-md-h{color:var(--ion-color-base)}.native-input.sc-ion-input-md{border-radius:var(--border-radius);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:inline-block;-ms-flex:1;flex:1;width:100%;max-width:100%;max-height:100%;border:0;outline:none;background:transparent;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.native-input.sc-ion-input-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}.native-input.sc-ion-input-md::-webkit-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md::-moz-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md:-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md::-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md:-webkit-autofill{background-color:transparent}.native-input.sc-ion-input-md:invalid{-webkit-box-shadow:none;box-shadow:none}.native-input.sc-ion-input-md::-ms-clear{display:none}.native-input[disabled].sc-ion-input-md{opacity:0.4}.cloned-input.sc-ion-input-md{left:0;top:0;position:absolute;pointer-events:none}[dir=rtl].sc-ion-input-md .cloned-input.sc-ion-input-md,[dir=rtl].sc-ion-input-md-h .cloned-input.sc-ion-input-md,[dir=rtl] .sc-ion-input-md-h .cloned-input.sc-ion-input-md{left:unset;right:unset;right:0}.input-clear-icon.sc-ion-input-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;background-position:center;border:0;outline:none;background-color:transparent;background-repeat:no-repeat;visibility:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}.input-clear-icon.sc-ion-input-md:focus{opacity:0.5}.has-value.sc-ion-input-md-h .input-clear-icon.sc-ion-input-md{visibility:visible}.has-focus.sc-ion-input-md-h{pointer-events:none}.has-focus.sc-ion-input-md-h input.sc-ion-input-md,.has-focus.sc-ion-input-md-h a.sc-ion-input-md,.has-focus.sc-ion-input-md-h button.sc-ion-input-md{pointer-events:auto}.item-label-floating.item-has-placeholder.sc-ion-input-md-h:not(.item-has-value),.item-label-floating.item-has-placeholder:not(.item-has-value) .sc-ion-input-md-h{opacity:0}.item-label-floating.item-has-placeholder.sc-ion-input-md-h:not(.item-has-value).item-has-focus,.item-label-floating.item-has-placeholder:not(.item-has-value).item-has-focus .sc-ion-input-md-h{-webkit-transition:opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1);opacity:1}.sc-ion-input-md-h{--padding-top:10px;--padding-end:0;--padding-bottom:10px;--padding-start:8px;font-size:inherit}.item-label-stacked.sc-ion-input-md-h,.item-label-stacked .sc-ion-input-md-h,.item-label-floating.sc-ion-input-md-h,.item-label-floating .sc-ion-input-md-h{--padding-top:8px;--padding-bottom:8px;--padding-start:0}.input-clear-icon.sc-ion-input-md{background-image:url(\"data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><polygon%20fill='var(--ion-color-step-600,%20%23666666)'%20points='405,136.798%20375.202,107%20256,226.202%20136.798,107%20107,136.798%20226.202,256%20107,375.202%20136.798,405%20256,285.798%20375.202,405%20405,375.202%20285.798,256'/></svg>\");width:30px;height:30px;background-size:22px}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Input {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionInput = createEvent(this, "ionInput", 7);
this.ionChange = createEvent(this, "ionChange", 7);
this.ionBlur = createEvent(this, "ionBlur", 7);
this.ionFocus = createEvent(this, "ionFocus", 7);
this.ionStyle = createEvent(this, "ionStyle", 7);
this.inputId = `ion-input-${inputIds++}`;
this.didBlurAfterEdit = false;
this.inheritedAttributes = {};
/**
* This is required for a WebKit bug which requires us to
* blur and focus an input to properly focus the input in
* an item with delegatesFocus. It will no longer be needed
* with iOS 14.
*
* @internal
*/
this.fireFocusEvents = true;
this.hasFocus = false;
/**
* Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.
* Available options: `"off"`, `"none"`, `"on"`, `"sentences"`, `"words"`, `"characters"`.
*/
this.autocapitalize = 'off';
/**
* Indicates whether the value of the control can be automatically completed by the browser.
*/
this.autocomplete = 'off';
/**
* Whether auto correction should be enabled when the user is entering/editing the text value.
*/
this.autocorrect = 'off';
/**
* This Boolean attribute lets you specify that a form control should have input focus when the page loads.
*/
this.autofocus = false;
/**
* If `true`, a clear icon will appear in the input when there is a value. Clicking it clears the input.
*/
this.clearInput = false;
/**
* Set the amount of time, in milliseconds, to wait to trigger the `ionChange` event after each keystroke. This also impacts form bindings such as `ngModel` or `v-model`.
*/
this.debounce = 0;
/**
* If `true`, the user cannot interact with the input.
*/
this.disabled = false;
/**
* The name of the control, which is submitted with the form data.
*/
this.name = this.inputId;
/**
* If `true`, the user cannot modify the value.
*/
this.readonly = false;
/**
* If `true`, the user must fill in a value before submitting a form.
*/
this.required = false;
/**
* If `true`, the element will have its spelling and grammar checked.
*/
this.spellcheck = false;
/**
* The type of control to display. The default type is text.
*/
this.type = 'text';
/**
* The value of the input.
*/
this.value = '';
this.onInput = (ev) => {
const input = ev.target;
if (input) {
this.value = input.value || '';
}
this.ionInput.emit(ev);
};
this.onBlur = (ev) => {
this.hasFocus = false;
this.focusChanged();
this.emitStyle();
if (this.fireFocusEvents) {
this.ionBlur.emit(ev);
}
};
this.onFocus = (ev) => {
this.hasFocus = true;
this.focusChanged();
this.emitStyle();
if (this.fireFocusEvents) {
this.ionFocus.emit(ev);
}
};
this.onKeydown = (ev) => {
if (this.shouldClearOnEdit()) {
// Did the input value change after it was blurred and edited?
// Do not clear if user is hitting Enter to submit form
if (this.didBlurAfterEdit && this.hasValue() && ev.key !== 'Enter') {
// Clear the input
this.clearTextInput();
}
// Reset the flag
this.didBlurAfterEdit = false;
}
};
this.clearTextOnEnter = (ev) => {
if (ev.key === 'Enter') {
this.clearTextInput(ev);
}
};
this.clearTextInput = (ev) => {
if (this.clearInput && !this.readonly && !this.disabled && ev) {
ev.preventDefault();
ev.stopPropagation();
// Attempt to focus input again after pressing clear button
this.setFocus();
}
this.value = '';
/**
* This is needed for clearOnEdit
* Otherwise the value will not be cleared
* if user is inside the input
*/
if (this.nativeInput) {
this.nativeInput.value = '';
}
};
}
debounceChanged() {
this.ionChange = debounceEvent(this.ionChange, this.debounce);
}
disabledChanged() {
this.emitStyle();
}
/**
* Update the item classes when the placeholder changes
*/
placeholderChanged() {
this.emitStyle();
}
/**
* Update the native input element when the value changes
*/
valueChanged() {
this.emitStyle();
this.ionChange.emit({ value: this.value == null ? this.value : this.value.toString() });
}
componentWillLoad() {
this.inheritedAttributes = inheritAttributes(this.el, ['aria-label', 'tabindex', 'title']);
}
connectedCallback() {
this.emitStyle();
this.debounceChanged();
}
disconnectedCallback() {
}
/**
* Sets focus on the native `input` in `ion-input`. Use this method instead of the global
* `input.focus()`.
*/
async setFocus() {
if (this.nativeInput) {
this.nativeInput.focus();
}
}
/**
* Sets blur on the native `input` in `ion-input`. Use this method instead of the global
* `input.blur()`.
* @internal
*/
async setBlur() {
if (this.nativeInput) {
this.nativeInput.blur();
}
}
/**
* Returns the native `<input>` element used under the hood.
*/
getInputElement() {
return Promise.resolve(this.nativeInput);
}
shouldClearOnEdit() {
const { type, clearOnEdit } = this;
return (clearOnEdit === undefined)
? type === 'password'
: clearOnEdit;
}
getValue() {
return typeof this.value === 'number' ? this.value.toString() :
(this.value || '').toString();
}
emitStyle() {
this.ionStyle.emit({
'interactive': true,
'input': true,
'has-placeholder': this.placeholder != null,
'has-value': this.hasValue(),
'has-focus': this.hasFocus,
'interactive-disabled': this.disabled,
});
}
focusChanged() {
// If clearOnEdit is enabled and the input blurred but has a value, set a flag
if (!this.hasFocus && this.shouldClearOnEdit() && this.hasValue()) {
this.didBlurAfterEdit = true;
}
}
hasValue() {
return this.getValue().length > 0;
}
render() {
const mode = getIonMode$1(this);
const value = this.getValue();
const labelId = this.inputId + '-lbl';
const label = findItemLabel(this.el);
if (label) {
label.id = labelId;
}
return (hAsync(Host, { "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses$1(this.color, {
[mode]: true,
'has-value': this.hasValue(),
'has-focus': this.hasFocus
}) }, hAsync("input", Object.assign({ class: "native-input", ref: input => this.nativeInput = input, "aria-labelledby": label ? labelId : null, disabled: this.disabled, accept: this.accept, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, size: this.size, type: this.type, value: value, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeydown }, this.inheritedAttributes)), (this.clearInput && !this.readonly && !this.disabled) && hAsync("button", { "aria-label": "reset", type: "button", class: "input-clear-icon", onTouchStart: this.clearTextInput, onMouseDown: this.clearTextInput, onKeyDown: this.clearTextOnEnter })));
}
get el() { return getElement(this); }
static get watchers() { return {
"debounce": ["debounceChanged"],
"disabled": ["disabledChanged"],
"placeholder": ["placeholderChanged"],
"value": ["valueChanged"]
}; }
static get style() { return {
ios: inputIosCss,
md: inputMdCss
}; }
static get cmpMeta() { return {
"$flags$": 34,
"$tagName$": "ion-input",
"$members$": {
"fireFocusEvents": [4, "fire-focus-events"],
"color": [513],
"accept": [1],
"autocapitalize": [1],
"autocomplete": [1],
"autocorrect": [1],
"autofocus": [4],
"clearInput": [4, "clear-input"],
"clearOnEdit": [4, "clear-on-edit"],
"debounce": [2],
"disabled": [4],
"enterkeyhint": [1],
"inputmode": [1],
"max": [1],
"maxlength": [2],
"min": [1],
"minlength": [2],
"multiple": [4],
"name": [1],
"pattern": [1],
"placeholder": [1],
"readonly": [4],
"required": [4],
"spellcheck": [4],
"step": [1],
"size": [2],
"type": [1],
"value": [1032],
"hasFocus": [32],
"setFocus": [64],
"setBlur": [64],
"getInputElement": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
let inputIds = 0;
const itemIosCss = "/*!@:host*/.sc-ion-item-ios-h{--border-radius:0px;--border-width:0px;--border-style:solid;--padding-top:0px;--padding-bottom:0px;--padding-end:0px;--padding-start:0px;--inner-border-width:0px;--inner-padding-top:0px;--inner-padding-bottom:0px;--inner-padding-start:0px;--inner-padding-end:0px;--inner-box-shadow:none;--show-full-highlight:0;--show-inset-highlight:0;--detail-icon-color:initial;--detail-icon-font-size:20px;--detail-icon-opacity:0.25;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;outline:none;color:var(--color);font-family:var(--ion-font-family, inherit);text-align:initial;text-decoration:none;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host(.ion-color) .item-native*/.ion-color.sc-ion-item-ios-h .item-native.sc-ion-item-ios{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host(.ion-color) .item-native,\n:host(.ion-color) .item-inner*/.ion-color.sc-ion-item-ios-h .item-native.sc-ion-item-ios,.ion-color.sc-ion-item-ios-h .item-inner.sc-ion-item-ios{border-color:var(--ion-color-shade)}/*!@:host(.ion-activated) .item-native*/.ion-activated.sc-ion-item-ios-h .item-native.sc-ion-item-ios{color:var(--color-activated)}/*!@:host(.ion-activated) .item-native::after*/.ion-activated.sc-ion-item-ios-h .item-native.sc-ion-item-ios::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}/*!@:host(.ion-color.ion-activated) .item-native*/.ion-color.ion-activated.sc-ion-item-ios-h .item-native.sc-ion-item-ios{color:var(--ion-color-contrast)}/*!@:host(.ion-focused) .item-native*/.ion-focused.sc-ion-item-ios-h .item-native.sc-ion-item-ios{color:var(--color-focused)}/*!@:host(.ion-focused) .item-native::after*/.ion-focused.sc-ion-item-ios-h .item-native.sc-ion-item-ios::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}/*!@:host(.ion-color.ion-focused) .item-native*/.ion-color.ion-focused.sc-ion-item-ios-h .item-native.sc-ion-item-ios{color:var(--ion-color-contrast)}/*!@:host(.ion-color.ion-focused) .item-native::after*/.ion-color.ion-focused.sc-ion-item-ios-h .item-native.sc-ion-item-ios::after{background:var(--ion-color-contrast)}@media (any-hover: hover){/*!@:host(.ion-activatable:hover) .item-native*/.ion-activatable.sc-ion-item-ios-h:hover .item-native.sc-ion-item-ios{color:var(--color-hover)}/*!@:host(.ion-activatable:hover) .item-native::after*/.ion-activatable.sc-ion-item-ios-h:hover .item-native.sc-ion-item-ios::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}/*!@:host(.ion-color.ion-activatable:hover) .item-native*/.ion-color.ion-activatable.sc-ion-item-ios-h:hover .item-native.sc-ion-item-ios{color:var(--ion-color-contrast)}/*!@:host(.ion-color.ion-activatable:hover) .item-native::after*/.ion-color.ion-activatable.sc-ion-item-ios-h:hover .item-native.sc-ion-item-ios::after{background:var(--ion-color-contrast)}}/*!@:host(.item-interactive-disabled:not(.item-multiple-inputs))*/.item-interactive-disabled.sc-ion-item-ios-h:not(.item-multiple-inputs){cursor:default;pointer-events:none}/*!@:host(.item-disabled)*/.item-disabled.sc-ion-item-ios-h{cursor:default;opacity:0.3;pointer-events:none}/*!@.item-native*/.item-native.sc-ion-item-ios{border-radius:var(--border-radius);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:100%;min-height:var(--min-height);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:1}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.item-native*/.item-native.sc-ion-item-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-inline-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.item-native::-moz-focus-inner*/.item-native.sc-ion-item-ios::-moz-focus-inner{border:0}/*!@.item-native::after*/.item-native.sc-ion-item-ios::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0;-webkit-transition:var(--transition);transition:var(--transition);z-index:-1}/*!@button, a*/button.sc-ion-item-ios,a.sc-ion-item-ios{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none}/*!@.item-inner*/.item-inner.sc-ion-item-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--inner-padding-start);padding-right:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-top:var(--inner-padding-top);padding-bottom:var(--inner-padding-bottom);display:-ms-flexbox;display:flex;position:relative;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;min-height:inherit;border-width:var(--inner-border-width);border-style:var(--border-style);border-color:var(--border-color);-webkit-box-shadow:var(--inner-box-shadow);box-shadow:var(--inner-box-shadow);overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.item-inner*/.item-inner.sc-ion-item-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--inner-padding-start);padding-inline-start:var(--inner-padding-start);-webkit-padding-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-inline-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end))}}/*!@.item-detail-icon*/.item-detail-icon.sc-ion-item-ios{color:var(--detail-icon-color);font-size:var(--detail-icon-font-size);opacity:var(--detail-icon-opacity)}/*!@::slotted(ion-icon)*/.sc-ion-item-ios-s>ion-icon{font-size:1.6em}/*!@::slotted(ion-button)*/.sc-ion-item-ios-s>ion-button{--margin-top:0;--margin-bottom:0;--margin-start:0;--margin-end:0;z-index:1}/*!@::slotted(ion-label)*/.sc-ion-item-ios-s>ion-label{-ms-flex:1;flex:1}/*!@:host(.item-input)*/.item-input.sc-ion-item-ios-h{-ms-flex-align:center;align-items:center}/*!@.input-wrapper*/.input-wrapper.sc-ion-item-ios{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;text-overflow:ellipsis;overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host(.item-label-stacked),\n:host(.item-label-floating)*/.item-label-stacked.sc-ion-item-ios-h,.item-label-floating.sc-ion-item-ios-h{-ms-flex-align:start;align-items:start}/*!@:host(.item-label-stacked) .input-wrapper,\n:host(.item-label-floating) .input-wrapper*/.item-label-stacked.sc-ion-item-ios-h .input-wrapper.sc-ion-item-ios,.item-label-floating.sc-ion-item-ios-h .input-wrapper.sc-ion-item-ios{-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column}/*!@.item-highlight,\n.item-inner-highlight*/.item-highlight.sc-ion-item-ios,.item-inner-highlight.sc-ion-item-ios{left:0;right:0;bottom:0;position:absolute;background:var(--highlight-background);z-index:1}/*!@.item-highlight*/.item-highlight.sc-ion-item-ios{height:var(--full-highlight-height)}/*!@.item-inner-highlight*/.item-inner-highlight.sc-ion-item-ios{height:var(--inset-highlight-height)}/*!@:host(.item-interactive.item-has-focus),\n:host(.item-interactive.ion-touched.ion-invalid)*/.item-interactive.item-has-focus.sc-ion-item-ios-h,.item-interactive.ion-touched.ion-invalid.sc-ion-item-ios-h{--full-highlight-height:calc(var(--highlight-height) * var(--show-full-highlight));--inset-highlight-height:calc(var(--highlight-height) * var(--show-inset-highlight))}/*!@:host(.item-interactive.item-has-focus)*/.item-interactive.item-has-focus.sc-ion-item-ios-h{--highlight-background:var(--highlight-color-focused)}/*!@:host(.item-interactive.ion-valid)*/.item-interactive.ion-valid.sc-ion-item-ios-h{--highlight-background:var(--highlight-color-valid)}/*!@:host(.item-interactive.ion-invalid)*/.item-interactive.ion-invalid.sc-ion-item-ios-h{--highlight-background:var(--highlight-color-invalid)}/*!@:host(:not(.item-label)) ::slotted(ion-select)*/.sc-ion-item-ios-h:not(.item-label) .sc-ion-item-ios-s>ion-select{--padding-start:0;max-width:none}/*!@:host(.item-label-stacked) ::slotted(ion-select),\n:host(.item-label-floating) ::slotted(ion-select)*/.sc-ion-item-ios-h.item-label-stacked .sc-ion-item-ios-s>ion-select,.sc-ion-item-ios-h.item-label-floating .sc-ion-item-ios-s>ion-select{--padding-top:8px;--padding-bottom:8px;--padding-start:0;-ms-flex-item-align:stretch;align-self:stretch;width:100%;max-width:100%}/*!@:host(:not(.item-label)) ::slotted(ion-datetime)*/.sc-ion-item-ios-h:not(.item-label) .sc-ion-item-ios-s>ion-datetime{--padding-start:0}/*!@:host(.item-label-stacked) ::slotted(ion-datetime),\n:host(.item-label-floating) ::slotted(ion-datetime)*/.sc-ion-item-ios-h.item-label-stacked .sc-ion-item-ios-s>ion-datetime,.sc-ion-item-ios-h.item-label-floating .sc-ion-item-ios-s>ion-datetime{--padding-start:0;width:100%}/*!@:host(.item-multiple-inputs) ::slotted(ion-checkbox),\n:host(.item-multiple-inputs) ::slotted(ion-datetime),\n:host(.item-multiple-inputs) ::slotted(ion-radio),\n:host(.item-multiple-inputs) ::slotted(ion-select)*/.sc-ion-item-ios-h.item-multiple-inputs .sc-ion-item-ios-s>ion-checkbox,.sc-ion-item-ios-h.item-multiple-inputs .sc-ion-item-ios-s>ion-datetime,.sc-ion-item-ios-h.item-multiple-inputs .sc-ion-item-ios-s>ion-radio,.sc-ion-item-ios-h.item-multiple-inputs .sc-ion-item-ios-s>ion-select{position:relative}/*!@:host(.item-textarea)*/.item-textarea.sc-ion-item-ios-h{-ms-flex-align:stretch;align-items:stretch}/*!@::slotted(ion-reorder[slot])*/.sc-ion-item-ios-s>ion-reorder[slot]{margin-top:0;margin-bottom:0}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-item-ios{color:var(--ripple-color)}/*!@:host*/.sc-ion-item-ios-h{--min-height:44px;--transition:background-color 200ms linear, opacity 200ms linear;--padding-start:20px;--inner-padding-end:10px;--inner-border-width:0px 0px 0.55px 0px;--background:var(--ion-item-background, var(--ion-background-color, #fff));--background-activated:#000;--background-focused:#000;--background-hover:currentColor;--background-activated-opacity:.12;--background-focused-opacity:.15;--background-hover-opacity:.04;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, #c8c7cc)));--color:var(--ion-item-color, var(--ion-text-color, #000));--highlight-height:0;--highlight-color-focused:var(--ion-color-primary, #3880ff);--highlight-color-valid:var(--ion-color-success, #2dd36f);--highlight-color-invalid:var(--ion-color-danger, #eb445a);font-size:17px}/*!@:host(.ion-activated)*/.ion-activated.sc-ion-item-ios-h{--transition:none}/*!@:host(.ion-color.ion-focused) .item-native::after*/.ion-color.ion-focused.sc-ion-item-ios-h .item-native.sc-ion-item-ios::after{background:#000;opacity:0.15}/*!@:host(.ion-color.ion-activated) .item-native::after*/.ion-color.ion-activated.sc-ion-item-ios-h .item-native.sc-ion-item-ios::after{background:#000;opacity:0.12}/*!@:host(.item-interactive)*/.item-interactive.sc-ion-item-ios-h{--show-full-highlight:0;--show-inset-highlight:1}/*!@:host(.item-lines-full)*/.item-lines-full.sc-ion-item-ios-h{--border-width:0px 0px 0.55px 0px;--show-full-highlight:1;--show-inset-highlight:0}/*!@:host(.item-lines-inset)*/.item-lines-inset.sc-ion-item-ios-h{--inner-border-width:0px 0px 0.55px 0px;--show-full-highlight:0;--show-inset-highlight:1}/*!@:host(.item-lines-inset),\n:host(.item-lines-none)*/.item-lines-inset.sc-ion-item-ios-h,.item-lines-none.sc-ion-item-ios-h{--border-width:0px;--show-full-highlight:0}/*!@:host(.item-lines-full),\n:host(.item-lines-none)*/.item-lines-full.sc-ion-item-ios-h,.item-lines-none.sc-ion-item-ios-h{--inner-border-width:0px;--show-inset-highlight:0}/*!@::slotted([slot=start])*/.sc-ion-item-ios-s>[slot=start]{margin-left:0;margin-right:20px;margin-top:2px;margin-bottom:2px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=start])*/.sc-ion-item-ios-s>[slot=start]{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:20px;margin-inline-end:20px}}/*!@::slotted([slot=end])*/.sc-ion-item-ios-s>[slot=end]{margin-left:10px;margin-right:10px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=end])*/.sc-ion-item-ios-s>[slot=end]{margin-left:unset;margin-right:unset;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:10px;margin-inline-end:10px}}/*!@::slotted(ion-icon[slot=start]),\n::slotted(ion-icon[slot=end])*/.sc-ion-item-ios-s>ion-icon[slot=start],.sc-ion-item-ios-s>ion-icon[slot=end]{margin-top:7px;margin-bottom:7px}/*!@::slotted(ion-toggle[slot=start]),\n::slotted(ion-toggle[slot=end])*/.sc-ion-item-ios-s>ion-toggle[slot=start],.sc-ion-item-ios-s>ion-toggle[slot=end]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}/*!@:host(.item-label-stacked) ::slotted([slot=end]),\n:host(.item-label-floating) ::slotted([slot=end])*/.sc-ion-item-ios-h.item-label-stacked .sc-ion-item-ios-s>[slot=end],.sc-ion-item-ios-h.item-label-floating .sc-ion-item-ios-s>[slot=end]{margin-top:7px;margin-bottom:7px}/*!@::slotted(.button-small)*/.sc-ion-item-ios-s>.button-small{--padding-top:0px;--padding-bottom:0px;--padding-start:.5em;--padding-end:.5em;height:24px;font-size:13px}/*!@::slotted(ion-avatar)*/.sc-ion-item-ios-s>ion-avatar{width:36px;height:36px}/*!@::slotted(ion-thumbnail)*/.sc-ion-item-ios-s>ion-thumbnail{width:56px;height:56px}/*!@::slotted(ion-avatar[slot=end]),\n::slotted(ion-thumbnail[slot=end])*/.sc-ion-item-ios-s>ion-avatar[slot=end],.sc-ion-item-ios-s>ion-thumbnail[slot=end]{margin-left:10px;margin-right:10px;margin-top:10px;margin-bottom:10px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-avatar[slot=end]),\n::slotted(ion-thumbnail[slot=end])*/.sc-ion-item-ios-s>ion-avatar[slot=end],.sc-ion-item-ios-s>ion-thumbnail[slot=end]{margin-left:unset;margin-right:unset;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:10px;margin-inline-end:10px}}/*!@:host(.item-radio) ::slotted(ion-label),\n:host(.item-toggle) ::slotted(ion-label)*/.sc-ion-item-ios-h.item-radio .sc-ion-item-ios-s>ion-label,.sc-ion-item-ios-h.item-toggle .sc-ion-item-ios-s>ion-label{margin-left:0px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.item-radio) ::slotted(ion-label),\n:host(.item-toggle) ::slotted(ion-label)*/.sc-ion-item-ios-h.item-radio .sc-ion-item-ios-s>ion-label,.sc-ion-item-ios-h.item-toggle .sc-ion-item-ios-s>ion-label{margin-left:unset;-webkit-margin-start:0px;margin-inline-start:0px}}/*!@::slotted(ion-label)*/.sc-ion-item-ios-s>ion-label{margin-left:0;margin-right:8px;margin-top:10px;margin-bottom:10px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-label)*/.sc-ion-item-ios-s>ion-label{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:8px;margin-inline-end:8px}}/*!@:host(.item-label-floating),\n:host(.item-label-stacked)*/.item-label-floating.sc-ion-item-ios-h,.item-label-stacked.sc-ion-item-ios-h{--min-height:68px}/*!@:host(.item-label-stacked) ::slotted(ion-select),\n:host(.item-label-floating) ::slotted(ion-select)*/.sc-ion-item-ios-h.item-label-stacked .sc-ion-item-ios-s>ion-select,.sc-ion-item-ios-h.item-label-floating .sc-ion-item-ios-s>ion-select{--padding-top:8px;--padding-bottom:8px;--padding-start:0px}/*!@:host(.item-label-fixed) ::slotted(ion-select),\n:host(.item-label-fixed) ::slotted(ion-datetime)*/.sc-ion-item-ios-h.item-label-fixed .sc-ion-item-ios-s>ion-select,.sc-ion-item-ios-h.item-label-fixed .sc-ion-item-ios-s>ion-datetime{--padding-start:0}";
const itemMdCss = "/*!@:host*/.sc-ion-item-md-h{--border-radius:0px;--border-width:0px;--border-style:solid;--padding-top:0px;--padding-bottom:0px;--padding-end:0px;--padding-start:0px;--inner-border-width:0px;--inner-padding-top:0px;--inner-padding-bottom:0px;--inner-padding-start:0px;--inner-padding-end:0px;--inner-box-shadow:none;--show-full-highlight:0;--show-inset-highlight:0;--detail-icon-color:initial;--detail-icon-font-size:20px;--detail-icon-opacity:0.25;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;outline:none;color:var(--color);font-family:var(--ion-font-family, inherit);text-align:initial;text-decoration:none;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host(.ion-color) .item-native*/.ion-color.sc-ion-item-md-h .item-native.sc-ion-item-md{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host(.ion-color) .item-native,\n:host(.ion-color) .item-inner*/.ion-color.sc-ion-item-md-h .item-native.sc-ion-item-md,.ion-color.sc-ion-item-md-h .item-inner.sc-ion-item-md{border-color:var(--ion-color-shade)}/*!@:host(.ion-activated) .item-native*/.ion-activated.sc-ion-item-md-h .item-native.sc-ion-item-md{color:var(--color-activated)}/*!@:host(.ion-activated) .item-native::after*/.ion-activated.sc-ion-item-md-h .item-native.sc-ion-item-md::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}/*!@:host(.ion-color.ion-activated) .item-native*/.ion-color.ion-activated.sc-ion-item-md-h .item-native.sc-ion-item-md{color:var(--ion-color-contrast)}/*!@:host(.ion-focused) .item-native*/.ion-focused.sc-ion-item-md-h .item-native.sc-ion-item-md{color:var(--color-focused)}/*!@:host(.ion-focused) .item-native::after*/.ion-focused.sc-ion-item-md-h .item-native.sc-ion-item-md::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}/*!@:host(.ion-color.ion-focused) .item-native*/.ion-color.ion-focused.sc-ion-item-md-h .item-native.sc-ion-item-md{color:var(--ion-color-contrast)}/*!@:host(.ion-color.ion-focused) .item-native::after*/.ion-color.ion-focused.sc-ion-item-md-h .item-native.sc-ion-item-md::after{background:var(--ion-color-contrast)}@media (any-hover: hover){/*!@:host(.ion-activatable:hover) .item-native*/.ion-activatable.sc-ion-item-md-h:hover .item-native.sc-ion-item-md{color:var(--color-hover)}/*!@:host(.ion-activatable:hover) .item-native::after*/.ion-activatable.sc-ion-item-md-h:hover .item-native.sc-ion-item-md::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}/*!@:host(.ion-color.ion-activatable:hover) .item-native*/.ion-color.ion-activatable.sc-ion-item-md-h:hover .item-native.sc-ion-item-md{color:var(--ion-color-contrast)}/*!@:host(.ion-color.ion-activatable:hover) .item-native::after*/.ion-color.ion-activatable.sc-ion-item-md-h:hover .item-native.sc-ion-item-md::after{background:var(--ion-color-contrast)}}/*!@:host(.item-interactive-disabled:not(.item-multiple-inputs))*/.item-interactive-disabled.sc-ion-item-md-h:not(.item-multiple-inputs){cursor:default;pointer-events:none}/*!@:host(.item-disabled)*/.item-disabled.sc-ion-item-md-h{cursor:default;opacity:0.3;pointer-events:none}/*!@.item-native*/.item-native.sc-ion-item-md{border-radius:var(--border-radius);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:100%;min-height:var(--min-height);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:1}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.item-native*/.item-native.sc-ion-item-md{padding-left:unset;padding-right:unset;-webkit-padding-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-inline-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.item-native::-moz-focus-inner*/.item-native.sc-ion-item-md::-moz-focus-inner{border:0}/*!@.item-native::after*/.item-native.sc-ion-item-md::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0;-webkit-transition:var(--transition);transition:var(--transition);z-index:-1}/*!@button, a*/button.sc-ion-item-md,a.sc-ion-item-md{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none}/*!@.item-inner*/.item-inner.sc-ion-item-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--inner-padding-start);padding-right:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-top:var(--inner-padding-top);padding-bottom:var(--inner-padding-bottom);display:-ms-flexbox;display:flex;position:relative;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;min-height:inherit;border-width:var(--inner-border-width);border-style:var(--border-style);border-color:var(--border-color);-webkit-box-shadow:var(--inner-box-shadow);box-shadow:var(--inner-box-shadow);overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.item-inner*/.item-inner.sc-ion-item-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--inner-padding-start);padding-inline-start:var(--inner-padding-start);-webkit-padding-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-inline-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end))}}/*!@.item-detail-icon*/.item-detail-icon.sc-ion-item-md{color:var(--detail-icon-color);font-size:var(--detail-icon-font-size);opacity:var(--detail-icon-opacity)}/*!@::slotted(ion-icon)*/.sc-ion-item-md-s>ion-icon{font-size:1.6em}/*!@::slotted(ion-button)*/.sc-ion-item-md-s>ion-button{--margin-top:0;--margin-bottom:0;--margin-start:0;--margin-end:0;z-index:1}/*!@::slotted(ion-label)*/.sc-ion-item-md-s>ion-label{-ms-flex:1;flex:1}/*!@:host(.item-input)*/.item-input.sc-ion-item-md-h{-ms-flex-align:center;align-items:center}/*!@.input-wrapper*/.input-wrapper.sc-ion-item-md{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;text-overflow:ellipsis;overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host(.item-label-stacked),\n:host(.item-label-floating)*/.item-label-stacked.sc-ion-item-md-h,.item-label-floating.sc-ion-item-md-h{-ms-flex-align:start;align-items:start}/*!@:host(.item-label-stacked) .input-wrapper,\n:host(.item-label-floating) .input-wrapper*/.item-label-stacked.sc-ion-item-md-h .input-wrapper.sc-ion-item-md,.item-label-floating.sc-ion-item-md-h .input-wrapper.sc-ion-item-md{-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column}/*!@.item-highlight,\n.item-inner-highlight*/.item-highlight.sc-ion-item-md,.item-inner-highlight.sc-ion-item-md{left:0;right:0;bottom:0;position:absolute;background:var(--highlight-background);z-index:1}/*!@.item-highlight*/.item-highlight.sc-ion-item-md{height:var(--full-highlight-height)}/*!@.item-inner-highlight*/.item-inner-highlight.sc-ion-item-md{height:var(--inset-highlight-height)}/*!@:host(.item-interactive.item-has-focus),\n:host(.item-interactive.ion-touched.ion-invalid)*/.item-interactive.item-has-focus.sc-ion-item-md-h,.item-interactive.ion-touched.ion-invalid.sc-ion-item-md-h{--full-highlight-height:calc(var(--highlight-height) * var(--show-full-highlight));--inset-highlight-height:calc(var(--highlight-height) * var(--show-inset-highlight))}/*!@:host(.item-interactive.item-has-focus)*/.item-interactive.item-has-focus.sc-ion-item-md-h{--highlight-background:var(--highlight-color-focused)}/*!@:host(.item-interactive.ion-valid)*/.item-interactive.ion-valid.sc-ion-item-md-h{--highlight-background:var(--highlight-color-valid)}/*!@:host(.item-interactive.ion-invalid)*/.item-interactive.ion-invalid.sc-ion-item-md-h{--highlight-background:var(--highlight-color-invalid)}/*!@:host(:not(.item-label)) ::slotted(ion-select)*/.sc-ion-item-md-h:not(.item-label) .sc-ion-item-md-s>ion-select{--padding-start:0;max-width:none}/*!@:host(.item-label-stacked) ::slotted(ion-select),\n:host(.item-label-floating) ::slotted(ion-select)*/.sc-ion-item-md-h.item-label-stacked .sc-ion-item-md-s>ion-select,.sc-ion-item-md-h.item-label-floating .sc-ion-item-md-s>ion-select{--padding-top:8px;--padding-bottom:8px;--padding-start:0;-ms-flex-item-align:stretch;align-self:stretch;width:100%;max-width:100%}/*!@:host(:not(.item-label)) ::slotted(ion-datetime)*/.sc-ion-item-md-h:not(.item-label) .sc-ion-item-md-s>ion-datetime{--padding-start:0}/*!@:host(.item-label-stacked) ::slotted(ion-datetime),\n:host(.item-label-floating) ::slotted(ion-datetime)*/.sc-ion-item-md-h.item-label-stacked .sc-ion-item-md-s>ion-datetime,.sc-ion-item-md-h.item-label-floating .sc-ion-item-md-s>ion-datetime{--padding-start:0;width:100%}/*!@:host(.item-multiple-inputs) ::slotted(ion-checkbox),\n:host(.item-multiple-inputs) ::slotted(ion-datetime),\n:host(.item-multiple-inputs) ::slotted(ion-radio),\n:host(.item-multiple-inputs) ::slotted(ion-select)*/.sc-ion-item-md-h.item-multiple-inputs .sc-ion-item-md-s>ion-checkbox,.sc-ion-item-md-h.item-multiple-inputs .sc-ion-item-md-s>ion-datetime,.sc-ion-item-md-h.item-multiple-inputs .sc-ion-item-md-s>ion-radio,.sc-ion-item-md-h.item-multiple-inputs .sc-ion-item-md-s>ion-select{position:relative}/*!@:host(.item-textarea)*/.item-textarea.sc-ion-item-md-h{-ms-flex-align:stretch;align-items:stretch}/*!@::slotted(ion-reorder[slot])*/.sc-ion-item-md-s>ion-reorder[slot]{margin-top:0;margin-bottom:0}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-item-md{color:var(--ripple-color)}/*!@:host*/.sc-ion-item-md-h{--min-height:48px;--background:var(--ion-item-background, var(--ion-background-color, #fff));--background-activated:transparent;--background-focused:currentColor;--background-hover:currentColor;--background-activated-opacity:0;--background-focused-opacity:.12;--background-hover-opacity:.04;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.13))));--color:var(--ion-item-color, var(--ion-text-color, #000));--transition:opacity 15ms linear, background-color 15ms linear;--padding-start:16px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.13))));--inner-padding-end:16px;--inner-border-width:0 0 1px 0;--highlight-height:2px;--highlight-color-focused:var(--ion-color-primary, #3880ff);--highlight-color-valid:var(--ion-color-success, #2dd36f);--highlight-color-invalid:var(--ion-color-danger, #eb445a);font-size:16px;font-weight:normal;text-transform:none}/*!@:host(.ion-color.ion-activated) .item-native::after*/.ion-color.ion-activated.sc-ion-item-md-h .item-native.sc-ion-item-md::after{background:transparent}/*!@:host(.item-interactive)*/.item-interactive.sc-ion-item-md-h{--border-width:0 0 1px 0;--inner-border-width:0;--show-full-highlight:1;--show-inset-highlight:0}/*!@:host(.item-lines-full)*/.item-lines-full.sc-ion-item-md-h{--border-width:0 0 1px 0;--show-full-highlight:1;--show-inset-highlight:0}/*!@:host(.item-lines-inset)*/.item-lines-inset.sc-ion-item-md-h{--inner-border-width:0 0 1px 0;--show-full-highlight:0;--show-inset-highlight:1}/*!@:host(.item-lines-inset),\n:host(.item-lines-none)*/.item-lines-inset.sc-ion-item-md-h,.item-lines-none.sc-ion-item-md-h{--border-width:0;--show-full-highlight:0}/*!@:host(.item-lines-full),\n:host(.item-lines-none)*/.item-lines-full.sc-ion-item-md-h,.item-lines-none.sc-ion-item-md-h{--inner-border-width:0;--show-inset-highlight:0}/*!@:host(.item-multi-line) ::slotted([slot=start]),\n:host(.item-multi-line) ::slotted([slot=end])*/.sc-ion-item-md-h.item-multi-line .sc-ion-item-md-s>[slot=start],.sc-ion-item-md-h.item-multi-line .sc-ion-item-md-s>[slot=end]{margin-top:16px;margin-bottom:16px;-ms-flex-item-align:start;align-self:flex-start}/*!@::slotted([slot=start])*/.sc-ion-item-md-s>[slot=start]{margin-right:32px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=start])*/.sc-ion-item-md-s>[slot=start]{margin-right:unset;-webkit-margin-end:32px;margin-inline-end:32px}}/*!@::slotted([slot=end])*/.sc-ion-item-md-s>[slot=end]{margin-left:32px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=end])*/.sc-ion-item-md-s>[slot=end]{margin-left:unset;-webkit-margin-start:32px;margin-inline-start:32px}}/*!@::slotted(ion-icon)*/.sc-ion-item-md-s>ion-icon{color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54);font-size:24px}/*!@:host(.ion-color) ::slotted(ion-icon)*/.sc-ion-item-md-h.ion-color .sc-ion-item-md-s>ion-icon{color:var(--ion-color-contrast)}/*!@::slotted(ion-icon[slot])*/.sc-ion-item-md-s>ion-icon[slot]{margin-top:12px;margin-bottom:12px}/*!@::slotted(ion-icon[slot=start])*/.sc-ion-item-md-s>ion-icon[slot=start]{margin-right:32px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon[slot=start])*/.sc-ion-item-md-s>ion-icon[slot=start]{margin-right:unset;-webkit-margin-end:32px;margin-inline-end:32px}}/*!@::slotted(ion-icon[slot=end])*/.sc-ion-item-md-s>ion-icon[slot=end]{margin-left:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon[slot=end])*/.sc-ion-item-md-s>ion-icon[slot=end]{margin-left:unset;-webkit-margin-start:16px;margin-inline-start:16px}}/*!@::slotted(ion-toggle[slot=start]),\n::slotted(ion-toggle[slot=end])*/.sc-ion-item-md-s>ion-toggle[slot=start],.sc-ion-item-md-s>ion-toggle[slot=end]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}/*!@::slotted(ion-note)*/.sc-ion-item-md-s>ion-note{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-ms-flex-item-align:start;align-self:flex-start;font-size:11px}/*!@::slotted(ion-note[slot])*/.sc-ion-item-md-s>ion-note[slot]{padding-left:0;padding-right:0;padding-top:18px;padding-bottom:10px}/*!@::slotted(ion-note[slot=start])*/.sc-ion-item-md-s>ion-note[slot=start]{padding-right:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-note[slot=start])*/.sc-ion-item-md-s>ion-note[slot=start]{padding-right:unset;-webkit-padding-end:16px;padding-inline-end:16px}}/*!@::slotted(ion-note[slot=end])*/.sc-ion-item-md-s>ion-note[slot=end]{padding-left:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-note[slot=end])*/.sc-ion-item-md-s>ion-note[slot=end]{padding-left:unset;-webkit-padding-start:16px;padding-inline-start:16px}}/*!@::slotted(ion-avatar)*/.sc-ion-item-md-s>ion-avatar{width:40px;height:40px}/*!@::slotted(ion-thumbnail)*/.sc-ion-item-md-s>ion-thumbnail{width:56px;height:56px}/*!@::slotted(ion-avatar),\n::slotted(ion-thumbnail)*/.sc-ion-item-md-s>ion-avatar,.sc-ion-item-md-s>ion-thumbnail{margin-top:8px;margin-bottom:8px}/*!@::slotted(ion-avatar[slot=start]),\n::slotted(ion-thumbnail[slot=start])*/.sc-ion-item-md-s>ion-avatar[slot=start],.sc-ion-item-md-s>ion-thumbnail[slot=start]{margin-right:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-avatar[slot=start]),\n::slotted(ion-thumbnail[slot=start])*/.sc-ion-item-md-s>ion-avatar[slot=start],.sc-ion-item-md-s>ion-thumbnail[slot=start]{margin-right:unset;-webkit-margin-end:16px;margin-inline-end:16px}}/*!@::slotted(ion-avatar[slot=end]),\n::slotted(ion-thumbnail[slot=end])*/.sc-ion-item-md-s>ion-avatar[slot=end],.sc-ion-item-md-s>ion-thumbnail[slot=end]{margin-left:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-avatar[slot=end]),\n::slotted(ion-thumbnail[slot=end])*/.sc-ion-item-md-s>ion-avatar[slot=end],.sc-ion-item-md-s>ion-thumbnail[slot=end]{margin-left:unset;-webkit-margin-start:16px;margin-inline-start:16px}}/*!@::slotted(ion-label)*/.sc-ion-item-md-s>ion-label{margin-left:0;margin-right:0;margin-top:11px;margin-bottom:10px}/*!@:host(.item-label-stacked) ::slotted([slot=end]),\n:host(.item-label-floating) ::slotted([slot=end])*/.sc-ion-item-md-h.item-label-stacked .sc-ion-item-md-s>[slot=end],.sc-ion-item-md-h.item-label-floating .sc-ion-item-md-s>[slot=end]{margin-top:7px;margin-bottom:7px}/*!@:host(.item-label-fixed) ::slotted(ion-select),\n:host(.item-label-fixed) ::slotted(ion-datetime)*/.sc-ion-item-md-h.item-label-fixed .sc-ion-item-md-s>ion-select,.sc-ion-item-md-h.item-label-fixed .sc-ion-item-md-s>ion-datetime{--padding-start:8px}/*!@:host(.item-toggle) ::slotted(ion-label),\n:host(.item-radio) ::slotted(ion-label)*/.sc-ion-item-md-h.item-toggle .sc-ion-item-md-s>ion-label,.sc-ion-item-md-h.item-radio .sc-ion-item-md-s>ion-label{margin-left:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.item-toggle) ::slotted(ion-label),\n:host(.item-radio) ::slotted(ion-label)*/.sc-ion-item-md-h.item-toggle .sc-ion-item-md-s>ion-label,.sc-ion-item-md-h.item-radio .sc-ion-item-md-s>ion-label{margin-left:unset;-webkit-margin-start:0;margin-inline-start:0}}/*!@::slotted(.button-small)*/.sc-ion-item-md-s>.button-small{--padding-top:0;--padding-bottom:0;--padding-start:.6em;--padding-end:.6em;height:25px;font-size:12px}/*!@:host(.item-label-floating),\n:host(.item-label-stacked)*/.item-label-floating.sc-ion-item-md-h,.item-label-stacked.sc-ion-item-md-h{--min-height:55px}/*!@:host(.item-label-stacked) ::slotted(ion-select),\n:host(.item-label-floating) ::slotted(ion-select)*/.sc-ion-item-md-h.item-label-stacked .sc-ion-item-md-s>ion-select,.sc-ion-item-md-h.item-label-floating .sc-ion-item-md-s>ion-select{--padding-top:8px;--padding-bottom:8px;--padding-start:0}/*!@:host(.item-has-focus:not(.ion-color)) ::slotted(.label-stacked),\n:host(.item-has-focus:not(.ion-color)) ::slotted(.label-floating)*/.sc-ion-item-md-h.item-has-focus:not(.ion-color) .sc-ion-item-md-s>.label-stacked,.sc-ion-item-md-h.item-has-focus:not(.ion-color) .sc-ion-item-md-s>.label-floating{color:var(--ion-color-primary, #3880ff)}/*!@:host(.ion-color)*/.ion-color.sc-ion-item-md-h{--highlight-color-focused:var(--ion-color-contrast)}/*!@:host(.item-label-color)*/.item-label-color.sc-ion-item-md-h{--highlight-color-focused:var(--ion-color-base)}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @slot - Content is placed between the named slots if provided without a slot.
* @slot start - Content is placed to the left of the item text in LTR, and to the right in RTL.
* @slot end - Content is placed to the right of the item text in LTR, and to the left in RTL.
*
* @part native - The native HTML button, anchor or div element that wraps all child elements.
* @part detail-icon - The chevron icon for the item. Only applies when `detail="true"`.
*/
class Item {
constructor(hostRef) {
registerInstance(this, hostRef);
this.labelColorStyles = {};
this.itemStyles = new Map();
this.multipleInputs = false;
/**
* If `true`, a button tag will be rendered and the item will be tappable.
*/
this.button = false;
/**
* The icon to use when `detail` is set to `true`.
*/
this.detailIcon = 'chevron-forward';
/**
* If `true`, the user cannot interact with the item.
*/
this.disabled = false;
/**
* When using a router, it specifies the transition direction when navigating to
* another page using `href`.
*/
this.routerDirection = 'forward';
/**
* The type of the button. Only used when an `onclick` or `button` property is present.
*/
this.type = 'button';
}
labelColorChanged(ev) {
const { color } = this;
// There will be a conflict with item color if
// we apply the label color to item, so we ignore
// the label color if the user sets a color on item
if (color === undefined) {
this.labelColorStyles = ev.detail;
}
}
itemStyle(ev) {
ev.stopPropagation();
const tagName = ev.target.tagName;
const updatedStyles = ev.detail;
const newStyles = {};
const childStyles = this.itemStyles.get(tagName) || {};
let hasStyleChange = false;
Object.keys(updatedStyles).forEach(key => {
if (updatedStyles[key]) {
const itemKey = `item-${key}`;
if (!childStyles[itemKey]) {
hasStyleChange = true;
}
newStyles[itemKey] = true;
}
});
if (!hasStyleChange && Object.keys(newStyles).length !== Object.keys(childStyles).length) {
hasStyleChange = true;
}
if (hasStyleChange) {
this.itemStyles.set(tagName, newStyles);
forceUpdate$1(this);
}
}
componentDidUpdate() {
// Do not use @Listen here to avoid making all items
// appear as clickable to screen readers
// https://github.com/ionic-team/ionic-framework/issues/22011
const input = this.getFirstInput();
if (input && !this.clickListener) {
this.clickListener = (ev) => this.delegateFocus(ev, input);
this.el.addEventListener('click', this.clickListener);
}
}
disconnectedCallback() {
const input = this.getFirstInput();
if (input && this.clickListener) {
this.el.removeEventListener('click', this.clickListener);
this.clickListener = undefined;
}
}
componentDidLoad() {
raf(() => this.setMultipleInputs());
}
// If the item contains multiple clickable elements and/or inputs, then the item
// should not have a clickable input cover over the entire item to prevent
// interfering with their individual click events
setMultipleInputs() {
// The following elements have a clickable cover that is relative to the entire item
const covers = this.el.querySelectorAll('ion-checkbox, ion-datetime, ion-select, ion-radio');
// The following elements can accept focus alongside the previous elements
// therefore if these elements are also a child of item, we don't want the
// input cover on top of those interfering with their clicks
const inputs = this.el.querySelectorAll('ion-input, ion-range, ion-searchbar, ion-segment, ion-textarea, ion-toggle');
// The following elements should also stay clickable when an input with cover is present
const clickables = this.el.querySelectorAll('ion-anchor, ion-button, a, button');
// Check for multiple inputs to change the position of the input cover to relative
// for all of the covered inputs above
this.multipleInputs = covers.length + inputs.length > 1
|| covers.length + clickables.length > 1
|| covers.length > 0 && this.isClickable();
}
// If the item contains an input including a checkbox, datetime, select, or radio
// then the item will have a clickable input cover that covers the item
// that should get the hover, focused and activated states UNLESS it has multiple
// inputs, then those need to individually get each click
hasCover() {
const inputs = this.el.querySelectorAll('ion-checkbox, ion-datetime, ion-select, ion-radio');
return inputs.length === 1 && !this.multipleInputs;
}
// If the item has an href or button property it will render a native
// anchor or button that is clickable
isClickable() {
return (this.href !== undefined || this.button);
}
canActivate() {
return (this.isClickable() || this.hasCover());
}
getFirstInput() {
const inputs = this.el.querySelectorAll('ion-input, ion-textarea');
return inputs[0];
}
// This is needed for WebKit due to a delegatesFocus bug where
// clicking on the left padding of an item is not focusing the input
// but is opening the keyboard. It will no longer be needed with
// iOS 14.
delegateFocus(ev, input) {
const clickedItem = ev.target.tagName === 'ION-ITEM';
let firstActive = false;
// If the first input is the same as the active element we need
// to focus the first input again, but if the active element
// is another input inside of the item we shouldn't switch focus
if (document.activeElement) {
firstActive = input.querySelector('input, textarea') === document.activeElement;
}
// Only focus the first input if we clicked on an ion-item
// and the first input exists
if (clickedItem && firstActive) {
input.fireFocusEvents = false;
input.setBlur();
input.setFocus();
raf(() => {
input.fireFocusEvents = true;
});
}
}
render() {
const { detail, detailIcon, download, labelColorStyles, lines, disabled, href, rel, target, routerAnimation, routerDirection } = this;
const childStyles = {};
const mode = getIonMode$1(this);
const clickable = this.isClickable();
const canActivate = this.canActivate();
const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div';
const attrs = (TagType === 'button')
? { type: this.type }
: {
download,
href,
rel,
target
};
// Only set onClick if the item is clickable to prevent screen
// readers from reading all items as clickable
const clickFn = clickable ? {
onClick: (ev) => { openURL(href, ev, routerDirection, routerAnimation); }
} : {};
const showDetail = detail !== undefined ? detail : mode === 'ios' && clickable;
this.itemStyles.forEach(value => {
Object.assign(childStyles, value);
});
const ariaDisabled = (disabled || childStyles['item-interactive-disabled']) ? 'true' : null;
return (hAsync(Host, { "aria-disabled": ariaDisabled, class: Object.assign(Object.assign(Object.assign({}, childStyles), labelColorStyles), createColorClasses$1(this.color, {
'item': true,
[mode]: true,
[`item-lines-${lines}`]: lines !== undefined,
'item-disabled': disabled,
'in-list': hostContext('ion-list', this.el),
'item-multiple-inputs': this.multipleInputs,
'ion-activatable': canActivate,
'ion-focusable': true,
})) }, hAsync(TagType, Object.assign({}, attrs, { class: "item-native", part: "native", disabled: disabled }, clickFn), hAsync("slot", { name: "start" }), hAsync("div", { class: "item-inner" }, hAsync("div", { class: "input-wrapper" }, hAsync("slot", null)), hAsync("slot", { name: "end" }), showDetail && hAsync("ion-icon", { icon: detailIcon, lazy: false, class: "item-detail-icon", part: "detail-icon", "aria-hidden": "true" }), hAsync("div", { class: "item-inner-highlight" })), canActivate && mode === 'md' && hAsync("ion-ripple-effect", null)), hAsync("div", { class: "item-highlight" })));
}
static get delegatesFocus() { return true; }
get el() { return getElement(this); }
static get style() { return {
ios: itemIosCss,
md: itemMdCss
}; }
static get cmpMeta() { return {
"$flags$": 57,
"$tagName$": "ion-item",
"$members$": {
"color": [513],
"button": [4],
"detail": [4],
"detailIcon": [1, "detail-icon"],
"disabled": [4],
"download": [1],
"href": [1],
"rel": [1],
"lines": [1],
"routerAnimation": [16],
"routerDirection": [1, "router-direction"],
"target": [1],
"type": [1],
"multipleInputs": [32]
},
"$listeners$": [[0, "ionColor", "labelColorChanged"], [0, "ionStyle", "itemStyle"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const itemDividerIosCss = "/*!@:host*/.sc-ion-item-divider-ios-h{--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--inner-padding-top:0px;--inner-padding-end:0px;--inner-padding-bottom:0px;--inner-padding-start:0px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);overflow:hidden;z-index:100;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-item-divider-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-inline-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@:host(.ion-color)*/.ion-color.sc-ion-item-divider-ios-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host(.item-divider-sticky)*/.item-divider-sticky.sc-ion-item-divider-ios-h{position:-webkit-sticky;position:sticky;top:0}/*!@.item-divider-inner*/.item-divider-inner.sc-ion-item-divider-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--inner-padding-start);padding-right:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-top:var(--inner-padding-top);padding-bottom:var(--inner-padding-bottom);display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;min-height:inherit;border:0;overflow:hidden}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.item-divider-inner*/.item-divider-inner.sc-ion-item-divider-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--inner-padding-start);padding-inline-start:var(--inner-padding-start);-webkit-padding-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-inline-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end))}}/*!@.item-divider-wrapper*/.item-divider-wrapper.sc-ion-item-divider-ios{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;text-overflow:ellipsis;overflow:hidden}/*!@:host*/.sc-ion-item-divider-ios-h{--background:var(--ion-color-step-100, #e6e6e6);--color:var(--ion-color-step-850, #262626);--padding-start:20px;--inner-padding-end:10px;border-radius:0;position:relative;min-height:28px;font-size:17px;font-weight:600}/*!@:host([slot=start])*/[slot=start].sc-ion-item-divider-ios-h{margin-left:0;margin-right:20px;margin-top:2px;margin-bottom:2px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host([slot=start])*/[slot=start].sc-ion-item-divider-ios-h{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:20px;margin-inline-end:20px}}/*!@:host([slot=end])*/[slot=end].sc-ion-item-divider-ios-h{margin-left:10px;margin-right:10px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host([slot=end])*/[slot=end].sc-ion-item-divider-ios-h{margin-left:unset;margin-right:unset;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:10px;margin-inline-end:10px}}/*!@::slotted(ion-icon[slot=start]),\n::slotted(ion-icon[slot=end])*/.sc-ion-item-divider-ios-s>ion-icon[slot=start],.sc-ion-item-divider-ios-s>ion-icon[slot=end]{margin-top:7px;margin-bottom:7px}/*!@::slotted(h1)*/.sc-ion-item-divider-ios-s>h1{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:24px;font-weight:normal}/*!@::slotted(h2)*/.sc-ion-item-divider-ios-s>h2{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:17px;font-weight:normal}/*!@::slotted(h3),\n::slotted(h4),\n::slotted(h5),\n::slotted(h6)*/.sc-ion-item-divider-ios-s>h3,.sc-ion-item-divider-ios-s>h4,.sc-ion-item-divider-ios-s>h5,.sc-ion-item-divider-ios-s>h6{margin-left:0;margin-right:0;margin-top:0;margin-bottom:3px;font-size:14px;font-weight:normal;line-height:normal}/*!@::slotted(p)*/.sc-ion-item-divider-ios-s>p{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.4);font-size:14px;line-height:normal;text-overflow:inherit;overflow:inherit}/*!@::slotted(h2:last-child) ::slotted(h3:last-child),\n::slotted(h4:last-child),\n::slotted(h5:last-child),\n::slotted(h6:last-child),\n::slotted(p:last-child)*/.sc-ion-item-divider-ios-s>h2:last-child -shadowcssslotted(h3:last-child),.sc-ion-item-divider-ios-s>h4:last-child,.sc-ion-item-divider-ios-s>h5:last-child,.sc-ion-item-divider-ios-s>h6:last-child,.sc-ion-item-divider-ios-s>p:last-child{margin-bottom:0}";
const itemDividerMdCss = "/*!@:host*/.sc-ion-item-divider-md-h{--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--inner-padding-top:0px;--inner-padding-end:0px;--inner-padding-bottom:0px;--inner-padding-start:0px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);overflow:hidden;z-index:100;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-item-divider-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-inline-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@:host(.ion-color)*/.ion-color.sc-ion-item-divider-md-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@:host(.item-divider-sticky)*/.item-divider-sticky.sc-ion-item-divider-md-h{position:-webkit-sticky;position:sticky;top:0}/*!@.item-divider-inner*/.item-divider-inner.sc-ion-item-divider-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--inner-padding-start);padding-right:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-top:var(--inner-padding-top);padding-bottom:var(--inner-padding-bottom);display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;min-height:inherit;border:0;overflow:hidden}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.item-divider-inner*/.item-divider-inner.sc-ion-item-divider-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--inner-padding-start);padding-inline-start:var(--inner-padding-start);-webkit-padding-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-inline-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end))}}/*!@.item-divider-wrapper*/.item-divider-wrapper.sc-ion-item-divider-md{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;text-overflow:ellipsis;overflow:hidden}/*!@:host*/.sc-ion-item-divider-md-h{--background:var(--ion-background-color, #fff);--color:var(--ion-color-step-400, #999999);--padding-start:16px;--inner-padding-end:0;min-height:30px;border-bottom:1px solid var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.13))));font-size:14px}/*!@::slotted([slot=start])*/.sc-ion-item-divider-md-s>[slot=start]{margin-right:32px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=start])*/.sc-ion-item-divider-md-s>[slot=start]{margin-right:unset;-webkit-margin-end:32px;margin-inline-end:32px}}/*!@::slotted([slot=end])*/.sc-ion-item-divider-md-s>[slot=end]{margin-left:32px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=end])*/.sc-ion-item-divider-md-s>[slot=end]{margin-left:unset;-webkit-margin-start:32px;margin-inline-start:32px}}/*!@::slotted(ion-label)*/.sc-ion-item-divider-md-s>ion-label{margin-left:0;margin-right:0;margin-top:13px;margin-bottom:10px}/*!@::slotted(ion-icon)*/.sc-ion-item-divider-md-s>ion-icon{color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54);font-size:24px}/*!@:host(.ion-color) ::slotted(ion-icon)*/.sc-ion-item-divider-md-h.ion-color .sc-ion-item-divider-md-s>ion-icon{color:var(--ion-color-contrast)}/*!@::slotted(ion-icon[slot])*/.sc-ion-item-divider-md-s>ion-icon[slot]{margin-top:12px;margin-bottom:12px}/*!@::slotted(ion-icon[slot=start])*/.sc-ion-item-divider-md-s>ion-icon[slot=start]{margin-right:32px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon[slot=start])*/.sc-ion-item-divider-md-s>ion-icon[slot=start]{margin-right:unset;-webkit-margin-end:32px;margin-inline-end:32px}}/*!@::slotted(ion-icon[slot=end])*/.sc-ion-item-divider-md-s>ion-icon[slot=end]{margin-left:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-icon[slot=end])*/.sc-ion-item-divider-md-s>ion-icon[slot=end]{margin-left:unset;-webkit-margin-start:16px;margin-inline-start:16px}}/*!@::slotted(ion-note)*/.sc-ion-item-divider-md-s>ion-note{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-ms-flex-item-align:start;align-self:flex-start;font-size:11px}/*!@::slotted(ion-note[slot])*/.sc-ion-item-divider-md-s>ion-note[slot]{padding-left:0;padding-right:0;padding-top:18px;padding-bottom:10px}/*!@::slotted(ion-note[slot=start])*/.sc-ion-item-divider-md-s>ion-note[slot=start]{padding-right:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-note[slot=start])*/.sc-ion-item-divider-md-s>ion-note[slot=start]{padding-right:unset;-webkit-padding-end:16px;padding-inline-end:16px}}/*!@::slotted(ion-note[slot=end])*/.sc-ion-item-divider-md-s>ion-note[slot=end]{padding-left:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-note[slot=end])*/.sc-ion-item-divider-md-s>ion-note[slot=end]{padding-left:unset;-webkit-padding-start:16px;padding-inline-start:16px}}/*!@::slotted(ion-avatar)*/.sc-ion-item-divider-md-s>ion-avatar{width:40px;height:40px}/*!@::slotted(ion-thumbnail)*/.sc-ion-item-divider-md-s>ion-thumbnail{width:56px;height:56px}/*!@::slotted(ion-avatar),\n::slotted(ion-thumbnail)*/.sc-ion-item-divider-md-s>ion-avatar,.sc-ion-item-divider-md-s>ion-thumbnail{margin-top:8px;margin-bottom:8px}/*!@::slotted(ion-avatar[slot=start]),\n::slotted(ion-thumbnail[slot=start])*/.sc-ion-item-divider-md-s>ion-avatar[slot=start],.sc-ion-item-divider-md-s>ion-thumbnail[slot=start]{margin-right:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-avatar[slot=start]),\n::slotted(ion-thumbnail[slot=start])*/.sc-ion-item-divider-md-s>ion-avatar[slot=start],.sc-ion-item-divider-md-s>ion-thumbnail[slot=start]{margin-right:unset;-webkit-margin-end:16px;margin-inline-end:16px}}/*!@::slotted(ion-avatar[slot=end]),\n::slotted(ion-thumbnail[slot=end])*/.sc-ion-item-divider-md-s>ion-avatar[slot=end],.sc-ion-item-divider-md-s>ion-thumbnail[slot=end]{margin-left:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-avatar[slot=end]),\n::slotted(ion-thumbnail[slot=end])*/.sc-ion-item-divider-md-s>ion-avatar[slot=end],.sc-ion-item-divider-md-s>ion-thumbnail[slot=end]{margin-left:unset;-webkit-margin-start:16px;margin-inline-start:16px}}/*!@::slotted(h1)*/.sc-ion-item-divider-md-s>h1{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:24px;font-weight:normal}/*!@::slotted(h2)*/.sc-ion-item-divider-md-s>h2{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:16px;font-weight:normal}/*!@::slotted(h3, h4, h5, h6)*/.sc-ion-item-divider-md-s>h3,h4.sc-ion-item-divider-md,h5.sc-ion-item-divider-md,h6.sc-ion-item-divider-md{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:14px;font-weight:normal;line-height:normal}/*!@::slotted(p)*/.sc-ion-item-divider-md-s>p{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;color:var(--ion-color-step-600, #666666);font-size:14px;line-height:normal;text-overflow:inherit;overflow:inherit}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @slot - Content is placed between the named slots if provided without a slot.
* @slot start - Content is placed to the left of the divider text in LTR, and to the right in RTL.
* @slot end - Content is placed to the right of the divider text in LTR, and to the left in RTL.
*/
class ItemDivider {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* When it's set to `true`, the item-divider will stay visible when it reaches the top
* of the viewport until the next `ion-item-divider` replaces it.
*
* This feature relies in `position:sticky`:
* https://caniuse.com/#feat=css-sticky
*/
this.sticky = false;
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: createColorClasses$1(this.color, {
[mode]: true,
'item-divider-sticky': this.sticky,
'item': true,
}) }, hAsync("slot", { name: "start" }), hAsync("div", { class: "item-divider-inner" }, hAsync("div", { class: "item-divider-wrapper" }, hAsync("slot", null)), hAsync("slot", { name: "end" }))));
}
get el() { return getElement(this); }
static get style() { return {
ios: itemDividerIosCss,
md: itemDividerMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-item-divider",
"$members$": {
"color": [513],
"sticky": [4]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const itemGroupIosCss = "ion-item-group{display:block}";
const itemGroupMdCss = "ion-item-group{display:block}";
class ItemGroup {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { role: "group", class: {
[mode]: true,
// Used internally for styling
[`item-group-${mode}`]: true,
'item': true
} }));
}
static get style() { return {
ios: itemGroupIosCss,
md: itemGroupMdCss
}; }
static get cmpMeta() { return {
"$flags$": 32,
"$tagName$": "ion-item-group",
"$members$": undefined,
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const itemOptionIosCss = "/*!@:host*/.sc-ion-item-option-ios-h{--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff);background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit)}/*!@:host(.in-list.item-options-end:last-child)*/.in-list.item-options-end.sc-ion-item-option-ios-h:last-child{padding-right:calc(.7em + var(--ion-safe-area-right))}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-list.item-options-end:last-child)*/.in-list.item-options-end.sc-ion-item-option-ios-h:last-child{padding-right:unset;-webkit-padding-end:calc(.7em + var(--ion-safe-area-right));padding-inline-end:calc(.7em + var(--ion-safe-area-right))}}/*!@:host(.in-list.item-options-start:first-child)*/.in-list.item-options-start.sc-ion-item-option-ios-h:first-child{padding-left:calc(.7em + var(--ion-safe-area-left))}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-list.item-options-start:first-child)*/.in-list.item-options-start.sc-ion-item-option-ios-h:first-child{padding-left:unset;-webkit-padding-start:calc(.7em + var(--ion-safe-area-left));padding-inline-start:calc(.7em + var(--ion-safe-area-left))}}/*!@:host(.ion-color)*/.ion-color.sc-ion-item-option-ios-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@.button-native*/.button-native.sc-ion-item-option-ios{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;padding-left:0.7em;padding-right:0.7em;padding-top:0;padding-bottom:0;display:inline-block;position:relative;width:100%;height:100%;border:0;outline:none;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-item-option-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:0.7em;padding-inline-start:0.7em;-webkit-padding-end:0.7em;padding-inline-end:0.7em}}/*!@.button-inner*/.button-inner.sc-ion-item-option-ios{display:-ms-flexbox;display:flex;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%}/*!@.horizontal-wrapper*/.horizontal-wrapper.sc-ion-item-option-ios{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%}/*!@::slotted(*)*/.sc-ion-item-option-ios-s>*{-ms-flex-negative:0;flex-shrink:0}/*!@::slotted([slot=start])*/.sc-ion-item-option-ios-s>[slot=start]{margin-left:0;margin-right:5px;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=start])*/.sc-ion-item-option-ios-s>[slot=start]{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:5px;margin-inline-end:5px}}/*!@::slotted([slot=end])*/.sc-ion-item-option-ios-s>[slot=end]{margin-left:5px;margin-right:0;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=end])*/.sc-ion-item-option-ios-s>[slot=end]{margin-left:unset;margin-right:unset;-webkit-margin-start:5px;margin-inline-start:5px;-webkit-margin-end:0;margin-inline-end:0}}/*!@::slotted([slot=icon-only])*/.sc-ion-item-option-ios-s>[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:10px;margin-right:10px;margin-top:0;margin-bottom:0;min-width:0.9em;font-size:1.8em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=icon-only])*/.sc-ion-item-option-ios-s>[slot=icon-only]{margin-left:unset;margin-right:unset;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:10px;margin-inline-end:10px}}/*!@:host(.item-option-expandable)*/.item-option-expandable.sc-ion-item-option-ios-h{-ms-flex-negative:0;flex-shrink:0;-webkit-transition-duration:0;transition-duration:0;-webkit-transition-property:none;transition-property:none;-webkit-transition-timing-function:cubic-bezier(0.65, 0.05, 0.36, 1);transition-timing-function:cubic-bezier(0.65, 0.05, 0.36, 1)}/*!@:host(.item-option-disabled)*/.item-option-disabled.sc-ion-item-option-ios-h{pointer-events:none}/*!@:host(.item-option-disabled) .button-native*/.item-option-disabled.sc-ion-item-option-ios-h .button-native.sc-ion-item-option-ios{cursor:default;opacity:0.5;pointer-events:none}/*!@:host*/.sc-ion-item-option-ios-h{font-size:16px}/*!@:host(.ion-activated)*/.ion-activated.sc-ion-item-option-ios-h{background:var(--ion-color-primary-shade, #3171e0)}/*!@:host(.ion-color.ion-activated)*/.ion-color.ion-activated.sc-ion-item-option-ios-h{background:var(--ion-color-shade)}";
const itemOptionMdCss = "/*!@:host*/.sc-ion-item-option-md-h{--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff);background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit)}/*!@:host(.in-list.item-options-end:last-child)*/.in-list.item-options-end.sc-ion-item-option-md-h:last-child{padding-right:calc(.7em + var(--ion-safe-area-right))}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-list.item-options-end:last-child)*/.in-list.item-options-end.sc-ion-item-option-md-h:last-child{padding-right:unset;-webkit-padding-end:calc(.7em + var(--ion-safe-area-right));padding-inline-end:calc(.7em + var(--ion-safe-area-right))}}/*!@:host(.in-list.item-options-start:first-child)*/.in-list.item-options-start.sc-ion-item-option-md-h:first-child{padding-left:calc(.7em + var(--ion-safe-area-left))}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-list.item-options-start:first-child)*/.in-list.item-options-start.sc-ion-item-option-md-h:first-child{padding-left:unset;-webkit-padding-start:calc(.7em + var(--ion-safe-area-left));padding-inline-start:calc(.7em + var(--ion-safe-area-left))}}/*!@:host(.ion-color)*/.ion-color.sc-ion-item-option-md-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@.button-native*/.button-native.sc-ion-item-option-md{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;padding-left:0.7em;padding-right:0.7em;padding-top:0;padding-bottom:0;display:inline-block;position:relative;width:100%;height:100%;border:0;outline:none;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-item-option-md{padding-left:unset;padding-right:unset;-webkit-padding-start:0.7em;padding-inline-start:0.7em;-webkit-padding-end:0.7em;padding-inline-end:0.7em}}/*!@.button-inner*/.button-inner.sc-ion-item-option-md{display:-ms-flexbox;display:flex;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%}/*!@.horizontal-wrapper*/.horizontal-wrapper.sc-ion-item-option-md{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%}/*!@::slotted(*)*/.sc-ion-item-option-md-s>*{-ms-flex-negative:0;flex-shrink:0}/*!@::slotted([slot=start])*/.sc-ion-item-option-md-s>[slot=start]{margin-left:0;margin-right:5px;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=start])*/.sc-ion-item-option-md-s>[slot=start]{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:5px;margin-inline-end:5px}}/*!@::slotted([slot=end])*/.sc-ion-item-option-md-s>[slot=end]{margin-left:5px;margin-right:0;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=end])*/.sc-ion-item-option-md-s>[slot=end]{margin-left:unset;margin-right:unset;-webkit-margin-start:5px;margin-inline-start:5px;-webkit-margin-end:0;margin-inline-end:0}}/*!@::slotted([slot=icon-only])*/.sc-ion-item-option-md-s>[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:10px;margin-right:10px;margin-top:0;margin-bottom:0;min-width:0.9em;font-size:1.8em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=icon-only])*/.sc-ion-item-option-md-s>[slot=icon-only]{margin-left:unset;margin-right:unset;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:10px;margin-inline-end:10px}}/*!@:host(.item-option-expandable)*/.item-option-expandable.sc-ion-item-option-md-h{-ms-flex-negative:0;flex-shrink:0;-webkit-transition-duration:0;transition-duration:0;-webkit-transition-property:none;transition-property:none;-webkit-transition-timing-function:cubic-bezier(0.65, 0.05, 0.36, 1);transition-timing-function:cubic-bezier(0.65, 0.05, 0.36, 1)}/*!@:host(.item-option-disabled)*/.item-option-disabled.sc-ion-item-option-md-h{pointer-events:none}/*!@:host(.item-option-disabled) .button-native*/.item-option-disabled.sc-ion-item-option-md-h .button-native.sc-ion-item-option-md{cursor:default;opacity:0.5;pointer-events:none}/*!@:host*/.sc-ion-item-option-md-h{font-size:14px;font-weight:500;text-transform:uppercase}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @slot - Content is placed between the named slots if provided without a slot.
* @slot start - Content is placed to the left of the option text in LTR, and to the right in RTL.
* @slot top - Content is placed above the option text.
* @slot icon-only - Should be used on an icon in an option that has no text.
* @slot bottom - Content is placed below the option text.
* @slot end - Content is placed to the right of the option text in LTR, and to the left in RTL.
*
* @part native - The native HTML button or anchor element that wraps all child elements.
*/
class ItemOption {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If `true`, the user cannot interact with the item option.
*/
this.disabled = false;
/**
* If `true`, the option will expand to take up the available width and cover any other options.
*/
this.expandable = false;
/**
* The type of the button.
*/
this.type = 'button';
this.onClick = (ev) => {
const el = ev.target.closest('ion-item-option');
if (el) {
ev.preventDefault();
}
};
}
render() {
const { disabled, expandable, href } = this;
const TagType = href === undefined ? 'button' : 'a';
const mode = getIonMode$1(this);
const attrs = (TagType === 'button')
? { type: this.type }
: {
download: this.download,
href: this.href,
target: this.target
};
return (hAsync(Host, { onClick: this.onClick, class: createColorClasses$1(this.color, {
[mode]: true,
'item-option-disabled': disabled,
'item-option-expandable': expandable,
'ion-activatable': true
}) }, hAsync(TagType, Object.assign({}, attrs, { class: "button-native", part: "native", disabled: disabled }), hAsync("span", { class: "button-inner" }, hAsync("slot", { name: "top" }), hAsync("div", { class: "horizontal-wrapper" }, hAsync("slot", { name: "start" }), hAsync("slot", { name: "icon-only" }), hAsync("slot", null), hAsync("slot", { name: "end" })), hAsync("slot", { name: "bottom" })), mode === 'md' && hAsync("ion-ripple-effect", null))));
}
get el() { return getElement(this); }
static get style() { return {
ios: itemOptionIosCss,
md: itemOptionMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-item-option",
"$members$": {
"color": [513],
"disabled": [4],
"download": [1],
"expandable": [4],
"href": [1],
"rel": [1],
"target": [1],
"type": [1]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const itemOptionsIosCss = "ion-item-options{top:0;right:0;-ms-flex-pack:end;justify-content:flex-end;display:none;position:absolute;height:100%;font-size:14px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1}[dir=rtl] ion-item-options,:host-context([dir=rtl]) ion-item-options{-ms-flex-pack:start;justify-content:flex-start}[dir=rtl] ion-item-options:not(.item-options-end),:host-context([dir=rtl]) ion-item-options:not(.item-options-end){right:auto;left:0;-ms-flex-pack:end;justify-content:flex-end}.item-options-start{right:auto;left:0;-ms-flex-pack:start;justify-content:flex-start}[dir=rtl] .item-options-start,:host-context([dir=rtl]) .item-options-start{-ms-flex-pack:end;justify-content:flex-end}.item-options-start ion-item-option:first-child{padding-right:var(--ion-safe-area-left)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.item-options-start ion-item-option:first-child{padding-right:unset;-webkit-padding-end:var(--ion-safe-area-left);padding-inline-end:var(--ion-safe-area-left)}}.item-options-end ion-item-option:last-child{padding-right:var(--ion-safe-area-right)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.item-options-end ion-item-option:last-child{padding-right:unset;-webkit-padding-end:var(--ion-safe-area-right);padding-inline-end:var(--ion-safe-area-right)}}[dir=rtl] .item-sliding-active-slide.item-sliding-active-options-start ion-item-options:not(.item-options-end),:host-context([dir=rtl]) .item-sliding-active-slide.item-sliding-active-options-start ion-item-options:not(.item-options-end){width:100%;visibility:visible}.item-sliding-active-slide ion-item-options{display:-ms-flexbox;display:flex;visibility:hidden}.item-sliding-active-slide.item-sliding-active-options-start .item-options-start,.item-sliding-active-slide.item-sliding-active-options-end ion-item-options:not(.item-options-start){width:100%;visibility:visible}.item-options-ios{border-bottom-width:0;border-bottom-style:solid;border-bottom-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, #c8c7cc)))}.item-options-ios.item-options-end{border-bottom-width:0.55px}.list-ios-lines-none .item-options-ios{border-bottom-width:0}.list-ios-lines-full .item-options-ios,.list-ios-lines-inset .item-options-ios.item-options-end{border-bottom-width:0.55px}";
const itemOptionsMdCss = "ion-item-options{top:0;right:0;-ms-flex-pack:end;justify-content:flex-end;display:none;position:absolute;height:100%;font-size:14px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1}[dir=rtl] ion-item-options,:host-context([dir=rtl]) ion-item-options{-ms-flex-pack:start;justify-content:flex-start}[dir=rtl] ion-item-options:not(.item-options-end),:host-context([dir=rtl]) ion-item-options:not(.item-options-end){right:auto;left:0;-ms-flex-pack:end;justify-content:flex-end}.item-options-start{right:auto;left:0;-ms-flex-pack:start;justify-content:flex-start}[dir=rtl] .item-options-start,:host-context([dir=rtl]) .item-options-start{-ms-flex-pack:end;justify-content:flex-end}.item-options-start ion-item-option:first-child{padding-right:var(--ion-safe-area-left)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.item-options-start ion-item-option:first-child{padding-right:unset;-webkit-padding-end:var(--ion-safe-area-left);padding-inline-end:var(--ion-safe-area-left)}}.item-options-end ion-item-option:last-child{padding-right:var(--ion-safe-area-right)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.item-options-end ion-item-option:last-child{padding-right:unset;-webkit-padding-end:var(--ion-safe-area-right);padding-inline-end:var(--ion-safe-area-right)}}[dir=rtl] .item-sliding-active-slide.item-sliding-active-options-start ion-item-options:not(.item-options-end),:host-context([dir=rtl]) .item-sliding-active-slide.item-sliding-active-options-start ion-item-options:not(.item-options-end){width:100%;visibility:visible}.item-sliding-active-slide ion-item-options{display:-ms-flexbox;display:flex;visibility:hidden}.item-sliding-active-slide.item-sliding-active-options-start .item-options-start,.item-sliding-active-slide.item-sliding-active-options-end ion-item-options:not(.item-options-start){width:100%;visibility:visible}.item-options-md{border-bottom-width:0;border-bottom-style:solid;border-bottom-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.13))))}.list-md-lines-none .item-options-md{border-bottom-width:0}.list-md-lines-full .item-options-md,.list-md-lines-inset .item-options-md.item-options-end{border-bottom-width:1px}";
class ItemOptions {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionSwipe = createEvent(this, "ionSwipe", 7);
/**
* The side the option button should be on. Possible values: `"start"` and `"end"`. If you have multiple `ion-item-options`, a side must be provided for each.
*
*/
this.side = 'end';
}
/** @internal */
async fireSwipeEvent() {
this.ionSwipe.emit({
side: this.side
});
}
render() {
const mode = getIonMode$1(this);
const isEnd = isEndSide(this.side);
return (hAsync(Host, { class: {
[mode]: true,
// Used internally for styling
[`item-options-${mode}`]: true,
'item-options-start': !isEnd,
'item-options-end': isEnd
} }));
}
get el() { return getElement(this); }
static get style() { return {
ios: itemOptionsIosCss,
md: itemOptionsMdCss
}; }
static get cmpMeta() { return {
"$flags$": 32,
"$tagName$": "ion-item-options",
"$members$": {
"side": [1],
"fireSwipeEvent": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const itemSlidingCss = "ion-item-sliding{display:block;position:relative;width:100%;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ion-item-sliding .item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.item-sliding-active-slide .item{position:relative;-webkit-transition:-webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);transition:-webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);transition:transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);transition:transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1), -webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);opacity:1;z-index:2;pointer-events:none;will-change:transform}.item-sliding-active-swipe-end .item-options-end .item-option-expandable{padding-left:100%;-ms-flex-order:1;order:1;-webkit-transition-duration:0.6s;transition-duration:0.6s;-webkit-transition-property:padding-left;transition-property:padding-left}[dir=rtl] .item-sliding-active-swipe-end .item-options-end .item-option-expandable,:host-context([dir=rtl]) .item-sliding-active-swipe-end .item-options-end .item-option-expandable{-ms-flex-order:-1;order:-1}.item-sliding-active-swipe-start .item-options-start .item-option-expandable{padding-right:100%;-ms-flex-order:-1;order:-1;-webkit-transition-duration:0.6s;transition-duration:0.6s;-webkit-transition-property:padding-right;transition-property:padding-right}[dir=rtl] .item-sliding-active-swipe-start .item-options-start .item-option-expandable,:host-context([dir=rtl]) .item-sliding-active-swipe-start .item-options-start .item-option-expandable{-ms-flex-order:1;order:1}";
const SWIPE_MARGIN = 30;
const ELASTIC_FACTOR = 0.55;
let openSlidingItem;
class ItemSliding {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionDrag = createEvent(this, "ionDrag", 7);
this.item = null;
this.openAmount = 0;
this.initialOpenAmount = 0;
this.optsWidthRightSide = 0;
this.optsWidthLeftSide = 0;
this.sides = 0 /* None */;
this.optsDirty = true;
this.closestContent = null;
this.initialContentScrollY = true;
this.state = 2 /* Disabled */;
/**
* If `true`, the user cannot interact with the sliding item.
*/
this.disabled = false;
}
disabledChanged() {
if (this.gesture) {
this.gesture.enable(!this.disabled);
}
}
async connectedCallback() {
this.item = this.el.querySelector('ion-item');
this.closestContent = this.el.closest('ion-content');
await this.updateOptions();
this.gesture = (await Promise.resolve().then(function () { return index$1; })).createGesture({
el: this.el,
gestureName: 'item-swipe',
gesturePriority: 100,
threshold: 5,
canStart: ev => this.canStart(ev),
onStart: () => this.onStart(),
onMove: ev => this.onMove(ev),
onEnd: ev => this.onEnd(ev),
});
this.disabledChanged();
}
disconnectedCallback() {
if (this.gesture) {
this.gesture.destroy();
this.gesture = undefined;
}
this.item = null;
this.leftOptions = this.rightOptions = undefined;
if (openSlidingItem === this.el) {
openSlidingItem = undefined;
}
}
/**
* Get the amount the item is open in pixels.
*/
getOpenAmount() {
return Promise.resolve(this.openAmount);
}
/**
* Get the ratio of the open amount of the item compared to the width of the options.
* If the number returned is positive, then the options on the right side are open.
* If the number returned is negative, then the options on the left side are open.
* If the absolute value of the number is greater than 1, the item is open more than
* the width of the options.
*/
getSlidingRatio() {
return Promise.resolve(this.getSlidingRatioSync());
}
/**
* Open the sliding item.
*
* @param side The side of the options to open. If a side is not provided, it will open the first set of options it finds within the item.
*/
async open(side) {
if (this.item === null) {
return;
}
const optionsToOpen = this.getOptions(side);
if (!optionsToOpen) {
return;
}
/**
* If side is not set, we need to infer the side
* so we know which direction to move the options
*/
if (side === undefined) {
side = (optionsToOpen === this.leftOptions) ? 'start' : 'end';
}
// In RTL we want to switch the sides
side = isEndSide(side) ? 'end' : 'start';
const isStartOpen = this.openAmount < 0;
const isEndOpen = this.openAmount > 0;
/**
* If a side is open and a user tries to
* re-open the same side, we should not do anything
*/
if (isStartOpen && optionsToOpen === this.leftOptions) {
return;
}
if (isEndOpen && optionsToOpen === this.rightOptions) {
return;
}
this.closeOpened();
this.state = 4 /* Enabled */;
requestAnimationFrame(() => {
this.calculateOptsWidth();
const width = (side === 'end') ? this.optsWidthRightSide : -this.optsWidthLeftSide;
openSlidingItem = this.el;
this.setOpenAmount(width, false);
this.state = (side === 'end') ? 8 /* End */ : 16 /* Start */;
});
}
/**
* Close the sliding item. Items can also be closed from the [List](../list).
*/
async close() {
this.setOpenAmount(0, true);
}
/**
* Close all of the sliding items in the list. Items can also be closed from the [List](../list).
*/
async closeOpened() {
if (openSlidingItem !== undefined) {
openSlidingItem.close();
openSlidingItem = undefined;
return true;
}
return false;
}
/**
* Given an optional side, return the ion-item-options element.
*
* @param side This side of the options to get. If a side is not provided it will
* return the first one available.
*/
getOptions(side) {
if (side === undefined) {
return this.leftOptions || this.rightOptions;
}
else if (side === 'start') {
return this.leftOptions;
}
else {
return this.rightOptions;
}
}
async updateOptions() {
const options = this.el.querySelectorAll('ion-item-options');
let sides = 0;
// Reset left and right options in case they were removed
this.leftOptions = this.rightOptions = undefined;
for (let i = 0; i < options.length; i++) {
const item = options.item(i);
/**
* We cannot use the componentOnReady helper
* util here since we need to wait for all of these items
* to be ready before we set `this.sides` and `this.optsDirty`.
*/
const option = (item.componentOnReady !== undefined) ? await item.componentOnReady() : item;
const side = isEndSide(option.side) ? 'end' : 'start';
if (side === 'start') {
this.leftOptions = option;
sides |= 1 /* Start */;
}
else {
this.rightOptions = option;
sides |= 2 /* End */;
}
}
this.optsDirty = true;
this.sides = sides;
}
canStart(gesture) {
/**
* If very close to start of the screen
* do not open left side so swipe to go
* back will still work.
*/
const rtl = document.dir === 'rtl';
const atEdge = (rtl) ? (window.innerWidth - gesture.startX) < 15 : gesture.startX < 15;
if (atEdge) {
return false;
}
const selected = openSlidingItem;
if (selected && selected !== this.el) {
this.closeOpened();
}
return !!(this.rightOptions || this.leftOptions);
}
disableContentScrollY() {
if (this.closestContent === null) {
return;
}
this.initialContentScrollY = this.closestContent.scrollY;
this.closestContent.scrollY = false;
}
restoreContentScrollY() {
if (this.closestContent === null) {
return;
}
this.closestContent.scrollY = this.initialContentScrollY;
}
onStart() {
// Prevent scrolling during gesture
this.disableContentScrollY();
openSlidingItem = this.el;
if (this.tmr !== undefined) {
clearTimeout(this.tmr);
this.tmr = undefined;
}
if (this.openAmount === 0) {
this.optsDirty = true;
this.state = 4 /* Enabled */;
}
this.initialOpenAmount = this.openAmount;
if (this.item) {
this.item.style.transition = 'none';
}
}
onMove(gesture) {
if (this.optsDirty) {
this.calculateOptsWidth();
}
let openAmount = this.initialOpenAmount - gesture.deltaX;
switch (this.sides) {
case 2 /* End */:
openAmount = Math.max(0, openAmount);
break;
case 1 /* Start */:
openAmount = Math.min(0, openAmount);
break;
case 3 /* Both */: break;
case 0 /* None */: return;
default:
console.warn('invalid ItemSideFlags value', this.sides);
break;
}
let optsWidth;
if (openAmount > this.optsWidthRightSide) {
optsWidth = this.optsWidthRightSide;
openAmount = optsWidth + (openAmount - optsWidth) * ELASTIC_FACTOR;
}
else if (openAmount < -this.optsWidthLeftSide) {
optsWidth = -this.optsWidthLeftSide;
openAmount = optsWidth + (openAmount - optsWidth) * ELASTIC_FACTOR;
}
this.setOpenAmount(openAmount, false);
}
onEnd(gesture) {
// Restore ion-content scrollY to initial value when gesture ends
this.restoreContentScrollY();
const velocity = gesture.velocityX;
let restingPoint = (this.openAmount > 0)
? this.optsWidthRightSide
: -this.optsWidthLeftSide;
// Check if the drag didn't clear the buttons mid-point
// and we aren't moving fast enough to swipe open
const isResetDirection = (this.openAmount > 0) === !(velocity < 0);
const isMovingFast = Math.abs(velocity) > 0.3;
const isOnCloseZone = Math.abs(this.openAmount) < Math.abs(restingPoint / 2);
if (swipeShouldReset(isResetDirection, isMovingFast, isOnCloseZone)) {
restingPoint = 0;
}
const state = this.state;
this.setOpenAmount(restingPoint, true);
if ((state & 32 /* SwipeEnd */) !== 0 && this.rightOptions) {
this.rightOptions.fireSwipeEvent();
}
else if ((state & 64 /* SwipeStart */) !== 0 && this.leftOptions) {
this.leftOptions.fireSwipeEvent();
}
}
calculateOptsWidth() {
this.optsWidthRightSide = 0;
if (this.rightOptions) {
this.rightOptions.style.display = 'flex';
this.optsWidthRightSide = this.rightOptions.offsetWidth;
this.rightOptions.style.display = '';
}
this.optsWidthLeftSide = 0;
if (this.leftOptions) {
this.leftOptions.style.display = 'flex';
this.optsWidthLeftSide = this.leftOptions.offsetWidth;
this.leftOptions.style.display = '';
}
this.optsDirty = false;
}
setOpenAmount(openAmount, isFinal) {
if (this.tmr !== undefined) {
clearTimeout(this.tmr);
this.tmr = undefined;
}
if (!this.item) {
return;
}
const style = this.item.style;
this.openAmount = openAmount;
if (isFinal) {
style.transition = '';
}
if (openAmount > 0) {
this.state = (openAmount >= (this.optsWidthRightSide + SWIPE_MARGIN))
? 8 /* End */ | 32 /* SwipeEnd */
: 8 /* End */;
}
else if (openAmount < 0) {
this.state = (openAmount <= (-this.optsWidthLeftSide - SWIPE_MARGIN))
? 16 /* Start */ | 64 /* SwipeStart */
: 16 /* Start */;
}
else {
this.tmr = setTimeout(() => {
this.state = 2 /* Disabled */;
this.tmr = undefined;
}, 600);
openSlidingItem = undefined;
style.transform = '';
return;
}
style.transform = `translate3d(${-openAmount}px,0,0)`;
this.ionDrag.emit({
amount: openAmount,
ratio: this.getSlidingRatioSync()
});
}
getSlidingRatioSync() {
if (this.openAmount > 0) {
return this.openAmount / this.optsWidthRightSide;
}
else if (this.openAmount < 0) {
return this.openAmount / this.optsWidthLeftSide;
}
else {
return 0;
}
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
'item-sliding-active-slide': (this.state !== 2 /* Disabled */),
'item-sliding-active-options-end': (this.state & 8 /* End */) !== 0,
'item-sliding-active-options-start': (this.state & 16 /* Start */) !== 0,
'item-sliding-active-swipe-end': (this.state & 32 /* SwipeEnd */) !== 0,
'item-sliding-active-swipe-start': (this.state & 64 /* SwipeStart */) !== 0
} }));
}
get el() { return getElement(this); }
static get watchers() { return {
"disabled": ["disabledChanged"]
}; }
static get style() { return itemSlidingCss; }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-item-sliding",
"$members$": {
"disabled": [4],
"state": [32],
"getOpenAmount": [64],
"getSlidingRatio": [64],
"open": [64],
"close": [64],
"closeOpened": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const swipeShouldReset = (isResetDirection, isMovingFast, isOnResetZone) => {
// The logic required to know when the sliding item should close (openAmount=0)
// depends on three booleans (isResetDirection, isMovingFast, isOnResetZone)
// and it ended up being too complicated to be written manually without errors
// so the truth table is attached below: (0=false, 1=true)
// isResetDirection | isMovingFast | isOnResetZone || shouldClose
// 0 | 0 | 0 || 0
// 0 | 0 | 1 || 1
// 0 | 1 | 0 || 0
// 0 | 1 | 1 || 0
// 1 | 0 | 0 || 0
// 1 | 0 | 1 || 1
// 1 | 1 | 0 || 1
// 1 | 1 | 1 || 1
// The resulting expression was generated by resolving the K-map (Karnaugh map):
return (!isMovingFast && isOnResetZone) || (isResetDirection && isMovingFast);
};
const labelIosCss = ".item.sc-ion-label-ios-h,.item .sc-ion-label-ios-h{--color:initial;display:block;color:var(--color);font-family:var(--ion-font-family, inherit);font-size:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}.ion-color.sc-ion-label-ios-h{color:var(--ion-color-base)}.ion-text-wrap.sc-ion-label-ios-h,[text-wrap].sc-ion-label-ios-h{white-space:normal}.item-interactive-disabled.sc-ion-label-ios-h:not(.item-multiple-inputs),.item-interactive-disabled:not(.item-multiple-inputs) .sc-ion-label-ios-h{cursor:default;opacity:0.3;pointer-events:none}.item-input.sc-ion-label-ios-h,.item-input .sc-ion-label-ios-h{-ms-flex:initial;flex:initial;max-width:200px;pointer-events:none}.item-textarea.sc-ion-label-ios-h,.item-textarea .sc-ion-label-ios-h{-ms-flex-item-align:baseline;align-self:baseline}.label-fixed.sc-ion-label-ios-h{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}.label-stacked.sc-ion-label-ios-h,.label-floating.sc-ion-label-ios-h{margin-bottom:0;-ms-flex-item-align:stretch;align-self:stretch;width:auto;max-width:100%}.label-no-animate.label-floating.sc-ion-label-ios-h{-webkit-transition:none;transition:none}.sc-ion-label-ios-s h1,.sc-ion-label-ios-s h2,.sc-ion-label-ios-s h3,.sc-ion-label-ios-s h4,.sc-ion-label-ios-s h5,.sc-ion-label-ios-s h6{text-overflow:inherit;overflow:inherit}.ion-text-wrap.sc-ion-label-ios-h,[text-wrap].sc-ion-label-ios-h{font-size:14px;line-height:1.5}.label-stacked.sc-ion-label-ios-h{margin-bottom:4px;font-size:14px}.label-floating.sc-ion-label-ios-h{margin-bottom:0;-webkit-transform:translate3d(0, 29px, 0);transform:translate3d(0, 29px, 0);-webkit-transform-origin:left top;transform-origin:left top;-webkit-transition:-webkit-transform 150ms ease-in-out;transition:-webkit-transform 150ms ease-in-out;transition:transform 150ms ease-in-out;transition:transform 150ms ease-in-out, -webkit-transform 150ms ease-in-out}[dir=rtl].sc-ion-label-ios-h -no-combinator.label-floating.sc-ion-label-ios-h,[dir=rtl] .sc-ion-label-ios-h -no-combinator.label-floating.sc-ion-label-ios-h,[dir=rtl].label-floating.sc-ion-label-ios-h,[dir=rtl] .label-floating.sc-ion-label-ios-h{-webkit-transform-origin:right top;transform-origin:right top}.item-textarea.label-floating.sc-ion-label-ios-h,.item-textarea .label-floating.sc-ion-label-ios-h{-webkit-transform:translate3d(0, 28px, 0);transform:translate3d(0, 28px, 0)}.item-has-focus.label-floating.sc-ion-label-ios-h,.item-has-focus .label-floating.sc-ion-label-ios-h,.item-has-placeholder.sc-ion-label-ios-h:not(.item-input).label-floating,.item-has-placeholder:not(.item-input) .label-floating.sc-ion-label-ios-h,.item-has-value.label-floating.sc-ion-label-ios-h,.item-has-value .label-floating.sc-ion-label-ios-h{-webkit-transform:translate3d(0, 0, 0) scale(0.82);transform:translate3d(0, 0, 0) scale(0.82)}.sc-ion-label-ios-s h1{margin-left:0;margin-right:0;margin-top:3px;margin-bottom:2px;font-size:22px;font-weight:normal}.sc-ion-label-ios-s h2{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:17px;font-weight:normal}.sc-ion-label-ios-s h3,.sc-ion-label-ios-s h4,.sc-ion-label-ios-s h5,.sc-ion-label-ios-s h6{margin-left:0;margin-right:0;margin-top:0;margin-bottom:3px;font-size:14px;font-weight:normal;line-height:normal}.sc-ion-label-ios-s p{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:14px;line-height:normal;text-overflow:inherit;overflow:inherit}.sc-ion-label-ios-s>p{color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.4)}.sc-ion-label-ios-h.ion-color.sc-ion-label-ios-s>p,.ion-color .sc-ion-label-ios-h.sc-ion-label-ios-s>p{color:inherit}.sc-ion-label-ios-s h2:last-child,.sc-ion-label-ios-s h3:last-child,.sc-ion-label-ios-s h4:last-child,.sc-ion-label-ios-s h5:last-child,.sc-ion-label-ios-s h6:last-child,.sc-ion-label-ios-s p:last-child{margin-bottom:0}";
const labelMdCss = ".item.sc-ion-label-md-h,.item .sc-ion-label-md-h{--color:initial;display:block;color:var(--color);font-family:var(--ion-font-family, inherit);font-size:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}.ion-color.sc-ion-label-md-h{color:var(--ion-color-base)}.ion-text-wrap.sc-ion-label-md-h,[text-wrap].sc-ion-label-md-h{white-space:normal}.item-interactive-disabled.sc-ion-label-md-h:not(.item-multiple-inputs),.item-interactive-disabled:not(.item-multiple-inputs) .sc-ion-label-md-h{cursor:default;opacity:0.3;pointer-events:none}.item-input.sc-ion-label-md-h,.item-input .sc-ion-label-md-h{-ms-flex:initial;flex:initial;max-width:200px;pointer-events:none}.item-textarea.sc-ion-label-md-h,.item-textarea .sc-ion-label-md-h{-ms-flex-item-align:baseline;align-self:baseline}.label-fixed.sc-ion-label-md-h{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}.label-stacked.sc-ion-label-md-h,.label-floating.sc-ion-label-md-h{margin-bottom:0;-ms-flex-item-align:stretch;align-self:stretch;width:auto;max-width:100%}.label-no-animate.label-floating.sc-ion-label-md-h{-webkit-transition:none;transition:none}.sc-ion-label-md-s h1,.sc-ion-label-md-s h2,.sc-ion-label-md-s h3,.sc-ion-label-md-s h4,.sc-ion-label-md-s h5,.sc-ion-label-md-s h6{text-overflow:inherit;overflow:inherit}.ion-text-wrap.sc-ion-label-md-h,[text-wrap].sc-ion-label-md-h{line-height:1.5}.label-stacked.sc-ion-label-md-h{-webkit-transform-origin:left top;transform-origin:left top;-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1)}[dir=rtl].sc-ion-label-md-h -no-combinator.label-stacked.sc-ion-label-md-h,[dir=rtl] .sc-ion-label-md-h -no-combinator.label-stacked.sc-ion-label-md-h,[dir=rtl].label-stacked.sc-ion-label-md-h,[dir=rtl] .label-stacked.sc-ion-label-md-h{-webkit-transform-origin:right top;transform-origin:right top}.label-floating.sc-ion-label-md-h{-webkit-transform:translateY(96%);transform:translateY(96%);-webkit-transform-origin:left top;transform-origin:left top;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1)}[dir=rtl].sc-ion-label-md-h -no-combinator.label-floating.sc-ion-label-md-h,[dir=rtl] .sc-ion-label-md-h -no-combinator.label-floating.sc-ion-label-md-h,[dir=rtl].label-floating.sc-ion-label-md-h,[dir=rtl] .label-floating.sc-ion-label-md-h{-webkit-transform-origin:right top;transform-origin:right top}.item-textarea.label-floating.sc-ion-label-md-h,.item-textarea .label-floating.sc-ion-label-md-h{-webkit-transform:translateY(185%);transform:translateY(185%)}.label-stacked.sc-ion-label-md-h,.label-floating.sc-ion-label-md-h{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.item-has-focus.label-floating.sc-ion-label-md-h,.item-has-focus .label-floating.sc-ion-label-md-h,.item-has-placeholder.sc-ion-label-md-h:not(.item-input).label-floating,.item-has-placeholder:not(.item-input) .label-floating.sc-ion-label-md-h,.item-has-value.label-floating.sc-ion-label-md-h,.item-has-value .label-floating.sc-ion-label-md-h{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75)}.item-has-focus.label-stacked.sc-ion-label-md-h:not(.ion-color),.item-has-focus .label-stacked.sc-ion-label-md-h:not(.ion-color),.item-has-focus.label-floating.sc-ion-label-md-h:not(.ion-color),.item-has-focus .label-floating.sc-ion-label-md-h:not(.ion-color){color:var(--ion-color-primary, #3880ff)}.item-has-focus.ion-color.label-stacked.sc-ion-label-md-h:not(.ion-color),.item-has-focus.ion-color .label-stacked.sc-ion-label-md-h:not(.ion-color),.item-has-focus.ion-color.label-floating.sc-ion-label-md-h:not(.ion-color),.item-has-focus.ion-color .label-floating.sc-ion-label-md-h:not(.ion-color){color:var(--ion-color-contrast)}.sc-ion-label-md-s h1{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:24px;font-weight:normal}.sc-ion-label-md-s h2{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:16px;font-weight:normal}.sc-ion-label-md-s h3,.sc-ion-label-md-s h4,.sc-ion-label-md-s h5,.sc-ion-label-md-s h6{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:14px;font-weight:normal;line-height:normal}.sc-ion-label-md-s p{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:14px;line-height:20px;text-overflow:inherit;overflow:inherit}.sc-ion-label-md-s>p{color:var(--ion-color-step-600, #666666)}.sc-ion-label-md-h.ion-color.sc-ion-label-md-s>p,.ion-color .sc-ion-label-md-h.sc-ion-label-md-s>p{color:inherit}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Label {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionColor = createEvent(this, "ionColor", 7);
this.ionStyle = createEvent(this, "ionStyle", 7);
this.inRange = false;
this.noAnimate = false;
}
componentWillLoad() {
this.inRange = !!this.el.closest('ion-range');
this.noAnimate = (this.position === 'floating');
this.emitStyle();
this.emitColor();
}
componentDidLoad() {
if (this.noAnimate) {
setTimeout(() => {
this.noAnimate = false;
}, 1000);
}
}
colorChanged() {
this.emitColor();
}
positionChanged() {
this.emitStyle();
}
emitColor() {
const { color } = this;
this.ionColor.emit({
'item-label-color': color !== undefined,
[`ion-color-${color}`]: color !== undefined
});
}
emitStyle() {
const { inRange, position } = this;
// If the label is inside of a range we don't want
// to override the classes added by the label that
// is a direct child of the item
if (!inRange) {
this.ionStyle.emit({
'label': true,
[`label-${position}`]: position !== undefined
});
}
}
render() {
const position = this.position;
const mode = getIonMode$1(this);
return (hAsync(Host, { class: createColorClasses$1(this.color, {
[mode]: true,
[`label-${position}`]: position !== undefined,
[`label-no-animate`]: (this.noAnimate)
}) }));
}
get el() { return getElement(this); }
static get watchers() { return {
"color": ["colorChanged"],
"position": ["positionChanged"]
}; }
static get style() { return {
ios: labelIosCss,
md: labelMdCss
}; }
static get cmpMeta() { return {
"$flags$": 34,
"$tagName$": "ion-label",
"$members$": {
"color": [513],
"position": [1],
"noAnimate": [32]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const listIosCss = "ion-list{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:block;contain:content;list-style-type:none}ion-list.list-inset{-webkit-transform:translateZ(0);transform:translateZ(0);overflow:hidden}.list-ios{background:var(--ion-item-background, var(--ion-background-color, #fff))}.list-ios.list-inset{margin-left:16px;margin-right:16px;margin-top:16px;margin-bottom:16px;border-radius:4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.list-ios.list-inset{margin-left:unset;margin-right:unset;-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:16px;margin-inline-end:16px}}.list-ios.list-inset ion-item{--border-width:0 0 1px 0;--inner-border-width:0}.list-ios.list-inset ion-item:last-child{--border-width:0;--inner-border-width:0}.list-ios.list-inset+ion-list.list-inset{margin-top:0}.list-ios-lines-none .item{--border-width:0;--inner-border-width:0}.list-ios-lines-full .item,.list-ios .item-lines-full{--border-width:0 0 0.55px 0}.list-ios-lines-full .item{--inner-border-width:0}.list-ios-lines-inset .item,.list-ios .item-lines-inset{--inner-border-width:0 0 0.55px 0}.list-ios .item-lines-inset{--border-width:0}.list-ios .item-lines-full{--inner-border-width:0}.list-ios .item-lines-none{--border-width:0;--inner-border-width:0}ion-card .list-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}";
const listMdCss = "ion-list{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:block;contain:content;list-style-type:none}ion-list.list-inset{-webkit-transform:translateZ(0);transform:translateZ(0);overflow:hidden}.list-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:8px;padding-bottom:8px;background:var(--ion-item-background, var(--ion-background-color, #fff))}.list-md>.input:last-child::after{left:0}[dir=rtl] .list-md>.input:last-child::after,:host-context([dir=rtl]) .list-md>.input:last-child::after{left:unset;right:unset;right:0}.list-md.list-inset{margin-left:16px;margin-right:16px;margin-top:16px;margin-bottom:16px;border-radius:2px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.list-md.list-inset{margin-left:unset;margin-right:unset;-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:16px;margin-inline-end:16px}}.list-md.list-inset ion-item:first-child{--border-radius:2px 2px 0 0;--border-width:0 0 1px 0}.list-md.list-inset ion-item:last-child{--border-radius:0 0 2px, 2px;--border-width:0}.list-md.list-inset .item-interactive{--padding-start:0;--padding-end:0}.list-md.list-inset+ion-list.list-inset{margin-top:0}.list-md-lines-none .item{--border-width:0;--inner-border-width:0}.list-md-lines-full .item,.list-md .item-lines-full{--border-width:0 0 1px 0}.list-md-lines-full .item{--inner-border-width:0}.list-md-lines-inset .item,.list-md .item-lines-inset{--inner-border-width:0 0 1px 0}.list-md .item-lines-inset{--border-width:0}.list-md .item-lines-full{--inner-border-width:0}.list-md .item-lines-none{--border-width:0;--inner-border-width:0}ion-card .list-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class List {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If `true`, the list will have margin around it and rounded corners.
*/
this.inset = false;
}
/**
* If `ion-item-sliding` are used inside the list, this method closes
* any open sliding item.
*
* Returns `true` if an actual `ion-item-sliding` is closed.
*/
async closeSlidingItems() {
const item = this.el.querySelector('ion-item-sliding');
if (item && item.closeOpened) {
return item.closeOpened();
}
return false;
}
render() {
const mode = getIonMode$1(this);
const { lines, inset } = this;
return (hAsync(Host, { class: {
[mode]: true,
// Used internally for styling
[`list-${mode}`]: true,
'list-inset': inset,
[`list-lines-${lines}`]: lines !== undefined,
[`list-${mode}-lines-${lines}`]: lines !== undefined
} }));
}
get el() { return getElement(this); }
static get style() { return {
ios: listIosCss,
md: listMdCss
}; }
static get cmpMeta() { return {
"$flags$": 32,
"$tagName$": "ion-list",
"$members$": {
"lines": [1],
"inset": [4],
"closeSlidingItems": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const listHeaderIosCss = "/*!@:host*/.sc-ion-list-header-ios-h{--border-style:solid;--border-width:0;--inner-border-width:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;min-height:40px;border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);color:var(--color);overflow:hidden}/*!@:host(.ion-color)*/.ion-color.sc-ion-list-header-ios-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@.list-header-inner*/.list-header-inner.sc-ion-list-header-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;min-height:inherit;border-width:var(--inner-border-width);border-style:var(--border-style);border-color:var(--border-color);overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}/*!@::slotted(ion-label)*/.sc-ion-list-header-ios-s>ion-label{-ms-flex:1 1 auto;flex:1 1 auto}/*!@:host(.list-header-lines-inset),\n:host(.list-header-lines-none)*/.list-header-lines-inset.sc-ion-list-header-ios-h,.list-header-lines-none.sc-ion-list-header-ios-h{--border-width:0}/*!@:host(.list-header-lines-full),\n:host(.list-header-lines-none)*/.list-header-lines-full.sc-ion-list-header-ios-h,.list-header-lines-none.sc-ion-list-header-ios-h{--inner-border-width:0}/*!@:host*/.sc-ion-list-header-ios-h{--background:transparent;--color:var(--ion-color-step-850, #262626);--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, #c8c7cc)));padding-left:calc(var(--ion-safe-area-left, 0px) + 20px);position:relative;-ms-flex-align:end;align-items:flex-end;font-size:22px;font-weight:700;letter-spacing:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-list-header-ios-h{padding-left:unset;-webkit-padding-start:calc(var(--ion-safe-area-left, 0px) + 20px);padding-inline-start:calc(var(--ion-safe-area-left, 0px) + 20px)}}/*!@::slotted(ion-button),\n::slotted(ion-label)*/.sc-ion-list-header-ios-s>ion-button,.sc-ion-list-header-ios-s>ion-label{margin-top:29px;margin-bottom:6px}/*!@::slotted(ion-button)*/.sc-ion-list-header-ios-s>ion-button{margin-left:3px;margin-right:3px;height:1.4em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-button)*/.sc-ion-list-header-ios-s>ion-button{margin-left:unset;margin-right:unset;-webkit-margin-start:3px;margin-inline-start:3px;-webkit-margin-end:3px;margin-inline-end:3px}}/*!@:host(.list-header-lines-full)*/.list-header-lines-full.sc-ion-list-header-ios-h{--border-width:0 0 0.55px 0}/*!@:host(.list-header-lines-inset)*/.list-header-lines-inset.sc-ion-list-header-ios-h{--inner-border-width:0 0 0.55px 0}";
const listHeaderMdCss = "/*!@:host*/.sc-ion-list-header-md-h{--border-style:solid;--border-width:0;--inner-border-width:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;min-height:40px;border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);color:var(--color);overflow:hidden}/*!@:host(.ion-color)*/.ion-color.sc-ion-list-header-md-h{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@.list-header-inner*/.list-header-inner.sc-ion-list-header-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;min-height:inherit;border-width:var(--inner-border-width);border-style:var(--border-style);border-color:var(--border-color);overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}/*!@::slotted(ion-label)*/.sc-ion-list-header-md-s>ion-label{-ms-flex:1 1 auto;flex:1 1 auto}/*!@:host(.list-header-lines-inset),\n:host(.list-header-lines-none)*/.list-header-lines-inset.sc-ion-list-header-md-h,.list-header-lines-none.sc-ion-list-header-md-h{--border-width:0}/*!@:host(.list-header-lines-full),\n:host(.list-header-lines-none)*/.list-header-lines-full.sc-ion-list-header-md-h,.list-header-lines-none.sc-ion-list-header-md-h{--inner-border-width:0}/*!@:host*/.sc-ion-list-header-md-h{--background:transparent;--color:var(--ion-text-color, #000);--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.13))));padding-left:calc(var(--ion-safe-area-left, 0) + 16px);min-height:45px;font-size:14px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-list-header-md-h{padding-left:unset;-webkit-padding-start:calc(var(--ion-safe-area-left, 0) + 16px);padding-inline-start:calc(var(--ion-safe-area-left, 0) + 16px)}}/*!@:host(.list-header-lines-full)*/.list-header-lines-full.sc-ion-list-header-md-h{--border-width:0 0 1px 0}/*!@:host(.list-header-lines-inset)*/.list-header-lines-inset.sc-ion-list-header-md-h{--inner-border-width:0 0 1px 0}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class ListHeader {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
const { lines } = this;
const mode = getIonMode$1(this);
return (hAsync(Host, { class: createColorClasses$1(this.color, {
[mode]: true,
[`list-header-lines-${lines}`]: lines !== undefined,
}) }, hAsync("div", { class: "list-header-inner" }, hAsync("slot", null))));
}
static get style() { return {
ios: listHeaderIosCss,
md: listHeaderMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-list-header",
"$members$": {
"color": [513],
"lines": [1]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
/**
* iOS Loading Enter Animation
*/
const iosEnterAnimation$4 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
.beforeStyles({
'pointer-events': 'none'
})
.afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.loading-wrapper'))
.keyframes([
{ offset: 0, opacity: 0.01, transform: 'scale(1.1)' },
{ offset: 1, opacity: 1, transform: 'scale(1)' }
]);
return baseAnimation
.addElement(baseEl)
.easing('ease-in-out')
.duration(200)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* iOS Loading Leave Animation
*/
const iosLeaveAnimation$4 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 'var(--backdrop-opacity)', 0);
wrapperAnimation
.addElement(baseEl.querySelector('.loading-wrapper'))
.keyframes([
{ offset: 0, opacity: 0.99, transform: 'scale(1)' },
{ offset: 1, opacity: 0, transform: 'scale(0.9)' }
]);
return baseAnimation
.addElement(baseEl)
.easing('ease-in-out')
.duration(200)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* Md Loading Enter Animation
*/
const mdEnterAnimation$3 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
.beforeStyles({
'pointer-events': 'none'
})
.afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.loading-wrapper'))
.keyframes([
{ offset: 0, opacity: 0.01, transform: 'scale(1.1)' },
{ offset: 1, opacity: 1, transform: 'scale(1)' }
]);
return baseAnimation
.addElement(baseEl)
.easing('ease-in-out')
.duration(200)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* Md Loading Leave Animation
*/
const mdLeaveAnimation$3 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 'var(--backdrop-opacity)', 0);
wrapperAnimation
.addElement(baseEl.querySelector('.loading-wrapper'))
.keyframes([
{ offset: 0, opacity: 0.99, transform: 'scale(1)' },
{ offset: 1, opacity: 0, transform: 'scale(0.9)' }
]);
return baseAnimation
.addElement(baseEl)
.easing('ease-in-out')
.duration(200)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
const loadingIosCss = ".sc-ion-loading-ios-h{--min-width:auto;--width:auto;--min-height:auto;--height:auto;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:fixed;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;font-family:var(--ion-font-family, inherit);contain:strict;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1001}.overlay-hidden.sc-ion-loading-ios-h{display:none}.loading-wrapper.sc-ion-loading-ios{display:-ms-flexbox;display:flex;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);opacity:0;z-index:10}.spinner-lines.sc-ion-loading-ios,.spinner-lines-small.sc-ion-loading-ios,.spinner-bubbles.sc-ion-loading-ios,.spinner-circles.sc-ion-loading-ios,.spinner-crescent.sc-ion-loading-ios,.spinner-dots.sc-ion-loading-ios{color:var(--spinner-color)}.sc-ion-loading-ios-h{--background:var(--ion-overlay-background-color, var(--ion-color-step-100, #f9f9f9));--max-width:270px;--max-height:90%;--spinner-color:var(--ion-color-step-600, #666666);--backdrop-opacity:var(--ion-backdrop-opacity, 0.3);color:var(--ion-text-color, #000);font-size:14px}.loading-wrapper.sc-ion-loading-ios{border-radius:8px;padding-left:34px;padding-right:34px;padding-top:24px;padding-bottom:24px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.loading-wrapper.sc-ion-loading-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:34px;padding-inline-start:34px;-webkit-padding-end:34px;padding-inline-end:34px}}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){.loading-translucent.sc-ion-loading-ios-h .loading-wrapper.sc-ion-loading-ios{background-color:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}}.loading-content.sc-ion-loading-ios{font-weight:bold}.loading-spinner.sc-ion-loading-ios+.loading-content.sc-ion-loading-ios{margin-left:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.loading-spinner.sc-ion-loading-ios+.loading-content.sc-ion-loading-ios{margin-left:unset;-webkit-margin-start:16px;margin-inline-start:16px}}";
const loadingMdCss = ".sc-ion-loading-md-h{--min-width:auto;--width:auto;--min-height:auto;--height:auto;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:fixed;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;font-family:var(--ion-font-family, inherit);contain:strict;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1001}.overlay-hidden.sc-ion-loading-md-h{display:none}.loading-wrapper.sc-ion-loading-md{display:-ms-flexbox;display:flex;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);opacity:0;z-index:10}.spinner-lines.sc-ion-loading-md,.spinner-lines-small.sc-ion-loading-md,.spinner-bubbles.sc-ion-loading-md,.spinner-circles.sc-ion-loading-md,.spinner-crescent.sc-ion-loading-md,.spinner-dots.sc-ion-loading-md{color:var(--spinner-color)}.sc-ion-loading-md-h{--background:var(--ion-color-step-50, #f2f2f2);--max-width:280px;--max-height:90%;--spinner-color:var(--ion-color-primary, #3880ff);--backdrop-opacity:var(--ion-backdrop-opacity, 0.32);color:var(--ion-color-step-850, #262626);font-size:14px}.loading-wrapper.sc-ion-loading-md{border-radius:2px;padding-left:24px;padding-right:24px;padding-top:24px;padding-bottom:24px;-webkit-box-shadow:0 16px 20px rgba(0, 0, 0, 0.4);box-shadow:0 16px 20px rgba(0, 0, 0, 0.4)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.loading-wrapper.sc-ion-loading-md{padding-left:unset;padding-right:unset;-webkit-padding-start:24px;padding-inline-start:24px;-webkit-padding-end:24px;padding-inline-end:24px}}.loading-spinner.sc-ion-loading-md+.loading-content.sc-ion-loading-md{margin-left:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.loading-spinner.sc-ion-loading-md+.loading-content.sc-ion-loading-md{margin-left:unset;-webkit-margin-start:16px;margin-inline-start:16px}}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Loading {
constructor(hostRef) {
registerInstance(this, hostRef);
this.didPresent = createEvent(this, "ionLoadingDidPresent", 7);
this.willPresent = createEvent(this, "ionLoadingWillPresent", 7);
this.willDismiss = createEvent(this, "ionLoadingWillDismiss", 7);
this.didDismiss = createEvent(this, "ionLoadingDidDismiss", 7);
this.presented = false;
/**
* If `true`, the keyboard will be automatically dismissed when the overlay is presented.
*/
this.keyboardClose = true;
/**
* Number of milliseconds to wait before dismissing the loading indicator.
*/
this.duration = 0;
/**
* If `true`, the loading indicator will be dismissed when the backdrop is clicked.
*/
this.backdropDismiss = false;
/**
* If `true`, a backdrop will be displayed behind the loading indicator.
*/
this.showBackdrop = true;
/**
* If `true`, the loading indicator will be translucent.
* Only applies when the mode is `"ios"` and the device supports
* [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
*/
this.translucent = false;
/**
* If `true`, the loading indicator will animate.
*/
this.animated = true;
this.onBackdropTap = () => {
this.dismiss(undefined, BACKDROP);
};
}
connectedCallback() {
prepareOverlay(this.el);
}
componentWillLoad() {
if (this.spinner === undefined) {
const mode = getIonMode$1(this);
this.spinner = config.get('loadingSpinner', config.get('spinner', mode === 'ios' ? 'lines' : 'crescent'));
}
}
/**
* Present the loading overlay after it has been created.
*/
async present() {
await present(this, 'loadingEnter', iosEnterAnimation$4, mdEnterAnimation$3, undefined);
if (this.duration > 0) {
this.durationTimeout = setTimeout(() => this.dismiss(), this.duration + 10);
}
}
/**
* Dismiss the loading overlay after it has been presented.
*
* @param data Any data to emit in the dismiss events.
* @param role The role of the element that is dismissing the loading.
* This can be useful in a button handler for determining which button was
* clicked to dismiss the loading.
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
*/
dismiss(data, role) {
if (this.durationTimeout) {
clearTimeout(this.durationTimeout);
}
return dismiss(this, data, role, 'loadingLeave', iosLeaveAnimation$4, mdLeaveAnimation$3);
}
/**
* Returns a promise that resolves when the loading did dismiss.
*/
onDidDismiss() {
return eventMethod(this.el, 'ionLoadingDidDismiss');
}
/**
* Returns a promise that resolves when the loading will dismiss.
*/
onWillDismiss() {
return eventMethod(this.el, 'ionLoadingWillDismiss');
}
render() {
const { message, spinner } = this;
const mode = getIonMode$1(this);
return (hAsync(Host, { onIonBackdropTap: this.onBackdropTap, tabindex: "-1", style: {
zIndex: `${40000 + this.overlayIndex}`
}, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'loading-translucent': this.translucent }) }, hAsync("ion-backdrop", { visible: this.showBackdrop, tappable: this.backdropDismiss }), hAsync("div", { tabindex: "0" }), hAsync("div", { class: "loading-wrapper ion-overlay-wrapper", role: "dialog" }, spinner && (hAsync("div", { class: "loading-spinner" }, hAsync("ion-spinner", { name: spinner, "aria-hidden": "true" }))), message && hAsync("div", { class: "loading-content", innerHTML: sanitizeDOMString(message) })), hAsync("div", { tabindex: "0" })));
}
get el() { return getElement(this); }
static get style() { return {
ios: loadingIosCss,
md: loadingMdCss
}; }
static get cmpMeta() { return {
"$flags$": 34,
"$tagName$": "ion-loading",
"$members$": {
"overlayIndex": [2, "overlay-index"],
"keyboardClose": [4, "keyboard-close"],
"enterAnimation": [16],
"leaveAnimation": [16],
"message": [1],
"cssClass": [1, "css-class"],
"duration": [2],
"backdropDismiss": [4, "backdrop-dismiss"],
"showBackdrop": [4, "show-backdrop"],
"spinner": [1025],
"translucent": [4],
"animated": [4],
"present": [64],
"dismiss": [64],
"onDidDismiss": [64],
"onWillDismiss": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
/**
* Based on:
* https://stackoverflow.com/questions/7348009/y-coordinate-for-a-given-x-cubic-bezier
* https://math.stackexchange.com/questions/26846/is-there-an-explicit-form-for-cubic-b%C3%A9zier-curves
* TODO: Reduce rounding error
*/
/**
* EXPERIMENTAL
* Given a cubic-bezier curve, get the x value (time) given
* the y value (progression).
* Ex: cubic-bezier(0.32, 0.72, 0, 1);
* P0: (0, 0)
* P1: (0.32, 0.72)
* P2: (0, 1)
* P3: (1, 1)
*
* If you give a cubic bezier curve that never reaches the
* provided progression, this function will return an empty array.
*/
const getTimeGivenProgression = (p0, p1, p2, p3, progression) => {
return solveCubicBezier(p0[1], p1[1], p2[1], p3[1], progression).map(tValue => {
return solveCubicParametricEquation(p0[0], p1[0], p2[0], p3[0], tValue);
});
};
/**
* Solve a cubic equation in one dimension (time)
*/
const solveCubicParametricEquation = (p0, p1, p2, p3, t) => {
const partA = (3 * p1) * Math.pow(t - 1, 2);
const partB = (-3 * p2 * t) + (3 * p2) + (p3 * t);
const partC = p0 * Math.pow(t - 1, 3);
return t * (partA + (t * partB)) - partC;
};
/**
* Find the `t` value for a cubic bezier using Cardano's formula
*/
const solveCubicBezier = (p0, p1, p2, p3, refPoint) => {
p0 -= refPoint;
p1 -= refPoint;
p2 -= refPoint;
p3 -= refPoint;
const roots = solveCubicEquation(p3 - 3 * p2 + 3 * p1 - p0, 3 * p2 - 6 * p1 + 3 * p0, 3 * p1 - 3 * p0, p0);
return roots.filter(root => root >= 0 && root <= 1);
};
const solveQuadraticEquation = (a, b, c) => {
const discriminant = b * b - 4 * a * c;
if (discriminant < 0) {
return [];
}
else {
return [
(-b + Math.sqrt(discriminant)) / (2 * a),
(-b - Math.sqrt(discriminant)) / (2 * a)
];
}
};
const solveCubicEquation = (a, b, c, d) => {
if (a === 0) {
return solveQuadraticEquation(b, c, d);
}
b /= a;
c /= a;
d /= a;
const p = (3 * c - b * b) / 3;
const q = (2 * b * b * b - 9 * b * c + 27 * d) / 27;
if (p === 0) {
return [Math.pow(-q, 1 / 3)];
}
else if (q === 0) {
return [Math.sqrt(-p), -Math.sqrt(-p)];
}
const discriminant = Math.pow(q / 2, 2) + Math.pow(p / 3, 3);
if (discriminant === 0) {
return [Math.pow(q / 2, 1 / 2) - b / 3];
}
else if (discriminant > 0) {
return [Math.pow(-(q / 2) + Math.sqrt(discriminant), 1 / 3) - Math.pow((q / 2) + Math.sqrt(discriminant), 1 / 3) - b / 3];
}
const r = Math.sqrt(Math.pow(-(p / 3), 3));
const phi = Math.acos(-(q / (2 * Math.sqrt(Math.pow(-(p / 3), 3)))));
const s = 2 * Math.pow(r, 1 / 3);
return [
s * Math.cos(phi / 3) - b / 3,
s * Math.cos((phi + 2 * Math.PI) / 3) - b / 3,
s * Math.cos((phi + 4 * Math.PI) / 3) - b / 3
];
};
/**
* baseAnimation
* Base class which is extended by the various types. Each
* type will provide their own animations for open and close
* and registers itself with Menu.
*/
const baseAnimation = (isIos) => {
// https://material.io/guidelines/motion/movement.html#movement-movement-in-out-of-screen-bounds
// https://material.io/guidelines/motion/duration-easing.html#duration-easing-natural-easing-curves
/**
* "Apply the sharp curve to items temporarily leaving the screen that may return
* from the same exit point. When they return, use the deceleration curve. On mobile,
* this transition typically occurs over 300ms" -- MD Motion Guide
*/
return createAnimation().duration(isIos ? 400 : 300);
};
/**
* Menu Overlay Type
* The menu slides over the content. The content
* itself, which is under the menu, does not move.
*/
const menuOverlayAnimation = (menu) => {
let closedX;
let openedX;
const width = menu.width + 8;
const menuAnimation = createAnimation();
const backdropAnimation = createAnimation();
if (menu.isEndSide) {
// right side
closedX = width + 'px';
openedX = '0px';
}
else {
// left side
closedX = -width + 'px';
openedX = '0px';
}
menuAnimation
.addElement(menu.menuInnerEl)
.fromTo('transform', `translateX(${closedX})`, `translateX(${openedX})`);
const mode = getIonMode$1(menu);
const isIos = mode === 'ios';
const opacity = isIos ? 0.2 : 0.25;
backdropAnimation
.addElement(menu.backdropEl)
.fromTo('opacity', 0.01, opacity);
return baseAnimation(isIos).addAnimation([menuAnimation, backdropAnimation]);
};
/**
* Menu Push Type
* The content slides over to reveal the menu underneath.
* The menu itself also slides over to reveal its bad self.
*/
const menuPushAnimation = (menu) => {
let contentOpenedX;
let menuClosedX;
const mode = getIonMode$1(menu);
const width = menu.width;
if (menu.isEndSide) {
contentOpenedX = -width + 'px';
menuClosedX = width + 'px';
}
else {
contentOpenedX = width + 'px';
menuClosedX = -width + 'px';
}
const menuAnimation = createAnimation()
.addElement(menu.menuInnerEl)
.fromTo('transform', `translateX(${menuClosedX})`, 'translateX(0px)');
const contentAnimation = createAnimation()
.addElement(menu.contentEl)
.fromTo('transform', 'translateX(0px)', `translateX(${contentOpenedX})`);
const backdropAnimation = createAnimation()
.addElement(menu.backdropEl)
.fromTo('opacity', 0.01, 0.32);
return baseAnimation(mode === 'ios').addAnimation([menuAnimation, contentAnimation, backdropAnimation]);
};
/**
* Menu Reveal Type
* The content slides over to reveal the menu underneath.
* The menu itself, which is under the content, does not move.
*/
const menuRevealAnimation = (menu) => {
const mode = getIonMode$1(menu);
const openedX = (menu.width * (menu.isEndSide ? -1 : 1)) + 'px';
const contentOpen = createAnimation()
.addElement(menu.contentEl) // REVIEW
.fromTo('transform', 'translateX(0px)', `translateX(${openedX})`);
return baseAnimation(mode === 'ios').addAnimation(contentOpen);
};
const createMenuController = () => {
const menuAnimations = new Map();
const menus = [];
const open = async (menu) => {
const menuEl = await get(menu);
if (menuEl) {
return menuEl.open();
}
return false;
};
const close = async (menu) => {
const menuEl = await (menu !== undefined ? get(menu) : getOpen());
if (menuEl !== undefined) {
return menuEl.close();
}
return false;
};
const toggle = async (menu) => {
const menuEl = await get(menu);
if (menuEl) {
return menuEl.toggle();
}
return false;
};
const enable = async (shouldEnable, menu) => {
const menuEl = await get(menu);
if (menuEl) {
menuEl.disabled = !shouldEnable;
}
return menuEl;
};
const swipeGesture = async (shouldEnable, menu) => {
const menuEl = await get(menu);
if (menuEl) {
menuEl.swipeGesture = shouldEnable;
}
return menuEl;
};
const isOpen = async (menu) => {
if (menu != null) {
const menuEl = await get(menu);
return (menuEl !== undefined && menuEl.isOpen());
}
else {
const menuEl = await getOpen();
return menuEl !== undefined;
}
};
const isEnabled = async (menu) => {
const menuEl = await get(menu);
if (menuEl) {
return !menuEl.disabled;
}
return false;
};
const get = async (menu) => {
await waitUntilReady();
if (menu === 'start' || menu === 'end') {
// there could be more than one menu on the same side
// so first try to get the enabled one
const menuRef = find(m => m.side === menu && !m.disabled);
if (menuRef) {
return menuRef;
}
// didn't find a menu side that is enabled
// so try to get the first menu side found
return find(m => m.side === menu);
}
else if (menu != null) {
// the menuId was not left or right
// so try to get the menu by its "id"
return find(m => m.menuId === menu);
}
// return the first enabled menu
const menuEl = find(m => !m.disabled);
if (menuEl) {
return menuEl;
}
// get the first menu in the array, if one exists
return menus.length > 0 ? menus[0].el : undefined;
};
/**
* Get the instance of the opened menu. Returns `null` if a menu is not found.
*/
const getOpen = async () => {
await waitUntilReady();
return _getOpenSync();
};
/**
* Get all menu instances.
*/
const getMenus = async () => {
await waitUntilReady();
return getMenusSync();
};
/**
* Get whether or not a menu is animating. Returns `true` if any
* menu is currently animating.
*/
const isAnimating = async () => {
await waitUntilReady();
return isAnimatingSync();
};
const registerAnimation = (name, animation) => {
menuAnimations.set(name, animation);
};
const _register = (menu) => {
if (menus.indexOf(menu) < 0) {
if (!menu.disabled) {
_setActiveMenu(menu);
}
menus.push(menu);
}
};
const _unregister = (menu) => {
const index = menus.indexOf(menu);
if (index > -1) {
menus.splice(index, 1);
}
};
const _setActiveMenu = (menu) => {
// if this menu should be enabled
// then find all the other menus on this same side
// and automatically disable other same side menus
const side = menu.side;
menus
.filter(m => m.side === side && m !== menu)
.forEach(m => m.disabled = true);
};
const _setOpen = async (menu, shouldOpen, animated) => {
if (isAnimatingSync()) {
return false;
}
if (shouldOpen) {
const openedMenu = await getOpen();
if (openedMenu && menu.el !== openedMenu) {
await openedMenu.setOpen(false, false);
}
}
return menu._setOpen(shouldOpen, animated);
};
const _createAnimation = (type, menuCmp) => {
const animationBuilder = menuAnimations.get(type);
if (!animationBuilder) {
throw new Error('animation not registered');
}
const animation = animationBuilder(menuCmp);
return animation;
};
const _getOpenSync = () => {
return find(m => m._isOpen);
};
const getMenusSync = () => {
return menus.map(menu => menu.el);
};
const isAnimatingSync = () => {
return menus.some(menu => menu.isAnimating);
};
const find = (predicate) => {
const instance = menus.find(predicate);
if (instance !== undefined) {
return instance.el;
}
return undefined;
};
const waitUntilReady = () => {
return Promise.all(Array.from(document.querySelectorAll('ion-menu'))
.map(menu => new Promise(resolve => componentOnReady(menu, resolve))));
};
registerAnimation('reveal', menuRevealAnimation);
registerAnimation('push', menuPushAnimation);
registerAnimation('overlay', menuOverlayAnimation);
/* tslint:disable-next-line */
if (typeof document !== 'undefined') {
document.addEventListener('ionBackButton', (ev) => {
const openMenu = _getOpenSync();
if (openMenu) {
ev.detail.register(MENU_BACK_BUTTON_PRIORITY, () => {
return openMenu.close();
});
}
});
}
return {
registerAnimation,
get,
getMenus,
getOpen,
isEnabled,
swipeGesture,
isAnimating,
isOpen,
enable,
toggle,
close,
open,
_getOpenSync,
_createAnimation,
_register,
_unregister,
_setOpen,
_setActiveMenu,
};
};
const menuController = /*@__PURE__*/ createMenuController();
const menuIosCss = "/*!@:host*/.sc-ion-menu-ios-h{--width:304px;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--background:var(--ion-background-color, #fff);left:0;right:0;top:0;bottom:0;display:none;position:absolute;contain:strict}/*!@:host(.show-menu)*/.show-menu.sc-ion-menu-ios-h{display:block}/*!@.menu-inner*/.menu-inner.sc-ion-menu-ios{left:0;right:auto;top:0;bottom:0;-webkit-transform:translate3d(-9999px, 0, 0);transform:translate3d(-9999px, 0, 0);display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);contain:strict}/*!@[dir=rtl] .menu-inner, :host-context([dir=rtl]) .menu-inner*/[dir=rtl].sc-ion-menu-ios .menu-inner.sc-ion-menu-ios,[dir=rtl].sc-ion-menu-ios-h .menu-inner.sc-ion-menu-ios,[dir=rtl] .sc-ion-menu-ios-h .menu-inner.sc-ion-menu-ios{left:unset;right:unset;left:auto;right:0}/*!@[dir=rtl] .menu-inner, :host-context([dir=rtl]) .menu-inner*/[dir=rtl].sc-ion-menu-ios .menu-inner.sc-ion-menu-ios,[dir=rtl].sc-ion-menu-ios-h .menu-inner.sc-ion-menu-ios,[dir=rtl] .sc-ion-menu-ios-h .menu-inner.sc-ion-menu-ios{-webkit-transform:translate3d(calc(-1 * -9999px), 0, 0);transform:translate3d(calc(-1 * -9999px), 0, 0)}/*!@:host(.menu-side-start) .menu-inner*/.menu-side-start.sc-ion-menu-ios-h .menu-inner.sc-ion-menu-ios{--ion-safe-area-right:0px;right:auto;left:0}/*!@:host(.menu-side-end) .menu-inner*/.menu-side-end.sc-ion-menu-ios-h .menu-inner.sc-ion-menu-ios{--ion-safe-area-left:0px;right:0;left:auto}/*!@ion-backdrop*/ion-backdrop.sc-ion-menu-ios{display:none;opacity:0.01;z-index:-1}@media (max-width: 340px){/*!@.menu-inner*/.menu-inner.sc-ion-menu-ios{--width:264px}}/*!@:host(.menu-type-reveal)*/.menu-type-reveal.sc-ion-menu-ios-h{z-index:0}/*!@:host(.menu-type-reveal.show-menu) .menu-inner*/.menu-type-reveal.show-menu.sc-ion-menu-ios-h .menu-inner.sc-ion-menu-ios{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}/*!@:host(.menu-type-overlay)*/.menu-type-overlay.sc-ion-menu-ios-h{z-index:1000}/*!@:host(.menu-type-overlay) .show-backdrop*/.menu-type-overlay.sc-ion-menu-ios-h .show-backdrop.sc-ion-menu-ios{display:block;cursor:pointer}/*!@:host(.menu-pane-visible)*/.menu-pane-visible.sc-ion-menu-ios-h{width:var(--width);min-width:var(--min-width);max-width:var(--max-width)}/*!@:host(.menu-pane-visible) .menu-inner*/.menu-pane-visible.sc-ion-menu-ios-h .menu-inner.sc-ion-menu-ios{left:0;right:0;width:auto;-webkit-transform:none !important;transform:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}/*!@:host(.menu-pane-visible) ion-backdrop*/.menu-pane-visible.sc-ion-menu-ios-h ion-backdrop.sc-ion-menu-ios{display:hidden !important}/*!@:host(.menu-type-push)*/.menu-type-push.sc-ion-menu-ios-h{z-index:1000}/*!@:host(.menu-type-push) .show-backdrop*/.menu-type-push.sc-ion-menu-ios-h .show-backdrop.sc-ion-menu-ios{display:block}";
const menuMdCss = "/*!@:host*/.sc-ion-menu-md-h{--width:304px;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--background:var(--ion-background-color, #fff);left:0;right:0;top:0;bottom:0;display:none;position:absolute;contain:strict}/*!@:host(.show-menu)*/.show-menu.sc-ion-menu-md-h{display:block}/*!@.menu-inner*/.menu-inner.sc-ion-menu-md{left:0;right:auto;top:0;bottom:0;-webkit-transform:translate3d(-9999px, 0, 0);transform:translate3d(-9999px, 0, 0);display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);contain:strict}/*!@[dir=rtl] .menu-inner, :host-context([dir=rtl]) .menu-inner*/[dir=rtl].sc-ion-menu-md .menu-inner.sc-ion-menu-md,[dir=rtl].sc-ion-menu-md-h .menu-inner.sc-ion-menu-md,[dir=rtl] .sc-ion-menu-md-h .menu-inner.sc-ion-menu-md{left:unset;right:unset;left:auto;right:0}/*!@[dir=rtl] .menu-inner, :host-context([dir=rtl]) .menu-inner*/[dir=rtl].sc-ion-menu-md .menu-inner.sc-ion-menu-md,[dir=rtl].sc-ion-menu-md-h .menu-inner.sc-ion-menu-md,[dir=rtl] .sc-ion-menu-md-h .menu-inner.sc-ion-menu-md{-webkit-transform:translate3d(calc(-1 * -9999px), 0, 0);transform:translate3d(calc(-1 * -9999px), 0, 0)}/*!@:host(.menu-side-start) .menu-inner*/.menu-side-start.sc-ion-menu-md-h .menu-inner.sc-ion-menu-md{--ion-safe-area-right:0px;right:auto;left:0}/*!@:host(.menu-side-end) .menu-inner*/.menu-side-end.sc-ion-menu-md-h .menu-inner.sc-ion-menu-md{--ion-safe-area-left:0px;right:0;left:auto}/*!@ion-backdrop*/ion-backdrop.sc-ion-menu-md{display:none;opacity:0.01;z-index:-1}@media (max-width: 340px){/*!@.menu-inner*/.menu-inner.sc-ion-menu-md{--width:264px}}/*!@:host(.menu-type-reveal)*/.menu-type-reveal.sc-ion-menu-md-h{z-index:0}/*!@:host(.menu-type-reveal.show-menu) .menu-inner*/.menu-type-reveal.show-menu.sc-ion-menu-md-h .menu-inner.sc-ion-menu-md{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}/*!@:host(.menu-type-overlay)*/.menu-type-overlay.sc-ion-menu-md-h{z-index:1000}/*!@:host(.menu-type-overlay) .show-backdrop*/.menu-type-overlay.sc-ion-menu-md-h .show-backdrop.sc-ion-menu-md{display:block;cursor:pointer}/*!@:host(.menu-pane-visible)*/.menu-pane-visible.sc-ion-menu-md-h{width:var(--width);min-width:var(--min-width);max-width:var(--max-width)}/*!@:host(.menu-pane-visible) .menu-inner*/.menu-pane-visible.sc-ion-menu-md-h .menu-inner.sc-ion-menu-md{left:0;right:0;width:auto;-webkit-transform:none !important;transform:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}/*!@:host(.menu-pane-visible) ion-backdrop*/.menu-pane-visible.sc-ion-menu-md-h ion-backdrop.sc-ion-menu-md{display:hidden !important}/*!@:host(.menu-type-overlay) .menu-inner*/.menu-type-overlay.sc-ion-menu-md-h .menu-inner.sc-ion-menu-md{-webkit-box-shadow:4px 0px 16px rgba(0, 0, 0, 0.18);box-shadow:4px 0px 16px rgba(0, 0, 0, 0.18)}";
const iosEasing = 'cubic-bezier(0.32,0.72,0,1)';
const mdEasing = 'cubic-bezier(0.0,0.0,0.2,1)';
const iosEasingReverse = 'cubic-bezier(1, 0, 0.68, 0.28)';
const mdEasingReverse = 'cubic-bezier(0.4, 0, 0.6, 1)';
/**
* @part container - The container for the menu content.
* @part backdrop - The backdrop that appears over the main content when the menu is open.
*/
class Menu {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionWillOpen = createEvent(this, "ionWillOpen", 7);
this.ionWillClose = createEvent(this, "ionWillClose", 7);
this.ionDidOpen = createEvent(this, "ionDidOpen", 7);
this.ionDidClose = createEvent(this, "ionDidClose", 7);
this.ionMenuChange = createEvent(this, "ionMenuChange", 7);
this.lastOnEnd = 0;
this.blocker = GESTURE_CONTROLLER.createBlocker({ disableScroll: true });
this.isAnimating = false;
this._isOpen = false;
this.isPaneVisible = false;
this.isEndSide = false;
/**
* If `true`, the menu is disabled.
*/
this.disabled = false;
/**
* Which side of the view the menu should be placed.
*/
this.side = 'start';
/**
* If `true`, swiping the menu is enabled.
*/
this.swipeGesture = true;
/**
* The edge threshold for dragging the menu open.
* If a drag/swipe happens over this value, the menu is not triggered.
*/
this.maxEdgeStart = 50;
}
typeChanged(type, oldType) {
const contentEl = this.contentEl;
if (contentEl) {
if (oldType !== undefined) {
contentEl.classList.remove(`menu-content-${oldType}`);
}
contentEl.classList.add(`menu-content-${type}`);
contentEl.removeAttribute('style');
}
if (this.menuInnerEl) {
// Remove effects of previous animations
this.menuInnerEl.removeAttribute('style');
}
this.animation = undefined;
}
disabledChanged() {
this.updateState();
this.ionMenuChange.emit({
disabled: this.disabled,
open: this._isOpen
});
}
sideChanged() {
this.isEndSide = isEndSide(this.side);
}
swipeGestureChanged() {
this.updateState();
}
async connectedCallback() {
if (this.type === undefined) {
this.type = config.get('menuType', 'overlay');
}
{
this.disabled = true;
return;
}
}
async componentDidLoad() {
this.ionMenuChange.emit({ disabled: this.disabled, open: this._isOpen });
this.updateState();
}
disconnectedCallback() {
this.blocker.destroy();
menuController._unregister(this);
if (this.animation) {
this.animation.destroy();
}
if (this.gesture) {
this.gesture.destroy();
this.gesture = undefined;
}
this.animation = undefined;
this.contentEl = this.backdropEl = this.menuInnerEl = undefined;
}
onSplitPaneChanged(ev) {
this.isPaneVisible = ev.detail.isPane(this.el);
this.updateState();
}
onBackdropClick(ev) {
if (this._isOpen && this.lastOnEnd < ev.timeStamp - 100) {
const shouldClose = (ev.composedPath)
? !ev.composedPath().includes(this.menuInnerEl)
: false;
if (shouldClose) {
ev.preventDefault();
ev.stopPropagation();
this.close();
}
}
}
/**
* Returns `true` is the menu is open.
*/
isOpen() {
return Promise.resolve(this._isOpen);
}
/**
* Returns `true` is the menu is active.
*
* A menu is active when it can be opened or closed, meaning it's enabled
* and it's not part of a `ion-split-pane`.
*/
isActive() {
return Promise.resolve(this._isActive());
}
/**
* Opens the menu. If the menu is already open or it can't be opened,
* it returns `false`.
*/
open(animated = true) {
return this.setOpen(true, animated);
}
/**
* Closes the menu. If the menu is already closed or it can't be closed,
* it returns `false`.
*/
close(animated = true) {
return this.setOpen(false, animated);
}
/**
* Toggles the menu. If the menu is already open, it will try to close, otherwise it will try to open it.
* If the operation can't be completed successfully, it returns `false`.
*/
toggle(animated = true) {
return this.setOpen(!this._isOpen, animated);
}
/**
* Opens or closes the button.
* If the operation can't be completed successfully, it returns `false`.
*/
setOpen(shouldOpen, animated = true) {
return menuController._setOpen(this, shouldOpen, animated);
}
async _setOpen(shouldOpen, animated = true) {
// If the menu is disabled or it is currently being animated, let's do nothing
if (!this._isActive() || this.isAnimating || shouldOpen === this._isOpen) {
return false;
}
this.beforeAnimation(shouldOpen);
await this.loadAnimation();
await this.startAnimation(shouldOpen, animated);
this.afterAnimation(shouldOpen);
return true;
}
async loadAnimation() {
// Menu swipe animation takes the menu's inner width as parameter,
// If `offsetWidth` changes, we need to create a new animation.
const width = this.menuInnerEl.offsetWidth;
if (width === this.width && this.animation !== undefined) {
return;
}
this.width = width;
// Destroy existing animation
if (this.animation) {
this.animation.destroy();
this.animation = undefined;
}
// Create new animation
this.animation = await menuController._createAnimation(this.type, this);
if (!config.getBoolean('animated', true)) {
this.animation.duration(0);
}
this.animation.fill('both');
}
async startAnimation(shouldOpen, animated) {
const isReversed = !shouldOpen;
const mode = getIonMode$1(this);
const easing = mode === 'ios' ? iosEasing : mdEasing;
const easingReverse = mode === 'ios' ? iosEasingReverse : mdEasingReverse;
const ani = this.animation
.direction((isReversed) ? 'reverse' : 'normal')
.easing((isReversed) ? easingReverse : easing)
.onFinish(() => {
if (ani.getDirection() === 'reverse') {
ani.direction('normal');
}
});
if (animated) {
await ani.play();
}
else {
ani.play({ sync: true });
}
}
_isActive() {
return !this.disabled && !this.isPaneVisible;
}
canSwipe() {
return this.swipeGesture && !this.isAnimating && this._isActive();
}
canStart(detail) {
// Do not allow swipe gesture if a modal is open
const isModalPresented = !!document.querySelector('ion-modal.show-modal');
if (isModalPresented || !this.canSwipe()) {
return false;
}
if (this._isOpen) {
return true;
// TODO error
}
else if (menuController._getOpenSync()) {
return false;
}
return checkEdgeSide(window, detail.currentX, this.isEndSide, this.maxEdgeStart);
}
onWillStart() {
this.beforeAnimation(!this._isOpen);
return this.loadAnimation();
}
onStart() {
if (!this.isAnimating || !this.animation) {
assert(false, 'isAnimating has to be true');
return;
}
// the cloned animation should not use an easing curve during seek
this.animation.progressStart(true, (this._isOpen) ? 1 : 0);
}
onMove(detail) {
if (!this.isAnimating || !this.animation) {
assert(false, 'isAnimating has to be true');
return;
}
const delta = computeDelta(detail.deltaX, this._isOpen, this.isEndSide);
const stepValue = delta / this.width;
this.animation.progressStep((this._isOpen) ? 1 - stepValue : stepValue);
}
onEnd(detail) {
if (!this.isAnimating || !this.animation) {
assert(false, 'isAnimating has to be true');
return;
}
const isOpen = this._isOpen;
const isEndSide = this.isEndSide;
const delta = computeDelta(detail.deltaX, isOpen, isEndSide);
const width = this.width;
const stepValue = delta / width;
const velocity = detail.velocityX;
const z = width / 2.0;
const shouldCompleteRight = velocity >= 0 && (velocity > 0.2 || detail.deltaX > z);
const shouldCompleteLeft = velocity <= 0 && (velocity < -0.2 || detail.deltaX < -z);
const shouldComplete = isOpen
? isEndSide ? shouldCompleteRight : shouldCompleteLeft
: isEndSide ? shouldCompleteLeft : shouldCompleteRight;
let shouldOpen = !isOpen && shouldComplete;
if (isOpen && !shouldComplete) {
shouldOpen = true;
}
this.lastOnEnd = detail.currentTime;
// Account for rounding errors in JS
let newStepValue = (shouldComplete) ? 0.001 : -0.001;
/**
* TODO: stepValue can sometimes return a negative
* value, but you can't have a negative time value
* for the cubic bezier curve (at least with web animations)
* Not sure if the negative step value is an error or not
*/
const adjustedStepValue = (stepValue < 0) ? 0.01 : stepValue;
/**
* Animation will be reversed here, so need to
* reverse the easing curve as well
*
* Additionally, we need to account for the time relative
* to the new easing curve, as `stepValue` is going to be given
* in terms of a linear curve.
*/
newStepValue += getTimeGivenProgression([0, 0], [0.4, 0], [0.6, 1], [1, 1], clamp(0, adjustedStepValue, 0.9999))[0] || 0;
const playTo = (this._isOpen) ? !shouldComplete : shouldComplete;
this.animation
.easing('cubic-bezier(0.4, 0.0, 0.6, 1)')
.onFinish(() => this.afterAnimation(shouldOpen), { oneTimeCallback: true })
.progressEnd((playTo) ? 1 : 0, (this._isOpen) ? 1 - newStepValue : newStepValue, 300);
}
beforeAnimation(shouldOpen) {
assert(!this.isAnimating, '_before() should not be called while animating');
// this places the menu into the correct location before it animates in
// this css class doesn't actually kick off any animations
this.el.classList.add(SHOW_MENU);
if (this.backdropEl) {
this.backdropEl.classList.add(SHOW_BACKDROP);
}
this.blocker.block();
this.isAnimating = true;
if (shouldOpen) {
this.ionWillOpen.emit();
}
else {
this.ionWillClose.emit();
}
}
afterAnimation(isOpen) {
assert(this.isAnimating, '_before() should be called while animating');
// keep opening/closing the menu disabled for a touch more yet
// only add listeners/css if it's enabled and isOpen
// and only remove listeners/css if it's not open
// emit opened/closed events
this._isOpen = isOpen;
this.isAnimating = false;
if (!this._isOpen) {
this.blocker.unblock();
}
if (isOpen) {
// add css class
if (this.contentEl) {
this.contentEl.classList.add(MENU_CONTENT_OPEN);
}
// emit open event
this.ionDidOpen.emit();
}
else {
// remove css classes
this.el.classList.remove(SHOW_MENU);
if (this.contentEl) {
this.contentEl.classList.remove(MENU_CONTENT_OPEN);
}
if (this.backdropEl) {
this.backdropEl.classList.remove(SHOW_BACKDROP);
}
if (this.animation) {
this.animation.stop();
}
// emit close event
this.ionDidClose.emit();
}
}
updateState() {
const isActive = this._isActive();
if (this.gesture) {
this.gesture.enable(isActive && this.swipeGesture);
}
// Close menu immediately
if (!isActive && this._isOpen) {
// close if this menu is open, and should not be enabled
this.forceClosing();
}
if (!this.disabled) {
menuController._setActiveMenu(this);
}
assert(!this.isAnimating, 'can not be animating');
}
forceClosing() {
assert(this._isOpen, 'menu cannot be closed');
this.isAnimating = true;
const ani = this.animation.direction('reverse');
ani.play({ sync: true });
this.afterAnimation(false);
}
render() {
const { isEndSide, type, disabled, isPaneVisible } = this;
const mode = getIonMode$1(this);
return (hAsync(Host, { role: "navigation", class: {
[mode]: true,
[`menu-type-${type}`]: true,
'menu-enabled': !disabled,
'menu-side-end': isEndSide,
'menu-side-start': !isEndSide,
'menu-pane-visible': isPaneVisible
} }, hAsync("div", { class: "menu-inner", part: "container", ref: el => this.menuInnerEl = el }, hAsync("slot", null)), hAsync("ion-backdrop", { ref: el => this.backdropEl = el, class: "menu-backdrop", tappable: false, stopPropagation: false, part: "backdrop" })));
}
get el() { return getElement(this); }
static get watchers() { return {
"type": ["typeChanged"],
"disabled": ["disabledChanged"],
"side": ["sideChanged"],
"swipeGesture": ["swipeGestureChanged"]
}; }
static get style() { return {
ios: menuIosCss,
md: menuMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-menu",
"$members$": {
"contentId": [513, "content-id"],
"menuId": [513, "menu-id"],
"type": [1025],
"disabled": [1028],
"side": [513],
"swipeGesture": [4, "swipe-gesture"],
"maxEdgeStart": [2, "max-edge-start"],
"isPaneVisible": [32],
"isEndSide": [32],
"isOpen": [64],
"isActive": [64],
"open": [64],
"close": [64],
"toggle": [64],
"setOpen": [64]
},
"$listeners$": [[16, "ionSplitPaneVisible", "onSplitPaneChanged"], [2, "click", "onBackdropClick"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": [["contentId", "content-id"], ["menuId", "menu-id"], ["side", "side"]]
}; }
}
const computeDelta = (deltaX, isOpen, isEndSide) => {
return Math.max(0, isOpen !== isEndSide ? -deltaX : deltaX);
};
const checkEdgeSide = (win, posX, isEndSide, maxEdgeStart) => {
if (isEndSide) {
return posX >= win.innerWidth - maxEdgeStart;
}
else {
return posX <= maxEdgeStart;
}
};
const SHOW_MENU = 'show-menu';
const SHOW_BACKDROP = 'show-backdrop';
const MENU_CONTENT_OPEN = 'menu-content-open';
// Given a menu, return whether or not the menu toggle should be visible
const updateVisibility = async (menu) => {
const menuEl = await menuController.get(menu);
return !!(menuEl && await menuEl.isActive());
};
const menuButtonIosCss = "/*!@:host*/.sc-ion-menu-button-ios-h{--background:transparent;--color-focused:currentColor;--border-radius:initial;--padding-top:0;--padding-bottom:0;color:var(--color);text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}/*!@.button-native*/.button-native.sc-ion-menu-button-ios{border-radius:var(--border-radius);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;border:0;outline:none;background:var(--background);line-height:1;cursor:pointer;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-menu-button-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.button-inner*/.button-inner.sc-ion-menu-button-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}/*!@ion-icon*/ion-icon.sc-ion-menu-button-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;pointer-events:none}/*!@:host(.menu-button-hidden)*/.menu-button-hidden.sc-ion-menu-button-ios-h{display:none}/*!@:host(.menu-button-disabled)*/.menu-button-disabled.sc-ion-menu-button-ios-h{cursor:default;opacity:0.5;pointer-events:none}/*!@:host(.ion-focused) .button-native*/.ion-focused.sc-ion-menu-button-ios-h .button-native.sc-ion-menu-button-ios{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-menu-button-ios-h .button-native.sc-ion-menu-button-ios::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}/*!@.button-native::after*/.button-native.sc-ion-menu-button-ios::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}@media (any-hover: hover){/*!@:host(:hover) .button-native*/.sc-ion-menu-button-ios-h:hover .button-native.sc-ion-menu-button-ios{color:var(--color-hover)}/*!@:host(:hover) .button-native::after*/.sc-ion-menu-button-ios-h:hover .button-native.sc-ion-menu-button-ios::after{background:var(--background-hover);opacity:var(--background-hover-opacity, 0)}}/*!@:host(.ion-color) .button-native*/.ion-color.sc-ion-menu-button-ios-h .button-native.sc-ion-menu-button-ios{color:var(--ion-color-base)}/*!@:host(.in-toolbar:not(.in-toolbar-color))*/.in-toolbar.sc-ion-menu-button-ios-h:not(.in-toolbar-color){color:var(--ion-toolbar-color, var(--color))}/*!@:host*/.sc-ion-menu-button-ios-h{--background-focused:currentColor;--background-focused-opacity:.1;--border-radius:4px;--color:var(--ion-color-primary, #3880ff);--padding-start:5px;--padding-end:5px;height:32px;font-size:31px}/*!@:host(.ion-activated)*/.ion-activated.sc-ion-menu-button-ios-h{opacity:0.4}@media (any-hover: hover){/*!@:host(:hover)*/.sc-ion-menu-button-ios-h:hover{opacity:0.6}}";
const menuButtonMdCss = "/*!@:host*/.sc-ion-menu-button-md-h{--background:transparent;--color-focused:currentColor;--border-radius:initial;--padding-top:0;--padding-bottom:0;color:var(--color);text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}/*!@.button-native*/.button-native.sc-ion-menu-button-md{border-radius:var(--border-radius);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;border:0;outline:none;background:var(--background);line-height:1;cursor:pointer;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-menu-button-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.button-inner*/.button-inner.sc-ion-menu-button-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}/*!@ion-icon*/ion-icon.sc-ion-menu-button-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;pointer-events:none}/*!@:host(.menu-button-hidden)*/.menu-button-hidden.sc-ion-menu-button-md-h{display:none}/*!@:host(.menu-button-disabled)*/.menu-button-disabled.sc-ion-menu-button-md-h{cursor:default;opacity:0.5;pointer-events:none}/*!@:host(.ion-focused) .button-native*/.ion-focused.sc-ion-menu-button-md-h .button-native.sc-ion-menu-button-md{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-menu-button-md-h .button-native.sc-ion-menu-button-md::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}/*!@.button-native::after*/.button-native.sc-ion-menu-button-md::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}@media (any-hover: hover){/*!@:host(:hover) .button-native*/.sc-ion-menu-button-md-h:hover .button-native.sc-ion-menu-button-md{color:var(--color-hover)}/*!@:host(:hover) .button-native::after*/.sc-ion-menu-button-md-h:hover .button-native.sc-ion-menu-button-md::after{background:var(--background-hover);opacity:var(--background-hover-opacity, 0)}}/*!@:host(.ion-color) .button-native*/.ion-color.sc-ion-menu-button-md-h .button-native.sc-ion-menu-button-md{color:var(--ion-color-base)}/*!@:host(.in-toolbar:not(.in-toolbar-color))*/.in-toolbar.sc-ion-menu-button-md-h:not(.in-toolbar-color){color:var(--ion-toolbar-color, var(--color))}/*!@:host*/.sc-ion-menu-button-md-h{--background-focused:currentColor;--background-focused-opacity:.12;--background-hover:currentColor;--background-hover-opacity:.04;--border-radius:50%;--color:initial;--padding-start:8px;--padding-end:8px;width:48px;height:48px;font-size:24px}/*!@:host(.ion-color.ion-focused)::after*/.ion-color.ion-focused.sc-ion-menu-button-md-h::after{background:var(--ion-color-base)}@media (any-hover: hover){/*!@:host(.ion-color:hover) .button-native::after*/.ion-color.sc-ion-menu-button-md-h:hover .button-native.sc-ion-menu-button-md::after{background:var(--ion-color-base)}}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part native - The native HTML button element that wraps all child elements.
* @part icon - The menu button icon (uses ion-icon).
*/
class MenuButton {
constructor(hostRef) {
registerInstance(this, hostRef);
this.inheritedAttributes = {};
this.visible = false;
/**
* If `true`, the user cannot interact with the menu button.
*/
this.disabled = false;
/**
* Automatically hides the menu button when the corresponding menu is not active
*/
this.autoHide = true;
/**
* The type of the button.
*/
this.type = 'button';
this.onClick = async () => {
return menuController.toggle(this.menu);
};
}
componentWillLoad() {
this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);
}
componentDidLoad() {
this.visibilityChanged();
}
async visibilityChanged() {
this.visible = await updateVisibility(this.menu);
}
render() {
const { color, disabled, inheritedAttributes } = this;
const mode = getIonMode$1(this);
const menuIcon = config.get('menuIcon', mode === 'ios' ? 'menu-outline' : 'menu-sharp');
const hidden = this.autoHide && !this.visible;
const attrs = {
type: this.type
};
const ariaLabel = inheritedAttributes['aria-label'] || 'menu';
return (hAsync(Host, { onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, "aria-hidden": hidden ? 'true' : null, class: createColorClasses$1(color, {
[mode]: true,
'button': true,
'menu-button-hidden': hidden,
'menu-button-disabled': disabled,
'in-toolbar': hostContext('ion-toolbar', this.el),
'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
'ion-activatable': true,
'ion-focusable': true
}) }, hAsync("button", Object.assign({}, attrs, { disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }), hAsync("span", { class: "button-inner" }, hAsync("slot", null, hAsync("ion-icon", { part: "icon", icon: menuIcon, mode: mode, lazy: false, "aria-hidden": "true" }))), mode === 'md' && hAsync("ion-ripple-effect", { type: "unbounded" }))));
}
get el() { return getElement(this); }
static get style() { return {
ios: menuButtonIosCss,
md: menuButtonMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-menu-button",
"$members$": {
"color": [513],
"disabled": [4],
"menu": [1],
"autoHide": [4, "auto-hide"],
"type": [1],
"visible": [32]
},
"$listeners$": [[16, "ionMenuChange", "visibilityChanged"], [16, "ionSplitPaneVisible", "visibilityChanged"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const menuToggleCss = "/*!@:host(.menu-toggle-hidden)*/.menu-toggle-hidden.sc-ion-menu-toggle-h{display:none}";
class MenuToggle {
constructor(hostRef) {
registerInstance(this, hostRef);
this.visible = false;
/**
* Automatically hides the content when the corresponding menu is not active.
*
* By default, it's `true`. Change it to `false` in order to
* keep `ion-menu-toggle` always visible regardless the state of the menu.
*/
this.autoHide = true;
this.onClick = () => {
return menuController.toggle(this.menu);
};
}
connectedCallback() {
this.visibilityChanged();
}
async visibilityChanged() {
this.visible = await updateVisibility(this.menu);
}
render() {
const mode = getIonMode$1(this);
const hidden = this.autoHide && !this.visible;
return (hAsync(Host, { onClick: this.onClick, "aria-hidden": hidden ? 'true' : null, class: {
[mode]: true,
'menu-toggle-hidden': hidden,
} }, hAsync("slot", null)));
}
static get style() { return menuToggleCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-menu-toggle",
"$members$": {
"menu": [1],
"autoHide": [4, "auto-hide"],
"visible": [32]
},
"$listeners$": [[16, "ionMenuChange", "visibilityChanged"], [16, "ionSplitPaneVisible", "visibilityChanged"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const attachComponent = async (delegate, container, component, cssClasses, componentProps) => {
if (delegate) {
return delegate.attachViewToDom(container, component, componentProps, cssClasses);
}
if (typeof component !== 'string' && !(component instanceof HTMLElement)) {
throw new Error('framework delegate is missing');
}
const el = (typeof component === 'string')
? container.ownerDocument && container.ownerDocument.createElement(component)
: component;
if (cssClasses) {
cssClasses.forEach(c => el.classList.add(c));
}
if (componentProps) {
Object.assign(el, componentProps);
}
container.appendChild(el);
await new Promise(resolve => componentOnReady(el, resolve));
return el;
};
const detachComponent = (delegate, element) => {
if (element) {
if (delegate) {
const container = element.parentElement;
return delegate.removeViewFromDom(container, element);
}
element.remove();
}
return Promise.resolve();
};
const LIFECYCLE_WILL_ENTER = 'ionViewWillEnter';
const LIFECYCLE_DID_ENTER = 'ionViewDidEnter';
const LIFECYCLE_WILL_LEAVE = 'ionViewWillLeave';
const LIFECYCLE_DID_LEAVE = 'ionViewDidLeave';
const LIFECYCLE_WILL_UNLOAD = 'ionViewWillUnload';
const iosTransitionAnimation$1 = () => Promise.resolve().then(function () { return ios_transition; });
const mdTransitionAnimation$1 = () => Promise.resolve().then(function () { return md_transition; });
const transition$2 = (opts) => {
return new Promise((resolve, reject) => {
writeTask(() => {
beforeTransition(opts);
runTransition(opts).then(result => {
if (result.animation) {
result.animation.destroy();
}
afterTransition(opts);
resolve(result);
}, error => {
afterTransition(opts);
reject(error);
});
});
});
};
const beforeTransition = (opts) => {
const enteringEl = opts.enteringEl;
const leavingEl = opts.leavingEl;
setZIndex(enteringEl, leavingEl, opts.direction);
if (opts.showGoBack) {
enteringEl.classList.add('can-go-back');
}
else {
enteringEl.classList.remove('can-go-back');
}
setPageHidden(enteringEl, false);
/**
* When transitioning, the page should not
* respond to click events. This resolves small
* issues like users double tapping the ion-back-button.
* These pointer events are removed in `afterTransition`.
*/
enteringEl.style.setProperty('pointer-events', 'none');
if (leavingEl) {
setPageHidden(leavingEl, false);
leavingEl.style.setProperty('pointer-events', 'none');
}
};
const runTransition = async (opts) => {
const animationBuilder = await getAnimationBuilder(opts);
const ani = (animationBuilder && Build.isBrowser)
? animation(animationBuilder, opts)
: noAnimation(opts); // fast path for no animation
return ani;
};
const afterTransition = (opts) => {
const enteringEl = opts.enteringEl;
const leavingEl = opts.leavingEl;
enteringEl.classList.remove('ion-page-invisible');
enteringEl.style.removeProperty('pointer-events');
if (leavingEl !== undefined) {
leavingEl.classList.remove('ion-page-invisible');
leavingEl.style.removeProperty('pointer-events');
}
};
const getAnimationBuilder = async (opts) => {
if (!opts.leavingEl || !opts.animated || opts.duration === 0) {
return undefined;
}
if (opts.animationBuilder) {
return opts.animationBuilder;
}
const getAnimation = (opts.mode === 'ios')
? (await iosTransitionAnimation$1()).iosTransitionAnimation
: (await mdTransitionAnimation$1()).mdTransitionAnimation;
return getAnimation;
};
const animation = async (animationBuilder, opts) => {
await waitForReady(opts, true);
const trans = animationBuilder(opts.baseEl, opts);
fireWillEvents(opts.enteringEl, opts.leavingEl);
const didComplete = await playTransition(trans, opts);
if (opts.progressCallback) {
opts.progressCallback(undefined);
}
if (didComplete) {
fireDidEvents(opts.enteringEl, opts.leavingEl);
}
return {
hasCompleted: didComplete,
animation: trans
};
};
const noAnimation = async (opts) => {
const enteringEl = opts.enteringEl;
const leavingEl = opts.leavingEl;
await waitForReady(opts, false);
fireWillEvents(enteringEl, leavingEl);
fireDidEvents(enteringEl, leavingEl);
return {
hasCompleted: true
};
};
const waitForReady = async (opts, defaultDeep) => {
const deep = opts.deepWait !== undefined ? opts.deepWait : defaultDeep;
const promises = deep ? [
deepReady(opts.enteringEl),
deepReady(opts.leavingEl),
] : [
shallowReady(opts.enteringEl),
shallowReady(opts.leavingEl),
];
await Promise.all(promises);
await notifyViewReady(opts.viewIsReady, opts.enteringEl);
};
const notifyViewReady = async (viewIsReady, enteringEl) => {
if (viewIsReady) {
await viewIsReady(enteringEl);
}
};
const playTransition = (trans, opts) => {
const progressCallback = opts.progressCallback;
const promise = new Promise(resolve => {
trans.onFinish((currentStep) => resolve(currentStep === 1));
});
// cool, let's do this, start the transition
if (progressCallback) {
// this is a swipe to go back, just get the transition progress ready
// kick off the swipe animation start
trans.progressStart(true);
progressCallback(trans);
}
else {
// only the top level transition should actually start "play"
// kick it off and let it play through
// ******** DOM WRITE ****************
trans.play();
}
// create a callback for when the animation is done
return promise;
};
const fireWillEvents = (enteringEl, leavingEl) => {
lifecycle(leavingEl, LIFECYCLE_WILL_LEAVE);
lifecycle(enteringEl, LIFECYCLE_WILL_ENTER);
};
const fireDidEvents = (enteringEl, leavingEl) => {
lifecycle(enteringEl, LIFECYCLE_DID_ENTER);
lifecycle(leavingEl, LIFECYCLE_DID_LEAVE);
};
const lifecycle = (el, eventName) => {
if (el) {
const ev = new CustomEvent(eventName, {
bubbles: false,
cancelable: false,
});
el.dispatchEvent(ev);
}
};
const shallowReady = (el) => {
if (el) {
return new Promise(resolve => componentOnReady(el, resolve));
}
return Promise.resolve();
};
const deepReady = async (el) => {
const element = el;
if (element) {
if (element.componentOnReady != null) {
const stencilEl = await element.componentOnReady();
if (stencilEl != null) {
return;
}
}
await Promise.all(Array.from(element.children).map(deepReady));
}
};
const setPageHidden = (el, hidden) => {
if (hidden) {
el.setAttribute('aria-hidden', 'true');
el.classList.add('ion-page-hidden');
}
else {
el.hidden = false;
el.removeAttribute('aria-hidden');
el.classList.remove('ion-page-hidden');
}
};
const setZIndex = (enteringEl, leavingEl, direction) => {
if (enteringEl !== undefined) {
enteringEl.style.zIndex = (direction === 'back')
? '99'
: '101';
}
if (leavingEl !== undefined) {
leavingEl.style.zIndex = '100';
}
};
const getIonPageElement = (element) => {
if (element.classList.contains('ion-page')) {
return element;
}
const ionPage = element.querySelector(':scope > .ion-page, :scope > ion-nav, :scope > ion-tabs');
if (ionPage) {
return ionPage;
}
// idk, return the original element so at least something animates and we don't have a null pointer
return element;
};
// Defaults for the card swipe animation
const SwipeToCloseDefaults = {
MIN_PRESENTING_SCALE: 0.93,
};
const createSwipeToCloseGesture = (el, animation, onDismiss) => {
const height = el.offsetHeight;
let isOpen = false;
const canStart = (detail) => {
const target = detail.event.target;
if (target === null ||
!target.closest) {
return true;
}
const contentOrFooter = target.closest('ion-content, ion-footer');
if (contentOrFooter === null) {
return true;
}
// Target is in the content or the footer so do not start the gesture.
// We could be more nuanced here and allow it for content that
// does not need to scroll.
return false;
};
const onStart = () => {
animation.progressStart(true, (isOpen) ? 1 : 0);
};
const onMove = (detail) => {
const step = clamp(0.0001, detail.deltaY / height, 0.9999);
animation.progressStep(step);
};
const onEnd = (detail) => {
const velocity = detail.velocityY;
const step = clamp(0.0001, detail.deltaY / height, 0.9999);
const threshold = (detail.deltaY + velocity * 1000) / height;
const shouldComplete = threshold >= 0.5;
let newStepValue = (shouldComplete) ? -0.001 : 0.001;
if (!shouldComplete) {
animation.easing('cubic-bezier(1, 0, 0.68, 0.28)');
newStepValue += getTimeGivenProgression([0, 0], [1, 0], [0.68, 0.28], [1, 1], step)[0];
}
else {
animation.easing('cubic-bezier(0.32, 0.72, 0, 1)');
newStepValue += getTimeGivenProgression([0, 0], [0.32, 0.72], [0, 1], [1, 1], step)[0];
}
const duration = (shouldComplete) ? computeDuration(step * height, velocity) : computeDuration((1 - step) * height, velocity);
isOpen = shouldComplete;
gesture.enable(false);
animation
.onFinish(() => {
if (!shouldComplete) {
gesture.enable(true);
}
})
.progressEnd((shouldComplete) ? 1 : 0, newStepValue, duration);
if (shouldComplete) {
onDismiss();
}
};
const gesture = createGesture({
el,
gestureName: 'modalSwipeToClose',
gesturePriority: 40,
direction: 'y',
threshold: 10,
canStart,
onStart,
onMove,
onEnd
});
return gesture;
};
const computeDuration = (remaining, velocity) => {
return clamp(400, remaining / Math.abs(velocity * 1.1), 500);
};
/**
* iOS Modal Enter Animation for the Card presentation style
*/
const iosEnterAnimation$3 = (baseEl, presentingEl) => {
const backdropAnimation = createAnimation()
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
.beforeStyles({
'pointer-events': 'none'
})
.afterClearStyles(['pointer-events']);
const wrapperAnimation = createAnimation()
.addElement(baseEl.querySelectorAll('.modal-wrapper, .modal-shadow'))
.beforeStyles({ 'opacity': 1 })
.fromTo('transform', 'translateY(100vh)', 'translateY(0vh)');
const baseAnimation = createAnimation()
.addElement(baseEl)
.easing('cubic-bezier(0.32,0.72,0,1)')
.duration(500)
.addAnimation(wrapperAnimation);
if (presentingEl) {
const isMobile = window.innerWidth < 768;
const hasCardModal = (presentingEl.tagName === 'ION-MODAL' && presentingEl.presentingElement !== undefined);
const presentingAnimation = createAnimation()
.beforeStyles({
'transform': 'translateY(0)',
'transform-origin': 'top center',
'overflow': 'hidden'
});
const bodyEl = document.body;
if (isMobile) {
/**
* Fallback for browsers that does not support `max()` (ex: Firefox)
* No need to worry about statusbar padding since engines like Gecko
* are not used as the engine for standlone Cordova/Capacitor apps
*/
const transformOffset = (!CSS.supports('width', 'max(0px, 1px)')) ? '30px' : 'max(30px, var(--ion-safe-area-top))';
const modalTransform = hasCardModal ? '-10px' : transformOffset;
const toPresentingScale = SwipeToCloseDefaults.MIN_PRESENTING_SCALE;
const finalTransform = `translateY(${modalTransform}) scale(${toPresentingScale})`;
presentingAnimation
.afterStyles({
'transform': finalTransform
})
.beforeAddWrite(() => bodyEl.style.setProperty('background-color', 'black'))
.addElement(presentingEl)
.keyframes([
{ offset: 0, filter: 'contrast(1)', transform: 'translateY(0px) scale(1)', borderRadius: '0px' },
{ offset: 1, filter: 'contrast(0.85)', transform: finalTransform, borderRadius: '10px 10px 0 0' }
]);
baseAnimation.addAnimation(presentingAnimation);
}
else {
baseAnimation.addAnimation(backdropAnimation);
if (!hasCardModal) {
wrapperAnimation.fromTo('opacity', '0', '1');
}
else {
const toPresentingScale = (hasCardModal) ? SwipeToCloseDefaults.MIN_PRESENTING_SCALE : 1;
const finalTransform = `translateY(-10px) scale(${toPresentingScale})`;
presentingAnimation
.afterStyles({
'transform': finalTransform
})
.addElement(presentingEl.querySelector('.modal-wrapper'))
.keyframes([
{ offset: 0, filter: 'contrast(1)', transform: 'translateY(0) scale(1)' },
{ offset: 1, filter: 'contrast(0.85)', transform: finalTransform }
]);
const shadowAnimation = createAnimation()
.afterStyles({
'transform': finalTransform
})
.addElement(presentingEl.querySelector('.modal-shadow'))
.keyframes([
{ offset: 0, opacity: '1', transform: 'translateY(0) scale(1)' },
{ offset: 1, opacity: '0', transform: finalTransform }
]);
baseAnimation.addAnimation([presentingAnimation, shadowAnimation]);
}
}
}
else {
baseAnimation.addAnimation(backdropAnimation);
}
return baseAnimation;
};
/**
* iOS Modal Leave Animation
*/
const iosLeaveAnimation$3 = (baseEl, presentingEl, duration = 500) => {
const backdropAnimation = createAnimation()
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 'var(--backdrop-opacity)', 0.0);
const wrapperAnimation = createAnimation()
.addElement(baseEl.querySelectorAll('.modal-wrapper, .modal-shadow'))
.beforeStyles({ 'opacity': 1 })
.fromTo('transform', 'translateY(0vh)', 'translateY(100vh)');
const baseAnimation = createAnimation()
.addElement(baseEl)
.easing('cubic-bezier(0.32,0.72,0,1)')
.duration(duration)
.addAnimation(wrapperAnimation);
if (presentingEl) {
const isMobile = window.innerWidth < 768;
const hasCardModal = (presentingEl.tagName === 'ION-MODAL' && presentingEl.presentingElement !== undefined);
const presentingAnimation = createAnimation()
.beforeClearStyles(['transform'])
.afterClearStyles(['transform'])
.onFinish(currentStep => {
// only reset background color if this is the last card-style modal
if (currentStep !== 1) {
return;
}
presentingEl.style.setProperty('overflow', '');
const numModals = Array.from(bodyEl.querySelectorAll('ion-modal')).filter(m => m.presentingElement !== undefined).length;
if (numModals <= 1) {
bodyEl.style.setProperty('background-color', '');
}
});
const bodyEl = document.body;
if (isMobile) {
const transformOffset = (!CSS.supports('width', 'max(0px, 1px)')) ? '30px' : 'max(30px, var(--ion-safe-area-top))';
const modalTransform = hasCardModal ? '-10px' : transformOffset;
const toPresentingScale = SwipeToCloseDefaults.MIN_PRESENTING_SCALE;
const finalTransform = `translateY(${modalTransform}) scale(${toPresentingScale})`;
presentingAnimation
.addElement(presentingEl)
.keyframes([
{ offset: 0, filter: 'contrast(0.85)', transform: finalTransform, borderRadius: '10px 10px 0 0' },
{ offset: 1, filter: 'contrast(1)', transform: 'translateY(0px) scale(1)', borderRadius: '0px' }
]);
baseAnimation.addAnimation(presentingAnimation);
}
else {
baseAnimation.addAnimation(backdropAnimation);
if (!hasCardModal) {
wrapperAnimation.fromTo('opacity', '1', '0');
}
else {
const toPresentingScale = (hasCardModal) ? SwipeToCloseDefaults.MIN_PRESENTING_SCALE : 1;
const finalTransform = `translateY(-10px) scale(${toPresentingScale})`;
presentingAnimation
.addElement(presentingEl.querySelector('.modal-wrapper'))
.afterStyles({
'transform': 'translate3d(0, 0, 0)'
})
.keyframes([
{ offset: 0, filter: 'contrast(0.85)', transform: finalTransform },
{ offset: 1, filter: 'contrast(1)', transform: 'translateY(0) scale(1)' }
]);
const shadowAnimation = createAnimation()
.addElement(presentingEl.querySelector('.modal-shadow'))
.afterStyles({
'transform': 'translateY(0) scale(1)'
})
.keyframes([
{ offset: 0, opacity: '0', transform: finalTransform },
{ offset: 1, opacity: '1', transform: 'translateY(0) scale(1)' }
]);
baseAnimation.addAnimation([presentingAnimation, shadowAnimation]);
}
}
}
else {
baseAnimation.addAnimation(backdropAnimation);
}
return baseAnimation;
};
/**
* Md Modal Enter Animation
*/
const mdEnterAnimation$2 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
.beforeStyles({
'pointer-events': 'none'
})
.afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.modal-wrapper'))
.keyframes([
{ offset: 0, opacity: 0.01, transform: 'translateY(40px)' },
{ offset: 1, opacity: 1, transform: 'translateY(0px)' }
]);
return baseAnimation
.addElement(baseEl)
.easing('cubic-bezier(0.36,0.66,0.04,1)')
.duration(280)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* Md Modal Leave Animation
*/
const mdLeaveAnimation$2 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
const wrapperEl = baseEl.querySelector('.modal-wrapper');
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 'var(--backdrop-opacity)', 0.0);
wrapperAnimation
.addElement(wrapperEl)
.keyframes([
{ offset: 0, opacity: 0.99, transform: 'translateY(0px)' },
{ offset: 1, opacity: 0, transform: 'translateY(40px)' }
]);
return baseAnimation
.addElement(baseEl)
.easing('cubic-bezier(0.47,0,0.745,0.715)')
.duration(200)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
const modalIosCss = ".sc-ion-modal-ios-h{--width:100%;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--overflow:hidden;--border-radius:0;--border-width:0;--border-style:none;--border-color:transparent;--background:var(--ion-background-color, #fff);--box-shadow:none;--backdrop-opacity:0;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;contain:strict}.overlay-hidden.sc-ion-modal-ios-h{display:none}.modal-wrapper.sc-ion-modal-ios,.modal-shadow.sc-ion-modal-ios{border-radius:var(--border-radius);width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:var(--overflow);z-index:10}.modal-shadow.sc-ion-modal-ios{position:absolute;background:transparent}@media only screen and (min-width: 768px) and (min-height: 600px){.sc-ion-modal-ios-h{--width:600px;--height:500px;--ion-safe-area-top:0px;--ion-safe-area-bottom:0px;--ion-safe-area-right:0px;--ion-safe-area-left:0px}}@media only screen and (min-width: 768px) and (min-height: 768px){.sc-ion-modal-ios-h{--width:600px;--height:600px}}.sc-ion-modal-ios-h:first-of-type{--backdrop-opacity:var(--ion-backdrop-opacity, 0.4)}@media only screen and (min-width: 768px) and (min-height: 600px){.sc-ion-modal-ios-h{--border-radius:10px}}.modal-wrapper.sc-ion-modal-ios{-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0)}@media screen and (max-width: 767px){@supports (width: max(0px, 1px)){.modal-card.sc-ion-modal-ios-h{--height:calc(100% - max(30px, var(--ion-safe-area-top)) - 10px)}}@supports not (width: max(0px, 1px)){.modal-card.sc-ion-modal-ios-h{--height:calc(100% - 40px)}}.modal-card.sc-ion-modal-ios-h .modal-wrapper.sc-ion-modal-ios{border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:0;border-bottom-left-radius:0}[dir=rtl].sc-ion-modal-ios-h -no-combinator.modal-card.sc-ion-modal-ios-h .modal-wrapper.sc-ion-modal-ios,[dir=rtl] .sc-ion-modal-ios-h -no-combinator.modal-card.sc-ion-modal-ios-h .modal-wrapper.sc-ion-modal-ios,[dir=rtl].modal-card.sc-ion-modal-ios-h .modal-wrapper.sc-ion-modal-ios,[dir=rtl] .modal-card.sc-ion-modal-ios-h .modal-wrapper.sc-ion-modal-ios{border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:0;border-bottom-left-radius:0}.modal-card.sc-ion-modal-ios-h{--backdrop-opacity:0;--width:100%;-ms-flex-align:end;align-items:flex-end}.modal-card.sc-ion-modal-ios-h .modal-shadow.sc-ion-modal-ios{display:none}.modal-card.sc-ion-modal-ios-h ion-backdrop.sc-ion-modal-ios{pointer-events:none}}@media screen and (min-width: 768px){.modal-card.sc-ion-modal-ios-h{--width:calc(100% - 120px);--height:calc(100% - (120px + var(--ion-safe-area-top) + var(--ion-safe-area-bottom)));--max-width:720px;--max-height:1000px}.modal-card.sc-ion-modal-ios-h{--backdrop-opacity:0;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out}.modal-card.sc-ion-modal-ios-h:first-of-type{--backdrop-opacity:0.18}.modal-card.sc-ion-modal-ios-h .modal-shadow.sc-ion-modal-ios{-webkit-box-shadow:0px 0px 30px 10px rgba(0, 0, 0, 0.1);box-shadow:0px 0px 30px 10px rgba(0, 0, 0, 0.1)}}";
const modalMdCss = ".sc-ion-modal-md-h{--width:100%;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--overflow:hidden;--border-radius:0;--border-width:0;--border-style:none;--border-color:transparent;--background:var(--ion-background-color, #fff);--box-shadow:none;--backdrop-opacity:0;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;contain:strict}.overlay-hidden.sc-ion-modal-md-h{display:none}.modal-wrapper.sc-ion-modal-md,.modal-shadow.sc-ion-modal-md{border-radius:var(--border-radius);width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:var(--overflow);z-index:10}.modal-shadow.sc-ion-modal-md{position:absolute;background:transparent}@media only screen and (min-width: 768px) and (min-height: 600px){.sc-ion-modal-md-h{--width:600px;--height:500px;--ion-safe-area-top:0px;--ion-safe-area-bottom:0px;--ion-safe-area-right:0px;--ion-safe-area-left:0px}}@media only screen and (min-width: 768px) and (min-height: 768px){.sc-ion-modal-md-h{--width:600px;--height:600px}}.sc-ion-modal-md-h:first-of-type{--backdrop-opacity:var(--ion-backdrop-opacity, 0.32)}@media only screen and (min-width: 768px) and (min-height: 600px){.sc-ion-modal-md-h{--border-radius:2px}.sc-ion-modal-md-h:first-of-type{--box-shadow:0 28px 48px rgba(0, 0, 0, 0.4)}}.modal-wrapper.sc-ion-modal-md{-webkit-transform:translate3d(0, 40px, 0);transform:translate3d(0, 40px, 0);opacity:0.01}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Modal {
constructor(hostRef) {
registerInstance(this, hostRef);
this.didPresent = createEvent(this, "ionModalDidPresent", 7);
this.willPresent = createEvent(this, "ionModalWillPresent", 7);
this.willDismiss = createEvent(this, "ionModalWillDismiss", 7);
this.didDismiss = createEvent(this, "ionModalDidDismiss", 7);
// Whether or not modal is being dismissed via gesture
this.gestureAnimationDismissing = false;
this.presented = false;
/**
* If `true`, the keyboard will be automatically dismissed when the overlay is presented.
*/
this.keyboardClose = true;
/**
* If `true`, the modal will be dismissed when the backdrop is clicked.
*/
this.backdropDismiss = true;
/**
* If `true`, a backdrop will be displayed behind the modal.
*/
this.showBackdrop = true;
/**
* If `true`, the modal will animate.
*/
this.animated = true;
/**
* If `true`, the modal can be swiped to dismiss. Only applies in iOS mode.
*/
this.swipeToClose = false;
this.onBackdropTap = () => {
this.dismiss(undefined, BACKDROP);
};
this.onDismiss = (ev) => {
ev.stopPropagation();
ev.preventDefault();
this.dismiss();
};
this.onLifecycle = (modalEvent) => {
const el = this.usersElement;
const name = LIFECYCLE_MAP$1[modalEvent.type];
if (el && name) {
const ev = new CustomEvent(name, {
bubbles: false,
cancelable: false,
detail: modalEvent.detail
});
el.dispatchEvent(ev);
}
};
}
swipeToCloseChanged(enable) {
if (this.gesture) {
this.gesture.enable(enable);
}
else if (enable) {
this.initSwipeToClose();
}
}
connectedCallback() {
prepareOverlay(this.el);
}
/**
* Present the modal overlay after it has been created.
*/
async present() {
if (this.presented) {
return;
}
const container = this.el.querySelector(`.modal-wrapper`);
if (!container) {
throw new Error('container is undefined');
}
const componentProps = Object.assign(Object.assign({}, this.componentProps), { modal: this.el });
this.usersElement = await attachComponent(this.delegate, container, this.component, ['ion-page'], componentProps);
await deepReady(this.usersElement);
writeTask(() => this.el.classList.add('show-modal'));
await present(this, 'modalEnter', iosEnterAnimation$3, mdEnterAnimation$2, this.presentingElement);
if (this.swipeToClose) {
this.initSwipeToClose();
}
}
initSwipeToClose() {
if (getIonMode$1(this) !== 'ios') {
return;
}
// All of the elements needed for the swipe gesture
// should be in the DOM and referenced by now, except
// for the presenting el
const animationBuilder = this.leaveAnimation || config.get('modalLeave', iosLeaveAnimation$3);
const ani = this.animation = animationBuilder(this.el, this.presentingElement);
this.gesture = createSwipeToCloseGesture(this.el, ani, () => {
/**
* While the gesture animation is finishing
* it is possible for a user to tap the backdrop.
* This would result in the dismiss animation
* being played again. Typically this is avoided
* by setting `presented = false` on the overlay
* component; however, we cannot do that here as
* that would prevent the element from being
* removed from the DOM.
*/
this.gestureAnimationDismissing = true;
this.animation.onFinish(async () => {
await this.dismiss(undefined, 'gesture');
this.gestureAnimationDismissing = false;
});
});
this.gesture.enable(true);
}
/**
* Dismiss the modal overlay after it has been presented.
*
* @param data Any data to emit in the dismiss events.
* @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.
*/
async dismiss(data, role) {
if (this.gestureAnimationDismissing && role !== 'gesture') {
return false;
}
const enteringAnimation = activeAnimations.get(this) || [];
const dismissed = await dismiss(this, data, role, 'modalLeave', iosLeaveAnimation$3, mdLeaveAnimation$2, this.presentingElement);
if (dismissed) {
await detachComponent(this.delegate, this.usersElement);
if (this.animation) {
this.animation.destroy();
}
enteringAnimation.forEach(ani => ani.destroy());
}
this.animation = undefined;
return dismissed;
}
/**
* Returns a promise that resolves when the modal did dismiss.
*/
onDidDismiss() {
return eventMethod(this.el, 'ionModalDidDismiss');
}
/**
* Returns a promise that resolves when the modal will dismiss.
*/
onWillDismiss() {
return eventMethod(this.el, 'ionModalWillDismiss');
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { "no-router": true, "aria-modal": "true", tabindex: "-1", class: Object.assign({ [mode]: true, [`modal-card`]: this.presentingElement !== undefined && mode === 'ios' }, getClassMap(this.cssClass)), style: {
zIndex: `${20000 + this.overlayIndex}`,
}, onIonBackdropTap: this.onBackdropTap, onIonDismiss: this.onDismiss, onIonModalDidPresent: this.onLifecycle, onIonModalWillPresent: this.onLifecycle, onIonModalWillDismiss: this.onLifecycle, onIonModalDidDismiss: this.onLifecycle }, hAsync("ion-backdrop", { visible: this.showBackdrop, tappable: this.backdropDismiss }), mode === 'ios' && hAsync("div", { class: "modal-shadow" }), hAsync("div", { tabindex: "0" }), hAsync("div", { role: "dialog", class: "modal-wrapper ion-overlay-wrapper" }), hAsync("div", { tabindex: "0" })));
}
get el() { return getElement(this); }
static get watchers() { return {
"swipeToClose": ["swipeToCloseChanged"]
}; }
static get style() { return {
ios: modalIosCss,
md: modalMdCss
}; }
static get cmpMeta() { return {
"$flags$": 34,
"$tagName$": "ion-modal",
"$members$": {
"overlayIndex": [2, "overlay-index"],
"delegate": [16],
"keyboardClose": [4, "keyboard-close"],
"enterAnimation": [16],
"leaveAnimation": [16],
"component": [1],
"componentProps": [16],
"cssClass": [1, "css-class"],
"backdropDismiss": [4, "backdrop-dismiss"],
"showBackdrop": [4, "show-backdrop"],
"animated": [4],
"swipeToClose": [4, "swipe-to-close"],
"presentingElement": [16],
"present": [64],
"dismiss": [64],
"onDidDismiss": [64],
"onWillDismiss": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const LIFECYCLE_MAP$1 = {
'ionModalDidPresent': 'ionViewDidEnter',
'ionModalWillPresent': 'ionViewWillEnter',
'ionModalWillDismiss': 'ionViewWillLeave',
'ionModalDidDismiss': 'ionViewDidLeave',
};
const VIEW_STATE_NEW = 1;
const VIEW_STATE_ATTACHED = 2;
const VIEW_STATE_DESTROYED = 3;
class ViewController {
constructor(component, params) {
this.component = component;
this.params = params;
this.state = VIEW_STATE_NEW;
}
async init(container) {
this.state = VIEW_STATE_ATTACHED;
if (!this.element) {
const component = this.component;
this.element = await attachComponent(this.delegate, container, component, ['ion-page', 'ion-page-invisible'], this.params);
}
}
/**
* DOM WRITE
*/
_destroy() {
assert(this.state !== VIEW_STATE_DESTROYED, 'view state must be ATTACHED');
const element = this.element;
if (element) {
if (this.delegate) {
this.delegate.removeViewFromDom(element.parentElement, element);
}
else {
element.remove();
}
}
this.nav = undefined;
this.state = VIEW_STATE_DESTROYED;
}
}
const matches = (view, id, params) => {
if (!view) {
return false;
}
if (view.component !== id) {
return false;
}
const currentParams = view.params;
if (currentParams === params) {
return true;
}
if (!currentParams && !params) {
return true;
}
if (!currentParams || !params) {
return false;
}
const keysA = Object.keys(currentParams);
const keysB = Object.keys(params);
if (keysA.length !== keysB.length) {
return false;
}
// Test for A's keys different from B.
for (const key of keysA) {
if (currentParams[key] !== params[key]) {
return false;
}
}
return true;
};
const convertToView = (page, params) => {
if (!page) {
return null;
}
if (page instanceof ViewController) {
return page;
}
return new ViewController(page, params);
};
const convertToViews = (pages) => {
return pages.map(page => {
if (page instanceof ViewController) {
return page;
}
if ('component' in page) {
/**
* TODO Ionic 6:
* Consider switching to just using `undefined` here
* as well as on the public interfaces and on
* `NavComponentWithProps`. Previously `pages` was
* of type `any[]` so TypeScript did not catch this.
*/
return convertToView(page.component, (page.componentProps === null) ? undefined : page.componentProps);
}
return convertToView(page, undefined);
}).filter(v => v !== null);
};
const navCss = "/*!@:host*/.sc-ion-nav-h{left:0;right:0;top:0;bottom:0;position:absolute;contain:layout size style;overflow:hidden;z-index:0}";
class Nav {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionNavWillLoad = createEvent(this, "ionNavWillLoad", 7);
this.ionNavWillChange = createEvent(this, "ionNavWillChange", 3);
this.ionNavDidChange = createEvent(this, "ionNavDidChange", 3);
this.transInstr = [];
this.animationEnabled = true;
this.useRouter = false;
this.isTransitioning = false;
this.destroyed = false;
this.views = [];
/**
* If `true`, the nav should animate the transition of components.
*/
this.animated = true;
}
swipeGestureChanged() {
if (this.gesture) {
this.gesture.enable(this.swipeGesture === true);
}
}
rootChanged() {
if (this.root !== undefined) {
if (!this.useRouter) {
this.setRoot(this.root, this.rootParams);
}
}
}
componentWillLoad() {
this.useRouter =
!!document.querySelector('ion-router') &&
!this.el.closest('[no-router]');
if (this.swipeGesture === undefined) {
const mode = getIonMode$1(this);
this.swipeGesture = config.getBoolean('swipeBackEnabled', mode === 'ios');
}
this.ionNavWillLoad.emit();
}
async componentDidLoad() {
this.rootChanged();
this.gesture = (await Promise.resolve().then(function () { return swipeBack; })).createSwipeBackGesture(this.el, this.canStart.bind(this), this.onStart.bind(this), this.onMove.bind(this), this.onEnd.bind(this));
this.swipeGestureChanged();
}
disconnectedCallback() {
for (const view of this.views) {
lifecycle(view.element, LIFECYCLE_WILL_UNLOAD);
view._destroy();
}
if (this.gesture) {
this.gesture.destroy();
this.gesture = undefined;
}
// release swipe back gesture and transition
this.transInstr.length = this.views.length = 0;
this.destroyed = true;
}
/**
* Push a new component onto the current navigation stack. Pass any additional
* information along as an object. This additional information is accessible
* through NavParams.
*
* @param component The component to push onto the navigation stack.
* @param componentProps Any properties of the component.
* @param opts The navigation options.
* @param done The transition complete function.
*/
push(component, componentProps, opts, done) {
return this.queueTrns({
insertStart: -1,
insertViews: [{ component, componentProps }],
opts
}, done);
}
/**
* Inserts a component into the navigation stack at the specified index.
* This is useful to add a component at any point in the navigation stack.
*
* @param insertIndex The index to insert the component at in the stack.
* @param component The component to insert into the navigation stack.
* @param componentProps Any properties of the component.
* @param opts The navigation options.
* @param done The transition complete function.
*/
insert(insertIndex, component, componentProps, opts, done) {
return this.queueTrns({
insertStart: insertIndex,
insertViews: [{ component, componentProps }],
opts
}, done);
}
/**
* Inserts an array of components into the navigation stack at the specified index.
* The last component in the array will become instantiated as a view, and animate
* in to become the active view.
*
* @param insertIndex The index to insert the components at in the stack.
* @param insertComponents The components to insert into the navigation stack.
* @param opts The navigation options.
* @param done The transition complete function.
*/
insertPages(insertIndex, insertComponents, opts, done) {
return this.queueTrns({
insertStart: insertIndex,
insertViews: insertComponents,
opts
}, done);
}
/**
* Pop a component off of the navigation stack. Navigates back from the current
* component.
*
* @param opts The navigation options.
* @param done The transition complete function.
*/
pop(opts, done) {
return this.queueTrns({
removeStart: -1,
removeCount: 1,
opts
}, done);
}
/**
* Pop to a specific index in the navigation stack.
*
* @param indexOrViewCtrl The index or view controller to pop to.
* @param opts The navigation options.
* @param done The transition complete function.
*/
popTo(indexOrViewCtrl, opts, done) {
const tiConfig = {
removeStart: -1,
removeCount: -1,
opts
};
if (typeof indexOrViewCtrl === 'object' && indexOrViewCtrl.component) {
tiConfig.removeView = indexOrViewCtrl;
tiConfig.removeStart = 1;
}
else if (typeof indexOrViewCtrl === 'number') {
tiConfig.removeStart = indexOrViewCtrl + 1;
}
return this.queueTrns(tiConfig, done);
}
/**
* Navigate back to the root of the stack, no matter how far back that is.
*
* @param opts The navigation options.
* @param done The transition complete function.
*/
popToRoot(opts, done) {
return this.queueTrns({
removeStart: 1,
removeCount: -1,
opts
}, done);
}
/**
* Removes a component from the navigation stack at the specified index.
*
* @param startIndex The number to begin removal at.
* @param removeCount The number of components to remove.
* @param opts The navigation options.
* @param done The transition complete function.
*/
removeIndex(startIndex, removeCount = 1, opts, done) {
return this.queueTrns({
removeStart: startIndex,
removeCount,
opts
}, done);
}
/**
* Set the root for the current navigation stack to a component.
*
* @param component The component to set as the root of the navigation stack.
* @param componentProps Any properties of the component.
* @param opts The navigation options.
* @param done The transition complete function.
*/
setRoot(component, componentProps, opts, done) {
return this.setPages([{ component, componentProps }], opts, done);
}
/**
* Set the views of the current navigation stack and navigate to the last view.
* By default animations are disabled, but they can be enabled by passing options
* to the navigation controller. Navigation parameters can also be passed to the
* individual pages in the array.
*
* @param views The list of views to set as the navigation stack.
* @param opts The navigation options.
* @param done The transition complete function.
*/
setPages(views, opts, done) {
if (opts == null) {
opts = {};
}
// if animation wasn't set to true then default it to NOT animate
if (opts.animated !== true) {
opts.animated = false;
}
return this.queueTrns({
insertStart: 0,
insertViews: views,
removeStart: 0,
removeCount: -1,
opts
}, done);
}
/** @internal */
setRouteId(id, params, direction, animation) {
const active = this.getActiveSync();
if (matches(active, id, params)) {
return Promise.resolve({
changed: false,
element: active.element
});
}
let resolve;
const promise = new Promise(r => (resolve = r));
let finish;
const commonOpts = {
updateURL: false,
viewIsReady: enteringEl => {
let mark;
const p = new Promise(r => (mark = r));
resolve({
changed: true,
element: enteringEl,
markVisible: async () => {
mark();
await finish;
}
});
return p;
}
};
if (direction === 'root') {
finish = this.setRoot(id, params, commonOpts);
}
else {
const viewController = this.views.find(v => matches(v, id, params));
if (viewController) {
finish = this.popTo(viewController, Object.assign(Object.assign({}, commonOpts), { direction: 'back', animationBuilder: animation }));
}
else if (direction === 'forward') {
finish = this.push(id, params, Object.assign(Object.assign({}, commonOpts), { animationBuilder: animation }));
}
else if (direction === 'back') {
finish = this.setRoot(id, params, Object.assign(Object.assign({}, commonOpts), { direction: 'back', animated: true, animationBuilder: animation }));
}
}
return promise;
}
/** @internal */
async getRouteId() {
const active = this.getActiveSync();
return active
? {
id: active.element.tagName,
params: active.params,
element: active.element
}
: undefined;
}
/**
* Get the active view.
*/
getActive() {
return Promise.resolve(this.getActiveSync());
}
/**
* Get the view at the specified index.
*
* @param index The index of the view.
*/
getByIndex(index) {
return Promise.resolve(this.views[index]);
}
/**
* Returns `true` if the current view can go back.
*
* @param view The view to check.
*/
canGoBack(view) {
return Promise.resolve(this.canGoBackSync(view));
}
/**
* Get the previous view.
*
* @param view The view to get.
*/
getPrevious(view) {
return Promise.resolve(this.getPreviousSync(view));
}
getLength() {
return this.views.length;
}
getActiveSync() {
return this.views[this.views.length - 1];
}
canGoBackSync(view = this.getActiveSync()) {
return !!(view && this.getPreviousSync(view));
}
getPreviousSync(view = this.getActiveSync()) {
if (!view) {
return undefined;
}
const views = this.views;
const index = views.indexOf(view);
return index > 0 ? views[index - 1] : undefined;
}
// _queueTrns() adds a navigation stack change to the queue and schedules it to run:
// 1. _nextTrns(): consumes the next transition in the queue
// 2. _viewInit(): initializes enteringView if required
// 3. _viewTest(): ensures canLeave/canEnter Returns `true`, so the operation can continue
// 4. _postViewInit(): add/remove the views from the navigation stack
// 5. _transitionInit(): initializes the visual transition if required and schedules it to run
// 6. _viewAttachToDOM(): attaches the enteringView to the DOM
// 7. _transitionStart(): called once the transition actually starts, it initializes the Animation underneath.
// 8. _transitionFinish(): called once the transition finishes
// 9. _cleanup(): syncs the navigation internal state with the DOM. For example it removes the pages from the DOM or hides/show them.
async queueTrns(ti, done) {
if (this.isTransitioning && ti.opts != null && ti.opts.skipIfBusy) {
return Promise.resolve(false);
}
const promise = new Promise((resolve, reject) => {
ti.resolve = resolve;
ti.reject = reject;
});
ti.done = done;
/**
* If using router, check to see if navigation hooks
* will allow us to perform this transition. This
* is required in order for hooks to work with
* the ion-back-button or swipe to go back.
*/
if (ti.opts && ti.opts.updateURL !== false && this.useRouter) {
const router = document.querySelector('ion-router');
if (router) {
const canTransition = await router.canTransition();
if (canTransition === false) {
return Promise.resolve(false);
}
else if (typeof canTransition === 'string') {
router.push(canTransition, ti.opts.direction || 'back');
return Promise.resolve(false);
}
}
}
// Normalize empty
if (ti.insertViews && ti.insertViews.length === 0) {
ti.insertViews = undefined;
}
// Enqueue transition instruction
this.transInstr.push(ti);
// if there isn't a transition already happening
// then this will kick off this transition
this.nextTrns();
return promise;
}
success(result, ti) {
if (this.destroyed) {
this.fireError('nav controller was destroyed', ti);
return;
}
if (ti.done) {
ti.done(result.hasCompleted, result.requiresTransition, result.enteringView, result.leavingView, result.direction);
}
ti.resolve(result.hasCompleted);
if (ti.opts.updateURL !== false && this.useRouter) {
const router = document.querySelector('ion-router');
if (router) {
const direction = result.direction === 'back' ? 'back' : 'forward';
router.navChanged(direction);
}
}
}
failed(rejectReason, ti) {
if (this.destroyed) {
this.fireError('nav controller was destroyed', ti);
return;
}
this.transInstr.length = 0;
this.fireError(rejectReason, ti);
}
fireError(rejectReason, ti) {
if (ti.done) {
ti.done(false, false, rejectReason);
}
if (ti.reject && !this.destroyed) {
ti.reject(rejectReason);
}
else {
ti.resolve(false);
}
}
nextTrns() {
// this is the framework's bread 'n butta function
// only one transition is allowed at any given time
if (this.isTransitioning) {
return false;
}
// there is no transition happening right now
// get the next instruction
const ti = this.transInstr.shift();
if (!ti) {
return false;
}
this.runTransition(ti);
return true;
}
async runTransition(ti) {
try {
// set that this nav is actively transitioning
this.ionNavWillChange.emit();
this.isTransitioning = true;
this.prepareTI(ti);
const leavingView = this.getActiveSync();
const enteringView = this.getEnteringView(ti, leavingView);
if (!leavingView && !enteringView) {
throw new Error('no views in the stack to be removed');
}
if (enteringView && enteringView.state === VIEW_STATE_NEW) {
await enteringView.init(this.el);
}
this.postViewInit(enteringView, leavingView, ti);
// Needs transition?
const requiresTransition = (ti.enteringRequiresTransition || ti.leavingRequiresTransition) &&
enteringView !== leavingView;
if (requiresTransition && ti.opts && leavingView) {
const isBackDirection = ti.opts.direction === 'back';
/**
* If heading back, use the entering page's animation
* unless otherwise specified by the developer.
*/
if (isBackDirection) {
ti.opts.animationBuilder = ti.opts.animationBuilder || (enteringView && enteringView.animationBuilder);
}
leavingView.animationBuilder = ti.opts.animationBuilder;
}
const result = requiresTransition
? await this.transition(enteringView, leavingView, ti)
: {
// transition is not required, so we are already done!
// they're inserting/removing the views somewhere in the middle or
// beginning, so visually nothing needs to animate/transition
// resolve immediately because there's no animation that's happening
hasCompleted: true,
requiresTransition: false
};
this.success(result, ti);
this.ionNavDidChange.emit();
}
catch (rejectReason) {
this.failed(rejectReason, ti);
}
this.isTransitioning = false;
this.nextTrns();
}
prepareTI(ti) {
const viewsLength = this.views.length;
ti.opts = ti.opts || {};
if (ti.opts.delegate === undefined) {
ti.opts.delegate = this.delegate;
}
if (ti.removeView !== undefined) {
assert(ti.removeStart !== undefined, 'removeView needs removeStart');
assert(ti.removeCount !== undefined, 'removeView needs removeCount');
const index = this.views.indexOf(ti.removeView);
if (index < 0) {
throw new Error('removeView was not found');
}
ti.removeStart += index;
}
if (ti.removeStart !== undefined) {
if (ti.removeStart < 0) {
ti.removeStart = viewsLength - 1;
}
if (ti.removeCount < 0) {
ti.removeCount = viewsLength - ti.removeStart;
}
ti.leavingRequiresTransition =
ti.removeCount > 0 && ti.removeStart + ti.removeCount === viewsLength;
}
if (ti.insertViews) {
// allow -1 to be passed in to auto push it on the end
// and clean up the index if it's larger then the size of the stack
if (ti.insertStart < 0 || ti.insertStart > viewsLength) {
ti.insertStart = viewsLength;
}
ti.enteringRequiresTransition = ti.insertStart === viewsLength;
}
const insertViews = ti.insertViews;
if (!insertViews) {
return;
}
assert(insertViews.length > 0, 'length can not be zero');
const viewControllers = convertToViews(insertViews);
if (viewControllers.length === 0) {
throw new Error('invalid views to insert');
}
// Check all the inserted view are correct
for (const view of viewControllers) {
view.delegate = ti.opts.delegate;
const nav = view.nav;
if (nav && nav !== this) {
throw new Error('inserted view was already inserted');
}
if (view.state === VIEW_STATE_DESTROYED) {
throw new Error('inserted view was already destroyed');
}
}
ti.insertViews = viewControllers;
}
getEnteringView(ti, leavingView) {
const insertViews = ti.insertViews;
if (insertViews !== undefined) {
// grab the very last view of the views to be inserted
// and initialize it as the new entering view
return insertViews[insertViews.length - 1];
}
const removeStart = ti.removeStart;
if (removeStart !== undefined) {
const views = this.views;
const removeEnd = removeStart + ti.removeCount;
for (let i = views.length - 1; i >= 0; i--) {
const view = views[i];
if ((i < removeStart || i >= removeEnd) && view !== leavingView) {
return view;
}
}
}
return undefined;
}
postViewInit(enteringView, leavingView, ti) {
assert(leavingView || enteringView, 'Both leavingView and enteringView are null');
assert(ti.resolve, 'resolve must be valid');
assert(ti.reject, 'reject must be valid');
const opts = ti.opts;
const insertViews = ti.insertViews;
const removeStart = ti.removeStart;
const removeCount = ti.removeCount;
let destroyQueue;
// there are views to remove
if (removeStart !== undefined && removeCount !== undefined) {
assert(removeStart >= 0, 'removeStart can not be negative');
assert(removeCount >= 0, 'removeCount can not be negative');
destroyQueue = [];
for (let i = 0; i < removeCount; i++) {
const view = this.views[i + removeStart];
if (view && view !== enteringView && view !== leavingView) {
destroyQueue.push(view);
}
}
// default the direction to "back"
opts.direction = opts.direction || 'back';
}
const finalBalance = this.views.length +
(insertViews !== undefined ? insertViews.length : 0) -
(removeCount !== undefined ? removeCount : 0);
assert(finalBalance >= 0, 'final balance can not be negative');
if (finalBalance === 0) {
console.warn(`You can't remove all the pages in the navigation stack. nav.pop() is probably called too many times.`, this, this.el);
throw new Error('navigation stack needs at least one root page');
}
// At this point the transition can not be rejected, any throw should be an error
// there are views to insert
if (insertViews) {
// add the views to the
let insertIndex = ti.insertStart;
for (const view of insertViews) {
this.insertViewAt(view, insertIndex);
insertIndex++;
}
if (ti.enteringRequiresTransition) {
// default to forward if not already set
opts.direction = opts.direction || 'forward';
}
}
// if the views to be removed are in the beginning or middle
// and there is not a view that needs to visually transition out
// then just destroy them and don't transition anything
// batch all of lifecycles together
// let's make sure, callbacks are zoned
if (destroyQueue && destroyQueue.length > 0) {
for (const view of destroyQueue) {
lifecycle(view.element, LIFECYCLE_WILL_LEAVE);
lifecycle(view.element, LIFECYCLE_DID_LEAVE);
lifecycle(view.element, LIFECYCLE_WILL_UNLOAD);
}
// once all lifecycle events has been delivered, we can safely detroy the views
for (const view of destroyQueue) {
this.destroyView(view);
}
}
}
async transition(enteringView, leavingView, ti) {
// we should animate (duration > 0) if the pushed page is not the first one (startup)
// or if it is a portal (modal, actionsheet, etc.)
const opts = ti.opts;
const progressCallback = opts.progressAnimation
? (ani) => this.sbAni = ani
: undefined;
const mode = getIonMode$1(this);
const enteringEl = enteringView.element;
const leavingEl = leavingView && leavingView.element;
const animationOpts = Object.assign(Object.assign({ mode, showGoBack: this.canGoBackSync(enteringView), baseEl: this.el, progressCallback, animated: this.animated && config.getBoolean('animated', true), enteringEl,
leavingEl }, opts), { animationBuilder: opts.animationBuilder || this.animation || config.get('navAnimation') });
const { hasCompleted } = await transition$2(animationOpts);
return this.transitionFinish(hasCompleted, enteringView, leavingView, opts);
}
transitionFinish(hasCompleted, enteringView, leavingView, opts) {
const cleanupView = hasCompleted ? enteringView : leavingView;
if (cleanupView) {
this.cleanup(cleanupView);
}
return {
hasCompleted,
requiresTransition: true,
enteringView,
leavingView,
direction: opts.direction
};
}
insertViewAt(view, index) {
const views = this.views;
const existingIndex = views.indexOf(view);
if (existingIndex > -1) {
// this view is already in the stack!!
// move it to its new location
assert(view.nav === this, 'view is not part of the nav');
views.splice(index, 0, views.splice(existingIndex, 1)[0]);
}
else {
assert(!view.nav, 'nav is used');
// this is a new view to add to the stack
// create the new entering view
view.nav = this;
// insert the entering view into the correct index in the stack
views.splice(index, 0, view);
}
}
removeView(view) {
assert(view.state === VIEW_STATE_ATTACHED || view.state === VIEW_STATE_DESTROYED, 'view state should be loaded or destroyed');
const views = this.views;
const index = views.indexOf(view);
assert(index > -1, 'view must be part of the stack');
if (index >= 0) {
views.splice(index, 1);
}
}
destroyView(view) {
view._destroy();
this.removeView(view);
}
/**
* DOM WRITE
*/
cleanup(activeView) {
// ok, cleanup time!! Destroy all of the views that are
// INACTIVE and come after the active view
// only do this if the views exist, though
if (this.destroyed) {
return;
}
const views = this.views;
const activeViewIndex = views.indexOf(activeView);
for (let i = views.length - 1; i >= 0; i--) {
const view = views[i];
/**
* When inserting multiple views via insertPages
* the last page will be transitioned to, but the
* others will not be. As a result, a DOM element
* will only be created for the last page inserted.
* As a result, it is possible to have views in the
* stack that do not have `view.element` yet.
*/
const element = view.element;
if (element) {
if (i > activeViewIndex) {
// this view comes after the active view
// let's unload it
lifecycle(element, LIFECYCLE_WILL_UNLOAD);
this.destroyView(view);
}
else if (i < activeViewIndex) {
// this view comes before the active view
// and it is not a portal then ensure it is hidden
setPageHidden(element, true);
}
}
}
}
canStart() {
return (!!this.swipeGesture &&
!this.isTransitioning &&
this.transInstr.length === 0 &&
this.animationEnabled &&
this.canGoBackSync());
}
onStart() {
this.queueTrns({
removeStart: -1,
removeCount: 1,
opts: {
direction: 'back',
progressAnimation: true
}
}, undefined);
}
onMove(stepValue) {
if (this.sbAni) {
this.sbAni.progressStep(stepValue);
}
}
onEnd(shouldComplete, stepValue, dur) {
if (this.sbAni) {
this.animationEnabled = false;
this.sbAni.onFinish(() => {
this.animationEnabled = true;
}, { oneTimeCallback: true });
// Account for rounding errors in JS
let newStepValue = (shouldComplete) ? -0.001 : 0.001;
/**
* Animation will be reversed here, so need to
* reverse the easing curve as well
*
* Additionally, we need to account for the time relative
* to the new easing curve, as `stepValue` is going to be given
* in terms of a linear curve.
*/
if (!shouldComplete) {
this.sbAni.easing('cubic-bezier(1, 0, 0.68, 0.28)');
newStepValue += getTimeGivenProgression([0, 0], [1, 0], [0.68, 0.28], [1, 1], stepValue)[0];
}
else {
newStepValue += getTimeGivenProgression([0, 0], [0.32, 0.72], [0, 1], [1, 1], stepValue)[0];
}
this.sbAni.progressEnd(shouldComplete ? 1 : 0, newStepValue, dur);
}
}
render() {
return (hAsync("slot", null));
}
get el() { return getElement(this); }
static get watchers() { return {
"swipeGesture": ["swipeGestureChanged"],
"root": ["rootChanged"]
}; }
static get style() { return navCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-nav",
"$members$": {
"delegate": [16],
"swipeGesture": [1028, "swipe-gesture"],
"animated": [4],
"animation": [16],
"rootParams": [16],
"root": [1],
"push": [64],
"insert": [64],
"insertPages": [64],
"pop": [64],
"popTo": [64],
"popToRoot": [64],
"removeIndex": [64],
"setRoot": [64],
"setPages": [64],
"setRouteId": [64],
"getRouteId": [64],
"getActive": [64],
"getByIndex": [64],
"canGoBack": [64],
"getPrevious": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const navLink = (el, routerDirection, component, componentProps, routerAnimation) => {
const nav = el.closest('ion-nav');
if (nav) {
if (routerDirection === 'forward') {
if (component !== undefined) {
return nav.push(component, componentProps, { skipIfBusy: true, animationBuilder: routerAnimation });
}
}
else if (routerDirection === 'root') {
if (component !== undefined) {
return nav.setRoot(component, componentProps, { skipIfBusy: true, animationBuilder: routerAnimation });
}
}
else if (routerDirection === 'back') {
return nav.pop({ skipIfBusy: true, animationBuilder: routerAnimation });
}
}
return Promise.resolve(false);
};
class NavLink {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* The transition direction when navigating to another page.
*/
this.routerDirection = 'forward';
this.onClick = () => {
return navLink(this.el, this.routerDirection, this.component, this.componentProps, this.routerAnimation);
};
}
render() {
return (hAsync(Host, { onClick: this.onClick }));
}
get el() { return getElement(this); }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-nav-link",
"$members$": {
"component": [1],
"componentProps": [16],
"routerDirection": [1, "router-direction"],
"routerAnimation": [16]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const noteIosCss = "/*!@:host*/.sc-ion-note-ios-h{color:var(--color);font-family:var(--ion-font-family, inherit);-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host(.ion-color)*/.ion-color.sc-ion-note-ios-h{color:var(--ion-color-base)}/*!@:host*/.sc-ion-note-ios-h{--color:var(--ion-color-step-350, #a6a6a6)}";
const noteMdCss = "/*!@:host*/.sc-ion-note-md-h{color:var(--color);font-family:var(--ion-font-family, inherit);-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host(.ion-color)*/.ion-color.sc-ion-note-md-h{color:var(--ion-color-base)}/*!@:host*/.sc-ion-note-md-h{--color:var(--ion-color-step-600, #666666);font-size:14px}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Note {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: createColorClasses$1(this.color, {
[mode]: true,
}) }, hAsync("slot", null)));
}
static get style() { return {
ios: noteIosCss,
md: noteMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-note",
"$members$": {
"color": [513]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
/**
* iOS Picker Enter Animation
*/
const iosEnterAnimation$2 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
.beforeStyles({
'pointer-events': 'none'
})
.afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.picker-wrapper'))
.fromTo('transform', 'translateY(100%)', 'translateY(0%)');
return baseAnimation
.addElement(baseEl)
.easing('cubic-bezier(.36,.66,.04,1)')
.duration(400)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* iOS Picker Leave Animation
*/
const iosLeaveAnimation$2 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 'var(--backdrop-opacity)', 0.01);
wrapperAnimation
.addElement(baseEl.querySelector('.picker-wrapper'))
.fromTo('transform', 'translateY(0%)', 'translateY(100%)');
return baseAnimation
.addElement(baseEl)
.easing('cubic-bezier(.36,.66,.04,1)')
.duration(400)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
const pickerIosCss = ".sc-ion-picker-ios-h{--border-radius:0;--border-style:solid;--min-width:auto;--width:100%;--max-width:500px;--min-height:auto;--max-height:auto;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;left:0;top:0;display:block;position:absolute;width:100%;height:100%;outline:none;font-family:var(--ion-font-family, inherit);contain:strict;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1001}[dir=rtl].sc-ion-picker-ios-h,[dir=rtl] .sc-ion-picker-ios-h{left:unset;right:unset;right:0}.overlay-hidden.sc-ion-picker-ios-h{display:none}.picker-wrapper.sc-ion-picker-ios{border-radius:var(--border-radius);left:0;right:0;bottom:0;margin-left:auto;margin-right:auto;margin-top:auto;margin-bottom:auto;-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0);display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);contain:strict;overflow:hidden;z-index:10}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.picker-wrapper.sc-ion-picker-ios{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}.picker-toolbar.sc-ion-picker-ios{width:100%;background:transparent;contain:strict;z-index:1}.picker-button.sc-ion-picker-ios{border:0;font-family:inherit}.picker-button.sc-ion-picker-ios:active,.picker-button.sc-ion-picker-ios:focus{outline:none}.picker-columns.sc-ion-picker-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-pack:center;justify-content:center;margin-bottom:var(--ion-safe-area-bottom, 0);contain:strict;direction:ltr;overflow:hidden}.picker-above-highlight.sc-ion-picker-ios,.picker-below-highlight.sc-ion-picker-ios{display:none;pointer-events:none}.sc-ion-picker-ios-h{--background:var(--ion-background-color, #fff);--border-width:1px 0 0;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, #c8c7cc)));--height:260px;--backdrop-opacity:var(--ion-backdrop-opacity, 0.26);color:var(--ion-item-color, var(--ion-text-color, #000))}.picker-toolbar.sc-ion-picker-ios{display:-ms-flexbox;display:flex;height:44px;border-bottom:0.55px solid var(--border-color)}.picker-toolbar-button.sc-ion-picker-ios{-ms-flex:1;flex:1;text-align:end}.picker-toolbar-button.sc-ion-picker-ios:last-child .picker-button.sc-ion-picker-ios{font-weight:600}.picker-toolbar-button.sc-ion-picker-ios:first-child{font-weight:normal;text-align:start}.picker-button.sc-ion-picker-ios,.picker-button.ion-activated.sc-ion-picker-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:1em;padding-right:1em;padding-top:0;padding-bottom:0;height:44px;background:transparent;color:var(--ion-color-primary, #3880ff);font-size:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.picker-button.sc-ion-picker-ios,.picker-button.ion-activated.sc-ion-picker-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:1em;padding-inline-start:1em;-webkit-padding-end:1em;padding-inline-end:1em}}.picker-columns.sc-ion-picker-ios{height:215px;-webkit-perspective:1000px;perspective:1000px}.picker-above-highlight.sc-ion-picker-ios{left:0;top:0;-webkit-transform:translate3d(0, 0, 90px);transform:translate3d(0, 0, 90px);display:block;position:absolute;width:100%;height:81px;border-bottom:1px solid var(--border-color);background:-webkit-gradient(linear, left top, left bottom, color-stop(20%, var(--background, var(--ion-background-color, #fff))), to(rgba(var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255)), 0.8)));background:linear-gradient(to bottom, var(--background, var(--ion-background-color, #fff)) 20%, rgba(var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255)), 0.8) 100%);z-index:10}[dir=rtl].sc-ion-picker-ios .picker-above-highlight.sc-ion-picker-ios,[dir=rtl].sc-ion-picker-ios-h .picker-above-highlight.sc-ion-picker-ios,[dir=rtl] .sc-ion-picker-ios-h .picker-above-highlight.sc-ion-picker-ios{left:unset;right:unset;right:0}.picker-below-highlight.sc-ion-picker-ios{left:0;top:115px;-webkit-transform:translate3d(0, 0, 90px);transform:translate3d(0, 0, 90px);display:block;position:absolute;width:100%;height:119px;border-top:1px solid var(--border-color);background:-webkit-gradient(linear, left bottom, left top, color-stop(30%, var(--background, var(--ion-background-color, #fff))), to(rgba(var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255)), 0.8)));background:linear-gradient(to top, var(--background, var(--ion-background-color, #fff)) 30%, rgba(var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255)), 0.8) 100%);z-index:11}[dir=rtl].sc-ion-picker-ios .picker-below-highlight.sc-ion-picker-ios,[dir=rtl].sc-ion-picker-ios-h .picker-below-highlight.sc-ion-picker-ios,[dir=rtl] .sc-ion-picker-ios-h .picker-below-highlight.sc-ion-picker-ios{left:unset;right:unset;right:0}";
const pickerMdCss = ".sc-ion-picker-md-h{--border-radius:0;--border-style:solid;--min-width:auto;--width:100%;--max-width:500px;--min-height:auto;--max-height:auto;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;left:0;top:0;display:block;position:absolute;width:100%;height:100%;outline:none;font-family:var(--ion-font-family, inherit);contain:strict;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1001}[dir=rtl].sc-ion-picker-md-h,[dir=rtl] .sc-ion-picker-md-h{left:unset;right:unset;right:0}.overlay-hidden.sc-ion-picker-md-h{display:none}.picker-wrapper.sc-ion-picker-md{border-radius:var(--border-radius);left:0;right:0;bottom:0;margin-left:auto;margin-right:auto;margin-top:auto;margin-bottom:auto;-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0);display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);contain:strict;overflow:hidden;z-index:10}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.picker-wrapper.sc-ion-picker-md{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}.picker-toolbar.sc-ion-picker-md{width:100%;background:transparent;contain:strict;z-index:1}.picker-button.sc-ion-picker-md{border:0;font-family:inherit}.picker-button.sc-ion-picker-md:active,.picker-button.sc-ion-picker-md:focus{outline:none}.picker-columns.sc-ion-picker-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-pack:center;justify-content:center;margin-bottom:var(--ion-safe-area-bottom, 0);contain:strict;direction:ltr;overflow:hidden}.picker-above-highlight.sc-ion-picker-md,.picker-below-highlight.sc-ion-picker-md{display:none;pointer-events:none}.sc-ion-picker-md-h{--background:var(--ion-background-color, #fff);--border-width:0.55px 0 0;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.13))));--height:260px;--backdrop-opacity:var(--ion-backdrop-opacity, 0.26);color:var(--ion-item-color, var(--ion-text-color, #000))}.picker-toolbar.sc-ion-picker-md{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end;height:44px}.picker-button.sc-ion-picker-md,.picker-button.ion-activated.sc-ion-picker-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:1.1em;padding-right:1.1em;padding-top:0;padding-bottom:0;height:44px;background:transparent;color:var(--ion-color-primary, #3880ff);font-size:14px;font-weight:500;text-transform:uppercase;-webkit-box-shadow:none;box-shadow:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.picker-button.sc-ion-picker-md,.picker-button.ion-activated.sc-ion-picker-md{padding-left:unset;padding-right:unset;-webkit-padding-start:1.1em;padding-inline-start:1.1em;-webkit-padding-end:1.1em;padding-inline-end:1.1em}}.picker-columns.sc-ion-picker-md{height:216px;-webkit-perspective:1800px;perspective:1800px}.picker-above-highlight.sc-ion-picker-md{left:0;top:0;-webkit-transform:translate3d(0, 0, 90px);transform:translate3d(0, 0, 90px);position:absolute;width:100%;height:81px;border-bottom:1px solid var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.13))));background:-webkit-gradient(linear, left top, left bottom, color-stop(20%, var(--ion-background-color, #fff)), to(rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8)));background:linear-gradient(to bottom, var(--ion-background-color, #fff) 20%, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8) 100%);z-index:10}[dir=rtl].sc-ion-picker-md .picker-above-highlight.sc-ion-picker-md,[dir=rtl].sc-ion-picker-md-h .picker-above-highlight.sc-ion-picker-md,[dir=rtl] .sc-ion-picker-md-h .picker-above-highlight.sc-ion-picker-md{left:unset;right:unset;right:0}.picker-below-highlight.sc-ion-picker-md{left:0;top:115px;-webkit-transform:translate3d(0, 0, 90px);transform:translate3d(0, 0, 90px);position:absolute;width:100%;height:119px;border-top:1px solid var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.13))));background:-webkit-gradient(linear, left bottom, left top, color-stop(30%, var(--ion-background-color, #fff)), to(rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8)));background:linear-gradient(to top, var(--ion-background-color, #fff) 30%, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8) 100%);z-index:11}[dir=rtl].sc-ion-picker-md .picker-below-highlight.sc-ion-picker-md,[dir=rtl].sc-ion-picker-md-h .picker-below-highlight.sc-ion-picker-md,[dir=rtl] .sc-ion-picker-md-h .picker-below-highlight.sc-ion-picker-md{left:unset;right:unset;right:0}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Picker {
constructor(hostRef) {
registerInstance(this, hostRef);
this.didPresent = createEvent(this, "ionPickerDidPresent", 7);
this.willPresent = createEvent(this, "ionPickerWillPresent", 7);
this.willDismiss = createEvent(this, "ionPickerWillDismiss", 7);
this.didDismiss = createEvent(this, "ionPickerDidDismiss", 7);
this.presented = false;
/**
* If `true`, the keyboard will be automatically dismissed when the overlay is presented.
*/
this.keyboardClose = true;
/**
* Array of buttons to be displayed at the top of the picker.
*/
this.buttons = [];
/**
* Array of columns to be displayed in the picker.
*/
this.columns = [];
/**
* Number of milliseconds to wait before dismissing the picker.
*/
this.duration = 0;
/**
* If `true`, a backdrop will be displayed behind the picker.
*/
this.showBackdrop = true;
/**
* If `true`, the picker will be dismissed when the backdrop is clicked.
*/
this.backdropDismiss = true;
/**
* If `true`, the picker will animate.
*/
this.animated = true;
this.onBackdropTap = () => {
this.dismiss(undefined, BACKDROP);
};
this.dispatchCancelHandler = (ev) => {
const role = ev.detail.role;
if (isCancel(role)) {
const cancelButton = this.buttons.find(b => b.role === 'cancel');
this.callButtonHandler(cancelButton);
}
};
}
connectedCallback() {
prepareOverlay(this.el);
}
/**
* Present the picker overlay after it has been created.
*/
async present() {
await present(this, 'pickerEnter', iosEnterAnimation$2, iosEnterAnimation$2, undefined);
if (this.duration > 0) {
this.durationTimeout = setTimeout(() => this.dismiss(), this.duration);
}
}
/**
* Dismiss the picker overlay after it has been presented.
*
* @param data Any data to emit in the dismiss events.
* @param role The role of the element that is dismissing the picker.
* This can be useful in a button handler for determining which button was
* clicked to dismiss the picker.
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
*/
dismiss(data, role) {
if (this.durationTimeout) {
clearTimeout(this.durationTimeout);
}
return dismiss(this, data, role, 'pickerLeave', iosLeaveAnimation$2, iosLeaveAnimation$2);
}
/**
* Returns a promise that resolves when the picker did dismiss.
*/
onDidDismiss() {
return eventMethod(this.el, 'ionPickerDidDismiss');
}
/**
* Returns a promise that resolves when the picker will dismiss.
*/
onWillDismiss() {
return eventMethod(this.el, 'ionPickerWillDismiss');
}
/**
* Get the column that matches the specified name.
*
* @param name The name of the column.
*/
getColumn(name) {
return Promise.resolve(this.columns.find(column => column.name === name));
}
async buttonClick(button) {
const role = button.role;
if (isCancel(role)) {
return this.dismiss(undefined, role);
}
const shouldDismiss = await this.callButtonHandler(button);
if (shouldDismiss) {
return this.dismiss(this.getSelected(), button.role);
}
return Promise.resolve();
}
async callButtonHandler(button) {
if (button) {
// a handler has been provided, execute it
// pass the handler the values from the inputs
const rtn = await safeCall(button.handler, this.getSelected());
if (rtn === false) {
// if the return value of the handler is false then do not dismiss
return false;
}
}
return true;
}
getSelected() {
const selected = {};
this.columns.forEach((col, index) => {
const selectedColumn = col.selectedIndex !== undefined
? col.options[col.selectedIndex]
: undefined;
selected[col.name] = {
text: selectedColumn ? selectedColumn.text : undefined,
value: selectedColumn ? selectedColumn.value : undefined,
columnIndex: index
};
});
return selected;
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { "aria-modal": "true", tabindex: "-1", class: Object.assign({ [mode]: true,
// Used internally for styling
[`picker-${mode}`]: true }, getClassMap(this.cssClass)), style: {
zIndex: `${20000 + this.overlayIndex}`
}, onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }, hAsync("ion-backdrop", { visible: this.showBackdrop, tappable: this.backdropDismiss }), hAsync("div", { tabindex: "0" }), hAsync("div", { class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, hAsync("div", { class: "picker-toolbar" }, this.buttons.map(b => (hAsync("div", { class: buttonWrapperClass(b) }, hAsync("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass$1(b) }, b.text))))), hAsync("div", { class: "picker-columns" }, hAsync("div", { class: "picker-above-highlight" }), this.presented && this.columns.map(c => hAsync("ion-picker-column", { col: c })), hAsync("div", { class: "picker-below-highlight" }))), hAsync("div", { tabindex: "0" })));
}
get el() { return getElement(this); }
static get style() { return {
ios: pickerIosCss,
md: pickerMdCss
}; }
static get cmpMeta() { return {
"$flags$": 34,
"$tagName$": "ion-picker",
"$members$": {
"overlayIndex": [2, "overlay-index"],
"keyboardClose": [4, "keyboard-close"],
"enterAnimation": [16],
"leaveAnimation": [16],
"buttons": [16],
"columns": [16],
"cssClass": [1, "css-class"],
"duration": [2],
"showBackdrop": [4, "show-backdrop"],
"backdropDismiss": [4, "backdrop-dismiss"],
"animated": [4],
"presented": [32],
"present": [64],
"dismiss": [64],
"onDidDismiss": [64],
"onWillDismiss": [64],
"getColumn": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const buttonWrapperClass = (button) => {
return {
[`picker-toolbar-${button.role}`]: button.role !== undefined,
'picker-toolbar-button': true
};
};
const buttonClass$1 = (button) => {
return Object.assign({ 'picker-button': true, 'ion-activatable': true }, getClassMap(button.cssClass));
};
const pickerColumnIosCss = ".picker-col{display:-ms-flexbox;display:flex;position:relative;-ms-flex:1;flex:1;-ms-flex-pack:center;justify-content:center;height:100%;-webkit-box-sizing:content-box;box-sizing:content-box;contain:content}.picker-opts{position:relative;-ms-flex:1;flex:1;max-width:100%}.picker-opt{left:0;top:0;display:block;position:absolute;width:100%;border:0;text-align:center;text-overflow:ellipsis;white-space:nowrap;contain:strict;overflow:hidden;will-change:transform}[dir=rtl] .picker-opt,:host-context([dir=rtl]) .picker-opt{left:unset;right:unset;right:0}.picker-opt.picker-opt-disabled{pointer-events:none}.picker-opt-disabled{opacity:0}.picker-opts-left{-ms-flex-pack:start;justify-content:flex-start}.picker-opts-right{-ms-flex-pack:end;justify-content:flex-end}.picker-opt:active,.picker-opt:focus{outline:none}.picker-prefix{position:relative;-ms-flex:1;flex:1;text-align:end;white-space:nowrap}.picker-suffix{position:relative;-ms-flex:1;flex:1;text-align:start;white-space:nowrap}.picker-col{padding-left:4px;padding-right:4px;padding-top:0;padding-bottom:0;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.picker-col{padding-left:unset;padding-right:unset;-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px}}.picker-prefix,.picker-suffix,.picker-opts{top:77px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;color:inherit;font-size:20px;line-height:42px;pointer-events:none}.picker-opt{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-transform-origin:center center;transform-origin:center center;height:46px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out;background:transparent;color:inherit;font-size:20px;line-height:42px;-webkit-backface-visibility:hidden;backface-visibility:hidden;pointer-events:auto}[dir=rtl] .picker-opt,:host-context([dir=rtl]) .picker-opt{-webkit-transform-origin:calc(100% - center) center;transform-origin:calc(100% - center) center}";
const pickerColumnMdCss = ".picker-col{display:-ms-flexbox;display:flex;position:relative;-ms-flex:1;flex:1;-ms-flex-pack:center;justify-content:center;height:100%;-webkit-box-sizing:content-box;box-sizing:content-box;contain:content}.picker-opts{position:relative;-ms-flex:1;flex:1;max-width:100%}.picker-opt{left:0;top:0;display:block;position:absolute;width:100%;border:0;text-align:center;text-overflow:ellipsis;white-space:nowrap;contain:strict;overflow:hidden;will-change:transform}[dir=rtl] .picker-opt,:host-context([dir=rtl]) .picker-opt{left:unset;right:unset;right:0}.picker-opt.picker-opt-disabled{pointer-events:none}.picker-opt-disabled{opacity:0}.picker-opts-left{-ms-flex-pack:start;justify-content:flex-start}.picker-opts-right{-ms-flex-pack:end;justify-content:flex-end}.picker-opt:active,.picker-opt:focus{outline:none}.picker-prefix{position:relative;-ms-flex:1;flex:1;text-align:end;white-space:nowrap}.picker-suffix{position:relative;-ms-flex:1;flex:1;text-align:start;white-space:nowrap}.picker-col{padding-left:8px;padding-right:8px;padding-top:0;padding-bottom:0;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.picker-col{padding-left:unset;padding-right:unset;-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px}}.picker-prefix,.picker-suffix,.picker-opts{top:77px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;color:inherit;font-size:22px;line-height:42px;pointer-events:none}.picker-opt{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;height:43px;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out;background:transparent;color:inherit;font-size:22px;line-height:42px;-webkit-backface-visibility:hidden;backface-visibility:hidden;pointer-events:auto}.picker-prefix,.picker-suffix,.picker-opt.picker-opt-selected{color:var(--ion-color-primary, #3880ff)}";
/**
* @internal
*/
class PickerColumnCmp {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionPickerColChange = createEvent(this, "ionPickerColChange", 7);
this.optHeight = 0;
this.rotateFactor = 0;
this.scaleFactor = 1;
this.velocity = 0;
this.y = 0;
this.noAnimate = true;
}
colChanged() {
this.refresh();
}
async connectedCallback() {
let pickerRotateFactor = 0;
let pickerScaleFactor = 0.81;
const mode = getIonMode$1(this);
if (mode === 'ios') {
pickerRotateFactor = -0.46;
pickerScaleFactor = 1;
}
this.rotateFactor = pickerRotateFactor;
this.scaleFactor = pickerScaleFactor;
this.gesture = (await Promise.resolve().then(function () { return index$1; })).createGesture({
el: this.el,
gestureName: 'picker-swipe',
gesturePriority: 100,
threshold: 0,
passive: false,
onStart: ev => this.onStart(ev),
onMove: ev => this.onMove(ev),
onEnd: ev => this.onEnd(ev),
});
this.gesture.enable();
this.tmrId = setTimeout(() => {
this.noAnimate = false;
this.refresh(true);
}, 250);
}
componentDidLoad() {
const colEl = this.optsEl;
if (colEl) {
// DOM READ
// We perfom a DOM read over a rendered item, this needs to happen after the first render
this.optHeight = (colEl.firstElementChild ? colEl.firstElementChild.clientHeight : 0);
}
this.refresh();
}
disconnectedCallback() {
cancelAnimationFrame(this.rafId);
clearTimeout(this.tmrId);
if (this.gesture) {
this.gesture.destroy();
this.gesture = undefined;
}
}
emitColChange() {
this.ionPickerColChange.emit(this.col);
}
setSelected(selectedIndex, duration) {
// if there is a selected index, then figure out it's y position
// if there isn't a selected index, then just use the top y position
const y = (selectedIndex > -1) ? -(selectedIndex * this.optHeight) : 0;
this.velocity = 0;
// set what y position we're at
cancelAnimationFrame(this.rafId);
this.update(y, duration, true);
this.emitColChange();
}
update(y, duration, saveY) {
if (!this.optsEl) {
return;
}
// ensure we've got a good round number :)
let translateY = 0;
let translateZ = 0;
const { col, rotateFactor } = this;
const selectedIndex = col.selectedIndex = this.indexForY(-y);
const durationStr = (duration === 0) ? '' : duration + 'ms';
const scaleStr = `scale(${this.scaleFactor})`;
const children = this.optsEl.children;
for (let i = 0; i < children.length; i++) {
const button = children[i];
const opt = col.options[i];
const optOffset = (i * this.optHeight) + y;
let transform = '';
if (rotateFactor !== 0) {
const rotateX = optOffset * rotateFactor;
if (Math.abs(rotateX) <= 90) {
translateY = 0;
translateZ = 90;
transform = `rotateX(${rotateX}deg) `;
}
else {
translateY = -9999;
}
}
else {
translateZ = 0;
translateY = optOffset;
}
const selected = selectedIndex === i;
transform += `translate3d(0px,${translateY}px,${translateZ}px) `;
if (this.scaleFactor !== 1 && !selected) {
transform += scaleStr;
}
// Update transition duration
if (this.noAnimate) {
opt.duration = 0;
button.style.transitionDuration = '';
}
else if (duration !== opt.duration) {
opt.duration = duration;
button.style.transitionDuration = durationStr;
}
// Update transform
if (transform !== opt.transform) {
opt.transform = transform;
button.style.transform = transform;
}
// Update selected item
if (selected !== opt.selected) {
opt.selected = selected;
if (selected) {
button.classList.add(PICKER_OPT_SELECTED);
}
else {
button.classList.remove(PICKER_OPT_SELECTED);
}
}
}
this.col.prevSelected = selectedIndex;
if (saveY) {
this.y = y;
}
if (this.lastIndex !== selectedIndex) {
// have not set a last index yet
hapticSelectionChanged();
this.lastIndex = selectedIndex;
}
}
decelerate() {
if (this.velocity !== 0) {
// still decelerating
this.velocity *= DECELERATION_FRICTION;
// do not let it go slower than a velocity of 1
this.velocity = (this.velocity > 0)
? Math.max(this.velocity, 1)
: Math.min(this.velocity, -1);
let y = this.y + this.velocity;
if (y > this.minY) {
// whoops, it's trying to scroll up farther than the options we have!
y = this.minY;
this.velocity = 0;
}
else if (y < this.maxY) {
// gahh, it's trying to scroll down farther than we can!
y = this.maxY;
this.velocity = 0;
}
this.update(y, 0, true);
const notLockedIn = (Math.round(y) % this.optHeight !== 0) || (Math.abs(this.velocity) > 1);
if (notLockedIn) {
// isn't locked in yet, keep decelerating until it is
this.rafId = requestAnimationFrame(() => this.decelerate());
}
else {
this.velocity = 0;
this.emitColChange();
hapticSelectionEnd();
}
}
else if (this.y % this.optHeight !== 0) {
// needs to still get locked into a position so options line up
const currentPos = Math.abs(this.y % this.optHeight);
// create a velocity in the direction it needs to scroll
this.velocity = (currentPos > (this.optHeight / 2) ? 1 : -1);
this.decelerate();
}
}
indexForY(y) {
return Math.min(Math.max(Math.abs(Math.round(y / this.optHeight)), 0), this.col.options.length - 1);
}
// TODO should this check disabled?
onStart(detail) {
// We have to prevent default in order to block scrolling under the picker
// but we DO NOT have to stop propagation, since we still want
// some "click" events to capture
if (detail.event.cancelable) {
detail.event.preventDefault();
}
detail.event.stopPropagation();
hapticSelectionStart();
// reset everything
cancelAnimationFrame(this.rafId);
const options = this.col.options;
let minY = (options.length - 1);
let maxY = 0;
for (let i = 0; i < options.length; i++) {
if (!options[i].disabled) {
minY = Math.min(minY, i);
maxY = Math.max(maxY, i);
}
}
this.minY = -(minY * this.optHeight);
this.maxY = -(maxY * this.optHeight);
}
onMove(detail) {
if (detail.event.cancelable) {
detail.event.preventDefault();
}
detail.event.stopPropagation();
// update the scroll position relative to pointer start position
let y = this.y + detail.deltaY;
if (y > this.minY) {
// scrolling up higher than scroll area
y = Math.pow(y, 0.8);
this.bounceFrom = y;
}
else if (y < this.maxY) {
// scrolling down below scroll area
y += Math.pow(this.maxY - y, 0.9);
this.bounceFrom = y;
}
else {
this.bounceFrom = 0;
}
this.update(y, 0, false);
}
onEnd(detail) {
if (this.bounceFrom > 0) {
// bounce back up
this.update(this.minY, 100, true);
this.emitColChange();
return;
}
else if (this.bounceFrom < 0) {
// bounce back down
this.update(this.maxY, 100, true);
this.emitColChange();
return;
}
this.velocity = clamp(-MAX_PICKER_SPEED, detail.velocityY * 23, MAX_PICKER_SPEED);
if (this.velocity === 0 && detail.deltaY === 0) {
const opt = detail.event.target.closest('.picker-opt');
if (opt && opt.hasAttribute('opt-index')) {
this.setSelected(parseInt(opt.getAttribute('opt-index'), 10), TRANSITION_DURATION);
}
}
else {
this.y += detail.deltaY;
if (Math.abs(detail.velocityY) < 0.05) {
const isScrollingUp = detail.deltaY > 0;
const optHeightFraction = (Math.abs(this.y) % this.optHeight) / this.optHeight;
if (isScrollingUp && optHeightFraction > 0.5) {
this.velocity = Math.abs(this.velocity) * -1;
}
else if (!isScrollingUp && optHeightFraction <= 0.5) {
this.velocity = Math.abs(this.velocity);
}
}
this.decelerate();
}
}
refresh(forceRefresh) {
let min = this.col.options.length - 1;
let max = 0;
const options = this.col.options;
for (let i = 0; i < options.length; i++) {
if (!options[i].disabled) {
min = Math.min(min, i);
max = Math.max(max, i);
}
}
/**
* Only update selected value if column has a
* velocity of 0. If it does not, then the
* column is animating might land on
* a value different than the value at
* selectedIndex
*/
if (this.velocity !== 0) {
return;
}
const selectedIndex = clamp(min, this.col.selectedIndex || 0, max);
if (this.col.prevSelected !== selectedIndex || forceRefresh) {
const y = (selectedIndex * this.optHeight) * -1;
this.velocity = 0;
this.update(y, TRANSITION_DURATION, true);
}
}
render() {
const col = this.col;
const Button = 'button';
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
'picker-col': true,
'picker-opts-left': this.col.align === 'left',
'picker-opts-right': this.col.align === 'right'
}, style: {
'max-width': this.col.columnWidth
} }, col.prefix && (hAsync("div", { class: "picker-prefix", style: { width: col.prefixWidth } }, col.prefix)), hAsync("div", { class: "picker-opts", style: { maxWidth: col.optionsWidth }, ref: el => this.optsEl = el }, col.options.map((o, index) => hAsync(Button, { type: "button", class: { 'picker-opt': true, 'picker-opt-disabled': !!o.disabled }, "opt-index": index }, o.text))), col.suffix && (hAsync("div", { class: "picker-suffix", style: { width: col.suffixWidth } }, col.suffix))));
}
get el() { return getElement(this); }
static get watchers() { return {
"col": ["colChanged"]
}; }
static get style() { return {
ios: pickerColumnIosCss,
md: pickerColumnMdCss
}; }
static get cmpMeta() { return {
"$flags$": 32,
"$tagName$": "ion-picker-column",
"$members$": {
"col": [16]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const PICKER_OPT_SELECTED = 'picker-opt-selected';
const DECELERATION_FRICTION = 0.97;
const MAX_PICKER_SPEED = 90;
const TRANSITION_DURATION = 150;
/**
* iOS Popover Enter Animation
*/
const iosEnterAnimation$1 = (baseEl, ev) => {
let originY = 'top';
let originX = 'left';
const contentEl = baseEl.querySelector('.popover-content');
const contentDimentions = contentEl.getBoundingClientRect();
const contentWidth = contentDimentions.width;
const contentHeight = contentDimentions.height;
const bodyWidth = baseEl.ownerDocument.defaultView.innerWidth;
const bodyHeight = baseEl.ownerDocument.defaultView.innerHeight;
// If ev was passed, use that for target element
const targetDim = ev && ev.target && ev.target.getBoundingClientRect();
const targetTop = targetDim != null && 'top' in targetDim ? targetDim.top : bodyHeight / 2 - contentHeight / 2;
const targetLeft = targetDim != null && 'left' in targetDim ? targetDim.left : bodyWidth / 2;
const targetWidth = (targetDim && targetDim.width) || 0;
const targetHeight = (targetDim && targetDim.height) || 0;
const arrowEl = baseEl.querySelector('.popover-arrow');
const arrowDim = arrowEl.getBoundingClientRect();
const arrowWidth = arrowDim.width;
const arrowHeight = arrowDim.height;
if (targetDim == null) {
arrowEl.style.display = 'none';
}
const arrowCSS = {
top: targetTop + targetHeight,
left: targetLeft + targetWidth / 2 - arrowWidth / 2
};
const popoverCSS = {
top: targetTop + targetHeight + (arrowHeight - 1),
left: targetLeft + targetWidth / 2 - contentWidth / 2
};
// If the popover left is less than the padding it is off screen
// to the left so adjust it, else if the width of the popover
// exceeds the body width it is off screen to the right so adjust
//
let checkSafeAreaLeft = false;
let checkSafeAreaRight = false;
// If the popover left is less than the padding it is off screen
// to the left so adjust it, else if the width of the popover
// exceeds the body width it is off screen to the right so adjust
// 25 is a random/arbitrary number. It seems to work fine for ios11
// and iPhoneX. Is it perfect? No. Does it work? Yes.
if (popoverCSS.left < POPOVER_IOS_BODY_PADDING + 25) {
checkSafeAreaLeft = true;
popoverCSS.left = POPOVER_IOS_BODY_PADDING;
}
else if (contentWidth + POPOVER_IOS_BODY_PADDING + popoverCSS.left + 25 > bodyWidth) {
// Ok, so we're on the right side of the screen,
// but now we need to make sure we're still a bit further right
// cus....notchurally... Again, 25 is random. It works tho
checkSafeAreaRight = true;
popoverCSS.left = bodyWidth - contentWidth - POPOVER_IOS_BODY_PADDING;
originX = 'right';
}
// make it pop up if there's room above
if (targetTop + targetHeight + contentHeight > bodyHeight && targetTop - contentHeight > 0) {
arrowCSS.top = targetTop - (arrowHeight + 1);
popoverCSS.top = targetTop - contentHeight - (arrowHeight - 1);
baseEl.className = baseEl.className + ' popover-bottom';
originY = 'bottom';
// If there isn't room for it to pop up above the target cut it off
}
else if (targetTop + targetHeight + contentHeight > bodyHeight) {
contentEl.style.bottom = POPOVER_IOS_BODY_PADDING + '%';
}
arrowEl.style.top = arrowCSS.top + 'px';
arrowEl.style.left = arrowCSS.left + 'px';
contentEl.style.top = popoverCSS.top + 'px';
contentEl.style.left = popoverCSS.left + 'px';
if (checkSafeAreaLeft) {
contentEl.style.left = `calc(${popoverCSS.left}px + var(--ion-safe-area-left, 0px))`;
}
if (checkSafeAreaRight) {
contentEl.style.left = `calc(${popoverCSS.left}px - var(--ion-safe-area-right, 0px))`;
}
contentEl.style.transformOrigin = originY + ' ' + originX;
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
.beforeStyles({
'pointer-events': 'none'
})
.afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.popover-wrapper'))
.fromTo('opacity', 0.01, 1);
return baseAnimation
.addElement(baseEl)
.easing('ease')
.duration(100)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
const POPOVER_IOS_BODY_PADDING = 5;
/**
* iOS Popover Leave Animation
*/
const iosLeaveAnimation$1 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 'var(--backdrop-opacity)', 0);
wrapperAnimation
.addElement(baseEl.querySelector('.popover-wrapper'))
.fromTo('opacity', 0.99, 0);
return baseAnimation
.addElement(baseEl)
.easing('ease')
.duration(500)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
/**
* Md Popover Enter Animation
*/
const mdEnterAnimation$1 = (baseEl, ev) => {
const POPOVER_MD_BODY_PADDING = 12;
const doc = baseEl.ownerDocument;
const isRTL = doc.dir === 'rtl';
let originY = 'top';
let originX = isRTL ? 'right' : 'left';
const contentEl = baseEl.querySelector('.popover-content');
const contentDimentions = contentEl.getBoundingClientRect();
const contentWidth = contentDimentions.width;
const contentHeight = contentDimentions.height;
const bodyWidth = doc.defaultView.innerWidth;
const bodyHeight = doc.defaultView.innerHeight;
// If ev was passed, use that for target element
const targetDim = ev && ev.target && ev.target.getBoundingClientRect();
// As per MD spec, by default position the popover below the target (trigger) element
const targetTop = targetDim != null && 'bottom' in targetDim
? targetDim.bottom
: bodyHeight / 2 - contentHeight / 2;
const targetLeft = targetDim != null && 'left' in targetDim
? isRTL
? targetDim.left - contentWidth + targetDim.width
: targetDim.left
: bodyWidth / 2 - contentWidth / 2;
const targetHeight = (targetDim && targetDim.height) || 0;
const popoverCSS = {
top: targetTop,
left: targetLeft
};
// If the popover left is less than the padding it is off screen
// to the left so adjust it, else if the width of the popover
// exceeds the body width it is off screen to the right so adjust
if (popoverCSS.left < POPOVER_MD_BODY_PADDING) {
popoverCSS.left = POPOVER_MD_BODY_PADDING;
// Same origin in this case for both LTR & RTL
// Note: in LTR, originX is already 'left'
originX = 'left';
}
else if (contentWidth + POPOVER_MD_BODY_PADDING + popoverCSS.left >
bodyWidth) {
popoverCSS.left = bodyWidth - contentWidth - POPOVER_MD_BODY_PADDING;
// Same origin in this case for both LTR & RTL
// Note: in RTL, originX is already 'right'
originX = 'right';
}
// If the popover when popped down stretches past bottom of screen,
// make it pop up if there's room above
if (targetTop + targetHeight + contentHeight > bodyHeight &&
targetTop - contentHeight > 0) {
popoverCSS.top = targetTop - contentHeight - targetHeight;
baseEl.className = baseEl.className + ' popover-bottom';
originY = 'bottom';
// If there isn't room for it to pop up above the target cut it off
}
else if (targetTop + targetHeight + contentHeight > bodyHeight) {
contentEl.style.bottom = POPOVER_MD_BODY_PADDING + 'px';
}
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
const contentAnimation = createAnimation();
const viewportAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
.beforeStyles({
'pointer-events': 'none'
})
.afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.popover-wrapper'))
.fromTo('opacity', 0.01, 1);
contentAnimation
.addElement(contentEl)
.beforeStyles({
'top': `${popoverCSS.top}px`,
'left': `${popoverCSS.left}px`,
'transform-origin': `${originY} ${originX}`
})
.fromTo('transform', 'scale(0.001)', 'scale(1)');
viewportAnimation
.addElement(baseEl.querySelector('.popover-viewport'))
.fromTo('opacity', 0.01, 1);
return baseAnimation
.addElement(baseEl)
.easing('cubic-bezier(0.36,0.66,0.04,1)')
.duration(300)
.addAnimation([backdropAnimation, wrapperAnimation, contentAnimation, viewportAnimation]);
};
/**
* Md Popover Leave Animation
*/
const mdLeaveAnimation$1 = (baseEl) => {
const baseAnimation = createAnimation();
const backdropAnimation = createAnimation();
const wrapperAnimation = createAnimation();
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop'))
.fromTo('opacity', 'var(--backdrop-opacity)', 0);
wrapperAnimation
.addElement(baseEl.querySelector('.popover-wrapper'))
.fromTo('opacity', 0.99, 0);
return baseAnimation
.addElement(baseEl)
.easing('ease')
.duration(500)
.addAnimation([backdropAnimation, wrapperAnimation]);
};
const popoverIosCss = ".sc-ion-popover-ios-h{--background:var(--ion-background-color, #fff);--min-width:0;--min-height:0;--max-width:auto;--height:auto;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:fixed;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;color:var(--ion-text-color, #000);z-index:1001}.overlay-hidden.sc-ion-popover-ios-h{display:none}.popover-wrapper.sc-ion-popover-ios{opacity:0;z-index:10}.popover-content.sc-ion-popover-ios{display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:auto;z-index:10}.popover-viewport.sc-ion-popover-ios{--ion-safe-area-top:0px;--ion-safe-area-right:0px;--ion-safe-area-bottom:0px;--ion-safe-area-left:0px}.sc-ion-popover-ios-h{--width:200px;--max-height:90%;--box-shadow:none;--backdrop-opacity:var(--ion-backdrop-opacity, 0.08)}.popover-content.sc-ion-popover-ios{border-radius:10px}.popover-arrow.sc-ion-popover-ios{display:block;position:absolute;width:20px;height:10px;overflow:hidden}.popover-arrow.sc-ion-popover-ios::after{left:3px;top:3px;border-radius:3px;position:absolute;width:14px;height:14px;-webkit-transform:rotate(45deg);transform:rotate(45deg);background:var(--background);content:\"\";z-index:10}[dir=rtl].sc-ion-popover-ios .popover-arrow.sc-ion-popover-ios::after,[dir=rtl].sc-ion-popover-ios-h .popover-arrow.sc-ion-popover-ios::after,[dir=rtl] .sc-ion-popover-ios-h .popover-arrow.sc-ion-popover-ios::after{left:unset;right:unset;right:3px}.popover-bottom.sc-ion-popover-ios-h .popover-arrow.sc-ion-popover-ios{top:auto;bottom:-10px}.popover-bottom.sc-ion-popover-ios-h .popover-arrow.sc-ion-popover-ios::after{top:-6px}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){.popover-translucent.sc-ion-popover-ios-h .popover-content.sc-ion-popover-ios,.popover-translucent.sc-ion-popover-ios-h .popover-arrow.sc-ion-popover-ios::after{background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}}";
const popoverMdCss = ".sc-ion-popover-md-h{--background:var(--ion-background-color, #fff);--min-width:0;--min-height:0;--max-width:auto;--height:auto;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:fixed;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;color:var(--ion-text-color, #000);z-index:1001}.overlay-hidden.sc-ion-popover-md-h{display:none}.popover-wrapper.sc-ion-popover-md{opacity:0;z-index:10}.popover-content.sc-ion-popover-md{display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:auto;z-index:10}.popover-viewport.sc-ion-popover-md{--ion-safe-area-top:0px;--ion-safe-area-right:0px;--ion-safe-area-bottom:0px;--ion-safe-area-left:0px}.sc-ion-popover-md-h{--width:250px;--max-height:90%;--box-shadow:0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);--backdrop-opacity:var(--ion-backdrop-opacity, 0.32)}.popover-content.sc-ion-popover-md{border-radius:4px;-webkit-transform-origin:left top;transform-origin:left top}[dir=rtl].sc-ion-popover-md .popover-content.sc-ion-popover-md,[dir=rtl].sc-ion-popover-md-h .popover-content.sc-ion-popover-md,[dir=rtl] .sc-ion-popover-md-h .popover-content.sc-ion-popover-md{-webkit-transform-origin:right top;transform-origin:right top}.popover-viewport.sc-ion-popover-md{-webkit-transition-delay:100ms;transition-delay:100ms}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Popover {
constructor(hostRef) {
registerInstance(this, hostRef);
this.didPresent = createEvent(this, "ionPopoverDidPresent", 7);
this.willPresent = createEvent(this, "ionPopoverWillPresent", 7);
this.willDismiss = createEvent(this, "ionPopoverWillDismiss", 7);
this.didDismiss = createEvent(this, "ionPopoverDidDismiss", 7);
this.presented = false;
/**
* If `true`, the keyboard will be automatically dismissed when the overlay is presented.
*/
this.keyboardClose = true;
/**
* If `true`, the popover will be dismissed when the backdrop is clicked.
*/
this.backdropDismiss = true;
/**
* If `true`, a backdrop will be displayed behind the popover.
*/
this.showBackdrop = true;
/**
* If `true`, the popover will be translucent.
* Only applies when the mode is `"ios"` and the device supports
* [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
*/
this.translucent = false;
/**
* If `true`, the popover will animate.
*/
this.animated = true;
this.onDismiss = (ev) => {
ev.stopPropagation();
ev.preventDefault();
this.dismiss();
};
this.onBackdropTap = () => {
this.dismiss(undefined, BACKDROP);
};
this.onLifecycle = (modalEvent) => {
const el = this.usersElement;
const name = LIFECYCLE_MAP[modalEvent.type];
if (el && name) {
const event = new CustomEvent(name, {
bubbles: false,
cancelable: false,
detail: modalEvent.detail
});
el.dispatchEvent(event);
}
};
}
connectedCallback() {
prepareOverlay(this.el);
}
/**
* Present the popover overlay after it has been created.
*/
async present() {
if (this.presented) {
return;
}
const container = this.el.querySelector('.popover-content');
if (!container) {
throw new Error('container is undefined');
}
const data = Object.assign(Object.assign({}, this.componentProps), { popover: this.el });
this.usersElement = await attachComponent(this.delegate, container, this.component, ['popover-viewport', this.el['s-sc']], data);
await deepReady(this.usersElement);
return present(this, 'popoverEnter', iosEnterAnimation$1, mdEnterAnimation$1, this.event);
}
/**
* Dismiss the popover overlay after it has been presented.
*
* @param data Any data to emit in the dismiss events.
* @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
*/
async dismiss(data, role) {
const shouldDismiss = await dismiss(this, data, role, 'popoverLeave', iosLeaveAnimation$1, mdLeaveAnimation$1, this.event);
if (shouldDismiss) {
await detachComponent(this.delegate, this.usersElement);
}
return shouldDismiss;
}
/**
* Returns a promise that resolves when the popover did dismiss.
*/
onDidDismiss() {
return eventMethod(this.el, 'ionPopoverDidDismiss');
}
/**
* Returns a promise that resolves when the popover will dismiss.
*/
onWillDismiss() {
return eventMethod(this.el, 'ionPopoverWillDismiss');
}
render() {
const mode = getIonMode$1(this);
const { onLifecycle } = this;
return (hAsync(Host, { "aria-modal": "true", "no-router": true, tabindex: "-1", style: {
zIndex: `${20000 + this.overlayIndex}`,
}, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonDismiss: this.onDismiss, onIonBackdropTap: this.onBackdropTap }, hAsync("ion-backdrop", { tappable: this.backdropDismiss, visible: this.showBackdrop }), hAsync("div", { tabindex: "0" }), hAsync("div", { class: "popover-wrapper ion-overlay-wrapper" }, hAsync("div", { class: "popover-arrow" }), hAsync("div", { class: "popover-content" })), hAsync("div", { tabindex: "0" })));
}
get el() { return getElement(this); }
static get style() { return {
ios: popoverIosCss,
md: popoverMdCss
}; }
static get cmpMeta() { return {
"$flags$": 34,
"$tagName$": "ion-popover",
"$members$": {
"delegate": [16],
"overlayIndex": [2, "overlay-index"],
"enterAnimation": [16],
"leaveAnimation": [16],
"component": [1],
"componentProps": [16],
"keyboardClose": [4, "keyboard-close"],
"cssClass": [1, "css-class"],
"backdropDismiss": [4, "backdrop-dismiss"],
"event": [8],
"showBackdrop": [4, "show-backdrop"],
"translucent": [4],
"animated": [4],
"present": [64],
"dismiss": [64],
"onDidDismiss": [64],
"onWillDismiss": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const LIFECYCLE_MAP = {
'ionPopoverDidPresent': 'ionViewDidEnter',
'ionPopoverWillPresent': 'ionViewWillEnter',
'ionPopoverWillDismiss': 'ionViewWillLeave',
'ionPopoverDidDismiss': 'ionViewDidLeave',
};
const progressBarIosCss = "/*!@:host*/.sc-ion-progress-bar-ios-h{--background:rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.3);--progress-background:var(--ion-color-primary, #3880ff);--buffer-background:var(--background);display:block;position:relative;width:100%;contain:strict;direction:ltr;overflow:hidden}/*!@.progress,\n.progress-indeterminate,\n.indeterminate-bar-primary,\n.indeterminate-bar-secondary,\n.progress-buffer-bar*/.progress.sc-ion-progress-bar-ios,.progress-indeterminate.sc-ion-progress-bar-ios,.indeterminate-bar-primary.sc-ion-progress-bar-ios,.indeterminate-bar-secondary.sc-ion-progress-bar-ios,.progress-buffer-bar.sc-ion-progress-bar-ios{left:0;right:0;top:0;bottom:0;position:absolute;width:100%;height:100%}/*!@.buffer-circles-container,\n.buffer-circles*/.buffer-circles-container.sc-ion-progress-bar-ios,.buffer-circles.sc-ion-progress-bar-ios{left:0;right:0;top:0;bottom:0;position:absolute}/*!@.buffer-circles*/.buffer-circles.sc-ion-progress-bar-ios{right:-10px;left:-10px}/*!@.progress,\n.progress-buffer-bar,\n.buffer-circles-container*/.progress.sc-ion-progress-bar-ios,.progress-buffer-bar.sc-ion-progress-bar-ios,.buffer-circles-container.sc-ion-progress-bar-ios{-webkit-transform-origin:left top;transform-origin:left top;-webkit-transition:-webkit-transform 150ms linear;transition:-webkit-transform 150ms linear;transition:transform 150ms linear;transition:transform 150ms linear, -webkit-transform 150ms linear}/*!@.progress,\n.progress-indeterminate*/.progress.sc-ion-progress-bar-ios,.progress-indeterminate.sc-ion-progress-bar-ios{background:var(--progress-background);z-index:2}/*!@.progress-buffer-bar*/.progress-buffer-bar.sc-ion-progress-bar-ios{background:var(--buffer-background);z-index:1}/*!@.buffer-circles-container*/.buffer-circles-container.sc-ion-progress-bar-ios{overflow:hidden}/*!@.indeterminate-bar-primary*/.indeterminate-bar-primary.sc-ion-progress-bar-ios{top:0;right:0;bottom:0;left:-145.166611%;-webkit-animation:primary-indeterminate-translate 2s infinite linear;animation:primary-indeterminate-translate 2s infinite linear}/*!@.indeterminate-bar-primary .progress-indeterminate*/.indeterminate-bar-primary.sc-ion-progress-bar-ios .progress-indeterminate.sc-ion-progress-bar-ios{-webkit-animation:primary-indeterminate-scale 2s infinite linear;animation:primary-indeterminate-scale 2s infinite linear;-webkit-animation-play-state:inherit;animation-play-state:inherit}/*!@.indeterminate-bar-secondary*/.indeterminate-bar-secondary.sc-ion-progress-bar-ios{top:0;right:0;bottom:0;left:-54.888891%;-webkit-animation:secondary-indeterminate-translate 2s infinite linear;animation:secondary-indeterminate-translate 2s infinite linear}/*!@.indeterminate-bar-secondary .progress-indeterminate*/.indeterminate-bar-secondary.sc-ion-progress-bar-ios .progress-indeterminate.sc-ion-progress-bar-ios{-webkit-animation:secondary-indeterminate-scale 2s infinite linear;animation:secondary-indeterminate-scale 2s infinite linear;-webkit-animation-play-state:inherit;animation-play-state:inherit}/*!@.buffer-circles*/.buffer-circles.sc-ion-progress-bar-ios{background-image:radial-gradient(ellipse at center, var(--buffer-background) 0%, var(--buffer-background) 30%, transparent 30%);background-repeat:repeat-x;background-position:5px center;background-size:10px 10px;z-index:0;-webkit-animation:buffering 450ms infinite linear;animation:buffering 450ms infinite linear}/*!@:host(.progress-bar-reversed)*/.progress-bar-reversed.sc-ion-progress-bar-ios-h{-webkit-transform:scaleX(-1);transform:scaleX(-1)}/*!@:host(.progress-paused) .indeterminate-bar-secondary,\n:host(.progress-paused) .indeterminate-bar-primary,\n:host(.progress-paused) .buffer-circles*/.progress-paused.sc-ion-progress-bar-ios-h .indeterminate-bar-secondary.sc-ion-progress-bar-ios,.progress-paused.sc-ion-progress-bar-ios-h .indeterminate-bar-primary.sc-ion-progress-bar-ios,.progress-paused.sc-ion-progress-bar-ios-h .buffer-circles.sc-ion-progress-bar-ios{-webkit-animation-play-state:paused;animation-play-state:paused}/*!@:host(.ion-color) .progress-buffer-bar*/.ion-color.sc-ion-progress-bar-ios-h .progress-buffer-bar.sc-ion-progress-bar-ios{background:rgba(var(--ion-color-base-rgb), 0.3)}/*!@:host(.ion-color) .buffer-circles*/.ion-color.sc-ion-progress-bar-ios-h .buffer-circles.sc-ion-progress-bar-ios{background-image:radial-gradient(ellipse at center, rgba(var(--ion-color-base-rgb), 0.3) 0%, rgba(var(--ion-color-base-rgb), 0.3) 30%, transparent 30%)}/*!@:host(.ion-color) .progress,\n:host(.ion-color) .progress-indeterminate*/.ion-color.sc-ion-progress-bar-ios-h .progress.sc-ion-progress-bar-ios,.ion-color.sc-ion-progress-bar-ios-h .progress-indeterminate.sc-ion-progress-bar-ios{background:var(--ion-color-base)}@-webkit-keyframes primary-indeterminate-translate{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);-webkit-transform:translateX(83.67142%);transform:translateX(83.67142%)}100%{-webkit-transform:translateX(200.611057%);transform:translateX(200.611057%)}}@keyframes primary-indeterminate-translate{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);-webkit-transform:translateX(83.67142%);transform:translateX(83.67142%)}100%{-webkit-transform:translateX(200.611057%);transform:translateX(200.611057%)}}@-webkit-keyframes primary-indeterminate-scale{0%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}36.65%{-webkit-animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}69.15%{-webkit-animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);-webkit-transform:scaleX(0.661479);transform:scaleX(0.661479)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@keyframes primary-indeterminate-scale{0%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}36.65%{-webkit-animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}69.15%{-webkit-animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);-webkit-transform:scaleX(0.661479);transform:scaleX(0.661479)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@-webkit-keyframes secondary-indeterminate-translate{0%{-webkit-animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);-webkit-transform:translateX(37.651913%);transform:translateX(37.651913%)}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);-webkit-transform:translateX(84.386165%);transform:translateX(84.386165%)}100%{-webkit-transform:translateX(160.277782%);transform:translateX(160.277782%)}}@keyframes secondary-indeterminate-translate{0%{-webkit-animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);-webkit-transform:translateX(37.651913%);transform:translateX(37.651913%)}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);-webkit-transform:translateX(84.386165%);transform:translateX(84.386165%)}100%{-webkit-transform:translateX(160.277782%);transform:translateX(160.277782%)}}@-webkit-keyframes secondary-indeterminate-scale{0%{-webkit-animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}19.15%{-webkit-animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);-webkit-transform:scaleX(0.457104);transform:scaleX(0.457104)}44.15%{-webkit-animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);-webkit-transform:scaleX(0.72796);transform:scaleX(0.72796)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@keyframes secondary-indeterminate-scale{0%{-webkit-animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}19.15%{-webkit-animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);-webkit-transform:scaleX(0.457104);transform:scaleX(0.457104)}44.15%{-webkit-animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);-webkit-transform:scaleX(0.72796);transform:scaleX(0.72796)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@-webkit-keyframes buffering{to{-webkit-transform:translateX(-10px);transform:translateX(-10px)}}@keyframes buffering{to{-webkit-transform:translateX(-10px);transform:translateX(-10px)}}/*!@:host*/.sc-ion-progress-bar-ios-h{height:3px}";
const progressBarMdCss = "/*!@:host*/.sc-ion-progress-bar-md-h{--background:rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.3);--progress-background:var(--ion-color-primary, #3880ff);--buffer-background:var(--background);display:block;position:relative;width:100%;contain:strict;direction:ltr;overflow:hidden}/*!@.progress,\n.progress-indeterminate,\n.indeterminate-bar-primary,\n.indeterminate-bar-secondary,\n.progress-buffer-bar*/.progress.sc-ion-progress-bar-md,.progress-indeterminate.sc-ion-progress-bar-md,.indeterminate-bar-primary.sc-ion-progress-bar-md,.indeterminate-bar-secondary.sc-ion-progress-bar-md,.progress-buffer-bar.sc-ion-progress-bar-md{left:0;right:0;top:0;bottom:0;position:absolute;width:100%;height:100%}/*!@.buffer-circles-container,\n.buffer-circles*/.buffer-circles-container.sc-ion-progress-bar-md,.buffer-circles.sc-ion-progress-bar-md{left:0;right:0;top:0;bottom:0;position:absolute}/*!@.buffer-circles*/.buffer-circles.sc-ion-progress-bar-md{right:-10px;left:-10px}/*!@.progress,\n.progress-buffer-bar,\n.buffer-circles-container*/.progress.sc-ion-progress-bar-md,.progress-buffer-bar.sc-ion-progress-bar-md,.buffer-circles-container.sc-ion-progress-bar-md{-webkit-transform-origin:left top;transform-origin:left top;-webkit-transition:-webkit-transform 150ms linear;transition:-webkit-transform 150ms linear;transition:transform 150ms linear;transition:transform 150ms linear, -webkit-transform 150ms linear}/*!@.progress,\n.progress-indeterminate*/.progress.sc-ion-progress-bar-md,.progress-indeterminate.sc-ion-progress-bar-md{background:var(--progress-background);z-index:2}/*!@.progress-buffer-bar*/.progress-buffer-bar.sc-ion-progress-bar-md{background:var(--buffer-background);z-index:1}/*!@.buffer-circles-container*/.buffer-circles-container.sc-ion-progress-bar-md{overflow:hidden}/*!@.indeterminate-bar-primary*/.indeterminate-bar-primary.sc-ion-progress-bar-md{top:0;right:0;bottom:0;left:-145.166611%;-webkit-animation:primary-indeterminate-translate 2s infinite linear;animation:primary-indeterminate-translate 2s infinite linear}/*!@.indeterminate-bar-primary .progress-indeterminate*/.indeterminate-bar-primary.sc-ion-progress-bar-md .progress-indeterminate.sc-ion-progress-bar-md{-webkit-animation:primary-indeterminate-scale 2s infinite linear;animation:primary-indeterminate-scale 2s infinite linear;-webkit-animation-play-state:inherit;animation-play-state:inherit}/*!@.indeterminate-bar-secondary*/.indeterminate-bar-secondary.sc-ion-progress-bar-md{top:0;right:0;bottom:0;left:-54.888891%;-webkit-animation:secondary-indeterminate-translate 2s infinite linear;animation:secondary-indeterminate-translate 2s infinite linear}/*!@.indeterminate-bar-secondary .progress-indeterminate*/.indeterminate-bar-secondary.sc-ion-progress-bar-md .progress-indeterminate.sc-ion-progress-bar-md{-webkit-animation:secondary-indeterminate-scale 2s infinite linear;animation:secondary-indeterminate-scale 2s infinite linear;-webkit-animation-play-state:inherit;animation-play-state:inherit}/*!@.buffer-circles*/.buffer-circles.sc-ion-progress-bar-md{background-image:radial-gradient(ellipse at center, var(--buffer-background) 0%, var(--buffer-background) 30%, transparent 30%);background-repeat:repeat-x;background-position:5px center;background-size:10px 10px;z-index:0;-webkit-animation:buffering 450ms infinite linear;animation:buffering 450ms infinite linear}/*!@:host(.progress-bar-reversed)*/.progress-bar-reversed.sc-ion-progress-bar-md-h{-webkit-transform:scaleX(-1);transform:scaleX(-1)}/*!@:host(.progress-paused) .indeterminate-bar-secondary,\n:host(.progress-paused) .indeterminate-bar-primary,\n:host(.progress-paused) .buffer-circles*/.progress-paused.sc-ion-progress-bar-md-h .indeterminate-bar-secondary.sc-ion-progress-bar-md,.progress-paused.sc-ion-progress-bar-md-h .indeterminate-bar-primary.sc-ion-progress-bar-md,.progress-paused.sc-ion-progress-bar-md-h .buffer-circles.sc-ion-progress-bar-md{-webkit-animation-play-state:paused;animation-play-state:paused}/*!@:host(.ion-color) .progress-buffer-bar*/.ion-color.sc-ion-progress-bar-md-h .progress-buffer-bar.sc-ion-progress-bar-md{background:rgba(var(--ion-color-base-rgb), 0.3)}/*!@:host(.ion-color) .buffer-circles*/.ion-color.sc-ion-progress-bar-md-h .buffer-circles.sc-ion-progress-bar-md{background-image:radial-gradient(ellipse at center, rgba(var(--ion-color-base-rgb), 0.3) 0%, rgba(var(--ion-color-base-rgb), 0.3) 30%, transparent 30%)}/*!@:host(.ion-color) .progress,\n:host(.ion-color) .progress-indeterminate*/.ion-color.sc-ion-progress-bar-md-h .progress.sc-ion-progress-bar-md,.ion-color.sc-ion-progress-bar-md-h .progress-indeterminate.sc-ion-progress-bar-md{background:var(--ion-color-base)}@-webkit-keyframes primary-indeterminate-translate{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);-webkit-transform:translateX(83.67142%);transform:translateX(83.67142%)}100%{-webkit-transform:translateX(200.611057%);transform:translateX(200.611057%)}}@keyframes primary-indeterminate-translate{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);-webkit-transform:translateX(83.67142%);transform:translateX(83.67142%)}100%{-webkit-transform:translateX(200.611057%);transform:translateX(200.611057%)}}@-webkit-keyframes primary-indeterminate-scale{0%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}36.65%{-webkit-animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}69.15%{-webkit-animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);-webkit-transform:scaleX(0.661479);transform:scaleX(0.661479)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@keyframes primary-indeterminate-scale{0%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}36.65%{-webkit-animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}69.15%{-webkit-animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);-webkit-transform:scaleX(0.661479);transform:scaleX(0.661479)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@-webkit-keyframes secondary-indeterminate-translate{0%{-webkit-animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);-webkit-transform:translateX(37.651913%);transform:translateX(37.651913%)}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);-webkit-transform:translateX(84.386165%);transform:translateX(84.386165%)}100%{-webkit-transform:translateX(160.277782%);transform:translateX(160.277782%)}}@keyframes secondary-indeterminate-translate{0%{-webkit-animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);-webkit-transform:translateX(37.651913%);transform:translateX(37.651913%)}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);-webkit-transform:translateX(84.386165%);transform:translateX(84.386165%)}100%{-webkit-transform:translateX(160.277782%);transform:translateX(160.277782%)}}@-webkit-keyframes secondary-indeterminate-scale{0%{-webkit-animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}19.15%{-webkit-animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);-webkit-transform:scaleX(0.457104);transform:scaleX(0.457104)}44.15%{-webkit-animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);-webkit-transform:scaleX(0.72796);transform:scaleX(0.72796)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@keyframes secondary-indeterminate-scale{0%{-webkit-animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}19.15%{-webkit-animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);-webkit-transform:scaleX(0.457104);transform:scaleX(0.457104)}44.15%{-webkit-animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);-webkit-transform:scaleX(0.72796);transform:scaleX(0.72796)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@-webkit-keyframes buffering{to{-webkit-transform:translateX(-10px);transform:translateX(-10px)}}@keyframes buffering{to{-webkit-transform:translateX(-10px);transform:translateX(-10px)}}/*!@:host*/.sc-ion-progress-bar-md-h{height:4px}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part progress - The progress bar that shows the current value when `type` is `"determinate"` and slides back and forth when `type` is `"indeterminate"`.
* @part stream - The animated circles that appear while buffering. This only shows when `buffer` is set and `type` is `"determinate"`.
* @part track - The track bar behind the progress bar. If the `buffer` property is set and `type` is `"determinate"` the track will be the
* width of the `buffer` value.
*/
class ProgressBar {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* The state of the progress bar, based on if the time the process takes is known or not.
* Default options are: `"determinate"` (no animation), `"indeterminate"` (animate from left to right).
*/
this.type = 'determinate';
/**
* If true, reverse the progress bar direction.
*/
this.reversed = false;
/**
* The value determines how much of the active bar should display when the
* `type` is `"determinate"`.
* The value should be between [0, 1].
*/
this.value = 0;
/**
* If the buffer and value are smaller than 1, the buffer circles will show.
* The buffer should be between [0, 1].
*/
this.buffer = 1;
}
render() {
const { color, type, reversed, value, buffer } = this;
const paused = config.getBoolean('_testing');
const mode = getIonMode$1(this);
return (hAsync(Host, { role: "progressbar", "aria-valuenow": type === 'determinate' ? value : null, "aria-valuemin": "0", "aria-valuemax": "1", class: createColorClasses$1(color, {
[mode]: true,
[`progress-bar-${type}`]: true,
'progress-paused': paused,
'progress-bar-reversed': document.dir === 'rtl' ? !reversed : reversed
}) }, type === 'indeterminate'
? renderIndeterminate()
: renderProgress(value, buffer)));
}
static get style() { return {
ios: progressBarIosCss,
md: progressBarMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-progress-bar",
"$members$": {
"type": [1],
"reversed": [4],
"value": [2],
"buffer": [2],
"color": [513]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const renderIndeterminate = () => {
return (hAsync("div", { part: "track", class: "progress-buffer-bar" }, hAsync("div", { class: "indeterminate-bar-primary" }, hAsync("span", { part: "progress", class: "progress-indeterminate" })), hAsync("div", { class: "indeterminate-bar-secondary" }, hAsync("span", { part: "progress", class: "progress-indeterminate" }))));
};
const renderProgress = (value, buffer) => {
const finalValue = clamp(0, value, 1);
const finalBuffer = clamp(0, buffer, 1);
return [
hAsync("div", { part: "progress", class: "progress", style: { transform: `scaleX(${finalValue})` } }),
/**
* Buffer circles with two container to move
* the circles behind the buffer progress
* with respecting the animation.
* When finalBuffer === 1, we use display: none
* instead of removing the element to avoid flickering.
*/
hAsync("div", { class: { 'buffer-circles-container': true, 'ion-hide': finalBuffer === 1 }, style: { transform: `translateX(${finalBuffer * 100}%)` } }, hAsync("div", { class: "buffer-circles-container", style: { transform: `translateX(-${finalBuffer * 100}%)` } }, hAsync("div", { part: "stream", class: "buffer-circles" }))),
hAsync("div", { part: "track", class: "progress-buffer-bar", style: { transform: `scaleX(${finalBuffer})` } }),
];
};
const radioIosCss = "/*!@:host*/.sc-ion-radio-ios-h{--inner-border-radius:50%;display:inline-block;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}/*!@:host(.radio-disabled)*/.radio-disabled.sc-ion-radio-ios-h{pointer-events:none}/*!@.radio-icon*/.radio-icon.sc-ion-radio-ios{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;contain:layout size style}/*!@.radio-icon,\n.radio-inner*/.radio-icon.sc-ion-radio-ios,.radio-inner.sc-ion-radio-ios{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@label*/label.sc-ion-radio-ios{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:0}/*!@[dir=rtl] label, :host-context([dir=rtl]) label*/[dir=rtl].sc-ion-radio-ios label.sc-ion-radio-ios,[dir=rtl].sc-ion-radio-ios-h label.sc-ion-radio-ios,[dir=rtl] .sc-ion-radio-ios-h label.sc-ion-radio-ios{left:unset;right:unset;right:0}/*!@label::-moz-focus-inner*/label.sc-ion-radio-ios::-moz-focus-inner{border:0}/*!@input*/input.sc-ion-radio-ios{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}/*!@:host(:focus)*/.sc-ion-radio-ios-h:focus{outline:none}/*!@:host*/.sc-ion-radio-ios-h{--color-checked:var(--ion-color-primary, #3880ff);width:15px;height:24px}/*!@:host(.ion-color.radio-checked) .radio-inner*/.ion-color.radio-checked.sc-ion-radio-ios-h .radio-inner.sc-ion-radio-ios{border-color:var(--ion-color-base)}/*!@.item-radio.item-ios ion-label*/.item-radio.item-ios.sc-ion-radio-ios ion-label.sc-ion-radio-ios{margin-left:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.item-radio.item-ios ion-label*/.item-radio.item-ios.sc-ion-radio-ios ion-label.sc-ion-radio-ios{margin-left:unset;-webkit-margin-start:0;margin-inline-start:0}}/*!@.radio-inner*/.radio-inner.sc-ion-radio-ios{width:33%;height:50%}/*!@:host(.radio-checked) .radio-inner*/.radio-checked.sc-ion-radio-ios-h .radio-inner.sc-ion-radio-ios{-webkit-transform:rotate(45deg);transform:rotate(45deg);border-width:2px;border-top-width:0;border-left-width:0;border-style:solid;border-color:var(--color-checked)}/*!@:host(.radio-disabled)*/.radio-disabled.sc-ion-radio-ios-h{opacity:0.3}/*!@:host(.ion-focused) .radio-icon::after*/.ion-focused.sc-ion-radio-ios-h .radio-icon.sc-ion-radio-ios::after{border-radius:var(--inner-border-radius);left:-9px;top:-8px;display:block;position:absolute;width:36px;height:36px;background:var(--ion-color-primary-tint, #4c8dff);content:\"\";opacity:0.2}/*!@:host-context([dir=rtl]):host(.ion-focused) .radio-icon::after, :host-context([dir=rtl]).ion-focused .radio-icon::after*/[dir=rtl].sc-ion-radio-ios-h -no-combinator.ion-focused.sc-ion-radio-ios-h .radio-icon.sc-ion-radio-ios::after,[dir=rtl] .sc-ion-radio-ios-h -no-combinator.ion-focused.sc-ion-radio-ios-h .radio-icon.sc-ion-radio-ios::after,[dir=rtl].ion-focused.sc-ion-radio-ios-h .radio-icon.sc-ion-radio-ios::after,[dir=rtl] .ion-focused.sc-ion-radio-ios-h .radio-icon.sc-ion-radio-ios::after{left:unset;right:unset;right:-9px}/*!@:host(.in-item)*/.in-item.sc-ion-radio-ios-h{margin-left:10px;margin-right:11px;margin-top:8px;margin-bottom:8px;display:block;position:static}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-item)*/.in-item.sc-ion-radio-ios-h{margin-left:unset;margin-right:unset;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:11px;margin-inline-end:11px}}/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-radio-ios-h{margin-left:3px;margin-right:21px;margin-top:8px;margin-bottom:8px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-radio-ios-h{margin-left:unset;margin-right:unset;-webkit-margin-start:3px;margin-inline-start:3px;-webkit-margin-end:21px;margin-inline-end:21px}}";
const radioMdCss = "/*!@:host*/.sc-ion-radio-md-h{--inner-border-radius:50%;display:inline-block;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}/*!@:host(.radio-disabled)*/.radio-disabled.sc-ion-radio-md-h{pointer-events:none}/*!@.radio-icon*/.radio-icon.sc-ion-radio-md{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;contain:layout size style}/*!@.radio-icon,\n.radio-inner*/.radio-icon.sc-ion-radio-md,.radio-inner.sc-ion-radio-md{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@label*/label.sc-ion-radio-md{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:0}/*!@[dir=rtl] label, :host-context([dir=rtl]) label*/[dir=rtl].sc-ion-radio-md label.sc-ion-radio-md,[dir=rtl].sc-ion-radio-md-h label.sc-ion-radio-md,[dir=rtl] .sc-ion-radio-md-h label.sc-ion-radio-md{left:unset;right:unset;right:0}/*!@label::-moz-focus-inner*/label.sc-ion-radio-md::-moz-focus-inner{border:0}/*!@input*/input.sc-ion-radio-md{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}/*!@:host(:focus)*/.sc-ion-radio-md-h:focus{outline:none}/*!@:host*/.sc-ion-radio-md-h{--color:var(--ion-color-step-400, #999999);--color-checked:var(--ion-color-primary, #3880ff);--border-width:2px;--border-style:solid;--border-radius:50%;width:20px;height:20px}/*!@:host(.ion-color) .radio-inner*/.ion-color.sc-ion-radio-md-h .radio-inner.sc-ion-radio-md{background:var(--ion-color-base)}/*!@:host(.ion-color.radio-checked) .radio-icon*/.ion-color.radio-checked.sc-ion-radio-md-h .radio-icon.sc-ion-radio-md{border-color:var(--ion-color-base)}/*!@.radio-icon*/.radio-icon.sc-ion-radio-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;border-radius:var(--border-radius);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--color)}/*!@.radio-inner*/.radio-inner.sc-ion-radio-md{border-radius:var(--inner-border-radius);width:calc(50% + var(--border-width));height:calc(50% + var(--border-width));-webkit-transform:scale3d(0, 0, 0);transform:scale3d(0, 0, 0);-webkit-transition:-webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);transition:-webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 280ms cubic-bezier(0.4, 0, 0.2, 1);transition:transform 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);background:var(--color-checked)}/*!@:host(.radio-checked) .radio-icon*/.radio-checked.sc-ion-radio-md-h .radio-icon.sc-ion-radio-md{border-color:var(--color-checked)}/*!@:host(.radio-checked) .radio-inner*/.radio-checked.sc-ion-radio-md-h .radio-inner.sc-ion-radio-md{-webkit-transform:scale3d(1, 1, 1);transform:scale3d(1, 1, 1)}/*!@:host(.radio-disabled)*/.radio-disabled.sc-ion-radio-md-h{opacity:0.3}/*!@:host(.ion-focused) .radio-icon::after*/.ion-focused.sc-ion-radio-md-h .radio-icon.sc-ion-radio-md::after{border-radius:var(--inner-border-radius);left:-12px;top:-12px;display:block;position:absolute;width:36px;height:36px;background:var(--ion-color-primary-tint, #4c8dff);content:\"\";opacity:0.2}/*!@:host-context([dir=rtl]):host(.ion-focused) .radio-icon::after, :host-context([dir=rtl]).ion-focused .radio-icon::after*/[dir=rtl].sc-ion-radio-md-h -no-combinator.ion-focused.sc-ion-radio-md-h .radio-icon.sc-ion-radio-md::after,[dir=rtl] .sc-ion-radio-md-h -no-combinator.ion-focused.sc-ion-radio-md-h .radio-icon.sc-ion-radio-md::after,[dir=rtl].ion-focused.sc-ion-radio-md-h .radio-icon.sc-ion-radio-md::after,[dir=rtl] .ion-focused.sc-ion-radio-md-h .radio-icon.sc-ion-radio-md::after{left:unset;right:unset;right:-12px}/*!@:host(.in-item)*/.in-item.sc-ion-radio-md-h{margin-left:0;margin-right:0;margin-top:9px;margin-bottom:9px;display:block;position:static}/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-radio-md-h{margin-left:4px;margin-right:36px;margin-top:11px;margin-bottom:10px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-radio-md-h{margin-left:unset;margin-right:unset;-webkit-margin-start:4px;margin-inline-start:4px;-webkit-margin-end:36px;margin-inline-end:36px}}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part container - The container for the radio mark.
* @part mark - The checkmark or dot used to indicate the checked state.
*/
class Radio {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionStyle = createEvent(this, "ionStyle", 7);
this.ionFocus = createEvent(this, "ionFocus", 7);
this.ionBlur = createEvent(this, "ionBlur", 7);
this.inputId = `ion-rb-${radioButtonIds++}`;
this.radioGroup = null;
/**
* If `true`, the radio is selected.
*/
this.checked = false;
/**
* The tabindex of the radio button.
* @internal
*/
this.buttonTabindex = -1;
/**
* The name of the control, which is submitted with the form data.
*/
this.name = this.inputId;
/**
* If `true`, the user cannot interact with the radio.
*/
this.disabled = false;
this.updateState = () => {
if (this.radioGroup) {
this.checked = this.radioGroup.value === this.value;
}
};
this.onFocus = () => {
this.ionFocus.emit();
};
this.onBlur = () => {
this.ionBlur.emit();
};
}
/** @internal */
async setFocus(ev) {
ev.stopPropagation();
ev.preventDefault();
this.el.focus();
}
/** @internal */
async setButtonTabindex(value) {
this.buttonTabindex = value;
}
connectedCallback() {
if (this.value === undefined) {
this.value = this.inputId;
}
const radioGroup = this.radioGroup = this.el.closest('ion-radio-group');
if (radioGroup) {
this.updateState();
addEventListener(radioGroup, 'ionChange', this.updateState);
}
}
disconnectedCallback() {
const radioGroup = this.radioGroup;
if (radioGroup) {
removeEventListener(radioGroup, 'ionChange', this.updateState);
this.radioGroup = null;
}
}
componentWillLoad() {
this.emitStyle();
}
emitStyle() {
this.ionStyle.emit({
'radio-checked': this.checked,
'interactive-disabled': this.disabled,
});
}
render() {
const { inputId, disabled, checked, color, el, buttonTabindex } = this;
const mode = getIonMode$1(this);
const { label, labelId, labelText } = getAriaLabel(el, inputId);
return (hAsync(Host, { "aria-checked": `${checked}`, "aria-hidden": disabled ? 'true' : null, "aria-labelledby": label ? labelId : null, role: "radio", tabindex: buttonTabindex, onFocus: this.onFocus, onBlur: this.onBlur, class: createColorClasses$1(color, {
[mode]: true,
'in-item': hostContext('ion-item', el),
'interactive': true,
'radio-checked': checked,
'radio-disabled': disabled,
}) }, hAsync("div", { class: "radio-icon", part: "container" }, hAsync("div", { class: "radio-inner", part: "mark" }), hAsync("div", { class: "radio-ripple" })), hAsync("label", { htmlFor: inputId }, labelText), hAsync("input", { type: "radio", checked: checked, disabled: disabled, tabindex: "-1", id: inputId })));
}
get el() { return getElement(this); }
static get watchers() { return {
"color": ["emitStyle"],
"checked": ["emitStyle"],
"disabled": ["emitStyle"]
}; }
static get style() { return {
ios: radioIosCss,
md: radioMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-radio",
"$members$": {
"color": [513],
"name": [1],
"disabled": [4],
"value": [8],
"checked": [32],
"buttonTabindex": [32],
"setFocus": [64],
"setButtonTabindex": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
let radioButtonIds = 0;
class RadioGroup {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionChange = createEvent(this, "ionChange", 7);
this.inputId = `ion-rg-${radioGroupIds++}`;
this.labelId = `${this.inputId}-lbl`;
/**
* If `true`, the radios can be deselected.
*/
this.allowEmptySelection = false;
/**
* The name of the control, which is submitted with the form data.
*/
this.name = this.inputId;
this.setRadioTabindex = (value) => {
const radios = this.getRadios();
// Get the first radio that is not disabled and the checked one
const first = radios.find(radio => !radio.disabled);
const checked = radios.find(radio => (radio.value === value && !radio.disabled));
if (!first && !checked) {
return;
}
// If an enabled checked radio exists, set it to be the focusable radio
// otherwise we default to focus the first radio
const focusable = checked || first;
for (const radio of radios) {
const tabindex = radio === focusable ? 0 : -1;
radio.setButtonTabindex(tabindex);
}
};
this.onClick = (ev) => {
ev.preventDefault();
const selectedRadio = ev.target && ev.target.closest('ion-radio');
if (selectedRadio) {
const currentValue = this.value;
const newValue = selectedRadio.value;
if (newValue !== currentValue) {
this.value = newValue;
}
else if (this.allowEmptySelection) {
this.value = undefined;
}
}
};
}
valueChanged(value) {
this.setRadioTabindex(value);
this.ionChange.emit({ value });
}
componentDidLoad() {
this.setRadioTabindex(this.value);
}
async connectedCallback() {
// Get the list header if it exists and set the id
// this is used to set aria-labelledby
const header = this.el.querySelector('ion-list-header') || this.el.querySelector('ion-item-divider');
if (header) {
const label = this.label = header.querySelector('ion-label');
if (label) {
this.labelId = label.id = this.name + '-lbl';
}
}
}
getRadios() {
return Array.from(this.el.querySelectorAll('ion-radio'));
}
onKeydown(ev) {
const inSelectPopover = !!this.el.closest('ion-select-popover');
if (ev.target && !this.el.contains(ev.target)) {
return;
}
// Get all radios inside of the radio group and then
// filter out disabled radios since we need to skip those
const radios = this.getRadios().filter(radio => !radio.disabled);
// Only move the radio if the current focus is in the radio group
if (ev.target && radios.includes(ev.target)) {
const index = radios.findIndex(radio => radio === ev.target);
const current = radios[index];
let next;
// If hitting arrow down or arrow right, move to the next radio
// If we're on the last radio, move to the first radio
if (['ArrowDown', 'ArrowRight'].includes(ev.code)) {
next = (index === radios.length - 1)
? radios[0]
: radios[index + 1];
}
// If hitting arrow up or arrow left, move to the previous radio
// If we're on the first radio, move to the last radio
if (['ArrowUp', 'ArrowLeft'].includes(ev.code)) {
next = (index === 0)
? radios[radios.length - 1]
: radios[index - 1];
}
if (next && radios.includes(next)) {
next.setFocus(ev);
if (!inSelectPopover) {
this.value = next.value;
}
}
// Update the radio group value when a user presses the
// space bar on top of a selected radio
if (['Space'].includes(ev.code)) {
this.value = (this.allowEmptySelection && this.value !== undefined)
? undefined
: current.value;
// Prevent browsers from jumping
// to the bottom of the screen
ev.preventDefault();
}
}
}
render() {
const { label, labelId } = this;
const mode = getIonMode$1(this);
return (hAsync(Host, { role: "radiogroup", "aria-labelledby": label ? labelId : null, onClick: this.onClick, class: mode }));
}
get el() { return getElement(this); }
static get watchers() { return {
"value": ["valueChanged"]
}; }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-radio-group",
"$members$": {
"allowEmptySelection": [4, "allow-empty-selection"],
"name": [1],
"value": [1032]
},
"$listeners$": [[4, "keydown", "onKeydown"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
let radioGroupIds = 0;
const rangeIosCss = "/*!@:host*/.sc-ion-range-ios-h{--knob-handle-size:calc(var(--knob-size) * 2);display:-ms-flexbox;display:flex;position:relative;-ms-flex:3;flex:3;-ms-flex-align:center;align-items:center;font-family:var(--ion-font-family, inherit);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}/*!@:host(.range-disabled)*/.range-disabled.sc-ion-range-ios-h{pointer-events:none}/*!@::slotted(ion-label)*/.sc-ion-range-ios-s>ion-label{-ms-flex:initial;flex:initial}/*!@::slotted(ion-icon[slot])*/.sc-ion-range-ios-s>ion-icon[slot]{font-size:24px}/*!@.range-slider*/.range-slider.sc-ion-range-ios{position:relative;-ms-flex:1;flex:1;width:100%;height:var(--height);contain:size layout style;cursor:-webkit-grab;cursor:grab;-ms-touch-action:pan-y;touch-action:pan-y}/*!@:host(.range-pressed) .range-slider*/.range-pressed.sc-ion-range-ios-h .range-slider.sc-ion-range-ios{cursor:-webkit-grabbing;cursor:grabbing}/*!@.range-pin*/.range-pin.sc-ion-range-ios{position:absolute;background:var(--ion-color-base);color:var(--ion-color-contrast);text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box}/*!@.range-knob-handle*/.range-knob-handle.sc-ion-range-ios{left:0;top:calc((var(--height) - var(--knob-handle-size)) / 2);margin-left:calc(0px - var(--knob-handle-size) / 2);position:absolute;width:var(--knob-handle-size);height:var(--knob-handle-size);text-align:center}/*!@[dir=rtl] .range-knob-handle, :host-context([dir=rtl]) .range-knob-handle*/[dir=rtl].sc-ion-range-ios .range-knob-handle.sc-ion-range-ios,[dir=rtl].sc-ion-range-ios-h .range-knob-handle.sc-ion-range-ios,[dir=rtl] .sc-ion-range-ios-h .range-knob-handle.sc-ion-range-ios{left:unset;right:unset;right:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.range-knob-handle*/.range-knob-handle.sc-ion-range-ios{margin-left:unset;-webkit-margin-start:calc(0px - var(--knob-handle-size) / 2);margin-inline-start:calc(0px - var(--knob-handle-size) / 2)}}/*!@[dir=rtl] .range-knob-handle, :host-context([dir=rtl]) .range-knob-handle*/[dir=rtl].sc-ion-range-ios .range-knob-handle.sc-ion-range-ios,[dir=rtl].sc-ion-range-ios-h .range-knob-handle.sc-ion-range-ios,[dir=rtl] .sc-ion-range-ios-h .range-knob-handle.sc-ion-range-ios{left:unset}/*!@.range-knob-handle:active, .range-knob-handle:focus*/.range-knob-handle.sc-ion-range-ios:active,.range-knob-handle.sc-ion-range-ios:focus{outline:none}/*!@.range-bar*/.range-bar.sc-ion-range-ios{border-radius:var(--bar-border-radius);left:0;top:calc((var(--height) - var(--bar-height)) / 2);position:absolute;width:100%;height:var(--bar-height);background:var(--bar-background);pointer-events:none}/*!@[dir=rtl] .range-bar, :host-context([dir=rtl]) .range-bar*/[dir=rtl].sc-ion-range-ios .range-bar.sc-ion-range-ios,[dir=rtl].sc-ion-range-ios-h .range-bar.sc-ion-range-ios,[dir=rtl] .sc-ion-range-ios-h .range-bar.sc-ion-range-ios{left:unset;right:unset;right:0}/*!@[dir=rtl] .range-bar, :host-context([dir=rtl]) .range-bar*/[dir=rtl].sc-ion-range-ios .range-bar.sc-ion-range-ios,[dir=rtl].sc-ion-range-ios-h .range-bar.sc-ion-range-ios,[dir=rtl] .sc-ion-range-ios-h .range-bar.sc-ion-range-ios{left:unset}/*!@.range-knob*/.range-knob.sc-ion-range-ios{border-radius:var(--knob-border-radius);left:calc(50% - var(--knob-size) / 2);top:calc(50% - var(--knob-size) / 2);position:absolute;width:var(--knob-size);height:var(--knob-size);background:var(--knob-background);-webkit-box-shadow:var(--knob-box-shadow);box-shadow:var(--knob-box-shadow);z-index:2;pointer-events:none}/*!@[dir=rtl] .range-knob, :host-context([dir=rtl]) .range-knob*/[dir=rtl].sc-ion-range-ios .range-knob.sc-ion-range-ios,[dir=rtl].sc-ion-range-ios-h .range-knob.sc-ion-range-ios,[dir=rtl] .sc-ion-range-ios-h .range-knob.sc-ion-range-ios{left:unset;right:unset;right:calc(50% - var(--knob-size) / 2)}/*!@[dir=rtl] .range-knob, :host-context([dir=rtl]) .range-knob*/[dir=rtl].sc-ion-range-ios .range-knob.sc-ion-range-ios,[dir=rtl].sc-ion-range-ios-h .range-knob.sc-ion-range-ios,[dir=rtl] .sc-ion-range-ios-h .range-knob.sc-ion-range-ios{left:unset}/*!@:host(.range-pressed) .range-bar-active*/.range-pressed.sc-ion-range-ios-h .range-bar-active.sc-ion-range-ios{will-change:left, right}/*!@:host(.in-item)*/.in-item.sc-ion-range-ios-h{width:100%}/*!@:host(.in-item) ::slotted(ion-label)*/.sc-ion-range-ios-h.in-item .sc-ion-range-ios-s>ion-label{-ms-flex-item-align:center;align-self:center}/*!@:host*/.sc-ion-range-ios-h{--knob-border-radius:50%;--knob-background:#ffffff;--knob-box-shadow:0 3px 1px rgba(0, 0, 0, 0.1), 0 4px 8px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(0, 0, 0, 0.02);--knob-size:28px;--bar-height:2px;--bar-background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.1);--bar-background-active:var(--ion-color-primary, #3880ff);--bar-border-radius:0;--height:42px;padding-left:16px;padding-right:16px;padding-top:8px;padding-bottom:8px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-range-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px}}/*!@:host(.ion-color) .range-bar-active,\n:host(.ion-color) .range-tick-active*/.ion-color.sc-ion-range-ios-h .range-bar-active.sc-ion-range-ios,.ion-color.sc-ion-range-ios-h .range-tick-active.sc-ion-range-ios{background:var(--ion-color-base)}/*!@::slotted([slot=start])*/.sc-ion-range-ios-s>[slot=start]{margin-left:0;margin-right:16px;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=start])*/.sc-ion-range-ios-s>[slot=start]{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px}}/*!@::slotted([slot=end])*/.sc-ion-range-ios-s>[slot=end]{margin-left:16px;margin-right:0;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=end])*/.sc-ion-range-ios-s>[slot=end]{margin-left:unset;margin-right:unset;-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}}/*!@:host(.range-has-pin)*/.range-has-pin.sc-ion-range-ios-h{padding-top:20px}/*!@.range-bar-active*/.range-bar-active.sc-ion-range-ios{bottom:0;width:auto;background:var(--bar-background-active)}/*!@.range-tick*/.range-tick.sc-ion-range-ios{margin-left:-1px;border-radius:0;position:absolute;top:18px;width:2px;height:8px;background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.1);pointer-events:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.range-tick*/.range-tick.sc-ion-range-ios{margin-left:unset;-webkit-margin-start:-1px;margin-inline-start:-1px}}/*!@.range-tick-active*/.range-tick-active.sc-ion-range-ios{background:var(--bar-background-active)}/*!@.range-pin*/.range-pin.sc-ion-range-ios{-webkit-transform:translate3d(0, 28px, 0) scale(0.01);transform:translate3d(0, 28px, 0) scale(0.01);padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px;display:inline-block;position:relative;top:-20px;min-width:28px;-webkit-transition:-webkit-transform 120ms ease;transition:-webkit-transform 120ms ease;transition:transform 120ms ease;transition:transform 120ms ease, -webkit-transform 120ms ease;background:transparent;color:var(--ion-text-color, #000);font-size:12px;text-align:center}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.range-pin*/.range-pin.sc-ion-range-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px}}/*!@.range-knob-pressed .range-pin*/.range-knob-pressed.sc-ion-range-ios .range-pin.sc-ion-range-ios{-webkit-transform:translate3d(0, 0, 0) scale(1);transform:translate3d(0, 0, 0) scale(1)}/*!@:host(.range-disabled)*/.range-disabled.sc-ion-range-ios-h{opacity:0.5}";
const rangeMdCss = "/*!@:host*/.sc-ion-range-md-h{--knob-handle-size:calc(var(--knob-size) * 2);display:-ms-flexbox;display:flex;position:relative;-ms-flex:3;flex:3;-ms-flex-align:center;align-items:center;font-family:var(--ion-font-family, inherit);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}/*!@:host(.range-disabled)*/.range-disabled.sc-ion-range-md-h{pointer-events:none}/*!@::slotted(ion-label)*/.sc-ion-range-md-s>ion-label{-ms-flex:initial;flex:initial}/*!@::slotted(ion-icon[slot])*/.sc-ion-range-md-s>ion-icon[slot]{font-size:24px}/*!@.range-slider*/.range-slider.sc-ion-range-md{position:relative;-ms-flex:1;flex:1;width:100%;height:var(--height);contain:size layout style;cursor:-webkit-grab;cursor:grab;-ms-touch-action:pan-y;touch-action:pan-y}/*!@:host(.range-pressed) .range-slider*/.range-pressed.sc-ion-range-md-h .range-slider.sc-ion-range-md{cursor:-webkit-grabbing;cursor:grabbing}/*!@.range-pin*/.range-pin.sc-ion-range-md{position:absolute;background:var(--ion-color-base);color:var(--ion-color-contrast);text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box}/*!@.range-knob-handle*/.range-knob-handle.sc-ion-range-md{left:0;top:calc((var(--height) - var(--knob-handle-size)) / 2);margin-left:calc(0px - var(--knob-handle-size) / 2);position:absolute;width:var(--knob-handle-size);height:var(--knob-handle-size);text-align:center}/*!@[dir=rtl] .range-knob-handle, :host-context([dir=rtl]) .range-knob-handle*/[dir=rtl].sc-ion-range-md .range-knob-handle.sc-ion-range-md,[dir=rtl].sc-ion-range-md-h .range-knob-handle.sc-ion-range-md,[dir=rtl] .sc-ion-range-md-h .range-knob-handle.sc-ion-range-md{left:unset;right:unset;right:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.range-knob-handle*/.range-knob-handle.sc-ion-range-md{margin-left:unset;-webkit-margin-start:calc(0px - var(--knob-handle-size) / 2);margin-inline-start:calc(0px - var(--knob-handle-size) / 2)}}/*!@[dir=rtl] .range-knob-handle, :host-context([dir=rtl]) .range-knob-handle*/[dir=rtl].sc-ion-range-md .range-knob-handle.sc-ion-range-md,[dir=rtl].sc-ion-range-md-h .range-knob-handle.sc-ion-range-md,[dir=rtl] .sc-ion-range-md-h .range-knob-handle.sc-ion-range-md{left:unset}/*!@.range-knob-handle:active, .range-knob-handle:focus*/.range-knob-handle.sc-ion-range-md:active,.range-knob-handle.sc-ion-range-md:focus{outline:none}/*!@.range-bar*/.range-bar.sc-ion-range-md{border-radius:var(--bar-border-radius);left:0;top:calc((var(--height) - var(--bar-height)) / 2);position:absolute;width:100%;height:var(--bar-height);background:var(--bar-background);pointer-events:none}/*!@[dir=rtl] .range-bar, :host-context([dir=rtl]) .range-bar*/[dir=rtl].sc-ion-range-md .range-bar.sc-ion-range-md,[dir=rtl].sc-ion-range-md-h .range-bar.sc-ion-range-md,[dir=rtl] .sc-ion-range-md-h .range-bar.sc-ion-range-md{left:unset;right:unset;right:0}/*!@[dir=rtl] .range-bar, :host-context([dir=rtl]) .range-bar*/[dir=rtl].sc-ion-range-md .range-bar.sc-ion-range-md,[dir=rtl].sc-ion-range-md-h .range-bar.sc-ion-range-md,[dir=rtl] .sc-ion-range-md-h .range-bar.sc-ion-range-md{left:unset}/*!@.range-knob*/.range-knob.sc-ion-range-md{border-radius:var(--knob-border-radius);left:calc(50% - var(--knob-size) / 2);top:calc(50% - var(--knob-size) / 2);position:absolute;width:var(--knob-size);height:var(--knob-size);background:var(--knob-background);-webkit-box-shadow:var(--knob-box-shadow);box-shadow:var(--knob-box-shadow);z-index:2;pointer-events:none}/*!@[dir=rtl] .range-knob, :host-context([dir=rtl]) .range-knob*/[dir=rtl].sc-ion-range-md .range-knob.sc-ion-range-md,[dir=rtl].sc-ion-range-md-h .range-knob.sc-ion-range-md,[dir=rtl] .sc-ion-range-md-h .range-knob.sc-ion-range-md{left:unset;right:unset;right:calc(50% - var(--knob-size) / 2)}/*!@[dir=rtl] .range-knob, :host-context([dir=rtl]) .range-knob*/[dir=rtl].sc-ion-range-md .range-knob.sc-ion-range-md,[dir=rtl].sc-ion-range-md-h .range-knob.sc-ion-range-md,[dir=rtl] .sc-ion-range-md-h .range-knob.sc-ion-range-md{left:unset}/*!@:host(.range-pressed) .range-bar-active*/.range-pressed.sc-ion-range-md-h .range-bar-active.sc-ion-range-md{will-change:left, right}/*!@:host(.in-item)*/.in-item.sc-ion-range-md-h{width:100%}/*!@:host(.in-item) ::slotted(ion-label)*/.sc-ion-range-md-h.in-item .sc-ion-range-md-s>ion-label{-ms-flex-item-align:center;align-self:center}/*!@:host*/.sc-ion-range-md-h{--knob-border-radius:50%;--knob-background:var(--bar-background-active);--knob-box-shadow:none;--knob-size:18px;--bar-height:2px;--bar-background:rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.26);--bar-background-active:var(--ion-color-primary, #3880ff);--bar-border-radius:0;--height:42px;--pin-background:var(--ion-color-primary, #3880ff);--pin-color:var(--ion-color-primary-contrast, #fff);padding-left:14px;padding-right:14px;padding-top:8px;padding-bottom:8px;font-size:12px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-range-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:14px;padding-inline-start:14px;-webkit-padding-end:14px;padding-inline-end:14px}}/*!@:host(.ion-color) .range-bar*/.ion-color.sc-ion-range-md-h .range-bar.sc-ion-range-md{background:rgba(var(--ion-color-base-rgb), 0.26)}/*!@:host(.ion-color) .range-bar-active,\n:host(.ion-color) .range-knob,\n:host(.ion-color) .range-pin,\n:host(.ion-color) .range-pin::before,\n:host(.ion-color) .range-tick*/.ion-color.sc-ion-range-md-h .range-bar-active.sc-ion-range-md,.ion-color.sc-ion-range-md-h .range-knob.sc-ion-range-md,.ion-color.sc-ion-range-md-h .range-pin.sc-ion-range-md,.ion-color.sc-ion-range-md-h .range-pin.sc-ion-range-md::before,.ion-color.sc-ion-range-md-h .range-tick.sc-ion-range-md{background:var(--ion-color-base);color:var(--ion-color-contrast)}/*!@::slotted([slot=start])*/.sc-ion-range-md-s>[slot=start]{margin-left:0;margin-right:14px;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=start])*/.sc-ion-range-md-s>[slot=start]{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:14px;margin-inline-end:14px}}/*!@::slotted([slot=end])*/.sc-ion-range-md-s>[slot=end]{margin-left:14px;margin-right:0;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted([slot=end])*/.sc-ion-range-md-s>[slot=end]{margin-left:unset;margin-right:unset;-webkit-margin-start:14px;margin-inline-start:14px;-webkit-margin-end:0;margin-inline-end:0}}/*!@:host(.range-has-pin)*/.range-has-pin.sc-ion-range-md-h{padding-top:28px}/*!@.range-bar-active*/.range-bar-active.sc-ion-range-md{bottom:0;width:auto;background:var(--bar-background-active)}/*!@.range-knob*/.range-knob.sc-ion-range-md{-webkit-transform:scale(0.67);transform:scale(0.67);-webkit-transition-duration:120ms;transition-duration:120ms;-webkit-transition-property:background-color, border, -webkit-transform;transition-property:background-color, border, -webkit-transform;transition-property:transform, background-color, border;transition-property:transform, background-color, border, -webkit-transform;-webkit-transition-timing-function:ease;transition-timing-function:ease;z-index:2}/*!@.range-tick*/.range-tick.sc-ion-range-md{position:absolute;top:calc((var(--height) - var(--bar-height)) / 2);width:var(--bar-height);height:var(--bar-height);background:var(--bar-background-active);z-index:1;pointer-events:none}/*!@.range-tick-active*/.range-tick-active.sc-ion-range-md{background:transparent}/*!@.range-pin*/.range-pin.sc-ion-range-md{padding-left:0;padding-right:0;padding-top:8px;padding-bottom:8px;border-radius:50%;-webkit-transform:translate3d(0, 0, 0) scale(0.01);transform:translate3d(0, 0, 0) scale(0.01);display:inline-block;position:relative;min-width:28px;height:28px;-webkit-transition:background 120ms ease, -webkit-transform 120ms ease;transition:background 120ms ease, -webkit-transform 120ms ease;transition:transform 120ms ease, background 120ms ease;transition:transform 120ms ease, background 120ms ease, -webkit-transform 120ms ease;background:var(--pin-background);color:var(--pin-color);text-align:center}/*!@.range-pin::before*/.range-pin.sc-ion-range-md::before{left:50%;top:3px;margin-left:-13px;border-radius:50% 50% 50% 0;position:absolute;width:26px;height:26px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition:background 120ms ease;transition:background 120ms ease;background:var(--pin-background);content:\"\";z-index:-1}/*!@[dir=rtl] .range-pin::before, :host-context([dir=rtl]) .range-pin::before*/[dir=rtl].sc-ion-range-md .range-pin.sc-ion-range-md::before,[dir=rtl].sc-ion-range-md-h .range-pin.sc-ion-range-md::before,[dir=rtl] .sc-ion-range-md-h .range-pin.sc-ion-range-md::before{left:unset;right:unset;right:50%}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.range-pin::before*/.range-pin.sc-ion-range-md::before{margin-left:unset;-webkit-margin-start:-13px;margin-inline-start:-13px}}/*!@[dir=rtl] .range-pin::before, :host-context([dir=rtl]) .range-pin::before*/[dir=rtl].sc-ion-range-md .range-pin.sc-ion-range-md::before,[dir=rtl].sc-ion-range-md-h .range-pin.sc-ion-range-md::before,[dir=rtl] .sc-ion-range-md-h .range-pin.sc-ion-range-md::before{left:unset}/*!@.range-knob-pressed .range-pin*/.range-knob-pressed.sc-ion-range-md .range-pin.sc-ion-range-md{-webkit-transform:translate3d(0, -24px, 0) scale(1);transform:translate3d(0, -24px, 0) scale(1)}/*!@:host(:not(.range-has-pin)) .range-knob-pressed .range-knob*/.sc-ion-range-md-h:not(.range-has-pin) .range-knob-pressed.sc-ion-range-md .range-knob.sc-ion-range-md{-webkit-transform:scale(1);transform:scale(1)}/*!@:host(.range-disabled) .range-bar-active,\n:host(.range-disabled) .range-bar,\n:host(.range-disabled) .range-tick*/.range-disabled.sc-ion-range-md-h .range-bar-active.sc-ion-range-md,.range-disabled.sc-ion-range-md-h .range-bar.sc-ion-range-md,.range-disabled.sc-ion-range-md-h .range-tick.sc-ion-range-md{background-color:var(--ion-color-step-250, #bfbfbf)}/*!@:host(.range-disabled) .range-knob*/.range-disabled.sc-ion-range-md-h .range-knob.sc-ion-range-md{-webkit-transform:scale(0.55);transform:scale(0.55);outline:5px solid #fff;background-color:var(--ion-color-step-250, #bfbfbf)}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @slot start - Content is placed to the left of the range slider in LTR, and to the right in RTL.
* @slot end - Content is placed to the right of the range slider in LTR, and to the left in RTL.
*
* @part tick - An inactive tick mark.
* @part tick-active - An active tick mark.
* @part pin - The counter that appears above a knob.
* @part knob - The handle that is used to drag the range.
* @part bar - The inactive part of the bar.
* @part bar-active - The active part of the bar.
*/
class Range {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionChange = createEvent(this, "ionChange", 7);
this.ionStyle = createEvent(this, "ionStyle", 7);
this.ionFocus = createEvent(this, "ionFocus", 7);
this.ionBlur = createEvent(this, "ionBlur", 7);
this.didLoad = false;
this.noUpdate = false;
this.hasFocus = false;
this.inheritedAttributes = {};
this.ratioA = 0;
this.ratioB = 0;
/**
* How long, in milliseconds, to wait to trigger the
* `ionChange` event after each change in the range value.
* This also impacts form bindings such as `ngModel` or `v-model`.
*/
this.debounce = 0;
// TODO: In Ionic Framework v6 this should initialize to this.rangeId like the other form components do.
/**
* The name of the control, which is submitted with the form data.
*/
this.name = '';
/**
* Show two knobs.
*/
this.dualKnobs = false;
/**
* Minimum integer value of the range.
*/
this.min = 0;
/**
* Maximum integer value of the range.
*/
this.max = 100;
/**
* If `true`, a pin with integer value is shown when the knob
* is pressed.
*/
this.pin = false;
/**
* If `true`, the knob snaps to tick marks evenly spaced based
* on the step property value.
*/
this.snaps = false;
/**
* Specifies the value granularity.
*/
this.step = 1;
/**
* If `true`, tick marks are displayed based on the step value.
* Only applies when `snaps` is `true`.
*/
this.ticks = true;
/**
* If `true`, the user cannot interact with the range.
*/
this.disabled = false;
/**
* the value of the range.
*/
this.value = 0;
this.clampBounds = (value) => {
return clamp(this.min, value, this.max);
};
this.ensureValueInBounds = (value) => {
if (this.dualKnobs) {
return {
lower: this.clampBounds(value.lower),
upper: this.clampBounds(value.upper)
};
}
else {
return this.clampBounds(value);
}
};
this.setupGesture = async () => {
const rangeSlider = this.rangeSlider;
if (rangeSlider) {
this.gesture = (await Promise.resolve().then(function () { return index$1; })).createGesture({
el: rangeSlider,
gestureName: 'range',
gesturePriority: 100,
threshold: 0,
onStart: ev => this.onStart(ev),
onMove: ev => this.onMove(ev),
onEnd: ev => this.onEnd(ev),
});
this.gesture.enable(!this.disabled);
}
};
this.handleKeyboard = (knob, isIncrease) => {
let step = this.step;
step = step > 0 ? step : 1;
step = step / (this.max - this.min);
if (!isIncrease) {
step *= -1;
}
if (knob === 'A') {
this.ratioA = clamp(0, this.ratioA + step, 1);
}
else {
this.ratioB = clamp(0, this.ratioB + step, 1);
}
this.updateValue();
};
this.onBlur = () => {
if (this.hasFocus) {
this.hasFocus = false;
this.ionBlur.emit();
this.emitStyle();
}
};
this.onFocus = () => {
if (!this.hasFocus) {
this.hasFocus = true;
this.ionFocus.emit();
this.emitStyle();
}
};
}
debounceChanged() {
this.ionChange = debounceEvent(this.ionChange, this.debounce);
}
minChanged() {
if (!this.noUpdate) {
this.updateRatio();
}
}
maxChanged() {
if (!this.noUpdate) {
this.updateRatio();
}
}
disabledChanged() {
if (this.gesture) {
this.gesture.enable(!this.disabled);
}
this.emitStyle();
}
valueChanged(value) {
if (!this.noUpdate) {
this.updateRatio();
}
value = this.ensureValueInBounds(value);
this.ionChange.emit({ value });
}
componentWillLoad() {
/**
* If user has custom ID set then we should
* not assign the default incrementing ID.
*/
this.rangeId = (this.el.hasAttribute('id')) ? this.el.getAttribute('id') : `ion-r-${rangeIds++}`;
this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);
}
componentDidLoad() {
this.setupGesture();
this.didLoad = true;
}
connectedCallback() {
this.updateRatio();
this.debounceChanged();
this.disabledChanged();
/**
* If we have not yet rendered
* ion-range, then rangeSlider is not defined.
* But if we are moving ion-range via appendChild,
* then rangeSlider will be defined.
*/
if (this.didLoad) {
this.setupGesture();
}
}
disconnectedCallback() {
if (this.gesture) {
this.gesture.destroy();
this.gesture = undefined;
}
}
getValue() {
const value = this.value || 0;
if (this.dualKnobs) {
if (typeof value === 'object') {
return value;
}
return {
lower: 0,
upper: value
};
}
else {
if (typeof value === 'object') {
return value.upper;
}
return value;
}
}
emitStyle() {
this.ionStyle.emit({
'interactive': true,
'interactive-disabled': this.disabled
});
}
onStart(detail) {
const rect = this.rect = this.rangeSlider.getBoundingClientRect();
const currentX = detail.currentX;
// figure out which knob they started closer to
let ratio = clamp(0, (currentX - rect.left) / rect.width, 1);
if (document.dir === 'rtl') {
ratio = 1 - ratio;
}
this.pressedKnob =
!this.dualKnobs ||
Math.abs(this.ratioA - ratio) < Math.abs(this.ratioB - ratio)
? 'A'
: 'B';
this.setFocus(this.pressedKnob);
// update the active knob's position
this.update(currentX);
}
onMove(detail) {
this.update(detail.currentX);
}
onEnd(detail) {
this.update(detail.currentX);
this.pressedKnob = undefined;
}
update(currentX) {
// figure out where the pointer is currently at
// update the knob being interacted with
const rect = this.rect;
let ratio = clamp(0, (currentX - rect.left) / rect.width, 1);
if (document.dir === 'rtl') {
ratio = 1 - ratio;
}
if (this.snaps) {
// snaps the ratio to the current value
ratio = valueToRatio(ratioToValue(ratio, this.min, this.max, this.step), this.min, this.max);
}
// update which knob is pressed
if (this.pressedKnob === 'A') {
this.ratioA = ratio;
}
else {
this.ratioB = ratio;
}
// Update input value
this.updateValue();
}
get valA() {
return ratioToValue(this.ratioA, this.min, this.max, this.step);
}
get valB() {
return ratioToValue(this.ratioB, this.min, this.max, this.step);
}
get ratioLower() {
if (this.dualKnobs) {
return Math.min(this.ratioA, this.ratioB);
}
return 0;
}
get ratioUpper() {
if (this.dualKnobs) {
return Math.max(this.ratioA, this.ratioB);
}
return this.ratioA;
}
updateRatio() {
const value = this.getValue();
const { min, max } = this;
if (this.dualKnobs) {
this.ratioA = valueToRatio(value.lower, min, max);
this.ratioB = valueToRatio(value.upper, min, max);
}
else {
this.ratioA = valueToRatio(value, min, max);
}
}
updateValue() {
this.noUpdate = true;
const { valA, valB } = this;
this.value = !this.dualKnobs
? valA
: {
lower: Math.min(valA, valB),
upper: Math.max(valA, valB)
};
this.noUpdate = false;
}
setFocus(knob) {
if (this.el.shadowRoot) {
const knobEl = this.el.shadowRoot.querySelector(knob === 'A' ? '.range-knob-a' : '.range-knob-b');
if (knobEl) {
knobEl.focus();
}
}
}
render() {
const { min, max, step, el, handleKeyboard, pressedKnob, disabled, pin, ratioLower, ratioUpper, inheritedAttributes, rangeId } = this;
/**
* Look for external label, ion-label, or aria-labelledby.
* If none, see if user placed an aria-label on the host
* and use that instead.
*/
let { labelText } = getAriaLabel(el, rangeId);
if (labelText === undefined || labelText === null) {
labelText = inheritedAttributes['aria-label'];
}
const mode = getIonMode$1(this);
const barStart = `${ratioLower * 100}%`;
const barEnd = `${100 - ratioUpper * 100}%`;
const doc = document;
const isRTL = doc.dir === 'rtl';
const start = isRTL ? 'right' : 'left';
const end = isRTL ? 'left' : 'right';
const tickStyle = (tick) => {
return {
[start]: tick[start]
};
};
const barStyle = {
[start]: barStart,
[end]: barEnd
};
const ticks = [];
if (this.snaps && this.ticks) {
for (let value = min; value <= max; value += step) {
const ratio = valueToRatio(value, min, max);
const tick = {
ratio,
active: ratio >= ratioLower && ratio <= ratioUpper,
};
tick[start] = `${ratio * 100}%`;
ticks.push(tick);
}
}
renderHiddenInput(true, el, this.name, JSON.stringify(this.getValue()), disabled);
return (hAsync(Host, { onFocusin: this.onFocus, onFocusout: this.onBlur, id: rangeId, class: createColorClasses$1(this.color, {
[mode]: true,
'in-item': hostContext('ion-item', el),
'range-disabled': disabled,
'range-pressed': pressedKnob !== undefined,
'range-has-pin': pin
}) }, hAsync("slot", { name: "start" }), hAsync("div", { class: "range-slider", ref: rangeEl => this.rangeSlider = rangeEl }, ticks.map(tick => (hAsync("div", { style: tickStyle(tick), role: "presentation", class: {
'range-tick': true,
'range-tick-active': tick.active
}, part: tick.active ? 'tick-active' : 'tick' }))), hAsync("div", { class: "range-bar", role: "presentation", part: "bar" }), hAsync("div", { class: "range-bar range-bar-active", role: "presentation", style: barStyle, part: "bar-active" }), renderKnob(isRTL, {
knob: 'A',
pressed: pressedKnob === 'A',
value: this.valA,
ratio: this.ratioA,
pin,
disabled,
handleKeyboard,
min,
max,
labelText
}), this.dualKnobs && renderKnob(isRTL, {
knob: 'B',
pressed: pressedKnob === 'B',
value: this.valB,
ratio: this.ratioB,
pin,
disabled,
handleKeyboard,
min,
max,
labelText
})), hAsync("slot", { name: "end" })));
}
get el() { return getElement(this); }
static get watchers() { return {
"debounce": ["debounceChanged"],
"min": ["minChanged"],
"max": ["maxChanged"],
"disabled": ["disabledChanged"],
"value": ["valueChanged"]
}; }
static get style() { return {
ios: rangeIosCss,
md: rangeMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-range",
"$members$": {
"color": [513],
"debounce": [2],
"name": [1],
"dualKnobs": [4, "dual-knobs"],
"min": [2],
"max": [2],
"pin": [4],
"snaps": [4],
"step": [2],
"ticks": [4],
"disabled": [4],
"value": [1026],
"ratioA": [32],
"ratioB": [32],
"pressedKnob": [32]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const renderKnob = (isRTL, { knob, value, ratio, min, max, disabled, pressed, pin, handleKeyboard, labelText }) => {
const start = isRTL ? 'right' : 'left';
const knobStyle = () => {
const style = {};
style[start] = `${ratio * 100}%`;
return style;
};
return (hAsync("div", { onKeyDown: (ev) => {
const key = ev.key;
if (key === 'ArrowLeft' || key === 'ArrowDown') {
handleKeyboard(knob, false);
ev.preventDefault();
ev.stopPropagation();
}
else if (key === 'ArrowRight' || key === 'ArrowUp') {
handleKeyboard(knob, true);
ev.preventDefault();
ev.stopPropagation();
}
}, class: {
'range-knob-handle': true,
'range-knob-a': knob === 'A',
'range-knob-b': knob === 'B',
'range-knob-pressed': pressed,
'range-knob-min': value === min,
'range-knob-max': value === max
}, style: knobStyle(), role: "slider", tabindex: disabled ? -1 : 0, "aria-label": labelText, "aria-valuemin": min, "aria-valuemax": max, "aria-disabled": disabled ? 'true' : null, "aria-valuenow": value }, pin && hAsync("div", { class: "range-pin", role: "presentation", part: "pin" }, Math.round(value)), hAsync("div", { class: "range-knob", role: "presentation", part: "knob" })));
};
const ratioToValue = (ratio, min, max, step) => {
let value = (max - min) * ratio;
if (step > 0) {
value = Math.round(value / step) * step + min;
}
return clamp(min, value, max);
};
const valueToRatio = (value, min, max) => {
return clamp(0, (value - min) / (max - min), 1);
};
let rangeIds = 0;
const getRefresherAnimationType = (contentEl) => {
const previousSibling = contentEl.previousElementSibling;
const hasHeader = previousSibling !== null && previousSibling.tagName === 'ION-HEADER';
return hasHeader ? 'translate' : 'scale';
};
const createPullingAnimation = (type, pullingSpinner, refresherEl) => {
return type === 'scale' ? createScaleAnimation(pullingSpinner, refresherEl) : createTranslateAnimation(pullingSpinner, refresherEl);
};
const createBaseAnimation = (pullingRefresherIcon) => {
const spinner = pullingRefresherIcon.querySelector('ion-spinner');
const circle = spinner.shadowRoot.querySelector('circle');
const spinnerArrowContainer = pullingRefresherIcon.querySelector('.spinner-arrow-container');
const arrowContainer = pullingRefresherIcon.querySelector('.arrow-container');
const arrow = (arrowContainer) ? arrowContainer.querySelector('ion-icon') : null;
const baseAnimation = createAnimation()
.duration(1000)
.easing('ease-out');
const spinnerArrowContainerAnimation = createAnimation()
.addElement(spinnerArrowContainer)
.keyframes([
{ offset: 0, opacity: '0.3' },
{ offset: 0.45, opacity: '0.3' },
{ offset: 0.55, opacity: '1' },
{ offset: 1, opacity: '1' }
]);
const circleInnerAnimation = createAnimation()
.addElement(circle)
.keyframes([
{ offset: 0, strokeDasharray: '1px, 200px' },
{ offset: 0.20, strokeDasharray: '1px, 200px' },
{ offset: 0.55, strokeDasharray: '100px, 200px' },
{ offset: 1, strokeDasharray: '100px, 200px' }
]);
const circleOuterAnimation = createAnimation()
.addElement(spinner)
.keyframes([
{ offset: 0, transform: 'rotate(-90deg)' },
{ offset: 1, transform: 'rotate(210deg)' }
]);
/**
* Only add arrow animation if present
* this allows users to customize the spinners
* without errors being thrown
*/
if (arrowContainer && arrow) {
const arrowContainerAnimation = createAnimation()
.addElement(arrowContainer)
.keyframes([
{ offset: 0, transform: 'rotate(0deg)' },
{ offset: 0.30, transform: 'rotate(0deg)' },
{ offset: 0.55, transform: 'rotate(280deg)' },
{ offset: 1, transform: 'rotate(400deg)' }
]);
const arrowAnimation = createAnimation()
.addElement(arrow)
.keyframes([
{ offset: 0, transform: 'translateX(2px) scale(0)' },
{ offset: 0.30, transform: 'translateX(2px) scale(0)' },
{ offset: 0.55, transform: 'translateX(-1.5px) scale(1)' },
{ offset: 1, transform: 'translateX(-1.5px) scale(1)' }
]);
baseAnimation.addAnimation([arrowContainerAnimation, arrowAnimation]);
}
return baseAnimation.addAnimation([spinnerArrowContainerAnimation, circleInnerAnimation, circleOuterAnimation]);
};
const createScaleAnimation = (pullingRefresherIcon, refresherEl) => {
/**
* Do not take the height of the refresher icon
* because at this point the DOM has not updated,
* so the refresher icon is still hidden with
* display: none.
* The `ion-refresher` container height
* is roughly the amount we need to offset
* the icon by when pulling down.
*/
const height = refresherEl.clientHeight;
const spinnerAnimation = createAnimation()
.addElement(pullingRefresherIcon)
.keyframes([
{ offset: 0, transform: `scale(0) translateY(-${height}px)` },
{ offset: 1, transform: 'scale(1) translateY(100px)' }
]);
return createBaseAnimation(pullingRefresherIcon).addAnimation([spinnerAnimation]);
};
const createTranslateAnimation = (pullingRefresherIcon, refresherEl) => {
/**
* Do not take the height of the refresher icon
* because at this point the DOM has not updated,
* so the refresher icon is still hidden with
* display: none.
* The `ion-refresher` container height
* is roughly the amount we need to offset
* the icon by when pulling down.
*/
const height = refresherEl.clientHeight;
const spinnerAnimation = createAnimation()
.addElement(pullingRefresherIcon)
.keyframes([
{ offset: 0, transform: `translateY(-${height}px)` },
{ offset: 1, transform: 'translateY(100px)' }
]);
return createBaseAnimation(pullingRefresherIcon).addAnimation([spinnerAnimation]);
};
const createSnapBackAnimation = (pullingRefresherIcon) => {
return createAnimation()
.duration(125)
.addElement(pullingRefresherIcon)
.fromTo('transform', 'translateY(var(--ion-pulling-refresher-translate, 100px))', 'translateY(0px)');
};
// iOS Native Refresher
// -----------------------------
const setSpinnerOpacity = (spinner, opacity) => {
spinner.style.setProperty('opacity', opacity.toString());
};
const handleScrollWhilePulling = (spinner, ticks, opacity, currentTickToShow) => {
writeTask(() => {
setSpinnerOpacity(spinner, opacity);
ticks.forEach((el, i) => el.style.setProperty('opacity', (i <= currentTickToShow) ? '0.99' : '0'));
});
};
const handleScrollWhileRefreshing = (spinner, lastVelocityY) => {
writeTask(() => {
// If user pulls down quickly, the spinner should spin faster
spinner.style.setProperty('--refreshing-rotation-duration', (lastVelocityY >= 1.0) ? '0.5s' : '2s');
spinner.style.setProperty('opacity', '1');
});
};
const translateElement = (el, value) => {
if (!el) {
return Promise.resolve();
}
const trans = transitionEndAsync(el, 200);
writeTask(() => {
el.style.setProperty('transition', '0.2s all ease-out');
if (value === undefined) {
el.style.removeProperty('transform');
}
else {
el.style.setProperty('transform', `translate3d(0px, ${value}, 0px)`);
}
});
return trans;
};
// Utils
// -----------------------------
const shouldUseNativeRefresher = async (referenceEl, mode) => {
const refresherContent = referenceEl.querySelector('ion-refresher-content');
if (!refresherContent) {
return Promise.resolve(false);
}
await new Promise(resolve => componentOnReady(refresherContent, resolve));
const pullingSpinner = referenceEl.querySelector('ion-refresher-content .refresher-pulling ion-spinner');
const refreshingSpinner = referenceEl.querySelector('ion-refresher-content .refresher-refreshing ion-spinner');
return (pullingSpinner !== null &&
refreshingSpinner !== null &&
((mode === 'ios' && isPlatform('mobile') && referenceEl.style.webkitOverflowScrolling !== undefined) ||
mode === 'md'));
};
const transitionEndAsync = (el, expectedDuration = 0) => {
return new Promise(resolve => {
transitionEnd$2(el, expectedDuration, resolve);
});
};
const transitionEnd$2 = (el, expectedDuration = 0, callback) => {
let unRegTrans;
let animationTimeout;
const opts = { passive: true };
const ANIMATION_FALLBACK_TIMEOUT = 500;
const unregister = () => {
if (unRegTrans) {
unRegTrans();
}
};
const onTransitionEnd = (ev) => {
if (ev === undefined || el === ev.target) {
unregister();
callback(ev);
}
};
if (el) {
el.addEventListener('webkitTransitionEnd', onTransitionEnd, opts);
el.addEventListener('transitionend', onTransitionEnd, opts);
animationTimeout = setTimeout(onTransitionEnd, expectedDuration + ANIMATION_FALLBACK_TIMEOUT);
unRegTrans = () => {
if (animationTimeout) {
clearTimeout(animationTimeout);
animationTimeout = undefined;
}
el.removeEventListener('webkitTransitionEnd', onTransitionEnd, opts);
el.removeEventListener('transitionend', onTransitionEnd, opts);
};
}
return unregister;
};
const refresherIosCss = "ion-refresher{left:0;top:0;display:none;position:absolute;width:100%;height:60px;pointer-events:none;z-index:-1}[dir=rtl] ion-refresher,:host-context([dir=rtl]) ion-refresher{left:unset;right:unset;right:0}ion-refresher.refresher-active{display:block}ion-refresher-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;height:100%}.refresher-pulling,.refresher-refreshing{display:none;width:100%}.refresher-pulling-icon,.refresher-refreshing-icon{-webkit-transform-origin:center;transform-origin:center;-webkit-transition:200ms;transition:200ms;font-size:30px;text-align:center}[dir=rtl] .refresher-pulling-icon,:host-context([dir=rtl]) .refresher-pulling-icon,[dir=rtl] .refresher-refreshing-icon,:host-context([dir=rtl]) .refresher-refreshing-icon{-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}.refresher-pulling-text,.refresher-refreshing-text{font-size:16px;text-align:center}ion-refresher-content .arrow-container{display:none}.refresher-pulling ion-refresher-content .refresher-pulling{display:block}.refresher-ready ion-refresher-content .refresher-pulling{display:block}.refresher-ready ion-refresher-content .refresher-pulling-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.refresher-refreshing ion-refresher-content .refresher-refreshing{display:block}.refresher-cancelling ion-refresher-content .refresher-pulling{display:block}.refresher-cancelling ion-refresher-content .refresher-pulling-icon{-webkit-transform:scale(0);transform:scale(0)}.refresher-completing ion-refresher-content .refresher-refreshing{display:block}.refresher-completing ion-refresher-content .refresher-refreshing-icon{-webkit-transform:scale(0);transform:scale(0)}.refresher-native .refresher-pulling-text,.refresher-native .refresher-refreshing-text{display:none}.refresher-ios .refresher-pulling-icon,.refresher-ios .refresher-refreshing-icon{color:var(--ion-text-color, #000)}.refresher-ios .refresher-pulling-text,.refresher-ios .refresher-refreshing-text{color:var(--ion-text-color, #000)}.refresher-ios .refresher-refreshing .spinner-lines-ios line,.refresher-ios .refresher-refreshing .spinner-lines-small-ios line,.refresher-ios .refresher-refreshing .spinner-crescent circle{stroke:var(--ion-text-color, #000)}.refresher-ios .refresher-refreshing .spinner-bubbles circle,.refresher-ios .refresher-refreshing .spinner-circles circle,.refresher-ios .refresher-refreshing .spinner-dots circle{fill:var(--ion-text-color, #000)}ion-refresher.refresher-native{display:block;z-index:1}ion-refresher.refresher-native ion-spinner{margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){ion-refresher.refresher-native ion-spinner{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}.refresher-native .refresher-refreshing ion-spinner{--refreshing-rotation-duration:2s;display:none;-webkit-animation:var(--refreshing-rotation-duration) ease-out refresher-rotate forwards;animation:var(--refreshing-rotation-duration) ease-out refresher-rotate forwards}.refresher-native .refresher-refreshing{display:none;-webkit-animation:250ms linear refresher-pop forwards;animation:250ms linear refresher-pop forwards}.refresher-native.refresher-refreshing .refresher-pulling ion-spinner,.refresher-native.refresher-completing .refresher-pulling ion-spinner{display:none}.refresher-native.refresher-refreshing .refresher-refreshing ion-spinner,.refresher-native.refresher-completing .refresher-refreshing ion-spinner{display:block}.refresher-native.refresher-pulling .refresher-pulling ion-spinner{display:block}.refresher-native.refresher-pulling .refresher-refreshing ion-spinner{display:none}@-webkit-keyframes refresher-pop{0%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}50%{-webkit-transform:scale(1.2);transform:scale(1.2);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes refresher-pop{0%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}50%{-webkit-transform:scale(1.2);transform:scale(1.2);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes refresher-rotate{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(180deg);transform:rotate(180deg)}}@keyframes refresher-rotate{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(180deg);transform:rotate(180deg)}}";
const refresherMdCss = "ion-refresher{left:0;top:0;display:none;position:absolute;width:100%;height:60px;pointer-events:none;z-index:-1}[dir=rtl] ion-refresher,:host-context([dir=rtl]) ion-refresher{left:unset;right:unset;right:0}ion-refresher.refresher-active{display:block}ion-refresher-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;height:100%}.refresher-pulling,.refresher-refreshing{display:none;width:100%}.refresher-pulling-icon,.refresher-refreshing-icon{-webkit-transform-origin:center;transform-origin:center;-webkit-transition:200ms;transition:200ms;font-size:30px;text-align:center}[dir=rtl] .refresher-pulling-icon,:host-context([dir=rtl]) .refresher-pulling-icon,[dir=rtl] .refresher-refreshing-icon,:host-context([dir=rtl]) .refresher-refreshing-icon{-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}.refresher-pulling-text,.refresher-refreshing-text{font-size:16px;text-align:center}ion-refresher-content .arrow-container{display:none}.refresher-pulling ion-refresher-content .refresher-pulling{display:block}.refresher-ready ion-refresher-content .refresher-pulling{display:block}.refresher-ready ion-refresher-content .refresher-pulling-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.refresher-refreshing ion-refresher-content .refresher-refreshing{display:block}.refresher-cancelling ion-refresher-content .refresher-pulling{display:block}.refresher-cancelling ion-refresher-content .refresher-pulling-icon{-webkit-transform:scale(0);transform:scale(0)}.refresher-completing ion-refresher-content .refresher-refreshing{display:block}.refresher-completing ion-refresher-content .refresher-refreshing-icon{-webkit-transform:scale(0);transform:scale(0)}.refresher-native .refresher-pulling-text,.refresher-native .refresher-refreshing-text{display:none}.refresher-md .refresher-pulling-icon,.refresher-md .refresher-refreshing-icon{color:var(--ion-text-color, #000)}.refresher-md .refresher-pulling-text,.refresher-md .refresher-refreshing-text{color:var(--ion-text-color, #000)}.refresher-md .refresher-refreshing .spinner-lines-md line,.refresher-md .refresher-refreshing .spinner-lines-small-md line,.refresher-md .refresher-refreshing .spinner-crescent circle{stroke:var(--ion-text-color, #000)}.refresher-md .refresher-refreshing .spinner-bubbles circle,.refresher-md .refresher-refreshing .spinner-circles circle,.refresher-md .refresher-refreshing .spinner-dots circle{fill:var(--ion-text-color, #000)}ion-refresher.refresher-native{display:block;z-index:1}ion-refresher.refresher-native ion-spinner{margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0;width:24px;height:24px;color:var(--ion-color-primary, #3880ff)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){ion-refresher.refresher-native ion-spinner{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}ion-refresher.refresher-native .spinner-arrow-container{display:inherit}ion-refresher.refresher-native .arrow-container{display:block;position:absolute;width:24px;height:24px}ion-refresher.refresher-native .arrow-container ion-icon{margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0;left:0;right:0;bottom:-4px;position:absolute;color:var(--ion-color-primary, #3880ff);font-size:12px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){ion-refresher.refresher-native .arrow-container ion-icon{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}ion-refresher.refresher-native.refresher-pulling ion-refresher-content .refresher-pulling,ion-refresher.refresher-native.refresher-ready ion-refresher-content .refresher-pulling{display:-ms-flexbox;display:flex}ion-refresher.refresher-native.refresher-refreshing ion-refresher-content .refresher-refreshing,ion-refresher.refresher-native.refresher-completing ion-refresher-content .refresher-refreshing,ion-refresher.refresher-native.refresher-cancelling ion-refresher-content .refresher-refreshing{display:-ms-flexbox;display:flex}ion-refresher.refresher-native .refresher-pulling-icon{-webkit-transform:translateY(calc(-100% - 10px));transform:translateY(calc(-100% - 10px))}ion-refresher.refresher-native .refresher-pulling-icon,ion-refresher.refresher-native .refresher-refreshing-icon{margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0;border-radius:100%;padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px;display:-ms-flexbox;display:flex;border:1px solid var(--ion-color-step-200, #ececec);background:var(--ion-color-step-250, #ffffff);-webkit-box-shadow:0px 1px 6px rgba(0, 0, 0, 0.1);box-shadow:0px 1px 6px rgba(0, 0, 0, 0.1)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){ion-refresher.refresher-native .refresher-pulling-icon,ion-refresher.refresher-native .refresher-refreshing-icon{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){ion-refresher.refresher-native .refresher-pulling-icon,ion-refresher.refresher-native .refresher-refreshing-icon{padding-left:unset;padding-right:unset;-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px}}";
class Refresher {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionRefresh = createEvent(this, "ionRefresh", 7);
this.ionPull = createEvent(this, "ionPull", 7);
this.ionStart = createEvent(this, "ionStart", 7);
this.appliedStyles = false;
this.didStart = false;
this.progress = 0;
this.pointerDown = false;
this.needsCompletion = false;
this.didRefresh = false;
this.lastVelocityY = 0;
this.animations = [];
this.nativeRefresher = false;
/**
* The current state which the refresher is in. The refresher's states include:
*
* - `inactive` - The refresher is not being pulled down or refreshing and is currently hidden.
* - `pulling` - The user is actively pulling down the refresher, but has not reached the point yet that if the user lets go, it'll refresh.
* - `cancelling` - The user pulled down the refresher and let go, but did not pull down far enough to kick off the `refreshing` state. After letting go, the refresher is in the `cancelling` state while it is closing, and will go back to the `inactive` state once closed.
* - `ready` - The user has pulled down the refresher far enough that if they let go, it'll begin the `refreshing` state.
* - `refreshing` - The refresher is actively waiting on the async operation to end. Once the refresh handler calls `complete()` it will begin the `completing` state.
* - `completing` - The `refreshing` state has finished and the refresher is in the way of closing itself. Once closed, the refresher will go back to the `inactive` state.
*/
this.state = 1 /* Inactive */;
/**
* The minimum distance the user must pull down until the
* refresher will go into the `refreshing` state.
* Does not apply when the refresher content uses a spinner,
* enabling the native refresher.
*/
this.pullMin = 60;
/**
* The maximum distance of the pull until the refresher
* will automatically go into the `refreshing` state.
* Defaults to the result of `pullMin + 60`.
* Does not apply when the refresher content uses a spinner,
* enabling the native refresher.
*/
this.pullMax = this.pullMin + 60;
/**
* Time it takes to close the refresher.
* Does not apply when the refresher content uses a spinner,
* enabling the native refresher.
*/
this.closeDuration = '280ms';
/**
* Time it takes the refresher to to snap back to the `refreshing` state.
* Does not apply when the refresher content uses a spinner,
* enabling the native refresher.
*/
this.snapbackDuration = '280ms';
/**
* How much to multiply the pull speed by. To slow the pull animation down,
* pass a number less than `1`. To speed up the pull, pass a number greater
* than `1`. The default value is `1` which is equal to the speed of the cursor.
* If a negative value is passed in, the factor will be `1` instead.
*
* For example: If the value passed is `1.2` and the content is dragged by
* `10` pixels, instead of `10` pixels the content will be pulled by `12` pixels
* (an increase of 20 percent). If the value passed is `0.8`, the dragged amount
* will be `8` pixels, less than the amount the cursor has moved.
*
* Does not apply when the refresher content uses a spinner,
* enabling the native refresher.
*/
this.pullFactor = 1;
/**
* If `true`, the refresher will be hidden.
*/
this.disabled = false;
}
disabledChanged() {
if (this.gesture) {
this.gesture.enable(!this.disabled);
}
}
async checkNativeRefresher() {
const useNativeRefresher = await shouldUseNativeRefresher(this.el, getIonMode$1(this));
if (useNativeRefresher && !this.nativeRefresher) {
const contentEl = this.el.closest('ion-content');
this.setupNativeRefresher(contentEl);
}
else if (!useNativeRefresher) {
this.destroyNativeRefresher();
}
}
destroyNativeRefresher() {
if (this.scrollEl && this.scrollListenerCallback) {
this.scrollEl.removeEventListener('scroll', this.scrollListenerCallback);
this.scrollListenerCallback = undefined;
}
this.nativeRefresher = false;
}
async resetNativeRefresher(el, state) {
this.state = state;
if (getIonMode$1(this) === 'ios') {
await translateElement(el, undefined);
}
else {
await transitionEndAsync(this.el.querySelector('.refresher-refreshing-icon'), 200);
}
this.didRefresh = false;
this.needsCompletion = false;
this.pointerDown = false;
this.animations.forEach(ani => ani.destroy());
this.animations = [];
this.progress = 0;
this.state = 1 /* Inactive */;
}
async setupiOSNativeRefresher(pullingSpinner, refreshingSpinner) {
this.elementToTransform = this.scrollEl;
const ticks = pullingSpinner.shadowRoot.querySelectorAll('svg');
let MAX_PULL = this.scrollEl.clientHeight * 0.16;
const NUM_TICKS = ticks.length;
writeTask(() => ticks.forEach(el => el.style.setProperty('animation', 'none')));
this.scrollListenerCallback = () => {
// If pointer is not on screen or refresher is not active, ignore scroll
if (!this.pointerDown && this.state === 1 /* Inactive */) {
return;
}
readTask(() => {
// PTR should only be active when overflow scrolling at the top
const scrollTop = this.scrollEl.scrollTop;
const refresherHeight = this.el.clientHeight;
if (scrollTop > 0) {
/**
* If refresher is refreshing and user tries to scroll
* progressively fade refresher out/in
*/
if (this.state === 8 /* Refreshing */) {
const ratio = clamp(0, scrollTop / (refresherHeight * 0.5), 1);
writeTask(() => setSpinnerOpacity(refreshingSpinner, 1 - ratio));
return;
}
writeTask(() => setSpinnerOpacity(pullingSpinner, 0));
return;
}
if (this.pointerDown) {
if (!this.didStart) {
this.didStart = true;
this.ionStart.emit();
}
// emit "pulling" on every move
if (this.pointerDown) {
this.ionPull.emit();
}
}
// delay showing the next tick marks until user has pulled 30px
const opacity = clamp(0, Math.abs(scrollTop) / refresherHeight, 0.99);
const pullAmount = this.progress = clamp(0, (Math.abs(scrollTop) - 30) / MAX_PULL, 1);
const currentTickToShow = clamp(0, Math.floor(pullAmount * NUM_TICKS), NUM_TICKS - 1);
const shouldShowRefreshingSpinner = this.state === 8 /* Refreshing */ || currentTickToShow === NUM_TICKS - 1;
if (shouldShowRefreshingSpinner) {
if (this.pointerDown) {
handleScrollWhileRefreshing(refreshingSpinner, this.lastVelocityY);
}
if (!this.didRefresh) {
this.beginRefresh();
this.didRefresh = true;
hapticImpact({ style: 'light' });
/**
* Translate the content element otherwise when pointer is removed
* from screen the scroll content will bounce back over the refresher
*/
if (!this.pointerDown) {
translateElement(this.elementToTransform, `${refresherHeight}px`);
}
}
}
else {
this.state = 2 /* Pulling */;
handleScrollWhilePulling(pullingSpinner, ticks, opacity, currentTickToShow);
}
});
};
this.scrollEl.addEventListener('scroll', this.scrollListenerCallback);
this.gesture = (await Promise.resolve().then(function () { return index$1; })).createGesture({
el: this.scrollEl,
gestureName: 'refresher',
gesturePriority: 31,
direction: 'y',
threshold: 5,
onStart: () => {
this.pointerDown = true;
if (!this.didRefresh) {
translateElement(this.elementToTransform, '0px');
}
/**
* If the content had `display: none` when
* the refresher was initialized, its clientHeight
* will be 0. When the gesture starts, the content
* will be visible, so try to get the correct
* client height again. This is most common when
* using the refresher in an ion-menu.
*/
if (MAX_PULL === 0) {
MAX_PULL = this.scrollEl.clientHeight * 0.16;
}
},
onMove: ev => {
this.lastVelocityY = ev.velocityY;
},
onEnd: () => {
this.pointerDown = false;
this.didStart = false;
if (this.needsCompletion) {
this.resetNativeRefresher(this.elementToTransform, 32 /* Completing */);
this.needsCompletion = false;
}
else if (this.didRefresh) {
readTask(() => translateElement(this.elementToTransform, `${this.el.clientHeight}px`));
}
},
});
this.disabledChanged();
}
async setupMDNativeRefresher(contentEl, pullingSpinner, refreshingSpinner) {
const circle = getElementRoot(pullingSpinner).querySelector('circle');
const pullingRefresherIcon = this.el.querySelector('ion-refresher-content .refresher-pulling-icon');
const refreshingCircle = getElementRoot(refreshingSpinner).querySelector('circle');
if (circle !== null && refreshingCircle !== null) {
writeTask(() => {
circle.style.setProperty('animation', 'none');
// This lines up the animation on the refreshing spinner with the pulling spinner
refreshingSpinner.style.setProperty('animation-delay', '-655ms');
refreshingCircle.style.setProperty('animation-delay', '-655ms');
});
}
this.gesture = (await Promise.resolve().then(function () { return index$1; })).createGesture({
el: this.scrollEl,
gestureName: 'refresher',
gesturePriority: 31,
direction: 'y',
threshold: 5,
canStart: () => this.state !== 8 /* Refreshing */ && this.state !== 32 /* Completing */ && this.scrollEl.scrollTop === 0,
onStart: (ev) => {
ev.data = { animation: undefined, didStart: false, cancelled: false };
},
onMove: (ev) => {
if ((ev.velocityY < 0 && this.progress === 0 && !ev.data.didStart) || ev.data.cancelled) {
ev.data.cancelled = true;
return;
}
if (!ev.data.didStart) {
ev.data.didStart = true;
this.state = 2 /* Pulling */;
writeTask(() => this.scrollEl.style.setProperty('--overflow', 'hidden'));
const animationType = getRefresherAnimationType(contentEl);
const animation = createPullingAnimation(animationType, pullingRefresherIcon, this.el);
ev.data.animation = animation;
animation.progressStart(false, 0);
this.ionStart.emit();
this.animations.push(animation);
return;
}
// Since we are using an easing curve, slow the gesture tracking down a bit
this.progress = clamp(0, (ev.deltaY / 180) * 0.5, 1);
ev.data.animation.progressStep(this.progress);
this.ionPull.emit();
},
onEnd: (ev) => {
if (!ev.data.didStart) {
return;
}
writeTask(() => this.scrollEl.style.removeProperty('--overflow'));
if (this.progress <= 0.4) {
this.gesture.enable(false);
ev.data.animation
.progressEnd(0, this.progress, 500)
.onFinish(() => {
this.animations.forEach(ani => ani.destroy());
this.animations = [];
this.gesture.enable(true);
this.state = 1 /* Inactive */;
});
return;
}
const progress = getTimeGivenProgression([0, 0], [0, 0], [1, 1], [1, 1], this.progress)[0];
const snapBackAnimation = createSnapBackAnimation(pullingRefresherIcon);
this.animations.push(snapBackAnimation);
writeTask(async () => {
pullingRefresherIcon.style.setProperty('--ion-pulling-refresher-translate', `${(progress * 100)}px`);
ev.data.animation.progressEnd();
await snapBackAnimation.play();
this.beginRefresh();
ev.data.animation.destroy();
});
}
});
this.disabledChanged();
}
async setupNativeRefresher(contentEl) {
if (this.scrollListenerCallback || !contentEl || this.nativeRefresher || !this.scrollEl) {
return;
}
/**
* If using non-native refresher before make sure
* we clean up any old CSS. This can happen when
* a user manually calls the refresh method in a
* component create callback before the native
* refresher is setup.
*/
this.setCss(0, '', false, '');
this.nativeRefresher = true;
const pullingSpinner = this.el.querySelector('ion-refresher-content .refresher-pulling ion-spinner');
const refreshingSpinner = this.el.querySelector('ion-refresher-content .refresher-refreshing ion-spinner');
if (getIonMode$1(this) === 'ios') {
this.setupiOSNativeRefresher(pullingSpinner, refreshingSpinner);
}
else {
this.setupMDNativeRefresher(contentEl, pullingSpinner, refreshingSpinner);
}
}
componentDidUpdate() {
this.checkNativeRefresher();
}
async connectedCallback() {
if (this.el.getAttribute('slot') !== 'fixed') {
console.error('Make sure you use: <ion-refresher slot="fixed">');
return;
}
const contentEl = this.el.closest('ion-content');
if (!contentEl) {
console.error('<ion-refresher> must be used inside an <ion-content>');
return;
}
await new Promise(resolve => componentOnReady(contentEl, resolve));
this.scrollEl = await contentEl.getScrollElement();
this.backgroundContentEl = getElementRoot(contentEl).querySelector('#background-content');
if (await shouldUseNativeRefresher(this.el, getIonMode$1(this))) {
this.setupNativeRefresher(contentEl);
}
else {
this.gesture = (await Promise.resolve().then(function () { return index$1; })).createGesture({
el: contentEl,
gestureName: 'refresher',
gesturePriority: 31,
direction: 'y',
threshold: 20,
passive: false,
canStart: () => this.canStart(),
onStart: () => this.onStart(),
onMove: ev => this.onMove(ev),
onEnd: () => this.onEnd(),
});
this.disabledChanged();
}
}
disconnectedCallback() {
this.destroyNativeRefresher();
this.scrollEl = undefined;
if (this.gesture) {
this.gesture.destroy();
this.gesture = undefined;
}
}
/**
* Call `complete()` when your async operation has completed.
* For example, the `refreshing` state is while the app is performing
* an asynchronous operation, such as receiving more data from an
* AJAX request. Once the data has been received, you then call this
* method to signify that the refreshing has completed and to close
* the refresher. This method also changes the refresher's state from
* `refreshing` to `completing`.
*/
async complete() {
if (this.nativeRefresher) {
this.needsCompletion = true;
// Do not reset scroll el until user removes pointer from screen
if (!this.pointerDown) {
raf(() => raf(() => this.resetNativeRefresher(this.elementToTransform, 32 /* Completing */)));
}
}
else {
this.close(32 /* Completing */, '120ms');
}
}
/**
* Changes the refresher's state from `refreshing` to `cancelling`.
*/
async cancel() {
if (this.nativeRefresher) {
// Do not reset scroll el until user removes pointer from screen
if (!this.pointerDown) {
raf(() => raf(() => this.resetNativeRefresher(this.elementToTransform, 16 /* Cancelling */)));
}
}
else {
this.close(16 /* Cancelling */, '');
}
}
/**
* A number representing how far down the user has pulled.
* The number `0` represents the user hasn't pulled down at all. The
* number `1`, and anything greater than `1`, represents that the user
* has pulled far enough down that when they let go then the refresh will
* happen. If they let go and the number is less than `1`, then the
* refresh will not happen, and the content will return to it's original
* position.
*/
getProgress() {
return Promise.resolve(this.progress);
}
canStart() {
if (!this.scrollEl) {
return false;
}
if (this.state !== 1 /* Inactive */) {
return false;
}
// if the scrollTop is greater than zero then it's
// not possible to pull the content down yet
if (this.scrollEl.scrollTop > 0) {
return false;
}
return true;
}
onStart() {
this.progress = 0;
this.state = 1 /* Inactive */;
}
onMove(detail) {
if (!this.scrollEl) {
return;
}
// this method can get called like a bazillion times per second,
// so it's built to be as efficient as possible, and does its
// best to do any DOM read/writes only when absolutely necessary
// if multi-touch then get out immediately
const ev = detail.event;
if (ev.touches && ev.touches.length > 1) {
return;
}
// do nothing if it's actively refreshing
// or it's in the way of closing
// or this was never a startY
if ((this.state & 56 /* _BUSY_ */) !== 0) {
return;
}
const pullFactor = (Number.isNaN(this.pullFactor) || this.pullFactor < 0) ? 1 : this.pullFactor;
const deltaY = detail.deltaY * pullFactor;
// don't bother if they're scrolling up
// and have not already started dragging
if (deltaY <= 0) {
// the current Y is higher than the starting Y
// so they scrolled up enough to be ignored
this.progress = 0;
this.state = 1 /* Inactive */;
if (this.appliedStyles) {
// reset the styles only if they were applied
this.setCss(0, '', false, '');
return;
}
return;
}
if (this.state === 1 /* Inactive */) {
// this refresh is not already actively pulling down
// get the content's scrollTop
const scrollHostScrollTop = this.scrollEl.scrollTop;
// if the scrollTop is greater than zero then it's
// not possible to pull the content down yet
if (scrollHostScrollTop > 0) {
this.progress = 0;
return;
}
// content scrolled all the way to the top, and dragging down
this.state = 2 /* Pulling */;
}
// prevent native scroll events
if (ev.cancelable) {
ev.preventDefault();
}
// the refresher is actively pulling at this point
// move the scroll element within the content element
this.setCss(deltaY, '0ms', true, '');
if (deltaY === 0) {
// don't continue if there's no delta yet
this.progress = 0;
return;
}
const pullMin = this.pullMin;
// set pull progress
this.progress = deltaY / pullMin;
// emit "start" if it hasn't started yet
if (!this.didStart) {
this.didStart = true;
this.ionStart.emit();
}
// emit "pulling" on every move
this.ionPull.emit();
// do nothing if the delta is less than the pull threshold
if (deltaY < pullMin) {
// ensure it stays in the pulling state, cuz its not ready yet
this.state = 2 /* Pulling */;
return;
}
if (deltaY > this.pullMax) {
// they pulled farther than the max, so kick off the refresh
this.beginRefresh();
return;
}
// pulled farther than the pull min!!
// it is now in the `ready` state!!
// if they let go then it'll refresh, kerpow!!
this.state = 4 /* Ready */;
return;
}
onEnd() {
// only run in a zone when absolutely necessary
if (this.state === 4 /* Ready */) {
// they pulled down far enough, so it's ready to refresh
this.beginRefresh();
}
else if (this.state === 2 /* Pulling */) {
// they were pulling down, but didn't pull down far enough
// set the content back to it's original location
// and close the refresher
// set that the refresh is actively cancelling
this.cancel();
}
}
beginRefresh() {
// assumes we're already back in a zone
// they pulled down far enough, so it's ready to refresh
this.state = 8 /* Refreshing */;
// place the content in a hangout position while it thinks
this.setCss(this.pullMin, this.snapbackDuration, true, '');
// emit "refresh" because it was pulled down far enough
// and they let go to begin refreshing
this.ionRefresh.emit({
complete: this.complete.bind(this)
});
}
close(state, delay) {
// create fallback timer incase something goes wrong with transitionEnd event
setTimeout(() => {
this.state = 1 /* Inactive */;
this.progress = 0;
this.didStart = false;
this.setCss(0, '0ms', false, '');
}, 600);
// reset set the styles on the scroll element
// set that the refresh is actively cancelling/completing
this.state = state;
this.setCss(0, this.closeDuration, true, delay);
// TODO: stop gesture
}
setCss(y, duration, overflowVisible, delay) {
if (this.nativeRefresher) {
return;
}
this.appliedStyles = (y > 0);
writeTask(() => {
if (this.scrollEl && this.backgroundContentEl) {
const scrollStyle = this.scrollEl.style;
const backgroundStyle = this.backgroundContentEl.style;
scrollStyle.transform = backgroundStyle.transform = ((y > 0) ? `translateY(${y}px) translateZ(0px)` : '');
scrollStyle.transitionDuration = backgroundStyle.transitionDuration = duration;
scrollStyle.transitionDelay = backgroundStyle.transitionDelay = delay;
scrollStyle.overflow = (overflowVisible ? 'hidden' : '');
}
});
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { slot: "fixed", class: {
[mode]: true,
// Used internally for styling
[`refresher-${mode}`]: true,
'refresher-native': this.nativeRefresher,
'refresher-active': this.state !== 1 /* Inactive */,
'refresher-pulling': this.state === 2 /* Pulling */,
'refresher-ready': this.state === 4 /* Ready */,
'refresher-refreshing': this.state === 8 /* Refreshing */,
'refresher-cancelling': this.state === 16 /* Cancelling */,
'refresher-completing': this.state === 32 /* Completing */,
} }));
}
get el() { return getElement(this); }
static get watchers() { return {
"disabled": ["disabledChanged"]
}; }
static get style() { return {
ios: refresherIosCss,
md: refresherMdCss
}; }
static get cmpMeta() { return {
"$flags$": 32,
"$tagName$": "ion-refresher",
"$members$": {
"pullMin": [2, "pull-min"],
"pullMax": [2, "pull-max"],
"closeDuration": [1, "close-duration"],
"snapbackDuration": [1, "snapback-duration"],
"pullFactor": [2, "pull-factor"],
"disabled": [4],
"nativeRefresher": [32],
"state": [32],
"complete": [64],
"cancel": [64],
"getProgress": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const spinners = {
'bubbles': {
dur: 1000,
circles: 9,
fn: (dur, index, total) => {
const animationDelay = `${(dur * index / total) - dur}ms`;
const angle = 2 * Math.PI * index / total;
return {
r: 5,
style: {
'top': `${9 * Math.sin(angle)}px`,
'left': `${9 * Math.cos(angle)}px`,
'animation-delay': animationDelay,
}
};
}
},
'circles': {
dur: 1000,
circles: 8,
fn: (dur, index, total) => {
const step = index / total;
const animationDelay = `${(dur * step) - dur}ms`;
const angle = 2 * Math.PI * step;
return {
r: 5,
style: {
'top': `${9 * Math.sin(angle)}px`,
'left': `${9 * Math.cos(angle)}px`,
'animation-delay': animationDelay,
}
};
}
},
'circular': {
dur: 1400,
elmDuration: true,
circles: 1,
fn: () => {
return {
r: 20,
cx: 48,
cy: 48,
fill: 'none',
viewBox: '24 24 48 48',
transform: 'translate(0,0)',
style: {}
};
}
},
'crescent': {
dur: 750,
circles: 1,
fn: () => {
return {
r: 26,
style: {}
};
}
},
'dots': {
dur: 750,
circles: 3,
fn: (_, index) => {
const animationDelay = -(110 * index) + 'ms';
return {
r: 6,
style: {
'left': `${9 - (9 * index)}px`,
'animation-delay': animationDelay,
}
};
}
},
'lines': {
dur: 1000,
lines: 12,
fn: (dur, index, total) => {
const transform = `rotate(${30 * index + (index < 6 ? 180 : -180)}deg)`;
const animationDelay = `${(dur * index / total) - dur}ms`;
return {
y1: 17,
y2: 29,
style: {
'transform': transform,
'animation-delay': animationDelay,
}
};
}
},
'lines-small': {
dur: 1000,
lines: 12,
fn: (dur, index, total) => {
const transform = `rotate(${30 * index + (index < 6 ? 180 : -180)}deg)`;
const animationDelay = `${(dur * index / total) - dur}ms`;
return {
y1: 12,
y2: 20,
style: {
'transform': transform,
'animation-delay': animationDelay,
}
};
}
}
};
const SPINNERS = spinners;
class RefresherContent {
constructor(hostRef) {
registerInstance(this, hostRef);
}
componentWillLoad() {
if (this.pullingIcon === undefined) {
const mode = getIonMode$1(this);
const overflowRefresher = this.el.style.webkitOverflowScrolling !== undefined ? 'lines' : 'arrow-down';
this.pullingIcon = config.get('refreshingIcon', mode === 'ios' && isPlatform('mobile') ? config.get('spinner', overflowRefresher) : 'circular');
}
if (this.refreshingSpinner === undefined) {
const mode = getIonMode$1(this);
this.refreshingSpinner = config.get('refreshingSpinner', config.get('spinner', mode === 'ios' ? 'lines' : 'circular'));
}
}
render() {
const pullingIcon = this.pullingIcon;
const hasSpinner = pullingIcon != null && SPINNERS[pullingIcon] !== undefined;
const mode = getIonMode$1(this);
return (hAsync(Host, { class: mode }, hAsync("div", { class: "refresher-pulling" }, this.pullingIcon && hasSpinner &&
hAsync("div", { class: "refresher-pulling-icon" }, hAsync("div", { class: "spinner-arrow-container" }, hAsync("ion-spinner", { name: this.pullingIcon, paused: true }), mode === 'md' && this.pullingIcon === 'circular' &&
hAsync("div", { class: "arrow-container" }, hAsync("ion-icon", { name: "caret-back-sharp" })))), this.pullingIcon && !hasSpinner &&
hAsync("div", { class: "refresher-pulling-icon" }, hAsync("ion-icon", { icon: this.pullingIcon, lazy: false })), this.pullingText &&
hAsync("div", { class: "refresher-pulling-text", innerHTML: sanitizeDOMString(this.pullingText) })), hAsync("div", { class: "refresher-refreshing" }, this.refreshingSpinner &&
hAsync("div", { class: "refresher-refreshing-icon" }, hAsync("ion-spinner", { name: this.refreshingSpinner })), this.refreshingText &&
hAsync("div", { class: "refresher-refreshing-text", innerHTML: sanitizeDOMString(this.refreshingText) }))));
}
get el() { return getElement(this); }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-refresher-content",
"$members$": {
"pullingIcon": [1025, "pulling-icon"],
"pullingText": [1, "pulling-text"],
"refreshingSpinner": [1025, "refreshing-spinner"],
"refreshingText": [1, "refreshing-text"]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const reorderIosCss = "/*!@:host([slot])*/[slot].sc-ion-reorder-ios-h{display:none;line-height:0;z-index:100}/*!@.reorder-icon*/.reorder-icon.sc-ion-reorder-ios{display:block;font-size:22px}/*!@.reorder-icon*/.reorder-icon.sc-ion-reorder-ios{font-size:34px;opacity:0.4}";
const reorderMdCss = "/*!@:host([slot])*/[slot].sc-ion-reorder-md-h{display:none;line-height:0;z-index:100}/*!@.reorder-icon*/.reorder-icon.sc-ion-reorder-md{display:block;font-size:22px}/*!@.reorder-icon*/.reorder-icon.sc-ion-reorder-md{font-size:31px;opacity:0.3}";
/**
* @part icon - The icon of the reorder handle (uses ion-icon).
*/
class Reorder {
constructor(hostRef) {
registerInstance(this, hostRef);
}
onClick(ev) {
const reorderGroup = this.el.closest('ion-reorder-group');
ev.preventDefault();
// Only stop event propagation if the reorder is inside of an enabled
// reorder group. This allows interaction with clickable children components.
if (!reorderGroup || !reorderGroup.disabled) {
ev.stopImmediatePropagation();
}
}
render() {
const mode = getIonMode$1(this);
const reorderIcon = mode === 'ios' ? 'reorder-three-outline' : 'reorder-two-sharp';
return (hAsync(Host, { class: mode }, hAsync("slot", null, hAsync("ion-icon", { name: reorderIcon, lazy: false, class: "reorder-icon", part: "icon" }))));
}
get el() { return getElement(this); }
static get style() { return {
ios: reorderIosCss,
md: reorderMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-reorder",
"$members$": undefined,
"$listeners$": [[2, "click", "onClick"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const reorderGroupCss = ".reorder-list-active>*{-webkit-transition:-webkit-transform 300ms;transition:-webkit-transform 300ms;transition:transform 300ms;transition:transform 300ms, -webkit-transform 300ms;will-change:transform}.reorder-enabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.reorder-enabled ion-reorder{display:block;cursor:-webkit-grab;cursor:grab;pointer-events:all;-ms-touch-action:none;touch-action:none}.reorder-selected,.reorder-selected ion-reorder{cursor:-webkit-grabbing;cursor:grabbing}.reorder-selected{position:relative;-webkit-transition:none !important;transition:none !important;-webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.4);box-shadow:0 0 10px rgba(0, 0, 0, 0.4);opacity:0.8;z-index:100}.reorder-visible ion-reorder .reorder-icon{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}";
class ReorderGroup {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionItemReorder = createEvent(this, "ionItemReorder", 7);
this.lastToIndex = -1;
this.cachedHeights = [];
this.scrollElTop = 0;
this.scrollElBottom = 0;
this.scrollElInitial = 0;
this.containerTop = 0;
this.containerBottom = 0;
this.state = 0 /* Idle */;
/**
* If `true`, the reorder will be hidden.
*/
this.disabled = true;
}
disabledChanged() {
if (this.gesture) {
this.gesture.enable(!this.disabled);
}
}
async connectedCallback() {
const contentEl = this.el.closest('ion-content');
if (contentEl) {
this.scrollEl = await contentEl.getScrollElement();
}
this.gesture = (await Promise.resolve().then(function () { return index$1; })).createGesture({
el: this.el,
gestureName: 'reorder',
gesturePriority: 110,
threshold: 0,
direction: 'y',
passive: false,
canStart: detail => this.canStart(detail),
onStart: ev => this.onStart(ev),
onMove: ev => this.onMove(ev),
onEnd: () => this.onEnd(),
});
this.disabledChanged();
}
disconnectedCallback() {
this.onEnd();
if (this.gesture) {
this.gesture.destroy();
this.gesture = undefined;
}
}
/**
* Completes the reorder operation. Must be called by the `ionItemReorder` event.
*
* If a list of items is passed, the list will be reordered and returned in the
* proper order.
*
* If no parameters are passed or if `true` is passed in, the reorder will complete
* and the item will remain in the position it was dragged to. If `false` is passed,
* the reorder will complete and the item will bounce back to its original position.
*
* @param listOrReorder A list of items to be sorted and returned in the new order or a
* boolean of whether or not the reorder should reposition the item.
*/
complete(listOrReorder) {
return Promise.resolve(this.completeSync(listOrReorder));
}
canStart(ev) {
if (this.selectedItemEl || this.state !== 0 /* Idle */) {
return false;
}
const target = ev.event.target;
const reorderEl = target.closest('ion-reorder');
if (!reorderEl) {
return false;
}
const item = findReorderItem(reorderEl, this.el);
if (!item) {
return false;
}
ev.data = item;
return true;
}
onStart(ev) {
ev.event.preventDefault();
const item = this.selectedItemEl = ev.data;
const heights = this.cachedHeights;
heights.length = 0;
const el = this.el;
const children = el.children;
if (!children || children.length === 0) {
return;
}
let sum = 0;
for (let i = 0; i < children.length; i++) {
const child = children[i];
sum += child.offsetHeight;
heights.push(sum);
child.$ionIndex = i;
}
const box = el.getBoundingClientRect();
this.containerTop = box.top;
this.containerBottom = box.bottom;
if (this.scrollEl) {
const scrollBox = this.scrollEl.getBoundingClientRect();
this.scrollElInitial = this.scrollEl.scrollTop;
this.scrollElTop = scrollBox.top + AUTO_SCROLL_MARGIN;
this.scrollElBottom = scrollBox.bottom - AUTO_SCROLL_MARGIN;
}
else {
this.scrollElInitial = 0;
this.scrollElTop = 0;
this.scrollElBottom = 0;
}
this.lastToIndex = indexForItem(item);
this.selectedItemHeight = item.offsetHeight;
this.state = 1 /* Active */;
item.classList.add(ITEM_REORDER_SELECTED);
hapticSelectionStart();
}
onMove(ev) {
const selectedItem = this.selectedItemEl;
if (!selectedItem) {
return;
}
// Scroll if we reach the scroll margins
const scroll = this.autoscroll(ev.currentY);
// // Get coordinate
const top = this.containerTop - scroll;
const bottom = this.containerBottom - scroll;
const currentY = Math.max(top, Math.min(ev.currentY, bottom));
const deltaY = scroll + currentY - ev.startY;
const normalizedY = currentY - top;
const toIndex = this.itemIndexForTop(normalizedY);
if (toIndex !== this.lastToIndex) {
const fromIndex = indexForItem(selectedItem);
this.lastToIndex = toIndex;
hapticSelectionChanged();
this.reorderMove(fromIndex, toIndex);
}
// Update selected item position
selectedItem.style.transform = `translateY(${deltaY}px)`;
}
onEnd() {
const selectedItemEl = this.selectedItemEl;
this.state = 2 /* Complete */;
if (!selectedItemEl) {
this.state = 0 /* Idle */;
return;
}
const toIndex = this.lastToIndex;
const fromIndex = indexForItem(selectedItemEl);
if (toIndex === fromIndex) {
this.completeSync();
}
else {
this.ionItemReorder.emit({
from: fromIndex,
to: toIndex,
complete: this.completeSync.bind(this)
});
}
hapticSelectionEnd();
}
completeSync(listOrReorder) {
const selectedItemEl = this.selectedItemEl;
if (selectedItemEl && this.state === 2 /* Complete */) {
const children = this.el.children;
const len = children.length;
const toIndex = this.lastToIndex;
const fromIndex = indexForItem(selectedItemEl);
if (toIndex !== fromIndex && (listOrReorder === undefined || listOrReorder === true)) {
const ref = (fromIndex < toIndex)
? children[toIndex + 1]
: children[toIndex];
this.el.insertBefore(selectedItemEl, ref);
}
if (Array.isArray(listOrReorder)) {
listOrReorder = reorderArray(listOrReorder, fromIndex, toIndex);
}
for (let i = 0; i < len; i++) {
children[i].style['transform'] = '';
}
selectedItemEl.style.transition = '';
selectedItemEl.classList.remove(ITEM_REORDER_SELECTED);
this.selectedItemEl = undefined;
this.state = 0 /* Idle */;
}
return listOrReorder;
}
itemIndexForTop(deltaY) {
const heights = this.cachedHeights;
let i = 0;
// TODO: since heights is a sorted array of integers, we can do
// speed up the search using binary search. Remember that linear-search is still
// faster than binary-search for small arrays (<64) due CPU branch misprediction.
for (i = 0; i < heights.length; i++) {
if (heights[i] > deltaY) {
break;
}
}
return i;
}
/********* DOM WRITE ********* */
reorderMove(fromIndex, toIndex) {
const itemHeight = this.selectedItemHeight;
const children = this.el.children;
for (let i = 0; i < children.length; i++) {
const style = children[i].style;
let value = '';
if (i > fromIndex && i <= toIndex) {
value = `translateY(${-itemHeight}px)`;
}
else if (i < fromIndex && i >= toIndex) {
value = `translateY(${itemHeight}px)`;
}
style['transform'] = value;
}
}
autoscroll(posY) {
if (!this.scrollEl) {
return 0;
}
let amount = 0;
if (posY < this.scrollElTop) {
amount = -SCROLL_JUMP;
}
else if (posY > this.scrollElBottom) {
amount = SCROLL_JUMP;
}
if (amount !== 0) {
this.scrollEl.scrollBy(0, amount);
}
return this.scrollEl.scrollTop - this.scrollElInitial;
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
'reorder-enabled': !this.disabled,
'reorder-list-active': this.state !== 0 /* Idle */,
} }));
}
get el() { return getElement(this); }
static get watchers() { return {
"disabled": ["disabledChanged"]
}; }
static get style() { return reorderGroupCss; }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-reorder-group",
"$members$": {
"disabled": [4],
"state": [32],
"complete": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const indexForItem = (element) => {
return element['$ionIndex'];
};
const findReorderItem = (node, container) => {
let parent;
while (node) {
parent = node.parentElement;
if (parent === container) {
return node;
}
node = parent;
}
return undefined;
};
const AUTO_SCROLL_MARGIN = 60;
const SCROLL_JUMP = 10;
const ITEM_REORDER_SELECTED = 'reorder-selected';
const reorderArray = (array, from, to) => {
const element = array[from];
array.splice(from, 1);
array.splice(to, 0, element);
return array.slice();
};
const rippleEffectCss = "/*!@:host*/.sc-ion-ripple-effect-h{left:0;right:0;top:0;bottom:0;position:absolute;contain:strict;pointer-events:none}/*!@:host(.unbounded)*/.unbounded.sc-ion-ripple-effect-h{contain:layout size style}/*!@.ripple-effect*/.ripple-effect.sc-ion-ripple-effect{border-radius:50%;position:absolute;background-color:currentColor;color:inherit;contain:strict;opacity:0;-webkit-animation:225ms rippleAnimation forwards, 75ms fadeInAnimation forwards;animation:225ms rippleAnimation forwards, 75ms fadeInAnimation forwards;will-change:transform, opacity;pointer-events:none}/*!@.fade-out*/.fade-out.sc-ion-ripple-effect{-webkit-transform:translate(var(--translate-end)) scale(var(--final-scale, 1));transform:translate(var(--translate-end)) scale(var(--final-scale, 1));-webkit-animation:150ms fadeOutAnimation forwards;animation:150ms fadeOutAnimation forwards}@-webkit-keyframes rippleAnimation{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(var(--translate-end)) scale(var(--final-scale, 1));transform:translate(var(--translate-end)) scale(var(--final-scale, 1))}}@keyframes rippleAnimation{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(var(--translate-end)) scale(var(--final-scale, 1));transform:translate(var(--translate-end)) scale(var(--final-scale, 1))}}@-webkit-keyframes fadeInAnimation{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:0.16}}@keyframes fadeInAnimation{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:0.16}}@-webkit-keyframes fadeOutAnimation{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}@keyframes fadeOutAnimation{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}";
class RippleEffect {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* Sets the type of ripple-effect:
*
* - `bounded`: the ripple effect expands from the user's click position
* - `unbounded`: the ripple effect expands from the center of the button and overflows the container.
*
* NOTE: Surfaces for bounded ripples should have the overflow property set to hidden,
* while surfaces for unbounded ripples should have it set to visible.
*/
this.type = 'bounded';
}
/**
* Adds the ripple effect to the parent element.
*
* @param x The horizontal coordinate of where the ripple should start.
* @param y The vertical coordinate of where the ripple should start.
*/
async addRipple(x, y) {
return new Promise(resolve => {
readTask(() => {
const rect = this.el.getBoundingClientRect();
const width = rect.width;
const height = rect.height;
const hypotenuse = Math.sqrt(width * width + height * height);
const maxDim = Math.max(height, width);
const maxRadius = this.unbounded ? maxDim : hypotenuse + PADDING;
const initialSize = Math.floor(maxDim * INITIAL_ORIGIN_SCALE);
const finalScale = maxRadius / initialSize;
let posX = x - rect.left;
let posY = y - rect.top;
if (this.unbounded) {
posX = width * 0.5;
posY = height * 0.5;
}
const styleX = posX - initialSize * 0.5;
const styleY = posY - initialSize * 0.5;
const moveX = width * 0.5 - posX;
const moveY = height * 0.5 - posY;
writeTask(() => {
const div = document.createElement('div');
div.classList.add('ripple-effect');
const style = div.style;
style.top = styleY + 'px';
style.left = styleX + 'px';
style.width = style.height = initialSize + 'px';
style.setProperty('--final-scale', `${finalScale}`);
style.setProperty('--translate-end', `${moveX}px, ${moveY}px`);
const container = this.el.shadowRoot || this.el;
container.appendChild(div);
setTimeout(() => {
resolve(() => {
removeRipple(div);
});
}, 225 + 100);
});
});
});
}
get unbounded() {
return this.type === 'unbounded';
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { role: "presentation", class: {
[mode]: true,
'unbounded': this.unbounded
} }));
}
get el() { return getElement(this); }
static get style() { return rippleEffectCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-ripple-effect",
"$members$": {
"type": [1],
"addRipple": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const removeRipple = (ripple) => {
ripple.classList.add('fade-out');
setTimeout(() => {
ripple.remove();
}, 200);
};
const PADDING = 10;
const INITIAL_ORIGIN_SCALE = 0.5;
class Route {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionRouteDataChanged = createEvent(this, "ionRouteDataChanged", 7);
/**
* Relative path that needs to match in order for this route to apply.
*
* Accepts paths similar to expressjs so that you can define parameters
* in the url /foo/:bar where bar would be available in incoming props.
*/
this.url = '';
}
onUpdate(newValue) {
this.ionRouteDataChanged.emit(newValue);
}
onComponentProps(newValue, oldValue) {
if (newValue === oldValue) {
return;
}
const keys1 = newValue ? Object.keys(newValue) : [];
const keys2 = oldValue ? Object.keys(oldValue) : [];
if (keys1.length !== keys2.length) {
this.onUpdate(newValue);
return;
}
for (const key of keys1) {
if (newValue[key] !== oldValue[key]) {
this.onUpdate(newValue);
return;
}
}
}
connectedCallback() {
this.ionRouteDataChanged.emit();
}
static get watchers() { return {
"url": ["onUpdate"],
"component": ["onUpdate"],
"componentProps": ["onComponentProps"]
}; }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-route",
"$members$": {
"url": [1],
"component": [1],
"componentProps": [16],
"beforeLeave": [16],
"beforeEnter": [16]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
class RouteRedirect {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionRouteRedirectChanged = createEvent(this, "ionRouteRedirectChanged", 7);
}
propDidChange() {
this.ionRouteRedirectChanged.emit();
}
connectedCallback() {
this.ionRouteRedirectChanged.emit();
}
static get watchers() { return {
"from": ["propDidChange"],
"to": ["propDidChange"]
}; }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-route-redirect",
"$members$": {
"from": [1],
"to": [1]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const ROUTER_INTENT_NONE = 'root';
const ROUTER_INTENT_FORWARD = 'forward';
const ROUTER_INTENT_BACK = 'back';
// Join the non empty segments with "/".
const generatePath = (segments) => {
const path = segments
.filter(s => s.length > 0)
.join('/');
return '/' + path;
};
const generateUrl = (segments, useHash, queryString) => {
let url = generatePath(segments);
if (useHash) {
url = '#' + url;
}
if (queryString !== undefined) {
url += '?' + queryString;
}
return url;
};
const writePath = (history, root, useHash, path, direction, state, queryString) => {
const url = generateUrl([...parsePath(root).segments, ...path], useHash, queryString);
if (direction === ROUTER_INTENT_FORWARD) {
history.pushState(state, '', url);
}
else {
history.replaceState(state, '', url);
}
};
const chainToPath = (chain) => {
const path = [];
for (const route of chain) {
for (const segment of route.path) {
if (segment[0] === ':') {
const param = route.params && route.params[segment.slice(1)];
if (!param) {
return null;
}
path.push(param);
}
else if (segment !== '') {
path.push(segment);
}
}
}
return path;
};
// Remove the prefix segments from the path segments.
//
// Return:
// - null when the path segments do not start with the passed prefix,
// - the path segments after the prefix otherwise.
const removePrefix = (prefix, path) => {
if (prefix.length > path.length) {
return null;
}
if (prefix.length <= 1 && prefix[0] === '') {
return path;
}
for (let i = 0; i < prefix.length; i++) {
if (prefix[i] !== path[i]) {
return null;
}
}
if (path.length === prefix.length) {
return [''];
}
return path.slice(prefix.length);
};
const readPath = (loc, root, useHash) => {
const prefix = parsePath(root).segments;
const pathname = useHash ? loc.hash.slice(1) : loc.pathname;
const path = parsePath(pathname).segments;
return removePrefix(prefix, path);
};
// Parses the path to:
// - segments an array of '/' separated parts,
// - queryString (undefined when no query string).
const parsePath = (path) => {
let segments = [''];
let queryString;
if (path != null) {
const qsStart = path.indexOf('?');
if (qsStart > -1) {
queryString = path.substr(qsStart + 1);
path = path.substr(0, qsStart);
}
segments = path.split('/')
.map(s => s.trim())
.filter(s => s.length > 0);
if (segments.length === 0) {
segments = [''];
}
}
return { segments, queryString };
};
const printRoutes = (routes) => {
console.group(`[ion-core] ROUTES[${routes.length}]`);
for (const chain of routes) {
const path = [];
chain.forEach(r => path.push(...r.path));
const ids = chain.map(r => r.id);
console.debug(`%c ${generatePath(path)}`, 'font-weight: bold; padding-left: 20px', '=>\t', `(${ids.join(', ')})`);
}
console.groupEnd();
};
const printRedirects = (redirects) => {
console.group(`[ion-core] REDIRECTS[${redirects.length}]`);
for (const redirect of redirects) {
if (redirect.to) {
console.debug('FROM: ', `$c ${generatePath(redirect.from)}`, 'font-weight: bold', ' TO: ', `$c ${generatePath(redirect.to.segments)}`, 'font-weight: bold');
}
}
console.groupEnd();
};
const writeNavState = async (root, chain, direction, index, changed = false, animation) => {
try {
// find next navigation outlet in the DOM
const outlet = searchNavNode(root);
// make sure we can continue interacting the DOM, otherwise abort
if (index >= chain.length || !outlet) {
return changed;
}
await new Promise(resolve => componentOnReady(outlet, resolve));
const route = chain[index];
const result = await outlet.setRouteId(route.id, route.params, direction, animation);
// if the outlet changed the page, reset navigation to neutral (no direction)
// this means nested outlets will not animate
if (result.changed) {
direction = ROUTER_INTENT_NONE;
changed = true;
}
// recursively set nested outlets
changed = await writeNavState(result.element, chain, direction, index + 1, changed, animation);
// once all nested outlets are visible let's make the parent visible too,
// using markVisible prevents flickering
if (result.markVisible) {
await result.markVisible();
}
return changed;
}
catch (e) {
console.error(e);
return false;
}
};
const readNavState = async (root) => {
const ids = [];
let outlet;
let node = root;
// tslint:disable-next-line:no-constant-condition
while (true) {
outlet = searchNavNode(node);
if (outlet) {
const id = await outlet.getRouteId();
if (id) {
node = id.element;
id.element = undefined;
ids.push(id);
}
else {
break;
}
}
else {
break;
}
}
return { ids, outlet };
};
const waitUntilNavNode = () => {
if (searchNavNode(document.body)) {
return Promise.resolve();
}
return new Promise(resolve => {
window.addEventListener('ionNavWillLoad', resolve, { once: true });
});
};
const QUERY$1 = ':not([no-router]) ion-nav, :not([no-router]) ion-tabs, :not([no-router]) ion-router-outlet';
const searchNavNode = (root) => {
if (!root) {
return undefined;
}
if (root.matches(QUERY$1)) {
return root;
}
const outlet = root.querySelector(QUERY$1);
return outlet !== null && outlet !== void 0 ? outlet : undefined;
};
// Returns whether the given redirect matches the given path segments.
//
// A redirect matches when the segments of the path and redirect.from are equal.
// Note that segments are only checked until redirect.from contains a '*' which matches any path segment.
// The path ['some', 'path', 'to', 'page'] matches both ['some', 'path', 'to', 'page'] and ['some', 'path', '*'].
const matchesRedirect = (path, redirect) => {
const { from, to } = redirect;
if (to === undefined) {
return false;
}
if (from.length > path.length) {
return false;
}
for (let i = 0; i < from.length; i++) {
const expected = from[i];
if (expected === '*') {
return true;
}
if (expected !== path[i]) {
return false;
}
}
return from.length === path.length;
};
// Returns the first redirect matching the path segments or undefined when no match found.
const findRouteRedirect = (path, redirects) => {
return redirects.find(redirect => matchesRedirect(path, redirect));
};
const matchesIDs = (ids, chain) => {
const len = Math.min(ids.length, chain.length);
let i = 0;
for (; i < len; i++) {
if (ids[i].toLowerCase() !== chain[i].id) {
break;
}
}
return i;
};
const matchesPath = (inputPath, chain) => {
const segments = new RouterSegments(inputPath);
let matchesDefault = false;
let allparams;
for (let i = 0; i < chain.length; i++) {
const path = chain[i].path;
if (path[0] === '') {
matchesDefault = true;
}
else {
for (const segment of path) {
const data = segments.next();
// data param
if (segment[0] === ':') {
if (data === '') {
return null;
}
allparams = allparams || [];
const params = allparams[i] || (allparams[i] = {});
params[segment.slice(1)] = data;
}
else if (data !== segment) {
return null;
}
}
matchesDefault = false;
}
}
const matches = (matchesDefault)
? matchesDefault === (segments.next() === '')
: true;
if (!matches) {
return null;
}
if (allparams) {
return chain.map((route, i) => ({
id: route.id,
path: route.path,
params: mergeParams(route.params, allparams[i]),
beforeEnter: route.beforeEnter,
beforeLeave: route.beforeLeave
}));
}
return chain;
};
// Merges the route parameter objects.
// Returns undefined when both parameters are undefined.
const mergeParams = (a, b) => {
return a || b ? Object.assign(Object.assign({}, a), b) : undefined;
};
const routerIDsToChain = (ids, chains) => {
let match = null;
let maxMatches = 0;
const plainIDs = ids.map(i => i.id);
for (const chain of chains) {
const score = matchesIDs(plainIDs, chain);
if (score > maxMatches) {
match = chain;
maxMatches = score;
}
}
if (match) {
return match.map((route, i) => ({
id: route.id,
path: route.path,
params: mergeParams(route.params, ids[i] && ids[i].params)
}));
}
return null;
};
const routerPathToChain = (path, chains) => {
let match = null;
let matches = 0;
for (const chain of chains) {
const matchedChain = matchesPath(path, chain);
if (matchedChain !== null) {
const score = computePriority(matchedChain);
if (score > matches) {
matches = score;
match = matchedChain;
}
}
}
return match;
};
const computePriority = (chain) => {
let score = 1;
let level = 1;
for (const route of chain) {
for (const path of route.path) {
if (path[0] === ':') {
score += Math.pow(1, level);
}
else if (path !== '') {
score += Math.pow(2, level);
}
level++;
}
}
return score;
};
class RouterSegments {
constructor(path) {
this.path = path.slice();
}
next() {
if (this.path.length > 0) {
return this.path.shift();
}
return '';
}
}
const readProp = (el, prop) => {
if (prop in el) {
return el[prop];
}
if (el.hasAttribute(prop)) {
return el.getAttribute(prop);
}
return null;
};
const readRedirects = (root) => {
return Array.from(root.children)
.filter(el => el.tagName === 'ION-ROUTE-REDIRECT')
.map(el => {
const to = readProp(el, 'to');
return {
from: parsePath(readProp(el, 'from')).segments,
to: to == null ? undefined : parsePath(to),
};
});
};
const readRoutes = (root) => {
return flattenRouterTree(readRouteNodes(root));
};
const readRouteNodes = (node) => {
return Array.from(node.children)
.filter(el => el.tagName === 'ION-ROUTE' && el.component)
.map(el => {
const component = readProp(el, 'component');
return {
path: parsePath(readProp(el, 'url')).segments,
id: component.toLowerCase(),
params: el.componentProps,
beforeLeave: el.beforeLeave,
beforeEnter: el.beforeEnter,
children: readRouteNodes(el)
};
});
};
const flattenRouterTree = (nodes) => {
const chains = [];
for (const node of nodes) {
flattenNode([], chains, node);
}
return chains;
};
const flattenNode = (chain, chains, node) => {
chain = chain.slice();
chain.push({
id: node.id,
path: node.path,
params: node.params,
beforeLeave: node.beforeLeave,
beforeEnter: node.beforeEnter
});
if (node.children.length === 0) {
chains.push(chain);
return;
}
for (const child of node.children) {
flattenNode(chain, chains, child);
}
};
class Router {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionRouteWillChange = createEvent(this, "ionRouteWillChange", 7);
this.ionRouteDidChange = createEvent(this, "ionRouteDidChange", 7);
this.previousPath = null;
this.busy = false;
this.state = 0;
this.lastState = 0;
/**
* By default `ion-router` will match the routes at the root path ("/").
* That can be changed when
*
*/
this.root = '/';
/**
* The router can work in two "modes":
* - With hash: `/index.html#/path/to/page`
* - Without hash: `/path/to/page`
*
* Using one or another might depend in the requirements of your app and/or where it's deployed.
*
* Usually "hash-less" navigation works better for SEO and it's more user friendly too, but it might
* requires additional server-side configuration in order to properly work.
*
* On the other side hash-navigation is much easier to deploy, it even works over the file protocol.
*
* By default, this property is `true`, change to `false` to allow hash-less URLs.
*/
this.useHash = true;
}
async componentWillLoad() {
await waitUntilNavNode();
const canProceed = await this.runGuards(this.getPath());
if (canProceed !== true) {
if (typeof canProceed === 'object') {
const { redirect } = canProceed;
const path = parsePath(redirect);
this.setPath(path.segments, ROUTER_INTENT_NONE, path.queryString);
await this.writeNavStateRoot(path.segments, ROUTER_INTENT_NONE);
}
}
else {
await this.onRoutesChanged();
}
}
componentDidLoad() {
window.addEventListener('ionRouteRedirectChanged', debounce(this.onRedirectChanged.bind(this), 10));
window.addEventListener('ionRouteDataChanged', debounce(this.onRoutesChanged.bind(this), 100));
}
async onPopState() {
const direction = this.historyDirection();
let segments = this.getPath();
const canProceed = await this.runGuards(segments);
if (canProceed !== true) {
if (typeof canProceed === 'object') {
segments = parsePath(canProceed.redirect).segments;
}
else {
return false;
}
}
return this.writeNavStateRoot(segments, direction);
}
onBackButton(ev) {
ev.detail.register(0, processNextHandler => {
this.back();
processNextHandler();
});
}
/** @internal */
async canTransition() {
const canProceed = await this.runGuards();
if (canProceed !== true) {
if (typeof canProceed === 'object') {
return canProceed.redirect;
}
else {
return false;
}
}
return true;
}
/**
* Navigate to the specified URL.
*
* @param url The url to navigate to.
* @param direction The direction of the animation. Defaults to `"forward"`.
*/
async push(url, direction = 'forward', animation) {
if (url.startsWith('.')) {
url = (new URL(url, window.location.href)).pathname;
}
let parsedPath = parsePath(url);
const canProceed = await this.runGuards(parsedPath.segments);
if (canProceed !== true) {
if (typeof canProceed === 'object') {
parsedPath = parsePath(canProceed.redirect);
}
else {
return false;
}
}
this.setPath(parsedPath.segments, direction, parsedPath.queryString);
return this.writeNavStateRoot(parsedPath.segments, direction, animation);
}
/**
* Go back to previous page in the window.history.
*/
back() {
window.history.back();
return Promise.resolve(this.waitPromise);
}
/** @internal */
async printDebug() {
printRoutes(readRoutes(this.el));
printRedirects(readRedirects(this.el));
}
/** @internal */
async navChanged(direction) {
if (this.busy) {
console.warn('[ion-router] router is busy, navChanged was cancelled');
return false;
}
const { ids, outlet } = await readNavState(window.document.body);
const routes = readRoutes(this.el);
const chain = routerIDsToChain(ids, routes);
if (!chain) {
console.warn('[ion-router] no matching URL for ', ids.map(i => i.id));
return false;
}
const path = chainToPath(chain);
if (!path) {
console.warn('[ion-router] router could not match path because some required param is missing');
return false;
}
this.setPath(path, direction);
await this.safeWriteNavState(outlet, chain, ROUTER_INTENT_NONE, path, null, ids.length);
return true;
}
// This handler gets called when a `ion-route-redirect` component is added to the DOM or if the from or to property of such node changes.
onRedirectChanged() {
const path = this.getPath();
if (path && findRouteRedirect(path, readRedirects(this.el))) {
this.writeNavStateRoot(path, ROUTER_INTENT_NONE);
}
}
// This handler gets called when a `ion-route` component is added to the DOM or if the from or to property of such node changes.
onRoutesChanged() {
return this.writeNavStateRoot(this.getPath(), ROUTER_INTENT_NONE);
}
historyDirection() {
var _a;
const win = window;
if (win.history.state === null) {
this.state++;
win.history.replaceState(this.state, win.document.title, (_a = win.document.location) === null || _a === void 0 ? void 0 : _a.href);
}
const state = win.history.state;
const lastState = this.lastState;
this.lastState = state;
if (state > lastState || (state >= lastState && lastState > 0)) {
return ROUTER_INTENT_FORWARD;
}
if (state < lastState) {
return ROUTER_INTENT_BACK;
}
return ROUTER_INTENT_NONE;
}
async writeNavStateRoot(path, direction, animation) {
if (!path) {
console.error('[ion-router] URL is not part of the routing set');
return false;
}
// lookup redirect rule
const redirects = readRedirects(this.el);
const redirect = findRouteRedirect(path, redirects);
let redirectFrom = null;
if (redirect) {
const { segments, queryString } = redirect.to;
this.setPath(segments, direction, queryString);
redirectFrom = redirect.from;
path = segments;
}
// lookup route chain
const routes = readRoutes(this.el);
const chain = routerPathToChain(path, routes);
if (!chain) {
console.error('[ion-router] the path does not match any route');
return false;
}
// write DOM give
return this.safeWriteNavState(document.body, chain, direction, path, redirectFrom, 0, animation);
}
async safeWriteNavState(node, chain, direction, path, redirectFrom, index = 0, animation) {
const unlock = await this.lock();
let changed = false;
try {
changed = await this.writeNavState(node, chain, direction, path, redirectFrom, index, animation);
}
catch (e) {
console.error(e);
}
unlock();
return changed;
}
async lock() {
const p = this.waitPromise;
let resolve;
this.waitPromise = new Promise(r => resolve = r);
if (p !== undefined) {
await p;
}
return resolve;
}
// Executes the beforeLeave hook of the source route and the beforeEnter hook of the target route if they exist.
//
// When the beforeLeave hook does not return true (to allow navigating) then that value is returned early and the beforeEnter is executed.
// Otherwise the beforeEnterHook hook of the target route is executed.
async runGuards(to = this.getPath(), from) {
if (from === undefined) {
from = parsePath(this.previousPath).segments;
}
if (!to || !from) {
return true;
}
const routes = readRoutes(this.el);
const fromChain = routerPathToChain(from, routes);
const beforeLeaveHook = fromChain && fromChain[fromChain.length - 1].beforeLeave;
const canLeave = beforeLeaveHook ? await beforeLeaveHook() : true;
if (canLeave === false || typeof canLeave === 'object') {
return canLeave;
}
const toChain = routerPathToChain(to, routes);
const beforeEnterHook = toChain && toChain[toChain.length - 1].beforeEnter;
return beforeEnterHook ? beforeEnterHook() : true;
}
async writeNavState(node, chain, direction, path, redirectFrom, index = 0, animation) {
if (this.busy) {
console.warn('[ion-router] router is busy, transition was cancelled');
return false;
}
this.busy = true;
// generate route event and emit will change
const routeEvent = this.routeChangeEvent(path, redirectFrom);
if (routeEvent) {
this.ionRouteWillChange.emit(routeEvent);
}
const changed = await writeNavState(node, chain, direction, index, false, animation);
this.busy = false;
// emit did change
if (routeEvent) {
this.ionRouteDidChange.emit(routeEvent);
}
return changed;
}
setPath(path, direction, queryString) {
this.state++;
writePath(window.history, this.root, this.useHash, path, direction, this.state, queryString);
}
getPath() {
return readPath(window.location, this.root, this.useHash);
}
routeChangeEvent(path, redirectFromPath) {
const from = this.previousPath;
const to = generatePath(path);
this.previousPath = to;
if (to === from) {
return null;
}
const redirectedFrom = redirectFromPath ? generatePath(redirectFromPath) : null;
return {
from,
redirectedFrom,
to,
};
}
get el() { return getElement(this); }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-router",
"$members$": {
"root": [1],
"useHash": [4, "use-hash"],
"canTransition": [64],
"push": [64],
"back": [64],
"printDebug": [64],
"navChanged": [64]
},
"$listeners$": [[8, "popstate", "onPopState"], [4, "ionBackButton", "onBackButton"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const routerLinkCss = "/*!@:host*/.sc-ion-router-link-h{--background:transparent;--color:var(--ion-color-primary, #3880ff);background:var(--background);color:var(--color)}/*!@:host(.ion-color)*/.ion-color.sc-ion-router-link-h{color:var(--ion-color-base)}/*!@a*/a.sc-ion-router-link{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit}";
class RouterLink {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* When using a router, it specifies the transition direction when navigating to
* another page using `href`.
*/
this.routerDirection = 'forward';
this.onClick = (ev) => {
openURL(this.href, ev, this.routerDirection, this.routerAnimation);
};
}
render() {
const mode = getIonMode$1(this);
const attrs = {
href: this.href,
rel: this.rel,
target: this.target
};
return (hAsync(Host, { onClick: this.onClick, class: createColorClasses$1(this.color, {
[mode]: true,
'ion-activatable': true
}) }, hAsync("a", Object.assign({}, attrs), hAsync("slot", null))));
}
static get style() { return routerLinkCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-router-link",
"$members$": {
"color": [513],
"href": [1],
"rel": [1],
"routerDirection": [1, "router-direction"],
"routerAnimation": [16],
"target": [1]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const routeOutletCss = "/*!@:host*/.sc-ion-router-outlet-h{left:0;right:0;top:0;bottom:0;position:absolute;contain:layout size style;overflow:hidden;z-index:0}";
class RouterOutlet {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionNavWillLoad = createEvent(this, "ionNavWillLoad", 7);
this.ionNavWillChange = createEvent(this, "ionNavWillChange", 3);
this.ionNavDidChange = createEvent(this, "ionNavDidChange", 3);
this.gestureOrAnimationInProgress = false;
/**
* The mode determines which platform styles to use.
*/
this.mode = getIonMode$1(this);
/**
* If `true`, the router-outlet should animate the transition of components.
*/
this.animated = true;
}
swipeHandlerChanged() {
if (this.gesture) {
this.gesture.enable(this.swipeHandler !== undefined);
}
}
async connectedCallback() {
const onStart = () => {
this.gestureOrAnimationInProgress = true;
if (this.swipeHandler) {
this.swipeHandler.onStart();
}
};
this.gesture = (await Promise.resolve().then(function () { return swipeBack; })).createSwipeBackGesture(this.el, () => !this.gestureOrAnimationInProgress && !!this.swipeHandler && this.swipeHandler.canStart(), () => onStart(), step => this.ani && this.ani.progressStep(step), (shouldComplete, step, dur) => {
if (this.ani) {
this.ani.onFinish(() => {
this.gestureOrAnimationInProgress = false;
if (this.swipeHandler) {
this.swipeHandler.onEnd(shouldComplete);
}
}, { oneTimeCallback: true });
// Account for rounding errors in JS
let newStepValue = (shouldComplete) ? -0.001 : 0.001;
/**
* Animation will be reversed here, so need to
* reverse the easing curve as well
*
* Additionally, we need to account for the time relative
* to the new easing curve, as `stepValue` is going to be given
* in terms of a linear curve.
*/
if (!shouldComplete) {
this.ani.easing('cubic-bezier(1, 0, 0.68, 0.28)');
newStepValue += getTimeGivenProgression([0, 0], [1, 0], [0.68, 0.28], [1, 1], step)[0];
}
else {
newStepValue += getTimeGivenProgression([0, 0], [0.32, 0.72], [0, 1], [1, 1], step)[0];
}
this.ani.progressEnd(shouldComplete ? 1 : 0, newStepValue, dur);
}
else {
this.gestureOrAnimationInProgress = false;
}
});
this.swipeHandlerChanged();
}
componentWillLoad() {
this.ionNavWillLoad.emit();
}
disconnectedCallback() {
if (this.gesture) {
this.gesture.destroy();
this.gesture = undefined;
}
}
/** @internal */
async commit(enteringEl, leavingEl, opts) {
const unlock = await this.lock();
let changed = false;
try {
changed = await this.transition(enteringEl, leavingEl, opts);
}
catch (e) {
console.error(e);
}
unlock();
return changed;
}
/** @internal */
async setRouteId(id, params, direction, animation) {
const changed = await this.setRoot(id, params, {
duration: direction === 'root' ? 0 : undefined,
direction: direction === 'back' ? 'back' : 'forward',
animationBuilder: animation
});
return {
changed,
element: this.activeEl
};
}
/** @internal */
async getRouteId() {
const active = this.activeEl;
return active ? {
id: active.tagName,
element: active,
} : undefined;
}
async setRoot(component, params, opts) {
if (this.activeComponent === component) {
return false;
}
// attach entering view to DOM
const leavingEl = this.activeEl;
const enteringEl = await attachComponent(this.delegate, this.el, component, ['ion-page', 'ion-page-invisible'], params);
this.activeComponent = component;
this.activeEl = enteringEl;
// commit animation
await this.commit(enteringEl, leavingEl, opts);
await detachComponent(this.delegate, leavingEl);
return true;
}
async transition(enteringEl, leavingEl, opts = {}) {
if (leavingEl === enteringEl) {
return false;
}
// emit nav will change event
this.ionNavWillChange.emit();
const { el, mode } = this;
const animated = this.animated && config.getBoolean('animated', true);
const animationBuilder = opts.animationBuilder || this.animation || config.get('navAnimation');
await transition$2(Object.assign(Object.assign({ mode,
animated,
enteringEl,
leavingEl, baseEl: el, progressCallback: (opts.progressAnimation
? ani => {
/**
* Because this progress callback is called asynchronously
* it is possible for the gesture to start and end before
* the animation is ever set. In that scenario, we should
* immediately call progressEnd so that the transition promise
* resolves and the gesture does not get locked up.
*/
if (ani !== undefined && !this.gestureOrAnimationInProgress) {
this.gestureOrAnimationInProgress = true;
ani.onFinish(() => {
this.gestureOrAnimationInProgress = false;
if (this.swipeHandler) {
this.swipeHandler.onEnd(false);
}
}, { oneTimeCallback: true });
/**
* Playing animation to beginning
* with a duration of 0 prevents
* any flickering when the animation
* is later cleaned up.
*/
ani.progressEnd(0, 0, 0);
}
else {
this.ani = ani;
}
}
: undefined) }, opts), { animationBuilder }));
// emit nav changed event
this.ionNavDidChange.emit();
return true;
}
async lock() {
const p = this.waitPromise;
let resolve;
this.waitPromise = new Promise(r => resolve = r);
if (p !== undefined) {
await p;
}
return resolve;
}
render() {
return (hAsync("slot", null));
}
get el() { return getElement(this); }
static get watchers() { return {
"swipeHandler": ["swipeHandlerChanged"]
}; }
static get style() { return routeOutletCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-router-outlet",
"$members$": {
"mode": [1025],
"delegate": [16],
"animated": [4],
"animation": [16],
"swipeHandler": [16],
"commit": [64],
"setRouteId": [64],
"getRouteId": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const rowCss = "/*!@:host*/.sc-ion-row-h{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}";
class Row {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
return (hAsync(Host, { class: getIonMode$1(this) }, hAsync("slot", null)));
}
static get style() { return rowCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-row",
"$members$": undefined,
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const searchbarIosCss = ".sc-ion-searchbar-ios-h{--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:.5;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;width:100%;color:var(--color);font-family:var(--ion-font-family, inherit);-webkit-box-sizing:border-box;box-sizing:border-box}.ion-color.sc-ion-searchbar-ios-h{color:var(--ion-color-contrast)}.ion-color.sc-ion-searchbar-ios-h .searchbar-input.sc-ion-searchbar-ios{background:var(--ion-color-base)}.ion-color.sc-ion-searchbar-ios-h .searchbar-clear-button.sc-ion-searchbar-ios,.ion-color.sc-ion-searchbar-ios-h .searchbar-cancel-button.sc-ion-searchbar-ios,.ion-color.sc-ion-searchbar-ios-h .searchbar-search-icon.sc-ion-searchbar-ios{color:inherit}.searchbar-search-icon.sc-ion-searchbar-ios{color:var(--icon-color);pointer-events:none}.searchbar-input-container.sc-ion-searchbar-ios{display:block;position:relative;-ms-flex-negative:1;flex-shrink:1;width:100%}.searchbar-input.sc-ion-searchbar-ios{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;border-radius:var(--border-radius);display:block;width:100%;border:0;outline:none;background:var(--background);font-family:inherit;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none}.searchbar-input.sc-ion-searchbar-ios::-webkit-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.searchbar-input.sc-ion-searchbar-ios::-moz-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.searchbar-input.sc-ion-searchbar-ios:-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.searchbar-input.sc-ion-searchbar-ios::-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.searchbar-input.sc-ion-searchbar-ios::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.searchbar-input.sc-ion-searchbar-ios::-webkit-search-cancel-button,.searchbar-input.sc-ion-searchbar-ios::-ms-clear{display:none}.searchbar-cancel-button.sc-ion-searchbar-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:none;height:100%;border:0;outline:none;color:var(--cancel-button-color);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.searchbar-cancel-button.sc-ion-searchbar-ios>div.sc-ion-searchbar-ios{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%}.searchbar-clear-button.sc-ion-searchbar-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:none;min-height:0;outline:none;color:var(--clear-button-color);-webkit-appearance:none;-moz-appearance:none;appearance:none}.searchbar-has-value.searchbar-should-show-clear.sc-ion-searchbar-ios-h .searchbar-clear-button.sc-ion-searchbar-ios{display:block}.searchbar-disabled.sc-ion-searchbar-ios-h{cursor:default;opacity:0.4;pointer-events:none}.sc-ion-searchbar-ios-h{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.07);--border-radius:10px;--box-shadow:none;--cancel-button-color:var(--ion-color-primary, #3880ff);--clear-button-color:var(--ion-color-step-600, #666666);--color:var(--ion-text-color, #000);--icon-color:var(--ion-color-step-600, #666666);padding-left:12px;padding-right:12px;padding-top:12px;padding-bottom:12px;height:60px;contain:strict}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.sc-ion-searchbar-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px}}.searchbar-input-container.sc-ion-searchbar-ios{height:36px}.searchbar-search-icon.sc-ion-searchbar-ios{margin-left:calc(50% - 60px);left:5px;top:0;position:absolute;width:22px;height:100%;contain:strict}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.searchbar-search-icon.sc-ion-searchbar-ios{margin-left:unset;-webkit-margin-start:calc(50% - 60px);margin-inline-start:calc(50% - 60px)}}[dir=rtl].sc-ion-searchbar-ios .searchbar-search-icon.sc-ion-searchbar-ios,[dir=rtl].sc-ion-searchbar-ios-h .searchbar-search-icon.sc-ion-searchbar-ios,[dir=rtl] .sc-ion-searchbar-ios-h .searchbar-search-icon.sc-ion-searchbar-ios{left:unset;right:unset;right:5px}.searchbar-input.sc-ion-searchbar-ios{padding-left:28px;padding-right:28px;padding-top:0;padding-bottom:0;height:100%;font-size:17px;font-weight:400;contain:strict}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.searchbar-input.sc-ion-searchbar-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:28px;padding-inline-start:28px;-webkit-padding-end:28px;padding-inline-end:28px}}.searchbar-clear-button.sc-ion-searchbar-ios{right:0;top:0;background-position:center;position:absolute;width:30px;height:100%;border:0;background-color:transparent}[dir=rtl].sc-ion-searchbar-ios .searchbar-clear-button.sc-ion-searchbar-ios,[dir=rtl].sc-ion-searchbar-ios-h .searchbar-clear-button.sc-ion-searchbar-ios,[dir=rtl] .sc-ion-searchbar-ios-h .searchbar-clear-button.sc-ion-searchbar-ios{left:unset;right:unset;left:0}.searchbar-clear-icon.sc-ion-searchbar-ios{width:18px;height:100%}.searchbar-cancel-button.sc-ion-searchbar-ios{padding-left:8px;padding-right:0;padding-top:0;padding-bottom:0;-ms-flex-negative:0;flex-shrink:0;background-color:transparent;font-size:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.searchbar-cancel-button.sc-ion-searchbar-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:0;padding-inline-end:0}}.searchbar-left-aligned.sc-ion-searchbar-ios-h .searchbar-search-icon.sc-ion-searchbar-ios{margin-left:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.searchbar-left-aligned.sc-ion-searchbar-ios-h .searchbar-search-icon.sc-ion-searchbar-ios{margin-left:unset;-webkit-margin-start:0;margin-inline-start:0}}.searchbar-left-aligned.sc-ion-searchbar-ios-h .searchbar-input.sc-ion-searchbar-ios{padding-left:30px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.searchbar-left-aligned.sc-ion-searchbar-ios-h .searchbar-input.sc-ion-searchbar-ios{padding-left:unset;-webkit-padding-start:30px;padding-inline-start:30px}}.searchbar-has-focus.sc-ion-searchbar-ios-h .searchbar-cancel-button.sc-ion-searchbar-ios,.searchbar-should-show-cancel.sc-ion-searchbar-ios-h .searchbar-cancel-button.sc-ion-searchbar-ios,.searchbar-animated.sc-ion-searchbar-ios-h .searchbar-cancel-button.sc-ion-searchbar-ios{display:block}.searchbar-animated.sc-ion-searchbar-ios-h .searchbar-search-icon.sc-ion-searchbar-ios,.searchbar-animated.sc-ion-searchbar-ios-h .searchbar-input.sc-ion-searchbar-ios{-webkit-transition:all 300ms ease;transition:all 300ms ease}.searchbar-animated.searchbar-has-focus.sc-ion-searchbar-ios-h .searchbar-cancel-button.sc-ion-searchbar-ios,.searchbar-animated.searchbar-should-show-cancel.sc-ion-searchbar-ios-h .searchbar-cancel-button.sc-ion-searchbar-ios{opacity:1;pointer-events:auto}.searchbar-animated.sc-ion-searchbar-ios-h .searchbar-cancel-button.sc-ion-searchbar-ios{margin-right:-100%;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);-webkit-transition:all 300ms ease;transition:all 300ms ease;opacity:0;pointer-events:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.searchbar-animated.sc-ion-searchbar-ios-h .searchbar-cancel-button.sc-ion-searchbar-ios{margin-right:unset;-webkit-margin-end:-100%;margin-inline-end:-100%}}.searchbar-no-animate.sc-ion-searchbar-ios-h .searchbar-search-icon.sc-ion-searchbar-ios,.searchbar-no-animate.sc-ion-searchbar-ios-h .searchbar-input.sc-ion-searchbar-ios,.searchbar-no-animate.sc-ion-searchbar-ios-h .searchbar-cancel-button.sc-ion-searchbar-ios{-webkit-transition-duration:0ms;transition-duration:0ms}.ion-color.sc-ion-searchbar-ios-h .searchbar-cancel-button.sc-ion-searchbar-ios{color:var(--ion-color-base)}@media (any-hover: hover){.ion-color.sc-ion-searchbar-ios-h .searchbar-cancel-button.sc-ion-searchbar-ios:hover{color:var(--ion-color-tint)}}ion-toolbar.sc-ion-searchbar-ios-h,ion-toolbar .sc-ion-searchbar-ios-h{padding-top:1px;padding-bottom:15px;height:52px}ion-toolbar.ion-color.sc-ion-searchbar-ios-h:not(.ion-color),ion-toolbar.ion-color .sc-ion-searchbar-ios-h:not(.ion-color){color:inherit}ion-toolbar.ion-color.sc-ion-searchbar-ios-h:not(.ion-color) .searchbar-cancel-button.sc-ion-searchbar-ios,ion-toolbar.ion-color .sc-ion-searchbar-ios-h:not(.ion-color) .searchbar-cancel-button.sc-ion-searchbar-ios{color:currentColor}ion-toolbar.ion-color.sc-ion-searchbar-ios-h .searchbar-search-icon.sc-ion-searchbar-ios,ion-toolbar.ion-color .sc-ion-searchbar-ios-h .searchbar-search-icon.sc-ion-searchbar-ios{color:currentColor;opacity:0.5}ion-toolbar.ion-color.sc-ion-searchbar-ios-h:not(.ion-color) .searchbar-input.sc-ion-searchbar-ios,ion-toolbar.ion-color .sc-ion-searchbar-ios-h:not(.ion-color) .searchbar-input.sc-ion-searchbar-ios{background:rgba(var(--ion-color-contrast-rgb), 0.07);color:currentColor}ion-toolbar.ion-color.sc-ion-searchbar-ios-h:not(.ion-color) .searchbar-clear-button.sc-ion-searchbar-ios,ion-toolbar.ion-color .sc-ion-searchbar-ios-h:not(.ion-color) .searchbar-clear-button.sc-ion-searchbar-ios{color:currentColor;opacity:0.5}";
const searchbarMdCss = ".sc-ion-searchbar-md-h{--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:.5;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;width:100%;color:var(--color);font-family:var(--ion-font-family, inherit);-webkit-box-sizing:border-box;box-sizing:border-box}.ion-color.sc-ion-searchbar-md-h{color:var(--ion-color-contrast)}.ion-color.sc-ion-searchbar-md-h .searchbar-input.sc-ion-searchbar-md{background:var(--ion-color-base)}.ion-color.sc-ion-searchbar-md-h .searchbar-clear-button.sc-ion-searchbar-md,.ion-color.sc-ion-searchbar-md-h .searchbar-cancel-button.sc-ion-searchbar-md,.ion-color.sc-ion-searchbar-md-h .searchbar-search-icon.sc-ion-searchbar-md{color:inherit}.searchbar-search-icon.sc-ion-searchbar-md{color:var(--icon-color);pointer-events:none}.searchbar-input-container.sc-ion-searchbar-md{display:block;position:relative;-ms-flex-negative:1;flex-shrink:1;width:100%}.searchbar-input.sc-ion-searchbar-md{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;border-radius:var(--border-radius);display:block;width:100%;border:0;outline:none;background:var(--background);font-family:inherit;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none}.searchbar-input.sc-ion-searchbar-md::-webkit-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.searchbar-input.sc-ion-searchbar-md::-moz-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.searchbar-input.sc-ion-searchbar-md:-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.searchbar-input.sc-ion-searchbar-md::-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.searchbar-input.sc-ion-searchbar-md::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.searchbar-input.sc-ion-searchbar-md::-webkit-search-cancel-button,.searchbar-input.sc-ion-searchbar-md::-ms-clear{display:none}.searchbar-cancel-button.sc-ion-searchbar-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:none;height:100%;border:0;outline:none;color:var(--cancel-button-color);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.searchbar-cancel-button.sc-ion-searchbar-md>div.sc-ion-searchbar-md{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%}.searchbar-clear-button.sc-ion-searchbar-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:none;min-height:0;outline:none;color:var(--clear-button-color);-webkit-appearance:none;-moz-appearance:none;appearance:none}.searchbar-has-value.searchbar-should-show-clear.sc-ion-searchbar-md-h .searchbar-clear-button.sc-ion-searchbar-md{display:block}.searchbar-disabled.sc-ion-searchbar-md-h{cursor:default;opacity:0.4;pointer-events:none}.sc-ion-searchbar-md-h{--background:var(--ion-background-color, #fff);--border-radius:2px;--box-shadow:0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);--cancel-button-color:var(--ion-color-step-900, #1a1a1a);--clear-button-color:initial;--color:var(--ion-color-step-850, #262626);--icon-color:var(--ion-color-step-600, #666666);padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px;background:inherit}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.sc-ion-searchbar-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px}}.searchbar-search-icon.sc-ion-searchbar-md{left:16px;top:11px;width:21px;height:21px}[dir=rtl].sc-ion-searchbar-md .searchbar-search-icon.sc-ion-searchbar-md,[dir=rtl].sc-ion-searchbar-md-h .searchbar-search-icon.sc-ion-searchbar-md,[dir=rtl] .sc-ion-searchbar-md-h .searchbar-search-icon.sc-ion-searchbar-md{left:unset;right:unset;right:16px}.searchbar-cancel-button.sc-ion-searchbar-md{left:5px;top:0;background-color:transparent;font-size:1.6em}[dir=rtl].sc-ion-searchbar-md .searchbar-cancel-button.sc-ion-searchbar-md,[dir=rtl].sc-ion-searchbar-md-h .searchbar-cancel-button.sc-ion-searchbar-md,[dir=rtl] .sc-ion-searchbar-md-h .searchbar-cancel-button.sc-ion-searchbar-md{left:unset;right:unset;right:5px}.searchbar-search-icon.sc-ion-searchbar-md,.searchbar-cancel-button.sc-ion-searchbar-md{position:absolute}.searchbar-search-icon.ion-activated.sc-ion-searchbar-md,.searchbar-cancel-button.ion-activated.sc-ion-searchbar-md{background-color:transparent}.searchbar-input.sc-ion-searchbar-md{padding-left:55px;padding-right:55px;padding-top:6px;padding-bottom:6px;background-position:left 8px center;height:auto;font-size:16px;font-weight:400;line-height:30px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.searchbar-input.sc-ion-searchbar-md{padding-left:unset;padding-right:unset;-webkit-padding-start:55px;padding-inline-start:55px;-webkit-padding-end:55px;padding-inline-end:55px}}[dir=rtl].sc-ion-searchbar-md .searchbar-input.sc-ion-searchbar-md,[dir=rtl].sc-ion-searchbar-md-h .searchbar-input.sc-ion-searchbar-md,[dir=rtl] .sc-ion-searchbar-md-h .searchbar-input.sc-ion-searchbar-md{background-position:right 8px center}.searchbar-clear-button.sc-ion-searchbar-md{right:13px;top:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;position:absolute;height:100%;border:0;background-color:transparent}[dir=rtl].sc-ion-searchbar-md .searchbar-clear-button.sc-ion-searchbar-md,[dir=rtl].sc-ion-searchbar-md-h .searchbar-clear-button.sc-ion-searchbar-md,[dir=rtl] .sc-ion-searchbar-md-h .searchbar-clear-button.sc-ion-searchbar-md{left:unset;right:unset;left:13px}.searchbar-clear-button.ion-activated.sc-ion-searchbar-md{background-color:transparent}.searchbar-clear-icon.sc-ion-searchbar-md{width:22px;height:100%}.searchbar-has-focus.sc-ion-searchbar-md-h .searchbar-search-icon.sc-ion-searchbar-md{display:block}.searchbar-has-focus.sc-ion-searchbar-md-h .searchbar-cancel-button.sc-ion-searchbar-md,.searchbar-should-show-cancel.sc-ion-searchbar-md-h .searchbar-cancel-button.sc-ion-searchbar-md{display:block}.searchbar-has-focus.sc-ion-searchbar-md-h .searchbar-cancel-button.sc-ion-searchbar-md+.searchbar-search-icon.sc-ion-searchbar-md,.searchbar-should-show-cancel.sc-ion-searchbar-md-h .searchbar-cancel-button.sc-ion-searchbar-md+.searchbar-search-icon.sc-ion-searchbar-md{display:none}ion-toolbar.sc-ion-searchbar-md-h,ion-toolbar .sc-ion-searchbar-md-h{padding-left:7px;padding-right:7px;padding-top:3px;padding-bottom:3px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){ion-toolbar.sc-ion-searchbar-md-h,ion-toolbar .sc-ion-searchbar-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:7px;padding-inline-start:7px;-webkit-padding-end:7px;padding-inline-end:7px}}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Searchbar {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionInput = createEvent(this, "ionInput", 7);
this.ionChange = createEvent(this, "ionChange", 7);
this.ionCancel = createEvent(this, "ionCancel", 7);
this.ionClear = createEvent(this, "ionClear", 7);
this.ionBlur = createEvent(this, "ionBlur", 7);
this.ionFocus = createEvent(this, "ionFocus", 7);
this.ionStyle = createEvent(this, "ionStyle", 7);
this.isCancelVisible = false;
this.shouldAlignLeft = true;
this.focused = false;
this.noAnimate = true;
/**
* If `true`, enable searchbar animation.
*/
this.animated = false;
/**
* Set the input's autocomplete property.
*/
this.autocomplete = 'off';
/**
* Set the input's autocorrect property.
*/
this.autocorrect = 'off';
/**
* Set the cancel button icon. Only applies to `md` mode.
* Defaults to `"arrow-back-sharp"`.
*/
this.cancelButtonIcon = config.get('backButtonIcon', 'arrow-back-sharp');
/**
* Set the the cancel button text. Only applies to `ios` mode.
*/
this.cancelButtonText = 'Cancel';
/**
* Set the amount of time, in milliseconds, to wait to trigger the `ionChange` event after each keystroke. This also impacts form bindings such as `ngModel` or `v-model`.
*/
this.debounce = 250;
/**
* If `true`, the user cannot interact with the input.
*/
this.disabled = false;
/**
* Set the input's placeholder.
* `placeholder` can accept either plaintext or HTML as a string.
* To display characters normally reserved for HTML, they
* must be escaped. For example `<Ionic>` would become
* `<Ionic>`
*
* For more information: [Security Documentation](https://ionicframework.com/docs/faq/security)
*/
this.placeholder = 'Search';
/**
* Sets the behavior for the cancel button. Defaults to `"never"`.
* Setting to `"focus"` shows the cancel button on focus.
* Setting to `"never"` hides the cancel button.
* Setting to `"always"` shows the cancel button regardless
* of focus state.
*/
this.showCancelButton = 'never';
/**
* Sets the behavior for the clear button. Defaults to `"focus"`.
* Setting to `"focus"` shows the clear button on focus if the
* input is not empty.
* Setting to `"never"` hides the clear button.
* Setting to `"always"` shows the clear button regardless
* of focus state, but only if the input is not empty.
*/
this.showClearButton = 'focus';
/**
* If `true`, enable spellcheck on the input.
*/
this.spellcheck = false;
/**
* Set the type of the input.
*/
this.type = 'search';
/**
* the value of the searchbar.
*/
this.value = '';
/**
* Clears the input field and triggers the control change.
*/
this.onClearInput = (ev, shouldFocus) => {
this.ionClear.emit();
if (ev) {
ev.preventDefault();
ev.stopPropagation();
}
// setTimeout() fixes https://github.com/ionic-team/ionic/issues/7527
// wait for 4 frames
setTimeout(() => {
const value = this.getValue();
if (value !== '') {
this.value = '';
this.ionInput.emit();
/**
* When tapping clear button
* ensure input is focused after
* clearing input so users
* can quickly start typing.
*/
if (shouldFocus && !this.focused) {
this.setFocus();
}
}
}, 16 * 4);
};
/**
* Clears the input field and tells the input to blur since
* the clearInput function doesn't want the input to blur
* then calls the custom cancel function if the user passed one in.
*/
this.onCancelSearchbar = (ev) => {
if (ev) {
ev.preventDefault();
ev.stopPropagation();
}
this.ionCancel.emit();
this.onClearInput();
if (this.nativeInput) {
this.nativeInput.blur();
}
};
/**
* Update the Searchbar input value when the input changes
*/
this.onInput = (ev) => {
const input = ev.target;
if (input) {
this.value = input.value;
}
this.ionInput.emit(ev);
};
/**
* Sets the Searchbar to not focused and checks if it should align left
* based on whether there is a value in the searchbar or not.
*/
this.onBlur = () => {
this.focused = false;
this.ionBlur.emit();
this.positionElements();
};
/**
* Sets the Searchbar to focused and active on input focus.
*/
this.onFocus = () => {
this.focused = true;
this.ionFocus.emit();
this.positionElements();
};
}
debounceChanged() {
this.ionChange = debounceEvent(this.ionChange, this.debounce);
}
valueChanged() {
const inputEl = this.nativeInput;
const value = this.getValue();
if (inputEl && inputEl.value !== value) {
inputEl.value = value;
}
this.ionChange.emit({ value });
}
showCancelButtonChanged() {
requestAnimationFrame(() => {
this.positionElements();
forceUpdate$1(this);
});
}
connectedCallback() {
this.emitStyle();
}
componentDidLoad() {
this.positionElements();
this.debounceChanged();
setTimeout(() => {
this.noAnimate = false;
}, 300);
}
emitStyle() {
this.ionStyle.emit({
'searchbar': true
});
}
/**
* Sets focus on the specified `ion-searchbar`. Use this method instead of the global
* `input.focus()`.
*/
async setFocus() {
if (this.nativeInput) {
this.nativeInput.focus();
}
}
/**
* Returns the native `<input>` element used under the hood.
*/
getInputElement() {
return Promise.resolve(this.nativeInput);
}
/**
* Positions the input search icon, placeholder, and the cancel button
* based on the input value and if it is focused. (ios only)
*/
positionElements() {
const value = this.getValue();
const prevAlignLeft = this.shouldAlignLeft;
const mode = getIonMode$1(this);
const shouldAlignLeft = (!this.animated || value.trim() !== '' || !!this.focused);
this.shouldAlignLeft = shouldAlignLeft;
if (mode !== 'ios') {
return;
}
if (prevAlignLeft !== shouldAlignLeft) {
this.positionPlaceholder();
}
if (this.animated) {
this.positionCancelButton();
}
}
/**
* Positions the input placeholder
*/
positionPlaceholder() {
const inputEl = this.nativeInput;
if (!inputEl) {
return;
}
const isRTL = document.dir === 'rtl';
const iconEl = (this.el.shadowRoot || this.el).querySelector('.searchbar-search-icon');
if (this.shouldAlignLeft) {
inputEl.removeAttribute('style');
iconEl.removeAttribute('style');
}
else {
// Create a dummy span to get the placeholder width
const doc = document;
const tempSpan = doc.createElement('span');
tempSpan.innerText = this.placeholder || '';
doc.body.appendChild(tempSpan);
// Get the width of the span then remove it
raf(() => {
const textWidth = tempSpan.offsetWidth;
tempSpan.remove();
// Calculate the input padding
const inputLeft = 'calc(50% - ' + (textWidth / 2) + 'px)';
// Calculate the icon margin
const iconLeft = 'calc(50% - ' + ((textWidth / 2) + 30) + 'px)';
// Set the input padding start and icon margin start
if (isRTL) {
inputEl.style.paddingRight = inputLeft;
iconEl.style.marginRight = iconLeft;
}
else {
inputEl.style.paddingLeft = inputLeft;
iconEl.style.marginLeft = iconLeft;
}
});
}
}
/**
* Show the iOS Cancel button on focus, hide it offscreen otherwise
*/
positionCancelButton() {
const isRTL = document.dir === 'rtl';
const cancelButton = (this.el.shadowRoot || this.el).querySelector('.searchbar-cancel-button');
const shouldShowCancel = this.shouldShowCancelButton();
if (cancelButton && shouldShowCancel !== this.isCancelVisible) {
const cancelStyle = cancelButton.style;
this.isCancelVisible = shouldShowCancel;
if (shouldShowCancel) {
if (isRTL) {
cancelStyle.marginLeft = '0';
}
else {
cancelStyle.marginRight = '0';
}
}
else {
const offset = cancelButton.offsetWidth;
if (offset > 0) {
if (isRTL) {
cancelStyle.marginLeft = -offset + 'px';
}
else {
cancelStyle.marginRight = -offset + 'px';
}
}
}
}
}
getValue() {
return this.value || '';
}
hasValue() {
return this.getValue() !== '';
}
/**
* Determines whether or not the cancel button should be visible onscreen.
* Cancel button should be shown if one of two conditions applies:
* 1. `showCancelButton` is set to `always`.
* 2. `showCancelButton` is set to `focus`, and the searchbar has been focused.
*/
shouldShowCancelButton() {
if ((this.showCancelButton === 'never') || (this.showCancelButton === 'focus' && !this.focused)) {
return false;
}
return true;
}
/**
* Determines whether or not the clear button should be visible onscreen.
* Clear button should be shown if one of two conditions applies:
* 1. `showClearButton` is set to `always`.
* 2. `showClearButton` is set to `focus`, and the searchbar has been focused.
*/
shouldShowClearButton() {
if ((this.showClearButton === 'never') || (this.showClearButton === 'focus' && !this.focused)) {
return false;
}
return true;
}
render() {
const { cancelButtonText } = this;
const animated = this.animated && config.getBoolean('animated', true);
const mode = getIonMode$1(this);
const clearIcon = this.clearIcon || (mode === 'ios' ? 'close-circle' : 'close-sharp');
const searchIcon = this.searchIcon || (mode === 'ios' ? 'search-outline' : 'search-sharp');
const shouldShowCancelButton = this.shouldShowCancelButton();
const cancelButton = (this.showCancelButton !== 'never') && (hAsync("button", { "aria-label": cancelButtonText, "aria-hidden": shouldShowCancelButton ? undefined : 'true', type: "button", tabIndex: mode === 'ios' && !shouldShowCancelButton ? -1 : undefined, onMouseDown: this.onCancelSearchbar, onTouchStart: this.onCancelSearchbar, class: "searchbar-cancel-button" }, hAsync("div", { "aria-hidden": "true" }, mode === 'md'
? hAsync("ion-icon", { "aria-hidden": "true", mode: mode, icon: this.cancelButtonIcon, lazy: false })
: cancelButtonText)));
return (hAsync(Host, { role: "search", "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses$1(this.color, {
[mode]: true,
'searchbar-animated': animated,
'searchbar-disabled': this.disabled,
'searchbar-no-animate': animated && this.noAnimate,
'searchbar-has-value': this.hasValue(),
'searchbar-left-aligned': this.shouldAlignLeft,
'searchbar-has-focus': this.focused,
'searchbar-should-show-clear': this.shouldShowClearButton(),
'searchbar-should-show-cancel': this.shouldShowCancelButton()
}) }, hAsync("div", { class: "searchbar-input-container" }, hAsync("input", { "aria-label": "search text", disabled: this.disabled, ref: el => this.nativeInput = el, class: "searchbar-input", inputMode: this.inputmode, enterKeyHint: this.enterkeyhint, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, placeholder: this.placeholder, type: this.type, value: this.getValue(), autoComplete: this.autocomplete, autoCorrect: this.autocorrect, spellcheck: this.spellcheck }), mode === 'md' && cancelButton, hAsync("ion-icon", { "aria-hidden": "true", mode: mode, icon: searchIcon, lazy: false, class: "searchbar-search-icon" }), hAsync("button", { "aria-label": "reset", type: "button", "no-blur": true, class: "searchbar-clear-button", onMouseDown: ev => this.onClearInput(ev, true), onTouchStart: ev => this.onClearInput(ev, true) }, hAsync("ion-icon", { "aria-hidden": "true", mode: mode, icon: clearIcon, lazy: false, class: "searchbar-clear-icon" }))), mode === 'ios' && cancelButton));
}
get el() { return getElement(this); }
static get watchers() { return {
"debounce": ["debounceChanged"],
"value": ["valueChanged"],
"showCancelButton": ["showCancelButtonChanged"]
}; }
static get style() { return {
ios: searchbarIosCss,
md: searchbarMdCss
}; }
static get cmpMeta() { return {
"$flags$": 34,
"$tagName$": "ion-searchbar",
"$members$": {
"color": [513],
"animated": [4],
"autocomplete": [1],
"autocorrect": [1],
"cancelButtonIcon": [1, "cancel-button-icon"],
"cancelButtonText": [1, "cancel-button-text"],
"clearIcon": [1, "clear-icon"],
"debounce": [2],
"disabled": [4],
"inputmode": [1],
"enterkeyhint": [1],
"placeholder": [1],
"searchIcon": [1, "search-icon"],
"showCancelButton": [1, "show-cancel-button"],
"showClearButton": [1, "show-clear-button"],
"spellcheck": [4],
"type": [1],
"value": [1025],
"focused": [32],
"noAnimate": [32],
"setFocus": [64],
"getInputElement": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const segmentIosCss = "/*!@:host*/.sc-ion-segment-ios-h{--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:center;justify-content:center;width:100%;background:var(--background);font-family:var(--ion-font-family, inherit);text-align:center;contain:paint;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}/*!@:host(.segment-scrollable)*/.segment-scrollable.sc-ion-segment-ios-h{-ms-flex-pack:start;justify-content:start;width:auto;overflow-x:auto}/*!@:host(.segment-scrollable::-webkit-scrollbar)*/.segment-scrollable.sc-ion-segment-ios-h::-webkit-scrollbar{display:none}/*!@:host*/.sc-ion-segment-ios-h{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.065);border-radius:8px;overflow:hidden;z-index:0}/*!@:host(.ion-color)*/.ion-color.sc-ion-segment-ios-h{background:rgba(var(--ion-color-base-rgb), 0.065)}/*!@:host(.in-toolbar)*/.in-toolbar.sc-ion-segment-ios-h{margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0;width:auto}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-toolbar)*/.in-toolbar.sc-ion-segment-ios-h{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}/*!@:host(.in-toolbar:not(.ion-color))*/.in-toolbar.sc-ion-segment-ios-h:not(.ion-color){background:var(--ion-toolbar-segment-background, var(--background))}/*!@:host(.in-toolbar-color:not(.ion-color))*/.in-toolbar-color.sc-ion-segment-ios-h:not(.ion-color){background:rgba(var(--ion-color-contrast-rgb), 0.11)}";
const segmentMdCss = "/*!@:host*/.sc-ion-segment-md-h{--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:center;justify-content:center;width:100%;background:var(--background);font-family:var(--ion-font-family, inherit);text-align:center;contain:paint;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}/*!@:host(.segment-scrollable)*/.segment-scrollable.sc-ion-segment-md-h{-ms-flex-pack:start;justify-content:start;width:auto;overflow-x:auto}/*!@:host(.segment-scrollable::-webkit-scrollbar)*/.segment-scrollable.sc-ion-segment-md-h::-webkit-scrollbar{display:none}/*!@:host*/.sc-ion-segment-md-h{--background:transparent}/*!@:host(.segment-scrollable) ::slotted(ion-segment-button)*/.sc-ion-segment-md-h.segment-scrollable .sc-ion-segment-md-s>ion-segment-button{min-width:auto}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Segment {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionChange = createEvent(this, "ionChange", 7);
this.ionSelect = createEvent(this, "ionSelect", 7);
this.ionStyle = createEvent(this, "ionStyle", 7);
this.didInit = false;
this.activated = false;
/**
* If `true`, the user cannot interact with the segment.
*/
this.disabled = false;
/**
* If `true`, the segment buttons will overflow and the user can swipe to see them.
* In addition, this will disable the gesture to drag the indicator between the buttons
* in order to swipe to see hidden buttons.
*/
this.scrollable = false;
/**
* If `true`, users will be able to swipe between segment buttons to activate them.
*/
this.swipeGesture = true;
this.onClick = (ev) => {
const current = ev.target;
const previous = this.checked;
// If the current element is a segment then that means
// the user tried to swipe to a segment button and
// click a segment button at the same time so we should
// not update the checked segment button
if (current.tagName === 'ION-SEGMENT') {
return;
}
this.value = current.value;
if (this.scrollable || !this.swipeGesture) {
if (previous) {
this.checkButton(previous, current);
}
else {
this.setCheckedClasses();
}
}
this.checked = current;
};
}
colorChanged(value, oldValue) {
/**
* If color is set after not having
* previously been set (or vice versa),
* we need to emit style so the segment-buttons
* can apply their color classes properly.
*/
if ((oldValue === undefined && value !== undefined) ||
(oldValue !== undefined && value === undefined)) {
this.emitStyle();
}
}
swipeGestureChanged() {
this.gestureChanged();
}
valueChanged(value, oldValue) {
this.ionSelect.emit({ value });
if (oldValue !== '' || this.didInit) {
if (!this.activated) {
this.ionChange.emit({ value });
}
else {
this.valueAfterGesture = value;
}
}
}
disabledChanged() {
this.gestureChanged();
const buttons = this.getButtons();
for (const button of buttons) {
button.disabled = this.disabled;
}
}
gestureChanged() {
if (this.gesture) {
this.gesture.enable(!this.scrollable && !this.disabled && this.swipeGesture);
}
}
connectedCallback() {
this.emitStyle();
}
componentWillLoad() {
this.emitStyle();
}
async componentDidLoad() {
this.setCheckedClasses();
this.gesture = (await Promise.resolve().then(function () { return index$1; })).createGesture({
el: this.el,
gestureName: 'segment',
gesturePriority: 100,
threshold: 0,
passive: false,
onStart: ev => this.onStart(ev),
onMove: ev => this.onMove(ev),
onEnd: ev => this.onEnd(ev),
});
this.gestureChanged();
if (this.disabled) {
this.disabledChanged();
}
this.didInit = true;
}
onStart(detail) {
this.activate(detail);
}
onMove(detail) {
this.setNextIndex(detail);
}
onEnd(detail) {
this.setActivated(false);
const checkedValidButton = this.setNextIndex(detail, true);
detail.event.stopImmediatePropagation();
if (checkedValidButton) {
this.addRipple(detail);
}
const value = this.valueAfterGesture;
if (value !== undefined) {
this.ionChange.emit({ value });
this.valueAfterGesture = undefined;
}
}
getButtons() {
return Array.from(this.el.querySelectorAll('ion-segment-button'));
}
/**
* The gesture blocks the segment button ripple. This
* function adds the ripple based on the checked segment
* and where the cursor ended.
*/
addRipple(detail) {
const useRippleEffect = config.getBoolean('animated', true) && config.getBoolean('rippleEffect', true);
if (!useRippleEffect) {
return;
}
const buttons = this.getButtons();
const checked = buttons.find(button => button.value === this.value);
const root = checked.shadowRoot || checked;
const ripple = root.querySelector('ion-ripple-effect');
if (!ripple) {
return;
}
const { x, y } = pointerCoord(detail.event);
ripple.addRipple(x, y).then(remove => remove());
}
/*
* Activate both the segment and the buttons
* due to a bug with ::slotted in Safari
*/
setActivated(activated) {
const buttons = this.getButtons();
buttons.forEach(button => {
if (activated) {
button.classList.add('segment-button-activated');
}
else {
button.classList.remove('segment-button-activated');
}
});
this.activated = activated;
}
activate(detail) {
const clicked = detail.event.target;
const buttons = this.getButtons();
const checked = buttons.find(button => button.value === this.value);
// Make sure we are only checking for activation on a segment button
// since disabled buttons will get the click on the segment
if (clicked.tagName !== 'ION-SEGMENT-BUTTON') {
return;
}
// If there are no checked buttons, set the current button to checked
if (!checked) {
this.value = clicked.value;
this.setCheckedClasses();
}
// If the gesture began on the clicked button with the indicator
// then we should activate the indicator
if (this.value === clicked.value) {
this.setActivated(true);
}
}
getIndicator(button) {
const root = button.shadowRoot || button;
return root.querySelector('.segment-button-indicator');
}
checkButton(previous, current) {
const previousIndicator = this.getIndicator(previous);
const currentIndicator = this.getIndicator(current);
if (previousIndicator === null || currentIndicator === null) {
return;
}
const previousClientRect = previousIndicator.getBoundingClientRect();
const currentClientRect = currentIndicator.getBoundingClientRect();
const widthDelta = previousClientRect.width / currentClientRect.width;
const xPosition = previousClientRect.left - currentClientRect.left;
// Scale the indicator width to match the previous indicator width
// and translate it on top of the previous indicator
const transform = `translate3d(${xPosition}px, 0, 0) scaleX(${widthDelta})`;
writeTask(() => {
// Remove the transition before positioning on top of the previous indicator
currentIndicator.classList.remove('segment-button-indicator-animated');
currentIndicator.style.setProperty('transform', transform);
// Force a repaint to ensure the transform happens
currentIndicator.getBoundingClientRect();
// Add the transition to move the indicator into place
currentIndicator.classList.add('segment-button-indicator-animated');
// Remove the transform to slide the indicator back to the button clicked
currentIndicator.style.setProperty('transform', '');
});
this.value = current.value;
this.setCheckedClasses();
}
setCheckedClasses() {
const buttons = this.getButtons();
const index = buttons.findIndex(button => button.value === this.value);
const next = index + 1;
// Keep track of the currently checked button
this.checked = buttons.find(button => button.value === this.value);
for (const button of buttons) {
button.classList.remove('segment-button-after-checked');
}
if (next < buttons.length) {
buttons[next].classList.add('segment-button-after-checked');
}
}
setNextIndex(detail, isEnd = false) {
const isRTL = document.dir === 'rtl';
const activated = this.activated;
const buttons = this.getButtons();
const index = buttons.findIndex(button => button.value === this.value);
const previous = buttons[index];
let current;
let nextIndex;
if (index === -1) {
return;
}
// Get the element that the touch event started on in case
// it was the checked button, then we will move the indicator
const rect = previous.getBoundingClientRect();
const left = rect.left;
const width = rect.width;
// Get the element that the gesture is on top of based on the currentX of the
// gesture event and the Y coordinate of the starting element, since the gesture
// can move up and down off of the segment
const currentX = detail.currentX;
const previousY = rect.top + (rect.height / 2);
const nextEl = document.elementFromPoint(currentX, previousY);
const decreaseIndex = isRTL ? currentX > (left + width) : currentX < left;
const increaseIndex = isRTL ? currentX < left : currentX > (left + width);
// If the indicator is currently activated then we have started the gesture
// on top of the checked button so we need to slide the indicator
// by checking the button next to it as we move
if (activated && !isEnd) {
// Decrease index, move left in LTR & right in RTL
if (decreaseIndex) {
const newIndex = index - 1;
if (newIndex >= 0) {
nextIndex = newIndex;
}
// Increase index, moves right in LTR & left in RTL
}
else if (increaseIndex) {
if (activated && !isEnd) {
const newIndex = index + 1;
if (newIndex < buttons.length) {
nextIndex = newIndex;
}
}
}
if (nextIndex !== undefined && !buttons[nextIndex].disabled) {
current = buttons[nextIndex];
}
}
// If the indicator is not activated then we will just set the indicator
// to the element where the gesture ended
if (!activated && isEnd) {
current = nextEl;
}
/* tslint:disable-next-line */
if (current != null) {
/**
* If current element is ion-segment then that means
* user tried to select a disabled ion-segment-button,
* and we should not update the ripple.
*/
if (current.tagName === 'ION-SEGMENT') {
return false;
}
if (previous !== current) {
this.checkButton(previous, current);
}
}
return true;
}
emitStyle() {
this.ionStyle.emit({
'segment': true
});
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { role: "tablist", onClick: this.onClick, class: createColorClasses$1(this.color, {
[mode]: true,
'in-toolbar': hostContext('ion-toolbar', this.el),
'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
'segment-activated': this.activated,
'segment-disabled': this.disabled,
'segment-scrollable': this.scrollable
}) }, hAsync("slot", null)));
}
get el() { return getElement(this); }
static get watchers() { return {
"color": ["colorChanged"],
"swipeGesture": ["swipeGestureChanged"],
"value": ["valueChanged"],
"disabled": ["disabledChanged"]
}; }
static get style() { return {
ios: segmentIosCss,
md: segmentMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-segment",
"$members$": {
"color": [513],
"disabled": [4],
"scrollable": [4],
"swipeGesture": [4, "swipe-gesture"],
"value": [1025],
"activated": [32]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const segmentButtonIosCss = "/*!@:host*/.sc-ion-segment-button-ios-h{--color:initial;--color-hover:var(--color);--color-checked:var(--color);--color-disabled:var(--color);--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;height:auto;background:var(--background);color:var(--color);text-decoration:none;text-overflow:ellipsis;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none;cursor:pointer}/*!@.button-native*/.button-native.sc-ion-segment-button-ios{border-radius:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;margin-left:var(--margin-start);margin-right:var(--margin-end);margin-top:var(--margin-top);margin-bottom:var(--margin-bottom);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;min-width:inherit;max-width:inherit;height:auto;min-height:inherit;max-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border:none;outline:none;background:transparent;contain:content;pointer-events:none;overflow:hidden;z-index:2}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-segment-button-ios{margin-left:unset;margin-right:unset;-webkit-margin-start:var(--margin-start);margin-inline-start:var(--margin-start);-webkit-margin-end:var(--margin-end);margin-inline-end:var(--margin-end)}}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-segment-button-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.button-native::after*/.button-native.sc-ion-segment-button-ios::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}/*!@.button-inner*/.button-inner.sc-ion-segment-button-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:inherit;flex-flow:inherit;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}/*!@:host(.segment-button-checked)*/.segment-button-checked.sc-ion-segment-button-ios-h{background:var(--background-checked);color:var(--color-checked)}/*!@:host(.segment-button-disabled)*/.segment-button-disabled.sc-ion-segment-button-ios-h{cursor:default;pointer-events:none}/*!@:host(.ion-focused) .button-native*/.ion-focused.sc-ion-segment-button-ios-h .button-native.sc-ion-segment-button-ios{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-segment-button-ios-h .button-native.sc-ion-segment-button-ios::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}/*!@:host(:focus)*/.sc-ion-segment-button-ios-h:focus{outline:none}@media (any-hover: hover){/*!@:host(:hover) .button-native*/.sc-ion-segment-button-ios-h:hover .button-native.sc-ion-segment-button-ios{color:var(--color-hover)}/*!@:host(:hover) .button-native::after*/.sc-ion-segment-button-ios-h:hover .button-native.sc-ion-segment-button-ios::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}/*!@:host(.segment-button-checked:hover) .button-native*/.segment-button-checked.sc-ion-segment-button-ios-h:hover .button-native.sc-ion-segment-button-ios{color:var(--color-checked)}}/*!@::slotted(ion-icon)*/.sc-ion-segment-button-ios-s>ion-icon{-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:-1;order:-1;pointer-events:none}/*!@::slotted(ion-label)*/.sc-ion-segment-button-ios-s>ion-label{display:block;-ms-flex-item-align:center;align-self:center;line-height:22px;text-overflow:ellipsis;white-space:nowrap;-webkit-box-sizing:border-box;box-sizing:border-box;pointer-events:none}/*!@:host(.segment-button-layout-icon-top) .button-native*/.segment-button-layout-icon-top.sc-ion-segment-button-ios-h .button-native.sc-ion-segment-button-ios{-ms-flex-direction:column;flex-direction:column}/*!@:host(.segment-button-layout-icon-start) .button-native*/.segment-button-layout-icon-start.sc-ion-segment-button-ios-h .button-native.sc-ion-segment-button-ios{-ms-flex-direction:row;flex-direction:row}/*!@:host(.segment-button-layout-icon-end) .button-native*/.segment-button-layout-icon-end.sc-ion-segment-button-ios-h .button-native.sc-ion-segment-button-ios{-ms-flex-direction:row-reverse;flex-direction:row-reverse}/*!@:host(.segment-button-layout-icon-bottom) .button-native*/.segment-button-layout-icon-bottom.sc-ion-segment-button-ios-h .button-native.sc-ion-segment-button-ios{-ms-flex-direction:column-reverse;flex-direction:column-reverse}/*!@:host(.segment-button-layout-icon-hide) ::slotted(ion-icon)*/.sc-ion-segment-button-ios-h.segment-button-layout-icon-hide .sc-ion-segment-button-ios-s>ion-icon{display:none}/*!@:host(.segment-button-layout-label-hide) ::slotted(ion-label)*/.sc-ion-segment-button-ios-h.segment-button-layout-label-hide .sc-ion-segment-button-ios-s>ion-label{display:none}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-segment-button-ios{color:var(--ripple-color, var(--color-checked))}/*!@.segment-button-indicator*/.segment-button-indicator.sc-ion-segment-button-ios{-webkit-transform-origin:left;transform-origin:left;position:absolute;opacity:0;-webkit-box-sizing:border-box;box-sizing:border-box;will-change:transform, opacity;pointer-events:none}/*!@.segment-button-indicator-background*/.segment-button-indicator-background.sc-ion-segment-button-ios{width:100%;height:var(--indicator-height);-webkit-transform:var(--indicator-transform);transform:var(--indicator-transform);-webkit-box-shadow:var(--indicator-box-shadow);box-shadow:var(--indicator-box-shadow);pointer-events:none}/*!@.segment-button-indicator-animated*/.segment-button-indicator-animated.sc-ion-segment-button-ios{-webkit-transition:var(--indicator-transition);transition:var(--indicator-transition)}/*!@:host(.segment-button-checked) .segment-button-indicator*/.segment-button-checked.sc-ion-segment-button-ios-h .segment-button-indicator.sc-ion-segment-button-ios{opacity:1}@media (prefers-reduced-motion: reduce){/*!@.segment-button-indicator-background*/.segment-button-indicator-background.sc-ion-segment-button-ios{-webkit-transform:none;transform:none}/*!@.segment-button-indicator-animated*/.segment-button-indicator-animated.sc-ion-segment-button-ios{-webkit-transition:none;transition:none}}/*!@:host*/.sc-ion-segment-button-ios-h{--background:none;--background-checked:none;--background-hover:none;--background-hover-opacity:0;--background-focused:none;--background-focused-opacity:0;--border-radius:7px;--border-width:1px;--border-color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.12);--border-style:solid;--indicator-box-shadow:0 0 5px rgba(0, 0, 0, 0.16);--indicator-color:var(--ion-color-step-350, var(--ion-background-color, #fff));--indicator-height:100%;--indicator-transition:transform 260ms cubic-bezier(0.4, 0, 0.2, 1);--indicator-transform:none;--transition:100ms all linear;--padding-top:0;--padding-end:13px;--padding-bottom:0;--padding-start:13px;margin-top:2px;margin-bottom:2px;position:relative;-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-direction:row;flex-direction:row;min-width:70px;min-height:28px;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);font-size:13px;font-weight:450;line-height:37px}/*!@:host::before*/.sc-ion-segment-button-ios-h::before{margin-left:0;margin-right:0;margin-top:5px;margin-bottom:5px;-webkit-transition:160ms opacity ease-in-out;transition:160ms opacity ease-in-out;-webkit-transition-delay:100ms;transition-delay:100ms;border-left:var(--border-width) var(--border-style) var(--border-color);content:\"\";opacity:1;will-change:opacity}/*!@:host(:first-of-type)::before*/.sc-ion-segment-button-ios-h:first-of-type::before{border-left-color:transparent}/*!@:host(.segment-button-disabled)*/.segment-button-disabled.sc-ion-segment-button-ios-h{opacity:0.3}/*!@::slotted(ion-icon)*/.sc-ion-segment-button-ios-s>ion-icon{font-size:24px}/*!@:host(.segment-button-layout-icon-start) ::slotted(ion-label)*/.sc-ion-segment-button-ios-h.segment-button-layout-icon-start .sc-ion-segment-button-ios-s>ion-label{margin-left:2px;margin-right:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.segment-button-layout-icon-start) ::slotted(ion-label)*/.sc-ion-segment-button-ios-h.segment-button-layout-icon-start .sc-ion-segment-button-ios-s>ion-label{margin-left:unset;margin-right:unset;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:0;margin-inline-end:0}}/*!@:host(.segment-button-layout-icon-end) ::slotted(ion-label)*/.sc-ion-segment-button-ios-h.segment-button-layout-icon-end .sc-ion-segment-button-ios-s>ion-label{margin-left:0;margin-right:2px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.segment-button-layout-icon-end) ::slotted(ion-label)*/.sc-ion-segment-button-ios-h.segment-button-layout-icon-end .sc-ion-segment-button-ios-s>ion-label{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:2px;margin-inline-end:2px}}/*!@.segment-button-indicator*/.segment-button-indicator.sc-ion-segment-button-ios{padding-left:2px;padding-right:2px;left:0;right:0;top:0;bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.segment-button-indicator*/.segment-button-indicator.sc-ion-segment-button-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:2px;padding-inline-start:2px;-webkit-padding-end:2px;padding-inline-end:2px}}/*!@.segment-button-indicator-background*/.segment-button-indicator-background.sc-ion-segment-button-ios{border-radius:var(--border-radius);background:var(--indicator-color)}/*!@.segment-button-indicator-background*/.segment-button-indicator-background.sc-ion-segment-button-ios{-webkit-transition:var(--indicator-transition);transition:var(--indicator-transition)}/*!@:host(.segment-button-checked)::before,\n:host(.segment-button-after-checked)::before*/.segment-button-checked.sc-ion-segment-button-ios-h::before,.segment-button-after-checked.sc-ion-segment-button-ios-h::before{opacity:0}/*!@:host(.segment-button-checked)*/.segment-button-checked.sc-ion-segment-button-ios-h{z-index:-1}/*!@:host(.segment-button-activated)*/.segment-button-activated.sc-ion-segment-button-ios-h{--indicator-transform:scale(0.95)}/*!@:host(.ion-focused) .button-native*/.ion-focused.sc-ion-segment-button-ios-h .button-native.sc-ion-segment-button-ios{opacity:0.7}@media (any-hover: hover){/*!@:host(:hover) .button-native*/.sc-ion-segment-button-ios-h:hover .button-native.sc-ion-segment-button-ios{opacity:0.5}/*!@:host(.segment-button-checked:hover) .button-native*/.segment-button-checked.sc-ion-segment-button-ios-h:hover .button-native.sc-ion-segment-button-ios{opacity:1}}/*!@:host(.in-segment-color)*/.in-segment-color.sc-ion-segment-button-ios-h{background:none;color:var(--ion-text-color, #000)}/*!@:host(.in-segment-color) .segment-button-indicator-background*/.in-segment-color.sc-ion-segment-button-ios-h .segment-button-indicator-background.sc-ion-segment-button-ios{background:var(--ion-color-step-350, var(--ion-background-color, #fff))}@media (any-hover: hover){/*!@:host(.in-segment-color:hover) .button-native,\n:host(.in-segment-color.segment-button-checked:hover) .button-native*/.in-segment-color.sc-ion-segment-button-ios-h:hover .button-native.sc-ion-segment-button-ios,.in-segment-color.segment-button-checked.sc-ion-segment-button-ios-h:hover .button-native.sc-ion-segment-button-ios{color:var(--ion-text-color, #000)}}/*!@:host(.in-toolbar:not(.in-segment-color))*/.in-toolbar.sc-ion-segment-button-ios-h:not(.in-segment-color){--background-checked:var(--ion-toolbar-segment-background-checked, none);--color:var(--ion-toolbar-segment-color, var(--ion-toolbar-color), initial);--color-checked:var(--ion-toolbar-segment-color-checked, var(--ion-toolbar-color), initial);--indicator-color:var(--ion-toolbar-segment-indicator-color, var(--ion-color-step-350, var(--ion-background-color, #fff)))}/*!@:host(.in-toolbar-color) .segment-button-indicator-background*/.in-toolbar-color.sc-ion-segment-button-ios-h .segment-button-indicator-background.sc-ion-segment-button-ios{background:#fff}/*!@:host(.in-toolbar-color:not(.in-segment-color)) .button-native*/.in-toolbar-color.sc-ion-segment-button-ios-h:not(.in-segment-color) .button-native.sc-ion-segment-button-ios{color:var(--ion-color-contrast)}/*!@:host(.in-toolbar-color.segment-button-checked:not(.in-segment-color)) .button-native*/.in-toolbar-color.segment-button-checked.sc-ion-segment-button-ios-h:not(.in-segment-color) .button-native.sc-ion-segment-button-ios{color:var(--ion-color-base)}@media (any-hover: hover){/*!@:host(.in-toolbar-color:not(.in-segment-color):hover) .button-native*/.in-toolbar-color.sc-ion-segment-button-ios-h:not(.in-segment-color):hover .button-native.sc-ion-segment-button-ios{color:var(--ion-color-contrast)}/*!@:host(.in-toolbar-color.segment-button-checked:not(.in-segment-color):hover) .button-native*/.in-toolbar-color.segment-button-checked.sc-ion-segment-button-ios-h:not(.in-segment-color):hover .button-native.sc-ion-segment-button-ios{color:var(--ion-color-base)}}";
const segmentButtonMdCss = "/*!@:host*/.sc-ion-segment-button-md-h{--color:initial;--color-hover:var(--color);--color-checked:var(--color);--color-disabled:var(--color);--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;height:auto;background:var(--background);color:var(--color);text-decoration:none;text-overflow:ellipsis;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none;cursor:pointer}/*!@.button-native*/.button-native.sc-ion-segment-button-md{border-radius:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;margin-left:var(--margin-start);margin-right:var(--margin-end);margin-top:var(--margin-top);margin-bottom:var(--margin-bottom);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;min-width:inherit;max-width:inherit;height:auto;min-height:inherit;max-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border:none;outline:none;background:transparent;contain:content;pointer-events:none;overflow:hidden;z-index:2}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-segment-button-md{margin-left:unset;margin-right:unset;-webkit-margin-start:var(--margin-start);margin-inline-start:var(--margin-start);-webkit-margin-end:var(--margin-end);margin-inline-end:var(--margin-end)}}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-segment-button-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.button-native::after*/.button-native.sc-ion-segment-button-md::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}/*!@.button-inner*/.button-inner.sc-ion-segment-button-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:inherit;flex-flow:inherit;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}/*!@:host(.segment-button-checked)*/.segment-button-checked.sc-ion-segment-button-md-h{background:var(--background-checked);color:var(--color-checked)}/*!@:host(.segment-button-disabled)*/.segment-button-disabled.sc-ion-segment-button-md-h{cursor:default;pointer-events:none}/*!@:host(.ion-focused) .button-native*/.ion-focused.sc-ion-segment-button-md-h .button-native.sc-ion-segment-button-md{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-segment-button-md-h .button-native.sc-ion-segment-button-md::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}/*!@:host(:focus)*/.sc-ion-segment-button-md-h:focus{outline:none}@media (any-hover: hover){/*!@:host(:hover) .button-native*/.sc-ion-segment-button-md-h:hover .button-native.sc-ion-segment-button-md{color:var(--color-hover)}/*!@:host(:hover) .button-native::after*/.sc-ion-segment-button-md-h:hover .button-native.sc-ion-segment-button-md::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}/*!@:host(.segment-button-checked:hover) .button-native*/.segment-button-checked.sc-ion-segment-button-md-h:hover .button-native.sc-ion-segment-button-md{color:var(--color-checked)}}/*!@::slotted(ion-icon)*/.sc-ion-segment-button-md-s>ion-icon{-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:-1;order:-1;pointer-events:none}/*!@::slotted(ion-label)*/.sc-ion-segment-button-md-s>ion-label{display:block;-ms-flex-item-align:center;align-self:center;line-height:22px;text-overflow:ellipsis;white-space:nowrap;-webkit-box-sizing:border-box;box-sizing:border-box;pointer-events:none}/*!@:host(.segment-button-layout-icon-top) .button-native*/.segment-button-layout-icon-top.sc-ion-segment-button-md-h .button-native.sc-ion-segment-button-md{-ms-flex-direction:column;flex-direction:column}/*!@:host(.segment-button-layout-icon-start) .button-native*/.segment-button-layout-icon-start.sc-ion-segment-button-md-h .button-native.sc-ion-segment-button-md{-ms-flex-direction:row;flex-direction:row}/*!@:host(.segment-button-layout-icon-end) .button-native*/.segment-button-layout-icon-end.sc-ion-segment-button-md-h .button-native.sc-ion-segment-button-md{-ms-flex-direction:row-reverse;flex-direction:row-reverse}/*!@:host(.segment-button-layout-icon-bottom) .button-native*/.segment-button-layout-icon-bottom.sc-ion-segment-button-md-h .button-native.sc-ion-segment-button-md{-ms-flex-direction:column-reverse;flex-direction:column-reverse}/*!@:host(.segment-button-layout-icon-hide) ::slotted(ion-icon)*/.sc-ion-segment-button-md-h.segment-button-layout-icon-hide .sc-ion-segment-button-md-s>ion-icon{display:none}/*!@:host(.segment-button-layout-label-hide) ::slotted(ion-label)*/.sc-ion-segment-button-md-h.segment-button-layout-label-hide .sc-ion-segment-button-md-s>ion-label{display:none}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-segment-button-md{color:var(--ripple-color, var(--color-checked))}/*!@.segment-button-indicator*/.segment-button-indicator.sc-ion-segment-button-md{-webkit-transform-origin:left;transform-origin:left;position:absolute;opacity:0;-webkit-box-sizing:border-box;box-sizing:border-box;will-change:transform, opacity;pointer-events:none}/*!@.segment-button-indicator-background*/.segment-button-indicator-background.sc-ion-segment-button-md{width:100%;height:var(--indicator-height);-webkit-transform:var(--indicator-transform);transform:var(--indicator-transform);-webkit-box-shadow:var(--indicator-box-shadow);box-shadow:var(--indicator-box-shadow);pointer-events:none}/*!@.segment-button-indicator-animated*/.segment-button-indicator-animated.sc-ion-segment-button-md{-webkit-transition:var(--indicator-transition);transition:var(--indicator-transition)}/*!@:host(.segment-button-checked) .segment-button-indicator*/.segment-button-checked.sc-ion-segment-button-md-h .segment-button-indicator.sc-ion-segment-button-md{opacity:1}@media (prefers-reduced-motion: reduce){/*!@.segment-button-indicator-background*/.segment-button-indicator-background.sc-ion-segment-button-md{-webkit-transform:none;transform:none}/*!@.segment-button-indicator-animated*/.segment-button-indicator-animated.sc-ion-segment-button-md{-webkit-transition:none;transition:none}}/*!@:host*/.sc-ion-segment-button-md-h{--background:none;--background-checked:none;--background-hover:var(--color-checked);--background-focused:var(--color-checked);--background-activated-opacity:0;--background-focused-opacity:.12;--background-hover-opacity:.04;--color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6);--color-checked:var(--ion-color-primary, #3880ff);--indicator-box-shadow:none;--indicator-color:var(--color-checked);--indicator-height:2px;--indicator-transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1);--indicator-transform:none;--padding-top:0;--padding-end:16px;--padding-bottom:0;--padding-start:16px;--transition:color 0.15s linear 0s, opacity 0.15s linear 0s;min-width:90px;max-width:360px;min-height:48px;border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);font-size:14px;font-weight:500;letter-spacing:0.06em;line-height:40px;text-transform:uppercase}/*!@:host(.segment-button-disabled)*/.segment-button-disabled.sc-ion-segment-button-md-h{opacity:0.3}/*!@:host(.in-segment-color)*/.in-segment-color.sc-ion-segment-button-md-h{background:none;color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6)}/*!@:host(.in-segment-color) ion-ripple-effect*/.in-segment-color.sc-ion-segment-button-md-h ion-ripple-effect.sc-ion-segment-button-md{color:var(--ion-color-base)}/*!@:host(.in-segment-color) .segment-button-indicator-background*/.in-segment-color.sc-ion-segment-button-md-h .segment-button-indicator-background.sc-ion-segment-button-md{background:var(--ion-color-base)}/*!@:host(.in-segment-color.segment-button-checked) .button-native*/.in-segment-color.segment-button-checked.sc-ion-segment-button-md-h .button-native.sc-ion-segment-button-md{color:var(--ion-color-base)}/*!@:host(.in-segment-color.ion-focused) .button-native::after*/.in-segment-color.ion-focused.sc-ion-segment-button-md-h .button-native.sc-ion-segment-button-md::after{background:var(--ion-color-base)}@media (any-hover: hover){/*!@:host(.in-segment-color:hover) .button-native*/.in-segment-color.sc-ion-segment-button-md-h:hover .button-native.sc-ion-segment-button-md{color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6)}/*!@:host(.in-segment-color:hover) .button-native::after*/.in-segment-color.sc-ion-segment-button-md-h:hover .button-native.sc-ion-segment-button-md::after{background:var(--ion-color-base)}/*!@:host(.in-segment-color.segment-button-checked:hover) .button-native*/.in-segment-color.segment-button-checked.sc-ion-segment-button-md-h:hover .button-native.sc-ion-segment-button-md{color:var(--ion-color-base)}}/*!@:host(.in-toolbar:not(.in-segment-color))*/.in-toolbar.sc-ion-segment-button-md-h:not(.in-segment-color){--background:var(--ion-toolbar-segment-background, none);--background-checked:var(--ion-toolbar-segment-background-checked, none);--color:var(--ion-toolbar-segment-color, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6));--color-checked:var(--ion-toolbar-segment-color-checked, var(--ion-color-primary, #3880ff));--indicator-color:var(--ion-toolbar-segment-color-checked, var(--color-checked))}/*!@:host(.in-toolbar-color:not(.in-segment-color)) .button-native*/.in-toolbar-color.sc-ion-segment-button-md-h:not(.in-segment-color) .button-native.sc-ion-segment-button-md{color:rgba(var(--ion-color-contrast-rgb), 0.6)}/*!@:host(.in-toolbar-color.segment-button-checked:not(.in-segment-color)) .button-native*/.in-toolbar-color.segment-button-checked.sc-ion-segment-button-md-h:not(.in-segment-color) .button-native.sc-ion-segment-button-md{color:var(--ion-color-contrast)}@media (any-hover: hover){/*!@:host(.in-toolbar-color:not(.in-segment-color)) .button-native::after*/.in-toolbar-color.sc-ion-segment-button-md-h:not(.in-segment-color) .button-native.sc-ion-segment-button-md::after{background:var(--ion-color-contrast)}}/*!@::slotted(ion-icon)*/.sc-ion-segment-button-md-s>ion-icon{margin-top:12px;margin-bottom:12px;font-size:24px}/*!@::slotted(ion-label)*/.sc-ion-segment-button-md-s>ion-label{margin-top:12px;margin-bottom:12px}/*!@:host(.segment-button-layout-icon-top) ::slotted(ion-label),\n:host(.segment-button-layout-icon-bottom) ::slotted(ion-icon)*/.sc-ion-segment-button-md-h.segment-button-layout-icon-top .sc-ion-segment-button-md-s>ion-label,.sc-ion-segment-button-md-h.segment-button-layout-icon-bottom .sc-ion-segment-button-md-s>ion-icon{margin-top:0}/*!@:host(.segment-button-layout-icon-top) ::slotted(ion-icon),\n:host(.segment-button-layout-icon-bottom) ::slotted(ion-label)*/.sc-ion-segment-button-md-h.segment-button-layout-icon-top .sc-ion-segment-button-md-s>ion-icon,.sc-ion-segment-button-md-h.segment-button-layout-icon-bottom .sc-ion-segment-button-md-s>ion-label{margin-bottom:0}/*!@:host(.segment-button-layout-icon-start) ::slotted(ion-label)*/.sc-ion-segment-button-md-h.segment-button-layout-icon-start .sc-ion-segment-button-md-s>ion-label{margin-left:8px;margin-right:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.segment-button-layout-icon-start) ::slotted(ion-label)*/.sc-ion-segment-button-md-h.segment-button-layout-icon-start .sc-ion-segment-button-md-s>ion-label{margin-left:unset;margin-right:unset;-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:0;margin-inline-end:0}}/*!@:host(.segment-button-layout-icon-end) ::slotted(ion-label)*/.sc-ion-segment-button-md-h.segment-button-layout-icon-end .sc-ion-segment-button-md-s>ion-label{margin-left:0;margin-right:8px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.segment-button-layout-icon-end) ::slotted(ion-label)*/.sc-ion-segment-button-md-h.segment-button-layout-icon-end .sc-ion-segment-button-md-s>ion-label{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:8px;margin-inline-end:8px}}/*!@:host(.segment-button-has-icon-only) ::slotted(ion-icon)*/.sc-ion-segment-button-md-h.segment-button-has-icon-only .sc-ion-segment-button-md-s>ion-icon{margin-top:12px;margin-bottom:12px}/*!@:host(.segment-button-has-label-only) ::slotted(ion-label)*/.sc-ion-segment-button-md-h.segment-button-has-label-only .sc-ion-segment-button-md-s>ion-label{margin-top:12px;margin-bottom:12px}/*!@.segment-button-indicator*/.segment-button-indicator.sc-ion-segment-button-md{left:0;right:0;bottom:0}/*!@.segment-button-indicator-background*/.segment-button-indicator-background.sc-ion-segment-button-md{background:var(--indicator-color)}/*!@:host(.in-toolbar:not(.in-segment-color)) .segment-button-indicator-background*/.in-toolbar.sc-ion-segment-button-md-h:not(.in-segment-color) .segment-button-indicator-background.sc-ion-segment-button-md{background:var(--ion-toolbar-segment-indicator-color, var(--indicator-color))}/*!@:host(.in-toolbar-color:not(.in-segment-color)) .segment-button-indicator-background*/.in-toolbar-color.sc-ion-segment-button-md-h:not(.in-segment-color) .segment-button-indicator-background.sc-ion-segment-button-md{background:var(--ion-color-contrast)}";
let ids = 0;
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part native - The native HTML button element that wraps all child elements.
* @part indicator - The indicator displayed on the checked segment button.
* @part indicator-background - The background element for the indicator displayed on the checked segment button.
*/
class SegmentButton {
constructor(hostRef) {
registerInstance(this, hostRef);
this.segmentEl = null;
this.checked = false;
/**
* If `true`, the user cannot interact with the segment button.
*/
this.disabled = false;
/**
* Set the layout of the text and icon in the segment.
*/
this.layout = 'icon-top';
/**
* The type of the button.
*/
this.type = 'button';
/**
* The value of the segment button.
*/
this.value = 'ion-sb-' + (ids++);
this.updateStyle = () => {
forceUpdate$1(this);
};
this.updateState = () => {
if (this.segmentEl) {
this.checked = this.segmentEl.value === this.value;
}
};
}
connectedCallback() {
const segmentEl = this.segmentEl = this.el.closest('ion-segment');
if (segmentEl) {
this.updateState();
addEventListener(segmentEl, 'ionSelect', this.updateState);
addEventListener(segmentEl, 'ionStyle', this.updateStyle);
}
}
disconnectedCallback() {
const segmentEl = this.segmentEl;
if (segmentEl) {
removeEventListener(segmentEl, 'ionSelect', this.updateState);
removeEventListener(segmentEl, 'ionStyle', this.updateStyle);
this.segmentEl = null;
}
}
get hasLabel() {
return !!this.el.querySelector('ion-label');
}
get hasIcon() {
return !!this.el.querySelector('ion-icon');
}
get tabIndex() {
if (this.disabled) {
return -1;
}
const hasTabIndex = this.el.hasAttribute('tabindex');
if (hasTabIndex) {
return this.el.getAttribute('tabindex');
}
return 0;
}
render() {
const { checked, type, disabled, hasIcon, hasLabel, layout, segmentEl, tabIndex } = this;
const mode = getIonMode$1(this);
const hasSegmentColor = () => segmentEl !== null && segmentEl.color !== undefined;
return (hAsync(Host, { role: "tab", "aria-selected": checked ? 'true' : 'false', "aria-disabled": disabled ? 'true' : null, tabIndex: tabIndex, class: {
[mode]: true,
'in-toolbar': hostContext('ion-toolbar', this.el),
'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
'in-segment': hostContext('ion-segment', this.el),
'in-segment-color': hasSegmentColor(),
'segment-button-has-label': hasLabel,
'segment-button-has-icon': hasIcon,
'segment-button-has-label-only': hasLabel && !hasIcon,
'segment-button-has-icon-only': hasIcon && !hasLabel,
'segment-button-disabled': disabled,
'segment-button-checked': checked,
[`segment-button-layout-${layout}`]: true,
'ion-activatable': true,
'ion-activatable-instant': true,
'ion-focusable': true,
} }, hAsync("button", { type: type, tabIndex: -1, class: "button-native", part: "native", disabled: disabled }, hAsync("span", { class: "button-inner" }, hAsync("slot", null)), mode === 'md' && hAsync("ion-ripple-effect", null)), hAsync("div", { part: "indicator", class: {
'segment-button-indicator': true,
'segment-button-indicator-animated': true
} }, hAsync("div", { part: "indicator-background", class: "segment-button-indicator-background" }))));
}
get el() { return getElement(this); }
static get style() { return {
ios: segmentButtonIosCss,
md: segmentButtonMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-segment-button",
"$members$": {
"disabled": [4],
"layout": [1],
"type": [1],
"value": [1],
"checked": [32]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const watchForOptions = (containerEl, tagName, onChange) => {
/* tslint:disable-next-line */
if (typeof MutationObserver === 'undefined') {
return;
}
const mutation = new MutationObserver(mutationList => {
onChange(getSelectedOption(mutationList, tagName));
});
mutation.observe(containerEl, {
childList: true,
subtree: true
});
return mutation;
};
const getSelectedOption = (mutationList, tagName) => {
let newOption;
mutationList.forEach(mut => {
// tslint:disable-next-line: prefer-for-of
for (let i = 0; i < mut.addedNodes.length; i++) {
newOption = findCheckedOption(mut.addedNodes[i], tagName) || newOption;
}
});
return newOption;
};
const findCheckedOption = (el, tagName) => {
if (el.nodeType !== 1) {
return undefined;
}
const options = (el.tagName === tagName.toUpperCase())
? [el]
: Array.from(el.querySelectorAll(tagName));
return options.find((o) => o.value === el.value);
};
const selectIosCss = "/*!@:host*/.sc-ion-select-ios-h{--placeholder-color:currentColor;--placeholder-opacity:0.33;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;font-family:var(--ion-font-family, inherit);overflow:hidden;z-index:2}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-select-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@:host(.in-item)*/.in-item.sc-ion-select-ios-h{position:static;max-width:45%}/*!@:host(.select-disabled)*/.select-disabled.sc-ion-select-ios-h{opacity:0.4;pointer-events:none}/*!@:host(.ion-focused) button*/.ion-focused.sc-ion-select-ios-h button.sc-ion-select-ios{border:2px solid #5e9ed6}/*!@.select-placeholder*/.select-placeholder.sc-ion-select-ios{color:var(--placeholder-color);opacity:var(--placeholder-opacity)}/*!@label*/label.sc-ion-select-ios{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:0}/*!@[dir=rtl] label, :host-context([dir=rtl]) label*/[dir=rtl].sc-ion-select-ios label.sc-ion-select-ios,[dir=rtl].sc-ion-select-ios-h label.sc-ion-select-ios,[dir=rtl] .sc-ion-select-ios-h label.sc-ion-select-ios{left:unset;right:unset;right:0}/*!@label::-moz-focus-inner*/label.sc-ion-select-ios::-moz-focus-inner{border:0}/*!@button*/button.sc-ion-select-ios{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}/*!@.select-icon*/.select-icon.sc-ion-select-ios{position:relative;opacity:0.33}/*!@.select-text*/.select-text.sc-ion-select-ios{-ms-flex:1;flex:1;min-width:16px;font-size:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}/*!@.select-icon-inner*/.select-icon-inner.sc-ion-select-ios{left:5px;top:50%;margin-top:-2px;position:absolute;width:0;height:0;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;color:currentColor;pointer-events:none}/*!@[dir=rtl] .select-icon-inner, :host-context([dir=rtl]) .select-icon-inner*/[dir=rtl].sc-ion-select-ios .select-icon-inner.sc-ion-select-ios,[dir=rtl].sc-ion-select-ios-h .select-icon-inner.sc-ion-select-ios,[dir=rtl] .sc-ion-select-ios-h .select-icon-inner.sc-ion-select-ios{left:unset;right:unset;right:5px}/*!@:host*/.sc-ion-select-ios-h{--padding-top:10px;--padding-end:10px;--padding-bottom:10px;--padding-start:20px}/*!@.select-icon*/.select-icon.sc-ion-select-ios{width:12px;height:18px}";
const selectMdCss = "/*!@:host*/.sc-ion-select-md-h{--placeholder-color:currentColor;--placeholder-opacity:0.33;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;font-family:var(--ion-font-family, inherit);overflow:hidden;z-index:2}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-select-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@:host(.in-item)*/.in-item.sc-ion-select-md-h{position:static;max-width:45%}/*!@:host(.select-disabled)*/.select-disabled.sc-ion-select-md-h{opacity:0.4;pointer-events:none}/*!@:host(.ion-focused) button*/.ion-focused.sc-ion-select-md-h button.sc-ion-select-md{border:2px solid #5e9ed6}/*!@.select-placeholder*/.select-placeholder.sc-ion-select-md{color:var(--placeholder-color);opacity:var(--placeholder-opacity)}/*!@label*/label.sc-ion-select-md{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:0}/*!@[dir=rtl] label, :host-context([dir=rtl]) label*/[dir=rtl].sc-ion-select-md label.sc-ion-select-md,[dir=rtl].sc-ion-select-md-h label.sc-ion-select-md,[dir=rtl] .sc-ion-select-md-h label.sc-ion-select-md{left:unset;right:unset;right:0}/*!@label::-moz-focus-inner*/label.sc-ion-select-md::-moz-focus-inner{border:0}/*!@button*/button.sc-ion-select-md{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}/*!@.select-icon*/.select-icon.sc-ion-select-md{position:relative;opacity:0.33}/*!@.select-text*/.select-text.sc-ion-select-md{-ms-flex:1;flex:1;min-width:16px;font-size:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}/*!@.select-icon-inner*/.select-icon-inner.sc-ion-select-md{left:5px;top:50%;margin-top:-2px;position:absolute;width:0;height:0;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;color:currentColor;pointer-events:none}/*!@[dir=rtl] .select-icon-inner, :host-context([dir=rtl]) .select-icon-inner*/[dir=rtl].sc-ion-select-md .select-icon-inner.sc-ion-select-md,[dir=rtl].sc-ion-select-md-h .select-icon-inner.sc-ion-select-md,[dir=rtl] .sc-ion-select-md-h .select-icon-inner.sc-ion-select-md{left:unset;right:unset;right:5px}/*!@:host*/.sc-ion-select-md-h{--padding-top:10px;--padding-end:0;--padding-bottom:10px;--padding-start:16px}/*!@.select-icon*/.select-icon.sc-ion-select-md{width:19px;height:19px}/*!@:host-context(.item-label-floating) .select-icon*/.item-label-floating.sc-ion-select-md-h .select-icon.sc-ion-select-md,.item-label-floating .sc-ion-select-md-h .select-icon.sc-ion-select-md{-webkit-transform:translate3d(0, -9px, 0);transform:translate3d(0, -9px, 0)}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part placeholder - The text displayed in the select when there is no value.
* @part text - The displayed value of the select.
* @part icon - The select icon container.
*/
class Select {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionChange = createEvent(this, "ionChange", 7);
this.ionCancel = createEvent(this, "ionCancel", 7);
this.ionFocus = createEvent(this, "ionFocus", 7);
this.ionBlur = createEvent(this, "ionBlur", 7);
this.ionStyle = createEvent(this, "ionStyle", 7);
this.inputId = `ion-sel-${selectIds++}`;
this.didInit = false;
this.isExpanded = false;
/**
* If `true`, the user cannot interact with the select.
*/
this.disabled = false;
/**
* The text to display on the cancel button.
*/
this.cancelText = 'Cancel';
/**
* The text to display on the ok button.
*/
this.okText = 'OK';
/**
* The name of the control, which is submitted with the form data.
*/
this.name = this.inputId;
/**
* If `true`, the select can accept multiple values.
*/
this.multiple = false;
/**
* The interface the select should use: `action-sheet`, `popover` or `alert`.
*/
this.interface = 'alert';
/**
* Any additional options that the `alert`, `action-sheet` or `popover` interface
* can take. See the [ion-alert docs](../alert), the
* [ion-action-sheet docs](../action-sheet) and the
* [ion-popover docs](../popover) for the
* create options for each interface.
*
* Note: `interfaceOptions` will not override `inputs` or `buttons` with the `alert` interface.
*/
this.interfaceOptions = {};
this.onClick = (ev) => {
this.setFocus();
this.open(ev);
};
this.onFocus = () => {
this.ionFocus.emit();
};
this.onBlur = () => {
this.ionBlur.emit();
};
}
disabledChanged() {
this.emitStyle();
}
valueChanged() {
this.emitStyle();
if (this.didInit) {
this.ionChange.emit({
value: this.value,
});
}
}
async connectedCallback() {
this.updateOverlayOptions();
this.emitStyle();
this.mutationO = watchForOptions(this.el, 'ion-select-option', async () => {
this.updateOverlayOptions();
});
}
disconnectedCallback() {
if (this.mutationO) {
this.mutationO.disconnect();
this.mutationO = undefined;
}
}
componentDidLoad() {
this.didInit = true;
}
/**
* Open the select overlay. The overlay is either an alert, action sheet, or popover,
* depending on the `interface` property on the `ion-select`.
*
* @param event The user interface event that called the open.
*/
async open(event) {
if (this.disabled || this.isExpanded) {
return undefined;
}
const overlay = this.overlay = await this.createOverlay(event);
this.isExpanded = true;
overlay.onDidDismiss().then(() => {
this.overlay = undefined;
this.isExpanded = false;
this.setFocus();
});
await overlay.present();
return overlay;
}
createOverlay(ev) {
let selectInterface = this.interface;
if ((selectInterface === 'action-sheet' || selectInterface === 'popover') && this.multiple) {
console.warn(`Select interface cannot be "${selectInterface}" with a multi-value select. Using the "alert" interface instead.`);
selectInterface = 'alert';
}
if (selectInterface === 'popover' && !ev) {
console.warn('Select interface cannot be a "popover" without passing an event. Using the "alert" interface instead.');
selectInterface = 'alert';
}
if (selectInterface === 'popover') {
return this.openPopover(ev);
}
if (selectInterface === 'action-sheet') {
return this.openActionSheet();
}
return this.openAlert();
}
updateOverlayOptions() {
const overlay = this.overlay;
if (!overlay) {
return;
}
const childOpts = this.childOpts;
const value = this.value;
switch (this.interface) {
case 'action-sheet':
overlay.buttons = this.createActionSheetButtons(childOpts, value);
break;
case 'popover':
const popover = overlay.querySelector('ion-select-popover');
if (popover) {
popover.options = this.createPopoverOptions(childOpts, value);
}
break;
case 'alert':
const inputType = (this.multiple ? 'checkbox' : 'radio');
overlay.inputs = this.createAlertInputs(childOpts, inputType, value);
break;
}
}
createActionSheetButtons(data, selectValue) {
const actionSheetButtons = data.map(option => {
const value = getOptionValue(option);
// Remove hydrated before copying over classes
const copyClasses = Array.from(option.classList).filter(cls => cls !== 'hydrated').join(' ');
const optClass = `${OPTION_CLASS} ${copyClasses}`;
return {
role: (isOptionSelected(value, selectValue, this.compareWith) ? 'selected' : ''),
text: option.textContent,
cssClass: optClass,
handler: () => {
this.value = value;
}
};
});
// Add "cancel" button
actionSheetButtons.push({
text: this.cancelText,
role: 'cancel',
handler: () => {
this.ionCancel.emit();
}
});
return actionSheetButtons;
}
createAlertInputs(data, inputType, selectValue) {
const alertInputs = data.map(option => {
const value = getOptionValue(option);
// Remove hydrated before copying over classes
const copyClasses = Array.from(option.classList).filter(cls => cls !== 'hydrated').join(' ');
const optClass = `${OPTION_CLASS} ${copyClasses}`;
return {
type: inputType,
cssClass: optClass,
label: option.textContent || '',
value,
checked: isOptionSelected(value, selectValue, this.compareWith),
disabled: option.disabled
};
});
return alertInputs;
}
createPopoverOptions(data, selectValue) {
const popoverOptions = data.map(option => {
const value = getOptionValue(option);
// Remove hydrated before copying over classes
const copyClasses = Array.from(option.classList).filter(cls => cls !== 'hydrated').join(' ');
const optClass = `${OPTION_CLASS} ${copyClasses}`;
return {
text: option.textContent || '',
cssClass: optClass,
value,
checked: isOptionSelected(value, selectValue, this.compareWith),
disabled: option.disabled,
handler: () => {
this.value = value;
this.close();
}
};
});
return popoverOptions;
}
async openPopover(ev) {
const interfaceOptions = this.interfaceOptions;
const mode = getIonMode$1(this);
const value = this.value;
const popoverOpts = Object.assign(Object.assign({ mode }, interfaceOptions), { component: 'ion-select-popover', cssClass: ['select-popover', interfaceOptions.cssClass], event: ev, componentProps: {
header: interfaceOptions.header,
subHeader: interfaceOptions.subHeader,
message: interfaceOptions.message,
value,
options: this.createPopoverOptions(this.childOpts, value)
} });
return popoverController.create(popoverOpts);
}
async openActionSheet() {
const mode = getIonMode$1(this);
const interfaceOptions = this.interfaceOptions;
const actionSheetOpts = Object.assign(Object.assign({ mode }, interfaceOptions), { buttons: this.createActionSheetButtons(this.childOpts, this.value), cssClass: ['select-action-sheet', interfaceOptions.cssClass] });
return actionSheetController.create(actionSheetOpts);
}
async openAlert() {
const label = this.getLabel();
const labelText = (label) ? label.textContent : null;
const interfaceOptions = this.interfaceOptions;
const inputType = (this.multiple ? 'checkbox' : 'radio');
const mode = getIonMode$1(this);
const alertOpts = Object.assign(Object.assign({ mode }, interfaceOptions), { header: interfaceOptions.header ? interfaceOptions.header : labelText, inputs: this.createAlertInputs(this.childOpts, inputType, this.value), buttons: [
{
text: this.cancelText,
role: 'cancel',
handler: () => {
this.ionCancel.emit();
}
},
{
text: this.okText,
handler: (selectedValues) => {
this.value = selectedValues;
}
}
], cssClass: ['select-alert', interfaceOptions.cssClass,
(this.multiple ? 'multiple-select-alert' : 'single-select-alert')] });
return alertController.create(alertOpts);
}
/**
* Close the select interface.
*/
close() {
// TODO check !this.overlay || !this.isFocus()
if (!this.overlay) {
return Promise.resolve(false);
}
return this.overlay.dismiss();
}
getLabel() {
return findItemLabel(this.el);
}
hasValue() {
return this.getText() !== '';
}
get childOpts() {
return Array.from(this.el.querySelectorAll('ion-select-option'));
}
getText() {
const selectedText = this.selectedText;
if (selectedText != null && selectedText !== '') {
return selectedText;
}
return generateText(this.childOpts, this.value, this.compareWith);
}
setFocus() {
if (this.focusEl) {
this.focusEl.focus();
}
}
emitStyle() {
this.ionStyle.emit({
'interactive': true,
'select': true,
'has-placeholder': this.placeholder != null,
'has-value': this.hasValue(),
'interactive-disabled': this.disabled,
'select-disabled': this.disabled
});
}
render() {
const { disabled, el, inputId, isExpanded, name, placeholder, value } = this;
const mode = getIonMode$1(this);
const { labelText, labelId } = getAriaLabel(el, inputId);
renderHiddenInput(true, el, name, parseValue(value), disabled);
const displayValue = this.getText();
let addPlaceholderClass = false;
let selectText = displayValue;
if (selectText === '' && placeholder != null) {
selectText = placeholder;
addPlaceholderClass = true;
}
const selectTextClasses = {
'select-text': true,
'select-placeholder': addPlaceholderClass
};
const textPart = addPlaceholderClass ? 'placeholder' : 'text';
// If there is a label then we need to concatenate it with the
// current value (or placeholder) and a comma so it separates
// nicely when the screen reader announces it, otherwise just
// announce the value / placeholder
const displayLabel = labelText !== undefined
? (selectText !== '' ? `${selectText}, ${labelText}` : labelText)
: selectText;
return (hAsync(Host, { onClick: this.onClick, role: "button", "aria-haspopup": "listbox", "aria-disabled": disabled ? 'true' : null, "aria-label": displayLabel, class: {
[mode]: true,
'in-item': hostContext('ion-item', el),
'select-disabled': disabled,
'select-expanded': isExpanded
} }, hAsync("div", { "aria-hidden": "true", class: selectTextClasses, part: textPart }, selectText), hAsync("div", { class: "select-icon", role: "presentation", part: "icon" }, hAsync("div", { class: "select-icon-inner" })), hAsync("label", { id: labelId }, displayLabel), hAsync("button", { type: "button", disabled: disabled, id: inputId, "aria-labelledby": labelId, "aria-haspopup": "listbox", "aria-expanded": `${isExpanded}`, onFocus: this.onFocus, onBlur: this.onBlur, ref: (focusEl => this.focusEl = focusEl) })));
}
get el() { return getElement(this); }
static get watchers() { return {
"disabled": ["disabledChanged"],
"placeholder": ["disabledChanged"],
"value": ["valueChanged"]
}; }
static get style() { return {
ios: selectIosCss,
md: selectMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-select",
"$members$": {
"disabled": [4],
"cancelText": [1, "cancel-text"],
"okText": [1, "ok-text"],
"placeholder": [1],
"name": [1],
"selectedText": [1, "selected-text"],
"multiple": [4],
"interface": [1],
"interfaceOptions": [8, "interface-options"],
"compareWith": [1, "compare-with"],
"value": [1032],
"isExpanded": [32],
"open": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const isOptionSelected = (currentValue, compareValue, compareWith) => {
if (currentValue === undefined) {
return false;
}
if (Array.isArray(currentValue)) {
return currentValue.some(val => compareOptions(val, compareValue, compareWith));
}
else {
return compareOptions(currentValue, compareValue, compareWith);
}
};
const getOptionValue = (el) => {
const value = el.value;
return (value === undefined)
? el.textContent || ''
: value;
};
const parseValue = (value) => {
if (value == null) {
return undefined;
}
if (Array.isArray(value)) {
return value.join(',');
}
return value.toString();
};
const compareOptions = (currentValue, compareValue, compareWith) => {
if (typeof compareWith === 'function') {
return compareWith(currentValue, compareValue);
}
else if (typeof compareWith === 'string') {
return currentValue[compareWith] === compareValue[compareWith];
}
else {
return Array.isArray(compareValue) ? compareValue.includes(currentValue) : currentValue === compareValue;
}
};
const generateText = (opts, value, compareWith) => {
if (value === undefined) {
return '';
}
if (Array.isArray(value)) {
return value
.map(v => textForValue(opts, v, compareWith))
.filter(opt => opt !== null)
.join(', ');
}
else {
return textForValue(opts, value, compareWith) || '';
}
};
const textForValue = (opts, value, compareWith) => {
const selectOpt = opts.find(opt => {
return compareOptions(getOptionValue(opt), value, compareWith);
});
return selectOpt
? selectOpt.textContent
: null;
};
let selectIds = 0;
const OPTION_CLASS = 'select-interface-option';
const selectOptionCss = "/*!@:host*/.sc-ion-select-option-h{display:none}";
class SelectOption {
constructor(hostRef) {
registerInstance(this, hostRef);
this.inputId = `ion-selopt-${selectOptionIds++}`;
/**
* If `true`, the user cannot interact with the select option. This property does not apply when `interface="action-sheet"` as `ion-action-sheet` does not allow for disabled buttons.
*/
this.disabled = false;
}
render() {
return (hAsync(Host, { role: "option", id: this.inputId, class: getIonMode$1(this) }));
}
get el() { return getElement(this); }
static get style() { return selectOptionCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-select-option",
"$members$": {
"disabled": [4],
"value": [8]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
let selectOptionIds = 0;
const selectPopoverCss = ".sc-ion-select-popover-h ion-list.sc-ion-select-popover{margin-left:0;margin-right:0;margin-top:-1px;margin-bottom:-1px}.sc-ion-select-popover-h ion-list-header.sc-ion-select-popover,.sc-ion-select-popover-h ion-label.sc-ion-select-popover{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}";
/**
* @internal
*/
class SelectPopover {
constructor(hostRef) {
registerInstance(this, hostRef);
/** Array of options for the popover */
this.options = [];
}
onSelect(ev) {
const option = this.options.find(o => o.value === ev.target.value);
if (option) {
safeCall(option.handler);
}
}
render() {
const checkedOption = this.options.find(o => o.checked);
const checkedValue = checkedOption ? checkedOption.value : undefined;
return (hAsync(Host, { class: getIonMode$1(this) }, hAsync("ion-list", null, this.header !== undefined && hAsync("ion-list-header", null, this.header), (this.subHeader !== undefined || this.message !== undefined) &&
hAsync("ion-item", null, hAsync("ion-label", { class: "ion-text-wrap" }, this.subHeader !== undefined && hAsync("h3", null, this.subHeader), this.message !== undefined && hAsync("p", null, this.message))), hAsync("ion-radio-group", { value: checkedValue }, this.options.map(option => hAsync("ion-item", { class: getClassMap(option.cssClass) }, hAsync("ion-label", null, option.text), hAsync("ion-radio", { value: option.value, disabled: option.disabled })))))));
}
static get style() { return selectPopoverCss; }
static get cmpMeta() { return {
"$flags$": 2,
"$tagName$": "ion-select-popover",
"$members$": {
"header": [1],
"subHeader": [1, "sub-header"],
"message": [1],
"options": [16]
},
"$listeners$": [[0, "ionChange", "onSelect"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const skeletonTextCss = "/*!@:host*/.sc-ion-skeleton-text-h{--background:rgba(var(--background-rgb, var(--ion-text-color-rgb, 0, 0, 0)), 0.065);border-radius:var(--border-radius, inherit);display:block;width:100%;height:inherit;margin-top:4px;margin-bottom:4px;background:var(--background);line-height:10px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}/*!@span*/span.sc-ion-skeleton-text{display:inline-block}/*!@:host(.in-media)*/.in-media.sc-ion-skeleton-text-h{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;height:100%}/*!@:host(.skeleton-text-animated)*/.skeleton-text-animated.sc-ion-skeleton-text-h{position:relative;background:-webkit-gradient(linear, left top, right top, color-stop(8%, rgba(var(--background-rgb, var(--ion-text-color-rgb, 0, 0, 0)), 0.065)), color-stop(18%, rgba(var(--background-rgb, var(--ion-text-color-rgb, 0, 0, 0)), 0.135)), color-stop(33%, rgba(var(--background-rgb, var(--ion-text-color-rgb, 0, 0, 0)), 0.065)));background:linear-gradient(to right, rgba(var(--background-rgb, var(--ion-text-color-rgb, 0, 0, 0)), 0.065) 8%, rgba(var(--background-rgb, var(--ion-text-color-rgb, 0, 0, 0)), 0.135) 18%, rgba(var(--background-rgb, var(--ion-text-color-rgb, 0, 0, 0)), 0.065) 33%);background-size:800px 104px;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:shimmer;animation-name:shimmer;-webkit-animation-timing-function:linear;animation-timing-function:linear}@-webkit-keyframes shimmer{0%{background-position:-400px 0}100%{background-position:400px 0}}@keyframes shimmer{0%{background-position:-400px 0}100%{background-position:400px 0}}";
class SkeletonText {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If `true`, the skeleton text will animate.
*/
this.animated = false;
}
render() {
const animated = this.animated && config.getBoolean('animated', true);
const inMedia = hostContext('ion-avatar', this.el) || hostContext('ion-thumbnail', this.el);
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
'skeleton-text-animated': animated,
'in-media': inMedia
} }, hAsync("span", null, "\u00A0")));
}
get el() { return getElement(this); }
static get style() { return skeletonTextCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-skeleton-text",
"$members$": {
"animated": [4]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const slideCss = "ion-slide{display:block;width:100%;height:100%}.slide-zoom{display:block;width:100%;text-align:center}.swiper-slide{display:-ms-flexbox;display:flex;position:relative;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;font-size:18px;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box}.swiper-slide img{width:auto;max-width:100%;height:auto;max-height:100%}";
class Slide {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
'swiper-slide': true,
'swiper-zoom-container': true
} }));
}
static get style() { return slideCss; }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-slide",
"$members$": undefined,
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const slidesIosCss = ".swiper-container{margin:0 auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-no-flexbox .swiper-slide{float:left}.swiper-container-vertical{height:100%}.swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform, -webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0px, 0, 0);transform:translate3d(0px, 0, 0)}.swiper-container-multirow>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.swiper-slide{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform, -webkit-transform}.swiper-invisible-blank-slide{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height, -webkit-transform;transition-property:height, -webkit-transform;-o-transition-property:transform, height;transition-property:transform, height;transition-property:transform, height, -webkit-transform}.swiper-container-3d{-webkit-perspective:1200px;perspective:1200px}.swiper-container-3d .swiper-wrapper,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-cube-shadow{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:-webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:-o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:-webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:-o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:-webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:-o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:-webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:-o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-container-wp8-horizontal,.swiper-container-wp8-horizontal>.swiper-wrapper{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-container-wp8-vertical,.swiper-container-wp8-vertical>.swiper-wrapper{-ms-touch-action:pan-x;touch-action:pan-x}.swiper-button-prev,.swiper-button-next{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;background-size:27px 44px;background-position:center;background-repeat:no-repeat}.swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{opacity:0.35;cursor:auto;pointer-events:none}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E\");left:10px;right:auto}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E\");right:10px;left:auto}.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E\")}.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E\")}.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E\")}.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E\")}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:300ms opacity;-o-transition:300ms opacity;transition:300ms opacity;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-container-horizontal>.swiper-pagination-bullets{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(0.33);-ms-transform:scale(0.33);transform:scale(0.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(0.66);-ms-transform:scale(0.66);transform:scale(0.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(0.33);-ms-transform:scale(0.33);transform:scale(0.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(0.66);-ms-transform:scale(0.66);transform:scale(0.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(0.33);-ms-transform:scale(0.33);transform:scale(0.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:0.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:#007aff}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0px, -50%, 0);transform:translate3d(0px, -50%, 0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:200ms top, 200ms -webkit-transform;transition:200ms top, 200ms -webkit-transform;-o-transition:200ms transform, 200ms top;transition:200ms transform, 200ms top;transition:200ms transform, 200ms top, 200ms -webkit-transform}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:200ms left, 200ms -webkit-transform;transition:200ms left, 200ms -webkit-transform;-o-transition:200ms transform, 200ms left;transition:200ms transform, 200ms left;transition:200ms transform, 200ms left, 200ms -webkit-transform}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:200ms right, 200ms -webkit-transform;transition:200ms right, 200ms -webkit-transform;-o-transition:200ms transform, 200ms right;transition:200ms transform, 200ms right;transition:200ms transform, 200ms right, 200ms -webkit-transform}.swiper-pagination-progressbar{background:rgba(0, 0, 0, 0.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;-ms-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-vertical>.swiper-pagination-progressbar,.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:4px;height:100%;left:0;top:0}.swiper-pagination-white .swiper-pagination-bullet-active{background:#ffffff}.swiper-pagination-progressbar.swiper-pagination-white{background:rgba(255, 255, 255, 0.25)}.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill{background:#ffffff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000000}.swiper-pagination-progressbar.swiper-pagination-black{background:rgba(0, 0, 0, 0.25)}.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill{background:#000000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0, 0, 0, 0.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0, 0, 0, 0.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;text-align:center}.swiper-zoom-container>img,.swiper-zoom-container>svg,.swiper-zoom-container>canvas{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-ms-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s steps(12, end) infinite;animation:swiper-preloader-spin 1s steps(12, end) infinite}.swiper-lazy-preloader:after{display:block;content:\"\";width:100%;height:100%;background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:50%;background-size:100%;background-repeat:no-repeat}.swiper-lazy-preloader-white:after{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\")}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-prev,.swiper-container-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-top,.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;background:#000;opacity:0.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-top,.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-coverflow .swiper-wrapper{-ms-perspective:1200px}ion-slides{display:block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.swiper-pagination-bullet{background:var(--bullet-background)}.swiper-pagination-bullet-active{background:var(--bullet-background-active)}.swiper-pagination-progressbar{background:var(--progress-bar-background)}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--progress-bar-background-active)}.swiper-scrollbar{background:var(--scroll-bar-background)}.swiper-scrollbar-drag{background:var(--scroll-bar-background-active)}.slides-ios{--bullet-background:var(--ion-color-step-200, #cccccc);--bullet-background-active:var(--ion-color-primary, #3880ff);--progress-bar-background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.25);--progress-bar-background-active:var(--ion-color-primary-shade, #3171e0);--scroll-bar-background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.1);--scroll-bar-background-active:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.5)}";
const slidesMdCss = ".swiper-container{margin:0 auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-no-flexbox .swiper-slide{float:left}.swiper-container-vertical{height:100%}.swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform, -webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0px, 0, 0);transform:translate3d(0px, 0, 0)}.swiper-container-multirow>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.swiper-slide{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform, -webkit-transform}.swiper-invisible-blank-slide{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height, -webkit-transform;transition-property:height, -webkit-transform;-o-transition-property:transform, height;transition-property:transform, height;transition-property:transform, height, -webkit-transform}.swiper-container-3d{-webkit-perspective:1200px;perspective:1200px}.swiper-container-3d .swiper-wrapper,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-cube-shadow{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:-webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:-o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:-webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:-o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:-webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:-o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:-webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:-o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));background-image:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-container-wp8-horizontal,.swiper-container-wp8-horizontal>.swiper-wrapper{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-container-wp8-vertical,.swiper-container-wp8-vertical>.swiper-wrapper{-ms-touch-action:pan-x;touch-action:pan-x}.swiper-button-prev,.swiper-button-next{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;background-size:27px 44px;background-position:center;background-repeat:no-repeat}.swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{opacity:0.35;cursor:auto;pointer-events:none}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E\");left:10px;right:auto}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E\");right:10px;left:auto}.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E\")}.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E\")}.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E\")}.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E\")}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:300ms opacity;-o-transition:300ms opacity;transition:300ms opacity;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-container-horizontal>.swiper-pagination-bullets{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(0.33);-ms-transform:scale(0.33);transform:scale(0.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(0.66);-ms-transform:scale(0.66);transform:scale(0.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(0.33);-ms-transform:scale(0.33);transform:scale(0.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(0.66);-ms-transform:scale(0.66);transform:scale(0.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(0.33);-ms-transform:scale(0.33);transform:scale(0.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:0.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:#007aff}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0px, -50%, 0);transform:translate3d(0px, -50%, 0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:200ms top, 200ms -webkit-transform;transition:200ms top, 200ms -webkit-transform;-o-transition:200ms transform, 200ms top;transition:200ms transform, 200ms top;transition:200ms transform, 200ms top, 200ms -webkit-transform}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:200ms left, 200ms -webkit-transform;transition:200ms left, 200ms -webkit-transform;-o-transition:200ms transform, 200ms left;transition:200ms transform, 200ms left;transition:200ms transform, 200ms left, 200ms -webkit-transform}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:200ms right, 200ms -webkit-transform;transition:200ms right, 200ms -webkit-transform;-o-transition:200ms transform, 200ms right;transition:200ms transform, 200ms right;transition:200ms transform, 200ms right, 200ms -webkit-transform}.swiper-pagination-progressbar{background:rgba(0, 0, 0, 0.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;-ms-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-vertical>.swiper-pagination-progressbar,.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:4px;height:100%;left:0;top:0}.swiper-pagination-white .swiper-pagination-bullet-active{background:#ffffff}.swiper-pagination-progressbar.swiper-pagination-white{background:rgba(255, 255, 255, 0.25)}.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill{background:#ffffff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000000}.swiper-pagination-progressbar.swiper-pagination-black{background:rgba(0, 0, 0, 0.25)}.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill{background:#000000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0, 0, 0, 0.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0, 0, 0, 0.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;text-align:center}.swiper-zoom-container>img,.swiper-zoom-container>svg,.swiper-zoom-container>canvas{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-ms-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s steps(12, end) infinite;animation:swiper-preloader-spin 1s steps(12, end) infinite}.swiper-lazy-preloader:after{display:block;content:\"\";width:100%;height:100%;background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:50%;background-size:100%;background-repeat:no-repeat}.swiper-lazy-preloader-white:after{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\")}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-prev,.swiper-container-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-top,.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;background:#000;opacity:0.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-top,.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-coverflow .swiper-wrapper{-ms-perspective:1200px}ion-slides{display:block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.swiper-pagination-bullet{background:var(--bullet-background)}.swiper-pagination-bullet-active{background:var(--bullet-background-active)}.swiper-pagination-progressbar{background:var(--progress-bar-background)}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--progress-bar-background-active)}.swiper-scrollbar{background:var(--scroll-bar-background)}.swiper-scrollbar-drag{background:var(--scroll-bar-background-active)}.slides-md{--bullet-background:var(--ion-color-step-200, #cccccc);--bullet-background-active:var(--ion-color-primary, #3880ff);--progress-bar-background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.25);--progress-bar-background-active:var(--ion-color-primary-shade, #3171e0);--scroll-bar-background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.1);--scroll-bar-background-active:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.5)}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Slides {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionSlidesDidLoad = createEvent(this, "ionSlidesDidLoad", 7);
this.ionSlideTap = createEvent(this, "ionSlideTap", 7);
this.ionSlideDoubleTap = createEvent(this, "ionSlideDoubleTap", 7);
this.ionSlideWillChange = createEvent(this, "ionSlideWillChange", 7);
this.ionSlideDidChange = createEvent(this, "ionSlideDidChange", 7);
this.ionSlideNextStart = createEvent(this, "ionSlideNextStart", 7);
this.ionSlidePrevStart = createEvent(this, "ionSlidePrevStart", 7);
this.ionSlideNextEnd = createEvent(this, "ionSlideNextEnd", 7);
this.ionSlidePrevEnd = createEvent(this, "ionSlidePrevEnd", 7);
this.ionSlideTransitionStart = createEvent(this, "ionSlideTransitionStart", 7);
this.ionSlideTransitionEnd = createEvent(this, "ionSlideTransitionEnd", 7);
this.ionSlideDrag = createEvent(this, "ionSlideDrag", 7);
this.ionSlideReachStart = createEvent(this, "ionSlideReachStart", 7);
this.ionSlideReachEnd = createEvent(this, "ionSlideReachEnd", 7);
this.ionSlideTouchStart = createEvent(this, "ionSlideTouchStart", 7);
this.ionSlideTouchEnd = createEvent(this, "ionSlideTouchEnd", 7);
this.swiperReady = false;
this.swiper = new Promise(resolve => { this.readySwiper = resolve; });
this.didInit = false;
/**
* Options to pass to the swiper instance.
* See http://idangero.us/swiper/api/ for valid options
*/
this.options = {}; // SwiperOptions; // TODO
/**
* If `true`, show the pagination.
*/
this.pager = false;
/**
* If `true`, show the scrollbar.
*/
this.scrollbar = false;
}
async optionsChanged() {
if (this.swiperReady) {
const swiper = await this.getSwiper();
if (swiper === null || swiper === void 0 ? void 0 : swiper.params) {
Object.assign(swiper.params, this.options);
await this.update();
}
}
}
connectedCallback() {
// tslint:disable-next-line: strict-type-predicates
if (typeof MutationObserver !== 'undefined') {
const mut = this.mutationO = new MutationObserver(() => {
if (this.swiperReady) {
this.update();
}
});
mut.observe(this.el, {
childList: true,
subtree: true
});
componentOnReady(this.el, () => {
if (!this.didInit) {
this.didInit = true;
this.initSwiper();
}
});
}
}
disconnectedCallback() {
if (this.mutationO) {
this.mutationO.disconnect();
this.mutationO = undefined;
}
/**
* We need to synchronously destroy
* swiper otherwise it is possible
* that it will be left in a
* destroyed state if connectedCallback
* is called multiple times
*/
const swiper = this.syncSwiper;
if (swiper !== undefined) {
swiper.destroy(true, true);
this.swiper = new Promise(resolve => { this.readySwiper = resolve; });
this.swiperReady = false;
this.syncSwiper = undefined;
}
this.didInit = false;
}
/**
* Update the underlying slider implementation. Call this if you've added or removed
* child slides.
*/
async update() {
const [swiper] = await Promise.all([
this.getSwiper(),
waitForSlides(this.el)
]);
swiper.update();
}
/**
* Force swiper to update its height (when autoHeight is enabled) for the duration
* equal to 'speed' parameter.
*
* @param speed The transition duration (in ms).
*/
async updateAutoHeight(speed) {
const swiper = await this.getSwiper();
swiper.updateAutoHeight(speed);
}
/**
* Transition to the specified slide.
*
* @param index The index of the slide to transition to.
* @param speed The transition duration (in ms).
* @param runCallbacks If true, the transition will produce [Transition/SlideChange][Start/End] transition events.
*/
async slideTo(index, speed, runCallbacks) {
const swiper = await this.getSwiper();
swiper.slideTo(index, speed, runCallbacks);
}
/**
* Transition to the next slide.
*
* @param speed The transition duration (in ms).
* @param runCallbacks If true, the transition will produce [Transition/SlideChange][Start/End] transition events.
*/
async slideNext(speed, runCallbacks) {
const swiper = await this.getSwiper();
swiper.slideNext(speed, runCallbacks);
}
/**
* Transition to the previous slide.
*
* @param speed The transition duration (in ms).
* @param runCallbacks If true, the transition will produce the [Transition/SlideChange][Start/End] transition events.
*/
async slidePrev(speed, runCallbacks) {
const swiper = await this.getSwiper();
swiper.slidePrev(speed, runCallbacks);
}
/**
* Get the index of the active slide.
*/
async getActiveIndex() {
const swiper = await this.getSwiper();
return swiper.activeIndex;
}
/**
* Get the index of the previous slide.
*/
async getPreviousIndex() {
const swiper = await this.getSwiper();
return swiper.previousIndex;
}
/**
* Get the total number of slides.
*/
async length() {
const swiper = await this.getSwiper();
return swiper.slides.length;
}
/**
* Get whether or not the current slide is the last slide.
*/
async isEnd() {
const swiper = await this.getSwiper();
return swiper.isEnd;
}
/**
* Get whether or not the current slide is the first slide.
*/
async isBeginning() {
const swiper = await this.getSwiper();
return swiper.isBeginning;
}
/**
* Start auto play.
*/
async startAutoplay() {
const swiper = await this.getSwiper();
if (swiper.autoplay) {
swiper.autoplay.start();
}
}
/**
* Stop auto play.
*/
async stopAutoplay() {
const swiper = await this.getSwiper();
if (swiper.autoplay) {
swiper.autoplay.stop();
}
}
/**
* Lock or unlock the ability to slide to the next slide.
*
* @param lock If `true`, disable swiping to the next slide.
*/
async lockSwipeToNext(lock) {
const swiper = await this.getSwiper();
swiper.allowSlideNext = !lock;
}
/**
* Lock or unlock the ability to slide to the previous slide.
*
* @param lock If `true`, disable swiping to the previous slide.
*/
async lockSwipeToPrev(lock) {
const swiper = await this.getSwiper();
swiper.allowSlidePrev = !lock;
}
/**
* Lock or unlock the ability to slide to the next or previous slide.
*
* @param lock If `true`, disable swiping to the next and previous slide.
*/
async lockSwipes(lock) {
const swiper = await this.getSwiper();
swiper.allowSlideNext = !lock;
swiper.allowSlidePrev = !lock;
swiper.allowTouchMove = !lock;
}
/**
* Get the Swiper instance.
* Use this to access the full Swiper API.
* See https://idangero.us/swiper/api/ for all API options.
*/
async getSwiper() {
return this.swiper;
}
async initSwiper() {
const finalOptions = this.normalizeOptions();
// init swiper core
// @ts-ignore
const { Swiper } = await Promise.resolve().then(function () { return swiper_bundle; });
await waitForSlides(this.el);
const swiper = new Swiper(this.el, finalOptions);
this.swiperReady = true;
this.syncSwiper = swiper;
this.readySwiper(swiper);
}
normalizeOptions() {
// Base options, can be changed
// TODO Add interface SwiperOptions
const swiperOptions = {
effect: undefined,
direction: 'horizontal',
initialSlide: 0,
loop: false,
parallax: false,
slidesPerView: 1,
spaceBetween: 0,
speed: 300,
slidesPerColumn: 1,
slidesPerColumnFill: 'column',
slidesPerGroup: 1,
centeredSlides: false,
slidesOffsetBefore: 0,
slidesOffsetAfter: 0,
touchEventsTarget: 'container',
autoplay: false,
freeMode: false,
freeModeMomentum: true,
freeModeMomentumRatio: 1,
freeModeMomentumBounce: true,
freeModeMomentumBounceRatio: 1,
freeModeMomentumVelocityRatio: 1,
freeModeSticky: false,
freeModeMinimumVelocity: 0.02,
autoHeight: false,
setWrapperSize: false,
zoom: {
maxRatio: 3,
minRatio: 1,
toggle: false,
},
touchRatio: 1,
touchAngle: 45,
simulateTouch: true,
touchStartPreventDefault: false,
shortSwipes: true,
longSwipes: true,
longSwipesRatio: 0.5,
longSwipesMs: 300,
followFinger: true,
threshold: 0,
touchMoveStopPropagation: true,
touchReleaseOnEdges: false,
iOSEdgeSwipeDetection: false,
iOSEdgeSwipeThreshold: 20,
resistance: true,
resistanceRatio: 0.85,
watchSlidesProgress: false,
watchSlidesVisibility: false,
preventClicks: true,
preventClicksPropagation: true,
slideToClickedSlide: false,
loopAdditionalSlides: 0,
noSwiping: true,
runCallbacksOnInit: true,
coverflowEffect: {
rotate: 50,
stretch: 0,
depth: 100,
modifier: 1,
slideShadows: true
},
flipEffect: {
slideShadows: true,
limitRotation: true
},
cubeEffect: {
slideShadows: true,
shadow: true,
shadowOffset: 20,
shadowScale: 0.94
},
fadeEffect: {
crossFade: false
},
a11y: {
prevSlideMessage: 'Previous slide',
nextSlideMessage: 'Next slide',
firstSlideMessage: 'This is the first slide',
lastSlideMessage: 'This is the last slide'
}
};
if (this.pager) {
swiperOptions.pagination = {
el: this.paginationEl,
type: 'bullets',
clickable: false,
hideOnClick: false,
};
}
if (this.scrollbar) {
swiperOptions.scrollbar = {
el: this.scrollbarEl,
hide: true,
};
}
// Keep the event options separate, we dont want users
// overwriting these
const eventOptions = {
on: {
init: () => {
setTimeout(() => {
this.ionSlidesDidLoad.emit();
}, 20);
},
slideChangeTransitionStart: this.ionSlideWillChange.emit,
slideChangeTransitionEnd: this.ionSlideDidChange.emit,
slideNextTransitionStart: this.ionSlideNextStart.emit,
slidePrevTransitionStart: this.ionSlidePrevStart.emit,
slideNextTransitionEnd: this.ionSlideNextEnd.emit,
slidePrevTransitionEnd: this.ionSlidePrevEnd.emit,
transitionStart: this.ionSlideTransitionStart.emit,
transitionEnd: this.ionSlideTransitionEnd.emit,
sliderMove: this.ionSlideDrag.emit,
reachBeginning: this.ionSlideReachStart.emit,
reachEnd: this.ionSlideReachEnd.emit,
touchStart: this.ionSlideTouchStart.emit,
touchEnd: this.ionSlideTouchEnd.emit,
tap: this.ionSlideTap.emit,
doubleTap: this.ionSlideDoubleTap.emit
}
};
const customEvents = (!!this.options && !!this.options.on) ? this.options.on : {};
// merge "on" event listeners, while giving our event listeners priority
const mergedEventOptions = { on: Object.assign(Object.assign({}, customEvents), eventOptions.on) };
// Merge the base, user options, and events together then pas to swiper
return Object.assign(Object.assign(Object.assign({}, swiperOptions), this.options), mergedEventOptions);
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[`${mode}`]: true,
// Used internally for styling
[`slides-${mode}`]: true,
'swiper-container': true
} }, hAsync("div", { class: "swiper-wrapper" }, hAsync("slot", null)), this.pager && hAsync("div", { class: "swiper-pagination", ref: el => this.paginationEl = el }), this.scrollbar && hAsync("div", { class: "swiper-scrollbar", ref: el => this.scrollbarEl = el })));
}
static get assetsDirs() { return ["swiper"]; }
get el() { return getElement(this); }
static get watchers() { return {
"options": ["optionsChanged"]
}; }
static get style() { return {
ios: slidesIosCss,
md: slidesMdCss
}; }
static get cmpMeta() { return {
"$flags$": 36,
"$tagName$": "ion-slides",
"$members$": {
"options": [8],
"pager": [4],
"scrollbar": [4],
"update": [64],
"updateAutoHeight": [64],
"slideTo": [64],
"slideNext": [64],
"slidePrev": [64],
"getActiveIndex": [64],
"getPreviousIndex": [64],
"length": [64],
"isEnd": [64],
"isBeginning": [64],
"startAutoplay": [64],
"stopAutoplay": [64],
"lockSwipeToNext": [64],
"lockSwipeToPrev": [64],
"lockSwipes": [64],
"getSwiper": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const waitForSlides = (el) => {
return Promise.all(Array.from(el.querySelectorAll('ion-slide')).map(s => new Promise(resolve => componentOnReady(s, resolve))));
};
const spinnerCss = "/*!@:host*/.sc-ion-spinner-h{display:inline-block;position:relative;width:28px;height:28px;color:var(--color);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}/*!@:host(.ion-color)*/.ion-color.sc-ion-spinner-h{color:var(--ion-color-base)}/*!@svg*/svg.sc-ion-spinner{left:0;top:0;-webkit-transform-origin:center;transform-origin:center;position:absolute;width:100%;height:100%;-webkit-transform:translateZ(0);transform:translateZ(0)}/*!@[dir=rtl] svg, :host-context([dir=rtl]) svg*/[dir=rtl].sc-ion-spinner svg.sc-ion-spinner,[dir=rtl].sc-ion-spinner-h svg.sc-ion-spinner,[dir=rtl] .sc-ion-spinner-h svg.sc-ion-spinner{left:unset;right:unset;right:0}/*!@[dir=rtl] svg, :host-context([dir=rtl]) svg*/[dir=rtl].sc-ion-spinner svg.sc-ion-spinner,[dir=rtl].sc-ion-spinner-h svg.sc-ion-spinner,[dir=rtl] .sc-ion-spinner-h svg.sc-ion-spinner{-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}/*!@:host(.spinner-lines) line,\n:host(.spinner-lines-small) line*/.spinner-lines.sc-ion-spinner-h line.sc-ion-spinner,.spinner-lines-small.sc-ion-spinner-h line.sc-ion-spinner{stroke-width:4px;stroke-linecap:round;stroke:currentColor}/*!@:host(.spinner-lines) svg,\n:host(.spinner-lines-small) svg*/.spinner-lines.sc-ion-spinner-h svg.sc-ion-spinner,.spinner-lines-small.sc-ion-spinner-h svg.sc-ion-spinner{-webkit-animation:spinner-fade-out 1s linear infinite;animation:spinner-fade-out 1s linear infinite}/*!@:host(.spinner-bubbles) svg*/.spinner-bubbles.sc-ion-spinner-h svg.sc-ion-spinner{-webkit-animation:spinner-scale-out 1s linear infinite;animation:spinner-scale-out 1s linear infinite;fill:currentColor}/*!@:host(.spinner-circles) svg*/.spinner-circles.sc-ion-spinner-h svg.sc-ion-spinner{-webkit-animation:spinner-fade-out 1s linear infinite;animation:spinner-fade-out 1s linear infinite;fill:currentColor}/*!@:host(.spinner-crescent) circle*/.spinner-crescent.sc-ion-spinner-h circle.sc-ion-spinner{fill:transparent;stroke-width:4px;stroke-dasharray:128px;stroke-dashoffset:82px;stroke:currentColor}/*!@:host(.spinner-crescent) svg*/.spinner-crescent.sc-ion-spinner-h svg.sc-ion-spinner{-webkit-animation:spinner-rotate 1s linear infinite;animation:spinner-rotate 1s linear infinite}/*!@:host(.spinner-dots) circle*/.spinner-dots.sc-ion-spinner-h circle.sc-ion-spinner{stroke-width:0;fill:currentColor}/*!@:host(.spinner-dots) svg*/.spinner-dots.sc-ion-spinner-h svg.sc-ion-spinner{-webkit-animation:spinner-dots 1s linear infinite;animation:spinner-dots 1s linear infinite}/*!@:host(.spinner-circular)*/.spinner-circular.sc-ion-spinner-h{-webkit-animation:spinner-circular linear infinite;animation:spinner-circular linear infinite}/*!@:host(.spinner-circular) circle*/.spinner-circular.sc-ion-spinner-h circle.sc-ion-spinner{-webkit-animation:spinner-circular-inner ease-in-out infinite;animation:spinner-circular-inner ease-in-out infinite;stroke:currentColor;stroke-dasharray:80px, 200px;stroke-dashoffset:0px;stroke-width:5.6;fill:none}/*!@:host(.spinner-paused),\n:host(.spinner-paused) svg,\n:host(.spinner-paused) circle*/.spinner-paused.sc-ion-spinner-h,.spinner-paused.sc-ion-spinner-h svg.sc-ion-spinner,.spinner-paused.sc-ion-spinner-h circle.sc-ion-spinner{-webkit-animation-play-state:paused;animation-play-state:paused}@-webkit-keyframes spinner-fade-out{0%{opacity:1}100%{opacity:0}}@keyframes spinner-fade-out{0%{opacity:1}100%{opacity:0}}@-webkit-keyframes spinner-scale-out{0%{-webkit-transform:scale(1, 1);transform:scale(1, 1)}100%{-webkit-transform:scale(0, 0);transform:scale(0, 0)}}@keyframes spinner-scale-out{0%{-webkit-transform:scale(1, 1);transform:scale(1, 1)}100%{-webkit-transform:scale(0, 0);transform:scale(0, 0)}}@-webkit-keyframes spinner-rotate{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spinner-rotate{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes spinner-dots{0%{-webkit-transform:scale(1, 1);transform:scale(1, 1);opacity:0.9}50%{-webkit-transform:scale(0.4, 0.4);transform:scale(0.4, 0.4);opacity:0.3}100%{-webkit-transform:scale(1, 1);transform:scale(1, 1);opacity:0.9}}@keyframes spinner-dots{0%{-webkit-transform:scale(1, 1);transform:scale(1, 1);opacity:0.9}50%{-webkit-transform:scale(0.4, 0.4);transform:scale(0.4, 0.4);opacity:0.3}100%{-webkit-transform:scale(1, 1);transform:scale(1, 1);opacity:0.9}}@-webkit-keyframes spinner-circular{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spinner-circular{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes spinner-circular-inner{0%{stroke-dasharray:1px, 200px;stroke-dashoffset:0px}50%{stroke-dasharray:100px, 200px;stroke-dashoffset:-15px}100%{stroke-dasharray:100px, 200px;stroke-dashoffset:-125px}}@keyframes spinner-circular-inner{0%{stroke-dasharray:1px, 200px;stroke-dashoffset:0px}50%{stroke-dasharray:100px, 200px;stroke-dashoffset:-15px}100%{stroke-dasharray:100px, 200px;stroke-dashoffset:-125px}}";
class Spinner {
constructor(hostRef) {
registerInstance(this, hostRef);
/**
* If `true`, the spinner's animation will be paused.
*/
this.paused = false;
}
getName() {
const spinnerName = this.name || config.get('spinner');
const mode = getIonMode$1(this);
if (spinnerName) {
return spinnerName;
}
return (mode === 'ios') ? 'lines' : 'circular';
}
render() {
const self = this;
const mode = getIonMode$1(self);
const spinnerName = self.getName();
const spinner = SPINNERS[spinnerName] || SPINNERS['lines'];
const duration = (typeof self.duration === 'number' && self.duration > 10 ? self.duration : spinner.dur);
const svgs = [];
if (spinner.circles !== undefined) {
for (let i = 0; i < spinner.circles; i++) {
svgs.push(buildCircle(spinner, duration, i, spinner.circles));
}
}
else if (spinner.lines !== undefined) {
for (let i = 0; i < spinner.lines; i++) {
svgs.push(buildLine(spinner, duration, i, spinner.lines));
}
}
return (hAsync(Host, { class: createColorClasses$1(self.color, {
[mode]: true,
[`spinner-${spinnerName}`]: true,
'spinner-paused': !!self.paused || config.getBoolean('_testing')
}), role: "progressbar", style: spinner.elmDuration ? { animationDuration: duration + 'ms' } : {} }, svgs));
}
static get style() { return spinnerCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-spinner",
"$members$": {
"color": [513],
"duration": [2],
"name": [1],
"paused": [4]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const buildCircle = (spinner, duration, index, total) => {
const data = spinner.fn(duration, index, total);
data.style['animation-duration'] = duration + 'ms';
return (hAsync("svg", { viewBox: data.viewBox || '0 0 64 64', style: data.style }, hAsync("circle", { transform: data.transform || 'translate(32,32)', cx: data.cx, cy: data.cy, r: data.r, style: spinner.elmDuration ? { animationDuration: duration + 'ms' } : {} })));
};
const buildLine = (spinner, duration, index, total) => {
const data = spinner.fn(duration, index, total);
data.style['animation-duration'] = duration + 'ms';
return (hAsync("svg", { viewBox: data.viewBox || '0 0 64 64', style: data.style }, hAsync("line", { transform: "translate(32,32)", y1: data.y1, y2: data.y2 })));
};
const splitPaneIosCss = "/*!@:host*/.sc-ion-split-pane-ios-h{--side-width:100%;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;contain:strict}/*!@::slotted(ion-menu.menu-pane-visible)*/.sc-ion-split-pane-ios-s>ion-menu.menu-pane-visible{-ms-flex:0 1 auto;flex:0 1 auto;width:var(--side-width);min-width:var(--side-min-width);max-width:var(--side-max-width)}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side),\n:host(.split-pane-visible) ::slotted(.split-pane-main)*/.sc-ion-split-pane-ios-h.split-pane-visible .sc-ion-split-pane-ios-s>.split-pane-side,.sc-ion-split-pane-ios-h.split-pane-visible .sc-ion-split-pane-ios-s>.split-pane-main{left:0;right:0;top:0;bottom:0;position:relative;-webkit-box-shadow:none !important;box-shadow:none !important;z-index:0}/*!@:host(.split-pane-visible) ::slotted(.split-pane-main)*/.sc-ion-split-pane-ios-h.split-pane-visible .sc-ion-split-pane-ios-s>.split-pane-main{-ms-flex:1;flex:1}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side:not(ion-menu)),\n:host(.split-pane-visible) ::slotted(ion-menu.split-pane-side.menu-enabled)*/.sc-ion-split-pane-ios-h.split-pane-visible .sc-ion-split-pane-ios-s>.split-pane-side:not(ion-menu),.sc-ion-split-pane-ios-h.split-pane-visible .sc-ion-split-pane-ios-s>ion-menu.split-pane-side.menu-enabled{display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0}/*!@::slotted(.split-pane-side:not(ion-menu))*/.sc-ion-split-pane-ios-s>.split-pane-side:not(ion-menu){display:none}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side)*/.sc-ion-split-pane-ios-h.split-pane-visible .sc-ion-split-pane-ios-s>.split-pane-side{-ms-flex-order:-1;order:-1}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side[side=end])*/.sc-ion-split-pane-ios-h.split-pane-visible .sc-ion-split-pane-ios-s>.split-pane-side[side=end]{-ms-flex-order:1;order:1}/*!@:host*/.sc-ion-split-pane-ios-h{--border:0.55px solid var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, #c8c7cc)));--side-min-width:270px;--side-max-width:28%}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side)*/.sc-ion-split-pane-ios-h.split-pane-visible .sc-ion-split-pane-ios-s>.split-pane-side{border-left:0;border-right:var(--border);border-top:0;border-bottom:0;min-width:var(--side-min-width);max-width:var(--side-max-width)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.split-pane-visible) ::slotted(.split-pane-side)*/.sc-ion-split-pane-ios-h.split-pane-visible .sc-ion-split-pane-ios-s>.split-pane-side{border-left:unset;border-right:unset;-webkit-border-start:0;border-inline-start:0;-webkit-border-end:var(--border);border-inline-end:var(--border)}}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side[side=end])*/.sc-ion-split-pane-ios-h.split-pane-visible .sc-ion-split-pane-ios-s>.split-pane-side[side=end]{border-left:var(--border);border-right:0;border-top:0;border-bottom:0;min-width:var(--side-min-width);max-width:var(--side-max-width)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.split-pane-visible) ::slotted(.split-pane-side[side=end])*/.sc-ion-split-pane-ios-h.split-pane-visible .sc-ion-split-pane-ios-s>.split-pane-side[side=end]{border-left:unset;border-right:unset;-webkit-border-start:var(--border);border-inline-start:var(--border);-webkit-border-end:0;border-inline-end:0}}";
const splitPaneMdCss = "/*!@:host*/.sc-ion-split-pane-md-h{--side-width:100%;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;contain:strict}/*!@::slotted(ion-menu.menu-pane-visible)*/.sc-ion-split-pane-md-s>ion-menu.menu-pane-visible{-ms-flex:0 1 auto;flex:0 1 auto;width:var(--side-width);min-width:var(--side-min-width);max-width:var(--side-max-width)}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side),\n:host(.split-pane-visible) ::slotted(.split-pane-main)*/.sc-ion-split-pane-md-h.split-pane-visible .sc-ion-split-pane-md-s>.split-pane-side,.sc-ion-split-pane-md-h.split-pane-visible .sc-ion-split-pane-md-s>.split-pane-main{left:0;right:0;top:0;bottom:0;position:relative;-webkit-box-shadow:none !important;box-shadow:none !important;z-index:0}/*!@:host(.split-pane-visible) ::slotted(.split-pane-main)*/.sc-ion-split-pane-md-h.split-pane-visible .sc-ion-split-pane-md-s>.split-pane-main{-ms-flex:1;flex:1}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side:not(ion-menu)),\n:host(.split-pane-visible) ::slotted(ion-menu.split-pane-side.menu-enabled)*/.sc-ion-split-pane-md-h.split-pane-visible .sc-ion-split-pane-md-s>.split-pane-side:not(ion-menu),.sc-ion-split-pane-md-h.split-pane-visible .sc-ion-split-pane-md-s>ion-menu.split-pane-side.menu-enabled{display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0}/*!@::slotted(.split-pane-side:not(ion-menu))*/.sc-ion-split-pane-md-s>.split-pane-side:not(ion-menu){display:none}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side)*/.sc-ion-split-pane-md-h.split-pane-visible .sc-ion-split-pane-md-s>.split-pane-side{-ms-flex-order:-1;order:-1}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side[side=end])*/.sc-ion-split-pane-md-h.split-pane-visible .sc-ion-split-pane-md-s>.split-pane-side[side=end]{-ms-flex-order:1;order:1}/*!@:host*/.sc-ion-split-pane-md-h{--border:1px solid var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.13))));--side-min-width:270px;--side-max-width:28%}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side)*/.sc-ion-split-pane-md-h.split-pane-visible .sc-ion-split-pane-md-s>.split-pane-side{border-left:0;border-right:var(--border);border-top:0;border-bottom:0;min-width:var(--side-min-width);max-width:var(--side-max-width)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.split-pane-visible) ::slotted(.split-pane-side)*/.sc-ion-split-pane-md-h.split-pane-visible .sc-ion-split-pane-md-s>.split-pane-side{border-left:unset;border-right:unset;-webkit-border-start:0;border-inline-start:0;-webkit-border-end:var(--border);border-inline-end:var(--border)}}/*!@:host(.split-pane-visible) ::slotted(.split-pane-side[side=end])*/.sc-ion-split-pane-md-h.split-pane-visible .sc-ion-split-pane-md-s>.split-pane-side[side=end]{border-left:var(--border);border-right:0;border-top:0;border-bottom:0;min-width:var(--side-min-width);max-width:var(--side-max-width)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.split-pane-visible) ::slotted(.split-pane-side[side=end])*/.sc-ion-split-pane-md-h.split-pane-visible .sc-ion-split-pane-md-s>.split-pane-side[side=end]{border-left:unset;border-right:unset;-webkit-border-start:var(--border);border-inline-start:var(--border);-webkit-border-end:0;border-inline-end:0}}";
const SPLIT_PANE_SIDE = 'split-pane-side';
const QUERY = {
'xs': '(min-width: 0px)',
'sm': '(min-width: 576px)',
'md': '(min-width: 768px)',
'lg': '(min-width: 992px)',
'xl': '(min-width: 1200px)',
'never': ''
};
class SplitPane {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionSplitPaneVisible = createEvent(this, "ionSplitPaneVisible", 7);
this.visible = false;
/**
* If `true`, the split pane will be hidden.
*/
this.disabled = false;
/**
* When the split-pane should be shown.
* Can be a CSS media query expression, or a shortcut expression.
* Can also be a boolean expression.
*/
this.when = QUERY['lg'];
}
visibleChanged(visible) {
const detail = { visible, isPane: this.isPane.bind(this) };
this.ionSplitPaneVisible.emit(detail);
}
connectedCallback() {
this.styleChildren();
this.updateState();
}
disconnectedCallback() {
if (this.rmL) {
this.rmL();
this.rmL = undefined;
}
}
updateState() {
{
return;
}
}
isPane(element) {
if (!this.visible) {
return false;
}
return element.parentElement === this.el
&& element.classList.contains(SPLIT_PANE_SIDE);
}
styleChildren() {
{
return;
}
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: {
[mode]: true,
// Used internally for styling
[`split-pane-${mode}`]: true,
'split-pane-visible': this.visible
} }, hAsync("slot", null)));
}
get el() { return getElement(this); }
static get watchers() { return {
"visible": ["visibleChanged"],
"disabled": ["updateState"],
"when": ["updateState"]
}; }
static get style() { return {
ios: splitPaneIosCss,
md: splitPaneMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-split-pane",
"$members$": {
"contentId": [513, "content-id"],
"disabled": [4],
"when": [8],
"visible": [32]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["contentId", "content-id"]]
}; }
}
const tabCss = "/*!@:host(.tab-hidden)*/.tab-hidden.sc-ion-tab-h{display:none !important}";
class Tab {
constructor(hostRef) {
registerInstance(this, hostRef);
this.loaded = false;
/** @internal */
this.active = false;
}
async componentWillLoad() {
if (this.active) {
await this.setActive();
}
}
/** Set the active component for the tab */
async setActive() {
await this.prepareLazyLoaded();
this.active = true;
}
changeActive(isActive) {
if (isActive) {
this.prepareLazyLoaded();
}
}
prepareLazyLoaded() {
if (!this.loaded && this.component != null) {
this.loaded = true;
try {
return attachComponent(this.delegate, this.el, this.component, ['ion-page']);
}
catch (e) {
console.error(e);
}
}
return Promise.resolve(undefined);
}
render() {
const { tab, active, component } = this;
return (hAsync(Host, { role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
'ion-page': component === undefined,
'tab-hidden': !active
} }, hAsync("slot", null)));
}
get el() { return getElement(this); }
static get watchers() { return {
"active": ["changeActive"]
}; }
static get style() { return tabCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-tab",
"$members$": {
"active": [1028],
"delegate": [16],
"tab": [1],
"component": [1],
"setActive": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const tabBarIosCss = "/*!@:host*/.sc-ion-tab-bar-ios-h{padding-left:var(--ion-safe-area-left);padding-right:var(--ion-safe-area-right);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:auto;padding-bottom:var(--ion-safe-area-bottom, 0);border-top:var(--border);background:var(--background);color:var(--color);text-align:center;contain:strict;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:10;-webkit-box-sizing:content-box !important;box-sizing:content-box !important}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-tab-bar-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-safe-area-left);padding-inline-start:var(--ion-safe-area-left);-webkit-padding-end:var(--ion-safe-area-right);padding-inline-end:var(--ion-safe-area-right)}}/*!@:host(.ion-color) ::slotted(ion-tab-button)*/.sc-ion-tab-bar-ios-h.ion-color .sc-ion-tab-bar-ios-s>ion-tab-button{--background-focused:var(--ion-color-shade);--color-selected:var(--ion-color-contrast)}/*!@:host(.ion-color) ::slotted(.tab-selected)*/.sc-ion-tab-bar-ios-h.ion-color .sc-ion-tab-bar-ios-s>.tab-selected{color:var(--ion-color-contrast)}/*!@:host(.ion-color),\n:host(.ion-color) ::slotted(ion-tab-button)*/.ion-color.sc-ion-tab-bar-ios-h,.sc-ion-tab-bar-ios-h.ion-color .sc-ion-tab-bar-ios-s>ion-tab-button{color:rgba(var(--ion-color-contrast-rgb), 0.7)}/*!@:host(.ion-color),\n:host(.ion-color) ::slotted(ion-tab-button)*/.ion-color.sc-ion-tab-bar-ios-h,.sc-ion-tab-bar-ios-h.ion-color .sc-ion-tab-bar-ios-s>ion-tab-button{background:var(--ion-color-base)}/*!@:host(.ion-color) ::slotted(ion-tab-button.ion-focused),\n:host(.tab-bar-translucent) ::slotted(ion-tab-button.ion-focused)*/.sc-ion-tab-bar-ios-h.ion-color .sc-ion-tab-bar-ios-s>ion-tab-button.ion-focused,.sc-ion-tab-bar-ios-h.tab-bar-translucent .sc-ion-tab-bar-ios-s>ion-tab-button.ion-focused{background:var(--background-focused)}/*!@:host(.tab-bar-translucent) ::slotted(ion-tab-button)*/.sc-ion-tab-bar-ios-h.tab-bar-translucent .sc-ion-tab-bar-ios-s>ion-tab-button{background:transparent}/*!@:host([slot=top])*/[slot=top].sc-ion-tab-bar-ios-h{padding-bottom:0;border-top:0;border-bottom:var(--border)}/*!@:host(.tab-bar-hidden)*/.tab-bar-hidden.sc-ion-tab-bar-ios-h{display:none !important}/*!@:host*/.sc-ion-tab-bar-ios-h{--background:var(--ion-tab-bar-background, var(--ion-background-color, #fff));--background-focused:var(--ion-tab-bar-background-focused, #e0e0e0);--border:0.55px solid var(--ion-tab-bar-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.2))));--color:var(--ion-tab-bar-color, var(--ion-color-step-400, #999999));--color-selected:var(--ion-tab-bar-color-selected, var(--ion-color-primary, #3880ff));height:50px}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){/*!@:host(.tab-bar-translucent)*/.tab-bar-translucent.sc-ion-tab-bar-ios-h{--background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8);-webkit-backdrop-filter:saturate(210%) blur(20px);backdrop-filter:saturate(210%) blur(20px)}/*!@:host(.ion-color.tab-bar-translucent)*/.ion-color.tab-bar-translucent.sc-ion-tab-bar-ios-h{background:rgba(var(--ion-color-base-rgb), 0.8)}/*!@:host(.tab-bar-translucent) ::slotted(ion-tab-button.ion-focused)*/.sc-ion-tab-bar-ios-h.tab-bar-translucent .sc-ion-tab-bar-ios-s>ion-tab-button.ion-focused{background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.6)}}";
const tabBarMdCss = "/*!@:host*/.sc-ion-tab-bar-md-h{padding-left:var(--ion-safe-area-left);padding-right:var(--ion-safe-area-right);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:auto;padding-bottom:var(--ion-safe-area-bottom, 0);border-top:var(--border);background:var(--background);color:var(--color);text-align:center;contain:strict;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:10;-webkit-box-sizing:content-box !important;box-sizing:content-box !important}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-tab-bar-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-safe-area-left);padding-inline-start:var(--ion-safe-area-left);-webkit-padding-end:var(--ion-safe-area-right);padding-inline-end:var(--ion-safe-area-right)}}/*!@:host(.ion-color) ::slotted(ion-tab-button)*/.sc-ion-tab-bar-md-h.ion-color .sc-ion-tab-bar-md-s>ion-tab-button{--background-focused:var(--ion-color-shade);--color-selected:var(--ion-color-contrast)}/*!@:host(.ion-color) ::slotted(.tab-selected)*/.sc-ion-tab-bar-md-h.ion-color .sc-ion-tab-bar-md-s>.tab-selected{color:var(--ion-color-contrast)}/*!@:host(.ion-color),\n:host(.ion-color) ::slotted(ion-tab-button)*/.ion-color.sc-ion-tab-bar-md-h,.sc-ion-tab-bar-md-h.ion-color .sc-ion-tab-bar-md-s>ion-tab-button{color:rgba(var(--ion-color-contrast-rgb), 0.7)}/*!@:host(.ion-color),\n:host(.ion-color) ::slotted(ion-tab-button)*/.ion-color.sc-ion-tab-bar-md-h,.sc-ion-tab-bar-md-h.ion-color .sc-ion-tab-bar-md-s>ion-tab-button{background:var(--ion-color-base)}/*!@:host(.ion-color) ::slotted(ion-tab-button.ion-focused),\n:host(.tab-bar-translucent) ::slotted(ion-tab-button.ion-focused)*/.sc-ion-tab-bar-md-h.ion-color .sc-ion-tab-bar-md-s>ion-tab-button.ion-focused,.sc-ion-tab-bar-md-h.tab-bar-translucent .sc-ion-tab-bar-md-s>ion-tab-button.ion-focused{background:var(--background-focused)}/*!@:host(.tab-bar-translucent) ::slotted(ion-tab-button)*/.sc-ion-tab-bar-md-h.tab-bar-translucent .sc-ion-tab-bar-md-s>ion-tab-button{background:transparent}/*!@:host([slot=top])*/[slot=top].sc-ion-tab-bar-md-h{padding-bottom:0;border-top:0;border-bottom:var(--border)}/*!@:host(.tab-bar-hidden)*/.tab-bar-hidden.sc-ion-tab-bar-md-h{display:none !important}/*!@:host*/.sc-ion-tab-bar-md-h{--background:var(--ion-tab-bar-background, var(--ion-background-color, #fff));--background-focused:var(--ion-tab-bar-background-focused, #e0e0e0);--border:1px solid var(--ion-tab-bar-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.07))));--color:var(--ion-tab-bar-color, var(--ion-color-step-600, #666666));--color-selected:var(--ion-tab-bar-color-selected, var(--ion-color-primary, #3880ff));height:56px}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class TabBar {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionTabBarChanged = createEvent(this, "ionTabBarChanged", 7);
this.keyboardVisible = false;
/**
* If `true`, the tab bar will be translucent.
* Only applies when the mode is `"ios"` and the device supports
* [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
*/
this.translucent = false;
}
selectedTabChanged() {
if (this.selectedTab !== undefined) {
this.ionTabBarChanged.emit({
tab: this.selectedTab
});
}
}
componentWillLoad() {
this.selectedTabChanged();
}
connectedCallback() {
if (typeof window !== 'undefined') {
this.keyboardWillShowHandler = () => {
if (this.el.getAttribute('slot') !== 'top') {
this.keyboardVisible = true;
}
};
this.keyboardWillHideHandler = () => {
setTimeout(() => this.keyboardVisible = false, 50);
};
window.addEventListener('keyboardWillShow', this.keyboardWillShowHandler);
window.addEventListener('keyboardWillHide', this.keyboardWillHideHandler);
}
}
disconnectedCallback() {
if (typeof window !== 'undefined') {
window.removeEventListener('keyboardWillShow', this.keyboardWillShowHandler);
window.removeEventListener('keyboardWillHide', this.keyboardWillHideHandler);
this.keyboardWillShowHandler = this.keyboardWillHideHandler = undefined;
}
}
render() {
const { color, translucent, keyboardVisible } = this;
const mode = getIonMode$1(this);
return (hAsync(Host, { role: "tablist", "aria-hidden": keyboardVisible ? 'true' : null, class: createColorClasses$1(color, {
[mode]: true,
'tab-bar-translucent': translucent,
'tab-bar-hidden': keyboardVisible,
}) }, hAsync("slot", null)));
}
get el() { return getElement(this); }
static get watchers() { return {
"selectedTab": ["selectedTabChanged"]
}; }
static get style() { return {
ios: tabBarIosCss,
md: tabBarMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-tab-bar",
"$members$": {
"color": [513],
"selectedTab": [1, "selected-tab"],
"translucent": [4],
"keyboardVisible": [32]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const tabButtonIosCss = "/*!@:host*/.sc-ion-tab-button-ios-h{--ripple-color:var(--color-selected);--background-focused-opacity:1;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:100%;outline:none;background:var(--background);color:var(--color)}/*!@.button-native*/.button-native.sc-ion-tab-button-ios{border-radius:inherit;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:100%;height:100%;border:0;outline:none;background:transparent;text-decoration:none;cursor:pointer;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-user-drag:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-tab-button-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.button-native::after*/.button-native.sc-ion-tab-button-ios::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}/*!@.button-inner*/.button-inner.sc-ion-tab-button-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:inherit;flex-flow:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:100%;height:100%;z-index:1}/*!@:host(.ion-focused) .button-native*/.ion-focused.sc-ion-tab-button-ios-h .button-native.sc-ion-tab-button-ios{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-tab-button-ios-h .button-native.sc-ion-tab-button-ios::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){/*!@a:hover*/a.sc-ion-tab-button-ios:hover{color:var(--color-selected)}}/*!@:host(.tab-selected)*/.tab-selected.sc-ion-tab-button-ios-h{color:var(--color-selected)}/*!@:host(.tab-hidden)*/.tab-hidden.sc-ion-tab-button-ios-h{display:none !important}/*!@:host(.tab-disabled)*/.tab-disabled.sc-ion-tab-button-ios-h{pointer-events:none;opacity:0.4}/*!@::slotted(ion-label),\n::slotted(ion-icon)*/.sc-ion-tab-button-ios-s>ion-label,.sc-ion-tab-button-ios-s>ion-icon{display:block;-ms-flex-item-align:center;align-self:center;max-width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}/*!@::slotted(ion-label)*/.sc-ion-tab-button-ios-s>ion-label{-ms-flex-order:0;order:0}/*!@::slotted(ion-icon)*/.sc-ion-tab-button-ios-s>ion-icon{-ms-flex-order:-1;order:-1;height:1em}/*!@:host(.tab-has-label-only) ::slotted(ion-label)*/.sc-ion-tab-button-ios-h.tab-has-label-only .sc-ion-tab-button-ios-s>ion-label{white-space:normal}/*!@::slotted(ion-badge)*/.sc-ion-tab-button-ios-s>ion-badge{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute;z-index:1}/*!@:host(.tab-layout-icon-start)*/.tab-layout-icon-start.sc-ion-tab-button-ios-h{-ms-flex-direction:row;flex-direction:row}/*!@:host(.tab-layout-icon-end)*/.tab-layout-icon-end.sc-ion-tab-button-ios-h{-ms-flex-direction:row-reverse;flex-direction:row-reverse}/*!@:host(.tab-layout-icon-bottom)*/.tab-layout-icon-bottom.sc-ion-tab-button-ios-h{-ms-flex-direction:column-reverse;flex-direction:column-reverse}/*!@:host(.tab-layout-icon-hide) ::slotted(ion-icon)*/.sc-ion-tab-button-ios-h.tab-layout-icon-hide .sc-ion-tab-button-ios-s>ion-icon{display:none}/*!@:host(.tab-layout-label-hide) ::slotted(ion-label)*/.sc-ion-tab-button-ios-h.tab-layout-label-hide .sc-ion-tab-button-ios-s>ion-label{display:none}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-tab-button-ios{color:var(--ripple-color)}/*!@:host*/.sc-ion-tab-button-ios-h{--padding-top:0;--padding-end:2px;--padding-bottom:0;--padding-start:2px;max-width:240px;font-size:10px}/*!@::slotted(ion-badge)*/.sc-ion-tab-button-ios-s>ion-badge{padding-left:6px;padding-right:6px;padding-top:1px;padding-bottom:1px;left:calc(50% + 6px);top:4px;height:auto;font-size:12px;line-height:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-badge)*/.sc-ion-tab-button-ios-s>ion-badge{padding-left:unset;padding-right:unset;-webkit-padding-start:6px;padding-inline-start:6px;-webkit-padding-end:6px;padding-inline-end:6px}}/*!@[dir=rtl] ::slotted(ion-badge), :host-context([dir=rtl]) ::slotted(ion-badge)*/[dir=rtl] .sc-ion-tab-button-ios-s>ion-badge,.sc-ion-tab-button-ios-h[dir=rtl] .sc-ion-tab-button-ios-s>ion-badge,[dir=rtl] .sc-ion-tab-button-ios-h .sc-ion-tab-button-ios-s>ion-badge{left:unset;right:unset;right:calc(50% + 6px)}/*!@::slotted(ion-icon)*/.sc-ion-tab-button-ios-s>ion-icon{margin-top:2px;margin-bottom:2px;font-size:30px}/*!@::slotted(ion-icon::before)*/.sc-ion-tab-button-ios-s>ion-icon::before{vertical-align:top}/*!@::slotted(ion-label)*/.sc-ion-tab-button-ios-s>ion-label{margin-top:0;margin-bottom:1px;min-height:11px;font-weight:500}/*!@:host(.tab-has-label-only) ::slotted(ion-label)*/.sc-ion-tab-button-ios-h.tab-has-label-only .sc-ion-tab-button-ios-s>ion-label{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:12px;font-size:14px;line-height:1.1}/*!@:host(.tab-layout-icon-end) ::slotted(ion-label),\n:host(.tab-layout-icon-start) ::slotted(ion-label),\n:host(.tab-layout-icon-hide) ::slotted(ion-label)*/.sc-ion-tab-button-ios-h.tab-layout-icon-end .sc-ion-tab-button-ios-s>ion-label,.sc-ion-tab-button-ios-h.tab-layout-icon-start .sc-ion-tab-button-ios-s>ion-label,.sc-ion-tab-button-ios-h.tab-layout-icon-hide .sc-ion-tab-button-ios-s>ion-label{margin-top:2px;margin-bottom:2px;font-size:14px;line-height:1.1}/*!@:host(.tab-layout-icon-end) ::slotted(ion-icon),\n:host(.tab-layout-icon-start) ::slotted(ion-icon)*/.sc-ion-tab-button-ios-h.tab-layout-icon-end .sc-ion-tab-button-ios-s>ion-icon,.sc-ion-tab-button-ios-h.tab-layout-icon-start .sc-ion-tab-button-ios-s>ion-icon{min-width:24px;height:26px;margin-top:2px;margin-bottom:1px;font-size:24px}/*!@:host(.tab-layout-icon-bottom) ::slotted(ion-badge)*/.sc-ion-tab-button-ios-h.tab-layout-icon-bottom .sc-ion-tab-button-ios-s>ion-badge{left:calc(50% + 12px)}/*!@:host-context([dir=rtl]):host(.tab-layout-icon-bottom) ::slotted(ion-badge), :host-context([dir=rtl]).tab-layout-icon-bottom ::slotted(ion-badge)*/.sc-ion-tab-button-ios-h[dir=rtl].sc-ion-tab-button-ios-h.tab-layout-icon-bottom .sc-ion-tab-button-ios-s>ion-badge,[dir=rtl] .sc-ion-tab-button-ios-h.sc-ion-tab-button-ios-h.tab-layout-icon-bottom .sc-ion-tab-button-ios-s>ion-badge,.sc-ion-tab-button-ios-h[dir=rtl].tab-layout-icon-bottom .sc-ion-tab-button-ios-s>ion-badge,[dir=rtl] .sc-ion-tab-button-ios-h.tab-layout-icon-bottom .sc-ion-tab-button-ios-s>ion-badge{left:unset;right:unset;right:calc(50% + 12px)}/*!@:host(.tab-layout-icon-bottom) ::slotted(ion-icon)*/.sc-ion-tab-button-ios-h.tab-layout-icon-bottom .sc-ion-tab-button-ios-s>ion-icon{margin-top:0;margin-bottom:1px}/*!@:host(.tab-layout-icon-bottom) ::slotted(ion-label)*/.sc-ion-tab-button-ios-h.tab-layout-icon-bottom .sc-ion-tab-button-ios-s>ion-label{margin-top:4px}/*!@:host(.tab-layout-icon-start) ::slotted(ion-badge),\n:host(.tab-layout-icon-end) ::slotted(ion-badge)*/.sc-ion-tab-button-ios-h.tab-layout-icon-start .sc-ion-tab-button-ios-s>ion-badge,.sc-ion-tab-button-ios-h.tab-layout-icon-end .sc-ion-tab-button-ios-s>ion-badge{left:calc(50% + 35px);top:10px}/*!@:host-context([dir=rtl]):host(.tab-layout-icon-start) ::slotted(ion-badge), :host-context([dir=rtl]).tab-layout-icon-start ::slotted(ion-badge), :host-context([dir=rtl]):host(.tab-layout-icon-end) ::slotted(ion-badge), :host-context([dir=rtl]).tab-layout-icon-end ::slotted(ion-badge)*/.sc-ion-tab-button-ios-h[dir=rtl].sc-ion-tab-button-ios-h.tab-layout-icon-start .sc-ion-tab-button-ios-s>ion-badge,[dir=rtl] .sc-ion-tab-button-ios-h.sc-ion-tab-button-ios-h.tab-layout-icon-start .sc-ion-tab-button-ios-s>ion-badge,.sc-ion-tab-button-ios-h[dir=rtl].tab-layout-icon-start .sc-ion-tab-button-ios-s>ion-badge,[dir=rtl] .sc-ion-tab-button-ios-h.tab-layout-icon-start .sc-ion-tab-button-ios-s>ion-badge,.sc-ion-tab-button-ios-h[dir=rtl].sc-ion-tab-button-ios-h.tab-layout-icon-end .sc-ion-tab-button-ios-s>ion-badge,[dir=rtl] .sc-ion-tab-button-ios-h.sc-ion-tab-button-ios-h.tab-layout-icon-end .sc-ion-tab-button-ios-s>ion-badge,.sc-ion-tab-button-ios-h[dir=rtl].tab-layout-icon-end .sc-ion-tab-button-ios-s>ion-badge,[dir=rtl] .sc-ion-tab-button-ios-h.tab-layout-icon-end .sc-ion-tab-button-ios-s>ion-badge{left:unset;right:unset;right:calc(50% + 35px)}/*!@:host(.tab-layout-icon-hide) ::slotted(ion-badge),\n:host(.tab-has-label-only) ::slotted(ion-badge)*/.sc-ion-tab-button-ios-h.tab-layout-icon-hide .sc-ion-tab-button-ios-s>ion-badge,.sc-ion-tab-button-ios-h.tab-has-label-only .sc-ion-tab-button-ios-s>ion-badge{left:calc(50% + 30px);top:10px}/*!@:host-context([dir=rtl]):host(.tab-layout-icon-hide) ::slotted(ion-badge), :host-context([dir=rtl]).tab-layout-icon-hide ::slotted(ion-badge), :host-context([dir=rtl]):host(.tab-has-label-only) ::slotted(ion-badge), :host-context([dir=rtl]).tab-has-label-only ::slotted(ion-badge)*/.sc-ion-tab-button-ios-h[dir=rtl].sc-ion-tab-button-ios-h.tab-layout-icon-hide .sc-ion-tab-button-ios-s>ion-badge,[dir=rtl] .sc-ion-tab-button-ios-h.sc-ion-tab-button-ios-h.tab-layout-icon-hide .sc-ion-tab-button-ios-s>ion-badge,.sc-ion-tab-button-ios-h[dir=rtl].tab-layout-icon-hide .sc-ion-tab-button-ios-s>ion-badge,[dir=rtl] .sc-ion-tab-button-ios-h.tab-layout-icon-hide .sc-ion-tab-button-ios-s>ion-badge,.sc-ion-tab-button-ios-h[dir=rtl].sc-ion-tab-button-ios-h.tab-has-label-only .sc-ion-tab-button-ios-s>ion-badge,[dir=rtl] .sc-ion-tab-button-ios-h.sc-ion-tab-button-ios-h.tab-has-label-only .sc-ion-tab-button-ios-s>ion-badge,.sc-ion-tab-button-ios-h[dir=rtl].tab-has-label-only .sc-ion-tab-button-ios-s>ion-badge,[dir=rtl] .sc-ion-tab-button-ios-h.tab-has-label-only .sc-ion-tab-button-ios-s>ion-badge{left:unset;right:unset;right:calc(50% + 30px)}/*!@:host(.tab-layout-label-hide) ::slotted(ion-badge),\n:host(.tab-has-icon-only) ::slotted(ion-badge)*/.sc-ion-tab-button-ios-h.tab-layout-label-hide .sc-ion-tab-button-ios-s>ion-badge,.sc-ion-tab-button-ios-h.tab-has-icon-only .sc-ion-tab-button-ios-s>ion-badge{top:10px}/*!@:host(.tab-layout-label-hide) ::slotted(ion-icon)*/.sc-ion-tab-button-ios-h.tab-layout-label-hide .sc-ion-tab-button-ios-s>ion-icon{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}";
const tabButtonMdCss = "/*!@:host*/.sc-ion-tab-button-md-h{--ripple-color:var(--color-selected);--background-focused-opacity:1;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:100%;outline:none;background:var(--background);color:var(--color)}/*!@.button-native*/.button-native.sc-ion-tab-button-md{border-radius:inherit;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:100%;height:100%;border:0;outline:none;background:transparent;text-decoration:none;cursor:pointer;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-user-drag:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.button-native*/.button-native.sc-ion-tab-button-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.button-native::after*/.button-native.sc-ion-tab-button-md::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}/*!@.button-inner*/.button-inner.sc-ion-tab-button-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:inherit;flex-flow:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:100%;height:100%;z-index:1}/*!@:host(.ion-focused) .button-native*/.ion-focused.sc-ion-tab-button-md-h .button-native.sc-ion-tab-button-md{color:var(--color-focused)}/*!@:host(.ion-focused) .button-native::after*/.ion-focused.sc-ion-tab-button-md-h .button-native.sc-ion-tab-button-md::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){/*!@a:hover*/a.sc-ion-tab-button-md:hover{color:var(--color-selected)}}/*!@:host(.tab-selected)*/.tab-selected.sc-ion-tab-button-md-h{color:var(--color-selected)}/*!@:host(.tab-hidden)*/.tab-hidden.sc-ion-tab-button-md-h{display:none !important}/*!@:host(.tab-disabled)*/.tab-disabled.sc-ion-tab-button-md-h{pointer-events:none;opacity:0.4}/*!@::slotted(ion-label),\n::slotted(ion-icon)*/.sc-ion-tab-button-md-s>ion-label,.sc-ion-tab-button-md-s>ion-icon{display:block;-ms-flex-item-align:center;align-self:center;max-width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}/*!@::slotted(ion-label)*/.sc-ion-tab-button-md-s>ion-label{-ms-flex-order:0;order:0}/*!@::slotted(ion-icon)*/.sc-ion-tab-button-md-s>ion-icon{-ms-flex-order:-1;order:-1;height:1em}/*!@:host(.tab-has-label-only) ::slotted(ion-label)*/.sc-ion-tab-button-md-h.tab-has-label-only .sc-ion-tab-button-md-s>ion-label{white-space:normal}/*!@::slotted(ion-badge)*/.sc-ion-tab-button-md-s>ion-badge{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute;z-index:1}/*!@:host(.tab-layout-icon-start)*/.tab-layout-icon-start.sc-ion-tab-button-md-h{-ms-flex-direction:row;flex-direction:row}/*!@:host(.tab-layout-icon-end)*/.tab-layout-icon-end.sc-ion-tab-button-md-h{-ms-flex-direction:row-reverse;flex-direction:row-reverse}/*!@:host(.tab-layout-icon-bottom)*/.tab-layout-icon-bottom.sc-ion-tab-button-md-h{-ms-flex-direction:column-reverse;flex-direction:column-reverse}/*!@:host(.tab-layout-icon-hide) ::slotted(ion-icon)*/.sc-ion-tab-button-md-h.tab-layout-icon-hide .sc-ion-tab-button-md-s>ion-icon{display:none}/*!@:host(.tab-layout-label-hide) ::slotted(ion-label)*/.sc-ion-tab-button-md-h.tab-layout-label-hide .sc-ion-tab-button-md-s>ion-label{display:none}/*!@ion-ripple-effect*/ion-ripple-effect.sc-ion-tab-button-md{color:var(--ripple-color)}/*!@:host*/.sc-ion-tab-button-md-h{--padding-top:0;--padding-end:12px;--padding-bottom:0;--padding-start:12px;max-width:168px;font-size:12px;font-weight:normal;letter-spacing:0.03em}/*!@::slotted(ion-label)*/.sc-ion-tab-button-md-s>ion-label{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;text-transform:none}/*!@::slotted(ion-icon)*/.sc-ion-tab-button-md-s>ion-icon{margin-left:0;margin-right:0;margin-top:16px;margin-bottom:16px;-webkit-transform-origin:center center;transform-origin:center center;font-size:22px}/*!@[dir=rtl] ::slotted(ion-icon), :host-context([dir=rtl]) ::slotted(ion-icon)*/[dir=rtl] .sc-ion-tab-button-md-s>ion-icon,.sc-ion-tab-button-md-h[dir=rtl] .sc-ion-tab-button-md-s>ion-icon,[dir=rtl] .sc-ion-tab-button-md-h .sc-ion-tab-button-md-s>ion-icon{-webkit-transform-origin:calc(100% - center) center;transform-origin:calc(100% - center) center}/*!@::slotted(ion-badge)*/.sc-ion-tab-button-md-s>ion-badge{border-radius:8px;padding-left:2px;padding-right:2px;padding-top:3px;padding-bottom:2px;left:calc(50% + 6px);top:8px;min-width:12px;font-size:8px;font-weight:normal}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(ion-badge)*/.sc-ion-tab-button-md-s>ion-badge{padding-left:unset;padding-right:unset;-webkit-padding-start:2px;padding-inline-start:2px;-webkit-padding-end:2px;padding-inline-end:2px}}/*!@[dir=rtl] ::slotted(ion-badge), :host-context([dir=rtl]) ::slotted(ion-badge)*/[dir=rtl] .sc-ion-tab-button-md-s>ion-badge,.sc-ion-tab-button-md-h[dir=rtl] .sc-ion-tab-button-md-s>ion-badge,[dir=rtl] .sc-ion-tab-button-md-h .sc-ion-tab-button-md-s>ion-badge{left:unset;right:unset;right:calc(50% + 6px)}/*!@::slotted(ion-badge:empty)*/.sc-ion-tab-button-md-s>ion-badge:empty{display:block;min-width:8px;height:8px}/*!@:host(.tab-layout-icon-top) ::slotted(ion-icon)*/.sc-ion-tab-button-md-h.tab-layout-icon-top .sc-ion-tab-button-md-s>ion-icon{margin-top:6px;margin-bottom:2px}/*!@:host(.tab-layout-icon-top) ::slotted(ion-label)*/.sc-ion-tab-button-md-h.tab-layout-icon-top .sc-ion-tab-button-md-s>ion-label{margin-top:0;margin-bottom:6px}/*!@:host(.tab-layout-icon-bottom) ::slotted(ion-badge)*/.sc-ion-tab-button-md-h.tab-layout-icon-bottom .sc-ion-tab-button-md-s>ion-badge{left:70%;top:8px}/*!@:host-context([dir=rtl]):host(.tab-layout-icon-bottom) ::slotted(ion-badge), :host-context([dir=rtl]).tab-layout-icon-bottom ::slotted(ion-badge)*/.sc-ion-tab-button-md-h[dir=rtl].sc-ion-tab-button-md-h.tab-layout-icon-bottom .sc-ion-tab-button-md-s>ion-badge,[dir=rtl] .sc-ion-tab-button-md-h.sc-ion-tab-button-md-h.tab-layout-icon-bottom .sc-ion-tab-button-md-s>ion-badge,.sc-ion-tab-button-md-h[dir=rtl].tab-layout-icon-bottom .sc-ion-tab-button-md-s>ion-badge,[dir=rtl] .sc-ion-tab-button-md-h.tab-layout-icon-bottom .sc-ion-tab-button-md-s>ion-badge{left:unset;right:unset;right:70%}/*!@:host(.tab-layout-icon-bottom) ::slotted(ion-icon)*/.sc-ion-tab-button-md-h.tab-layout-icon-bottom .sc-ion-tab-button-md-s>ion-icon{margin-top:0;margin-bottom:6px}/*!@:host(.tab-layout-icon-bottom) ::slotted(ion-label)*/.sc-ion-tab-button-md-h.tab-layout-icon-bottom .sc-ion-tab-button-md-s>ion-label{margin-top:6px;margin-bottom:0}/*!@:host(.tab-layout-icon-start) ::slotted(ion-badge),\n:host(.tab-layout-icon-end) ::slotted(ion-badge)*/.sc-ion-tab-button-md-h.tab-layout-icon-start .sc-ion-tab-button-md-s>ion-badge,.sc-ion-tab-button-md-h.tab-layout-icon-end .sc-ion-tab-button-md-s>ion-badge{left:80%;top:16px}/*!@:host-context([dir=rtl]):host(.tab-layout-icon-start) ::slotted(ion-badge), :host-context([dir=rtl]).tab-layout-icon-start ::slotted(ion-badge), :host-context([dir=rtl]):host(.tab-layout-icon-end) ::slotted(ion-badge), :host-context([dir=rtl]).tab-layout-icon-end ::slotted(ion-badge)*/.sc-ion-tab-button-md-h[dir=rtl].sc-ion-tab-button-md-h.tab-layout-icon-start .sc-ion-tab-button-md-s>ion-badge,[dir=rtl] .sc-ion-tab-button-md-h.sc-ion-tab-button-md-h.tab-layout-icon-start .sc-ion-tab-button-md-s>ion-badge,.sc-ion-tab-button-md-h[dir=rtl].tab-layout-icon-start .sc-ion-tab-button-md-s>ion-badge,[dir=rtl] .sc-ion-tab-button-md-h.tab-layout-icon-start .sc-ion-tab-button-md-s>ion-badge,.sc-ion-tab-button-md-h[dir=rtl].sc-ion-tab-button-md-h.tab-layout-icon-end .sc-ion-tab-button-md-s>ion-badge,[dir=rtl] .sc-ion-tab-button-md-h.sc-ion-tab-button-md-h.tab-layout-icon-end .sc-ion-tab-button-md-s>ion-badge,.sc-ion-tab-button-md-h[dir=rtl].tab-layout-icon-end .sc-ion-tab-button-md-s>ion-badge,[dir=rtl] .sc-ion-tab-button-md-h.tab-layout-icon-end .sc-ion-tab-button-md-s>ion-badge{left:unset;right:unset;right:80%}/*!@:host(.tab-layout-icon-start) ::slotted(ion-icon)*/.sc-ion-tab-button-md-h.tab-layout-icon-start .sc-ion-tab-button-md-s>ion-icon{margin-right:6px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.tab-layout-icon-start) ::slotted(ion-icon)*/.sc-ion-tab-button-md-h.tab-layout-icon-start .sc-ion-tab-button-md-s>ion-icon{margin-right:unset;-webkit-margin-end:6px;margin-inline-end:6px}}/*!@:host(.tab-layout-icon-end) ::slotted(ion-icon)*/.sc-ion-tab-button-md-h.tab-layout-icon-end .sc-ion-tab-button-md-s>ion-icon{margin-left:6px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.tab-layout-icon-end) ::slotted(ion-icon)*/.sc-ion-tab-button-md-h.tab-layout-icon-end .sc-ion-tab-button-md-s>ion-icon{margin-left:unset;-webkit-margin-start:6px;margin-inline-start:6px}}/*!@:host(.tab-layout-icon-hide) ::slotted(ion-badge),\n:host(.tab-has-label-only) ::slotted(ion-badge)*/.sc-ion-tab-button-md-h.tab-layout-icon-hide .sc-ion-tab-button-md-s>ion-badge,.sc-ion-tab-button-md-h.tab-has-label-only .sc-ion-tab-button-md-s>ion-badge{left:70%;top:16px}/*!@:host-context([dir=rtl]):host(.tab-layout-icon-hide) ::slotted(ion-badge), :host-context([dir=rtl]).tab-layout-icon-hide ::slotted(ion-badge), :host-context([dir=rtl]):host(.tab-has-label-only) ::slotted(ion-badge), :host-context([dir=rtl]).tab-has-label-only ::slotted(ion-badge)*/.sc-ion-tab-button-md-h[dir=rtl].sc-ion-tab-button-md-h.tab-layout-icon-hide .sc-ion-tab-button-md-s>ion-badge,[dir=rtl] .sc-ion-tab-button-md-h.sc-ion-tab-button-md-h.tab-layout-icon-hide .sc-ion-tab-button-md-s>ion-badge,.sc-ion-tab-button-md-h[dir=rtl].tab-layout-icon-hide .sc-ion-tab-button-md-s>ion-badge,[dir=rtl] .sc-ion-tab-button-md-h.tab-layout-icon-hide .sc-ion-tab-button-md-s>ion-badge,.sc-ion-tab-button-md-h[dir=rtl].sc-ion-tab-button-md-h.tab-has-label-only .sc-ion-tab-button-md-s>ion-badge,[dir=rtl] .sc-ion-tab-button-md-h.sc-ion-tab-button-md-h.tab-has-label-only .sc-ion-tab-button-md-s>ion-badge,.sc-ion-tab-button-md-h[dir=rtl].tab-has-label-only .sc-ion-tab-button-md-s>ion-badge,[dir=rtl] .sc-ion-tab-button-md-h.tab-has-label-only .sc-ion-tab-button-md-s>ion-badge{left:unset;right:unset;right:70%}/*!@:host(.tab-layout-icon-hide) ::slotted(ion-label),\n:host(.tab-has-label-only) ::slotted(ion-label)*/.sc-ion-tab-button-md-h.tab-layout-icon-hide .sc-ion-tab-button-md-s>ion-label,.sc-ion-tab-button-md-h.tab-has-label-only .sc-ion-tab-button-md-s>ion-label{margin-top:0;margin-bottom:0}/*!@:host(.tab-layout-label-hide) ::slotted(ion-badge),\n:host(.tab-has-icon-only) ::slotted(ion-badge)*/.sc-ion-tab-button-md-h.tab-layout-label-hide .sc-ion-tab-button-md-s>ion-badge,.sc-ion-tab-button-md-h.tab-has-icon-only .sc-ion-tab-button-md-s>ion-badge{top:16px}/*!@:host(.tab-layout-label-hide) ::slotted(ion-icon),\n:host(.tab-has-icon-only) ::slotted(ion-icon)*/.sc-ion-tab-button-md-h.tab-layout-label-hide .sc-ion-tab-button-md-s>ion-icon,.sc-ion-tab-button-md-h.tab-has-icon-only .sc-ion-tab-button-md-s>ion-icon{margin-top:0;margin-bottom:0;font-size:24px}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part native - The native HTML anchor element that wraps all child elements.
*/
class TabButton {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionTabButtonClick = createEvent(this, "ionTabButtonClick", 7);
/**
* If `true`, the user cannot interact with the tab button.
*/
this.disabled = false;
/**
* The selected tab component
*/
this.selected = false;
this.onKeyUp = (ev) => {
if (ev.key === 'Enter' || ev.key === ' ') {
this.selectTab(ev);
}
};
this.onClick = (ev) => {
this.selectTab(ev);
};
}
onTabBarChanged(ev) {
const dispatchedFrom = ev.target;
const parent = this.el.parentElement;
if ((ev.composedPath && ev.composedPath().includes(parent)) || (dispatchedFrom && dispatchedFrom.contains(this.el))) {
this.selected = this.tab === ev.detail.tab;
}
}
componentWillLoad() {
if (this.layout === undefined) {
this.layout = config.get('tabButtonLayout', 'icon-top');
}
}
selectTab(ev) {
if (this.tab !== undefined) {
if (!this.disabled) {
this.ionTabButtonClick.emit({
tab: this.tab,
href: this.href,
selected: this.selected
});
}
ev.preventDefault();
}
}
get hasLabel() {
return !!this.el.querySelector('ion-label');
}
get hasIcon() {
return !!this.el.querySelector('ion-icon');
}
get tabIndex() {
if (this.disabled) {
return -1;
}
const hasTabIndex = this.el.hasAttribute('tabindex');
if (hasTabIndex) {
return this.el.getAttribute('tabindex');
}
return 0;
}
render() {
const { disabled, hasIcon, hasLabel, tabIndex, href, rel, target, layout, selected, tab } = this;
const mode = getIonMode$1(this);
const attrs = {
download: this.download,
href,
rel,
target
};
return (hAsync(Host, { onClick: this.onClick, onKeyup: this.onKeyUp, role: "tab", tabindex: tabIndex, "aria-selected": selected ? 'true' : null, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
[mode]: true,
'tab-selected': selected,
'tab-disabled': disabled,
'tab-has-label': hasLabel,
'tab-has-icon': hasIcon,
'tab-has-label-only': hasLabel && !hasIcon,
'tab-has-icon-only': hasIcon && !hasLabel,
[`tab-layout-${layout}`]: true,
'ion-activatable': true,
'ion-selectable': true,
'ion-focusable': true
} }, hAsync("a", Object.assign({}, attrs, { tabIndex: -1, class: "button-native", part: "native" }), hAsync("span", { class: "button-inner" }, hAsync("slot", null)), mode === 'md' && hAsync("ion-ripple-effect", { type: "unbounded" }))));
}
get el() { return getElement(this); }
static get style() { return {
ios: tabButtonIosCss,
md: tabButtonMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-tab-button",
"$members$": {
"disabled": [4],
"download": [1],
"href": [1],
"rel": [1],
"layout": [1025],
"selected": [1028],
"tab": [1],
"target": [1]
},
"$listeners$": [[8, "ionTabBarChanged", "onTabBarChanged"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const tabsCss = "/*!@:host*/.sc-ion-tabs-h{left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;width:100%;height:100%;contain:layout size style;z-index:0}/*!@.tabs-inner*/.tabs-inner.sc-ion-tabs{position:relative;-ms-flex:1;flex:1;contain:layout size style}";
/**
* @slot - Content is placed between the named slots if provided without a slot.
* @slot top - Content is placed at the top of the screen.
* @slot bottom - Content is placed at the bottom of the screen.
*/
class Tabs {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionNavWillLoad = createEvent(this, "ionNavWillLoad", 7);
this.ionTabsWillChange = createEvent(this, "ionTabsWillChange", 3);
this.ionTabsDidChange = createEvent(this, "ionTabsDidChange", 3);
this.transitioning = false;
/** @internal */
this.useRouter = false;
this.onTabClicked = (ev) => {
const { href, tab } = ev.detail;
if (this.useRouter && href !== undefined) {
const router = document.querySelector('ion-router');
if (router) {
router.push(href);
}
}
else {
this.select(tab);
}
};
}
async componentWillLoad() {
if (!this.useRouter) {
this.useRouter = !!document.querySelector('ion-router') && !this.el.closest('[no-router]');
}
if (!this.useRouter) {
const tabs = this.tabs;
if (tabs.length > 0) {
await this.select(tabs[0]);
}
}
this.ionNavWillLoad.emit();
}
componentWillRender() {
const tabBar = this.el.querySelector('ion-tab-bar');
if (tabBar) {
const tab = this.selectedTab ? this.selectedTab.tab : undefined;
tabBar.selectedTab = tab;
}
}
/**
* Select a tab by the value of its `tab` property or an element reference.
*
* @param tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property.
*/
async select(tab) {
const selectedTab = getTab(this.tabs, tab);
if (!this.shouldSwitch(selectedTab)) {
return false;
}
await this.setActive(selectedTab);
await this.notifyRouter();
this.tabSwitch();
return true;
}
/**
* Get a specific tab by the value of its `tab` property or an element reference.
*
* @param tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property.
*/
async getTab(tab) {
return getTab(this.tabs, tab);
}
/**
* Get the currently selected tab.
*/
getSelected() {
return Promise.resolve(this.selectedTab ? this.selectedTab.tab : undefined);
}
/** @internal */
async setRouteId(id) {
const selectedTab = getTab(this.tabs, id);
if (!this.shouldSwitch(selectedTab)) {
return { changed: false, element: this.selectedTab };
}
await this.setActive(selectedTab);
return {
changed: true,
element: this.selectedTab,
markVisible: () => this.tabSwitch(),
};
}
/** @internal */
async getRouteId() {
const tabId = this.selectedTab && this.selectedTab.tab;
return tabId !== undefined ? { id: tabId, element: this.selectedTab } : undefined;
}
setActive(selectedTab) {
if (this.transitioning) {
return Promise.reject('transitioning already happening');
}
this.transitioning = true;
this.leavingTab = this.selectedTab;
this.selectedTab = selectedTab;
this.ionTabsWillChange.emit({ tab: selectedTab.tab });
selectedTab.active = true;
return Promise.resolve();
}
tabSwitch() {
const selectedTab = this.selectedTab;
const leavingTab = this.leavingTab;
this.leavingTab = undefined;
this.transitioning = false;
if (!selectedTab) {
return;
}
if (leavingTab !== selectedTab) {
if (leavingTab) {
leavingTab.active = false;
}
this.ionTabsDidChange.emit({ tab: selectedTab.tab });
}
}
notifyRouter() {
if (this.useRouter) {
const router = document.querySelector('ion-router');
if (router) {
return router.navChanged('forward');
}
}
return Promise.resolve(false);
}
shouldSwitch(selectedTab) {
const leavingTab = this.selectedTab;
return selectedTab !== undefined && selectedTab !== leavingTab && !this.transitioning;
}
get tabs() {
return Array.from(this.el.querySelectorAll('ion-tab'));
}
render() {
return (hAsync(Host, { onIonTabButtonClick: this.onTabClicked }, hAsync("slot", { name: "top" }), hAsync("div", { class: "tabs-inner" }, hAsync("slot", null)), hAsync("slot", { name: "bottom" })));
}
get el() { return getElement(this); }
static get style() { return tabsCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-tabs",
"$members$": {
"useRouter": [1028, "use-router"],
"selectedTab": [32],
"select": [64],
"getTab": [64],
"getSelected": [64],
"setRouteId": [64],
"getRouteId": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const getTab = (tabs, tab) => {
const tabEl = (typeof tab === 'string')
? tabs.find(t => t.tab === tab)
: tab;
if (!tabEl) {
console.error(`tab with id: "${tabEl}" does not exist`);
}
return tabEl;
};
const textCss = "/*!@:host(.ion-color)*/.ion-color.sc-ion-text-h{color:var(--ion-color-base)}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Text {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
const mode = getIonMode$1(this);
return (hAsync(Host, { class: createColorClasses$1(this.color, {
[mode]: true,
}) }, hAsync("slot", null)));
}
static get style() { return textCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-text",
"$members$": {
"color": [513]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const textareaIosCss = ".sc-ion-textarea-ios-h{--background:initial;--color:initial;--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:.5;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;--border-radius:0;display:block;position:relative;-ms-flex:1;flex:1;width:100%;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);white-space:pre-wrap;z-index:2;-webkit-box-sizing:border-box;box-sizing:border-box}.ion-color.sc-ion-textarea-ios-h{background:initial}.ion-color.sc-ion-textarea-ios-h{color:var(--ion-color-base)}ion-item.sc-ion-textarea-ios-h,ion-item .sc-ion-textarea-ios-h{-ms-flex-item-align:baseline;align-self:baseline}ion-item.sc-ion-textarea-ios-h:not(.item-label),ion-item:not(.item-label) .sc-ion-textarea-ios-h{--padding-start:0}.textarea-wrapper.sc-ion-textarea-ios{min-width:inherit;max-width:inherit;min-height:inherit;max-height:inherit}.native-textarea.sc-ion-textarea-ios{border-radius:var(--border-radius);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;width:100%;max-width:100%;max-height:100%;border:0;outline:none;background:transparent;-webkit-box-sizing:border-box;box-sizing:border-box;resize:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.native-textarea.sc-ion-textarea-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}.native-textarea.sc-ion-textarea-ios::-webkit-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios::-moz-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios:-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios::-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios::placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea[disabled].sc-ion-textarea-ios{opacity:0.4}.cloned-input.sc-ion-textarea-ios{left:0;top:0;position:absolute;pointer-events:none}[dir=rtl].sc-ion-textarea-ios .cloned-input.sc-ion-textarea-ios,[dir=rtl].sc-ion-textarea-ios-h .cloned-input.sc-ion-textarea-ios,[dir=rtl] .sc-ion-textarea-ios-h .cloned-input.sc-ion-textarea-ios{left:unset;right:unset;right:0}.item-label-floating.item-has-placeholder.sc-ion-textarea-ios-h:not(.item-has-value),.item-label-floating.item-has-placeholder:not(.item-has-value) .sc-ion-textarea-ios-h{opacity:0}.item-label-floating.item-has-placeholder.sc-ion-textarea-ios-h:not(.item-has-value).item-has-focus,.item-label-floating.item-has-placeholder:not(.item-has-value).item-has-focus .sc-ion-textarea-ios-h{-webkit-transition:opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1);opacity:1}.sc-ion-textarea-ios-h{--padding-top:10px;--padding-end:10px;--padding-bottom:10px;--padding-start:0;font-size:inherit}.item-label-stacked.sc-ion-textarea-ios-h,.item-label-stacked .sc-ion-textarea-ios-h,.item-label-floating.sc-ion-textarea-ios-h,.item-label-floating .sc-ion-textarea-ios-h{--padding-top:8px;--padding-bottom:8px;--padding-start:0px}";
const textareaMdCss = ".sc-ion-textarea-md-h{--background:initial;--color:initial;--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:.5;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;--border-radius:0;display:block;position:relative;-ms-flex:1;flex:1;width:100%;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);white-space:pre-wrap;z-index:2;-webkit-box-sizing:border-box;box-sizing:border-box}.ion-color.sc-ion-textarea-md-h{background:initial}.ion-color.sc-ion-textarea-md-h{color:var(--ion-color-base)}ion-item.sc-ion-textarea-md-h,ion-item .sc-ion-textarea-md-h{-ms-flex-item-align:baseline;align-self:baseline}ion-item.sc-ion-textarea-md-h:not(.item-label),ion-item:not(.item-label) .sc-ion-textarea-md-h{--padding-start:0}.textarea-wrapper.sc-ion-textarea-md{min-width:inherit;max-width:inherit;min-height:inherit;max-height:inherit}.native-textarea.sc-ion-textarea-md{border-radius:var(--border-radius);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;width:100%;max-width:100%;max-height:100%;border:0;outline:none;background:transparent;-webkit-box-sizing:border-box;box-sizing:border-box;resize:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.native-textarea.sc-ion-textarea-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}.native-textarea.sc-ion-textarea-md::-webkit-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md::-moz-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md:-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md::-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md::placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea[disabled].sc-ion-textarea-md{opacity:0.4}.cloned-input.sc-ion-textarea-md{left:0;top:0;position:absolute;pointer-events:none}[dir=rtl].sc-ion-textarea-md .cloned-input.sc-ion-textarea-md,[dir=rtl].sc-ion-textarea-md-h .cloned-input.sc-ion-textarea-md,[dir=rtl] .sc-ion-textarea-md-h .cloned-input.sc-ion-textarea-md{left:unset;right:unset;right:0}.item-label-floating.item-has-placeholder.sc-ion-textarea-md-h:not(.item-has-value),.item-label-floating.item-has-placeholder:not(.item-has-value) .sc-ion-textarea-md-h{opacity:0}.item-label-floating.item-has-placeholder.sc-ion-textarea-md-h:not(.item-has-value).item-has-focus,.item-label-floating.item-has-placeholder:not(.item-has-value).item-has-focus .sc-ion-textarea-md-h{-webkit-transition:opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1);opacity:1}.sc-ion-textarea-md-h{--padding-top:10px;--padding-end:0;--padding-bottom:11px;--padding-start:8px;margin-left:0;margin-right:0;margin-top:8px;margin-bottom:0;font-size:inherit}.item-label-stacked.sc-ion-textarea-md-h,.item-label-stacked .sc-ion-textarea-md-h,.item-label-floating.sc-ion-textarea-md-h,.item-label-floating .sc-ion-textarea-md-h{--padding-top:8px;--padding-bottom:8px;--padding-start:0}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
class Textarea {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionChange = createEvent(this, "ionChange", 7);
this.ionInput = createEvent(this, "ionInput", 7);
this.ionStyle = createEvent(this, "ionStyle", 7);
this.ionBlur = createEvent(this, "ionBlur", 7);
this.ionFocus = createEvent(this, "ionFocus", 7);
this.inputId = `ion-textarea-${textareaIds++}`;
this.didBlurAfterEdit = false;
this.inheritedAttributes = {};
/**
* This is required for a WebKit bug which requires us to
* blur and focus an input to properly focus the input in
* an item with delegatesFocus. It will no longer be needed
* with iOS 14.
*
* @internal
*/
this.fireFocusEvents = true;
this.hasFocus = false;
/**
* Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.
*/
this.autocapitalize = 'none';
/**
* This Boolean attribute lets you specify that a form control should have input focus when the page loads.
*/
this.autofocus = false;
/**
* If `true`, the value will be cleared after focus upon edit. Defaults to `true` when `type` is `"password"`, `false` for all other types.
*/
this.clearOnEdit = false;
/**
* Set the amount of time, in milliseconds, to wait to trigger the `ionChange` event after each keystroke. This also impacts form bindings such as `ngModel` or `v-model`.
*/
this.debounce = 0;
/**
* If `true`, the user cannot interact with the textarea.
*/
this.disabled = false;
/**
* The name of the control, which is submitted with the form data.
*/
this.name = this.inputId;
/**
* If `true`, the user cannot modify the value.
*/
this.readonly = false;
/**
* If `true`, the user must fill in a value before submitting a form.
*/
this.required = false;
/**
* If `true`, the element will have its spelling and grammar checked.
*/
this.spellcheck = false;
/**
* If `true`, the element height will increase based on the value.
*/
this.autoGrow = false;
/**
* The value of the textarea.
*/
this.value = '';
this.onInput = (ev) => {
if (this.nativeInput) {
this.value = this.nativeInput.value;
}
this.emitStyle();
this.ionInput.emit(ev);
};
this.onFocus = (ev) => {
this.hasFocus = true;
this.focusChange();
if (this.fireFocusEvents) {
this.ionFocus.emit(ev);
}
};
this.onBlur = (ev) => {
this.hasFocus = false;
this.focusChange();
if (this.fireFocusEvents) {
this.ionBlur.emit(ev);
}
};
this.onKeyDown = () => {
this.checkClearOnEdit();
};
}
debounceChanged() {
this.ionChange = debounceEvent(this.ionChange, this.debounce);
}
disabledChanged() {
this.emitStyle();
}
/**
* Update the native input element when the value changes
*/
valueChanged() {
const nativeInput = this.nativeInput;
const value = this.getValue();
if (nativeInput && nativeInput.value !== value) {
nativeInput.value = value;
}
this.runAutoGrow();
this.emitStyle();
this.ionChange.emit({ value });
}
connectedCallback() {
this.emitStyle();
this.debounceChanged();
}
disconnectedCallback() {
}
componentWillLoad() {
this.inheritedAttributes = inheritAttributes(this.el, ['title']);
}
componentDidLoad() {
raf(() => this.runAutoGrow());
}
runAutoGrow() {
const nativeInput = this.nativeInput;
if (nativeInput && this.autoGrow) {
readTask(() => {
nativeInput.style.height = 'auto';
nativeInput.style.height = nativeInput.scrollHeight + 'px';
if (this.textareaWrapper) {
this.textareaWrapper.style.height = nativeInput.scrollHeight + 'px';
}
});
}
}
/**
* Sets focus on the native `textarea` in `ion-textarea`. Use this method instead of the global
* `textarea.focus()`.
*/
async setFocus() {
if (this.nativeInput) {
this.nativeInput.focus();
}
}
/**
* Sets blur on the native `textarea` in `ion-textarea`. Use this method instead of the global
* `textarea.blur()`.
* @internal
*/
async setBlur() {
if (this.nativeInput) {
this.nativeInput.blur();
}
}
/**
* Returns the native `<textarea>` element used under the hood.
*/
getInputElement() {
return Promise.resolve(this.nativeInput);
}
emitStyle() {
this.ionStyle.emit({
'interactive': true,
'textarea': true,
'input': true,
'interactive-disabled': this.disabled,
'has-placeholder': this.placeholder != null,
'has-value': this.hasValue(),
'has-focus': this.hasFocus
});
}
/**
* Check if we need to clear the text input if clearOnEdit is enabled
*/
checkClearOnEdit() {
if (!this.clearOnEdit) {
return;
}
// Did the input value change after it was blurred and edited?
if (this.didBlurAfterEdit && this.hasValue()) {
// Clear the input
this.value = '';
}
// Reset the flag
this.didBlurAfterEdit = false;
}
focusChange() {
// If clearOnEdit is enabled and the input blurred but has a value, set a flag
if (this.clearOnEdit && !this.hasFocus && this.hasValue()) {
this.didBlurAfterEdit = true;
}
this.emitStyle();
}
hasValue() {
return this.getValue() !== '';
}
getValue() {
return this.value || '';
}
render() {
const mode = getIonMode$1(this);
const value = this.getValue();
const labelId = this.inputId + '-lbl';
const label = findItemLabel(this.el);
if (label) {
label.id = labelId;
}
return (hAsync(Host, { "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses$1(this.color, {
[mode]: true,
}) }, hAsync("div", { class: "textarea-wrapper", ref: el => this.textareaWrapper = el }, hAsync("textarea", Object.assign({ class: "native-textarea", "aria-labelledby": label ? labelId : null, ref: el => this.nativeInput = el, autoCapitalize: this.autocapitalize, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, disabled: this.disabled, maxLength: this.maxlength, minLength: this.minlength, name: this.name, placeholder: this.placeholder || '', readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, cols: this.cols, rows: this.rows, wrap: this.wrap, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeyDown }, this.inheritedAttributes), value))));
}
get el() { return getElement(this); }
static get watchers() { return {
"debounce": ["debounceChanged"],
"disabled": ["disabledChanged"],
"value": ["valueChanged"]
}; }
static get style() { return {
ios: textareaIosCss,
md: textareaMdCss
}; }
static get cmpMeta() { return {
"$flags$": 34,
"$tagName$": "ion-textarea",
"$members$": {
"fireFocusEvents": [4, "fire-focus-events"],
"color": [513],
"autocapitalize": [1],
"autofocus": [4],
"clearOnEdit": [1028, "clear-on-edit"],
"debounce": [2],
"disabled": [4],
"inputmode": [1],
"enterkeyhint": [1],
"maxlength": [2],
"minlength": [2],
"name": [1],
"placeholder": [1],
"readonly": [4],
"required": [4],
"spellcheck": [4],
"cols": [2],
"rows": [2],
"wrap": [1],
"autoGrow": [4, "auto-grow"],
"value": [1025],
"hasFocus": [32],
"setFocus": [64],
"setBlur": [64],
"getInputElement": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
let textareaIds = 0;
const thumbnailCss = "/*!@:host*/.sc-ion-thumbnail-h{--size:48px;--border-radius:0;border-radius:var(--border-radius);display:block;width:var(--size);height:var(--size)}/*!@::slotted(ion-img),\n::slotted(img)*/.sc-ion-thumbnail-s>ion-img,.sc-ion-thumbnail-s>img{border-radius:var(--border-radius);width:100%;height:100%;-o-object-fit:cover;object-fit:cover;overflow:hidden}";
class Thumbnail {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
return (hAsync(Host, { class: getIonMode$1(this) }, hAsync("slot", null)));
}
static get style() { return thumbnailCss; }
static get cmpMeta() { return {
"$flags$": 9,
"$tagName$": "ion-thumbnail",
"$members$": undefined,
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
/**
* iOS Toast Enter Animation
*/
const iosEnterAnimation = (baseEl, position) => {
const baseAnimation = createAnimation();
const wrapperAnimation = createAnimation();
const hostEl = baseEl.host || baseEl;
const wrapperEl = baseEl.querySelector('.toast-wrapper');
const bottom = `calc(-10px - var(--ion-safe-area-bottom, 0px))`;
const top = `calc(10px + var(--ion-safe-area-top, 0px))`;
wrapperAnimation.addElement(wrapperEl);
switch (position) {
case 'top':
wrapperAnimation.fromTo('transform', 'translateY(-100%)', `translateY(${top})`);
break;
case 'middle':
const topPosition = Math.floor(hostEl.clientHeight / 2 - wrapperEl.clientHeight / 2);
wrapperEl.style.top = `${topPosition}px`;
wrapperAnimation.fromTo('opacity', 0.01, 1);
break;
default:
wrapperAnimation.fromTo('transform', 'translateY(100%)', `translateY(${bottom})`);
break;
}
return baseAnimation
.addElement(hostEl)
.easing('cubic-bezier(.155,1.105,.295,1.12)')
.duration(400)
.addAnimation(wrapperAnimation);
};
/**
* iOS Toast Leave Animation
*/
const iosLeaveAnimation = (baseEl, position) => {
const baseAnimation = createAnimation();
const wrapperAnimation = createAnimation();
const hostEl = baseEl.host || baseEl;
const wrapperEl = baseEl.querySelector('.toast-wrapper');
const bottom = `calc(-10px - var(--ion-safe-area-bottom, 0px))`;
const top = `calc(10px + var(--ion-safe-area-top, 0px))`;
wrapperAnimation.addElement(wrapperEl);
switch (position) {
case 'top':
wrapperAnimation.fromTo('transform', `translateY(${top})`, 'translateY(-100%)');
break;
case 'middle':
wrapperAnimation.fromTo('opacity', 0.99, 0);
break;
default:
wrapperAnimation.fromTo('transform', `translateY(${bottom})`, 'translateY(100%)');
break;
}
return baseAnimation
.addElement(hostEl)
.easing('cubic-bezier(.36,.66,.04,1)')
.duration(300)
.addAnimation(wrapperAnimation);
};
/**
* MD Toast Enter Animation
*/
const mdEnterAnimation = (baseEl, position) => {
const baseAnimation = createAnimation();
const wrapperAnimation = createAnimation();
const hostEl = baseEl.host || baseEl;
const wrapperEl = baseEl.querySelector('.toast-wrapper');
const bottom = `calc(8px + var(--ion-safe-area-bottom, 0px))`;
const top = `calc(8px + var(--ion-safe-area-top, 0px))`;
wrapperAnimation.addElement(wrapperEl);
switch (position) {
case 'top':
wrapperEl.style.top = top;
wrapperAnimation.fromTo('opacity', 0.01, 1);
break;
case 'middle':
const topPosition = Math.floor(hostEl.clientHeight / 2 - wrapperEl.clientHeight / 2);
wrapperEl.style.top = `${topPosition}px`;
wrapperAnimation.fromTo('opacity', 0.01, 1);
break;
default:
wrapperEl.style.bottom = bottom;
wrapperAnimation.fromTo('opacity', 0.01, 1);
break;
}
return baseAnimation
.addElement(hostEl)
.easing('cubic-bezier(.36,.66,.04,1)')
.duration(400)
.addAnimation(wrapperAnimation);
};
/**
* md Toast Leave Animation
*/
const mdLeaveAnimation = (baseEl) => {
const baseAnimation = createAnimation();
const wrapperAnimation = createAnimation();
const hostEl = baseEl.host || baseEl;
const wrapperEl = baseEl.querySelector('.toast-wrapper');
wrapperAnimation
.addElement(wrapperEl)
.fromTo('opacity', 0.99, 0);
return baseAnimation
.addElement(hostEl)
.easing('cubic-bezier(.36,.66,.04,1)')
.duration(300)
.addAnimation(wrapperAnimation);
};
const toastIosCss = "/*!@:host*/.sc-ion-toast-ios-h{--border-width:0;--border-style:none;--border-color:initial;--box-shadow:none;--min-width:auto;--width:auto;--min-height:auto;--height:auto;--max-height:auto;--white-space:pre-wrap;left:0;top:0;display:block;position:absolute;width:100%;height:100%;outline:none;color:var(--color);font-family:var(--ion-font-family, inherit);contain:strict;z-index:1001;pointer-events:none}/*!@:host-context([dir=rtl])*/[dir=rtl].sc-ion-toast-ios-h,[dir=rtl] .sc-ion-toast-ios-h{left:unset;right:unset;right:0}/*!@:host(.overlay-hidden)*/.overlay-hidden.sc-ion-toast-ios-h{display:none}/*!@:host(.ion-color)*/.ion-color.sc-ion-toast-ios-h{--button-color:inherit;color:var(--ion-color-contrast)}/*!@:host(.ion-color) .toast-button-cancel*/.ion-color.sc-ion-toast-ios-h .toast-button-cancel.sc-ion-toast-ios{color:inherit}/*!@:host(.ion-color) .toast-wrapper*/.ion-color.sc-ion-toast-ios-h .toast-wrapper.sc-ion-toast-ios{background:var(--ion-color-base)}/*!@.toast-wrapper*/.toast-wrapper.sc-ion-toast-ios{border-radius:var(--border-radius);left:var(--start);right:var(--end);width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow)}/*!@[dir=rtl] .toast-wrapper, :host-context([dir=rtl]) .toast-wrapper*/[dir=rtl].sc-ion-toast-ios .toast-wrapper.sc-ion-toast-ios,[dir=rtl].sc-ion-toast-ios-h .toast-wrapper.sc-ion-toast-ios,[dir=rtl] .sc-ion-toast-ios-h .toast-wrapper.sc-ion-toast-ios{left:unset;right:unset;left:var(--end);right:var(--start)}/*!@.toast-container*/.toast-container.sc-ion-toast-ios{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;pointer-events:auto;height:inherit;min-height:inherit;max-height:inherit;contain:content}/*!@.toast-content*/.toast-content.sc-ion-toast-ios{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}/*!@.toast-message*/.toast-message.sc-ion-toast-ios{-ms-flex:1;flex:1;white-space:var(--white-space)}/*!@.toast-button-group*/.toast-button-group.sc-ion-toast-ios{display:-ms-flexbox;display:flex}/*!@.toast-button*/.toast-button.sc-ion-toast-ios{border:0;outline:none;color:var(--button-color);z-index:0}/*!@.toast-icon*/.toast-icon.sc-ion-toast-ios{font-size:1.4em}/*!@.toast-button-inner*/.toast-button-inner.sc-ion-toast-ios{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}@media (any-hover: hover){/*!@.toast-button:hover*/.toast-button.sc-ion-toast-ios:hover{cursor:pointer}}/*!@:host*/.sc-ion-toast-ios-h{--background:var(--ion-color-step-50, #f2f2f2);--border-radius:14px;--button-color:var(--ion-color-primary, #3880ff);--color:var(--ion-color-step-850, #262626);--max-width:700px;--start:10px;--end:10px;font-size:14px}/*!@.toast-wrapper*/.toast-wrapper.sc-ion-toast-ios{margin-left:auto;margin-right:auto;margin-top:auto;margin-bottom:auto;display:block;position:absolute;z-index:10}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.toast-wrapper*/.toast-wrapper.sc-ion-toast-ios{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){/*!@:host(.toast-translucent) .toast-wrapper*/.toast-translucent.sc-ion-toast-ios-h .toast-wrapper.sc-ion-toast-ios{background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}}/*!@.toast-wrapper.toast-top*/.toast-wrapper.toast-top.sc-ion-toast-ios{-webkit-transform:translate3d(0, -100%, 0);transform:translate3d(0, -100%, 0);top:0}/*!@.toast-wrapper.toast-middle*/.toast-wrapper.toast-middle.sc-ion-toast-ios{opacity:0.01}/*!@.toast-wrapper.toast-bottom*/.toast-wrapper.toast-bottom.sc-ion-toast-ios{-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0);bottom:0}/*!@.toast-content*/.toast-content.sc-ion-toast-ios{padding-left:15px;padding-right:15px;padding-top:15px;padding-bottom:15px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.toast-content*/.toast-content.sc-ion-toast-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:15px;padding-inline-start:15px;-webkit-padding-end:15px;padding-inline-end:15px}}/*!@.toast-header*/.toast-header.sc-ion-toast-ios{margin-bottom:2px;font-weight:500}/*!@.toast-button*/.toast-button.sc-ion-toast-ios{padding-left:15px;padding-right:15px;padding-top:10px;padding-bottom:10px;height:44px;-webkit-transition:background-color, opacity 100ms linear;transition:background-color, opacity 100ms linear;border:0;background-color:transparent;font-family:var(--ion-font-family);font-size:17px;font-weight:500;overflow:hidden}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.toast-button*/.toast-button.sc-ion-toast-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:15px;padding-inline-start:15px;-webkit-padding-end:15px;padding-inline-end:15px}}/*!@.toast-button.ion-activated*/.toast-button.ion-activated.sc-ion-toast-ios{opacity:0.4}@media (any-hover: hover){/*!@.toast-button:hover*/.toast-button.sc-ion-toast-ios:hover{opacity:0.6}}";
const toastMdCss = "/*!@:host*/.sc-ion-toast-md-h{--border-width:0;--border-style:none;--border-color:initial;--box-shadow:none;--min-width:auto;--width:auto;--min-height:auto;--height:auto;--max-height:auto;--white-space:pre-wrap;left:0;top:0;display:block;position:absolute;width:100%;height:100%;outline:none;color:var(--color);font-family:var(--ion-font-family, inherit);contain:strict;z-index:1001;pointer-events:none}/*!@:host-context([dir=rtl])*/[dir=rtl].sc-ion-toast-md-h,[dir=rtl] .sc-ion-toast-md-h{left:unset;right:unset;right:0}/*!@:host(.overlay-hidden)*/.overlay-hidden.sc-ion-toast-md-h{display:none}/*!@:host(.ion-color)*/.ion-color.sc-ion-toast-md-h{--button-color:inherit;color:var(--ion-color-contrast)}/*!@:host(.ion-color) .toast-button-cancel*/.ion-color.sc-ion-toast-md-h .toast-button-cancel.sc-ion-toast-md{color:inherit}/*!@:host(.ion-color) .toast-wrapper*/.ion-color.sc-ion-toast-md-h .toast-wrapper.sc-ion-toast-md{background:var(--ion-color-base)}/*!@.toast-wrapper*/.toast-wrapper.sc-ion-toast-md{border-radius:var(--border-radius);left:var(--start);right:var(--end);width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow)}/*!@[dir=rtl] .toast-wrapper, :host-context([dir=rtl]) .toast-wrapper*/[dir=rtl].sc-ion-toast-md .toast-wrapper.sc-ion-toast-md,[dir=rtl].sc-ion-toast-md-h .toast-wrapper.sc-ion-toast-md,[dir=rtl] .sc-ion-toast-md-h .toast-wrapper.sc-ion-toast-md{left:unset;right:unset;left:var(--end);right:var(--start)}/*!@.toast-container*/.toast-container.sc-ion-toast-md{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;pointer-events:auto;height:inherit;min-height:inherit;max-height:inherit;contain:content}/*!@.toast-content*/.toast-content.sc-ion-toast-md{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}/*!@.toast-message*/.toast-message.sc-ion-toast-md{-ms-flex:1;flex:1;white-space:var(--white-space)}/*!@.toast-button-group*/.toast-button-group.sc-ion-toast-md{display:-ms-flexbox;display:flex}/*!@.toast-button*/.toast-button.sc-ion-toast-md{border:0;outline:none;color:var(--button-color);z-index:0}/*!@.toast-icon*/.toast-icon.sc-ion-toast-md{font-size:1.4em}/*!@.toast-button-inner*/.toast-button-inner.sc-ion-toast-md{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}@media (any-hover: hover){/*!@.toast-button:hover*/.toast-button.sc-ion-toast-md:hover{cursor:pointer}}/*!@:host*/.sc-ion-toast-md-h{--background:var(--ion-color-step-800, #333333);--border-radius:4px;--box-shadow:0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);--button-color:var(--ion-color-primary, #3880ff);--color:var(--ion-color-step-50, #f2f2f2);--max-width:700px;--start:8px;--end:8px;font-size:14px}/*!@.toast-wrapper*/.toast-wrapper.sc-ion-toast-md{margin-left:auto;margin-right:auto;margin-top:auto;margin-bottom:auto;display:block;position:absolute;opacity:0.01;z-index:10}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.toast-wrapper*/.toast-wrapper.sc-ion-toast-md{margin-left:unset;margin-right:unset;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}}/*!@.toast-content*/.toast-content.sc-ion-toast-md{padding-left:16px;padding-right:16px;padding-top:14px;padding-bottom:14px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.toast-content*/.toast-content.sc-ion-toast-md{padding-left:unset;padding-right:unset;-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px}}/*!@.toast-header*/.toast-header.sc-ion-toast-md{margin-bottom:2px;font-weight:500;line-height:20px}/*!@.toast-message*/.toast-message.sc-ion-toast-md{line-height:20px}/*!@.toast-button-group-start*/.toast-button-group-start.sc-ion-toast-md{margin-left:8px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.toast-button-group-start*/.toast-button-group-start.sc-ion-toast-md{margin-left:unset;-webkit-margin-start:8px;margin-inline-start:8px}}/*!@.toast-button-group-end*/.toast-button-group-end.sc-ion-toast-md{margin-right:8px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.toast-button-group-end*/.toast-button-group-end.sc-ion-toast-md{margin-right:unset;-webkit-margin-end:8px;margin-inline-end:8px}}/*!@.toast-button*/.toast-button.sc-ion-toast-md{padding-left:15px;padding-right:15px;padding-top:10px;padding-bottom:10px;position:relative;background-color:transparent;font-family:var(--ion-font-family);font-size:14px;font-weight:500;letter-spacing:0.84px;text-transform:uppercase;overflow:hidden}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.toast-button*/.toast-button.sc-ion-toast-md{padding-left:unset;padding-right:unset;-webkit-padding-start:15px;padding-inline-start:15px;-webkit-padding-end:15px;padding-inline-end:15px}}/*!@.toast-button-cancel*/.toast-button-cancel.sc-ion-toast-md{color:var(--ion-color-step-100, #e6e6e6)}/*!@.toast-button-icon-only*/.toast-button-icon-only.sc-ion-toast-md{border-radius:50%;padding-left:9px;padding-right:9px;padding-top:9px;padding-bottom:9px;width:36px;height:36px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.toast-button-icon-only*/.toast-button-icon-only.sc-ion-toast-md{padding-left:unset;padding-right:unset;-webkit-padding-start:9px;padding-inline-start:9px;-webkit-padding-end:9px;padding-inline-end:9px}}@media (any-hover: hover){/*!@.toast-button:hover*/.toast-button.sc-ion-toast-md:hover{background-color:rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.08)}/*!@.toast-button-cancel:hover*/.toast-button-cancel.sc-ion-toast-md:hover{background-color:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.08)}}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part button - Any button element that is displayed inside of the toast.
* @part container - The element that wraps all child elements.
* @part header - The header text of the toast.
* @part message - The body text of the toast.
*/
class Toast {
constructor(hostRef) {
registerInstance(this, hostRef);
this.didPresent = createEvent(this, "ionToastDidPresent", 7);
this.willPresent = createEvent(this, "ionToastWillPresent", 7);
this.willDismiss = createEvent(this, "ionToastWillDismiss", 7);
this.didDismiss = createEvent(this, "ionToastDidDismiss", 7);
this.presented = false;
/**
* How many milliseconds to wait before hiding the toast. By default, it will show
* until `dismiss()` is called.
*/
this.duration = 0;
/**
* If `true`, the keyboard will be automatically dismissed when the overlay is presented.
*/
this.keyboardClose = false;
/**
* The position of the toast on the screen.
*/
this.position = 'bottom';
/**
* If `true`, the toast will be translucent.
* Only applies when the mode is `"ios"` and the device supports
* [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
*/
this.translucent = false;
/**
* If `true`, the toast will animate.
*/
this.animated = true;
this.dispatchCancelHandler = (ev) => {
const role = ev.detail.role;
if (isCancel(role)) {
const cancelButton = this.getButtons().find(b => b.role === 'cancel');
this.callButtonHandler(cancelButton);
}
};
}
connectedCallback() {
prepareOverlay(this.el);
}
/**
* Present the toast overlay after it has been created.
*/
async present() {
await present(this, 'toastEnter', iosEnterAnimation, mdEnterAnimation, this.position);
if (this.duration > 0) {
this.durationTimeout = setTimeout(() => this.dismiss(undefined, 'timeout'), this.duration);
}
}
/**
* Dismiss the toast overlay after it has been presented.
*
* @param data Any data to emit in the dismiss events.
* @param role The role of the element that is dismissing the toast.
* This can be useful in a button handler for determining which button was
* clicked to dismiss the toast.
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
*/
dismiss(data, role) {
if (this.durationTimeout) {
clearTimeout(this.durationTimeout);
}
return dismiss(this, data, role, 'toastLeave', iosLeaveAnimation, mdLeaveAnimation, this.position);
}
/**
* Returns a promise that resolves when the toast did dismiss.
*/
onDidDismiss() {
return eventMethod(this.el, 'ionToastDidDismiss');
}
/**
* Returns a promise that resolves when the toast will dismiss.
*/
onWillDismiss() {
return eventMethod(this.el, 'ionToastWillDismiss');
}
getButtons() {
const buttons = this.buttons
? this.buttons.map(b => {
return (typeof b === 'string')
? { text: b }
: b;
})
: [];
return buttons;
}
async buttonClick(button) {
const role = button.role;
if (isCancel(role)) {
return this.dismiss(undefined, role);
}
const shouldDismiss = await this.callButtonHandler(button);
if (shouldDismiss) {
return this.dismiss(undefined, role);
}
return Promise.resolve();
}
async callButtonHandler(button) {
if (button && button.handler) {
// a handler has been provided, execute it
// pass the handler the values from the inputs
try {
const rtn = await safeCall(button.handler);
if (rtn === false) {
// if the return value of the handler is false then do not dismiss
return false;
}
}
catch (e) {
console.error(e);
}
}
return true;
}
renderButtons(buttons, side) {
if (buttons.length === 0) {
return;
}
const mode = getIonMode$1(this);
const buttonGroupsClasses = {
'toast-button-group': true,
[`toast-button-group-${side}`]: true
};
return (hAsync("div", { class: buttonGroupsClasses }, buttons.map(b => hAsync("button", { type: "button", class: buttonClass(b), tabIndex: 0, onClick: () => this.buttonClick(b), part: "button" }, hAsync("div", { class: "toast-button-inner" }, b.icon &&
hAsync("ion-icon", { icon: b.icon, slot: b.text === undefined ? 'icon-only' : undefined, class: "toast-icon" }), b.text), mode === 'md' && hAsync("ion-ripple-effect", { type: b.icon !== undefined && b.text === undefined ? 'unbounded' : 'bounded' })))));
}
render() {
const allButtons = this.getButtons();
const startButtons = allButtons.filter(b => b.side === 'start');
const endButtons = allButtons.filter(b => b.side !== 'start');
const mode = getIonMode$1(this);
const wrapperClass = {
'toast-wrapper': true,
[`toast-${this.position}`]: true
};
return (hAsync(Host, { style: {
zIndex: `${60000 + this.overlayIndex}`,
}, class: createColorClasses$1(this.color, Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'toast-translucent': this.translucent })), tabindex: "-1", onIonToastWillDismiss: this.dispatchCancelHandler }, hAsync("div", { class: wrapperClass }, hAsync("div", { class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), hAsync("div", { class: "toast-content" }, this.header !== undefined &&
hAsync("div", { class: "toast-header", part: "header" }, this.header), this.message !== undefined &&
hAsync("div", { class: "toast-message", part: "message", innerHTML: sanitizeDOMString(this.message) })), this.renderButtons(endButtons, 'end')))));
}
get el() { return getElement(this); }
static get style() { return {
ios: toastIosCss,
md: toastMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-toast",
"$members$": {
"overlayIndex": [2, "overlay-index"],
"color": [513],
"enterAnimation": [16],
"leaveAnimation": [16],
"cssClass": [1, "css-class"],
"duration": [2],
"header": [1],
"message": [1],
"keyboardClose": [4, "keyboard-close"],
"position": [1],
"buttons": [16],
"translucent": [4],
"animated": [4],
"present": [64],
"dismiss": [64],
"onDidDismiss": [64],
"onWillDismiss": [64]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const buttonClass = (button) => {
return Object.assign({ 'toast-button': true, 'toast-button-icon-only': button.icon !== undefined && button.text === undefined, [`toast-button-${button.role}`]: button.role !== undefined, 'ion-focusable': true, 'ion-activatable': true }, getClassMap(button.cssClass));
};
const toggleIosCss = "/*!@:host*/.sc-ion-toggle-ios-h{-webkit-box-sizing:content-box !important;box-sizing:content-box !important;display:inline-block;position:relative;outline:none;contain:content;cursor:pointer;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}/*!@:host(.ion-focused) input*/.ion-focused.sc-ion-toggle-ios-h input.sc-ion-toggle-ios{border:2px solid #5e9ed6}/*!@:host(.toggle-disabled)*/.toggle-disabled.sc-ion-toggle-ios-h{pointer-events:none}/*!@label*/label.sc-ion-toggle-ios{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:0;pointer-events:none}/*!@[dir=rtl] label, :host-context([dir=rtl]) label*/[dir=rtl].sc-ion-toggle-ios label.sc-ion-toggle-ios,[dir=rtl].sc-ion-toggle-ios-h label.sc-ion-toggle-ios,[dir=rtl] .sc-ion-toggle-ios-h label.sc-ion-toggle-ios{left:unset;right:unset;right:0}/*!@label::-moz-focus-inner*/label.sc-ion-toggle-ios::-moz-focus-inner{border:0}/*!@input*/input.sc-ion-toggle-ios{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}/*!@.toggle-icon-wrapper*/.toggle-icon-wrapper.sc-ion-toggle-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;width:100%;height:100%;-webkit-transition:var(--handle-transition);transition:var(--handle-transition);will-change:transform}/*!@.toggle-icon*/.toggle-icon.sc-ion-toggle-ios{border-radius:var(--border-radius);display:block;position:relative;width:100%;height:100%;background:var(--background);pointer-events:none;overflow:inherit}/*!@:host(.toggle-checked) .toggle-icon*/.toggle-checked.sc-ion-toggle-ios-h .toggle-icon.sc-ion-toggle-ios{background:var(--background-checked)}/*!@.toggle-inner*/.toggle-inner.sc-ion-toggle-ios{left:var(--handle-spacing);border-radius:var(--handle-border-radius);position:absolute;width:var(--handle-width);height:var(--handle-height);max-height:var(--handle-max-height);-webkit-transition:var(--handle-transition);transition:var(--handle-transition);background:var(--handle-background);-webkit-box-shadow:var(--handle-box-shadow);box-shadow:var(--handle-box-shadow);contain:strict}/*!@[dir=rtl] .toggle-inner, :host-context([dir=rtl]) .toggle-inner*/[dir=rtl].sc-ion-toggle-ios .toggle-inner.sc-ion-toggle-ios,[dir=rtl].sc-ion-toggle-ios-h .toggle-inner.sc-ion-toggle-ios,[dir=rtl] .sc-ion-toggle-ios-h .toggle-inner.sc-ion-toggle-ios{left:unset;right:unset;right:var(--handle-spacing)}/*!@:host(.toggle-checked) .toggle-icon-wrapper*/.toggle-checked.sc-ion-toggle-ios-h .toggle-icon-wrapper.sc-ion-toggle-ios{-webkit-transform:translate3d(calc(100% - var(--handle-width)), 0, 0);transform:translate3d(calc(100% - var(--handle-width)), 0, 0)}/*!@:host-context([dir=rtl]):host(.toggle-checked) .toggle-icon-wrapper, :host-context([dir=rtl]).toggle-checked .toggle-icon-wrapper*/[dir=rtl].sc-ion-toggle-ios-h -no-combinator.toggle-checked.sc-ion-toggle-ios-h .toggle-icon-wrapper.sc-ion-toggle-ios,[dir=rtl] .sc-ion-toggle-ios-h -no-combinator.toggle-checked.sc-ion-toggle-ios-h .toggle-icon-wrapper.sc-ion-toggle-ios,[dir=rtl].toggle-checked.sc-ion-toggle-ios-h .toggle-icon-wrapper.sc-ion-toggle-ios,[dir=rtl] .toggle-checked.sc-ion-toggle-ios-h .toggle-icon-wrapper.sc-ion-toggle-ios{-webkit-transform:translate3d(calc(-100% + var(--handle-width)), 0, 0);transform:translate3d(calc(-100% + var(--handle-width)), 0, 0)}/*!@:host(.toggle-checked) .toggle-inner*/.toggle-checked.sc-ion-toggle-ios-h .toggle-inner.sc-ion-toggle-ios{-webkit-transform:translate3d(calc(var(--handle-spacing) * -2), 0, 0);transform:translate3d(calc(var(--handle-spacing) * -2), 0, 0);background:var(--handle-background-checked)}/*!@:host-context([dir=rtl]):host(.toggle-checked) .toggle-inner, :host-context([dir=rtl]).toggle-checked .toggle-inner*/[dir=rtl].sc-ion-toggle-ios-h -no-combinator.toggle-checked.sc-ion-toggle-ios-h .toggle-inner.sc-ion-toggle-ios,[dir=rtl] .sc-ion-toggle-ios-h -no-combinator.toggle-checked.sc-ion-toggle-ios-h .toggle-inner.sc-ion-toggle-ios,[dir=rtl].toggle-checked.sc-ion-toggle-ios-h .toggle-inner.sc-ion-toggle-ios,[dir=rtl] .toggle-checked.sc-ion-toggle-ios-h .toggle-inner.sc-ion-toggle-ios{-webkit-transform:translate3d(calc(var(--handle-spacing) * 2), 0, 0);transform:translate3d(calc(var(--handle-spacing) * 2), 0, 0)}/*!@:host*/.sc-ion-toggle-ios-h{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.088);--background-checked:var(--ion-color-primary, #3880ff);--border-radius:16px;--handle-background:#ffffff;--handle-background-checked:#ffffff;--handle-border-radius:25.5px;--handle-box-shadow:0 3px 12px rgba(0, 0, 0, 0.16), 0 3px 1px rgba(0, 0, 0, 0.1);--handle-height:calc(32px - (2px * 2));--handle-max-height:calc(100% - (var(--handle-spacing) * 2));--handle-width:calc(32px - (2px * 2));--handle-spacing:2px;--handle-transition:transform 300ms, width 120ms ease-in-out 80ms, left 110ms ease-in-out 80ms, right 110ms ease-in-out 80ms;width:51px;height:32px;contain:strict;overflow:hidden}/*!@:host(.ion-color.toggle-checked) .toggle-icon*/.ion-color.toggle-checked.sc-ion-toggle-ios-h .toggle-icon.sc-ion-toggle-ios{background:var(--ion-color-base)}/*!@.toggle-icon*/.toggle-icon.sc-ion-toggle-ios{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);-webkit-transition:background-color 300ms;transition:background-color 300ms}/*!@.toggle-inner*/.toggle-inner.sc-ion-toggle-ios{will-change:transform}/*!@:host(.toggle-activated) .toggle-icon::before,\n:host(.toggle-checked) .toggle-icon::before*/.toggle-activated.sc-ion-toggle-ios-h .toggle-icon.sc-ion-toggle-ios::before,.toggle-checked.sc-ion-toggle-ios-h .toggle-icon.sc-ion-toggle-ios::before{-webkit-transform:scale3d(0, 0, 0);transform:scale3d(0, 0, 0)}/*!@:host(.toggle-activated.toggle-checked) .toggle-inner::before*/.toggle-activated.toggle-checked.sc-ion-toggle-ios-h .toggle-inner.sc-ion-toggle-ios::before{-webkit-transform:scale3d(0, 0, 0);transform:scale3d(0, 0, 0)}/*!@:host(.toggle-activated) .toggle-inner*/.toggle-activated.sc-ion-toggle-ios-h .toggle-inner.sc-ion-toggle-ios{width:calc(var(--handle-width) + 6px)}/*!@:host(.toggle-activated.toggle-checked) .toggle-icon-wrapper*/.toggle-activated.toggle-checked.sc-ion-toggle-ios-h .toggle-icon-wrapper.sc-ion-toggle-ios{-webkit-transform:translate3d(calc(100% - var(--handle-width) - 6px), 0, 0);transform:translate3d(calc(100% - var(--handle-width) - 6px), 0, 0)}/*!@:host-context([dir=rtl]):host(.toggle-activated.toggle-checked) .toggle-icon-wrapper, :host-context([dir=rtl]).toggle-activated.toggle-checked .toggle-icon-wrapper*/[dir=rtl].sc-ion-toggle-ios-h -no-combinator.toggle-activated.toggle-checked.sc-ion-toggle-ios-h .toggle-icon-wrapper.sc-ion-toggle-ios,[dir=rtl] .sc-ion-toggle-ios-h -no-combinator.toggle-activated.toggle-checked.sc-ion-toggle-ios-h .toggle-icon-wrapper.sc-ion-toggle-ios,[dir=rtl].toggle-activated.toggle-checked.sc-ion-toggle-ios-h .toggle-icon-wrapper.sc-ion-toggle-ios,[dir=rtl] .toggle-activated.toggle-checked.sc-ion-toggle-ios-h .toggle-icon-wrapper.sc-ion-toggle-ios{-webkit-transform:translate3d(calc(-100% + var(--handle-width) + 6px), 0, 0);transform:translate3d(calc(-100% + var(--handle-width) + 6px), 0, 0)}/*!@:host(.toggle-disabled)*/.toggle-disabled.sc-ion-toggle-ios-h{opacity:0.3}/*!@:host(.in-item[slot])*/.in-item[slot].sc-ion-toggle-ios-h{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:20px;padding-right:10px;padding-top:6px;padding-bottom:5px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-item[slot])*/.in-item[slot].sc-ion-toggle-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:10px;padding-inline-end:10px}}/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-toggle-ios-h{padding-left:0;padding-right:16px;padding-top:6px;padding-bottom:5px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-toggle-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:0;padding-inline-start:0;-webkit-padding-end:16px;padding-inline-end:16px}}";
const toggleMdCss = "/*!@:host*/.sc-ion-toggle-md-h{-webkit-box-sizing:content-box !important;box-sizing:content-box !important;display:inline-block;position:relative;outline:none;contain:content;cursor:pointer;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}/*!@:host(.ion-focused) input*/.ion-focused.sc-ion-toggle-md-h input.sc-ion-toggle-md{border:2px solid #5e9ed6}/*!@:host(.toggle-disabled)*/.toggle-disabled.sc-ion-toggle-md-h{pointer-events:none}/*!@label*/label.sc-ion-toggle-md{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:0;pointer-events:none}/*!@[dir=rtl] label, :host-context([dir=rtl]) label*/[dir=rtl].sc-ion-toggle-md label.sc-ion-toggle-md,[dir=rtl].sc-ion-toggle-md-h label.sc-ion-toggle-md,[dir=rtl] .sc-ion-toggle-md-h label.sc-ion-toggle-md{left:unset;right:unset;right:0}/*!@label::-moz-focus-inner*/label.sc-ion-toggle-md::-moz-focus-inner{border:0}/*!@input*/input.sc-ion-toggle-md{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}/*!@.toggle-icon-wrapper*/.toggle-icon-wrapper.sc-ion-toggle-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;width:100%;height:100%;-webkit-transition:var(--handle-transition);transition:var(--handle-transition);will-change:transform}/*!@.toggle-icon*/.toggle-icon.sc-ion-toggle-md{border-radius:var(--border-radius);display:block;position:relative;width:100%;height:100%;background:var(--background);pointer-events:none;overflow:inherit}/*!@:host(.toggle-checked) .toggle-icon*/.toggle-checked.sc-ion-toggle-md-h .toggle-icon.sc-ion-toggle-md{background:var(--background-checked)}/*!@.toggle-inner*/.toggle-inner.sc-ion-toggle-md{left:var(--handle-spacing);border-radius:var(--handle-border-radius);position:absolute;width:var(--handle-width);height:var(--handle-height);max-height:var(--handle-max-height);-webkit-transition:var(--handle-transition);transition:var(--handle-transition);background:var(--handle-background);-webkit-box-shadow:var(--handle-box-shadow);box-shadow:var(--handle-box-shadow);contain:strict}/*!@[dir=rtl] .toggle-inner, :host-context([dir=rtl]) .toggle-inner*/[dir=rtl].sc-ion-toggle-md .toggle-inner.sc-ion-toggle-md,[dir=rtl].sc-ion-toggle-md-h .toggle-inner.sc-ion-toggle-md,[dir=rtl] .sc-ion-toggle-md-h .toggle-inner.sc-ion-toggle-md{left:unset;right:unset;right:var(--handle-spacing)}/*!@:host(.toggle-checked) .toggle-icon-wrapper*/.toggle-checked.sc-ion-toggle-md-h .toggle-icon-wrapper.sc-ion-toggle-md{-webkit-transform:translate3d(calc(100% - var(--handle-width)), 0, 0);transform:translate3d(calc(100% - var(--handle-width)), 0, 0)}/*!@:host-context([dir=rtl]):host(.toggle-checked) .toggle-icon-wrapper, :host-context([dir=rtl]).toggle-checked .toggle-icon-wrapper*/[dir=rtl].sc-ion-toggle-md-h -no-combinator.toggle-checked.sc-ion-toggle-md-h .toggle-icon-wrapper.sc-ion-toggle-md,[dir=rtl] .sc-ion-toggle-md-h -no-combinator.toggle-checked.sc-ion-toggle-md-h .toggle-icon-wrapper.sc-ion-toggle-md,[dir=rtl].toggle-checked.sc-ion-toggle-md-h .toggle-icon-wrapper.sc-ion-toggle-md,[dir=rtl] .toggle-checked.sc-ion-toggle-md-h .toggle-icon-wrapper.sc-ion-toggle-md{-webkit-transform:translate3d(calc(-100% + var(--handle-width)), 0, 0);transform:translate3d(calc(-100% + var(--handle-width)), 0, 0)}/*!@:host(.toggle-checked) .toggle-inner*/.toggle-checked.sc-ion-toggle-md-h .toggle-inner.sc-ion-toggle-md{-webkit-transform:translate3d(calc(var(--handle-spacing) * -2), 0, 0);transform:translate3d(calc(var(--handle-spacing) * -2), 0, 0);background:var(--handle-background-checked)}/*!@:host-context([dir=rtl]):host(.toggle-checked) .toggle-inner, :host-context([dir=rtl]).toggle-checked .toggle-inner*/[dir=rtl].sc-ion-toggle-md-h -no-combinator.toggle-checked.sc-ion-toggle-md-h .toggle-inner.sc-ion-toggle-md,[dir=rtl] .sc-ion-toggle-md-h -no-combinator.toggle-checked.sc-ion-toggle-md-h .toggle-inner.sc-ion-toggle-md,[dir=rtl].toggle-checked.sc-ion-toggle-md-h .toggle-inner.sc-ion-toggle-md,[dir=rtl] .toggle-checked.sc-ion-toggle-md-h .toggle-inner.sc-ion-toggle-md{-webkit-transform:translate3d(calc(var(--handle-spacing) * 2), 0, 0);transform:translate3d(calc(var(--handle-spacing) * 2), 0, 0)}/*!@:host*/.sc-ion-toggle-md-h{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.39);--background-checked:rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.5);--border-radius:14px;--handle-background:#ffffff;--handle-background-checked:var(--ion-color-primary, #3880ff);--handle-border-radius:50%;--handle-box-shadow:0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);--handle-width:20px;--handle-height:20px;--handle-max-height:calc(100% + 6px);--handle-spacing:0;--handle-transition:transform 160ms cubic-bezier(0.4, 0, 0.2, 1), background-color 160ms cubic-bezier(0.4, 0, 0.2, 1);padding-left:12px;padding-right:12px;padding-top:12px;padding-bottom:12px;width:36px;height:14px;contain:strict}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-toggle-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px}}/*!@:host(.ion-color.toggle-checked) .toggle-icon*/.ion-color.toggle-checked.sc-ion-toggle-md-h .toggle-icon.sc-ion-toggle-md{background:rgba(var(--ion-color-base-rgb), 0.5)}/*!@:host(.ion-color.toggle-checked) .toggle-inner*/.ion-color.toggle-checked.sc-ion-toggle-md-h .toggle-inner.sc-ion-toggle-md{background:var(--ion-color-base)}/*!@.toggle-icon*/.toggle-icon.sc-ion-toggle-md{-webkit-transition:background-color 160ms;transition:background-color 160ms}/*!@.toggle-inner*/.toggle-inner.sc-ion-toggle-md{will-change:background-color, transform}/*!@:host(.toggle-disabled)*/.toggle-disabled.sc-ion-toggle-md-h{opacity:0.3}/*!@:host(.in-item[slot])*/.in-item[slot].sc-ion-toggle-md-h{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:16px;padding-right:0;padding-top:12px;padding-bottom:12px;cursor:pointer}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-item[slot])*/.in-item[slot].sc-ion-toggle-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:0;padding-inline-end:0}}/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-toggle-md-h{padding-left:2px;padding-right:18px;padding-top:12px;padding-bottom:12px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.in-item[slot=start])*/.in-item[slot=start].sc-ion-toggle-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:2px;padding-inline-start:2px;-webkit-padding-end:18px;padding-inline-end:18px}}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @part track - The background track of the toggle.
* @part handle - The toggle handle, or knob, used to change the checked state.
*/
class Toggle {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionChange = createEvent(this, "ionChange", 7);
this.ionFocus = createEvent(this, "ionFocus", 7);
this.ionBlur = createEvent(this, "ionBlur", 7);
this.ionStyle = createEvent(this, "ionStyle", 7);
this.inputId = `ion-tg-${toggleIds++}`;
this.lastDrag = 0;
this.activated = false;
/**
* The name of the control, which is submitted with the form data.
*/
this.name = this.inputId;
/**
* If `true`, the toggle is selected.
*/
this.checked = false;
/**
* If `true`, the user cannot interact with the toggle.
*/
this.disabled = false;
/**
* The value of the toggle does not mean if it's checked or not, use the `checked`
* property for that.
*
* The value of a toggle is analogous to the value of a `<input type="checkbox">`,
* it's only used when the toggle participates in a native `<form>`.
*/
this.value = 'on';
this.onClick = (ev) => {
ev.preventDefault();
if (this.lastDrag + 300 < Date.now()) {
this.checked = !this.checked;
}
};
this.onFocus = () => {
this.ionFocus.emit();
};
this.onBlur = () => {
this.ionBlur.emit();
};
}
checkedChanged(isChecked) {
this.ionChange.emit({
checked: isChecked,
value: this.value
});
}
disabledChanged() {
this.emitStyle();
if (this.gesture) {
this.gesture.enable(!this.disabled);
}
}
async connectedCallback() {
this.gesture = (await Promise.resolve().then(function () { return index$1; })).createGesture({
el: this.el,
gestureName: 'toggle',
gesturePriority: 100,
threshold: 5,
passive: false,
onStart: () => this.onStart(),
onMove: ev => this.onMove(ev),
onEnd: ev => this.onEnd(ev),
});
this.disabledChanged();
}
disconnectedCallback() {
if (this.gesture) {
this.gesture.destroy();
this.gesture = undefined;
}
}
componentWillLoad() {
this.emitStyle();
}
emitStyle() {
this.ionStyle.emit({
'interactive-disabled': this.disabled,
});
}
onStart() {
this.activated = true;
// touch-action does not work in iOS
this.setFocus();
}
onMove(detail) {
if (shouldToggle(document, this.checked, detail.deltaX, -10)) {
this.checked = !this.checked;
hapticSelection();
}
}
onEnd(ev) {
this.activated = false;
this.lastDrag = Date.now();
ev.event.preventDefault();
ev.event.stopImmediatePropagation();
}
getValue() {
return this.value || '';
}
setFocus() {
if (this.focusEl) {
this.focusEl.focus();
}
}
render() {
const { activated, color, checked, disabled, el, inputId, name } = this;
const mode = getIonMode$1(this);
const { label, labelId, labelText } = getAriaLabel(el, inputId);
const value = this.getValue();
renderHiddenInput(true, el, name, (checked ? value : ''), disabled);
return (hAsync(Host, { onClick: this.onClick, "aria-labelledby": label ? labelId : null, "aria-checked": `${checked}`, "aria-hidden": disabled ? 'true' : null, role: "switch", class: createColorClasses$1(color, {
[mode]: true,
'in-item': hostContext('ion-item', el),
'toggle-activated': activated,
'toggle-checked': checked,
'toggle-disabled': disabled,
'interactive': true
}) }, hAsync("div", { class: "toggle-icon", part: "track" }, hAsync("div", { class: "toggle-icon-wrapper" }, hAsync("div", { class: "toggle-inner", part: "handle" }))), hAsync("label", { htmlFor: inputId }, labelText), hAsync("input", { type: "checkbox", role: "switch", "aria-checked": `${checked}`, disabled: disabled, id: inputId, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: focusEl => this.focusEl = focusEl })));
}
get el() { return getElement(this); }
static get watchers() { return {
"checked": ["checkedChanged"],
"disabled": ["disabledChanged"]
}; }
static get style() { return {
ios: toggleIosCss,
md: toggleMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-toggle",
"$members$": {
"color": [513],
"name": [1],
"checked": [1028],
"disabled": [4],
"value": [1],
"activated": [32]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const shouldToggle = (doc, checked, deltaX, margin) => {
const isRTL = doc.dir === 'rtl';
if (checked) {
return (!isRTL && (margin > deltaX)) ||
(isRTL && (-margin < deltaX));
}
else {
return (!isRTL && (-margin < deltaX)) ||
(isRTL && (margin > deltaX));
}
};
let toggleIds = 0;
const toolbarIosCss = "/*!@:host*/.sc-ion-toolbar-ios-h{--border-width:0;--border-style:solid;--opacity:1;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;padding-left:var(--ion-safe-area-left);padding-right:var(--ion-safe-area-right);display:block;position:relative;width:100%;color:var(--color);font-family:var(--ion-font-family, inherit);contain:content;z-index:10;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-toolbar-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-safe-area-left);padding-inline-start:var(--ion-safe-area-left);-webkit-padding-end:var(--ion-safe-area-right);padding-inline-end:var(--ion-safe-area-right)}}/*!@:host(.ion-color)*/.ion-color.sc-ion-toolbar-ios-h{color:var(--ion-color-contrast)}/*!@:host(.ion-color) .toolbar-background*/.ion-color.sc-ion-toolbar-ios-h .toolbar-background.sc-ion-toolbar-ios{background:var(--ion-color-base)}/*!@.toolbar-container*/.toolbar-container.sc-ion-toolbar-ios{padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;min-height:var(--min-height);contain:content;overflow:hidden;z-index:10;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.toolbar-container*/.toolbar-container.sc-ion-toolbar-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.toolbar-background*/.toolbar-background.sc-ion-toolbar-ios{left:0;right:0;top:0;bottom:0;position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);contain:strict;opacity:var(--opacity);z-index:-1;pointer-events:none}/*!@::slotted(ion-progress-bar)*/.sc-ion-toolbar-ios-s>ion-progress-bar{left:0;right:0;bottom:0;position:absolute}/*!@:host*/.sc-ion-toolbar-ios-h{--background:var(--ion-toolbar-background, var(--ion-color-step-50, #fff));--color:var(--ion-toolbar-color, var(--ion-text-color, #000));--border-color:var(--ion-toolbar-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.2))));--padding-top:3px;--padding-bottom:3px;--padding-start:4px;--padding-end:4px;--min-height:44px}/*!@.toolbar-content*/.toolbar-content.sc-ion-toolbar-ios{-ms-flex:1;flex:1;-ms-flex-order:4;order:4;min-width:0}/*!@:host(.toolbar-segment) .toolbar-content*/.toolbar-segment.sc-ion-toolbar-ios-h .toolbar-content.sc-ion-toolbar-ios{display:-ms-inline-flexbox;display:inline-flex}/*!@:host(.toolbar-searchbar) .toolbar-container*/.toolbar-searchbar.sc-ion-toolbar-ios-h .toolbar-container.sc-ion-toolbar-ios{padding-top:0;padding-bottom:0}/*!@:host(.toolbar-searchbar) ::slotted(*)*/.sc-ion-toolbar-ios-h.toolbar-searchbar .sc-ion-toolbar-ios-s>*{-ms-flex-item-align:start;align-self:start}/*!@:host(.toolbar-searchbar) ::slotted(ion-chip)*/.sc-ion-toolbar-ios-h.toolbar-searchbar .sc-ion-toolbar-ios-s>ion-chip{margin-top:3px}/*!@:host(.toolbar-searchbar) ::slotted(ion-back-button)*/.sc-ion-toolbar-ios-h.toolbar-searchbar .sc-ion-toolbar-ios-s>ion-back-button{height:38px}/*!@::slotted(ion-buttons)*/.sc-ion-toolbar-ios-s>ion-buttons{min-height:38px}/*!@::slotted([slot=start])*/.sc-ion-toolbar-ios-s>[slot=start]{-ms-flex-order:2;order:2}/*!@::slotted([slot=secondary])*/.sc-ion-toolbar-ios-s>[slot=secondary]{-ms-flex-order:3;order:3}/*!@::slotted([slot=primary])*/.sc-ion-toolbar-ios-s>[slot=primary]{-ms-flex-order:5;order:5;text-align:end}/*!@::slotted([slot=end])*/.sc-ion-toolbar-ios-s>[slot=end]{-ms-flex-order:6;order:6;text-align:end}/*!@:host(.toolbar-title-large) .toolbar-container*/.toolbar-title-large.sc-ion-toolbar-ios-h .toolbar-container.sc-ion-toolbar-ios{-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:start;align-items:flex-start}/*!@:host(.toolbar-title-large) .toolbar-content ion-title*/.toolbar-title-large.sc-ion-toolbar-ios-h .toolbar-content.sc-ion-toolbar-ios ion-title.sc-ion-toolbar-ios{-ms-flex:1;flex:1;-ms-flex-order:8;order:8;min-width:100%}";
const toolbarMdCss = "/*!@:host*/.sc-ion-toolbar-md-h{--border-width:0;--border-style:solid;--opacity:1;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;padding-left:var(--ion-safe-area-left);padding-right:var(--ion-safe-area-right);display:block;position:relative;width:100%;color:var(--color);font-family:var(--ion-font-family, inherit);contain:content;z-index:10;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-toolbar-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--ion-safe-area-left);padding-inline-start:var(--ion-safe-area-left);-webkit-padding-end:var(--ion-safe-area-right);padding-inline-end:var(--ion-safe-area-right)}}/*!@:host(.ion-color)*/.ion-color.sc-ion-toolbar-md-h{color:var(--ion-color-contrast)}/*!@:host(.ion-color) .toolbar-background*/.ion-color.sc-ion-toolbar-md-h .toolbar-background.sc-ion-toolbar-md{background:var(--ion-color-base)}/*!@.toolbar-container*/.toolbar-container.sc-ion-toolbar-md{padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;min-height:var(--min-height);contain:content;overflow:hidden;z-index:10;-webkit-box-sizing:border-box;box-sizing:border-box}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@.toolbar-container*/.toolbar-container.sc-ion-toolbar-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}/*!@.toolbar-background*/.toolbar-background.sc-ion-toolbar-md{left:0;right:0;top:0;bottom:0;position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);contain:strict;opacity:var(--opacity);z-index:-1;pointer-events:none}/*!@::slotted(ion-progress-bar)*/.sc-ion-toolbar-md-s>ion-progress-bar{left:0;right:0;bottom:0;position:absolute}/*!@:host*/.sc-ion-toolbar-md-h{--background:var(--ion-toolbar-background, var(--ion-background-color, #fff));--color:var(--ion-toolbar-color, var(--ion-text-color, #424242));--border-color:var(--ion-toolbar-border-color, var(--ion-border-color, var(--ion-color-step-150, #c1c4cd)));--padding-top:0;--padding-bottom:0;--padding-start:0;--padding-end:0;--min-height:56px}/*!@.toolbar-content*/.toolbar-content.sc-ion-toolbar-md{-ms-flex:1;flex:1;-ms-flex-order:3;order:3;min-width:0;max-width:100%}/*!@::slotted(ion-segment)*/.sc-ion-toolbar-md-s>ion-segment{min-height:var(--min-height)}/*!@::slotted(.buttons-first-slot)*/.sc-ion-toolbar-md-s>.buttons-first-slot{margin-left:4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(.buttons-first-slot)*/.sc-ion-toolbar-md-s>.buttons-first-slot{margin-left:unset;-webkit-margin-start:4px;margin-inline-start:4px}}/*!@::slotted(.buttons-last-slot)*/.sc-ion-toolbar-md-s>.buttons-last-slot{margin-right:4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@::slotted(.buttons-last-slot)*/.sc-ion-toolbar-md-s>.buttons-last-slot{margin-right:unset;-webkit-margin-end:4px;margin-inline-end:4px}}/*!@::slotted([slot=start])*/.sc-ion-toolbar-md-s>[slot=start]{-ms-flex-order:2;order:2}/*!@::slotted([slot=secondary])*/.sc-ion-toolbar-md-s>[slot=secondary]{-ms-flex-order:4;order:4}/*!@::slotted([slot=primary])*/.sc-ion-toolbar-md-s>[slot=primary]{-ms-flex-order:5;order:5;text-align:end}/*!@::slotted([slot=end])*/.sc-ion-toolbar-md-s>[slot=end]{-ms-flex-order:6;order:6;text-align:end}";
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @slot - Content is placed between the named slots if provided without a slot.
* @slot start - Content is placed to the left of the toolbar text in LTR, and to the right in RTL.
* @slot secondary - Content is placed to the left of the toolbar text in `ios` mode, and directly to the right in `md` mode.
* @slot primary - Content is placed to the right of the toolbar text in `ios` mode, and to the far right in `md` mode.
* @slot end - Content is placed to the right of the toolbar text in LTR, and to the left in RTL.
*/
class Toolbar {
constructor(hostRef) {
registerInstance(this, hostRef);
this.childrenStyles = new Map();
}
componentWillLoad() {
const buttons = Array.from(this.el.querySelectorAll('ion-buttons'));
const firstButtons = buttons.find(button => {
return button.slot === 'start';
});
if (firstButtons) {
firstButtons.classList.add('buttons-first-slot');
}
const buttonsReversed = buttons.reverse();
const lastButtons = buttonsReversed.find(button => button.slot === 'end') ||
buttonsReversed.find(button => button.slot === 'primary') ||
buttonsReversed.find(button => button.slot === 'secondary');
if (lastButtons) {
lastButtons.classList.add('buttons-last-slot');
}
}
childrenStyle(ev) {
ev.stopPropagation();
const tagName = ev.target.tagName;
const updatedStyles = ev.detail;
const newStyles = {};
const childStyles = this.childrenStyles.get(tagName) || {};
let hasStyleChange = false;
Object.keys(updatedStyles).forEach(key => {
const childKey = `toolbar-${key}`;
const newValue = updatedStyles[key];
if (newValue !== childStyles[childKey]) {
hasStyleChange = true;
}
if (newValue) {
newStyles[childKey] = true;
}
});
if (hasStyleChange) {
this.childrenStyles.set(tagName, newStyles);
forceUpdate$1(this);
}
}
render() {
const mode = getIonMode$1(this);
const childStyles = {};
this.childrenStyles.forEach(value => {
Object.assign(childStyles, value);
});
return (hAsync(Host, { class: Object.assign(Object.assign({}, childStyles), createColorClasses$1(this.color, {
[mode]: true,
'in-toolbar': hostContext('ion-toolbar', this.el),
})) }, hAsync("div", { class: "toolbar-background" }), hAsync("div", { class: "toolbar-container" }, hAsync("slot", { name: "start" }), hAsync("slot", { name: "secondary" }), hAsync("div", { class: "toolbar-content" }, hAsync("slot", null)), hAsync("slot", { name: "primary" }), hAsync("slot", { name: "end" }))));
}
get el() { return getElement(this); }
static get style() { return {
ios: toolbarIosCss,
md: toolbarMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-toolbar",
"$members$": {
"color": [513]
},
"$listeners$": [[0, "ionStyle", "childrenStyle"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const titleIosCss = "/*!@:host*/.sc-ion-title-ios-h{--color:initial;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-align:center;align-items:center;-webkit-transform:translateZ(0);transform:translateZ(0);color:var(--color)}/*!@:host(.ion-color)*/.ion-color.sc-ion-title-ios-h{color:var(--ion-color-base)}/*!@.toolbar-title*/.toolbar-title.sc-ion-title-ios{display:block;width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;pointer-events:auto}/*!@:host(.title-small) .toolbar-title*/.title-small.sc-ion-title-ios-h .toolbar-title.sc-ion-title-ios{white-space:normal}/*!@:host*/.sc-ion-title-ios-h{left:0;top:0;padding-left:90px;padding-right:90px;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);position:absolute;width:100%;height:100%;-webkit-transform:translateZ(0);transform:translateZ(0);font-size:17px;font-weight:600;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;pointer-events:none}/*!@:host-context([dir=rtl])*/[dir=rtl].sc-ion-title-ios-h,[dir=rtl] .sc-ion-title-ios-h{left:unset;right:unset;right:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-title-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:90px;padding-inline-start:90px;-webkit-padding-end:90px;padding-inline-end:90px}}/*!@:host(.title-small)*/.title-small.sc-ion-title-ios-h{padding-left:9px;padding-right:9px;padding-top:6px;padding-bottom:16px;position:relative;font-size:13px;font-weight:normal}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.title-small)*/.title-small.sc-ion-title-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:9px;padding-inline-start:9px;-webkit-padding-end:9px;padding-inline-end:9px}}/*!@:host(.title-large)*/.title-large.sc-ion-title-ios-h{padding-left:16px;padding-right:16px;padding-top:0;padding-bottom:0;-webkit-transform-origin:left center;transform-origin:left center;bottom:0;-ms-flex-align:end;align-items:flex-end;min-width:100%;padding-bottom:6px;font-size:34px;font-weight:700;text-align:start}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host(.title-large)*/.title-large.sc-ion-title-ios-h{padding-left:unset;padding-right:unset;-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px}}/*!@:host(.title-large.title-rtl)*/.title-large.title-rtl.sc-ion-title-ios-h{-webkit-transform-origin:right center;transform-origin:right center}/*!@:host(.title-large.ion-cloned-element)*/.title-large.ion-cloned-element.sc-ion-title-ios-h{--color:var(--ion-text-color, #000)}/*!@:host(.title-large) .toolbar-title*/.title-large.sc-ion-title-ios-h .toolbar-title.sc-ion-title-ios{-webkit-transform-origin:inherit;transform-origin:inherit}/*!@:host-context([dir=rtl]):host(.title-large) .toolbar-title, :host-context([dir=rtl]).title-large .toolbar-title*/[dir=rtl].sc-ion-title-ios-h -no-combinator.title-large.sc-ion-title-ios-h .toolbar-title.sc-ion-title-ios,[dir=rtl] .sc-ion-title-ios-h -no-combinator.title-large.sc-ion-title-ios-h .toolbar-title.sc-ion-title-ios,[dir=rtl].title-large.sc-ion-title-ios-h .toolbar-title.sc-ion-title-ios,[dir=rtl] .title-large.sc-ion-title-ios-h .toolbar-title.sc-ion-title-ios{-webkit-transform-origin:calc(100% - inherit);transform-origin:calc(100% - inherit)}";
const titleMdCss = "/*!@:host*/.sc-ion-title-md-h{--color:initial;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-align:center;align-items:center;-webkit-transform:translateZ(0);transform:translateZ(0);color:var(--color)}/*!@:host(.ion-color)*/.ion-color.sc-ion-title-md-h{color:var(--ion-color-base)}/*!@.toolbar-title*/.toolbar-title.sc-ion-title-md{display:block;width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;pointer-events:auto}/*!@:host(.title-small) .toolbar-title*/.title-small.sc-ion-title-md-h .toolbar-title.sc-ion-title-md{white-space:normal}/*!@:host*/.sc-ion-title-md-h{padding-left:20px;padding-right:20px;padding-top:0;padding-bottom:0;font-size:20px;font-weight:500;letter-spacing:0.0125em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){/*!@:host*/.sc-ion-title-md-h{padding-left:unset;padding-right:unset;-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:20px;padding-inline-end:20px}}/*!@:host(.title-small)*/.title-small.sc-ion-title-md-h{width:100%;height:100%;font-size:15px;font-weight:normal}";
class ToolbarTitle {
constructor(hostRef) {
registerInstance(this, hostRef);
this.ionStyle = createEvent(this, "ionStyle", 7);
}
sizeChanged() {
this.emitStyle();
}
connectedCallback() {
this.emitStyle();
}
emitStyle() {
const size = this.getSize();
this.ionStyle.emit({
[`title-${size}`]: true
});
}
getSize() {
return (this.size !== undefined) ? this.size : 'default';
}
render() {
const mode = getIonMode$1(this);
const size = this.getSize();
return (hAsync(Host, { class: createColorClasses$1(this.color, {
[mode]: true,
[`title-${size}`]: true,
'title-rtl': document.dir === 'rtl'
}) }, hAsync("div", { class: "toolbar-title" }, hAsync("slot", null))));
}
get el() { return getElement(this); }
static get watchers() { return {
"size": ["sizeChanged"]
}; }
static get style() { return {
ios: titleIosCss,
md: titleMdCss
}; }
static get cmpMeta() { return {
"$flags$": 41,
"$tagName$": "ion-title",
"$members$": {
"color": [513],
"size": [1]
},
"$listeners$": undefined,
"$lazyBundleId$": "-",
"$attrsToReflect$": [["color", "color"]]
}; }
}
const CELL_TYPE_ITEM = 'item';
const CELL_TYPE_HEADER = 'header';
const CELL_TYPE_FOOTER = 'footer';
const NODE_CHANGE_NONE = 0;
const NODE_CHANGE_POSITION = 1;
const NODE_CHANGE_CELL = 2;
const MIN_READS = 2;
const updateVDom = (dom, heightIndex, cells, range) => {
// reset dom
for (const node of dom) {
node.change = NODE_CHANGE_NONE;
node.d = true;
}
// try to match into exisiting dom
const toMutate = [];
const end = range.offset + range.length;
for (let i = range.offset; i < end; i++) {
const cell = cells[i];
const node = dom.find(n => n.d && n.cell === cell);
if (node) {
const top = heightIndex[i];
if (top !== node.top) {
node.top = top;
node.change = NODE_CHANGE_POSITION;
}
node.d = false;
}
else {
toMutate.push(cell);
}
}
// needs to append
const pool = dom.filter(n => n.d);
for (const cell of toMutate) {
const node = pool.find(n => n.d && n.cell.type === cell.type);
const index = cell.i;
if (node) {
node.d = false;
node.change = NODE_CHANGE_CELL;
node.cell = cell;
node.top = heightIndex[index];
}
else {
dom.push({
d: false,
cell,
visible: true,
change: NODE_CHANGE_CELL,
top: heightIndex[index],
});
}
}
dom
.filter(n => n.d && n.top !== -9999)
.forEach(n => {
n.change = NODE_CHANGE_POSITION;
n.top = -9999;
});
};
const doRender = (el, nodeRender, dom, updateCellHeight) => {
const children = Array.from(el.children).filter(n => n.tagName !== 'TEMPLATE');
const childrenNu = children.length;
let child;
for (let i = 0; i < dom.length; i++) {
const node = dom[i];
const cell = node.cell;
// the cell change, the content must be updated
if (node.change === NODE_CHANGE_CELL) {
if (i < childrenNu) {
child = children[i];
nodeRender(child, cell, i);
}
else {
const newChild = createNode(el, cell.type);
child = nodeRender(newChild, cell, i) || newChild;
child.classList.add('virtual-item');
el.appendChild(child);
}
child['$ionCell'] = cell;
}
else {
child = children[i];
}
// only update position when it changes
if (node.change !== NODE_CHANGE_NONE) {
child.style.transform = `translate3d(0,${node.top}px,0)`;
}
// update visibility
const visible = cell.visible;
if (node.visible !== visible) {
if (visible) {
child.classList.remove('virtual-loading');
}
else {
child.classList.add('virtual-loading');
}
node.visible = visible;
}
// dynamic height
if (cell.reads > 0) {
updateCellHeight(cell, child);
cell.reads--;
}
}
};
const createNode = (el, type) => {
const template = getTemplate(el, type);
if (template && el.ownerDocument) {
return el.ownerDocument.importNode(template.content, true).children[0];
}
return null;
};
const getTemplate = (el, type) => {
switch (type) {
case CELL_TYPE_ITEM: return el.querySelector('template:not([name])');
case CELL_TYPE_HEADER: return el.querySelector('template[name=header]');
case CELL_TYPE_FOOTER: return el.querySelector('template[name=footer]');
}
};
const getViewport = (scrollTop, vierportHeight, margin) => {
return {
top: Math.max(scrollTop - margin, 0),
bottom: scrollTop + vierportHeight + margin
};
};
const getRange = (heightIndex, viewport, buffer) => {
const topPos = viewport.top;
const bottomPos = viewport.bottom;
// find top index
let i = 0;
for (; i < heightIndex.length; i++) {
if (heightIndex[i] > topPos) {
break;
}
}
const offset = Math.max(i - buffer - 1, 0);
// find bottom index
for (; i < heightIndex.length; i++) {
if (heightIndex[i] >= bottomPos) {
break;
}
}
const end = Math.min(i + buffer, heightIndex.length);
const length = end - offset;
return { offset, length };
};
const getShouldUpdate = (dirtyIndex, currentRange, range) => {
const end = range.offset + range.length;
return (dirtyIndex <= end ||
currentRange.offset !== range.offset ||
currentRange.length !== range.length);
};
const findCellIndex = (cells, index) => {
const max = cells.length > 0 ? cells[cells.length - 1].index : 0;
if (index === 0) {
return 0;
}
else if (index === max + 1) {
return cells.length;
}
else {
return cells.findIndex(c => c.index === index);
}
};
const inplaceUpdate = (dst, src, offset) => {
if (offset === 0 && src.length >= dst.length) {
return src;
}
for (let i = 0; i < src.length; i++) {
dst[i + offset] = src[i];
}
return dst;
};
const calcCells = (items, itemHeight, headerHeight, footerHeight, headerFn, footerFn, approxHeaderHeight, approxFooterHeight, approxItemHeight, j, offset, len) => {
const cells = [];
const end = len + offset;
for (let i = offset; i < end; i++) {
const item = items[i];
if (headerFn) {
const value = headerFn(item, i, items);
if (value != null) {
cells.push({
i: j++,
type: CELL_TYPE_HEADER,
value,
index: i,
height: headerHeight ? headerHeight(value, i) : approxHeaderHeight,
reads: headerHeight ? 0 : MIN_READS,
visible: !!headerHeight,
});
}
}
cells.push({
i: j++,
type: CELL_TYPE_ITEM,
value: item,
index: i,
height: itemHeight ? itemHeight(item, i) : approxItemHeight,
reads: itemHeight ? 0 : MIN_READS,
visible: !!itemHeight,
});
if (footerFn) {
const value = footerFn(item, i, items);
if (value != null) {
cells.push({
i: j++,
type: CELL_TYPE_FOOTER,
value,
index: i,
height: footerHeight ? footerHeight(value, i) : approxFooterHeight,
reads: footerHeight ? 0 : MIN_READS,
visible: !!footerHeight,
});
}
}
}
return cells;
};
const calcHeightIndex = (buf, cells, index) => {
let acum = buf[index];
for (let i = index; i < buf.length; i++) {
buf[i] = acum;
acum += cells[i].height;
}
return acum;
};
const resizeBuffer = (buf, len) => {
if (!buf) {
return new Uint32Array(len);
}
if (buf.length === len) {
return buf;
}
else if (len > buf.length) {
const newBuf = new Uint32Array(len);
newBuf.set(buf);
return newBuf;
}
else {
return buf.subarray(0, len);
}
};
const positionForIndex = (index, cells, heightIndex) => {
const cell = cells.find(c => c.type === CELL_TYPE_ITEM && c.index === index);
if (cell) {
return heightIndex[cell.i];
}
return -1;
};
const virtualScrollCss = "ion-virtual-scroll{display:block;position:relative;width:100%;contain:strict;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ion-virtual-scroll>.virtual-loading{opacity:0}ion-virtual-scroll>.virtual-item{position:absolute !important;top:0 !important;right:0 !important;left:0 !important;-webkit-transition-duration:0ms;transition-duration:0ms;will-change:transform}";
class VirtualScroll {
constructor(hostRef) {
registerInstance(this, hostRef);
this.range = { offset: 0, length: 0 };
this.viewportHeight = 0;
this.cells = [];
this.virtualDom = [];
this.isEnabled = false;
this.viewportOffset = 0;
this.currentScrollTop = 0;
this.indexDirty = 0;
this.lastItemLen = 0;
this.totalHeight = 0;
/**
* It is important to provide this
* if virtual item height will be significantly larger than the default
* The approximate height of each virtual item template's cell.
* This dimension is used to help determine how many cells should
* be created when initialized, and to help calculate the height of
* the scrollable area. This height value can only use `px` units.
* Note that the actual rendered size of each cell comes from the
* app's CSS, whereas this approximation is used to help calculate
* initial dimensions before the item has been rendered.
*/
this.approxItemHeight = 45;
/**
* The approximate height of each header template's cell.
* This dimension is used to help determine how many cells should
* be created when initialized, and to help calculate the height of
* the scrollable area. This height value can only use `px` units.
* Note that the actual rendered size of each cell comes from the
* app's CSS, whereas this approximation is used to help calculate
* initial dimensions before the item has been rendered.
*/
this.approxHeaderHeight = 30;
/**
* The approximate width of each footer template's cell.
* This dimension is used to help determine how many cells should
* be created when initialized, and to help calculate the height of
* the scrollable area. This height value can only use `px` units.
* Note that the actual rendered size of each cell comes from the
* app's CSS, whereas this approximation is used to help calculate
* initial dimensions before the item has been rendered.
*/
this.approxFooterHeight = 30;
this.onScroll = () => {
this.updateVirtualScroll();
};
}
itemsChanged() {
this.calcCells();
this.updateVirtualScroll();
}
async connectedCallback() {
const contentEl = this.el.closest('ion-content');
if (!contentEl) {
console.error('<ion-virtual-scroll> must be used inside an <ion-content>');
return;
}
this.scrollEl = await contentEl.getScrollElement();
this.contentEl = contentEl;
this.calcCells();
this.updateState();
}
componentDidUpdate() {
this.updateState();
}
disconnectedCallback() {
this.scrollEl = undefined;
}
onResize() {
this.calcCells();
this.updateVirtualScroll();
}
/**
* Returns the position of the virtual item at the given index.
*/
positionForItem(index) {
return Promise.resolve(positionForIndex(index, this.cells, this.getHeightIndex()));
}
/**
* This method marks a subset of items as dirty, so they can be re-rendered. Items should be marked as
* dirty any time the content or their style changes.
*
* The subset of items to be updated can are specifing by an offset and a length.
*/
async checkRange(offset, len = -1) {
// TODO: kind of hacky how we do in-place updated of the cells
// array. this part needs a complete refactor
if (!this.items) {
return;
}
const length = (len === -1)
? this.items.length - offset
: len;
const cellIndex = findCellIndex(this.cells, offset);
const cells = calcCells(this.items, this.itemHeight, this.headerHeight, this.footerHeight, this.headerFn, this.footerFn, this.approxHeaderHeight, this.approxFooterHeight, this.approxItemHeight, cellIndex, offset, length);
this.cells = inplaceUpdate(this.cells, cells, cellIndex);
this.lastItemLen = this.items.length;
this.indexDirty = Math.max(offset - 1, 0);
this.scheduleUpdate();
}
/**
* This method marks the tail the items array as dirty, so they can be re-rendered.
*
* It's equivalent to calling:
*
* ```js
* virtualScroll.checkRange(lastItemLen);
* ```
*/
async checkEnd() {
if (this.items) {
this.checkRange(this.lastItemLen);
}
}
updateVirtualScroll() {
// do nothing if virtual-scroll is disabled
if (!this.isEnabled || !this.scrollEl) {
return;
}
// unschedule future updates
if (this.timerUpdate) {
clearTimeout(this.timerUpdate);
this.timerUpdate = undefined;
}
// schedule DOM operations into the stencil queue
readTask(this.readVS.bind(this));
writeTask(this.writeVS.bind(this));
}
readVS() {
const { contentEl, scrollEl, el } = this;
let topOffset = 0;
let node = el;
while (node && node !== contentEl) {
topOffset += node.offsetTop;
node = node.offsetParent;
}
this.viewportOffset = topOffset;
if (scrollEl) {
this.viewportHeight = scrollEl.offsetHeight;
this.currentScrollTop = scrollEl.scrollTop;
}
}
writeVS() {
const dirtyIndex = this.indexDirty;
// get visible viewport
const scrollTop = this.currentScrollTop - this.viewportOffset;
const viewport = getViewport(scrollTop, this.viewportHeight, 100);
// compute lazily the height index
const heightIndex = this.getHeightIndex();
// get array bounds of visible cells base in the viewport
const range = getRange(heightIndex, viewport, 2);
// fast path, do nothing
const shouldUpdate = getShouldUpdate(dirtyIndex, this.range, range);
if (!shouldUpdate) {
return;
}
this.range = range;
// in place mutation of the virtual DOM
updateVDom(this.virtualDom, heightIndex, this.cells, range);
// Write DOM
// Different code paths taken depending of the render API used
if (this.nodeRender) {
doRender(this.el, this.nodeRender, this.virtualDom, this.updateCellHeight.bind(this));
}
else if (this.domRender) {
this.domRender(this.virtualDom);
}
else if (this.renderItem) {
forceUpdate$1(this);
}
}
updateCellHeight(cell, node) {
const update = () => {
if (node['$ionCell'] === cell) {
const style = window.getComputedStyle(node);
const height = node.offsetHeight + parseFloat(style.getPropertyValue('margin-bottom'));
this.setCellHeight(cell, height);
}
};
if (node) {
componentOnReady(node, update);
}
else {
update();
}
}
setCellHeight(cell, height) {
const index = cell.i;
// the cell might changed since the height update was scheduled
if (cell !== this.cells[index]) {
return;
}
if (cell.height !== height || cell.visible !== true) {
cell.visible = true;
cell.height = height;
this.indexDirty = Math.min(this.indexDirty, index);
this.scheduleUpdate();
}
}
scheduleUpdate() {
clearTimeout(this.timerUpdate);
this.timerUpdate = setTimeout(() => this.updateVirtualScroll(), 100);
}
updateState() {
const shouldEnable = !!(this.scrollEl &&
this.cells);
if (shouldEnable !== this.isEnabled) {
this.enableScrollEvents(shouldEnable);
if (shouldEnable) {
this.updateVirtualScroll();
}
}
}
calcCells() {
if (!this.items) {
return;
}
this.lastItemLen = this.items.length;
this.cells = calcCells(this.items, this.itemHeight, this.headerHeight, this.footerHeight, this.headerFn, this.footerFn, this.approxHeaderHeight, this.approxFooterHeight, this.approxItemHeight, 0, 0, this.lastItemLen);
this.indexDirty = 0;
}
getHeightIndex() {
if (this.indexDirty !== Infinity) {
this.calcHeightIndex(this.indexDirty);
}
return this.heightIndex;
}
calcHeightIndex(index = 0) {
// TODO: optimize, we don't need to calculate all the cells
this.heightIndex = resizeBuffer(this.heightIndex, this.cells.length);
this.totalHeight = calcHeightIndex(this.heightIndex, this.cells, index);
this.indexDirty = Infinity;
}
enableScrollEvents(shouldListen) {
if (this.rmEvent) {
this.rmEvent();
this.rmEvent = undefined;
}
const scrollEl = this.scrollEl;
if (scrollEl) {
this.isEnabled = shouldListen;
scrollEl.addEventListener('scroll', this.onScroll);
this.rmEvent = () => {
scrollEl.removeEventListener('scroll', this.onScroll);
};
}
}
renderVirtualNode(node) {
const { type, value, index } = node.cell;
switch (type) {
case CELL_TYPE_ITEM: return this.renderItem(value, index);
case CELL_TYPE_HEADER: return this.renderHeader(value, index);
case CELL_TYPE_FOOTER: return this.renderFooter(value, index);
}
}
render() {
return (hAsync(Host, { style: {
height: `${this.totalHeight}px`
} }, this.renderItem && (hAsync(VirtualProxy, { dom: this.virtualDom }, this.virtualDom.map(node => this.renderVirtualNode(node))))));
}
get el() { return getElement(this); }
static get watchers() { return {
"itemHeight": ["itemsChanged"],
"headerHeight": ["itemsChanged"],
"footerHeight": ["itemsChanged"],
"items": ["itemsChanged"]
}; }
static get style() { return virtualScrollCss; }
static get cmpMeta() { return {
"$flags$": 0,
"$tagName$": "ion-virtual-scroll",
"$members$": {
"approxItemHeight": [2, "approx-item-height"],
"approxHeaderHeight": [2, "approx-header-height"],
"approxFooterHeight": [2, "approx-footer-height"],
"headerFn": [16],
"footerFn": [16],
"items": [16],
"itemHeight": [16],
"headerHeight": [16],
"footerHeight": [16],
"renderItem": [16],
"renderHeader": [16],
"renderFooter": [16],
"nodeRender": [16],
"domRender": [16],
"totalHeight": [32],
"positionForItem": [64],
"checkRange": [64],
"checkEnd": [64]
},
"$listeners$": [[9, "resize", "onResize"]],
"$lazyBundleId$": "-",
"$attrsToReflect$": []
}; }
}
const VirtualProxy = ({ dom }, children, utils) => {
return utils.map(children, (child, i) => {
const node = dom[i];
const vattrs = child.vattrs || {};
let classes = vattrs.class || '';
classes += 'virtual-item ';
if (!node.visible) {
classes += 'virtual-loading';
}
return Object.assign(Object.assign({}, child), { vattrs: Object.assign(Object.assign({}, vattrs), { class: classes, style: Object.assign(Object.assign({}, vattrs.style), { transform: `translate3d(0,${node.top}px,0)` }) }) });
});
};
registerComponents([
ActionSheet,
Alert,
App,
Avatar,
BackButton,
Backdrop,
Badge,
Button,
Buttons,
Card,
CardContent,
CardHeader,
CardSubtitle,
CardTitle,
Checkbox,
Chip,
Col,
Content,
Datetime,
Fab,
FabButton,
FabList,
Footer,
Grid,
Header,
Icon,
Img,
InfiniteScroll,
InfiniteScrollContent,
Input,
Item,
ItemDivider,
ItemGroup,
ItemOption,
ItemOptions,
ItemSliding,
Label,
List,
ListHeader,
Loading,
Menu,
MenuButton,
MenuToggle,
Modal,
Nav,
NavLink,
Note,
Picker,
PickerColumnCmp,
Popover,
ProgressBar,
Radio,
RadioGroup,
Range,
Refresher,
RefresherContent,
Reorder,
ReorderGroup,
RippleEffect,
Route,
RouteRedirect,
Router,
RouterLink,
RouterOutlet,
Row,
Searchbar,
Segment,
SegmentButton,
Select,
SelectOption,
SelectPopover,
SkeletonText,
Slide,
Slides,
Spinner,
SplitPane,
Tab,
TabBar,
TabButton,
Tabs,
Text,
Textarea,
Thumbnail,
Toast,
Toggle,
Toolbar,
ToolbarTitle,
VirtualScroll,
]);
const DURATION = 540;
const getClonedElement = (tagName) => {
return document.querySelector(`${tagName}.ion-cloned-element`);
};
const shadow = (el) => {
return el.shadowRoot || el;
};
const getLargeTitle = (refEl) => {
const tabs = (refEl.tagName === 'ION-TABS') ? refEl : refEl.querySelector('ion-tabs');
const query = 'ion-content ion-header:not(.header-collapse-condense-inactive) ion-title.title-large';
if (tabs != null) {
const activeTab = tabs.querySelector('ion-tab:not(.tab-hidden), .ion-page:not(.ion-page-hidden)');
return (activeTab != null) ? activeTab.querySelector(query) : null;
}
return refEl.querySelector(query);
};
const getBackButton = (refEl, backDirection) => {
const tabs = (refEl.tagName === 'ION-TABS') ? refEl : refEl.querySelector('ion-tabs');
let buttonsList = [];
if (tabs != null) {
const activeTab = tabs.querySelector('ion-tab:not(.tab-hidden), .ion-page:not(.ion-page-hidden)');
if (activeTab != null) {
buttonsList = activeTab.querySelectorAll('ion-buttons');
}
}
else {
buttonsList = refEl.querySelectorAll('ion-buttons');
}
for (const buttons of buttonsList) {
const parentHeader = buttons.closest('ion-header');
const activeHeader = parentHeader && !parentHeader.classList.contains('header-collapse-condense-inactive');
const backButton = buttons.querySelector('ion-back-button');
const buttonsCollapse = buttons.classList.contains('buttons-collapse');
const startSlot = buttons.slot === 'start' || buttons.slot === '';
if (backButton !== null && startSlot && ((buttonsCollapse && activeHeader && backDirection) || !buttonsCollapse)) {
return backButton;
}
}
return null;
};
const createLargeTitleTransition = (rootAnimation, rtl, backDirection, enteringEl, leavingEl) => {
const enteringBackButton = getBackButton(enteringEl, backDirection);
const leavingLargeTitle = getLargeTitle(leavingEl);
const enteringLargeTitle = getLargeTitle(enteringEl);
const leavingBackButton = getBackButton(leavingEl, backDirection);
const shouldAnimationForward = enteringBackButton !== null && leavingLargeTitle !== null && !backDirection;
const shouldAnimationBackward = enteringLargeTitle !== null && leavingBackButton !== null && backDirection;
if (shouldAnimationForward) {
const leavingLargeTitleBox = leavingLargeTitle.getBoundingClientRect();
const enteringBackButtonBox = enteringBackButton.getBoundingClientRect();
animateLargeTitle(rootAnimation, rtl, backDirection, leavingLargeTitle, leavingLargeTitleBox, enteringBackButtonBox);
animateBackButton(rootAnimation, rtl, backDirection, enteringBackButton, leavingLargeTitleBox, enteringBackButtonBox);
}
else if (shouldAnimationBackward) {
const enteringLargeTitleBox = enteringLargeTitle.getBoundingClientRect();
const leavingBackButtonBox = leavingBackButton.getBoundingClientRect();
animateLargeTitle(rootAnimation, rtl, backDirection, enteringLargeTitle, enteringLargeTitleBox, leavingBackButtonBox);
animateBackButton(rootAnimation, rtl, backDirection, leavingBackButton, enteringLargeTitleBox, leavingBackButtonBox);
}
return {
forward: shouldAnimationForward,
backward: shouldAnimationBackward
};
};
const animateBackButton = (rootAnimation, rtl, backDirection, backButtonEl, largeTitleBox, backButtonBox) => {
const BACK_BUTTON_START_OFFSET = (rtl) ? `calc(100% - ${backButtonBox.right + 4}px)` : `${backButtonBox.left - 4}px`;
const START_TEXT_TRANSLATE = (rtl) ? '7px' : '-7px';
const END_TEXT_TRANSLATE = (rtl) ? '-4px' : '4px';
const ICON_TRANSLATE = (rtl) ? '-4px' : '4px';
const TEXT_ORIGIN_X = (rtl) ? 'right' : 'left';
const ICON_ORIGIN_X = (rtl) ? 'left' : 'right';
const FORWARD_TEXT_KEYFRAMES = [
{ offset: 0, opacity: 0, transform: `translate3d(${START_TEXT_TRANSLATE}, ${largeTitleBox.top - 40}px, 0) scale(2.1)` },
{ offset: 1, opacity: 1, transform: `translate3d(${END_TEXT_TRANSLATE}, ${backButtonBox.top - 46}px, 0) scale(1)` }
];
const BACKWARD_TEXT_KEYFRAMES = [
{ offset: 0, opacity: 1, transform: `translate3d(${END_TEXT_TRANSLATE}, ${backButtonBox.top - 46}px, 0) scale(1)` },
{ offset: 0.6, opacity: 0 },
{ offset: 1, opacity: 0, transform: `translate3d(${START_TEXT_TRANSLATE}, ${largeTitleBox.top - 40}px, 0) scale(2.1)` }
];
const TEXT_KEYFRAMES = (backDirection) ? BACKWARD_TEXT_KEYFRAMES : FORWARD_TEXT_KEYFRAMES;
const FORWARD_ICON_KEYFRAMES = [
{ offset: 0, opacity: 0, transform: `translate3d(${ICON_TRANSLATE}, ${backButtonBox.top - 41}px, 0) scale(0.6)` },
{ offset: 1, opacity: 1, transform: `translate3d(${ICON_TRANSLATE}, ${backButtonBox.top - 46}px, 0) scale(1)` }
];
const BACKWARD_ICON_KEYFRAMES = [
{ offset: 0, opacity: 1, transform: `translate3d(${ICON_TRANSLATE}, ${backButtonBox.top - 46}px, 0) scale(1)` },
{ offset: 0.2, opacity: 0, transform: `translate3d(${ICON_TRANSLATE}, ${backButtonBox.top - 41}px, 0) scale(0.6)` },
{ offset: 1, opacity: 0, transform: `translate3d(${ICON_TRANSLATE}, ${backButtonBox.top - 41}px, 0) scale(0.6)` }
];
const ICON_KEYFRAMES = (backDirection) ? BACKWARD_ICON_KEYFRAMES : FORWARD_ICON_KEYFRAMES;
const enteringBackButtonTextAnimation = createAnimation();
const enteringBackButtonIconAnimation = createAnimation();
const clonedBackButtonEl = getClonedElement('ion-back-button');
const backButtonTextEl = shadow(clonedBackButtonEl).querySelector('.button-text');
const backButtonIconEl = shadow(clonedBackButtonEl).querySelector('ion-icon');
clonedBackButtonEl.text = backButtonEl.text;
clonedBackButtonEl.mode = backButtonEl.mode;
clonedBackButtonEl.icon = backButtonEl.icon;
clonedBackButtonEl.color = backButtonEl.color;
clonedBackButtonEl.disabled = backButtonEl.disabled;
clonedBackButtonEl.style.setProperty('display', 'block');
clonedBackButtonEl.style.setProperty('position', 'fixed');
enteringBackButtonIconAnimation.addElement(backButtonIconEl);
enteringBackButtonTextAnimation.addElement(backButtonTextEl);
enteringBackButtonTextAnimation
.beforeStyles({
'transform-origin': `${TEXT_ORIGIN_X} center`
})
.beforeAddWrite(() => {
backButtonEl.style.setProperty('display', 'none');
clonedBackButtonEl.style.setProperty(TEXT_ORIGIN_X, BACK_BUTTON_START_OFFSET);
})
.afterAddWrite(() => {
backButtonEl.style.setProperty('display', '');
clonedBackButtonEl.style.setProperty('display', 'none');
clonedBackButtonEl.style.removeProperty(TEXT_ORIGIN_X);
})
.keyframes(TEXT_KEYFRAMES);
enteringBackButtonIconAnimation
.beforeStyles({
'transform-origin': `${ICON_ORIGIN_X} center`
})
.keyframes(ICON_KEYFRAMES);
rootAnimation.addAnimation([enteringBackButtonTextAnimation, enteringBackButtonIconAnimation]);
};
const animateLargeTitle = (rootAnimation, rtl, backDirection, largeTitleEl, largeTitleBox, backButtonBox) => {
const TITLE_START_OFFSET = (rtl) ? `calc(100% - ${largeTitleBox.right}px)` : `${largeTitleBox.left}px`;
const START_TRANSLATE = (rtl) ? '-18px' : '18px';
const ORIGIN_X = (rtl) ? 'right' : 'left';
const BACKWARDS_KEYFRAMES = [
{ offset: 0, opacity: 0, transform: `translate3d(${START_TRANSLATE}, ${backButtonBox.top - 4}px, 0) scale(0.49)` },
{ offset: 0.1, opacity: 0 },
{ offset: 1, opacity: 1, transform: `translate3d(0, ${largeTitleBox.top - 2}px, 0) scale(1)` }
];
const FORWARDS_KEYFRAMES = [
{ offset: 0, opacity: 0.99, transform: `translate3d(0, ${largeTitleBox.top - 2}px, 0) scale(1)` },
{ offset: 0.6, opacity: 0 },
{ offset: 1, opacity: 0, transform: `translate3d(${START_TRANSLATE}, ${backButtonBox.top - 4}px, 0) scale(0.5)` }
];
const KEYFRAMES = (backDirection) ? BACKWARDS_KEYFRAMES : FORWARDS_KEYFRAMES;
const clonedTitleEl = getClonedElement('ion-title');
const clonedLargeTitleAnimation = createAnimation();
clonedTitleEl.innerText = largeTitleEl.innerText;
clonedTitleEl.size = largeTitleEl.size;
clonedTitleEl.color = largeTitleEl.color;
clonedLargeTitleAnimation.addElement(clonedTitleEl);
clonedLargeTitleAnimation
.beforeStyles({
'transform-origin': `${ORIGIN_X} center`,
'height': '46px',
'display': '',
'position': 'relative',
[ORIGIN_X]: TITLE_START_OFFSET
})
.beforeAddWrite(() => {
largeTitleEl.style.setProperty('display', 'none');
})
.afterAddWrite(() => {
largeTitleEl.style.setProperty('display', '');
clonedTitleEl.style.setProperty('display', 'none');
})
.keyframes(KEYFRAMES);
rootAnimation.addAnimation(clonedLargeTitleAnimation);
};
const iosTransitionAnimation = (navEl, opts) => {
try {
const EASING = 'cubic-bezier(0.32,0.72,0,1)';
const OPACITY = 'opacity';
const TRANSFORM = 'transform';
const CENTER = '0%';
const OFF_OPACITY = 0.8;
const isRTL = navEl.ownerDocument.dir === 'rtl';
const OFF_RIGHT = isRTL ? '-99.5%' : '99.5%';
const OFF_LEFT = isRTL ? '33%' : '-33%';
const enteringEl = opts.enteringEl;
const leavingEl = opts.leavingEl;
const backDirection = (opts.direction === 'back');
const contentEl = enteringEl.querySelector(':scope > ion-content');
const headerEls = enteringEl.querySelectorAll(':scope > ion-header > *:not(ion-toolbar), :scope > ion-footer > *');
const enteringToolBarEls = enteringEl.querySelectorAll(':scope > ion-header > ion-toolbar');
const rootAnimation = createAnimation();
const enteringContentAnimation = createAnimation();
rootAnimation
.addElement(enteringEl)
.duration(opts.duration || DURATION)
.easing(opts.easing || EASING)
.fill('both')
.beforeRemoveClass('ion-page-invisible');
if (leavingEl && navEl) {
const navDecorAnimation = createAnimation();
navDecorAnimation.addElement(navEl);
rootAnimation.addAnimation(navDecorAnimation);
}
if (!contentEl && enteringToolBarEls.length === 0 && headerEls.length === 0) {
enteringContentAnimation.addElement(enteringEl.querySelector(':scope > .ion-page, :scope > ion-nav, :scope > ion-tabs')); // REVIEW
}
else {
enteringContentAnimation.addElement(contentEl); // REVIEW
enteringContentAnimation.addElement(headerEls);
}
rootAnimation.addAnimation(enteringContentAnimation);
if (backDirection) {
enteringContentAnimation
.beforeClearStyles([OPACITY])
.fromTo('transform', `translateX(${OFF_LEFT})`, `translateX(${CENTER})`)
.fromTo(OPACITY, OFF_OPACITY, 1);
}
else {
// entering content, forward direction
enteringContentAnimation
.beforeClearStyles([OPACITY])
.fromTo('transform', `translateX(${OFF_RIGHT})`, `translateX(${CENTER})`);
}
if (contentEl) {
const enteringTransitionEffectEl = shadow(contentEl).querySelector('.transition-effect');
if (enteringTransitionEffectEl) {
const enteringTransitionCoverEl = enteringTransitionEffectEl.querySelector('.transition-cover');
const enteringTransitionShadowEl = enteringTransitionEffectEl.querySelector('.transition-shadow');
const enteringTransitionEffect = createAnimation();
const enteringTransitionCover = createAnimation();
const enteringTransitionShadow = createAnimation();
enteringTransitionEffect
.addElement(enteringTransitionEffectEl)
.beforeStyles({ opacity: '1', display: 'block' })
.afterStyles({ opacity: '', display: '' });
enteringTransitionCover
.addElement(enteringTransitionCoverEl) // REVIEW
.beforeClearStyles([OPACITY])
.fromTo(OPACITY, 0, 0.1);
enteringTransitionShadow
.addElement(enteringTransitionShadowEl) // REVIEW
.beforeClearStyles([OPACITY])
.fromTo(OPACITY, 0.03, 0.70);
enteringTransitionEffect.addAnimation([enteringTransitionCover, enteringTransitionShadow]);
enteringContentAnimation.addAnimation([enteringTransitionEffect]);
}
}
const enteringContentHasLargeTitle = enteringEl.querySelector('ion-header.header-collapse-condense');
const { forward, backward } = createLargeTitleTransition(rootAnimation, isRTL, backDirection, enteringEl, leavingEl);
enteringToolBarEls.forEach(enteringToolBarEl => {
const enteringToolBar = createAnimation();
enteringToolBar.addElement(enteringToolBarEl);
rootAnimation.addAnimation(enteringToolBar);
const enteringTitle = createAnimation();
enteringTitle.addElement(enteringToolBarEl.querySelector('ion-title')); // REVIEW
const enteringToolBarButtons = createAnimation();
const buttons = Array.from(enteringToolBarEl.querySelectorAll('ion-buttons,[menuToggle]'));
const parentHeader = enteringToolBarEl.closest('ion-header');
const inactiveHeader = parentHeader && parentHeader.classList.contains('header-collapse-condense-inactive');
let buttonsToAnimate;
if (backDirection) {
buttonsToAnimate = buttons.filter(button => {
const isCollapseButton = button.classList.contains('buttons-collapse');
return (isCollapseButton && !inactiveHeader) || !isCollapseButton;
});
}
else {
buttonsToAnimate = buttons.filter(button => !button.classList.contains('buttons-collapse'));
}
enteringToolBarButtons.addElement(buttonsToAnimate);
const enteringToolBarItems = createAnimation();
enteringToolBarItems.addElement(enteringToolBarEl.querySelectorAll(':scope > *:not(ion-title):not(ion-buttons):not([menuToggle])'));
const enteringToolBarBg = createAnimation();
enteringToolBarBg.addElement(shadow(enteringToolBarEl).querySelector('.toolbar-background')); // REVIEW
const enteringBackButton = createAnimation();
const backButtonEl = enteringToolBarEl.querySelector('ion-back-button');
if (backButtonEl) {
enteringBackButton.addElement(backButtonEl);
}
enteringToolBar.addAnimation([enteringTitle, enteringToolBarButtons, enteringToolBarItems, enteringToolBarBg, enteringBackButton]);
enteringToolBarButtons.fromTo(OPACITY, 0.01, 1);
enteringToolBarItems.fromTo(OPACITY, 0.01, 1);
if (backDirection) {
if (!inactiveHeader) {
enteringTitle
.fromTo('transform', `translateX(${OFF_LEFT})`, `translateX(${CENTER})`)
.fromTo(OPACITY, 0.01, 1);
}
enteringToolBarItems.fromTo('transform', `translateX(${OFF_LEFT})`, `translateX(${CENTER})`);
// back direction, entering page has a back button
enteringBackButton.fromTo(OPACITY, 0.01, 1);
}
else {
// entering toolbar, forward direction
if (!enteringContentHasLargeTitle) {
enteringTitle
.fromTo('transform', `translateX(${OFF_RIGHT})`, `translateX(${CENTER})`)
.fromTo(OPACITY, 0.01, 1);
}
enteringToolBarItems.fromTo('transform', `translateX(${OFF_RIGHT})`, `translateX(${CENTER})`);
enteringToolBarBg.beforeClearStyles([OPACITY, 'transform']);
const translucentHeader = parentHeader === null || parentHeader === void 0 ? void 0 : parentHeader.translucent;
if (!translucentHeader) {
enteringToolBarBg.fromTo(OPACITY, 0.01, 'var(--opacity)');
}
else {
enteringToolBarBg.fromTo('transform', (isRTL ? 'translateX(-100%)' : 'translateX(100%)'), 'translateX(0px)');
}
// forward direction, entering page has a back button
if (!forward) {
enteringBackButton.fromTo(OPACITY, 0.01, 1);
}
if (backButtonEl && !forward) {
const enteringBackBtnText = createAnimation();
enteringBackBtnText
.addElement(shadow(backButtonEl).querySelector('.button-text')) // REVIEW
.fromTo(`transform`, (isRTL ? 'translateX(-100px)' : 'translateX(100px)'), 'translateX(0px)');
enteringToolBar.addAnimation(enteringBackBtnText);
}
}
});
// setup leaving view
if (leavingEl) {
const leavingContent = createAnimation();
const leavingContentEl = leavingEl.querySelector(':scope > ion-content');
const leavingToolBarEls = leavingEl.querySelectorAll(':scope > ion-header > ion-toolbar');
const leavingHeaderEls = leavingEl.querySelectorAll(':scope > ion-header > *:not(ion-toolbar), :scope > ion-footer > *');
if (!leavingContentEl && leavingToolBarEls.length === 0 && leavingHeaderEls.length === 0) {
leavingContent.addElement(leavingEl.querySelector(':scope > .ion-page, :scope > ion-nav, :scope > ion-tabs')); // REVIEW
}
else {
leavingContent.addElement(leavingContentEl); // REVIEW
leavingContent.addElement(leavingHeaderEls);
}
rootAnimation.addAnimation(leavingContent);
if (backDirection) {
// leaving content, back direction
leavingContent
.beforeClearStyles([OPACITY])
.fromTo('transform', `translateX(${CENTER})`, (isRTL ? 'translateX(-100%)' : 'translateX(100%)'));
const leavingPage = getIonPageElement(leavingEl);
rootAnimation.afterAddWrite(() => {
if (rootAnimation.getDirection() === 'normal') {
leavingPage.style.setProperty('display', 'none');
}
});
}
else {
// leaving content, forward direction
leavingContent
.fromTo('transform', `translateX(${CENTER})`, `translateX(${OFF_LEFT})`)
.fromTo(OPACITY, 1, OFF_OPACITY);
}
if (leavingContentEl) {
const leavingTransitionEffectEl = shadow(leavingContentEl).querySelector('.transition-effect');
if (leavingTransitionEffectEl) {
const leavingTransitionCoverEl = leavingTransitionEffectEl.querySelector('.transition-cover');
const leavingTransitionShadowEl = leavingTransitionEffectEl.querySelector('.transition-shadow');
const leavingTransitionEffect = createAnimation();
const leavingTransitionCover = createAnimation();
const leavingTransitionShadow = createAnimation();
leavingTransitionEffect
.addElement(leavingTransitionEffectEl)
.beforeStyles({ opacity: '1', display: 'block' })
.afterStyles({ opacity: '', display: '' });
leavingTransitionCover
.addElement(leavingTransitionCoverEl) // REVIEW
.beforeClearStyles([OPACITY])
.fromTo(OPACITY, 0.1, 0);
leavingTransitionShadow
.addElement(leavingTransitionShadowEl) // REVIEW
.beforeClearStyles([OPACITY])
.fromTo(OPACITY, 0.70, 0.03);
leavingTransitionEffect.addAnimation([leavingTransitionCover, leavingTransitionShadow]);
leavingContent.addAnimation([leavingTransitionEffect]);
}
}
leavingToolBarEls.forEach(leavingToolBarEl => {
const leavingToolBar = createAnimation();
leavingToolBar.addElement(leavingToolBarEl);
const leavingTitle = createAnimation();
leavingTitle.addElement(leavingToolBarEl.querySelector('ion-title')); // REVIEW
const leavingToolBarButtons = createAnimation();
const buttons = leavingToolBarEl.querySelectorAll('ion-buttons,[menuToggle]');
const parentHeader = leavingToolBarEl.closest('ion-header');
const inactiveHeader = parentHeader && parentHeader.classList.contains('header-collapse-condense-inactive');
const buttonsToAnimate = Array.from(buttons).filter(button => {
const isCollapseButton = button.classList.contains('buttons-collapse');
return (isCollapseButton && !inactiveHeader) || !isCollapseButton;
});
leavingToolBarButtons.addElement(buttonsToAnimate);
const leavingToolBarItems = createAnimation();
const leavingToolBarItemEls = leavingToolBarEl.querySelectorAll(':scope > *:not(ion-title):not(ion-buttons):not([menuToggle])');
if (leavingToolBarItemEls.length > 0) {
leavingToolBarItems.addElement(leavingToolBarItemEls);
}
const leavingToolBarBg = createAnimation();
leavingToolBarBg.addElement(shadow(leavingToolBarEl).querySelector('.toolbar-background')); // REVIEW
const leavingBackButton = createAnimation();
const backButtonEl = leavingToolBarEl.querySelector('ion-back-button');
if (backButtonEl) {
leavingBackButton.addElement(backButtonEl);
}
leavingToolBar.addAnimation([leavingTitle, leavingToolBarButtons, leavingToolBarItems, leavingBackButton, leavingToolBarBg]);
rootAnimation.addAnimation(leavingToolBar);
// fade out leaving toolbar items
leavingBackButton.fromTo(OPACITY, 0.99, 0);
leavingToolBarButtons.fromTo(OPACITY, 0.99, 0);
leavingToolBarItems.fromTo(OPACITY, 0.99, 0);
if (backDirection) {
if (!inactiveHeader) {
// leaving toolbar, back direction
leavingTitle
.fromTo('transform', `translateX(${CENTER})`, (isRTL ? 'translateX(-100%)' : 'translateX(100%)'))
.fromTo(OPACITY, 0.99, 0);
}
leavingToolBarItems.fromTo('transform', `translateX(${CENTER})`, (isRTL ? 'translateX(-100%)' : 'translateX(100%)'));
leavingToolBarBg.beforeClearStyles([OPACITY, 'transform']);
// leaving toolbar, back direction, and there's no entering toolbar
// should just slide out, no fading out
const translucentHeader = parentHeader === null || parentHeader === void 0 ? void 0 : parentHeader.translucent;
if (!translucentHeader) {
leavingToolBarBg.fromTo(OPACITY, 'var(--opacity)', 0);
}
else {
leavingToolBarBg.fromTo('transform', 'translateX(0px)', (isRTL ? 'translateX(-100%)' : 'translateX(100%)'));
}
if (backButtonEl && !backward) {
const leavingBackBtnText = createAnimation();
leavingBackBtnText
.addElement(shadow(backButtonEl).querySelector('.button-text')) // REVIEW
.fromTo('transform', `translateX(${CENTER})`, `translateX(${(isRTL ? -124 : 124) + 'px'})`);
leavingToolBar.addAnimation(leavingBackBtnText);
}
}
else {
// leaving toolbar, forward direction
if (!inactiveHeader) {
leavingTitle
.fromTo('transform', `translateX(${CENTER})`, `translateX(${OFF_LEFT})`)
.fromTo(OPACITY, 0.99, 0)
.afterClearStyles([TRANSFORM, OPACITY]);
}
leavingToolBarItems
.fromTo('transform', `translateX(${CENTER})`, `translateX(${OFF_LEFT})`)
.afterClearStyles([TRANSFORM, OPACITY]);
leavingBackButton.afterClearStyles([OPACITY]);
leavingTitle.afterClearStyles([OPACITY]);
leavingToolBarButtons.afterClearStyles([OPACITY]);
}
});
}
return rootAnimation;
}
catch (err) {
throw err;
}
};
var ios_transition = /*#__PURE__*/Object.freeze({
__proto__: null,
shadow: shadow,
iosTransitionAnimation: iosTransitionAnimation
});
const mdTransitionAnimation = (_, opts) => {
const OFF_BOTTOM = '40px';
const CENTER = '0px';
const backDirection = (opts.direction === 'back');
const enteringEl = opts.enteringEl;
const leavingEl = opts.leavingEl;
const ionPageElement = getIonPageElement(enteringEl);
const enteringToolbarEle = ionPageElement.querySelector('ion-toolbar');
const rootTransition = createAnimation();
rootTransition
.addElement(ionPageElement)
.fill('both')
.beforeRemoveClass('ion-page-invisible');
// animate the component itself
if (backDirection) {
rootTransition
.duration(opts.duration || 200)
.easing('cubic-bezier(0.47,0,0.745,0.715)');
}
else {
rootTransition
.duration(opts.duration || 280)
.easing('cubic-bezier(0.36,0.66,0.04,1)')
.fromTo('transform', `translateY(${OFF_BOTTOM})`, `translateY(${CENTER})`)
.fromTo('opacity', 0.01, 1);
}
// Animate toolbar if it's there
if (enteringToolbarEle) {
const enteringToolBar = createAnimation();
enteringToolBar.addElement(enteringToolbarEle);
rootTransition.addAnimation(enteringToolBar);
}
// setup leaving view
if (leavingEl && backDirection) {
// leaving content
rootTransition
.duration(opts.duration || 200)
.easing('cubic-bezier(0.47,0,0.745,0.715)');
const leavingPage = createAnimation();
leavingPage
.addElement(getIonPageElement(leavingEl))
.onFinish(currentStep => {
if (currentStep === 1 && leavingPage.elements.length > 0) {
leavingPage.elements[0].style.setProperty('display', 'none');
}
})
.fromTo('transform', `translateY(${CENTER})`, `translateY(${OFF_BOTTOM})`)
.fromTo('opacity', 1, 0);
rootTransition.addAnimation(leavingPage);
}
return rootTransition;
};
var md_transition = /*#__PURE__*/Object.freeze({
__proto__: null,
mdTransitionAnimation: mdTransitionAnimation
});
const createSwipeBackGesture = (el, canStartHandler, onStartHandler, onMoveHandler, onEndHandler) => {
const win = el.ownerDocument.defaultView;
const canStart = (detail) => {
return detail.startX <= 50 && canStartHandler();
};
const onMove = (detail) => {
// set the transition animation's progress
const delta = detail.deltaX;
const stepValue = delta / win.innerWidth;
onMoveHandler(stepValue);
};
const onEnd = (detail) => {
// the swipe back gesture has ended
const delta = detail.deltaX;
const width = win.innerWidth;
const stepValue = delta / width;
const velocity = detail.velocityX;
const z = width / 2.0;
const shouldComplete = velocity >= 0 && (velocity > 0.2 || detail.deltaX > z);
const missing = shouldComplete ? 1 - stepValue : stepValue;
const missingDistance = missing * width;
let realDur = 0;
if (missingDistance > 5) {
const dur = missingDistance / Math.abs(velocity);
realDur = Math.min(dur, 540);
}
/**
* TODO: stepValue can sometimes return negative values
* or values greater than 1 which should not be possible.
* Need to investigate more to find where the issue is.
*/
onEndHandler(shouldComplete, (stepValue <= 0) ? 0.01 : clamp(0, stepValue, 0.9999), realDur);
};
return createGesture({
el,
gestureName: 'goback-swipe',
gesturePriority: 40,
threshold: 10,
canStart,
onStart: onStartHandler,
onMove,
onEnd
});
};
var swipeBack = /*#__PURE__*/Object.freeze({
__proto__: null,
createSwipeBackGesture: createSwipeBackGesture
});
/**
* SSR Window 2.0.0
* Better handling for window object in SSR environment
* https://github.com/nolimits4web/ssr-window
*
* Copyright 2020, Vladimir Kharlampidi
*
* Licensed under MIT
*
* Released on: May 12, 2020
*/
/* eslint-disable no-param-reassign */
function isObject(obj) {
return (obj !== null &&
typeof obj === 'object' &&
'constructor' in obj &&
obj.constructor === Object);
}
function extend(target, src) {
if (target === void 0) { target = {}; }
if (src === void 0) { src = {}; }
Object.keys(src).forEach(function (key) {
if (typeof target[key] === 'undefined')
target[key] = src[key];
else if (isObject(src[key]) &&
isObject(target[key]) &&
Object.keys(src[key]).length > 0) {
extend(target[key], src[key]);
}
});
}
var doc = typeof document !== 'undefined' ? document : {};
var ssrDocument = {
body: {},
addEventListener: function () { },
removeEventListener: function () { },
activeElement: {
blur: function () { },
nodeName: '',
},
querySelector: function () {
return null;
},
querySelectorAll: function () {
return [];
},
getElementById: function () {
return null;
},
createEvent: function () {
return {
initEvent: function () { },
};
},
createElement: function () {
return {
children: [],
childNodes: [],
style: {},
setAttribute: function () { },
getElementsByTagName: function () {
return [];
},
};
},
createElementNS: function () {
return {};
},
importNode: function () {
return null;
},
location: {
hash: '',
host: '',
hostname: '',
href: '',
origin: '',
pathname: '',
protocol: '',
search: '',
},
};
extend(doc, ssrDocument);
var win = typeof window !== 'undefined' ? window : {};
var ssrWindow = {
document: ssrDocument,
navigator: {
userAgent: '',
},
location: {
hash: '',
host: '',
hostname: '',
href: '',
origin: '',
pathname: '',
protocol: '',
search: '',
},
history: {
replaceState: function () { },
pushState: function () { },
go: function () { },
back: function () { },
},
CustomEvent: function CustomEvent() {
return this;
},
addEventListener: function () { },
removeEventListener: function () { },
getComputedStyle: function () {
return {
getPropertyValue: function () {
return '';
},
};
},
Image: function () { },
Date: function () { },
screen: {},
setTimeout: function () { },
clearTimeout: function () { },
matchMedia: function () {
return {};
},
};
extend(win, ssrWindow);
/**
* Dom7 2.1.5
* Minimalistic JavaScript library for DOM manipulation, with a jQuery-compatible API
* http://framework7.io/docs/dom.html
*
* Copyright 2020, Vladimir Kharlampidi
* The iDangero.us
* http://www.idangero.us/
*
* Licensed under MIT
*
* Released on: May 15, 2020
*/
class Dom7 {
constructor(arr) {
const self = this;
// Create array-like object
for (let i = 0; i < arr.length; i += 1) {
self[i] = arr[i];
}
self.length = arr.length;
// Return collection with methods
return this;
}
}
function $(selector, context) {
const arr = [];
let i = 0;
if (selector && !context) {
if (selector instanceof Dom7) {
return selector;
}
}
if (selector) {
// String
if (typeof selector === 'string') {
let els;
let tempParent;
const html = selector.trim();
if (html.indexOf('<') >= 0 && html.indexOf('>') >= 0) {
let toCreate = 'div';
if (html.indexOf('<li') === 0) toCreate = 'ul';
if (html.indexOf('<tr') === 0) toCreate = 'tbody';
if (html.indexOf('<td') === 0 || html.indexOf('<th') === 0) toCreate = 'tr';
if (html.indexOf('<tbody') === 0) toCreate = 'table';
if (html.indexOf('<option') === 0) toCreate = 'select';
tempParent = doc.createElement(toCreate);
tempParent.innerHTML = html;
for (i = 0; i < tempParent.childNodes.length; i += 1) {
arr.push(tempParent.childNodes[i]);
}
} else {
if (!context && selector[0] === '#' && !selector.match(/[ .<>:~]/)) {
// Pure ID selector
els = [doc.getElementById(selector.trim().split('#')[1])];
} else {
// Other selectors
els = (context || doc).querySelectorAll(selector.trim());
}
for (i = 0; i < els.length; i += 1) {
if (els[i]) arr.push(els[i]);
}
}
} else if (selector.nodeType || selector === win || selector === doc) {
// Node/element
arr.push(selector);
} else if (selector.length > 0 && selector[0].nodeType) {
// Array of elements or instance of Dom
for (i = 0; i < selector.length; i += 1) {
arr.push(selector[i]);
}
}
}
return new Dom7(arr);
}
$.fn = Dom7.prototype;
$.Class = Dom7;
$.Dom7 = Dom7;
function unique(arr) {
const uniqueArray = [];
for (let i = 0; i < arr.length; i += 1) {
if (uniqueArray.indexOf(arr[i]) === -1) uniqueArray.push(arr[i]);
}
return uniqueArray;
}
// Classes and attributes
function addClass(className) {
if (typeof className === 'undefined') {
return this;
}
const classes = className.split(' ');
for (let i = 0; i < classes.length; i += 1) {
for (let j = 0; j < this.length; j += 1) {
if (typeof this[j] !== 'undefined' && typeof this[j].classList !== 'undefined') this[j].classList.add(classes[i]);
}
}
return this;
}
function removeClass(className) {
const classes = className.split(' ');
for (let i = 0; i < classes.length; i += 1) {
for (let j = 0; j < this.length; j += 1) {
if (typeof this[j] !== 'undefined' && typeof this[j].classList !== 'undefined') this[j].classList.remove(classes[i]);
}
}
return this;
}
function hasClass(className) {
if (!this[0]) return false;
return this[0].classList.contains(className);
}
function toggleClass(className) {
const classes = className.split(' ');
for (let i = 0; i < classes.length; i += 1) {
for (let j = 0; j < this.length; j += 1) {
if (typeof this[j] !== 'undefined' && typeof this[j].classList !== 'undefined') this[j].classList.toggle(classes[i]);
}
}
return this;
}
function attr(attrs, value) {
if (arguments.length === 1 && typeof attrs === 'string') {
// Get attr
if (this[0]) return this[0].getAttribute(attrs);
return undefined;
}
// Set attrs
for (let i = 0; i < this.length; i += 1) {
if (arguments.length === 2) {
// String
this[i].setAttribute(attrs, value);
} else {
// Object
// eslint-disable-next-line
for (const attrName in attrs) {
this[i][attrName] = attrs[attrName];
this[i].setAttribute(attrName, attrs[attrName]);
}
}
}
return this;
}
// eslint-disable-next-line
function removeAttr(attr) {
for (let i = 0; i < this.length; i += 1) {
this[i].removeAttribute(attr);
}
return this;
}
function data(key, value) {
let el;
if (typeof value === 'undefined') {
el = this[0];
// Get value
if (el) {
if (el.dom7ElementDataStorage && (key in el.dom7ElementDataStorage)) {
return el.dom7ElementDataStorage[key];
}
const dataKey = el.getAttribute(`data-${key}`);
if (dataKey) {
return dataKey;
}
return undefined;
}
return undefined;
}
// Set value
for (let i = 0; i < this.length; i += 1) {
el = this[i];
if (!el.dom7ElementDataStorage) el.dom7ElementDataStorage = {};
el.dom7ElementDataStorage[key] = value;
}
return this;
}
// Transforms
// eslint-disable-next-line
function transform(transform) {
for (let i = 0; i < this.length; i += 1) {
const elStyle = this[i].style;
elStyle.webkitTransform = transform;
elStyle.transform = transform;
}
return this;
}
function transition(duration) {
if (typeof duration !== 'string') {
duration = `${duration}ms`; // eslint-disable-line
}
for (let i = 0; i < this.length; i += 1) {
const elStyle = this[i].style;
elStyle.webkitTransitionDuration = duration;
elStyle.transitionDuration = duration;
}
return this;
}
// Events
function on(...args) {
let [eventType, targetSelector, listener, capture] = args;
if (typeof args[1] === 'function') {
[eventType, listener, capture] = args;
targetSelector = undefined;
}
if (!capture) capture = false;
function handleLiveEvent(e) {
const target = e.target;
if (!target) return;
const eventData = e.target.dom7EventData || [];
if (eventData.indexOf(e) < 0) {
eventData.unshift(e);
}
if ($(target).is(targetSelector)) listener.apply(target, eventData);
else {
const parents = $(target).parents(); // eslint-disable-line
for (let k = 0; k < parents.length; k += 1) {
if ($(parents[k]).is(targetSelector)) listener.apply(parents[k], eventData);
}
}
}
function handleEvent(e) {
const eventData = e && e.target ? e.target.dom7EventData || [] : [];
if (eventData.indexOf(e) < 0) {
eventData.unshift(e);
}
listener.apply(this, eventData);
}
const events = eventType.split(' ');
let j;
for (let i = 0; i < this.length; i += 1) {
const el = this[i];
if (!targetSelector) {
for (j = 0; j < events.length; j += 1) {
const event = events[j];
if (!el.dom7Listeners) el.dom7Listeners = {};
if (!el.dom7Listeners[event]) el.dom7Listeners[event] = [];
el.dom7Listeners[event].push({
listener,
proxyListener: handleEvent,
});
el.addEventListener(event, handleEvent, capture);
}
} else {
// Live events
for (j = 0; j < events.length; j += 1) {
const event = events[j];
if (!el.dom7LiveListeners) el.dom7LiveListeners = {};
if (!el.dom7LiveListeners[event]) el.dom7LiveListeners[event] = [];
el.dom7LiveListeners[event].push({
listener,
proxyListener: handleLiveEvent,
});
el.addEventListener(event, handleLiveEvent, capture);
}
}
}
return this;
}
function off(...args) {
let [eventType, targetSelector, listener, capture] = args;
if (typeof args[1] === 'function') {
[eventType, listener, capture] = args;
targetSelector = undefined;
}
if (!capture) capture = false;
const events = eventType.split(' ');
for (let i = 0; i < events.length; i += 1) {
const event = events[i];
for (let j = 0; j < this.length; j += 1) {
const el = this[j];
let handlers;
if (!targetSelector && el.dom7Listeners) {
handlers = el.dom7Listeners[event];
} else if (targetSelector && el.dom7LiveListeners) {
handlers = el.dom7LiveListeners[event];
}
if (handlers && handlers.length) {
for (let k = handlers.length - 1; k >= 0; k -= 1) {
const handler = handlers[k];
if (listener && handler.listener === listener) {
el.removeEventListener(event, handler.proxyListener, capture);
handlers.splice(k, 1);
} else if (listener && handler.listener && handler.listener.dom7proxy && handler.listener.dom7proxy === listener) {
el.removeEventListener(event, handler.proxyListener, capture);
handlers.splice(k, 1);
} else if (!listener) {
el.removeEventListener(event, handler.proxyListener, capture);
handlers.splice(k, 1);
}
}
}
}
}
return this;
}
function trigger(...args) {
const events = args[0].split(' ');
const eventData = args[1];
for (let i = 0; i < events.length; i += 1) {
const event = events[i];
for (let j = 0; j < this.length; j += 1) {
const el = this[j];
let evt;
try {
evt = new win.CustomEvent(event, {
detail: eventData,
bubbles: true,
cancelable: true,
});
} catch (e) {
evt = doc.createEvent('Event');
evt.initEvent(event, true, true);
evt.detail = eventData;
}
// eslint-disable-next-line
el.dom7EventData = args.filter((data, dataIndex) => dataIndex > 0);
el.dispatchEvent(evt);
el.dom7EventData = [];
delete el.dom7EventData;
}
}
return this;
}
function transitionEnd(callback) {
const events = ['webkitTransitionEnd', 'transitionend'];
const dom = this;
let i;
function fireCallBack(e) {
/* jshint validthis:true */
if (e.target !== this) return;
callback.call(this, e);
for (i = 0; i < events.length; i += 1) {
dom.off(events[i], fireCallBack);
}
}
if (callback) {
for (i = 0; i < events.length; i += 1) {
dom.on(events[i], fireCallBack);
}
}
return this;
}
function outerWidth(includeMargins) {
if (this.length > 0) {
if (includeMargins) {
// eslint-disable-next-line
const styles = this.styles();
return this[0].offsetWidth + parseFloat(styles.getPropertyValue('margin-right')) + parseFloat(styles.getPropertyValue('margin-left'));
}
return this[0].offsetWidth;
}
return null;
}
function outerHeight(includeMargins) {
if (this.length > 0) {
if (includeMargins) {
// eslint-disable-next-line
const styles = this.styles();
return this[0].offsetHeight + parseFloat(styles.getPropertyValue('margin-top')) + parseFloat(styles.getPropertyValue('margin-bottom'));
}
return this[0].offsetHeight;
}
return null;
}
function offset() {
if (this.length > 0) {
const el = this[0];
const box = el.getBoundingClientRect();
const body = doc.body;
const clientTop = el.clientTop || body.clientTop || 0;
const clientLeft = el.clientLeft || body.clientLeft || 0;
const scrollTop = el === win ? win.scrollY : el.scrollTop;
const scrollLeft = el === win ? win.scrollX : el.scrollLeft;
return {
top: (box.top + scrollTop) - clientTop,
left: (box.left + scrollLeft) - clientLeft,
};
}
return null;
}
function styles() {
if (this[0]) return win.getComputedStyle(this[0], null);
return {};
}
function css(props, value) {
let i;
if (arguments.length === 1) {
if (typeof props === 'string') {
if (this[0]) return win.getComputedStyle(this[0], null).getPropertyValue(props);
} else {
for (i = 0; i < this.length; i += 1) {
// eslint-disable-next-line
for (let prop in props) {
this[i].style[prop] = props[prop];
}
}
return this;
}
}
if (arguments.length === 2 && typeof props === 'string') {
for (i = 0; i < this.length; i += 1) {
this[i].style[props] = value;
}
return this;
}
return this;
}
// Iterate over the collection passing elements to `callback`
function each(callback) {
// Don't bother continuing without a callback
if (!callback) return this;
// Iterate over the current collection
for (let i = 0; i < this.length; i += 1) {
// If the callback returns false
if (callback.call(this[i], i, this[i]) === false) {
// End the loop early
return this;
}
}
// Return `this` to allow chained DOM operations
return this;
}
function filter(callback) {
const matchedItems = [];
const dom = this;
for (let i = 0; i < dom.length; i += 1) {
if (callback.call(dom[i], i, dom[i])) matchedItems.push(dom[i]);
}
return new Dom7(matchedItems);
}
// eslint-disable-next-line
function html(html) {
if (typeof html === 'undefined') {
return this[0] ? this[0].innerHTML : undefined;
}
for (let i = 0; i < this.length; i += 1) {
this[i].innerHTML = html;
}
return this;
}
// eslint-disable-next-line
function text(text) {
if (typeof text === 'undefined') {
if (this[0]) {
return this[0].textContent.trim();
}
return null;
}
for (let i = 0; i < this.length; i += 1) {
this[i].textContent = text;
}
return this;
}
function is(selector) {
const el = this[0];
let compareWith;
let i;
if (!el || typeof selector === 'undefined') return false;
if (typeof selector === 'string') {
if (el.matches) return el.matches(selector);
else if (el.webkitMatchesSelector) return el.webkitMatchesSelector(selector);
else if (el.msMatchesSelector) return el.msMatchesSelector(selector);
compareWith = $(selector);
for (i = 0; i < compareWith.length; i += 1) {
if (compareWith[i] === el) return true;
}
return false;
} else if (selector === doc) return el === doc;
else if (selector === win) return el === win;
if (selector.nodeType || selector instanceof Dom7) {
compareWith = selector.nodeType ? [selector] : selector;
for (i = 0; i < compareWith.length; i += 1) {
if (compareWith[i] === el) return true;
}
return false;
}
return false;
}
function index() {
let child = this[0];
let i;
if (child) {
i = 0;
// eslint-disable-next-line
while ((child = child.previousSibling) !== null) {
if (child.nodeType === 1) i += 1;
}
return i;
}
return undefined;
}
// eslint-disable-next-line
function eq(index) {
if (typeof index === 'undefined') return this;
const length = this.length;
let returnIndex;
if (index > length - 1) {
return new Dom7([]);
}
if (index < 0) {
returnIndex = length + index;
if (returnIndex < 0) return new Dom7([]);
return new Dom7([this[returnIndex]]);
}
return new Dom7([this[index]]);
}
function append(...args) {
let newChild;
for (let k = 0; k < args.length; k += 1) {
newChild = args[k];
for (let i = 0; i < this.length; i += 1) {
if (typeof newChild === 'string') {
const tempDiv = doc.createElement('div');
tempDiv.innerHTML = newChild;
while (tempDiv.firstChild) {
this[i].appendChild(tempDiv.firstChild);
}
} else if (newChild instanceof Dom7) {
for (let j = 0; j < newChild.length; j += 1) {
this[i].appendChild(newChild[j]);
}
} else {
this[i].appendChild(newChild);
}
}
}
return this;
}
function prepend(newChild) {
let i;
let j;
for (i = 0; i < this.length; i += 1) {
if (typeof newChild === 'string') {
const tempDiv = doc.createElement('div');
tempDiv.innerHTML = newChild;
for (j = tempDiv.childNodes.length - 1; j >= 0; j -= 1) {
this[i].insertBefore(tempDiv.childNodes[j], this[i].childNodes[0]);
}
} else if (newChild instanceof Dom7) {
for (j = 0; j < newChild.length; j += 1) {
this[i].insertBefore(newChild[j], this[i].childNodes[0]);
}
} else {
this[i].insertBefore(newChild, this[i].childNodes[0]);
}
}
return this;
}
function next(selector) {
if (this.length > 0) {
if (selector) {
if (this[0].nextElementSibling && $(this[0].nextElementSibling).is(selector)) {
return new Dom7([this[0].nextElementSibling]);
}
return new Dom7([]);
}
if (this[0].nextElementSibling) return new Dom7([this[0].nextElementSibling]);
return new Dom7([]);
}
return new Dom7([]);
}
function nextAll(selector) {
const nextEls = [];
let el = this[0];
if (!el) return new Dom7([]);
while (el.nextElementSibling) {
const next = el.nextElementSibling; // eslint-disable-line
if (selector) {
if ($(next).is(selector)) nextEls.push(next);
} else nextEls.push(next);
el = next;
}
return new Dom7(nextEls);
}
function prev(selector) {
if (this.length > 0) {
const el = this[0];
if (selector) {
if (el.previousElementSibling && $(el.previousElementSibling).is(selector)) {
return new Dom7([el.previousElementSibling]);
}
return new Dom7([]);
}
if (el.previousElementSibling) return new Dom7([el.previousElementSibling]);
return new Dom7([]);
}
return new Dom7([]);
}
function prevAll(selector) {
const prevEls = [];
let el = this[0];
if (!el) return new Dom7([]);
while (el.previousElementSibling) {
const prev = el.previousElementSibling; // eslint-disable-line
if (selector) {
if ($(prev).is(selector)) prevEls.push(prev);
} else prevEls.push(prev);
el = prev;
}
return new Dom7(prevEls);
}
function parent(selector) {
const parents = []; // eslint-disable-line
for (let i = 0; i < this.length; i += 1) {
if (this[i].parentNode !== null) {
if (selector) {
if ($(this[i].parentNode).is(selector)) parents.push(this[i].parentNode);
} else {
parents.push(this[i].parentNode);
}
}
}
return $(unique(parents));
}
function parents(selector) {
const parents = []; // eslint-disable-line
for (let i = 0; i < this.length; i += 1) {
let parent = this[i].parentNode; // eslint-disable-line
while (parent) {
if (selector) {
if ($(parent).is(selector)) parents.push(parent);
} else {
parents.push(parent);
}
parent = parent.parentNode;
}
}
return $(unique(parents));
}
function closest(selector) {
let closest = this; // eslint-disable-line
if (typeof selector === 'undefined') {
return new Dom7([]);
}
if (!closest.is(selector)) {
closest = closest.parents(selector).eq(0);
}
return closest;
}
function find(selector) {
const foundElements = [];
for (let i = 0; i < this.length; i += 1) {
const found = this[i].querySelectorAll(selector);
for (let j = 0; j < found.length; j += 1) {
foundElements.push(found[j]);
}
}
return new Dom7(foundElements);
}
function children(selector) {
const children = []; // eslint-disable-line
for (let i = 0; i < this.length; i += 1) {
const childNodes = this[i].childNodes;
for (let j = 0; j < childNodes.length; j += 1) {
if (!selector) {
if (childNodes[j].nodeType === 1) children.push(childNodes[j]);
} else if (childNodes[j].nodeType === 1 && $(childNodes[j]).is(selector)) {
children.push(childNodes[j]);
}
}
}
return new Dom7(unique(children));
}
function remove() {
for (let i = 0; i < this.length; i += 1) {
if (this[i].parentNode) this[i].parentNode.removeChild(this[i]);
}
return this;
}
function add(...args) {
const dom = this;
let i;
let j;
for (i = 0; i < args.length; i += 1) {
const toAdd = $(args[i]);
for (j = 0; j < toAdd.length; j += 1) {
dom[dom.length] = toAdd[j];
dom.length += 1;
}
}
return dom;
}
/**
* Swiper 5.4.1
* Most modern mobile touch slider and framework with hardware accelerated transitions
* http://swiperjs.com
*
* Copyright 2014-2020 Vladimir Kharlampidi
*
* Released under the MIT License
*
* Released on: May 20, 2020
*/
const Methods = {
addClass,
removeClass,
hasClass,
toggleClass,
attr,
removeAttr,
data,
transform,
transition: transition,
on,
off,
trigger,
transitionEnd: transitionEnd,
outerWidth,
outerHeight,
offset,
css,
each,
html,
text,
is,
index,
eq,
append,
prepend,
next,
nextAll,
prev,
prevAll,
parent,
parents,
closest,
find,
children,
filter,
remove,
add,
styles,
};
Object.keys(Methods).forEach((methodName) => {
$.fn[methodName] = $.fn[methodName] || Methods[methodName];
});
const Utils = {
deleteProps(obj) {
const object = obj;
Object.keys(object).forEach((key) => {
try {
object[key] = null;
} catch (e) {
// no getter for object
}
try {
delete object[key];
} catch (e) {
// something got wrong
}
});
},
nextTick(callback, delay = 0) {
return setTimeout(callback, delay);
},
now() {
return Date.now();
},
getTranslate(el, axis = 'x') {
let matrix;
let curTransform;
let transformMatrix;
const curStyle = win.getComputedStyle(el, null);
if (win.WebKitCSSMatrix) {
curTransform = curStyle.transform || curStyle.webkitTransform;
if (curTransform.split(',').length > 6) {
curTransform = curTransform.split(', ').map((a) => a.replace(',', '.')).join(', ');
}
// Some old versions of Webkit choke when 'none' is passed; pass
// empty string instead in this case
transformMatrix = new win.WebKitCSSMatrix(curTransform === 'none' ? '' : curTransform);
} else {
transformMatrix = curStyle.MozTransform || curStyle.OTransform || curStyle.MsTransform || curStyle.msTransform || curStyle.transform || curStyle.getPropertyValue('transform').replace('translate(', 'matrix(1, 0, 0, 1,');
matrix = transformMatrix.toString().split(',');
}
if (axis === 'x') {
// Latest Chrome and webkits Fix
if (win.WebKitCSSMatrix) curTransform = transformMatrix.m41;
// Crazy IE10 Matrix
else if (matrix.length === 16) curTransform = parseFloat(matrix[12]);
// Normal Browsers
else curTransform = parseFloat(matrix[4]);
}
if (axis === 'y') {
// Latest Chrome and webkits Fix
if (win.WebKitCSSMatrix) curTransform = transformMatrix.m42;
// Crazy IE10 Matrix
else if (matrix.length === 16) curTransform = parseFloat(matrix[13]);
// Normal Browsers
else curTransform = parseFloat(matrix[5]);
}
return curTransform || 0;
},
parseUrlQuery(url) {
const query = {};
let urlToParse = url || win.location.href;
let i;
let params;
let param;
let length;
if (typeof urlToParse === 'string' && urlToParse.length) {
urlToParse = urlToParse.indexOf('?') > -1 ? urlToParse.replace(/\S*\?/, '') : '';
params = urlToParse.split('&').filter((paramsPart) => paramsPart !== '');
length = params.length;
for (i = 0; i < length; i += 1) {
param = params[i].replace(/#\S+/g, '').split('=');
query[decodeURIComponent(param[0])] = typeof param[1] === 'undefined' ? undefined : decodeURIComponent(param[1]) || '';
}
}
return query;
},
isObject(o) {
return typeof o === 'object' && o !== null && o.constructor && o.constructor === Object;
},
extend(...args) {
const to = Object(args[0]);
const noExtend = ['__proto__', 'constructor', 'prototype'];
for (let i = 1; i < args.length; i += 1) {
const nextSource = args[i];
if (nextSource !== undefined && nextSource !== null) {
const keysArray = Object.keys(Object(nextSource)).filter((key) => noExtend.indexOf(key) < 0);
for (let nextIndex = 0, len = keysArray.length; nextIndex < len; nextIndex += 1) {
const nextKey = keysArray[nextIndex];
const desc = Object.getOwnPropertyDescriptor(nextSource, nextKey);
if (desc !== undefined && desc.enumerable) {
if (Utils.isObject(to[nextKey]) && Utils.isObject(nextSource[nextKey])) {
Utils.extend(to[nextKey], nextSource[nextKey]);
} else if (!Utils.isObject(to[nextKey]) && Utils.isObject(nextSource[nextKey])) {
to[nextKey] = {};
Utils.extend(to[nextKey], nextSource[nextKey]);
} else {
to[nextKey] = nextSource[nextKey];
}
}
}
}
}
return to;
},
};
const Support = (function Support() {
return {
touch: !!(('ontouchstart' in win) || (win.DocumentTouch && doc instanceof win.DocumentTouch)),
pointerEvents: !!win.PointerEvent && ('maxTouchPoints' in win.navigator) && win.navigator.maxTouchPoints >= 0,
observer: (function checkObserver() {
return ('MutationObserver' in win || 'WebkitMutationObserver' in win);
}()),
passiveListener: (function checkPassiveListener() {
let supportsPassive = false;
try {
const opts = Object.defineProperty({}, 'passive', {
// eslint-disable-next-line
get() {
supportsPassive = true;
},
});
win.addEventListener('testPassiveListener', null, opts);
} catch (e) {
// No support
}
return supportsPassive;
}()),
gestures: (function checkGestures() {
return 'ongesturestart' in win;
}()),
};
}());
class SwiperClass {
constructor(params = {}) {
const self = this;
self.params = params;
// Events
self.eventsListeners = {};
if (self.params && self.params.on) {
Object.keys(self.params.on).forEach((eventName) => {
self.on(eventName, self.params.on[eventName]);
});
}
}
on(events, handler, priority) {
const self = this;
if (typeof handler !== 'function') return self;
const method = priority ? 'unshift' : 'push';
events.split(' ').forEach((event) => {
if (!self.eventsListeners[event]) self.eventsListeners[event] = [];
self.eventsListeners[event][method](handler);
});
return self;
}
once(events, handler, priority) {
const self = this;
if (typeof handler !== 'function') return self;
function onceHandler(...args) {
self.off(events, onceHandler);
if (onceHandler.f7proxy) {
delete onceHandler.f7proxy;
}
handler.apply(self, args);
}
onceHandler.f7proxy = handler;
return self.on(events, onceHandler, priority);
}
off(events, handler) {
const self = this;
if (!self.eventsListeners) return self;
events.split(' ').forEach((event) => {
if (typeof handler === 'undefined') {
self.eventsListeners[event] = [];
} else if (self.eventsListeners[event] && self.eventsListeners[event].length) {
self.eventsListeners[event].forEach((eventHandler, index) => {
if (eventHandler === handler || (eventHandler.f7proxy && eventHandler.f7proxy === handler)) {
self.eventsListeners[event].splice(index, 1);
}
});
}
});
return self;
}
emit(...args) {
const self = this;
if (!self.eventsListeners) return self;
let events;
let data;
let context;
if (typeof args[0] === 'string' || Array.isArray(args[0])) {
events = args[0];
data = args.slice(1, args.length);
context = self;
} else {
events = args[0].events;
data = args[0].data;
context = args[0].context || self;
}
const eventsArray = Array.isArray(events) ? events : events.split(' ');
eventsArray.forEach((event) => {
if (self.eventsListeners && self.eventsListeners[event]) {
const handlers = [];
self.eventsListeners[event].forEach((eventHandler) => {
handlers.push(eventHandler);
});
handlers.forEach((eventHandler) => {
eventHandler.apply(context, data);
});
}
});
return self;
}
useModulesParams(instanceParams) {
const instance = this;
if (!instance.modules) return;
Object.keys(instance.modules).forEach((moduleName) => {
const module = instance.modules[moduleName];
// Extend params
if (module.params) {
Utils.extend(instanceParams, module.params);
}
});
}
useModules(modulesParams = {}) {
const instance = this;
if (!instance.modules) return;
Object.keys(instance.modules).forEach((moduleName) => {
const module = instance.modules[moduleName];
const moduleParams = modulesParams[moduleName] || {};
// Extend instance methods and props
if (module.instance) {
Object.keys(module.instance).forEach((modulePropName) => {
const moduleProp = module.instance[modulePropName];
if (typeof moduleProp === 'function') {
instance[modulePropName] = moduleProp.bind(instance);
} else {
instance[modulePropName] = moduleProp;
}
});
}
// Add event listeners
if (module.on && instance.on) {
Object.keys(module.on).forEach((moduleEventName) => {
instance.on(moduleEventName, module.on[moduleEventName]);
});
}
// Module create callback
if (module.create) {
module.create.bind(instance)(moduleParams);
}
});
}
static set components(components) {
const Class = this;
if (!Class.use) return;
Class.use(components);
}
static installModule(module, ...params) {
const Class = this;
if (!Class.prototype.modules) Class.prototype.modules = {};
const name = module.name || (`${Object.keys(Class.prototype.modules).length}_${Utils.now()}`);
Class.prototype.modules[name] = module;
// Prototype
if (module.proto) {
Object.keys(module.proto).forEach((key) => {
Class.prototype[key] = module.proto[key];
});
}
// Class
if (module.static) {
Object.keys(module.static).forEach((key) => {
Class[key] = module.static[key];
});
}
// Callback
if (module.install) {
module.install.apply(Class, params);
}
return Class;
}
static use(module, ...params) {
const Class = this;
if (Array.isArray(module)) {
module.forEach((m) => Class.installModule(m));
return Class;
}
return Class.installModule(module, ...params);
}
}
function updateSize () {
const swiper = this;
let width;
let height;
const $el = swiper.$el;
if (typeof swiper.params.width !== 'undefined') {
width = swiper.params.width;
} else {
width = $el[0].clientWidth;
}
if (typeof swiper.params.height !== 'undefined') {
height = swiper.params.height;
} else {
height = $el[0].clientHeight;
}
if ((width === 0 && swiper.isHorizontal()) || (height === 0 && swiper.isVertical())) {
return;
}
// Subtract paddings
width = width - parseInt($el.css('padding-left'), 10) - parseInt($el.css('padding-right'), 10);
height = height - parseInt($el.css('padding-top'), 10) - parseInt($el.css('padding-bottom'), 10);
Utils.extend(swiper, {
width,
height,
size: swiper.isHorizontal() ? width : height,
});
}
function updateSlides () {
const swiper = this;
const params = swiper.params;
const {
$wrapperEl, size: swiperSize, rtlTranslate: rtl, wrongRTL,
} = swiper;
const isVirtual = swiper.virtual && params.virtual.enabled;
const previousSlidesLength = isVirtual ? swiper.virtual.slides.length : swiper.slides.length;
const slides = $wrapperEl.children(`.${swiper.params.slideClass}`);
const slidesLength = isVirtual ? swiper.virtual.slides.length : slides.length;
let snapGrid = [];
const slidesGrid = [];
const slidesSizesGrid = [];
function slidesForMargin(slideIndex) {
if (!params.cssMode) return true;
if (slideIndex === slides.length - 1) {
return false;
}
return true;
}
let offsetBefore = params.slidesOffsetBefore;
if (typeof offsetBefore === 'function') {
offsetBefore = params.slidesOffsetBefore.call(swiper);
}
let offsetAfter = params.slidesOffsetAfter;
if (typeof offsetAfter === 'function') {
offsetAfter = params.slidesOffsetAfter.call(swiper);
}
const previousSnapGridLength = swiper.snapGrid.length;
const previousSlidesGridLength = swiper.snapGrid.length;
let spaceBetween = params.spaceBetween;
let slidePosition = -offsetBefore;
let prevSlideSize = 0;
let index = 0;
if (typeof swiperSize === 'undefined') {
return;
}
if (typeof spaceBetween === 'string' && spaceBetween.indexOf('%') >= 0) {
spaceBetween = (parseFloat(spaceBetween.replace('%', '')) / 100) * swiperSize;
}
swiper.virtualSize = -spaceBetween;
// reset margins
if (rtl) slides.css({ marginLeft: '', marginTop: '' });
else slides.css({ marginRight: '', marginBottom: '' });
let slidesNumberEvenToRows;
if (params.slidesPerColumn > 1) {
if (Math.floor(slidesLength / params.slidesPerColumn) === slidesLength / swiper.params.slidesPerColumn) {
slidesNumberEvenToRows = slidesLength;
} else {
slidesNumberEvenToRows = Math.ceil(slidesLength / params.slidesPerColumn) * params.slidesPerColumn;
}
if (params.slidesPerView !== 'auto' && params.slidesPerColumnFill === 'row') {
slidesNumberEvenToRows = Math.max(slidesNumberEvenToRows, params.slidesPerView * params.slidesPerColumn);
}
}
// Calc slides
let slideSize;
const slidesPerColumn = params.slidesPerColumn;
const slidesPerRow = slidesNumberEvenToRows / slidesPerColumn;
const numFullColumns = Math.floor(slidesLength / params.slidesPerColumn);
for (let i = 0; i < slidesLength; i += 1) {
slideSize = 0;
const slide = slides.eq(i);
if (params.slidesPerColumn > 1) {
// Set slides order
let newSlideOrderIndex;
let column;
let row;
if (params.slidesPerColumnFill === 'row' && params.slidesPerGroup > 1) {
const groupIndex = Math.floor(i / (params.slidesPerGroup * params.slidesPerColumn));
const slideIndexInGroup = i - params.slidesPerColumn * params.slidesPerGroup * groupIndex;
const columnsInGroup = groupIndex === 0
? params.slidesPerGroup
: Math.min(Math.ceil((slidesLength - groupIndex * slidesPerColumn * params.slidesPerGroup) / slidesPerColumn), params.slidesPerGroup);
row = Math.floor(slideIndexInGroup / columnsInGroup);
column = (slideIndexInGroup - row * columnsInGroup) + groupIndex * params.slidesPerGroup;
newSlideOrderIndex = column + ((row * slidesNumberEvenToRows) / slidesPerColumn);
slide
.css({
'-webkit-box-ordinal-group': newSlideOrderIndex,
'-moz-box-ordinal-group': newSlideOrderIndex,
'-ms-flex-order': newSlideOrderIndex,
'-webkit-order': newSlideOrderIndex,
order: newSlideOrderIndex,
});
} else if (params.slidesPerColumnFill === 'column') {
column = Math.floor(i / slidesPerColumn);
row = i - (column * slidesPerColumn);
if (column > numFullColumns || (column === numFullColumns && row === slidesPerColumn - 1)) {
row += 1;
if (row >= slidesPerColumn) {
row = 0;
column += 1;
}
}
} else {
row = Math.floor(i / slidesPerRow);
column = i - (row * slidesPerRow);
}
slide.css(
`margin-${swiper.isHorizontal() ? 'top' : 'left'}`,
(row !== 0 && params.spaceBetween) && (`${params.spaceBetween}px`)
);
}
if (slide.css('display') === 'none') continue; // eslint-disable-line
if (params.slidesPerView === 'auto') {
const slideStyles = win.getComputedStyle(slide[0], null);
const currentTransform = slide[0].style.transform;
const currentWebKitTransform = slide[0].style.webkitTransform;
if (currentTransform) {
slide[0].style.transform = 'none';
}
if (currentWebKitTransform) {
slide[0].style.webkitTransform = 'none';
}
if (params.roundLengths) {
slideSize = swiper.isHorizontal()
? slide.outerWidth(true)
: slide.outerHeight(true);
} else {
// eslint-disable-next-line
if (swiper.isHorizontal()) {
const width = parseFloat(slideStyles.getPropertyValue('width'));
const paddingLeft = parseFloat(slideStyles.getPropertyValue('padding-left'));
const paddingRight = parseFloat(slideStyles.getPropertyValue('padding-right'));
const marginLeft = parseFloat(slideStyles.getPropertyValue('margin-left'));
const marginRight = parseFloat(slideStyles.getPropertyValue('margin-right'));
const boxSizing = slideStyles.getPropertyValue('box-sizing');
if (boxSizing && boxSizing === 'border-box') {
slideSize = width + marginLeft + marginRight;
} else {
slideSize = width + paddingLeft + paddingRight + marginLeft + marginRight;
}
} else {
const height = parseFloat(slideStyles.getPropertyValue('height'));
const paddingTop = parseFloat(slideStyles.getPropertyValue('padding-top'));
const paddingBottom = parseFloat(slideStyles.getPropertyValue('padding-bottom'));
const marginTop = parseFloat(slideStyles.getPropertyValue('margin-top'));
const marginBottom = parseFloat(slideStyles.getPropertyValue('margin-bottom'));
const boxSizing = slideStyles.getPropertyValue('box-sizing');
if (boxSizing && boxSizing === 'border-box') {
slideSize = height + marginTop + marginBottom;
} else {
slideSize = height + paddingTop + paddingBottom + marginTop + marginBottom;
}
}
}
if (currentTransform) {
slide[0].style.transform = currentTransform;
}
if (currentWebKitTransform) {
slide[0].style.webkitTransform = currentWebKitTransform;
}
if (params.roundLengths) slideSize = Math.floor(slideSize);
} else {
slideSize = (swiperSize - ((params.slidesPerView - 1) * spaceBetween)) / params.slidesPerView;
if (params.roundLengths) slideSize = Math.floor(slideSize);
if (slides[i]) {
if (swiper.isHorizontal()) {
slides[i].style.width = `${slideSize}px`;
} else {
slides[i].style.height = `${slideSize}px`;
}
}
}
if (slides[i]) {
slides[i].swiperSlideSize = slideSize;
}
slidesSizesGrid.push(slideSize);
if (params.centeredSlides) {
slidePosition = slidePosition + (slideSize / 2) + (prevSlideSize / 2) + spaceBetween;
if (prevSlideSize === 0 && i !== 0) slidePosition = slidePosition - (swiperSize / 2) - spaceBetween;
if (i === 0) slidePosition = slidePosition - (swiperSize / 2) - spaceBetween;
if (Math.abs(slidePosition) < 1 / 1000) slidePosition = 0;
if (params.roundLengths) slidePosition = Math.floor(slidePosition);
if ((index) % params.slidesPerGroup === 0) snapGrid.push(slidePosition);
slidesGrid.push(slidePosition);
} else {
if (params.roundLengths) slidePosition = Math.floor(slidePosition);
if ((index - Math.min(swiper.params.slidesPerGroupSkip, index)) % swiper.params.slidesPerGroup === 0) snapGrid.push(slidePosition);
slidesGrid.push(slidePosition);
slidePosition = slidePosition + slideSize + spaceBetween;
}
swiper.virtualSize += slideSize + spaceBetween;
prevSlideSize = slideSize;
index += 1;
}
swiper.virtualSize = Math.max(swiper.virtualSize, swiperSize) + offsetAfter;
let newSlidesGrid;
if (
rtl && wrongRTL && (params.effect === 'slide' || params.effect === 'coverflow')) {
$wrapperEl.css({ width: `${swiper.virtualSize + params.spaceBetween}px` });
}
if (params.setWrapperSize) {
if (swiper.isHorizontal()) $wrapperEl.css({ width: `${swiper.virtualSize + params.spaceBetween}px` });
else $wrapperEl.css({ height: `${swiper.virtualSize + params.spaceBetween}px` });
}
if (params.slidesPerColumn > 1) {
swiper.virtualSize = (slideSize + params.spaceBetween) * slidesNumberEvenToRows;
swiper.virtualSize = Math.ceil(swiper.virtualSize / params.slidesPerColumn) - params.spaceBetween;
if (swiper.isHorizontal()) $wrapperEl.css({ width: `${swiper.virtualSize + params.spaceBetween}px` });
else $wrapperEl.css({ height: `${swiper.virtualSize + params.spaceBetween}px` });
if (params.centeredSlides) {
newSlidesGrid = [];
for (let i = 0; i < snapGrid.length; i += 1) {
let slidesGridItem = snapGrid[i];
if (params.roundLengths) slidesGridItem = Math.floor(slidesGridItem);
if (snapGrid[i] < swiper.virtualSize + snapGrid[0]) newSlidesGrid.push(slidesGridItem);
}
snapGrid = newSlidesGrid;
}
}
// Remove last grid elements depending on width
if (!params.centeredSlides) {
newSlidesGrid = [];
for (let i = 0; i < snapGrid.length; i += 1) {
let slidesGridItem = snapGrid[i];
if (params.roundLengths) slidesGridItem = Math.floor(slidesGridItem);
if (snapGrid[i] <= swiper.virtualSize - swiperSize) {
newSlidesGrid.push(slidesGridItem);
}
}
snapGrid = newSlidesGrid;
if (Math.floor(swiper.virtualSize - swiperSize) - Math.floor(snapGrid[snapGrid.length - 1]) > 1) {
snapGrid.push(swiper.virtualSize - swiperSize);
}
}
if (snapGrid.length === 0) snapGrid = [0];
if (params.spaceBetween !== 0) {
if (swiper.isHorizontal()) {
if (rtl) slides.filter(slidesForMargin).css({ marginLeft: `${spaceBetween}px` });
else slides.filter(slidesForMargin).css({ marginRight: `${spaceBetween}px` });
} else slides.filter(slidesForMargin).css({ marginBottom: `${spaceBetween}px` });
}
if (params.centeredSlides && params.centeredSlidesBounds) {
let allSlidesSize = 0;
slidesSizesGrid.forEach((slideSizeValue) => {
allSlidesSize += slideSizeValue + (params.spaceBetween ? params.spaceBetween : 0);
});
allSlidesSize -= params.spaceBetween;
const maxSnap = allSlidesSize - swiperSize;
snapGrid = snapGrid.map((snap) => {
if (snap < 0) return -offsetBefore;
if (snap > maxSnap) return maxSnap + offsetAfter;
return snap;
});
}
if (params.centerInsufficientSlides) {
let allSlidesSize = 0;
slidesSizesGrid.forEach((slideSizeValue) => {
allSlidesSize += slideSizeValue + (params.spaceBetween ? params.spaceBetween : 0);
});
allSlidesSize -= params.spaceBetween;
if (allSlidesSize < swiperSize) {
const allSlidesOffset = (swiperSize - allSlidesSize) / 2;
snapGrid.forEach((snap, snapIndex) => {
snapGrid[snapIndex] = snap - allSlidesOffset;
});
slidesGrid.forEach((snap, snapIndex) => {
slidesGrid[snapIndex] = snap + allSlidesOffset;
});
}
}
Utils.extend(swiper, {
slides,
snapGrid,
slidesGrid,
slidesSizesGrid,
});
if (slidesLength !== previousSlidesLength) {
swiper.emit('slidesLengthChange');
}
if (snapGrid.length !== previousSnapGridLength) {
if (swiper.params.watchOverflow) swiper.checkOverflow();
swiper.emit('snapGridLengthChange');
}
if (slidesGrid.length !== previousSlidesGridLength) {
swiper.emit('slidesGridLengthChange');
}
if (params.watchSlidesProgress || params.watchSlidesVisibility) {
swiper.updateSlidesOffset();
}
}
function updateAutoHeight (speed) {
const swiper = this;
const activeSlides = [];
let newHeight = 0;
let i;
if (typeof speed === 'number') {
swiper.setTransition(speed);
} else if (speed === true) {
swiper.setTransition(swiper.params.speed);
}
// Find slides currently in view
if (swiper.params.slidesPerView !== 'auto' && swiper.params.slidesPerView > 1) {
if (swiper.params.centeredSlides) {
swiper.visibleSlides.each((index, slide) => {
activeSlides.push(slide);
});
} else {
for (i = 0; i < Math.ceil(swiper.params.slidesPerView); i += 1) {
const index = swiper.activeIndex + i;
if (index > swiper.slides.length) break;
activeSlides.push(swiper.slides.eq(index)[0]);
}
}
} else {
activeSlides.push(swiper.slides.eq(swiper.activeIndex)[0]);
}
// Find new height from highest slide in view
for (i = 0; i < activeSlides.length; i += 1) {
if (typeof activeSlides[i] !== 'undefined') {
const height = activeSlides[i].offsetHeight;
newHeight = height > newHeight ? height : newHeight;
}
}
// Update Height
if (newHeight) swiper.$wrapperEl.css('height', `${newHeight}px`);
}
function updateSlidesOffset () {
const swiper = this;
const slides = swiper.slides;
for (let i = 0; i < slides.length; i += 1) {
slides[i].swiperSlideOffset = swiper.isHorizontal() ? slides[i].offsetLeft : slides[i].offsetTop;
}
}
function updateSlidesProgress (translate = (this && this.translate) || 0) {
const swiper = this;
const params = swiper.params;
const { slides, rtlTranslate: rtl } = swiper;
if (slides.length === 0) return;
if (typeof slides[0].swiperSlideOffset === 'undefined') swiper.updateSlidesOffset();
let offsetCenter = -translate;
if (rtl) offsetCenter = translate;
// Visible Slides
slides.removeClass(params.slideVisibleClass);
swiper.visibleSlidesIndexes = [];
swiper.visibleSlides = [];
for (let i = 0; i < slides.length; i += 1) {
const slide = slides[i];
const slideProgress = (
(offsetCenter + (params.centeredSlides ? swiper.minTranslate() : 0)) - slide.swiperSlideOffset
) / (slide.swiperSlideSize + params.spaceBetween);
if (params.watchSlidesVisibility || (params.centeredSlides && params.autoHeight)) {
const slideBefore = -(offsetCenter - slide.swiperSlideOffset);
const slideAfter = slideBefore + swiper.slidesSizesGrid[i];
const isVisible = (slideBefore >= 0 && slideBefore < swiper.size - 1)
|| (slideAfter > 1 && slideAfter <= swiper.size)
|| (slideBefore <= 0 && slideAfter >= swiper.size);
if (isVisible) {
swiper.visibleSlides.push(slide);
swiper.visibleSlidesIndexes.push(i);
slides.eq(i).addClass(params.slideVisibleClass);
}
}
slide.progress = rtl ? -slideProgress : slideProgress;
}
swiper.visibleSlides = $(swiper.visibleSlides);
}
function updateProgress (translate) {
const swiper = this;
if (typeof translate === 'undefined') {
const multiplier = swiper.rtlTranslate ? -1 : 1;
// eslint-disable-next-line
translate = (swiper && swiper.translate && (swiper.translate * multiplier)) || 0;
}
const params = swiper.params;
const translatesDiff = swiper.maxTranslate() - swiper.minTranslate();
let { progress, isBeginning, isEnd } = swiper;
const wasBeginning = isBeginning;
const wasEnd = isEnd;
if (translatesDiff === 0) {
progress = 0;
isBeginning = true;
isEnd = true;
} else {
progress = (translate - swiper.minTranslate()) / (translatesDiff);
isBeginning = progress <= 0;
isEnd = progress >= 1;
}
Utils.extend(swiper, {
progress,
isBeginning,
isEnd,
});
if (params.watchSlidesProgress || params.watchSlidesVisibility || (params.centeredSlides && params.autoHeight)) swiper.updateSlidesProgress(translate);
if (isBeginning && !wasBeginning) {
swiper.emit('reachBeginning toEdge');
}
if (isEnd && !wasEnd) {
swiper.emit('reachEnd toEdge');
}
if ((wasBeginning && !isBeginning) || (wasEnd && !isEnd)) {
swiper.emit('fromEdge');
}
swiper.emit('progress', progress);
}
function updateSlidesClasses () {
const swiper = this;
const {
slides, params, $wrapperEl, activeIndex, realIndex,
} = swiper;
const isVirtual = swiper.virtual && params.virtual.enabled;
slides.removeClass(`${params.slideActiveClass} ${params.slideNextClass} ${params.slidePrevClass} ${params.slideDuplicateActiveClass} ${params.slideDuplicateNextClass} ${params.slideDuplicatePrevClass}`);
let activeSlide;
if (isVirtual) {
activeSlide = swiper.$wrapperEl.find(`.${params.slideClass}[data-swiper-slide-index="${activeIndex}"]`);
} else {
activeSlide = slides.eq(activeIndex);
}
// Active classes
activeSlide.addClass(params.slideActiveClass);
if (params.loop) {
// Duplicate to all looped slides
if (activeSlide.hasClass(params.slideDuplicateClass)) {
$wrapperEl
.children(`.${params.slideClass}:not(.${params.slideDuplicateClass})[data-swiper-slide-index="${realIndex}"]`)
.addClass(params.slideDuplicateActiveClass);
} else {
$wrapperEl
.children(`.${params.slideClass}.${params.slideDuplicateClass}[data-swiper-slide-index="${realIndex}"]`)
.addClass(params.slideDuplicateActiveClass);
}
}
// Next Slide
let nextSlide = activeSlide.nextAll(`.${params.slideClass}`).eq(0).addClass(params.slideNextClass);
if (params.loop && nextSlide.length === 0) {
nextSlide = slides.eq(0);
nextSlide.addClass(params.slideNextClass);
}
// Prev Slide
let prevSlide = activeSlide.prevAll(`.${params.slideClass}`).eq(0).addClass(params.slidePrevClass);
if (params.loop && prevSlide.length === 0) {
prevSlide = slides.eq(-1);
prevSlide.addClass(params.slidePrevClass);
}
if (params.loop) {
// Duplicate to all looped slides
if (nextSlide.hasClass(params.slideDuplicateClass)) {
$wrapperEl
.children(`.${params.slideClass}:not(.${params.slideDuplicateClass})[data-swiper-slide-index="${nextSlide.attr('data-swiper-slide-index')}"]`)
.addClass(params.slideDuplicateNextClass);
} else {
$wrapperEl
.children(`.${params.slideClass}.${params.slideDuplicateClass}[data-swiper-slide-index="${nextSlide.attr('data-swiper-slide-index')}"]`)
.addClass(params.slideDuplicateNextClass);
}
if (prevSlide.hasClass(params.slideDuplicateClass)) {
$wrapperEl
.children(`.${params.slideClass}:not(.${params.slideDuplicateClass})[data-swiper-slide-index="${prevSlide.attr('data-swiper-slide-index')}"]`)
.addClass(params.slideDuplicatePrevClass);
} else {
$wrapperEl
.children(`.${params.slideClass}.${params.slideDuplicateClass}[data-swiper-slide-index="${prevSlide.attr('data-swiper-slide-index')}"]`)
.addClass(params.slideDuplicatePrevClass);
}
}
}
function updateActiveIndex (newActiveIndex) {
const swiper = this;
const translate = swiper.rtlTranslate ? swiper.translate : -swiper.translate;
const {
slidesGrid, snapGrid, params, activeIndex: previousIndex, realIndex: previousRealIndex, snapIndex: previousSnapIndex,
} = swiper;
let activeIndex = newActiveIndex;
let snapIndex;
if (typeof activeIndex === 'undefined') {
for (let i = 0; i < slidesGrid.length; i += 1) {
if (typeof slidesGrid[i + 1] !== 'undefined') {
if (translate >= slidesGrid[i] && translate < slidesGrid[i + 1] - ((slidesGrid[i + 1] - slidesGrid[i]) / 2)) {
activeIndex = i;
} else if (translate >= slidesGrid[i] && translate < slidesGrid[i + 1]) {
activeIndex = i + 1;
}
} else if (translate >= slidesGrid[i]) {
activeIndex = i;
}
}
// Normalize slideIndex
if (params.normalizeSlideIndex) {
if (activeIndex < 0 || typeof activeIndex === 'undefined') activeIndex = 0;
}
}
if (snapGrid.indexOf(translate) >= 0) {
snapIndex = snapGrid.indexOf(translate);
} else {
const skip = Math.min(params.slidesPerGroupSkip, activeIndex);
snapIndex = skip + Math.floor((activeIndex - skip) / params.slidesPerGroup);
}
if (snapIndex >= snapGrid.length) snapIndex = snapGrid.length - 1;
if (activeIndex === previousIndex) {
if (snapIndex !== previousSnapIndex) {
swiper.snapIndex = snapIndex;
swiper.emit('snapIndexChange');
}
return;
}
// Get real index
const realIndex = parseInt(swiper.slides.eq(activeIndex).attr('data-swiper-slide-index') || activeIndex, 10);
Utils.extend(swiper, {
snapIndex,
realIndex,
previousIndex,
activeIndex,
});
swiper.emit('activeIndexChange');
swiper.emit('snapIndexChange');
if (previousRealIndex !== realIndex) {
swiper.emit('realIndexChange');
}
if (swiper.initialized || swiper.params.runCallbacksOnInit) {
swiper.emit('slideChange');
}
}
function updateClickedSlide (e) {
const swiper = this;
const params = swiper.params;
const slide = $(e.target).closest(`.${params.slideClass}`)[0];
let slideFound = false;
if (slide) {
for (let i = 0; i < swiper.slides.length; i += 1) {
if (swiper.slides[i] === slide) slideFound = true;
}
}
if (slide && slideFound) {
swiper.clickedSlide = slide;
if (swiper.virtual && swiper.params.virtual.enabled) {
swiper.clickedIndex = parseInt($(slide).attr('data-swiper-slide-index'), 10);
} else {
swiper.clickedIndex = $(slide).index();
}
} else {
swiper.clickedSlide = undefined;
swiper.clickedIndex = undefined;
return;
}
if (params.slideToClickedSlide && swiper.clickedIndex !== undefined && swiper.clickedIndex !== swiper.activeIndex) {
swiper.slideToClickedSlide();
}
}
var update = {
updateSize,
updateSlides,
updateAutoHeight,
updateSlidesOffset,
updateSlidesProgress,
updateProgress,
updateSlidesClasses,
updateActiveIndex,
updateClickedSlide,
};
function getTranslate (axis = this.isHorizontal() ? 'x' : 'y') {
const swiper = this;
const {
params, rtlTranslate: rtl, translate, $wrapperEl,
} = swiper;
if (params.virtualTranslate) {
return rtl ? -translate : translate;
}
if (params.cssMode) {
return translate;
}
let currentTranslate = Utils.getTranslate($wrapperEl[0], axis);
if (rtl) currentTranslate = -currentTranslate;
return currentTranslate || 0;
}
function setTranslate (translate, byController) {
const swiper = this;
const {
rtlTranslate: rtl, params, $wrapperEl, wrapperEl, progress,
} = swiper;
let x = 0;
let y = 0;
const z = 0;
if (swiper.isHorizontal()) {
x = rtl ? -translate : translate;
} else {
y = translate;
}
if (params.roundLengths) {
x = Math.floor(x);
y = Math.floor(y);
}
if (params.cssMode) {
wrapperEl[swiper.isHorizontal() ? 'scrollLeft' : 'scrollTop'] = swiper.isHorizontal() ? -x : -y;
} else if (!params.virtualTranslate) {
$wrapperEl.transform(`translate3d(${x}px, ${y}px, ${z}px)`);
}
swiper.previousTranslate = swiper.translate;
swiper.translate = swiper.isHorizontal() ? x : y;
// Check if we need to update progress
let newProgress;
const translatesDiff = swiper.maxTranslate() - swiper.minTranslate();
if (translatesDiff === 0) {
newProgress = 0;
} else {
newProgress = (translate - swiper.minTranslate()) / (translatesDiff);
}
if (newProgress !== progress) {
swiper.updateProgress(translate);
}
swiper.emit('setTranslate', swiper.translate, byController);
}
function minTranslate () {
return (-this.snapGrid[0]);
}
function maxTranslate () {
return (-this.snapGrid[this.snapGrid.length - 1]);
}
function translateTo (translate = 0, speed = this.params.speed, runCallbacks = true, translateBounds = true, internal) {
const swiper = this;
const {
params,
wrapperEl,
} = swiper;
if (swiper.animating && params.preventInteractionOnTransition) {
return false;
}
const minTranslate = swiper.minTranslate();
const maxTranslate = swiper.maxTranslate();
let newTranslate;
if (translateBounds && translate > minTranslate) newTranslate = minTranslate;
else if (translateBounds && translate < maxTranslate) newTranslate = maxTranslate;
else newTranslate = translate;
// Update progress
swiper.updateProgress(newTranslate);
if (params.cssMode) {
const isH = swiper.isHorizontal();
if (speed === 0) {
wrapperEl[isH ? 'scrollLeft' : 'scrollTop'] = -newTranslate;
} else {
// eslint-disable-next-line
if (wrapperEl.scrollTo) {
wrapperEl.scrollTo({
[isH ? 'left' : 'top']: -newTranslate,
behavior: 'smooth',
});
} else {
wrapperEl[isH ? 'scrollLeft' : 'scrollTop'] = -newTranslate;
}
}
return true;
}
if (speed === 0) {
swiper.setTransition(0);
swiper.setTranslate(newTranslate);
if (runCallbacks) {
swiper.emit('beforeTransitionStart', speed, internal);
swiper.emit('transitionEnd');
}
} else {
swiper.setTransition(speed);
swiper.setTranslate(newTranslate);
if (runCallbacks) {
swiper.emit('beforeTransitionStart', speed, internal);
swiper.emit('transitionStart');
}
if (!swiper.animating) {
swiper.animating = true;
if (!swiper.onTranslateToWrapperTransitionEnd) {
swiper.onTranslateToWrapperTransitionEnd = function transitionEnd(e) {
if (!swiper || swiper.destroyed) return;
if (e.target !== this) return;
swiper.$wrapperEl[0].removeEventListener('transitionend', swiper.onTranslateToWrapperTransitionEnd);
swiper.$wrapperEl[0].removeEventListener('webkitTransitionEnd', swiper.onTranslateToWrapperTransitionEnd);
swiper.onTranslateToWrapperTransitionEnd = null;
delete swiper.onTranslateToWrapperTransitionEnd;
if (runCallbacks) {
swiper.emit('transitionEnd');
}
};
}
swiper.$wrapperEl[0].addEventListener('transitionend', swiper.onTranslateToWrapperTransitionEnd);
swiper.$wrapperEl[0].addEventListener('webkitTransitionEnd', swiper.onTranslateToWrapperTransitionEnd);
}
}
return true;
}
var translate = {
getTranslate,
setTranslate,
minTranslate,
maxTranslate,
translateTo,
};
function setTransition (duration, byController) {
const swiper = this;
if (!swiper.params.cssMode) {
swiper.$wrapperEl.transition(duration);
}
swiper.emit('setTransition', duration, byController);
}
function transitionStart (runCallbacks = true, direction) {
const swiper = this;
const { activeIndex, params, previousIndex } = swiper;
if (params.cssMode) return;
if (params.autoHeight) {
swiper.updateAutoHeight();
}
let dir = direction;
if (!dir) {
if (activeIndex > previousIndex) dir = 'next';
else if (activeIndex < previousIndex) dir = 'prev';
else dir = 'reset';
}
swiper.emit('transitionStart');
if (runCallbacks && activeIndex !== previousIndex) {
if (dir === 'reset') {
swiper.emit('slideResetTransitionStart');
return;
}
swiper.emit('slideChangeTransitionStart');
if (dir === 'next') {
swiper.emit('slideNextTransitionStart');
} else {
swiper.emit('slidePrevTransitionStart');
}
}
}
function transitionEnd$1 (runCallbacks = true, direction) {
const swiper = this;
const { activeIndex, previousIndex, params } = swiper;
swiper.animating = false;
if (params.cssMode) return;
swiper.setTransition(0);
let dir = direction;
if (!dir) {
if (activeIndex > previousIndex) dir = 'next';
else if (activeIndex < previousIndex) dir = 'prev';
else dir = 'reset';
}
swiper.emit('transitionEnd');
if (runCallbacks && activeIndex !== previousIndex) {
if (dir === 'reset') {
swiper.emit('slideResetTransitionEnd');
return;
}
swiper.emit('slideChangeTransitionEnd');
if (dir === 'next') {
swiper.emit('slideNextTransitionEnd');
} else {
swiper.emit('slidePrevTransitionEnd');
}
}
}
var transition$1 = {
setTransition,
transitionStart,
transitionEnd: transitionEnd$1,
};
function slideTo (index = 0, speed = this.params.speed, runCallbacks = true, internal) {
const swiper = this;
let slideIndex = index;
if (slideIndex < 0) slideIndex = 0;
const {
params, snapGrid, slidesGrid, previousIndex, activeIndex, rtlTranslate: rtl, wrapperEl,
} = swiper;
if (swiper.animating && params.preventInteractionOnTransition) {
return false;
}
const skip = Math.min(swiper.params.slidesPerGroupSkip, slideIndex);
let snapIndex = skip + Math.floor((slideIndex - skip) / swiper.params.slidesPerGroup);
if (snapIndex >= snapGrid.length) snapIndex = snapGrid.length - 1;
if ((activeIndex || params.initialSlide || 0) === (previousIndex || 0) && runCallbacks) {
swiper.emit('beforeSlideChangeStart');
}
const translate = -snapGrid[snapIndex];
// Update progress
swiper.updateProgress(translate);
// Normalize slideIndex
if (params.normalizeSlideIndex) {
for (let i = 0; i < slidesGrid.length; i += 1) {
if (-Math.floor(translate * 100) >= Math.floor(slidesGrid[i] * 100)) {
slideIndex = i;
}
}
}
// Directions locks
if (swiper.initialized && slideIndex !== activeIndex) {
if (!swiper.allowSlideNext && translate < swiper.translate && translate < swiper.minTranslate()) {
return false;
}
if (!swiper.allowSlidePrev && translate > swiper.translate && translate > swiper.maxTranslate()) {
if ((activeIndex || 0) !== slideIndex) return false;
}
}
let direction;
if (slideIndex > activeIndex) direction = 'next';
else if (slideIndex < activeIndex) direction = 'prev';
else direction = 'reset';
// Update Index
if ((rtl && -translate === swiper.translate) || (!rtl && translate === swiper.translate)) {
swiper.updateActiveIndex(slideIndex);
// Update Height
if (params.autoHeight) {
swiper.updateAutoHeight();
}
swiper.updateSlidesClasses();
if (params.effect !== 'slide') {
swiper.setTranslate(translate);
}
if (direction !== 'reset') {
swiper.transitionStart(runCallbacks, direction);
swiper.transitionEnd(runCallbacks, direction);
}
return false;
}
if (params.cssMode) {
const isH = swiper.isHorizontal();
let t = -translate;
if (rtl) {
t = wrapperEl.scrollWidth - wrapperEl.offsetWidth - t;
}
if (speed === 0) {
wrapperEl[isH ? 'scrollLeft' : 'scrollTop'] = t;
} else {
// eslint-disable-next-line
if (wrapperEl.scrollTo) {
wrapperEl.scrollTo({
[isH ? 'left' : 'top']: t,
behavior: 'smooth',
});
} else {
wrapperEl[isH ? 'scrollLeft' : 'scrollTop'] = t;
}
}
return true;
}
if (speed === 0) {
swiper.setTransition(0);
swiper.setTranslate(translate);
swiper.updateActiveIndex(slideIndex);
swiper.updateSlidesClasses();
swiper.emit('beforeTransitionStart', speed, internal);
swiper.transitionStart(runCallbacks, direction);
swiper.transitionEnd(runCallbacks, direction);
} else {
swiper.setTransition(speed);
swiper.setTranslate(translate);
swiper.updateActiveIndex(slideIndex);
swiper.updateSlidesClasses();
swiper.emit('beforeTransitionStart', speed, internal);
swiper.transitionStart(runCallbacks, direction);
if (!swiper.animating) {
swiper.animating = true;
if (!swiper.onSlideToWrapperTransitionEnd) {
swiper.onSlideToWrapperTransitionEnd = function transitionEnd(e) {
if (!swiper || swiper.destroyed) return;
if (e.target !== this) return;
swiper.$wrapperEl[0].removeEventListener('transitionend', swiper.onSlideToWrapperTransitionEnd);
swiper.$wrapperEl[0].removeEventListener('webkitTransitionEnd', swiper.onSlideToWrapperTransitionEnd);
swiper.onSlideToWrapperTransitionEnd = null;
delete swiper.onSlideToWrapperTransitionEnd;
swiper.transitionEnd(runCallbacks, direction);
};
}
swiper.$wrapperEl[0].addEventListener('transitionend', swiper.onSlideToWrapperTransitionEnd);
swiper.$wrapperEl[0].addEventListener('webkitTransitionEnd', swiper.onSlideToWrapperTransitionEnd);
}
}
return true;
}
function slideToLoop (index = 0, speed = this.params.speed, runCallbacks = true, internal) {
const swiper = this;
let newIndex = index;
if (swiper.params.loop) {
newIndex += swiper.loopedSlides;
}
return swiper.slideTo(newIndex, speed, runCallbacks, internal);
}
/* eslint no-unused-vars: "off" */
function slideNext (speed = this.params.speed, runCallbacks = true, internal) {
const swiper = this;
const { params, animating } = swiper;
const increment = swiper.activeIndex < params.slidesPerGroupSkip ? 1 : params.slidesPerGroup;
if (params.loop) {
if (animating) return false;
swiper.loopFix();
// eslint-disable-next-line
swiper._clientLeft = swiper.$wrapperEl[0].clientLeft;
}
return swiper.slideTo(swiper.activeIndex + increment, speed, runCallbacks, internal);
}
/* eslint no-unused-vars: "off" */
function slidePrev (speed = this.params.speed, runCallbacks = true, internal) {
const swiper = this;
const {
params, animating, snapGrid, slidesGrid, rtlTranslate,
} = swiper;
if (params.loop) {
if (animating) return false;
swiper.loopFix();
// eslint-disable-next-line
swiper._clientLeft = swiper.$wrapperEl[0].clientLeft;
}
const translate = rtlTranslate ? swiper.translate : -swiper.translate;
function normalize(val) {
if (val < 0) return -Math.floor(Math.abs(val));
return Math.floor(val);
}
const normalizedTranslate = normalize(translate);
const normalizedSnapGrid = snapGrid.map((val) => normalize(val));
slidesGrid.map((val) => normalize(val));
snapGrid[normalizedSnapGrid.indexOf(normalizedTranslate)];
let prevSnap = snapGrid[normalizedSnapGrid.indexOf(normalizedTranslate) - 1];
if (typeof prevSnap === 'undefined' && params.cssMode) {
snapGrid.forEach((snap) => {
if (!prevSnap && normalizedTranslate >= snap) prevSnap = snap;
});
}
let prevIndex;
if (typeof prevSnap !== 'undefined') {
prevIndex = slidesGrid.indexOf(prevSnap);
if (prevIndex < 0) prevIndex = swiper.activeIndex - 1;
}
return swiper.slideTo(prevIndex, speed, runCallbacks, internal);
}
/* eslint no-unused-vars: "off" */
function slideReset (speed = this.params.speed, runCallbacks = true, internal) {
const swiper = this;
return swiper.slideTo(swiper.activeIndex, speed, runCallbacks, internal);
}
/* eslint no-unused-vars: "off" */
function slideToClosest (speed = this.params.speed, runCallbacks = true, internal, threshold = 0.5) {
const swiper = this;
let index = swiper.activeIndex;
const skip = Math.min(swiper.params.slidesPerGroupSkip, index);
const snapIndex = skip + Math.floor((index - skip) / swiper.params.slidesPerGroup);
const translate = swiper.rtlTranslate ? swiper.translate : -swiper.translate;
if (translate >= swiper.snapGrid[snapIndex]) {
// The current translate is on or after the current snap index, so the choice
// is between the current index and the one after it.
const currentSnap = swiper.snapGrid[snapIndex];
const nextSnap = swiper.snapGrid[snapIndex + 1];
if ((translate - currentSnap) > (nextSnap - currentSnap) * threshold) {
index += swiper.params.slidesPerGroup;
}
} else {
// The current translate is before the current snap index, so the choice
// is between the current index and the one before it.
const prevSnap = swiper.snapGrid[snapIndex - 1];
const currentSnap = swiper.snapGrid[snapIndex];
if ((translate - prevSnap) <= (currentSnap - prevSnap) * threshold) {
index -= swiper.params.slidesPerGroup;
}
}
index = Math.max(index, 0);
index = Math.min(index, swiper.slidesGrid.length - 1);
return swiper.slideTo(index, speed, runCallbacks, internal);
}
function slideToClickedSlide () {
const swiper = this;
const { params, $wrapperEl } = swiper;
const slidesPerView = params.slidesPerView === 'auto' ? swiper.slidesPerViewDynamic() : params.slidesPerView;
let slideToIndex = swiper.clickedIndex;
let realIndex;
if (params.loop) {
if (swiper.animating) return;
realIndex = parseInt($(swiper.clickedSlide).attr('data-swiper-slide-index'), 10);
if (params.centeredSlides) {
if (
(slideToIndex < swiper.loopedSlides - (slidesPerView / 2))
|| (slideToIndex > (swiper.slides.length - swiper.loopedSlides) + (slidesPerView / 2))
) {
swiper.loopFix();
slideToIndex = $wrapperEl
.children(`.${params.slideClass}[data-swiper-slide-index="${realIndex}"]:not(.${params.slideDuplicateClass})`)
.eq(0)
.index();
Utils.nextTick(() => {
swiper.slideTo(slideToIndex);
});
} else {
swiper.slideTo(slideToIndex);
}
} else if (slideToIndex > swiper.slides.length - slidesPerView) {
swiper.loopFix();
slideToIndex = $wrapperEl
.children(`.${params.slideClass}[data-swiper-slide-index="${realIndex}"]:not(.${params.slideDuplicateClass})`)
.eq(0)
.index();
Utils.nextTick(() => {
swiper.slideTo(slideToIndex);
});
} else {
swiper.slideTo(slideToIndex);
}
} else {
swiper.slideTo(slideToIndex);
}
}
var slide = {
slideTo,
slideToLoop,
slideNext,
slidePrev,
slideReset,
slideToClosest,
slideToClickedSlide,
};
function loopCreate () {
const swiper = this;
const { params, $wrapperEl } = swiper;
// Remove duplicated slides
$wrapperEl.children(`.${params.slideClass}.${params.slideDuplicateClass}`).remove();
let slides = $wrapperEl.children(`.${params.slideClass}`);
if (params.loopFillGroupWithBlank) {
const blankSlidesNum = params.slidesPerGroup - (slides.length % params.slidesPerGroup);
if (blankSlidesNum !== params.slidesPerGroup) {
for (let i = 0; i < blankSlidesNum; i += 1) {
const blankNode = $(doc.createElement('div')).addClass(`${params.slideClass} ${params.slideBlankClass}`);
$wrapperEl.append(blankNode);
}
slides = $wrapperEl.children(`.${params.slideClass}`);
}
}
if (params.slidesPerView === 'auto' && !params.loopedSlides) params.loopedSlides = slides.length;
swiper.loopedSlides = Math.ceil(parseFloat(params.loopedSlides || params.slidesPerView, 10));
swiper.loopedSlides += params.loopAdditionalSlides;
if (swiper.loopedSlides > slides.length) {
swiper.loopedSlides = slides.length;
}
const prependSlides = [];
const appendSlides = [];
slides.each((index, el) => {
const slide = $(el);
if (index < swiper.loopedSlides) appendSlides.push(el);
if (index < slides.length && index >= slides.length - swiper.loopedSlides) prependSlides.push(el);
slide.attr('data-swiper-slide-index', index);
});
for (let i = 0; i < appendSlides.length; i += 1) {
$wrapperEl.append($(appendSlides[i].cloneNode(true)).addClass(params.slideDuplicateClass));
}
for (let i = prependSlides.length - 1; i >= 0; i -= 1) {
$wrapperEl.prepend($(prependSlides[i].cloneNode(true)).addClass(params.slideDuplicateClass));
}
}
function loopFix () {
const swiper = this;
swiper.emit('beforeLoopFix');
const {
activeIndex, slides, loopedSlides, allowSlidePrev, allowSlideNext, snapGrid, rtlTranslate: rtl,
} = swiper;
let newIndex;
swiper.allowSlidePrev = true;
swiper.allowSlideNext = true;
const snapTranslate = -snapGrid[activeIndex];
const diff = snapTranslate - swiper.getTranslate();
// Fix For Negative Oversliding
if (activeIndex < loopedSlides) {
newIndex = (slides.length - (loopedSlides * 3)) + activeIndex;
newIndex += loopedSlides;
const slideChanged = swiper.slideTo(newIndex, 0, false, true);
if (slideChanged && diff !== 0) {
swiper.setTranslate((rtl ? -swiper.translate : swiper.translate) - diff);
}
} else if (activeIndex >= slides.length - loopedSlides) {
// Fix For Positive Oversliding
newIndex = -slides.length + activeIndex + loopedSlides;
newIndex += loopedSlides;
const slideChanged = swiper.slideTo(newIndex, 0, false, true);
if (slideChanged && diff !== 0) {
swiper.setTranslate((rtl ? -swiper.translate : swiper.translate) - diff);
}
}
swiper.allowSlidePrev = allowSlidePrev;
swiper.allowSlideNext = allowSlideNext;
swiper.emit('loopFix');
}
function loopDestroy () {
const swiper = this;
const { $wrapperEl, params, slides } = swiper;
$wrapperEl.children(`.${params.slideClass}.${params.slideDuplicateClass},.${params.slideClass}.${params.slideBlankClass}`).remove();
slides.removeAttr('data-swiper-slide-index');
}
var loop = {
loopCreate,
loopFix,
loopDestroy,
};
function setGrabCursor (moving) {
const swiper = this;
if (Support.touch || !swiper.params.simulateTouch || (swiper.params.watchOverflow && swiper.isLocked) || swiper.params.cssMode) return;
const el = swiper.el;
el.style.cursor = 'move';
el.style.cursor = moving ? '-webkit-grabbing' : '-webkit-grab';
el.style.cursor = moving ? '-moz-grabbin' : '-moz-grab';
el.style.cursor = moving ? 'grabbing' : 'grab';
}
function unsetGrabCursor () {
const swiper = this;
if (Support.touch || (swiper.params.watchOverflow && swiper.isLocked) || swiper.params.cssMode) return;
swiper.el.style.cursor = '';
}
var grabCursor = {
setGrabCursor,
unsetGrabCursor,
};
function appendSlide (slides) {
const swiper = this;
const { $wrapperEl, params } = swiper;
if (params.loop) {
swiper.loopDestroy();
}
if (typeof slides === 'object' && 'length' in slides) {
for (let i = 0; i < slides.length; i += 1) {
if (slides[i]) $wrapperEl.append(slides[i]);
}
} else {
$wrapperEl.append(slides);
}
if (params.loop) {
swiper.loopCreate();
}
if (!(params.observer && Support.observer)) {
swiper.update();
}
}
function prependSlide (slides) {
const swiper = this;
const { params, $wrapperEl, activeIndex } = swiper;
if (params.loop) {
swiper.loopDestroy();
}
let newActiveIndex = activeIndex + 1;
if (typeof slides === 'object' && 'length' in slides) {
for (let i = 0; i < slides.length; i += 1) {
if (slides[i]) $wrapperEl.prepend(slides[i]);
}
newActiveIndex = activeIndex + slides.length;
} else {
$wrapperEl.prepend(slides);
}
if (params.loop) {
swiper.loopCreate();
}
if (!(params.observer && Support.observer)) {
swiper.update();
}
swiper.slideTo(newActiveIndex, 0, false);
}
function addSlide (index, slides) {
const swiper = this;
const { $wrapperEl, params, activeIndex } = swiper;
let activeIndexBuffer = activeIndex;
if (params.loop) {
activeIndexBuffer -= swiper.loopedSlides;
swiper.loopDestroy();
swiper.slides = $wrapperEl.children(`.${params.slideClass}`);
}
const baseLength = swiper.slides.length;
if (index <= 0) {
swiper.prependSlide(slides);
return;
}
if (index >= baseLength) {
swiper.appendSlide(slides);
return;
}
let newActiveIndex = activeIndexBuffer > index ? activeIndexBuffer + 1 : activeIndexBuffer;
const slidesBuffer = [];
for (let i = baseLength - 1; i >= index; i -= 1) {
const currentSlide = swiper.slides.eq(i);
currentSlide.remove();
slidesBuffer.unshift(currentSlide);
}
if (typeof slides === 'object' && 'length' in slides) {
for (let i = 0; i < slides.length; i += 1) {
if (slides[i]) $wrapperEl.append(slides[i]);
}
newActiveIndex = activeIndexBuffer > index ? activeIndexBuffer + slides.length : activeIndexBuffer;
} else {
$wrapperEl.append(slides);
}
for (let i = 0; i < slidesBuffer.length; i += 1) {
$wrapperEl.append(slidesBuffer[i]);
}
if (params.loop) {
swiper.loopCreate();
}
if (!(params.observer && Support.observer)) {
swiper.update();
}
if (params.loop) {
swiper.slideTo(newActiveIndex + swiper.loopedSlides, 0, false);
} else {
swiper.slideTo(newActiveIndex, 0, false);
}
}
function removeSlide (slidesIndexes) {
const swiper = this;
const { params, $wrapperEl, activeIndex } = swiper;
let activeIndexBuffer = activeIndex;
if (params.loop) {
activeIndexBuffer -= swiper.loopedSlides;
swiper.loopDestroy();
swiper.slides = $wrapperEl.children(`.${params.slideClass}`);
}
let newActiveIndex = activeIndexBuffer;
let indexToRemove;
if (typeof slidesIndexes === 'object' && 'length' in slidesIndexes) {
for (let i = 0; i < slidesIndexes.length; i += 1) {
indexToRemove = slidesIndexes[i];
if (swiper.slides[indexToRemove]) swiper.slides.eq(indexToRemove).remove();
if (indexToRemove < newActiveIndex) newActiveIndex -= 1;
}
newActiveIndex = Math.max(newActiveIndex, 0);
} else {
indexToRemove = slidesIndexes;
if (swiper.slides[indexToRemove]) swiper.slides.eq(indexToRemove).remove();
if (indexToRemove < newActiveIndex) newActiveIndex -= 1;
newActiveIndex = Math.max(newActiveIndex, 0);
}
if (params.loop) {
swiper.loopCreate();
}
if (!(params.observer && Support.observer)) {
swiper.update();
}
if (params.loop) {
swiper.slideTo(newActiveIndex + swiper.loopedSlides, 0, false);
} else {
swiper.slideTo(newActiveIndex, 0, false);
}
}
function removeAllSlides () {
const swiper = this;
const slidesIndexes = [];
for (let i = 0; i < swiper.slides.length; i += 1) {
slidesIndexes.push(i);
}
swiper.removeSlide(slidesIndexes);
}
var manipulation = {
appendSlide,
prependSlide,
addSlide,
removeSlide,
removeAllSlides,
};
const Device = (function Device() {
const platform = win.navigator.platform;
const ua = win.navigator.userAgent;
const device = {
ios: false,
android: false,
androidChrome: false,
desktop: false,
iphone: false,
ipod: false,
ipad: false,
edge: false,
ie: false,
firefox: false,
macos: false,
windows: false,
cordova: !!(win.cordova || win.phonegap),
phonegap: !!(win.cordova || win.phonegap),
electron: false,
};
const screenWidth = win.screen.width;
const screenHeight = win.screen.height;
const android = ua.match(/(Android);?[\s\/]+([\d.]+)?/); // eslint-disable-line
let ipad = ua.match(/(iPad).*OS\s([\d_]+)/);
const ipod = ua.match(/(iPod)(.*OS\s([\d_]+))?/);
const iphone = !ipad && ua.match(/(iPhone\sOS|iOS)\s([\d_]+)/);
const ie = ua.indexOf('MSIE ') >= 0 || ua.indexOf('Trident/') >= 0;
const edge = ua.indexOf('Edge/') >= 0;
const firefox = ua.indexOf('Gecko/') >= 0 && ua.indexOf('Firefox/') >= 0;
const windows = platform === 'Win32';
const electron = ua.toLowerCase().indexOf('electron') >= 0;
let macos = platform === 'MacIntel';
// iPadOs 13 fix
if (!ipad
&& macos
&& Support.touch
&& (
(screenWidth === 1024 && screenHeight === 1366) // Pro 12.9
|| (screenWidth === 834 && screenHeight === 1194) // Pro 11
|| (screenWidth === 834 && screenHeight === 1112) // Pro 10.5
|| (screenWidth === 768 && screenHeight === 1024) // other
)
) {
ipad = ua.match(/(Version)\/([\d.]+)/);
macos = false;
}
device.ie = ie;
device.edge = edge;
device.firefox = firefox;
// Android
if (android && !windows) {
device.os = 'android';
device.osVersion = android[2];
device.android = true;
device.androidChrome = ua.toLowerCase().indexOf('chrome') >= 0;
}
if (ipad || iphone || ipod) {
device.os = 'ios';
device.ios = true;
}
// iOS
if (iphone && !ipod) {
device.osVersion = iphone[2].replace(/_/g, '.');
device.iphone = true;
}
if (ipad) {
device.osVersion = ipad[2].replace(/_/g, '.');
device.ipad = true;
}
if (ipod) {
device.osVersion = ipod[3] ? ipod[3].replace(/_/g, '.') : null;
device.ipod = true;
}
// iOS 8+ changed UA
if (device.ios && device.osVersion && ua.indexOf('Version/') >= 0) {
if (device.osVersion.split('.')[0] === '10') {
device.osVersion = ua.toLowerCase().split('version/')[1].split(' ')[0];
}
}
// Webview
device.webView = !!((iphone || ipad || ipod) && (ua.match(/.*AppleWebKit(?!.*Safari)/i) || win.navigator.standalone))
|| (win.matchMedia && win.matchMedia('(display-mode: standalone)').matches);
device.webview = device.webView;
device.standalone = device.webView;
// Desktop
device.desktop = !(device.ios || device.android) || electron;
if (device.desktop) {
device.electron = electron;
device.macos = macos;
device.windows = windows;
if (device.macos) {
device.os = 'macos';
}
if (device.windows) {
device.os = 'windows';
}
}
// Pixel Ratio
device.pixelRatio = win.devicePixelRatio || 1;
// Export object
return device;
}());
function onTouchStart (event) {
const swiper = this;
const data = swiper.touchEventsData;
const { params, touches } = swiper;
if (swiper.animating && params.preventInteractionOnTransition) {
return;
}
let e = event;
if (e.originalEvent) e = e.originalEvent;
const $targetEl = $(e.target);
if (params.touchEventsTarget === 'wrapper') {
if (!$targetEl.closest(swiper.wrapperEl).length) return;
}
data.isTouchEvent = e.type === 'touchstart';
if (!data.isTouchEvent && 'which' in e && e.which === 3) return;
if (!data.isTouchEvent && 'button' in e && e.button > 0) return;
if (data.isTouched && data.isMoved) return;
if (params.noSwiping && $targetEl.closest(params.noSwipingSelector ? params.noSwipingSelector : `.${params.noSwipingClass}`)[0]) {
swiper.allowClick = true;
return;
}
if (params.swipeHandler) {
if (!$targetEl.closest(params.swipeHandler)[0]) return;
}
touches.currentX = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX;
touches.currentY = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;
const startX = touches.currentX;
const startY = touches.currentY;
// Do NOT start if iOS edge swipe is detected. Otherwise iOS app (UIWebView) cannot swipe-to-go-back anymore
const edgeSwipeDetection = params.edgeSwipeDetection || params.iOSEdgeSwipeDetection;
const edgeSwipeThreshold = params.edgeSwipeThreshold || params.iOSEdgeSwipeThreshold;
if (
edgeSwipeDetection
&& ((startX <= edgeSwipeThreshold)
|| (startX >= win.screen.width - edgeSwipeThreshold))
) {
return;
}
Utils.extend(data, {
isTouched: true,
isMoved: false,
allowTouchCallbacks: true,
isScrolling: undefined,
startMoving: undefined,
});
touches.startX = startX;
touches.startY = startY;
data.touchStartTime = Utils.now();
swiper.allowClick = true;
swiper.updateSize();
swiper.swipeDirection = undefined;
if (params.threshold > 0) data.allowThresholdMove = false;
if (e.type !== 'touchstart') {
let preventDefault = true;
if ($targetEl.is(data.formElements)) preventDefault = false;
if (
doc.activeElement
&& $(doc.activeElement).is(data.formElements)
&& doc.activeElement !== $targetEl[0]
) {
doc.activeElement.blur();
}
const shouldPreventDefault = preventDefault && swiper.allowTouchMove && params.touchStartPreventDefault;
if (params.touchStartForcePreventDefault || shouldPreventDefault) {
e.preventDefault();
}
}
swiper.emit('touchStart', e);
}
function onTouchMove (event) {
const swiper = this;
const data = swiper.touchEventsData;
const { params, touches, rtlTranslate: rtl } = swiper;
let e = event;
if (e.originalEvent) e = e.originalEvent;
if (!data.isTouched) {
if (data.startMoving && data.isScrolling) {
swiper.emit('touchMoveOpposite', e);
}
return;
}
if (data.isTouchEvent && e.type !== 'touchmove') return;
const targetTouch = e.type === 'touchmove' && e.targetTouches && (e.targetTouches[0] || e.changedTouches[0]);
const pageX = e.type === 'touchmove' ? targetTouch.pageX : e.pageX;
const pageY = e.type === 'touchmove' ? targetTouch.pageY : e.pageY;
if (e.preventedByNestedSwiper) {
touches.startX = pageX;
touches.startY = pageY;
return;
}
if (!swiper.allowTouchMove) {
// isMoved = true;
swiper.allowClick = false;
if (data.isTouched) {
Utils.extend(touches, {
startX: pageX,
startY: pageY,
currentX: pageX,
currentY: pageY,
});
data.touchStartTime = Utils.now();
}
return;
}
if (data.isTouchEvent && params.touchReleaseOnEdges && !params.loop) {
if (swiper.isVertical()) {
// Vertical
if (
(pageY < touches.startY && swiper.translate <= swiper.maxTranslate())
|| (pageY > touches.startY && swiper.translate >= swiper.minTranslate())
) {
data.isTouched = false;
data.isMoved = false;
return;
}
} else if (
(pageX < touches.startX && swiper.translate <= swiper.maxTranslate())
|| (pageX > touches.startX && swiper.translate >= swiper.minTranslate())
) {
return;
}
}
if (data.isTouchEvent && doc.activeElement) {
if (e.target === doc.activeElement && $(e.target).is(data.formElements)) {
data.isMoved = true;
swiper.allowClick = false;
return;
}
}
if (data.allowTouchCallbacks) {
swiper.emit('touchMove', e);
}
if (e.targetTouches && e.targetTouches.length > 1) return;
touches.currentX = pageX;
touches.currentY = pageY;
const diffX = touches.currentX - touches.startX;
const diffY = touches.currentY - touches.startY;
if (swiper.params.threshold && Math.sqrt((diffX ** 2) + (diffY ** 2)) < swiper.params.threshold) return;
if (typeof data.isScrolling === 'undefined') {
let touchAngle;
if ((swiper.isHorizontal() && touches.currentY === touches.startY) || (swiper.isVertical() && touches.currentX === touches.startX)) {
data.isScrolling = false;
} else {
// eslint-disable-next-line
if ((diffX * diffX) + (diffY * diffY) >= 25) {
touchAngle = (Math.atan2(Math.abs(diffY), Math.abs(diffX)) * 180) / Math.PI;
data.isScrolling = swiper.isHorizontal() ? touchAngle > params.touchAngle : (90 - touchAngle > params.touchAngle);
}
}
}
if (data.isScrolling) {
swiper.emit('touchMoveOpposite', e);
}
if (typeof data.startMoving === 'undefined') {
if (touches.currentX !== touches.startX || touches.currentY !== touches.startY) {
data.startMoving = true;
}
}
if (data.isScrolling) {
data.isTouched = false;
return;
}
if (!data.startMoving) {
return;
}
swiper.allowClick = false;
if (!params.cssMode && e.cancelable) {
e.preventDefault();
}
if (params.touchMoveStopPropagation && !params.nested) {
e.stopPropagation();
}
if (!data.isMoved) {
if (params.loop) {
swiper.loopFix();
}
data.startTranslate = swiper.getTranslate();
swiper.setTransition(0);
if (swiper.animating) {
swiper.$wrapperEl.trigger('webkitTransitionEnd transitionend');
}
data.allowMomentumBounce = false;
// Grab Cursor
if (params.grabCursor && (swiper.allowSlideNext === true || swiper.allowSlidePrev === true)) {
swiper.setGrabCursor(true);
}
swiper.emit('sliderFirstMove', e);
}
swiper.emit('sliderMove', e);
data.isMoved = true;
let diff = swiper.isHorizontal() ? diffX : diffY;
touches.diff = diff;
diff *= params.touchRatio;
if (rtl) diff = -diff;
swiper.swipeDirection = diff > 0 ? 'prev' : 'next';
data.currentTranslate = diff + data.startTranslate;
let disableParentSwiper = true;
let resistanceRatio = params.resistanceRatio;
if (params.touchReleaseOnEdges) {
resistanceRatio = 0;
}
if ((diff > 0 && data.currentTranslate > swiper.minTranslate())) {
disableParentSwiper = false;
if (params.resistance) data.currentTranslate = (swiper.minTranslate() - 1) + ((-swiper.minTranslate() + data.startTranslate + diff) ** resistanceRatio);
} else if (diff < 0 && data.currentTranslate < swiper.maxTranslate()) {
disableParentSwiper = false;
if (params.resistance) data.currentTranslate = (swiper.maxTranslate() + 1) - ((swiper.maxTranslate() - data.startTranslate - diff) ** resistanceRatio);
}
if (disableParentSwiper) {
e.preventedByNestedSwiper = true;
}
// Directions locks
if (!swiper.allowSlideNext && swiper.swipeDirection === 'next' && data.currentTranslate < data.startTranslate) {
data.currentTranslate = data.startTranslate;
}
if (!swiper.allowSlidePrev && swiper.swipeDirection === 'prev' && data.currentTranslate > data.startTranslate) {
data.currentTranslate = data.startTranslate;
}
// Threshold
if (params.threshold > 0) {
if (Math.abs(diff) > params.threshold || data.allowThresholdMove) {
if (!data.allowThresholdMove) {
data.allowThresholdMove = true;
touches.startX = touches.currentX;
touches.startY = touches.currentY;
data.currentTranslate = data.startTranslate;
touches.diff = swiper.isHorizontal() ? touches.currentX - touches.startX : touches.currentY - touches.startY;
return;
}
} else {
data.currentTranslate = data.startTranslate;
return;
}
}
if (!params.followFinger || params.cssMode) return;
// Update active index in free mode
if (params.freeMode || params.watchSlidesProgress || params.watchSlidesVisibility) {
swiper.updateActiveIndex();
swiper.updateSlidesClasses();
}
if (params.freeMode) {
// Velocity
if (data.velocities.length === 0) {
data.velocities.push({
position: touches[swiper.isHorizontal() ? 'startX' : 'startY'],
time: data.touchStartTime,
});
}
data.velocities.push({
position: touches[swiper.isHorizontal() ? 'currentX' : 'currentY'],
time: Utils.now(),
});
}
// Update progress
swiper.updateProgress(data.currentTranslate);
// Update translate
swiper.setTranslate(data.currentTranslate);
}
function onTouchEnd (event) {
const swiper = this;
const data = swiper.touchEventsData;
const {
params, touches, rtlTranslate: rtl, $wrapperEl, slidesGrid, snapGrid,
} = swiper;
let e = event;
if (e.originalEvent) e = e.originalEvent;
if (data.allowTouchCallbacks) {
swiper.emit('touchEnd', e);
}
data.allowTouchCallbacks = false;
if (!data.isTouched) {
if (data.isMoved && params.grabCursor) {
swiper.setGrabCursor(false);
}
data.isMoved = false;
data.startMoving = false;
return;
}
// Return Grab Cursor
if (params.grabCursor && data.isMoved && data.isTouched && (swiper.allowSlideNext === true || swiper.allowSlidePrev === true)) {
swiper.setGrabCursor(false);
}
// Time diff
const touchEndTime = Utils.now();
const timeDiff = touchEndTime - data.touchStartTime;
// Tap, doubleTap, Click
if (swiper.allowClick) {
swiper.updateClickedSlide(e);
swiper.emit('tap click', e);
if (timeDiff < 300 && (touchEndTime - data.lastClickTime) < 300) {
swiper.emit('doubleTap doubleClick', e);
}
}
data.lastClickTime = Utils.now();
Utils.nextTick(() => {
if (!swiper.destroyed) swiper.allowClick = true;
});
if (!data.isTouched || !data.isMoved || !swiper.swipeDirection || touches.diff === 0 || data.currentTranslate === data.startTranslate) {
data.isTouched = false;
data.isMoved = false;
data.startMoving = false;
return;
}
data.isTouched = false;
data.isMoved = false;
data.startMoving = false;
let currentPos;
if (params.followFinger) {
currentPos = rtl ? swiper.translate : -swiper.translate;
} else {
currentPos = -data.currentTranslate;
}
if (params.cssMode) {
return;
}
if (params.freeMode) {
if (currentPos < -swiper.minTranslate()) {
swiper.slideTo(swiper.activeIndex);
return;
}
if (currentPos > -swiper.maxTranslate()) {
if (swiper.slides.length < snapGrid.length) {
swiper.slideTo(snapGrid.length - 1);
} else {
swiper.slideTo(swiper.slides.length - 1);
}
return;
}
if (params.freeModeMomentum) {
if (data.velocities.length > 1) {
const lastMoveEvent = data.velocities.pop();
const velocityEvent = data.velocities.pop();
const distance = lastMoveEvent.position - velocityEvent.position;
const time = lastMoveEvent.time - velocityEvent.time;
swiper.velocity = distance / time;
swiper.velocity /= 2;
if (Math.abs(swiper.velocity) < params.freeModeMinimumVelocity) {
swiper.velocity = 0;
}
// this implies that the user stopped moving a finger then released.
// There would be no events with distance zero, so the last event is stale.
if (time > 150 || (Utils.now() - lastMoveEvent.time) > 300) {
swiper.velocity = 0;
}
} else {
swiper.velocity = 0;
}
swiper.velocity *= params.freeModeMomentumVelocityRatio;
data.velocities.length = 0;
let momentumDuration = 1000 * params.freeModeMomentumRatio;
const momentumDistance = swiper.velocity * momentumDuration;
let newPosition = swiper.translate + momentumDistance;
if (rtl) newPosition = -newPosition;
let doBounce = false;
let afterBouncePosition;
const bounceAmount = Math.abs(swiper.velocity) * 20 * params.freeModeMomentumBounceRatio;
let needsLoopFix;
if (newPosition < swiper.maxTranslate()) {
if (params.freeModeMomentumBounce) {
if (newPosition + swiper.maxTranslate() < -bounceAmount) {
newPosition = swiper.maxTranslate() - bounceAmount;
}
afterBouncePosition = swiper.maxTranslate();
doBounce = true;
data.allowMomentumBounce = true;
} else {
newPosition = swiper.maxTranslate();
}
if (params.loop && params.centeredSlides) needsLoopFix = true;
} else if (newPosition > swiper.minTranslate()) {
if (params.freeModeMomentumBounce) {
if (newPosition - swiper.minTranslate() > bounceAmount) {
newPosition = swiper.minTranslate() + bounceAmount;
}
afterBouncePosition = swiper.minTranslate();
doBounce = true;
data.allowMomentumBounce = true;
} else {
newPosition = swiper.minTranslate();
}
if (params.loop && params.centeredSlides) needsLoopFix = true;
} else if (params.freeModeSticky) {
let nextSlide;
for (let j = 0; j < snapGrid.length; j += 1) {
if (snapGrid[j] > -newPosition) {
nextSlide = j;
break;
}
}
if (Math.abs(snapGrid[nextSlide] - newPosition) < Math.abs(snapGrid[nextSlide - 1] - newPosition) || swiper.swipeDirection === 'next') {
newPosition = snapGrid[nextSlide];
} else {
newPosition = snapGrid[nextSlide - 1];
}
newPosition = -newPosition;
}
if (needsLoopFix) {
swiper.once('transitionEnd', () => {
swiper.loopFix();
});
}
// Fix duration
if (swiper.velocity !== 0) {
if (rtl) {
momentumDuration = Math.abs((-newPosition - swiper.translate) / swiper.velocity);
} else {
momentumDuration = Math.abs((newPosition - swiper.translate) / swiper.velocity);
}
if (params.freeModeSticky) {
// If freeModeSticky is active and the user ends a swipe with a slow-velocity
// event, then durations can be 20+ seconds to slide one (or zero!) slides.
// It's easy to see this when simulating touch with mouse events. To fix this,
// limit single-slide swipes to the default slide duration. This also has the
// nice side effect of matching slide speed if the user stopped moving before
// lifting finger or mouse vs. moving slowly before lifting the finger/mouse.
// For faster swipes, also apply limits (albeit higher ones).
const moveDistance = Math.abs((rtl ? -newPosition : newPosition) - swiper.translate);
const currentSlideSize = swiper.slidesSizesGrid[swiper.activeIndex];
if (moveDistance < currentSlideSize) {
momentumDuration = params.speed;
} else if (moveDistance < 2 * currentSlideSize) {
momentumDuration = params.speed * 1.5;
} else {
momentumDuration = params.speed * 2.5;
}
}
} else if (params.freeModeSticky) {
swiper.slideToClosest();
return;
}
if (params.freeModeMomentumBounce && doBounce) {
swiper.updateProgress(afterBouncePosition);
swiper.setTransition(momentumDuration);
swiper.setTranslate(newPosition);
swiper.transitionStart(true, swiper.swipeDirection);
swiper.animating = true;
$wrapperEl.transitionEnd(() => {
if (!swiper || swiper.destroyed || !data.allowMomentumBounce) return;
swiper.emit('momentumBounce');
swiper.setTransition(params.speed);
setTimeout(() => {
swiper.setTranslate(afterBouncePosition);
$wrapperEl.transitionEnd(() => {
if (!swiper || swiper.destroyed) return;
swiper.transitionEnd();
});
}, 0);
});
} else if (swiper.velocity) {
swiper.updateProgress(newPosition);
swiper.setTransition(momentumDuration);
swiper.setTranslate(newPosition);
swiper.transitionStart(true, swiper.swipeDirection);
if (!swiper.animating) {
swiper.animating = true;
$wrapperEl.transitionEnd(() => {
if (!swiper || swiper.destroyed) return;
swiper.transitionEnd();
});
}
} else {
swiper.updateProgress(newPosition);
}
swiper.updateActiveIndex();
swiper.updateSlidesClasses();
} else if (params.freeModeSticky) {
swiper.slideToClosest();
return;
}
if (!params.freeModeMomentum || timeDiff >= params.longSwipesMs) {
swiper.updateProgress();
swiper.updateActiveIndex();
swiper.updateSlidesClasses();
}
return;
}
// Find current slide
let stopIndex = 0;
let groupSize = swiper.slidesSizesGrid[0];
for (let i = 0; i < slidesGrid.length; i += (i < params.slidesPerGroupSkip ? 1 : params.slidesPerGroup)) {
const increment = (i < params.slidesPerGroupSkip - 1 ? 1 : params.slidesPerGroup);
if (typeof slidesGrid[i + increment] !== 'undefined') {
if (currentPos >= slidesGrid[i] && currentPos < slidesGrid[i + increment]) {
stopIndex = i;
groupSize = slidesGrid[i + increment] - slidesGrid[i];
}
} else if (currentPos >= slidesGrid[i]) {
stopIndex = i;
groupSize = slidesGrid[slidesGrid.length - 1] - slidesGrid[slidesGrid.length - 2];
}
}
// Find current slide size
const ratio = (currentPos - slidesGrid[stopIndex]) / groupSize;
const increment = (stopIndex < params.slidesPerGroupSkip - 1 ? 1 : params.slidesPerGroup);
if (timeDiff > params.longSwipesMs) {
// Long touches
if (!params.longSwipes) {
swiper.slideTo(swiper.activeIndex);
return;
}
if (swiper.swipeDirection === 'next') {
if (ratio >= params.longSwipesRatio) swiper.slideTo(stopIndex + increment);
else swiper.slideTo(stopIndex);
}
if (swiper.swipeDirection === 'prev') {
if (ratio > (1 - params.longSwipesRatio)) swiper.slideTo(stopIndex + increment);
else swiper.slideTo(stopIndex);
}
} else {
// Short swipes
if (!params.shortSwipes) {
swiper.slideTo(swiper.activeIndex);
return;
}
const isNavButtonTarget = swiper.navigation && (e.target === swiper.navigation.nextEl || e.target === swiper.navigation.prevEl);
if (!isNavButtonTarget) {
if (swiper.swipeDirection === 'next') {
swiper.slideTo(stopIndex + increment);
}
if (swiper.swipeDirection === 'prev') {
swiper.slideTo(stopIndex);
}
} else if (e.target === swiper.navigation.nextEl) {
swiper.slideTo(stopIndex + increment);
} else {
swiper.slideTo(stopIndex);
}
}
}
function onResize () {
const swiper = this;
const { params, el } = swiper;
if (el && el.offsetWidth === 0) return;
// Breakpoints
if (params.breakpoints) {
swiper.setBreakpoint();
}
// Save locks
const { allowSlideNext, allowSlidePrev, snapGrid } = swiper;
// Disable locks on resize
swiper.allowSlideNext = true;
swiper.allowSlidePrev = true;
swiper.updateSize();
swiper.updateSlides();
swiper.updateSlidesClasses();
if ((params.slidesPerView === 'auto' || params.slidesPerView > 1) && swiper.isEnd && !swiper.params.centeredSlides) {
swiper.slideTo(swiper.slides.length - 1, 0, false, true);
} else {
swiper.slideTo(swiper.activeIndex, 0, false, true);
}
if (swiper.autoplay && swiper.autoplay.running && swiper.autoplay.paused) {
swiper.autoplay.run();
}
// Return locks after resize
swiper.allowSlidePrev = allowSlidePrev;
swiper.allowSlideNext = allowSlideNext;
if (swiper.params.watchOverflow && snapGrid !== swiper.snapGrid) {
swiper.checkOverflow();
}
}
function onClick (e) {
const swiper = this;
if (!swiper.allowClick) {
if (swiper.params.preventClicks) e.preventDefault();
if (swiper.params.preventClicksPropagation && swiper.animating) {
e.stopPropagation();
e.stopImmediatePropagation();
}
}
}
function onScroll () {
const swiper = this;
const { wrapperEl, rtlTranslate } = swiper;
swiper.previousTranslate = swiper.translate;
if (swiper.isHorizontal()) {
if (rtlTranslate) {
swiper.translate = ((wrapperEl.scrollWidth - wrapperEl.offsetWidth) - wrapperEl.scrollLeft);
} else {
swiper.translate = -wrapperEl.scrollLeft;
}
} else {
swiper.translate = -wrapperEl.scrollTop;
}
// eslint-disable-next-line
if (swiper.translate === -0) swiper.translate = 0;
swiper.updateActiveIndex();
swiper.updateSlidesClasses();
let newProgress;
const translatesDiff = swiper.maxTranslate() - swiper.minTranslate();
if (translatesDiff === 0) {
newProgress = 0;
} else {
newProgress = (swiper.translate - swiper.minTranslate()) / (translatesDiff);
}
if (newProgress !== swiper.progress) {
swiper.updateProgress(rtlTranslate ? -swiper.translate : swiper.translate);
}
swiper.emit('setTranslate', swiper.translate, false);
}
let dummyEventAttached = false;
function dummyEventListener() {}
function attachEvents() {
const swiper = this;
const {
params, touchEvents, el, wrapperEl,
} = swiper;
swiper.onTouchStart = onTouchStart.bind(swiper);
swiper.onTouchMove = onTouchMove.bind(swiper);
swiper.onTouchEnd = onTouchEnd.bind(swiper);
if (params.cssMode) {
swiper.onScroll = onScroll.bind(swiper);
}
swiper.onClick = onClick.bind(swiper);
const capture = !!params.nested;
// Touch Events
if (!Support.touch && Support.pointerEvents) {
el.addEventListener(touchEvents.start, swiper.onTouchStart, false);
doc.addEventListener(touchEvents.move, swiper.onTouchMove, capture);
doc.addEventListener(touchEvents.end, swiper.onTouchEnd, false);
} else {
if (Support.touch) {
const passiveListener = touchEvents.start === 'touchstart' && Support.passiveListener && params.passiveListeners ? { passive: true, capture: false } : false;
el.addEventListener(touchEvents.start, swiper.onTouchStart, passiveListener);
el.addEventListener(touchEvents.move, swiper.onTouchMove, Support.passiveListener ? { passive: false, capture } : capture);
el.addEventListener(touchEvents.end, swiper.onTouchEnd, passiveListener);
if (touchEvents.cancel) {
el.addEventListener(touchEvents.cancel, swiper.onTouchEnd, passiveListener);
}
if (!dummyEventAttached) {
doc.addEventListener('touchstart', dummyEventListener);
dummyEventAttached = true;
}
}
if ((params.simulateTouch && !Device.ios && !Device.android) || (params.simulateTouch && !Support.touch && Device.ios)) {
el.addEventListener('mousedown', swiper.onTouchStart, false);
doc.addEventListener('mousemove', swiper.onTouchMove, capture);
doc.addEventListener('mouseup', swiper.onTouchEnd, false);
}
}
// Prevent Links Clicks
if (params.preventClicks || params.preventClicksPropagation) {
el.addEventListener('click', swiper.onClick, true);
}
if (params.cssMode) {
wrapperEl.addEventListener('scroll', swiper.onScroll);
}
// Resize handler
if (params.updateOnWindowResize) {
swiper.on((Device.ios || Device.android ? 'resize orientationchange observerUpdate' : 'resize observerUpdate'), onResize, true);
} else {
swiper.on('observerUpdate', onResize, true);
}
}
function detachEvents() {
const swiper = this;
const {
params, touchEvents, el, wrapperEl,
} = swiper;
const capture = !!params.nested;
// Touch Events
if (!Support.touch && Support.pointerEvents) {
el.removeEventListener(touchEvents.start, swiper.onTouchStart, false);
doc.removeEventListener(touchEvents.move, swiper.onTouchMove, capture);
doc.removeEventListener(touchEvents.end, swiper.onTouchEnd, false);
} else {
if (Support.touch) {
const passiveListener = touchEvents.start === 'onTouchStart' && Support.passiveListener && params.passiveListeners ? { passive: true, capture: false } : false;
el.removeEventListener(touchEvents.start, swiper.onTouchStart, passiveListener);
el.removeEventListener(touchEvents.move, swiper.onTouchMove, capture);
el.removeEventListener(touchEvents.end, swiper.onTouchEnd, passiveListener);
if (touchEvents.cancel) {
el.removeEventListener(touchEvents.cancel, swiper.onTouchEnd, passiveListener);
}
}
if ((params.simulateTouch && !Device.ios && !Device.android) || (params.simulateTouch && !Support.touch && Device.ios)) {
el.removeEventListener('mousedown', swiper.onTouchStart, false);
doc.removeEventListener('mousemove', swiper.onTouchMove, capture);
doc.removeEventListener('mouseup', swiper.onTouchEnd, false);
}
}
// Prevent Links Clicks
if (params.preventClicks || params.preventClicksPropagation) {
el.removeEventListener('click', swiper.onClick, true);
}
if (params.cssMode) {
wrapperEl.removeEventListener('scroll', swiper.onScroll);
}
// Resize handler
swiper.off((Device.ios || Device.android ? 'resize orientationchange observerUpdate' : 'resize observerUpdate'), onResize);
}
var events = {
attachEvents,
detachEvents,
};
function setBreakpoint () {
const swiper = this;
const {
activeIndex, initialized, loopedSlides = 0, params, $el,
} = swiper;
const breakpoints = params.breakpoints;
if (!breakpoints || (breakpoints && Object.keys(breakpoints).length === 0)) return;
// Get breakpoint for window width and update parameters
const breakpoint = swiper.getBreakpoint(breakpoints);
if (breakpoint && swiper.currentBreakpoint !== breakpoint) {
const breakpointOnlyParams = breakpoint in breakpoints ? breakpoints[breakpoint] : undefined;
if (breakpointOnlyParams) {
['slidesPerView', 'spaceBetween', 'slidesPerGroup', 'slidesPerGroupSkip', 'slidesPerColumn'].forEach((param) => {
const paramValue = breakpointOnlyParams[param];
if (typeof paramValue === 'undefined') return;
if (param === 'slidesPerView' && (paramValue === 'AUTO' || paramValue === 'auto')) {
breakpointOnlyParams[param] = 'auto';
} else if (param === 'slidesPerView') {
breakpointOnlyParams[param] = parseFloat(paramValue);
} else {
breakpointOnlyParams[param] = parseInt(paramValue, 10);
}
});
}
const breakpointParams = breakpointOnlyParams || swiper.originalParams;
const wasMultiRow = params.slidesPerColumn > 1;
const isMultiRow = breakpointParams.slidesPerColumn > 1;
if (wasMultiRow && !isMultiRow) {
$el.removeClass(`${params.containerModifierClass}multirow ${params.containerModifierClass}multirow-column`);
} else if (!wasMultiRow && isMultiRow) {
$el.addClass(`${params.containerModifierClass}multirow`);
if (breakpointParams.slidesPerColumnFill === 'column') {
$el.addClass(`${params.containerModifierClass}multirow-column`);
}
}
const directionChanged = breakpointParams.direction && breakpointParams.direction !== params.direction;
const needsReLoop = params.loop && (breakpointParams.slidesPerView !== params.slidesPerView || directionChanged);
if (directionChanged && initialized) {
swiper.changeDirection();
}
Utils.extend(swiper.params, breakpointParams);
Utils.extend(swiper, {
allowTouchMove: swiper.params.allowTouchMove,
allowSlideNext: swiper.params.allowSlideNext,
allowSlidePrev: swiper.params.allowSlidePrev,
});
swiper.currentBreakpoint = breakpoint;
if (needsReLoop && initialized) {
swiper.loopDestroy();
swiper.loopCreate();
swiper.updateSlides();
swiper.slideTo((activeIndex - loopedSlides) + swiper.loopedSlides, 0, false);
}
swiper.emit('breakpoint', breakpointParams);
}
}
function getBreakpoint (breakpoints) {
// Get breakpoint for window width
if (!breakpoints) return undefined;
let breakpoint = false;
const points = Object.keys(breakpoints).map((point) => {
if (typeof point === 'string' && point.indexOf('@') === 0) {
const minRatio = parseFloat(point.substr(1));
const value = win.innerHeight * minRatio;
return { value, point };
}
return { value: point, point };
});
points.sort((a, b) => parseInt(a.value, 10) - parseInt(b.value, 10));
for (let i = 0; i < points.length; i += 1) {
const { point, value } = points[i];
if (value <= win.innerWidth) {
breakpoint = point;
}
}
return breakpoint || 'max';
}
var breakpoints = { setBreakpoint, getBreakpoint };
function addClasses () {
const swiper = this;
const {
classNames, params, rtl, $el,
} = swiper;
const suffixes = [];
suffixes.push('initialized');
suffixes.push(params.direction);
if (params.freeMode) {
suffixes.push('free-mode');
}
if (params.autoHeight) {
suffixes.push('autoheight');
}
if (rtl) {
suffixes.push('rtl');
}
if (params.slidesPerColumn > 1) {
suffixes.push('multirow');
if (params.slidesPerColumnFill === 'column') {
suffixes.push('multirow-column');
}
}
if (Device.android) {
suffixes.push('android');
}
if (Device.ios) {
suffixes.push('ios');
}
if (params.cssMode) {
suffixes.push('css-mode');
}
suffixes.forEach((suffix) => {
classNames.push(params.containerModifierClass + suffix);
});
$el.addClass(classNames.join(' '));
}
function removeClasses () {
const swiper = this;
const { $el, classNames } = swiper;
$el.removeClass(classNames.join(' '));
}
var classes = { addClasses, removeClasses };
function loadImage (imageEl, src, srcset, sizes, checkForComplete, callback) {
let image;
function onReady() {
if (callback) callback();
}
const isPicture = $(imageEl).parent('picture')[0];
if (!isPicture && (!imageEl.complete || !checkForComplete)) {
if (src) {
image = new win.Image();
image.onload = onReady;
image.onerror = onReady;
if (sizes) {
image.sizes = sizes;
}
if (srcset) {
image.srcset = srcset;
}
if (src) {
image.src = src;
}
} else {
onReady();
}
} else {
// image already loaded...
onReady();
}
}
function preloadImages () {
const swiper = this;
swiper.imagesToLoad = swiper.$el.find('img');
function onReady() {
if (typeof swiper === 'undefined' || swiper === null || !swiper || swiper.destroyed) return;
if (swiper.imagesLoaded !== undefined) swiper.imagesLoaded += 1;
if (swiper.imagesLoaded === swiper.imagesToLoad.length) {
if (swiper.params.updateOnImagesReady) swiper.update();
swiper.emit('imagesReady');
}
}
for (let i = 0; i < swiper.imagesToLoad.length; i += 1) {
const imageEl = swiper.imagesToLoad[i];
swiper.loadImage(
imageEl,
imageEl.currentSrc || imageEl.getAttribute('src'),
imageEl.srcset || imageEl.getAttribute('srcset'),
imageEl.sizes || imageEl.getAttribute('sizes'),
true,
onReady
);
}
}
var images = {
loadImage,
preloadImages,
};
function checkOverflow() {
const swiper = this;
const params = swiper.params;
const wasLocked = swiper.isLocked;
const lastSlidePosition = swiper.slides.length > 0 && (params.slidesOffsetBefore + (params.spaceBetween * (swiper.slides.length - 1)) + ((swiper.slides[0]).offsetWidth) * swiper.slides.length);
if (params.slidesOffsetBefore && params.slidesOffsetAfter && lastSlidePosition) {
swiper.isLocked = lastSlidePosition <= swiper.size;
} else {
swiper.isLocked = swiper.snapGrid.length === 1;
}
swiper.allowSlideNext = !swiper.isLocked;
swiper.allowSlidePrev = !swiper.isLocked;
// events
if (wasLocked !== swiper.isLocked) swiper.emit(swiper.isLocked ? 'lock' : 'unlock');
if (wasLocked && wasLocked !== swiper.isLocked) {
swiper.isEnd = false;
swiper.navigation.update();
}
}
var checkOverflow$1 = { checkOverflow };
var defaults = {
init: true,
direction: 'horizontal',
touchEventsTarget: 'container',
initialSlide: 0,
speed: 300,
cssMode: false,
updateOnWindowResize: true,
//
preventInteractionOnTransition: false,
// To support iOS's swipe-to-go-back gesture (when being used in-app, with UIWebView).
edgeSwipeDetection: false,
edgeSwipeThreshold: 20,
// Free mode
freeMode: false,
freeModeMomentum: true,
freeModeMomentumRatio: 1,
freeModeMomentumBounce: true,
freeModeMomentumBounceRatio: 1,
freeModeMomentumVelocityRatio: 1,
freeModeSticky: false,
freeModeMinimumVelocity: 0.02,
// Autoheight
autoHeight: false,
// Set wrapper width
setWrapperSize: false,
// Virtual Translate
virtualTranslate: false,
// Effects
effect: 'slide', // 'slide' or 'fade' or 'cube' or 'coverflow' or 'flip'
// Breakpoints
breakpoints: undefined,
// Slides grid
spaceBetween: 0,
slidesPerView: 1,
slidesPerColumn: 1,
slidesPerColumnFill: 'column',
slidesPerGroup: 1,
slidesPerGroupSkip: 0,
centeredSlides: false,
centeredSlidesBounds: false,
slidesOffsetBefore: 0, // in px
slidesOffsetAfter: 0, // in px
normalizeSlideIndex: true,
centerInsufficientSlides: false,
// Disable swiper and hide navigation when container not overflow
watchOverflow: false,
// Round length
roundLengths: false,
// Touches
touchRatio: 1,
touchAngle: 45,
simulateTouch: true,
shortSwipes: true,
longSwipes: true,
longSwipesRatio: 0.5,
longSwipesMs: 300,
followFinger: true,
allowTouchMove: true,
threshold: 0,
touchMoveStopPropagation: false,
touchStartPreventDefault: true,
touchStartForcePreventDefault: false,
touchReleaseOnEdges: false,
// Unique Navigation Elements
uniqueNavElements: true,
// Resistance
resistance: true,
resistanceRatio: 0.85,
// Progress
watchSlidesProgress: false,
watchSlidesVisibility: false,
// Cursor
grabCursor: false,
// Clicks
preventClicks: true,
preventClicksPropagation: true,
slideToClickedSlide: false,
// Images
preloadImages: true,
updateOnImagesReady: true,
// loop
loop: false,
loopAdditionalSlides: 0,
loopedSlides: null,
loopFillGroupWithBlank: false,
// Swiping/no swiping
allowSlidePrev: true,
allowSlideNext: true,
swipeHandler: null, // '.swipe-handler',
noSwiping: true,
noSwipingClass: 'swiper-no-swiping',
noSwipingSelector: null,
// Passive Listeners
passiveListeners: true,
// NS
containerModifierClass: 'swiper-container-', // NEW
slideClass: 'swiper-slide',
slideBlankClass: 'swiper-slide-invisible-blank',
slideActiveClass: 'swiper-slide-active',
slideDuplicateActiveClass: 'swiper-slide-duplicate-active',
slideVisibleClass: 'swiper-slide-visible',
slideDuplicateClass: 'swiper-slide-duplicate',
slideNextClass: 'swiper-slide-next',
slideDuplicateNextClass: 'swiper-slide-duplicate-next',
slidePrevClass: 'swiper-slide-prev',
slideDuplicatePrevClass: 'swiper-slide-duplicate-prev',
wrapperClass: 'swiper-wrapper',
// Callbacks
runCallbacksOnInit: true,
};
/* eslint no-param-reassign: "off" */
const prototypes = {
update,
translate,
transition: transition$1,
slide,
loop,
grabCursor,
manipulation,
events,
breakpoints,
checkOverflow: checkOverflow$1,
classes,
images,
};
const extendedDefaults = {};
class Swiper extends SwiperClass {
constructor(...args) {
let el;
let params;
if (args.length === 1 && args[0].constructor && args[0].constructor === Object) {
params = args[0];
} else {
[el, params] = args;
}
if (!params) params = {};
params = Utils.extend({}, params);
if (el && !params.el) params.el = el;
super(params);
Object.keys(prototypes).forEach((prototypeGroup) => {
Object.keys(prototypes[prototypeGroup]).forEach((protoMethod) => {
if (!Swiper.prototype[protoMethod]) {
Swiper.prototype[protoMethod] = prototypes[prototypeGroup][protoMethod];
}
});
});
// Swiper Instance
const swiper = this;
if (typeof swiper.modules === 'undefined') {
swiper.modules = {};
}
Object.keys(swiper.modules).forEach((moduleName) => {
const module = swiper.modules[moduleName];
if (module.params) {
const moduleParamName = Object.keys(module.params)[0];
const moduleParams = module.params[moduleParamName];
if (typeof moduleParams !== 'object' || moduleParams === null) return;
if (!(moduleParamName in params && 'enabled' in moduleParams)) return;
if (params[moduleParamName] === true) {
params[moduleParamName] = { enabled: true };
}
if (
typeof params[moduleParamName] === 'object'
&& !('enabled' in params[moduleParamName])
) {
params[moduleParamName].enabled = true;
}
if (!params[moduleParamName]) params[moduleParamName] = { enabled: false };
}
});
// Extend defaults with modules params
const swiperParams = Utils.extend({}, defaults);
swiper.useModulesParams(swiperParams);
// Extend defaults with passed params
swiper.params = Utils.extend({}, swiperParams, extendedDefaults, params);
swiper.originalParams = Utils.extend({}, swiper.params);
swiper.passedParams = Utils.extend({}, params);
// Save Dom lib
swiper.$ = $;
// Find el
const $el = $(swiper.params.el);
el = $el[0];
if (!el) {
return undefined;
}
if ($el.length > 1) {
const swipers = [];
$el.each((index, containerEl) => {
const newParams = Utils.extend({}, params, { el: containerEl });
swipers.push(new Swiper(newParams));
});
return swipers;
}
el.swiper = swiper;
$el.data('swiper', swiper);
// Find Wrapper
let $wrapperEl;
if (el && el.shadowRoot && el.shadowRoot.querySelector) {
$wrapperEl = $(el.shadowRoot.querySelector(`.${swiper.params.wrapperClass}`));
// Children needs to return slot items
$wrapperEl.children = (options) => $el.children(options);
} else {
$wrapperEl = $el.children(`.${swiper.params.wrapperClass}`);
}
// Extend Swiper
Utils.extend(swiper, {
$el,
el,
$wrapperEl,
wrapperEl: $wrapperEl[0],
// Classes
classNames: [],
// Slides
slides: $(),
slidesGrid: [],
snapGrid: [],
slidesSizesGrid: [],
// isDirection
isHorizontal() {
return swiper.params.direction === 'horizontal';
},
isVertical() {
return swiper.params.direction === 'vertical';
},
// RTL
rtl: (el.dir.toLowerCase() === 'rtl' || $el.css('direction') === 'rtl'),
rtlTranslate: swiper.params.direction === 'horizontal' && (el.dir.toLowerCase() === 'rtl' || $el.css('direction') === 'rtl'),
wrongRTL: $wrapperEl.css('display') === '-webkit-box',
// Indexes
activeIndex: 0,
realIndex: 0,
//
isBeginning: true,
isEnd: false,
// Props
translate: 0,
previousTranslate: 0,
progress: 0,
velocity: 0,
animating: false,
// Locks
allowSlideNext: swiper.params.allowSlideNext,
allowSlidePrev: swiper.params.allowSlidePrev,
// Touch Events
touchEvents: (function touchEvents() {
const touch = ['touchstart', 'touchmove', 'touchend', 'touchcancel'];
let desktop = ['mousedown', 'mousemove', 'mouseup'];
if (Support.pointerEvents) {
desktop = ['pointerdown', 'pointermove', 'pointerup'];
}
swiper.touchEventsTouch = {
start: touch[0],
move: touch[1],
end: touch[2],
cancel: touch[3],
};
swiper.touchEventsDesktop = {
start: desktop[0],
move: desktop[1],
end: desktop[2],
};
return Support.touch || !swiper.params.simulateTouch ? swiper.touchEventsTouch : swiper.touchEventsDesktop;
}()),
touchEventsData: {
isTouched: undefined,
isMoved: undefined,
allowTouchCallbacks: undefined,
touchStartTime: undefined,
isScrolling: undefined,
currentTranslate: undefined,
startTranslate: undefined,
allowThresholdMove: undefined,
// Form elements to match
formElements: 'input, select, option, textarea, button, video, label',
// Last click time
lastClickTime: Utils.now(),
clickTimeout: undefined,
// Velocities
velocities: [],
allowMomentumBounce: undefined,
isTouchEvent: undefined,
startMoving: undefined,
},
// Clicks
allowClick: true,
// Touches
allowTouchMove: swiper.params.allowTouchMove,
touches: {
startX: 0,
startY: 0,
currentX: 0,
currentY: 0,
diff: 0,
},
// Images
imagesToLoad: [],
imagesLoaded: 0,
});
// Install Modules
swiper.useModules();
// Init
if (swiper.params.init) {
swiper.init();
}
// Return app instance
return swiper;
}
slidesPerViewDynamic() {
const swiper = this;
const {
params, slides, slidesGrid, size: swiperSize, activeIndex,
} = swiper;
let spv = 1;
if (params.centeredSlides) {
let slideSize = slides[activeIndex].swiperSlideSize;
let breakLoop;
for (let i = activeIndex + 1; i < slides.length; i += 1) {
if (slides[i] && !breakLoop) {
slideSize += slides[i].swiperSlideSize;
spv += 1;
if (slideSize > swiperSize) breakLoop = true;
}
}
for (let i = activeIndex - 1; i >= 0; i -= 1) {
if (slides[i] && !breakLoop) {
slideSize += slides[i].swiperSlideSize;
spv += 1;
if (slideSize > swiperSize) breakLoop = true;
}
}
} else {
for (let i = activeIndex + 1; i < slides.length; i += 1) {
if (slidesGrid[i] - slidesGrid[activeIndex] < swiperSize) {
spv += 1;
}
}
}
return spv;
}
update() {
const swiper = this;
if (!swiper || swiper.destroyed) return;
const { snapGrid, params } = swiper;
// Breakpoints
if (params.breakpoints) {
swiper.setBreakpoint();
}
swiper.updateSize();
swiper.updateSlides();
swiper.updateProgress();
swiper.updateSlidesClasses();
function setTranslate() {
const translateValue = swiper.rtlTranslate ? swiper.translate * -1 : swiper.translate;
const newTranslate = Math.min(Math.max(translateValue, swiper.maxTranslate()), swiper.minTranslate());
swiper.setTranslate(newTranslate);
swiper.updateActiveIndex();
swiper.updateSlidesClasses();
}
let translated;
if (swiper.params.freeMode) {
setTranslate();
if (swiper.params.autoHeight) {
swiper.updateAutoHeight();
}
} else {
if ((swiper.params.slidesPerView === 'auto' || swiper.params.slidesPerView > 1) && swiper.isEnd && !swiper.params.centeredSlides) {
translated = swiper.slideTo(swiper.slides.length - 1, 0, false, true);
} else {
translated = swiper.slideTo(swiper.activeIndex, 0, false, true);
}
if (!translated) {
setTranslate();
}
}
if (params.watchOverflow && snapGrid !== swiper.snapGrid) {
swiper.checkOverflow();
}
swiper.emit('update');
}
changeDirection(newDirection, needUpdate = true) {
const swiper = this;
const currentDirection = swiper.params.direction;
if (!newDirection) {
// eslint-disable-next-line
newDirection = currentDirection === 'horizontal' ? 'vertical' : 'horizontal';
}
if ((newDirection === currentDirection) || (newDirection !== 'horizontal' && newDirection !== 'vertical')) {
return swiper;
}
swiper.$el
.removeClass(`${swiper.params.containerModifierClass}${currentDirection}`)
.addClass(`${swiper.params.containerModifierClass}${newDirection}`);
swiper.params.direction = newDirection;
swiper.slides.each((slideIndex, slideEl) => {
if (newDirection === 'vertical') {
slideEl.style.width = '';
} else {
slideEl.style.height = '';
}
});
swiper.emit('changeDirection');
if (needUpdate) swiper.update();
return swiper;
}
init() {
const swiper = this;
if (swiper.initialized) return;
swiper.emit('beforeInit');
// Set breakpoint
if (swiper.params.breakpoints) {
swiper.setBreakpoint();
}
// Add Classes
swiper.addClasses();
// Create loop
if (swiper.params.loop) {
swiper.loopCreate();
}
// Update size
swiper.updateSize();
// Update slides
swiper.updateSlides();
if (swiper.params.watchOverflow) {
swiper.checkOverflow();
}
// Set Grab Cursor
if (swiper.params.grabCursor) {
swiper.setGrabCursor();
}
if (swiper.params.preloadImages) {
swiper.preloadImages();
}
// Slide To Initial Slide
if (swiper.params.loop) {
swiper.slideTo(swiper.params.initialSlide + swiper.loopedSlides, 0, swiper.params.runCallbacksOnInit);
} else {
swiper.slideTo(swiper.params.initialSlide, 0, swiper.params.runCallbacksOnInit);
}
// Attach events
swiper.attachEvents();
// Init Flag
swiper.initialized = true;
// Emit
swiper.emit('init');
}
destroy(deleteInstance = true, cleanStyles = true) {
const swiper = this;
const {
params, $el, $wrapperEl, slides,
} = swiper;
if (typeof swiper.params === 'undefined' || swiper.destroyed) {
return null;
}
swiper.emit('beforeDestroy');
// Init Flag
swiper.initialized = false;
// Detach events
swiper.detachEvents();
// Destroy loop
if (params.loop) {
swiper.loopDestroy();
}
// Cleanup styles
if (cleanStyles) {
swiper.removeClasses();
$el.removeAttr('style');
$wrapperEl.removeAttr('style');
if (slides && slides.length) {
slides
.removeClass([
params.slideVisibleClass,
params.slideActiveClass,
params.slideNextClass,
params.slidePrevClass,
].join(' '))
.removeAttr('style')
.removeAttr('data-swiper-slide-index');
}
}
swiper.emit('destroy');
// Detach emitter events
Object.keys(swiper.eventsListeners).forEach((eventName) => {
swiper.off(eventName);
});
if (deleteInstance !== false) {
swiper.$el[0].swiper = null;
swiper.$el.data('swiper', null);
Utils.deleteProps(swiper);
}
swiper.destroyed = true;
return null;
}
static extendDefaults(newDefaults) {
Utils.extend(extendedDefaults, newDefaults);
}
static get extendedDefaults() {
return extendedDefaults;
}
static get defaults() {
return defaults;
}
static get Class() {
return SwiperClass;
}
static get $() {
return $;
}
}
var Device$1 = {
name: 'device',
proto: {
device: Device,
},
static: {
device: Device,
},
};
var Support$1 = {
name: 'support',
proto: {
support: Support,
},
static: {
support: Support,
},
};
const Browser = (function Browser() {
function isSafari() {
const ua = win.navigator.userAgent.toLowerCase();
return (ua.indexOf('safari') >= 0 && ua.indexOf('chrome') < 0 && ua.indexOf('android') < 0);
}
return {
isEdge: !!win.navigator.userAgent.match(/Edge/g),
isSafari: isSafari(),
isUiWebView: /(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/i.test(win.navigator.userAgent),
};
}());
var Browser$1 = {
name: 'browser',
proto: {
browser: Browser,
},
static: {
browser: Browser,
},
};
var Resize = {
name: 'resize',
create() {
const swiper = this;
Utils.extend(swiper, {
resize: {
resizeHandler() {
if (!swiper || swiper.destroyed || !swiper.initialized) return;
swiper.emit('beforeResize');
swiper.emit('resize');
},
orientationChangeHandler() {
if (!swiper || swiper.destroyed || !swiper.initialized) return;
swiper.emit('orientationchange');
},
},
});
},
on: {
init() {
const swiper = this;
// Emit resize
win.addEventListener('resize', swiper.resize.resizeHandler);
// Emit orientationchange
win.addEventListener('orientationchange', swiper.resize.orientationChangeHandler);
},
destroy() {
const swiper = this;
win.removeEventListener('resize', swiper.resize.resizeHandler);
win.removeEventListener('orientationchange', swiper.resize.orientationChangeHandler);
},
},
};
const Observer = {
func: win.MutationObserver || win.WebkitMutationObserver,
attach(target, options = {}) {
const swiper = this;
const ObserverFunc = Observer.func;
const observer = new ObserverFunc((mutations) => {
// The observerUpdate event should only be triggered
// once despite the number of mutations. Additional
// triggers are redundant and are very costly
if (mutations.length === 1) {
swiper.emit('observerUpdate', mutations[0]);
return;
}
const observerUpdate = function observerUpdate() {
swiper.emit('observerUpdate', mutations[0]);
};
if (win.requestAnimationFrame) {
win.requestAnimationFrame(observerUpdate);
} else {
win.setTimeout(observerUpdate, 0);
}
});
observer.observe(target, {
attributes: typeof options.attributes === 'undefined' ? true : options.attributes,
childList: typeof options.childList === 'undefined' ? true : options.childList,
characterData: typeof options.characterData === 'undefined' ? true : options.characterData,
});
swiper.observer.observers.push(observer);
},
init() {
const swiper = this;
if (!Support.observer || !swiper.params.observer) return;
if (swiper.params.observeParents) {
const containerParents = swiper.$el.parents();
for (let i = 0; i < containerParents.length; i += 1) {
swiper.observer.attach(containerParents[i]);
}
}
// Observe container
swiper.observer.attach(swiper.$el[0], { childList: swiper.params.observeSlideChildren });
// Observe wrapper
swiper.observer.attach(swiper.$wrapperEl[0], { attributes: false });
},
destroy() {
const swiper = this;
swiper.observer.observers.forEach((observer) => {
observer.disconnect();
});
swiper.observer.observers = [];
},
};
var Observer$1 = {
name: 'observer',
params: {
observer: false,
observeParents: false,
observeSlideChildren: false,
},
create() {
const swiper = this;
Utils.extend(swiper, {
observer: {
init: Observer.init.bind(swiper),
attach: Observer.attach.bind(swiper),
destroy: Observer.destroy.bind(swiper),
observers: [],
},
});
},
on: {
init() {
const swiper = this;
swiper.observer.init();
},
destroy() {
const swiper = this;
swiper.observer.destroy();
},
},
};
const Keyboard = {
handle(event) {
const swiper = this;
const { rtlTranslate: rtl } = swiper;
let e = event;
if (e.originalEvent) e = e.originalEvent; // jquery fix
const kc = e.keyCode || e.charCode;
// Directions locks
if (!swiper.allowSlideNext && ((swiper.isHorizontal() && kc === 39) || (swiper.isVertical() && kc === 40) || kc === 34)) {
return false;
}
if (!swiper.allowSlidePrev && ((swiper.isHorizontal() && kc === 37) || (swiper.isVertical() && kc === 38) || kc === 33)) {
return false;
}
if (e.shiftKey || e.altKey || e.ctrlKey || e.metaKey) {
return undefined;
}
if (doc.activeElement && doc.activeElement.nodeName && (doc.activeElement.nodeName.toLowerCase() === 'input' || doc.activeElement.nodeName.toLowerCase() === 'textarea')) {
return undefined;
}
if (swiper.params.keyboard.onlyInViewport && (kc === 33 || kc === 34 || kc === 37 || kc === 39 || kc === 38 || kc === 40)) {
let inView = false;
// Check that swiper should be inside of visible area of window
if (swiper.$el.parents(`.${swiper.params.slideClass}`).length > 0 && swiper.$el.parents(`.${swiper.params.slideActiveClass}`).length === 0) {
return undefined;
}
const windowWidth = win.innerWidth;
const windowHeight = win.innerHeight;
const swiperOffset = swiper.$el.offset();
if (rtl) swiperOffset.left -= swiper.$el[0].scrollLeft;
const swiperCoord = [
[swiperOffset.left, swiperOffset.top],
[swiperOffset.left + swiper.width, swiperOffset.top],
[swiperOffset.left, swiperOffset.top + swiper.height],
[swiperOffset.left + swiper.width, swiperOffset.top + swiper.height],
];
for (let i = 0; i < swiperCoord.length; i += 1) {
const point = swiperCoord[i];
if (
point[0] >= 0 && point[0] <= windowWidth
&& point[1] >= 0 && point[1] <= windowHeight
) {
inView = true;
}
}
if (!inView) return undefined;
}
if (swiper.isHorizontal()) {
if (kc === 33 || kc === 34 || kc === 37 || kc === 39) {
if (e.preventDefault) e.preventDefault();
else e.returnValue = false;
}
if (((kc === 34 || kc === 39) && !rtl) || ((kc === 33 || kc === 37) && rtl)) swiper.slideNext();
if (((kc === 33 || kc === 37) && !rtl) || ((kc === 34 || kc === 39) && rtl)) swiper.slidePrev();
} else {
if (kc === 33 || kc === 34 || kc === 38 || kc === 40) {
if (e.preventDefault) e.preventDefault();
else e.returnValue = false;
}
if (kc === 34 || kc === 40) swiper.slideNext();
if (kc === 33 || kc === 38) swiper.slidePrev();
}
swiper.emit('keyPress', kc);
return undefined;
},
enable() {
const swiper = this;
if (swiper.keyboard.enabled) return;
$(doc).on('keydown', swiper.keyboard.handle);
swiper.keyboard.enabled = true;
},
disable() {
const swiper = this;
if (!swiper.keyboard.enabled) return;
$(doc).off('keydown', swiper.keyboard.handle);
swiper.keyboard.enabled = false;
},
};
var keyboard = {
name: 'keyboard',
params: {
keyboard: {
enabled: false,
onlyInViewport: true,
},
},
create() {
const swiper = this;
Utils.extend(swiper, {
keyboard: {
enabled: false,
enable: Keyboard.enable.bind(swiper),
disable: Keyboard.disable.bind(swiper),
handle: Keyboard.handle.bind(swiper),
},
});
},
on: {
init() {
const swiper = this;
if (swiper.params.keyboard.enabled) {
swiper.keyboard.enable();
}
},
destroy() {
const swiper = this;
if (swiper.keyboard.enabled) {
swiper.keyboard.disable();
}
},
},
};
function isEventSupported() {
const eventName = 'onwheel';
let isSupported = eventName in doc;
if (!isSupported) {
const element = doc.createElement('div');
element.setAttribute(eventName, 'return;');
isSupported = typeof element[eventName] === 'function';
}
if (!isSupported
&& doc.implementation
&& doc.implementation.hasFeature
// always returns true in newer browsers as per the standard.
// @see http://dom.spec.whatwg.org/#dom-domimplementation-hasfeature
&& doc.implementation.hasFeature('', '') !== true
) {
// This is the only way to test support for the `wheel` event in IE9+.
isSupported = doc.implementation.hasFeature('Events.wheel', '3.0');
}
return isSupported;
}
const Mousewheel = {
lastScrollTime: Utils.now(),
lastEventBeforeSnap: undefined,
recentWheelEvents: [],
event() {
if (win.navigator.userAgent.indexOf('firefox') > -1) return 'DOMMouseScroll';
return isEventSupported() ? 'wheel' : 'mousewheel';
},
normalize(e) {
// Reasonable defaults
const PIXEL_STEP = 10;
const LINE_HEIGHT = 40;
const PAGE_HEIGHT = 800;
let sX = 0;
let sY = 0; // spinX, spinY
let pX = 0;
let pY = 0; // pixelX, pixelY
// Legacy
if ('detail' in e) {
sY = e.detail;
}
if ('wheelDelta' in e) {
sY = -e.wheelDelta / 120;
}
if ('wheelDeltaY' in e) {
sY = -e.wheelDeltaY / 120;
}
if ('wheelDeltaX' in e) {
sX = -e.wheelDeltaX / 120;
}
// side scrolling on FF with DOMMouseScroll
if ('axis' in e && e.axis === e.HORIZONTAL_AXIS) {
sX = sY;
sY = 0;
}
pX = sX * PIXEL_STEP;
pY = sY * PIXEL_STEP;
if ('deltaY' in e) {
pY = e.deltaY;
}
if ('deltaX' in e) {
pX = e.deltaX;
}
if (e.shiftKey && !pX) { // if user scrolls with shift he wants horizontal scroll
pX = pY;
pY = 0;
}
if ((pX || pY) && e.deltaMode) {
if (e.deltaMode === 1) { // delta in LINE units
pX *= LINE_HEIGHT;
pY *= LINE_HEIGHT;
} else { // delta in PAGE units
pX *= PAGE_HEIGHT;
pY *= PAGE_HEIGHT;
}
}
// Fall-back if spin cannot be determined
if (pX && !sX) {
sX = (pX < 1) ? -1 : 1;
}
if (pY && !sY) {
sY = (pY < 1) ? -1 : 1;
}
return {
spinX: sX,
spinY: sY,
pixelX: pX,
pixelY: pY,
};
},
handleMouseEnter() {
const swiper = this;
swiper.mouseEntered = true;
},
handleMouseLeave() {
const swiper = this;
swiper.mouseEntered = false;
},
handle(event) {
let e = event;
const swiper = this;
const params = swiper.params.mousewheel;
if (swiper.params.cssMode) {
e.preventDefault();
}
let target = swiper.$el;
if (swiper.params.mousewheel.eventsTarged !== 'container') {
target = $(swiper.params.mousewheel.eventsTarged);
}
if (!swiper.mouseEntered && !target[0].contains(e.target) && !params.releaseOnEdges) return true;
if (e.originalEvent) e = e.originalEvent; // jquery fix
let delta = 0;
const rtlFactor = swiper.rtlTranslate ? -1 : 1;
const data = Mousewheel.normalize(e);
if (params.forceToAxis) {
if (swiper.isHorizontal()) {
if (Math.abs(data.pixelX) > Math.abs(data.pixelY)) delta = data.pixelX * rtlFactor;
else return true;
} else if (Math.abs(data.pixelY) > Math.abs(data.pixelX)) delta = data.pixelY;
else return true;
} else {
delta = Math.abs(data.pixelX) > Math.abs(data.pixelY) ? -data.pixelX * rtlFactor : -data.pixelY;
}
if (delta === 0) return true;
if (params.invert) delta = -delta;
if (!swiper.params.freeMode) {
// Register the new event in a variable which stores the relevant data
const newEvent = {
time: Utils.now(),
delta: Math.abs(delta),
direction: Math.sign(delta),
raw: event,
};
// Keep the most recent events
const recentWheelEvents = swiper.mousewheel.recentWheelEvents;
if (recentWheelEvents.length >= 2) {
recentWheelEvents.shift(); // only store the last N events
}
const prevEvent = recentWheelEvents.length ? recentWheelEvents[recentWheelEvents.length - 1] : undefined;
recentWheelEvents.push(newEvent);
// If there is at least one previous recorded event:
// If direction has changed or
// if the scroll is quicker than the previous one:
// Animate the slider.
// Else (this is the first time the wheel is moved):
// Animate the slider.
if (prevEvent) {
if (newEvent.direction !== prevEvent.direction || newEvent.delta > prevEvent.delta || newEvent.time > prevEvent.time + 150) {
swiper.mousewheel.animateSlider(newEvent);
}
} else {
swiper.mousewheel.animateSlider(newEvent);
}
// If it's time to release the scroll:
// Return now so you don't hit the preventDefault.
if (swiper.mousewheel.releaseScroll(newEvent)) {
return true;
}
} else {
// Freemode or scrollContainer:
// If we recently snapped after a momentum scroll, then ignore wheel events
// to give time for the deceleration to finish. Stop ignoring after 500 msecs
// or if it's a new scroll (larger delta or inverse sign as last event before
// an end-of-momentum snap).
const newEvent = { time: Utils.now(), delta: Math.abs(delta), direction: Math.sign(delta) };
const { lastEventBeforeSnap } = swiper.mousewheel;
const ignoreWheelEvents = lastEventBeforeSnap
&& newEvent.time < lastEventBeforeSnap.time + 500
&& newEvent.delta <= lastEventBeforeSnap.delta
&& newEvent.direction === lastEventBeforeSnap.direction;
if (!ignoreWheelEvents) {
swiper.mousewheel.lastEventBeforeSnap = undefined;
if (swiper.params.loop) {
swiper.loopFix();
}
let position = swiper.getTranslate() + (delta * params.sensitivity);
const wasBeginning = swiper.isBeginning;
const wasEnd = swiper.isEnd;
if (position >= swiper.minTranslate()) position = swiper.minTranslate();
if (position <= swiper.maxTranslate()) position = swiper.maxTranslate();
swiper.setTransition(0);
swiper.setTranslate(position);
swiper.updateProgress();
swiper.updateActiveIndex();
swiper.updateSlidesClasses();
if ((!wasBeginning && swiper.isBeginning) || (!wasEnd && swiper.isEnd)) {
swiper.updateSlidesClasses();
}
if (swiper.params.freeModeSticky) {
// When wheel scrolling starts with sticky (aka snap) enabled, then detect
// the end of a momentum scroll by storing recent (N=15?) wheel events.
// 1. do all N events have decreasing or same (absolute value) delta?
// 2. did all N events arrive in the last M (M=500?) msecs?
// 3. does the earliest event have an (absolute value) delta that's
// at least P (P=1?) larger than the most recent event's delta?
// 4. does the latest event have a delta that's smaller than Q (Q=6?) pixels?
// If 1-4 are "yes" then we're near the end of a momuntum scroll deceleration.
// Snap immediately and ignore remaining wheel events in this scroll.
// See comment above for "remaining wheel events in this scroll" determination.
// If 1-4 aren't satisfied, then wait to snap until 500ms after the last event.
clearTimeout(swiper.mousewheel.timeout);
swiper.mousewheel.timeout = undefined;
const recentWheelEvents = swiper.mousewheel.recentWheelEvents;
if (recentWheelEvents.length >= 15) {
recentWheelEvents.shift(); // only store the last N events
}
const prevEvent = recentWheelEvents.length ? recentWheelEvents[recentWheelEvents.length - 1] : undefined;
const firstEvent = recentWheelEvents[0];
recentWheelEvents.push(newEvent);
if (prevEvent && (newEvent.delta > prevEvent.delta || newEvent.direction !== prevEvent.direction)) {
// Increasing or reverse-sign delta means the user started scrolling again. Clear the wheel event log.
recentWheelEvents.splice(0);
} else if (recentWheelEvents.length >= 15
&& newEvent.time - firstEvent.time < 500
&& firstEvent.delta - newEvent.delta >= 1
&& newEvent.delta <= 6
) {
// We're at the end of the deceleration of a momentum scroll, so there's no need
// to wait for more events. Snap ASAP on the next tick.
// Also, because there's some remaining momentum we'll bias the snap in the
// direction of the ongoing scroll because it's better UX for the scroll to snap
// in the same direction as the scroll instead of reversing to snap. Therefore,
// if it's already scrolled more than 20% in the current direction, keep going.
const snapToThreshold = delta > 0 ? 0.8 : 0.2;
swiper.mousewheel.lastEventBeforeSnap = newEvent;
recentWheelEvents.splice(0);
swiper.mousewheel.timeout = Utils.nextTick(() => {
swiper.slideToClosest(swiper.params.speed, true, undefined, snapToThreshold);
}, 0); // no delay; move on next tick
}
if (!swiper.mousewheel.timeout) {
// if we get here, then we haven't detected the end of a momentum scroll, so
// we'll consider a scroll "complete" when there haven't been any wheel events
// for 500ms.
swiper.mousewheel.timeout = Utils.nextTick(() => {
const snapToThreshold = 0.5;
swiper.mousewheel.lastEventBeforeSnap = newEvent;
recentWheelEvents.splice(0);
swiper.slideToClosest(swiper.params.speed, true, undefined, snapToThreshold);
}, 500);
}
}
// Emit event
if (!ignoreWheelEvents) swiper.emit('scroll', e);
// Stop autoplay
if (swiper.params.autoplay && swiper.params.autoplayDisableOnInteraction) swiper.autoplay.stop();
// Return page scroll on edge positions
if (position === swiper.minTranslate() || position === swiper.maxTranslate()) return true;
}
}
if (e.preventDefault) e.preventDefault();
else e.returnValue = false;
return false;
},
animateSlider(newEvent) {
const swiper = this;
// If the movement is NOT big enough and
// if the last time the user scrolled was too close to the current one (avoid continuously triggering the slider):
// Don't go any further (avoid insignificant scroll movement).
if (newEvent.delta >= 6 && Utils.now() - swiper.mousewheel.lastScrollTime < 60) {
// Return false as a default
return true;
}
// If user is scrolling towards the end:
// If the slider hasn't hit the latest slide or
// if the slider is a loop and
// if the slider isn't moving right now:
// Go to next slide and
// emit a scroll event.
// Else (the user is scrolling towards the beginning) and
// if the slider hasn't hit the first slide or
// if the slider is a loop and
// if the slider isn't moving right now:
// Go to prev slide and
// emit a scroll event.
if (newEvent.direction < 0) {
if ((!swiper.isEnd || swiper.params.loop) && !swiper.animating) {
swiper.slideNext();
swiper.emit('scroll', newEvent.raw);
}
} else if ((!swiper.isBeginning || swiper.params.loop) && !swiper.animating) {
swiper.slidePrev();
swiper.emit('scroll', newEvent.raw);
}
// If you got here is because an animation has been triggered so store the current time
swiper.mousewheel.lastScrollTime = (new win.Date()).getTime();
// Return false as a default
return false;
},
releaseScroll(newEvent) {
const swiper = this;
const params = swiper.params.mousewheel;
if (newEvent.direction < 0) {
if (swiper.isEnd && !swiper.params.loop && params.releaseOnEdges) {
// Return true to animate scroll on edges
return true;
}
} else if (swiper.isBeginning && !swiper.params.loop && params.releaseOnEdges) {
// Return true to animate scroll on edges
return true;
}
return false;
},
enable() {
const swiper = this;
const event = Mousewheel.event();
if (swiper.params.cssMode) {
swiper.wrapperEl.removeEventListener(event, swiper.mousewheel.handle);
return true;
}
if (!event) return false;
if (swiper.mousewheel.enabled) return false;
let target = swiper.$el;
if (swiper.params.mousewheel.eventsTarged !== 'container') {
target = $(swiper.params.mousewheel.eventsTarged);
}
target.on('mouseenter', swiper.mousewheel.handleMouseEnter);
target.on('mouseleave', swiper.mousewheel.handleMouseLeave);
target.on(event, swiper.mousewheel.handle);
swiper.mousewheel.enabled = true;
return true;
},
disable() {
const swiper = this;
const event = Mousewheel.event();
if (swiper.params.cssMode) {
swiper.wrapperEl.addEventListener(event, swiper.mousewheel.handle);
return true;
}
if (!event) return false;
if (!swiper.mousewheel.enabled) return false;
let target = swiper.$el;
if (swiper.params.mousewheel.eventsTarged !== 'container') {
target = $(swiper.params.mousewheel.eventsTarged);
}
target.off(event, swiper.mousewheel.handle);
swiper.mousewheel.enabled = false;
return true;
},
};
const Pagination = {
update() {
// Render || Update Pagination bullets/items
const swiper = this;
const rtl = swiper.rtl;
const params = swiper.params.pagination;
if (!params.el || !swiper.pagination.el || !swiper.pagination.$el || swiper.pagination.$el.length === 0) return;
const slidesLength = swiper.virtual && swiper.params.virtual.enabled ? swiper.virtual.slides.length : swiper.slides.length;
const $el = swiper.pagination.$el;
// Current/Total
let current;
const total = swiper.params.loop ? Math.ceil((slidesLength - (swiper.loopedSlides * 2)) / swiper.params.slidesPerGroup) : swiper.snapGrid.length;
if (swiper.params.loop) {
current = Math.ceil((swiper.activeIndex - swiper.loopedSlides) / swiper.params.slidesPerGroup);
if (current > slidesLength - 1 - (swiper.loopedSlides * 2)) {
current -= (slidesLength - (swiper.loopedSlides * 2));
}
if (current > total - 1) current -= total;
if (current < 0 && swiper.params.paginationType !== 'bullets') current = total + current;
} else if (typeof swiper.snapIndex !== 'undefined') {
current = swiper.snapIndex;
} else {
current = swiper.activeIndex || 0;
}
// Types
if (params.type === 'bullets' && swiper.pagination.bullets && swiper.pagination.bullets.length > 0) {
const bullets = swiper.pagination.bullets;
let firstIndex;
let lastIndex;
let midIndex;
if (params.dynamicBullets) {
swiper.pagination.bulletSize = bullets.eq(0)[swiper.isHorizontal() ? 'outerWidth' : 'outerHeight'](true);
$el.css(swiper.isHorizontal() ? 'width' : 'height', `${swiper.pagination.bulletSize * (params.dynamicMainBullets + 4)}px`);
if (params.dynamicMainBullets > 1 && swiper.previousIndex !== undefined) {
swiper.pagination.dynamicBulletIndex += (current - swiper.previousIndex);
if (swiper.pagination.dynamicBulletIndex > (params.dynamicMainBullets - 1)) {
swiper.pagination.dynamicBulletIndex = params.dynamicMainBullets - 1;
} else if (swiper.pagination.dynamicBulletIndex < 0) {
swiper.pagination.dynamicBulletIndex = 0;
}
}
firstIndex = current - swiper.pagination.dynamicBulletIndex;
lastIndex = firstIndex + (Math.min(bullets.length, params.dynamicMainBullets) - 1);
midIndex = (lastIndex + firstIndex) / 2;
}
bullets.removeClass(`${params.bulletActiveClass} ${params.bulletActiveClass}-next ${params.bulletActiveClass}-next-next ${params.bulletActiveClass}-prev ${params.bulletActiveClass}-prev-prev ${params.bulletActiveClass}-main`);
if ($el.length > 1) {
bullets.each((index, bullet) => {
const $bullet = $(bullet);
const bulletIndex = $bullet.index();
if (bulletIndex === current) {
$bullet.addClass(params.bulletActiveClass);
}
if (params.dynamicBullets) {
if (bulletIndex >= firstIndex && bulletIndex <= lastIndex) {
$bullet.addClass(`${params.bulletActiveClass}-main`);
}
if (bulletIndex === firstIndex) {
$bullet
.prev()
.addClass(`${params.bulletActiveClass}-prev`)
.prev()
.addClass(`${params.bulletActiveClass}-prev-prev`);
}
if (bulletIndex === lastIndex) {
$bullet
.next()
.addClass(`${params.bulletActiveClass}-next`)
.next()
.addClass(`${params.bulletActiveClass}-next-next`);
}
}
});
} else {
const $bullet = bullets.eq(current);
const bulletIndex = $bullet.index();
$bullet.addClass(params.bulletActiveClass);
if (params.dynamicBullets) {
const $firstDisplayedBullet = bullets.eq(firstIndex);
const $lastDisplayedBullet = bullets.eq(lastIndex);
for (let i = firstIndex; i <= lastIndex; i += 1) {
bullets.eq(i).addClass(`${params.bulletActiveClass}-main`);
}
if (swiper.params.loop) {
if (bulletIndex >= bullets.length - params.dynamicMainBullets) {
for (let i = params.dynamicMainBullets; i >= 0; i -= 1) {
bullets.eq(bullets.length - i).addClass(`${params.bulletActiveClass}-main`);
}
bullets.eq(bullets.length - params.dynamicMainBullets - 1).addClass(`${params.bulletActiveClass}-prev`);
} else {
$firstDisplayedBullet
.prev()
.addClass(`${params.bulletActiveClass}-prev`)
.prev()
.addClass(`${params.bulletActiveClass}-prev-prev`);
$lastDisplayedBullet
.next()
.addClass(`${params.bulletActiveClass}-next`)
.next()
.addClass(`${params.bulletActiveClass}-next-next`);
}
} else {
$firstDisplayedBullet
.prev()
.addClass(`${params.bulletActiveClass}-prev`)
.prev()
.addClass(`${params.bulletActiveClass}-prev-prev`);
$lastDisplayedBullet
.next()
.addClass(`${params.bulletActiveClass}-next`)
.next()
.addClass(`${params.bulletActiveClass}-next-next`);
}
}
}
if (params.dynamicBullets) {
const dynamicBulletsLength = Math.min(bullets.length, params.dynamicMainBullets + 4);
const bulletsOffset = (((swiper.pagination.bulletSize * dynamicBulletsLength) - (swiper.pagination.bulletSize)) / 2) - (midIndex * swiper.pagination.bulletSize);
const offsetProp = rtl ? 'right' : 'left';
bullets.css(swiper.isHorizontal() ? offsetProp : 'top', `${bulletsOffset}px`);
}
}
if (params.type === 'fraction') {
$el.find(`.${params.currentClass}`).text(params.formatFractionCurrent(current + 1));
$el.find(`.${params.totalClass}`).text(params.formatFractionTotal(total));
}
if (params.type === 'progressbar') {
let progressbarDirection;
if (params.progressbarOpposite) {
progressbarDirection = swiper.isHorizontal() ? 'vertical' : 'horizontal';
} else {
progressbarDirection = swiper.isHorizontal() ? 'horizontal' : 'vertical';
}
const scale = (current + 1) / total;
let scaleX = 1;
let scaleY = 1;
if (progressbarDirection === 'horizontal') {
scaleX = scale;
} else {
scaleY = scale;
}
$el.find(`.${params.progressbarFillClass}`).transform(`translate3d(0,0,0) scaleX(${scaleX}) scaleY(${scaleY})`).transition(swiper.params.speed);
}
if (params.type === 'custom' && params.renderCustom) {
$el.html(params.renderCustom(swiper, current + 1, total));
swiper.emit('paginationRender', swiper, $el[0]);
} else {
swiper.emit('paginationUpdate', swiper, $el[0]);
}
$el[swiper.params.watchOverflow && swiper.isLocked ? 'addClass' : 'removeClass'](params.lockClass);
},
render() {
// Render Container
const swiper = this;
const params = swiper.params.pagination;
if (!params.el || !swiper.pagination.el || !swiper.pagination.$el || swiper.pagination.$el.length === 0) return;
const slidesLength = swiper.virtual && swiper.params.virtual.enabled ? swiper.virtual.slides.length : swiper.slides.length;
const $el = swiper.pagination.$el;
let paginationHTML = '';
if (params.type === 'bullets') {
const numberOfBullets = swiper.params.loop ? Math.ceil((slidesLength - (swiper.loopedSlides * 2)) / swiper.params.slidesPerGroup) : swiper.snapGrid.length;
for (let i = 0; i < numberOfBullets; i += 1) {
if (params.renderBullet) {
paginationHTML += params.renderBullet.call(swiper, i, params.bulletClass);
} else {
paginationHTML += `<${params.bulletElement} class="${params.bulletClass}"></${params.bulletElement}>`;
}
}
$el.html(paginationHTML);
swiper.pagination.bullets = $el.find(`.${params.bulletClass}`);
}
if (params.type === 'fraction') {
if (params.renderFraction) {
paginationHTML = params.renderFraction.call(swiper, params.currentClass, params.totalClass);
} else {
paginationHTML = `<span class="${params.currentClass}"></span>`
+ ' / '
+ `<span class="${params.totalClass}"></span>`;
}
$el.html(paginationHTML);
}
if (params.type === 'progressbar') {
if (params.renderProgressbar) {
paginationHTML = params.renderProgressbar.call(swiper, params.progressbarFillClass);
} else {
paginationHTML = `<span class="${params.progressbarFillClass}"></span>`;
}
$el.html(paginationHTML);
}
if (params.type !== 'custom') {
swiper.emit('paginationRender', swiper.pagination.$el[0]);
}
},
init() {
const swiper = this;
const params = swiper.params.pagination;
if (!params.el) return;
let $el = $(params.el);
if ($el.length === 0) return;
if (
swiper.params.uniqueNavElements
&& typeof params.el === 'string'
&& $el.length > 1
&& swiper.$el.find(params.el).length === 1
) {
$el = swiper.$el.find(params.el);
}
if (params.type === 'bullets' && params.clickable) {
$el.addClass(params.clickableClass);
}
$el.addClass(params.modifierClass + params.type);
if (params.type === 'bullets' && params.dynamicBullets) {
$el.addClass(`${params.modifierClass}${params.type}-dynamic`);
swiper.pagination.dynamicBulletIndex = 0;
if (params.dynamicMainBullets < 1) {
params.dynamicMainBullets = 1;
}
}
if (params.type === 'progressbar' && params.progressbarOpposite) {
$el.addClass(params.progressbarOppositeClass);
}
if (params.clickable) {
$el.on('click', `.${params.bulletClass}`, function onClick(e) {
e.preventDefault();
let index = $(this).index() * swiper.params.slidesPerGroup;
if (swiper.params.loop) index += swiper.loopedSlides;
swiper.slideTo(index);
});
}
Utils.extend(swiper.pagination, {
$el,
el: $el[0],
});
},
destroy() {
const swiper = this;
const params = swiper.params.pagination;
if (!params.el || !swiper.pagination.el || !swiper.pagination.$el || swiper.pagination.$el.length === 0) return;
const $el = swiper.pagination.$el;
$el.removeClass(params.hiddenClass);
$el.removeClass(params.modifierClass + params.type);
if (swiper.pagination.bullets) swiper.pagination.bullets.removeClass(params.bulletActiveClass);
if (params.clickable) {
$el.off('click', `.${params.bulletClass}`);
}
},
};
var pagination = {
name: 'pagination',
params: {
pagination: {
el: null,
bulletElement: 'span',
clickable: false,
hideOnClick: false,
renderBullet: null,
renderProgressbar: null,
renderFraction: null,
renderCustom: null,
progressbarOpposite: false,
type: 'bullets', // 'bullets' or 'progressbar' or 'fraction' or 'custom'
dynamicBullets: false,
dynamicMainBullets: 1,
formatFractionCurrent: (number) => number,
formatFractionTotal: (number) => number,
bulletClass: 'swiper-pagination-bullet',
bulletActiveClass: 'swiper-pagination-bullet-active',
modifierClass: 'swiper-pagination-', // NEW
currentClass: 'swiper-pagination-current',
totalClass: 'swiper-pagination-total',
hiddenClass: 'swiper-pagination-hidden',
progressbarFillClass: 'swiper-pagination-progressbar-fill',
progressbarOppositeClass: 'swiper-pagination-progressbar-opposite',
clickableClass: 'swiper-pagination-clickable', // NEW
lockClass: 'swiper-pagination-lock',
},
},
create() {
const swiper = this;
Utils.extend(swiper, {
pagination: {
init: Pagination.init.bind(swiper),
render: Pagination.render.bind(swiper),
update: Pagination.update.bind(swiper),
destroy: Pagination.destroy.bind(swiper),
dynamicBulletIndex: 0,
},
});
},
on: {
init() {
const swiper = this;
swiper.pagination.init();
swiper.pagination.render();
swiper.pagination.update();
},
activeIndexChange() {
const swiper = this;
if (swiper.params.loop) {
swiper.pagination.update();
} else if (typeof swiper.snapIndex === 'undefined') {
swiper.pagination.update();
}
},
snapIndexChange() {
const swiper = this;
if (!swiper.params.loop) {
swiper.pagination.update();
}
},
slidesLengthChange() {
const swiper = this;
if (swiper.params.loop) {
swiper.pagination.render();
swiper.pagination.update();
}
},
snapGridLengthChange() {
const swiper = this;
if (!swiper.params.loop) {
swiper.pagination.render();
swiper.pagination.update();
}
},
destroy() {
const swiper = this;
swiper.pagination.destroy();
},
click(e) {
const swiper = this;
if (
swiper.params.pagination.el
&& swiper.params.pagination.hideOnClick
&& swiper.pagination.$el.length > 0
&& !$(e.target).hasClass(swiper.params.pagination.bulletClass)
) {
const isHidden = swiper.pagination.$el.hasClass(swiper.params.pagination.hiddenClass);
if (isHidden === true) {
swiper.emit('paginationShow', swiper);
} else {
swiper.emit('paginationHide', swiper);
}
swiper.pagination.$el.toggleClass(swiper.params.pagination.hiddenClass);
}
},
},
};
const Scrollbar = {
setTranslate() {
const swiper = this;
if (!swiper.params.scrollbar.el || !swiper.scrollbar.el) return;
const { scrollbar, rtlTranslate: rtl, progress } = swiper;
const {
dragSize, trackSize, $dragEl, $el,
} = scrollbar;
const params = swiper.params.scrollbar;
let newSize = dragSize;
let newPos = (trackSize - dragSize) * progress;
if (rtl) {
newPos = -newPos;
if (newPos > 0) {
newSize = dragSize - newPos;
newPos = 0;
} else if (-newPos + dragSize > trackSize) {
newSize = trackSize + newPos;
}
} else if (newPos < 0) {
newSize = dragSize + newPos;
newPos = 0;
} else if (newPos + dragSize > trackSize) {
newSize = trackSize - newPos;
}
if (swiper.isHorizontal()) {
$dragEl.transform(`translate3d(${newPos}px, 0, 0)`);
$dragEl[0].style.width = `${newSize}px`;
} else {
$dragEl.transform(`translate3d(0px, ${newPos}px, 0)`);
$dragEl[0].style.height = `${newSize}px`;
}
if (params.hide) {
clearTimeout(swiper.scrollbar.timeout);
$el[0].style.opacity = 1;
swiper.scrollbar.timeout = setTimeout(() => {
$el[0].style.opacity = 0;
$el.transition(400);
}, 1000);
}
},
setTransition(duration) {
const swiper = this;
if (!swiper.params.scrollbar.el || !swiper.scrollbar.el) return;
swiper.scrollbar.$dragEl.transition(duration);
},
updateSize() {
const swiper = this;
if (!swiper.params.scrollbar.el || !swiper.scrollbar.el) return;
const { scrollbar } = swiper;
const { $dragEl, $el } = scrollbar;
$dragEl[0].style.width = '';
$dragEl[0].style.height = '';
const trackSize = swiper.isHorizontal() ? $el[0].offsetWidth : $el[0].offsetHeight;
const divider = swiper.size / swiper.virtualSize;
const moveDivider = divider * (trackSize / swiper.size);
let dragSize;
if (swiper.params.scrollbar.dragSize === 'auto') {
dragSize = trackSize * divider;
} else {
dragSize = parseInt(swiper.params.scrollbar.dragSize, 10);
}
if (swiper.isHorizontal()) {
$dragEl[0].style.width = `${dragSize}px`;
} else {
$dragEl[0].style.height = `${dragSize}px`;
}
if (divider >= 1) {
$el[0].style.display = 'none';
} else {
$el[0].style.display = '';
}
if (swiper.params.scrollbar.hide) {
$el[0].style.opacity = 0;
}
Utils.extend(scrollbar, {
trackSize,
divider,
moveDivider,
dragSize,
});
scrollbar.$el[swiper.params.watchOverflow && swiper.isLocked ? 'addClass' : 'removeClass'](swiper.params.scrollbar.lockClass);
},
getPointerPosition(e) {
const swiper = this;
if (swiper.isHorizontal()) {
return ((e.type === 'touchstart' || e.type === 'touchmove') ? e.targetTouches[0].clientX : e.clientX);
}
return ((e.type === 'touchstart' || e.type === 'touchmove') ? e.targetTouches[0].clientY : e.clientY);
},
setDragPosition(e) {
const swiper = this;
const { scrollbar, rtlTranslate: rtl } = swiper;
const {
$el,
dragSize,
trackSize,
dragStartPos,
} = scrollbar;
let positionRatio;
positionRatio = ((scrollbar.getPointerPosition(e)) - $el.offset()[swiper.isHorizontal() ? 'left' : 'top']
- (dragStartPos !== null ? dragStartPos : dragSize / 2)) / (trackSize - dragSize);
positionRatio = Math.max(Math.min(positionRatio, 1), 0);
if (rtl) {
positionRatio = 1 - positionRatio;
}
const position = swiper.minTranslate() + ((swiper.maxTranslate() - swiper.minTranslate()) * positionRatio);
swiper.updateProgress(position);
swiper.setTranslate(position);
swiper.updateActiveIndex();
swiper.updateSlidesClasses();
},
onDragStart(e) {
const swiper = this;
const params = swiper.params.scrollbar;
const { scrollbar, $wrapperEl } = swiper;
const { $el, $dragEl } = scrollbar;
swiper.scrollbar.isTouched = true;
swiper.scrollbar.dragStartPos = (e.target === $dragEl[0] || e.target === $dragEl)
? scrollbar.getPointerPosition(e) - e.target.getBoundingClientRect()[swiper.isHorizontal() ? 'left' : 'top'] : null;
e.preventDefault();
e.stopPropagation();
$wrapperEl.transition(100);
$dragEl.transition(100);
scrollbar.setDragPosition(e);
clearTimeout(swiper.scrollbar.dragTimeout);
$el.transition(0);
if (params.hide) {
$el.css('opacity', 1);
}
if (swiper.params.cssMode) {
swiper.$wrapperEl.css('scroll-snap-type', 'none');
}
swiper.emit('scrollbarDragStart', e);
},
onDragMove(e) {
const swiper = this;
const { scrollbar, $wrapperEl } = swiper;
const { $el, $dragEl } = scrollbar;
if (!swiper.scrollbar.isTouched) return;
if (e.preventDefault) e.preventDefault();
else e.returnValue = false;
scrollbar.setDragPosition(e);
$wrapperEl.transition(0);
$el.transition(0);
$dragEl.transition(0);
swiper.emit('scrollbarDragMove', e);
},
onDragEnd(e) {
const swiper = this;
const params = swiper.params.scrollbar;
const { scrollbar, $wrapperEl } = swiper;
const { $el } = scrollbar;
if (!swiper.scrollbar.isTouched) return;
swiper.scrollbar.isTouched = false;
if (swiper.params.cssMode) {
swiper.$wrapperEl.css('scroll-snap-type', '');
$wrapperEl.transition('');
}
if (params.hide) {
clearTimeout(swiper.scrollbar.dragTimeout);
swiper.scrollbar.dragTimeout = Utils.nextTick(() => {
$el.css('opacity', 0);
$el.transition(400);
}, 1000);
}
swiper.emit('scrollbarDragEnd', e);
if (params.snapOnRelease) {
swiper.slideToClosest();
}
},
enableDraggable() {
const swiper = this;
if (!swiper.params.scrollbar.el) return;
const {
scrollbar, touchEventsTouch, touchEventsDesktop, params,
} = swiper;
const $el = scrollbar.$el;
const target = $el[0];
const activeListener = Support.passiveListener && params.passiveListeners ? { passive: false, capture: false } : false;
const passiveListener = Support.passiveListener && params.passiveListeners ? { passive: true, capture: false } : false;
if (!Support.touch) {
target.addEventListener(touchEventsDesktop.start, swiper.scrollbar.onDragStart, activeListener);
doc.addEventListener(touchEventsDesktop.move, swiper.scrollbar.onDragMove, activeListener);
doc.addEventListener(touchEventsDesktop.end, swiper.scrollbar.onDragEnd, passiveListener);
} else {
target.addEventListener(touchEventsTouch.start, swiper.scrollbar.onDragStart, activeListener);
target.addEventListener(touchEventsTouch.move, swiper.scrollbar.onDragMove, activeListener);
target.addEventListener(touchEventsTouch.end, swiper.scrollbar.onDragEnd, passiveListener);
}
},
disableDraggable() {
const swiper = this;
if (!swiper.params.scrollbar.el) return;
const {
scrollbar, touchEventsTouch, touchEventsDesktop, params,
} = swiper;
const $el = scrollbar.$el;
const target = $el[0];
const activeListener = Support.passiveListener && params.passiveListeners ? { passive: false, capture: false } : false;
const passiveListener = Support.passiveListener && params.passiveListeners ? { passive: true, capture: false } : false;
if (!Support.touch) {
target.removeEventListener(touchEventsDesktop.start, swiper.scrollbar.onDragStart, activeListener);
doc.removeEventListener(touchEventsDesktop.move, swiper.scrollbar.onDragMove, activeListener);
doc.removeEventListener(touchEventsDesktop.end, swiper.scrollbar.onDragEnd, passiveListener);
} else {
target.removeEventListener(touchEventsTouch.start, swiper.scrollbar.onDragStart, activeListener);
target.removeEventListener(touchEventsTouch.move, swiper.scrollbar.onDragMove, activeListener);
target.removeEventListener(touchEventsTouch.end, swiper.scrollbar.onDragEnd, passiveListener);
}
},
init() {
const swiper = this;
if (!swiper.params.scrollbar.el) return;
const { scrollbar, $el: $swiperEl } = swiper;
const params = swiper.params.scrollbar;
let $el = $(params.el);
if (swiper.params.uniqueNavElements && typeof params.el === 'string' && $el.length > 1 && $swiperEl.find(params.el).length === 1) {
$el = $swiperEl.find(params.el);
}
let $dragEl = $el.find(`.${swiper.params.scrollbar.dragClass}`);
if ($dragEl.length === 0) {
$dragEl = $(`<div class="${swiper.params.scrollbar.dragClass}"></div>`);
$el.append($dragEl);
}
Utils.extend(scrollbar, {
$el,
el: $el[0],
$dragEl,
dragEl: $dragEl[0],
});
if (params.draggable) {
scrollbar.enableDraggable();
}
},
destroy() {
const swiper = this;
swiper.scrollbar.disableDraggable();
},
};
var scrollbar = {
name: 'scrollbar',
params: {
scrollbar: {
el: null,
dragSize: 'auto',
hide: false,
draggable: false,
snapOnRelease: true,
lockClass: 'swiper-scrollbar-lock',
dragClass: 'swiper-scrollbar-drag',
},
},
create() {
const swiper = this;
Utils.extend(swiper, {
scrollbar: {
init: Scrollbar.init.bind(swiper),
destroy: Scrollbar.destroy.bind(swiper),
updateSize: Scrollbar.updateSize.bind(swiper),
setTranslate: Scrollbar.setTranslate.bind(swiper),
setTransition: Scrollbar.setTransition.bind(swiper),
enableDraggable: Scrollbar.enableDraggable.bind(swiper),
disableDraggable: Scrollbar.disableDraggable.bind(swiper),
setDragPosition: Scrollbar.setDragPosition.bind(swiper),
getPointerPosition: Scrollbar.getPointerPosition.bind(swiper),
onDragStart: Scrollbar.onDragStart.bind(swiper),
onDragMove: Scrollbar.onDragMove.bind(swiper),
onDragEnd: Scrollbar.onDragEnd.bind(swiper),
isTouched: false,
timeout: null,
dragTimeout: null,
},
});
},
on: {
init() {
const swiper = this;
swiper.scrollbar.init();
swiper.scrollbar.updateSize();
swiper.scrollbar.setTranslate();
},
update() {
const swiper = this;
swiper.scrollbar.updateSize();
},
resize() {
const swiper = this;
swiper.scrollbar.updateSize();
},
observerUpdate() {
const swiper = this;
swiper.scrollbar.updateSize();
},
setTranslate() {
const swiper = this;
swiper.scrollbar.setTranslate();
},
setTransition(duration) {
const swiper = this;
swiper.scrollbar.setTransition(duration);
},
destroy() {
const swiper = this;
swiper.scrollbar.destroy();
},
},
};
const Zoom = {
// Calc Scale From Multi-touches
getDistanceBetweenTouches(e) {
if (e.targetTouches.length < 2) return 1;
const x1 = e.targetTouches[0].pageX;
const y1 = e.targetTouches[0].pageY;
const x2 = e.targetTouches[1].pageX;
const y2 = e.targetTouches[1].pageY;
const distance = Math.sqrt(((x2 - x1) ** 2) + ((y2 - y1) ** 2));
return distance;
},
// Events
onGestureStart(e) {
const swiper = this;
const params = swiper.params.zoom;
const zoom = swiper.zoom;
const { gesture } = zoom;
zoom.fakeGestureTouched = false;
zoom.fakeGestureMoved = false;
if (!Support.gestures) {
if (e.type !== 'touchstart' || (e.type === 'touchstart' && e.targetTouches.length < 2)) {
return;
}
zoom.fakeGestureTouched = true;
gesture.scaleStart = Zoom.getDistanceBetweenTouches(e);
}
if (!gesture.$slideEl || !gesture.$slideEl.length) {
gesture.$slideEl = $(e.target).closest(`.${swiper.params.slideClass}`);
if (gesture.$slideEl.length === 0) gesture.$slideEl = swiper.slides.eq(swiper.activeIndex);
gesture.$imageEl = gesture.$slideEl.find('img, svg, canvas, picture, .swiper-zoom-target');
gesture.$imageWrapEl = gesture.$imageEl.parent(`.${params.containerClass}`);
gesture.maxRatio = gesture.$imageWrapEl.attr('data-swiper-zoom') || params.maxRatio;
if (gesture.$imageWrapEl.length === 0) {
gesture.$imageEl = undefined;
return;
}
}
if (gesture.$imageEl) {
gesture.$imageEl.transition(0);
}
swiper.zoom.isScaling = true;
},
onGestureChange(e) {
const swiper = this;
const params = swiper.params.zoom;
const zoom = swiper.zoom;
const { gesture } = zoom;
if (!Support.gestures) {
if (e.type !== 'touchmove' || (e.type === 'touchmove' && e.targetTouches.length < 2)) {
return;
}
zoom.fakeGestureMoved = true;
gesture.scaleMove = Zoom.getDistanceBetweenTouches(e);
}
if (!gesture.$imageEl || gesture.$imageEl.length === 0) return;
if (Support.gestures) {
zoom.scale = e.scale * zoom.currentScale;
} else {
zoom.scale = (gesture.scaleMove / gesture.scaleStart) * zoom.currentScale;
}
if (zoom.scale > gesture.maxRatio) {
zoom.scale = (gesture.maxRatio - 1) + (((zoom.scale - gesture.maxRatio) + 1) ** 0.5);
}
if (zoom.scale < params.minRatio) {
zoom.scale = (params.minRatio + 1) - (((params.minRatio - zoom.scale) + 1) ** 0.5);
}
gesture.$imageEl.transform(`translate3d(0,0,0) scale(${zoom.scale})`);
},
onGestureEnd(e) {
const swiper = this;
const params = swiper.params.zoom;
const zoom = swiper.zoom;
const { gesture } = zoom;
if (!Support.gestures) {
if (!zoom.fakeGestureTouched || !zoom.fakeGestureMoved) {
return;
}
if (e.type !== 'touchend' || (e.type === 'touchend' && e.changedTouches.length < 2 && !Device.android)) {
return;
}
zoom.fakeGestureTouched = false;
zoom.fakeGestureMoved = false;
}
if (!gesture.$imageEl || gesture.$imageEl.length === 0) return;
zoom.scale = Math.max(Math.min(zoom.scale, gesture.maxRatio), params.minRatio);
gesture.$imageEl.transition(swiper.params.speed).transform(`translate3d(0,0,0) scale(${zoom.scale})`);
zoom.currentScale = zoom.scale;
zoom.isScaling = false;
if (zoom.scale === 1) gesture.$slideEl = undefined;
},
onTouchStart(e) {
const swiper = this;
const zoom = swiper.zoom;
const { gesture, image } = zoom;
if (!gesture.$imageEl || gesture.$imageEl.length === 0) return;
if (image.isTouched) return;
if (Device.android && e.cancelable) e.preventDefault();
image.isTouched = true;
image.touchesStart.x = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX;
image.touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;
},
onTouchMove(e) {
const swiper = this;
const zoom = swiper.zoom;
const { gesture, image, velocity } = zoom;
if (!gesture.$imageEl || gesture.$imageEl.length === 0) return;
swiper.allowClick = false;
if (!image.isTouched || !gesture.$slideEl) return;
if (!image.isMoved) {
image.width = gesture.$imageEl[0].offsetWidth;
image.height = gesture.$imageEl[0].offsetHeight;
image.startX = Utils.getTranslate(gesture.$imageWrapEl[0], 'x') || 0;
image.startY = Utils.getTranslate(gesture.$imageWrapEl[0], 'y') || 0;
gesture.slideWidth = gesture.$slideEl[0].offsetWidth;
gesture.slideHeight = gesture.$slideEl[0].offsetHeight;
gesture.$imageWrapEl.transition(0);
if (swiper.rtl) {
image.startX = -image.startX;
image.startY = -image.startY;
}
}
// Define if we need image drag
const scaledWidth = image.width * zoom.scale;
const scaledHeight = image.height * zoom.scale;
if (scaledWidth < gesture.slideWidth && scaledHeight < gesture.slideHeight) return;
image.minX = Math.min(((gesture.slideWidth / 2) - (scaledWidth / 2)), 0);
image.maxX = -image.minX;
image.minY = Math.min(((gesture.slideHeight / 2) - (scaledHeight / 2)), 0);
image.maxY = -image.minY;
image.touchesCurrent.x = e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX;
image.touchesCurrent.y = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY;
if (!image.isMoved && !zoom.isScaling) {
if (
swiper.isHorizontal()
&& (
(Math.floor(image.minX) === Math.floor(image.startX) && image.touchesCurrent.x < image.touchesStart.x)
|| (Math.floor(image.maxX) === Math.floor(image.startX) && image.touchesCurrent.x > image.touchesStart.x)
)
) {
image.isTouched = false;
return;
} if (
!swiper.isHorizontal()
&& (
(Math.floor(image.minY) === Math.floor(image.startY) && image.touchesCurrent.y < image.touchesStart.y)
|| (Math.floor(image.maxY) === Math.floor(image.startY) && image.touchesCurrent.y > image.touchesStart.y)
)
) {
image.isTouched = false;
return;
}
}
if (e.cancelable) {
e.preventDefault();
}
e.stopPropagation();
image.isMoved = true;
image.currentX = (image.touchesCurrent.x - image.touchesStart.x) + image.startX;
image.currentY = (image.touchesCurrent.y - image.touchesStart.y) + image.startY;
if (image.currentX < image.minX) {
image.currentX = (image.minX + 1) - (((image.minX - image.currentX) + 1) ** 0.8);
}
if (image.currentX > image.maxX) {
image.currentX = (image.maxX - 1) + (((image.currentX - image.maxX) + 1) ** 0.8);
}
if (image.currentY < image.minY) {
image.currentY = (image.minY + 1) - (((image.minY - image.currentY) + 1) ** 0.8);
}
if (image.currentY > image.maxY) {
image.currentY = (image.maxY - 1) + (((image.currentY - image.maxY) + 1) ** 0.8);
}
// Velocity
if (!velocity.prevPositionX) velocity.prevPositionX = image.touchesCurrent.x;
if (!velocity.prevPositionY) velocity.prevPositionY = image.touchesCurrent.y;
if (!velocity.prevTime) velocity.prevTime = Date.now();
velocity.x = (image.touchesCurrent.x - velocity.prevPositionX) / (Date.now() - velocity.prevTime) / 2;
velocity.y = (image.touchesCurrent.y - velocity.prevPositionY) / (Date.now() - velocity.prevTime) / 2;
if (Math.abs(image.touchesCurrent.x - velocity.prevPositionX) < 2) velocity.x = 0;
if (Math.abs(image.touchesCurrent.y - velocity.prevPositionY) < 2) velocity.y = 0;
velocity.prevPositionX = image.touchesCurrent.x;
velocity.prevPositionY = image.touchesCurrent.y;
velocity.prevTime = Date.now();
gesture.$imageWrapEl.transform(`translate3d(${image.currentX}px, ${image.currentY}px,0)`);
},
onTouchEnd() {
const swiper = this;
const zoom = swiper.zoom;
const { gesture, image, velocity } = zoom;
if (!gesture.$imageEl || gesture.$imageEl.length === 0) return;
if (!image.isTouched || !image.isMoved) {
image.isTouched = false;
image.isMoved = false;
return;
}
image.isTouched = false;
image.isMoved = false;
let momentumDurationX = 300;
let momentumDurationY = 300;
const momentumDistanceX = velocity.x * momentumDurationX;
const newPositionX = image.currentX + momentumDistanceX;
const momentumDistanceY = velocity.y * momentumDurationY;
const newPositionY = image.currentY + momentumDistanceY;
// Fix duration
if (velocity.x !== 0) momentumDurationX = Math.abs((newPositionX - image.currentX) / velocity.x);
if (velocity.y !== 0) momentumDurationY = Math.abs((newPositionY - image.currentY) / velocity.y);
const momentumDuration = Math.max(momentumDurationX, momentumDurationY);
image.currentX = newPositionX;
image.currentY = newPositionY;
// Define if we need image drag
const scaledWidth = image.width * zoom.scale;
const scaledHeight = image.height * zoom.scale;
image.minX = Math.min(((gesture.slideWidth / 2) - (scaledWidth / 2)), 0);
image.maxX = -image.minX;
image.minY = Math.min(((gesture.slideHeight / 2) - (scaledHeight / 2)), 0);
image.maxY = -image.minY;
image.currentX = Math.max(Math.min(image.currentX, image.maxX), image.minX);
image.currentY = Math.max(Math.min(image.currentY, image.maxY), image.minY);
gesture.$imageWrapEl.transition(momentumDuration).transform(`translate3d(${image.currentX}px, ${image.currentY}px,0)`);
},
onTransitionEnd() {
const swiper = this;
const zoom = swiper.zoom;
const { gesture } = zoom;
if (gesture.$slideEl && swiper.previousIndex !== swiper.activeIndex) {
if (gesture.$imageEl) {
gesture.$imageEl.transform('translate3d(0,0,0) scale(1)');
}
if (gesture.$imageWrapEl) {
gesture.$imageWrapEl.transform('translate3d(0,0,0)');
}
zoom.scale = 1;
zoom.currentScale = 1;
gesture.$slideEl = undefined;
gesture.$imageEl = undefined;
gesture.$imageWrapEl = undefined;
}
},
// Toggle Zoom
toggle(e) {
const swiper = this;
const zoom = swiper.zoom;
if (zoom.scale && zoom.scale !== 1) {
// Zoom Out
zoom.out();
} else {
// Zoom In
zoom.in(e);
}
},
in(e) {
const swiper = this;
const zoom = swiper.zoom;
const params = swiper.params.zoom;
const { gesture, image } = zoom;
if (!gesture.$slideEl) {
if (swiper.params.virtual && swiper.params.virtual.enabled && swiper.virtual) {
gesture.$slideEl = swiper.$wrapperEl.children(`.${swiper.params.slideActiveClass}`);
} else {
gesture.$slideEl = swiper.slides.eq(swiper.activeIndex);
}
gesture.$imageEl = gesture.$slideEl.find('img, svg, canvas, picture, .swiper-zoom-target');
gesture.$imageWrapEl = gesture.$imageEl.parent(`.${params.containerClass}`);
}
if (!gesture.$imageEl || gesture.$imageEl.length === 0) return;
gesture.$slideEl.addClass(`${params.zoomedSlideClass}`);
let touchX;
let touchY;
let offsetX;
let offsetY;
let diffX;
let diffY;
let translateX;
let translateY;
let imageWidth;
let imageHeight;
let scaledWidth;
let scaledHeight;
let translateMinX;
let translateMinY;
let translateMaxX;
let translateMaxY;
let slideWidth;
let slideHeight;
if (typeof image.touchesStart.x === 'undefined' && e) {
touchX = e.type === 'touchend' ? e.changedTouches[0].pageX : e.pageX;
touchY = e.type === 'touchend' ? e.changedTouches[0].pageY : e.pageY;
} else {
touchX = image.touchesStart.x;
touchY = image.touchesStart.y;
}
zoom.scale = gesture.$imageWrapEl.attr('data-swiper-zoom') || params.maxRatio;
zoom.currentScale = gesture.$imageWrapEl.attr('data-swiper-zoom') || params.maxRatio;
if (e) {
slideWidth = gesture.$slideEl[0].offsetWidth;
slideHeight = gesture.$slideEl[0].offsetHeight;
offsetX = gesture.$slideEl.offset().left;
offsetY = gesture.$slideEl.offset().top;
diffX = (offsetX + (slideWidth / 2)) - touchX;
diffY = (offsetY + (slideHeight / 2)) - touchY;
imageWidth = gesture.$imageEl[0].offsetWidth;
imageHeight = gesture.$imageEl[0].offsetHeight;
scaledWidth = imageWidth * zoom.scale;
scaledHeight = imageHeight * zoom.scale;
translateMinX = Math.min(((slideWidth / 2) - (scaledWidth / 2)), 0);
translateMinY = Math.min(((slideHeight / 2) - (scaledHeight / 2)), 0);
translateMaxX = -translateMinX;
translateMaxY = -translateMinY;
translateX = diffX * zoom.scale;
translateY = diffY * zoom.scale;
if (translateX < translateMinX) {
translateX = translateMinX;
}
if (translateX > translateMaxX) {
translateX = translateMaxX;
}
if (translateY < translateMinY) {
translateY = translateMinY;
}
if (translateY > translateMaxY) {
translateY = translateMaxY;
}
} else {
translateX = 0;
translateY = 0;
}
gesture.$imageWrapEl.transition(300).transform(`translate3d(${translateX}px, ${translateY}px,0)`);
gesture.$imageEl.transition(300).transform(`translate3d(0,0,0) scale(${zoom.scale})`);
},
out() {
const swiper = this;
const zoom = swiper.zoom;
const params = swiper.params.zoom;
const { gesture } = zoom;
if (!gesture.$slideEl) {
if (swiper.params.virtual && swiper.params.virtual.enabled && swiper.virtual) {
gesture.$slideEl = swiper.$wrapperEl.children(`.${swiper.params.slideActiveClass}`);
} else {
gesture.$slideEl = swiper.slides.eq(swiper.activeIndex);
}
gesture.$imageEl = gesture.$slideEl.find('img, svg, canvas, picture, .swiper-zoom-target');
gesture.$imageWrapEl = gesture.$imageEl.parent(`.${params.containerClass}`);
}
if (!gesture.$imageEl || gesture.$imageEl.length === 0) return;
zoom.scale = 1;
zoom.currentScale = 1;
gesture.$imageWrapEl.transition(300).transform('translate3d(0,0,0)');
gesture.$imageEl.transition(300).transform('translate3d(0,0,0) scale(1)');
gesture.$slideEl.removeClass(`${params.zoomedSlideClass}`);
gesture.$slideEl = undefined;
},
// Attach/Detach Events
enable() {
const swiper = this;
const zoom = swiper.zoom;
if (zoom.enabled) return;
zoom.enabled = true;
const passiveListener = swiper.touchEvents.start === 'touchstart' && Support.passiveListener && swiper.params.passiveListeners ? { passive: true, capture: false } : false;
const activeListenerWithCapture = Support.passiveListener ? { passive: false, capture: true } : true;
const slideSelector = `.${swiper.params.slideClass}`;
// Scale image
if (Support.gestures) {
swiper.$wrapperEl.on('gesturestart', slideSelector, zoom.onGestureStart, passiveListener);
swiper.$wrapperEl.on('gesturechange', slideSelector, zoom.onGestureChange, passiveListener);
swiper.$wrapperEl.on('gestureend', slideSelector, zoom.onGestureEnd, passiveListener);
} else if (swiper.touchEvents.start === 'touchstart') {
swiper.$wrapperEl.on(swiper.touchEvents.start, slideSelector, zoom.onGestureStart, passiveListener);
swiper.$wrapperEl.on(swiper.touchEvents.move, slideSelector, zoom.onGestureChange, activeListenerWithCapture);
swiper.$wrapperEl.on(swiper.touchEvents.end, slideSelector, zoom.onGestureEnd, passiveListener);
if (swiper.touchEvents.cancel) {
swiper.$wrapperEl.on(swiper.touchEvents.cancel, slideSelector, zoom.onGestureEnd, passiveListener);
}
}
// Move image
swiper.$wrapperEl.on(swiper.touchEvents.move, `.${swiper.params.zoom.containerClass}`, zoom.onTouchMove, activeListenerWithCapture);
},
disable() {
const swiper = this;
const zoom = swiper.zoom;
if (!zoom.enabled) return;
swiper.zoom.enabled = false;
const passiveListener = swiper.touchEvents.start === 'touchstart' && Support.passiveListener && swiper.params.passiveListeners ? { passive: true, capture: false } : false;
const activeListenerWithCapture = Support.passiveListener ? { passive: false, capture: true } : true;
const slideSelector = `.${swiper.params.slideClass}`;
// Scale image
if (Support.gestures) {
swiper.$wrapperEl.off('gesturestart', slideSelector, zoom.onGestureStart, passiveListener);
swiper.$wrapperEl.off('gesturechange', slideSelector, zoom.onGestureChange, passiveListener);
swiper.$wrapperEl.off('gestureend', slideSelector, zoom.onGestureEnd, passiveListener);
} else if (swiper.touchEvents.start === 'touchstart') {
swiper.$wrapperEl.off(swiper.touchEvents.start, slideSelector, zoom.onGestureStart, passiveListener);
swiper.$wrapperEl.off(swiper.touchEvents.move, slideSelector, zoom.onGestureChange, activeListenerWithCapture);
swiper.$wrapperEl.off(swiper.touchEvents.end, slideSelector, zoom.onGestureEnd, passiveListener);
if (swiper.touchEvents.cancel) {
swiper.$wrapperEl.off(swiper.touchEvents.cancel, slideSelector, zoom.onGestureEnd, passiveListener);
}
}
// Move image
swiper.$wrapperEl.off(swiper.touchEvents.move, `.${swiper.params.zoom.containerClass}`, zoom.onTouchMove, activeListenerWithCapture);
},
};
var zoom = {
name: 'zoom',
params: {
zoom: {
enabled: false,
maxRatio: 3,
minRatio: 1,
toggle: true,
containerClass: 'swiper-zoom-container',
zoomedSlideClass: 'swiper-slide-zoomed',
},
},
create() {
const swiper = this;
const zoom = {
enabled: false,
scale: 1,
currentScale: 1,
isScaling: false,
gesture: {
$slideEl: undefined,
slideWidth: undefined,
slideHeight: undefined,
$imageEl: undefined,
$imageWrapEl: undefined,
maxRatio: 3,
},
image: {
isTouched: undefined,
isMoved: undefined,
currentX: undefined,
currentY: undefined,
minX: undefined,
minY: undefined,
maxX: undefined,
maxY: undefined,
width: undefined,
height: undefined,
startX: undefined,
startY: undefined,
touchesStart: {},
touchesCurrent: {},
},
velocity: {
x: undefined,
y: undefined,
prevPositionX: undefined,
prevPositionY: undefined,
prevTime: undefined,
},
};
('onGestureStart onGestureChange onGestureEnd onTouchStart onTouchMove onTouchEnd onTransitionEnd toggle enable disable in out').split(' ').forEach((methodName) => {
zoom[methodName] = Zoom[methodName].bind(swiper);
});
Utils.extend(swiper, {
zoom,
});
let scale = 1;
Object.defineProperty(swiper.zoom, 'scale', {
get() {
return scale;
},
set(value) {
if (scale !== value) {
const imageEl = swiper.zoom.gesture.$imageEl ? swiper.zoom.gesture.$imageEl[0] : undefined;
const slideEl = swiper.zoom.gesture.$slideEl ? swiper.zoom.gesture.$slideEl[0] : undefined;
swiper.emit('zoomChange', value, imageEl, slideEl);
}
scale = value;
},
});
},
on: {
init() {
const swiper = this;
if (swiper.params.zoom.enabled) {
swiper.zoom.enable();
}
},
destroy() {
const swiper = this;
swiper.zoom.disable();
},
touchStart(e) {
const swiper = this;
if (!swiper.zoom.enabled) return;
swiper.zoom.onTouchStart(e);
},
touchEnd(e) {
const swiper = this;
if (!swiper.zoom.enabled) return;
swiper.zoom.onTouchEnd(e);
},
doubleTap(e) {
const swiper = this;
if (swiper.params.zoom.enabled && swiper.zoom.enabled && swiper.params.zoom.toggle) {
swiper.zoom.toggle(e);
}
},
transitionEnd() {
const swiper = this;
if (swiper.zoom.enabled && swiper.params.zoom.enabled) {
swiper.zoom.onTransitionEnd();
}
},
slideChange() {
const swiper = this;
if (swiper.zoom.enabled && swiper.params.zoom.enabled && swiper.params.cssMode) {
swiper.zoom.onTransitionEnd();
}
},
},
};
/* eslint no-underscore-dangle: "off" */
const Autoplay = {
run() {
const swiper = this;
const $activeSlideEl = swiper.slides.eq(swiper.activeIndex);
let delay = swiper.params.autoplay.delay;
if ($activeSlideEl.attr('data-swiper-autoplay')) {
delay = $activeSlideEl.attr('data-swiper-autoplay') || swiper.params.autoplay.delay;
}
clearTimeout(swiper.autoplay.timeout);
swiper.autoplay.timeout = Utils.nextTick(() => {
if (swiper.params.autoplay.reverseDirection) {
if (swiper.params.loop) {
swiper.loopFix();
swiper.slidePrev(swiper.params.speed, true, true);
swiper.emit('autoplay');
} else if (!swiper.isBeginning) {
swiper.slidePrev(swiper.params.speed, true, true);
swiper.emit('autoplay');
} else if (!swiper.params.autoplay.stopOnLastSlide) {
swiper.slideTo(swiper.slides.length - 1, swiper.params.speed, true, true);
swiper.emit('autoplay');
} else {
swiper.autoplay.stop();
}
} else if (swiper.params.loop) {
swiper.loopFix();
swiper.slideNext(swiper.params.speed, true, true);
swiper.emit('autoplay');
} else if (!swiper.isEnd) {
swiper.slideNext(swiper.params.speed, true, true);
swiper.emit('autoplay');
} else if (!swiper.params.autoplay.stopOnLastSlide) {
swiper.slideTo(0, swiper.params.speed, true, true);
swiper.emit('autoplay');
} else {
swiper.autoplay.stop();
}
if (swiper.params.cssMode && swiper.autoplay.running) swiper.autoplay.run();
}, delay);
},
start() {
const swiper = this;
if (typeof swiper.autoplay.timeout !== 'undefined') return false;
if (swiper.autoplay.running) return false;
swiper.autoplay.running = true;
swiper.emit('autoplayStart');
swiper.autoplay.run();
return true;
},
stop() {
const swiper = this;
if (!swiper.autoplay.running) return false;
if (typeof swiper.autoplay.timeout === 'undefined') return false;
if (swiper.autoplay.timeout) {
clearTimeout(swiper.autoplay.timeout);
swiper.autoplay.timeout = undefined;
}
swiper.autoplay.running = false;
swiper.emit('autoplayStop');
return true;
},
pause(speed) {
const swiper = this;
if (!swiper.autoplay.running) return;
if (swiper.autoplay.paused) return;
if (swiper.autoplay.timeout) clearTimeout(swiper.autoplay.timeout);
swiper.autoplay.paused = true;
if (speed === 0 || !swiper.params.autoplay.waitForTransition) {
swiper.autoplay.paused = false;
swiper.autoplay.run();
} else {
swiper.$wrapperEl[0].addEventListener('transitionend', swiper.autoplay.onTransitionEnd);
swiper.$wrapperEl[0].addEventListener('webkitTransitionEnd', swiper.autoplay.onTransitionEnd);
}
},
};
var autoplay = {
name: 'autoplay',
params: {
autoplay: {
enabled: false,
delay: 3000,
waitForTransition: true,
disableOnInteraction: true,
stopOnLastSlide: false,
reverseDirection: false,
},
},
create() {
const swiper = this;
Utils.extend(swiper, {
autoplay: {
running: false,
paused: false,
run: Autoplay.run.bind(swiper),
start: Autoplay.start.bind(swiper),
stop: Autoplay.stop.bind(swiper),
pause: Autoplay.pause.bind(swiper),
onVisibilityChange() {
if (document.visibilityState === 'hidden' && swiper.autoplay.running) {
swiper.autoplay.pause();
}
if (document.visibilityState === 'visible' && swiper.autoplay.paused) {
swiper.autoplay.run();
swiper.autoplay.paused = false;
}
},
onTransitionEnd(e) {
if (!swiper || swiper.destroyed || !swiper.$wrapperEl) return;
if (e.target !== this) return;
swiper.$wrapperEl[0].removeEventListener('transitionend', swiper.autoplay.onTransitionEnd);
swiper.$wrapperEl[0].removeEventListener('webkitTransitionEnd', swiper.autoplay.onTransitionEnd);
swiper.autoplay.paused = false;
if (!swiper.autoplay.running) {
swiper.autoplay.stop();
} else {
swiper.autoplay.run();
}
},
},
});
},
on: {
init() {
const swiper = this;
if (swiper.params.autoplay.enabled) {
swiper.autoplay.start();
document.addEventListener('visibilitychange', swiper.autoplay.onVisibilityChange);
}
},
beforeTransitionStart(speed, internal) {
const swiper = this;
if (swiper.autoplay.running) {
if (internal || !swiper.params.autoplay.disableOnInteraction) {
swiper.autoplay.pause(speed);
} else {
swiper.autoplay.stop();
}
}
},
sliderFirstMove() {
const swiper = this;
if (swiper.autoplay.running) {
if (swiper.params.autoplay.disableOnInteraction) {
swiper.autoplay.stop();
} else {
swiper.autoplay.pause();
}
}
},
touchEnd() {
const swiper = this;
if (swiper.params.cssMode && swiper.autoplay.paused && !swiper.params.autoplay.disableOnInteraction) {
swiper.autoplay.run();
}
},
destroy() {
const swiper = this;
if (swiper.autoplay.running) {
swiper.autoplay.stop();
}
document.removeEventListener('visibilitychange', swiper.autoplay.onVisibilityChange);
},
},
};
// Swiper Class
const components = [
Device$1,
Support$1,
Browser$1,
Resize,
Observer$1,
];
if (typeof Swiper.use === 'undefined') {
Swiper.use = Swiper.Class.use;
Swiper.installModule = Swiper.Class.installModule;
}
Swiper.use(components);
Swiper.use([pagination, scrollbar, autoplay, keyboard, zoom]);
var swiper_bundle = /*#__PURE__*/Object.freeze({
__proto__: null,
Swiper: Swiper
});
exports.hydrateApp = hydrateApp;
/*hydrateAppClosure end*/
hydrateApp(window, $stencilHydrateOpts, $stencilHydrateResults, $stencilAfterHydrate, $stencilHydrateResolve);
}
hydrateAppClosure($stencilWindow);
}
function createWindowFromHtml(e, t) {
let r = templateWindows.get(t);
return null == r && (r = new MockWindow(e), templateWindows.set(t, r)), cloneWindow(r);
}
function normalizeHydrateOptions(e) {
const t = Object.assign({
serializeToHtml: !1,
destroyWindow: !1,
destroyDocument: !1
}, e || {});
return "boolean" != typeof t.clientHydrateAnnotations && (t.clientHydrateAnnotations = !0),
"boolean" != typeof t.constrainTimeouts && (t.constrainTimeouts = !0), "number" != typeof t.maxHydrateCount && (t.maxHydrateCount = 300),
"boolean" != typeof t.runtimeLogging && (t.runtimeLogging = !1), "number" != typeof t.timeout && (t.timeout = 15e3),
Array.isArray(t.excludeComponents) ? t.excludeComponents = t.excludeComponents.filter(filterValidTags).map(mapValidTags) : t.excludeComponents = [],
Array.isArray(t.staticComponents) ? t.staticComponents = t.staticComponents.filter(filterValidTags).map(mapValidTags) : t.staticComponents = [],
t;
}
function filterValidTags(e) {
return "string" == typeof e && e.includes("-");
}
function mapValidTags(e) {
return e.trim().toLowerCase();
}
function generateHydrateResults(e) {
"string" != typeof e.url && (e.url = "https://hydrate.stenciljs.com/"), "string" != typeof e.buildId && (e.buildId = createHydrateBuildId());
const t = {
buildId: e.buildId,
diagnostics: [],
url: e.url,
host: null,
hostname: null,
href: null,
pathname: null,
port: null,
search: null,
hash: null,
html: null,
httpStatus: null,
hydratedCount: 0,
anchors: [],
components: [],
imgs: [],
scripts: [],
staticData: [],
styles: [],
title: null
};
try {
const r = new URL(e.url, "https://hydrate.stenciljs.com/");
t.url = r.href, t.host = r.host, t.hostname = r.hostname, t.href = r.href, t.port = r.port,
t.pathname = r.pathname, t.search = r.search, t.hash = r.hash;
} catch (e) {
renderCatchError(t, e);
}
return t;
}
function renderBuildDiagnostic(e, t, r, s) {
const n = {
level: t,
type: "build",
header: r,
messageText: s,
relFilePath: null,
absFilePath: null,
lines: []
};
return e.pathname ? "/" !== e.pathname && (n.header += ": " + e.pathname) : e.url && (n.header += ": " + e.url),
e.diagnostics.push(n), n;
}
function renderBuildError(e, t) {
return renderBuildDiagnostic(e, "error", "Hydrate Error", t);
}
function renderCatchError(e, t) {
const r = renderBuildError(e, null);
return null != t && (null != t.stack ? r.messageText = t.stack.toString() : null != t.message ? r.messageText = t.message.toString() : r.messageText = t.toString()),
r;
}
function runtimeLog(e, t, r) {
global.console[t].apply(global.console, [ `[ ${e} ${t} ] `, ...r ]);
}
function inspectElement(e, t, r) {
const s = t.children;
for (let t = 0, n = s.length; t < n; t++) {
const n = s[t], o = n.nodeName.toLowerCase();
if (o.includes("-")) {
const t = e.components.find((e => e.tag === o));
null != t && (t.count++, r > t.depth && (t.depth = r));
} else switch (o) {
case "a":
const t = collectAttributes(n);
t.href = n.href, "string" == typeof t.href && (e.anchors.some((e => e.href === t.href)) || e.anchors.push(t));
break;
case "img":
const r = collectAttributes(n);
r.src = n.src, "string" == typeof r.src && (e.imgs.some((e => e.src === r.src)) || e.imgs.push(r));
break;
case "link":
const s = collectAttributes(n);
s.href = n.href, "string" == typeof s.rel && "stylesheet" === s.rel.toLowerCase() && "string" == typeof s.href && (e.styles.some((e => e.link === s.href)) || (delete s.rel,
delete s.type, e.styles.push(s)));
break;
case "script":
const o = collectAttributes(n);
if (n.hasAttribute("src")) o.src = n.src, "string" == typeof o.src && (e.scripts.some((e => e.src === o.src)) || e.scripts.push(o)); else {
const t = n.getAttribute("data-stencil-static");
t && e.staticData.push({
id: t,
type: n.getAttribute("type"),
content: n.textContent
});
}
}
inspectElement(e, n, ++r);
}
}
function collectAttributes(e) {
const t = {}, r = e.attributes;
for (let e = 0, s = r.length; e < s; e++) {
const s = r.item(e), n = s.nodeName.toLowerCase();
if (SKIP_ATTRS.has(n)) continue;
const o = s.nodeValue;
"class" === n && "" === o || (t[n] = o);
}
return t;
}
function patchDomImplementation(e, t) {
let r;
if (null != e.defaultView ? (t.destroyWindow = !0, patchWindow(e.defaultView), r = e.defaultView) : (t.destroyWindow = !0,
t.destroyDocument = !1, r = new MockWindow(!1)), r.document !== e && (r.document = e),
e.defaultView !== r && (e.defaultView = r), "function" != typeof e.documentElement.constructor.prototype.getRootNode && (e.createElement("unknown-element").constructor.prototype.getRootNode = getRootNode),
"function" == typeof e.createEvent) {
const t = e.createEvent("CustomEvent").constructor;
r.CustomEvent !== t && (r.CustomEvent = t);
}
try {
e.baseURI;
} catch (t) {
Object.defineProperty(e, "baseURI", {
get() {
const t = e.querySelector("base[href]");
return t ? new URL(t.getAttribute("href"), r.location.href).href : r.location.href;
}
});
}
return r;
}
function getRootNode(e) {
const t = null != e && !0 === e.composed;
let r = this;
for (;null != r.parentNode; ) r = r.parentNode, !0 === t && null == r.parentNode && null != r.host && (r = r.host);
return r;
}
function renderToString(e, t) {
const r = normalizeHydrateOptions(t);
return r.serializeToHtml = !0, new Promise((t => {
let s;
const n = generateHydrateResults(r);
if (hasError(n.diagnostics)) t(n); else if ("string" == typeof e) try {
r.destroyWindow = !0, r.destroyDocument = !0, s = new MockWindow(e), render(s, r, n, t);
} catch (e) {
s && s.close && s.close(), s = null, renderCatchError(n, e), t(n);
} else if (isValidDocument(e)) try {
r.destroyDocument = !1, s = patchDomImplementation(e, r), render(s, r, n, t);
} catch (e) {
s && s.close && s.close(), s = null, renderCatchError(n, e), t(n);
} else renderBuildError(n, 'Invalid html or document. Must be either a valid "html" string, or DOM "document".'),
t(n);
}));
}
function hydrateDocument(e, t) {
const r = normalizeHydrateOptions(t);
return r.serializeToHtml = !1, new Promise((t => {
let s;
const n = generateHydrateResults(r);
if (hasError(n.diagnostics)) t(n); else if ("string" == typeof e) try {
r.destroyWindow = !0, r.destroyDocument = !0, s = new MockWindow(e), render(s, r, n, t);
} catch (e) {
s && s.close && s.close(), s = null, renderCatchError(n, e), t(n);
} else if (isValidDocument(e)) try {
r.destroyDocument = !1, s = patchDomImplementation(e, r), render(s, r, n, t);
} catch (e) {
s && s.close && s.close(), s = null, renderCatchError(n, e), t(n);
} else renderBuildError(n, 'Invalid html or document. Must be either a valid "html" string, or DOM "document".'),
t(n);
}));
}
function render(e, t, r, s) {
if (process.__stencilErrors || (process.__stencilErrors = !0, process.on("unhandledRejection", (e => {
console.log("unhandledRejection", e);
}))), function n(e, t, r, s) {
try {
e.location.href = r.url;
} catch (e) {
renderCatchError(s, e);
}
if ("string" == typeof r.userAgent) try {
e.navigator.userAgent = r.userAgent;
} catch (e) {}
if ("string" == typeof r.cookie) try {
t.cookie = r.cookie;
} catch (e) {}
if ("string" == typeof r.referrer) try {
t.referrer = r.referrer;
} catch (e) {}
if ("string" == typeof r.direction) try {
t.documentElement.setAttribute("dir", r.direction);
} catch (e) {}
if ("string" == typeof r.language) try {
t.documentElement.setAttribute("lang", r.language);
} catch (e) {}
if ("string" == typeof r.buildId) try {
t.documentElement.setAttribute("data-stencil-build", r.buildId);
} catch (e) {}
try {
e.customElements = null;
} catch (e) {}
return r.constrainTimeouts && constrainTimeouts(e), function n(e, t, r) {
try {
const s = e.location.pathname;
e.console.error = (...e) => {
const n = e.reduce(((e, t) => {
if (t) {
if (null != t.stack) return e + " " + String(t.stack);
if (null != t.message) return e + " " + String(t.message);
}
return String(t);
}), "").trim();
"" !== n && (renderCatchError(r, n), t.runtimeLogging && runtimeLog(s, "error", [ n ]));
}, e.console.debug = (...e) => {
renderBuildDiagnostic(r, "debug", "Hydrate Debug", [ ...e ].join(", ")), t.runtimeLogging && runtimeLog(s, "debug", e);
}, t.runtimeLogging && [ "log", "warn", "assert", "info", "trace" ].forEach((t => {
e.console[t] = (...e) => {
runtimeLog(s, t, e);
};
}));
} catch (e) {
renderCatchError(r, e);
}
}(e, r, s), e;
}(e, e.document, t, r), "function" == typeof t.beforeHydrate) try {
const n = t.beforeHydrate(e.document);
isPromise(n) ? n.then((() => {
hydrateFactory(e, t, r, afterHydrate, s);
})) : hydrateFactory(e, t, r, afterHydrate, s);
} catch (n) {
renderCatchError(r, n), finalizeHydrate(e, e.document, t, r, s);
} else hydrateFactory(e, t, r, afterHydrate, s);
}
function afterHydrate(e, t, r, s) {
if ("function" == typeof t.afterHydrate) try {
const n = t.afterHydrate(e.document);
isPromise(n) ? n.then((() => {
finalizeHydrate(e, e.document, t, r, s);
})) : finalizeHydrate(e, e.document, t, r, s);
} catch (n) {
renderCatchError(r, n), finalizeHydrate(e, e.document, t, r, s);
} else finalizeHydrate(e, e.document, t, r, s);
}
function finalizeHydrate(e, t, r, s, n) {
try {
if (inspectElement(s, t.documentElement, 0), !1 !== r.removeUnusedStyles) try {
((e, t) => {
try {
const r = e.head.querySelectorAll("style[data-styles]"), s = r.length;
if (s > 0) {
const n = (e => {
const t = {
attrs: new Set,
classNames: new Set,
ids: new Set,
tags: new Set
};
return collectUsedSelectors(t, e), t;
})(e.documentElement);
for (let e = 0; e < s; e++) removeUnusedStyleText(n, t, r[e]);
}
} catch (e) {
((e, t, r) => {
const s = {
level: "error",
type: "build",
header: "Build Error",
messageText: "build error",
relFilePath: null,
absFilePath: null,
lines: []
};
null != t && (null != t.stack ? s.messageText = t.stack.toString() : null != t.message ? s.messageText = t.message.toString() : s.messageText = t.toString()),
null == e || shouldIgnoreError(s.messageText) || e.push(s);
})(t, e);
}
})(t, s.diagnostics);
} catch (e) {
renderCatchError(s, e);
}
if ("string" == typeof r.title) try {
t.title = r.title;
} catch (e) {
renderCatchError(s, e);
}
s.title = t.title, r.removeScripts && removeScripts(t.documentElement);
try {
((e, t) => {
let r = e.head.querySelector('link[rel="canonical"]');
"string" == typeof t ? (null == r && (r = e.createElement("link"), r.setAttribute("rel", "canonical"),
e.head.appendChild(r)), r.setAttribute("href", t)) : null != r && (r.getAttribute("href") || r.parentNode.removeChild(r));
})(t, r.canonicalUrl);
} catch (e) {
renderCatchError(s, e);
}
try {
(e => {
const t = e.head;
let r = t.querySelector("meta[charset]");
null == r ? (r = e.createElement("meta"), r.setAttribute("charset", "utf-8")) : r.remove(),
t.insertBefore(r, t.firstChild);
})(t);
} catch (e) {}
hasError(s.diagnostics) || (s.httpStatus = 200);
try {
const e = t.head.querySelector('meta[http-equiv="status"]');
if (null != e) {
const t = e.getAttribute("content");
t && t.length > 0 && (s.httpStatus = parseInt(t, 10));
}
} catch (e) {}
r.clientHydrateAnnotations && t.documentElement.classList.add("hydrated"), r.serializeToHtml && (s.html = serializeDocumentToString(t, r));
} catch (e) {
renderCatchError(s, e);
}
if (r.destroyWindow) try {
r.destroyDocument || (e.document = null, t.defaultView = null), e.close && e.close();
} catch (e) {
renderCatchError(s, e);
}
n(s);
}
function serializeDocumentToString(e, t) {
return serializeNodeToHtml(e, {
approximateLineWidth: t.approximateLineWidth,
outerHtml: !1,
prettyHtml: t.prettyHtml,
removeAttributeQuotes: t.removeAttributeQuotes,
removeBooleanAttributeQuotes: t.removeBooleanAttributeQuotes,
removeEmptyAttributes: t.removeEmptyAttributes,
removeHtmlComments: t.removeHtmlComments,
serializeShadowRoot: !1
});
}
function isValidDocument(e) {
return null != e && 9 === e.nodeType && null != e.documentElement && 1 === e.documentElement.nodeType && null != e.body && 1 === e.body.nodeType;
}
function removeScripts(e) {
const t = e.children;
for (let e = t.length - 1; e >= 0; e--) {
const r = t[e];
removeScripts(r), ("SCRIPT" === r.nodeName || "LINK" === r.nodeName && "modulepreload" === r.getAttribute("rel")) && r.remove();
}
}
const templateWindows = new Map, createHydrateBuildId = () => {
let e = "abcdefghijklmnopqrstuvwxyz", t = "";
for (;t.length < 8; ) t += e[Math.floor(Math.random() * e.length)], 1 === t.length && (e += "0123456789");
return t;
}, isPromise = e => !!e && ("object" == typeof e || "function" == typeof e) && "function" == typeof e.then, hasError = e => null != e && 0 !== e.length && e.some((e => "error" === e.level && "runtime" !== e.type)), shouldIgnoreError = e => e === TASK_CANCELED_MSG, TASK_CANCELED_MSG = "task canceled", SKIP_ATTRS = new Set([ "s-id", "c-id" ]), collectUsedSelectors = (e, t) => {
if (null != t && 1 === t.nodeType) {
const r = t.children, s = t.nodeName.toLowerCase();
e.tags.add(s);
const n = t.attributes;
for (let r = 0, s = n.length; r < s; r++) {
const s = n.item(r), o = s.name.toLowerCase();
if (e.attrs.add(o), "class" === o) {
const r = t.classList;
for (let t = 0, s = r.length; t < s; t++) e.classNames.add(r.item(t));
} else "id" === o && e.ids.add(s.value);
}
if (r) for (let t = 0, s = r.length; t < s; t++) collectUsedSelectors(e, r[t]);
}
}, parseCss = (e, t) => {
let r = 1, s = 1;
const n = [], o = e => {
const t = e.match(/\n/g);
t && (r += t.length);
const n = e.lastIndexOf("\n");
s = ~n ? e.length - n : s + e.length;
}, i = () => {
const e = {
line: r,
column: s
};
return t => (t.position = new z(e), m(), t);
}, a = o => {
const i = e.split("\n"), a = {
level: "error",
type: "css",
language: "css",
header: "CSS Parse",
messageText: o,
absFilePath: t,
lines: [ {
lineIndex: r - 1,
lineNumber: r,
errorCharStart: s,
text: e[r - 1]
} ]
};
if (r > 1) {
const t = {
lineIndex: r - 1,
lineNumber: r - 1,
text: e[r - 2],
errorCharStart: -1,
errorLength: -1
};
a.lines.unshift(t);
}
if (r + 2 < i.length) {
const e = {
lineIndex: r,
lineNumber: r + 1,
text: i[r],
errorCharStart: -1,
errorLength: -1
};
a.lines.push(e);
}
return n.push(a), null;
}, l = () => u(/^{\s*/), c = () => u(/^}/), u = t => {
const r = t.exec(e);
if (!r) return;
const s = r[0];
return o(s), e = e.slice(s.length), r;
}, d = () => {
let t;
const r = [];
for (m(), h(r); e.length && "}" !== e.charAt(0) && (t = w() || A()); ) !1 !== t && (r.push(t),
h(r));
return r;
}, m = () => u(/^\s*/), h = e => {
let t;
for (e = e || []; t = p(); ) !1 !== t && e.push(t);
return e;
}, p = () => {
const t = i();
if ("/" !== e.charAt(0) || "*" !== e.charAt(1)) return null;
let r = 2;
for (;"" !== e.charAt(r) && ("*" !== e.charAt(r) || "/" !== e.charAt(r + 1)); ) ++r;
if (r += 2, "" === e.charAt(r - 1)) return a("End of comment missing");
const n = e.slice(2, r - 2);
return s += 2, o(n), e = e.slice(r), s += 2, t({
type: 1,
comment: n
});
}, f = () => {
const e = u(/^([^{]+)/);
return e ? trim(e[0]).replace(/\/\*([^*]|[\r\n]|(\*+([^*/]|[\r\n])))*\*\/+/g, "").replace(/"(?:\\"|[^"])*"|'(?:\\'|[^'])*'/g, (function(e) {
return e.replace(/,/g, "");
})).split(/\s*(?![^(]*\)),\s*/).map((function(e) {
return e.replace(/\u200C/g, ",");
})) : null;
}, g = () => {
const e = i();
let t = u(/^(\*?[-#\/\*\\\w]+(\[[0-9a-z_-]+\])?)\s*/);
if (!t) return null;
if (t = trim(t[0]), !u(/^:\s*/)) return a("property missing ':'");
const r = u(/^((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^\)]*?\)|[^};])+)/), s = e({
type: 4,
property: t.replace(commentre, ""),
value: r ? trim(r[0]).replace(commentre, "") : ""
});
return u(/^[;\s]*/), s;
}, y = () => {
const e = [];
if (!l()) return a("missing '{'");
let t;
for (h(e); t = g(); ) !1 !== t && (e.push(t), h(e));
return c() ? e : a("missing '}'");
}, C = () => {
let e;
const t = [], r = i();
for (;e = u(/^((\d+\.\d+|\.\d+|\d+)%?|[a-z]+)\s*/); ) t.push(e[1]), u(/^,\s*/);
return t.length ? r({
type: 9,
values: t,
declarations: y()
}) : null;
}, S = (e, t) => {
const r = new RegExp("^@" + e + "\\s*([^;]+);");
return () => {
const s = i(), n = u(r);
if (!n) return null;
const o = {
type: t
};
return o[e] = n[1].trim(), s(o);
};
}, E = S("import", 7), b = S("charset", 0), T = S("namespace", 11), w = () => "@" !== e[0] ? null : (() => {
const e = i();
let t = u(/^@([-\w]+)?keyframes\s*/);
if (!t) return null;
const r = t[1];
if (t = u(/^([-\w]+)\s*/), !t) return a("@keyframes missing name");
const s = t[1];
if (!l()) return a("@keyframes missing '{'");
let n, o = h();
for (;n = C(); ) o.push(n), o = o.concat(h());
return c() ? e({
type: 8,
name: s,
vendor: r,
keyframes: o
}) : a("@keyframes missing '}'");
})() || (() => {
const e = i(), t = u(/^@media *([^{]+)/);
if (!t) return null;
const r = trim(t[1]);
if (!l()) return a("@media missing '{'");
const s = h().concat(d());
return c() ? e({
type: 10,
media: r,
rules: s
}) : a("@media missing '}'");
})() || (() => {
const e = i(), t = u(/^@custom-media\s+(--[^\s]+)\s*([^{;]+);/);
return t ? e({
type: 2,
name: trim(t[1]),
media: trim(t[2])
}) : null;
})() || (() => {
const e = i(), t = u(/^@supports *([^{]+)/);
if (!t) return null;
const r = trim(t[1]);
if (!l()) return a("@supports missing '{'");
const s = h().concat(d());
return c() ? e({
type: 15,
supports: r,
rules: s
}) : a("@supports missing '}'");
})() || E() || b() || T() || (() => {
const e = i(), t = u(/^@([-\w]+)?document *([^{]+)/);
if (!t) return null;
const r = trim(t[1]), s = trim(t[2]);
if (!l()) return a("@document missing '{'");
const n = h().concat(d());
return c() ? e({
type: 3,
document: s,
vendor: r,
rules: n
}) : a("@document missing '}'");
})() || (() => {
const e = i();
if (!u(/^@page */)) return null;
const t = f() || [];
if (!l()) return a("@page missing '{'");
let r, s = h();
for (;r = g(); ) s.push(r), s = s.concat(h());
return c() ? e({
type: 12,
selectors: t,
declarations: s
}) : a("@page missing '}'");
})() || (() => {
const e = i();
if (!u(/^@host\s*/)) return null;
if (!l()) return a("@host missing '{'");
const t = h().concat(d());
return c() ? e({
type: 6,
rules: t
}) : a("@host missing '}'");
})() || (() => {
const e = i();
if (!u(/^@font-face\s*/)) return null;
if (!l()) return a("@font-face missing '{'");
let t, r = h();
for (;t = g(); ) r.push(t), r = r.concat(h());
return c() ? e({
type: 5,
declarations: r
}) : a("@font-face missing '}'");
})(), A = () => {
const e = i(), t = f();
return t ? (h(), e({
type: 13,
selectors: t,
declarations: y()
})) : a("selector missing");
};
class z {
constructor(e) {
this.start = e, this.end = {
line: r,
column: s
}, this.source = t;
}
}
return z.prototype.content = e, {
diagnostics: n,
...addParent((() => {
const e = d();
return {
type: 14,
stylesheet: {
source: t,
rules: e
}
};
})())
};
}, trim = e => e ? e.trim() : "", addParent = (e, t) => {
const r = e && "string" == typeof e.type, s = r ? e : t;
for (const t in e) {
const r = e[t];
Array.isArray(r) ? r.forEach((function(e) {
addParent(e, s);
})) : r && "object" == typeof r && addParent(r, s);
}
return r && Object.defineProperty(e, "parent", {
configurable: !0,
writable: !0,
enumerable: !1,
value: t || null
}), e;
}, commentre = /\/\*[^*]*\*+([^/*][^*]*\*+)*\//g, getCssSelectors = e => {
SELECTORS.all.length = SELECTORS.tags.length = SELECTORS.classNames.length = SELECTORS.ids.length = SELECTORS.attrs.length = 0;
const t = (e = e.replace(/\./g, " .").replace(/\#/g, " #").replace(/\[/g, " [").replace(/\>/g, " > ").replace(/\+/g, " + ").replace(/\~/g, " ~ ").replace(/\*/g, " * ").replace(/\:not\((.*?)\)/g, " ")).split(" ");
for (let e = 0, r = t.length; e < r; e++) t[e] = t[e].split(":")[0], 0 !== t[e].length && ("." === t[e].charAt(0) ? SELECTORS.classNames.push(t[e].substr(1)) : "#" === t[e].charAt(0) ? SELECTORS.ids.push(t[e].substr(1)) : "[" === t[e].charAt(0) ? (t[e] = t[e].substr(1).split("=")[0].split("]")[0].trim(),
SELECTORS.attrs.push(t[e].toLowerCase())) : /[a-z]/g.test(t[e].charAt(0)) && SELECTORS.tags.push(t[e].toLowerCase()));
return SELECTORS.classNames = SELECTORS.classNames.sort(((e, t) => e.length < t.length ? -1 : e.length > t.length ? 1 : 0)),
SELECTORS;
}, SELECTORS = {
all: [],
tags: [],
classNames: [],
ids: [],
attrs: []
}, serializeCssVisitNode = (e, t, r, s) => {
const n = t.type;
return 4 === n ? serializeCssDeclaration(t, r, s) : 13 === n ? serializeCssRule(e, t) : 1 === n ? "!" === t.comment[0] ? `/*${t.comment}*/` : "" : 10 === n ? serializeCssMedia(e, t) : 8 === n ? serializeCssKeyframes(e, t) : 9 === n ? serializeCssKeyframe(e, t) : 5 === n ? serializeCssFontFace(e, t) : 15 === n ? serializeCssSupports(e, t) : 7 === n ? "@import " + t.import + ";" : 0 === n ? "@charset " + t.charset + ";" : 12 === n ? serializeCssPage(e, t) : 6 === n ? "@host{" + serializeCssMapVisit(e, t.rules) + "}" : 2 === n ? "@custom-media " + t.name + " " + t.media + ";" : 3 === n ? serializeCssDocument(e, t) : 11 === n ? "@namespace " + t.namespace + ";" : "";
}, serializeCssRule = (e, t) => {
const r = t.declarations, s = e.usedSelectors, n = t.selectors.slice();
if (null == r || 0 === r.length) return "";
if (s) {
let t, r, o = !0;
for (t = n.length - 1; t >= 0; t--) {
const i = getCssSelectors(n[t]);
o = !0;
let a = i.classNames.length;
if (a > 0 && e.hasUsedClassNames) for (r = 0; r < a; r++) if (!s.classNames.has(i.classNames[r])) {
o = !1;
break;
}
if (o && e.hasUsedTags && (a = i.tags.length, a > 0)) for (r = 0; r < a; r++) if (!s.tags.has(i.tags[r])) {
o = !1;
break;
}
if (o && e.hasUsedAttrs && (a = i.attrs.length, a > 0)) for (r = 0; r < a; r++) if (!s.attrs.has(i.attrs[r])) {
o = !1;
break;
}
if (o && e.hasUsedIds && (a = i.ids.length, a > 0)) for (r = 0; r < a; r++) if (!s.ids.has(i.ids[r])) {
o = !1;
break;
}
o || n.splice(t, 1);
}
}
if (0 === n.length) return "";
const o = [];
let i = "";
for (const e of t.selectors) i = removeSelectorWhitespace(e), o.includes(i) || o.push(i);
return `${o}{${serializeCssMapVisit(e, r)}}`;
}, serializeCssDeclaration = (e, t, r) => "" === e.value ? "" : r - 1 === t ? e.property + ":" + e.value : e.property + ":" + e.value + ";", serializeCssMedia = (e, t) => {
const r = serializeCssMapVisit(e, t.rules);
return "" === r ? "" : "@media " + removeMediaWhitespace(t.media) + "{" + r + "}";
}, serializeCssKeyframes = (e, t) => {
const r = serializeCssMapVisit(e, t.keyframes);
return "" === r ? "" : "@" + (t.vendor || "") + "keyframes " + t.name + "{" + r + "}";
}, serializeCssKeyframe = (e, t) => t.values.join(",") + "{" + serializeCssMapVisit(e, t.declarations) + "}", serializeCssFontFace = (e, t) => {
const r = serializeCssMapVisit(e, t.declarations);
return "" === r ? "" : "@font-face{" + r + "}";
}, serializeCssSupports = (e, t) => {
const r = serializeCssMapVisit(e, t.rules);
return "" === r ? "" : "@supports " + t.supports + "{" + r + "}";
}, serializeCssPage = (e, t) => "@page " + t.selectors.join(", ") + "{" + serializeCssMapVisit(e, t.declarations) + "}", serializeCssDocument = (e, t) => {
const r = serializeCssMapVisit(e, t.rules), s = "@" + (t.vendor || "") + "document " + t.document;
return "" === r ? "" : s + "{" + r + "}";
}, serializeCssMapVisit = (e, t) => {
let r = "";
if (t) for (let s = 0, n = t.length; s < n; s++) r += serializeCssVisitNode(e, t[s], s, n);
return r;
}, removeSelectorWhitespace = e => {
let t = "", r = "", s = !1;
for (let n = 0, o = (e = e.trim()).length; n < o; n++) if (r = e[n], "[" === r && "\\" !== t[t.length - 1] ? s = !0 : "]" === r && "\\" !== t[t.length - 1] && (s = !1),
!s && CSS_WS_REG.test(r)) {
if (CSS_NEXT_CHAR_REG.test(e[n + 1])) continue;
if (CSS_PREV_CHAR_REG.test(t[t.length - 1])) continue;
t += " ";
} else t += r;
return t;
}, removeMediaWhitespace = e => {
let t = "", r = "";
for (let s = 0, n = (e = e.trim()).length; s < n; s++) if (r = e[s], CSS_WS_REG.test(r)) {
if (CSS_WS_REG.test(t[t.length - 1])) continue;
t += " ";
} else t += r;
return t;
}, CSS_WS_REG = /\s/, CSS_NEXT_CHAR_REG = /[>\(\)\~\,\+\s]/, CSS_PREV_CHAR_REG = /[>\(\~\,\+]/, removeUnusedStyleText = (e, t, r) => {
try {
const s = parseCss(r.innerHTML);
if (t.push(...s.diagnostics), hasError(t)) return;
try {
r.innerHTML = ((e, t) => {
const r = t.usedSelectors || null, s = {
usedSelectors: r || null,
hasUsedAttrs: !!r && r.attrs.size > 0,
hasUsedClassNames: !!r && r.classNames.size > 0,
hasUsedIds: !!r && r.ids.size > 0,
hasUsedTags: !!r && r.tags.size > 0
}, n = e.rules;
if (!n) return "";
const o = n.length, i = [];
for (let e = 0; e < o; e++) i.push(serializeCssVisitNode(s, n[e], e, o));
return i.join("");
})(s.stylesheet, {
usedSelectors: e
});
} catch (e) {
t.push({
level: "warn",
type: "css",
header: "CSS Stringify",
messageText: e
});
}
} catch (e) {
t.push({
level: "warn",
type: "css",
header: "CSS Parse",
messageText: e
});
}
};
exports.createWindowFromHtml = createWindowFromHtml;
exports.hydrateDocument = hydrateDocument;
exports.renderToString = renderToString;
exports.serializeDocumentToString = serializeDocumentToString;