@oneblink/apps-react 4.0.0-beta.5 → 4.0.0-beta.6

package/dist/hooks/useFormSubmissionState.js

@@ -1,6 +1,42 @@
 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
+ */
 export default function useFormSubmissionState(form, initialSubmission, lastElementUpdated) {
     return React.useState(() => {
         const definition = _cloneDeep(form);

package/dist/hooks/useFormSubmissionState.js.map

@@ -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"]}
+{"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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;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 */\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

@@ -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

@@ -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"]}
+{"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

@@ -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

@@ -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"]}
+{"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

@@ -1,3 +1,22 @@
+/**
+ * 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
+ */
 export default function useIsMounted(): {
+    /** Whether the current component is mounted. */
     current: boolean;
 };

package/dist/hooks/useIsMounted.js

@@ -1,4 +1,22 @@
 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
+ */
 export default function useIsMounted() {
     const isMounted = React.useRef(false);
     React.useEffect(() => {

package/dist/hooks/useIsMounted.js.map

@@ -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"]}
+{"version":3,"file":"useIsMounted.js","sourceRoot":"","sources":["../../src/hooks/useIsMounted.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B;;;;;;;;;;;;;;;;;GAiBG;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 */\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"]}

package/dist/hooks/useIsOffline.d.ts

@@ -1,6 +1,55 @@
 import * as React from 'react';
+/**
+ * @param type
+ * @param listener
+ */
 export declare const useNetworkChangeEffect: (type: 'online' | 'offline', listener: () => unknown) => void;
+/**
+ * IsOfflineContextProvider is a React Component that provides the `isOffline`
+ * state for components further down your component tree to consume. It should
+ * be used to wrap the components requiring the state.
+ *
+ * - **This component is required in your component tree to be able to consume the
+ *   [`useIsOffline`](./useIsOffline.html) hook.**
+ *
+ * ### Usage
+ *
+ * ```jsx
+ * import { IsOfflineContextProvider } from '@oneblink/apps-react'
+ *
+ * const TopLevelComponent = () => {
+ *   return (
+ *     <IsOfflineContextProvider>
+ *       <div>
+ *         <ComponentThatRequiresOfflineState />
+ *       </div>
+ *     </IsOfflineContextProvider>
+ *   )
+ * }
+ *
+ * export default TopLevelComponent
+ * ```
+ *
+ * @param props
+ * @returns
+ */
 export declare function IsOfflineContextProvider({ children, }: {
     children: React.ReactNode;
 }): JSX.Element;
+/**
+ * This function is a react hook for determining whether an application is in an
+ * offline state.
+ *
+ * - **This component requires
+ *   [`<IsOfflineContextProvider/>`](./IsOfflineContextProvider.html) to be
+ *   present in your component tree.**
+ *
+ * ## Example
+ *
+ * ```js
+ * import { useIsOffline } from '@oneblink/apps-react'
+ *
+ * const isOffline = useIsOffline()
+ * ```
+ */
 export default function useIsOffline(): boolean;

package/dist/hooks/useIsOffline.js

@@ -3,6 +3,10 @@ import { offlineService } from '@oneblink/apps';
 import useBooleanState from '../hooks/useBooleanState';
 const defaultValue = offlineService.isOffline();
 const IsOfflineContext = React.createContext(defaultValue);
+/**
+ * @param type
+ * @param listener
+ */
 export const useNetworkChangeEffect = (type, listener) => {
     React.useEffect(() => {
         // Stupid cordova seems to require that offline/online
@@ -15,12 +19,57 @@ export const useNetworkChangeEffect = (type, listener) => {
         };
     }, [type, listener]);
 };
+/**
+ * IsOfflineContextProvider is a React Component that provides the `isOffline`
+ * state for components further down your component tree to consume. It should
+ * be used to wrap the components requiring the state.
+ *
+ * - **This component is required in your component tree to be able to consume the
+ *   [`useIsOffline`](./useIsOffline.html) hook.**
+ *
+ * ### Usage
+ *
+ * ```jsx
+ * import { IsOfflineContextProvider } from '@oneblink/apps-react'
+ *
+ * const TopLevelComponent = () => {
+ *   return (
+ *     <IsOfflineContextProvider>
+ *       <div>
+ *         <ComponentThatRequiresOfflineState />
+ *       </div>
+ *     </IsOfflineContextProvider>
+ *   )
+ * }
+ *
+ * export default TopLevelComponent
+ * ```
+ *
+ * @param props
+ * @returns
+ */
 export function IsOfflineContextProvider({ children, }) {
     const [isOffline, goOffline, goOnline] = useBooleanState(defaultValue);
     useNetworkChangeEffect('online', goOnline);
     useNetworkChangeEffect('offline', goOffline);
     return (React.createElement(IsOfflineContext.Provider, { value: isOffline }, children));
 }
+/**
+ * This function is a react hook for determining whether an application is in an
+ * offline state.
+ *
+ * - **This component requires
+ *   [`<IsOfflineContextProvider/>`](./IsOfflineContextProvider.html) to be
+ *   present in your component tree.**
+ *
+ * ## Example
+ *
+ * ```js
+ * import { useIsOffline } from '@oneblink/apps-react'
+ *
+ * const isOffline = useIsOffline()
+ * ```
+ */
 export default function useIsOffline() {
     return React.useContext(IsOfflineContext);
 }

package/dist/hooks/useIsOffline.js.map

@@ -1 +1 @@
-{"version":3,"file":"useIsOffline.js","sourceRoot":"","sources":["../../src/hooks/useIsOffline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,eAAe,MAAM,0BAA0B,CAAA;AAEtD,MAAM,YAAY,GAAG,cAAc,CAAC,SAAS,EAAE,CAAA;AAE/C,MAAM,gBAAgB,GAAG,KAAK,CAAC,aAAa,CAAU,YAAY,CAAC,CAAA;AAEnE,MAAM,CAAC,MAAM,sBAAsB,GAAG,CACpC,IAA0B,EAC1B,QAAuB,EACvB,EAAE;IACF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,sDAAsD;QACtD,sDAAsD;QACtD,qBAAqB;QACrB,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAA;QAClD,OAAO,CAAC,gBAAgB,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAA;QAExC,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,mBAAmB,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAA;QAC7C,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAA;AACtB,CAAC,CAAA;AAED,MAAM,UAAU,wBAAwB,CAAC,EACvC,QAAQ,GAGT;IACC,MAAM,CAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,CAAC,GAAG,eAAe,CAAC,YAAY,CAAC,CAAA;IAEtE,sBAAsB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;IAC1C,sBAAsB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAA;IAE5C,OAAO,CACL,oBAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,SAAS,IACxC,QAAQ,CACiB,CAC7B,CAAA;AACH,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,YAAY;IAClC,OAAO,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAA;AAC3C,CAAC","sourcesContent":["import * as React from 'react'\n\nimport { offlineService } from '@oneblink/apps'\nimport useBooleanState from '../hooks/useBooleanState'\n\nconst defaultValue = offlineService.isOffline()\n\nconst IsOfflineContext = React.createContext<boolean>(defaultValue)\n\nexport const useNetworkChangeEffect = (\n  type: 'online' | 'offline',\n  listener: () => unknown,\n) => {\n  React.useEffect(() => {\n    // Stupid cordova seems to require that offline/online\n    // listeners are set on the document and browsers seem\n    // to require window.\n    const element = window.cordova ? document : window\n    element.addEventListener(type, listener)\n\n    return () => {\n      element.removeEventListener(type, listener)\n    }\n  }, [type, listener])\n}\n\nexport function IsOfflineContextProvider({\n  children,\n}: {\n  children: React.ReactNode\n}) {\n  const [isOffline, goOffline, goOnline] = useBooleanState(defaultValue)\n\n  useNetworkChangeEffect('online', goOnline)\n  useNetworkChangeEffect('offline', goOffline)\n\n  return (\n    <IsOfflineContext.Provider value={isOffline}>\n      {children}\n    </IsOfflineContext.Provider>\n  )\n}\n\nexport default function useIsOffline() {\n  return React.useContext(IsOfflineContext)\n}\n"]}
+{"version":3,"file":"useIsOffline.js","sourceRoot":"","sources":["../../src/hooks/useIsOffline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,eAAe,MAAM,0BAA0B,CAAA;AAEtD,MAAM,YAAY,GAAG,cAAc,CAAC,SAAS,EAAE,CAAA;AAE/C,MAAM,gBAAgB,GAAG,KAAK,CAAC,aAAa,CAAU,YAAY,CAAC,CAAA;AAEnE;;;GAGG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,CACpC,IAA0B,EAC1B,QAAuB,EACvB,EAAE;IACF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,sDAAsD;QACtD,sDAAsD;QACtD,qBAAqB;QACrB,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAA;QAClD,OAAO,CAAC,gBAAgB,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAA;QAExC,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,mBAAmB,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAA;QAC7C,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAA;AACtB,CAAC,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,MAAM,UAAU,wBAAwB,CAAC,EACvC,QAAQ,GAGT;IACC,MAAM,CAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,CAAC,GAAG,eAAe,CAAC,YAAY,CAAC,CAAA;IAEtE,sBAAsB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;IAC1C,sBAAsB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAA;IAE5C,OAAO,CACL,oBAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,SAAS,IACxC,QAAQ,CACiB,CAC7B,CAAA;AACH,CAAC;AAED;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY;IAClC,OAAO,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAA;AAC3C,CAAC","sourcesContent":["import * as React from 'react'\n\nimport { offlineService } from '@oneblink/apps'\nimport useBooleanState from '../hooks/useBooleanState'\n\nconst defaultValue = offlineService.isOffline()\n\nconst IsOfflineContext = React.createContext<boolean>(defaultValue)\n\n/**\n * @param type\n * @param listener\n */\nexport const useNetworkChangeEffect = (\n  type: 'online' | 'offline',\n  listener: () => unknown,\n) => {\n  React.useEffect(() => {\n    // Stupid cordova seems to require that offline/online\n    // listeners are set on the document and browsers seem\n    // to require window.\n    const element = window.cordova ? document : window\n    element.addEventListener(type, listener)\n\n    return () => {\n      element.removeEventListener(type, listener)\n    }\n  }, [type, listener])\n}\n\n/**\n * IsOfflineContextProvider is a React Component that provides the `isOffline`\n * state for components further down your component tree to consume. It should\n * be used to wrap the components requiring the state.\n *\n * - **This component is required in your component tree to be able to consume the\n *   [`useIsOffline`](./useIsOffline.html) hook.**\n *\n * ### Usage\n *\n * ```jsx\n * import { IsOfflineContextProvider } from '@oneblink/apps-react'\n *\n * const TopLevelComponent = () => {\n *   return (\n *     <IsOfflineContextProvider>\n *       <div>\n *         <ComponentThatRequiresOfflineState />\n *       </div>\n *     </IsOfflineContextProvider>\n *   )\n * }\n *\n * export default TopLevelComponent\n * ```\n *\n * @param props\n * @returns\n */\nexport function IsOfflineContextProvider({\n  children,\n}: {\n  children: React.ReactNode\n}) {\n  const [isOffline, goOffline, goOnline] = useBooleanState(defaultValue)\n\n  useNetworkChangeEffect('online', goOnline)\n  useNetworkChangeEffect('offline', goOffline)\n\n  return (\n    <IsOfflineContext.Provider value={isOffline}>\n      {children}\n    </IsOfflineContext.Provider>\n  )\n}\n\n/**\n * This function is a react hook for determining whether an application is in an\n * offline state.\n *\n * - **This component requires\n *   [`<IsOfflineContextProvider/>`](./IsOfflineContextProvider.html) to be\n *   present in your component tree.**\n *\n * ## Example\n *\n * ```js\n * import { useIsOffline } from '@oneblink/apps-react'\n *\n * const isOffline = useIsOffline()\n * ```\n */\nexport default function useIsOffline() {\n  return React.useContext(IsOfflineContext)\n}\n"]}

package/dist/hooks/useLoadDataState.d.ts

@@ -1,15 +1,56 @@
 import * as React from 'react';
 export type LoadDataState<T> = {
     status: 'SUCCESS';
+    /** Your data. */
     result: T;
 } | {
     status: 'ERROR';
+    /** A JavaScript `Error` object. */
     error: Error;
 } | {
     status: 'LOADING';
 };
+/**
+ * This function is a react hook for managing the state involved with loading
+ * data.
+ *
+ * ## Example
+ *
+ * ```js
+ * import { useLoadDataState } from '@oneblink/apps-react'
+ * const fetchData = async () => {
+ *   const response = await fetch(`https://some-website.com/api?data=data`)
+ *
+ *   if (!response.ok) {
+ *     const text = await response.text()
+ *     throw new Error(text)
+ *   }
+ *
+ *   return await response.json()
+ * }
+ *
+ * const MyComponent = () => {
+ *   const [state, refresh, setResult] = useLoadDataState(fetchData)
+ *
+ *   switch (state.status) {
+ *     case 'LOADING':
+ *       return <Loading />
+ *     case 'ERROR':
+ *       return <Error message={state.error} />
+ *     case 'SUCCESS':
+ *     // RENDER UI
+ *   }
+ * }
+ *
+ * export default MyComponent
+ * ```
+ *
+ * @param onLoad The function that fetches your data. Should be a Promise that
+ *   returns your data
+ * @returns
+ */
 export default function useLoadDataState<T>(onLoad: (abortSignal?: AbortSignal) => Promise<T>): [
-    LoadDataState<T>,
-    (abortSignal?: AbortSignal) => void,
-    React.Dispatch<React.SetStateAction<T>>
+    state: LoadDataState<T>,
+    handleLoad: (abortSignal?: AbortSignal) => void,
+    setResult: React.Dispatch<React.SetStateAction<T>>
 ];

package/dist/hooks/useLoadDataState.js

@@ -1,5 +1,44 @@
 import * as React from 'react';
 import useIsMounted from './useIsMounted';
+/**
+ * This function is a react hook for managing the state involved with loading
+ * data.
+ *
+ * ## Example
+ *
+ * ```js
+ * import { useLoadDataState } from '@oneblink/apps-react'
+ * const fetchData = async () => {
+ *   const response = await fetch(`https://some-website.com/api?data=data`)
+ *
+ *   if (!response.ok) {
+ *     const text = await response.text()
+ *     throw new Error(text)
+ *   }
+ *
+ *   return await response.json()
+ * }
+ *
+ * const MyComponent = () => {
+ *   const [state, refresh, setResult] = useLoadDataState(fetchData)
+ *
+ *   switch (state.status) {
+ *     case 'LOADING':
+ *       return <Loading />
+ *     case 'ERROR':
+ *       return <Error message={state.error} />
+ *     case 'SUCCESS':
+ *     // RENDER UI
+ *   }
+ * }
+ *
+ * export default MyComponent
+ * ```
+ *
+ * @param onLoad The function that fetches your data. Should be a Promise that
+ *   returns your data
+ * @returns
+ */
 export default function useLoadDataState(onLoad) {
     const isMounted = useIsMounted();
     const [state, setState] = React.useState({

package/dist/hooks/useLoadDataState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useLoadDataState.js","sourceRoot":"","sources":["../../src/hooks/useLoadDataState.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,YAAY,MAAM,gBAAgB,CAAA;AAezC,MAAM,CAAC,OAAO,UAAU,gBAAgB,CACtC,MAAiD;IAMjD,MAAM,SAAS,GAAG,YAAY,EAAE,CAAA;IAChC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAmB;QACzD,MAAM,EAAE,SAAS;KAClB,CAAC,CAAA;IAEF,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAClC,KAAK,EAAE,WAAyB,EAAE,EAAE;QAClC,QAAQ,CAAC;YACP,MAAM,EAAE,SAAS;SAClB,CAAC,CAAA;QACF,IAAI;YACF,MAAM,MAAM,GAAG,MAAM,MAAM,CAAC,WAAW,CAAC,CAAA;YACxC,IAAI,SAAS,CAAC,OAAO,IAAI,CAAC,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,CAAA,EAAE;gBAC9C,QAAQ,CAAC;oBACP,MAAM,EAAE,SAAS;oBACjB,MAAM;iBACP,CAAC,CAAA;aACH;SACF;QAAC,OAAO,GAAG,EAAE;YACZ,IAAI,SAAS,CAAC,OAAO,IAAI,CAAC,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,CAAA,EAAE;gBAC9C,QAAQ,CAAC;oBACP,MAAM,EAAE,OAAO;oBACf,KAAK,EAAE,GAAY;iBACpB,CAAC,CAAA;aACH;SACF;IACH,CAAC,EACD,CAAC,SAAS,EAAE,MAAM,CAAC,CACpB,CAAA;IAED,MAAM,SAAS,GAA4C,KAAK,CAAC,WAAW,CAC1E,CAAC,MAAM,EAAE,EAAE;QACT,QAAQ,CAAC,CAAC,YAA8B,EAAE,EAAE;YAC1C,IAAI,YAAY,CAAC,MAAM,KAAK,SAAS,EAAE;gBACrC,OAAO;oBACL,GAAG,YAAY;oBACf,MAAM,EACJ,OAAO,MAAM,KAAK,UAAU;wBAC1B,CAAC,CAAC,oFAAoF;4BACpF,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC;wBAC7B,CAAC,CAAC,MAAM;iBACb,CAAA;aACF;iBAAM;gBACL,OAAO,YAAY,CAAA;aACpB;QACH,CAAC,CAAC,CAAA;IACJ,CAAC,EACD,EAAE,CACH,CAAA;IAED,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,eAAe,GAAG,IAAI,eAAe,EAAE,CAAA;QAC7C,UAAU,CAAC,eAAe,CAAC,MAAM,CAAC,CAAA;QAClC,OAAO,GAAG,EAAE;YACV,eAAe,CAAC,KAAK,EAAE,CAAA;QACzB,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,OAAO,CAAC,KAAK,EAAE,UAAU,EAAE,SAAS,CAAC,CAAA;AACvC,CAAC","sourcesContent":["import * as React from 'react'\nimport useIsMounted from './useIsMounted'\n\nexport type LoadDataState<T> =\n  | {\n      status: 'SUCCESS'\n      result: T\n    }\n  | {\n      status: 'ERROR'\n      error: Error\n    }\n  | {\n      status: 'LOADING'\n    }\n\nexport default function useLoadDataState<T>(\n  onLoad: (abortSignal?: AbortSignal) => Promise<T>,\n): [\n  LoadDataState<T>,\n  (abortSignal?: AbortSignal) => void,\n  React.Dispatch<React.SetStateAction<T>>,\n] {\n  const isMounted = useIsMounted()\n  const [state, setState] = React.useState<LoadDataState<T>>({\n    status: 'LOADING',\n  })\n\n  const handleLoad = React.useCallback(\n    async (abortSignal?: AbortSignal) => {\n      setState({\n        status: 'LOADING',\n      })\n      try {\n        const result = await onLoad(abortSignal)\n        if (isMounted.current && !abortSignal?.aborted) {\n          setState({\n            status: 'SUCCESS',\n            result,\n          })\n        }\n      } catch (err) {\n        if (isMounted.current && !abortSignal?.aborted) {\n          setState({\n            status: 'ERROR',\n            error: err as Error,\n          })\n        }\n      }\n    },\n    [isMounted, onLoad],\n  )\n\n  const setResult: React.Dispatch<React.SetStateAction<T>> = React.useCallback(\n    (setter) => {\n      setState((currentState: LoadDataState<T>) => {\n        if (currentState.status === 'SUCCESS') {\n          return {\n            ...currentState,\n            result:\n              typeof setter === 'function'\n                ? // @ts-expect-error Typescript cannot tell between a generic type (T) and a function\n                  setter(currentState.result)\n                : setter,\n          }\n        } else {\n          return currentState\n        }\n      })\n    },\n    [],\n  )\n\n  React.useEffect(() => {\n    const abortController = new AbortController()\n    handleLoad(abortController.signal)\n    return () => {\n      abortController.abort()\n    }\n  }, [handleLoad])\n\n  return [state, handleLoad, setResult]\n}\n"]}
+{"version":3,"file":"useLoadDataState.js","sourceRoot":"","sources":["../../src/hooks/useLoadDataState.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,YAAY,MAAM,gBAAgB,CAAA;AAiBzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CACtC,MAAiD;IAMjD,MAAM,SAAS,GAAG,YAAY,EAAE,CAAA;IAChC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAmB;QACzD,MAAM,EAAE,SAAS;KAClB,CAAC,CAAA;IAEF,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAClC,KAAK,EAAE,WAAyB,EAAE,EAAE;QAClC,QAAQ,CAAC;YACP,MAAM,EAAE,SAAS;SAClB,CAAC,CAAA;QACF,IAAI;YACF,MAAM,MAAM,GAAG,MAAM,MAAM,CAAC,WAAW,CAAC,CAAA;YACxC,IAAI,SAAS,CAAC,OAAO,IAAI,CAAC,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,CAAA,EAAE;gBAC9C,QAAQ,CAAC;oBACP,MAAM,EAAE,SAAS;oBACjB,MAAM;iBACP,CAAC,CAAA;aACH;SACF;QAAC,OAAO,GAAG,EAAE;YACZ,IAAI,SAAS,CAAC,OAAO,IAAI,CAAC,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,CAAA,EAAE;gBAC9C,QAAQ,CAAC;oBACP,MAAM,EAAE,OAAO;oBACf,KAAK,EAAE,GAAY;iBACpB,CAAC,CAAA;aACH;SACF;IACH,CAAC,EACD,CAAC,SAAS,EAAE,MAAM,CAAC,CACpB,CAAA;IAED,MAAM,SAAS,GAA4C,KAAK,CAAC,WAAW,CAC1E,CAAC,MAAM,EAAE,EAAE;QACT,QAAQ,CAAC,CAAC,YAA8B,EAAE,EAAE;YAC1C,IAAI,YAAY,CAAC,MAAM,KAAK,SAAS,EAAE;gBACrC,OAAO;oBACL,GAAG,YAAY;oBACf,MAAM,EACJ,OAAO,MAAM,KAAK,UAAU;wBAC1B,CAAC,CAAC,oFAAoF;4BACpF,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC;wBAC7B,CAAC,CAAC,MAAM;iBACb,CAAA;aACF;iBAAM;gBACL,OAAO,YAAY,CAAA;aACpB;QACH,CAAC,CAAC,CAAA;IACJ,CAAC,EACD,EAAE,CACH,CAAA;IAED,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,eAAe,GAAG,IAAI,eAAe,EAAE,CAAA;QAC7C,UAAU,CAAC,eAAe,CAAC,MAAM,CAAC,CAAA;QAClC,OAAO,GAAG,EAAE;YACV,eAAe,CAAC,KAAK,EAAE,CAAA;QACzB,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,OAAO,CAAC,KAAK,EAAE,UAAU,EAAE,SAAS,CAAC,CAAA;AACvC,CAAC","sourcesContent":["import * as React from 'react'\nimport useIsMounted from './useIsMounted'\n\nexport type LoadDataState<T> =\n  | {\n      status: 'SUCCESS'\n      /** Your data. */\n      result: T\n    }\n  | {\n      status: 'ERROR'\n      /** A JavaScript `Error` object. */\n      error: Error\n    }\n  | {\n      status: 'LOADING'\n    }\n\n/**\n * This function is a react hook for managing the state involved with loading\n * data.\n *\n * ## Example\n *\n * ```js\n * import { useLoadDataState } from '@oneblink/apps-react'\n * const fetchData = async () => {\n *   const response = await fetch(`https://some-website.com/api?data=data`)\n *\n *   if (!response.ok) {\n *     const text = await response.text()\n *     throw new Error(text)\n *   }\n *\n *   return await response.json()\n * }\n *\n * const MyComponent = () => {\n *   const [state, refresh, setResult] = useLoadDataState(fetchData)\n *\n *   switch (state.status) {\n *     case 'LOADING':\n *       return <Loading />\n *     case 'ERROR':\n *       return <Error message={state.error} />\n *     case 'SUCCESS':\n *     // RENDER UI\n *   }\n * }\n *\n * export default MyComponent\n * ```\n *\n * @param onLoad The function that fetches your data. Should be a Promise that\n *   returns your data\n * @returns\n */\nexport default function useLoadDataState<T>(\n  onLoad: (abortSignal?: AbortSignal) => Promise<T>,\n): [\n  state: LoadDataState<T>,\n  handleLoad: (abortSignal?: AbortSignal) => void,\n  setResult: React.Dispatch<React.SetStateAction<T>>,\n] {\n  const isMounted = useIsMounted()\n  const [state, setState] = React.useState<LoadDataState<T>>({\n    status: 'LOADING',\n  })\n\n  const handleLoad = React.useCallback(\n    async (abortSignal?: AbortSignal) => {\n      setState({\n        status: 'LOADING',\n      })\n      try {\n        const result = await onLoad(abortSignal)\n        if (isMounted.current && !abortSignal?.aborted) {\n          setState({\n            status: 'SUCCESS',\n            result,\n          })\n        }\n      } catch (err) {\n        if (isMounted.current && !abortSignal?.aborted) {\n          setState({\n            status: 'ERROR',\n            error: err as Error,\n          })\n        }\n      }\n    },\n    [isMounted, onLoad],\n  )\n\n  const setResult: React.Dispatch<React.SetStateAction<T>> = React.useCallback(\n    (setter) => {\n      setState((currentState: LoadDataState<T>) => {\n        if (currentState.status === 'SUCCESS') {\n          return {\n            ...currentState,\n            result:\n              typeof setter === 'function'\n                ? // @ts-expect-error Typescript cannot tell between a generic type (T) and a function\n                  setter(currentState.result)\n                : setter,\n          }\n        } else {\n          return currentState\n        }\n      })\n    },\n    [],\n  )\n\n  React.useEffect(() => {\n    const abortController = new AbortController()\n    handleLoad(abortController.signal)\n    return () => {\n      abortController.abort()\n    }\n  }, [handleLoad])\n\n  return [state, handleLoad, setResult]\n}\n"]}