@ionic/core 8.8.19-dev.11786610762.137bbb21 → 8.8.19-dev.11786735826.1fad7c0a

package/dist/cjs/{capacitor-BixsAzyb.js → capacitor-DmA66EwP.js}

@@ -3,11 +3,11 @@
  */
 'use strict';
 
-var ionicGlobal = require('./ionic-global-DvEcO0tQ.js');
+var index = require('./index-DkNv4J_i.js');
 
 const getCapacitor = () => {
-    if (ionicGlobal.win !== undefined) {
-        return ionicGlobal.win.Capacitor;
+    if (index.win !== undefined) {
+        return index.win.Capacitor;
     }
     return undefined;
 };

package/dist/cjs/{config-DWdFbSNK.js → config-CjUbvdPW.js}

@@ -6,18 +6,19 @@
 const setupConfig = (config) => {
     const win = window;
     const Ionic = win.Ionic;
-    // eslint-disable-next-line @typescript-eslint/prefer-optional-chain
     if (Ionic && Ionic.config && Ionic.config.constructor.name !== 'Object') {
         return;
     }
     win.Ionic = win.Ionic || {};
-    win.Ionic.config = Object.assign(Object.assign({}, win.Ionic.config), config);
+    win.Ionic.config = {
+        ...win.Ionic.config,
+        ...config,
+    };
     return win.Ionic.config;
 };
 const getMode = () => {
-    var _a;
     const win = window;
-    const config = (_a = win === null || win === void 0 ? void 0 : win.Ionic) === null || _a === void 0 ? void 0 : _a.config;
+    const config = win?.Ionic?.config;
     if (config) {
         if (config.mode) {
             return config.mode;

package/dist/cjs/{dir-Cn0z1rJH.js → dir-Brx7VkvP.js}

@@ -14,7 +14,7 @@ const isRTL = (hostEl) => {
             return hostEl.dir.toLowerCase() === 'rtl';
         }
     }
-    return (document === null || document === void 0 ? void 0 : document.dir.toLowerCase()) === 'rtl';
+    return document?.dir.toLowerCase() === 'rtl';
 };
 
 exports.isRTL = isRTL;

package/dist/{esm/focus-visible-vXpMhGrs.js → cjs/focus-visible-CCvKiLh3.js}

@@ -1,6 +1,8 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
+'use strict';
+
 const ION_FOCUSED = 'ion-focused';
 const ION_FOCUSABLE = 'ion-focusable';
 const FOCUS_KEYS = [
@@ -17,28 +19,6 @@ const FOCUS_KEYS = [
     'Home',
     'End',
 ];
-let focusVisibleUtility = null;
-const getOrInitFocusVisibleUtility = () => {
-    if (!focusVisibleUtility) {
-        focusVisibleUtility = startFocusVisible();
-    }
-    return focusVisibleUtility;
-};
-/**
- * Used to set focus on an element that uses `ion-focusable`.
- * Do not use this if focusing the element as a result of a keyboard
- * event as the focus utility should handle this for us. This method
- * should be used when we want to programmatically focus an element as
- * a result of another user action. (Ex: We focus the first element
- * inside of a popover when the user presents it, but the popover is not always
- * presented as a result of keyboard action.)
- *
- * @param elements - The elements to set focus on.
- */
-const focusElements = (elements) => {
-    const focusVisible = getOrInitFocusVisibleUtility();
-    focusVisible.setFocus(elements);
-};
 const startFocusVisible = (rootEl) => {
     let currentFocus = [];
     let keyboardMode = true;
@@ -94,4 +74,4 @@ const startFocusVisible = (rootEl) => {
     };
 };
 
-export { focusElements, getOrInitFocusVisibleUtility, startFocusVisible };
+exports.startFocusVisible = startFocusVisible;

package/dist/cjs/{format-COAsdjOc.js → format-pp0Du3K-.js}

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-C1knGA9x.js');
+var index = require('./index-uvry__L4.js');
 
 /**
  * Returns true if the selected day is equal to the reference day
@@ -313,19 +313,19 @@ const parseMaxParts = (max, todayParts) => {
      * so that the correct initial value can be selected. As a result,
      * we need to fill in any omitted data with the min or max values.
      */
-    const yearValue = year !== null && year !== void 0 ? year : todayParts.year;
-    const monthValue = month !== null && month !== void 0 ? month : 12;
+    const yearValue = year ?? todayParts.year;
+    const monthValue = month ?? 12;
     return {
         month: monthValue,
-        day: day !== null && day !== void 0 ? day : getNumDaysInMonth(monthValue, yearValue),
+        day: day ?? getNumDaysInMonth(monthValue, yearValue),
         /**
          * Passing in "HH:mm" is a valid ISO-8601
          * string, so we just default to the current year
          * in this case.
          */
         year: yearValue,
-        hour: hour !== null && hour !== void 0 ? hour : 23,
-        minute: minute !== null && minute !== void 0 ? minute : 59,
+        hour: hour ?? 23,
+        minute: minute ?? 59,
     };
 };
 /**
@@ -354,16 +354,16 @@ const parseMinParts = (min, todayParts) => {
      * we need to fill in any omitted data with the min or max values.
      */
     return {
-        month: month !== null && month !== void 0 ? month : 1,
-        day: day !== null && day !== void 0 ? day : 1,
+        month: month ?? 1,
+        day: day ?? 1,
         /**
          * Passing in "HH:mm" is a valid ISO-8601
          * string, so we just default to the current year
          * in this case.
          */
-        year: year !== null && year !== void 0 ? year : todayParts.year,
-        hour: hour !== null && hour !== void 0 ? hour : 0,
-        minute: minute !== null && minute !== void 0 ? minute : 0,
+        year: year ?? todayParts.year,
+        hour: hour ?? 0,
+        minute: minute ?? 0,
     };
 };
 
@@ -645,7 +645,7 @@ const calculateHourFromAMPM = (currentParts, newAMPM) => {
  */
 const validateParts = (parts, minParts, maxParts) => {
     const { month, day, year } = parts;
-    const partsCopy = clampDate(Object.assign({}, parts), minParts, maxParts);
+    const partsCopy = clampDate({ ...parts }, minParts, maxParts);
     const numDays = getNumDaysInMonth(month, year);
     /**
      * If the max number of days
@@ -721,7 +721,7 @@ const validateParts = (parts, minParts, maxParts) => {
  */
 const getClosestValidDate = ({ refParts, monthValues, dayValues, yearValues, hourValues, minuteValues, minParts, maxParts, }) => {
     const { hour, minute, day, month, year } = refParts;
-    const copyParts = Object.assign(Object.assign({}, refParts), { dayOfWeek: undefined });
+    const copyParts = { ...refParts, dayOfWeek: undefined };
     if (yearValues !== undefined) {
         // Filters out years that are out of the min/max bounds
         const filteredYears = yearValues.filter((year) => {
@@ -752,10 +752,10 @@ const getClosestValidDate = ({ refParts, monthValues, dayValues, yearValues, hou
     if (day !== null && dayValues !== undefined) {
         // Filters out days that are out of the min/max bounds
         const filteredDays = dayValues.filter((day) => {
-            if (minParts !== undefined && isBefore(Object.assign(Object.assign({}, copyParts), { day }), minParts)) {
+            if (minParts !== undefined && isBefore({ ...copyParts, day }, minParts)) {
                 return false;
             }
-            if (maxParts !== undefined && isAfter(Object.assign(Object.assign({}, copyParts), { day }), maxParts)) {
+            if (maxParts !== undefined && isAfter({ ...copyParts, day }, maxParts)) {
                 return false;
             }
             return true;
@@ -765,10 +765,10 @@ const getClosestValidDate = ({ refParts, monthValues, dayValues, yearValues, hou
     if (hour !== undefined && hourValues !== undefined) {
         // Filters out hours that are out of the min/max bounds
         const filteredHours = hourValues.filter((hour) => {
-            if ((minParts === null || minParts === void 0 ? void 0 : minParts.hour) !== undefined && isSameDay(copyParts, minParts) && hour < minParts.hour) {
+            if (minParts?.hour !== undefined && isSameDay(copyParts, minParts) && hour < minParts.hour) {
                 return false;
             }
-            if ((maxParts === null || maxParts === void 0 ? void 0 : maxParts.hour) !== undefined && isSameDay(copyParts, maxParts) && hour > maxParts.hour) {
+            if (maxParts?.hour !== undefined && isSameDay(copyParts, maxParts) && hour > maxParts.hour) {
                 return false;
             }
             return true;
@@ -779,13 +779,13 @@ const getClosestValidDate = ({ refParts, monthValues, dayValues, yearValues, hou
     if (minute !== undefined && minuteValues !== undefined) {
         // Filters out minutes that are out of the min/max bounds
         const filteredMinutes = minuteValues.filter((minute) => {
-            if ((minParts === null || minParts === void 0 ? void 0 : minParts.minute) !== undefined &&
+            if (minParts?.minute !== undefined &&
                 isSameDay(copyParts, minParts) &&
                 copyParts.hour === minParts.hour &&
                 minute < minParts.minute) {
                 return false;
             }
-            if ((maxParts === null || maxParts === void 0 ? void 0 : maxParts.minute) !== undefined &&
+            if (maxParts?.minute !== undefined &&
                 isSameDay(copyParts, maxParts) &&
                 copyParts.hour === maxParts.hour &&
                 minute > maxParts.minute) {
@@ -840,7 +840,8 @@ const getFormattedDayPeriod = (dayPeriod) => {
  * confusion.
  */
 const stripTimeZone = (formatOptions) => {
-    return Object.assign(Object.assign({}, formatOptions), {
+    return {
+        ...formatOptions,
         /**
          * Setting the time zone to UTC ensures that the value shown is always the
          * same as what was selected and safeguards against older Safari bugs with
@@ -850,8 +851,8 @@ const stripTimeZone = (formatOptions) => {
         /**
          * We do not want to display the time zone name
          */
-        timeZoneName: undefined
-    });
+        timeZoneName: undefined,
+    };
 };
 const getLocalizedTime = (locale, refParts, hourCycle, formatOptions = { hour: 'numeric', minute: 'numeric' }) => {
     const timeParts = {
@@ -861,13 +862,20 @@ const getLocalizedTime = (locale, refParts, hourCycle, formatOptions = { hour: '
     if (timeParts.hour === undefined || timeParts.minute === undefined) {
         return 'Invalid Time';
     }
-    return new Intl.DateTimeFormat(locale, Object.assign(Object.assign({}, stripTimeZone(formatOptions)), {
+    return new Intl.DateTimeFormat(locale, {
+        ...stripTimeZone(formatOptions),
         /**
          * We use hourCycle here instead of hour12 due to:
          * https://bugs.chromium.org/p/chromium/issues/detail?id=1347316&q=hour12&can=2
          */
-        hourCycle
-    })).format(new Date(convertDataToISO(Object.assign({
+        hourCycle,
+        /**
+         * Setting Z at the end indicates that this
+         * date string is in the UTC time zone. This
+         * prevents new Date from adding the time zone
+         * offset when getting the ISO string.
+         */
+    }).format(new Date(convertDataToISO({
         /**
          * JS uses a simplified ISO 8601 format which allows for
          * date-only formats and date-time formats, but not
@@ -879,8 +887,11 @@ const getLocalizedTime = (locale, refParts, hourCycle, formatOptions = { hour: '
          * values, so passing these date values should have no impact
          * on the time output.
          */
-        year: 2023, day: 1, month: 1
-    }, timeParts)) + 'Z'));
+        year: 2023,
+        day: 1,
+        month: 1,
+        ...timeParts,
+    }) + 'Z'));
 };
 /**
  * Adds padding to a time value so
@@ -989,7 +1000,6 @@ const getYear = (locale, refParts) => {
  * with a normalized time.
  */
 const getNormalizedDate = (refParts) => {
-    var _a, _b, _c;
     const timeString = refParts.hour !== undefined && refParts.minute !== undefined ? ` ${refParts.hour}:${refParts.minute}` : '';
     /**
      * We use / notation here for the date
@@ -1001,7 +1011,7 @@ const getNormalizedDate = (refParts) => {
      * account for this and still return a valid date. However,
      * this is not a consistent behavior across all browsers.
      */
-    return new Date(`${(_a = refParts.month) !== null && _a !== void 0 ? _a : 1}/${(_b = refParts.day) !== null && _b !== void 0 ? _b : 1}/${(_c = refParts.year) !== null && _c !== void 0 ? _c : 2023}${timeString} GMT+0000`);
+    return new Date(`${refParts.month ?? 1}/${refParts.day ?? 1}/${refParts.year ?? 2023}${timeString} GMT+0000`);
 };
 /**
  * Given a locale, DatetimeParts, and options
@@ -1032,7 +1042,7 @@ const getLocalizedDateTimeParts = (locale, refParts, options) => {
  * with Intl.DateTimeFormat.
  */
 const getDateTimeFormat = (locale, options) => {
-    return new Intl.DateTimeFormat(locale, Object.assign(Object.assign({}, options), { timeZone: 'UTC' }));
+    return new Intl.DateTimeFormat(locale, { ...options, timeZone: 'UTC' });
 };
 /**
  * Gets a localized version of "Today"

package/dist/cjs/{framework-delegate-CJT_QJQI.js → framework-delegate-NTLQ5YzV.js}

@@ -3,19 +3,17 @@
  */
 'use strict';
 
-var index = require('./index-C1knGA9x.js');
-var helpers = require('./helpers-Fh1iXsX9.js');
+var helpers = require('./helpers-CaLhEmTE.js');
 
 // TODO(FW-2832): types
 const attachComponent = async (delegate, container, component, cssClasses, componentProps, inline) => {
-    var _a;
     if (delegate) {
         return delegate.attachViewToDom(container, component, componentProps, cssClasses);
     }
     if (!inline && typeof component !== 'string' && !(component instanceof HTMLElement)) {
         throw new Error('framework delegate is missing');
     }
-    const el = typeof component === 'string' ? (_a = container.ownerDocument) === null || _a === void 0 ? void 0 : _a.createElement(component) : component;
+    const el = typeof component === 'string' ? container.ownerDocument?.createElement(component) : component;
     if (cssClasses) {
         cssClasses.forEach((c) => el.classList.add(c));
     }
@@ -40,7 +38,6 @@ const CoreDelegate = () => {
     let BaseComponent;
     let Reference;
     const attachViewToDom = async (parentElement, userComponent, userComponentProps = {}, cssClasses = []) => {
-        var _a, _b;
         BaseComponent = parentElement;
         let ChildComponent;
         /**
@@ -53,7 +50,7 @@ const CoreDelegate = () => {
              * the element otherwise just get a reference
              * to the component.
              */
-            const el = typeof userComponent === 'string' ? (_a = BaseComponent.ownerDocument) === null || _a === void 0 ? void 0 : _a.createElement(userComponent) : userComponent;
+            const el = typeof userComponent === 'string' ? BaseComponent.ownerDocument?.createElement(userComponent) : userComponent;
             /**
              * Add any css classes passed in
              * via the cssClasses prop on the overlay.
@@ -85,7 +82,7 @@ const CoreDelegate = () => {
                  * that the overlay has not been presented yet and we need
                  * to create the containing element with the specified classes.
                  */
-                const el = (_b = BaseComponent.ownerDocument) === null || _b === void 0 ? void 0 : _b.createElement('div');
+                const el = BaseComponent.ownerDocument?.createElement('div');
                 // Add a class to track if the root element was created by the delegate.
                 el.classList.add('ion-delegate-host');
                 cssClasses.forEach((c) => el.classList.add(c));
@@ -105,8 +102,7 @@ const CoreDelegate = () => {
          * Get the root of the app and
          * add the overlay there.
          */
-        const appRootSelector = index.config.get('appRootSelector', 'ion-app');
-        const app = document.querySelector(appRootSelector) || document.body;
+        const app = document.querySelector('ion-app') || document.body;
         /**
          * Create a placeholder comment so that
          * we can return this component to where
@@ -126,7 +122,7 @@ const CoreDelegate = () => {
          * in the event that a modal or popover is presented
          * with no child content.
          */
-        return ChildComponent !== null && ChildComponent !== void 0 ? ChildComponent : BaseComponent;
+        return ChildComponent ?? BaseComponent;
     };
     const removeViewFromDom = () => {
         /**

package/dist/cjs/{gesture-controller-dtqlP_q4.js → gesture-controller-BDUH7687.js}

@@ -4,18 +4,16 @@
 'use strict';
 
 class GestureController {
-    constructor() {
-        this.gestureId = 0;
-        this.requestedStart = new Map();
-        this.disabledGestures = new Map();
-        this.disabledScroll = new Set();
-    }
+    gestureId = 0;
+    requestedStart = new Map();
+    disabledGestures = new Map();
+    disabledScroll = new Set();
+    capturedId;
     /**
      * Creates a gesture delegate based on the GestureConfig passed
      */
     createGesture(config) {
-        var _a;
-        return new GestureDelegate(this, this.newID(), config.name, (_a = config.priority) !== null && _a !== void 0 ? _a : 0, !!config.disableScroll);
+        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.
@@ -111,6 +109,11 @@ class GestureController {
     }
 }
 class GestureDelegate {
+    id;
+    name;
+    disableScroll;
+    ctrl;
+    priority;
     constructor(ctrl, id, name, priority, disableScroll) {
         this.id = id;
         this.name = name;
@@ -154,6 +157,10 @@ class GestureDelegate {
     }
 }
 class BlockerDelegate {
+    id;
+    disable;
+    disableScroll;
+    ctrl;
     constructor(ctrl, id, disable, disableScroll) {
         this.id = id;
         this.disable = disable;

package/dist/cjs/{haptic-BFgF-QCg.js → haptic-Ch-X4gRx.js}

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var capacitor = require('./capacitor-BixsAzyb.js');
+var capacitor = require('./capacitor-DmA66EwP.js');
 
 exports.ImpactStyle = void 0;
 (function (ImpactStyle) {
@@ -50,7 +50,7 @@ var NotificationType;
 const HapticEngine = {
     getEngine() {
         const capacitor$1 = capacitor.getCapacitor();
-        if (capacitor$1 === null || capacitor$1 === void 0 ? void 0 : capacitor$1.isPluginAvailable('Haptics')) {
+        if (capacitor$1?.isPluginAvailable('Haptics')) {
             // Capacitor
             return capacitor$1.Plugins.Haptics;
         }
@@ -71,8 +71,7 @@ const HapticEngine = {
          * the Vibrate API. This check avoids that error
          * if the browser does not support the Vibrate API.
          */
-        if ((capacitor$1 === null || capacitor$1 === void 0 ? void 0 : capacitor$1.getPlatform()) === 'web') {
-            // eslint-disable-next-line @typescript-eslint/prefer-optional-chain
+        if (capacitor$1?.getPlatform() === 'web') {
             return typeof navigator !== 'undefined' && navigator.vibrate !== undefined;
         }
         return true;

package/dist/cjs/hardware-back-button-fqpYh-kd.js

@@ -0,0 +1,121 @@
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
+'use strict';
+
+var index$1 = require('./index-DkNv4J_i.js');
+var index = require('./index-uvry__L4.js');
+
+/**
+ * CloseWatcher is a newer API that lets
+ * use detect the hardware back button event
+ * in a web browser: https://caniuse.com/?search=closewatcher
+ * However, not every browser supports it yet.
+ *
+ * This needs to be a function so that we can
+ * check the config once it has been set.
+ * Otherwise, this code would be evaluated the
+ * moment this file is evaluated which could be
+ * before the config is set.
+ */
+const shouldUseCloseWatcher = () => index.config.get('experimentalCloseWatcher', false) && index$1.win !== undefined && 'CloseWatcher' in index$1.win;
+/**
+ * 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 blockHardwareBackButton = () => {
+    document.addEventListener('backbutton', () => { });
+};
+const startHardwareBackButton = () => {
+    const doc = document;
+    let busy = false;
+    const backButtonCallback = () => {
+        if (busy) {
+            return;
+        }
+        let index$1 = 0;
+        let handlers = [];
+        const ev = new CustomEvent('ionBackButton', {
+            bubbles: false,
+            detail: {
+                register(priority, handler) {
+                    handlers.push({ priority, handler, id: index$1++ });
+                },
+            },
+        });
+        doc.dispatchEvent(ev);
+        const executeAction = async (handlerRegister) => {
+            try {
+                if (handlerRegister?.handler) {
+                    const result = handlerRegister.handler(processHandlers);
+                    if (result != null) {
+                        await result;
+                    }
+                }
+            }
+            catch (e) {
+                index.printIonError('[ion-app] - Exception in startHardwareBackButton:', e);
+            }
+        };
+        const processHandlers = () => {
+            if (handlers.length > 0) {
+                let selectedHandler = {
+                    priority: Number.MIN_SAFE_INTEGER,
+                    handler: () => undefined,
+                    id: -1,
+                };
+                handlers.forEach((handler) => {
+                    if (handler.priority >= selectedHandler.priority) {
+                        selectedHandler = handler;
+                    }
+                });
+                busy = true;
+                handlers = handlers.filter((handler) => handler.id !== selectedHandler.id);
+                executeAction(selectedHandler).then(() => (busy = false));
+            }
+        };
+        processHandlers();
+    };
+    /**
+     * If the CloseWatcher is defined then
+     * we don't want to also listen for the native
+     * backbutton event otherwise we may get duplicate
+     * events firing.
+     */
+    if (shouldUseCloseWatcher()) {
+        let watcher;
+        const configureWatcher = () => {
+            watcher?.destroy();
+            watcher = new index$1.win.CloseWatcher();
+            /**
+             * Once a close request happens
+             * the watcher gets destroyed.
+             * As a result, we need to re-configure
+             * the watcher so we can respond to other
+             * close requests.
+             */
+            watcher.onclose = () => {
+                backButtonCallback();
+                configureWatcher();
+            };
+        };
+        configureWatcher();
+    }
+    else {
+        doc.addEventListener('backbutton', backButtonCallback);
+    }
+};
+const OVERLAY_BACK_BUTTON_PRIORITY = 100;
+const MENU_BACK_BUTTON_PRIORITY = 99; // 1 less than overlay priority since menu is displayed behind overlays
+
+exports.MENU_BACK_BUTTON_PRIORITY = MENU_BACK_BUTTON_PRIORITY;
+exports.OVERLAY_BACK_BUTTON_PRIORITY = OVERLAY_BACK_BUTTON_PRIORITY;
+exports.blockHardwareBackButton = blockHardwareBackButton;
+exports.shouldUseCloseWatcher = shouldUseCloseWatcher;
+exports.startHardwareBackButton = startHardwareBackButton;

package/dist/cjs/{helpers-Fh1iXsX9.js → helpers-CaLhEmTE.js}

@@ -3,8 +3,7 @@
  */
 'use strict';
 
-var focusVisible = require('./focus-visible-BIj-I3-C.js');
-var index = require('./index-C1knGA9x.js');
+var index = require('./index-uvry__L4.js');
 
 const transitionEndAsync = (el, expectedDuration = 0) => {
     return new Promise((resolve) => {
@@ -204,17 +203,6 @@ const raf = (h) => {
 const hasShadowDom = (el) => {
     return !!el.shadowRoot && !!el.attachShadow;
 };
-/**
- * Focuses a given element while ensuring proper focus management
- * within the Ionic framework. If the element is marked as `ion-focusable`,
- * this function will delegate focus handling to `ion-app` or manually
- * apply focus when a custom app root is used.
- *
- * This function helps maintain accessibility and expected focus behavior
- * in both standard and custom root environments.
- *
- * @param el - The element to focus.
- */
 const focusVisibleElement = (el) => {
     el.focus();
     /**
@@ -224,68 +212,14 @@ const focusVisibleElement = (el) => {
      * however, there are times when we need to manually control
      * this behavior so we call the `setFocus` method on ion-app
      * which will let us explicitly set the elements to focus.
-     *
-     * Note: The element passed to this function might be an inner
-     * focusable element (e.g., a native <button> inside ion-button's
-     * shadow root). If so, we need to find the host element that has
-     * the ion-focusable class to pass to setFocus.
      */
-    let elToFocus = el;
-    // If the element doesn't have ion-focusable, check if it's inside
-    // a shadow root and use the host element instead
-    if (!el.classList.contains('ion-focusable')) {
-        const rootNode = el.getRootNode();
-        if (rootNode instanceof ShadowRoot && rootNode.host instanceof HTMLElement) {
-            elToFocus = rootNode.host;
-        }
-    }
-    if (elToFocus.classList.contains('ion-focusable')) {
-        const appRootSelector = index.config.get('appRootSelector', 'ion-app');
-        const app = elToFocus.closest(appRootSelector);
+    if (el.classList.contains('ion-focusable')) {
+        const app = el.closest('ion-app');
         if (app) {
-            if (appRootSelector === 'ion-app') {
-                /**
-                 * If the app root is the default, then it will be
-                 * in charge of setting focus. This is because the
-                 * focus-visible utility is attached to the app root
-                 * and will handle setting focus on the correct element.
-                 */
-                app.setFocus([elToFocus]);
-            }
-            else {
-                /**
-                 * When using a custom app root selector, the focus-visible
-                 * utility is not available to manage focus automatically.
-                 * If we set focus immediately, the element may not be fully
-                 * rendered or interactive, especially if it was just added
-                 * to the DOM. Using requestAnimationFrame ensures that focus
-                 * is applied on the next frame, allowing the DOM to settle
-                 * before changing focus.
-                 */
-                requestAnimationFrame(() => {
-                    /**
-                     * The focus-visible utility is used to set focus on an
-                     * element that uses `ion-focusable`.
-                     */
-                    focusVisible.focusElements([elToFocus]);
-                });
-            }
+            app.setFocus([el]);
         }
     }
 };
-/**
- * Clears the keyboard focus ring (`ion-focused`) that the focus-visible
- * utility may have applied to elements during a programmatic focus.
- *
- * Use this after moving DOM focus to an element for assistive technologies
- * (e.g. when an overlay opens) where the option should be focused so screen
- * readers announce it, but the focus ring should not be shown until the user
- * navigates with the keyboard (Tab/Arrow). The focus-visible utility will add
- * `ion-focused` again on the next keyboard-driven focus change.
- */
-const suppressFocusVisible = () => {
-    focusVisible.focusElements([]);
-};
 /**
  * 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
@@ -378,8 +312,8 @@ const debounce = (func, wait = 0) => {
  * @returns whether the keys are the same and the values are shallow equal.
  */
 const shallowEqualStringMap = (map1, map2) => {
-    map1 !== null && map1 !== void 0 ? map1 : (map1 = {});
-    map2 !== null && map2 !== void 0 ? map2 : (map2 = {});
+    map1 ??= {};
+    map2 ??= {};
     if (map1 === map2) {
         return true;
     }
@@ -423,5 +357,4 @@ exports.raf = raf;
 exports.removeEventListener = removeEventListener;
 exports.renderHiddenInput = renderHiddenInput;
 exports.shallowEqualStringMap = shallowEqualStringMap;
-exports.suppressFocusVisible = suppressFocusVisible;
 exports.transitionEndAsync = transitionEndAsync;