@oneblink/apps-react 5.12.0-beta.9 → 5.12.1-beta.1
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 +9 -8
- package/dist/OneBlinkFormBase.js.map +1 -1
- package/dist/PaymentReceipt.js +2 -1
- package/dist/PaymentReceipt.js.map +1 -1
- package/dist/components/ArcGISWebMap.js +2 -1
- package/dist/components/ArcGISWebMap.js.map +1 -1
- package/dist/components/CopyToClipboardIconButton.js +2 -2
- package/dist/components/CopyToClipboardIconButton.js.map +1 -1
- package/dist/components/CustomAccordion.d.ts +1 -1
- package/dist/components/ErrorSnackbar.js +6 -8
- package/dist/components/ErrorSnackbar.js.map +1 -1
- package/dist/components/Lists.d.ts +1 -1
- package/dist/components/MaterialIcon.d.ts +3 -0
- package/dist/components/MaterialIcon.js +7 -0
- package/dist/components/MaterialIcon.js.map +1 -0
- package/dist/components/formStore/FormStoreTableProvider.js +3 -3
- package/dist/components/formStore/FormStoreTableProvider.js.map +1 -1
- package/dist/components/formStore/OneBlinkFormStoreClearFiltersButton.js +2 -2
- package/dist/components/formStore/OneBlinkFormStoreClearFiltersButton.js.map +1 -1
- package/dist/components/formStore/OneBlinkFormStoreColumnsButton.js +3 -3
- package/dist/components/formStore/OneBlinkFormStoreColumnsButton.js.map +1 -1
- package/dist/components/formStore/OneBlinkFormStoreDownloadButton.js +3 -3
- package/dist/components/formStore/OneBlinkFormStoreDownloadButton.js.map +1 -1
- package/dist/components/formStore/OneBlinkFormStoreRefreshButton.js +2 -2
- package/dist/components/formStore/OneBlinkFormStoreRefreshButton.js.map +1 -1
- package/dist/components/formStore/OneBlinkFormStoreTable.js +4 -4
- package/dist/components/formStore/OneBlinkFormStoreTable.js.map +1 -1
- package/dist/components/formStore/display/ElementDisplay.js +2 -2
- package/dist/components/formStore/display/ElementDisplay.js.map +1 -1
- package/dist/components/formStore/display/FormStoreIcon.d.ts +3 -2
- package/dist/components/formStore/display/FormStoreIcon.js +5 -2
- package/dist/components/formStore/display/FormStoreIcon.js.map +1 -1
- package/dist/components/formStore/table/ActionedByTableCell.js +4 -4
- package/dist/components/formStore/table/ActionedByTableCell.js.map +1 -1
- package/dist/components/formStore/table/FormElementTableCell.js +1 -1
- package/dist/components/formStore/table/FormElementTableCell.js.map +1 -1
- package/dist/components/formStore/table/HeaderCellMoreButton.js +5 -6
- package/dist/components/formStore/table/HeaderCellMoreButton.js.map +1 -1
- package/dist/components/formStore/table/RepeatableSetCellAccordion.js +2 -2
- package/dist/components/formStore/table/RepeatableSetCellAccordion.js.map +1 -1
- package/dist/components/messages/ErrorMessage.js +3 -5
- package/dist/components/messages/ErrorMessage.js.map +1 -1
- package/dist/components/messages/LargeIconMessage.d.ts +6 -4
- package/dist/components/messages/LargeIconMessage.js +1 -1
- package/dist/components/messages/LargeIconMessage.js.map +1 -1
- package/dist/components/payments/PaymentForm.js +2 -1
- package/dist/components/payments/PaymentForm.js.map +1 -1
- package/dist/components/payments/WestpacQuickStreamPaymentForm.js +2 -1
- package/dist/components/payments/WestpacQuickStreamPaymentForm.js.map +1 -1
- package/dist/components/receipts/ReceiptList.js +3 -2
- package/dist/components/receipts/ReceiptList.js.map +1 -1
- package/dist/components/receipts/ReceiptListItem.js +3 -2
- package/dist/components/receipts/ReceiptListItem.js.map +1 -1
- package/dist/components/renderer/AutocompleteDropdown.js +3 -2
- package/dist/components/renderer/AutocompleteDropdown.js.map +1 -1
- package/dist/components/renderer/CopyToClipboardButton.js +2 -1
- package/dist/components/renderer/CopyToClipboardButton.js.map +1 -1
- package/dist/components/renderer/CustomisableButtonInner.js +2 -1
- package/dist/components/renderer/CustomisableButtonInner.js.map +1 -1
- package/dist/components/renderer/FormElementLabelContainer.js +2 -1
- package/dist/components/renderer/FormElementLabelContainer.js.map +1 -1
- package/dist/components/renderer/LookupButton.js +2 -1
- package/dist/components/renderer/LookupButton.js.map +1 -1
- package/dist/components/renderer/LookupNotification.js +4 -3
- package/dist/components/renderer/LookupNotification.js.map +1 -1
- package/dist/components/renderer/attachments/AttachmentStatus.js +5 -4
- package/dist/components/renderer/attachments/AttachmentStatus.js.map +1 -1
- package/dist/components/renderer/attachments/DropdownMenu.js +2 -1
- package/dist/components/renderer/attachments/DropdownMenu.js.map +1 -1
- package/dist/components/renderer/attachments/FileCardContent.js +2 -1
- package/dist/components/renderer/attachments/FileCardContent.js.map +1 -1
- package/dist/components/renderer/attachments/ImagePreviewUnavailable.js +3 -2
- package/dist/components/renderer/attachments/ImagePreviewUnavailable.js.map +1 -1
- package/dist/form-elements/ComplianceButton.js +2 -1
- package/dist/form-elements/ComplianceButton.js.map +1 -1
- package/dist/form-elements/FormElementBarcodeScanner.js +2 -1
- package/dist/form-elements/FormElementBarcodeScanner.js.map +1 -1
- package/dist/form-elements/FormElementCalculation.js +2 -1
- package/dist/form-elements/FormElementCalculation.js.map +1 -1
- package/dist/form-elements/FormElementCamera.js +3 -2
- package/dist/form-elements/FormElementCamera.js.map +1 -1
- package/dist/form-elements/FormElementDate.js +2 -1
- package/dist/form-elements/FormElementDate.js.map +1 -1
- package/dist/form-elements/FormElementDateTime.js +2 -1
- package/dist/form-elements/FormElementDateTime.js.map +1 -1
- package/dist/form-elements/FormElementEmail.js +2 -1
- package/dist/form-elements/FormElementEmail.js.map +1 -1
- package/dist/form-elements/FormElementFiles.js +2 -1
- package/dist/form-elements/FormElementFiles.js.map +1 -1
- package/dist/form-elements/FormElementFreshdeskDependentField.js.map +1 -1
- package/dist/form-elements/FormElementNumber.js +2 -1
- package/dist/form-elements/FormElementNumber.js.map +1 -1
- package/dist/form-elements/FormElementRepeatableSet.js +5 -4
- package/dist/form-elements/FormElementRepeatableSet.js.map +1 -1
- package/dist/form-elements/FormElementSection.js +3 -2
- package/dist/form-elements/FormElementSection.js.map +1 -1
- package/dist/form-elements/FormElementTelephone.js +2 -1
- package/dist/form-elements/FormElementTelephone.js.map +1 -1
- package/dist/form-elements/FormElementTime.js +2 -1
- package/dist/form-elements/FormElementTime.js.map +1 -1
- package/dist/hooks/useDynamicOptionsLoaderState.d.ts +1 -1
- package/dist/hooks/useDynamicOptionsLoaderState.js +2 -1
- package/dist/hooks/useDynamicOptionsLoaderState.js.map +1 -1
- package/dist/hooks/useFormSubmissionState.d.ts +1 -1
- package/dist/hooks/useFormSubmissionState.js.map +1 -1
- package/dist/styles/icons.scss +13 -11
- package/dist/styles.css +4 -7
- package/dist/types/mui-color.d.ts +4 -0
- package/dist/types/mui-color.js +2 -0
- package/dist/types/mui-color.js.map +1 -0
- package/package.json +2 -3
|
@@ -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'\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 (!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 isLoadingImageUrl,\n imageUrl,\n loadImageUrlError,\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 imageUrl !== '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 = imageUrl\n },\n [clearIsAnnotating, element, imageUrl, 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 isLoadingImageUrl={isLoadingImageUrl}\n imageUrl={imageUrl}\n loadImageUrlError={loadImageUrlError}\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 <i className=\"material-icons\">cloud_download</i>\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 >\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 && imageUrl && (\n <AnnotationModal\n imageSrc={imageUrl}\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 isLoadingImageUrl,\n imageUrl,\n loadImageUrlError,\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\">\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 (loadImageUrlError) {\n return (\n <div className=\"figure-content\">\n <h3 className=\"title is-3\">Preview Failed</h3>\n <p>{loadImageUrlError.message}</p>\n </div>\n )\n }\n\n if (isLoadingImageUrl || 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 (imageUrl) {\n return (\n <>\n <span className=\"ob-figure__status\">\n <AttachmentStatus\n isLoadingImageUrl={isLoadingImageUrl}\n loadImageUrlError={loadImageUrlError}\n isUploading={isUploading}\n imageUrl={imageUrl}\n progress={progress}\n />\n </span>\n <img\n src={imageUrl}\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 <i className=\"material-icons\">brush</i>\n </span>\n </button>\n </>\n )\n }\n\n return (\n <div className=\"figure-content\">\n <ImagePreviewUnavailable />\n </div>\n )\n})\n"]}
|
|
1
|
+
{"version":3,"file":"FormElementCamera.js","sourceRoot":"","sources":["../../src/form-elements/FormElementCamera.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,eAAe,MAAM,0BAA0B,CAAA;AACtD,OAAO,kBAAkB,EAAE,EACzB,kBAAkB,GACnB,MAAM,2BAA2B,CAAA;AAClC,OAAO,SAAS,MAAM,kCAAkC,CAAA;AAExD,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AACxF,OAAO,qBAAqB,MAAM,mCAAmC,CAAA;AAErE,OAAO,aAAa,MAAM,oCAAoC,CAAA;AAC9D,OAAO,eAAe,MAAM,wCAAwC,CAAA;AACpE,OAAO,KAAK,MAAM,8BAA8B,CAAA;AAChD,OAAO,EACL,yBAAyB,EACzB,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,yBAAyB,CAAA;AAChC,OAAO,gBAAgB,MAAM,qDAAqD,CAAA;AAClF,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AACrE,OAAO,uBAAuB,MAAM,4DAA4D,CAAA;AAEhG,OAAO,WAAW,MAAM,gDAAgD,CAAA;AACxE,OAAO,yBAAyB,MAAM,oCAAoC,CAAA;AAC1E,OAAO,YAAY,MAAM,4BAA4B,CAAA;AAWrD,SAAS,iBAAiB,CAAC,EACzB,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,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAG1D;QACD,SAAS,EAAE,KAAK;KACjB,CAAC,CAAA;IACF,MAAM,CAAC,YAAY,EAAE,eAAe,EAAE,iBAAiB,CAAC,GACtD,eAAe,CAAC,KAAK,CAAC,CAAA;IACxB,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAmB,IAAI,CAAC,CAAA;IAEzD,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACxC,QAAQ,CAAC,OAAO,EAAE;YAChB,KAAK,EAAE,SAAS;SACjB,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAA;IAEvB,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAClC,KAAK,EAAE,WAAgD,EAAE,EAAE;QACzD,IAAI,CAAC,WAAW,CAAC,MAAM,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,EAAE;YACpD,OAAM;SACP;QAED,MAAM,IAAI,GAAG,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;QACxC,IAAI,CAAC,IAAI,EAAE;YACT,OAAM;SACP;QAED,QAAQ,CAAC;YACP,SAAS,EAAE,IAAI;SAChB,CAAC,CAAA;QAEF,OAAO,CAAC,GAAG,CAAC,qBAAqB,EAAE,IAAI,CAAC,CAAA;QACxC,IAAI;YACF,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;gBACzC,MAAM,IAAI,KAAK,CACb,sBAAsB,IAAI,CAAC,IAAI,4BAA4B,CAC5D,CAAA;aACF;YACD,MAAM,MAAM,GAAG,MAAM,sBAAsB,CACzC,IAAI,EACJ,OAAO,CAAC,yBAAyB,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,SAAS,CACtE,CAAA;YAED,IAAI,MAAM,YAAY,IAAI,EAAE;gBAC1B,QAAQ,CAAC,OAAO,EAAE;oBAChB,KAAK,EAAE,oBAAoB,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC;iBACxD,CAAC,CAAA;aACH;iBAAM;gBACL,MAAM,IAAI,GAAG,MAAM,YAAY,CAAC,MAAM,CAAC,CAAA;gBACvC,QAAQ,CAAC,OAAO,EAAE;oBAChB,KAAK,EAAE,oBAAoB,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC;iBACtD,CAAC,CAAA;aACH;YAED,UAAU,EAAE,CAAA;YACZ,QAAQ,CAAC;gBACP,SAAS,EAAE,KAAK;aACjB,CAAC,CAAA;SACH;QAAC,OAAO,KAAK,EAAE;YACd,QAAQ,CAAC;gBACP,SAAS,EAAE,KAAK;gBAChB,WAAW,EAAE,KAAc;aAC5B,CAAC,CAAA;SACH;IACH,CAAC,EACD,CAAC,OAAO,EAAE,QAAQ,EAAE,UAAU,CAAC,CAChC,CAAA;IACD,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACxC,IAAI,MAAM,CAAC,OAAO,IAAI,SAAS,CAAC,MAAM,IAAI,SAAS,CAAC,MAAM,CAAC,UAAU,EAAE;YACrE,QAAQ,CAAC;gBACP,SAAS,EAAE,IAAI;aAChB,CAAC,CAAA;YACF,SAAS,CAAC,MAAM,CAAC,UAAU,CACzB,CAAC,UAAkB,EAAE,EAAE;gBACrB,cAAc,CAAC,0BAA0B,UAAU,EAAE,CAAC;qBACnD,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE;oBACb,QAAQ,CAAC,OAAO,EAAE;wBAChB,KAAK,EAAE,oBAAoB,CAAC,IAAI,EAAE,YAAY,EAAE,OAAO,CAAC;qBACzD,CAAC,CAAA;oBACF,QAAQ,CAAC;wBACP,SAAS,EAAE,KAAK;qBACjB,CAAC,CAAA;gBACJ,CAAC,CAAC;qBACD,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;oBACf,QAAQ,CAAC;wBACP,WAAW,EAAE,KAAK;wBAClB,SAAS,EAAE,KAAK;qBACjB,CAAC,CAAA;gBACJ,CAAC,CAAC,CAAA;YACN,CAAC,EACD,CAAC,KAAY,EAAE,EAAE;gBACf,OAAO,CAAC,IAAI,CACV,oDAAoD,EACpD,KAAK,CACN,CAAA;gBACD,QAAQ,CAAC;oBACP,SAAS,EAAE,KAAK;oBAChB,WAAW,EAAE,KAAK;iBACnB,CAAC,CAAA;YACJ,CAAC,EACD;gBACE,OAAO,EAAE,GAAG;gBACZ,eAAe,EAAE,MAAM,CAAC,MAAM,CAAC,eAAe,CAAC,QAAQ;gBACvD,UAAU,EAAE,MAAM,CAAC,MAAM,CAAC,iBAAiB,CAAC,MAAM;gBAClD,SAAS,EAAE,KAAK;gBAChB,YAAY,EAAE,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI;gBAC7C,SAAS,EAAE,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,OAAO;gBAC1C,kBAAkB,EAAE,IAAI;gBACxB,gBAAgB,EAAE,KAAK;gBACvB,eAAe,EAAE,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI;aAC9C,CACF,CAAA;SACF;aAAM,IAAI,YAAY,CAAC,OAAO,EAAE;YAC/B,mFAAmF;YACnF,YAAY,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE,CAAA;YAC/B,YAAY,CAAC,OAAO,CAAC,KAAK,EAAE,CAAA;SAC7B;aAAM;YACL,OAAO,CAAC,KAAK,CACX,6DAA6D,CAC9D,CAAA;SACF;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAA;IAEvB,MAAM,EACJ,WAAW,EACX,kBAAkB,EAClB,iBAAiB,EACjB,QAAQ,EACR,iBAAiB,EACjB,WAAW,EACX,QAAQ,GACT,GAAG,aAAa,CACf,KAAK,EACL,OAAO,EACP,KAAK,CAAC,WAAW,CACf,CAAC,EAAE,EAAE,UAAU,EAAE,EAAE;QACjB,QAAQ,CAAC,OAAO,EAAE;YAChB,KAAK,EAAE,UAAU;SAClB,CAAC,CAAA;IACJ,CAAC,EACD,CAAC,OAAO,EAAE,QAAQ,CAAC,CACpB,CACF,CAAA;IAED,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACrC,IAAI,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ;YAAE,OAAM;QAE/C,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,IAAI,KAAK,CAAC,IAAI,EAAE;YACxC,OAAO,GAAG,EAAE;gBACV,QAAQ,CAAC,OAAO,EAAE;oBAChB,KAAK,EAAE;wBACL,IAAI,EAAE,KAAK;wBACX,GAAG,EAAE,KAAK,CAAC,GAAG;wBACd,IAAI,EAAE,KAAK,CAAC,IAAI;wBAChB,QAAQ,EAAE,KAAK,CAAC,QAAQ;wBACxB,SAAS,EAAE,KAAK,CAAC,SAAS;qBAC3B;iBACF,CAAC,CAAA;YACJ,CAAC,CAAA;SACF;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAA;IAE9B,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE;QAClD,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;YAC7B,MAAM,kBAAkB,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;SACpC;aAAM,IAAI,KAAK,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,EAAE;YAC1C,MAAM,kBAAkB,CAAC,KAAK,CAAC,CAAA;SAChC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAA;IAEf,MAAM,oBAAoB,GAAG,KAAK,CAAC,WAAW,CAC5C,CAAC,iBAAyB,EAAE,EAAE;QAC5B,iBAAiB,EAAE,CAAA;QAEnB,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;YAChC,OAAM;SACP;QAED,QAAQ,CAAC;YACP,SAAS,EAAE,IAAI;SAChB,CAAC,CAAA;QAEF,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAA;QAC/C,MAAM,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAA;QACnC,IAAI,CAAC,GAAG,EAAE;YACR,OAAM;SACP;QAED,MAAM,KAAK,GAAG,IAAI,KAAK,EAAE,CAAA;QACzB,KAAK,CAAC,MAAM,GAAG;YACb,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAA;YAC1B,MAAM,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM,CAAA;YAE5B,GAAG,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;YAE1B,MAAM,eAAe,GAAG,IAAI,KAAK,EAAE,CAAA;YACnC,eAAe,CAAC,MAAM,GAAG;gBACvB,GAAG,CAAC,SAAS,CAAC,eAAe,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,CAAA;gBAEjE,IAAI;oBACF,YAAY,CAAC,MAAM,CAAC;yBACjB,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE;wBACb,MAAM,UAAU,GAAG,oBAAoB,CACrC,IAAI,EACJ,WAAW,EACX,OAAO,CACR,CAAA;wBACD,QAAQ,CAAC,OAAO,EAAE;4BAChB,KAAK,EAAE,UAAU;yBAClB,CAAC,CAAA;wBACF,QAAQ,CAAC;4BACP,SAAS,EAAE,KAAK;yBACjB,CAAC,CAAA;oBACJ,CAAC,CAAC;yBACD,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;wBACf,QAAQ,CAAC;4BACP,WAAW,EAAE,KAAK;4BAClB,SAAS,EAAE,KAAK;yBACjB,CAAC,CAAA;oBACJ,CAAC,CAAC,CAAA;iBACL;gBAAC,OAAO,KAAK,EAAE;oBACd,QAAQ,CAAC;wBACP,WAAW,EAAE,KAAc;wBAC3B,SAAS,EAAE,KAAK;qBACjB,CAAC,CAAA;iBACH;YACH,CAAC,CAAA;YACD,eAAe,CAAC,GAAG,GAAG,iBAAiB,CAAA;QACzC,CAAC,CAAA;QACD,KAAK,CAAC,YAAY,CAAC,aAAa,EAAE,WAAW,CAAC,CAAA;QAC9C,KAAK,CAAC,GAAG,GAAG,QAAQ,CAAA;IACtB,CAAC,EACD,CAAC,iBAAiB,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,CAAC,CACjD,CAAA;IAED,MAAM,kBAAkB,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAA;IAC7D,OAAO,CACL;QACE,oBAAC,yBAAyB,IACxB,SAAS,EAAC,WAAW,EACrB,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAE1B,6BAAK,SAAS,EAAC,SAAS;gBACrB,CAAC,KAAK,IAAI,SAAS,CAAC,IAAI,CACvB;oBACE,gCAAQ,SAAS,EAAC,WAAW,EAAC,GAAG,EAAE,kBAAkB;wBACnD,oBAAC,YAAY,IACX,WAAW,EAAE,WAAW,EACxB,kBAAkB,EAAE,kBAAkB,EACtC,iBAAiB,EAAE,iBAAiB,EACpC,QAAQ,EAAE,QAAQ,EAClB,iBAAiB,EAAE,iBAAiB,EACpC,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,eAAe,EAC3B,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,GAClB;wBACF,oBAAC,WAAW,IAAC,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,GAAI,CACpD,CACR,CACJ;gBAED,+BACE,GAAG,EAAE,YAAY,EACjB,SAAS,EAAC,yDAAyD,EACnE,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,SAAS,EAChB,OAAO,EAAC,aAAa,EACrB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,UAAU,GACpB;gBACF,6BAAK,SAAS,EAAC,oBAAoB,IAChC,KAAK,CAAC,CAAC,CAAC,CACP;oBACG,kBAAkB,IAAI,WAAW,IAAI,CACpC,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,sEAAsE,EAChF,OAAO,EAAE,WAAW,YAGb,CACV;oBACD,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,iEAAiE,EAC3E,OAAO,EAAE,UAAU,EACnB,QAAQ,EAAE,OAAO,CAAC,QAAQ,IAAI,SAAS,YAGhC;oBACR,WAAW,IAAI,CACd,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,8EAA8E,EACxF,OAAO,EAAE,cAAc;wBAEvB,8BAAM,SAAS,EAAC,MAAM;4BACpB,oBAAC,YAAY,yBAA8B,CACtC;wBACP,mDAA2B,CACpB,CACV,CACA,CACJ,CAAC,CAAC,CAAC,CACF,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,iEAAiE,EAC3E,OAAO,EAAE,UAAU,EACnB,QAAQ,EAAE,OAAO,CAAC,QAAQ,IAAI,SAAS,sBACrB,eAAe,kBAG1B,CACV,CACG,CACF;YACL,CAAC,OAAO,IAAI,wBAAwB,CAAC,IAAI,CAAC,CAAC,iBAAiB,IAAI,CAC/D,6BAAK,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,kBAAkB;gBAC5C,6BAAK,SAAS,EAAC,2DAA2D,IACvE,iBAAiB,CACd,CACF,CACP,CACyB;QAE3B,YAAY,IAAI,QAAQ,IAAI,CAC3B,oBAAC,eAAe,IACd,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,iBAAiB,EAC1B,MAAM,EAAE,oBAAoB,GAC5B,CACH;QAEA,WAAW,IAAI,CACd,oBAAC,KAAK,IACJ,MAAM,QACN,KAAK,EAAC,WAAW,EACjB,SAAS,EAAC,qBAAqB,EAC/B,cAAc,EAAC,qBAAqB,EACpC,OAAO,EACL,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,wDAAwD,EAClE,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,EAC7C,SAAS,iBAGF;YAGX;;gBACmE,GAAG;gBACpE,sCAAW;wFAET;YAEJ,6BAAK,SAAS,EAAC,0BAA0B;gBACvC,wCAAa,WAAW,CAAC,QAAQ,EAAE,CAAc,CAC7C,CACA,CACT,CACA,CACJ,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAA;AAE5C,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,YAAY,CAAC,EACpD,kBAAkB,EAClB,WAAW,EACX,iBAAiB,EACjB,QAAQ,EACR,iBAAiB,EACjB,SAAS,EACT,OAAO,EACP,UAAU,EACV,QAAQ,GAMT;IACC,IAAI,kBAAkB,EAAE;QACtB,OAAO,CACL,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,4BAAI,SAAS,EAAC,YAAY,oBAAmB;YAC7C;;gBAC8C,uCAAY;;gBAAI,GAAG;gBAC/D,uCAAY;kCACV,CACA,CACP,CAAA;KACF;IAED,IAAI,iBAAiB,EAAE;QACrB,OAAO,CACL,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,4BAAI,SAAS,EAAC,YAAY,qBAAoB;YAC9C,+BAAI,iBAAiB,CAAC,OAAO,CAAK,CAC9B,CACP,CAAA;KACF;IAED,IAAI,iBAAiB,IAAI,SAAS,EAAE;QAClC,OAAO,CACL,6BAAK,SAAS,EAAC,+DAA+D;YAC5E,oBAAC,SAAS,IAAC,KAAK,SAAG,CACf,CACP,CAAA;KACF;IAED,IAAI,QAAQ,EAAE;QACZ,OAAO,CACL;YACE,8BAAM,SAAS,EAAC,mBAAmB;gBACjC,oBAAC,gBAAgB,IACf,iBAAiB,EAAE,iBAAiB,EACpC,iBAAiB,EAAE,iBAAiB,EACpC,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,GAClB,CACG;YACP,6BACE,GAAG,EAAE,QAAQ,EACb,SAAS,EAAC,qCAAqC,EAC/C,WAAW,EAAC,WAAW,EACvB,GAAG,EAAE,GAAG,OAAO,CAAC,KAAK,cAAc,GACnC;YACF,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,sEAAsE,EAChF,OAAO,EAAE,UAAU,EACnB,QAAQ,EAAE,OAAO,CAAC,QAAQ;gBAE1B,8BAAM,SAAS,EAAC,MAAM;oBACpB,oBAAC,YAAY,gBAAqB,CAC7B,CACA,CACR,CACJ,CAAA;KACF;IAED,OAAO,CACL,6BAAK,SAAS,EAAC,gBAAgB;QAC7B,oBAAC,uBAAuB,OAAG,CACvB,CACP,CAAA;AACH,CAAC,CAAC,CAAA","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 (!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 isLoadingImageUrl,\n imageUrl,\n loadImageUrlError,\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 imageUrl !== '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 = imageUrl\n },\n [clearIsAnnotating, element, imageUrl, 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 isLoadingImageUrl={isLoadingImageUrl}\n imageUrl={imageUrl}\n loadImageUrlError={loadImageUrlError}\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 >\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 && imageUrl && (\n <AnnotationModal\n imageSrc={imageUrl}\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 isLoadingImageUrl,\n imageUrl,\n loadImageUrlError,\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\">\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 (loadImageUrlError) {\n return (\n <div className=\"figure-content\">\n <h3 className=\"title is-3\">Preview Failed</h3>\n <p>{loadImageUrlError.message}</p>\n </div>\n )\n }\n\n if (isLoadingImageUrl || 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 (imageUrl) {\n return (\n <>\n <span className=\"ob-figure__status\">\n <AttachmentStatus\n isLoadingImageUrl={isLoadingImageUrl}\n loadImageUrlError={loadImageUrlError}\n isUploading={isUploading}\n imageUrl={imageUrl}\n progress={progress}\n />\n </span>\n <img\n src={imageUrl}\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\">\n <ImagePreviewUnavailable />\n </div>\n )\n})\n"]}
|
|
@@ -8,6 +8,7 @@ import { parseDateValue } from '../services/generate-default-data';
|
|
|
8
8
|
import useFormElementDateFromTo from '../hooks/useFormElementDateFromTo';
|
|
9
9
|
import { LookupNotificationContext } from '../hooks/useLookupNotification';
|
|
10
10
|
import useElementAriaDescribedby from '../hooks/useElementAriaDescribedby';
|
|
11
|
+
import MaterialIcon from '../components/MaterialIcon';
|
|
11
12
|
function FormElementDate({ id, element, value, onChange, validationMessage, displayValidationMessage, isDirty, setIsDirty, }) {
|
|
12
13
|
const ariaDescribedby = useElementAriaDescribedby(id, element);
|
|
13
14
|
const htmlDivElementRef = React.useRef(null);
|
|
@@ -62,7 +63,7 @@ function FormElementDate({ id, element, value, onChange, validationMessage, disp
|
|
|
62
63
|
React.createElement("div", { className: "control is-expanded has-icons-right" },
|
|
63
64
|
React.createElement("input", { id: id, name: element.name, placeholder: element.placeholderValue, disabled: element.readOnly, className: "input ob-input cypress-date-control", onBlur: onBlur, autoComplete: "off", "aria-describedby": ariaDescribedby }),
|
|
64
65
|
React.createElement("span", { className: "ob-input-icon icon is-small is-right" },
|
|
65
|
-
React.createElement(
|
|
66
|
+
React.createElement(MaterialIcon, { className: "is-size-5" }, "event"))),
|
|
66
67
|
!!element.readOnly && !!text && (React.createElement("div", { className: "control" },
|
|
67
68
|
React.createElement(CopyToClipboardButton, { className: "button is-input-addon copy-button cypress-copy-to-clipboard-button", text: text }))),
|
|
68
69
|
React.createElement(LookupButton, { isInputButton: true, value: value, validationMessage: validationMessage, lookupButtonConfig: element.lookupButton })),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormElementDate.js","sourceRoot":"","sources":["../../src/form-elements/FormElementDate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAEpD,OAAO,qBAAqB,MAAM,8CAA8C,CAAA;AAChF,OAAO,YAAkC,MAAM,uBAAuB,CAAA;AACtE,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;
|
|
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'\n\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport useFlatpickr, { FlatpickrOptions } from '../hooks/useFlatpickr'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\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 MaterialIcon from '../components/MaterialIcon'\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 const htmlDivElementRef = React.useRef<HTMLDivElement>(null)\n\n const { fromDate, fromDaysOffset, toDate, toDaysOffset } =\n useFormElementDateFromTo(element)\n\n const flatpickrOptions = React.useMemo(() => {\n const opts: FlatpickrOptions = {\n dateFormat: localisationService.getFlatpickrFormats().shortDate,\n allowInput: true,\n minDate: parseDateValue({\n dateOnly: false,\n daysOffset: fromDaysOffset,\n value: fromDate,\n }),\n maxDate: parseDateValue({\n dateOnly: false,\n daysOffset: toDaysOffset,\n value: toDate,\n }),\n defaultDate: undefined,\n allowInvalidPreload: true,\n onClose: setIsDirty,\n }\n\n return opts\n }, [fromDate, fromDaysOffset, setIsDirty, toDate, toDaysOffset])\n\n const handleChange = React.useCallback(\n (newValue: string | undefined) =>\n onChange(element, {\n value: newValue,\n }),\n [element, onChange],\n )\n\n const { onBlur } = useFlatpickr(\n {\n id,\n value,\n onChange: handleChange,\n dateOnly: true,\n },\n flatpickrOptions,\n htmlDivElementRef,\n )\n\n const text = React.useMemo(() => {\n if (typeof value === 'string') {\n const date = localisationService.generateDate({\n daysOffset: undefined,\n value,\n dateOnly: true,\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\" ref={htmlDivElementRef}>\n <FormElementLabelContainer\n className=\"ob-date\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n id={id}\n name={element.name}\n placeholder={element.placeholderValue}\n disabled={element.readOnly}\n className=\"input ob-input cypress-date-control\"\n onBlur={onBlur}\n autoComplete=\"off\"\n aria-describedby={ariaDescribedby}\n />\n\n <span className=\"ob-input-icon icon is-small is-right\">\n <MaterialIcon className=\"is-size-5\">event</MaterialIcon>\n </span>\n </div>\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"]}
|
|
@@ -8,6 +8,7 @@ import { parseDateValue } from '../services/generate-default-data';
|
|
|
8
8
|
import useFormElementDateFromTo from '../hooks/useFormElementDateFromTo';
|
|
9
9
|
import { LookupNotificationContext } from '../hooks/useLookupNotification';
|
|
10
10
|
import useElementAriaDescribedby from '../hooks/useElementAriaDescribedby';
|
|
11
|
+
import MaterialIcon from '../components/MaterialIcon';
|
|
11
12
|
function FormElementDateTime({ id, element, value, onChange, validationMessage, displayValidationMessage, isDirty, setIsDirty, }) {
|
|
12
13
|
const ariaDescribedby = useElementAriaDescribedby(id, element);
|
|
13
14
|
const htmlDivElementRef = React.useRef(null);
|
|
@@ -59,7 +60,7 @@ function FormElementDateTime({ id, element, value, onChange, validationMessage,
|
|
|
59
60
|
React.createElement("div", { className: "control is-expanded has-icons-right" },
|
|
60
61
|
React.createElement("input", { type: "datetime-local", id: id, name: element.name, placeholder: element.placeholderValue, disabled: element.readOnly, className: "input ob-input", "aria-describedby": ariaDescribedby }),
|
|
61
62
|
React.createElement("span", { className: "ob-input-icon icon is-small is-right" },
|
|
62
|
-
React.createElement(
|
|
63
|
+
React.createElement(MaterialIcon, { className: "is-size-5" }, "date_range"))),
|
|
63
64
|
!!element.readOnly && !!text && (React.createElement("div", { className: "control" },
|
|
64
65
|
React.createElement(CopyToClipboardButton, { className: "button is-input-addon copy-button cypress-copy-to-clipboard-button", text: text }))),
|
|
65
66
|
React.createElement(LookupButton, { isInputButton: true, value: value, validationMessage: validationMessage, lookupButtonConfig: element.lookupButton })),
|
|
@@ -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,qBAAqB,MAAM,8CAA8C,CAAA;AAChF,OAAO,YAAkC,MAAM,uBAAuB,CAAA;AACtE,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;
|
|
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'\n\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport useFlatpickr, { FlatpickrOptions } from '../hooks/useFlatpickr'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\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 MaterialIcon from '../components/MaterialIcon'\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 const htmlDivElementRef = React.useRef<HTMLDivElement>(null)\n\n const { fromDate, fromDaysOffset, toDate, toDaysOffset } =\n useFormElementDateFromTo(element)\n\n const flatpickrOptions = React.useMemo(() => {\n const opts: FlatpickrOptions = {\n altInput: true,\n dateFormat: 'Y-m-dTH:i:S',\n altFormat: localisationService.getFlatpickrFormats().shortDateTime,\n allowInput: false,\n altInputClass: 'input ob-input cypress-date-time-control',\n minDate: parseDateValue({\n dateOnly: false,\n daysOffset: fromDaysOffset,\n value: fromDate,\n }),\n maxDate: parseDateValue({\n dateOnly: false,\n daysOffset: toDaysOffset,\n value: toDate,\n }),\n defaultDate: undefined,\n enableTime: true,\n allowInvalidPreload: true,\n onClose: setIsDirty,\n }\n\n return opts\n }, [fromDate, fromDaysOffset, setIsDirty, toDate, toDaysOffset])\n\n const handleChange = React.useCallback(\n (newValue: string | undefined) =>\n onChange(element, {\n value: newValue,\n }),\n [element, onChange],\n )\n\n useFlatpickr(\n {\n id,\n value,\n onChange: handleChange,\n label: element.label,\n },\n flatpickrOptions,\n htmlDivElementRef,\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\" ref={htmlDivElementRef}>\n <FormElementLabelContainer\n className=\"ob-datetime\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"datetime-local\"\n id={id}\n name={element.name}\n placeholder={element.placeholderValue}\n disabled={element.readOnly}\n className=\"input ob-input\"\n aria-describedby={ariaDescribedby}\n />\n <span className=\"ob-input-icon icon is-small is-right\">\n <MaterialIcon className=\"is-size-5\">date_range</MaterialIcon>\n </span>\n </div>\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"]}
|
|
@@ -4,6 +4,7 @@ import LookupButton from '../components/renderer/LookupButton';
|
|
|
4
4
|
import FormElementLabelContainer from '../components/renderer/FormElementLabelContainer';
|
|
5
5
|
import { LookupNotificationContext } from '../hooks/useLookupNotification';
|
|
6
6
|
import useElementAriaDescribedby from '../hooks/useElementAriaDescribedby';
|
|
7
|
+
import MaterialIcon from '../components/MaterialIcon';
|
|
7
8
|
function FormElementEmail({ id, element, value, onChange, validationMessage, displayValidationMessage, isDirty, setIsDirty, }) {
|
|
8
9
|
const ariaDescribedby = useElementAriaDescribedby(id, element);
|
|
9
10
|
const { isLookingUp } = React.useContext(LookupNotificationContext);
|
|
@@ -17,7 +18,7 @@ function FormElementEmail({ id, element, value, onChange, validationMessage, dis
|
|
|
17
18
|
value: e.target.value || undefined,
|
|
18
19
|
}), required: element.required, disabled: element.readOnly, onBlur: setIsDirty, "aria-describedby": ariaDescribedby }),
|
|
19
20
|
React.createElement("span", { className: "ob-input-icon icon is-small is-right" },
|
|
20
|
-
React.createElement(
|
|
21
|
+
React.createElement(MaterialIcon, { className: "is-size-5" }, "email"))),
|
|
21
22
|
!!element.readOnly && !!value && (React.createElement("div", { className: "control" },
|
|
22
23
|
React.createElement(CopyToClipboardButton, { className: "button is-input-addon copy-button cypress-copy-to-clipboard-button", text: text }))),
|
|
23
24
|
React.createElement(LookupButton, { isInputButton: true, value: value, validationMessage: validationMessage, lookupButtonConfig: element.lookupButton })),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormElementEmail.js","sourceRoot":"","sources":["../../src/form-elements/FormElementEmail.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,qBAAqB,MAAM,8CAA8C,CAAA;AAChF,OAAO,YAAY,MAAM,qCAAqC,CAAA;AAE9D,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AAExF,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAA;AAC1E,OAAO,yBAAyB,MAAM,oCAAoC,CAAA;
|
|
1
|
+
{"version":3,"file":"FormElementEmail.js","sourceRoot":"","sources":["../../src/form-elements/FormElementEmail.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,qBAAqB,MAAM,8CAA8C,CAAA;AAChF,OAAO,YAAY,MAAM,qCAAqC,CAAA;AAE9D,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AAExF,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAA;AAC1E,OAAO,yBAAyB,MAAM,oCAAoC,CAAA;AAC1E,OAAO,YAAY,MAAM,4BAA4B,CAAA;AAWrD,SAAS,gBAAgB,CAAC,EACxB,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,MAAM,IAAI,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA;IACnD,OAAO,CACL,6BAAK,SAAS,EAAC,uBAAuB;QACpC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,UAAU,EACpB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAE1B,6BAAK,SAAS,EAAC,kBAAkB;gBAC/B,6BAAK,SAAS,EAAC,qCAAqC;oBAClD,+BACE,IAAI,EAAC,OAAO,EACZ,WAAW,EAAE,OAAO,CAAC,gBAAgB,EACrC,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,SAAS,EAAC,sCAAsC,EAChD,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CACd,QAAQ,CAAC,OAAO,EAAE;4BAChB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,SAAS;yBACnC,CAAC,EAEJ,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,MAAM,EAAE,UAAU,sBACA,eAAe,GACjC;oBACF,8BAAM,SAAS,EAAC,sCAAsC;wBACpD,oBAAC,YAAY,IAAC,SAAS,EAAC,WAAW,YAAqB,CACnD,CACH;gBACL,CAAC,CAAC,OAAO,CAAC,QAAQ,IAAI,CAAC,CAAC,KAAK,IAAI,CAChC,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,gBAAgB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\n\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport MaterialIcon from '../components/MaterialIcon'\n\ntype Props = {\n id: string\n element: FormTypes.EmailElement\n value: unknown\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementEmail({\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 const text = typeof value === 'string' ? value : ''\n return (\n <div className=\"cypress-email-element\">\n <FormElementLabelContainer\n className=\"ob-email\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"email\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-email-control\"\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 />\n <span className=\"ob-input-icon icon is-small is-right\">\n <MaterialIcon className=\"is-size-5\">email</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 {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(FormElementEmail)\n"]}
|
|
@@ -5,6 +5,7 @@ import useAttachments from '../hooks/attachments/useAttachments';
|
|
|
5
5
|
import { checkFileNameIsValid, checkFileNameExtensionIsValid, } from '../services/form-validation';
|
|
6
6
|
import { LookupNotificationContext } from '../hooks/useLookupNotification';
|
|
7
7
|
import useElementAriaDescribedby from '../hooks/useElementAriaDescribedby';
|
|
8
|
+
import MaterialIcon from '../components/MaterialIcon';
|
|
8
9
|
export function stringifyAttachments(value) {
|
|
9
10
|
if (value === null || value === void 0 ? void 0 : value.every((attachment) => !attachment.type)) {
|
|
10
11
|
return JSON.stringify(value);
|
|
@@ -40,7 +41,7 @@ function FormElementFiles({ id, element, value, onChange, validationMessage, dis
|
|
|
40
41
|
(!element.maxEntries ||
|
|
41
42
|
attachments.length < element.maxEntries) && (React.createElement("div", { className: "column is-one-quarter-ob" },
|
|
42
43
|
React.createElement("button", { type: "button", className: "button ob-files__add-new-button", onClick: handleAdd, "aria-describedby": ariaDescribedby },
|
|
43
|
-
React.createElement(
|
|
44
|
+
React.createElement(MaterialIcon, { className: "icon-x-large" }, "add")))))),
|
|
44
45
|
isDisplayingValidationMessage && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
|
|
45
46
|
React.createElement("div", { className: "has-text-danger ob-error__text cypress-validation-message" }, validationMessage))))));
|
|
46
47
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormElementFiles.js","sourceRoot":"","sources":["../../src/form-elements/FormElementFiles.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AACxF,OAAO,eAAe,MAAM,mBAAmB,CAAA;AAC/C,OAAO,cAAc,MAAM,qCAAqC,CAAA;AAChE,OAAO,EACL,oBAAoB,EACpB,6BAA6B,GAC9B,MAAM,6BAA6B,CAAA;AAGpC,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAA;AAC1E,OAAO,yBAAyB,MAAM,oCAAoC,CAAA;
|
|
1
|
+
{"version":3,"file":"FormElementFiles.js","sourceRoot":"","sources":["../../src/form-elements/FormElementFiles.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport FormElementFile from './FormElementFile'\nimport useAttachments from '../hooks/attachments/useAttachments'\nimport {\n checkFileNameIsValid,\n checkFileNameExtensionIsValid,\n} from '../services/form-validation'\nimport { attachmentsService } from '@oneblink/apps'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport MaterialIcon from '../components/MaterialIcon'\n\nexport function stringifyAttachments(\n value: attachmentsService.Attachment[] | undefined,\n): string {\n if (value?.every((attachment) => !attachment.type)) {\n return JSON.stringify(value)\n }\n return ''\n}\n\nfunction FormElementFiles({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: {\n id: string\n element: FormTypes.FilesElement\n value?: attachmentsService.Attachment[]\n onChange: FormElementValueChangeHandler<attachmentsService.Attachment[]>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps) {\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n const { addAttachments, removeAttachment, changeAttachment } = useAttachments(\n element,\n onChange,\n setIsDirty,\n )\n\n const inputRef = React.useRef<HTMLInputElement>(null)\n\n const handleAdd = React.useCallback(() => {\n if (!inputRef.current) return\n // RESET HTML FILE INPUT VALUE SO FILES PREVIOUSLY ADDED AND REMOVED ARE RECOGNISED\n inputRef.current.value = ''\n inputRef.current.click()\n }, [])\n\n const attachments = value || []\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-files-element\">\n <FormElementLabelContainer\n className=\"ob-files\"\n element={element}\n id={id}\n required={!!element.minEntries}\n >\n <input\n ref={inputRef}\n type=\"file\"\n name={element.name}\n id={id}\n className=\"file-input ob-input\"\n multiple={element.maxEntries !== 1}\n disabled={element.readOnly}\n onChange={(event) =>\n addAttachments(\n event.target.files ? Array.from(event.target.files) : [],\n )\n }\n />\n <div className=\"control cypress-files-control\">\n <div className=\"columns is-multiline ob-columns-container\">\n {attachments.map((attachment, index) => {\n return (\n <FormElementFile\n key={attachment.type ? attachment._id : attachment.id}\n element={element}\n onRemove={removeAttachment}\n file={attachment}\n onChange={changeAttachment}\n disableUpload={\n (!!element.maxEntries &&\n attachments.length > element.maxEntries) ||\n !checkFileNameIsValid(element, attachment.fileName) ||\n !checkFileNameExtensionIsValid(element, attachment.fileName)\n }\n index={index}\n />\n )\n })}\n {!element.readOnly &&\n (!element.maxEntries ||\n attachments.length < element.maxEntries) && (\n <div className=\"column is-one-quarter-ob\">\n <button\n type=\"button\"\n className=\"button ob-files__add-new-button\"\n onClick={handleAdd}\n aria-describedby={ariaDescribedby}\n >\n <MaterialIcon className=\"icon-x-large\">add</MaterialIcon>\n </button>\n </div>\n )}\n </div>\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(FormElementFiles)\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormElementFreshdeskDependentField.js","sourceRoot":"","sources":["../../src/form-elements/FormElementFreshdeskDependentField.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementForm, { Props } from './FormElementForm'\nimport generateFreshdeskDependentFieldElements, {\n getNestedOptions,\n} from '../services/generateFreshdeskDependentFieldElements'\nimport { UpdateFormElementsHandler } from '../
|
|
1
|
+
{"version":3,"file":"FormElementFreshdeskDependentField.js","sourceRoot":"","sources":["../../src/form-elements/FormElementFreshdeskDependentField.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementForm, { Props } from './FormElementForm'\nimport generateFreshdeskDependentFieldElements, {\n getNestedOptions,\n} from '../services/generateFreshdeskDependentFieldElements'\nimport { UpdateFormElementsHandler } from '../types/form'\nimport { typeCastService } from '@oneblink/sdk-core'\n\nfunction FormElementFreshdeskDependentField({\n element,\n onUpdateFormElements,\n ...props\n}: Omit<Props, 'element'> & {\n element: FormTypes.FreshdeskDependentFieldElement\n}) {\n const freshdeskElements = React.useMemo(\n () => generateFreshdeskDependentFieldElements(element),\n [element],\n )\n\n const formFormElement = React.useMemo<FormTypes.FormFormElement>(() => {\n const [categoryElement, subcategoryElement, itemElement] = freshdeskElements\n const elements = [categoryElement]\n const value = props.value as\n | FormTypes.FreshdeskDependentFieldElementValue\n | undefined\n\n if (props.value?.category) {\n const subCategoryOptions = getNestedOptions(\n element.options,\n value?.category,\n )\n subcategoryElement.options = subCategoryOptions\n elements.push(subcategoryElement)\n\n if (value?.subCategory) {\n const itemOptions = getNestedOptions(\n subCategoryOptions,\n value?.subCategory,\n )\n itemElement.options = itemOptions\n elements.push(itemElement)\n }\n }\n\n return {\n ...element,\n type: 'form',\n formId: NaN,\n elements,\n }\n }, [element, props.value, freshdeskElements])\n\n const handleUpdateNestedFormElements =\n React.useCallback<UpdateFormElementsHandler>(\n (setter) => {\n const [newFormFormElement] = setter([formFormElement])\n if (\n newFormFormElement.type !== 'form' ||\n !Array.isArray(newFormFormElement.elements) ||\n !newFormFormElement.elements[0]\n ) {\n return\n }\n const categoryElementWithOptions =\n typeCastService.formElements.toOptionsElement(\n newFormFormElement.elements[0],\n )\n if (!categoryElementWithOptions?.options) {\n return\n }\n\n onUpdateFormElements((formElements) => {\n return formElements.map((formElement) => {\n if (formElement.id === element.id) {\n return {\n ...formElement,\n options: categoryElementWithOptions.options,\n }\n }\n return formElement\n })\n })\n },\n [element.id, formFormElement, onUpdateFormElements],\n )\n\n return (\n <FormElementForm\n element={formFormElement}\n onUpdateFormElements={handleUpdateNestedFormElements}\n {...props}\n />\n )\n}\n\nexport default React.memo(FormElementFreshdeskDependentField)\n"]}
|
|
@@ -6,6 +6,7 @@ import FormElementLabelContainer from '../components/renderer/FormElementLabelCo
|
|
|
6
6
|
import useIsPageVisible from '../hooks/useIsPageVisible';
|
|
7
7
|
import { LookupNotificationContext } from '../hooks/useLookupNotification';
|
|
8
8
|
import useElementAriaDescribedby from '../hooks/useElementAriaDescribedby';
|
|
9
|
+
import MaterialIcon from '../components/MaterialIcon';
|
|
9
10
|
function FormElementNumber({ id, element, value, onChange, validationMessage, displayValidationMessage, isDirty, setIsDirty, }) {
|
|
10
11
|
const ariaDescribedby = useElementAriaDescribedby(id, element);
|
|
11
12
|
const isPageVisible = useIsPageVisible();
|
|
@@ -37,7 +38,7 @@ function FormElementNumber({ id, element, value, onChange, validationMessage, di
|
|
|
37
38
|
React.createElement("div", { className: "control is-expanded has-icons-right" },
|
|
38
39
|
React.createElement("input", { type: "number", placeholder: element.placeholderValue, id: id, value: typeof value === 'number' ? value : '', name: element.name, className: "input ob-input cypress-number-control", onChange: handleChange, required: element.required, disabled: element.readOnly, onBlur: setIsDirty, ref: htmlInputElementRef, onWheel: handleWheel, "aria-describedby": ariaDescribedby }),
|
|
39
40
|
React.createElement("span", { className: "ob-input-icon icon is-small is-right" },
|
|
40
|
-
React.createElement(
|
|
41
|
+
React.createElement(MaterialIcon, { className: "is-size-5" }, "tag"))),
|
|
41
42
|
!!element.readOnly && !!text && (React.createElement("div", { className: "control" },
|
|
42
43
|
React.createElement(CopyToClipboardButton, { className: "button is-input-addon copy-button cypress-copy-to-clipboard-button", text: text }))),
|
|
43
44
|
React.createElement(LookupButton, { isInputButton: true, value: value, validationMessage: validationMessage, lookupButtonConfig: element.lookupButton }))) : isPageVisible ? (React.createElement(SliderControl, { id: id, text: text, value: value, element: element, onChange: handleChange, onBlur: setIsDirty })) : undefined,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormElementNumber.js","sourceRoot":"","sources":["../../src/form-elements/FormElementNumber.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport _debounce from 'lodash.debounce'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useIsPageVisible from '../hooks/useIsPageVisible'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\n\ntype Props = {\n id: string\n element: FormTypes.NumberElement\n value: unknown\n onChange: FormElementValueChangeHandler<number>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementNumber({\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 isPageVisible = useIsPageVisible()\n\n const text = React.useMemo(\n () => (typeof value === 'number' ? value.toString() : ''),\n [value],\n )\n const handleChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = parseFloat(event.target.value)\n onChange(element, {\n value: isNaN(newValue) ? undefined : newValue,\n })\n },\n [element, onChange],\n )\n const htmlInputElementRef = React.useRef<HTMLInputElement>(null)\n\n //this onWheel callback prevents numbers changing while scrolling\n const handleWheel = React.useCallback(() => {\n if (htmlInputElementRef.current !== document.activeElement) {\n return\n }\n htmlInputElementRef.current?.blur()\n setTimeout(() => {\n htmlInputElementRef.current?.focus()\n })\n }, [])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-number-element\">\n <FormElementLabelContainer\n className=\"ob-number\"\n id={id}\n element={element}\n required={element.required}\n >\n {!element.isSlider ? (\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"number\"\n placeholder={element.placeholderValue}\n id={id}\n value={typeof value === 'number' ? value : ''}\n name={element.name}\n className=\"input ob-input cypress-number-control\"\n onChange={handleChange}\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n ref={htmlInputElementRef}\n onWheel={handleWheel}\n aria-describedby={ariaDescribedby}\n />\n <span className=\"ob-input-icon icon is-small is-right\">\n <i className=\"material-icons is-size-5\">tag</i>\n </span>\n </div>\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 ) : isPageVisible ? (\n <SliderControl\n id={id}\n text={text}\n value={value}\n element={element}\n onChange={handleChange}\n onBlur={setIsDirty}\n />\n ) : undefined}\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\nconst sliderBubbleWidthInPixels = 24\n\nconst SliderControl = React.memo(function SliderControl({\n id,\n text,\n value,\n element,\n onChange,\n onBlur,\n}: {\n id: string\n text: string\n value: unknown\n element: FormTypes.NumberElement\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => unknown\n onBlur: () => void\n}) {\n const sliderOutputRef = React.useRef<HTMLOutputElement>(null)\n const sliderInputRef = React.useRef<HTMLInputElement>(null)\n\n const number = React.useMemo(\n () => (typeof value === 'number' ? value : parseFloat(value as string)),\n [value],\n )\n\n const removeIsDraggingClass = React.useMemo(\n () =>\n _debounce((outputElement: HTMLOutputElement) => {\n if (outputElement.classList.contains('is-dragging')) {\n outputElement.classList.remove('is-dragging')\n }\n }, 500),\n [],\n )\n\n React.useEffect(() => {\n if (\n Number.isNaN(number) ||\n typeof element.maxNumber !== 'number' ||\n typeof element.minNumber !== 'number'\n ) {\n return\n }\n\n const outputElement = sliderOutputRef.current\n const inputElement = sliderInputRef.current\n if (outputElement && inputElement) {\n const range = element.maxNumber - element.minNumber\n const percentage = (number - element.minNumber) / range\n const inputWidth = inputElement.getBoundingClientRect().width\n const outputWidth = outputElement.getBoundingClientRect().width\n const sliderBubbleOffSetPixels =\n (percentage - 0.5) * -sliderBubbleWidthInPixels\n\n outputElement.style.left = `${percentage * inputWidth}px`\n outputElement.style.marginLeft = `-${\n outputWidth / 2 - sliderBubbleOffSetPixels\n }px`\n\n if (!outputElement.classList.contains('is-dragging')) {\n outputElement.classList.add('is-dragging')\n }\n removeIsDraggingClass(outputElement)\n }\n }, [element.maxNumber, element.minNumber, number, removeIsDraggingClass])\n\n return (\n <div className=\"control\">\n <output\n ref={sliderOutputRef}\n className=\"ob-number__output cypress-number-output\"\n htmlFor={id}\n >\n {text}\n </output>\n <input\n ref={sliderInputRef}\n id={id}\n name={element.name}\n className=\"slider ob-input is-fullwidth cypress-slider-number-control is-large is-circle cypress-number-control\"\n step={element.sliderIncrement ? element.sliderIncrement : 1}\n min={element.minNumber}\n max={element.maxNumber}\n value={text}\n type=\"range\"\n onChange={onChange}\n required={element.required}\n disabled={element.readOnly}\n onBlur={onBlur}\n />\n </div>\n )\n})\n\nexport default React.memo(FormElementNumber)\n"]}
|
|
1
|
+
{"version":3,"file":"FormElementNumber.js","sourceRoot":"","sources":["../../src/form-elements/FormElementNumber.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,qBAAqB,MAAM,8CAA8C,CAAA;AAChF,OAAO,SAAS,MAAM,iBAAiB,CAAA;AACvC,OAAO,YAAY,MAAM,qCAAqC,CAAA;AAE9D,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AAExF,OAAO,gBAAgB,MAAM,2BAA2B,CAAA;AACxD,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAA;AAC1E,OAAO,yBAAyB,MAAM,oCAAoC,CAAA;AAC1E,OAAO,YAAY,MAAM,4BAA4B,CAAA;AAWrD,SAAS,iBAAiB,CAAC,EACzB,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,aAAa,GAAG,gBAAgB,EAAE,CAAA;IAExC,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CACxB,GAAG,EAAE,CAAC,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACzD,CAAC,KAAK,CAAC,CACR,CAAA;IACD,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CACpC,CAAC,KAA0C,EAAE,EAAE;QAC7C,MAAM,QAAQ,GAAG,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;QAC/C,QAAQ,CAAC,OAAO,EAAE;YAChB,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ;SAC9C,CAAC,CAAA;IACJ,CAAC,EACD,CAAC,OAAO,EAAE,QAAQ,CAAC,CACpB,CAAA;IACD,MAAM,mBAAmB,GAAG,KAAK,CAAC,MAAM,CAAmB,IAAI,CAAC,CAAA;IAEhE,iEAAiE;IACjE,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;;QACzC,IAAI,mBAAmB,CAAC,OAAO,KAAK,QAAQ,CAAC,aAAa,EAAE;YAC1D,OAAM;SACP;QACD,MAAA,mBAAmB,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAA;QACnC,UAAU,CAAC,GAAG,EAAE;;YACd,MAAA,mBAAmB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAA;QACtC,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,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,wBAAwB;QACrC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,WAAW,EACrB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAEzB,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CACnB,6BAAK,SAAS,EAAC,kBAAkB;gBAC/B,6BAAK,SAAS,EAAC,qCAAqC;oBAClD,+BACE,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE,OAAO,CAAC,gBAAgB,EACrC,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAC7C,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,SAAS,EAAC,uCAAuC,EACjD,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,MAAM,EAAE,UAAU,EAClB,GAAG,EAAE,mBAAmB,EACxB,OAAO,EAAE,WAAW,sBACF,eAAe,GACjC;oBACF,8BAAM,SAAS,EAAC,sCAAsC;wBACpD,oBAAC,YAAY,IAAC,SAAS,EAAC,WAAW,UAAmB,CACjD,CACH;gBACL,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,CACP,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,CAClB,oBAAC,aAAa,IACZ,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,YAAY,EACtB,MAAM,EAAE,UAAU,GAClB,CACH,CAAC,CAAC,CAAC,SAAS;YAEZ,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,MAAM,yBAAyB,GAAG,EAAE,CAAA;AAEpC,MAAM,aAAa,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,aAAa,CAAC,EACtD,EAAE,EACF,IAAI,EACJ,KAAK,EACL,OAAO,EACP,QAAQ,EACR,MAAM,GAQP;IACC,MAAM,eAAe,GAAG,KAAK,CAAC,MAAM,CAAoB,IAAI,CAAC,CAAA;IAC7D,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,CAAmB,IAAI,CAAC,CAAA;IAE3D,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAC1B,GAAG,EAAE,CAAC,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,KAAe,CAAC,CAAC,EACvE,CAAC,KAAK,CAAC,CACR,CAAA;IAED,MAAM,qBAAqB,GAAG,KAAK,CAAC,OAAO,CACzC,GAAG,EAAE,CACH,SAAS,CAAC,CAAC,aAAgC,EAAE,EAAE;QAC7C,IAAI,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE;YACnD,aAAa,CAAC,SAAS,CAAC,MAAM,CAAC,aAAa,CAAC,CAAA;SAC9C;IACH,CAAC,EAAE,GAAG,CAAC,EACT,EAAE,CACH,CAAA;IAED,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IACE,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC;YACpB,OAAO,OAAO,CAAC,SAAS,KAAK,QAAQ;YACrC,OAAO,OAAO,CAAC,SAAS,KAAK,QAAQ,EACrC;YACA,OAAM;SACP;QAED,MAAM,aAAa,GAAG,eAAe,CAAC,OAAO,CAAA;QAC7C,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,CAAA;QAC3C,IAAI,aAAa,IAAI,YAAY,EAAE;YACjC,MAAM,KAAK,GAAG,OAAO,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAA;YACnD,MAAM,UAAU,GAAG,CAAC,MAAM,GAAG,OAAO,CAAC,SAAS,CAAC,GAAG,KAAK,CAAA;YACvD,MAAM,UAAU,GAAG,YAAY,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAA;YAC7D,MAAM,WAAW,GAAG,aAAa,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAA;YAC/D,MAAM,wBAAwB,GAC5B,CAAC,UAAU,GAAG,GAAG,CAAC,GAAG,CAAC,yBAAyB,CAAA;YAEjD,aAAa,CAAC,KAAK,CAAC,IAAI,GAAG,GAAG,UAAU,GAAG,UAAU,IAAI,CAAA;YACzD,aAAa,CAAC,KAAK,CAAC,UAAU,GAAG,IAC/B,WAAW,GAAG,CAAC,GAAG,wBACpB,IAAI,CAAA;YAEJ,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE;gBACpD,aAAa,CAAC,SAAS,CAAC,GAAG,CAAC,aAAa,CAAC,CAAA;aAC3C;YACD,qBAAqB,CAAC,aAAa,CAAC,CAAA;SACrC;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,SAAS,EAAE,MAAM,EAAE,qBAAqB,CAAC,CAAC,CAAA;IAEzE,OAAO,CACL,6BAAK,SAAS,EAAC,SAAS;QACtB,gCACE,GAAG,EAAE,eAAe,EACpB,SAAS,EAAC,yCAAyC,EACnD,OAAO,EAAE,EAAE,IAEV,IAAI,CACE;QACT,+BACE,GAAG,EAAE,cAAc,EACnB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,SAAS,EAAC,sGAAsG,EAChH,IAAI,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC,CAAC,OAAO,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,EAC3D,GAAG,EAAE,OAAO,CAAC,SAAS,EACtB,GAAG,EAAE,OAAO,CAAC,SAAS,EACtB,KAAK,EAAE,IAAI,EACX,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,MAAM,EAAE,MAAM,GACd,CACE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport _debounce from 'lodash.debounce'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useIsPageVisible from '../hooks/useIsPageVisible'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport MaterialIcon from '../components/MaterialIcon'\n\ntype Props = {\n id: string\n element: FormTypes.NumberElement\n value: unknown\n onChange: FormElementValueChangeHandler<number>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\nfunction FormElementNumber({\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 isPageVisible = useIsPageVisible()\n\n const text = React.useMemo(\n () => (typeof value === 'number' ? value.toString() : ''),\n [value],\n )\n const handleChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = parseFloat(event.target.value)\n onChange(element, {\n value: isNaN(newValue) ? undefined : newValue,\n })\n },\n [element, onChange],\n )\n const htmlInputElementRef = React.useRef<HTMLInputElement>(null)\n\n //this onWheel callback prevents numbers changing while scrolling\n const handleWheel = React.useCallback(() => {\n if (htmlInputElementRef.current !== document.activeElement) {\n return\n }\n htmlInputElementRef.current?.blur()\n setTimeout(() => {\n htmlInputElementRef.current?.focus()\n })\n }, [])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n return (\n <div className=\"cypress-number-element\">\n <FormElementLabelContainer\n className=\"ob-number\"\n id={id}\n element={element}\n required={element.required}\n >\n {!element.isSlider ? (\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"number\"\n placeholder={element.placeholderValue}\n id={id}\n value={typeof value === 'number' ? value : ''}\n name={element.name}\n className=\"input ob-input cypress-number-control\"\n onChange={handleChange}\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n ref={htmlInputElementRef}\n onWheel={handleWheel}\n aria-describedby={ariaDescribedby}\n />\n <span className=\"ob-input-icon icon is-small is-right\">\n <MaterialIcon className=\"is-size-5\">tag</MaterialIcon>\n </span>\n </div>\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 ) : isPageVisible ? (\n <SliderControl\n id={id}\n text={text}\n value={value}\n element={element}\n onChange={handleChange}\n onBlur={setIsDirty}\n />\n ) : undefined}\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\nconst sliderBubbleWidthInPixels = 24\n\nconst SliderControl = React.memo(function SliderControl({\n id,\n text,\n value,\n element,\n onChange,\n onBlur,\n}: {\n id: string\n text: string\n value: unknown\n element: FormTypes.NumberElement\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => unknown\n onBlur: () => void\n}) {\n const sliderOutputRef = React.useRef<HTMLOutputElement>(null)\n const sliderInputRef = React.useRef<HTMLInputElement>(null)\n\n const number = React.useMemo(\n () => (typeof value === 'number' ? value : parseFloat(value as string)),\n [value],\n )\n\n const removeIsDraggingClass = React.useMemo(\n () =>\n _debounce((outputElement: HTMLOutputElement) => {\n if (outputElement.classList.contains('is-dragging')) {\n outputElement.classList.remove('is-dragging')\n }\n }, 500),\n [],\n )\n\n React.useEffect(() => {\n if (\n Number.isNaN(number) ||\n typeof element.maxNumber !== 'number' ||\n typeof element.minNumber !== 'number'\n ) {\n return\n }\n\n const outputElement = sliderOutputRef.current\n const inputElement = sliderInputRef.current\n if (outputElement && inputElement) {\n const range = element.maxNumber - element.minNumber\n const percentage = (number - element.minNumber) / range\n const inputWidth = inputElement.getBoundingClientRect().width\n const outputWidth = outputElement.getBoundingClientRect().width\n const sliderBubbleOffSetPixels =\n (percentage - 0.5) * -sliderBubbleWidthInPixels\n\n outputElement.style.left = `${percentage * inputWidth}px`\n outputElement.style.marginLeft = `-${\n outputWidth / 2 - sliderBubbleOffSetPixels\n }px`\n\n if (!outputElement.classList.contains('is-dragging')) {\n outputElement.classList.add('is-dragging')\n }\n removeIsDraggingClass(outputElement)\n }\n }, [element.maxNumber, element.minNumber, number, removeIsDraggingClass])\n\n return (\n <div className=\"control\">\n <output\n ref={sliderOutputRef}\n className=\"ob-number__output cypress-number-output\"\n htmlFor={id}\n >\n {text}\n </output>\n <input\n ref={sliderInputRef}\n id={id}\n name={element.name}\n className=\"slider ob-input is-fullwidth cypress-slider-number-control is-large is-circle cypress-number-control\"\n step={element.sliderIncrement ? element.sliderIncrement : 1}\n min={element.minNumber}\n max={element.maxNumber}\n value={text}\n type=\"range\"\n onChange={onChange}\n required={element.required}\n disabled={element.readOnly}\n onBlur={onBlur}\n />\n </div>\n )\n})\n\nexport default React.memo(FormElementNumber)\n"]}
|
|
@@ -7,6 +7,7 @@ import Modal from '../components/renderer/Modal';
|
|
|
7
7
|
import FormElementLabelContainer from '../components/renderer/FormElementLabelContainer';
|
|
8
8
|
import useValidationClass from '../hooks/useValidationClass';
|
|
9
9
|
import useFormElementRepeatableSetEntries from '../hooks/useFormElementRepeatableSetEntries';
|
|
10
|
+
import MaterialIcon from '../components/MaterialIcon';
|
|
10
11
|
const RepeatableSetIndexContext = React.createContext(0);
|
|
11
12
|
export function useRepeatableSetIndexText(text) {
|
|
12
13
|
const index = React.useContext(RepeatableSetIndexContext);
|
|
@@ -119,9 +120,9 @@ function FormElementRepeatableSet({ formId, element, value, formElementValidatio
|
|
|
119
120
|
return (React.createElement(RepeatableSetEntry, { key: index, formId: formId, index: index, id: id, isEven: isEven, entry: entry, element: element, onChange: handleNestedChange, onLookup: onLookup, onRemove: handleRemoveEntry, formElementsConditionallyShown: repeatableSetEntriesConditionallyShown[index.toString()], formElementsValidation: repeatableSetValidation &&
|
|
120
121
|
repeatableSetValidation.entries[index.toString()], displayValidationMessages: displayValidationMessage, onUpdateFormElements: onUpdateFormElements }));
|
|
121
122
|
}),
|
|
122
|
-
(!maxSetEntries || entries.length < maxSetEntries) && (React.createElement("button", { type: "button", className: "button ob-button ob-button__add is-primary cypress-add-repeatable-set", onClick: handleAddEntry, disabled: element.readOnly },
|
|
123
|
+
(!maxSetEntries || entries.length < maxSetEntries) && (React.createElement("button", { type: "button", className: "button ob-button ob-button__add is-primary cypress-add-repeatable-set", onClick: handleAddEntry, disabled: element.readOnly, "aria-label": element.addSetEntryLabel ? undefined : 'Add Entry' },
|
|
123
124
|
React.createElement("span", { className: "icon" },
|
|
124
|
-
React.createElement(
|
|
125
|
+
React.createElement(MaterialIcon, null, "add")),
|
|
125
126
|
!!element.addSetEntryLabel && (React.createElement("span", null, element.addSetEntryLabel)))),
|
|
126
127
|
(isDirty || displayValidationMessage) &&
|
|
127
128
|
!!repeatableSetValidation &&
|
|
@@ -226,9 +227,9 @@ const RepeatableSetEntry = React.memo(function RepeatableSetEntry({ formId, id,
|
|
|
226
227
|
onRemove(index);
|
|
227
228
|
}, autoFocus: true }, "Yes")) }, "Are you sure you want to remove this entry?"),
|
|
228
229
|
React.createElement("div", { key: index, className: clsx('ob-repeatable-set__container cypress-repeatable-set-container', validationClassName) },
|
|
229
|
-
React.createElement("button", { type: "button", className: "button ob-button ob-button_remove is-light cypress-remove-repeatable-set-entry", onClick: confirmRemove, disabled: element.readOnly },
|
|
230
|
+
React.createElement("button", { type: "button", className: "button ob-button ob-button_remove is-light cypress-remove-repeatable-set-entry", onClick: confirmRemove, disabled: element.readOnly, "aria-label": element.removeSetEntryLabel ? undefined : 'Remove Entry' },
|
|
230
231
|
React.createElement("span", { className: "icon" },
|
|
231
|
-
React.createElement(
|
|
232
|
+
React.createElement(MaterialIcon, null, "delete_outline")),
|
|
232
233
|
!!element.removeSetEntryLabel && (React.createElement("span", null, element.removeSetEntryLabel))),
|
|
233
234
|
React.createElement(OneBlinkFormElements, { formId: formId, idPrefix: `${id}_entry-${index}_`, isEven: isEven, formElementsValidation: formElementsValidation, displayValidationMessages: displayValidationMessages, elements: element.elements, onChange: handleChange, onLookup: handleLookup, model: entry, parentElement: element, formElementsConditionallyShown: formElementsConditionallyShown, onUpdateFormElements: handleUpdateNestedFormElements }))));
|
|
234
235
|
});
|