@oneblink/apps-react 8.6.0-beta.8 → 8.6.0
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.
- package/dist/OneBlinkFormBase.js +10 -2
- package/dist/OneBlinkFormBase.js.map +1 -1
- package/dist/components/renderer/AutocompleteDropdown.js +1 -1
- package/dist/components/renderer/AutocompleteDropdown.js.map +1 -1
- package/dist/form-elements/FormElementABN.js +1 -1
- package/dist/form-elements/FormElementABN.js.map +1 -1
- package/dist/form-elements/FormElementBSB.js +1 -1
- package/dist/form-elements/FormElementBSB.js.map +1 -1
- package/dist/form-elements/FormElementBarcodeScanner.js +1 -1
- package/dist/form-elements/FormElementBarcodeScanner.js.map +1 -1
- package/dist/form-elements/FormElementBoolean.js +1 -0
- package/dist/form-elements/FormElementBoolean.js.map +1 -1
- package/dist/form-elements/FormElementCamera.js +1 -1
- package/dist/form-elements/FormElementCamera.js.map +1 -1
- package/dist/form-elements/FormElementDate.js +1 -0
- package/dist/form-elements/FormElementDate.js.map +1 -1
- package/dist/form-elements/FormElementDateTime.js +1 -0
- package/dist/form-elements/FormElementDateTime.js.map +1 -1
- package/dist/form-elements/FormElementEmail.js +1 -1
- package/dist/form-elements/FormElementEmail.js.map +1 -1
- package/dist/form-elements/FormElementForm.js +3 -2
- package/dist/form-elements/FormElementForm.js.map +1 -1
- package/dist/form-elements/FormElementLocation.js +3 -1
- package/dist/form-elements/FormElementLocation.js.map +1 -1
- package/dist/form-elements/FormElementNumber.js +4 -4
- package/dist/form-elements/FormElementNumber.js.map +1 -1
- package/dist/form-elements/FormElementPointCadastralParcel.js +1 -1
- package/dist/form-elements/FormElementPointCadastralParcel.js.map +1 -1
- package/dist/form-elements/FormElementRepeatableSet.js +60 -12
- package/dist/form-elements/FormElementRepeatableSet.js.map +1 -1
- package/dist/form-elements/FormElementSection.js +2 -1
- package/dist/form-elements/FormElementSection.js.map +1 -1
- package/dist/form-elements/FormElementSelect.js +2 -2
- package/dist/form-elements/FormElementSelect.js.map +1 -1
- package/dist/form-elements/FormElementTelephone.js +1 -1
- package/dist/form-elements/FormElementTelephone.js.map +1 -1
- package/dist/form-elements/FormElementText.js +1 -1
- package/dist/form-elements/FormElementText.js.map +1 -1
- package/dist/form-elements/FormElementTextarea.js +1 -1
- package/dist/form-elements/FormElementTextarea.js.map +1 -1
- package/dist/form-elements/FormElementTime.js +1 -0
- package/dist/form-elements/FormElementTime.js.map +1 -1
- package/dist/hooks/form-date-picker/useFormDatePickerProps.d.ts +2 -1
- package/dist/hooks/form-date-picker/useFormDatePickerProps.js +2 -1
- package/dist/hooks/form-date-picker/useFormDatePickerProps.js.map +1 -1
- package/dist/types/form.d.ts +3 -1
- package/dist/types/form.js.map +1 -1
- package/package.json +3 -3
@@ -154,7 +154,7 @@ function FormElementABN({ id, element, value, onChange, validationMessage, displ
|
|
154
154
|
}, required: element.required, disabled: element.readOnly, onBlur: () => {
|
155
155
|
setIsDirty();
|
156
156
|
removeFocus();
|
157
|
-
}, onFocus: setIsFocused, "aria-describedby": ariaDescribedby, autoComplete: autocompleteAttributes })),
|
157
|
+
}, onFocus: setIsFocused, "aria-describedby": ariaDescribedby, autoComplete: autocompleteAttributes, "aria-required": element.required })),
|
158
158
|
value && (React.createElement(ABNDisplay, { abnRecord: value, className: "ob-abn__display-desktop" })),
|
159
159
|
hasCopyButton && (React.createElement("div", { className: "control" },
|
160
160
|
React.createElement(CopyToClipboardButton, { className: "button is-input-addon copy-button cypress-copy-to-clipboard-button", text: label }))),
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FormElementABN.js","sourceRoot":"","sources":["../../src/form-elements/FormElementABN.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport InputMask from 'react-input-mask'\nimport { parseString } from 'xml2js'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport useBooleanState from '../hooks/useBooleanState'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes, MiscTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useAbnLookupAuthenticationGuid from '../hooks/useAbnLookupAuthenticationGuid'\nimport { abnService } from '@oneblink/sdk-core'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\n\ntype Props = {\n id: string\n element: FormTypes.ABNElement\n value: MiscTypes.ABNRecord | undefined\n onChange: FormElementValueChangeHandler<MiscTypes.ABNRecord>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n autocompleteAttributes?: string\n} & IsDirtyProps\n\nfunction FormElementABN({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n autocompleteAttributes,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const abnLookupAuthenticationGuid = useAbnLookupAuthenticationGuid()\n const [label, setLabel] = React.useState(\n value ? abnService.getABNNumberFromABNRecord(value) || '' : '',\n )\n const [isFocused, setIsFocused, removeFocus] = useBooleanState(false)\n const [{ isLoading, error }, setState] = React.useState<{\n isLoading: boolean\n error: Error | null\n }>({\n isLoading: false,\n error: null,\n })\n\n React.useEffect(() => {\n const searchString = label.replace(/[^\\d]/g, '')\n const isSearchStringValid =\n searchString.length === 11 || (searchString.length === 9 && !isFocused)\n\n const currentABNNumber = value\n ? abnService.getABNNumberFromABNRecord(value)\n : ''\n if (!isSearchStringValid || currentABNNumber === searchString) {\n return\n }\n\n setState({\n isLoading: true,\n error: null,\n })\n\n const abortController = new AbortController()\n const fetchRecord = async () => {\n try {\n const urlSearchParams = new URLSearchParams()\n urlSearchParams.append('searchString', searchString)\n urlSearchParams.append('includeHistoricalDetails', 'N')\n if (abnLookupAuthenticationGuid) {\n urlSearchParams.append(\n 'authenticationGuid',\n abnLookupAuthenticationGuid,\n )\n }\n\n const url =\n searchString.length === 11\n ? 'https://abr.business.gov.au/abrxmlsearch/AbrXmlSearch.asmx/SearchByABNv202001'\n : 'https://abr.business.gov.au/abrxmlsearch/AbrXmlSearch.asmx/SearchByASICv201408'\n const response = await fetch(`${url}?${urlSearchParams.toString()}`, {\n mode: 'cors',\n signal: abortController.signal,\n })\n const text = await response.text()\n if (!response.ok) {\n throw new Error(text)\n }\n\n const result = await new Promise<{\n ABRPayloadSearchResults: {\n response: {\n businessEntity201408?: MiscTypes.ABNRecord\n businessEntity202001: MiscTypes.ABNRecord\n exception?: {\n exceptionDescription: string\n exceptionCode: string\n }\n }\n }\n }>((resolve, reject) => {\n parseString(\n text,\n {\n explicitArray: false,\n },\n (err, result) => {\n if (err) {\n reject(err)\n } else {\n resolve(result)\n }\n },\n )\n })\n if (result.ABRPayloadSearchResults.response.exception) {\n throw new Error(\n result.ABRPayloadSearchResults.response.exception.exceptionDescription,\n )\n }\n\n if (result.ABRPayloadSearchResults.response.businessEntity201408) {\n result.ABRPayloadSearchResults.response.businessEntity202001 =\n result.ABRPayloadSearchResults.response.businessEntity201408\n }\n\n if (\n !Array.isArray(\n result.ABRPayloadSearchResults.response.businessEntity202001\n .businessName,\n )\n ) {\n result.ABRPayloadSearchResults.response.businessEntity202001.businessName =\n [\n result.ABRPayloadSearchResults.response.businessEntity202001\n .businessName,\n ]\n }\n\n if (!abortController.signal.aborted) {\n onChange(element, {\n value: result.ABRPayloadSearchResults.response.businessEntity202001,\n })\n setState({\n isLoading: false,\n error: null,\n })\n }\n } catch (err) {\n if (!abortController.signal.aborted) {\n setState({\n isLoading: false,\n error: err as Error,\n })\n }\n }\n }\n\n fetchRecord()\n\n return () => {\n abortController.abort()\n }\n }, [abnLookupAuthenticationGuid, element, isFocused, label, onChange, value])\n\n // Ensure the label is set if the value is set outside of this component\n React.useEffect(() => {\n if (value) {\n const newLabel = abnService.getABNNumberFromABNRecord(value)\n if (!newLabel) {\n // Record in value had no ABN Number. This should never happen\n return\n }\n if (label !== newLabel) {\n setLabel(\n newLabel.split('').reduce((memo, character, index) => {\n switch (index) {\n case 2:\n case 5:\n case 8: {\n return `${memo} ${character}`\n }\n default: {\n return `${memo}${character}`\n }\n }\n }, ''),\n )\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [value])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (((isDirty || displayValidationMessage) &&\n !!validationMessage &&\n !isLoading) ||\n error) &&\n !isLookingUp\n\n const hasCopyButton = !!value && !!element.readOnly\n const hasLookupButton = element.isDataLookup || element.isElementLookup\n return (\n <div className=\"cypress-abn-element\">\n <FormElementLabelContainer\n className=\"ob-abn\"\n id={id}\n element={element}\n required={element.required}\n >\n <div\n className={clsx('field has-addons', {\n 'no-addons-mobile': !hasCopyButton && !hasLookupButton,\n })}\n >\n <div\n className={clsx('control is-expanded', {\n 'is-loading': isLoading,\n })}\n >\n <InputMask\n mask={isFocused || value ? '99 999 999 999' : '999 999 999'}\n maskChar=\" \"\n type=\"text\"\n id={id}\n name={element.name}\n className=\"input ob-input cypress-abn-control\"\n placeholder={element.placeholderValue}\n value={label}\n onChange={(e) => {\n setLabel(e.target.value)\n if (value) {\n onChange(element, {\n value: undefined,\n })\n }\n }}\n required={element.required}\n disabled={element.readOnly}\n onBlur={() => {\n setIsDirty()\n removeFocus()\n }}\n onFocus={setIsFocused}\n aria-describedby={ariaDescribedby}\n autoComplete={autocompleteAttributes}\n />\n </div>\n {value && (\n <ABNDisplay abnRecord={value} className=\"ob-abn__display-desktop\" />\n )}\n {hasCopyButton && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={label}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n {value && (\n <ABNDisplay abnRecord={value} className=\"ob-abn__display-mobile\" />\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 {error?.message || validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementABN)\n\nconst ABNDisplay = ({\n abnRecord,\n className,\n}: {\n abnRecord: MiscTypes.ABNRecord\n className: string\n}) => {\n return (\n <div className={`control ob-abn__record-control ${className}`}>\n <a className=\"button is-static ob-abn__record-button\">\n {abnService.displayBusinessNameFromABNRecord(abnRecord)}\n </a>\n </div>\n )\n}\n"]}
|
1
|
+
{"version":3,"file":"FormElementABN.js","sourceRoot":"","sources":["../../src/form-elements/FormElementABN.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport InputMask from 'react-input-mask'\nimport { parseString } from 'xml2js'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport useBooleanState from '../hooks/useBooleanState'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes, MiscTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useAbnLookupAuthenticationGuid from '../hooks/useAbnLookupAuthenticationGuid'\nimport { abnService } from '@oneblink/sdk-core'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\n\ntype Props = {\n id: string\n element: FormTypes.ABNElement\n value: MiscTypes.ABNRecord | undefined\n onChange: FormElementValueChangeHandler<MiscTypes.ABNRecord>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n autocompleteAttributes?: string\n} & IsDirtyProps\n\nfunction FormElementABN({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n autocompleteAttributes,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const abnLookupAuthenticationGuid = useAbnLookupAuthenticationGuid()\n const [label, setLabel] = React.useState(\n value ? abnService.getABNNumberFromABNRecord(value) || '' : '',\n )\n const [isFocused, setIsFocused, removeFocus] = useBooleanState(false)\n const [{ isLoading, error }, setState] = React.useState<{\n isLoading: boolean\n error: Error | null\n }>({\n isLoading: false,\n error: null,\n })\n\n React.useEffect(() => {\n const searchString = label.replace(/[^\\d]/g, '')\n const isSearchStringValid =\n searchString.length === 11 || (searchString.length === 9 && !isFocused)\n\n const currentABNNumber = value\n ? abnService.getABNNumberFromABNRecord(value)\n : ''\n if (!isSearchStringValid || currentABNNumber === searchString) {\n return\n }\n\n setState({\n isLoading: true,\n error: null,\n })\n\n const abortController = new AbortController()\n const fetchRecord = async () => {\n try {\n const urlSearchParams = new URLSearchParams()\n urlSearchParams.append('searchString', searchString)\n urlSearchParams.append('includeHistoricalDetails', 'N')\n if (abnLookupAuthenticationGuid) {\n urlSearchParams.append(\n 'authenticationGuid',\n abnLookupAuthenticationGuid,\n )\n }\n\n const url =\n searchString.length === 11\n ? 'https://abr.business.gov.au/abrxmlsearch/AbrXmlSearch.asmx/SearchByABNv202001'\n : 'https://abr.business.gov.au/abrxmlsearch/AbrXmlSearch.asmx/SearchByASICv201408'\n const response = await fetch(`${url}?${urlSearchParams.toString()}`, {\n mode: 'cors',\n signal: abortController.signal,\n })\n const text = await response.text()\n if (!response.ok) {\n throw new Error(text)\n }\n\n const result = await new Promise<{\n ABRPayloadSearchResults: {\n response: {\n businessEntity201408?: MiscTypes.ABNRecord\n businessEntity202001: MiscTypes.ABNRecord\n exception?: {\n exceptionDescription: string\n exceptionCode: string\n }\n }\n }\n }>((resolve, reject) => {\n parseString(\n text,\n {\n explicitArray: false,\n },\n (err, result) => {\n if (err) {\n reject(err)\n } else {\n resolve(result)\n }\n },\n )\n })\n if (result.ABRPayloadSearchResults.response.exception) {\n throw new Error(\n result.ABRPayloadSearchResults.response.exception.exceptionDescription,\n )\n }\n\n if (result.ABRPayloadSearchResults.response.businessEntity201408) {\n result.ABRPayloadSearchResults.response.businessEntity202001 =\n result.ABRPayloadSearchResults.response.businessEntity201408\n }\n\n if (\n !Array.isArray(\n result.ABRPayloadSearchResults.response.businessEntity202001\n .businessName,\n )\n ) {\n result.ABRPayloadSearchResults.response.businessEntity202001.businessName =\n [\n result.ABRPayloadSearchResults.response.businessEntity202001\n .businessName,\n ]\n }\n\n if (!abortController.signal.aborted) {\n onChange(element, {\n value: result.ABRPayloadSearchResults.response.businessEntity202001,\n })\n setState({\n isLoading: false,\n error: null,\n })\n }\n } catch (err) {\n if (!abortController.signal.aborted) {\n setState({\n isLoading: false,\n error: err as Error,\n })\n }\n }\n }\n\n fetchRecord()\n\n return () => {\n abortController.abort()\n }\n }, [abnLookupAuthenticationGuid, element, isFocused, label, onChange, value])\n\n // Ensure the label is set if the value is set outside of this component\n React.useEffect(() => {\n if (value) {\n const newLabel = abnService.getABNNumberFromABNRecord(value)\n if (!newLabel) {\n // Record in value had no ABN Number. This should never happen\n return\n }\n if (label !== newLabel) {\n setLabel(\n newLabel.split('').reduce((memo, character, index) => {\n switch (index) {\n case 2:\n case 5:\n case 8: {\n return `${memo} ${character}`\n }\n default: {\n return `${memo}${character}`\n }\n }\n }, ''),\n )\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [value])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (((isDirty || displayValidationMessage) &&\n !!validationMessage &&\n !isLoading) ||\n error) &&\n !isLookingUp\n\n const hasCopyButton = !!value && !!element.readOnly\n const hasLookupButton = element.isDataLookup || element.isElementLookup\n return (\n <div className=\"cypress-abn-element\">\n <FormElementLabelContainer\n className=\"ob-abn\"\n id={id}\n element={element}\n required={element.required}\n >\n <div\n className={clsx('field has-addons', {\n 'no-addons-mobile': !hasCopyButton && !hasLookupButton,\n })}\n >\n <div\n className={clsx('control is-expanded', {\n 'is-loading': isLoading,\n })}\n >\n <InputMask\n mask={isFocused || value ? '99 999 999 999' : '999 999 999'}\n maskChar=\" \"\n type=\"text\"\n id={id}\n name={element.name}\n className=\"input ob-input cypress-abn-control\"\n placeholder={element.placeholderValue}\n value={label}\n onChange={(e) => {\n setLabel(e.target.value)\n if (value) {\n onChange(element, {\n value: undefined,\n })\n }\n }}\n required={element.required}\n disabled={element.readOnly}\n onBlur={() => {\n setIsDirty()\n removeFocus()\n }}\n onFocus={setIsFocused}\n aria-describedby={ariaDescribedby}\n autoComplete={autocompleteAttributes}\n aria-required={element.required}\n />\n </div>\n {value && (\n <ABNDisplay abnRecord={value} className=\"ob-abn__display-desktop\" />\n )}\n {hasCopyButton && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={label}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n {value && (\n <ABNDisplay abnRecord={value} className=\"ob-abn__display-mobile\" />\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 {error?.message || validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementABN)\n\nconst ABNDisplay = ({\n abnRecord,\n className,\n}: {\n abnRecord: MiscTypes.ABNRecord\n className: string\n}) => {\n return (\n <div className={`control ob-abn__record-control ${className}`}>\n <a className=\"button is-static ob-abn__record-button\">\n {abnService.displayBusinessNameFromABNRecord(abnRecord)}\n </a>\n </div>\n )\n}\n"]}
|
@@ -99,7 +99,7 @@ function FormElementBSB({ id, formId, element, value, onChange, validationMessag
|
|
99
99
|
});
|
100
100
|
}
|
101
101
|
setIsDirty();
|
102
|
-
}, "aria-describedby": ariaDescribedby, autoComplete: autocompleteAttributes })),
|
102
|
+
}, "aria-describedby": ariaDescribedby, autoComplete: autocompleteAttributes, "aria-required": element.required })),
|
103
103
|
bsbRecord && (React.createElement(BSBDisplay, { bsbRecord: bsbRecord, className: "ob-bsb__display-desktop" })),
|
104
104
|
hasCopyButton && (React.createElement("div", { className: "control" },
|
105
105
|
React.createElement(CopyToClipboardButton, { className: "button is-input-addon copy-button cypress-copy-to-clipboard-button", text: text }))),
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FormElementBSB.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBSB.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport InputMask from 'react-input-mask'\nimport clsx from 'clsx'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes, MiscTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport { formService } from '@oneblink/apps'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\n\ntype Props = {\n id: string\n formId: number\n element: FormTypes.BSBElement\n value: unknown\n onChange: FormElementValueChangeHandler<\n string | { isInvalid: boolean; isValidating: boolean }\n >\n displayValidationMessage: boolean\n validationMessage: string | undefined\n autocompleteAttributes?: string\n} & IsDirtyProps\n\nfunction FormElementBSB({\n id,\n formId,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n autocompleteAttributes,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const [text, setText] = React.useState(typeof value === 'string' ? value : '')\n const isValidFormat = /\\d{3}-\\d{3}/.test(text)\n\n const [{ isLoading, errorMessage, bsbRecord }, setState] = React.useState<{\n isLoading: boolean\n errorMessage: string | null\n bsbRecord: MiscTypes.BSBRecord | null\n }>({\n isLoading: false,\n errorMessage: null,\n bsbRecord: null,\n })\n\n React.useEffect(() => {\n if (bsbRecord) {\n onChange(element, {\n value: bsbRecord.bsb,\n })\n }\n }, [bsbRecord, element, onChange, value])\n\n React.useEffect(() => {\n if (text === '') {\n return\n }\n\n if (!isValidFormat) {\n setState({\n isLoading: false,\n errorMessage: null,\n bsbRecord: null,\n })\n return\n }\n\n setState({\n isLoading: true,\n errorMessage: null,\n bsbRecord: null,\n })\n\n const abortController = new AbortController()\n const getBSBRecord = async () => {\n onChange(element, {\n value: { isValidating: true, isInvalid: false },\n })\n try {\n const bsbRecord = await formService.getBSBRecord(\n formId,\n text,\n abortController.signal,\n )\n if (!abortController.signal.aborted) {\n setState({\n isLoading: false,\n errorMessage: null,\n bsbRecord,\n })\n }\n } catch (error) {\n console.warn('Error validating BSB number', error)\n if (!abortController.signal.aborted) {\n onChange(element, {\n value: { isInvalid: true, isValidating: false },\n })\n setState({\n isLoading: false,\n errorMessage: `The BSB number \"${text}\" does not exist`,\n bsbRecord: null,\n })\n }\n }\n }\n\n getBSBRecord()\n\n return () => {\n abortController.abort()\n }\n }, [formId, isValidFormat, text, onChange, element])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (((isDirty || displayValidationMessage) &&\n !!validationMessage &&\n !isLoading) ||\n errorMessage) &&\n !isLookingUp\n\n const hasCopyButton = !!value && !!element.readOnly\n const hasLookupButton = element.isDataLookup || element.isElementLookup\n return (\n <div className=\"cypress-bsb-element\">\n <FormElementLabelContainer\n className=\"ob-bsb\"\n id={id}\n element={element}\n required={element.required}\n >\n <div\n className={clsx('field has-addons', {\n 'no-addons-mobile': !hasCopyButton && !hasLookupButton,\n })}\n >\n <div\n className={clsx('control is-expanded', {\n 'is-loading': isLoading,\n })}\n >\n <InputMask\n mask=\"999-999\"\n maskChar=\"x\"\n type=\"text\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-bsb-control\"\n value={text}\n onChange={(e) => {\n setText(e.target.value)\n }}\n required={element.required}\n disabled={element.readOnly}\n onBlur={() => {\n if (text === 'xxx-xxx') {\n onChange(element, {\n value: undefined,\n })\n }\n setIsDirty()\n }}\n aria-describedby={ariaDescribedby}\n autoComplete={autocompleteAttributes}\n />\n </div>\n {bsbRecord && (\n <BSBDisplay\n bsbRecord={bsbRecord}\n className=\"ob-bsb__display-desktop\"\n />\n )}\n {hasCopyButton && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n {bsbRecord && (\n <BSBDisplay\n bsbRecord={bsbRecord}\n className=\"ob-bsb__display-mobile\"\n />\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 {errorMessage || validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nconst BSBDisplay = ({\n bsbRecord,\n className,\n}: {\n bsbRecord: MiscTypes.BSBRecord\n className: string\n}) => {\n return (\n <div className={`control ob-bsb__record-control ${className}`}>\n <a className=\"button is-static ob-bsb__record-button\">\n {bsbRecord.financialInstitutionMnemonic} - {bsbRecord.name}\n </a>\n </div>\n )\n}\nexport default React.memo(FormElementBSB)\n"]}
|
1
|
+
{"version":3,"file":"FormElementBSB.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBSB.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport InputMask from 'react-input-mask'\nimport clsx from 'clsx'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes, MiscTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport { formService } from '@oneblink/apps'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\n\ntype Props = {\n id: string\n formId: number\n element: FormTypes.BSBElement\n value: unknown\n onChange: FormElementValueChangeHandler<\n string | { isInvalid: boolean; isValidating: boolean }\n >\n displayValidationMessage: boolean\n validationMessage: string | undefined\n autocompleteAttributes?: string\n} & IsDirtyProps\n\nfunction FormElementBSB({\n id,\n formId,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n autocompleteAttributes,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const [text, setText] = React.useState(typeof value === 'string' ? value : '')\n const isValidFormat = /\\d{3}-\\d{3}/.test(text)\n\n const [{ isLoading, errorMessage, bsbRecord }, setState] = React.useState<{\n isLoading: boolean\n errorMessage: string | null\n bsbRecord: MiscTypes.BSBRecord | null\n }>({\n isLoading: false,\n errorMessage: null,\n bsbRecord: null,\n })\n\n React.useEffect(() => {\n if (bsbRecord) {\n onChange(element, {\n value: bsbRecord.bsb,\n })\n }\n }, [bsbRecord, element, onChange, value])\n\n React.useEffect(() => {\n if (text === '') {\n return\n }\n\n if (!isValidFormat) {\n setState({\n isLoading: false,\n errorMessage: null,\n bsbRecord: null,\n })\n return\n }\n\n setState({\n isLoading: true,\n errorMessage: null,\n bsbRecord: null,\n })\n\n const abortController = new AbortController()\n const getBSBRecord = async () => {\n onChange(element, {\n value: { isValidating: true, isInvalid: false },\n })\n try {\n const bsbRecord = await formService.getBSBRecord(\n formId,\n text,\n abortController.signal,\n )\n if (!abortController.signal.aborted) {\n setState({\n isLoading: false,\n errorMessage: null,\n bsbRecord,\n })\n }\n } catch (error) {\n console.warn('Error validating BSB number', error)\n if (!abortController.signal.aborted) {\n onChange(element, {\n value: { isInvalid: true, isValidating: false },\n })\n setState({\n isLoading: false,\n errorMessage: `The BSB number \"${text}\" does not exist`,\n bsbRecord: null,\n })\n }\n }\n }\n\n getBSBRecord()\n\n return () => {\n abortController.abort()\n }\n }, [formId, isValidFormat, text, onChange, element])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (((isDirty || displayValidationMessage) &&\n !!validationMessage &&\n !isLoading) ||\n errorMessage) &&\n !isLookingUp\n\n const hasCopyButton = !!value && !!element.readOnly\n const hasLookupButton = element.isDataLookup || element.isElementLookup\n return (\n <div className=\"cypress-bsb-element\">\n <FormElementLabelContainer\n className=\"ob-bsb\"\n id={id}\n element={element}\n required={element.required}\n >\n <div\n className={clsx('field has-addons', {\n 'no-addons-mobile': !hasCopyButton && !hasLookupButton,\n })}\n >\n <div\n className={clsx('control is-expanded', {\n 'is-loading': isLoading,\n })}\n >\n <InputMask\n mask=\"999-999\"\n maskChar=\"x\"\n type=\"text\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-bsb-control\"\n value={text}\n onChange={(e) => {\n setText(e.target.value)\n }}\n required={element.required}\n disabled={element.readOnly}\n onBlur={() => {\n if (text === 'xxx-xxx') {\n onChange(element, {\n value: undefined,\n })\n }\n setIsDirty()\n }}\n aria-describedby={ariaDescribedby}\n autoComplete={autocompleteAttributes}\n aria-required={element.required}\n />\n </div>\n {bsbRecord && (\n <BSBDisplay\n bsbRecord={bsbRecord}\n className=\"ob-bsb__display-desktop\"\n />\n )}\n {hasCopyButton && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n {bsbRecord && (\n <BSBDisplay\n bsbRecord={bsbRecord}\n className=\"ob-bsb__display-mobile\"\n />\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 {errorMessage || validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nconst BSBDisplay = ({\n bsbRecord,\n className,\n}: {\n bsbRecord: MiscTypes.BSBRecord\n className: string\n}) => {\n return (\n <div className={`control ob-bsb__record-control ${className}`}>\n <a className=\"button is-static ob-bsb__record-button\">\n {bsbRecord.financialInstitutionMnemonic} - {bsbRecord.name}\n </a>\n </div>\n )\n}\nexport default React.memo(FormElementBSB)\n"]}
|
@@ -62,7 +62,7 @@ function FormElementBarcodeScanner({ id, element, value, onChange, validationMes
|
|
62
62
|
React.createElement("div", { className: "control is-expanded has-icons-right" },
|
63
63
|
React.createElement("input", { type: "text", placeholder: element.placeholderValue, id: id, name: element.name, className: "input ob-input cypress-barcode-scanner-control has-margin-bottom-8", value: text, onChange: (e) => onChange(element, {
|
64
64
|
value: e.target.value || undefined,
|
65
|
-
}), required: element.required, disabled: element.readOnly, onBlur: setIsDirty, "aria-describedby": ariaDescribedby, autoComplete: autocompleteAttributes }),
|
65
|
+
}), required: element.required, disabled: element.readOnly, onBlur: setIsDirty, "aria-describedby": ariaDescribedby, autoComplete: autocompleteAttributes, "aria-required": element.required }),
|
66
66
|
React.createElement("span", { className: "ob-input-icon icon is-small is-right" },
|
67
67
|
React.createElement(MaterialIcon, { className: "is-size-5" }, "document_scanner"))),
|
68
68
|
!!element.readOnly && !!value && (React.createElement("div", { className: "control" },
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FormElementBarcodeScanner.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBarcodeScanner.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport {\n Html5Qrcode,\n CameraDevice,\n Html5QrcodeSupportedFormats,\n} from 'html5-qrcode'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport useBooleanState from '../hooks/useBooleanState'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport useLookupNotification, {\n LookupNotificationContext,\n} from '../hooks/useLookupNotification'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useLoadDataState from '../hooks/useLoadDataState'\nimport OnLoading from '../components/renderer/OnLoading'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport MaterialIcon from '../components/MaterialIcon'\n\ntype Props = {\n id: string\n element: FormTypes.BarcodeScannerElement\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n autocompleteAttributes?: string\n} & IsDirtyProps\n\nfunction FormElementBarcodeScanner({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n autocompleteAttributes,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const [isCameraOpen, startBarcodeScanner, stopBarcodeScanner] =\n useBooleanState(false)\n const [error, setError] = React.useState<Error | null>(null)\n const { onLookup } = useLookupNotification(value)\n const handleScan = React.useCallback(\n (newValue: string | undefined) => {\n setIsDirty()\n onChange(element, {\n value: newValue,\n })\n stopBarcodeScanner()\n onLookup()\n },\n [element, onChange, onLookup, setIsDirty, stopBarcodeScanner],\n )\n\n const openBarcodeScanner = React.useCallback(() => {\n if (window.cordova) {\n setError(null)\n // @ts-expect-error ???\n window.cordova.plugins.barcodeScanner.scan(\n // @ts-expect-error ???\n (result) => {\n if (!result.cancelled) {\n handleScan(result.text)\n }\n },\n // @ts-expect-error ???\n (error) => {\n setError(\n new Error(\n `An error has occurred: \"${error}\". Please click \"Cancel\" below to try again. If the problem persists, please contact support.`,\n ),\n )\n },\n {\n showFlipCameraButton: true,\n showTorchButton: true,\n },\n )\n } else {\n startBarcodeScanner()\n }\n }, [handleScan, startBarcodeScanner])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n const text = typeof value === 'string' ? value : ''\n return (\n <div className=\"cypress-barcode-scanner-element\">\n <FormElementLabelContainer\n className=\"ob-barcode-scanner\"\n element={element}\n id={id}\n required={element.required}\n >\n {error && (\n <figure className=\"ob-figure\">\n <div className=\"figure-content has-text-centered\">\n <div>\n <h4 className=\"title is-4\">Whoops...</h4>\n <p>{error.message}</p>\n </div>\n </div>\n </figure>\n )}\n\n {isCameraOpen ? (\n <BarcodeScannerSupported\n id={`${id}==BARCODE_SCANNER`}\n restrictedBarcodeTypes={\n element.restrictBarcodeTypes\n ? element.restrictedBarcodeTypes\n : undefined\n }\n onScan={handleScan}\n onClose={stopBarcodeScanner}\n aria-describedby={ariaDescribedby}\n />\n ) : (\n <div>\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"text\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-barcode-scanner-control has-margin-bottom-8\"\n value={text}\n onChange={(e) =>\n onChange(element, {\n value: e.target.value || undefined,\n })\n }\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n aria-describedby={ariaDescribedby}\n autoComplete={autocompleteAttributes}\n />\n <span className=\"ob-input-icon icon is-small is-right\">\n <MaterialIcon className=\"is-size-5\">\n document_scanner\n </MaterialIcon>\n </span>\n </div>\n {!!element.readOnly && !!value && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n\n <button\n type=\"button\"\n className=\"button ob-button ob-button__open is-primary cypress-start-scan-barcode-button\"\n disabled={element.readOnly}\n onClick={openBarcodeScanner}\n >\n Scan Barcode\n </button>\n </div>\n )}\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(FormElementBarcodeScanner)\n\ntype BarcodeScannerProps = {\n id: string\n restrictedBarcodeTypes: FormTypes.BarcodeScannerElement['restrictedBarcodeTypes']\n onScan: (barcode: string | undefined) => void\n onClose: () => void\n 'aria-describedby'?: string\n}\n\nfunction BarcodeScannerSupported(props: BarcodeScannerProps) {\n const { onClose } = props\n if (!navigator.mediaDevices?.getUserMedia) {\n return (\n <BarcodeScannerFigure onClose={onClose}>\n <BarcodeScannerError\n title=\"Unsupported Device\"\n message=\"Your device does not support accessing your camera.\"\n />\n </BarcodeScannerFigure>\n )\n }\n\n return <BarcodeScannerCameraLoader {...props} />\n}\n\nfunction BarcodeScannerCameraLoader(props: BarcodeScannerProps) {\n const { onClose } = props\n const [state] = useLoadDataState(Html5Qrcode.getCameras)\n switch (state.status) {\n case 'LOADING': {\n return (\n <BarcodeScannerFigure onClose={onClose}>\n <div className=\"figure-content has-text-centered\">\n <OnLoading small />\n </div>\n </BarcodeScannerFigure>\n )\n }\n case 'ERROR': {\n return (\n <BarcodeScannerFigure onClose={onClose}>\n <BarcodeScannerError\n title=\"Whoops...\"\n message={\n state.error.name === 'NotAllowedError'\n ? 'Cannot scan for barcodes without granting the application access to the camera.'\n : state.error.message\n }\n />\n </BarcodeScannerFigure>\n )\n }\n }\n\n if (!state.result.length) {\n return (\n <BarcodeScannerFigure onClose={onClose}>\n <BarcodeScannerError\n title=\"No Cameras Available\"\n message=\"Your device does not have an accessible camera.\"\n />\n </BarcodeScannerFigure>\n )\n }\n\n return <BarcodeScanner {...props} cameraDevices={state.result} />\n}\n\nfunction BarcodeScanner({\n id,\n restrictedBarcodeTypes,\n onScan,\n onClose,\n ...props\n}: BarcodeScannerProps & {\n cameraDevices: CameraDevice[]\n}) {\n const formatsToSupport = React.useMemo(() => {\n return restrictedBarcodeTypes?.reduce<Html5QrcodeSupportedFormats[]>(\n (memo, barcodeType) => {\n const format =\n Html5QrcodeSupportedFormats[\n barcodeType as keyof typeof Html5QrcodeSupportedFormats\n ]\n if (format !== undefined) {\n memo.push(format)\n }\n return memo\n },\n [],\n )\n }, [restrictedBarcodeTypes])\n\n React.useEffect(() => {\n const html5Qrcode = new Html5Qrcode(id, {\n verbose: !!localStorage.getItem('BARCODE_SCANNER_VERBOSE'),\n formatsToSupport: formatsToSupport?.length ? formatsToSupport : undefined,\n })\n\n html5Qrcode\n .start(\n {\n facingMode: 'environment',\n },\n {\n fps: 20,\n qrbox: {\n width: 400,\n height: 400,\n },\n },\n function onScanSuccess(decodedText, decodedResult) {\n console.log('Barcode scanner decoded result:', decodedResult)\n onScan(decodedText)\n },\n function onScanFailure() {\n // do nothing and keep scanning\n },\n )\n .catch((error) => {\n console.warn('Failed to start scanning', error)\n })\n\n return () => {\n html5Qrcode.stop().catch((error) => {\n console.warn('Failed to stop barcode scanner', error)\n })\n }\n }, [formatsToSupport, id, onScan])\n\n return (\n <BarcodeScannerFigure onClose={onClose}>\n <div className=\"figure-content-absolute-center\">\n <OnLoading small />\n </div>\n <div\n id={id}\n className=\"ob-figure__barcode-scanner\"\n aria-describedby={props['aria-describedby']}\n />\n </BarcodeScannerFigure>\n )\n}\n\nfunction BarcodeScannerFigure({\n onClose,\n children,\n}: {\n onClose: () => void\n children: React.ReactNode\n}) {\n return (\n <div>\n <figure className=\"ob-figure\">{children}</figure>\n <div className=\"buttons ob-buttons\">\n <button\n type=\"button\"\n className=\"button ob-button ob-button__cancel is-light cypress-cancel-scan-barcode-button\"\n onClick={onClose}\n >\n Cancel\n </button>\n </div>\n </div>\n )\n}\n\nfunction BarcodeScannerError({\n title,\n message,\n}: {\n title: string\n message: string\n}) {\n return (\n <div className=\"figure-content has-text-centered\" role=\"alert\">\n <div>\n <h4 className=\"title is-4\">{title}</h4>\n <p className=\"has-margin-bottom-6\">{message}</p>\n <p>\n Please click <b>Cancel</b> below and type in the barcode value\n manually.\n </p>\n </div>\n </div>\n )\n}\n"]}
|
1
|
+
{"version":3,"file":"FormElementBarcodeScanner.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBarcodeScanner.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport {\n Html5Qrcode,\n CameraDevice,\n Html5QrcodeSupportedFormats,\n} from 'html5-qrcode'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport useBooleanState from '../hooks/useBooleanState'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport useLookupNotification, {\n LookupNotificationContext,\n} from '../hooks/useLookupNotification'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useLoadDataState from '../hooks/useLoadDataState'\nimport OnLoading from '../components/renderer/OnLoading'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport MaterialIcon from '../components/MaterialIcon'\n\ntype Props = {\n id: string\n element: FormTypes.BarcodeScannerElement\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n autocompleteAttributes?: string\n} & IsDirtyProps\n\nfunction FormElementBarcodeScanner({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n autocompleteAttributes,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const [isCameraOpen, startBarcodeScanner, stopBarcodeScanner] =\n useBooleanState(false)\n const [error, setError] = React.useState<Error | null>(null)\n const { onLookup } = useLookupNotification(value)\n const handleScan = React.useCallback(\n (newValue: string | undefined) => {\n setIsDirty()\n onChange(element, {\n value: newValue,\n })\n stopBarcodeScanner()\n onLookup()\n },\n [element, onChange, onLookup, setIsDirty, stopBarcodeScanner],\n )\n\n const openBarcodeScanner = React.useCallback(() => {\n if (window.cordova) {\n setError(null)\n // @ts-expect-error ???\n window.cordova.plugins.barcodeScanner.scan(\n // @ts-expect-error ???\n (result) => {\n if (!result.cancelled) {\n handleScan(result.text)\n }\n },\n // @ts-expect-error ???\n (error) => {\n setError(\n new Error(\n `An error has occurred: \"${error}\". Please click \"Cancel\" below to try again. If the problem persists, please contact support.`,\n ),\n )\n },\n {\n showFlipCameraButton: true,\n showTorchButton: true,\n },\n )\n } else {\n startBarcodeScanner()\n }\n }, [handleScan, startBarcodeScanner])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n const text = typeof value === 'string' ? value : ''\n return (\n <div className=\"cypress-barcode-scanner-element\">\n <FormElementLabelContainer\n className=\"ob-barcode-scanner\"\n element={element}\n id={id}\n required={element.required}\n >\n {error && (\n <figure className=\"ob-figure\">\n <div className=\"figure-content has-text-centered\">\n <div>\n <h4 className=\"title is-4\">Whoops...</h4>\n <p>{error.message}</p>\n </div>\n </div>\n </figure>\n )}\n\n {isCameraOpen ? (\n <BarcodeScannerSupported\n id={`${id}==BARCODE_SCANNER`}\n restrictedBarcodeTypes={\n element.restrictBarcodeTypes\n ? element.restrictedBarcodeTypes\n : undefined\n }\n onScan={handleScan}\n onClose={stopBarcodeScanner}\n aria-describedby={ariaDescribedby}\n />\n ) : (\n <div>\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"text\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-barcode-scanner-control has-margin-bottom-8\"\n value={text}\n onChange={(e) =>\n onChange(element, {\n value: e.target.value || undefined,\n })\n }\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n aria-describedby={ariaDescribedby}\n autoComplete={autocompleteAttributes}\n aria-required={element.required}\n />\n <span className=\"ob-input-icon icon is-small is-right\">\n <MaterialIcon className=\"is-size-5\">\n document_scanner\n </MaterialIcon>\n </span>\n </div>\n {!!element.readOnly && !!value && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n\n <button\n type=\"button\"\n className=\"button ob-button ob-button__open is-primary cypress-start-scan-barcode-button\"\n disabled={element.readOnly}\n onClick={openBarcodeScanner}\n >\n Scan Barcode\n </button>\n </div>\n )}\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(FormElementBarcodeScanner)\n\ntype BarcodeScannerProps = {\n id: string\n restrictedBarcodeTypes: FormTypes.BarcodeScannerElement['restrictedBarcodeTypes']\n onScan: (barcode: string | undefined) => void\n onClose: () => void\n 'aria-describedby'?: string\n}\n\nfunction BarcodeScannerSupported(props: BarcodeScannerProps) {\n const { onClose } = props\n if (!navigator.mediaDevices?.getUserMedia) {\n return (\n <BarcodeScannerFigure onClose={onClose}>\n <BarcodeScannerError\n title=\"Unsupported Device\"\n message=\"Your device does not support accessing your camera.\"\n />\n </BarcodeScannerFigure>\n )\n }\n\n return <BarcodeScannerCameraLoader {...props} />\n}\n\nfunction BarcodeScannerCameraLoader(props: BarcodeScannerProps) {\n const { onClose } = props\n const [state] = useLoadDataState(Html5Qrcode.getCameras)\n switch (state.status) {\n case 'LOADING': {\n return (\n <BarcodeScannerFigure onClose={onClose}>\n <div className=\"figure-content has-text-centered\">\n <OnLoading small />\n </div>\n </BarcodeScannerFigure>\n )\n }\n case 'ERROR': {\n return (\n <BarcodeScannerFigure onClose={onClose}>\n <BarcodeScannerError\n title=\"Whoops...\"\n message={\n state.error.name === 'NotAllowedError'\n ? 'Cannot scan for barcodes without granting the application access to the camera.'\n : state.error.message\n }\n />\n </BarcodeScannerFigure>\n )\n }\n }\n\n if (!state.result.length) {\n return (\n <BarcodeScannerFigure onClose={onClose}>\n <BarcodeScannerError\n title=\"No Cameras Available\"\n message=\"Your device does not have an accessible camera.\"\n />\n </BarcodeScannerFigure>\n )\n }\n\n return <BarcodeScanner {...props} cameraDevices={state.result} />\n}\n\nfunction BarcodeScanner({\n id,\n restrictedBarcodeTypes,\n onScan,\n onClose,\n ...props\n}: BarcodeScannerProps & {\n cameraDevices: CameraDevice[]\n}) {\n const formatsToSupport = React.useMemo(() => {\n return restrictedBarcodeTypes?.reduce<Html5QrcodeSupportedFormats[]>(\n (memo, barcodeType) => {\n const format =\n Html5QrcodeSupportedFormats[\n barcodeType as keyof typeof Html5QrcodeSupportedFormats\n ]\n if (format !== undefined) {\n memo.push(format)\n }\n return memo\n },\n [],\n )\n }, [restrictedBarcodeTypes])\n\n React.useEffect(() => {\n const html5Qrcode = new Html5Qrcode(id, {\n verbose: !!localStorage.getItem('BARCODE_SCANNER_VERBOSE'),\n formatsToSupport: formatsToSupport?.length ? formatsToSupport : undefined,\n })\n\n html5Qrcode\n .start(\n {\n facingMode: 'environment',\n },\n {\n fps: 20,\n qrbox: {\n width: 400,\n height: 400,\n },\n },\n function onScanSuccess(decodedText, decodedResult) {\n console.log('Barcode scanner decoded result:', decodedResult)\n onScan(decodedText)\n },\n function onScanFailure() {\n // do nothing and keep scanning\n },\n )\n .catch((error) => {\n console.warn('Failed to start scanning', error)\n })\n\n return () => {\n html5Qrcode.stop().catch((error) => {\n console.warn('Failed to stop barcode scanner', error)\n })\n }\n }, [formatsToSupport, id, onScan])\n\n return (\n <BarcodeScannerFigure onClose={onClose}>\n <div className=\"figure-content-absolute-center\">\n <OnLoading small />\n </div>\n <div\n id={id}\n className=\"ob-figure__barcode-scanner\"\n aria-describedby={props['aria-describedby']}\n />\n </BarcodeScannerFigure>\n )\n}\n\nfunction BarcodeScannerFigure({\n onClose,\n children,\n}: {\n onClose: () => void\n children: React.ReactNode\n}) {\n return (\n <div>\n <figure className=\"ob-figure\">{children}</figure>\n <div className=\"buttons ob-buttons\">\n <button\n type=\"button\"\n className=\"button ob-button ob-button__cancel is-light cypress-cancel-scan-barcode-button\"\n onClick={onClose}\n >\n Cancel\n </button>\n </div>\n </div>\n )\n}\n\nfunction BarcodeScannerError({\n title,\n message,\n}: {\n title: string\n message: string\n}) {\n return (\n <div className=\"figure-content has-text-centered\" role=\"alert\">\n <div>\n <h4 className=\"title is-4\">{title}</h4>\n <p className=\"has-margin-bottom-6\">{message}</p>\n <p>\n Please click <b>Cancel</b> below and type in the barcode value\n manually.\n </p>\n </div>\n </div>\n )\n}\n"]}
|
@@ -17,6 +17,7 @@ function FormElementBoolean({ id, element, value, onChange, validationMessage, d
|
|
17
17
|
});
|
18
18
|
}, disabled: element.readOnly, edge: "start", inputProps: {
|
19
19
|
'aria-describedby': ariaDescribedby,
|
20
|
+
'aria-required': element.required,
|
20
21
|
}, onBlur: setIsDirty })) : (React.createElement(Switch, { id: id, name: element.name, color: "primary", edge: "start", className: "ob-boolean__input cypress-boolean-control", classes: {
|
21
22
|
checked: 'ob-boolean__input-checked',
|
22
23
|
}, checked: !!value, disabled: element.readOnly, onChange: (e) => {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FormElementBoolean.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBoolean.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AACxF,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAA;AAC1E,OAAO,yBAAyB,MAAM,oCAAoC,CAAA;AAW1E,SAAS,kBAAkB,CAAC,EAC1B,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,OAAO,EACP,UAAU,GACJ;IACN,MAAM,eAAe,GAAG,yBAAyB,CAAC,EAAE,EAAE,OAAO,CAAC,CAAA;IAC9D,MAAM,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC,UAAU,CAAC,yBAAyB,CAAC,CAAA;IACnE,MAAM,6BAA6B,GACjC,CAAC,OAAO,IAAI,wBAAwB,CAAC,IAAI,CAAC,CAAC,iBAAiB,IAAI,CAAC,WAAW,CAAA;IAE9E,OAAO,CACL,6BAAK,SAAS,EAAC,yBAAyB;QACtC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,YAAY,EACtB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,OAAO,EACL,OAAO,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAC1B,oBAAC,QAAQ,IACP,KAAK,EAAC,SAAS,EACf,OAAO,EAAE;oBACP,OAAO,EAAE,oCAAoC;iBAC9C,EACD,SAAS,EAAC,qDAAqD,EAC/D,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,CAAC,CAAC,KAAK,EAChB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;oBACd,UAAU,EAAE,CAAA;oBACZ,QAAQ,CAAC,OAAO,EAAE;wBAChB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO;qBACxB,CAAC,CAAA;gBACJ,CAAC,EACD,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,IAAI,EAAC,OAAO,EACZ,UAAU,EAAE;oBACV,kBAAkB,EAAE,eAAe;
|
1
|
+
{"version":3,"file":"FormElementBoolean.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBoolean.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AACxF,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAA;AAC1E,OAAO,yBAAyB,MAAM,oCAAoC,CAAA;AAW1E,SAAS,kBAAkB,CAAC,EAC1B,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,OAAO,EACP,UAAU,GACJ;IACN,MAAM,eAAe,GAAG,yBAAyB,CAAC,EAAE,EAAE,OAAO,CAAC,CAAA;IAC9D,MAAM,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC,UAAU,CAAC,yBAAyB,CAAC,CAAA;IACnE,MAAM,6BAA6B,GACjC,CAAC,OAAO,IAAI,wBAAwB,CAAC,IAAI,CAAC,CAAC,iBAAiB,IAAI,CAAC,WAAW,CAAA;IAE9E,OAAO,CACL,6BAAK,SAAS,EAAC,yBAAyB;QACtC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,YAAY,EACtB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,OAAO,EACL,OAAO,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAC1B,oBAAC,QAAQ,IACP,KAAK,EAAC,SAAS,EACf,OAAO,EAAE;oBACP,OAAO,EAAE,oCAAoC;iBAC9C,EACD,SAAS,EAAC,qDAAqD,EAC/D,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,CAAC,CAAC,KAAK,EAChB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;oBACd,UAAU,EAAE,CAAA;oBACZ,QAAQ,CAAC,OAAO,EAAE;wBAChB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO;qBACxB,CAAC,CAAA;gBACJ,CAAC,EACD,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,IAAI,EAAC,OAAO,EACZ,UAAU,EAAE;oBACV,kBAAkB,EAAE,eAAe;oBACnC,eAAe,EAAE,OAAO,CAAC,QAAQ;iBAClC,EACD,MAAM,EAAE,UAAU,GAClB,CACH,CAAC,CAAC,CAAC,CACF,oBAAC,MAAM,IACL,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,2CAA2C,EACrD,OAAO,EAAE;oBACP,OAAO,EAAE,2BAA2B;iBACrC,EACD,OAAO,EAAE,CAAC,CAAC,KAAK,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;oBACd,UAAU,EAAE,CAAA;oBACZ,QAAQ,CAAC,OAAO,EAAE;wBAChB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO;qBACxB,CAAC,CAAA;gBACJ,CAAC,sBACiB,eAAe,EACjC,MAAM,EAAE,UAAU,GAClB,CACH,IAGF,6BAA6B,IAAI,CAChC,6BAAK,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,kBAAkB;YAC5C,6BAAK,SAAS,EAAC,2DAA2D,IACvE,iBAAiB,CACd,CACF,CACP,CACyB,CACxB,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { Checkbox, Switch } from '@mui/material'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\n\ntype Props = {\n id: string\n element: FormTypes.BooleanElement\n value: unknown\n onChange: FormElementValueChangeHandler<boolean>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementBoolean({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-boolean-element\">\n <FormElementLabelContainer\n className=\"ob-boolean\"\n id={id}\n element={element}\n required={element.required}\n leading={\n element.displayAsCheckbox ? (\n <Checkbox\n color=\"primary\"\n classes={{\n checked: 'ob-boolean-checkbox__input-checked',\n }}\n className=\"ob-boolean-checkbox__input cypress-checkbox-control\"\n id={id}\n checked={!!value}\n onChange={(e) => {\n setIsDirty()\n onChange(element, {\n value: e.target.checked,\n })\n }}\n disabled={element.readOnly}\n edge=\"start\"\n inputProps={{\n 'aria-describedby': ariaDescribedby,\n 'aria-required': element.required,\n }}\n onBlur={setIsDirty}\n />\n ) : (\n <Switch\n id={id}\n name={element.name}\n color=\"primary\"\n edge=\"start\"\n className=\"ob-boolean__input cypress-boolean-control\"\n classes={{\n checked: 'ob-boolean__input-checked',\n }}\n checked={!!value}\n disabled={element.readOnly}\n onChange={(e) => {\n setIsDirty()\n onChange(element, {\n value: e.target.checked,\n })\n }}\n aria-describedby={ariaDescribedby}\n onBlur={setIsDirty}\n />\n )\n }\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(FormElementBoolean)\n"]}
|
@@ -206,7 +206,7 @@ function FormElementCamera({ id, element, value, onChange, validationMessage, di
|
|
206
206
|
React.createElement("figure", { className: "ob-figure", ref: progressTooltipRef },
|
207
207
|
React.createElement(DisplayImage, { isUploading: isUploading, uploadErrorMessage: uploadErrorMessage, isLoadingAttachmentUrl: isLoadingAttachmentUrl, attachmentUrl: attachmentUrl, loadAttachmentUrlError: loadAttachmentUrlError, isLoading: isLoading, element: element, onAnnotate: setIsAnnotating, canDownload: canDownload, progress: progress }),
|
208
208
|
React.createElement(ProgressBar, { isShowing: isUploading, progress: progress })))),
|
209
|
-
React.createElement("input", { ref: fileInputRef, className: "ob-input ob-camera__input-hidden cypress-camera-control", type: "file", accept: "image/*", capture: "environment", id: id, name: element.name, required: element.required, disabled: element.readOnly, onChange: fileChange }),
|
209
|
+
React.createElement("input", { ref: fileInputRef, className: "ob-input ob-camera__input-hidden cypress-camera-control", type: "file", accept: "image/*", capture: "environment", id: id, name: element.name, required: element.required, disabled: element.readOnly, onChange: fileChange, "aria-required": element.required }),
|
210
210
|
React.createElement("div", { className: "buttons ob-buttons" }, value ? (React.createElement(React.Fragment, null,
|
211
211
|
uploadErrorMessage && handleRetry && (React.createElement("button", { type: "button", className: "button ob-button ob-button__retry is-light cypress-retry-file-button", onClick: handleRetry }, "Retry")),
|
212
212
|
React.createElement("button", { type: "button", className: "button ob-button ob-button__clear is-light cypress-clear-camera", onClick: clearImage, disabled: element.readOnly || isLoading }, "Clear"),
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FormElementCamera.js","sourceRoot":"","sources":["../../src/form-elements/FormElementCamera.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\n\nimport useBooleanState from '../hooks/useBooleanState'\nimport downloadAttachment, {\n downloadFileLegacy,\n} from '../services/download-file'\nimport OnLoading from '../components/renderer/OnLoading'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport drawTimestampOnCanvas from '../services/drawTimestampOnCanvas'\nimport { FormElementBinaryStorageValue } from '../types/attachments'\nimport useAttachment from '../hooks/attachments/useAttachment'\nimport AnnotationModal from '../components/renderer/AnnotationModal'\nimport Modal from '../components/renderer/Modal'\nimport {\n checkIfContentTypeIsImage,\n prepareNewAttachment,\n correctFileOrientation,\n} from '../services/attachments'\nimport AttachmentStatus from '../components/renderer/attachments/AttachmentStatus'\nimport { canvasToBlob, urlToBlobAsync } from '../services/blob-utils'\nimport ImagePreviewUnavailable from '../components/renderer/attachments/ImagePreviewUnavailable'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport ProgressBar from '../components/renderer/attachments/ProgressBar'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport MaterialIcon from '../components/MaterialIcon'\n\ntype Props = {\n id: string\n element: FormTypes.CameraElement\n value: FormElementBinaryStorageValue\n onChange: FormElementValueChangeHandler<FormElementBinaryStorageValue>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementCamera({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const [{ cameraError, isLoading }, setState] = React.useState<{\n isLoading: boolean\n cameraError?: Error\n }>({\n isLoading: false,\n })\n const [isAnnotating, setIsAnnotating, clearIsAnnotating] =\n useBooleanState(false)\n const fileInputRef = React.useRef<HTMLInputElement>(null)\n\n const clearImage = React.useCallback(() => {\n onChange(element, {\n value: undefined,\n })\n }, [element, onChange])\n\n const fileChange = React.useCallback(\n async (changeEvent: React.ChangeEvent<HTMLInputElement>) => {\n if (!changeEvent.target || !changeEvent.target.files) {\n return\n }\n\n const file = changeEvent.target.files[0]\n if (!file) {\n return\n }\n\n setState({\n isLoading: true,\n })\n\n console.log('File selected event', file)\n try {\n if (!file.size) {\n throw new Error('You cannot upload an empty file.')\n }\n\n if (!checkIfContentTypeIsImage(file.type)) {\n throw new Error(\n `Invalid file type \"${file.type}\". Please select an image.`,\n )\n }\n const result = await correctFileOrientation(\n file,\n element.includeTimestampWatermark ? drawTimestampOnCanvas : undefined,\n )\n\n if (result instanceof Blob) {\n onChange(element, {\n value: prepareNewAttachment(result, file.name, element),\n })\n } else {\n const blob = await canvasToBlob(result)\n onChange(element, {\n value: prepareNewAttachment(blob, file.name, element),\n })\n }\n\n setIsDirty()\n setState({\n isLoading: false,\n })\n } catch (error) {\n setState({\n isLoading: false,\n cameraError: error as Error,\n })\n }\n },\n [element, onChange, setIsDirty],\n )\n const openCamera = React.useCallback(() => {\n if (window.cordova && navigator.camera && navigator.camera.getPicture) {\n setState({\n isLoading: true,\n })\n navigator.camera.getPicture(\n (base64Data: string) => {\n urlToBlobAsync(`data:image/jpeg;base64,${base64Data}`)\n .then((blob) => {\n onChange(element, {\n value: prepareNewAttachment(blob, 'photo.jpeg', element),\n })\n setState({\n isLoading: false,\n })\n })\n .catch((error) => {\n setState({\n cameraError: error,\n isLoading: false,\n })\n })\n },\n (error: Error) => {\n console.warn(\n 'An error occurred while attempting to take a photo',\n error,\n )\n setState({\n isLoading: false,\n cameraError: error,\n })\n },\n {\n quality: 100,\n destinationType: window.Camera.DestinationType.DATA_URL,\n sourceType: window.Camera.PictureSourceType.CAMERA,\n allowEdit: false,\n encodingType: window.Camera.EncodingType.JPEG,\n mediaType: window.Camera.MediaType.PICTURE,\n correctOrientation: true,\n saveToPhotoAlbum: false,\n cameraDirection: window.Camera.Direction.BACK,\n },\n )\n } else if (fileInputRef.current) {\n // RESET HTML FILE INPUT VALUE SO FILES PREVIOUSLY ADDED AND REMOVED ARE RECOGNIZED\n fileInputRef.current.value = ''\n fileInputRef.current.click()\n } else {\n console.error(\n 'Could not find \"input\" element in Camera component template',\n )\n }\n }, [element, onChange])\n\n const {\n isUploading,\n uploadErrorMessage,\n isLoadingAttachmentUrl,\n attachmentUrl,\n loadAttachmentUrlError,\n canDownload,\n progress,\n } = useAttachment(\n value,\n element,\n React.useCallback(\n (id, attachment) => {\n onChange(element, {\n value: attachment,\n })\n },\n [element, onChange],\n ),\n )\n\n const handleRetry = React.useMemo(() => {\n if (!value || typeof value !== 'object') return\n\n if (value.type === 'ERROR' && value.data) {\n return () => {\n onChange(element, {\n value: {\n type: 'NEW',\n _id: value._id,\n data: value.data,\n fileName: value.fileName,\n isPrivate: value.isPrivate,\n },\n })\n }\n }\n }, [element, onChange, value])\n\n const handleDownload = React.useCallback(async () => {\n if (typeof value === 'string') {\n await downloadFileLegacy(value, id)\n } else if (value && value.type !== 'ERROR') {\n await downloadAttachment(value)\n }\n }, [value, id])\n\n const handleSaveAnnotation = React.useCallback(\n (annotationDataUri: string) => {\n clearIsAnnotating()\n\n if (typeof attachmentUrl !== 'string') {\n return\n }\n\n setState({\n isLoading: true,\n })\n\n const canvas = document.createElement('canvas')\n const ctx = canvas.getContext('2d')\n if (!ctx) {\n return\n }\n\n const image = new Image()\n image.onload = function () {\n canvas.width = image.width\n canvas.height = image.height\n\n ctx.drawImage(image, 0, 0)\n\n const annotationImage = new Image()\n annotationImage.onload = function () {\n ctx.drawImage(annotationImage, 0, 0, canvas.width, canvas.height)\n\n try {\n canvasToBlob(canvas)\n .then((blob) => {\n const attachment = prepareNewAttachment(\n blob,\n 'photo.png',\n element,\n )\n onChange(element, {\n value: attachment,\n })\n setState({\n isLoading: false,\n })\n })\n .catch((error) => {\n setState({\n cameraError: error,\n isLoading: false,\n })\n })\n } catch (error) {\n setState({\n cameraError: error as Error,\n isLoading: false,\n })\n }\n }\n annotationImage.src = annotationDataUri\n }\n image.setAttribute('crossorigin', 'anonymous')\n image.src = attachmentUrl\n },\n [attachmentUrl, clearIsAnnotating, element, onChange],\n )\n\n const progressTooltipRef = React.useRef<HTMLDivElement>(null)\n return (\n <>\n <FormElementLabelContainer\n className=\"ob-camera\"\n element={element}\n id={id}\n required={element.required}\n >\n <div className=\"control\">\n {(value || isLoading) && (\n <>\n <figure className=\"ob-figure\" ref={progressTooltipRef}>\n <DisplayImage\n isUploading={isUploading}\n uploadErrorMessage={uploadErrorMessage}\n isLoadingAttachmentUrl={isLoadingAttachmentUrl}\n attachmentUrl={attachmentUrl}\n loadAttachmentUrlError={loadAttachmentUrlError}\n isLoading={isLoading}\n element={element}\n onAnnotate={setIsAnnotating}\n canDownload={canDownload}\n progress={progress}\n />\n <ProgressBar isShowing={isUploading} progress={progress} />\n </figure>\n </>\n )}\n\n <input\n ref={fileInputRef}\n className=\"ob-input ob-camera__input-hidden cypress-camera-control\"\n type=\"file\"\n accept=\"image/*\"\n capture=\"environment\"\n id={id}\n name={element.name}\n required={element.required}\n disabled={element.readOnly}\n onChange={fileChange}\n />\n <div className=\"buttons ob-buttons\">\n {value ? (\n <>\n {uploadErrorMessage && handleRetry && (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__retry is-light cypress-retry-file-button\"\n onClick={handleRetry}\n >\n Retry\n </button>\n )}\n <button\n type=\"button\"\n className=\"button ob-button ob-button__clear is-light cypress-clear-camera\"\n onClick={clearImage}\n disabled={element.readOnly || isLoading}\n >\n Clear\n </button>\n {canDownload && (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__download is-primary cypress-download-file-button\"\n onClick={handleDownload}\n >\n <span className=\"icon\">\n <MaterialIcon>cloud_download</MaterialIcon>\n </span>\n <span> Download</span>\n </button>\n )}\n </>\n ) : (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__open is-primary cypress-open-camera\"\n onClick={openCamera}\n disabled={element.readOnly || isLoading}\n aria-describedby={ariaDescribedby}\n onBlur={setIsDirty}\n >\n Open Camera\n </button>\n )}\n </div>\n </div>\n {(isDirty || displayValidationMessage) && !!validationMessage && (\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\n {isAnnotating && attachmentUrl && (\n <AnnotationModal\n imageSrc={attachmentUrl}\n onClose={clearIsAnnotating}\n onSave={handleSaveAnnotation}\n />\n )}\n\n {cameraError && (\n <Modal\n isOpen\n title=\"Whoops...\"\n className=\"cypress-error-modal\"\n titleClassName=\"cypress-error-title\"\n actions={\n <button\n type=\"button\"\n className=\"button ob-button is-primary cypress-close-error-button\"\n onClick={() => setState({ isLoading: false })}\n autoFocus\n >\n Okay\n </button>\n }\n >\n <p>\n An error occurred while attempting to take a photo. Please click{' '}\n <b>Okay</b> below to try again. If the problem persists, please\n contact support.\n </p>\n\n <div className=\"content has-margin-top-6\">\n <blockquote>{cameraError.toString()}</blockquote>\n </div>\n </Modal>\n )}\n </>\n )\n}\n\nexport default React.memo(FormElementCamera)\n\nconst DisplayImage = React.memo(function DisplayImage({\n uploadErrorMessage,\n isUploading,\n isLoadingAttachmentUrl,\n attachmentUrl,\n loadAttachmentUrlError,\n isLoading,\n element,\n onAnnotate,\n progress,\n}: ReturnType<typeof useAttachment> & {\n element: FormTypes.CameraElement\n isLoading: boolean\n onAnnotate: () => void\n progress: number | undefined\n}) {\n if (uploadErrorMessage) {\n return (\n <div className=\"figure-content\" role=\"alert\">\n <h3 className=\"title is-3\">Upload Failed</h3>\n <p>\n Your photo failed to upload, please use the <b>Retry</b> or{' '}\n <b>Clear</b> buttons below.\n </p>\n </div>\n )\n }\n\n if (loadAttachmentUrlError) {\n return (\n <div className=\"figure-content\" role=\"alert\">\n <h3 className=\"title is-3\">Preview Failed</h3>\n <p>{loadAttachmentUrlError.message}</p>\n </div>\n )\n }\n\n if (isLoadingAttachmentUrl || isLoading) {\n return (\n <div className=\"figure-content has-text-centered cypress-camera-loading-image\">\n <OnLoading small />\n </div>\n )\n }\n\n if (attachmentUrl) {\n return (\n <>\n <span className=\"ob-figure__status\">\n <AttachmentStatus\n isLoadingAttachmentUrl={isLoadingAttachmentUrl}\n loadAttachmentUrlError={loadAttachmentUrlError}\n isUploading={isUploading}\n attachmentUrl={attachmentUrl}\n progress={progress}\n />\n </span>\n <img\n src={attachmentUrl}\n className=\"cypress-camera-image ob-camera__img\"\n crossOrigin=\"anonymous\"\n alt={`${element.label}: Attachment`}\n />\n <button\n type=\"button\"\n className=\"button is-primary ob-camera__annotate-button cypress-annotate-button\"\n onClick={onAnnotate}\n disabled={element.readOnly}\n >\n <span className=\"icon\">\n <MaterialIcon>brush</MaterialIcon>\n </span>\n </button>\n </>\n )\n }\n\n return (\n <div className=\"figure-content\" role=\"alert\">\n <ImagePreviewUnavailable />\n </div>\n )\n})\n"]}
|
1
|
+
{"version":3,"file":"FormElementCamera.js","sourceRoot":"","sources":["../../src/form-elements/FormElementCamera.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\n\nimport useBooleanState from '../hooks/useBooleanState'\nimport downloadAttachment, {\n downloadFileLegacy,\n} from '../services/download-file'\nimport OnLoading from '../components/renderer/OnLoading'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport drawTimestampOnCanvas from '../services/drawTimestampOnCanvas'\nimport { FormElementBinaryStorageValue } from '../types/attachments'\nimport useAttachment from '../hooks/attachments/useAttachment'\nimport AnnotationModal from '../components/renderer/AnnotationModal'\nimport Modal from '../components/renderer/Modal'\nimport {\n checkIfContentTypeIsImage,\n prepareNewAttachment,\n correctFileOrientation,\n} from '../services/attachments'\nimport AttachmentStatus from '../components/renderer/attachments/AttachmentStatus'\nimport { canvasToBlob, urlToBlobAsync } from '../services/blob-utils'\nimport ImagePreviewUnavailable from '../components/renderer/attachments/ImagePreviewUnavailable'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport ProgressBar from '../components/renderer/attachments/ProgressBar'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport MaterialIcon from '../components/MaterialIcon'\n\ntype Props = {\n id: string\n element: FormTypes.CameraElement\n value: FormElementBinaryStorageValue\n onChange: FormElementValueChangeHandler<FormElementBinaryStorageValue>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementCamera({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const [{ cameraError, isLoading }, setState] = React.useState<{\n isLoading: boolean\n cameraError?: Error\n }>({\n isLoading: false,\n })\n const [isAnnotating, setIsAnnotating, clearIsAnnotating] =\n useBooleanState(false)\n const fileInputRef = React.useRef<HTMLInputElement>(null)\n\n const clearImage = React.useCallback(() => {\n onChange(element, {\n value: undefined,\n })\n }, [element, onChange])\n\n const fileChange = React.useCallback(\n async (changeEvent: React.ChangeEvent<HTMLInputElement>) => {\n if (!changeEvent.target || !changeEvent.target.files) {\n return\n }\n\n const file = changeEvent.target.files[0]\n if (!file) {\n return\n }\n\n setState({\n isLoading: true,\n })\n\n console.log('File selected event', file)\n try {\n if (!file.size) {\n throw new Error('You cannot upload an empty file.')\n }\n\n if (!checkIfContentTypeIsImage(file.type)) {\n throw new Error(\n `Invalid file type \"${file.type}\". Please select an image.`,\n )\n }\n const result = await correctFileOrientation(\n file,\n element.includeTimestampWatermark ? drawTimestampOnCanvas : undefined,\n )\n\n if (result instanceof Blob) {\n onChange(element, {\n value: prepareNewAttachment(result, file.name, element),\n })\n } else {\n const blob = await canvasToBlob(result)\n onChange(element, {\n value: prepareNewAttachment(blob, file.name, element),\n })\n }\n\n setIsDirty()\n setState({\n isLoading: false,\n })\n } catch (error) {\n setState({\n isLoading: false,\n cameraError: error as Error,\n })\n }\n },\n [element, onChange, setIsDirty],\n )\n const openCamera = React.useCallback(() => {\n if (window.cordova && navigator.camera && navigator.camera.getPicture) {\n setState({\n isLoading: true,\n })\n navigator.camera.getPicture(\n (base64Data: string) => {\n urlToBlobAsync(`data:image/jpeg;base64,${base64Data}`)\n .then((blob) => {\n onChange(element, {\n value: prepareNewAttachment(blob, 'photo.jpeg', element),\n })\n setState({\n isLoading: false,\n })\n })\n .catch((error) => {\n setState({\n cameraError: error,\n isLoading: false,\n })\n })\n },\n (error: Error) => {\n console.warn(\n 'An error occurred while attempting to take a photo',\n error,\n )\n setState({\n isLoading: false,\n cameraError: error,\n })\n },\n {\n quality: 100,\n destinationType: window.Camera.DestinationType.DATA_URL,\n sourceType: window.Camera.PictureSourceType.CAMERA,\n allowEdit: false,\n encodingType: window.Camera.EncodingType.JPEG,\n mediaType: window.Camera.MediaType.PICTURE,\n correctOrientation: true,\n saveToPhotoAlbum: false,\n cameraDirection: window.Camera.Direction.BACK,\n },\n )\n } else if (fileInputRef.current) {\n // RESET HTML FILE INPUT VALUE SO FILES PREVIOUSLY ADDED AND REMOVED ARE RECOGNIZED\n fileInputRef.current.value = ''\n fileInputRef.current.click()\n } else {\n console.error(\n 'Could not find \"input\" element in Camera component template',\n )\n }\n }, [element, onChange])\n\n const {\n isUploading,\n uploadErrorMessage,\n isLoadingAttachmentUrl,\n attachmentUrl,\n loadAttachmentUrlError,\n canDownload,\n progress,\n } = useAttachment(\n value,\n element,\n React.useCallback(\n (id, attachment) => {\n onChange(element, {\n value: attachment,\n })\n },\n [element, onChange],\n ),\n )\n\n const handleRetry = React.useMemo(() => {\n if (!value || typeof value !== 'object') return\n\n if (value.type === 'ERROR' && value.data) {\n return () => {\n onChange(element, {\n value: {\n type: 'NEW',\n _id: value._id,\n data: value.data,\n fileName: value.fileName,\n isPrivate: value.isPrivate,\n },\n })\n }\n }\n }, [element, onChange, value])\n\n const handleDownload = React.useCallback(async () => {\n if (typeof value === 'string') {\n await downloadFileLegacy(value, id)\n } else if (value && value.type !== 'ERROR') {\n await downloadAttachment(value)\n }\n }, [value, id])\n\n const handleSaveAnnotation = React.useCallback(\n (annotationDataUri: string) => {\n clearIsAnnotating()\n\n if (typeof attachmentUrl !== 'string') {\n return\n }\n\n setState({\n isLoading: true,\n })\n\n const canvas = document.createElement('canvas')\n const ctx = canvas.getContext('2d')\n if (!ctx) {\n return\n }\n\n const image = new Image()\n image.onload = function () {\n canvas.width = image.width\n canvas.height = image.height\n\n ctx.drawImage(image, 0, 0)\n\n const annotationImage = new Image()\n annotationImage.onload = function () {\n ctx.drawImage(annotationImage, 0, 0, canvas.width, canvas.height)\n\n try {\n canvasToBlob(canvas)\n .then((blob) => {\n const attachment = prepareNewAttachment(\n blob,\n 'photo.png',\n element,\n )\n onChange(element, {\n value: attachment,\n })\n setState({\n isLoading: false,\n })\n })\n .catch((error) => {\n setState({\n cameraError: error,\n isLoading: false,\n })\n })\n } catch (error) {\n setState({\n cameraError: error as Error,\n isLoading: false,\n })\n }\n }\n annotationImage.src = annotationDataUri\n }\n image.setAttribute('crossorigin', 'anonymous')\n image.src = attachmentUrl\n },\n [attachmentUrl, clearIsAnnotating, element, onChange],\n )\n\n const progressTooltipRef = React.useRef<HTMLDivElement>(null)\n return (\n <>\n <FormElementLabelContainer\n className=\"ob-camera\"\n element={element}\n id={id}\n required={element.required}\n >\n <div className=\"control\">\n {(value || isLoading) && (\n <>\n <figure className=\"ob-figure\" ref={progressTooltipRef}>\n <DisplayImage\n isUploading={isUploading}\n uploadErrorMessage={uploadErrorMessage}\n isLoadingAttachmentUrl={isLoadingAttachmentUrl}\n attachmentUrl={attachmentUrl}\n loadAttachmentUrlError={loadAttachmentUrlError}\n isLoading={isLoading}\n element={element}\n onAnnotate={setIsAnnotating}\n canDownload={canDownload}\n progress={progress}\n />\n <ProgressBar isShowing={isUploading} progress={progress} />\n </figure>\n </>\n )}\n\n <input\n ref={fileInputRef}\n className=\"ob-input ob-camera__input-hidden cypress-camera-control\"\n type=\"file\"\n accept=\"image/*\"\n capture=\"environment\"\n id={id}\n name={element.name}\n required={element.required}\n disabled={element.readOnly}\n onChange={fileChange}\n aria-required={element.required}\n />\n <div className=\"buttons ob-buttons\">\n {value ? (\n <>\n {uploadErrorMessage && handleRetry && (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__retry is-light cypress-retry-file-button\"\n onClick={handleRetry}\n >\n Retry\n </button>\n )}\n <button\n type=\"button\"\n className=\"button ob-button ob-button__clear is-light cypress-clear-camera\"\n onClick={clearImage}\n disabled={element.readOnly || isLoading}\n >\n Clear\n </button>\n {canDownload && (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__download is-primary cypress-download-file-button\"\n onClick={handleDownload}\n >\n <span className=\"icon\">\n <MaterialIcon>cloud_download</MaterialIcon>\n </span>\n <span> Download</span>\n </button>\n )}\n </>\n ) : (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__open is-primary cypress-open-camera\"\n onClick={openCamera}\n disabled={element.readOnly || isLoading}\n aria-describedby={ariaDescribedby}\n onBlur={setIsDirty}\n >\n Open Camera\n </button>\n )}\n </div>\n </div>\n {(isDirty || displayValidationMessage) && !!validationMessage && (\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\n {isAnnotating && attachmentUrl && (\n <AnnotationModal\n imageSrc={attachmentUrl}\n onClose={clearIsAnnotating}\n onSave={handleSaveAnnotation}\n />\n )}\n\n {cameraError && (\n <Modal\n isOpen\n title=\"Whoops...\"\n className=\"cypress-error-modal\"\n titleClassName=\"cypress-error-title\"\n actions={\n <button\n type=\"button\"\n className=\"button ob-button is-primary cypress-close-error-button\"\n onClick={() => setState({ isLoading: false })}\n autoFocus\n >\n Okay\n </button>\n }\n >\n <p>\n An error occurred while attempting to take a photo. Please click{' '}\n <b>Okay</b> below to try again. If the problem persists, please\n contact support.\n </p>\n\n <div className=\"content has-margin-top-6\">\n <blockquote>{cameraError.toString()}</blockquote>\n </div>\n </Modal>\n )}\n </>\n )\n}\n\nexport default React.memo(FormElementCamera)\n\nconst DisplayImage = React.memo(function DisplayImage({\n uploadErrorMessage,\n isUploading,\n isLoadingAttachmentUrl,\n attachmentUrl,\n loadAttachmentUrlError,\n isLoading,\n element,\n onAnnotate,\n progress,\n}: ReturnType<typeof useAttachment> & {\n element: FormTypes.CameraElement\n isLoading: boolean\n onAnnotate: () => void\n progress: number | undefined\n}) {\n if (uploadErrorMessage) {\n return (\n <div className=\"figure-content\" role=\"alert\">\n <h3 className=\"title is-3\">Upload Failed</h3>\n <p>\n Your photo failed to upload, please use the <b>Retry</b> or{' '}\n <b>Clear</b> buttons below.\n </p>\n </div>\n )\n }\n\n if (loadAttachmentUrlError) {\n return (\n <div className=\"figure-content\" role=\"alert\">\n <h3 className=\"title is-3\">Preview Failed</h3>\n <p>{loadAttachmentUrlError.message}</p>\n </div>\n )\n }\n\n if (isLoadingAttachmentUrl || isLoading) {\n return (\n <div className=\"figure-content has-text-centered cypress-camera-loading-image\">\n <OnLoading small />\n </div>\n )\n }\n\n if (attachmentUrl) {\n return (\n <>\n <span className=\"ob-figure__status\">\n <AttachmentStatus\n isLoadingAttachmentUrl={isLoadingAttachmentUrl}\n loadAttachmentUrlError={loadAttachmentUrlError}\n isUploading={isUploading}\n attachmentUrl={attachmentUrl}\n progress={progress}\n />\n </span>\n <img\n src={attachmentUrl}\n className=\"cypress-camera-image ob-camera__img\"\n crossOrigin=\"anonymous\"\n alt={`${element.label}: Attachment`}\n />\n <button\n type=\"button\"\n className=\"button is-primary ob-camera__annotate-button cypress-annotate-button\"\n onClick={onAnnotate}\n disabled={element.readOnly}\n >\n <span className=\"icon\">\n <MaterialIcon>brush</MaterialIcon>\n </span>\n </button>\n </>\n )\n }\n\n return (\n <div className=\"figure-content\" role=\"alert\">\n <ImagePreviewUnavailable />\n </div>\n )\n})\n"]}
|
@@ -39,6 +39,7 @@ function FormElementDate({ id, element, value, onChange, validationMessage, disp
|
|
39
39
|
className: 'cypress-date-control',
|
40
40
|
onBlur: setIsDirty,
|
41
41
|
disabled: element.readOnly,
|
42
|
+
required: element.required,
|
42
43
|
onChange: (newDate) => onChange(element, {
|
43
44
|
value: newDate ? format(newDate, 'yyyy-MM-dd') : undefined,
|
44
45
|
}),
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FormElementDate.js","sourceRoot":"","sources":["../../src/form-elements/FormElementDate.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { localisationService } from '@oneblink/apps'\nimport { FormTypes } from '@oneblink/types'\nimport { DatePicker } from '@mui/x-date-pickers'\nimport { format } from 'date-fns'\n\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\n\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { parseDateValue } from '../services/generate-default-data'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useFormElementDateFromTo from '../hooks/useFormElementDateFromTo'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport useFormDatePickerProps, {\n PickerInputButton,\n} from '../hooks/form-date-picker/useFormDatePickerProps'\n\ntype Props = {\n id: string\n element: FormTypes.DateElement\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementDate({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n\n const { fromDate, fromDaysOffset, toDate, toDaysOffset } =\n useFormElementDateFromTo(element)\n\n const shortDateFormat = localisationService.getDateFnsFormats().shortDate\n\n const maxDate = React.useMemo(() => {\n return parseDateValue({\n dateOnly: true,\n daysOffset: toDaysOffset,\n value: toDate,\n })\n }, [toDate, toDaysOffset])\n\n const minDate = React.useMemo(() => {\n return parseDateValue({\n dateOnly: true,\n daysOffset: fromDaysOffset,\n value: fromDate,\n })\n }, [fromDate, fromDaysOffset])\n\n const isoValue = React.useMemo(\n () => parseDateValue({ dateOnly: false, daysOffset: 0, value }),\n [value],\n )\n\n const [commonProps, openDatePicker] = useFormDatePickerProps({\n id,\n value: isoValue,\n maxDate,\n minDate,\n ariaDescribedby,\n placeholder: element.placeholderValue,\n className: 'cypress-date-control',\n onBlur: setIsDirty,\n disabled: element.readOnly,\n onChange: (newDate) =>\n onChange(element, {\n value: newDate ? format(newDate, 'yyyy-MM-dd') : undefined,\n }),\n })\n\n const text = React.useMemo(() => {\n if (typeof value === 'string') {\n const date = localisationService.generateDate({\n daysOffset: undefined,\n value,\n })\n if (date) {\n return localisationService.formatDate(date)\n }\n }\n return null\n }, [value])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (displayValidationMessage || isDirty) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-date-element\">\n <FormElementLabelContainer\n className=\"ob-date\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <DatePicker\n label={element.label}\n format={shortDateFormat}\n {...commonProps}\n />\n {!element.readOnly && (\n <PickerInputButton\n tooltip=\"Select date\"\n onClick={openDatePicker}\n icon=\"event\"\n />\n )}\n {!!element.readOnly && !!text && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\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(FormElementDate)\n"]}
|
1
|
+
{"version":3,"file":"FormElementDate.js","sourceRoot":"","sources":["../../src/form-elements/FormElementDate.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { localisationService } from '@oneblink/apps'\nimport { FormTypes } from '@oneblink/types'\nimport { DatePicker } from '@mui/x-date-pickers'\nimport { format } from 'date-fns'\n\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\n\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { parseDateValue } from '../services/generate-default-data'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useFormElementDateFromTo from '../hooks/useFormElementDateFromTo'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport useFormDatePickerProps, {\n PickerInputButton,\n} from '../hooks/form-date-picker/useFormDatePickerProps'\n\ntype Props = {\n id: string\n element: FormTypes.DateElement\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementDate({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n\n const { fromDate, fromDaysOffset, toDate, toDaysOffset } =\n useFormElementDateFromTo(element)\n\n const shortDateFormat = localisationService.getDateFnsFormats().shortDate\n\n const maxDate = React.useMemo(() => {\n return parseDateValue({\n dateOnly: true,\n daysOffset: toDaysOffset,\n value: toDate,\n })\n }, [toDate, toDaysOffset])\n\n const minDate = React.useMemo(() => {\n return parseDateValue({\n dateOnly: true,\n daysOffset: fromDaysOffset,\n value: fromDate,\n })\n }, [fromDate, fromDaysOffset])\n\n const isoValue = React.useMemo(\n () => parseDateValue({ dateOnly: false, daysOffset: 0, value }),\n [value],\n )\n\n const [commonProps, openDatePicker] = useFormDatePickerProps({\n id,\n value: isoValue,\n maxDate,\n minDate,\n ariaDescribedby,\n placeholder: element.placeholderValue,\n className: 'cypress-date-control',\n onBlur: setIsDirty,\n disabled: element.readOnly,\n required: element.required,\n onChange: (newDate) =>\n onChange(element, {\n value: newDate ? format(newDate, 'yyyy-MM-dd') : undefined,\n }),\n })\n\n const text = React.useMemo(() => {\n if (typeof value === 'string') {\n const date = localisationService.generateDate({\n daysOffset: undefined,\n value,\n })\n if (date) {\n return localisationService.formatDate(date)\n }\n }\n return null\n }, [value])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (displayValidationMessage || isDirty) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-date-element\">\n <FormElementLabelContainer\n className=\"ob-date\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <DatePicker\n label={element.label}\n format={shortDateFormat}\n {...commonProps}\n />\n {!element.readOnly && (\n <PickerInputButton\n tooltip=\"Select date\"\n onClick={openDatePicker}\n icon=\"event\"\n />\n )}\n {!!element.readOnly && !!text && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\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(FormElementDate)\n"]}
|
@@ -36,6 +36,7 @@ function FormElementDateTime({ id, element, value, onChange, validationMessage,
|
|
36
36
|
placeholder: element.placeholderValue,
|
37
37
|
className: 'cypress-date-time-control',
|
38
38
|
disabled: element.readOnly,
|
39
|
+
required: element.required,
|
39
40
|
onBlur: setIsDirty,
|
40
41
|
onChange: (newDate) => {
|
41
42
|
onChange(element, {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FormElementDateTime.js","sourceRoot":"","sources":["../../src/form-elements/FormElementDateTime.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAEpD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAEpD,OAAO,qBAAqB,MAAM,8CAA8C,CAAA;AAChF,OAAO,YAAY,MAAM,qCAAqC,CAAA;AAE9D,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AACxF,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAA;AAElE,OAAO,wBAAwB,MAAM,mCAAmC,CAAA;AACxE,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAA;AAC1E,OAAO,yBAAyB,MAAM,oCAAoC,CAAA;AAC1E,OAAO,sBAAsB,EAAE,EAC7B,iBAAiB,GAClB,MAAM,kDAAkD,CAAA;AAWzD,SAAS,mBAAmB,CAAC,EAC3B,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,OAAO,EACP,UAAU,GACJ;IACN,MAAM,eAAe,GAAG,yBAAyB,CAAC,EAAE,EAAE,OAAO,CAAC,CAAA;IAE9D,MAAM,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,EAAE,YAAY,EAAE,GACtD,wBAAwB,CAAC,OAAO,CAAC,CAAA;IAEnC,MAAM,mBAAmB,GACvB,mBAAmB,CAAC,iBAAiB,EAAE,CAAC,aAAa,CAAA;IAEvD,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACjC,OAAO,cAAc,CAAC;YACpB,QAAQ,EAAE,IAAI;YACd,UAAU,EAAE,YAAY;YACxB,KAAK,EAAE,MAAM;SACd,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAA;IAE1B,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACjC,OAAO,cAAc,CAAC;YACpB,QAAQ,EAAE,IAAI;YACd,UAAU,EAAE,cAAc;YAC1B,KAAK,EAAE,QAAQ;SAChB,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC,CAAA;IAE9B,MAAM,CAAC,WAAW,EAAE,kBAAkB,CAAC,GAAG,sBAAsB,CAAC;QAC/D,EAAE;QACF,KAAK,EAAE,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;QACpD,OAAO;QACP,OAAO;QACP,eAAe;QACf,WAAW,EAAE,OAAO,CAAC,gBAAgB;QACrC,SAAS,EAAE,2BAA2B;QACtC,QAAQ,EAAE,OAAO,CAAC,QAAQ;QAC1B,MAAM,EAAE,UAAU;QAClB,QAAQ,EAAE,CAAC,OAAO,EAAE,EAAE;YACpB,QAAQ,CAAC,OAAO,EAAE;gBAChB,KAAK,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,EAAE;aAC9B,CAAC,CAAA;QACJ,CAAC;KACF,CAAC,CAAA;IAEF,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC9B,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;YAC9B,OAAO,IAAI,CAAA;QACb,CAAC;QACD,OAAO,mBAAmB,CAAC,cAAc,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAA;IAC5D,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,MAAM,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC,UAAU,CAAC,yBAAyB,CAAC,CAAA;IACnE,MAAM,6BAA6B,GACjC,CAAC,OAAO,IAAI,wBAAwB,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;YAE1B,6BAAK,SAAS,EAAC,kBAAkB;gBAC/B,oBAAC,cAAc,IACb,KAAK,EAAE,OAAO,CAAC,KAAK,EACpB,MAAM,EAAE,mBAAmB,KACvB,WAAW,EACf,SAAS,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,GACzB;gBACD,CAAC,OAAO,CAAC,QAAQ,IAAI,CACpB,oBAAC,iBAAiB,IAChB,OAAO,EAAC,sBAAsB,EAC9B,OAAO,EAAE,kBAAkB,EAC3B,IAAI,EAAC,YAAY,GACjB,CACH;gBACA,CAAC,CAAC,OAAO,CAAC,QAAQ,IAAI,CAAC,CAAC,IAAI,IAAI,CAC/B,6BAAK,SAAS,EAAC,SAAS;oBACtB,oBAAC,qBAAqB,IACpB,SAAS,EAAC,oEAAoE,EAC9E,IAAI,EAAE,IAAI,GACV,CACE,CACP;gBACD,oBAAC,YAAY,IACX,aAAa,QACb,KAAK,EAAE,KAAK,EACZ,iBAAiB,EAAE,iBAAiB,EACpC,kBAAkB,EAAE,OAAO,CAAC,YAAY,GACxC,CACE;YAEL,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,mBAAmB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { localisationService } from '@oneblink/apps'\nimport { FormTypes } from '@oneblink/types'\nimport { DateTimePicker } from '@mui/x-date-pickers'\n\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\n\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { parseDateValue } from '../services/generate-default-data'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useFormElementDateFromTo from '../hooks/useFormElementDateFromTo'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport useFormDatePickerProps, {\n PickerInputButton,\n} from '../hooks/form-date-picker/useFormDatePickerProps'\n\ntype Props = {\n id: string\n element: FormTypes.DateTimeElement\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementDateTime({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n\n const { fromDate, fromDaysOffset, toDate, toDaysOffset } =\n useFormElementDateFromTo(element)\n\n const shortDateTimeFormat =\n localisationService.getDateFnsFormats().shortDateTime\n\n const maxDate = React.useMemo(() => {\n return parseDateValue({\n dateOnly: true,\n daysOffset: toDaysOffset,\n value: toDate,\n })\n }, [toDate, toDaysOffset])\n\n const minDate = React.useMemo(() => {\n return parseDateValue({\n dateOnly: true,\n daysOffset: fromDaysOffset,\n value: fromDate,\n })\n }, [fromDate, fromDaysOffset])\n\n const [commonProps, openDateTimePicker] = useFormDatePickerProps({\n id,\n value: typeof value === 'string' ? value : undefined,\n maxDate,\n minDate,\n ariaDescribedby,\n placeholder: element.placeholderValue,\n className: 'cypress-date-time-control',\n disabled: element.readOnly,\n onBlur: setIsDirty,\n onChange: (newDate) => {\n onChange(element, {\n value: newDate?.toISOString(),\n })\n },\n })\n\n const text = React.useMemo(() => {\n if (typeof value !== 'string') {\n return null\n }\n return localisationService.formatDatetime(new Date(value))\n }, [value])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-datetime-element\">\n <FormElementLabelContainer\n className=\"ob-datetime\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <DateTimePicker\n label={element.label}\n format={shortDateTimeFormat}\n {...commonProps}\n timeSteps={{ minutes: 1 }}\n />\n {!element.readOnly && (\n <PickerInputButton\n tooltip=\"Select date and time\"\n onClick={openDateTimePicker}\n icon=\"date_range\"\n />\n )}\n {!!element.readOnly && !!text && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\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(FormElementDateTime)\n"]}
|
1
|
+
{"version":3,"file":"FormElementDateTime.js","sourceRoot":"","sources":["../../src/form-elements/FormElementDateTime.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { localisationService } from '@oneblink/apps'\nimport { FormTypes } from '@oneblink/types'\nimport { DateTimePicker } from '@mui/x-date-pickers'\n\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\n\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { parseDateValue } from '../services/generate-default-data'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useFormElementDateFromTo from '../hooks/useFormElementDateFromTo'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport useFormDatePickerProps, {\n PickerInputButton,\n} from '../hooks/form-date-picker/useFormDatePickerProps'\n\ntype Props = {\n id: string\n element: FormTypes.DateTimeElement\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementDateTime({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n\n const { fromDate, fromDaysOffset, toDate, toDaysOffset } =\n useFormElementDateFromTo(element)\n\n const shortDateTimeFormat =\n localisationService.getDateFnsFormats().shortDateTime\n\n const maxDate = React.useMemo(() => {\n return parseDateValue({\n dateOnly: true,\n daysOffset: toDaysOffset,\n value: toDate,\n })\n }, [toDate, toDaysOffset])\n\n const minDate = React.useMemo(() => {\n return parseDateValue({\n dateOnly: true,\n daysOffset: fromDaysOffset,\n value: fromDate,\n })\n }, [fromDate, fromDaysOffset])\n\n const [commonProps, openDateTimePicker] = useFormDatePickerProps({\n id,\n value: typeof value === 'string' ? value : undefined,\n maxDate,\n minDate,\n ariaDescribedby,\n placeholder: element.placeholderValue,\n className: 'cypress-date-time-control',\n disabled: element.readOnly,\n required: element.required,\n onBlur: setIsDirty,\n onChange: (newDate) => {\n onChange(element, {\n value: newDate?.toISOString(),\n })\n },\n })\n\n const text = React.useMemo(() => {\n if (typeof value !== 'string') {\n return null\n }\n return localisationService.formatDatetime(new Date(value))\n }, [value])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-datetime-element\">\n <FormElementLabelContainer\n className=\"ob-datetime\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <DateTimePicker\n label={element.label}\n format={shortDateTimeFormat}\n {...commonProps}\n timeSteps={{ minutes: 1 }}\n />\n {!element.readOnly && (\n <PickerInputButton\n tooltip=\"Select date and time\"\n onClick={openDateTimePicker}\n icon=\"date_range\"\n />\n )}\n {!!element.readOnly && !!text && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\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(FormElementDateTime)\n"]}
|
@@ -16,7 +16,7 @@ function FormElementEmail({ id, element, value, onChange, validationMessage, dis
|
|
16
16
|
React.createElement("div", { className: "control is-expanded has-icons-right" },
|
17
17
|
React.createElement("input", { type: "email", placeholder: element.placeholderValue, id: id, name: element.name, className: "input ob-input cypress-email-control", value: text, onChange: (e) => onChange(element, {
|
18
18
|
value: e.target.value || undefined,
|
19
|
-
}), required: element.required, disabled: element.readOnly, onBlur: setIsDirty, "aria-describedby": ariaDescribedby, autoComplete: autocompleteAttributes }),
|
19
|
+
}), required: element.required, disabled: element.readOnly, onBlur: setIsDirty, "aria-describedby": ariaDescribedby, autoComplete: autocompleteAttributes, "aria-required": element.required }),
|
20
20
|
React.createElement("span", { className: "ob-input-icon icon is-small is-right" },
|
21
21
|
React.createElement(MaterialIcon, { className: "is-size-5" }, "email"))),
|
22
22
|
!!element.readOnly && !!value && (React.createElement("div", { className: "control" },
|