@oneblink/apps-react 6.1.1-beta.3 → 6.1.1-beta.5

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.
@@ -71,7 +71,7 @@ function FormElementCheckboxes({ id, element, value, onChange, validationMessage
71
71
  React.createElement(FormElementOptions, { options: element.options, conditionallyShownOptionsElement: conditionallyShownOptionsElement },
72
72
  element.canToggleAll && (React.createElement(ToggleAllCheckbox, { id: id, element: element, options: filteredOptions, selected: selectedValues, disabled: element.readOnly, onChange: onChange })),
73
73
  element.buttons ? (React.createElement("div", { className: "ob-button-radio-container" },
74
- React.createElement("div", { className: "buttons ob-buttons ob-buttons-radio" }, filteredOptions.map((option, index) => {
74
+ React.createElement("div", { className: "buttons ob-buttons ob-buttons-radio", role: "group", "aria-labelledby": `${id}-label` }, filteredOptions.map((option, index) => {
75
75
  const isSelected = selectedValues.includes(option.value);
76
76
  return (React.createElement(OptionButton, { key: index, element: element, option: option, isSelected: isSelected, onClick: () => changeValues(option.value, isSelected), className: clsx('button ob-button ob-button__input ob-checkbox__button cypress-checkbox-button-control', {
77
77
  'is-primary': isSelected,
@@ -1 +1 @@
1
- {"version":3,"file":"FormElementCheckBoxes.js","sourceRoot":"","sources":["../../src/form-elements/FormElementCheckBoxes.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAExC,OAAO,kBAAkB,MAAM,2CAA2C,CAAA;AAC1E,OAAO,qBAAqB,MAAM,gCAAgC,CAAA;AAClE,OAAO,YAAY,MAAM,qCAAqC,CAAA;AAE9D,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AACxF,OAAO,iBAAiB,MAAM,0CAA0C,CAAA;AAOxE,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAA;AAC1E,OAAO,yBAAyB,MAAM,oCAAoC,CAAA;AAe1E,SAAS,qBAAqB,CAAC,EAC7B,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,gCAAgC,EAChC,oBAAoB,EACpB,OAAO,EACP,UAAU,GACJ;;IACN,MAAM,eAAe,GAAG,yBAAyB,CAAC,EAAE,EAAE,OAAO,CAAC,CAAA;IAC9D,MAAM,cAAc,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACxC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC;YAAE,OAAO,EAAE,CAAA;QACpC,OAAO,KAAK,CAAA;IACd,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,0FAA0F;IAC1F,4FAA4F;IAC5F,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;;QACnB,IAAI,OAAO;YAAE,OAAM;QAEnB;QACE,6DAA6D;QAC7D,CAAC,OAAO,CAAC,QAAQ,IAAI,CAAC,CAAC,cAAc,CAAC,MAAM,CAAC;YAC7C,sDAAsD;YACtD,CAAC,OAAO,CAAC,WAAW,IAAI,cAAc,CAAC,MAAM,MAAK,MAAA,OAAO,CAAC,OAAO,0CAAE,MAAM,CAAA,CAAC,EAC1E;YACA,UAAU,EAAE,CAAA;SACb;IACH,CAAC,EAAE;QACD,MAAA,OAAO,CAAC,OAAO,0CAAE,MAAM;QACvB,OAAO,CAAC,QAAQ;QAChB,OAAO,CAAC,WAAW;QACnB,OAAO;QACP,cAAc,CAAC,MAAM;QACrB,UAAU;KACX,CAAC,CAAA;IAEF,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CACpC,CAAC,YAAoB,EAAE,gBAAyB,EAAE,EAAE;QAClD,QAAQ,CAAC,OAAO,EAAE;YAChB,KAAK,EAAE,CAAC,aAAa,EAAE,EAAE;gBACvB,IAAI,gBAAgB,EAAE;oBACpB,MAAM,QAAQ,GAAG,CAAC,aAAa,IAAI,EAAE,CAAC,CAAC,MAAM,CAC3C,CAAC,aAAa,EAAE,EAAE,CAAC,aAAa,KAAK,YAAY,CAClD,CAAA;oBACD,IAAI,QAAQ,CAAC,MAAM,EAAE;wBACnB,OAAO,QAAQ,CAAA;qBAChB;iBACF;qBAAM;oBACL,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC;wBAC3C,CAAC,CAAC,CAAC,GAAG,aAAa,CAAC;wBACpB,CAAC,CAAC,EAAE,CAAA;oBACN,QAAQ,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;oBAC3B,OAAO,QAAQ,CAAA;iBAChB;YACH,CAAC;SACF,CAAC,CAAA;IACJ,CAAC,EACD,CAAC,OAAO,EAAE,QAAQ,CAAC,CACpB,CAAA;IAED,MAAM,eAAe,GAAG,qBAAqB,CAAC;QAC5C,OAAO;QACP,KAAK;QACL,QAAQ;QACR,gCAAgC;QAChC,oBAAoB;KACrB,CAAC,CAAA;IAEF,MAAM,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC,UAAU,CAAC,yBAAyB,CAAC,CAAA;IACnE,MAAM,6BAA6B,GACjC,CAAC,wBAAwB,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC,iBAAiB,IAAI,CAAC,WAAW,CAAA;IAE9E,OAAO,CACL,6BAAK,SAAS,EAAC,0BAA0B;QACvC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,aAAa,EACvB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ,IAAI,CAAC,CAAC,OAAO,CAAC,WAAW;YAEnD,oBAAC,kBAAkB,IACjB,OAAO,EAAE,OAAO,CAAC,OAAO,EACxB,gCAAgC,EAAE,gCAAgC;gBAEjE,OAAO,CAAC,YAAY,IAAI,CACvB,oBAAC,iBAAiB,IAChB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAE,cAAc,EACxB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,QAAQ,GAClB,CACH;gBACA,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,CACjB,6BAAK,SAAS,EAAC,2BAA2B;oBACxC,6BAAK,SAAS,EAAC,qCAAqC,IACjD,eAAe,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;wBACrC,MAAM,UAAU,GAAG,cAAc,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;wBACxD,OAAO,CACL,oBAAC,YAAY,IACX,GAAG,EAAE,KAAK,EACV,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,EACrD,SAAS,EAAE,IAAI,CACb,uFAAuF,EACvF;gCACE,YAAY,EAAE,UAAU;gCACxB,UAAU,EAAE,CAAC,UAAU;6BACxB,CACF,sBACiB,eAAe,GACjC,CACH,CAAA;oBACH,CAAC,CAAC,CACE,CACF,CACP,CAAC,CAAC,CAAC,CACF,6BACE,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,uBAAuB,qBAChB,GAAG,EAAE,QAAQ,sBAE5B,OAAO,CAAC,IAAI,IAAI,OAAO,CAAC,YAAY,KAAK,aAAa;wBACpD,CAAC,CAAC,GAAG,EAAE,OAAO;wBACd,CAAC,CAAC,SAAS,IAGd,eAAe,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACrC,MAAM,UAAU,GAAG,cAAc,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;oBACxD,OAAO,CACL,6BAAK,SAAS,EAAC,SAAS,EAAC,GAAG,EAAE,KAAK;wBACjC,+BACE,SAAS,EAAC,0DAA0D,EACpE,OAAO,EAAE,GAAG,EAAE,IAAI,MAAM,CAAC,KAAK,EAAE;4BAEhC,oBAAC,QAAQ,IACP,KAAK,EAAC,SAAS,EACf,SAAS,EAAC,6CAA6C,EACvD,OAAO,EAAE;oCACP,OAAO,EAAE,4BAA4B;iCACtC,EACD,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,EAAE,EAAE,GAAG,EAAE,IAAI,MAAM,CAAC,KAAK,EAAE,EAC3B,OAAO,EAAE,UAAU,EACnB,QAAQ,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,EACtD,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,IAAI,EAAC,OAAO,EACZ,UAAU,EAAE;oCACV,kBAAkB,EAAE,eAAe;iCACpC,GACD;4BAAC,GAAG;4BACL,MAAM,CAAC,KAAK,CACP,CACJ,CACP,CAAA;gBACH,CAAC,CAAC,CACE,CACP;gBAED,oBAAC,YAAY,IACX,YAAY,QACZ,KAAK,EAAE,KAAK,EACZ,iBAAiB,EAAE,iBAAiB,EACpC,kBAAkB,EAAE,OAAO,CAAC,YAAY,GACxC,CACiB;YAEpB,6BAA6B,IAAI,CAChC,6BAAK,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,kBAAkB;gBAC5C,6BAAK,SAAS,EAAC,2DAA2D,IACvE,iBAAiB,CACd,CACF,CACP,CACyB,CACxB,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Checkbox } from '@mui/material'\n\nimport FormElementOptions from '../components/renderer/FormElementOptions'\nimport useFormElementOptions from '../hooks/useFormElementOptions'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport OptionButton from './OptionButton'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport ToggleAllCheckbox from '../components/renderer/ToggleAllCheckbox'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n IsDirtyProps,\n UpdateFormElementsHandler,\n} from '../types/form'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\n\ntype Props = {\n id: string\n element: FormTypes.CheckboxElement\n value: unknown\n onChange: FormElementValueChangeHandler<string[]>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n conditionallyShownOptionsElement:\n | FormElementConditionallyShownElement\n | undefined\n onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\nfunction FormElementCheckboxes({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n conditionallyShownOptionsElement,\n onUpdateFormElements,\n isDirty,\n setIsDirty,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const selectedValues = React.useMemo(() => {\n if (!Array.isArray(value)) return []\n return value\n }, [value])\n\n // Need to use a `useEffect` to update the `isDirty` state, because it cannot be done from\n // inside the below `setState` callback function since it runs from inside another component\n React.useEffect(() => {\n if (isDirty) return\n\n if (\n // If the element requires a single selection and has a value\n (element.required && !!selectedValues.length) ||\n // or all options are selected and requiredAll is true\n (element.requiredAll && selectedValues.length === element.options?.length)\n ) {\n setIsDirty()\n }\n }, [\n element.options?.length,\n element.required,\n element.requiredAll,\n isDirty,\n selectedValues.length,\n setIsDirty,\n ])\n\n const changeValues = React.useCallback(\n (toggledValue: string, hasSelectedValue: boolean) => {\n onChange(element, {\n value: (existingValue) => {\n if (hasSelectedValue) {\n const newValue = (existingValue || []).filter(\n (existingValue) => existingValue !== toggledValue,\n )\n if (newValue.length) {\n return newValue\n }\n } else {\n const newValue = Array.isArray(existingValue)\n ? [...existingValue]\n : []\n newValue.push(toggledValue)\n return newValue\n }\n },\n })\n },\n [element, onChange],\n )\n\n const filteredOptions = useFormElementOptions({\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n onUpdateFormElements,\n })\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (displayValidationMessage || isDirty) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-checkbox-element\">\n <FormElementLabelContainer\n className=\"ob-checkbox\"\n id={id}\n element={element}\n required={element.required || !!element.requiredAll}\n >\n <FormElementOptions\n options={element.options}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n >\n {element.canToggleAll && (\n <ToggleAllCheckbox\n id={id}\n element={element}\n options={filteredOptions}\n selected={selectedValues}\n disabled={element.readOnly}\n onChange={onChange}\n />\n )}\n {element.buttons ? (\n <div className=\"ob-button-radio-container\">\n <div className=\"buttons ob-buttons ob-buttons-radio\">\n {filteredOptions.map((option, index) => {\n const isSelected = selectedValues.includes(option.value)\n return (\n <OptionButton\n key={index}\n element={element}\n option={option}\n isSelected={isSelected}\n onClick={() => changeValues(option.value, isSelected)}\n className={clsx(\n 'button ob-button ob-button__input ob-checkbox__button cypress-checkbox-button-control',\n {\n 'is-primary': isSelected,\n 'is-light': !isSelected,\n },\n )}\n aria-describedby={ariaDescribedby}\n />\n )\n })}\n </div>\n </div>\n ) : (\n <div\n role=\"group\"\n className=\"ob-checkbox-container\"\n aria-labelledby={`${id}-label`}\n aria-describedby={\n element.hint && element.hintPosition === 'BELOW_LABEL'\n ? `${id}-hint`\n : undefined\n }\n >\n {filteredOptions.map((option, index) => {\n const isSelected = selectedValues.includes(option.value)\n return (\n <div className=\"control\" key={index}>\n <label\n className=\"checkbox ob-checkbox__input-label cypress-checkbox-label\"\n htmlFor={`${id}_${option.value}`}\n >\n <Checkbox\n color=\"primary\"\n className=\"ob-checkbox__input cypress-checkbox-control\"\n classes={{\n checked: 'ob-checkbox__input-checked',\n }}\n value={option.value}\n id={`${id}_${option.value}`}\n checked={isSelected}\n onChange={() => changeValues(option.value, isSelected)}\n disabled={element.readOnly}\n edge=\"start\"\n inputProps={{\n 'aria-describedby': ariaDescribedby,\n }}\n />{' '}\n {option.label}\n </label>\n </div>\n )\n })}\n </div>\n )}\n\n <LookupButton\n hasMarginTop\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </FormElementOptions>\n\n {isDisplayingValidationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementCheckboxes)\n"]}
1
+ {"version":3,"file":"FormElementCheckBoxes.js","sourceRoot":"","sources":["../../src/form-elements/FormElementCheckBoxes.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Checkbox } from '@mui/material'\n\nimport FormElementOptions from '../components/renderer/FormElementOptions'\nimport useFormElementOptions from '../hooks/useFormElementOptions'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport OptionButton from './OptionButton'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport ToggleAllCheckbox from '../components/renderer/ToggleAllCheckbox'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n IsDirtyProps,\n UpdateFormElementsHandler,\n} from '../types/form'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\n\ntype Props = {\n id: string\n element: FormTypes.CheckboxElement\n value: unknown\n onChange: FormElementValueChangeHandler<string[]>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n conditionallyShownOptionsElement:\n | FormElementConditionallyShownElement\n | undefined\n onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\nfunction FormElementCheckboxes({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n conditionallyShownOptionsElement,\n onUpdateFormElements,\n isDirty,\n setIsDirty,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const selectedValues = React.useMemo(() => {\n if (!Array.isArray(value)) return []\n return value\n }, [value])\n\n // Need to use a `useEffect` to update the `isDirty` state, because it cannot be done from\n // inside the below `setState` callback function since it runs from inside another component\n React.useEffect(() => {\n if (isDirty) return\n\n if (\n // If the element requires a single selection and has a value\n (element.required && !!selectedValues.length) ||\n // or all options are selected and requiredAll is true\n (element.requiredAll && selectedValues.length === element.options?.length)\n ) {\n setIsDirty()\n }\n }, [\n element.options?.length,\n element.required,\n element.requiredAll,\n isDirty,\n selectedValues.length,\n setIsDirty,\n ])\n\n const changeValues = React.useCallback(\n (toggledValue: string, hasSelectedValue: boolean) => {\n onChange(element, {\n value: (existingValue) => {\n if (hasSelectedValue) {\n const newValue = (existingValue || []).filter(\n (existingValue) => existingValue !== toggledValue,\n )\n if (newValue.length) {\n return newValue\n }\n } else {\n const newValue = Array.isArray(existingValue)\n ? [...existingValue]\n : []\n newValue.push(toggledValue)\n return newValue\n }\n },\n })\n },\n [element, onChange],\n )\n\n const filteredOptions = useFormElementOptions({\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n onUpdateFormElements,\n })\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (displayValidationMessage || isDirty) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-checkbox-element\">\n <FormElementLabelContainer\n className=\"ob-checkbox\"\n id={id}\n element={element}\n required={element.required || !!element.requiredAll}\n >\n <FormElementOptions\n options={element.options}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n >\n {element.canToggleAll && (\n <ToggleAllCheckbox\n id={id}\n element={element}\n options={filteredOptions}\n selected={selectedValues}\n disabled={element.readOnly}\n onChange={onChange}\n />\n )}\n {element.buttons ? (\n <div className=\"ob-button-radio-container\">\n <div\n className=\"buttons ob-buttons ob-buttons-radio\"\n role=\"group\"\n aria-labelledby={`${id}-label`}\n >\n {filteredOptions.map((option, index) => {\n const isSelected = selectedValues.includes(option.value)\n return (\n <OptionButton\n key={index}\n element={element}\n option={option}\n isSelected={isSelected}\n onClick={() => changeValues(option.value, isSelected)}\n className={clsx(\n 'button ob-button ob-button__input ob-checkbox__button cypress-checkbox-button-control',\n {\n 'is-primary': isSelected,\n 'is-light': !isSelected,\n },\n )}\n aria-describedby={ariaDescribedby}\n />\n )\n })}\n </div>\n </div>\n ) : (\n <div\n role=\"group\"\n className=\"ob-checkbox-container\"\n aria-labelledby={`${id}-label`}\n aria-describedby={\n element.hint && element.hintPosition === 'BELOW_LABEL'\n ? `${id}-hint`\n : undefined\n }\n >\n {filteredOptions.map((option, index) => {\n const isSelected = selectedValues.includes(option.value)\n return (\n <div className=\"control\" key={index}>\n <label\n className=\"checkbox ob-checkbox__input-label cypress-checkbox-label\"\n htmlFor={`${id}_${option.value}`}\n >\n <Checkbox\n color=\"primary\"\n className=\"ob-checkbox__input cypress-checkbox-control\"\n classes={{\n checked: 'ob-checkbox__input-checked',\n }}\n value={option.value}\n id={`${id}_${option.value}`}\n checked={isSelected}\n onChange={() => changeValues(option.value, isSelected)}\n disabled={element.readOnly}\n edge=\"start\"\n inputProps={{\n 'aria-describedby': ariaDescribedby,\n }}\n />{' '}\n {option.label}\n </label>\n </div>\n )\n })}\n </div>\n )}\n\n <LookupButton\n hasMarginTop\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </FormElementOptions>\n\n {isDisplayingValidationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementCheckboxes)\n"]}
@@ -34,7 +34,7 @@ function FormElementRadio({ id, element, value, onChange, conditionallyShownOpti
34
34
  }, edge: "start", inputProps: {
35
35
  'aria-describedby': ariaDescribedby,
36
36
  } }),
37
- ` ${option.label}`)))))) : (React.createElement("div", { className: "buttons ob-buttons ob-buttons-radio cypress-radio-button-group" }, filteredOptions.map((option) => {
37
+ ` ${option.label}`)))))) : (React.createElement("div", { className: "buttons ob-buttons ob-buttons-radio cypress-radio-button-group", role: "group", "aria-labelledby": `${id}-label` }, filteredOptions.map((option) => {
38
38
  const isSelected = value === option.value;
39
39
  return (React.createElement("div", { className: "ob-button-radio-container", key: option.value },
40
40
  React.createElement(OptionButton, { element: element, option: option, isSelected: isSelected, onClick: () => {
@@ -1 +1 @@
1
- {"version":3,"file":"FormElementRadio.js","sourceRoot":"","sources":["../../src/form-elements/FormElementRadio.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Radio, RadioGroup } from '@mui/material'\n\nimport FormElementOptions from '../components/renderer/FormElementOptions'\nimport useFormElementOptions from '../hooks/useFormElementOptions'\nimport { FormTypes } from '@oneblink/types'\nimport OptionButton from './OptionButton'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n IsDirtyProps,\n UpdateFormElementsHandler,\n} from '../types/form'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\n\ntype Props = {\n id: string\n element: FormTypes.RadioButtonElement\n value: unknown\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n conditionallyShownOptionsElement:\n | FormElementConditionallyShownElement\n | undefined\n onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\nfunction FormElementRadio({\n id,\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n validationMessage,\n displayValidationMessage,\n onUpdateFormElements,\n isDirty,\n setIsDirty,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const filteredOptions = useFormElementOptions({\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n onUpdateFormElements,\n })\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-radio-element\">\n <FormElementLabelContainer\n className=\"ob-radio\"\n id={id}\n element={element}\n required={element.required}\n >\n <FormElementOptions\n options={element.options}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n >\n {!element.buttons ? (\n <RadioGroup\n className=\"ob-radio-container\"\n aria-labelledby={`${id}-label`}\n aria-describedby={\n element.hint && element.hintPosition === 'BELOW_LABEL'\n ? `${id}-hint`\n : undefined\n }\n >\n {filteredOptions.map((option) => (\n <div className=\"control\" key={option.value}>\n <label\n className=\"radio ob-radio__input-label cypress-radio-label\"\n htmlFor={`${id}_${option.value}`}\n >\n <Radio\n color=\"primary\"\n className=\"ob-radio__input cypress-radio-control\"\n classes={{\n checked: 'ob-radio__input-checked',\n }}\n value={option.value || ''}\n id={`${id}_${option.value}`}\n disabled={element.readOnly}\n checked={value === option.value}\n onChange={(e) => {\n setIsDirty()\n onChange(element, {\n value: e.target.value,\n })\n }}\n edge=\"start\"\n inputProps={{\n 'aria-describedby': ariaDescribedby,\n }}\n />\n {` ${option.label}`}\n </label>\n </div>\n ))}\n </RadioGroup>\n ) : (\n <div className=\"buttons ob-buttons ob-buttons-radio cypress-radio-button-group\">\n {filteredOptions.map((option) => {\n const isSelected = value === option.value\n return (\n <div className=\"ob-button-radio-container\" key={option.value}>\n <OptionButton\n element={element}\n option={option}\n isSelected={isSelected}\n onClick={() => {\n setIsDirty()\n onChange(element, {\n value: option.value,\n })\n }}\n className={clsx(\n 'button ob-button ob-button__input ob-radio__button cypress-radio-button-control',\n {\n 'is-primary': isSelected,\n 'is-light': !isSelected,\n },\n )}\n />\n </div>\n )\n })}\n </div>\n )}\n </FormElementOptions>\n\n {isDisplayingValidationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\nexport default React.memo(FormElementRadio)\n"]}
1
+ {"version":3,"file":"FormElementRadio.js","sourceRoot":"","sources":["../../src/form-elements/FormElementRadio.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Radio, RadioGroup } from '@mui/material'\n\nimport FormElementOptions from '../components/renderer/FormElementOptions'\nimport useFormElementOptions from '../hooks/useFormElementOptions'\nimport { FormTypes } from '@oneblink/types'\nimport OptionButton from './OptionButton'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n IsDirtyProps,\n UpdateFormElementsHandler,\n} from '../types/form'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\n\ntype Props = {\n id: string\n element: FormTypes.RadioButtonElement\n value: unknown\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n conditionallyShownOptionsElement:\n | FormElementConditionallyShownElement\n | undefined\n onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\nfunction FormElementRadio({\n id,\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n validationMessage,\n displayValidationMessage,\n onUpdateFormElements,\n isDirty,\n setIsDirty,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const filteredOptions = useFormElementOptions({\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n onUpdateFormElements,\n })\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-radio-element\">\n <FormElementLabelContainer\n className=\"ob-radio\"\n id={id}\n element={element}\n required={element.required}\n >\n <FormElementOptions\n options={element.options}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n >\n {!element.buttons ? (\n <RadioGroup\n className=\"ob-radio-container\"\n aria-labelledby={`${id}-label`}\n aria-describedby={\n element.hint && element.hintPosition === 'BELOW_LABEL'\n ? `${id}-hint`\n : undefined\n }\n >\n {filteredOptions.map((option) => (\n <div className=\"control\" key={option.value}>\n <label\n className=\"radio ob-radio__input-label cypress-radio-label\"\n htmlFor={`${id}_${option.value}`}\n >\n <Radio\n color=\"primary\"\n className=\"ob-radio__input cypress-radio-control\"\n classes={{\n checked: 'ob-radio__input-checked',\n }}\n value={option.value || ''}\n id={`${id}_${option.value}`}\n disabled={element.readOnly}\n checked={value === option.value}\n onChange={(e) => {\n setIsDirty()\n onChange(element, {\n value: e.target.value,\n })\n }}\n edge=\"start\"\n inputProps={{\n 'aria-describedby': ariaDescribedby,\n }}\n />\n {` ${option.label}`}\n </label>\n </div>\n ))}\n </RadioGroup>\n ) : (\n <div\n className=\"buttons ob-buttons ob-buttons-radio cypress-radio-button-group\"\n role=\"group\"\n aria-labelledby={`${id}-label`}\n >\n {filteredOptions.map((option) => {\n const isSelected = value === option.value\n return (\n <div className=\"ob-button-radio-container\" key={option.value}>\n <OptionButton\n element={element}\n option={option}\n isSelected={isSelected}\n onClick={() => {\n setIsDirty()\n onChange(element, {\n value: option.value,\n })\n }}\n className={clsx(\n 'button ob-button ob-button__input ob-radio__button cypress-radio-button-control',\n {\n 'is-primary': isSelected,\n 'is-light': !isSelected,\n },\n )}\n />\n </div>\n )\n })}\n </div>\n )}\n </FormElementOptions>\n\n {isDisplayingValidationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\nexport default React.memo(FormElementRadio)\n"]}
@@ -21,21 +21,30 @@ export default function useFormSubmissionAutoSaveState({ form, initialSubmission
21
21
  });
22
22
  const throttledAutoSave = React.useMemo(() => {
23
23
  return _throttle((model, lastElementUpdated) => {
24
- console.log('Auto saving...');
25
- autoSaveService
26
- .upsertAutoSaveData(definition.id, autoSaveKey, model)
27
- .then(() => {
28
- if (lastElementUpdated) {
29
- return autoSaveService.upsertAutoSaveData(definition.id, `LAST_ELEMENT_UPDATED_${autoSaveKey}`, lastElementUpdated);
24
+ if (!formIsDisabled) {
25
+ switch (lastElementUpdated === null || lastElementUpdated === void 0 ? void 0 : lastElementUpdated.type) {
26
+ case 'summary':
27
+ case 'calculation':
28
+ case 'captcha': {
29
+ return;
30
+ }
30
31
  }
31
- })
32
- .catch((error) => {
33
- console.warn('Error while auto saving', error);
34
- Sentry.captureException(error);
35
- });
32
+ console.log('Auto saving...');
33
+ autoSaveService
34
+ .upsertAutoSaveData(definition.id, autoSaveKey, model)
35
+ .then(() => {
36
+ if (lastElementUpdated) {
37
+ return autoSaveService.upsertAutoSaveData(definition.id, `LAST_ELEMENT_UPDATED_${autoSaveKey}`, lastElementUpdated);
38
+ }
39
+ })
40
+ .catch((error) => {
41
+ console.warn('Error while auto saving', error);
42
+ Sentry.captureException(error);
43
+ });
44
+ }
36
45
  }, 9580, // https://en.wikipedia.org/wiki/100_metres
37
46
  { trailing: true, leading: false });
38
- }, [autoSaveKey, definition.id]);
47
+ }, [autoSaveKey, definition.id, formIsDisabled]);
39
48
  const cancelAutoSave = React.useCallback(() => {
40
49
  if (throttledAutoSave) {
41
50
  throttledAutoSave.cancel();
@@ -130,12 +139,10 @@ export default function useFormSubmissionAutoSaveState({ form, initialSubmission
130
139
  const newFormSubmission = typeof formSubmission === 'function'
131
140
  ? formSubmission(currentFormSubmission)
132
141
  : formSubmission;
133
- if (!formIsDisabled) {
134
- throttledAutoSave(newFormSubmission.submission, newFormSubmission.lastElementUpdated);
135
- }
142
+ throttledAutoSave(newFormSubmission.submission, newFormSubmission.lastElementUpdated);
136
143
  return newFormSubmission;
137
144
  });
138
- }, [setFormSubmission, throttledAutoSave, formIsDisabled]);
145
+ }, [setFormSubmission, throttledAutoSave]);
139
146
  const startNewSubmission = React.useCallback(() => {
140
147
  deleteAutoSaveSubmission();
141
148
  setAutoSaveState({
@@ -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, 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 formIsDisabled,\n onCancel,\n onSubmit,\n onSaveDraft,\n}: {\n form: FormTypes.Form\n removeAutoSaveDataBeforeSubmit?: boolean\n removeAutoSaveDataBeforeSaveDraft?: boolean\n autoSaveKey: string\n formIsDisabled?: boolean\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 [\n { definition, submission, lastElementUpdated, executedLookups },\n 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 if (!formIsDisabled) {\n throttledAutoSave(\n newFormSubmission.submission,\n newFormSubmission.lastElementUpdated,\n )\n }\n\n return newFormSubmission\n })\n },\n [setFormSubmission, throttledAutoSave, formIsDisabled],\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 React.useEffect(() => {\n if (form.continueWithAutosave) {\n continueAutoSaveSubmission()\n }\n }, [continueAutoSaveSubmission, form.continueWithAutosave])\n\n return {\n definition,\n submission,\n lastElementUpdated,\n executedLookups,\n isLoadingAutoSaveSubmission,\n isAutoSaveSubmissionAvailable:\n autoSaveSubmission !== null && !form.continueWithAutosave,\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 formIsDisabled,\n onCancel,\n onSubmit,\n onSaveDraft,\n}: {\n form: FormTypes.Form\n removeAutoSaveDataBeforeSubmit?: boolean\n removeAutoSaveDataBeforeSaveDraft?: boolean\n autoSaveKey: string\n formIsDisabled?: boolean\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 [\n { definition, submission, lastElementUpdated, executedLookups },\n 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 if (!formIsDisabled) {\n switch (lastElementUpdated?.type) {\n case 'summary':\n case 'calculation':\n case 'captcha': {\n return\n }\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 },\n 9580, // https://en.wikipedia.org/wiki/100_metres\n { trailing: true, leading: false },\n )\n }, [autoSaveKey, definition.id, formIsDisabled])\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 React.useEffect(() => {\n if (form.continueWithAutosave) {\n continueAutoSaveSubmission()\n }\n }, [continueAutoSaveSubmission, form.continueWithAutosave])\n\n return {\n definition,\n submission,\n lastElementUpdated,\n executedLookups,\n isLoadingAutoSaveSubmission,\n isAutoSaveSubmissionAvailable:\n autoSaveSubmission !== null && !form.continueWithAutosave,\n startNewSubmission,\n continueAutoSaveSubmission,\n handleSubmit,\n handleCancel,\n handleSaveDraft,\n handleNavigateAway,\n setFormSubmission: setFormSubmissionAutoSave,\n }\n}\n"]}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@oneblink/apps-react",
3
3
  "description": "Helper functions for OneBlink apps in ReactJS.",
4
- "version": "6.1.1-beta.3",
4
+ "version": "6.1.1-beta.5",
5
5
  "author": "OneBlink <developers@oneblink.io> (https://oneblink.io)",
6
6
  "bugs": {
7
7
  "url": "https://github.com/oneblink/apps-react/issues"