@ionic/core 8.8.9-nightly.20260528 → 8.8.9-nightly.20260529

package/components/ion-router.js

@@ -1,4 +1,4 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{j as t,p as n,H as o,e,f as r,t as s}from"./p-BJoMtgfR.js";import{c as i,p as a}from"./p-DgbT0exM.js";const c="root",u="forward",h=t=>"/"+t.filter((t=>t.length>0)).join("/"),l=t=>{let n,o=[""];if(null!=t){const e=t.indexOf("?");e>-1&&(n=t.substring(e+1),t=t.substring(0,e)),o=t.split("/").map((t=>t.trim())).filter((t=>t.length>0)),0===o.length&&(o=[""])}return{segments:o,queryString:n}},f=async(n,o,e,r,s=!1,a)=>{try{const t=w(n);if(r>=o.length||!t)return s;await new Promise((n=>i(t,n)));const u=o[r],h=await t.setRouteId(u.id,u.params,e,a);return h.changed&&(e=c,s=!0),s=await f(h.element,o,e,r+1,s,a),h.markVisible&&await h.markVisible(),s}catch(n){return t("[ion-router] - Exception in writeNavState:",n),!1}},d=":not([no-router]) ion-nav, :not([no-router]) ion-tabs, :not([no-router]) ion-router-outlet",w=t=>{if(!t)return;if(t.matches(d))return t;const n=t.querySelector(d);return null!=n?n:void 0},m=(t,n)=>n.find((n=>((t,n)=>{const{from:o,to:e}=n;if(void 0===e)return!1;if(o.length>t.length)return!1;for(let n=0;n<o.length;n++){const e=o[n];if("*"===e)return!0;if(e!==t[n])return!1}return o.length===t.length})(t,n))),p=(t,n)=>{const o=Math.min(t.length,n.length);let e=0;for(let r=0;r<o;r++){const o=t[r],s=n[r];if(o.id.toLowerCase()!==s.id)break;if(o.params){const t=Object.keys(o.params);if(t.length===s.segments.length){const n=t.map((t=>":"+t));for(let t=0;t<n.length&&n[t].toLowerCase()===s.segments[t];t++)e++}}e++}return e},g=(t,n)=>{const o=new R(t);let e,r=!1;for(let t=0;t<n.length;t++){const s=n[t].segments;if(""===s[0])r=!0;else{for(const n of s){const r=o.next();if(":"===n[0]){if(""===r)return null;e=e||[],(e[t]||(e[t]={}))[n.slice(1)]=r}else if(r!==n)return null}r=!1}}return r&&r!==(""===o.next())?null:e?n.map(((t,n)=>({id:t.id,segments:t.segments,params:v(t.params,e[n]),beforeEnter:t.beforeEnter,beforeLeave:t.beforeLeave}))):n},v=(t,n)=>t||n?Object.assign(Object.assign({},t),n):void 0,b=(t,n)=>{let o=null,e=0;for(const r of n){const n=g(t,r);if(null!==n){const t=y(n);t>e&&(e=t,o=n)}}return o},y=t=>{let n=1,o=1;for(const e of t)for(const t of e.segments)":"===t[0]?n+=Math.pow(1,o):""!==t&&(n+=Math.pow(2,o)),o++;return n};class R{constructor(t){this.segments=t.slice()}next(){return this.segments.length>0?this.segments.shift():""}}const E=(t,n)=>n in t?t[n]:t.hasAttribute(n)?t.getAttribute(n):null,S=t=>Array.from(t.children).filter((t=>"ION-ROUTE-REDIRECT"===t.tagName)).map((t=>{const n=E(t,"to");return{from:l(E(t,"from")).segments,to:null==n?void 0:l(n)}})),C=t=>O(j(t)),j=t=>Array.from(t.children).filter((t=>"ION-ROUTE"===t.tagName&&t.component)).map((t=>{const n=E(t,"component");return{segments:l(E(t,"url")).segments,id:n.toLowerCase(),params:t.componentProps,beforeLeave:t.beforeLeave,beforeEnter:t.beforeEnter,children:j(t)}})),O=t=>{const n=[];for(const o of t)T([],n,o);return n},T=(t,n,o)=>{if(t=[...t,{id:o.id,segments:o.segments,params:o.params,beforeLeave:o.beforeLeave,beforeEnter:o.beforeEnter}],0!==o.children.length)for(const e of o.children)T(t,n,e);else n.push(t)},k=n(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.ionRouteWillChange=e(this,"ionRouteWillChange",7),this.ionRouteDidChange=e(this,"ionRouteDidChange",7),this.previousPath=null,this.busy=!1,this.state=0,this.lastState=0,this.root="/",this.useHash=!0}async componentWillLoad(){await(w(document.body)?Promise.resolve():new Promise((t=>{window.addEventListener("ionNavWillLoad",(()=>t()),{once:!0})})));const t=await this.runGuards(this.getSegments());if(!0!==t){if("object"==typeof t){const{redirect:n}=t,o=l(n);this.setSegments(o.segments,c,o.queryString),await this.writeNavStateRoot(o.segments,c)}}else await this.onRoutesChanged()}componentDidLoad(){window.addEventListener("ionRouteRedirectChanged",a(this.onRedirectChanged.bind(this),10)),window.addEventListener("ionRouteDataChanged",a(this.onRoutesChanged.bind(this),100))}async onPopState(){const t=this.historyDirection();let n=this.getSegments();const o=await this.runGuards(n);if(!0!==o){if("object"!=typeof o)return!1;n=l(o.redirect).segments}return this.writeNavStateRoot(n,t)}onBackButton(t){t.detail.register(0,(t=>{this.back(),t()}))}async canTransition(){const t=await this.runGuards();return!0===t||"object"==typeof t&&t.redirect}async push(t,n="forward",o){var e;if(t.startsWith(".")){const n=null!==(e=this.previousPath)&&void 0!==e?e:"/",o=new URL(t,"https://host/"+n);t=o.pathname+o.search}let r=l(t);const s=await this.runGuards(r.segments);if(!0!==s){if("object"!=typeof s)return!1;r=l(s.redirect)}return this.setSegments(r.segments,n,r.queryString),this.writeNavStateRoot(r.segments,n,o)}back(){return window.history.back(),Promise.resolve(this.waitPromise)}async printDebug(){(t=>{console.group(`[ion-core] ROUTES[${t.length}]`);for(const n of t){const t=[];n.forEach((n=>t.push(...n.segments)));const o=n.map((t=>t.id));console.debug("%c "+h(t),"font-weight: bold; padding-left: 20px","=>\t",`(${o.join(", ")})`)}console.groupEnd()})(C(this.el)),(t=>{console.group(`[ion-core] REDIRECTS[${t.length}]`);for(const n of t)n.to&&console.debug("FROM: ","$c "+h(n.from),"font-weight: bold"," TO: ","$c "+h(n.to.segments),"font-weight: bold");console.groupEnd()})(S(this.el))}async navChanged(t){if(this.busy)return r("[ion-router] - Router is busy, navChanged was cancelled."),!1;const{ids:n,outlet:o}=await(async()=>{const t=[];let n,o=window.document.body;for(;n=w(o);){const e=await n.getRouteId();if(!e)break;o=e.element,e.element=void 0,t.push(e)}return{ids:t,outlet:n}})(),e=((t,n)=>{let o=null,e=0;for(const r of n){const n=p(t,r);n>e&&(o=r,e=n)}return o?o.map(((n,o)=>{var e;return{id:n.id,segments:n.segments,params:v(n.params,null===(e=t[o])||void 0===e?void 0:e.params)}})):null})(n,C(this.el));if(!e)return r("[ion-router] - No matching URL for",n.map((t=>t.id))),!1;const s=(t=>{const n=[];for(const o of t)for(const t of o.segments)if(":"===t[0]){const e=o.params&&o.params[t.slice(1)];if(!e)return null;n.push(e)}else""!==t&&n.push(t);return n})(e);return s?(this.setSegments(s,t),await this.safeWriteNavState(o,e,c,s,null,n.length),!0):(r("[ion-router] - Router could not match path because some required param is missing."),!1)}onRedirectChanged(){const t=this.getSegments();t&&m(t,S(this.el))&&this.writeNavStateRoot(t,c)}onRoutesChanged(){return this.writeNavStateRoot(this.getSegments(),c)}historyDirection(){var t;const n=window;null===n.history.state&&(this.state++,n.history.replaceState(this.state,n.document.title,null===(t=n.document.location)||void 0===t?void 0:t.href));const o=n.history.state,e=this.lastState;return this.lastState=o,o>e||o>=e&&e>0?u:o<e?"back":c}async writeNavStateRoot(n,o,e){if(!n)return t("[ion-router] - URL is not part of the routing set."),!1;const r=S(this.el),s=m(n,r);let i=null;if(s){const{segments:t,queryString:e}=s.to;this.setSegments(t,o,e),i=s.from,n=t}const a=C(this.el),c=b(n,a);return c?this.safeWriteNavState(document.body,c,o,n,i,0,e):(t("[ion-router] - The path does not match any route."),!1)}async safeWriteNavState(n,o,e,r,s,i=0,a){const c=await this.lock();let u=!1;try{u=await this.writeNavState(n,o,e,r,s,i,a)}catch(n){t("[ion-router] - Exception in safeWriteNavState:",n)}return c(),u}async lock(){const t=this.waitPromise;let n;return this.waitPromise=new Promise((t=>n=t)),void 0!==t&&await t,n}async runGuards(t=this.getSegments(),n){if(void 0===n&&(n=l(this.previousPath).segments),!t||!n)return!0;const o=C(this.el),e=b(n,o),r=e&&e[e.length-1].beforeLeave,s=!r||await r();if(!1===s||"object"==typeof s)return s;const i=b(t,o),a=i&&i[i.length-1].beforeEnter;return!a||a()}async writeNavState(t,n,o,e,s,i=0,a){if(this.busy)return r("[ion-router] - Router is busy, transition was cancelled."),!1;this.busy=!0;const c=this.routeChangeEvent(e,s);c&&this.ionRouteWillChange.emit(c);const u=await f(t,n,o,i,!1,a);return this.busy=!1,c&&this.ionRouteDidChange.emit(c),u}setSegments(t,n,o){this.state++,((t,n,o,e,r,s,i)=>{const a=((t,n,o)=>{let e=h(t);return n&&(e="#"+e),void 0!==o&&(e+="?"+o),e})([...l(n).segments,...e],o,i);r===u?t.pushState(s,"",a):t.replaceState(s,"",a)})(window.history,this.root,this.useHash,t,n,this.state,o)}getSegments(){return((t,n,o)=>{const e=l(this.root).segments,r=o?t.hash.slice(1):t.pathname;return((t,n)=>{if(t.length>n.length)return null;if(t.length<=1&&""===t[0])return n;for(let o=0;o<t.length;o++)if(t[o]!==n[o])return null;return n.length===t.length?[""]:n.slice(t.length)})(e,l(r).segments)})(window.location,0,this.useHash)}routeChangeEvent(t,n){const o=this.previousPath,e=h(t);return this.previousPath=e,e===o?null:{from:o,redirectedFrom:n?h(n):null,to:e}}get el(){return this}},[0,"ion-router",{root:[1],useHash:[4,"use-hash"],canTransition:[64],push:[64],back:[64],printDebug:[64],navChanged:[64]},[[8,"popstate","onPopState"],[4,"ionBackButton","onBackButton"]]]),D=k,L=function(){"undefined"!=typeof customElements&&["ion-router"].forEach((t=>{"ion-router"===t&&(customElements.get(s(t))||customElements.define(s(t),k))}))};export{D as IonRouter,L as defineCustomElement}
+import{j as t,p as n,H as o,e,f as r,t as i}from"./p-BJoMtgfR.js";import{c as s,r as a,p as c}from"./p-DgbT0exM.js";import{a as u,i as l,g as h}from"./p-C59ryAuS.js";const f="root",d="forward",w=t=>"/"+t.filter((t=>t.length>0)).join("/"),m=t=>{let n,o,e=[""];if(null!=t){const r=t.indexOf("#");r>-1&&(o=t.substring(r+1),t=t.substring(0,r));const i=t.indexOf("?");i>-1&&(n=t.substring(i+1),t=t.substring(0,i)),e=t.split("/").map((t=>t.trim())).filter((t=>t.length>0)),0===e.length&&(e=[""])}return{segments:e,queryString:n,fragment:o}},p=async(n,o,e,r,i=!1,a)=>{try{const t=b(n);if(r>=o.length||!t)return i;await new Promise((n=>s(t,n)));const c=o[r],u=await t.setRouteId(c.id,c.params,e,a);return u.changed&&(e=f,i=!0),i=await p(u.element,o,e,r+1,i,a),u.markVisible&&await u.markVisible(),i}catch(n){return t("[ion-router] - Exception in writeNavState:",n),!1}},g=()=>new Promise((t=>a((()=>t())))),y=t=>{const n=t.closest(".ion-page");return null===n?null===document.querySelector(".ion-page"):null===n.closest(".ion-page-hidden, .tab-hidden")},v=":not([no-router]) ion-nav, :not([no-router]) ion-tabs, :not([no-router]) ion-router-outlet",b=t=>{if(!t)return;if(t.matches(v))return t;const n=t.querySelector(v);return null!=n?n:void 0},R=(t,n)=>n.find((n=>((t,n)=>{const{from:o,to:e}=n;if(void 0===e)return!1;if(o.length>t.length)return!1;for(let n=0;n<o.length;n++){const e=o[n];if("*"===e)return!0;if(e!==t[n])return!1}return o.length===t.length})(t,n))),S=(t,n)=>{const o=Math.min(t.length,n.length);let e=0;for(let r=0;r<o;r++){const o=t[r],i=n[r];if(o.id.toLowerCase()!==i.id)break;if(o.params){const t=Object.keys(o.params);if(t.length===i.segments.length){const n=t.map((t=>":"+t));for(let t=0;t<n.length&&n[t].toLowerCase()===i.segments[t];t++)e++}}e++}return e},C=(t,n)=>{const o=new O(t);let e,r=!1;for(let t=0;t<n.length;t++){const i=n[t].segments;if(""===i[0])r=!0;else{for(const n of i){const r=o.next();if(":"===n[0]){if(""===r)return null;e=e||[],(e[t]||(e[t]={}))[n.slice(1)]=r}else if(r!==n)return null}r=!1}}return r&&r!==(""===o.next())?null:e?n.map(((t,n)=>({id:t.id,segments:t.segments,params:E(t.params,e[n]),beforeEnter:t.beforeEnter,beforeLeave:t.beforeLeave}))):n},E=(t,n)=>t||n?Object.assign(Object.assign({},t),n):void 0,j=(t,n)=>{let o=null,e=0;for(const r of n){const n=C(t,r);if(null!==n){const t=T(n);t>e&&(e=t,o=n)}}return o},T=t=>{let n=1,o=1;for(const e of t)for(const t of e.segments)":"===t[0]?n+=Math.pow(1,o):""!==t&&(n+=Math.pow(2,o)),o++;return n};class O{constructor(t){this.segments=t.slice()}next(){return this.segments.length>0?this.segments.shift():""}}const k=(t,n)=>n in t?t[n]:t.hasAttribute(n)?t.getAttribute(n):null,D=t=>Array.from(t.children).filter((t=>"ION-ROUTE-REDIRECT"===t.tagName)).map((t=>{const n=k(t,"to");return{from:m(k(t,"from")).segments,to:null==n?void 0:m(n)}})),L=t=>x(N(t)),N=t=>Array.from(t.children).filter((t=>"ION-ROUTE"===t.tagName&&t.component)).map((t=>{const n=k(t,"component");return{segments:m(k(t,"url")).segments,id:n.toLowerCase(),params:t.componentProps,beforeLeave:t.beforeLeave,beforeEnter:t.beforeEnter,children:N(t)}})),x=t=>{const n=[];for(const o of t)P([],n,o);return n},P=(t,n,o)=>{if(t=[...t,{id:o.id,segments:o.segments,params:o.params,beforeLeave:o.beforeLeave,beforeEnter:o.beforeEnter}],0!==o.children.length)for(const e of o.children)P(t,n,e);else n.push(t)},B=n(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.ionRouteWillChange=e(this,"ionRouteWillChange",7),this.ionRouteDidChange=e(this,"ionRouteDidChange",7),this.previousPath=null,this.busy=!1,this.state=0,this.lastState=0,this.fragmentScrollToken=0,this.root="/",this.useHash=!0}async componentWillLoad(){await(b(document.body)?Promise.resolve():new Promise((t=>{window.addEventListener("ionNavWillLoad",(()=>t()),{once:!0})})));const t=await this.runGuards(this.getSegments());if(!0===t)await this.onRoutesChanged()&&this.maybeScrollToFragment();else if("object"==typeof t){const{redirect:n}=t,o=m(n);this.setSegments(o.segments,f,o.queryString,o.fragment),await this.writeNavStateRoot(o.segments,f)&&this.maybeScrollToFragment()}}componentDidLoad(){window.addEventListener("ionRouteRedirectChanged",c(this.onRedirectChanged.bind(this),10)),window.addEventListener("ionRouteDataChanged",c(this.onRoutesChanged.bind(this),100))}async onPopState(){const t=this.historyDirection();let n=this.getSegments();const o=await this.runGuards(n);if(!0!==o){if("object"!=typeof o)return!1;n=m(o.redirect).segments}const e=await this.writeNavStateRoot(n,t);return e&&this.maybeScrollToFragment(),e}onBackButton(t){t.detail.register(0,(t=>{this.back(),t()}))}async canTransition(){const t=await this.runGuards();return!0===t||"object"==typeof t&&t.redirect}async push(t,n="forward",o){var e;if(t.startsWith(".")){const n=null!==(e=this.previousPath)&&void 0!==e?e:"/",o=new URL(t,"https://host/"+n);t=o.pathname+o.search+o.hash}let r=m(t);const i=await this.runGuards(r.segments);if(!0!==i){if("object"!=typeof i)return!1;r=m(i.redirect)}this.setSegments(r.segments,n,r.queryString,r.fragment);const s=await this.writeNavStateRoot(r.segments,n,o);return s&&this.maybeScrollToFragment(),s}back(){return window.history.back(),Promise.resolve(this.waitPromise)}async printDebug(){(t=>{console.group(`[ion-core] ROUTES[${t.length}]`);for(const n of t){const t=[];n.forEach((n=>t.push(...n.segments)));const o=n.map((t=>t.id));console.debug("%c "+w(t),"font-weight: bold; padding-left: 20px","=>\t",`(${o.join(", ")})`)}console.groupEnd()})(L(this.el)),(t=>{console.group(`[ion-core] REDIRECTS[${t.length}]`);for(const n of t)n.to&&console.debug("FROM: ","$c "+w(n.from),"font-weight: bold"," TO: ","$c "+w(n.to.segments),"font-weight: bold");console.groupEnd()})(D(this.el))}async navChanged(t){if(this.busy)return r("[ion-router] - Router is busy, navChanged was cancelled."),!1;const{ids:n,outlet:o}=await(async()=>{const t=[];let n,o=window.document.body;for(;n=b(o);){const e=await n.getRouteId();if(!e)break;o=e.element,e.element=void 0,t.push(e)}return{ids:t,outlet:n}})(),e=((t,n)=>{let o=null,e=0;for(const r of n){const n=S(t,r);n>e&&(o=r,e=n)}return o?o.map(((n,o)=>{var e;return{id:n.id,segments:n.segments,params:E(n.params,null===(e=t[o])||void 0===e?void 0:e.params)}})):null})(n,L(this.el));if(!e)return r("[ion-router] - No matching URL for",n.map((t=>t.id))),!1;const i=(t=>{const n=[];for(const o of t)for(const t of o.segments)if(":"===t[0]){const e=o.params&&o.params[t.slice(1)];if(!e)return null;n.push(e)}else""!==t&&n.push(t);return n})(e);if(!i)return r("[ion-router] - Router could not match path because some required param is missing."),!1;const s=w(i)===this.previousPath?this.getFragment():void 0;return this.setSegments(i,t,void 0,s),await this.safeWriteNavState(o,e,f,i,null,n.length),!0}onRedirectChanged(){const t=this.getSegments();t&&R(t,D(this.el))&&this.writeNavStateRoot(t,f)}onRoutesChanged(){return this.writeNavStateRoot(this.getSegments(),f)}historyDirection(){var t;const n=window;null===n.history.state&&(this.state++,n.history.replaceState(this.state,n.document.title,null===(t=n.document.location)||void 0===t?void 0:t.href));const o=n.history.state,e=this.lastState;return this.lastState=o,o>e||o>=e&&e>0?d:o<e?"back":f}async writeNavStateRoot(n,o,e){if(!n)return t("[ion-router] - URL is not part of the routing set."),!1;const r=D(this.el),i=R(n,r);let s=null;if(i){const{segments:t,queryString:e,fragment:r}=i.to;this.setSegments(t,o,e,r),s=i.from,n=t}const a=L(this.el),c=j(n,a);return c?this.safeWriteNavState(document.body,c,o,n,s,0,e):(t("[ion-router] - The path does not match any route."),!1)}async safeWriteNavState(n,o,e,r,i,s=0,a){const c=await this.lock();let u=!1;try{u=await this.writeNavState(n,o,e,r,i,s,a)}catch(n){t("[ion-router] - Exception in safeWriteNavState:",n)}return c(),u}async lock(){const t=this.waitPromise;let n;return this.waitPromise=new Promise((t=>n=t)),void 0!==t&&await t,n}async runGuards(t=this.getSegments(),n){if(void 0===n&&(n=m(this.previousPath).segments),!t||!n)return!0;const o=L(this.el),e=j(n,o),r=e&&e[e.length-1].beforeLeave,i=!r||await r();if(!1===i||"object"==typeof i)return i;const s=j(t,o),a=s&&s[s.length-1].beforeEnter;return!a||a()}async writeNavState(t,n,o,e,i,s=0,a){if(this.busy)return r("[ion-router] - Router is busy, transition was cancelled."),!1;this.busy=!0;const c=this.routeChangeEvent(e,i);c&&this.ionRouteWillChange.emit(c);const u=await p(t,n,o,s,!1,a);return this.busy=!1,c&&this.ionRouteDidChange.emit(c),u}setSegments(t,n,o,e){this.state++,this.fragmentScrollToken++,((t,n,o,e,r,i,s,a)=>{const c=((t,n,o,e)=>{let r=w(t);return n&&(r="#"+r),void 0!==o&&(r+="?"+o),void 0!==e&&(r+="#"+e),r})([...m(n).segments,...e],o,s,a);r===d?t.pushState(i,"",c):t.replaceState(i,"",c)})(window.history,this.root,this.useHash,t,n,this.state,o,e)}getSegments(){return((t,n,o)=>{const e=m(this.root).segments,r=o?t.hash.slice(1):t.pathname;return((t,n)=>{if(t.length>n.length)return null;if(t.length<=1&&""===t[0])return n;for(let o=0;o<t.length;o++)if(t[o]!==n[o])return null;return n.length===t.length?[""]:n.slice(t.length)})(e,m(r).segments)})(window.location,0,this.useHash)}getFragment(){return(this.useHash?m(window.location.hash.slice(1)).fragment:window.location.hash.slice(1))||void 0}maybeScrollToFragment(){const n=this.getFragment();if(!n)return;const o=this.fragmentScrollToken;(async(n,o=()=>!0)=>{if(null==n||""===n)return!1;let e;try{e=decodeURIComponent(n)}catch(t){e=n}const r=await(async(t,n)=>{const o="undefined"!=typeof CSS&&"function"==typeof CSS.escape?CSS.escape(t):null;for(let e=0;e<30;e++){if(!n())return null;let e=[];if(null!==o)try{e=[...document.querySelectorAll(`#${o}, a[name="${o}"]`)]}catch(t){e=[...document.querySelectorAll("#"+o)]}else{const n=document.getElementById(t);null!==n&&(e=[n])}for(let t=e.length-1;t>=0;t--)if(y(e[t]))return e[t];await g()}return null})(e,o);if(!r||!o())return!1;try{const t=u(r);if(t&&l(t)){const n=t,e=await h(n);if(await g(),!o())return!1;const i=r.getBoundingClientRect(),s=e.getBoundingClientRect(),a=i.top-s.top+e.scrollTop;await n.scrollToPoint(e.scrollLeft,a,300)}else r.scrollIntoView({behavior:"smooth"});return!0}catch(n){return t("[ion-router] - Exception in scrollToFragment:",n),!1}})(n,(()=>o===this.fragmentScrollToken)).catch((()=>{}))}routeChangeEvent(t,n){const o=this.previousPath,e=w(t);return this.previousPath=e,e===o?null:{from:o,redirectedFrom:n?w(n):null,to:e}}get el(){return this}},[0,"ion-router",{root:[1],useHash:[4,"use-hash"],canTransition:[64],push:[64],back:[64],printDebug:[64],navChanged:[64]},[[8,"popstate","onPopState"],[4,"ionBackButton","onBackButton"]]]),U=B,$=function(){"undefined"!=typeof customElements&&["ion-router"].forEach((t=>{"ion-router"===t&&(customElements.get(i(t))||customElements.define(i(t),B))}))};export{U as IonRouter,$ as defineCustomElement}

package/dist/cjs/ion-route_4.cjs.entry.js

@@ -5,6 +5,7 @@
 
 var index = require('./index-CqT-2gKy.js');
 var helpers = require('./helpers-CxTYJdbT.js');
+var index$1 = require('./index-MbaBbWXk.js');
 var theme = require('./theme-CeDs6Hcv.js');
 var ionicGlobal = require('./ionic-global-Bc3kJi1Z.js');
 
@@ -86,7 +87,7 @@ const generatePath = (segments) => {
     const path = segments.filter((s) => s.length > 0).join('/');
     return '/' + path;
 };
-const generateUrl = (segments, useHash, queryString) => {
+const generateUrl = (segments, useHash, queryString, fragment) => {
     let url = generatePath(segments);
     if (useHash) {
         url = '#' + url;
@@ -94,10 +95,13 @@ const generateUrl = (segments, useHash, queryString) => {
     if (queryString !== undefined) {
         url += '?' + queryString;
     }
+    if (fragment !== undefined) {
+        url += '#' + fragment;
+    }
     return url;
 };
-const writeSegments = (history, root, useHash, segments, direction, state, queryString) => {
-    const url = generateUrl([...parsePath(root).segments, ...segments], useHash, queryString);
+const writeSegments = (history, root, useHash, segments, direction, state, queryString, fragment) => {
+    const url = generateUrl([...parsePath(root).segments, ...segments], useHash, queryString, fragment);
     if (direction === ROUTER_INTENT_FORWARD) {
         history.pushState(state, '', url);
     }
@@ -164,12 +168,21 @@ const readSegments = (loc, root, useHash) => {
 /**
  * Parses the path to:
  * - segments an array of '/' separated parts,
- * - queryString (undefined when no query string).
+ * - queryString (undefined when no query string),
+ * - fragment (undefined when no `#`).
  */
 const parsePath = (path) => {
     let segments = [''];
     let queryString;
+    let fragment;
     if (path != null) {
+        // The fragment ("#") starts a section that runs to the end of the URL.
+        // Anything inside it (including "?") is part of the fragment per RFC 3986.
+        const fragStart = path.indexOf('#');
+        if (fragStart > -1) {
+            fragment = path.substring(fragStart + 1);
+            path = path.substring(0, fragStart);
+        }
         const qsStart = path.indexOf('?');
         if (qsStart > -1) {
             queryString = path.substring(qsStart + 1);
@@ -183,7 +196,7 @@ const parsePath = (path) => {
             segments = [''];
         }
     }
-    return { segments, queryString };
+    return { segments, queryString, fragment };
 };
 
 const printRoutes = (routes) => {
@@ -268,6 +281,118 @@ const readNavState = async (root) => {
     }
     return { ids, outlet };
 };
+/** Max animation frames `scrollToFragment` polls while waiting for the target to mount. */
+const FRAGMENT_POLL_FRAMES = 30;
+/** Duration (ms) of the smooth-scroll animation that lands on the fragment target. */
+const FRAGMENT_SCROLL_DURATION = 300;
+const nextFrame = () => new Promise((resolve) => helpers.raf(() => resolve()));
+/**
+ * Returns true when `el` lives inside an active `.ion-page`. `ion-page-hidden`
+ * marks nav back-stack entries; `tab-hidden` marks inactive `ion-tab` elements.
+ * Either class on the page's ancestor chain disqualifies it. When no `.ion-page`
+ * exists in the document at all (non-router pages), the candidate is accepted
+ * so plain anchors still work.
+ */
+const isInActivePage = (el) => {
+    const page = el.closest('.ion-page');
+    if (page === null) {
+        return document.querySelector('.ion-page') === null;
+    }
+    return page.closest('.ion-page-hidden, .tab-hidden') === null;
+};
+/**
+ * Polls across animation frames for an element matching `fragment` that lives
+ * in the active page. Scoping by "last `.ion-page:not(.ion-page-hidden)`" is
+ * unreliable: inactive `ion-tab` siblings carry `.ion-page` (gated by
+ * `.tab-hidden`, not `.ion-page-hidden`) and can be ordered after the leaf.
+ * Instead, locate candidates globally and walk them from last to first,
+ * accepting the deepest one whose `.ion-page` ancestor is not hidden. The
+ * last-to-first order preserves leaf-most preference for nested outlets.
+ */
+const findFragmentTarget = async (fragment, shouldContinue) => {
+    // CSS.escape is unavailable on very old WebViews; the fallback path uses
+    // `getElementById` and drops the legacy `<a name>` branch.
+    const canEscape = typeof CSS !== 'undefined' && typeof CSS.escape === 'function';
+    const escaped = canEscape ? CSS.escape(fragment) : null;
+    for (let i = 0; i < FRAGMENT_POLL_FRAMES; i++) {
+        if (!shouldContinue())
+            return null;
+        let candidates = [];
+        if (escaped !== null) {
+            try {
+                candidates = [...document.querySelectorAll(`#${escaped}, a[name="${escaped}"]`)];
+            }
+            catch (_a) {
+                candidates = [...document.querySelectorAll(`#${escaped}`)];
+            }
+        }
+        else {
+            const byId = document.getElementById(fragment);
+            if (byId !== null)
+                candidates = [byId];
+        }
+        for (let j = candidates.length - 1; j >= 0; j--) {
+            if (isInActivePage(candidates[j])) {
+                return candidates[j];
+            }
+        }
+        await nextFrame();
+    }
+    return null;
+};
+/**
+ * Scrolls to the element whose id matches `fragment`, falling back to a legacy
+ * `<a name="...">` target. When the target lives inside an `ion-content`, the
+ * scroll uses its smooth-animated scroll API; otherwise it falls back to
+ * `Element.scrollIntoView`.
+ *
+ * `shouldContinue` lets callers cancel in-flight scrolls when a newer
+ * navigation supersedes this one. It is checked between async steps.
+ */
+const scrollToFragment = async (fragment, shouldContinue = () => true) => {
+    if (fragment == null || fragment === '') {
+        return false;
+    }
+    // URL fragments are percent-encoded but element ids are not; decode for
+    // matching per the HTML spec's indicated-element resolution.
+    let decoded;
+    try {
+        decoded = decodeURIComponent(fragment);
+    }
+    catch (_a) {
+        decoded = fragment;
+    }
+    const target = await findFragmentTarget(decoded, shouldContinue);
+    if (!target || !shouldContinue()) {
+        return false;
+    }
+    // Best-effort scroll: swallow exceptions if the page tears down mid-animation.
+    try {
+        const contentHost = index$1.findClosestIonContent(target);
+        if (contentHost && index$1.isIonContent(contentHost)) {
+            const content = contentHost;
+            const scrollEl = await index$1.getScrollElement(content);
+            // Yield one frame so the newly mounted target's layout is stable
+            // before we measure its rect.
+            await nextFrame();
+            if (!shouldContinue())
+                return false;
+            const targetRect = target.getBoundingClientRect();
+            const scrollRect = scrollEl.getBoundingClientRect();
+            const top = targetRect.top - scrollRect.top + scrollEl.scrollTop;
+            // Preserve scrollLeft so RTL and horizontally-scrolling pages aren't reset.
+            await content.scrollToPoint(scrollEl.scrollLeft, top, FRAGMENT_SCROLL_DURATION);
+        }
+        else {
+            target.scrollIntoView({ behavior: 'smooth' });
+        }
+        return true;
+    }
+    catch (e) {
+        index.printIonError('[ion-router] - Exception in scrollToFragment:', e);
+        return false;
+    }
+};
 const waitUntilNavNode = () => {
     if (searchNavNode(document.body)) {
         return Promise.resolve();
@@ -609,6 +734,7 @@ const Router = class {
         this.busy = false;
         this.state = 0;
         this.lastState = 0;
+        this.fragmentScrollToken = 0;
         /**
          * The root path to use when matching URLs. By default, this is set to "/", but you can specify
          * an alternate prefix for all URL paths.
@@ -637,12 +763,17 @@ const Router = class {
             if (typeof canProceed === 'object') {
                 const { redirect } = canProceed;
                 const path = parsePath(redirect);
-                this.setSegments(path.segments, ROUTER_INTENT_NONE, path.queryString);
-                await this.writeNavStateRoot(path.segments, ROUTER_INTENT_NONE);
+                this.setSegments(path.segments, ROUTER_INTENT_NONE, path.queryString, path.fragment);
+                const result = await this.writeNavStateRoot(path.segments, ROUTER_INTENT_NONE);
+                if (result) {
+                    this.maybeScrollToFragment();
+                }
             }
+            return;
         }
-        else {
-            await this.onRoutesChanged();
+        const result = await this.onRoutesChanged();
+        if (result) {
+            this.maybeScrollToFragment();
         }
     }
     componentDidLoad() {
@@ -661,7 +792,11 @@ const Router = class {
                 return false;
             }
         }
-        return this.writeNavStateRoot(segments, direction);
+        const result = await this.writeNavStateRoot(segments, direction);
+        if (result) {
+            this.maybeScrollToFragment();
+        }
+        return result;
     }
     onBackButton(ev) {
         ev.detail.register(0, (processNextHandler) => {
@@ -695,7 +830,7 @@ const Router = class {
             const currentPath = (_a = this.previousPath) !== null && _a !== void 0 ? _a : '/';
             // Convert currentPath to an URL by pre-pending a protocol and a host to resolve the relative path.
             const url = new URL(path, `https://host/${currentPath}`);
-            path = url.pathname + url.search;
+            path = url.pathname + url.search + url.hash;
         }
         let parsedPath = parsePath(path);
         const canProceed = await this.runGuards(parsedPath.segments);
@@ -707,8 +842,12 @@ const Router = class {
                 return false;
             }
         }
-        this.setSegments(parsedPath.segments, direction, parsedPath.queryString);
-        return this.writeNavStateRoot(parsedPath.segments, direction, animation);
+        this.setSegments(parsedPath.segments, direction, parsedPath.queryString, parsedPath.fragment);
+        const result = await this.writeNavStateRoot(parsedPath.segments, direction, animation);
+        if (result) {
+            this.maybeScrollToFragment();
+        }
+        return result;
     }
     /** Go back to previous page in the window.history. */
     back() {
@@ -738,7 +877,12 @@ const Router = class {
             index.printIonWarning('[ion-router] - Router could not match path because some required param is missing.');
             return false;
         }
-        this.setSegments(segments, direction);
+        // navChanged is an outlet-driven URL sync. Only keep the fragment when
+        // the path is unchanged; on a real navigation it refers to an anchor on
+        // the page being left and would be stale.
+        const newPath = generatePath(segments);
+        const fragment = newPath === this.previousPath ? this.getFragment() : undefined;
+        this.setSegments(segments, direction, undefined, fragment);
         await this.safeWriteNavState(outlet, chain, ROUTER_INTENT_NONE, segments, null, ids.length);
         return true;
     }
@@ -781,8 +925,8 @@ const Router = class {
         const redirect = findRouteRedirect(segments, redirects);
         let redirectFrom = null;
         if (redirect) {
-            const { segments: toSegments, queryString } = redirect.to;
-            this.setSegments(toSegments, direction, queryString);
+            const { segments: toSegments, queryString, fragment } = redirect.to;
+            this.setSegments(toSegments, direction, queryString, fragment);
             redirectFrom = redirect.from;
             segments = toSegments;
         }
@@ -862,13 +1006,35 @@ const Router = class {
         }
         return changed;
     }
-    setSegments(segments, direction, queryString) {
+    setSegments(segments, direction, queryString, fragment) {
         this.state++;
-        writeSegments(window.history, this.root, this.useHash, segments, direction, this.state, queryString);
+        // Every URL write invalidates any in-flight fragment scroll: a newer nav
+        // (with or without a fragment, successful or not) should always supersede.
+        this.fragmentScrollToken++;
+        writeSegments(window.history, this.root, this.useHash, segments, direction, this.state, queryString, fragment);
     }
     getSegments() {
         return readSegments(window.location, this.root, this.useHash);
     }
+    getFragment() {
+        // In hash mode the URL fragment trails a second `#` (e.g. `#/path#anchor`);
+        // parse the routing portion to extract it.
+        const raw = this.useHash ? parsePath(window.location.hash.slice(1)).fragment : window.location.hash.slice(1);
+        return raw ? raw : undefined;
+    }
+    /**
+     * Fires a best-effort scroll to the current URL fragment. The scroll bails
+     * if a newer `setSegments` advances `fragmentScrollToken` mid-flight.
+     */
+    maybeScrollToFragment() {
+        const fragment = this.getFragment();
+        if (!fragment)
+            return;
+        const token = this.fragmentScrollToken;
+        // Fire-and-forget; the returned promise resolves only after the scroll
+        // animation completes, which the caller does not need to await.
+        scrollToFragment(fragment, () => token === this.fragmentScrollToken).catch(() => { });
+    }
     routeChangeEvent(toSegments, redirectFromSegments) {
         const from = this.previousPath;
         const to = generatePath(toSegments);

package/dist/collection/components/router/router.js

@@ -2,7 +2,7 @@ import { debounce } from "../../utils/helpers";
 import { printIonError, printIonWarning } from "../../utils/logging/index";
 import { ROUTER_INTENT_BACK, ROUTER_INTENT_FORWARD, ROUTER_INTENT_NONE } from "./utils/constants";
 import { printRedirects, printRoutes } from "./utils/debug";
-import { readNavState, waitUntilNavNode, writeNavState } from "./utils/dom";
+import { readNavState, scrollToFragment, waitUntilNavNode, writeNavState } from "./utils/dom";
 import { findChainForIDs, findChainForSegments, findRouteRedirect } from "./utils/matching";
 import { readRedirects, readRoutes } from "./utils/parser";
 import { chainToSegments, generatePath, parsePath, readSegments, writeSegments } from "./utils/path";
@@ -12,6 +12,7 @@ export class Router {
         this.busy = false;
         this.state = 0;
         this.lastState = 0;
+        this.fragmentScrollToken = 0;
         /**
          * The root path to use when matching URLs. By default, this is set to "/", but you can specify
          * an alternate prefix for all URL paths.
@@ -40,12 +41,17 @@ export class Router {
             if (typeof canProceed === 'object') {
                 const { redirect } = canProceed;
                 const path = parsePath(redirect);
-                this.setSegments(path.segments, ROUTER_INTENT_NONE, path.queryString);
-                await this.writeNavStateRoot(path.segments, ROUTER_INTENT_NONE);
+                this.setSegments(path.segments, ROUTER_INTENT_NONE, path.queryString, path.fragment);
+                const result = await this.writeNavStateRoot(path.segments, ROUTER_INTENT_NONE);
+                if (result) {
+                    this.maybeScrollToFragment();
+                }
             }
+            return;
         }
-        else {
-            await this.onRoutesChanged();
+        const result = await this.onRoutesChanged();
+        if (result) {
+            this.maybeScrollToFragment();
         }
     }
     componentDidLoad() {
@@ -64,7 +70,11 @@ export class Router {
                 return false;
             }
         }
-        return this.writeNavStateRoot(segments, direction);
+        const result = await this.writeNavStateRoot(segments, direction);
+        if (result) {
+            this.maybeScrollToFragment();
+        }
+        return result;
     }
     onBackButton(ev) {
         ev.detail.register(0, (processNextHandler) => {
@@ -98,7 +108,7 @@ export class Router {
             const currentPath = (_a = this.previousPath) !== null && _a !== void 0 ? _a : '/';
             // Convert currentPath to an URL by pre-pending a protocol and a host to resolve the relative path.
             const url = new URL(path, `https://host/${currentPath}`);
-            path = url.pathname + url.search;
+            path = url.pathname + url.search + url.hash;
         }
         let parsedPath = parsePath(path);
         const canProceed = await this.runGuards(parsedPath.segments);
@@ -110,8 +120,12 @@ export class Router {
                 return false;
             }
         }
-        this.setSegments(parsedPath.segments, direction, parsedPath.queryString);
-        return this.writeNavStateRoot(parsedPath.segments, direction, animation);
+        this.setSegments(parsedPath.segments, direction, parsedPath.queryString, parsedPath.fragment);
+        const result = await this.writeNavStateRoot(parsedPath.segments, direction, animation);
+        if (result) {
+            this.maybeScrollToFragment();
+        }
+        return result;
     }
     /** Go back to previous page in the window.history. */
     back() {
@@ -141,7 +155,12 @@ export class Router {
             printIonWarning('[ion-router] - Router could not match path because some required param is missing.');
             return false;
         }
-        this.setSegments(segments, direction);
+        // navChanged is an outlet-driven URL sync. Only keep the fragment when
+        // the path is unchanged; on a real navigation it refers to an anchor on
+        // the page being left and would be stale.
+        const newPath = generatePath(segments);
+        const fragment = newPath === this.previousPath ? this.getFragment() : undefined;
+        this.setSegments(segments, direction, undefined, fragment);
         await this.safeWriteNavState(outlet, chain, ROUTER_INTENT_NONE, segments, null, ids.length);
         return true;
     }
@@ -184,8 +203,8 @@ export class Router {
         const redirect = findRouteRedirect(segments, redirects);
         let redirectFrom = null;
         if (redirect) {
-            const { segments: toSegments, queryString } = redirect.to;
-            this.setSegments(toSegments, direction, queryString);
+            const { segments: toSegments, queryString, fragment } = redirect.to;
+            this.setSegments(toSegments, direction, queryString, fragment);
             redirectFrom = redirect.from;
             segments = toSegments;
         }
@@ -265,13 +284,35 @@ export class Router {
         }
         return changed;
     }
-    setSegments(segments, direction, queryString) {
+    setSegments(segments, direction, queryString, fragment) {
         this.state++;
-        writeSegments(window.history, this.root, this.useHash, segments, direction, this.state, queryString);
+        // Every URL write invalidates any in-flight fragment scroll: a newer nav
+        // (with or without a fragment, successful or not) should always supersede.
+        this.fragmentScrollToken++;
+        writeSegments(window.history, this.root, this.useHash, segments, direction, this.state, queryString, fragment);
     }
     getSegments() {
         return readSegments(window.location, this.root, this.useHash);
     }
+    getFragment() {
+        // In hash mode the URL fragment trails a second `#` (e.g. `#/path#anchor`);
+        // parse the routing portion to extract it.
+        const raw = this.useHash ? parsePath(window.location.hash.slice(1)).fragment : window.location.hash.slice(1);
+        return raw ? raw : undefined;
+    }
+    /**
+     * Fires a best-effort scroll to the current URL fragment. The scroll bails
+     * if a newer `setSegments` advances `fragmentScrollToken` mid-flight.
+     */
+    maybeScrollToFragment() {
+        const fragment = this.getFragment();
+        if (!fragment)
+            return;
+        const token = this.fragmentScrollToken;
+        // Fire-and-forget; the returned promise resolves only after the scroll
+        // animation completes, which the caller does not need to await.
+        scrollToFragment(fragment, () => token === this.fragmentScrollToken).catch(() => { });
+    }
     routeChangeEvent(toSegments, redirectFromSegments) {
         const from = this.previousPath;
         const to = generatePath(toSegments);

package/dist/collection/components/router/utils/dom.js

@@ -1,7 +1,8 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import { componentOnReady } from "../../../utils/helpers";
+import { findClosestIonContent, getScrollElement, isIonContent } from "../../../utils/content/index";
+import { componentOnReady, raf } from "../../../utils/helpers";
 import { printIonError } from "../../../utils/logging/index";
 import { ROUTER_INTENT_NONE } from "./constants";
 /**
@@ -66,6 +67,118 @@ export const readNavState = async (root) => {
     }
     return { ids, outlet };
 };
+/** Max animation frames `scrollToFragment` polls while waiting for the target to mount. */
+const FRAGMENT_POLL_FRAMES = 30;
+/** Duration (ms) of the smooth-scroll animation that lands on the fragment target. */
+const FRAGMENT_SCROLL_DURATION = 300;
+const nextFrame = () => new Promise((resolve) => raf(() => resolve()));
+/**
+ * Returns true when `el` lives inside an active `.ion-page`. `ion-page-hidden`
+ * marks nav back-stack entries; `tab-hidden` marks inactive `ion-tab` elements.
+ * Either class on the page's ancestor chain disqualifies it. When no `.ion-page`
+ * exists in the document at all (non-router pages), the candidate is accepted
+ * so plain anchors still work.
+ */
+const isInActivePage = (el) => {
+    const page = el.closest('.ion-page');
+    if (page === null) {
+        return document.querySelector('.ion-page') === null;
+    }
+    return page.closest('.ion-page-hidden, .tab-hidden') === null;
+};
+/**
+ * Polls across animation frames for an element matching `fragment` that lives
+ * in the active page. Scoping by "last `.ion-page:not(.ion-page-hidden)`" is
+ * unreliable: inactive `ion-tab` siblings carry `.ion-page` (gated by
+ * `.tab-hidden`, not `.ion-page-hidden`) and can be ordered after the leaf.
+ * Instead, locate candidates globally and walk them from last to first,
+ * accepting the deepest one whose `.ion-page` ancestor is not hidden. The
+ * last-to-first order preserves leaf-most preference for nested outlets.
+ */
+const findFragmentTarget = async (fragment, shouldContinue) => {
+    // CSS.escape is unavailable on very old WebViews; the fallback path uses
+    // `getElementById` and drops the legacy `<a name>` branch.
+    const canEscape = typeof CSS !== 'undefined' && typeof CSS.escape === 'function';
+    const escaped = canEscape ? CSS.escape(fragment) : null;
+    for (let i = 0; i < FRAGMENT_POLL_FRAMES; i++) {
+        if (!shouldContinue())
+            return null;
+        let candidates = [];
+        if (escaped !== null) {
+            try {
+                candidates = [...document.querySelectorAll(`#${escaped}, a[name="${escaped}"]`)];
+            }
+            catch (_a) {
+                candidates = [...document.querySelectorAll(`#${escaped}`)];
+            }
+        }
+        else {
+            const byId = document.getElementById(fragment);
+            if (byId !== null)
+                candidates = [byId];
+        }
+        for (let j = candidates.length - 1; j >= 0; j--) {
+            if (isInActivePage(candidates[j])) {
+                return candidates[j];
+            }
+        }
+        await nextFrame();
+    }
+    return null;
+};
+/**
+ * Scrolls to the element whose id matches `fragment`, falling back to a legacy
+ * `<a name="...">` target. When the target lives inside an `ion-content`, the
+ * scroll uses its smooth-animated scroll API; otherwise it falls back to
+ * `Element.scrollIntoView`.
+ *
+ * `shouldContinue` lets callers cancel in-flight scrolls when a newer
+ * navigation supersedes this one. It is checked between async steps.
+ */
+export const scrollToFragment = async (fragment, shouldContinue = () => true) => {
+    if (fragment == null || fragment === '') {
+        return false;
+    }
+    // URL fragments are percent-encoded but element ids are not; decode for
+    // matching per the HTML spec's indicated-element resolution.
+    let decoded;
+    try {
+        decoded = decodeURIComponent(fragment);
+    }
+    catch (_a) {
+        decoded = fragment;
+    }
+    const target = await findFragmentTarget(decoded, shouldContinue);
+    if (!target || !shouldContinue()) {
+        return false;
+    }
+    // Best-effort scroll: swallow exceptions if the page tears down mid-animation.
+    try {
+        const contentHost = findClosestIonContent(target);
+        if (contentHost && isIonContent(contentHost)) {
+            const content = contentHost;
+            const scrollEl = await getScrollElement(content);
+            // Yield one frame so the newly mounted target's layout is stable
+            // before we measure its rect.
+            await nextFrame();
+            if (!shouldContinue())
+                return false;
+            const targetRect = target.getBoundingClientRect();
+            const scrollRect = scrollEl.getBoundingClientRect();
+            const top = targetRect.top - scrollRect.top + scrollEl.scrollTop;
+            // Preserve scrollLeft so RTL and horizontally-scrolling pages aren't reset.
+            await content.scrollToPoint(scrollEl.scrollLeft, top, FRAGMENT_SCROLL_DURATION);
+        }
+        else {
+            target.scrollIntoView({ behavior: 'smooth' });
+        }
+        return true;
+    }
+    catch (e) {
+        printIonError('[ion-router] - Exception in scrollToFragment:', e);
+        return false;
+    }
+};
 export const waitUntilNavNode = () => {
     if (searchNavNode(document.body)) {
         return Promise.resolve();