@veeqo/ui 12.4.0-beta-9 → 12.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/SelectDropdown/SelectDropdown.cjs +27 -19
- package/dist/components/SelectDropdown/SelectDropdown.cjs.map +1 -1
- package/dist/components/SelectDropdown/SelectDropdown.d.ts +1 -1
- package/dist/components/SelectDropdown/SelectDropdown.js +27 -19
- package/dist/components/SelectDropdown/SelectDropdown.js.map +1 -1
- package/dist/components/SelectDropdown/SelectDropdown.module.scss.cjs +2 -2
- package/dist/components/SelectDropdown/SelectDropdown.module.scss.cjs.map +1 -1
- package/dist/components/SelectDropdown/SelectDropdown.module.scss.js +2 -2
- package/dist/components/SelectDropdown/SelectDropdown.module.scss.js.map +1 -1
- package/dist/components/SelectDropdown/components/GridItem/GridItem.cjs +37 -0
- package/dist/components/SelectDropdown/components/GridItem/GridItem.cjs.map +1 -0
- package/dist/components/SelectDropdown/components/GridItem/GridItem.js +31 -0
- package/dist/components/SelectDropdown/components/GridItem/GridItem.js.map +1 -0
- package/dist/components/SelectDropdown/components/GridItem/GridItem.module.scss.cjs +9 -0
- package/dist/components/SelectDropdown/components/GridItem/GridItem.module.scss.cjs.map +1 -0
- package/dist/components/SelectDropdown/components/GridItem/GridItem.module.scss.js +7 -0
- package/dist/components/SelectDropdown/components/GridItem/GridItem.module.scss.js.map +1 -0
- package/dist/components/SelectDropdown/components/ItemContent/ItemContent.cjs +4 -4
- package/dist/components/SelectDropdown/components/ItemContent/ItemContent.cjs.map +1 -1
- package/dist/components/SelectDropdown/components/ItemContent/ItemContent.d.ts +1 -1
- package/dist/components/SelectDropdown/components/ItemContent/ItemContent.js +4 -4
- package/dist/components/SelectDropdown/components/ItemContent/ItemContent.js.map +1 -1
- package/dist/components/SelectDropdown/components/ItemContent/ItemContent.module.scss.cjs +2 -2
- package/dist/components/SelectDropdown/components/ItemContent/ItemContent.module.scss.cjs.map +1 -1
- package/dist/components/SelectDropdown/components/ItemContent/ItemContent.module.scss.js +2 -2
- package/dist/components/SelectDropdown/components/ItemContent/ItemContent.module.scss.js.map +1 -1
- package/dist/components/SelectDropdown/components/ItemContent/types.d.ts +2 -0
- package/dist/components/SelectDropdown/components/ListItem/ListItem.cjs +1 -1
- package/dist/components/SelectDropdown/components/ListItem/ListItem.cjs.map +1 -1
- package/dist/components/SelectDropdown/components/ListItem/ListItem.js +2 -2
- package/dist/components/SelectDropdown/components/ListItem/ListItem.js.map +1 -1
- package/dist/components/SelectDropdown/components/ListItemSection/ListItemSection.cjs +1 -1
- package/dist/components/SelectDropdown/components/ListItemSection/ListItemSection.cjs.map +1 -1
- package/dist/components/SelectDropdown/components/ListItemSection/ListItemSection.js +1 -1
- package/dist/components/SelectDropdown/components/ListItemSection/ListItemSection.js.map +1 -1
- package/dist/components/SelectDropdown/components/ListItemSection/ListItemSection.module.scss.cjs +2 -2
- package/dist/components/SelectDropdown/components/ListItemSection/ListItemSection.module.scss.cjs.map +1 -1
- package/dist/components/SelectDropdown/components/ListItemSection/ListItemSection.module.scss.js +2 -2
- package/dist/components/SelectDropdown/components/ListItemSection/ListItemSection.module.scss.js.map +1 -1
- package/dist/components/SelectDropdown/components/OptionsContainers/GridList.cjs +18 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/GridList.cjs.map +1 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/GridList.d.ts +3 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/GridList.js +12 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/GridList.js.map +1 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/ListBox.cjs +19 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/ListBox.cjs.map +1 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/ListBox.d.ts +3 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/ListBox.js +13 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/ListBox.js.map +1 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/OptionsContainer.module.scss.cjs +9 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/OptionsContainer.module.scss.cjs.map +1 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/OptionsContainer.module.scss.js +7 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/OptionsContainer.module.scss.js.map +1 -0
- package/dist/components/SelectDropdown/components/OptionsContainers/types.d.ts +25 -0
- package/dist/components/SelectDropdown/components/SelectDropdownState.cjs +11 -3
- package/dist/components/SelectDropdown/components/SelectDropdownState.cjs.map +1 -1
- package/dist/components/SelectDropdown/components/SelectDropdownState.js +11 -3
- package/dist/components/SelectDropdown/components/SelectDropdownState.js.map +1 -1
- package/dist/components/SelectDropdown/components/SelectedOption.cjs +2 -2
- package/dist/components/SelectDropdown/components/SelectedOption.cjs.map +1 -1
- package/dist/components/SelectDropdown/components/SelectedOption.js +2 -2
- package/dist/components/SelectDropdown/components/SelectedOption.js.map +1 -1
- package/dist/components/SelectDropdown/components/item.module.scss.cjs +3 -3
- package/dist/components/SelectDropdown/components/item.module.scss.cjs.map +1 -1
- package/dist/components/SelectDropdown/components/item.module.scss.js +3 -3
- package/dist/components/SelectDropdown/components/item.module.scss.js.map +1 -1
- package/dist/components/SelectDropdown/types.d.ts +4 -1
- package/dist/components/UploadFile/UploadFile.cjs +82 -71
- package/dist/components/UploadFile/UploadFile.cjs.map +1 -1
- package/dist/components/UploadFile/UploadFile.js +85 -74
- package/dist/components/UploadFile/UploadFile.js.map +1 -1
- package/dist/components/UploadFile/UploadGraphic.cjs +14 -0
- package/dist/components/UploadFile/UploadGraphic.cjs.map +1 -0
- package/dist/components/UploadFile/UploadGraphic.d.ts +2 -0
- package/dist/components/UploadFile/UploadGraphic.js +8 -0
- package/dist/components/UploadFile/UploadGraphic.js.map +1 -0
- package/dist/components/UploadFile/components/UploadCopy/UploadCopy.cjs +6 -6
- package/dist/components/UploadFile/components/UploadCopy/UploadCopy.cjs.map +1 -1
- package/dist/components/UploadFile/components/UploadCopy/UploadCopy.js +6 -6
- package/dist/components/UploadFile/components/UploadCopy/UploadCopy.js.map +1 -1
- package/dist/components/UploadFile/components/UploadFileErrors/UploadFileErrors.cjs +31 -0
- package/dist/components/UploadFile/components/UploadFileErrors/UploadFileErrors.cjs.map +1 -0
- package/dist/components/UploadFile/components/UploadFileErrors/UploadFileErrors.d.ts +7 -0
- package/dist/components/UploadFile/components/UploadFileErrors/UploadFileErrors.js +25 -0
- package/dist/components/UploadFile/components/UploadFileErrors/UploadFileErrors.js.map +1 -0
- package/dist/components/UploadFile/components/UploadedFile/UploadedFile.cjs +5 -52
- package/dist/components/UploadFile/components/UploadedFile/UploadedFile.cjs.map +1 -1
- package/dist/components/UploadFile/components/UploadedFile/UploadedFile.d.ts +3 -7
- package/dist/components/UploadFile/components/UploadedFile/UploadedFile.js +5 -52
- package/dist/components/UploadFile/components/UploadedFile/UploadedFile.js.map +1 -1
- package/dist/components/UploadFile/components/UploadedFile/styled.cjs +20 -0
- package/dist/components/UploadFile/components/UploadedFile/styled.cjs.map +1 -0
- package/dist/components/UploadFile/components/UploadedFile/styled.d.ts +2 -0
- package/dist/components/UploadFile/components/UploadedFile/styled.js +13 -0
- package/dist/components/UploadFile/components/UploadedFile/styled.js.map +1 -0
- package/dist/components/UploadFile/constants.cjs +8 -64
- package/dist/components/UploadFile/constants.cjs.map +1 -1
- package/dist/components/UploadFile/constants.d.ts +5 -52
- package/dist/components/UploadFile/constants.js +9 -63
- package/dist/components/UploadFile/constants.js.map +1 -1
- package/dist/components/UploadFile/mocks/files.d.ts +0 -2
- package/dist/components/UploadFile/mocks/utils.d.ts +2 -1
- package/dist/components/UploadFile/styled.cjs +1 -16
- package/dist/components/UploadFile/styled.cjs.map +1 -1
- package/dist/components/UploadFile/styled.d.ts +1 -4
- package/dist/components/UploadFile/styled.js +1 -16
- package/dist/components/UploadFile/styled.js.map +1 -1
- package/dist/components/UploadFile/types.d.ts +1 -14
- package/dist/components/UploadFile/utils/getFileSizeString/getFileSizeString.cjs +11 -14
- package/dist/components/UploadFile/utils/getFileSizeString/getFileSizeString.cjs.map +1 -1
- package/dist/components/UploadFile/utils/getFileSizeString/getFileSizeString.d.ts +7 -10
- package/dist/components/UploadFile/utils/getFileSizeString/getFileSizeString.js +11 -14
- package/dist/components/UploadFile/utils/getFileSizeString/getFileSizeString.js.map +1 -1
- package/dist/components/UploadFile/utils/getValidTypesString/getValidTypesString.cjs +30 -16
- package/dist/components/UploadFile/utils/getValidTypesString/getValidTypesString.cjs.map +1 -1
- package/dist/components/UploadFile/utils/getValidTypesString/getValidTypesString.js +30 -16
- package/dist/components/UploadFile/utils/getValidTypesString/getValidTypesString.js.map +1 -1
- package/dist/components/UploadFile/utils/index.d.ts +1 -0
- package/dist/components/UploadFile/utils/setInputElFile/setInputElFile.cjs +18 -0
- package/dist/components/UploadFile/utils/setInputElFile/setInputElFile.cjs.map +1 -0
- package/dist/components/UploadFile/utils/setInputElFile/setInputElFile.d.ts +13 -0
- package/dist/components/UploadFile/utils/setInputElFile/setInputElFile.js +16 -0
- package/dist/components/UploadFile/utils/setInputElFile/setInputElFile.js.map +1 -0
- package/dist/components/ViewsContainer/ViewsContainer.cjs +37 -10
- package/dist/components/ViewsContainer/ViewsContainer.cjs.map +1 -1
- package/dist/components/ViewsContainer/ViewsContainer.js +37 -10
- package/dist/components/ViewsContainer/ViewsContainer.js.map +1 -1
- package/dist/components/ViewsContainer/ViewsContainer.module.scss.cjs +9 -0
- package/dist/components/ViewsContainer/ViewsContainer.module.scss.cjs.map +1 -0
- package/dist/components/ViewsContainer/ViewsContainer.module.scss.js +7 -0
- package/dist/components/ViewsContainer/ViewsContainer.module.scss.js.map +1 -0
- package/dist/components/ViewsContainer/hooks/useSetScrollPosition.cjs +73 -45
- package/dist/components/ViewsContainer/hooks/useSetScrollPosition.cjs.map +1 -1
- package/dist/components/ViewsContainer/hooks/useSetScrollPosition.d.ts +9 -1
- package/dist/components/ViewsContainer/hooks/useSetScrollPosition.js +74 -46
- package/dist/components/ViewsContainer/hooks/useSetScrollPosition.js.map +1 -1
- package/dist/components/ViewsContainer/types.d.ts +18 -0
- package/dist/utils/forms/form.module.scss.cjs +2 -2
- package/dist/utils/forms/form.module.scss.cjs.map +1 -1
- package/dist/utils/forms/form.module.scss.js +2 -2
- package/dist/utils/forms/form.module.scss.js.map +1 -1
- package/package.json +1 -1
- package/dist/components/UploadFile/components/DropCopy/DropCopy.cjs +0 -28
- package/dist/components/UploadFile/components/DropCopy/DropCopy.cjs.map +0 -1
- package/dist/components/UploadFile/components/DropCopy/DropCopy.d.ts +0 -2
- package/dist/components/UploadFile/components/DropCopy/DropCopy.js +0 -22
- package/dist/components/UploadFile/components/DropCopy/DropCopy.js.map +0 -1
- package/dist/components/UploadFile/components/UploadedFile/UploadedFile.module.scss.cjs +0 -9
- package/dist/components/UploadFile/components/UploadedFile/UploadedFile.module.scss.cjs.map +0 -1
- package/dist/components/UploadFile/components/UploadedFile/UploadedFile.module.scss.js +0 -7
- package/dist/components/UploadFile/components/UploadedFile/UploadedFile.module.scss.js.map +0 -1
- package/dist/components/UploadFile/hooks/useFileErrorMessages/index.d.ts +0 -1
- package/dist/components/UploadFile/hooks/useFileErrorMessages/useFileErrorMessages.cjs +0 -39
- package/dist/components/UploadFile/hooks/useFileErrorMessages/useFileErrorMessages.cjs.map +0 -1
- package/dist/components/UploadFile/hooks/useFileErrorMessages/useFileErrorMessages.d.ts +0 -13
- package/dist/components/UploadFile/hooks/useFileErrorMessages/useFileErrorMessages.js +0 -37
- package/dist/components/UploadFile/hooks/useFileErrorMessages/useFileErrorMessages.js.map +0 -1
- package/dist/components/UploadFile/hooks/usePreviewImage/index.d.ts +0 -1
- package/dist/components/UploadFile/hooks/usePreviewImage/usePreviewImage.cjs +0 -36
- package/dist/components/UploadFile/hooks/usePreviewImage/usePreviewImage.cjs.map +0 -1
- package/dist/components/UploadFile/hooks/usePreviewImage/usePreviewImage.d.ts +0 -8
- package/dist/components/UploadFile/hooks/usePreviewImage/usePreviewImage.js +0 -34
- package/dist/components/UploadFile/hooks/usePreviewImage/usePreviewImage.js.map +0 -1
- package/dist/components/UploadFile/hooks/useUploadFile/index.d.ts +0 -1
- package/dist/components/UploadFile/hooks/useUploadFile/useUploadFile.cjs +0 -65
- package/dist/components/UploadFile/hooks/useUploadFile/useUploadFile.cjs.map +0 -1
- package/dist/components/UploadFile/hooks/useUploadFile/useUploadFile.d.ts +0 -9
- package/dist/components/UploadFile/hooks/useUploadFile/useUploadFile.js +0 -63
- package/dist/components/UploadFile/hooks/useUploadFile/useUploadFile.js.map +0 -1
- package/dist/components/UploadFile/hooks/useValidateInput/index.d.ts +0 -1
- package/dist/components/UploadFile/hooks/useValidateInput/useValidateInput.cjs +0 -85
- package/dist/components/UploadFile/hooks/useValidateInput/useValidateInput.cjs.map +0 -1
- package/dist/components/UploadFile/hooks/useValidateInput/useValidateInput.d.ts +0 -13
- package/dist/components/UploadFile/hooks/useValidateInput/useValidateInput.js +0 -83
- package/dist/components/UploadFile/hooks/useValidateInput/useValidateInput.js.map +0 -1
- package/dist/components/UploadFile/mocks/mockUseUploadFile.d.ts +0 -14
- package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileExtension.d.ts +0 -1
- package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.cjs +0 -17
- package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.cjs.map +0 -1
- package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.d.ts +0 -1
- package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.js +0 -15
- package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.js.map +0 -1
- package/dist/components/UploadFile/utils/convertFileTypeToAcceptedFileExtension/index.d.ts +0 -1
- package/dist/components/UploadFile/utils/isImageType/index.d.ts +0 -1
- package/dist/components/UploadFile/utils/isImageType/isImageType.cjs +0 -14
- package/dist/components/UploadFile/utils/isImageType/isImageType.cjs.map +0 -1
- package/dist/components/UploadFile/utils/isImageType/isImageType.d.ts +0 -1
- package/dist/components/UploadFile/utils/isImageType/isImageType.js +0 -12
- package/dist/components/UploadFile/utils/isImageType/isImageType.js.map +0 -1
- package/dist/components/ViewsContainer/styled.cjs +0 -37
- package/dist/components/ViewsContainer/styled.cjs.map +0 -1
- package/dist/components/ViewsContainer/styled.d.ts +0 -34
- package/dist/components/ViewsContainer/styled.js +0 -23
- package/dist/components/ViewsContainer/styled.js.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DropCopy.js","sources":["../../../../../src/components/UploadFile/components/DropCopy/DropCopy.tsx"],"sourcesContent":["import React from 'react';\nimport { motion } from 'framer-motion';\nimport { theme } from 'Theme';\nimport { sizes } from '../../../../theme/modules/sizes';\nimport { Text } from '../../../Text';\nimport { FlexCol } from '../../../Flex/FlexCol';\nimport { ArrowDownIcon } from '../../../../icons';\n\nexport const DropCopy = () => (\n <FlexCol alignItems=\"center\" gap=\"sm\" style={{ pointerEvents: 'none' }}>\n <div style={{ height: 24, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>\n <motion.div\n animate={{\n y: [0, 8, 0],\n }}\n transition={{\n duration: 1,\n repeat: Infinity,\n ease: 'easeInOut',\n }}\n >\n <ArrowDownIcon height={24} width={24} />\n </motion.div>\n </div>\n <Text variant=\"body\" style={{ paddingTop: sizes.sm, color: theme.colors.neutral.ink.base }}>\n Drop to upload\n </Text>\n </FlexCol>\n);\n"],"names":["React"],"mappings":";;;;;;;;AAQa,MAAA,QAAQ,GAAG,OACtBA,cAAC,CAAA,aAAA,CAAA,OAAO,EAAC,EAAA,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAC,IAAI,EAAC,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE,EAAA;AACpE,IAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,EAAE,EAAA;AACzF,QAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,CAAC,GAAG,EAAA,EACT,OAAO,EAAE;AACP,gBAAA,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;AACb,aAAA,EACD,UAAU,EAAE;AACV,gBAAA,QAAQ,EAAE,CAAC;AACX,gBAAA,MAAM,EAAE,QAAQ;AAChB,gBAAA,IAAI,EAAE,WAAW;AAClB,aAAA,EAAA;YAEDA,cAAC,CAAA,aAAA,CAAA,aAAa,EAAC,EAAA,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAI,CAAA,CAC7B,CACT;AACN,IAAAA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,OAAO,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAE,EAEnF,EAAA,gBAAA,CAAA,CACC;;;;"}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var ___$insertStyle = require('../../../../_virtual/____insertStyle.cjs');
|
|
4
|
-
|
|
5
|
-
___$insertStyle("._uploadedFileContainer_1lguk_1 {\n border: 1px solid var(--colors-neutral-ink-lightest);\n border-radius: var(--radius-base);\n padding: var(--sizes-3);\n}\n\n._uploadedFileContainerCriticalError_1lguk_7 {\n border: 1px solid var(--colors-secondary-red-base);\n border-radius: var(--radius-base);\n padding: var(--sizes-3);\n}\n\n._singleLineText_1lguk_13 {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex: 0 1 80%;\n min-width: 0;\n}\n\n._singleLineTextWithoutFlex_1lguk_21 {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex: none;\n min-width: 0;\n width: 100%;\n}\n\n._fileSizeText_1lguk_30 {\n white-space: nowrap;\n flex: 0 0 20%;\n text-align: right;\n}\n\n._previewImage_1lguk_36 img {\n border: 1px solid var(--colors-neutral-ink-lightest);\n border-radius: var(--sizes-xs);\n}");
|
|
6
|
-
var uploadFileStyles = {"uploadedFileContainer":"_uploadedFileContainer_1lguk_1","uploadedFileContainerCriticalError":"_uploadedFileContainerCriticalError_1lguk_7","singleLineText":"_singleLineText_1lguk_13","singleLineTextWithoutFlex":"_singleLineTextWithoutFlex_1lguk_21","fileSizeText":"_fileSizeText_1lguk_30","previewImage":"_previewImage_1lguk_36"};
|
|
7
|
-
|
|
8
|
-
module.exports = uploadFileStyles;
|
|
9
|
-
//# sourceMappingURL=UploadedFile.module.scss.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"UploadedFile.module.scss.cjs","sources":["../../../../../src/components/UploadFile/components/UploadedFile/UploadedFile.module.scss"],"sourcesContent":[".uploadedFileContainer {\n border: 1px solid var(--colors-neutral-ink-lightest);\n border-radius: var(--radius-base);\n padding: var(--sizes-3);\n}\n\n.uploadedFileContainerCriticalError {\n border: 1px solid var(--colors-secondary-red-base);\n border-radius: var(--radius-base);\n padding: var(--sizes-3);\n}\n\n.singleLineText {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex: 0 1 80%;\n min-width: 0;\n}\n\n.singleLineTextWithoutFlex {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex: none;\n min-width: 0;\n width: 100%;\n}\n\n.fileSizeText {\n white-space: nowrap;\n flex: 0 0 20%;\n text-align: right;\n}\n\n.previewImage {\n img {\n border: 1px solid var(--colors-neutral-ink-lightest);\n border-radius: var(--sizes-xs);\n }\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,m2BAAA;AACA,uBAAA,CAAA,uBAAA,CAAA,gCAAA,CAAA,oCAAA,CAAA,6CAAA,CAAA,gBAAA,CAAA,0BAAA,CAAA,2BAAA,CAAA,qCAAA,CAAA,cAAA,CAAA,wBAAA,CAAA,cAAA,CAAA,wBAAA;;;;"}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import insertStyle from '../../../../_virtual/____insertStyle.js';
|
|
2
|
-
|
|
3
|
-
insertStyle("._uploadedFileContainer_1lguk_1 {\n border: 1px solid var(--colors-neutral-ink-lightest);\n border-radius: var(--radius-base);\n padding: var(--sizes-3);\n}\n\n._uploadedFileContainerCriticalError_1lguk_7 {\n border: 1px solid var(--colors-secondary-red-base);\n border-radius: var(--radius-base);\n padding: var(--sizes-3);\n}\n\n._singleLineText_1lguk_13 {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex: 0 1 80%;\n min-width: 0;\n}\n\n._singleLineTextWithoutFlex_1lguk_21 {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex: none;\n min-width: 0;\n width: 100%;\n}\n\n._fileSizeText_1lguk_30 {\n white-space: nowrap;\n flex: 0 0 20%;\n text-align: right;\n}\n\n._previewImage_1lguk_36 img {\n border: 1px solid var(--colors-neutral-ink-lightest);\n border-radius: var(--sizes-xs);\n}");
|
|
4
|
-
var uploadFileStyles = {"uploadedFileContainer":"_uploadedFileContainer_1lguk_1","uploadedFileContainerCriticalError":"_uploadedFileContainerCriticalError_1lguk_7","singleLineText":"_singleLineText_1lguk_13","singleLineTextWithoutFlex":"_singleLineTextWithoutFlex_1lguk_21","fileSizeText":"_fileSizeText_1lguk_30","previewImage":"_previewImage_1lguk_36"};
|
|
5
|
-
|
|
6
|
-
export { uploadFileStyles as default };
|
|
7
|
-
//# sourceMappingURL=UploadedFile.module.scss.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"UploadedFile.module.scss.js","sources":["../../../../../src/components/UploadFile/components/UploadedFile/UploadedFile.module.scss"],"sourcesContent":[".uploadedFileContainer {\n border: 1px solid var(--colors-neutral-ink-lightest);\n border-radius: var(--radius-base);\n padding: var(--sizes-3);\n}\n\n.uploadedFileContainerCriticalError {\n border: 1px solid var(--colors-secondary-red-base);\n border-radius: var(--radius-base);\n padding: var(--sizes-3);\n}\n\n.singleLineText {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex: 0 1 80%;\n min-width: 0;\n}\n\n.singleLineTextWithoutFlex {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex: none;\n min-width: 0;\n width: 100%;\n}\n\n.fileSizeText {\n white-space: nowrap;\n flex: 0 0 20%;\n text-align: right;\n}\n\n.previewImage {\n img {\n border: 1px solid var(--colors-neutral-ink-lightest);\n border-radius: var(--sizes-xs);\n }\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,m2BAAA;AACA,uBAAA,CAAA,uBAAA,CAAA,gCAAA,CAAA,oCAAA,CAAA,6CAAA,CAAA,gBAAA,CAAA,0BAAA,CAAA,2BAAA,CAAA,qCAAA,CAAA,cAAA,CAAA,wBAAA,CAAA,cAAA,CAAA,wBAAA;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { useFileErrorMessages } from './useFileErrorMessages';
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var React = require('react');
|
|
4
|
-
var constants = require('../../constants.cjs');
|
|
5
|
-
var convertFileTypeToAcceptedFileType = require('../../utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.cjs');
|
|
6
|
-
|
|
7
|
-
const useFileErrorMessages = ({ format, maxBytes, fileTypes, file, }) => {
|
|
8
|
-
const [errorMessages, setErrorMessages] = React.useState({ criticalErrors: [] });
|
|
9
|
-
React.useEffect(() => {
|
|
10
|
-
if (!file)
|
|
11
|
-
return;
|
|
12
|
-
const extension = convertFileTypeToAcceptedFileType.convertFileTypeToAcceptedFileExtension(file.type);
|
|
13
|
-
const isTypeValid = fileTypes.includes(extension);
|
|
14
|
-
const hasInvalidFormat = !isTypeValid;
|
|
15
|
-
const hasExceededMaxSize = file.size > maxBytes;
|
|
16
|
-
const errors = { criticalErrors: [] };
|
|
17
|
-
if (hasExceededMaxSize) {
|
|
18
|
-
errors.criticalErrors.push({
|
|
19
|
-
errorType: constants.ErrorType.critical,
|
|
20
|
-
errorMessage: 'File is too big',
|
|
21
|
-
});
|
|
22
|
-
}
|
|
23
|
-
if (hasInvalidFormat) {
|
|
24
|
-
errors.criticalErrors.push({
|
|
25
|
-
errorType: constants.ErrorType.critical,
|
|
26
|
-
errorMessage: 'Invalid format',
|
|
27
|
-
});
|
|
28
|
-
}
|
|
29
|
-
setErrorMessages(errors);
|
|
30
|
-
}, [file, fileTypes, format, maxBytes]);
|
|
31
|
-
const hasCriticalErrors = !!errorMessages.criticalErrors.length;
|
|
32
|
-
return {
|
|
33
|
-
hasCriticalErrors,
|
|
34
|
-
errorMessages,
|
|
35
|
-
};
|
|
36
|
-
};
|
|
37
|
-
|
|
38
|
-
exports.useFileErrorMessages = useFileErrorMessages;
|
|
39
|
-
//# sourceMappingURL=useFileErrorMessages.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useFileErrorMessages.cjs","sources":["../../../../../src/components/UploadFile/hooks/useFileErrorMessages/useFileErrorMessages.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { AcceptedFileTypes, ErrorType, FileSizeUnit } from '../../constants';\nimport { UploadFileErrors } from '../../types';\nimport { convertFileTypeToAcceptedFileExtension } from '../../utils/convertFileTypeToAcceptedFileExtension';\n\ntype UseFileErrorMessagesProps = {\n file?: File | null;\n format: FileSizeUnit;\n maxBytes: number;\n fileTypes: Array<AcceptedFileTypes>;\n};\n\nexport const useFileErrorMessages = ({\n format,\n maxBytes,\n fileTypes,\n file,\n}: UseFileErrorMessagesProps) => {\n const [errorMessages, setErrorMessages] = useState<UploadFileErrors>({ criticalErrors: [] });\n\n useEffect(() => {\n if (!file) return;\n\n const extension = convertFileTypeToAcceptedFileExtension(file.type);\n const isTypeValid = (fileTypes as string[]).includes(extension);\n const hasInvalidFormat = !isTypeValid;\n\n const hasExceededMaxSize = file.size > maxBytes;\n\n const errors: UploadFileErrors = { criticalErrors: [] };\n if (hasExceededMaxSize) {\n errors.criticalErrors.push({\n errorType: ErrorType.critical,\n errorMessage: 'File is too big',\n });\n }\n if (hasInvalidFormat) {\n errors.criticalErrors.push({\n errorType: ErrorType.critical,\n errorMessage: 'Invalid format',\n });\n }\n setErrorMessages(errors);\n }, [file, fileTypes, format, maxBytes]);\n\n const hasCriticalErrors = !!errorMessages.criticalErrors.length;\n\n return {\n hasCriticalErrors,\n errorMessages,\n };\n};\n"],"names":["useState","useEffect","convertFileTypeToAcceptedFileExtension","ErrorType"],"mappings":";;;;;;AAYO,MAAM,oBAAoB,GAAG,CAAC,EACnC,MAAM,EACN,QAAQ,EACR,SAAS,EACT,IAAI,GACsB,KAAI;AAC9B,IAAA,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAGA,cAAQ,CAAmB,EAAE,cAAc,EAAE,EAAE,EAAE,CAAC;IAE5FC,eAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,IAAI;YAAE;QAEX,MAAM,SAAS,GAAGC,wEAAsC,CAAC,IAAI,CAAC,IAAI,CAAC;QACnE,MAAM,WAAW,GAAI,SAAsB,CAAC,QAAQ,CAAC,SAAS,CAAC;AAC/D,QAAA,MAAM,gBAAgB,GAAG,CAAC,WAAW;AAErC,QAAA,MAAM,kBAAkB,GAAG,IAAI,CAAC,IAAI,GAAG,QAAQ;AAE/C,QAAA,MAAM,MAAM,GAAqB,EAAE,cAAc,EAAE,EAAE,EAAE;AACvD,QAAA,IAAI,kBAAkB,EAAE;AACtB,YAAA,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC;gBACzB,SAAS,EAAEC,mBAAS,CAAC,QAAQ;AAC7B,gBAAA,YAAY,EAAE,iBAAiB;AAChC,aAAA,CAAC;AACH;AACD,QAAA,IAAI,gBAAgB,EAAE;AACpB,YAAA,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC;gBACzB,SAAS,EAAEA,mBAAS,CAAC,QAAQ;AAC7B,gBAAA,YAAY,EAAE,gBAAgB;AAC/B,aAAA,CAAC;AACH;QACD,gBAAgB,CAAC,MAAM,CAAC;KACzB,EAAE,CAAC,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC;IAEvC,MAAM,iBAAiB,GAAG,CAAC,CAAC,aAAa,CAAC,cAAc,CAAC,MAAM;IAE/D,OAAO;QACL,iBAAiB;QACjB,aAAa;KACd;AACH;;;;"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { AcceptedFileTypes, FileSizeUnit } from '../../constants';
|
|
2
|
-
import { UploadFileErrors } from '../../types';
|
|
3
|
-
type UseFileErrorMessagesProps = {
|
|
4
|
-
file?: File | null;
|
|
5
|
-
format: FileSizeUnit;
|
|
6
|
-
maxBytes: number;
|
|
7
|
-
fileTypes: Array<AcceptedFileTypes>;
|
|
8
|
-
};
|
|
9
|
-
export declare const useFileErrorMessages: ({ format, maxBytes, fileTypes, file, }: UseFileErrorMessagesProps) => {
|
|
10
|
-
hasCriticalErrors: boolean;
|
|
11
|
-
errorMessages: UploadFileErrors;
|
|
12
|
-
};
|
|
13
|
-
export {};
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import { useState, useEffect } from 'react';
|
|
2
|
-
import { ErrorType } from '../../constants.js';
|
|
3
|
-
import { convertFileTypeToAcceptedFileExtension } from '../../utils/convertFileTypeToAcceptedFileExtension/convertFileTypeToAcceptedFileType.js';
|
|
4
|
-
|
|
5
|
-
const useFileErrorMessages = ({ format, maxBytes, fileTypes, file, }) => {
|
|
6
|
-
const [errorMessages, setErrorMessages] = useState({ criticalErrors: [] });
|
|
7
|
-
useEffect(() => {
|
|
8
|
-
if (!file)
|
|
9
|
-
return;
|
|
10
|
-
const extension = convertFileTypeToAcceptedFileExtension(file.type);
|
|
11
|
-
const isTypeValid = fileTypes.includes(extension);
|
|
12
|
-
const hasInvalidFormat = !isTypeValid;
|
|
13
|
-
const hasExceededMaxSize = file.size > maxBytes;
|
|
14
|
-
const errors = { criticalErrors: [] };
|
|
15
|
-
if (hasExceededMaxSize) {
|
|
16
|
-
errors.criticalErrors.push({
|
|
17
|
-
errorType: ErrorType.critical,
|
|
18
|
-
errorMessage: 'File is too big',
|
|
19
|
-
});
|
|
20
|
-
}
|
|
21
|
-
if (hasInvalidFormat) {
|
|
22
|
-
errors.criticalErrors.push({
|
|
23
|
-
errorType: ErrorType.critical,
|
|
24
|
-
errorMessage: 'Invalid format',
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
|
-
setErrorMessages(errors);
|
|
28
|
-
}, [file, fileTypes, format, maxBytes]);
|
|
29
|
-
const hasCriticalErrors = !!errorMessages.criticalErrors.length;
|
|
30
|
-
return {
|
|
31
|
-
hasCriticalErrors,
|
|
32
|
-
errorMessages,
|
|
33
|
-
};
|
|
34
|
-
};
|
|
35
|
-
|
|
36
|
-
export { useFileErrorMessages };
|
|
37
|
-
//# sourceMappingURL=useFileErrorMessages.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useFileErrorMessages.js","sources":["../../../../../src/components/UploadFile/hooks/useFileErrorMessages/useFileErrorMessages.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { AcceptedFileTypes, ErrorType, FileSizeUnit } from '../../constants';\nimport { UploadFileErrors } from '../../types';\nimport { convertFileTypeToAcceptedFileExtension } from '../../utils/convertFileTypeToAcceptedFileExtension';\n\ntype UseFileErrorMessagesProps = {\n file?: File | null;\n format: FileSizeUnit;\n maxBytes: number;\n fileTypes: Array<AcceptedFileTypes>;\n};\n\nexport const useFileErrorMessages = ({\n format,\n maxBytes,\n fileTypes,\n file,\n}: UseFileErrorMessagesProps) => {\n const [errorMessages, setErrorMessages] = useState<UploadFileErrors>({ criticalErrors: [] });\n\n useEffect(() => {\n if (!file) return;\n\n const extension = convertFileTypeToAcceptedFileExtension(file.type);\n const isTypeValid = (fileTypes as string[]).includes(extension);\n const hasInvalidFormat = !isTypeValid;\n\n const hasExceededMaxSize = file.size > maxBytes;\n\n const errors: UploadFileErrors = { criticalErrors: [] };\n if (hasExceededMaxSize) {\n errors.criticalErrors.push({\n errorType: ErrorType.critical,\n errorMessage: 'File is too big',\n });\n }\n if (hasInvalidFormat) {\n errors.criticalErrors.push({\n errorType: ErrorType.critical,\n errorMessage: 'Invalid format',\n });\n }\n setErrorMessages(errors);\n }, [file, fileTypes, format, maxBytes]);\n\n const hasCriticalErrors = !!errorMessages.criticalErrors.length;\n\n return {\n hasCriticalErrors,\n errorMessages,\n };\n};\n"],"names":[],"mappings":";;;;AAYO,MAAM,oBAAoB,GAAG,CAAC,EACnC,MAAM,EACN,QAAQ,EACR,SAAS,EACT,IAAI,GACsB,KAAI;AAC9B,IAAA,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAmB,EAAE,cAAc,EAAE,EAAE,EAAE,CAAC;IAE5F,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,IAAI;YAAE;QAEX,MAAM,SAAS,GAAG,sCAAsC,CAAC,IAAI,CAAC,IAAI,CAAC;QACnE,MAAM,WAAW,GAAI,SAAsB,CAAC,QAAQ,CAAC,SAAS,CAAC;AAC/D,QAAA,MAAM,gBAAgB,GAAG,CAAC,WAAW;AAErC,QAAA,MAAM,kBAAkB,GAAG,IAAI,CAAC,IAAI,GAAG,QAAQ;AAE/C,QAAA,MAAM,MAAM,GAAqB,EAAE,cAAc,EAAE,EAAE,EAAE;AACvD,QAAA,IAAI,kBAAkB,EAAE;AACtB,YAAA,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC;gBACzB,SAAS,EAAE,SAAS,CAAC,QAAQ;AAC7B,gBAAA,YAAY,EAAE,iBAAiB;AAChC,aAAA,CAAC;AACH;AACD,QAAA,IAAI,gBAAgB,EAAE;AACpB,YAAA,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC;gBACzB,SAAS,EAAE,SAAS,CAAC,QAAQ;AAC7B,gBAAA,YAAY,EAAE,gBAAgB;AAC/B,aAAA,CAAC;AACH;QACD,gBAAgB,CAAC,MAAM,CAAC;KACzB,EAAE,CAAC,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC;IAEvC,MAAM,iBAAiB,GAAG,CAAC,CAAC,aAAa,CAAC,cAAc,CAAC,MAAM;IAE/D,OAAO;QACL,iBAAiB;QACjB,aAAa;KACd;AACH;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { usePreviewImage } from './usePreviewImage';
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var React = require('react');
|
|
4
|
-
var isImageType = require('../../utils/isImageType/isImageType.cjs');
|
|
5
|
-
|
|
6
|
-
const usePreviewImage = ({ file }) => {
|
|
7
|
-
const [previewSrc, setPreviewSrc] = React.useState('');
|
|
8
|
-
React.useEffect(() => {
|
|
9
|
-
if (!file) {
|
|
10
|
-
setPreviewSrc('');
|
|
11
|
-
return undefined;
|
|
12
|
-
}
|
|
13
|
-
if (!isImageType.isImageType(file)) {
|
|
14
|
-
setPreviewSrc('');
|
|
15
|
-
return undefined;
|
|
16
|
-
}
|
|
17
|
-
const fileReader = new FileReader();
|
|
18
|
-
fileReader.onload = (event) => {
|
|
19
|
-
var _a;
|
|
20
|
-
const imageUrl = (_a = event.target) === null || _a === undefined ? undefined : _a.result;
|
|
21
|
-
setPreviewSrc(String(imageUrl));
|
|
22
|
-
};
|
|
23
|
-
fileReader.readAsDataURL(file);
|
|
24
|
-
return () => {
|
|
25
|
-
fileReader.abort();
|
|
26
|
-
};
|
|
27
|
-
}, [file]);
|
|
28
|
-
const shouldShowPreview = file ? isImageType.isImageType(file) : false;
|
|
29
|
-
return {
|
|
30
|
-
previewSrc,
|
|
31
|
-
shouldShowPreview,
|
|
32
|
-
};
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
exports.usePreviewImage = usePreviewImage;
|
|
36
|
-
//# sourceMappingURL=usePreviewImage.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"usePreviewImage.cjs","sources":["../../../../../src/components/UploadFile/hooks/usePreviewImage/usePreviewImage.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { isImageType } from '../../utils/isImageType';\n\ntype UsePreviewImageProps = {\n file?: File | null;\n};\n\nexport const usePreviewImage = ({ file }: UsePreviewImageProps) => {\n const [previewSrc, setPreviewSrc] = useState('');\n\n useEffect(() => {\n if (!file) {\n setPreviewSrc('');\n return undefined;\n }\n\n if (!isImageType(file)) {\n setPreviewSrc('');\n return undefined;\n }\n\n const fileReader = new FileReader();\n\n fileReader.onload = (event) => {\n const imageUrl = event.target?.result;\n setPreviewSrc(String(imageUrl));\n };\n\n fileReader.readAsDataURL(file);\n\n return () => {\n fileReader.abort();\n };\n }, [file]);\n\n const shouldShowPreview = file ? isImageType(file) : false;\n\n return {\n previewSrc,\n shouldShowPreview,\n };\n};\n"],"names":["useState","useEffect","isImageType"],"mappings":";;;;;MAOa,eAAe,GAAG,CAAC,EAAE,IAAI,EAAwB,KAAI;IAChE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGA,cAAQ,CAAC,EAAE,CAAC;IAEhDC,eAAS,CAAC,MAAK;QACb,IAAI,CAAC,IAAI,EAAE;YACT,aAAa,CAAC,EAAE,CAAC;AACjB,YAAA,OAAO,SAAS;AACjB;AAED,QAAA,IAAI,CAACC,uBAAW,CAAC,IAAI,CAAC,EAAE;YACtB,aAAa,CAAC,EAAE,CAAC;AACjB,YAAA,OAAO,SAAS;AACjB;AAED,QAAA,MAAM,UAAU,GAAG,IAAI,UAAU,EAAE;AAEnC,QAAA,UAAU,CAAC,MAAM,GAAG,CAAC,KAAK,KAAI;;YAC5B,MAAM,QAAQ,GAAG,CAAA,EAAA,GAAA,KAAK,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,MAAM;AACrC,YAAA,aAAa,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;AACjC,SAAC;AAED,QAAA,UAAU,CAAC,aAAa,CAAC,IAAI,CAAC;AAE9B,QAAA,OAAO,MAAK;YACV,UAAU,CAAC,KAAK,EAAE;AACpB,SAAC;AACH,KAAC,EAAE,CAAC,IAAI,CAAC,CAAC;AAEV,IAAA,MAAM,iBAAiB,GAAG,IAAI,GAAGA,uBAAW,CAAC,IAAI,CAAC,GAAG,KAAK;IAE1D,OAAO;QACL,UAAU;QACV,iBAAiB;KAClB;AACH;;;;"}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import { useState, useEffect } from 'react';
|
|
2
|
-
import { isImageType } from '../../utils/isImageType/isImageType.js';
|
|
3
|
-
|
|
4
|
-
const usePreviewImage = ({ file }) => {
|
|
5
|
-
const [previewSrc, setPreviewSrc] = useState('');
|
|
6
|
-
useEffect(() => {
|
|
7
|
-
if (!file) {
|
|
8
|
-
setPreviewSrc('');
|
|
9
|
-
return undefined;
|
|
10
|
-
}
|
|
11
|
-
if (!isImageType(file)) {
|
|
12
|
-
setPreviewSrc('');
|
|
13
|
-
return undefined;
|
|
14
|
-
}
|
|
15
|
-
const fileReader = new FileReader();
|
|
16
|
-
fileReader.onload = (event) => {
|
|
17
|
-
var _a;
|
|
18
|
-
const imageUrl = (_a = event.target) === null || _a === undefined ? undefined : _a.result;
|
|
19
|
-
setPreviewSrc(String(imageUrl));
|
|
20
|
-
};
|
|
21
|
-
fileReader.readAsDataURL(file);
|
|
22
|
-
return () => {
|
|
23
|
-
fileReader.abort();
|
|
24
|
-
};
|
|
25
|
-
}, [file]);
|
|
26
|
-
const shouldShowPreview = file ? isImageType(file) : false;
|
|
27
|
-
return {
|
|
28
|
-
previewSrc,
|
|
29
|
-
shouldShowPreview,
|
|
30
|
-
};
|
|
31
|
-
};
|
|
32
|
-
|
|
33
|
-
export { usePreviewImage };
|
|
34
|
-
//# sourceMappingURL=usePreviewImage.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"usePreviewImage.js","sources":["../../../../../src/components/UploadFile/hooks/usePreviewImage/usePreviewImage.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { isImageType } from '../../utils/isImageType';\n\ntype UsePreviewImageProps = {\n file?: File | null;\n};\n\nexport const usePreviewImage = ({ file }: UsePreviewImageProps) => {\n const [previewSrc, setPreviewSrc] = useState('');\n\n useEffect(() => {\n if (!file) {\n setPreviewSrc('');\n return undefined;\n }\n\n if (!isImageType(file)) {\n setPreviewSrc('');\n return undefined;\n }\n\n const fileReader = new FileReader();\n\n fileReader.onload = (event) => {\n const imageUrl = event.target?.result;\n setPreviewSrc(String(imageUrl));\n };\n\n fileReader.readAsDataURL(file);\n\n return () => {\n fileReader.abort();\n };\n }, [file]);\n\n const shouldShowPreview = file ? isImageType(file) : false;\n\n return {\n previewSrc,\n shouldShowPreview,\n };\n};\n"],"names":[],"mappings":";;;MAOa,eAAe,GAAG,CAAC,EAAE,IAAI,EAAwB,KAAI;IAChE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC;IAEhD,SAAS,CAAC,MAAK;QACb,IAAI,CAAC,IAAI,EAAE;YACT,aAAa,CAAC,EAAE,CAAC;AACjB,YAAA,OAAO,SAAS;AACjB;AAED,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE;YACtB,aAAa,CAAC,EAAE,CAAC;AACjB,YAAA,OAAO,SAAS;AACjB;AAED,QAAA,MAAM,UAAU,GAAG,IAAI,UAAU,EAAE;AAEnC,QAAA,UAAU,CAAC,MAAM,GAAG,CAAC,KAAK,KAAI;;YAC5B,MAAM,QAAQ,GAAG,CAAA,EAAA,GAAA,KAAK,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,MAAM;AACrC,YAAA,aAAa,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;AACjC,SAAC;AAED,QAAA,UAAU,CAAC,aAAa,CAAC,IAAI,CAAC;AAE9B,QAAA,OAAO,MAAK;YACV,UAAU,CAAC,KAAK,EAAE;AACpB,SAAC;AACH,KAAC,EAAE,CAAC,IAAI,CAAC,CAAC;AAEV,IAAA,MAAM,iBAAiB,GAAG,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,GAAG,KAAK;IAE1D,OAAO;QACL,UAAU;QACV,iBAAiB;KAClB;AACH;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { useUploadFile } from './useUploadFile';
|
|
@@ -1,65 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var React = require('react');
|
|
4
|
-
|
|
5
|
-
const useUploadFile = () => {
|
|
6
|
-
const inputRef = React.useRef(null);
|
|
7
|
-
const [fileList, setFileList] = React.useState();
|
|
8
|
-
// Keep inputRef.current.files in sync with fileList
|
|
9
|
-
React.useEffect(() => {
|
|
10
|
-
if (inputRef.current && fileList) {
|
|
11
|
-
// Only update if not already the same (avoid unnecessary assignment)
|
|
12
|
-
if (inputRef.current.files !== fileList) {
|
|
13
|
-
const dt = new DataTransfer();
|
|
14
|
-
Array.from(fileList).forEach((file) => dt.items.add(file));
|
|
15
|
-
inputRef.current.files = dt.files;
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
// If fileList is undefined, clear the input
|
|
19
|
-
if (inputRef.current && !fileList) {
|
|
20
|
-
inputRef.current.value = '';
|
|
21
|
-
}
|
|
22
|
-
}, [fileList, inputRef]);
|
|
23
|
-
// Restores the previous file selection when user cancels the file dialog
|
|
24
|
-
const onCancel = React.useCallback(() => {
|
|
25
|
-
// If there are no existing files to restore, just return
|
|
26
|
-
if (!fileList || fileList.length === 0)
|
|
27
|
-
return;
|
|
28
|
-
const newFileList = new DataTransfer();
|
|
29
|
-
Array.from(fileList).forEach((file) => newFileList.items.add(file));
|
|
30
|
-
if (inputRef === null || inputRef === undefined ? undefined : inputRef.current) {
|
|
31
|
-
inputRef.current.files = newFileList.files;
|
|
32
|
-
}
|
|
33
|
-
}, [fileList]);
|
|
34
|
-
const removeFileFromList = (fileToRemove) => {
|
|
35
|
-
if (!fileList)
|
|
36
|
-
return;
|
|
37
|
-
const newFileList = new DataTransfer();
|
|
38
|
-
Array.from(fileList).forEach((file) => {
|
|
39
|
-
if (file.name === fileToRemove.name)
|
|
40
|
-
return; // Skip this file (remove it)
|
|
41
|
-
newFileList.items.add(file);
|
|
42
|
-
});
|
|
43
|
-
if (inputRef === null || inputRef === undefined ? undefined : inputRef.current) {
|
|
44
|
-
inputRef.current.files = newFileList.files;
|
|
45
|
-
}
|
|
46
|
-
setFileList(newFileList.files);
|
|
47
|
-
};
|
|
48
|
-
const clearFileSelection = () => {
|
|
49
|
-
var _a;
|
|
50
|
-
if ((_a = inputRef.current) === null || _a === undefined ? undefined : _a.value)
|
|
51
|
-
inputRef.current.value = '';
|
|
52
|
-
setFileList(undefined);
|
|
53
|
-
};
|
|
54
|
-
return {
|
|
55
|
-
clearFileSelection,
|
|
56
|
-
inputRef,
|
|
57
|
-
onCancel,
|
|
58
|
-
removeFileFromList,
|
|
59
|
-
setFileList,
|
|
60
|
-
fileList,
|
|
61
|
-
};
|
|
62
|
-
};
|
|
63
|
-
|
|
64
|
-
exports.useUploadFile = useUploadFile;
|
|
65
|
-
//# sourceMappingURL=useUploadFile.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useUploadFile.cjs","sources":["../../../../../src/components/UploadFile/hooks/useUploadFile/useUploadFile.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\nexport const useUploadFile = () => {\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n const [fileList, setFileList] = useState<FileList>();\n\n // Keep inputRef.current.files in sync with fileList\n useEffect(() => {\n if (inputRef.current && fileList) {\n // Only update if not already the same (avoid unnecessary assignment)\n if (inputRef.current.files !== fileList) {\n const dt = new DataTransfer();\n Array.from(fileList).forEach((file) => dt.items.add(file));\n inputRef.current.files = dt.files;\n }\n }\n // If fileList is undefined, clear the input\n if (inputRef.current && !fileList) {\n inputRef.current.value = '';\n }\n }, [fileList, inputRef]);\n\n // Restores the previous file selection when user cancels the file dialog\n const onCancel = useCallback(() => {\n // If there are no existing files to restore, just return\n if (!fileList || fileList.length === 0) return;\n\n const newFileList = new DataTransfer();\n Array.from(fileList).forEach((file) => newFileList.items.add(file));\n\n if (inputRef?.current) {\n inputRef.current.files = newFileList.files;\n }\n }, [fileList]);\n\n const removeFileFromList = (fileToRemove: File) => {\n if (!fileList) return;\n\n const newFileList = new DataTransfer();\n Array.from(fileList).forEach((file) => {\n if (file.name === fileToRemove.name) return; // Skip this file (remove it)\n newFileList.items.add(file);\n });\n\n if (inputRef?.current) {\n inputRef.current.files = newFileList.files;\n }\n setFileList(newFileList.files);\n };\n\n const clearFileSelection = () => {\n if (inputRef.current?.value) inputRef.current.value = '';\n setFileList(undefined);\n };\n\n return {\n clearFileSelection,\n inputRef,\n onCancel,\n removeFileFromList,\n setFileList,\n fileList,\n };\n};\n"],"names":["useRef","useState","useEffect","useCallback"],"mappings":";;;;AAEO,MAAM,aAAa,GAAG,MAAK;AAChC,IAAA,MAAM,QAAQ,GAAGA,YAAM,CAA0B,IAAI,CAAC;IAEtD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAGC,cAAQ,EAAY;;IAGpDC,eAAS,CAAC,MAAK;AACb,QAAA,IAAI,QAAQ,CAAC,OAAO,IAAI,QAAQ,EAAE;;AAEhC,YAAA,IAAI,QAAQ,CAAC,OAAO,CAAC,KAAK,KAAK,QAAQ,EAAE;AACvC,gBAAA,MAAM,EAAE,GAAG,IAAI,YAAY,EAAE;gBAC7B,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,KAAK,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;gBAC1D,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE,CAAC,KAAK;AAClC;AACF;;AAED,QAAA,IAAI,QAAQ,CAAC,OAAO,IAAI,CAAC,QAAQ,EAAE;AACjC,YAAA,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE;AAC5B;AACH,KAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;;AAGxB,IAAA,MAAM,QAAQ,GAAGC,iBAAW,CAAC,MAAK;;AAEhC,QAAA,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC;YAAE;AAExC,QAAA,MAAM,WAAW,GAAG,IAAI,YAAY,EAAE;QACtC,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,KAAK,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;AAEnE,QAAA,IAAI,QAAQ,KAAR,IAAA,IAAA,QAAQ,6BAAR,QAAQ,CAAE,OAAO,EAAE;YACrB,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,WAAW,CAAC,KAAK;AAC3C;AACH,KAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;AAEd,IAAA,MAAM,kBAAkB,GAAG,CAAC,YAAkB,KAAI;AAChD,QAAA,IAAI,CAAC,QAAQ;YAAE;AAEf,QAAA,MAAM,WAAW,GAAG,IAAI,YAAY,EAAE;QACtC,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AACpC,YAAA,IAAI,IAAI,CAAC,IAAI,KAAK,YAAY,CAAC,IAAI;AAAE,gBAAA,OAAO;AAC5C,YAAA,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC;AAC7B,SAAC,CAAC;AAEF,QAAA,IAAI,QAAQ,KAAR,IAAA,IAAA,QAAQ,6BAAR,QAAQ,CAAE,OAAO,EAAE;YACrB,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,WAAW,CAAC,KAAK;AAC3C;AACD,QAAA,WAAW,CAAC,WAAW,CAAC,KAAK,CAAC;AAChC,KAAC;IAED,MAAM,kBAAkB,GAAG,MAAK;;AAC9B,QAAA,IAAI,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,gDAAE,KAAK;AAAE,YAAA,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE;QACxD,WAAW,CAAC,SAAS,CAAC;AACxB,KAAC;IAED,OAAO;QACL,kBAAkB;QAClB,QAAQ;QACR,QAAQ;QACR,kBAAkB;QAClB,WAAW;QACX,QAAQ;KACT;AACH;;;;"}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
export declare const useUploadFile: () => {
|
|
3
|
-
clearFileSelection: () => void;
|
|
4
|
-
inputRef: import("react").MutableRefObject<HTMLInputElement | null>;
|
|
5
|
-
onCancel: () => void;
|
|
6
|
-
removeFileFromList: (fileToRemove: File) => void;
|
|
7
|
-
setFileList: import("react").Dispatch<import("react").SetStateAction<FileList | undefined>>;
|
|
8
|
-
fileList: FileList | undefined;
|
|
9
|
-
};
|
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
import { useRef, useState, useEffect, useCallback } from 'react';
|
|
2
|
-
|
|
3
|
-
const useUploadFile = () => {
|
|
4
|
-
const inputRef = useRef(null);
|
|
5
|
-
const [fileList, setFileList] = useState();
|
|
6
|
-
// Keep inputRef.current.files in sync with fileList
|
|
7
|
-
useEffect(() => {
|
|
8
|
-
if (inputRef.current && fileList) {
|
|
9
|
-
// Only update if not already the same (avoid unnecessary assignment)
|
|
10
|
-
if (inputRef.current.files !== fileList) {
|
|
11
|
-
const dt = new DataTransfer();
|
|
12
|
-
Array.from(fileList).forEach((file) => dt.items.add(file));
|
|
13
|
-
inputRef.current.files = dt.files;
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
// If fileList is undefined, clear the input
|
|
17
|
-
if (inputRef.current && !fileList) {
|
|
18
|
-
inputRef.current.value = '';
|
|
19
|
-
}
|
|
20
|
-
}, [fileList, inputRef]);
|
|
21
|
-
// Restores the previous file selection when user cancels the file dialog
|
|
22
|
-
const onCancel = useCallback(() => {
|
|
23
|
-
// If there are no existing files to restore, just return
|
|
24
|
-
if (!fileList || fileList.length === 0)
|
|
25
|
-
return;
|
|
26
|
-
const newFileList = new DataTransfer();
|
|
27
|
-
Array.from(fileList).forEach((file) => newFileList.items.add(file));
|
|
28
|
-
if (inputRef === null || inputRef === undefined ? undefined : inputRef.current) {
|
|
29
|
-
inputRef.current.files = newFileList.files;
|
|
30
|
-
}
|
|
31
|
-
}, [fileList]);
|
|
32
|
-
const removeFileFromList = (fileToRemove) => {
|
|
33
|
-
if (!fileList)
|
|
34
|
-
return;
|
|
35
|
-
const newFileList = new DataTransfer();
|
|
36
|
-
Array.from(fileList).forEach((file) => {
|
|
37
|
-
if (file.name === fileToRemove.name)
|
|
38
|
-
return; // Skip this file (remove it)
|
|
39
|
-
newFileList.items.add(file);
|
|
40
|
-
});
|
|
41
|
-
if (inputRef === null || inputRef === undefined ? undefined : inputRef.current) {
|
|
42
|
-
inputRef.current.files = newFileList.files;
|
|
43
|
-
}
|
|
44
|
-
setFileList(newFileList.files);
|
|
45
|
-
};
|
|
46
|
-
const clearFileSelection = () => {
|
|
47
|
-
var _a;
|
|
48
|
-
if ((_a = inputRef.current) === null || _a === undefined ? undefined : _a.value)
|
|
49
|
-
inputRef.current.value = '';
|
|
50
|
-
setFileList(undefined);
|
|
51
|
-
};
|
|
52
|
-
return {
|
|
53
|
-
clearFileSelection,
|
|
54
|
-
inputRef,
|
|
55
|
-
onCancel,
|
|
56
|
-
removeFileFromList,
|
|
57
|
-
setFileList,
|
|
58
|
-
fileList,
|
|
59
|
-
};
|
|
60
|
-
};
|
|
61
|
-
|
|
62
|
-
export { useUploadFile };
|
|
63
|
-
//# sourceMappingURL=useUploadFile.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useUploadFile.js","sources":["../../../../../src/components/UploadFile/hooks/useUploadFile/useUploadFile.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\nexport const useUploadFile = () => {\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n const [fileList, setFileList] = useState<FileList>();\n\n // Keep inputRef.current.files in sync with fileList\n useEffect(() => {\n if (inputRef.current && fileList) {\n // Only update if not already the same (avoid unnecessary assignment)\n if (inputRef.current.files !== fileList) {\n const dt = new DataTransfer();\n Array.from(fileList).forEach((file) => dt.items.add(file));\n inputRef.current.files = dt.files;\n }\n }\n // If fileList is undefined, clear the input\n if (inputRef.current && !fileList) {\n inputRef.current.value = '';\n }\n }, [fileList, inputRef]);\n\n // Restores the previous file selection when user cancels the file dialog\n const onCancel = useCallback(() => {\n // If there are no existing files to restore, just return\n if (!fileList || fileList.length === 0) return;\n\n const newFileList = new DataTransfer();\n Array.from(fileList).forEach((file) => newFileList.items.add(file));\n\n if (inputRef?.current) {\n inputRef.current.files = newFileList.files;\n }\n }, [fileList]);\n\n const removeFileFromList = (fileToRemove: File) => {\n if (!fileList) return;\n\n const newFileList = new DataTransfer();\n Array.from(fileList).forEach((file) => {\n if (file.name === fileToRemove.name) return; // Skip this file (remove it)\n newFileList.items.add(file);\n });\n\n if (inputRef?.current) {\n inputRef.current.files = newFileList.files;\n }\n setFileList(newFileList.files);\n };\n\n const clearFileSelection = () => {\n if (inputRef.current?.value) inputRef.current.value = '';\n setFileList(undefined);\n };\n\n return {\n clearFileSelection,\n inputRef,\n onCancel,\n removeFileFromList,\n setFileList,\n fileList,\n };\n};\n"],"names":[],"mappings":";;AAEO,MAAM,aAAa,GAAG,MAAK;AAChC,IAAA,MAAM,QAAQ,GAAG,MAAM,CAA0B,IAAI,CAAC;IAEtD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,EAAY;;IAGpD,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,QAAQ,CAAC,OAAO,IAAI,QAAQ,EAAE;;AAEhC,YAAA,IAAI,QAAQ,CAAC,OAAO,CAAC,KAAK,KAAK,QAAQ,EAAE;AACvC,gBAAA,MAAM,EAAE,GAAG,IAAI,YAAY,EAAE;gBAC7B,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,KAAK,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;gBAC1D,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE,CAAC,KAAK;AAClC;AACF;;AAED,QAAA,IAAI,QAAQ,CAAC,OAAO,IAAI,CAAC,QAAQ,EAAE;AACjC,YAAA,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE;AAC5B;AACH,KAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;;AAGxB,IAAA,MAAM,QAAQ,GAAG,WAAW,CAAC,MAAK;;AAEhC,QAAA,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC;YAAE;AAExC,QAAA,MAAM,WAAW,GAAG,IAAI,YAAY,EAAE;QACtC,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,KAAK,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;AAEnE,QAAA,IAAI,QAAQ,KAAR,IAAA,IAAA,QAAQ,6BAAR,QAAQ,CAAE,OAAO,EAAE;YACrB,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,WAAW,CAAC,KAAK;AAC3C;AACH,KAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;AAEd,IAAA,MAAM,kBAAkB,GAAG,CAAC,YAAkB,KAAI;AAChD,QAAA,IAAI,CAAC,QAAQ;YAAE;AAEf,QAAA,MAAM,WAAW,GAAG,IAAI,YAAY,EAAE;QACtC,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AACpC,YAAA,IAAI,IAAI,CAAC,IAAI,KAAK,YAAY,CAAC,IAAI;AAAE,gBAAA,OAAO;AAC5C,YAAA,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC;AAC7B,SAAC,CAAC;AAEF,QAAA,IAAI,QAAQ,KAAR,IAAA,IAAA,QAAQ,6BAAR,QAAQ,CAAE,OAAO,EAAE;YACrB,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,WAAW,CAAC,KAAK;AAC3C;AACD,QAAA,WAAW,CAAC,WAAW,CAAC,KAAK,CAAC;AAChC,KAAC;IAED,MAAM,kBAAkB,GAAG,MAAK;;AAC9B,QAAA,IAAI,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,gDAAE,KAAK;AAAE,YAAA,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE;QACxD,WAAW,CAAC,SAAS,CAAC;AACxB,KAAC;IAED,OAAO;QACL,kBAAkB;QAClB,QAAQ;QACR,QAAQ;QACR,kBAAkB;QAClB,WAAW;QACX,QAAQ;KACT;AACH;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { useValidateInput } from './useValidateInput';
|
|
@@ -1,85 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var React = require('react');
|
|
4
|
-
var constants = require('../../constants.cjs');
|
|
5
|
-
|
|
6
|
-
const useValidateInput = ({ fileList, fileTypes, inputRef, maxBytes, customErrorMessage, }) => {
|
|
7
|
-
// Tracks error states within the input element itself, using preset
|
|
8
|
-
// error messages and assigns these to the input component based on the file
|
|
9
|
-
const setInputValidation = React.useCallback(() => {
|
|
10
|
-
var _a, _b, _c, _d, _e;
|
|
11
|
-
let errorMessage = customErrorMessage !== null && customErrorMessage !== undefined ? customErrorMessage : constants.InputErrorStateMessages.VALID;
|
|
12
|
-
if (!((_b = (_a = inputRef.current) === null || _a === undefined ? undefined : _a.files) === null || _b === undefined ? undefined : _b.length)) {
|
|
13
|
-
(_c = inputRef.current) === null || _c === undefined ? undefined : _c.setCustomValidity(errorMessage);
|
|
14
|
-
return;
|
|
15
|
-
}
|
|
16
|
-
const results = {
|
|
17
|
-
numberOfInvalidFormatFiles: 0,
|
|
18
|
-
numberOfInvalidSizeFiles: 0,
|
|
19
|
-
totalFiles: inputRef.current.files.length,
|
|
20
|
-
};
|
|
21
|
-
Array.from(inputRef.current.files).forEach((file) => {
|
|
22
|
-
// Check file size
|
|
23
|
-
if (file.size > maxBytes) {
|
|
24
|
-
results.numberOfInvalidSizeFiles += 1;
|
|
25
|
-
}
|
|
26
|
-
// Check file type/format
|
|
27
|
-
const [, extension] = file.type.split('/');
|
|
28
|
-
const isTypeValid = fileTypes.find((validType) => validType.substring(1) === extension);
|
|
29
|
-
if (!isTypeValid) {
|
|
30
|
-
results.numberOfInvalidFormatFiles += 1;
|
|
31
|
-
}
|
|
32
|
-
});
|
|
33
|
-
// Determine appropriate error message based on validation results
|
|
34
|
-
const hasFormatErrors = results.numberOfInvalidFormatFiles > 0;
|
|
35
|
-
const hasSizeErrors = results.numberOfInvalidSizeFiles > 0;
|
|
36
|
-
const isSingleFile = results.totalFiles === 1;
|
|
37
|
-
if (hasFormatErrors && hasSizeErrors) {
|
|
38
|
-
// Both format and size errors exist
|
|
39
|
-
errorMessage = constants.InputErrorStateMessages.INVALID_FORMAT_AND_SIZE;
|
|
40
|
-
}
|
|
41
|
-
else if (hasFormatErrors && !hasSizeErrors) {
|
|
42
|
-
// Only format errors
|
|
43
|
-
if (isSingleFile) {
|
|
44
|
-
errorMessage = constants.InputErrorStateMessages.INVALID_FORMAT;
|
|
45
|
-
}
|
|
46
|
-
else {
|
|
47
|
-
errorMessage = constants.InputErrorStateMessages.INVALID_FORMATS;
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
else if (!hasFormatErrors && hasSizeErrors) {
|
|
51
|
-
// Only size errors
|
|
52
|
-
if (isSingleFile) {
|
|
53
|
-
errorMessage = constants.InputErrorStateMessages.INVALID_SIZE;
|
|
54
|
-
}
|
|
55
|
-
else {
|
|
56
|
-
errorMessage = constants.InputErrorStateMessages.INVALID_SIZES;
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
// If no errors, errorMessage remains VALID
|
|
60
|
-
(_d = inputRef.current) === null || _d === undefined ? undefined : _d.setCustomValidity(errorMessage);
|
|
61
|
-
(_e = inputRef.current) === null || _e === undefined ? undefined : _e.reportValidity();
|
|
62
|
-
}, [customErrorMessage, inputRef, maxBytes, fileTypes]);
|
|
63
|
-
// Validate input whenever fileList or the custom error message changes
|
|
64
|
-
React.useEffect(() => {
|
|
65
|
-
setInputValidation();
|
|
66
|
-
}, [fileList, setInputValidation]);
|
|
67
|
-
// Used to force a re-render when input validity changes
|
|
68
|
-
const [validationCount, setValidationCount] = React.useState(0);
|
|
69
|
-
React.useEffect(() => {
|
|
70
|
-
const ref = inputRef === null || inputRef === undefined ? undefined : inputRef.current;
|
|
71
|
-
if (!ref)
|
|
72
|
-
return () => { };
|
|
73
|
-
const handleInvalid = () => setValidationCount((v) => v + 1);
|
|
74
|
-
ref.addEventListener('invalid', handleInvalid);
|
|
75
|
-
return () => {
|
|
76
|
-
ref.removeEventListener('invalid', handleInvalid);
|
|
77
|
-
};
|
|
78
|
-
}, [inputRef]);
|
|
79
|
-
return {
|
|
80
|
-
validationCount,
|
|
81
|
-
};
|
|
82
|
-
};
|
|
83
|
-
|
|
84
|
-
exports.useValidateInput = useValidateInput;
|
|
85
|
-
//# sourceMappingURL=useValidateInput.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useValidateInput.cjs","sources":["../../../../../src/components/UploadFile/hooks/useValidateInput/useValidateInput.ts"],"sourcesContent":["import { useEffect, useCallback, useState } from 'react';\nimport { AcceptedFileTypes, InputErrorStateMessages } from '../../constants';\n\ntype UseValidateInputProps = {\n fileTypes: Array<AcceptedFileTypes>;\n maxBytes: number;\n fileList: FileList | undefined;\n inputRef: React.MutableRefObject<HTMLInputElement | null>;\n customErrorMessage?: string;\n};\n\nexport const useValidateInput = ({\n fileList,\n fileTypes,\n inputRef,\n maxBytes,\n customErrorMessage,\n}: UseValidateInputProps) => {\n // Tracks error states within the input element itself, using preset\n // error messages and assigns these to the input component based on the file\n const setInputValidation = useCallback(() => {\n let errorMessage = customErrorMessage ?? InputErrorStateMessages.VALID;\n\n if (!inputRef.current?.files?.length) {\n inputRef.current?.setCustomValidity(errorMessage);\n return;\n }\n\n const results = {\n numberOfInvalidFormatFiles: 0,\n numberOfInvalidSizeFiles: 0,\n totalFiles: inputRef.current.files.length,\n };\n\n Array.from(inputRef.current.files).forEach((file) => {\n // Check file size\n if (file.size > maxBytes) {\n results.numberOfInvalidSizeFiles += 1;\n }\n\n // Check file type/format\n const [, extension] = file.type.split('/');\n const isTypeValid = fileTypes.find((validType) => validType.substring(1) === extension);\n if (!isTypeValid) {\n results.numberOfInvalidFormatFiles += 1;\n }\n });\n\n // Determine appropriate error message based on validation results\n const hasFormatErrors = results.numberOfInvalidFormatFiles > 0;\n const hasSizeErrors = results.numberOfInvalidSizeFiles > 0;\n const isSingleFile = results.totalFiles === 1;\n\n if (hasFormatErrors && hasSizeErrors) {\n // Both format and size errors exist\n errorMessage = InputErrorStateMessages.INVALID_FORMAT_AND_SIZE;\n } else if (hasFormatErrors && !hasSizeErrors) {\n // Only format errors\n if (isSingleFile) {\n errorMessage = InputErrorStateMessages.INVALID_FORMAT;\n } else {\n errorMessage = InputErrorStateMessages.INVALID_FORMATS;\n }\n } else if (!hasFormatErrors && hasSizeErrors) {\n // Only size errors\n if (isSingleFile) {\n errorMessage = InputErrorStateMessages.INVALID_SIZE;\n } else {\n errorMessage = InputErrorStateMessages.INVALID_SIZES;\n }\n }\n // If no errors, errorMessage remains VALID\n\n inputRef.current?.setCustomValidity(errorMessage);\n inputRef.current?.reportValidity();\n }, [customErrorMessage, inputRef, maxBytes, fileTypes]);\n\n // Validate input whenever fileList or the custom error message changes\n useEffect(() => {\n setInputValidation();\n }, [fileList, setInputValidation]);\n\n // Used to force a re-render when input validity changes\n const [validationCount, setValidationCount] = useState(0);\n\n useEffect(() => {\n const ref = inputRef?.current;\n if (!ref) return () => {};\n const handleInvalid = () => setValidationCount((v) => v + 1);\n ref.addEventListener('invalid', handleInvalid);\n return () => {\n ref.removeEventListener('invalid', handleInvalid);\n };\n }, [inputRef]);\n\n return {\n validationCount,\n };\n};\n"],"names":["useCallback","InputErrorStateMessages","useEffect","useState"],"mappings":";;;;;AAWa,MAAA,gBAAgB,GAAG,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,kBAAkB,GACI,KAAI;;;AAG1B,IAAA,MAAM,kBAAkB,GAAGA,iBAAW,CAAC,MAAK;;QAC1C,IAAI,YAAY,GAAG,kBAAkB,KAAlB,IAAA,IAAA,kBAAkB,KAAlB,SAAA,GAAA,kBAAkB,GAAIC,iCAAuB,CAAC,KAAK;AAEtE,QAAA,IAAI,EAAC,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,MAAM,CAAA,EAAE;YACpC,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,iBAAiB,CAAC,YAAY,CAAC;YACjD;AACD;AAED,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,0BAA0B,EAAE,CAAC;AAC7B,YAAA,wBAAwB,EAAE,CAAC;AAC3B,YAAA,UAAU,EAAE,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM;SAC1C;AAED,QAAA,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;;AAElD,YAAA,IAAI,IAAI,CAAC,IAAI,GAAG,QAAQ,EAAE;AACxB,gBAAA,OAAO,CAAC,wBAAwB,IAAI,CAAC;AACtC;;AAGD,YAAA,MAAM,GAAG,SAAS,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YAC1C,MAAM,WAAW,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC;YACvF,IAAI,CAAC,WAAW,EAAE;AAChB,gBAAA,OAAO,CAAC,0BAA0B,IAAI,CAAC;AACxC;AACH,SAAC,CAAC;;AAGF,QAAA,MAAM,eAAe,GAAG,OAAO,CAAC,0BAA0B,GAAG,CAAC;AAC9D,QAAA,MAAM,aAAa,GAAG,OAAO,CAAC,wBAAwB,GAAG,CAAC;AAC1D,QAAA,MAAM,YAAY,GAAG,OAAO,CAAC,UAAU,KAAK,CAAC;QAE7C,IAAI,eAAe,IAAI,aAAa,EAAE;;AAEpC,YAAA,YAAY,GAAGA,iCAAuB,CAAC,uBAAuB;AAC/D;AAAM,aAAA,IAAI,eAAe,IAAI,CAAC,aAAa,EAAE;;AAE5C,YAAA,IAAI,YAAY,EAAE;AAChB,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,cAAc;AACtD;AAAM,iBAAA;AACL,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,eAAe;AACvD;AACF;AAAM,aAAA,IAAI,CAAC,eAAe,IAAI,aAAa,EAAE;;AAE5C,YAAA,IAAI,YAAY,EAAE;AAChB,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,YAAY;AACpD;AAAM,iBAAA;AACL,gBAAA,YAAY,GAAGA,iCAAuB,CAAC,aAAa;AACrD;AACF;;QAGD,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,iBAAiB,CAAC,YAAY,CAAC;AACjD,QAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAE,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAA,cAAc,EAAE;KACnC,EAAE,CAAC,kBAAkB,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;;IAGvDC,eAAS,CAAC,MAAK;AACb,QAAA,kBAAkB,EAAE;AACtB,KAAC,EAAE,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAAC;;IAGlC,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAGC,cAAQ,CAAC,CAAC,CAAC;IAEzDD,eAAS,CAAC,MAAK;QACb,MAAM,GAAG,GAAG,QAAQ,KAAA,IAAA,IAAR,QAAQ,KAAR,SAAA,GAAA,SAAA,GAAA,QAAQ,CAAE,OAAO;AAC7B,QAAA,IAAI,CAAC,GAAG;AAAE,YAAA,OAAO,MAAO,GAAC;AACzB,QAAA,MAAM,aAAa,GAAG,MAAM,kBAAkB,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;AAC5D,QAAA,GAAG,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,CAAC;AAC9C,QAAA,OAAO,MAAK;AACV,YAAA,GAAG,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC;AACnD,SAAC;AACH,KAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IAEd,OAAO;QACL,eAAe;KAChB;AACH;;;;"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { AcceptedFileTypes } from '../../constants';
|
|
3
|
-
type UseValidateInputProps = {
|
|
4
|
-
fileTypes: Array<AcceptedFileTypes>;
|
|
5
|
-
maxBytes: number;
|
|
6
|
-
fileList: FileList | undefined;
|
|
7
|
-
inputRef: React.MutableRefObject<HTMLInputElement | null>;
|
|
8
|
-
customErrorMessage?: string;
|
|
9
|
-
};
|
|
10
|
-
export declare const useValidateInput: ({ fileList, fileTypes, inputRef, maxBytes, customErrorMessage, }: UseValidateInputProps) => {
|
|
11
|
-
validationCount: number;
|
|
12
|
-
};
|
|
13
|
-
export {};
|
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
import { useCallback, useEffect, useState } from 'react';
|
|
2
|
-
import { InputErrorStateMessages } from '../../constants.js';
|
|
3
|
-
|
|
4
|
-
const useValidateInput = ({ fileList, fileTypes, inputRef, maxBytes, customErrorMessage, }) => {
|
|
5
|
-
// Tracks error states within the input element itself, using preset
|
|
6
|
-
// error messages and assigns these to the input component based on the file
|
|
7
|
-
const setInputValidation = useCallback(() => {
|
|
8
|
-
var _a, _b, _c, _d, _e;
|
|
9
|
-
let errorMessage = customErrorMessage !== null && customErrorMessage !== undefined ? customErrorMessage : InputErrorStateMessages.VALID;
|
|
10
|
-
if (!((_b = (_a = inputRef.current) === null || _a === undefined ? undefined : _a.files) === null || _b === undefined ? undefined : _b.length)) {
|
|
11
|
-
(_c = inputRef.current) === null || _c === undefined ? undefined : _c.setCustomValidity(errorMessage);
|
|
12
|
-
return;
|
|
13
|
-
}
|
|
14
|
-
const results = {
|
|
15
|
-
numberOfInvalidFormatFiles: 0,
|
|
16
|
-
numberOfInvalidSizeFiles: 0,
|
|
17
|
-
totalFiles: inputRef.current.files.length,
|
|
18
|
-
};
|
|
19
|
-
Array.from(inputRef.current.files).forEach((file) => {
|
|
20
|
-
// Check file size
|
|
21
|
-
if (file.size > maxBytes) {
|
|
22
|
-
results.numberOfInvalidSizeFiles += 1;
|
|
23
|
-
}
|
|
24
|
-
// Check file type/format
|
|
25
|
-
const [, extension] = file.type.split('/');
|
|
26
|
-
const isTypeValid = fileTypes.find((validType) => validType.substring(1) === extension);
|
|
27
|
-
if (!isTypeValid) {
|
|
28
|
-
results.numberOfInvalidFormatFiles += 1;
|
|
29
|
-
}
|
|
30
|
-
});
|
|
31
|
-
// Determine appropriate error message based on validation results
|
|
32
|
-
const hasFormatErrors = results.numberOfInvalidFormatFiles > 0;
|
|
33
|
-
const hasSizeErrors = results.numberOfInvalidSizeFiles > 0;
|
|
34
|
-
const isSingleFile = results.totalFiles === 1;
|
|
35
|
-
if (hasFormatErrors && hasSizeErrors) {
|
|
36
|
-
// Both format and size errors exist
|
|
37
|
-
errorMessage = InputErrorStateMessages.INVALID_FORMAT_AND_SIZE;
|
|
38
|
-
}
|
|
39
|
-
else if (hasFormatErrors && !hasSizeErrors) {
|
|
40
|
-
// Only format errors
|
|
41
|
-
if (isSingleFile) {
|
|
42
|
-
errorMessage = InputErrorStateMessages.INVALID_FORMAT;
|
|
43
|
-
}
|
|
44
|
-
else {
|
|
45
|
-
errorMessage = InputErrorStateMessages.INVALID_FORMATS;
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
else if (!hasFormatErrors && hasSizeErrors) {
|
|
49
|
-
// Only size errors
|
|
50
|
-
if (isSingleFile) {
|
|
51
|
-
errorMessage = InputErrorStateMessages.INVALID_SIZE;
|
|
52
|
-
}
|
|
53
|
-
else {
|
|
54
|
-
errorMessage = InputErrorStateMessages.INVALID_SIZES;
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
// If no errors, errorMessage remains VALID
|
|
58
|
-
(_d = inputRef.current) === null || _d === undefined ? undefined : _d.setCustomValidity(errorMessage);
|
|
59
|
-
(_e = inputRef.current) === null || _e === undefined ? undefined : _e.reportValidity();
|
|
60
|
-
}, [customErrorMessage, inputRef, maxBytes, fileTypes]);
|
|
61
|
-
// Validate input whenever fileList or the custom error message changes
|
|
62
|
-
useEffect(() => {
|
|
63
|
-
setInputValidation();
|
|
64
|
-
}, [fileList, setInputValidation]);
|
|
65
|
-
// Used to force a re-render when input validity changes
|
|
66
|
-
const [validationCount, setValidationCount] = useState(0);
|
|
67
|
-
useEffect(() => {
|
|
68
|
-
const ref = inputRef === null || inputRef === undefined ? undefined : inputRef.current;
|
|
69
|
-
if (!ref)
|
|
70
|
-
return () => { };
|
|
71
|
-
const handleInvalid = () => setValidationCount((v) => v + 1);
|
|
72
|
-
ref.addEventListener('invalid', handleInvalid);
|
|
73
|
-
return () => {
|
|
74
|
-
ref.removeEventListener('invalid', handleInvalid);
|
|
75
|
-
};
|
|
76
|
-
}, [inputRef]);
|
|
77
|
-
return {
|
|
78
|
-
validationCount,
|
|
79
|
-
};
|
|
80
|
-
};
|
|
81
|
-
|
|
82
|
-
export { useValidateInput };
|
|
83
|
-
//# sourceMappingURL=useValidateInput.js.map
|