@ionic/core 8.8.7-dev.11779467048.1641d05e → 8.8.7-dev.11779921691.1777274a

package/dist/cjs/{ionic-global-CSEbHD_F.js → ionic-global-DMWqcBn0.js}

@@ -3,7 +3,158 @@
  */
 'use strict';
 
-var index = require('./index-CzcLEdQ5.js');
+var focusVisible = require('./index-BDthk8R7.js');
+
+const defaultTheme$1 = {
+    name: 'base',
+    palette: {
+        light: focusVisible.lightTheme,
+        dark: focusVisible.darkTheme,
+        highContrast: focusVisible.highContrastTheme,
+        highContrastDark: focusVisible.highContrastDarkTheme,
+    },
+    config: {
+        formHighlight: false,
+        rippleEffect: false,
+    },
+    spacing: {
+        0: '0px',
+        25: '1px',
+        50: '2px',
+        75: '3px',
+        100: '4px',
+        150: '6px',
+        200: '8px',
+        250: '10px',
+        300: '12px',
+        350: '14px',
+        400: '16px',
+        450: '18px',
+        500: '20px',
+        550: '22px',
+        600: '24px',
+        650: '26px',
+        700: '28px',
+        750: '30px',
+        800: '32px',
+        850: '34px',
+        900: '36px',
+        950: '38px',
+        1000: '40px',
+        1050: '42px',
+        1100: '44px',
+        1150: '46px',
+        1200: '48px',
+    },
+    scaling: {
+        0: '0px',
+        25: '1px',
+        50: '2px',
+        75: '3px',
+        100: '4px',
+        150: '6px',
+        200: '8px',
+        250: '10px',
+        300: '12px',
+        350: '14px',
+        400: '16px',
+        450: '18px',
+        500: '20px',
+        550: '22px',
+        600: '24px',
+        650: '26px',
+        700: '28px',
+        750: '30px',
+        800: '32px',
+        850: '34px',
+        900: '36px',
+        950: '38px',
+        1000: '40px',
+        1050: '42px',
+        1100: '44px',
+        1150: '46px',
+        1200: '48px',
+        1400: '56px',
+        1600: '64px',
+        1800: '72px',
+        2000: '80px',
+        2400: '96px',
+        2800: '112px',
+        3200: '128px',
+        3400: '136px',
+        3600: '144px',
+        4000: '160px',
+        5000: '200px',
+        6200: '248px',
+        7400: '296px',
+        9000: '360px',
+    },
+    borderWidth: {
+        0: '0',
+        25: '1px',
+        50: '2px',
+        75: '3px',
+        100: '4px',
+        150: '6px',
+        200: '8px',
+        250: '10px',
+        300: '12px',
+        350: '14px',
+        400: '16px',
+        hairline: '0.55px',
+    },
+    radii: {
+        0: '0px',
+        25: '1px',
+        50: '2px',
+        75: '3px',
+        100: '4px',
+        150: '6px',
+        200: '8px',
+        250: '10px',
+        300: '12px',
+        350: '14px',
+        400: '16px',
+        500: '20px',
+        600: '24px',
+        700: '28px',
+        800: '32px',
+        900: '36px',
+        1000: '40px',
+        full: '999px',
+    },
+    dynamicFont: '-apple-system-body',
+    fontSize: {
+        root: '16px',
+        xxs: '10px',
+        xs: '12px',
+        sm: '14px',
+        md: '16px',
+        lg: '18px',
+        xl: '20px',
+        xxl: '24px',
+    },
+    fontWeight: {
+        thin: '100',
+        extraLight: '200',
+        light: '300',
+        normal: '400',
+        medium: '500',
+        semiBold: '600',
+        bold: '700',
+        extraBold: '800',
+        black: '900',
+    },
+    lineHeight: {
+        xxs: '1',
+        xs: '1.2',
+        sm: '1.4',
+        md: '1.6',
+        lg: '1.8',
+        xl: '2',
+        xxl: '2.4',
+    },
+};
 
 const win = typeof window !== 'undefined' ? window : undefined;
 const doc = typeof document !== 'undefined' ? document : undefined;
@@ -20,7 +171,7 @@ const doc = typeof document !== 'undefined' ? document : undefined;
  * moment this file is evaluated which could be
  * before the config is set.
  */
-const shouldUseCloseWatcher = () => index.config.get('experimentalCloseWatcher', false) && win !== undefined && 'CloseWatcher' in win;
+const shouldUseCloseWatcher = () => focusVisible.config.get('experimentalCloseWatcher', false) && win !== undefined && 'CloseWatcher' in win;
 /**
  * When hardwareBackButton: false in config,
  * we need to make sure we also block the default
@@ -41,13 +192,13 @@ const startHardwareBackButton = () => {
         if (busy) {
             return;
         }
-        let index$1 = 0;
+        let index = 0;
         let handlers = [];
         const ev = new CustomEvent('ionBackButton', {
             bubbles: false,
             detail: {
                 register(priority, handler) {
-                    handlers.push({ priority, handler, id: index$1++ });
+                    handlers.push({ priority, handler, id: index++ });
                 },
             },
         });
@@ -63,7 +214,7 @@ const startHardwareBackButton = () => {
                 handler: () => {
                     win === null || win === void 0 ? void 0 : win.history.back();
                 },
-                id: index$1++,
+                id: index++,
             });
         }
         const executeAction = async (handlerRegister) => {
@@ -76,7 +227,7 @@ const startHardwareBackButton = () => {
                 }
             }
             catch (e) {
-                index.printIonError('[ion-app] - Exception in startHardwareBackButton:', e);
+                focusVisible.printIonError('[ion-app] - Exception in startHardwareBackButton:', e);
             }
         };
         const processHandlers = () => {
@@ -161,7 +312,7 @@ const setupPlatforms = (win = window) => {
     return platforms;
 };
 const detectPlatforms = (win) => {
-    const customPlatformMethods = index.config.get('platform');
+    const customPlatformMethods = focusVisible.config.get('platform');
     return Object.keys(PLATFORMS_MAP).filter((p) => {
         const customMethod = customPlatformMethods === null || customPlatformMethods === void 0 ? void 0 : customPlatformMethods[p];
         return typeof customMethod === 'function' ? customMethod(win) : PLATFORMS_MAP[p](win);
@@ -229,88 +380,34 @@ const PLATFORMS_MAP = {
     hybrid: isHybrid,
 };
 
+var __rest = (undefined && undefined.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s)
+        if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+            t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 let defaultMode;
 let defaultTheme = 'md';
 let rICHandle;
-/**
- * Prints a warning message to the developer to inform them of
- * an invalid configuration of mode and theme.
- * @param mode The invalid mode configuration.
- * @param theme The invalid theme configuration.
- */
-const printInvalidModeWarning = (mode, theme, ref) => {
-    index.printIonWarning(`Invalid mode and theme combination provided: mode: ${mode}, theme: ${theme}. Fallback mode ${getDefaultModeForTheme(theme)} will be used.`, ref);
-};
-/**
- * Validates if a mode is accepted for a theme configuration.
- * @param mode The mode to validate.
- * @param theme The theme the mode is being used with.
- * @returns `true` if the mode is valid for the theme, `false` if invalid.
- */
-const isModeValidForTheme = (mode, theme) => {
-    if (mode === 'md') {
-        return theme === 'md' || theme === 'ionic';
-    }
-    else if (mode === 'ios') {
-        return theme === 'ios' || theme === 'ionic';
-    }
-    return false;
-};
-/**
- * Returns the default mode for a specified theme.
- * @param theme The theme to return a default mode for.
- * @returns The default mode, either `ios` or `md`.
- */
-const getDefaultModeForTheme = (theme) => {
-    if (theme === 'ios') {
-        return 'ios';
-    }
-    return 'md';
-};
-/**
- * Returns the default theme for a specified mode.
- * @param mode The mode to return a default theme for.
- * @returns The default theme.
- */
-const getDefaultThemeForMode = (mode) => {
-    if (mode === 'ios') {
-        return 'ios';
-    }
-    return 'md';
-};
 const isModeSupported = (elmMode) => ['ios', 'md'].includes(elmMode);
 const isThemeSupported = (theme) => ['ios', 'md', 'ionic'].includes(theme);
 const isIonicElement = (elm) => { var _a; return (_a = elm.tagName) === null || _a === void 0 ? void 0 : _a.startsWith('ION-'); };
 /**
  * Returns the mode value of the element reference or the closest
- * parent with a valid mode.
+ * parent with a valid mode. If no mode is set, then fallback
+ * to the default mode.
  * @param ref The element reference to look up the mode for.
- * @param theme Optionally can provide the theme to avoid an additional look-up.
  * @returns The mode value for the element reference.
  */
-const getIonMode = (ref, theme = getIonTheme(ref)) => {
+const getIonMode = (ref) => {
     var _a;
-    if ((ref === null || ref === void 0 ? void 0 : ref.mode) && isModeValidForTheme(ref === null || ref === void 0 ? void 0 : ref.mode, theme)) {
-        /**
-         * If the reference already has a mode configuration,
-         * use it instead of performing a look-up.
-         */
-        return ref.mode;
-    }
-    else {
-        const el = index.getElement(ref);
-        const mode = ((_a = el.closest('[mode]')) === null || _a === void 0 ? void 0 : _a.getAttribute('mode')) || defaultMode;
-        if (isModeValidForTheme(mode, theme)) {
-            /**
-             * The mode configuration is supported for the configured theme.
-             */
-            return mode;
-        }
-        else {
-            printInvalidModeWarning(mode, theme, ref);
-        }
-    }
-    return getDefaultModeForTheme(theme);
+    return (ref === null || ref === void 0 ? void 0 : ref.mode) || ((_a = focusVisible.getElement(ref).closest('[mode]')) === null || _a === void 0 ? void 0 : _a.getAttribute('mode')) || defaultMode;
 };
 /**
  * Returns the theme value of the element reference or the closest
@@ -322,7 +419,7 @@ const getIonMode = (ref, theme = getIonTheme(ref)) => {
  */
 const getIonTheme = (ref) => {
     var _a, _b;
-    const theme = ref && index.getMode(ref);
+    const theme = ref && focusVisible.getMode(ref);
     if (theme) {
         return theme;
     }
@@ -330,10 +427,10 @@ const getIonTheme = (ref) => {
      * If the theme cannot be detected, then fallback to using
      * the `mode` attribute to determine the style sheets to use.
      */
-    const el = index.getElement(ref);
+    const el = focusVisible.getElement(ref);
     const mode = (_a = ref === null || ref === void 0 ? void 0 : ref.mode) !== null && _a !== void 0 ? _a : (_b = el.closest('[mode]')) === null || _b === void 0 ? void 0 : _b.getAttribute('mode');
     if (mode) {
-        return getDefaultThemeForMode(mode);
+        return mode;
     }
     /**
      * If a mode is not detected, then fallback to using the
@@ -383,40 +480,75 @@ const initialize = (userConfig = {}) => {
     const Ionic = (win.Ionic = win.Ionic || {});
     // create the Ionic.config from raw config object (if it exists)
     // and convert Ionic.config into a ConfigApi that has a get() fn
-    const configObj = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, index.configFromSession(win)), { persistConfig: false }), Ionic.config), index.configFromURL(win)), userConfig);
-    index.config.reset(configObj);
-    if (index.config.getBoolean('persistConfig')) {
-        index.saveConfig(win, configObj);
+    const configObj = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, focusVisible.configFromSession(win)), { persistConfig: false }), Ionic.config), focusVisible.configFromURL(win)), userConfig);
+    focusVisible.config.reset(configObj);
+    if (focusVisible.config.getBoolean('persistConfig')) {
+        focusVisible.saveConfig(win, configObj);
     }
     // Setup platforms
     setupPlatforms(win);
-    Ionic.config = index.config;
+    Ionic.config = focusVisible.config;
     /**
      * Check if the mode was set as an attribute on <html>
      * which could have been set by the user, or by pre-rendering
      * otherwise get the mode via config settings, and fallback to md.
      */
-    Ionic.mode = defaultMode = index.config.get('mode', doc.documentElement.getAttribute('mode') || (isPlatform(win, 'ios') ? 'ios' : 'md'));
+    Ionic.mode = defaultMode = focusVisible.config.get('mode', doc.documentElement.getAttribute('mode') || (isPlatform(win, 'ios') ? 'ios' : 'md'));
     /**
      * Check if the theme was set as an attribute on <html>
      * which could have been set by the user, or by pre-rendering
      * otherwise get the theme via config settings, and fallback to md.
      */
-    Ionic.theme = defaultTheme = index.config.get('theme', doc.documentElement.getAttribute('theme') || getDefaultThemeForMode(defaultMode));
-    if (!isModeValidForTheme(defaultMode, defaultTheme)) {
-        printInvalidModeWarning(defaultMode, defaultTheme, configObj);
-        defaultMode = getDefaultModeForTheme(defaultTheme);
-    }
-    index.config.set('mode', defaultMode);
+    Ionic.theme = defaultTheme = focusVisible.config.get('theme', doc.documentElement.getAttribute('theme') || defaultMode);
+    focusVisible.config.set('mode', defaultMode);
     doc.documentElement.setAttribute('mode', defaultMode);
     doc.documentElement.classList.add(defaultMode);
-    index.config.set('theme', defaultTheme);
+    focusVisible.config.set('theme', defaultTheme);
     doc.documentElement.setAttribute('theme', defaultTheme);
     doc.documentElement.classList.add(defaultTheme);
-    if (index.config.getBoolean('_testing')) {
-        index.config.set('animated', false);
+    const customTheme = focusVisible.getCustomTheme(configObj.customTheme, defaultMode);
+    // Apply base theme, or combine with custom theme if provided
+    if (customTheme) {
+        const combinedTheme = focusVisible.applyGlobalTheme(defaultTheme$1, customTheme);
+        // Component styles must be applied after global styles in order
+        // to ensure CSS variables are available for components
+        // like the semantic colors (e.g., --ion-color-shade)
+        focusVisible.applyComponentsTheme(combinedTheme);
+        focusVisible.config.set('customTheme', combinedTheme);
+    }
+    else {
+        focusVisible.applyGlobalTheme(defaultTheme$1);
+        // Component styles must be applied after global styles in order
+        // to ensure CSS variables are available for components
+        // like the semantic colors (e.g., --ion-color-shade)
+        focusVisible.applyComponentsTheme(defaultTheme$1);
+        focusVisible.config.set('customTheme', defaultTheme$1);
+    }
+    /**
+     * Apply any global config values from the custom theme
+     * excluding component-specific overrides.
+     */
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    const _a = (customTheme === null || customTheme === void 0 ? void 0 : customTheme.config) || {}, customGlobalConfig = __rest(_a, ["components"]);
+    Object.entries(customGlobalConfig).forEach(([key, value]) => {
+        const configKey = key;
+        // For object-based config values, we merge with existing settings.
+        if (value !== null && typeof value === 'object') {
+            const existingConfig = focusVisible.config.get(configKey, {});
+            focusVisible.config.set(configKey, Object.assign(Object.assign({}, existingConfig), value));
+            return;
+        }
+        /**
+         * For primitive values (boolean, string, number), we set the
+         * value directly.
+         * This covers global flags like 'rippleEffect' or 'animated'.
+         */
+        focusVisible.config.set(configKey, value);
+    });
+    if (focusVisible.config.getBoolean('_testing')) {
+        focusVisible.config.set('animated', false);
     }
-    index.setMode((elm) => {
+    focusVisible.setMode((elm) => {
         /**
          * Iterate over all the element nodes, to both validate and
          * set the "mode" that is used for determining the styles to
@@ -439,7 +571,7 @@ const initialize = (userConfig = {}) => {
                     return theme;
                 }
                 else if (isIonicElement(elm)) {
-                    index.printIonWarning(`Invalid theme: "${theme}". Supported themes include: "ios" or "md".`);
+                    focusVisible.printIonWarning(`Invalid theme: "${theme}". Supported themes include: "ios" or "md".`);
                 }
             }
             /**
@@ -452,7 +584,7 @@ const initialize = (userConfig = {}) => {
                     return elmMode;
                 }
                 else if (isIonicElement(elm)) {
-                    index.printIonWarning(`Invalid mode: "${elmMode}". Ionic modes can be only "ios" or "md"`);
+                    focusVisible.printIonWarning(`Invalid mode: "${elmMode}". Ionic modes can be only "ios" or "md"`);
                 }
             }
             elm = elm.parentElement;
@@ -468,23 +600,23 @@ const initialize = (userConfig = {}) => {
         }
         rICHandle = rIC(async () => {
             const isHybrid = isPlatform(window, 'hybrid');
-            if (!index.config.getBoolean('_testing')) {
-                Promise.resolve().then(function () { return require('./index-DMJjUhXH.js'); }).then((module) => module.startTapClick(index.config));
+            if (!focusVisible.config.getBoolean('_testing')) {
+                Promise.resolve().then(function () { return require('./index-Cbme57mm.js'); }).then((module) => module.startTapClick(focusVisible.config));
             }
-            if (index.config.getBoolean('statusTap', isHybrid)) {
-                Promise.resolve().then(function () { return require('./status-tap-CTY2dMsZ.js'); }).then((module) => module.startStatusTap());
+            if (focusVisible.config.getBoolean('statusTap', isHybrid)) {
+                Promise.resolve().then(function () { return require('./status-tap-CPZvSRKr.js'); }).then((module) => module.startStatusTap());
             }
-            if (index.config.getBoolean('inputShims', needInputShims())) {
+            if (focusVisible.config.getBoolean('inputShims', needInputShims())) {
                 /**
                  * needInputShims() ensures that only iOS and Android
                  * platforms proceed into this block.
                  */
                 const platform = isPlatform(window, 'ios') ? 'ios' : 'android';
-                Promise.resolve().then(function () { return require('./input-shims-Dn33gFln.js'); }).then((module) => module.startInputShims(index.config, platform));
+                Promise.resolve().then(function () { return require('./input-shims-eCRI_jn9.js'); }).then((module) => module.startInputShims(focusVisible.config, platform));
             }
             const hardwareBackButtonModule = await Promise.resolve().then(function () { return hardwareBackButton; });
             const supportsHardwareBackButtonEvents = isHybrid || shouldUseCloseWatcher();
-            if (index.config.getBoolean('hardwareBackButton', supportsHardwareBackButtonEvents)) {
+            if (focusVisible.config.getBoolean('hardwareBackButton', supportsHardwareBackButtonEvents)) {
                 hardwareBackButtonModule.startHardwareBackButton();
             }
             else {
@@ -493,14 +625,14 @@ const initialize = (userConfig = {}) => {
                  * then the close watcher will not be used.
                  */
                 if (shouldUseCloseWatcher()) {
-                    index.printIonWarning('[ion-app] - experimentalCloseWatcher was set to `true`, but hardwareBackButton was set to `false`. Both config options must be `true` for the Close Watcher API to be used.');
+                    focusVisible.printIonWarning('[ion-app] - experimentalCloseWatcher was set to `true`, but hardwareBackButton was set to `false`. Both config options must be `true` for the Close Watcher API to be used.');
                 }
                 hardwareBackButtonModule.blockHardwareBackButton();
             }
             if (typeof window !== 'undefined') {
-                Promise.resolve().then(function () { return require('./keyboard-Bhav6x-R.js'); }).then((module) => module.startKeyboardAssist(window));
+                Promise.resolve().then(function () { return require('./keyboard-BCj7bSvQ.js'); }).then((module) => module.startKeyboardAssist(window));
             }
-            Promise.resolve().then(function () { return require('./focus-visible-BIj-I3-C.js'); }).then((module) => module.getOrInitFocusVisibleUtility());
+            Promise.resolve().then(function () { return require('./index-BDthk8R7.js'); }).then(function (n) { return n.focusVisible; }).then((module) => module.getOrInitFocusVisibleUtility());
             // Reset handle once executed
             rICHandle = undefined;
         });