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

package/dist/hooks/useIonActionSheet.js

@@ -0,0 +1,27 @@
+"use strict";
+import { actionSheetController } from "@ionic/core/components";
+import { defineCustomElement } from "@ionic/core/components/ion-action-sheet.js";
+import { useCallback } from "react";
+import { useController } from "./useController";
+export function useIonActionSheet() {
+  const controller = useController(
+    "IonActionSheet",
+    actionSheetController,
+    defineCustomElement
+  );
+  const present = useCallback(
+    (buttonsOrOptions, header) => {
+      if (Array.isArray(buttonsOrOptions)) {
+        return controller.present({
+          buttons: buttonsOrOptions,
+          header
+        });
+      } else {
+        return controller.present(buttonsOrOptions);
+      }
+    },
+    [controller.present]
+  );
+  return [present, controller.dismiss];
+}
+//# sourceMappingURL=useIonActionSheet.js.map

package/dist/hooks/useIonActionSheet.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/hooks/useIonActionSheet.ts"],
+  "sourcesContent": ["import type { ActionSheetButton, ActionSheetOptions } from '@ionic/core/components';\nimport { actionSheetController } from '@ionic/core/components';\nimport { defineCustomElement } from '@ionic/core/components/ion-action-sheet.js';\nimport { useCallback } from 'react';\n\nimport type { HookOverlayOptions } from './HookOverlayOptions';\nimport { useController } from './useController';\n\n/**\n * A hook for presenting/dismissing an IonActionSheet component\n * @returns Returns the present and dismiss methods in an array\n */\nexport function useIonActionSheet(): UseIonActionSheetResult {\n  const controller = useController<ActionSheetOptions, HTMLIonActionSheetElement>(\n    'IonActionSheet',\n    actionSheetController,\n    defineCustomElement\n  );\n\n  const present = useCallback(\n    (buttonsOrOptions: ActionSheetButton[] | (ActionSheetOptions & HookOverlayOptions), header?: string) => {\n      if (Array.isArray(buttonsOrOptions)) {\n        return controller.present({\n          buttons: buttonsOrOptions,\n          header,\n        });\n      } else {\n        return controller.present(buttonsOrOptions);\n      }\n    },\n    [controller.present]\n  );\n\n  return [present, controller.dismiss];\n}\n\nexport type UseIonActionSheetResult = [\n  {\n    /**\n     * Presents the action sheet\n     * @param buttons An array of buttons for the action sheet\n     * @param header Optional - Title for the action sheet\n     */\n    (buttons: ActionSheetButton[], header?: string | undefined): Promise<void>;\n    /**\n     * Presents the action sheet\n     * @param options The options to pass to the IonActionSheet\n     */\n    (options: ActionSheetOptions & HookOverlayOptions): Promise<void>;\n  },\n  /**\n   * Dismisses the action sheet\n   */\n  () => Promise<void>\n];\n"],
+  "mappings": ";AACA,SAAS,6BAA6B;AACtC,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAG5B,SAAS,qBAAqB;AAMvB,gBAAS,oBAA6C;AAC3D,QAAM,aAAa;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,UAAU;AAAA,IACd,CAAC,kBAAmF,WAAoB;AACtG,UAAI,MAAM,QAAQ,gBAAgB,GAAG;AACnC,eAAO,WAAW,QAAQ;AAAA,UACxB,SAAS;AAAA,UACT;AAAA,QACF,CAAC;AAAA,MACH,OAAO;AACL,eAAO,WAAW,QAAQ,gBAAgB;AAAA,MAC5C;AAAA,IACF;AAAA,IACA,CAAC,WAAW,OAAO;AAAA,EACrB;AAEA,SAAO,CAAC,SAAS,WAAW,OAAO;AACrC;",
+  "names": []
+}

package/dist/hooks/useIonAlert.js

@@ -0,0 +1,23 @@
+"use strict";
+import { alertController } from "@ionic/core/components";
+import { defineCustomElement } from "@ionic/core/components/ion-alert.js";
+import { useCallback } from "react";
+import { useController } from "./useController";
+export function useIonAlert() {
+  const controller = useController("IonAlert", alertController, defineCustomElement);
+  const present = useCallback(
+    (messageOrOptions, buttons) => {
+      if (typeof messageOrOptions === "string") {
+        return controller.present({
+          message: messageOrOptions,
+          buttons: buttons ?? [{ text: "Ok" }]
+        });
+      } else {
+        return controller.present(messageOrOptions);
+      }
+    },
+    [controller.present]
+  );
+  return [present, controller.dismiss];
+}
+//# sourceMappingURL=useIonAlert.js.map

package/dist/hooks/useIonAlert.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/hooks/useIonAlert.ts"],
+  "sourcesContent": ["import type { AlertButton, AlertOptions } from '@ionic/core/components';\nimport { alertController } from '@ionic/core/components';\nimport { defineCustomElement } from '@ionic/core/components/ion-alert.js';\nimport { useCallback } from 'react';\n\nimport type { HookOverlayOptions } from './HookOverlayOptions';\nimport { useController } from './useController';\n\n/**\n * A hook for presenting/dismissing an IonAlert component\n * @returns Returns the present and dismiss methods in an array\n */\nexport function useIonAlert(): UseIonAlertResult {\n  const controller = useController<AlertOptions, HTMLIonAlertElement>('IonAlert', alertController, defineCustomElement);\n\n  const present = useCallback(\n    (messageOrOptions: string | (AlertOptions & HookOverlayOptions), buttons?: AlertButton[]) => {\n      if (typeof messageOrOptions === 'string') {\n        return controller.present({\n          message: messageOrOptions,\n          buttons: buttons ?? [{ text: 'Ok' }],\n        });\n      } else {\n        return controller.present(messageOrOptions);\n      }\n    },\n    [controller.present]\n  );\n\n  return [present, controller.dismiss];\n}\n\nexport type UseIonAlertResult = [\n  {\n    /**\n     * Presents the alert\n     * @param message The main message to be displayed in the alert\n     * @param buttons Optional - Array of buttons to be added to the alert\n     */\n    (message: string, buttons?: AlertButton[]): Promise<void>;\n    /**\n     * Presents the alert\n     * @param options The options to pass to the IonAlert\n     */\n    (options: AlertOptions & HookOverlayOptions): Promise<void>;\n  },\n  /**\n   * Dismisses the alert\n   */\n  () => Promise<void>\n];\n"],
+  "mappings": ";AACA,SAAS,uBAAuB;AAChC,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAG5B,SAAS,qBAAqB;AAMvB,gBAAS,cAAiC;AAC/C,QAAM,aAAa,cAAiD,YAAY,iBAAiB,mBAAmB;AAEpH,QAAM,UAAU;AAAA,IACd,CAAC,kBAAgE,YAA4B;AAC3F,UAAI,OAAO,qBAAqB,UAAU;AACxC,eAAO,WAAW,QAAQ;AAAA,UACxB,SAAS;AAAA,UACT,SAAS,WAAW,CAAC,EAAE,MAAM,KAAK,CAAC;AAAA,QACrC,CAAC;AAAA,MACH,OAAO;AACL,eAAO,WAAW,QAAQ,gBAAgB;AAAA,MAC5C;AAAA,IACF;AAAA,IACA,CAAC,WAAW,OAAO;AAAA,EACrB;AAEA,SAAO,CAAC,SAAS,WAAW,OAAO;AACrC;",
+  "names": []
+}

package/dist/hooks/useIonLoading.js

@@ -0,0 +1,28 @@
+"use strict";
+import { loadingController } from "@ionic/core/components";
+import { defineCustomElement } from "@ionic/core/components/ion-loading.js";
+import { useCallback } from "react";
+import { useController } from "./useController";
+export function useIonLoading() {
+  const controller = useController(
+    "IonLoading",
+    loadingController,
+    defineCustomElement
+  );
+  const present = useCallback(
+    (messageOrOptions = {}, duration, spinner) => {
+      if (typeof messageOrOptions === "string") {
+        return controller.present({
+          message: messageOrOptions,
+          duration,
+          spinner
+        });
+      } else {
+        return controller.present(messageOrOptions);
+      }
+    },
+    [controller.present]
+  );
+  return [present, controller.dismiss];
+}
+//# sourceMappingURL=useIonLoading.js.map

package/dist/hooks/useIonLoading.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/hooks/useIonLoading.tsx"],
+  "sourcesContent": ["import type { LoadingOptions, SpinnerTypes } from '@ionic/core/components';\nimport { loadingController } from '@ionic/core/components';\nimport { defineCustomElement } from '@ionic/core/components/ion-loading.js';\nimport { useCallback } from 'react';\n\nimport type { HookOverlayOptions } from './HookOverlayOptions';\nimport { useController } from './useController';\n\n/**\n * A hook for presenting/dismissing an IonLoading component\n * @returns Returns the present and dismiss methods in an array\n */\nexport function useIonLoading(): UseIonLoadingResult {\n  const controller = useController<LoadingOptions, HTMLIonLoadingElement>(\n    'IonLoading',\n    loadingController,\n    defineCustomElement\n  );\n\n  const present = useCallback(\n    (\n      messageOrOptions: string | (LoadingOptions & HookOverlayOptions) = {},\n      duration?: number,\n      spinner?: SpinnerTypes\n    ) => {\n      if (typeof messageOrOptions === 'string') {\n        return controller.present({\n          message: messageOrOptions,\n          duration,\n          spinner,\n        });\n      } else {\n        return controller.present(messageOrOptions);\n      }\n    },\n    [controller.present]\n  );\n\n  return [present, controller.dismiss];\n}\n\nexport type UseIonLoadingResult = [\n  {\n    /**\n     * Presents the loading indicator\n     * @param message Optional - Text content to display in the loading indicator, defaults to blank string\n     * @param duration Optional - Number of milliseconds to wait before dismissing the loading indicator\n     * @param spinner Optional - The name of the spinner to display, defaults to \"lines\"\n     */\n    (message?: string, duration?: number, spinner?: SpinnerTypes): Promise<void>;\n    /**\n     * Presents the loading indicator\n     * @param options The options to pass to the IonLoading\n     */\n    (options: LoadingOptions & HookOverlayOptions): Promise<void>;\n  },\n  /**\n   * Dismisses the loading indicator\n   */\n  () => Promise<void>\n];\n"],
+  "mappings": ";AACA,SAAS,yBAAyB;AAClC,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAG5B,SAAS,qBAAqB;AAMvB,gBAAS,gBAAqC;AACnD,QAAM,aAAa;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,UAAU;AAAA,IACd,CACE,mBAAmE,CAAC,GACpE,UACA,YACG;AACH,UAAI,OAAO,qBAAqB,UAAU;AACxC,eAAO,WAAW,QAAQ;AAAA,UACxB,SAAS;AAAA,UACT;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH,OAAO;AACL,eAAO,WAAW,QAAQ,gBAAgB;AAAA,MAC5C;AAAA,IACF;AAAA,IACA,CAAC,WAAW,OAAO;AAAA,EACrB;AAEA,SAAO,CAAC,SAAS,WAAW,OAAO;AACrC;",
+  "names": []
+}

package/dist/hooks/useIonModal.js

@@ -0,0 +1,22 @@
+"use strict";
+import { modalController } from "@ionic/core/components";
+import { defineCustomElement } from "@ionic/core/components/ion-modal.js";
+import { useCallback } from "react";
+import { useOverlay } from "./useOverlay";
+export function useIonModal(component, componentProps) {
+  const controller = useOverlay(
+    "IonModal",
+    modalController,
+    defineCustomElement,
+    component,
+    componentProps
+  );
+  const present = useCallback(
+    (options = {}) => {
+      controller.present(options);
+    },
+    [controller.present]
+  );
+  return [present, controller.dismiss];
+}
+//# sourceMappingURL=useIonModal.js.map

package/dist/hooks/useIonModal.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/hooks/useIonModal.ts"],
+  "sourcesContent": ["import type { ModalOptions } from '@ionic/core/components';\nimport { modalController } from '@ionic/core/components';\nimport { defineCustomElement } from '@ionic/core/components/ion-modal.js';\nimport { useCallback } from 'react';\n\nimport type { ReactComponentOrElement } from '../models/ReactComponentOrElement';\n\nimport type { HookOverlayOptions } from './HookOverlayOptions';\nimport { useOverlay } from './useOverlay';\n\n// TODO(FW-2959): types\n\n/**\n * A hook for presenting/dismissing an IonModal component\n * @param component The component that the modal will show. Can be a React Component, a functional component, or a JSX Element\n * @param componentProps The props that will be passed to the component, if required\n * @returns Returns the present and dismiss methods in an array\n */\nexport function useIonModal(component: ReactComponentOrElement, componentProps?: any): UseIonModalResult {\n  const controller = useOverlay<ModalOptions, HTMLIonModalElement>(\n    'IonModal',\n    modalController,\n    defineCustomElement,\n    component,\n    componentProps\n  );\n\n  const present = useCallback(\n    (options: Omit<ModalOptions, 'component' | 'componentProps'> & HookOverlayOptions = {}) => {\n      controller.present(options as any);\n    },\n    [controller.present]\n  );\n\n  return [present, controller.dismiss];\n}\n\nexport type UseIonModalResult = [\n  (options?: Omit<ModalOptions, 'component' | 'componentProps'> & HookOverlayOptions) => void,\n  /**\n   * Dismisses the modal\n   */\n  (data?: any, role?: string) => void\n];\n"],
+  "mappings": ";AACA,SAAS,uBAAuB;AAChC,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAK5B,SAAS,kBAAkB;AAUpB,gBAAS,YAAY,WAAoC,gBAAyC;AACvG,QAAM,aAAa;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,UAAU;AAAA,IACd,CAAC,UAAmF,CAAC,MAAM;AACzF,iBAAW,QAAQ,OAAc;AAAA,IACnC;AAAA,IACA,CAAC,WAAW,OAAO;AAAA,EACrB;AAEA,SAAO,CAAC,SAAS,WAAW,OAAO;AACrC;",
+  "names": []
+}

package/dist/hooks/useIonPicker.js

@@ -0,0 +1,27 @@
+"use strict";
+import { pickerController } from "@ionic/core/components";
+import { defineCustomElement } from "@ionic/core/components/ion-picker.js";
+import { useCallback } from "react";
+import { useController } from "./useController";
+export function useIonPicker() {
+  const controller = useController(
+    "IonPicker",
+    pickerController,
+    defineCustomElement
+  );
+  const present = useCallback(
+    (columnsOrOptions, buttons) => {
+      if (Array.isArray(columnsOrOptions)) {
+        return controller.present({
+          columns: columnsOrOptions,
+          buttons: buttons ?? [{ text: "Ok" }]
+        });
+      } else {
+        return controller.present(columnsOrOptions);
+      }
+    },
+    [controller.present]
+  );
+  return [present, controller.dismiss];
+}
+//# sourceMappingURL=useIonPicker.js.map

package/dist/hooks/useIonPicker.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/hooks/useIonPicker.tsx"],
+  "sourcesContent": ["import type { PickerButton, PickerColumn, PickerOptions } from '@ionic/core/components';\nimport { pickerController } from '@ionic/core/components';\nimport { defineCustomElement } from '@ionic/core/components/ion-picker.js';\nimport { useCallback } from 'react';\n\nimport type { HookOverlayOptions } from './HookOverlayOptions';\nimport { useController } from './useController';\n\n/**\n * A hook for presenting/dismissing an IonPicker component\n * @returns Returns the present and dismiss methods in an array\n */\nexport function useIonPicker(): UseIonPickerResult {\n  const controller = useController<PickerOptions, HTMLIonPickerElement>(\n    'IonPicker',\n    pickerController,\n    defineCustomElement\n  );\n\n  const present = useCallback(\n    (columnsOrOptions: PickerColumn[] | (PickerOptions & HookOverlayOptions), buttons?: PickerButton[]) => {\n      if (Array.isArray(columnsOrOptions)) {\n        return controller.present({\n          columns: columnsOrOptions,\n          buttons: buttons ?? [{ text: 'Ok' }],\n        });\n      } else {\n        return controller.present(columnsOrOptions);\n      }\n    },\n    [controller.present]\n  );\n\n  return [present, controller.dismiss];\n}\n\nexport type UseIonPickerResult = [\n  {\n    /**\n     * Presents the picker\n     * @param columns Array of columns to be displayed in the picker.\n     * @param buttons Optional - Array of buttons to be displayed at the top of the picker.\n     */\n    (columns: PickerColumn[], buttons?: PickerButton[]): Promise<void>;\n    /**\n     * Presents the picker\n     * @param options The options to pass to the IonPicker\n     */\n    (options: PickerOptions & HookOverlayOptions): Promise<void>;\n  },\n  /**\n   * Dismisses the picker\n   */\n  () => Promise<void>\n];\n"],
+  "mappings": ";AACA,SAAS,wBAAwB;AACjC,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAG5B,SAAS,qBAAqB;AAMvB,gBAAS,eAAmC;AACjD,QAAM,aAAa;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,UAAU;AAAA,IACd,CAAC,kBAAyE,YAA6B;AACrG,UAAI,MAAM,QAAQ,gBAAgB,GAAG;AACnC,eAAO,WAAW,QAAQ;AAAA,UACxB,SAAS;AAAA,UACT,SAAS,WAAW,CAAC,EAAE,MAAM,KAAK,CAAC;AAAA,QACrC,CAAC;AAAA,MACH,OAAO;AACL,eAAO,WAAW,QAAQ,gBAAgB;AAAA,MAC5C;AAAA,IACF;AAAA,IACA,CAAC,WAAW,OAAO;AAAA,EACrB;AAEA,SAAO,CAAC,SAAS,WAAW,OAAO;AACrC;",
+  "names": []
+}

package/dist/hooks/useIonPopover.js

@@ -0,0 +1,22 @@
+"use strict";
+import { popoverController } from "@ionic/core/components";
+import { defineCustomElement } from "@ionic/core/components/ion-popover.js";
+import { useCallback } from "react";
+import { useOverlay } from "./useOverlay";
+export function useIonPopover(component, componentProps) {
+  const controller = useOverlay(
+    "IonPopover",
+    popoverController,
+    defineCustomElement,
+    component,
+    componentProps
+  );
+  const present = useCallback(
+    (options = {}) => {
+      controller.present(options);
+    },
+    [controller.present]
+  );
+  return [present, controller.dismiss];
+}
+//# sourceMappingURL=useIonPopover.js.map

package/dist/hooks/useIonPopover.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/hooks/useIonPopover.ts"],
+  "sourcesContent": ["import type { PopoverOptions } from '@ionic/core/components';\nimport { popoverController } from '@ionic/core/components';\nimport { defineCustomElement } from '@ionic/core/components/ion-popover.js';\nimport { useCallback } from 'react';\n\nimport type { ReactComponentOrElement } from '../models/ReactComponentOrElement';\n\nimport type { HookOverlayOptions } from './HookOverlayOptions';\nimport { useOverlay } from './useOverlay';\n\n// TODO(FW-2959): types\n\n/**\n * A hook for presenting/dismissing an IonPicker component\n * @param component The component that the popover will show. Can be a React Component, a functional component, or a JSX Element\n * @param componentProps The props that will be passed to the component, if required\n * @returns Returns the present and dismiss methods in an array\n */\nexport function useIonPopover(component: ReactComponentOrElement, componentProps?: any): UseIonPopoverResult {\n  const controller = useOverlay<PopoverOptions, HTMLIonPopoverElement>(\n    'IonPopover',\n    popoverController,\n    defineCustomElement,\n    component,\n    componentProps\n  );\n\n  const present = useCallback(\n    (options: Omit<PopoverOptions, 'component' | 'componentProps'> & HookOverlayOptions = {}) => {\n      controller.present(options as any);\n    },\n    [controller.present]\n  );\n\n  return [present, controller.dismiss];\n}\n\nexport type UseIonPopoverResult = [\n  (options?: Omit<PopoverOptions, 'component' | 'componentProps'> & HookOverlayOptions) => void,\n  /**\n   * Dismisses the popover\n   */\n  (data?: any, role?: string) => void\n];\n"],
+  "mappings": ";AACA,SAAS,yBAAyB;AAClC,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAK5B,SAAS,kBAAkB;AAUpB,gBAAS,cAAc,WAAoC,gBAA2C;AAC3G,QAAM,aAAa;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,UAAU;AAAA,IACd,CAAC,UAAqF,CAAC,MAAM;AAC3F,iBAAW,QAAQ,OAAc;AAAA,IACnC;AAAA,IACA,CAAC,WAAW,OAAO;AAAA,EACrB;AAEA,SAAO,CAAC,SAAS,WAAW,OAAO;AACrC;",
+  "names": []
+}

package/dist/hooks/useIonToast.js

@@ -0,0 +1,23 @@
+"use strict";
+import { toastController } from "@ionic/core/components";
+import { defineCustomElement } from "@ionic/core/components/ion-toast.js";
+import { useCallback } from "react";
+import { useController } from "./useController";
+export function useIonToast() {
+  const controller = useController("IonToast", toastController, defineCustomElement);
+  const present = useCallback(
+    (messageOrOptions, duration) => {
+      if (typeof messageOrOptions === "string") {
+        return controller.present({
+          message: messageOrOptions,
+          duration
+        });
+      } else {
+        return controller.present(messageOrOptions);
+      }
+    },
+    [controller.present]
+  );
+  return [present, controller.dismiss];
+}
+//# sourceMappingURL=useIonToast.js.map

package/dist/hooks/useIonToast.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/hooks/useIonToast.ts"],
+  "sourcesContent": ["import type { ToastOptions } from '@ionic/core/components';\nimport { toastController } from '@ionic/core/components';\nimport { defineCustomElement } from '@ionic/core/components/ion-toast.js';\nimport { useCallback } from 'react';\n\nimport type { HookOverlayOptions } from './HookOverlayOptions';\nimport { useController } from './useController';\n\n/**\n * A hook for presenting/dismissing an IonToast component\n * @returns Returns the present and dismiss methods in an array\n */\nexport function useIonToast(): UseIonToastResult {\n  const controller = useController<ToastOptions, HTMLIonToastElement>('IonToast', toastController, defineCustomElement);\n\n  const present = useCallback(\n    (messageOrOptions: string | (ToastOptions & HookOverlayOptions), duration?: number) => {\n      if (typeof messageOrOptions === 'string') {\n        return controller.present({\n          message: messageOrOptions,\n          duration,\n        });\n      } else {\n        return controller.present(messageOrOptions);\n      }\n    },\n    [controller.present]\n  );\n\n  return [present, controller.dismiss];\n}\n\nexport type UseIonToastResult = [\n  {\n    /**\n     * Presents the toast\n     * @param message Message to be shown in the toast.\n     * @param duration Optional - How many milliseconds to wait before hiding the toast. By default, it will show until dismissToast() is called.\n     */\n    (message: string, duration?: number): Promise<void>;\n    /**\n     * Presents the Toast\n     * @param options The options to pass to the IonToast.\n     */\n    (options: ToastOptions & HookOverlayOptions): Promise<void>;\n  },\n  /**\n   * Dismisses the toast\n   */\n  () => Promise<void>\n];\n"],
+  "mappings": ";AACA,SAAS,uBAAuB;AAChC,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAG5B,SAAS,qBAAqB;AAMvB,gBAAS,cAAiC;AAC/C,QAAM,aAAa,cAAiD,YAAY,iBAAiB,mBAAmB;AAEpH,QAAM,UAAU;AAAA,IACd,CAAC,kBAAgE,aAAsB;AACrF,UAAI,OAAO,qBAAqB,UAAU;AACxC,eAAO,WAAW,QAAQ;AAAA,UACxB,SAAS;AAAA,UACT;AAAA,QACF,CAAC;AAAA,MACH,OAAO;AACL,eAAO,WAAW,QAAQ,gBAAgB;AAAA,MAC5C;AAAA,IACF;AAAA,IACA,CAAC,WAAW,OAAO;AAAA,EACrB;AAEA,SAAO,CAAC,SAAS,WAAW,OAAO;AACrC;",
+  "names": []
+}

package/dist/hooks/useOverlay.js

@@ -0,0 +1,67 @@
+"use strict";
+import React, { createElement, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import { attachProps } from "../components/react-component-lib/utils";
+import { IonContext } from "../contexts/IonContext";
+import { generateId } from "../utils/generateId";
+export function useOverlay(displayName, controller, defineCustomElement, component, componentProps) {
+  const overlayRef = useRef();
+  const containerElRef = useRef();
+  const didDismissEventName = useMemo(() => `on${displayName}DidDismiss`, [displayName]);
+  const didPresentEventName = useMemo(() => `on${displayName}DidPresent`, [displayName]);
+  const willDismissEventName = useMemo(() => `on${displayName}WillDismiss`, [displayName]);
+  const willPresentEventName = useMemo(() => `on${displayName}WillPresent`, [displayName]);
+  const [isOpen, setIsOpen] = useState(false);
+  const ionContext = useContext(IonContext);
+  const [overlayId] = useState(generateId("overlay"));
+  defineCustomElement();
+  useEffect(() => {
+    if (isOpen && component && containerElRef.current) {
+      if (React.isValidElement(component)) {
+        ionContext.addOverlay(overlayId, component, containerElRef.current);
+      } else {
+        const element = createElement(component, componentProps);
+        ionContext.addOverlay(overlayId, element, containerElRef.current);
+      }
+    }
+  }, [component, containerElRef.current, isOpen, componentProps]);
+  const present = useCallback(async (options) => {
+    if (overlayRef.current) {
+      return;
+    }
+    const { onDidDismiss, onWillDismiss, onDidPresent, onWillPresent, ...rest } = options;
+    if (typeof document !== "undefined") {
+      containerElRef.current = document.createElement("div");
+    }
+    overlayRef.current = await controller.create({
+      ...rest,
+      component: containerElRef.current
+    });
+    attachProps(overlayRef.current, {
+      [didDismissEventName]: handleDismiss,
+      [didPresentEventName]: (e) => onDidPresent && onDidPresent(e),
+      [willDismissEventName]: (e) => onWillDismiss && onWillDismiss(e),
+      [willPresentEventName]: (e) => onWillPresent && onWillPresent(e)
+    });
+    overlayRef.current.present();
+    setIsOpen(true);
+    function handleDismiss(event) {
+      if (onDidDismiss) {
+        onDidDismiss(event);
+      }
+      overlayRef.current = void 0;
+      containerElRef.current = void 0;
+      setIsOpen(false);
+      ionContext.removeOverlay(overlayId);
+    }
+  }, []);
+  const dismiss = useCallback(async (data, role) => {
+    overlayRef.current && await overlayRef.current.dismiss(data, role);
+    overlayRef.current = void 0;
+    containerElRef.current = void 0;
+  }, []);
+  return {
+    present,
+    dismiss
+  };
+}
+//# sourceMappingURL=useOverlay.js.map

package/dist/hooks/useOverlay.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/hooks/useOverlay.ts"],
+  "sourcesContent": ["import type { OverlayEventDetail } from '@ionic/core/components';\nimport React, { createElement, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { attachProps } from '../components/react-component-lib/utils';\nimport { IonContext } from '../contexts/IonContext';\nimport type { ReactComponentOrElement } from '../models/ReactComponentOrElement';\nimport { generateId } from '../utils/generateId';\n\nimport type { HookOverlayOptions } from './HookOverlayOptions';\n\n// TODO(FW-2959): types\n\ninterface OverlayBase extends HTMLElement {\n  present: () => Promise<void>;\n  dismiss: (data?: any, role?: string | undefined) => Promise<boolean>;\n}\n\nexport function useOverlay<OptionsType, OverlayType extends OverlayBase>(\n  displayName: string,\n  controller: { create: (options: OptionsType) => Promise<OverlayType> },\n  defineCustomElement: () => void,\n  component: ReactComponentOrElement,\n  componentProps?: any\n) {\n  const overlayRef = useRef<OverlayType>();\n  const containerElRef = useRef<HTMLDivElement>();\n  const didDismissEventName = useMemo(() => `on${displayName}DidDismiss`, [displayName]);\n  const didPresentEventName = useMemo(() => `on${displayName}DidPresent`, [displayName]);\n  const willDismissEventName = useMemo(() => `on${displayName}WillDismiss`, [displayName]);\n  const willPresentEventName = useMemo(() => `on${displayName}WillPresent`, [displayName]);\n  const [isOpen, setIsOpen] = useState(false);\n  const ionContext = useContext(IonContext);\n  const [overlayId] = useState(generateId('overlay'));\n\n  defineCustomElement();\n\n  useEffect(() => {\n    if (isOpen && component && containerElRef.current) {\n      if (React.isValidElement(component)) {\n        ionContext.addOverlay(overlayId, component, containerElRef.current!);\n      } else {\n        const element = createElement(component as React.ComponentClass, componentProps);\n        ionContext.addOverlay(overlayId, element, containerElRef.current!);\n      }\n    }\n  }, [component, containerElRef.current, isOpen, componentProps]);\n\n  const present = useCallback(async (options: OptionsType & HookOverlayOptions) => {\n    if (overlayRef.current) {\n      return;\n    }\n\n    const { onDidDismiss, onWillDismiss, onDidPresent, onWillPresent, ...rest } = options;\n\n    if (typeof document !== 'undefined') {\n      containerElRef.current = document.createElement('div');\n    }\n\n    overlayRef.current = await controller.create({\n      ...(rest as any),\n      component: containerElRef.current,\n    });\n\n    attachProps(overlayRef.current, {\n      [didDismissEventName]: handleDismiss,\n      [didPresentEventName]: (e: CustomEvent) => onDidPresent && onDidPresent(e),\n      [willDismissEventName]: (e: CustomEvent) => onWillDismiss && onWillDismiss(e),\n      [willPresentEventName]: (e: CustomEvent) => onWillPresent && onWillPresent(e),\n    });\n\n    overlayRef.current.present();\n\n    setIsOpen(true);\n\n    function handleDismiss(event: CustomEvent<OverlayEventDetail<any>>) {\n      if (onDidDismiss) {\n        onDidDismiss(event);\n      }\n      overlayRef.current = undefined;\n      containerElRef.current = undefined;\n      setIsOpen(false);\n      ionContext.removeOverlay(overlayId);\n    }\n  }, []);\n\n  const dismiss = useCallback(async (data?: any, role?: string) => {\n    overlayRef.current && (await overlayRef.current.dismiss(data, role));\n    overlayRef.current = undefined;\n    containerElRef.current = undefined;\n  }, []);\n\n  return {\n    present,\n    dismiss,\n  };\n}\n"],
+  "mappings": ";AACA,OAAO,SAAS,eAAe,aAAa,YAAY,WAAW,SAAS,QAAQ,gBAAgB;AAEpG,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAE3B,SAAS,kBAAkB;AAWpB,gBAAS,WACd,aACA,YACA,qBACA,WACA,gBACA;AACA,QAAM,aAAa,OAAoB;AACvC,QAAM,iBAAiB,OAAuB;AAC9C,QAAM,sBAAsB,QAAQ,MAAM,KAAK,WAAW,cAAc,CAAC,WAAW,CAAC;AACrF,QAAM,sBAAsB,QAAQ,MAAM,KAAK,WAAW,cAAc,CAAC,WAAW,CAAC;AACrF,QAAM,uBAAuB,QAAQ,MAAM,KAAK,WAAW,eAAe,CAAC,WAAW,CAAC;AACvF,QAAM,uBAAuB,QAAQ,MAAM,KAAK,WAAW,eAAe,CAAC,WAAW,CAAC;AACvF,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,QAAM,aAAa,WAAW,UAAU;AACxC,QAAM,CAAC,SAAS,IAAI,SAAS,WAAW,SAAS,CAAC;AAElD,sBAAoB;AAEpB,YAAU,MAAM;AACd,QAAI,UAAU,aAAa,eAAe,SAAS;AACjD,UAAI,MAAM,eAAe,SAAS,GAAG;AACnC,mBAAW,WAAW,WAAW,WAAW,eAAe,OAAQ;AAAA,MACrE,OAAO;AACL,cAAM,UAAU,cAAc,WAAmC,cAAc;AAC/E,mBAAW,WAAW,WAAW,SAAS,eAAe,OAAQ;AAAA,MACnE;AAAA,IACF;AAAA,EACF,GAAG,CAAC,WAAW,eAAe,SAAS,QAAQ,cAAc,CAAC;AAE9D,QAAM,UAAU,YAAY,OAAO,YAA8C;AAC/E,QAAI,WAAW,SAAS;AACtB;AAAA,IACF;AAEA,UAAM,EAAE,cAAc,eAAe,cAAc,eAAe,GAAG,KAAK,IAAI;AAE9E,QAAI,OAAO,aAAa,aAAa;AACnC,qBAAe,UAAU,SAAS,cAAc,KAAK;AAAA,IACvD;AAEA,eAAW,UAAU,MAAM,WAAW,OAAO;AAAA,MAC3C,GAAI;AAAA,MACJ,WAAW,eAAe;AAAA,IAC5B,CAAC;AAED,gBAAY,WAAW,SAAS;AAAA,MAC9B,CAAC,mBAAmB,GAAG;AAAA,MACvB,CAAC,mBAAmB,GAAG,CAAC,MAAmB,gBAAgB,aAAa,CAAC;AAAA,MACzE,CAAC,oBAAoB,GAAG,CAAC,MAAmB,iBAAiB,cAAc,CAAC;AAAA,MAC5E,CAAC,oBAAoB,GAAG,CAAC,MAAmB,iBAAiB,cAAc,CAAC;AAAA,IAC9E,CAAC;AAED,eAAW,QAAQ,QAAQ;AAE3B,cAAU,IAAI;AAEd,aAAS,cAAc,OAA6C;AAClE,UAAI,cAAc;AAChB,qBAAa,KAAK;AAAA,MACpB;AACA,iBAAW,UAAU;AACrB,qBAAe,UAAU;AACzB,gBAAU,KAAK;AACf,iBAAW,cAAc,SAAS;AAAA,IACpC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,YAAY,OAAO,MAAY,SAAkB;AAC/D,eAAW,WAAY,MAAM,WAAW,QAAQ,QAAQ,MAAM,IAAI;AAClE,eAAW,UAAU;AACrB,mBAAe,UAAU;AAAA,EAC3B,GAAG,CAAC,CAAC;AAEL,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;",
+  "names": []
+}