refactor(tabs): export correct interface

core/api.txt

@@ -1362,8 +1362,8 @@ ion-tabs,shadow
 ion-tabs,method,getSelected,getSelected() => Promise<string | undefined>
 ion-tabs,method,getTab,getTab(tab: string | HTMLIonTabElement) => Promise<HTMLIonTabElement | undefined>
 ion-tabs,method,select,select(tab: string | HTMLIonTabElement) => Promise<boolean>
-ion-tabs,event,ionTabsDidChange,{ tab: string; },false
-ion-tabs,event,ionTabsWillChange,{ tab: string; },false
+ion-tabs,event,ionTabsDidChange,TabsEventDetail,false
+ion-tabs,event,ionTabsWillChange,TabsEventDetail,false
 
 ion-text,shadow
 ion-text,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record<never, never> | undefined,undefined,false,true

core/package-lock.json

@@ -9,7 +9,7 @@
       "version": "7.6.6",
       "license": "MIT",
       "dependencies": {
-        "@stencil/core": "^4.12.0",
+        "@stencil/core": "^4.10.0",
         "ionicons": "^7.2.2",
         "tslib": "^2.1.0"
       },
@@ -17,7 +17,7 @@
         "@axe-core/playwright": "^4.8.4",
         "@capacitor/core": "^5.6.0",
         "@capacitor/haptics": "^5.0.6",
-        "@capacitor/keyboard": "^5.0.8",
+        "@capacitor/keyboard": "^5.0.7",
         "@capacitor/status-bar": "^5.0.6",
         "@ionic/eslint-config": "^0.3.0",
         "@ionic/prettier-config": "^2.0.0",
@@ -26,7 +26,7 @@
         "@rollup/plugin-virtual": "^2.0.3",
         "@stencil/angular-output-target": "^0.8.3",
         "@stencil/react-output-target": "^0.5.3",
-        "@stencil/sass": "^3.0.9",
+        "@stencil/sass": "^3.0.8",
         "@stencil/vue-output-target": "^0.8.7",
         "@types/jest": "^29.5.6",
         "@types/node": "^14.6.0",
@@ -652,9 +652,9 @@
       }
     },
     "node_modules/@capacitor/keyboard": {
-      "version": "5.0.8",
-      "resolved": "https://registry.npmjs.org/@capacitor/keyboard/-/keyboard-5.0.8.tgz",
-      "integrity": "sha512-XYyBzGlzjgLPqyPVdu5McGLYV6+G2efVR4I3l5cF1B27M6U/oFqv9CQU74WNG08nee28bfccboNpv6eWCLYn1A==",
+      "version": "5.0.7",
+      "resolved": "https://registry.npmjs.org/@capacitor/keyboard/-/keyboard-5.0.7.tgz",
+      "integrity": "sha512-+6lW8z2nXTM2NOG7D7pOasCfIGicz26+EeDRXIj5AtJibbjwtE1Q5GIY+qGHgzpmwOF0qmcrGJBz4zagDwUapg==",
       "dev": true,
       "peerDependencies": {
         "@capacitor/core": "^5.0.0"
@@ -1825,9 +1825,9 @@
       }
     },
     "node_modules/@stencil/core": {
-      "version": "4.12.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
-      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg==",
+      "version": "4.10.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.10.0.tgz",
+      "integrity": "sha512-7lDTPY1IxXN2/C+wQPHt3e/dYgY4YgelA8MxOsU3ZftXtpzWad/QNWhSAtKisJMrSjQh41jMDOgD0yLBwV6E7w==",
       "bin": {
         "stencil": "bin/stencil"
       },
@@ -1846,9 +1846,9 @@
       }
     },
     "node_modules/@stencil/sass": {
-      "version": "3.0.9",
-      "resolved": "https://registry.npmjs.org/@stencil/sass/-/sass-3.0.9.tgz",
-      "integrity": "sha512-GtPMjf5r4/BVBCO3LvcoMSIfOa6T+0wq+SrTGEilC4NCZpuZdAlZffWxXi80caZ1jDclwdzJ2qGwEgCAfvGoNA==",
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/@stencil/sass/-/sass-3.0.8.tgz",
+      "integrity": "sha512-QJUG4Dr/b3wSizViwQXorrk1PJzxOsKkq5hSqtUHc3NNG3iomC4DQFYGeu15yNfoCDBtt4qkyHSCynsekQ8F6A==",
       "dev": true,
       "engines": {
         "node": ">=12.0.0",
@@ -11340,9 +11340,9 @@
       "requires": {}
     },
     "@capacitor/keyboard": {
-      "version": "5.0.8",
-      "resolved": "https://registry.npmjs.org/@capacitor/keyboard/-/keyboard-5.0.8.tgz",
-      "integrity": "sha512-XYyBzGlzjgLPqyPVdu5McGLYV6+G2efVR4I3l5cF1B27M6U/oFqv9CQU74WNG08nee28bfccboNpv6eWCLYn1A==",
+      "version": "5.0.7",
+      "resolved": "https://registry.npmjs.org/@capacitor/keyboard/-/keyboard-5.0.7.tgz",
+      "integrity": "sha512-+6lW8z2nXTM2NOG7D7pOasCfIGicz26+EeDRXIj5AtJibbjwtE1Q5GIY+qGHgzpmwOF0qmcrGJBz4zagDwUapg==",
       "dev": true,
       "requires": {}
     },
@@ -12184,9 +12184,9 @@
       "requires": {}
     },
     "@stencil/core": {
-      "version": "4.12.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
-      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg=="
+      "version": "4.10.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.10.0.tgz",
+      "integrity": "sha512-7lDTPY1IxXN2/C+wQPHt3e/dYgY4YgelA8MxOsU3ZftXtpzWad/QNWhSAtKisJMrSjQh41jMDOgD0yLBwV6E7w=="
     },
     "@stencil/react-output-target": {
       "version": "0.5.3",
@@ -12196,9 +12196,9 @@
       "requires": {}
     },
     "@stencil/sass": {
-      "version": "3.0.9",
-      "resolved": "https://registry.npmjs.org/@stencil/sass/-/sass-3.0.9.tgz",
-      "integrity": "sha512-GtPMjf5r4/BVBCO3LvcoMSIfOa6T+0wq+SrTGEilC4NCZpuZdAlZffWxXi80caZ1jDclwdzJ2qGwEgCAfvGoNA==",
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/@stencil/sass/-/sass-3.0.8.tgz",
+      "integrity": "sha512-QJUG4Dr/b3wSizViwQXorrk1PJzxOsKkq5hSqtUHc3NNG3iomC4DQFYGeu15yNfoCDBtt4qkyHSCynsekQ8F6A==",
       "dev": true,
       "requires": {}
     },

core/package.json

@@ -31,7 +31,7 @@
     "loader/"
   ],
   "dependencies": {
-    "@stencil/core": "^4.12.0",
+    "@stencil/core": "^4.10.0",
     "ionicons": "^7.2.2",
     "tslib": "^2.1.0"
   },
@@ -39,7 +39,7 @@
     "@axe-core/playwright": "^4.8.4",
     "@capacitor/core": "^5.6.0",
     "@capacitor/haptics": "^5.0.6",
-    "@capacitor/keyboard": "^5.0.8",
+    "@capacitor/keyboard": "^5.0.7",
     "@capacitor/status-bar": "^5.0.6",
     "@ionic/eslint-config": "^0.3.0",
     "@ionic/prettier-config": "^2.0.0",
@@ -48,7 +48,7 @@
     "@rollup/plugin-virtual": "^2.0.3",
     "@stencil/angular-output-target": "^0.8.3",
     "@stencil/react-output-target": "^0.5.3",
-    "@stencil/sass": "^3.0.9",
+    "@stencil/sass": "^3.0.8",
     "@stencil/vue-output-target": "^0.8.7",
     "@types/jest": "^29.5.6",
     "@types/node": "^14.6.0",

core/src/components.d.ts

@@ -38,6 +38,7 @@ import { SegmentButtonLayout } from "./components/segment-button/segment-button-
 import { SelectChangeEventDetail, SelectCompareFn, SelectInterface } from "./components/select/select-interface";
 import { SelectPopoverOption } from "./components/select-popover/select-popover-interface";
 import { TabBarChangedEventDetail, TabButtonClickEventDetail, TabButtonLayout } from "./components/tab-bar/tab-bar-interface";
+import { TabsEventDetail } from "./components/tabs/tabs-interface";
 import { TextareaChangeEventDetail, TextareaInputEventDetail } from "./components/textarea/textarea-interface";
 import { ToastButton, ToastDismissOptions, ToastLayout, ToastPosition, ToastPresentOptions, ToastSwipeGestureDirection } from "./components/toast/toast-interface";
 import { ToggleChangeEventDetail } from "./components/toggle/toggle-interface";
@@ -74,6 +75,7 @@ export { SegmentButtonLayout } from "./components/segment-button/segment-button-
 export { SelectChangeEventDetail, SelectCompareFn, SelectInterface } from "./components/select/select-interface";
 export { SelectPopoverOption } from "./components/select-popover/select-popover-interface";
 export { TabBarChangedEventDetail, TabButtonClickEventDetail, TabButtonLayout } from "./components/tab-bar/tab-bar-interface";
+export { TabsEventDetail } from "./components/tabs/tabs-interface";
 export { TextareaChangeEventDetail, TextareaInputEventDetail } from "./components/textarea/textarea-interface";
 export { ToastButton, ToastDismissOptions, ToastLayout, ToastPosition, ToastPresentOptions, ToastSwipeGestureDirection } from "./components/toast/toast-interface";
 export { ToggleChangeEventDetail } from "./components/toggle/toggle-interface";
@@ -4503,8 +4505,8 @@ declare global {
     };
     interface HTMLIonTabsElementEventMap {
         "ionNavWillLoad": void;
-        "ionTabsWillChange": { tab: string };
-        "ionTabsDidChange": { tab: string };
+        "ionTabsWillChange": TabsEventDetail;
+        "ionTabsDidChange": TabsEventDetail;
     }
     interface HTMLIonTabsElement extends Components.IonTabs, HTMLStencilElement {
         addEventListener<K extends keyof HTMLIonTabsElementEventMap>(type: K, listener: (this: HTMLIonTabsElement, ev: IonTabsCustomEvent<HTMLIonTabsElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -7711,11 +7713,11 @@ declare namespace LocalJSX {
         /**
           * Emitted when the navigation has finished transitioning to a new component.
          */
-        "onIonTabsDidChange"?: (event: IonTabsCustomEvent<{ tab: string }>) => void;
+        "onIonTabsDidChange"?: (event: IonTabsCustomEvent<TabsEventDetail>) => void;
         /**
           * Emitted when the navigation is about to transition to a new component.
          */
-        "onIonTabsWillChange"?: (event: IonTabsCustomEvent<{ tab: string }>) => void;
+        "onIonTabsWillChange"?: (event: IonTabsCustomEvent<TabsEventDetail>) => void;
         "useRouter"?: boolean;
     }
     interface IonText {

core/src/components/action-sheet/action-sheet-interface.ts

@@ -1,4 +1,4 @@
-import type { AnimationBuilder, LiteralUnion, Mode } from '../../interface';
+import type { AnimationBuilder, Mode } from '../../interface';
 
 export interface ActionSheetOptions {
   header?: string;
@@ -19,7 +19,7 @@ export interface ActionSheetOptions {
 
 export interface ActionSheetButton<T = any> {
   text?: string;
-  role?: LiteralUnion<'cancel' | 'destructive' | 'selected', string>;
+  role?: 'cancel' | 'destructive' | 'selected' | string;
   icon?: string;
   cssClass?: string | string[];
   id?: string;

core/src/components/alert/alert-interface.ts

@@ -1,4 +1,4 @@
-import type { AnimationBuilder, LiteralUnion, Mode, TextFieldTypes } from '../../interface';
+import type { AnimationBuilder, Mode, TextFieldTypes } from '../../interface';
 import type { IonicSafeString } from '../../utils/sanitization';
 
 export interface AlertOptions {
@@ -45,7 +45,7 @@ type AlertButtonOverlayHandler = boolean | void | { [key: string]: any };
 
 export interface AlertButton {
   text: string;
-  role?: LiteralUnion<'cancel' | 'destructive', string>;
+  role?: 'cancel' | 'destructive' | string;
   cssClass?: string | string[];
   id?: string;
   htmlAttributes?: { [key: string]: any };

core/src/components/tabs/tabs-interface.ts

@@ -1,4 +1,8 @@
+export interface TabsEventDetail {
+  tab: string;
+}
+
 export interface TabsCustomEvent extends CustomEvent {
-  detail: { tab: string };
+  detail: TabsEventDetail;
   target: HTMLIonTabsElement;
 }

core/src/components/tabs/tabs.tsx

@@ -4,6 +4,8 @@ import { Component, Element, Event, Host, Method, Prop, State, h } from '@stenci
 import type { NavOutlet, RouteID, RouteWrite } from '../router/utils/interface';
 import type { TabButtonClickEventDetail } from '../tab-bar/tab-bar-interface';
 
+import type { TabsEventDetail } from './tabs-interface';
+
 /**
  * @slot - Content is placed between the named slots if provided without a slot.
  * @slot top - Content is placed at the top of the screen.
@@ -34,12 +36,12 @@ export class Tabs implements NavOutlet {
   /**
    * Emitted when the navigation is about to transition to a new component.
    */
-  @Event({ bubbles: false }) ionTabsWillChange!: EventEmitter<{ tab: string }>;
+  @Event({ bubbles: false }) ionTabsWillChange!: EventEmitter<TabsEventDetail>;
 
   /**
    * Emitted when the navigation has finished transitioning to a new component.
    */
-  @Event({ bubbles: false }) ionTabsDidChange!: EventEmitter<{ tab: string }>;
+  @Event({ bubbles: false }) ionTabsDidChange!: EventEmitter<TabsEventDetail>;
 
   async componentWillLoad() {
     if (!this.useRouter) {

core/src/components/toast/toast-interface.ts

@@ -1,4 +1,4 @@
-import type { AnimationBuilder, Color, LiteralUnion, Mode } from '../../interface';
+import type { AnimationBuilder, Color, Mode } from '../../interface';
 import type { IonicSafeString } from '../../utils/sanitization';
 
 export interface ToastOptions {
@@ -33,7 +33,8 @@ export interface ToastButton {
   text?: string;
   icon?: string;
   side?: 'start' | 'end';
-  role?: LiteralUnion<'cancel', string>;
+  role?: 'cancel' | string;
+
   /**
    * @deprecated Use the toast button's CSS Shadow Parts instead.
    */

core/src/interface.d.ts

@@ -131,7 +131,7 @@ export type PredefinedColors =
   | 'medium'
   | 'dark';
 
-export type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
+type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
 
 export type Color = LiteralUnion<PredefinedColors, string>;
 export type Mode = 'ios' | 'md';

packages/react-router/rollup.config.mjs

@@ -1,5 +1,4 @@
 import typescript from '@rollup/plugin-typescript';
-const external = ['react', 'react-dom', 'react-router', 'react-router-dom', 'history', 'tslib'];
 
 export default {
   input: 'src/index.ts',
@@ -10,8 +9,8 @@ export default {
       sourcemap: true,
     }
   ],
+  external: (id) => !/^(\.|\/)/.test(id),
   plugins: [
     typescript(),
   ],
-  external: id => external.includes(id) || id.startsWith('@ionic/core') || id.startsWith('ionicons') || id.startsWith('@ionic/react'),
 };

packages/react/rollup.config.mjs

@@ -1,5 +1,4 @@
 import typescript from '@rollup/plugin-typescript';
-const external = ['react', 'react-dom', 'react-router', 'react-router-dom', 'history', 'tslib'];
 
 export default {
   input: 'src/index.ts',
@@ -12,8 +11,8 @@ export default {
       sourcemap: true,
     }
   ],
+  external: (id) => !/^(\.|\/)/.test(id),
   plugins: [
     typescript(),
   ],
-  external: id => external.includes(id) || id.startsWith('@ionic/core') || id.startsWith('ionicons'),
 };