@ionic/core 8.3.1-dev.11726172907.15a1af41 → 8.3.1-dev.11726241210.1ab7a0ab

package/hydrate/index.js

@@ -2776,55 +2776,6 @@ class Config {
 }
 const config = /*@__PURE__*/ new Config();
 
-const win$1 = typeof window !== 'undefined' ? window : undefined;
-const doc = typeof document !== 'undefined' ? document : undefined;
-
-/**
- * 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 = () => config.get('experimentalCloseWatcher', false) && win$1 !== undefined && 'CloseWatcher' in win$1;
-const OVERLAY_BACK_BUTTON_PRIORITY = 100;
-const MENU_BACK_BUTTON_PRIORITY = 99; // 1 less than overlay priority since menu is displayed behind overlays
-
-/**
- * Logs a warning to the console with an Ionic prefix
- * to indicate the library that is warning the developer.
- *
- * @param message - The string message to be logged to the console.
- */
-const printIonWarning = (message, ...params) => {
-    return console.warn(`[Ionic Warning]: ${message}`, ...params);
-};
-/*
- * Logs an error to the console with an Ionic prefix
- * to indicate the library that is warning the developer.
- *
- * @param message - The string message to be logged to the console.
- * @param params - Additional arguments to supply to the console.error.
- */
-const printIonError = (message, ...params) => {
-    return console.error(`[Ionic Error]: ${message}`, ...params);
-};
-/**
- * Prints an error informing developers that an implementation requires an element to be used
- * within a specific selector.
- *
- * @param el The web component element this is requiring the element.
- * @param targetSelectors The selector or selectors that were not found.
- */
-const printRequiredElementError = (el, ...targetSelectors) => {
-    return console.error(`<${el.tagName.toLowerCase()}> must be used inside ${targetSelectors.join(' or ')}.`);
-};
-
 const getPlatforms = (win) => setupPlatforms(win);
 const isPlatform = (winOrPlatform, platform) => {
     if (typeof winOrPlatform === 'string') {
@@ -3265,6 +3216,36 @@ class Accordion {
 }
 let accordionIds = 0;
 
+/**
+ * Logs a warning to the console with an Ionic prefix
+ * to indicate the library that is warning the developer.
+ *
+ * @param message - The string message to be logged to the console.
+ */
+const printIonWarning = (message, ...params) => {
+    return console.warn(`[Ionic Warning]: ${message}`, ...params);
+};
+/*
+ * Logs an error to the console with an Ionic prefix
+ * to indicate the library that is warning the developer.
+ *
+ * @param message - The string message to be logged to the console.
+ * @param params - Additional arguments to supply to the console.error.
+ */
+const printIonError = (message, ...params) => {
+    return console.error(`[Ionic Error]: ${message}`, ...params);
+};
+/**
+ * Prints an error informing developers that an implementation requires an element to be used
+ * within a specific selector.
+ *
+ * @param el The web component element this is requiring the element.
+ * @param targetSelectors The selector or selectors that were not found.
+ */
+const printRequiredElementError = (el, ...targetSelectors) => {
+    return console.error(`<${el.tagName.toLowerCase()}> must be used inside ${targetSelectors.join(' or ')}.`);
+};
+
 const accordionGroupIosCss = ":host{display:block}:host(.accordion-group-expand-inset){-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:16px;margin-bottom:16px}:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanding),:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanded){border-bottom:none}";
 var IonAccordionGroupIosStyle0 = accordionGroupIosCss;
 
@@ -3503,6 +3484,9 @@ class AccordionGroup {
     }; }
 }
 
+const win$1 = typeof window !== 'undefined' ? window : undefined;
+const doc = typeof document !== 'undefined' ? document : undefined;
+
 const getCapacitor = () => {
     if (win$1 !== undefined) {
         return win$1.Capacitor;
@@ -4477,6 +4461,22 @@ const focusElementInContext = (hostToFocus, fallbackElement) => {
     }
 };
 
+/**
+ * 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 = () => config.get('experimentalCloseWatcher', false) && win$1 !== undefined && 'CloseWatcher' in win$1;
+const OVERLAY_BACK_BUTTON_PRIORITY = 100;
+const MENU_BACK_BUTTON_PRIORITY = 99; // 1 less than overlay priority since menu is displayed behind overlays
+
 // TODO(FW-2832): types
 const attachComponent = async (delegate, container, component, cssClasses, componentProps, inline) => {
     var _a;
@@ -7301,84 +7301,6 @@ 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 ION_FOCUSED = 'ion-focused';
-const ION_FOCUSABLE = 'ion-focusable';
-const FOCUS_KEYS = [
-    'Tab',
-    'ArrowDown',
-    'Space',
-    'Escape',
-    ' ',
-    'Shift',
-    'Enter',
-    'ArrowLeft',
-    'ArrowRight',
-    'ArrowUp',
-    'Home',
-    'End',
-];
-let focusVisibleUtility = null;
-const initFocusVisibleUtility = () => {
-    if (!focusVisibleUtility) {
-        focusVisibleUtility = startFocusVisible();
-    }
-    return focusVisibleUtility;
-};
-const startFocusVisible = (rootEl) => {
-    let currentFocus = [];
-    let keyboardMode = true;
-    const ref = rootEl ? rootEl.shadowRoot : document;
-    const root = rootEl ? rootEl : document.body;
-    const setFocus = (elements) => {
-        currentFocus.forEach((el) => el.classList.remove(ION_FOCUSED));
-        elements.forEach((el) => el.classList.add(ION_FOCUSED));
-        currentFocus = elements;
-    };
-    const pointerDown = () => {
-        keyboardMode = false;
-        setFocus([]);
-    };
-    const onKeydown = (ev) => {
-        keyboardMode = FOCUS_KEYS.includes(ev.key);
-        if (!keyboardMode) {
-            setFocus([]);
-        }
-    };
-    const onFocusin = (ev) => {
-        if (keyboardMode && ev.composedPath !== undefined) {
-            const toFocus = ev.composedPath().filter((el) => {
-                // TODO(FW-2832): type
-                if (el.classList) {
-                    return el.classList.contains(ION_FOCUSABLE);
-                }
-                return false;
-            });
-            setFocus(toFocus);
-        }
-    };
-    const onFocusout = () => {
-        if (ref.activeElement === root) {
-            setFocus([]);
-        }
-    };
-    ref.addEventListener('keydown', onKeydown);
-    ref.addEventListener('focusin', onFocusin);
-    ref.addEventListener('focusout', onFocusout);
-    ref.addEventListener('touchstart', pointerDown, { passive: true });
-    ref.addEventListener('mousedown', pointerDown);
-    const destroy = () => {
-        ref.removeEventListener('keydown', onKeydown);
-        ref.removeEventListener('focusin', onFocusin);
-        ref.removeEventListener('focusout', onFocusout);
-        ref.removeEventListener('touchstart', pointerDown);
-        ref.removeEventListener('mousedown', pointerDown);
-    };
-    return {
-        destroy,
-        setFocus,
-    };
-};
-
 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}";
 var IonAppStyle0 = appCss;
 
@@ -7386,6 +7308,8 @@ class App {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
+    componentDidLoad() {
+    }
     /**
      * @internal
      * Used to set focus on an element that uses `ion-focusable`.
@@ -7397,12 +7321,13 @@ class App {
      * presented as a result of keyboard action.)
      */
     async setFocus(elements) {
-        const focusVisible = initFocusVisibleUtility();
-        focusVisible.setFocus(elements);
+        if (this.focusVisible) {
+            this.focusVisible.setFocus(elements);
+        }
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'b4132f59a7b043db8f7d178a81e7fec6eb1cb0d7', class: {
+        return (hAsync(Host, { key: 'a562850f242d9d45573e35efdd4bd178254677ef', class: {
                 [mode]: true,
                 'ion-page': true,
                 'force-statusbar-padding': config.getBoolean('_forceStatusbarPadding'),
@@ -9208,6 +9133,77 @@ const updateScrollDetail = (detail, el, timestamp, shouldStart) => {
     }
 };
 
+const ION_FOCUSED = 'ion-focused';
+const ION_FOCUSABLE = 'ion-focusable';
+const FOCUS_KEYS = [
+    'Tab',
+    'ArrowDown',
+    'Space',
+    'Escape',
+    ' ',
+    'Shift',
+    'Enter',
+    'ArrowLeft',
+    'ArrowRight',
+    'ArrowUp',
+    'Home',
+    'End',
+];
+const startFocusVisible = (rootEl) => {
+    let currentFocus = [];
+    let keyboardMode = true;
+    const ref = rootEl ? rootEl.shadowRoot : document;
+    const root = rootEl ? rootEl : document.body;
+    const setFocus = (elements) => {
+        currentFocus.forEach((el) => el.classList.remove(ION_FOCUSED));
+        elements.forEach((el) => el.classList.add(ION_FOCUSED));
+        currentFocus = elements;
+    };
+    const pointerDown = () => {
+        keyboardMode = false;
+        setFocus([]);
+    };
+    const onKeydown = (ev) => {
+        keyboardMode = FOCUS_KEYS.includes(ev.key);
+        if (!keyboardMode) {
+            setFocus([]);
+        }
+    };
+    const onFocusin = (ev) => {
+        if (keyboardMode && ev.composedPath !== undefined) {
+            const toFocus = ev.composedPath().filter((el) => {
+                // TODO(FW-2832): type
+                if (el.classList) {
+                    return el.classList.contains(ION_FOCUSABLE);
+                }
+                return false;
+            });
+            setFocus(toFocus);
+        }
+    };
+    const onFocusout = () => {
+        if (ref.activeElement === root) {
+            setFocus([]);
+        }
+    };
+    ref.addEventListener('keydown', onKeydown);
+    ref.addEventListener('focusin', onFocusin);
+    ref.addEventListener('focusout', onFocusout);
+    ref.addEventListener('touchstart', pointerDown, { passive: true });
+    ref.addEventListener('mousedown', pointerDown);
+    const destroy = () => {
+        ref.removeEventListener('keydown', onKeydown);
+        ref.removeEventListener('focusin', onFocusin);
+        ref.removeEventListener('focusout', onFocusout);
+        ref.removeEventListener('touchstart', pointerDown);
+        ref.removeEventListener('mousedown', pointerDown);
+    };
+    return {
+        destroy,
+        setFocus,
+    };
+};
+
 /**
  * Returns true if the selected day is equal to the reference day
  */

package/hydrate/index.mjs

@@ -2772,55 +2772,6 @@ class Config {
 }
 const config = /*@__PURE__*/ new Config();
 
-const win$1 = typeof window !== 'undefined' ? window : undefined;
-const doc = typeof document !== 'undefined' ? document : undefined;
-
-/**
- * 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 = () => config.get('experimentalCloseWatcher', false) && win$1 !== undefined && 'CloseWatcher' in win$1;
-const OVERLAY_BACK_BUTTON_PRIORITY = 100;
-const MENU_BACK_BUTTON_PRIORITY = 99; // 1 less than overlay priority since menu is displayed behind overlays
-
-/**
- * Logs a warning to the console with an Ionic prefix
- * to indicate the library that is warning the developer.
- *
- * @param message - The string message to be logged to the console.
- */
-const printIonWarning = (message, ...params) => {
-    return console.warn(`[Ionic Warning]: ${message}`, ...params);
-};
-/*
- * Logs an error to the console with an Ionic prefix
- * to indicate the library that is warning the developer.
- *
- * @param message - The string message to be logged to the console.
- * @param params - Additional arguments to supply to the console.error.
- */
-const printIonError = (message, ...params) => {
-    return console.error(`[Ionic Error]: ${message}`, ...params);
-};
-/**
- * Prints an error informing developers that an implementation requires an element to be used
- * within a specific selector.
- *
- * @param el The web component element this is requiring the element.
- * @param targetSelectors The selector or selectors that were not found.
- */
-const printRequiredElementError = (el, ...targetSelectors) => {
-    return console.error(`<${el.tagName.toLowerCase()}> must be used inside ${targetSelectors.join(' or ')}.`);
-};
-
 const getPlatforms = (win) => setupPlatforms(win);
 const isPlatform = (winOrPlatform, platform) => {
     if (typeof winOrPlatform === 'string') {
@@ -3261,6 +3212,36 @@ class Accordion {
 }
 let accordionIds = 0;
 
+/**
+ * Logs a warning to the console with an Ionic prefix
+ * to indicate the library that is warning the developer.
+ *
+ * @param message - The string message to be logged to the console.
+ */
+const printIonWarning = (message, ...params) => {
+    return console.warn(`[Ionic Warning]: ${message}`, ...params);
+};
+/*
+ * Logs an error to the console with an Ionic prefix
+ * to indicate the library that is warning the developer.
+ *
+ * @param message - The string message to be logged to the console.
+ * @param params - Additional arguments to supply to the console.error.
+ */
+const printIonError = (message, ...params) => {
+    return console.error(`[Ionic Error]: ${message}`, ...params);
+};
+/**
+ * Prints an error informing developers that an implementation requires an element to be used
+ * within a specific selector.
+ *
+ * @param el The web component element this is requiring the element.
+ * @param targetSelectors The selector or selectors that were not found.
+ */
+const printRequiredElementError = (el, ...targetSelectors) => {
+    return console.error(`<${el.tagName.toLowerCase()}> must be used inside ${targetSelectors.join(' or ')}.`);
+};
+
 const accordionGroupIosCss = ":host{display:block}:host(.accordion-group-expand-inset){-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:16px;margin-bottom:16px}:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanding),:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanded){border-bottom:none}";
 var IonAccordionGroupIosStyle0 = accordionGroupIosCss;
 
@@ -3499,6 +3480,9 @@ class AccordionGroup {
     }; }
 }
 
+const win$1 = typeof window !== 'undefined' ? window : undefined;
+const doc = typeof document !== 'undefined' ? document : undefined;
+
 const getCapacitor = () => {
     if (win$1 !== undefined) {
         return win$1.Capacitor;
@@ -4473,6 +4457,22 @@ const focusElementInContext = (hostToFocus, fallbackElement) => {
     }
 };
 
+/**
+ * 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 = () => config.get('experimentalCloseWatcher', false) && win$1 !== undefined && 'CloseWatcher' in win$1;
+const OVERLAY_BACK_BUTTON_PRIORITY = 100;
+const MENU_BACK_BUTTON_PRIORITY = 99; // 1 less than overlay priority since menu is displayed behind overlays
+
 // TODO(FW-2832): types
 const attachComponent = async (delegate, container, component, cssClasses, componentProps, inline) => {
     var _a;
@@ -7297,84 +7297,6 @@ 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 ION_FOCUSED = 'ion-focused';
-const ION_FOCUSABLE = 'ion-focusable';
-const FOCUS_KEYS = [
-    'Tab',
-    'ArrowDown',
-    'Space',
-    'Escape',
-    ' ',
-    'Shift',
-    'Enter',
-    'ArrowLeft',
-    'ArrowRight',
-    'ArrowUp',
-    'Home',
-    'End',
-];
-let focusVisibleUtility = null;
-const initFocusVisibleUtility = () => {
-    if (!focusVisibleUtility) {
-        focusVisibleUtility = startFocusVisible();
-    }
-    return focusVisibleUtility;
-};
-const startFocusVisible = (rootEl) => {
-    let currentFocus = [];
-    let keyboardMode = true;
-    const ref = rootEl ? rootEl.shadowRoot : document;
-    const root = rootEl ? rootEl : document.body;
-    const setFocus = (elements) => {
-        currentFocus.forEach((el) => el.classList.remove(ION_FOCUSED));
-        elements.forEach((el) => el.classList.add(ION_FOCUSED));
-        currentFocus = elements;
-    };
-    const pointerDown = () => {
-        keyboardMode = false;
-        setFocus([]);
-    };
-    const onKeydown = (ev) => {
-        keyboardMode = FOCUS_KEYS.includes(ev.key);
-        if (!keyboardMode) {
-            setFocus([]);
-        }
-    };
-    const onFocusin = (ev) => {
-        if (keyboardMode && ev.composedPath !== undefined) {
-            const toFocus = ev.composedPath().filter((el) => {
-                // TODO(FW-2832): type
-                if (el.classList) {
-                    return el.classList.contains(ION_FOCUSABLE);
-                }
-                return false;
-            });
-            setFocus(toFocus);
-        }
-    };
-    const onFocusout = () => {
-        if (ref.activeElement === root) {
-            setFocus([]);
-        }
-    };
-    ref.addEventListener('keydown', onKeydown);
-    ref.addEventListener('focusin', onFocusin);
-    ref.addEventListener('focusout', onFocusout);
-    ref.addEventListener('touchstart', pointerDown, { passive: true });
-    ref.addEventListener('mousedown', pointerDown);
-    const destroy = () => {
-        ref.removeEventListener('keydown', onKeydown);
-        ref.removeEventListener('focusin', onFocusin);
-        ref.removeEventListener('focusout', onFocusout);
-        ref.removeEventListener('touchstart', pointerDown);
-        ref.removeEventListener('mousedown', pointerDown);
-    };
-    return {
-        destroy,
-        setFocus,
-    };
-};
-
 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}";
 var IonAppStyle0 = appCss;
 
@@ -7382,6 +7304,8 @@ class App {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
+    componentDidLoad() {
+    }
     /**
      * @internal
      * Used to set focus on an element that uses `ion-focusable`.
@@ -7393,12 +7317,13 @@ class App {
      * presented as a result of keyboard action.)
      */
     async setFocus(elements) {
-        const focusVisible = initFocusVisibleUtility();
-        focusVisible.setFocus(elements);
+        if (this.focusVisible) {
+            this.focusVisible.setFocus(elements);
+        }
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'b4132f59a7b043db8f7d178a81e7fec6eb1cb0d7', class: {
+        return (hAsync(Host, { key: 'a562850f242d9d45573e35efdd4bd178254677ef', class: {
                 [mode]: true,
                 'ion-page': true,
                 'force-statusbar-padding': config.getBoolean('_forceStatusbarPadding'),
@@ -9204,6 +9129,77 @@ const updateScrollDetail = (detail, el, timestamp, shouldStart) => {
     }
 };
 
+const ION_FOCUSED = 'ion-focused';
+const ION_FOCUSABLE = 'ion-focusable';
+const FOCUS_KEYS = [
+    'Tab',
+    'ArrowDown',
+    'Space',
+    'Escape',
+    ' ',
+    'Shift',
+    'Enter',
+    'ArrowLeft',
+    'ArrowRight',
+    'ArrowUp',
+    'Home',
+    'End',
+];
+const startFocusVisible = (rootEl) => {
+    let currentFocus = [];
+    let keyboardMode = true;
+    const ref = rootEl ? rootEl.shadowRoot : document;
+    const root = rootEl ? rootEl : document.body;
+    const setFocus = (elements) => {
+        currentFocus.forEach((el) => el.classList.remove(ION_FOCUSED));
+        elements.forEach((el) => el.classList.add(ION_FOCUSED));
+        currentFocus = elements;
+    };
+    const pointerDown = () => {
+        keyboardMode = false;
+        setFocus([]);
+    };
+    const onKeydown = (ev) => {
+        keyboardMode = FOCUS_KEYS.includes(ev.key);
+        if (!keyboardMode) {
+            setFocus([]);
+        }
+    };
+    const onFocusin = (ev) => {
+        if (keyboardMode && ev.composedPath !== undefined) {
+            const toFocus = ev.composedPath().filter((el) => {
+                // TODO(FW-2832): type
+                if (el.classList) {
+                    return el.classList.contains(ION_FOCUSABLE);
+                }
+                return false;
+            });
+            setFocus(toFocus);
+        }
+    };
+    const onFocusout = () => {
+        if (ref.activeElement === root) {
+            setFocus([]);
+        }
+    };
+    ref.addEventListener('keydown', onKeydown);
+    ref.addEventListener('focusin', onFocusin);
+    ref.addEventListener('focusout', onFocusout);
+    ref.addEventListener('touchstart', pointerDown, { passive: true });
+    ref.addEventListener('mousedown', pointerDown);
+    const destroy = () => {
+        ref.removeEventListener('keydown', onKeydown);
+        ref.removeEventListener('focusin', onFocusin);
+        ref.removeEventListener('focusout', onFocusout);
+        ref.removeEventListener('touchstart', pointerDown);
+        ref.removeEventListener('mousedown', pointerDown);
+    };
+    return {
+        destroy,
+        setFocus,
+    };
+};
+
 /**
  * Returns true if the selected day is equal to the reference day
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ionic/core",
-  "version": "8.3.1-dev.11726172907.15a1af41",
+  "version": "8.3.1-dev.11726241210.1ab7a0ab",
   "description": "Base components for Ionic",
   "keywords": [
     "ionic",