@elliemae/pui-app-sdk 3.0.0-beta.2 → 3.0.0-beta.23

package/dist/es/view/app-root/hosted-app.js

@@ -1,14 +1,18 @@
+import * as React from "react";
 import styled from "styled-components";
-import { MediaBreakpoint } from "../media-breakpoint";
-import { WindowSize } from "../window-size";
-import { HTMLWaitMessage } from "../modals/wait-message/html-wait-message";
-import GlobalStyle from "./style";
+import { useBreakpoint } from "../breakpoint/use-breakpoint.js";
+import { useWindowSizeChange } from "../use-window-size-change.js";
+import { useHTMLWaitMessage } from "../modals/wait-message/use-html-wait-message.js";
+import GlobalStyle from "./style.js";
 const Div = styled.div`
   height: 100%;
 `;
-const HostedApp = ({ children }) => /* @__PURE__ */ React.createElement(Div, null, /* @__PURE__ */ React.createElement(GlobalStyle, null), /* @__PURE__ */ React.createElement(MediaBreakpoint, null), /* @__PURE__ */ React.createElement(WindowSize, null), /* @__PURE__ */ React.createElement(HTMLWaitMessage, {
-  close: true
-}), children);
+const HostedApp = ({ children }) => {
+  useBreakpoint();
+  useHTMLWaitMessage(true);
+  useWindowSizeChange();
+  return /* @__PURE__ */ React.createElement(Div, null, /* @__PURE__ */ React.createElement(GlobalStyle, null), children);
+};
 export {
   HostedApp
 };

package/dist/es/view/app-root/index.js

@@ -1,14 +1,15 @@
+import * as React from "react";
 import { Provider } from "react-redux";
 import { ThemeProvider } from "styled-components";
-import { Router } from "react-router-dom";
 import { getDefaultTheme } from "@elliemae/pui-theme";
 import { useInjectSaga } from "redux-injectors";
-import { isStandAloneGuest, isHost } from "../../utils/micro-frontend";
-import { waitMessage } from "../../sideeffect/wait-message";
-import { errorToast } from "../../sideeffect/error-toast";
-import { ErrorBoundary } from "../error-boundary";
-import { StandAloneApp } from "./stand-alone-app";
-import { HostedApp } from "./hosted-app";
+import { AppRouter } from "../app-router.js";
+import { isStandAloneGuest, isHost } from "../../utils/micro-frontend/index.js";
+import { waitMessage } from "../../sideeffect/wait-message/index.js";
+import { errorToast } from "../../sideeffect/error-toast/index.js";
+import { ErrorBoundary } from "../error-boundary/index.js";
+import { StandAloneApp } from "./stand-alone-app.js";
+import { HostedApp } from "./hosted-app.js";
 const AppToRender = (props) => {
   useInjectSaga({ key: "waitMessage", saga: waitMessage });
   useInjectSaga({ key: "errorToast", saga: errorToast });
@@ -31,7 +32,7 @@ const AppRoot = ({
   errorTemplate
 }, /* @__PURE__ */ React.createElement(Provider, {
   store
-}, /* @__PURE__ */ React.createElement(Router, {
+}, /* @__PURE__ */ React.createElement(AppRouter, {
   history
 }, /* @__PURE__ */ React.createElement(ThemeProvider, {
   theme

package/dist/es/view/app-root/stand-alone-app.js

@@ -1,12 +1,13 @@
+import * as React from "react";
 import styled from "styled-components";
 import { LiveAnnouncer } from "react-aria-live";
-import { MediaBreakpoint } from "../media-breakpoint";
-import { WindowSize } from "../window-size";
-import { SessionTimeout } from "../session-timeout";
-import { LiveMessage } from "../live-message";
-import { ErrorToast } from "../error-toast";
-import { WaitMessage as DefaultWaitMessage } from "../modals/wait-message";
-import GlobalStyle from "./style";
+import { useBreakpoint } from "../breakpoint/use-breakpoint.js";
+import { useWindowSizeChange } from "../use-window-size-change.js";
+import { SessionTimeout } from "../session-timeout/index.js";
+import { LiveMessage } from "../live-message/index.js";
+import { ErrorToast } from "../error-toast/index.js";
+import { WaitMessage as DefaultWaitMessage } from "../modals/wait-message/index.js";
+import GlobalStyle from "./style.js";
 const Div = styled.div`
   height: 100%;
 `;
@@ -14,7 +15,11 @@ const StandAloneApp = ({
   manageSession,
   WaitMessage,
   children
-}) => /* @__PURE__ */ React.createElement(LiveAnnouncer, null, /* @__PURE__ */ React.createElement(Div, null, /* @__PURE__ */ React.createElement(GlobalStyle, null), manageSession && /* @__PURE__ */ React.createElement(SessionTimeout, null), /* @__PURE__ */ React.createElement(MediaBreakpoint, null), /* @__PURE__ */ React.createElement(WindowSize, null), /* @__PURE__ */ React.createElement(LiveMessage, null), WaitMessage || /* @__PURE__ */ React.createElement(DefaultWaitMessage, null), /* @__PURE__ */ React.createElement(ErrorToast, null), children));
+}) => {
+  useBreakpoint();
+  useWindowSizeChange();
+  return /* @__PURE__ */ React.createElement(LiveAnnouncer, null, /* @__PURE__ */ React.createElement(Div, null, /* @__PURE__ */ React.createElement(GlobalStyle, null), manageSession && /* @__PURE__ */ React.createElement(SessionTimeout, null), /* @__PURE__ */ React.createElement(LiveMessage, null), WaitMessage || /* @__PURE__ */ React.createElement(DefaultWaitMessage, null), /* @__PURE__ */ React.createElement(ErrorToast, null), children));
+};
 export {
   StandAloneApp
 };

package/dist/es/view/app-router.js

@@ -0,0 +1,19 @@
+import * as React from "react";
+import { useState, useLayoutEffect } from "react";
+import { Router } from "react-router-dom";
+const AppRouter = ({ history, ...props }) => {
+  const [state, setState] = useState({
+    action: history.action,
+    location: history.location
+  });
+  useLayoutEffect(() => history.listen(setState), [history]);
+  return /* @__PURE__ */ React.createElement(Router, {
+    ...props,
+    location: state.location,
+    navigationType: state.action,
+    navigator: history
+  });
+};
+export {
+  AppRouter
+};

package/dist/es/view/{media-breakpoint/index.js → breakpoint/use-breakpoint.js}

@@ -1,13 +1,13 @@
 import { useEffect, useContext } from "react";
 import { ThemeContext } from "styled-components";
 import { publish } from "pubsub-js";
-import { useAppDispatch } from "../../data/react-redux";
-import { breakpoint } from "../../data/breakpoint";
-import { useMediaBreakpoints } from "../useMediaBreakpoints";
-import { HOST_WINDOW_BREAKPOINT_CHANGED } from "../../utils/constants";
-const MediaBreakpoint = () => {
+import { useAppDispatch } from "../../data/react-redux.js";
+import { breakpoint } from "../../data/breakpoint/index.js";
+import { useMediaQueryList } from "./use-media-query-list.js";
+import { HOST_WINDOW_BREAKPOINT_CHANGED } from "../../utils/constants.js";
+const useBreakpoint = () => {
   const theme = useContext(ThemeContext);
-  const currentBreakpoint = useMediaBreakpoints([
+  const currentBreakpoint = useMediaQueryList([
     `(max-width: ${theme.breakpoints.small})`,
     `(max-width: ${theme.breakpoints.medium})`,
     `(max-width: ${theme.breakpoints.large})`
@@ -17,8 +17,7 @@ const MediaBreakpoint = () => {
     dispatch({ type: breakpoint.change, payload: currentBreakpoint });
     publish(HOST_WINDOW_BREAKPOINT_CHANGED, currentBreakpoint);
   }, [currentBreakpoint, dispatch]);
-  return /* @__PURE__ */ React.createElement(React.Fragment, null);
 };
 export {
-  MediaBreakpoint
+  useBreakpoint
 };

package/dist/es/view/{useMediaBreakpoints/index.js → breakpoint/use-media-query-list.js}

@@ -1,5 +1,5 @@
 import { useState, useEffect, useCallback } from "react";
-const useMediaBreakpoints = (queries, values, defaultValue) => {
+const useMediaQueryList = (queries, values, defaultValue) => {
   const mediaQueryLists = queries.map((q) => window.matchMedia(q));
   const getValue = useCallback(() => {
     const index = mediaQueryLists.findIndex((mql) => mql.matches);
@@ -8,11 +8,11 @@ const useMediaBreakpoints = (queries, values, defaultValue) => {
   const [value, setValue] = useState(getValue);
   useEffect(() => {
     const handler = () => setValue(getValue);
-    mediaQueryLists.forEach((mql) => mql.addListener(handler));
-    return () => mediaQueryLists.forEach((mql) => mql.removeListener(handler));
+    mediaQueryLists.forEach((mql) => mql.addEventListener("change", handler));
+    return () => mediaQueryLists.forEach((mql) => mql.removeEventListener("change", handler));
   }, [getValue, mediaQueryLists]);
   return value;
 };
 export {
-  useMediaBreakpoints
+  useMediaQueryList
 };

package/dist/es/view/error-boundary/default-error-template.js

@@ -1,4 +1,5 @@
-const DefaultErrorTemplate = () => /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("h2", null, "We are unable to process your request"), /* @__PURE__ */ React.createElement("section", null, "Please close your browser and login again"));
+import * as React from "react";
+const DefaultErrorTemplate = (props) => /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("h2", null, "We are unable to process your request"), /* @__PURE__ */ React.createElement("section", null, "Please close your browser and login again"));
 export {
   DefaultErrorTemplate
 };

package/dist/es/view/error-boundary/index.js

@@ -1,9 +1,9 @@
 import React from "react";
 import {
   DefaultErrorTemplate
-} from "./default-error-template";
-import { getLogger } from "../../utils/micro-frontend";
-import { logRecords } from "../../utils/log-records";
+} from "./default-error-template.js";
+import { getLogger } from "../../utils/micro-frontend/index.js";
+import { logRecords } from "../../utils/log-records.js";
 class ErrorBoundary extends React.Component {
   constructor(props) {
     super(props);

package/dist/es/view/error-toast/index.js

@@ -1,12 +1,8 @@
+import * as React from "react";
 import { useEffect, memo } from "react";
-import {
-  ToastPosition,
-  ToastType,
-  DSToast,
-  toast
-} from "@elliemae/ds-basic/Toast";
-import { useAppSelector, useAppDispatch } from "../../data/react-redux";
-import { actions as error } from "../../data/error";
+import { ToastPosition, ToastType, DSToast, toast } from "@elliemae/ds-toast";
+import { useAppSelector, useAppDispatch } from "../../data/react-redux.js";
+import { actions as error } from "../../data/error/index.js";
 const ErrorToast = memo((props) => {
   const storeError = useAppSelector((state) => state?.error);
   const dispatch = useAppDispatch();

package/dist/es/view/fetch-host-app-data/index.js

@@ -1,7 +1,10 @@
 import _ from "lodash";
-import { isHostAppDataExist, setHostAppData } from "./store";
-import { sendMessageToHost, getHostAppData } from "../message-to-host-app";
-import { bindEvent } from "../host-binding-events";
+import { isHostAppDataExist, setHostAppData } from "./store.js";
+import {
+  sendMessageToHost,
+  getHostAppData
+} from "../message-to-host-app/index.js";
+import { bindEvent } from "../host-binding-events/index.js";
 const fetchHostAppData = (hostedAppUrl, guestAppId) => {
   const isDataExist = isHostAppDataExist();
   return new Promise((resolve) => {

package/dist/es/view/fields/check-box/index.js

@@ -1,24 +1,17 @@
-import DSCheckbox, { CHECKBOX_VARIANT } from "@elliemae/ds-basic/form/Checkbox";
+import * as React from "react";
+import { DSControlledCheckbox } from "@elliemae/ds-controlled-form";
 import {
   Controller
 } from "react-hook-form";
-const CheckBox = ({
-  name,
-  defaultChecked = false,
-  rules = {},
-  ...rest
-}) => /* @__PURE__ */ React.createElement(Controller, {
+const CheckBox = ({ name, rules = {}, ...rest }) => /* @__PURE__ */ React.createElement(Controller, {
   name,
   rules,
-  render: ({ field: { onChange, value, ...restProps } }) => /* @__PURE__ */ React.createElement(DSCheckbox, {
+  render: ({ field: { value = false, ...restProps } }) => /* @__PURE__ */ React.createElement(DSControlledCheckbox, {
     ...rest,
     ...restProps,
-    defaultChecked,
-    checked: value,
-    onChange: (e) => onChange(((e || {}).target || {}).checked)
+    checked: value
   })
 });
 export {
-  CHECKBOX_VARIANT,
   CheckBox
 };

package/dist/es/view/fields/combo-box/index.js

@@ -1,4 +1,5 @@
-import DSComboBox from "@elliemae/ds-basic/form/ComboBox";
+import * as React from "react";
+import { DSComboBox } from "@elliemae/ds-form/ComboBox";
 import {
   Controller
 } from "react-hook-form";
@@ -6,7 +7,6 @@ const ComboBox = ({
   name,
   defaultValue = "",
   rules = {},
-  onChange: changeHandler,
   ...rest
 }) => /* @__PURE__ */ React.createElement(Controller, {
   name,
@@ -16,9 +16,8 @@ const ComboBox = ({
     ...rest,
     ...props,
     onChange: (selected) => {
-      onChange(selected);
-      if (changeHandler)
-        changeHandler(selected);
+      const { value = selected } = selected;
+      onChange(value);
     }
   })
 });

package/dist/es/view/fields/date-input/index.js

@@ -1,4 +1,5 @@
-import DSDateInput from "@elliemae/ds-basic/form/DateInput";
+import * as React from "react";
+import { DSDateInput } from "@elliemae/ds-form/DateInput";
 import {
   Controller
 } from "react-hook-form";

package/dist/es/view/fields/date-picker/index.js

@@ -1,4 +1,5 @@
-import DSDatePicker from "@elliemae/ds-date-picker";
+import * as React from "react";
+import { DSDatePicker } from "@elliemae/ds-date-picker";
 import {
   Controller
 } from "react-hook-form";

package/dist/es/view/fields/form-item-layout/index.js

@@ -1,10 +1,8 @@
-import DSFormItemLayout from "@elliemae/ds-basic/form/FormItem";
+import * as React from "react";
+import { DSFormItemLayout } from "@elliemae/ds-form/FormItem";
 import { get } from "react-hook-form";
-import { ConnectForm } from "../connect-form";
-const FormItemLayout = ({
-  name,
-  ...rest
-}) => /* @__PURE__ */ React.createElement(ConnectForm, null, ({
+import { ConnectForm } from "../connect-form.js";
+const FormItemLayout = ({ name, ...rest }) => /* @__PURE__ */ React.createElement(ConnectForm, null, ({
   formState: { errors }
 }) => {
   const errorField = get(errors, name);

package/dist/es/view/fields/form-layout-block-item/index.js

@@ -0,0 +1,25 @@
+import * as React from "react";
+import { DSFormLayoutBlockItem } from "@elliemae/ds-form-layout-blocks";
+import { get } from "react-hook-form";
+import { ConnectForm } from "../connect-form.js";
+const FormLayoutBlockItem = ({
+  inputID,
+  label,
+  ...rest
+}) => /* @__PURE__ */ React.createElement(ConnectForm, null, ({
+  formState: { errors }
+}) => {
+  const errorField = get(errors, inputID);
+  const hasError = !!errorField;
+  const validationMessage = errorField?.message;
+  return /* @__PURE__ */ React.createElement(DSFormLayoutBlockItem, {
+    inputID,
+    label,
+    hasError,
+    validationMessage,
+    ...rest
+  });
+});
+export {
+  FormLayoutBlockItem
+};

package/dist/es/view/fields/input-mask/index.js

@@ -1,7 +1,9 @@
-import DSInputMask, {
+import * as React from "react";
+import {
+  DSInputMask,
   MASK_TYPES,
   MASK_PIPES
-} from "@elliemae/ds-basic/form/InputMask";
+} from "@elliemae/ds-form/InputMask";
 import {
   Controller
 } from "react-hook-form";

package/dist/es/view/fields/large-text-box/index.js

@@ -1,4 +1,5 @@
-import DSLargeInputText from "@elliemae/ds-basic/form/LargeInputText";
+import * as React from "react";
+import { DSLargeInputText } from "@elliemae/ds-form/LargeInputText";
 import {
   Controller
 } from "react-hook-form";

package/dist/es/view/fields/radio/index.js

@@ -1,4 +1,5 @@
-import DSRadio from "@elliemae/ds-basic/form/Radio";
+import * as React from "react";
+import { DSRadio } from "@elliemae/ds-form/Radio";
 import {
   Controller
 } from "react-hook-form";

package/dist/es/view/fields/radio-group/index.js

@@ -1,12 +1,9 @@
-import DSRadioGroup from "@elliemae/ds-basic/form/RadioGroup";
+import * as React from "react";
+import { DSRadioGroup } from "@elliemae/ds-form/RadioGroup";
 import {
   Controller
 } from "react-hook-form";
-const RadioGroup = ({
-  name,
-  rules = {},
-  ...rest
-}) => /* @__PURE__ */ React.createElement(Controller, {
+const RadioGroup = ({ name, rules = {}, ...rest }) => /* @__PURE__ */ React.createElement(Controller, {
   name,
   rules,
   render: ({ field: { value, ...restProps } }) => /* @__PURE__ */ React.createElement(DSRadioGroup, {

package/dist/es/view/fields/text-box/index.js

@@ -1,4 +1,5 @@
-import DSTextBox from "@elliemae/ds-basic/form/TextBox";
+import * as React from "react";
+import { DSTextBox } from "@elliemae/ds-form/TextBox";
 import {
   Controller
 } from "react-hook-form";

package/dist/es/view/fields/watch-value.js

@@ -1,6 +1,9 @@
+import * as React from "react";
 import styled from "styled-components";
+import { Grid } from "@elliemae/ds-grid";
 import { useFormContext } from "react-hook-form";
 const Section = styled.section`
+  margin-top: 10px;
   border-top: 2px blue dotted;
   width: 100%;
 `;
@@ -10,10 +13,10 @@ const Div = styled.div`
   padding-left: 10px;
   align-items: flex-start;
 `;
-const WatchValue = ({ name, labelText }) => {
+const WatchValue = ({ name, label }) => {
   const { watch } = useFormContext();
   const data = watch(name, false) || "";
-  return /* @__PURE__ */ React.createElement(Section, null, /* @__PURE__ */ React.createElement("h4", null, "Form Data:"), /* @__PURE__ */ React.createElement(Div, null, /* @__PURE__ */ React.createElement("div", null, labelText, " : ", /* @__PURE__ */ React.createElement("strong", null, JSON.stringify(data)))));
+  return /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Section, null, /* @__PURE__ */ React.createElement("h4", null, "Form Data:"), /* @__PURE__ */ React.createElement(Div, null, /* @__PURE__ */ React.createElement("div", null, label, " : ", /* @__PURE__ */ React.createElement("strong", null, JSON.stringify(data))))));
 };
 export {
   WatchValue

package/dist/es/view/form/index.js

@@ -1,3 +1,4 @@
+import * as React from "react";
 import styled from "styled-components";
 import {
   useForm,

package/dist/es/view/form/personal-info-section.js

@@ -1,49 +1,54 @@
+import * as React from "react";
 import moment from "moment";
-import { TextBox } from "../fields/text-box";
-import { ComboBox } from "../fields/combo-box";
-import { DateInput } from "../fields/date-input";
-import { FormItemLayout } from "../fields/form-item-layout";
-const FirstName = () => /* @__PURE__ */ React.createElement(FormItemLayout, {
-  floatingLabel: true,
-  inputComponent: TextBox,
-  labelText: "First Name",
+import { TextBox } from "../fields/text-box/index.js";
+import { ComboBox } from "../fields/combo-box/index.js";
+import { DateInput } from "../fields/date-input/index.js";
+import { FormLayoutBlockItem } from "../fields/form-layout-block-item/index.js";
+const FirstName = () => /* @__PURE__ */ React.createElement(FormLayoutBlockItem, {
+  label: "First Name",
+  inputID: "firstname",
+  required: true
+}, /* @__PURE__ */ React.createElement(TextBox, {
+  id: "firstname",
   name: "firstname",
-  required: true,
   rules: {
     required: { value: true, message: "First Name is required" },
     minLength: { value: 2, message: "Minimum 2 characters" },
     maxLength: { value: 50, message: "Maximum 50 characters" }
   }
-});
-const DOB = () => /* @__PURE__ */ React.createElement(FormItemLayout, {
-  floatingLabel: true,
-  inputComponent: DateInput,
-  labelText: "Date of Birth",
+}));
+const DOB = () => /* @__PURE__ */ React.createElement(FormLayoutBlockItem, {
+  label: "Date of Birth",
+  inputID: "dob",
+  required: true
+}, /* @__PURE__ */ React.createElement(DateInput, {
+  id: "dob",
   name: "dob",
-  required: true,
   rules: {
     required: { value: true, message: "Date of Birth is required" },
     validate: (value) => moment() > value || "Date of Birth can not be greater than current date"
   }
-});
-const State = () => /* @__PURE__ */ React.createElement(FormItemLayout, {
-  floatingLabel: true,
-  inputComponent: ComboBox,
-  labelText: "State",
+}));
+const State = () => /* @__PURE__ */ React.createElement(FormLayoutBlockItem, {
+  label: "State",
+  inputID: "state",
+  required: true
+}, /* @__PURE__ */ React.createElement(ComboBox, {
+  id: "state",
   name: "state",
-  required: true,
   rules: { required: { value: true, message: "State is required" } },
   options: [
     { value: "ca", label: "California" },
     { value: "nj", label: "New Jersey" }
   ]
-});
-const MaritalStatus = () => /* @__PURE__ */ React.createElement(FormItemLayout, {
-  floatingLabel: true,
-  inputComponent: ComboBox,
-  labelText: "Marital Status",
+}));
+const MaritalStatus = () => /* @__PURE__ */ React.createElement(FormLayoutBlockItem, {
+  label: "Marital Status",
+  inputID: "marital_status",
+  required: true
+}, /* @__PURE__ */ React.createElement(ComboBox, {
+  id: "marital_status",
   name: "marital_status",
-  required: true,
   rules: {
     required: { value: true, message: "Marital Status is required" }
   },
@@ -51,7 +56,7 @@ const MaritalStatus = () => /* @__PURE__ */ React.createElement(FormItemLayout,
     { value: "married", label: "Married" },
     { value: "single", label: "Single" }
   ]
-});
+}));
 export {
   DOB,
   FirstName,

package/dist/es/view/form/submit-button/index.js

@@ -1,13 +1,12 @@
+import * as React from "react";
 import { useFormContext } from "react-hook-form";
-import DSButton from "@elliemae/ds-basic/Button";
-const FormSubmitButton = ({
-  ...rest
-}) => {
+import { DSButtonV2 } from "@elliemae/ds-button";
+const FormSubmitButton = ({ ...rest }) => {
   const {
     formState,
     formProps: { mode }
   } = useFormContext();
-  return /* @__PURE__ */ React.createElement(DSButton, {
+  return /* @__PURE__ */ React.createElement(DSButtonV2, {
     ...rest,
     type: "submit",
     disabled: mode !== "onSubmit" && (!formState.isDirty || formState.isDirty && !formState.isValid)

package/dist/es/view/guest-unload-handlers/index.js

@@ -1,4 +1,4 @@
-import { sendMessageToHost } from "../message-to-host-app";
+import { sendMessageToHost } from "../message-to-host-app/index.js";
 const onGuestUnloadStart = () => new Promise((resolve) => {
   window.addEventListener("message", (msg) => {
     if (msg.data.id === "unload-guest" || msg.data.id === "close_loan") {

package/dist/es/view/live-message/index.js

@@ -1,5 +1,6 @@
+import * as React from "react";
 import { LiveMessage as AriaLiveMessage } from "react-aria-live";
-import { useAppSelector } from "../../data/react-redux";
+import { useAppSelector } from "../../data/react-redux.js";
 const LiveMessage = () => {
   const message = useAppSelector((state) => state.liveMessage?.message);
   const id = useAppSelector((state) => state.liveMessage?.id);

package/dist/es/view/loadable/index.js

@@ -1,5 +1,6 @@
+import * as React from "react";
 import { lazy, Suspense } from "react";
-import { WaitMessageLauncher } from "../modals/wait-message/wait-message-launcher";
+import { WaitMessageLauncher } from "../modals/wait-message/wait-message-launcher.js";
 const loadable = (importFunc, fallback = /* @__PURE__ */ React.createElement(WaitMessageLauncher, null)) => {
   const LazyComponent = lazy(importFunc);
   return (props) => /* @__PURE__ */ React.createElement(Suspense, {

package/dist/es/view/login/index.js

@@ -1,12 +1,8 @@
 import { useEffect } from "react";
-import { useAppDispatch } from "../../data/react-redux";
-import { login } from "../../utils/auth";
-import { LOGIN_SUCCESS } from "../../data/auth/actions";
-const Login = ({
-  clientId,
-  scope,
-  responseType
-}) => {
+import { useAppDispatch } from "../../data/react-redux.js";
+import { login } from "../../utils/auth/index.js";
+import { LOGIN_SUCCESS } from "../../data/auth/actions.js";
+const Login = ({ clientId, scope, responseType }) => {
   const dispatch = useAppDispatch();
   useEffect(() => {
     login({ clientId, scope, responseType }).then(() => {
@@ -14,7 +10,7 @@ const Login = ({
     }).catch(() => {
     });
   }, [dispatch, clientId, scope, responseType]);
-  return /* @__PURE__ */ React.createElement(React.Fragment, null);
+  return null;
 };
 export {
   Login

package/dist/es/view/message-to-host-app/index.js

@@ -1,4 +1,4 @@
-import { removeEvent } from "../host-binding-events";
+import { removeEvent } from "../host-binding-events/index.js";
 const getHostAppData = (action, resolve) => (event) => {
   if (event.data.id === "host-app-data") {
     action(event.data);