@ionic/react 7.5.3-dev.11698856380.18896dcd → 7.5.3-dev.11698858201.14165f23

package/dist/components/index.js

@@ -0,0 +1,126 @@
+"use strict";
+import { initialize } from "@ionic/core/components";
+export {
+  createAnimation,
+  createGesture,
+  iosTransitionAnimation,
+  mdTransitionAnimation,
+  IonicSlides,
+  getTimeGivenProgression,
+  getIonPageElement,
+  openURL,
+  Animation,
+  AnimationBuilder,
+  AnimationCallbackOptions,
+  AnimationDirection,
+  AnimationFill,
+  AnimationKeyFrames,
+  AnimationLifecycle,
+  Gesture,
+  GestureConfig,
+  GestureDetail,
+  NavComponentWithProps,
+  SpinnerTypes,
+  AccordionGroupCustomEvent,
+  AccordionGroupChangeEventDetail,
+  BreadcrumbCustomEvent,
+  BreadcrumbCollapsedClickEventDetail,
+  ActionSheetOptions,
+  ActionSheetButton,
+  AlertOptions,
+  AlertInput,
+  AlertButton,
+  BackButtonEvent,
+  CheckboxCustomEvent,
+  CheckboxChangeEventDetail,
+  DatetimeCustomEvent,
+  DatetimeChangeEventDetail,
+  InfiniteScrollCustomEvent,
+  InputCustomEvent,
+  InputChangeEventDetail,
+  ItemReorderEventDetail,
+  ItemReorderCustomEvent,
+  ItemSlidingCustomEvent,
+  IonicSafeString,
+  LoadingOptions,
+  MenuCustomEvent,
+  ModalOptions,
+  NavCustomEvent,
+  PickerOptions,
+  PickerButton,
+  PickerColumn,
+  PickerColumnOption,
+  PopoverOptions,
+  RadioGroupCustomEvent,
+  RadioGroupChangeEventDetail,
+  RangeCustomEvent,
+  RangeChangeEventDetail,
+  RangeKnobMoveStartEventDetail,
+  RangeKnobMoveEndEventDetail,
+  RefresherCustomEvent,
+  RefresherEventDetail,
+  RouterEventDetail,
+  RouterCustomEvent,
+  ScrollBaseCustomEvent,
+  ScrollBaseDetail,
+  ScrollDetail,
+  ScrollCustomEvent,
+  SearchbarCustomEvent,
+  SearchbarChangeEventDetail,
+  SearchbarInputEventDetail,
+  SegmentChangeEventDetail,
+  SegmentCustomEvent,
+  SegmentValue,
+  SelectChangeEventDetail,
+  SelectCustomEvent,
+  TabsCustomEvent,
+  TextareaChangeEventDetail,
+  TextareaCustomEvent,
+  ToastOptions,
+  ToastButton,
+  ToastLayout,
+  ToggleChangeEventDetail,
+  ToggleCustomEvent,
+  TransitionOptions
+} from "@ionic/core/components";
+export * from "./proxies";
+export * from "./routing-proxies";
+export { IonAlert } from "./IonAlert";
+export { IonLoading } from "./IonLoading";
+export * from "./IonToast";
+export { IonPicker } from "./IonPicker";
+export * from "./IonActionSheet";
+export { IonModal } from "./IonModal";
+export { IonPopover } from "./IonPopover";
+export { IonApp } from "./IonApp";
+export { IonPage } from "./IonPage";
+export { IonNav } from "./navigation/IonNav";
+export { IonTabsContext, IonTabsContextState } from "./navigation/IonTabsContext";
+export { IonTabs } from "./navigation/IonTabs";
+export { IonTabBar } from "./navigation/IonTabBar";
+export { IonTabButton } from "./navigation/IonTabButton";
+export { IonBackButton } from "./navigation/IonBackButton";
+export { IonRouterOutlet } from "./IonRouterOutlet";
+export { IonIcon } from "./IonIcon";
+export * from "./IonRoute";
+export * from "./IonRedirect";
+export * from "./IonRouterContext";
+export { isPlatform, getPlatforms, getConfig } from "./utils";
+export * from "./hrefprops";
+export { CreateAnimation } from "./CreateAnimation";
+export { useIonActionSheet, UseIonActionSheetResult } from "../hooks/useIonActionSheet";
+export { useIonAlert, UseIonAlertResult } from "../hooks/useIonAlert";
+export { useIonToast, UseIonToastResult } from "../hooks/useIonToast";
+export { useIonModal, UseIonModalResult } from "../hooks/useIonModal";
+export { useIonPopover, UseIonPopoverResult } from "../hooks/useIonPopover";
+export { useIonPicker, UseIonPickerResult } from "../hooks/useIonPicker";
+export { useIonLoading, UseIonLoadingResult } from "../hooks/useIonLoading";
+export const setupIonicReact = (config = {}) => {
+  if (typeof document !== "undefined") {
+    document.documentElement.classList.add("ion-ce");
+  }
+  initialize({
+    ...config
+  });
+};
+//# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/index.ts"],
+  "sourcesContent": ["import type { IonicConfig } from '@ionic/core/components';\nimport { initialize } from '@ionic/core/components';\n\nexport {\n  // UTILS\n  createAnimation,\n  createGesture,\n  iosTransitionAnimation,\n  mdTransitionAnimation,\n  IonicSlides,\n  getTimeGivenProgression,\n  getIonPageElement,\n  openURL,\n\n  // TYPES\n  Animation,\n  AnimationBuilder,\n  AnimationCallbackOptions,\n  AnimationDirection,\n  AnimationFill,\n  AnimationKeyFrames,\n  AnimationLifecycle,\n  Gesture,\n  GestureConfig,\n  GestureDetail,\n  NavComponentWithProps,\n  SpinnerTypes,\n  AccordionGroupCustomEvent,\n  AccordionGroupChangeEventDetail,\n  BreadcrumbCustomEvent,\n  BreadcrumbCollapsedClickEventDetail,\n  ActionSheetOptions,\n  ActionSheetButton,\n  AlertOptions,\n  AlertInput,\n  AlertButton,\n  BackButtonEvent,\n  CheckboxCustomEvent,\n  CheckboxChangeEventDetail,\n  DatetimeCustomEvent,\n  DatetimeChangeEventDetail,\n  InfiniteScrollCustomEvent,\n  InputCustomEvent,\n  InputChangeEventDetail,\n  ItemReorderEventDetail,\n  ItemReorderCustomEvent,\n  ItemSlidingCustomEvent,\n  IonicSafeString,\n  LoadingOptions,\n  MenuCustomEvent,\n  ModalOptions,\n  NavCustomEvent,\n  PickerOptions,\n  PickerButton,\n  PickerColumn,\n  PickerColumnOption,\n  PopoverOptions,\n  RadioGroupCustomEvent,\n  RadioGroupChangeEventDetail,\n  RangeCustomEvent,\n  RangeChangeEventDetail,\n  RangeKnobMoveStartEventDetail,\n  RangeKnobMoveEndEventDetail,\n  RefresherCustomEvent,\n  RefresherEventDetail,\n  RouterEventDetail,\n  RouterCustomEvent,\n  ScrollBaseCustomEvent,\n  ScrollBaseDetail,\n  ScrollDetail,\n  ScrollCustomEvent,\n  SearchbarCustomEvent,\n  SearchbarChangeEventDetail,\n  SearchbarInputEventDetail,\n  SegmentChangeEventDetail,\n  SegmentCustomEvent,\n  SegmentValue,\n  SelectChangeEventDetail,\n  SelectCustomEvent,\n  TabsCustomEvent,\n  TextareaChangeEventDetail,\n  TextareaCustomEvent,\n  ToastOptions,\n  ToastButton,\n  ToastLayout,\n  ToggleChangeEventDetail,\n  ToggleCustomEvent,\n  TransitionOptions,\n} from '@ionic/core/components';\n\nexport * from './proxies';\nexport * from './routing-proxies';\n\n// createControllerComponent\nexport { IonAlert } from './IonAlert';\nexport { IonLoading } from './IonLoading';\nexport * from './IonToast';\nexport { IonPicker } from './IonPicker';\n\n// createOverlayComponent\nexport * from './IonActionSheet';\nexport { IonModal } from './IonModal';\nexport { IonPopover } from './IonPopover';\n\n// Custom Components\nexport { IonApp } from './IonApp';\nexport { IonPage } from './IonPage';\nexport { IonNav } from './navigation/IonNav';\nexport { IonTabsContext, IonTabsContextState } from './navigation/IonTabsContext';\nexport { IonTabs } from './navigation/IonTabs';\nexport { IonTabBar } from './navigation/IonTabBar';\nexport { IonTabButton } from './navigation/IonTabButton';\nexport { IonBackButton } from './navigation/IonBackButton';\nexport { IonRouterOutlet } from './IonRouterOutlet';\nexport { IonIcon } from './IonIcon';\nexport * from './IonRoute';\nexport * from './IonRedirect';\nexport * from './IonRouterContext';\n\n// Utils\nexport { isPlatform, getPlatforms, getConfig } from './utils';\nexport * from './hrefprops';\n\n// Ionic Animations\nexport { CreateAnimation } from './CreateAnimation';\n\n// Hooks\nexport { useIonActionSheet, UseIonActionSheetResult } from '../hooks/useIonActionSheet';\nexport { useIonAlert, UseIonAlertResult } from '../hooks/useIonAlert';\nexport { useIonToast, UseIonToastResult } from '../hooks/useIonToast';\nexport { useIonModal, UseIonModalResult } from '../hooks/useIonModal';\nexport { useIonPopover, UseIonPopoverResult } from '../hooks/useIonPopover';\nexport { useIonPicker, UseIonPickerResult } from '../hooks/useIonPicker';\nexport { useIonLoading, UseIonLoadingResult } from '../hooks/useIonLoading';\n\nexport const setupIonicReact = (config: IonicConfig = {}) => {\n  /**\n   * By default Ionic Framework hides elements that\n   * are not hydrated, but in the CE build there is no\n   * hydration.\n   * TODO FW-2797: Remove when all integrations have been\n   * migrated to CE build.\n   */\n  if (typeof (document as any) !== 'undefined') {\n    document.documentElement.classList.add('ion-ce');\n  }\n\n  initialize({\n    ...config,\n  });\n};\n"],
+  "mappings": ";AACA,SAAS,kBAAkB;AAE3B;AAAA,EAEE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAGA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,cAAc;AACd,cAAc;AAGd,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAC3B,cAAc;AACd,SAAS,iBAAiB;AAG1B,cAAc;AACd,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAG3B,SAAS,cAAc;AACvB,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,gBAAgB,2BAA2B;AACpD,SAAS,eAAe;AACxB,SAAS,iBAAiB;AAC1B,SAAS,oBAAoB;AAC7B,SAAS,qBAAqB;AAC9B,SAAS,uBAAuB;AAChC,SAAS,eAAe;AACxB,cAAc;AACd,cAAc;AACd,cAAc;AAGd,SAAS,YAAY,cAAc,iBAAiB;AACpD,cAAc;AAGd,SAAS,uBAAuB;AAGhC,SAAS,mBAAmB,+BAA+B;AAC3D,SAAS,aAAa,yBAAyB;AAC/C,SAAS,aAAa,yBAAyB;AAC/C,SAAS,aAAa,yBAAyB;AAC/C,SAAS,eAAe,2BAA2B;AACnD,SAAS,cAAc,0BAA0B;AACjD,SAAS,eAAe,2BAA2B;AAE5C,aAAM,kBAAkB,CAAC,SAAsB,CAAC,MAAM;AAQ3D,MAAI,OAAQ,aAAqB,aAAa;AAC5C,aAAS,gBAAgB,UAAU,IAAI,QAAQ;AAAA,EACjD;AAEA,aAAW;AAAA,IACT,GAAG;AAAA,EACL,CAAC;AACH;",
+  "names": []
+}

package/dist/components/inner-proxies.js

@@ -0,0 +1,30 @@
+"use strict";
+import { defineCustomElement as defineIonApp } from "@ionic/core/components/ion-app.js";
+import { defineCustomElement as defineIonBackButton } from "@ionic/core/components/ion-back-button.js";
+import { defineCustomElement as defineIonRouterOutlet } from "@ionic/core/components/ion-router-outlet.js";
+import { defineCustomElement as defineIonTabBar } from "@ionic/core/components/ion-tab-bar.js";
+import { defineCustomElement as defineIonTabButton } from "@ionic/core/components/ion-tab-button.js";
+import { defineCustomElement as defineIonIcon } from "ionicons/components/ion-icon.js";
+import { createReactComponent } from "./react-component-lib";
+export const IonTabButtonInner = /* @__PURE__ */ createReactComponent("ion-tab-button", void 0, void 0, defineIonTabButton);
+export const IonTabBarInner = /* @__PURE__ */ createReactComponent(
+  "ion-tab-bar",
+  void 0,
+  void 0,
+  defineIonTabBar
+);
+export const IonBackButtonInner = /* @__PURE__ */ createReactComponent("ion-back-button", void 0, void 0, defineIonBackButton);
+export const IonRouterOutletInner = /* @__PURE__ */ createReactComponent("ion-router-outlet", void 0, void 0, defineIonRouterOutlet);
+export const IonAppInner = /* @__PURE__ */ createReactComponent(
+  "ion-app",
+  void 0,
+  void 0,
+  defineIonApp
+);
+export const IonIconInner = /* @__PURE__ */ createReactComponent(
+  "ion-icon",
+  void 0,
+  void 0,
+  defineIonIcon
+);
+//# sourceMappingURL=inner-proxies.js.map

package/dist/components/inner-proxies.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/inner-proxies.ts"],
+  "sourcesContent": ["import type { JSX } from '@ionic/core/components';\nimport { defineCustomElement as defineIonApp } from '@ionic/core/components/ion-app.js';\nimport { defineCustomElement as defineIonBackButton } from '@ionic/core/components/ion-back-button.js';\nimport { defineCustomElement as defineIonRouterOutlet } from '@ionic/core/components/ion-router-outlet.js';\nimport { defineCustomElement as defineIonTabBar } from '@ionic/core/components/ion-tab-bar.js';\nimport { defineCustomElement as defineIonTabButton } from '@ionic/core/components/ion-tab-button.js';\nimport type { JSX as IoniconsJSX } from 'ionicons';\nimport { defineCustomElement as defineIonIcon } from 'ionicons/components/ion-icon.js';\n\nimport { /*@__PURE__*/ createReactComponent } from './react-component-lib';\n\nexport const IonTabButtonInner = /*@__PURE__*/ createReactComponent<\n  JSX.IonTabButton & { onIonTabButtonClick?: (e: CustomEvent) => void },\n  HTMLIonTabButtonElement\n>('ion-tab-button', undefined, undefined, defineIonTabButton);\nexport const IonTabBarInner = /*@__PURE__*/ createReactComponent<JSX.IonTabBar, HTMLIonTabBarElement>(\n  'ion-tab-bar',\n  undefined,\n  undefined,\n  defineIonTabBar\n);\nexport const IonBackButtonInner = /*@__PURE__*/ createReactComponent<\n  Omit<JSX.IonBackButton, 'icon'>,\n  HTMLIonBackButtonElement\n>('ion-back-button', undefined, undefined, defineIonBackButton);\nexport const IonRouterOutletInner = /*@__PURE__*/ createReactComponent<\n  JSX.IonRouterOutlet & {\n    setRef?: (val: HTMLIonRouterOutletElement) => void;\n    forwardedRef?: React.ForwardedRef<HTMLIonRouterOutletElement>;\n  },\n  HTMLIonRouterOutletElement\n>('ion-router-outlet', undefined, undefined, defineIonRouterOutlet);\n\nexport const IonAppInner = /*@__PURE__*/ createReactComponent<JSX.IonApp, HTMLIonAppElement>(\n  'ion-app',\n  undefined,\n  undefined,\n  defineIonApp\n);\n\n// ionicons\nexport const IonIconInner = /*@__PURE__*/ createReactComponent<IoniconsJSX.IonIcon, HTMLIonIconElement>(\n  'ion-icon',\n  undefined,\n  undefined,\n  defineIonIcon\n);\n"],
+  "mappings": ";AACA,SAAS,uBAAuB,oBAAoB;AACpD,SAAS,uBAAuB,2BAA2B;AAC3D,SAAS,uBAAuB,6BAA6B;AAC7D,SAAS,uBAAuB,uBAAuB;AACvD,SAAS,uBAAuB,0BAA0B;AAE1D,SAAS,uBAAuB,qBAAqB;AAErD,SAAuB,4BAA4B;AAE5C,aAAM,oBAAkC,qCAG7C,kBAAkB,QAAW,QAAW,kBAAkB;AACrD,aAAM,iBAA+B;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AACO,aAAM,qBAAmC,qCAG9C,mBAAmB,QAAW,QAAW,mBAAmB;AACvD,aAAM,uBAAqC,qCAMhD,qBAAqB,QAAW,QAAW,qBAAqB;AAE3D,aAAM,cAA4B;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAGO,aAAM,eAA6B;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;",
+  "names": []
+}

package/dist/components/navigation/IonBackButton.js

@@ -0,0 +1,31 @@
+"use strict";
+import React from "react";
+import { NavContext } from "../../contexts/NavContext";
+import { IonBackButtonInner } from "../inner-proxies";
+export const IonBackButton = /* @__PURE__ */ (() => class extends React.Component {
+  constructor() {
+    super(...arguments);
+    this.clickButton = (e) => {
+      if (e.target && e.target.closest("ion-nav") !== null) {
+        return;
+      }
+      const { defaultHref, routerAnimation } = this.props;
+      if (this.context.hasIonicRouter()) {
+        e.stopPropagation();
+        this.context.goBack(defaultHref, routerAnimation);
+      } else if (defaultHref !== void 0) {
+        window.location.href = defaultHref;
+      }
+    };
+  }
+  render() {
+    return /* @__PURE__ */ React.createElement(IonBackButtonInner, { onClick: this.clickButton, ...this.props });
+  }
+  static get displayName() {
+    return "IonBackButton";
+  }
+  static get contextType() {
+    return NavContext;
+  }
+})();
+//# sourceMappingURL=IonBackButton.js.map

package/dist/components/navigation/IonBackButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/navigation/IonBackButton.tsx"],
+  "sourcesContent": ["import type { JSX as LocalJSX } from '@ionic/core/components';\nimport React from 'react';\n\nimport { NavContext } from '../../contexts/NavContext';\nimport type { IonicReactProps } from '../IonicReactProps';\nimport { IonBackButtonInner } from '../inner-proxies';\n\ntype Props = Omit<LocalJSX.IonBackButton, 'icon'> &\n  IonicReactProps & {\n    icon?:\n      | {\n          ios: string;\n          md: string;\n        }\n      | string;\n    ref?: React.Ref<HTMLIonBackButtonElement>;\n  };\n\nexport const IonBackButton = /*@__PURE__*/ (() =>\n  class extends React.Component<Props> {\n    context!: React.ContextType<typeof NavContext>;\n\n    clickButton = (e: React.MouseEvent) => {\n      /**\n       * If ion-back-button is being used inside\n       * of ion-nav then we should not interact with\n       * the router.\n       */\n      if (e.target && (e.target as HTMLElement).closest('ion-nav') !== null) {\n        return;\n      }\n\n      const { defaultHref, routerAnimation } = this.props;\n\n      if (this.context.hasIonicRouter()) {\n        e.stopPropagation();\n        this.context.goBack(defaultHref, routerAnimation);\n      } else if (defaultHref !== undefined) {\n        window.location.href = defaultHref;\n      }\n    };\n\n    render() {\n      return <IonBackButtonInner onClick={this.clickButton} {...this.props}></IonBackButtonInner>;\n    }\n\n    static get displayName() {\n      return 'IonBackButton';\n    }\n\n    static get contextType() {\n      return NavContext;\n    }\n  })();\n"],
+  "mappings": ";AACA,OAAO,WAAW;AAElB,SAAS,kBAAkB;AAE3B,SAAS,0BAA0B;AAa5B,aAAM,gBAA+B,uBAC1C,cAAc,MAAM,UAAiB;AAAA,EAArC;AAAA;AAGE,uBAAc,CAAC,MAAwB;AAMrC,UAAI,EAAE,UAAW,EAAE,OAAuB,QAAQ,SAAS,MAAM,MAAM;AACrE;AAAA,MACF;AAEA,YAAM,EAAE,aAAa,gBAAgB,IAAI,KAAK;AAE9C,UAAI,KAAK,QAAQ,eAAe,GAAG;AACjC,UAAE,gBAAgB;AAClB,aAAK,QAAQ,OAAO,aAAa,eAAe;AAAA,MAClD,WAAW,gBAAgB,QAAW;AACpC,eAAO,SAAS,OAAO;AAAA,MACzB;AAAA,IACF;AAAA;AAAA,EAEA,SAAS;AACP,WAAO,oCAAC,sBAAmB,SAAS,KAAK,aAAc,GAAG,KAAK,OAAO;AAAA,EACxE;AAAA,EAEA,WAAW,cAAc;AACvB,WAAO;AAAA,EACT;AAAA,EAEA,WAAW,cAAc;AACvB,WAAO;AAAA,EACT;AACF,GAAG;",
+  "names": []
+}

package/dist/components/navigation/IonNav.js

@@ -0,0 +1,21 @@
+"use strict";
+import { defineCustomElement } from "@ionic/core/components/ion-nav.js";
+import React, { useMemo, useState } from "react";
+import { ReactDelegate } from "../../framework-delegate";
+import { createReactComponent } from "../react-component-lib";
+import { createForwardRef } from "../utils";
+const IonNavInner = createReactComponent(
+  "ion-nav",
+  void 0,
+  void 0,
+  defineCustomElement
+);
+const IonNavInternal = ({ children, forwardedRef, ...restOfProps }) => {
+  const [views, setViews] = useState([]);
+  const addView = (view) => setViews((existingViews) => [...existingViews, view]);
+  const removeView = (view) => setViews((existingViews) => existingViews.filter((v) => v !== view));
+  const delegate = useMemo(() => ReactDelegate(addView, removeView), []);
+  return /* @__PURE__ */ React.createElement(IonNavInner, { delegate, ref: forwardedRef, ...restOfProps }, views);
+};
+export const IonNav = createForwardRef(IonNavInternal, "IonNav");
+//# sourceMappingURL=IonNav.js.map

package/dist/components/navigation/IonNav.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/navigation/IonNav.tsx"],
+  "sourcesContent": ["import type { FrameworkDelegate, JSX } from '@ionic/core/components';\nimport { defineCustomElement } from '@ionic/core/components/ion-nav.js';\nimport React, { useMemo, useState } from 'react';\n\nimport { ReactDelegate } from '../../framework-delegate';\nimport { createReactComponent } from '../react-component-lib';\nimport { createForwardRef } from '../utils';\n\nconst IonNavInner = createReactComponent<JSX.IonNav & { delegate: FrameworkDelegate }, HTMLIonNavElement>(\n  'ion-nav',\n  undefined,\n  undefined,\n  defineCustomElement\n);\n\ntype IonNavProps = JSX.IonNav & {\n  forwardedRef?: React.ForwardedRef<HTMLIonNavElement>;\n};\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst IonNavInternal: React.FC<IonNavProps> = ({ children, forwardedRef, ...restOfProps }) => {\n  const [views, setViews] = useState<React.ReactElement[]>([]);\n\n  /**\n   * Allows us to create React components that are rendered within\n   * the context of the IonNav component.\n   */\n  const addView = (view: React.ReactElement) => setViews((existingViews) => [...existingViews, view]);\n  const removeView = (view: React.ReactElement) => setViews((existingViews) => existingViews.filter((v) => v !== view));\n\n  const delegate = useMemo(() => ReactDelegate(addView, removeView), []);\n\n  return (\n    <IonNavInner delegate={delegate} ref={forwardedRef} {...restOfProps}>\n      {views}\n    </IonNavInner>\n  );\n};\n\nexport const IonNav = createForwardRef<IonNavProps, HTMLIonNavElement>(IonNavInternal, 'IonNav');\n"],
+  "mappings": ";AACA,SAAS,2BAA2B;AACpC,OAAO,SAAS,SAAS,gBAAgB;AAEzC,SAAS,qBAAqB;AAC9B,SAAS,4BAA4B;AACrC,SAAS,wBAAwB;AAEjC,MAAM,cAAc;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAOA,MAAM,iBAAwC,CAAC,EAAE,UAAU,cAAc,GAAG,YAAY,MAAM;AAC5F,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA+B,CAAC,CAAC;AAM3D,QAAM,UAAU,CAAC,SAA6B,SAAS,CAAC,kBAAkB,CAAC,GAAG,eAAe,IAAI,CAAC;AAClG,QAAM,aAAa,CAAC,SAA6B,SAAS,CAAC,kBAAkB,cAAc,OAAO,CAAC,MAAM,MAAM,IAAI,CAAC;AAEpH,QAAM,WAAW,QAAQ,MAAM,cAAc,SAAS,UAAU,GAAG,CAAC,CAAC;AAErE,SACE,oCAAC,eAAY,UAAoB,KAAK,cAAe,GAAG,eACrD,KACH;AAEJ;AAEO,aAAM,SAAS,iBAAiD,gBAAgB,QAAQ;",
+  "names": []
+}

package/dist/components/navigation/IonTabBar.js

@@ -0,0 +1,173 @@
+"use strict";
+import React, { useContext } from "react";
+import { NavContext } from "../../contexts/NavContext";
+import { IonTabBarInner } from "../inner-proxies";
+import { createForwardRef } from "../utils";
+import { IonTabButton } from "./IonTabButton";
+class IonTabBarUnwrapped extends React.PureComponent {
+  constructor(props) {
+    super(props);
+    // eslint-disable-next-line
+    this.setActiveTabOnContext = (_tab) => {
+    };
+    const tabs = {};
+    React.Children.forEach(props.children, (child) => {
+      if (child != null && typeof child === "object" && child.props && (child.type === IonTabButton || child.type.isTabButton)) {
+        tabs[child.props.tab] = {
+          originalHref: child.props.href,
+          currentHref: child.props.href,
+          originalRouteOptions: child.props.href === props.routeInfo?.pathname ? props.routeInfo?.routeOptions : void 0,
+          currentRouteOptions: child.props.href === props.routeInfo?.pathname ? props.routeInfo?.routeOptions : void 0
+        };
+      }
+    });
+    this.state = {
+      tabs
+    };
+    this.onTabButtonClick = this.onTabButtonClick.bind(this);
+    this.renderTabButton = this.renderTabButton.bind(this);
+    this.setActiveTabOnContext = this.setActiveTabOnContext.bind(this);
+    this.selectTab = this.selectTab.bind(this);
+  }
+  componentDidMount() {
+    const tabs = this.state.tabs;
+    const tabKeys = Object.keys(tabs);
+    const activeTab = tabKeys.find((key) => {
+      const href = tabs[key].originalHref;
+      return this.props.routeInfo.pathname.startsWith(href);
+    });
+    if (activeTab) {
+      this.setState({
+        activeTab
+      });
+    }
+  }
+  componentDidUpdate() {
+    if (this.state.activeTab) {
+      this.setActiveTabOnContext(this.state.activeTab);
+    }
+  }
+  selectTab(tab) {
+    const tabUrl = this.state.tabs[tab];
+    if (tabUrl) {
+      this.onTabButtonClick(
+        new CustomEvent("ionTabButtonClick", {
+          detail: {
+            href: tabUrl.currentHref,
+            tab,
+            selected: tab === this.state.activeTab,
+            routeOptions: void 0
+          }
+        })
+      );
+      return true;
+    }
+    return false;
+  }
+  static getDerivedStateFromProps(props, state) {
+    const tabs = { ...state.tabs };
+    const tabKeys = Object.keys(state.tabs);
+    const activeTab = tabKeys.find((key) => {
+      const href = state.tabs[key].originalHref;
+      return props.routeInfo.pathname.startsWith(href);
+    });
+    React.Children.forEach(props.children, (child) => {
+      if (child != null && typeof child === "object" && child.props && (child.type === IonTabButton || child.type.isTabButton)) {
+        const tab = tabs[child.props.tab];
+        if (!tab || tab.originalHref !== child.props.href) {
+          tabs[child.props.tab] = {
+            originalHref: child.props.href,
+            currentHref: child.props.href,
+            originalRouteOptions: child.props.routeOptions,
+            currentRouteOptions: child.props.routeOptions
+          };
+        }
+      }
+    });
+    const { activeTab: prevActiveTab } = state;
+    if (activeTab && prevActiveTab) {
+      const prevHref = state.tabs[prevActiveTab].currentHref;
+      const prevRouteOptions = state.tabs[prevActiveTab].currentRouteOptions;
+      if (activeTab !== prevActiveTab || prevHref !== props.routeInfo?.pathname || prevRouteOptions !== props.routeInfo?.routeOptions) {
+        tabs[activeTab] = {
+          originalHref: tabs[activeTab].originalHref,
+          currentHref: props.routeInfo.pathname + (props.routeInfo.search || ""),
+          originalRouteOptions: tabs[activeTab].originalRouteOptions,
+          currentRouteOptions: props.routeInfo?.routeOptions
+        };
+        if (props.routeInfo.routeAction === "pop" && activeTab !== prevActiveTab) {
+          tabs[prevActiveTab] = {
+            originalHref: tabs[prevActiveTab].originalHref,
+            currentHref: tabs[prevActiveTab].originalHref,
+            originalRouteOptions: tabs[prevActiveTab].originalRouteOptions,
+            currentRouteOptions: tabs[prevActiveTab].currentRouteOptions
+          };
+        }
+      }
+    }
+    activeTab && props.onSetCurrentTab(activeTab, props.routeInfo);
+    return {
+      activeTab,
+      tabs
+    };
+  }
+  onTabButtonClick(e, onClickFn) {
+    const tappedTab = this.state.tabs[e.detail.tab];
+    const originalHref = tappedTab.originalHref;
+    const currentHref = e.detail.href;
+    const { activeTab: prevActiveTab } = this.state;
+    if (onClickFn) {
+      onClickFn(e);
+    }
+    if (prevActiveTab === e.detail.tab) {
+      if (originalHref !== currentHref) {
+        this.context.resetTab(e.detail.tab, originalHref, tappedTab.originalRouteOptions);
+      }
+    } else {
+      if (this.props.onIonTabsWillChange) {
+        this.props.onIonTabsWillChange(new CustomEvent("ionTabWillChange", { detail: { tab: e.detail.tab } }));
+      }
+      if (this.props.onIonTabsDidChange) {
+        this.props.onIonTabsDidChange(new CustomEvent("ionTabDidChange", { detail: { tab: e.detail.tab } }));
+      }
+      this.setActiveTabOnContext(e.detail.tab);
+      this.context.changeTab(e.detail.tab, currentHref, e.detail.routeOptions);
+    }
+  }
+  renderTabButton(activeTab) {
+    return (child) => {
+      if (child != null && child.props && (child.type === IonTabButton || child.type.isTabButton)) {
+        const href = child.props.tab === activeTab ? this.props.routeInfo?.pathname : this.state.tabs[child.props.tab].currentHref;
+        const routeOptions = child.props.tab === activeTab ? this.props.routeInfo?.routeOptions : this.state.tabs[child.props.tab].currentRouteOptions;
+        return React.cloneElement(child, {
+          href,
+          routeOptions,
+          onClick: (ev) => this.onTabButtonClick(ev, child.props.onClick)
+        });
+      }
+      return null;
+    };
+  }
+  render() {
+    const { activeTab } = this.state;
+    return /* @__PURE__ */ React.createElement(IonTabBarInner, { ...this.props, selectedTab: activeTab }, React.Children.map(this.props.children, this.renderTabButton(activeTab)));
+  }
+  static get contextType() {
+    return NavContext;
+  }
+}
+const IonTabBarContainer = React.memo(({ forwardedRef, ...props }) => {
+  const context = useContext(NavContext);
+  return /* @__PURE__ */ React.createElement(
+    IonTabBarUnwrapped,
+    {
+      ref: forwardedRef,
+      ...props,
+      routeInfo: props.routeInfo || context.routeInfo || { pathname: window.location.pathname },
+      onSetCurrentTab: context.setCurrentTab
+    },
+    props.children
+  );
+});
+export const IonTabBar = createForwardRef(IonTabBarContainer, "IonTabBar");
+//# sourceMappingURL=IonTabBar.js.map

package/dist/components/navigation/IonTabBar.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/navigation/IonTabBar.tsx"],
+  "sourcesContent": ["import type { JSX as LocalJSX } from '@ionic/core/components';\nimport React, { useContext } from 'react';\n\nimport { NavContext } from '../../contexts/NavContext';\nimport type { RouteInfo } from '../../models';\nimport type { IonicReactProps } from '../IonicReactProps';\nimport { IonTabBarInner } from '../inner-proxies';\nimport { createForwardRef } from '../utils';\n\nimport { IonTabButton } from './IonTabButton';\n\ntype IonTabBarProps = LocalJSX.IonTabBar &\n  IonicReactProps & {\n    onIonTabsDidChange?: (event: CustomEvent<{ tab: string }>) => void;\n    onIonTabsWillChange?: (event: CustomEvent<{ tab: string }>) => void;\n    slot?: 'bottom' | 'top';\n    style?: { [key: string]: string };\n  };\n\ninterface InternalProps extends IonTabBarProps {\n  forwardedRef?: React.ForwardedRef<HTMLIonIconElement>;\n  onSetCurrentTab: (tab: string, routeInfo: RouteInfo) => void;\n  routeInfo: RouteInfo;\n}\n\ninterface TabUrls {\n  originalHref: string;\n  currentHref: string;\n  originalRouteOptions?: unknown;\n  currentRouteOptions?: unknown;\n}\n\ninterface IonTabBarState {\n  activeTab?: string;\n  tabs: { [key: string]: TabUrls };\n}\n\n// TODO(FW-2959): types\n\nclass IonTabBarUnwrapped extends React.PureComponent<InternalProps, IonTabBarState> {\n  context!: React.ContextType<typeof NavContext>;\n\n  constructor(props: InternalProps) {\n    super(props);\n    const tabs: { [key: string]: TabUrls } = {};\n    React.Children.forEach((props as any).children, (child: any) => {\n      if (\n        child != null &&\n        typeof child === 'object' &&\n        child.props &&\n        (child.type === IonTabButton || child.type.isTabButton)\n      ) {\n        tabs[child.props.tab] = {\n          originalHref: child.props.href,\n          currentHref: child.props.href,\n          originalRouteOptions:\n            child.props.href === props.routeInfo?.pathname ? props.routeInfo?.routeOptions : undefined,\n          currentRouteOptions:\n            child.props.href === props.routeInfo?.pathname ? props.routeInfo?.routeOptions : undefined,\n        };\n      }\n    });\n\n    this.state = {\n      tabs,\n    };\n\n    this.onTabButtonClick = this.onTabButtonClick.bind(this);\n    this.renderTabButton = this.renderTabButton.bind(this);\n    this.setActiveTabOnContext = this.setActiveTabOnContext.bind(this);\n    this.selectTab = this.selectTab.bind(this);\n  }\n\n  componentDidMount() {\n    const tabs = this.state.tabs;\n    const tabKeys = Object.keys(tabs);\n    const activeTab = tabKeys.find((key) => {\n      const href = tabs[key].originalHref;\n      return this.props.routeInfo!.pathname.startsWith(href);\n    });\n\n    if (activeTab) {\n      this.setState({\n        activeTab,\n      });\n    }\n  }\n\n  componentDidUpdate() {\n    if (this.state.activeTab) {\n      this.setActiveTabOnContext(this.state.activeTab);\n    }\n  }\n\n  // eslint-disable-next-line\n  setActiveTabOnContext = (_tab: string) => {};\n\n  selectTab(tab: string) {\n    const tabUrl = this.state.tabs[tab];\n    if (tabUrl) {\n      this.onTabButtonClick(\n        new CustomEvent('ionTabButtonClick', {\n          detail: {\n            href: tabUrl.currentHref,\n            tab,\n            selected: tab === this.state.activeTab,\n            routeOptions: undefined,\n          },\n        })\n      );\n      return true;\n    }\n    return false;\n  }\n\n  static getDerivedStateFromProps(props: InternalProps, state: IonTabBarState) {\n    const tabs = { ...state.tabs };\n    const tabKeys = Object.keys(state.tabs);\n    const activeTab = tabKeys.find((key) => {\n      const href = state.tabs[key].originalHref;\n      return props.routeInfo!.pathname.startsWith(href);\n    });\n\n    // Check to see if the tab button href has changed, and if so, update it in the tabs state\n    React.Children.forEach((props as any).children, (child: any) => {\n      if (\n        child != null &&\n        typeof child === 'object' &&\n        child.props &&\n        (child.type === IonTabButton || child.type.isTabButton)\n      ) {\n        const tab = tabs[child.props.tab];\n        if (!tab || tab.originalHref !== child.props.href) {\n          tabs[child.props.tab] = {\n            originalHref: child.props.href,\n            currentHref: child.props.href,\n            originalRouteOptions: child.props.routeOptions,\n            currentRouteOptions: child.props.routeOptions,\n          };\n        }\n      }\n    });\n\n    const { activeTab: prevActiveTab } = state;\n    if (activeTab && prevActiveTab) {\n      const prevHref = state.tabs[prevActiveTab].currentHref;\n      const prevRouteOptions = state.tabs[prevActiveTab].currentRouteOptions;\n      if (\n        activeTab !== prevActiveTab ||\n        prevHref !== props.routeInfo?.pathname ||\n        prevRouteOptions !== props.routeInfo?.routeOptions\n      ) {\n        tabs[activeTab] = {\n          originalHref: tabs[activeTab].originalHref,\n          currentHref: props.routeInfo!.pathname + (props.routeInfo!.search || ''),\n          originalRouteOptions: tabs[activeTab].originalRouteOptions,\n          currentRouteOptions: props.routeInfo?.routeOptions,\n        };\n        if (props.routeInfo.routeAction === 'pop' && activeTab !== prevActiveTab) {\n          // If navigating back and the tabs change, set the prev tab back to its original href\n          tabs[prevActiveTab] = {\n            originalHref: tabs[prevActiveTab].originalHref,\n            currentHref: tabs[prevActiveTab].originalHref,\n            originalRouteOptions: tabs[prevActiveTab].originalRouteOptions,\n            currentRouteOptions: tabs[prevActiveTab].currentRouteOptions,\n          };\n        }\n      }\n    }\n\n    activeTab && props.onSetCurrentTab(activeTab, props.routeInfo);\n\n    return {\n      activeTab,\n      tabs,\n    };\n  }\n\n  private onTabButtonClick(\n    e: CustomEvent<{ href: string; selected: boolean; tab: string; routeOptions: unknown }>,\n    onClickFn?: (e: any) => void\n  ) {\n    const tappedTab = this.state.tabs[e.detail.tab];\n    const originalHref = tappedTab.originalHref;\n    const currentHref = e.detail.href;\n    const { activeTab: prevActiveTab } = this.state;\n\n    if (onClickFn) {\n      /**\n       * If the user provides an onClick function, we call it\n       * with the original event.\n       */\n      onClickFn(e);\n    }\n\n    // this.props.onSetCurrentTab(e.detail.tab, this.props.routeInfo);\n    // Clicking the current tab will bring you back to the original href\n    if (prevActiveTab === e.detail.tab) {\n      if (originalHref !== currentHref) {\n        this.context.resetTab(e.detail.tab, originalHref, tappedTab.originalRouteOptions);\n      }\n    } else {\n      if (this.props.onIonTabsWillChange) {\n        this.props.onIonTabsWillChange(new CustomEvent('ionTabWillChange', { detail: { tab: e.detail.tab } }));\n      }\n      if (this.props.onIonTabsDidChange) {\n        this.props.onIonTabsDidChange(new CustomEvent('ionTabDidChange', { detail: { tab: e.detail.tab } }));\n      }\n      this.setActiveTabOnContext(e.detail.tab);\n      this.context.changeTab(e.detail.tab, currentHref, e.detail.routeOptions);\n    }\n  }\n\n  private renderTabButton(activeTab: string | null | undefined) {\n    return (\n      child:\n        | React.ReactElement<LocalJSX.IonTabButton & { onClick: (e: any) => void; routeOptions?: unknown }>\n        | null\n        | undefined\n    ) => {\n      if (child != null && child.props && (child.type === IonTabButton || (child as any).type.isTabButton)) {\n        const href =\n          child.props.tab === activeTab\n            ? this.props.routeInfo?.pathname\n            : this.state.tabs[child.props.tab!].currentHref;\n        const routeOptions =\n          child.props.tab === activeTab\n            ? this.props.routeInfo?.routeOptions\n            : this.state.tabs[child.props.tab!].currentRouteOptions;\n\n        return React.cloneElement(child, {\n          href,\n          routeOptions,\n          onClick: (ev: CustomEvent) => this.onTabButtonClick(ev, child.props.onClick),\n        });\n      }\n      return null;\n    };\n  }\n\n  render() {\n    const { activeTab } = this.state;\n    return (\n      <IonTabBarInner {...this.props} selectedTab={activeTab}>\n        {React.Children.map(this.props.children as any, this.renderTabButton(activeTab))}\n      </IonTabBarInner>\n    );\n  }\n\n  static get contextType() {\n    return NavContext;\n  }\n}\n\nconst IonTabBarContainer: React.FC<InternalProps> = React.memo<InternalProps>(({ forwardedRef, ...props }) => {\n  const context = useContext(NavContext);\n  return (\n    <IonTabBarUnwrapped\n      ref={forwardedRef}\n      {...(props as any)}\n      routeInfo={props.routeInfo || context.routeInfo || { pathname: window.location.pathname }}\n      onSetCurrentTab={context.setCurrentTab}\n    >\n      {props.children}\n    </IonTabBarUnwrapped>\n  );\n});\n\nexport const IonTabBar = createForwardRef<IonTabBarProps, HTMLIonTabBarElement>(IonTabBarContainer, 'IonTabBar');\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/components/navigation/IonTabButton.js

@@ -0,0 +1,30 @@
+"use strict";
+import React from "react";
+import { IonTabButtonInner } from "../inner-proxies";
+export const IonTabButton = /* @__PURE__ */ (() => class extends React.Component {
+  constructor(props) {
+    super(props);
+    this.handleIonTabButtonClick = this.handleIonTabButtonClick.bind(this);
+  }
+  handleIonTabButtonClick() {
+    if (this.props.onClick) {
+      this.props.onClick(
+        new CustomEvent("ionTabButtonClick", {
+          detail: {
+            tab: this.props.tab,
+            href: this.props.href,
+            routeOptions: this.props.routerOptions
+          }
+        })
+      );
+    }
+  }
+  render() {
+    const { onClick, ...rest } = this.props;
+    return /* @__PURE__ */ React.createElement(IonTabButtonInner, { onIonTabButtonClick: this.handleIonTabButtonClick, ...rest });
+  }
+  static get displayName() {
+    return "IonTabButton";
+  }
+})();
+//# sourceMappingURL=IonTabButton.js.map

package/dist/components/navigation/IonTabButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/navigation/IonTabButton.tsx"],
+  "sourcesContent": ["import type { JSX as LocalJSX } from '@ionic/core/components';\nimport React from 'react';\n\nimport type { RouterOptions } from '../../models';\nimport type { IonicReactProps } from '../IonicReactProps';\nimport { IonTabButtonInner } from '../inner-proxies';\n\ntype Props = LocalJSX.IonTabButton &\n  IonicReactProps & {\n    routerOptions?: RouterOptions;\n    ref?: React.Ref<HTMLIonTabButtonElement>;\n    onClick?: (e: CustomEvent) => void;\n  };\n\nexport const IonTabButton = /*@__PURE__*/ (() =>\n  class extends React.Component<Props> {\n    constructor(props: Props) {\n      super(props);\n      this.handleIonTabButtonClick = this.handleIonTabButtonClick.bind(this);\n    }\n\n    handleIonTabButtonClick() {\n      if (this.props.onClick) {\n        this.props.onClick(\n          new CustomEvent('ionTabButtonClick', {\n            detail: {\n              tab: this.props.tab,\n              href: this.props.href,\n              routeOptions: this.props.routerOptions,\n            },\n          })\n        );\n      }\n    }\n\n    render() {\n      /**\n       * onClick is excluded from the props, since it has a custom\n       * implementation within IonTabBar.tsx. Calling onClick within this\n       * component would result in duplicate handler calls.\n       */\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { onClick, ...rest } = this.props;\n      return <IonTabButtonInner onIonTabButtonClick={this.handleIonTabButtonClick} {...rest}></IonTabButtonInner>;\n    }\n\n    static get displayName() {\n      return 'IonTabButton';\n    }\n  })();\n"],
+  "mappings": ";AACA,OAAO,WAAW;AAIlB,SAAS,yBAAyB;AAS3B,aAAM,eAA8B,uBACzC,cAAc,MAAM,UAAiB;AAAA,EACnC,YAAY,OAAc;AACxB,UAAM,KAAK;AACX,SAAK,0BAA0B,KAAK,wBAAwB,KAAK,IAAI;AAAA,EACvE;AAAA,EAEA,0BAA0B;AACxB,QAAI,KAAK,MAAM,SAAS;AACtB,WAAK,MAAM;AAAA,QACT,IAAI,YAAY,qBAAqB;AAAA,UACnC,QAAQ;AAAA,YACN,KAAK,KAAK,MAAM;AAAA,YAChB,MAAM,KAAK,MAAM;AAAA,YACjB,cAAc,KAAK,MAAM;AAAA,UAC3B;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF;AAAA,EAEA,SAAS;AAOP,UAAM,EAAE,SAAS,GAAG,KAAK,IAAI,KAAK;AAClC,WAAO,oCAAC,qBAAkB,qBAAqB,KAAK,yBAA0B,GAAG,MAAM;AAAA,EACzF;AAAA,EAEA,WAAW,cAAc;AACvB,WAAO;AAAA,EACT;AACF,GAAG;",
+  "names": []
+}

package/dist/components/navigation/IonTabs.js

@@ -0,0 +1,103 @@
+"use strict";
+import React, { Fragment } from "react";
+import { NavContext } from "../../contexts/NavContext";
+import PageManager from "../../routing/PageManager";
+import { HTMLElementSSR } from "../../utils/HTMLElementSSR";
+import { IonRouterOutlet } from "../IonRouterOutlet";
+import { IonTabBar } from "./IonTabBar";
+import { IonTabsContext } from "./IonTabsContext";
+class IonTabsElement extends HTMLElementSSR {
+  constructor() {
+    super();
+  }
+}
+if (typeof window !== "undefined" && window.customElements) {
+  const element = window.customElements.get("ion-tabs");
+  if (!element) {
+    window.customElements.define("ion-tabs", IonTabsElement);
+  }
+}
+const hostStyles = {
+  display: "flex",
+  position: "absolute",
+  top: "0",
+  left: "0",
+  right: "0",
+  bottom: "0",
+  flexDirection: "column",
+  width: "100%",
+  height: "100%",
+  contain: "layout size style"
+};
+const tabsInner = {
+  position: "relative",
+  flex: 1,
+  contain: "layout size style"
+};
+export const IonTabs = /* @__PURE__ */ (() => class extends React.Component {
+  constructor(props) {
+    super(props);
+    this.routerOutletRef = React.createRef();
+    this.tabBarRef = React.createRef();
+    this.ionTabContextState = {
+      activeTab: void 0,
+      selectTab: () => false
+    };
+  }
+  componentDidMount() {
+    if (this.tabBarRef.current) {
+      this.ionTabContextState.activeTab = this.tabBarRef.current.state.activeTab;
+      this.tabBarRef.current.setActiveTabOnContext = (tab) => {
+        this.ionTabContextState.activeTab = tab;
+      };
+      this.ionTabContextState.selectTab = this.tabBarRef.current.selectTab;
+    }
+  }
+  render() {
+    let outlet;
+    let tabBar;
+    const { className, onIonTabsDidChange, onIonTabsWillChange, ...props } = this.props;
+    const children = typeof this.props.children === "function" ? this.props.children(this.ionTabContextState) : this.props.children;
+    React.Children.forEach(children, (child) => {
+      if (child == null || typeof child !== "object" || !child.hasOwnProperty("type")) {
+        return;
+      }
+      if (child.type === IonRouterOutlet || child.type.isRouterOutlet) {
+        outlet = React.cloneElement(child);
+      } else if (child.type === Fragment && child.props.children[0].type === IonRouterOutlet) {
+        outlet = child.props.children[0];
+      }
+      let childProps = {
+        ref: this.tabBarRef
+      };
+      if (onIonTabsDidChange !== void 0) {
+        childProps = {
+          ...childProps,
+          onIonTabsDidChange
+        };
+      }
+      if (onIonTabsWillChange !== void 0) {
+        childProps = {
+          ...childProps,
+          onIonTabsWillChange
+        };
+      }
+      if (child.type === IonTabBar || child.type.isTabBar) {
+        tabBar = React.cloneElement(child, childProps);
+      } else if (child.type === Fragment && (child.props.children[1].type === IonTabBar || child.props.children[1].type.isTabBar)) {
+        tabBar = React.cloneElement(child.props.children[1], childProps);
+      }
+    });
+    if (!outlet) {
+      throw new Error("IonTabs must contain an IonRouterOutlet");
+    }
+    if (!tabBar) {
+      throw new Error("IonTabs needs a IonTabBar");
+    }
+    return /* @__PURE__ */ React.createElement(IonTabsContext.Provider, { value: this.ionTabContextState }, this.context.hasIonicRouter() ? /* @__PURE__ */ React.createElement(PageManager, { className: className ? `${className}` : "", routeInfo: this.context.routeInfo, ...props }, /* @__PURE__ */ React.createElement("ion-tabs", { className: "ion-tabs", style: hostStyles }, tabBar.props.slot === "top" ? tabBar : null, /* @__PURE__ */ React.createElement("div", { style: tabsInner, className: "tabs-inner" }, outlet), tabBar.props.slot === "bottom" ? tabBar : null)) : /* @__PURE__ */ React.createElement("div", { className: className ? `${className}` : "ion-tabs", ...props, style: hostStyles }, tabBar.props.slot === "top" ? tabBar : null, /* @__PURE__ */ React.createElement("div", { style: tabsInner, className: "tabs-inner" }, outlet), tabBar.props.slot === "bottom" ? tabBar : null));
+  }
+  static get contextType() {
+    return NavContext;
+  }
+})();
+//# sourceMappingURL=IonTabs.js.map