npm - @oneblink/apps-react - Versions diffs - 4.1.0-beta.7 → 4.1.0-beta.8 - Mend

@oneblink/apps-react 4.1.0-beta.7 → 4.1.0-beta.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (177) hide show

package/dist/hooks/useDrafts.js ADDED Viewed

@@ -0,0 +1,204 @@
+import * as React from 'react';
+import { draftService, submissionService } from '@oneblink/apps';
+import useAuth from './useAuth';
+import useIsMounted from './useIsMounted';
+import useIsOffline from './useIsOffline';
+const defaultLoadState = {
+    isLoading: false,
+    loadError: null,
+    drafts: [],
+};
+const defaultSyncState = {
+    isSyncing: false,
+    syncError: null,
+};
+const DraftsContext = React.createContext(undefined);
+/**
+ * React Component that provides the context for the `useDrafts()` hook to be
+ * used by components further down your component tree. **It should only be
+ * included in your component tree once and ideally at the root of the
+ * application.**
+ *
+ * #### Example
+ *
+ * ```jsx
+ * import * as React from 'react'
+ * import { DraftsContextProvider, useDrafts } from '@oneblink/apps-react'
+ *
+ * function Component() {
+ *   const draftsContext = useDrafts()
+ *   // use drafts here
+ * }
+ *
+ * function App() {
+ *   return (
+ *     <DraftsContextProvider>
+ *       <Component />
+ *     </DraftsContextProvider>
+ *   )
+ * }
+ *
+ * const root = document.getElementById('root')
+ * if (root) {
+ *   ReactDOM.render(<App />, root)
+ * }
+ * ```
+ *
+ * @param props
+ * @returns
+ * @group Components
+ */
+export function DraftsContextProvider({
+/** The identifier for the forms app associated with the user's drafts */
+formsAppId,
+/**
+ * `true` if drafts are enabled, otherwise `false`. Can be used for account
+ * tier validation.
+ */
+isDraftsEnabled,
+/** Your application components */
+children, }) {
+    const isMounted = useIsMounted();
+    const isOffline = useIsOffline();
+    const { isLoggedIn, isUsingFormsKey } = useAuth();
+    const [syncState, setSyncState] = React.useState(defaultSyncState);
+    const clearSyncError = React.useCallback(() => {
+        setSyncState((currentState) => ({
+            ...currentState,
+            syncError: null,
+        }));
+    }, []);
+    const syncDrafts = React.useCallback(async () => {
+        if (!isDraftsEnabled || !isLoggedIn || isUsingFormsKey) {
+            return;
+        }
+        if (isMounted.current) {
+            setSyncState({
+                isSyncing: true,
+                syncError: null,
+            });
+        }
+        let newError = null;
+        try {
+            await draftService.syncDrafts({
+                formsAppId,
+                throwError: false,
+            });
+        }
+        catch (error) {
+            newError = error;
+        }
+        if (isMounted.current) {
+            setSyncState({
+                isSyncing: false,
+                syncError: newError,
+            });
+        }
+    }, [formsAppId, isDraftsEnabled, isLoggedIn, isMounted, isUsingFormsKey]);
+    const [loadState, setLoadState] = React.useState(defaultLoadState);
+    const clearLoadError = React.useCallback(() => {
+        setLoadState((currentState) => ({
+            ...currentState,
+            loadError: null,
+        }));
+    }, []);
+    const reloadDrafts = React.useCallback(async () => {
+        if (!isLoggedIn) {
+            if (isMounted.current) {
+                setLoadState({
+                    isLoading: false,
+                    loadError: null,
+                    drafts: [],
+                });
+            }
+            return;
+        }
+        if (isMounted.current) {
+            setLoadState((currentState) => ({
+                isLoading: true,
+                loadError: null,
+                drafts: currentState.drafts,
+            }));
+        }
+        let newError = null;
+        let newDrafts = [];
+        try {
+            newDrafts = await draftService.getDrafts();
+        }
+        catch (error) {
+            newError = error;
+        }
+        if (isMounted.current) {
+            setLoadState({
+                isLoading: false,
+                loadError: newError,
+                drafts: newDrafts,
+            });
+        }
+    }, [isMounted, isLoggedIn]);
+    const deleteDraft = React.useCallback((draftId) => {
+        return draftService.deleteDraft(draftId, formsAppId);
+    }, [formsAppId]);
+    const value = React.useMemo(() => ({
+        // Sync
+        syncDrafts,
+        isSyncing: syncState.isSyncing,
+        syncError: syncState.syncError,
+        clearSyncError,
+        // Load
+        reloadDrafts,
+        isLoading: loadState.isLoading,
+        drafts: loadState.drafts,
+        loadError: loadState.loadError,
+        clearLoadError,
+        // Delete,
+        deleteDraft,
+    }), [
+        clearLoadError,
+        clearSyncError,
+        loadState.drafts,
+        loadState.isLoading,
+        loadState.loadError,
+        reloadDrafts,
+        syncDrafts,
+        syncState.isSyncing,
+        syncState.syncError,
+        deleteDraft,
+    ]);
+    React.useEffect(() => {
+        reloadDrafts();
+        const unregisterPendingQueueListener = submissionService.registerPendingQueueListener(reloadDrafts);
+        const unregisterDraftsListener = draftService.registerDraftsListener((drafts) => {
+            setLoadState({
+                isLoading: false,
+                drafts,
+                loadError: null,
+            });
+        });
+        return () => {
+            unregisterPendingQueueListener();
+            unregisterDraftsListener();
+        };
+    }, [reloadDrafts]);
+    React.useEffect(() => {
+        if (!isOffline) {
+            syncDrafts();
+        }
+    }, [isOffline, syncDrafts]);
+    return (React.createElement(DraftsContext.Provider, { value: value }, children));
+}
+/**
+ * React hook to get the context value for Drafts. Will throw an Error if used
+ * outside of the `<DraftsContextProvider />` component.
+ *
+ * @returns
+ * @group Hooks
+ */
+export default function useDrafts() {
+    const value = React.useContext(DraftsContext);
+    if (!value) {
+        throw new Error(`"useDrafts" hook was used outside of the "<DraftsContextProvider />" component's children.`);
+    }
+    return value;
+}
+//# sourceMappingURL=useDrafts.js.map

package/dist/hooks/useDrafts.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useDrafts.js","sourceRoot":"","sources":["../../src/hooks/useDrafts.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { draftService, submissionService } from '@oneblink/apps'\nimport { SubmissionTypes } from '@oneblink/types'\nimport useAuth from './useAuth'\nimport useIsMounted from './useIsMounted'\nimport useIsOffline from './useIsOffline'\n\n/** The value returned from `useDrafts()` hook */\nexport type DraftsContextValue = {\n /** `true` drafts are currently loading. */\n isLoading: boolean\n /** An Error object if loading drafts fails */\n loadError: Error | null\n /** The incomplete submissions that were saved for later */\n drafts: SubmissionTypes.FormsAppDraft[]\n /** A function to trigger loading of the drafts */\n reloadDrafts: () => unknown\n /** A function to clear Error object from loading drafts */\n clearLoadError: () => void\n /** `true` drafts are syncing with other devices */\n isSyncing: boolean\n /** A function to trigger syncing of the drafts */\n syncDrafts: () => unknown\n /** An Error object if syncing drafts fails */\n syncError: Error | null\n /** A function to clear Error object from syncing drafts */\n clearSyncError: () => void\n /** A function to remove a draft */\n deleteDraft: (draftId: string) => Promise<void>\n}\n\nconst defaultLoadState = {\n isLoading: false,\n loadError: null,\n drafts: [],\n}\n\nconst defaultSyncState = {\n isSyncing: false,\n syncError: null,\n}\n\nconst DraftsContext = React.createContext<DraftsContextValue | undefined>(\n undefined,\n)\n\n/**\n * React Component that provides the context for the `useDrafts()` hook to be\n * used by components further down your component tree. **It should only be\n * included in your component tree once and ideally at the root of the\n * application.**\n *\n * #### Example\n *\n * ```jsx\n * import * as React from 'react'\n * import { DraftsContextProvider, useDrafts } from '@oneblink/apps-react'\n *\n * function Component() {\n * const draftsContext = useDrafts()\n * // use drafts here\n * }\n *\n * function App() {\n * return (\n * <DraftsContextProvider>\n * <Component />\n * </DraftsContextProvider>\n * )\n * }\n *\n * const root = document.getElementById('root')\n * if (root) {\n * ReactDOM.render(<App />, root)\n * }\n * ```\n *\n * @param props\n * @returns\n * @group Components\n */\nexport function DraftsContextProvider({\n /** The identifier for the forms app associated with the user's drafts */\n formsAppId,\n /**\n * `true` if drafts are enabled, otherwise `false`. Can be used for account\n * tier validation.\n */\n isDraftsEnabled,\n /** Your application components */\n children,\n}: {\n formsAppId: number\n isDraftsEnabled: boolean\n children: React.ReactNode\n}) {\n const isMounted = useIsMounted()\n const isOffline = useIsOffline()\n const { isLoggedIn, isUsingFormsKey } = useAuth()\n\n const [syncState, setSyncState] = React.useState<{\n isSyncing: boolean\n syncError: Error | null\n }>(defaultSyncState)\n const clearSyncError = React.useCallback(() => {\n setSyncState((currentState) => ({\n ...currentState,\n syncError: null,\n }))\n }, [])\n const syncDrafts = React.useCallback(async () => {\n if (!isDraftsEnabled || !isLoggedIn || isUsingFormsKey) {\n return\n }\n\n if (isMounted.current) {\n setSyncState({\n isSyncing: true,\n syncError: null,\n })\n }\n\n let newError = null\n\n try {\n await draftService.syncDrafts({\n formsAppId,\n throwError: false,\n })\n } catch (error) {\n newError = error as Error\n }\n\n if (isMounted.current) {\n setSyncState({\n isSyncing: false,\n syncError: newError,\n })\n }\n }, [formsAppId, isDraftsEnabled, isLoggedIn, isMounted, isUsingFormsKey])\n\n const [loadState, setLoadState] = React.useState<{\n isLoading: boolean\n loadError: Error | null\n drafts: SubmissionTypes.FormsAppDraft[]\n }>(defaultLoadState)\n const clearLoadError = React.useCallback(() => {\n setLoadState((currentState) => ({\n ...currentState,\n loadError: null,\n }))\n }, [])\n const reloadDrafts = React.useCallback(async () => {\n if (!isLoggedIn) {\n if (isMounted.current) {\n setLoadState({\n isLoading: false,\n loadError: null,\n drafts: [],\n })\n }\n return\n }\n\n if (isMounted.current) {\n setLoadState((currentState) => ({\n isLoading: true,\n loadError: null,\n drafts: currentState.drafts,\n }))\n }\n\n let newError = null\n let newDrafts: SubmissionTypes.FormsAppDraft[] = []\n\n try {\n newDrafts = await draftService.getDrafts()\n } catch (error) {\n newError = error as Error\n }\n\n if (isMounted.current) {\n setLoadState({\n isLoading: false,\n loadError: newError,\n drafts: newDrafts,\n })\n }\n }, [isMounted, isLoggedIn])\n\n const deleteDraft = React.useCallback(\n (draftId) => {\n return draftService.deleteDraft(draftId, formsAppId)\n },\n [formsAppId],\n )\n\n const value = React.useMemo(\n () => ({\n // Sync\n syncDrafts,\n isSyncing: syncState.isSyncing,\n syncError: syncState.syncError,\n clearSyncError,\n // Load\n reloadDrafts,\n isLoading: loadState.isLoading,\n drafts: loadState.drafts,\n loadError: loadState.loadError,\n clearLoadError,\n // Delete,\n deleteDraft,\n }),\n [\n clearLoadError,\n clearSyncError,\n loadState.drafts,\n loadState.isLoading,\n loadState.loadError,\n reloadDrafts,\n syncDrafts,\n syncState.isSyncing,\n syncState.syncError,\n deleteDraft,\n ],\n )\n\n React.useEffect(() => {\n reloadDrafts()\n const unregisterPendingQueueListener =\n submissionService.registerPendingQueueListener(reloadDrafts)\n const unregisterDraftsListener = draftService.registerDraftsListener(\n (drafts) => {\n setLoadState({\n isLoading: false,\n drafts,\n loadError: null,\n })\n },\n )\n return () => {\n unregisterPendingQueueListener()\n unregisterDraftsListener()\n }\n }, [reloadDrafts])\n\n React.useEffect(() => {\n if (!isOffline) {\n syncDrafts()\n }\n }, [isOffline, syncDrafts])\n\n return (\n <DraftsContext.Provider value={value}>{children}</DraftsContext.Provider>\n )\n}\n\n/**\n * React hook to get the context value for Drafts. Will throw an Error if used\n * outside of the `<DraftsContextProvider />` component.\n *\n * @returns\n * @group Hooks\n */\nexport default function useDrafts(): DraftsContextValue {\n const value = React.useContext(DraftsContext)\n if (!value) {\n throw new Error(\n `\"useDrafts\" hook was used outside of the \"<DraftsContextProvider />\" component's children.`,\n )\n }\n return value\n}\n"]}

package/dist/hooks/useFormSubmissionAutoSaveState.d.ts CHANGED Viewed

@@ -1,7 +1,16 @@
 import * as React from 'react';
 import { submissionService } from '@oneblink/apps';
-import { FormTypes } from '@oneblink/types';
-import { FormSubmissionModel } from '../types/form';
+import { FormTypes, SubmissionTypes } from '@oneblink/types';
+/**
+ * Use this if you want to implement a controlled auto saving form. See
+ * {@link OneBlinkFormControlled} for a full example. If you do not need to
+ * control the `submission` or `definition` properties, you can use the
+ * {@link OneBlinkAutoSaveForm} component.
+ *
+ * @param options
+ * @returns
+ * @group Hooks
+ */
 export default function useFormSubmissionAutoSaveState({ form, initialSubmission, resumeAtElement, removeAutoSaveDataBeforeSubmit, removeAutoSaveDataBeforeSaveDraft, autoSaveKey, onCancel, onSubmit, onSaveDraft, }: {
     form: FormTypes.Form;
     removeAutoSaveDataBeforeSubmit?: boolean;
@@ -9,12 +18,14 @@ export default function useFormSubmissionAutoSaveState({ form, initialSubmission
     autoSaveKey: string;
     onCancel: () => unknown;
     onSubmit: (newFormSubmission: submissionService.NewFormSubmission) => unknown;
-    initialSubmission?: FormSubmissionModel;
+    initialSubmission?: SubmissionTypes.S3SubmissionData['submission'];
     resumeAtElement?: FormTypes.FormElement;
     onSaveDraft?: (newDraftSubmission: submissionService.NewDraftSubmission) => unknown;
 }): {
     definition: FormTypes.Form;
-    submission: FormSubmissionModel;
+    submission: {
+        [name: string]: unknown;
+    };
     lastElementUpdated: FormTypes.FormElement | undefined;
     isLoadingAutoSaveSubmission: boolean;
     isAutoSaveSubmissionAvailable: boolean;
@@ -26,7 +37,9 @@ export default function useFormSubmissionAutoSaveState({ form, initialSubmission
     handleNavigateAway: () => void;
     setFormSubmission: React.Dispatch<React.SetStateAction<{
         definition: FormTypes.Form;
-        submission: FormSubmissionModel;
+        submission: {
+            [name: string]: unknown;
+        };
         lastElementUpdated: FormTypes.FormElement | undefined;
     }>>;
 };

package/dist/hooks/useFormSubmissionAutoSaveState.js CHANGED Viewed

@@ -2,6 +2,16 @@ import * as React from 'react';
 import _throttle from 'lodash.throttle';
 import { autoSaveService, Sentry } from '@oneblink/apps';
 import useFormSubmissionState from './useFormSubmissionState';
+/**
+ * Use this if you want to implement a controlled auto saving form. See
+ * {@link OneBlinkFormControlled} for a full example. If you do not need to
+ * control the `submission` or `definition` properties, you can use the
+ * {@link OneBlinkAutoSaveForm} component.
+ *
+ * @param options
+ * @returns
+ * @group Hooks
+ */
 export default function useFormSubmissionAutoSaveState({ form, initialSubmission, resumeAtElement, removeAutoSaveDataBeforeSubmit, removeAutoSaveDataBeforeSaveDraft, autoSaveKey, onCancel, onSubmit, onSaveDraft, }) {
     const [{ definition, submission, lastElementUpdated }, setFormSubmission] = useFormSubmissionState(form, initialSubmission, resumeAtElement);
     const [{ isLoadingAutoSaveSubmission, autoSaveSubmission, autoSaveElement }, setAutoSaveState,] = React.useState({

package/dist/hooks/useFormSubmissionAutoSaveState.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFormSubmissionAutoSaveState.js","sourceRoot":"","sources":["../../src/hooks/useFormSubmissionAutoSaveState.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport _throttle from 'lodash.throttle'\nimport { autoSaveService, submissionService, Sentry } from '@oneblink/apps'\nimport { FormTypes } from '@oneblink/types'\nimport useFormSubmissionState from './useFormSubmissionState'\nimport { FormSubmissionModel } from '../types/form'\nimport { FormElement } from '@oneblink/types/typescript/forms'\n\nexport default function useFormSubmissionAutoSaveState({\n form,\n initialSubmission,\n resumeAtElement,\n removeAutoSaveDataBeforeSubmit,\n removeAutoSaveDataBeforeSaveDraft,\n autoSaveKey,\n onCancel,\n onSubmit,\n onSaveDraft,\n}: {\n form: FormTypes.Form\n removeAutoSaveDataBeforeSubmit?: boolean\n removeAutoSaveDataBeforeSaveDraft?: boolean\n autoSaveKey: string\n onCancel: () => unknown\n onSubmit: (newFormSubmission: submissionService.NewFormSubmission) => unknown\n initialSubmission?: FormSubmissionModel\n resumeAtElement?: FormTypes.FormElement\n onSaveDraft?: (\n newDraftSubmission: submissionService.NewDraftSubmission,\n ) => unknown\n}) {\n const [{ definition, submission, lastElementUpdated }, setFormSubmission] =\n useFormSubmissionState(form, initialSubmission, resumeAtElement)\n\n const [\n { isLoadingAutoSaveSubmission, autoSaveSubmission, autoSaveElement },\n setAutoSaveState,\n ] = React.useState<{\n isLoadingAutoSaveSubmission: boolean\n autoSaveSubmission: FormSubmissionModel \| null\n autoSaveElement: FormElement \| null\n }>({\n isLoadingAutoSaveSubmission: true,\n autoSaveSubmission: null,\n autoSaveElement: null,\n })\n\n const throttledAutoSave = React.useMemo(() => {\n return _throttle(\n (model: FormSubmissionModel, lastElementUpdated?: FormElement) => {\n console.log('Auto saving...')\n autoSaveService\n .upsertAutoSaveData(definition.id, autoSaveKey, model)\n .then(() => {\n if (lastElementUpdated) {\n return autoSaveService.upsertAutoSaveData<FormElement>(\n definition.id,\n `LAST_ELEMENT_UPDATED_${autoSaveKey}`,\n lastElementUpdated,\n )\n }\n })\n .catch((error) => {\n console.warn('Error while auto saving', error)\n Sentry.captureException(error)\n })\n },\n 9580, // https://en.wikipedia.org/wiki/100_metres\n { trailing: true, leading: false },\n )\n }, [autoSaveKey, definition.id])\n\n const cancelAutoSave = React.useCallback(() => {\n if (throttledAutoSave) {\n throttledAutoSave.cancel()\n }\n }, [throttledAutoSave])\n\n const deleteAutoSaveSubmission = React.useCallback(() => {\n return autoSaveService\n .deleteAutoSaveData(definition.id, autoSaveKey)\n .catch((error) => {\n console.warn('Error removing auto save data: ', error)\n Sentry.captureException(error)\n })\n }, [autoSaveKey, definition.id])\n\n const handleSubmit = React.useCallback(\n (submissionResult: submissionService.NewFormSubmission) => {\n cancelAutoSave()\n if (removeAutoSaveDataBeforeSubmit !== false) {\n deleteAutoSaveSubmission()\n }\n onSubmit(submissionResult)\n },\n [\n cancelAutoSave,\n deleteAutoSaveSubmission,\n onSubmit,\n removeAutoSaveDataBeforeSubmit,\n ],\n )\n\n const handleSaveDraft = React.useMemo(() => {\n if (onSaveDraft) {\n return (newDraftSubmission: submissionService.NewDraftSubmission) => {\n cancelAutoSave()\n if (removeAutoSaveDataBeforeSaveDraft !== false) {\n deleteAutoSaveSubmission()\n }\n if (onSaveDraft) {\n onSaveDraft(newDraftSubmission)\n }\n }\n }\n }, [\n cancelAutoSave,\n deleteAutoSaveSubmission,\n onSaveDraft,\n removeAutoSaveDataBeforeSaveDraft,\n ])\n\n const handleNavigateAway = React.useCallback(() => {\n cancelAutoSave()\n deleteAutoSaveSubmission()\n }, [cancelAutoSave, deleteAutoSaveSubmission])\n\n const handleCancel = React.useCallback(() => {\n cancelAutoSave()\n deleteAutoSaveSubmission()\n onCancel()\n }, [cancelAutoSave, deleteAutoSaveSubmission, onCancel])\n\n React.useEffect(() => {\n let ignore = false\n const loadAutoSaveData = async () => {\n try {\n const autoSaveSubmission =\n await autoSaveService.getAutoSaveData<FormSubmissionModel>(\n definition.id,\n autoSaveKey,\n )\n const autoSaveElement =\n await autoSaveService.getAutoSaveData<FormElement>(\n definition.id,\n `LAST_ELEMENT_UPDATED_${autoSaveKey}`,\n )\n if (!ignore) {\n setAutoSaveState({\n isLoadingAutoSaveSubmission: false,\n autoSaveSubmission,\n autoSaveElement,\n })\n }\n } catch (error) {\n console.warn('Error loading auto save data', error)\n Sentry.captureException(error)\n if (!ignore) {\n setAutoSaveState({\n isLoadingAutoSaveSubmission: false,\n autoSaveSubmission: null,\n autoSaveElement: null,\n })\n }\n }\n }\n loadAutoSaveData()\n return () => {\n ignore = true\n }\n }, [autoSaveKey, definition.id])\n\n // Clean up throttle function on unmount\n React.useEffect(() => {\n return () => {\n cancelAutoSave()\n }\n }, [cancelAutoSave])\n\n const setFormSubmissionAutoSave: typeof setFormSubmission = React.useCallback(\n (formSubmission) => {\n setFormSubmission((currentFormSubmission) => {\n const newFormSubmission =\n typeof formSubmission === 'function'\n ? formSubmission(currentFormSubmission)\n : formSubmission\n\n throttledAutoSave(\n newFormSubmission.submission,\n newFormSubmission.lastElementUpdated,\n )\n\n return newFormSubmission\n })\n },\n [setFormSubmission, throttledAutoSave],\n )\n\n const startNewSubmission = React.useCallback(() => {\n deleteAutoSaveSubmission()\n setAutoSaveState({\n isLoadingAutoSaveSubmission: false,\n autoSaveSubmission: null,\n autoSaveElement: null,\n })\n }, [deleteAutoSaveSubmission])\n\n const continueAutoSaveSubmission = React.useCallback(() => {\n if (autoSaveSubmission) {\n setFormSubmission((currentFormSubmission) => ({\n ...currentFormSubmission,\n submission: autoSaveSubmission,\n lastElementUpdated: autoSaveElement ? autoSaveElement : undefined,\n }))\n }\n setAutoSaveState({\n isLoadingAutoSaveSubmission: false,\n autoSaveSubmission: null,\n autoSaveElement: null,\n })\n }, [autoSaveSubmission, setFormSubmission, autoSaveElement])\n\n return {\n definition,\n submission,\n lastElementUpdated,\n isLoadingAutoSaveSubmission,\n isAutoSaveSubmissionAvailable: autoSaveSubmission !== null,\n startNewSubmission,\n continueAutoSaveSubmission,\n handleSubmit,\n handleCancel,\n handleSaveDraft,\n handleNavigateAway,\n setFormSubmission: setFormSubmissionAutoSave,\n }\n}\n"]}
1	+ {"version":3,"file":"useFormSubmissionAutoSaveState.js","sourceRoot":"","sources":["../../src/hooks/useFormSubmissionAutoSaveState.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport _throttle from 'lodash.throttle'\nimport { autoSaveService, submissionService, Sentry } from '@oneblink/apps'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport useFormSubmissionState from './useFormSubmissionState'\nimport { FormElement } from '@oneblink/types/typescript/forms'\n\n/*\n Use this if you want to implement a controlled auto saving form. See\n * {@link OneBlinkFormControlled} for a full example. If you do not need to\n * control the `submission` or `definition` properties, you can use the\n * {@link OneBlinkAutoSaveForm} component.\n \n @param options\n * @returns\n * @group Hooks\n */\nexport default function useFormSubmissionAutoSaveState({\n form,\n initialSubmission,\n resumeAtElement,\n removeAutoSaveDataBeforeSubmit,\n removeAutoSaveDataBeforeSaveDraft,\n autoSaveKey,\n onCancel,\n onSubmit,\n onSaveDraft,\n}: {\n form: FormTypes.Form\n removeAutoSaveDataBeforeSubmit?: boolean\n removeAutoSaveDataBeforeSaveDraft?: boolean\n autoSaveKey: string\n onCancel: () => unknown\n onSubmit: (newFormSubmission: submissionService.NewFormSubmission) => unknown\n initialSubmission?: SubmissionTypes.S3SubmissionData['submission']\n resumeAtElement?: FormTypes.FormElement\n onSaveDraft?: (\n newDraftSubmission: submissionService.NewDraftSubmission,\n ) => unknown\n}) {\n const [{ definition, submission, lastElementUpdated }, setFormSubmission] =\n useFormSubmissionState(form, initialSubmission, resumeAtElement)\n\n const [\n { isLoadingAutoSaveSubmission, autoSaveSubmission, autoSaveElement },\n setAutoSaveState,\n ] = React.useState<{\n isLoadingAutoSaveSubmission: boolean\n autoSaveSubmission: SubmissionTypes.S3SubmissionData['submission'] \| null\n autoSaveElement: FormElement \| null\n }>({\n isLoadingAutoSaveSubmission: true,\n autoSaveSubmission: null,\n autoSaveElement: null,\n })\n\n const throttledAutoSave = React.useMemo(() => {\n return _throttle(\n (\n model: SubmissionTypes.S3SubmissionData['submission'],\n lastElementUpdated?: FormElement,\n ) => {\n console.log('Auto saving...')\n autoSaveService\n .upsertAutoSaveData(definition.id, autoSaveKey, model)\n .then(() => {\n if (lastElementUpdated) {\n return autoSaveService.upsertAutoSaveData<FormElement>(\n definition.id,\n `LAST_ELEMENT_UPDATED_${autoSaveKey}`,\n lastElementUpdated,\n )\n }\n })\n .catch((error) => {\n console.warn('Error while auto saving', error)\n Sentry.captureException(error)\n })\n },\n 9580, // https://en.wikipedia.org/wiki/100_metres\n { trailing: true, leading: false },\n )\n }, [autoSaveKey, definition.id])\n\n const cancelAutoSave = React.useCallback(() => {\n if (throttledAutoSave) {\n throttledAutoSave.cancel()\n }\n }, [throttledAutoSave])\n\n const deleteAutoSaveSubmission = React.useCallback(() => {\n return autoSaveService\n .deleteAutoSaveData(definition.id, autoSaveKey)\n .catch((error) => {\n console.warn('Error removing auto save data: ', error)\n Sentry.captureException(error)\n })\n }, [autoSaveKey, definition.id])\n\n const handleSubmit = React.useCallback(\n (submissionResult: submissionService.NewFormSubmission) => {\n cancelAutoSave()\n if (removeAutoSaveDataBeforeSubmit !== false) {\n deleteAutoSaveSubmission()\n }\n onSubmit(submissionResult)\n },\n [\n cancelAutoSave,\n deleteAutoSaveSubmission,\n onSubmit,\n removeAutoSaveDataBeforeSubmit,\n ],\n )\n\n const handleSaveDraft = React.useMemo(() => {\n if (onSaveDraft) {\n return (newDraftSubmission: submissionService.NewDraftSubmission) => {\n cancelAutoSave()\n if (removeAutoSaveDataBeforeSaveDraft !== false) {\n deleteAutoSaveSubmission()\n }\n if (onSaveDraft) {\n onSaveDraft(newDraftSubmission)\n }\n }\n }\n }, [\n cancelAutoSave,\n deleteAutoSaveSubmission,\n onSaveDraft,\n removeAutoSaveDataBeforeSaveDraft,\n ])\n\n const handleNavigateAway = React.useCallback(() => {\n cancelAutoSave()\n deleteAutoSaveSubmission()\n }, [cancelAutoSave, deleteAutoSaveSubmission])\n\n const handleCancel = React.useCallback(() => {\n cancelAutoSave()\n deleteAutoSaveSubmission()\n onCancel()\n }, [cancelAutoSave, deleteAutoSaveSubmission, onCancel])\n\n React.useEffect(() => {\n let ignore = false\n const loadAutoSaveData = async () => {\n try {\n const autoSaveSubmission = await autoSaveService.getAutoSaveData<\n SubmissionTypes.S3SubmissionData['submission']\n >(definition.id, autoSaveKey)\n const autoSaveElement =\n await autoSaveService.getAutoSaveData<FormElement>(\n definition.id,\n `LAST_ELEMENT_UPDATED_${autoSaveKey}`,\n )\n if (!ignore) {\n setAutoSaveState({\n isLoadingAutoSaveSubmission: false,\n autoSaveSubmission,\n autoSaveElement,\n })\n }\n } catch (error) {\n console.warn('Error loading auto save data', error)\n Sentry.captureException(error)\n if (!ignore) {\n setAutoSaveState({\n isLoadingAutoSaveSubmission: false,\n autoSaveSubmission: null,\n autoSaveElement: null,\n })\n }\n }\n }\n loadAutoSaveData()\n return () => {\n ignore = true\n }\n }, [autoSaveKey, definition.id])\n\n // Clean up throttle function on unmount\n React.useEffect(() => {\n return () => {\n cancelAutoSave()\n }\n }, [cancelAutoSave])\n\n const setFormSubmissionAutoSave: typeof setFormSubmission = React.useCallback(\n (formSubmission) => {\n setFormSubmission((currentFormSubmission) => {\n const newFormSubmission =\n typeof formSubmission === 'function'\n ? formSubmission(currentFormSubmission)\n : formSubmission\n\n throttledAutoSave(\n newFormSubmission.submission,\n newFormSubmission.lastElementUpdated,\n )\n\n return newFormSubmission\n })\n },\n [setFormSubmission, throttledAutoSave],\n )\n\n const startNewSubmission = React.useCallback(() => {\n deleteAutoSaveSubmission()\n setAutoSaveState({\n isLoadingAutoSaveSubmission: false,\n autoSaveSubmission: null,\n autoSaveElement: null,\n })\n }, [deleteAutoSaveSubmission])\n\n const continueAutoSaveSubmission = React.useCallback(() => {\n if (autoSaveSubmission) {\n setFormSubmission((currentFormSubmission) => ({\n ...currentFormSubmission,\n submission: autoSaveSubmission,\n lastElementUpdated: autoSaveElement ? autoSaveElement : undefined,\n }))\n }\n setAutoSaveState({\n isLoadingAutoSaveSubmission: false,\n autoSaveSubmission: null,\n autoSaveElement: null,\n })\n }, [autoSaveSubmission, setFormSubmission, autoSaveElement])\n\n return {\n definition,\n submission,\n lastElementUpdated,\n isLoadingAutoSaveSubmission,\n isAutoSaveSubmissionAvailable: autoSaveSubmission !== null,\n startNewSubmission,\n continueAutoSaveSubmission,\n handleSubmit,\n handleCancel,\n handleSaveDraft,\n handleNavigateAway,\n setFormSubmission: setFormSubmissionAutoSave,\n }\n}\n"]}

package/dist/hooks/useFormSubmissionModelContext.d.ts CHANGED Viewed

@@ -1,14 +1,14 @@
-import { FormTypes } from '@oneblink/types';
+import { FormTypes, SubmissionTypes } from '@oneblink/types';
 import { FormElement } from '@oneblink/types/typescript/forms';
 import * as React from 'react';
-import { FormElementsConditionallyShown, FormSubmissionModel } from '../types/form';
+import { FormElementsConditionallyShown } from '../types/form';
 export type FormSubmissionModelContextValue = {
-    formSubmissionModel: FormSubmissionModel;
+    formSubmissionModel: SubmissionTypes.S3SubmissionData['submission'];
     parent?: FormSubmissionModelContextValue;
     elements: FormElement[];
 };
 export declare function FormSubmissionModelContextProvider({ children, model, elements, formElementsConditionallyShown, }: {
-    model: FormSubmissionModel;
+    model: SubmissionTypes.S3SubmissionData['submission'];
     elements: FormTypes.FormElement[];
     formElementsConditionallyShown: FormElementsConditionallyShown | undefined;
     children: React.ReactNode;

package/dist/hooks/useFormSubmissionModelContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFormSubmissionModelContext.js","sourceRoot":"","sources":["../../src/hooks/useFormSubmissionModelContext.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,wBAAwB,MAAM,sCAAsC,CAAA;~~AAY3E~~,MAAM,0BAA0B,GAAG,KAAK,CAAC,aAAa,CAEpD,SAAS,CAAC,CAAA;AAEZ,MAAM,UAAU,kCAAkC,CAAC,EACjD,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,8BAA8B,GAM/B;IACC,MAAM,0BAA0B,GAAG,KAAK,CAAC,UAAU,CACjD,0BAA0B,CAC3B,CAAA;IACD,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC/B,OAAO;YACL,mBAAmB,EAAE,wBAAwB,CAC3C,KAAK,EACL,QAAQ,EACR,8BAA8B,EAC9B,IAAI,CACL,CAAC,KAAK;YACP,MAAM,EAAE,0BAA0B;YAClC,QAAQ;SACT,CAAA;IACH,CAAC,EAAE;QACD,KAAK;QACL,QAAQ;QACR,8BAA8B;QAC9B,0BAA0B;KAC3B,CAAC,CAAA;IACF,OAAO,CACL,oBAAC,0BAA0B,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,IAC9C,QAAQ,CAC2B,CACvC,CAAA;AACH,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,sBAAsB;IAC5C,MAAM,0BAA0B,GAAG,KAAK,CAAC,UAAU,CACjD,0BAA0B,CAC3B,CAAA;IACD,IAAI,CAAC,0BAA0B,EAAE;QAC/B,MAAM,IAAI,KAAK,CACb,oEAAoE,CACrE,CAAA;KACF;IACD,OAAO,0BAA0B,CAAA;AACnC,CAAC;AAED,MAAM,UAAU,4BAA4B;IAC1C,IAAI,0BAA0B,GAAG,sBAAsB,EAAE,CAAA;IACzD,OAAO,0BAA0B,CAAC,MAAM,EAAE;QACxC,0BAA0B,GAAG,0BAA0B,CAAC,MAAM,CAAA;KAC/D;IACD,OAAO,0BAA0B,CAAA;AACnC,CAAC","sourcesContent":["import { FormTypes } from '@oneblink/types'\nimport { FormElement } from '@oneblink/types/typescript/forms'\nimport * as React from 'react'\nimport cleanFormSubmissionModel from '../services/cleanFormSubmissionModel'\nimport {\n FormElementsConditionallyShown~~,\n FormSubmissionModel,\n~~} from '../types/form'\n\nexport type FormSubmissionModelContextValue = {\n formSubmissionModel: ~~FormSubmissionModel~~\n parent?: FormSubmissionModelContextValue\n elements: FormElement[]\n}\n\nconst FormSubmissionModelContext = React.createContext<\n FormSubmissionModelContextValue \| undefined\n>(undefined)\n\nexport function FormSubmissionModelContextProvider({\n children,\n model,\n elements,\n formElementsConditionallyShown,\n}: {\n model: ~~FormSubmissionModel~~\n elements: FormTypes.FormElement[]\n formElementsConditionallyShown: FormElementsConditionallyShown \| undefined\n children: React.ReactNode\n}) {\n const formSubmissionModelContext = React.useContext(\n FormSubmissionModelContext,\n )\n const value = React.useMemo(() => {\n return {\n formSubmissionModel: cleanFormSubmissionModel(\n model,\n elements,\n formElementsConditionallyShown,\n true,\n ).model,\n parent: formSubmissionModelContext,\n elements,\n }\n }, [\n model,\n elements,\n formElementsConditionallyShown,\n formSubmissionModelContext,\n ])\n return (\n <FormSubmissionModelContext.Provider value={value}>\n {children}\n </FormSubmissionModelContext.Provider>\n )\n}\n\nexport default function useFormSubmissionModel() {\n const formSubmissionModelContext = React.useContext(\n FormSubmissionModelContext,\n )\n if (!formSubmissionModelContext) {\n throw new Error(\n '\"FormSubmissionModelContext\" does not have a value in this context',\n )\n }\n return formSubmissionModelContext\n}\n\nexport function useFormSubmissionModelParent() {\n let formSubmissionModelContext = useFormSubmissionModel()\n while (formSubmissionModelContext.parent) {\n formSubmissionModelContext = formSubmissionModelContext.parent\n }\n return formSubmissionModelContext\n}\n"]}
1	+ {"version":3,"file":"useFormSubmissionModelContext.js","sourceRoot":"","sources":["../../src/hooks/useFormSubmissionModelContext.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,wBAAwB,MAAM,sCAAsC,CAAA;AAS3E,MAAM,0BAA0B,GAAG,KAAK,CAAC,aAAa,CAEpD,SAAS,CAAC,CAAA;AAEZ,MAAM,UAAU,kCAAkC,CAAC,EACjD,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,8BAA8B,GAM/B;IACC,MAAM,0BAA0B,GAAG,KAAK,CAAC,UAAU,CACjD,0BAA0B,CAC3B,CAAA;IACD,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC/B,OAAO;YACL,mBAAmB,EAAE,wBAAwB,CAC3C,KAAK,EACL,QAAQ,EACR,8BAA8B,EAC9B,IAAI,CACL,CAAC,KAAK;YACP,MAAM,EAAE,0BAA0B;YAClC,QAAQ;SACT,CAAA;IACH,CAAC,EAAE;QACD,KAAK;QACL,QAAQ;QACR,8BAA8B;QAC9B,0BAA0B;KAC3B,CAAC,CAAA;IACF,OAAO,CACL,oBAAC,0BAA0B,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,IAC9C,QAAQ,CAC2B,CACvC,CAAA;AACH,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,sBAAsB;IAC5C,MAAM,0BAA0B,GAAG,KAAK,CAAC,UAAU,CACjD,0BAA0B,CAC3B,CAAA;IACD,IAAI,CAAC,0BAA0B,EAAE;QAC/B,MAAM,IAAI,KAAK,CACb,oEAAoE,CACrE,CAAA;KACF;IACD,OAAO,0BAA0B,CAAA;AACnC,CAAC;AAED,MAAM,UAAU,4BAA4B;IAC1C,IAAI,0BAA0B,GAAG,sBAAsB,EAAE,CAAA;IACzD,OAAO,0BAA0B,CAAC,MAAM,EAAE;QACxC,0BAA0B,GAAG,0BAA0B,CAAC,MAAM,CAAA;KAC/D;IACD,OAAO,0BAA0B,CAAA;AACnC,CAAC","sourcesContent":["import { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport { FormElement } from '@oneblink/types/typescript/forms'\nimport * as React from 'react'\nimport cleanFormSubmissionModel from '../services/cleanFormSubmissionModel'\nimport { FormElementsConditionallyShown } from '../types/form'\n\nexport type FormSubmissionModelContextValue = {\n formSubmissionModel: SubmissionTypes.S3SubmissionData['submission']\n parent?: FormSubmissionModelContextValue\n elements: FormElement[]\n}\n\nconst FormSubmissionModelContext = React.createContext<\n FormSubmissionModelContextValue \| undefined\n>(undefined)\n\nexport function FormSubmissionModelContextProvider({\n children,\n model,\n elements,\n formElementsConditionallyShown,\n}: {\n model: SubmissionTypes.S3SubmissionData['submission']\n elements: FormTypes.FormElement[]\n formElementsConditionallyShown: FormElementsConditionallyShown \| undefined\n children: React.ReactNode\n}) {\n const formSubmissionModelContext = React.useContext(\n FormSubmissionModelContext,\n )\n const value = React.useMemo(() => {\n return {\n formSubmissionModel: cleanFormSubmissionModel(\n model,\n elements,\n formElementsConditionallyShown,\n true,\n ).model,\n parent: formSubmissionModelContext,\n elements,\n }\n }, [\n model,\n elements,\n formElementsConditionallyShown,\n formSubmissionModelContext,\n ])\n return (\n <FormSubmissionModelContext.Provider value={value}>\n {children}\n </FormSubmissionModelContext.Provider>\n )\n}\n\nexport default function useFormSubmissionModel() {\n const formSubmissionModelContext = React.useContext(\n FormSubmissionModelContext,\n )\n if (!formSubmissionModelContext) {\n throw new Error(\n '\"FormSubmissionModelContext\" does not have a value in this context',\n )\n }\n return formSubmissionModelContext\n}\n\nexport function useFormSubmissionModelParent() {\n let formSubmissionModelContext = useFormSubmissionModel()\n while (formSubmissionModelContext.parent) {\n formSubmissionModelContext = formSubmissionModelContext.parent\n }\n return formSubmissionModelContext\n}\n"]}

package/dist/hooks/useFormSubmissionState.d.ts CHANGED Viewed

@@ -1,12 +1,52 @@
 import * as React from 'react';
-import { FormTypes } from '@oneblink/types';
-import { FormSubmissionModel } from '../types/form';
-export default function useFormSubmissionState(form: FormTypes.Form, initialSubmission?: FormSubmissionModel, lastElementUpdated?: FormTypes.FormElement): [{
+import { FormTypes, SubmissionTypes } from '@oneblink/types';
+/**
+ * This function is a simple wrapper around the react hook `useState()`. The
+ * results can be passed to the [`<OneBlinkForm
+ * />`](https://oneblink.github.io/apps-react/somewhere) //TODO: Fix link
+ * component.
+ *
+ * ## Example
+ *
+ * ```js
+ * import {
+ *   useFormSubmissionState,
+ *   OneBlinkFormControlled,
+ * } from '@oneblink/apps-react'
+ *
+ * function Uncontrolled({ form, initialSubmission, ...props }) {
+ *   const [{ definition, submission }, setFormSubmission] =
+ *     useFormSubmissionState(form, initialSubmission)
+ *
+ *   return (
+ *     <OneBlinkFormControlled
+ *       {...props}
+ *       definition={definition}
+ *       submission={submission}
+ *       setFormSubmission={setFormSubmission}
+ *       lastElementUpdated={lastElementUpdated}
+ *     />
+ *   )
+ * }
+ * ```
+ *
+ * @param form The OneBlink Form to render
+ * @param initialSubmission The initial submission data to populate the form
+ *   with
+ * @param lastElementUpdated
+ * @returns
+ * @group Hooks
+ */
+export default function useFormSubmissionState(form: FormTypes.Form, initialSubmission?: SubmissionTypes.S3SubmissionData['submission'], lastElementUpdated?: FormTypes.FormElement): [{
     definition: FormTypes.Form;
-    submission: FormSubmissionModel;
+    submission: {
+        [name: string]: unknown;
+    };
     lastElementUpdated: FormTypes.FormElement | undefined;
 }, React.Dispatch<React.SetStateAction<{
     definition: FormTypes.Form;
-    submission: FormSubmissionModel;
+    submission: {
+        [name: string]: unknown;
+    };
     lastElementUpdated: FormTypes.FormElement | undefined;
 }>>];

package/dist/hooks/useFormSubmissionState.js CHANGED Viewed

@@ -1,6 +1,43 @@
 import * as React from 'react';
 import _cloneDeep from 'lodash.clonedeep';
 import generateDefaultData from '../services/generate-default-data';
+/**
+ * This function is a simple wrapper around the react hook `useState()`. The
+ * results can be passed to the [`<OneBlinkForm
+ * />`](https://oneblink.github.io/apps-react/somewhere) //TODO: Fix link
+ * component.
+ *
+ * ## Example
+ *
+ * ```js
+ * import {
+ *   useFormSubmissionState,
+ *   OneBlinkFormControlled,
+ * } from '@oneblink/apps-react'
+ *
+ * function Uncontrolled({ form, initialSubmission, ...props }) {
+ *   const [{ definition, submission }, setFormSubmission] =
+ *     useFormSubmissionState(form, initialSubmission)
+ *
+ *   return (
+ *     <OneBlinkFormControlled
+ *       {...props}
+ *       definition={definition}
+ *       submission={submission}
+ *       setFormSubmission={setFormSubmission}
+ *       lastElementUpdated={lastElementUpdated}
+ *     />
+ *   )
+ * }
+ * ```
+ *
+ * @param form The OneBlink Form to render
+ * @param initialSubmission The initial submission data to populate the form
+ *   with
+ * @param lastElementUpdated
+ * @returns
+ * @group Hooks
+ */
 export default function useFormSubmissionState(form, initialSubmission, lastElementUpdated) {
     return React.useState(() => {
         const definition = _cloneDeep(form);

package/dist/hooks/useFormSubmissionState.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFormSubmissionState.js","sourceRoot":"","sources":["../../src/hooks/useFormSubmissionState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,UAAU,MAAM,kBAAkB,CAAA;AAEzC,OAAO,mBAAmB,MAAM,mCAAmC,CAAA;~~AAGnE~~,MAAM,CAAC,OAAO,UAAU,sBAAsB,CAC5C,IAAoB,EACpB,~~iBAAuC~~,~~EACvC~~,kBAA0C;IAE1C,OAAO,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE;QACzB,MAAM,UAAU,GAAG,UAAU,CAAC,IAAI,CAAC,CAAA;QACnC,MAAM,WAAW,GAAG,mBAAmB,CACrC,UAAU,CAAC,QAAQ,EACnB,iBAAiB,IAAI,EAAE,CACxB,CAAA;QACD,OAAO;YACL,UAAU;YACV,UAAU,EAAE,WAAW;YACvB,kBAAkB;SACnB,CAAA;IACH,CAAC,CAAC,CAAA;AACJ,CAAC","sourcesContent":["import * as React from 'react'\nimport _cloneDeep from 'lodash.clonedeep'\nimport { FormTypes } from '@oneblink/types'\nimport generateDefaultData from '../services/generate-default-data'\~~nimport~~ { ~~FormSubmissionModel~~ } from '~~../types~~/~~form~~'\n\nexport default function useFormSubmissionState(\n form: FormTypes.Form,\n initialSubmission?: ~~FormSubmissionModel~~,\n lastElementUpdated?: FormTypes.FormElement,\n) {\n return React.useState(() => {\n const definition = _cloneDeep(form)\n const defaultData = generateDefaultData(\n definition.elements,\n initialSubmission \|\| {},\n )\n return {\n definition,\n submission: defaultData,\n lastElementUpdated,\n }\n })\n}\n"]}
1	+ {"version":3,"file":"useFormSubmissionState.js","sourceRoot":"","sources":["../../src/hooks/useFormSubmissionState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,UAAU,MAAM,kBAAkB,CAAA;AAEzC,OAAO,mBAAmB,MAAM,mCAAmC,CAAA;AACnE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,MAAM,CAAC,OAAO,UAAU,sBAAsB,CAC5C,IAAoB,EACpB,iBAAkE,EAClE,kBAA0C;IAE1C,OAAO,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE;QACzB,MAAM,UAAU,GAAG,UAAU,CAAC,IAAI,CAAC,CAAA;QACnC,MAAM,WAAW,GAAG,mBAAmB,CACrC,UAAU,CAAC,QAAQ,EACnB,iBAAiB,IAAI,EAAE,CACxB,CAAA;QACD,OAAO;YACL,UAAU;YACV,UAAU,EAAE,WAAW;YACvB,kBAAkB;SACnB,CAAA;IACH,CAAC,CAAC,CAAA;AACJ,CAAC","sourcesContent":["import * as React from 'react'\nimport _cloneDeep from 'lodash.clonedeep'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport generateDefaultData from '../services/generate-default-data'\n/*\n This function is a simple wrapper around the react hook `useState()`. The\n * results can be passed to the [`<OneBlinkForm\n * />`](https://oneblink.github.io/apps-react/somewhere) //TODO: Fix link\n * component.\n \n ## Example\n \n ```js\n * import {\n * useFormSubmissionState,\n * OneBlinkFormControlled,\n * } from '@oneblink/apps-react'\n \n function Uncontrolled({ form, initialSubmission, ...props }) {\n * const [{ definition, submission }, setFormSubmission] =\n * useFormSubmissionState(form, initialSubmission)\n \n return (\n * <OneBlinkFormControlled\n * {...props}\n * definition={definition}\n * submission={submission}\n * setFormSubmission={setFormSubmission}\n * lastElementUpdated={lastElementUpdated}\n * />\n * )\n * }\n * ```\n \n @param form The OneBlink Form to render\n * @param initialSubmission The initial submission data to populate the form\n * with\n * @param lastElementUpdated\n * @returns\n * @group Hooks\n */\nexport default function useFormSubmissionState(\n form: FormTypes.Form,\n initialSubmission?: SubmissionTypes.S3SubmissionData['submission'],\n lastElementUpdated?: FormTypes.FormElement,\n) {\n return React.useState(() => {\n const definition = _cloneDeep(form)\n const defaultData = generateDefaultData(\n definition.elements,\n initialSubmission \|\| {},\n )\n return {\n definition,\n submission: defaultData,\n lastElementUpdated,\n }\n })\n}\n"]}

package/dist/hooks/useFormValidation.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
-import { FormTypes } from '@oneblink/types';
-import { FormElementsConditionallyShown, FormSubmissionModel } from '../types/form';
+import { FormTypes, SubmissionTypes } from '@oneblink/types';
+import { FormElementsConditionallyShown } from '../types/form';
 export default function useFormValidation(pages: FormTypes.PageElement[]): {
     executedLookup: (element: FormTypes.LookupFormElement) => void;
     executeLookupFailed: (element: FormTypes.LookupFormElement) => void;
-    validate: (submission: FormSubmissionModel, formElementsConditionallyShown: FormElementsConditionallyShown) => import("../types/form").FormElementsValidation | undefined;
+    validate: (submission: SubmissionTypes.S3SubmissionData['submission'], formElementsConditionallyShown: FormElementsConditionallyShown) => import("../types/form").FormElementsValidation | undefined;
 };

package/dist/hooks/useFormValidation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFormValidation.js","sourceRoot":"","sources":["../../src/hooks/useFormValidation.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EACL,kBAAkB,EAClB,wBAAwB,GACzB,MAAM,6BAA6B,CAAA;~~AAMpC~~,SAAS,4BAA4B,CACnC,YAAqC;IAErC,OAAO,YAAY,CAAC,MAAM,CACxB,CAAC,IAAI,EAAE,WAAW,EAAE,EAAE;QACpB,QAAQ,WAAW,CAAC,IAAI,EAAE;YACxB,KAAK,MAAM,CAAC;YACZ,KAAK,SAAS,CAAC,CAAC;gBACd,OAAO;oBACL,GAAG,IAAI;oBACP,GAAG,4BAA4B,CAAC,WAAW,CAAC,QAAQ,CAAC;iBACtD,CAAA;aACF;YACD,KAAK,UAAU,CAAC;YAChB,KAAK,MAAM,CAAC;YACZ,KAAK,eAAe,CAAC,CAAC;gBACpB,OAAO;oBACL,GAAG,IAAI;oBACP;wBACE,GAAG,WAAW;wBACd,QAAQ,EAAE,4BAA4B,CACpC,WAAW,CAAC,QAAQ,IAAI,EAAE,CAC3B;qBACF;iBACF,CAAA;aACF;YACD,OAAO,CAAC,CAAC;gBACP,OAAO,CAAC,GAAG,IAAI,EAAE,WAAW,CAAC,CAAA;aAC9B;SACF;IACH,CAAC,EACD,EAAE,CACH,CAAA;AACH,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAA8B;IACtE,MAAM,CAAC,6BAA6B,EAAE,gCAAgC,CAAC,GACrE,KAAK,CAAC,QAAQ,CAAW,EAAE,CAAC,CAAA;IAE9B,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CACtC,CAAC,OAAoC,EAAE,EAAE;QACvC,gCAAgC,CAC9B,CAAC,oCAA8C,EAAE,EAAE;YACjD,IAAI,oCAAoC,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;gBAC7D,OAAO,oCAAoC,CAAA;aAC5C;YACD,OAAO,CAAC,GAAG,oCAAoC,EAAE,OAAO,CAAC,EAAE,CAAC,CAAA;QAC9D,CAAC,CACF,CAAA;IACH,CAAC,EACD,EAAE,CACH,CAAA;IACD,MAAM,mBAAmB,GAAG,KAAK,CAAC,WAAW,CAC3C,CAAC,OAAoC,EAAE,EAAE;QACvC,gCAAgC,CAC9B,CAAC,oCAAoC,EAAE,EAAE;YACvC,OAAO,oCAAoC,CAAC,MAAM,CAChD,CAAC,SAAS,EAAE,EAAE,CAAC,SAAS,KAAK,OAAO,CAAC,EAAE,CACxC,CAAA;QACH,CAAC,CACF,CAAA;IACH,CAAC,EACD,EAAE,CACH,CAAA;IAED,MAAM,uBAAuB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACjD,OAAO,4BAA4B,CAAC,KAAK,CAAC,CAAA;IAC5C,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,MAAM,gBAAgB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC1C,OAAO,wBAAwB,CAC7B,uBAAuB,EACvB,6BAA6B,CAC9B,CAAA;IACH,CAAC,EAAE,CAAC,uBAAuB,EAAE,6BAA6B,CAAC,CAAC,CAAA;IAE5D,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CACtC,CACE,~~UAA+B~~,~~EAC/B~~,8BAA8D,EAC9D,EAAE;QACF,OAAO,kBAAkB,CACvB,gBAAgB,EAChB,UAAU,EACV,8BAA8B,CAC/B,CAAA;IACH,CAAC,EACD,CAAC,gBAAgB,CAAC,CACnB,CAAA;IAED,OAAO;QACL,cAAc;QACd,mBAAmB;QACnB,QAAQ,EAAE,cAAc;KACzB,CAAA;AACH,CAAC","sourcesContent":["import { FormTypes } from '@oneblink/types'\nimport * as React from 'react'\n\nimport {\n validateSubmission,\n generateValidationSchema,\n} from '../services/form-validation'\nimport {\n FormElementsConditionallyShown~~,\n FormSubmissionModel,\n~~} from '../types/form'\n\nfunction stripFormElementsWithoutName(\n formElements: FormTypes.FormElement[],\n): FormTypes.FormElementWithName[] {\n return formElements.reduce<FormTypes.FormElementWithName[]>(\n (memo, formElement) => {\n switch (formElement.type) {\n case 'page':\n case 'section': {\n return [\n ...memo,\n ...stripFormElementsWithoutName(formElement.elements),\n ]\n }\n case 'infoPage':\n case 'form':\n case 'repeatableSet': {\n return [\n ...memo,\n {\n ...formElement,\n elements: stripFormElementsWithoutName(\n formElement.elements \|\| [],\n ),\n },\n ]\n }\n default: {\n return [...memo, formElement]\n }\n }\n },\n [],\n )\n}\n\nexport default function useFormValidation(pages: FormTypes.PageElement[]) {\n const [elementIdsWithLookupsExecuted, setElementIdsWithLookupsExecuted] =\n React.useState<string[]>([])\n\n const executedLookup = React.useCallback(\n (element: FormTypes.LookupFormElement) => {\n setElementIdsWithLookupsExecuted(\n (currentElementIdsWithLookupsExecuted: string[]) => {\n if (currentElementIdsWithLookupsExecuted.includes(element.id)) {\n return currentElementIdsWithLookupsExecuted\n }\n return [...currentElementIdsWithLookupsExecuted, element.id]\n },\n )\n },\n [],\n )\n const executeLookupFailed = React.useCallback(\n (element: FormTypes.LookupFormElement) => {\n setElementIdsWithLookupsExecuted(\n (currentElementIdsWithLookupsExecuted) => {\n return currentElementIdsWithLookupsExecuted.filter(\n (elementId) => elementId !== element.id,\n )\n },\n )\n },\n [],\n )\n\n const formElementsWithoutName = React.useMemo(() => {\n return stripFormElementsWithoutName(pages)\n }, [pages])\n\n const validationSchema = React.useMemo(() => {\n return generateValidationSchema(\n formElementsWithoutName,\n elementIdsWithLookupsExecuted,\n )\n }, [formElementsWithoutName, elementIdsWithLookupsExecuted])\n\n const handleValidate = React.useCallback(\n (\n submission: ~~FormSubmissionModel~~,\n formElementsConditionallyShown: FormElementsConditionallyShown,\n ) => {\n return validateSubmission(\n validationSchema,\n submission,\n formElementsConditionallyShown,\n )\n },\n [validationSchema],\n )\n\n return {\n executedLookup,\n executeLookupFailed,\n validate: handleValidate,\n }\n}\n"]}
1	+ {"version":3,"file":"useFormValidation.js","sourceRoot":"","sources":["../../src/hooks/useFormValidation.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EACL,kBAAkB,EAClB,wBAAwB,GACzB,MAAM,6BAA6B,CAAA;AAGpC,SAAS,4BAA4B,CACnC,YAAqC;IAErC,OAAO,YAAY,CAAC,MAAM,CACxB,CAAC,IAAI,EAAE,WAAW,EAAE,EAAE;QACpB,QAAQ,WAAW,CAAC,IAAI,EAAE;YACxB,KAAK,MAAM,CAAC;YACZ,KAAK,SAAS,CAAC,CAAC;gBACd,OAAO;oBACL,GAAG,IAAI;oBACP,GAAG,4BAA4B,CAAC,WAAW,CAAC,QAAQ,CAAC;iBACtD,CAAA;aACF;YACD,KAAK,UAAU,CAAC;YAChB,KAAK,MAAM,CAAC;YACZ,KAAK,eAAe,CAAC,CAAC;gBACpB,OAAO;oBACL,GAAG,IAAI;oBACP;wBACE,GAAG,WAAW;wBACd,QAAQ,EAAE,4BAA4B,CACpC,WAAW,CAAC,QAAQ,IAAI,EAAE,CAC3B;qBACF;iBACF,CAAA;aACF;YACD,OAAO,CAAC,CAAC;gBACP,OAAO,CAAC,GAAG,IAAI,EAAE,WAAW,CAAC,CAAA;aAC9B;SACF;IACH,CAAC,EACD,EAAE,CACH,CAAA;AACH,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAA8B;IACtE,MAAM,CAAC,6BAA6B,EAAE,gCAAgC,CAAC,GACrE,KAAK,CAAC,QAAQ,CAAW,EAAE,CAAC,CAAA;IAE9B,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CACtC,CAAC,OAAoC,EAAE,EAAE;QACvC,gCAAgC,CAC9B,CAAC,oCAA8C,EAAE,EAAE;YACjD,IAAI,oCAAoC,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;gBAC7D,OAAO,oCAAoC,CAAA;aAC5C;YACD,OAAO,CAAC,GAAG,oCAAoC,EAAE,OAAO,CAAC,EAAE,CAAC,CAAA;QAC9D,CAAC,CACF,CAAA;IACH,CAAC,EACD,EAAE,CACH,CAAA;IACD,MAAM,mBAAmB,GAAG,KAAK,CAAC,WAAW,CAC3C,CAAC,OAAoC,EAAE,EAAE;QACvC,gCAAgC,CAC9B,CAAC,oCAAoC,EAAE,EAAE;YACvC,OAAO,oCAAoC,CAAC,MAAM,CAChD,CAAC,SAAS,EAAE,EAAE,CAAC,SAAS,KAAK,OAAO,CAAC,EAAE,CACxC,CAAA;QACH,CAAC,CACF,CAAA;IACH,CAAC,EACD,EAAE,CACH,CAAA;IAED,MAAM,uBAAuB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACjD,OAAO,4BAA4B,CAAC,KAAK,CAAC,CAAA;IAC5C,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,MAAM,gBAAgB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC1C,OAAO,wBAAwB,CAC7B,uBAAuB,EACvB,6BAA6B,CAC9B,CAAA;IACH,CAAC,EAAE,CAAC,uBAAuB,EAAE,6BAA6B,CAAC,CAAC,CAAA;IAE5D,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CACtC,CACE,UAA0D,EAC1D,8BAA8D,EAC9D,EAAE;QACF,OAAO,kBAAkB,CACvB,gBAAgB,EAChB,UAAU,EACV,8BAA8B,CAC/B,CAAA;IACH,CAAC,EACD,CAAC,gBAAgB,CAAC,CACnB,CAAA;IAED,OAAO;QACL,cAAc;QACd,mBAAmB;QACnB,QAAQ,EAAE,cAAc;KACzB,CAAA;AACH,CAAC","sourcesContent":["import { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport * as React from 'react'\n\nimport {\n validateSubmission,\n generateValidationSchema,\n} from '../services/form-validation'\nimport { FormElementsConditionallyShown } from '../types/form'\n\nfunction stripFormElementsWithoutName(\n formElements: FormTypes.FormElement[],\n): FormTypes.FormElementWithName[] {\n return formElements.reduce<FormTypes.FormElementWithName[]>(\n (memo, formElement) => {\n switch (formElement.type) {\n case 'page':\n case 'section': {\n return [\n ...memo,\n ...stripFormElementsWithoutName(formElement.elements),\n ]\n }\n case 'infoPage':\n case 'form':\n case 'repeatableSet': {\n return [\n ...memo,\n {\n ...formElement,\n elements: stripFormElementsWithoutName(\n formElement.elements \|\| [],\n ),\n },\n ]\n }\n default: {\n return [...memo, formElement]\n }\n }\n },\n [],\n )\n}\n\nexport default function useFormValidation(pages: FormTypes.PageElement[]) {\n const [elementIdsWithLookupsExecuted, setElementIdsWithLookupsExecuted] =\n React.useState<string[]>([])\n\n const executedLookup = React.useCallback(\n (element: FormTypes.LookupFormElement) => {\n setElementIdsWithLookupsExecuted(\n (currentElementIdsWithLookupsExecuted: string[]) => {\n if (currentElementIdsWithLookupsExecuted.includes(element.id)) {\n return currentElementIdsWithLookupsExecuted\n }\n return [...currentElementIdsWithLookupsExecuted, element.id]\n },\n )\n },\n [],\n )\n const executeLookupFailed = React.useCallback(\n (element: FormTypes.LookupFormElement) => {\n setElementIdsWithLookupsExecuted(\n (currentElementIdsWithLookupsExecuted) => {\n return currentElementIdsWithLookupsExecuted.filter(\n (elementId) => elementId !== element.id,\n )\n },\n )\n },\n [],\n )\n\n const formElementsWithoutName = React.useMemo(() => {\n return stripFormElementsWithoutName(pages)\n }, [pages])\n\n const validationSchema = React.useMemo(() => {\n return generateValidationSchema(\n formElementsWithoutName,\n elementIdsWithLookupsExecuted,\n )\n }, [formElementsWithoutName, elementIdsWithLookupsExecuted])\n\n const handleValidate = React.useCallback(\n (\n submission: SubmissionTypes.S3SubmissionData['submission'],\n formElementsConditionallyShown: FormElementsConditionallyShown,\n ) => {\n return validateSubmission(\n validationSchema,\n submission,\n formElementsConditionallyShown,\n )\n },\n [validationSchema],\n )\n\n return {\n executedLookup,\n executeLookupFailed,\n validate: handleValidate,\n }\n}\n"]}

package/dist/hooks/useInjectPages.d.ts CHANGED Viewed

@@ -1,7 +1,6 @@
-import { FormTypes } from '@oneblink/types';
+import { FormTypes, SubmissionTypes } from '@oneblink/types';
 import * as React from 'react';
-import { FormSubmissionModel } from '../types/form';
-type InjectPagesContextValue = (lookupFormElement: FormTypes.LookupFormElement, pageElements: FormTypes.PageElement[], data?: FormSubmissionModel) => void;
+type InjectPagesContextValue = (lookupFormElement: FormTypes.LookupFormElement, pageElements: FormTypes.PageElement[], data?: SubmissionTypes.S3SubmissionData['submission']) => void;
 export declare const InjectPagesContext: React.Context<InjectPagesContextValue>;
 export default function useInjectPages(): InjectPagesContextValue;
 export {};

package/dist/hooks/useInjectPages.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useInjectPages.js","sourceRoot":"","sources":["../../src/hooks/useInjectPages.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;~~AAS9B~~,MAAM,CAAC,MAAM,kBAAkB,GAAG,KAAK,CAAC,aAAa,CACnD,GAAG,EAAE,GAAE,CAAC,CACT,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,cAAc;IACpC,OAAO,KAAK,CAAC,UAAU,CAAC,kBAAkB,CAAC,CAAA;AAC7C,CAAC","sourcesContent":["import { FormTypes } from '@oneblink/types'\nimport * as React from 'react'\~~nimport { FormSubmissionModel } from '../types/form'\~~n\ntype InjectPagesContextValue = (\n lookupFormElement: FormTypes.LookupFormElement,\n pageElements: FormTypes.PageElement[],\n data?: ~~FormSubmissionModel~~,\n) => void\n\nexport const InjectPagesContext = React.createContext<InjectPagesContextValue>(\n () => {},\n)\n\nexport default function useInjectPages() {\n return React.useContext(InjectPagesContext)\n}\n"]}
1	+ {"version":3,"file":"useInjectPages.js","sourceRoot":"","sources":["../../src/hooks/useInjectPages.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,MAAM,CAAC,MAAM,kBAAkB,GAAG,KAAK,CAAC,aAAa,CACnD,GAAG,EAAE,GAAE,CAAC,CACT,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,cAAc;IACpC,OAAO,KAAK,CAAC,UAAU,CAAC,kBAAkB,CAAC,CAAA;AAC7C,CAAC","sourcesContent":["import { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport * as React from 'react'\n\ntype InjectPagesContextValue = (\n lookupFormElement: FormTypes.LookupFormElement,\n pageElements: FormTypes.PageElement[],\n data?: SubmissionTypes.S3SubmissionData['submission'],\n) => void\n\nexport const InjectPagesContext = React.createContext<InjectPagesContextValue>(\n () => {},\n)\n\nexport default function useInjectPages() {\n return React.useContext(InjectPagesContext)\n}\n"]}

package/dist/hooks/useIsMounted.d.ts CHANGED Viewed

@@ -1,3 +1,23 @@
+/**
+ * This function is a react hook for determining whether the consuming component
+ * is currently mounted on the DOM.
+ *
+ * ## Example
+ *
+ * ```js
+ * import { useIsMounted } from '@oneblink/apps-react'
+ *
+ * const isMounted = useIsMounted()
+ *
+ * if (isMounted.current) {
+ *   // DO SOMETHING HERE
+ * }
+ * ```
+ *
+ * @returns
+ * @group Hooks
+ */
 export default function useIsMounted(): {
+    /** Whether the current component is mounted. */
     current: boolean;
 };

package/dist/hooks/useIsMounted.js CHANGED Viewed

@@ -1,4 +1,23 @@
 import * as React from 'react';
+/**
+ * This function is a react hook for determining whether the consuming component
+ * is currently mounted on the DOM.
+ *
+ * ## Example
+ *
+ * ```js
+ * import { useIsMounted } from '@oneblink/apps-react'
+ *
+ * const isMounted = useIsMounted()
+ *
+ * if (isMounted.current) {
+ *   // DO SOMETHING HERE
+ * }
+ * ```
+ *
+ * @returns
+ * @group Hooks
+ */
 export default function useIsMounted() {
     const isMounted = React.useRef(false);
     React.useEffect(() => {

package/dist/hooks/useIsMounted.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useIsMounted.js","sourceRoot":"","sources":["../../src/hooks/useIsMounted.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,MAAM,CAAC,OAAO,UAAU,YAAY;~~IAClC~~,MAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;IACrC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,SAAS,CAAC,OAAO,GAAG,IAAI,CAAA;QACxB,OAAO,GAAG,EAAE;YACV,SAAS,CAAC,OAAO,GAAG,KAAK,CAAA;QAC3B,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IACN,OAAO,SAAS,CAAA;AAClB,CAAC","sourcesContent":["import * as React from 'react'\n\nexport default function useIsMounted(): { current: boolean } {\n const isMounted = React.useRef(false)\n React.useEffect(() => {\n isMounted.current = true\n return () => {\n isMounted.current = false\n }\n }, [])\n return isMounted\n}\n"]}
1	+ {"version":3,"file":"useIsMounted.js","sourceRoot":"","sources":["../../src/hooks/useIsMounted.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY;IAIlC,MAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;IACrC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,SAAS,CAAC,OAAO,GAAG,IAAI,CAAA;QACxB,OAAO,GAAG,EAAE;YACV,SAAS,CAAC,OAAO,GAAG,KAAK,CAAA;QAC3B,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IACN,OAAO,SAAS,CAAA;AAClB,CAAC","sourcesContent":["import * as React from 'react'\n\n/*\n This function is a react hook for determining whether the consuming component\n * is currently mounted on the DOM.\n \n ## Example\n \n ```js\n * import { useIsMounted } from '@oneblink/apps-react'\n \n const isMounted = useIsMounted()\n \n if (isMounted.current) {\n * // DO SOMETHING HERE\n * }\n * ```\n \n @returns\n * @group Hooks\n /\nexport default function useIsMounted(): {\n /* Whether the current component is mounted. */\n current: boolean\n} {\n const isMounted = React.useRef(false)\n React.useEffect(() => {\n isMounted.current = true\n return () => {\n isMounted.current = false\n }\n }, [])\n return isMounted\n}\n"]}