jattac.libs.web.zest-file-upload 0.3.0 → 0.3.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/index.cjs.js +4 -4
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +4 -4
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -33,8 +33,8 @@ function styleInject(css, ref) {
|
|
|
33
33
|
}
|
|
34
34
|
}
|
|
35
35
|
|
|
36
|
-
var css_248z$1 = ".FileUpload-module_fileUploadContainer__Wy-Up {\n display: flex;\n flex-direction: column;\n margin: 20px 0;\n}\n\n.FileUpload-module_label__nLqx4 {\n margin-bottom: 8px;\n font-size: 16px;\n color: #333;\n}\n\n.FileUpload-module_fileInputContainer__MfXbf {\n display: flex;\n align-items: center;\n cursor: pointer;\n border: 2px dashed;\n border-color: var(--color-primary);\n border-radius: 8px;\n padding: 30px 30px;\n background-color: #fff;\n transition: background-color 0.25s ease, box-shadow 0.25s ease;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);\n}\n\n.FileUpload-module_disabled__FtUd7 {\n cursor: not-allowed;\n opacity: 0.5;\n pointer-events: none;\n}\n\n.FileUpload-module_fileInputContainer__MfXbf:hover {\n background-color: #f7f7f7;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n}\n\n.FileUpload-module_fileInput__ns8S- {\n display: none; /* Keep input hidden */\n}\n\n.FileUpload-module_fileName__h7Ij- {\n flex: 1;\n padding: 12px;\n border: 1px solid transparent; /* Added to maintain focus effect */\n color: #444;\n font-size: 16px;\n font-family: \"Arial\", sans-serif;\n transition: border-color 0.2s ease;\n text-align: center;\n}\n\n.FileUpload-module_visibleElements__JqQ1- {\n display: flex;\n flex-direction: row;\n gap: 10px;\n cursor: \"pointer\";\n border-radius: 5px;\n justify-content: center;\n align-items: center;\n width: 100%;\n}\n\n.FileUpload-module_visibleElements__JqQ1-:hover {\n color: var(--color-primary);\n font-weight: bold;\n}\n\n.FileUpload-module_fileName__h7Ij-:focus {\n outline: none;\n border-color: #2980b9; /* A sharper blue for focus */\n}\n\n.FileUpload-module_fileName__h7Ij-::placeholder {\n color: #999; /* Subtle placeholder color */\n}\n\n/* Progress dialog styles */\n.FileUpload-module_progressDialog__agLef {\n margin-top: 12px;\n width: 100%;\n background-color: #f7f7f7;\n border-radius: 8px;\n padding: 8px;\n}\n\n.FileUpload-module_progressBar__kePxX {\n width: 100%;\n background-color: #ddd;\n border-radius: 4px;\n overflow: hidden;\n}\n\n.FileUpload-module_progressFill__A00Zx {\n height: 10px;\n background-color: #2980b9; /* Blue color for progress fill */\n transition: width 0.25s ease;\n}\n\n/* Status message styling */\n.FileUpload-module_statusMessage__LMpk4 {\n margin-top: 12px;\n font-size: 16px;\n color: #2980b9;\n font-weight: bold;\n text-align: right;\n transition: opacity 0.5s ease, transform 0.5s ease;\n}\n\n/* Success animation for 'complete' status */\n.FileUpload-module_successAnimation__X-AGb {\n animation: FileUpload-module_fadeIn__U5yc7 0.5s ease;\n}\n\n/* Keyframe for fade-in effect */\n@keyframes FileUpload-module_fadeIn__U5yc7 {\n from {\n opacity: 0;\n transform: translateY(10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n/* Keyframe for error shake effect */\n@keyframes FileUpload-module_shake__xDhrR {\n 0%, 100% { transform: translateX(0); }\n 10%, 30%, 50%, 70%, 90% { transform: translateX(-5px); }\n 20%, 40%, 60%, 80% { transform: translateX(5px); }\n}\n\n/* Error animation */\n.FileUpload-module_errorAnimation__DSUBA {\n animation: FileUpload-module_shake__xDhrR 0.5s ease;\n color: #dc3545;\n}\n\n/* Style changes when dragging over the drop area */\n.FileUpload-module_fileInputContainer__MfXbf.FileUpload-module_dragOver__Saj5O {\n background-color: #eaf2f8;\n border-color: #2980b9;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n}\n\n/* ============================================================================\n// MOBILE BUTTONS - Delightful UI with joyous colors & dopamine effects\n// ============================================================================ */\n\n/* Pulse animation for mobile - subtle attention grabber */\n@keyframes FileUpload-module_cameraPulse__RQDx7 {\n 0%, 100% {\n box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.4);\n }\n 50% {\n box-shadow: 0 0 0 8px rgba(139, 92, 246, 0);\n }\n}\n\n/* Mobile buttons container - vertical column - stretches to fill space */\n.FileUpload-module_mobileButtons__stjus {\n display: none;\n flex-direction: column;\n gap: 12px;\n width: 100%;\n min-height: 120px;\n flex: 1;\n justify-content: center;\n}\n\n/* Individual mobile button - stretch to fill available space */\n.FileUpload-module_mobileButton__9LmQC {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n width: 100%;\n flex: 1;\n padding: 16px 20px;\n background: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 100%);\n color: white;\n font-size: 16px;\n font-weight: 600;\n border: none;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.FileUpload-module_mobileButton__9LmQC:hover:not(:disabled) {\n background: linear-gradient(135deg, #7C3AED 0%, #6D28D9 100%);\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(139, 92, 246, 0.4);\n}\n\n.FileUpload-module_mobileButton__9LmQC:active:not(:disabled) {\n transform: scale(0.95);\n}\n\n.FileUpload-module_mobileButton__9LmQC:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n/* Show mobile buttons on mobile/tablet only, hide desktop text */\n@media (pointer: coarse), (max-width: 1024px) {\n .FileUpload-module_mobileButtons__stjus {\n display: flex;\n animation: FileUpload-module_cameraPulse__RQDx7 2s ease-in-out infinite;\n }\n .FileUpload-module_visibleElements__JqQ1- {\n display: none;\n }\n}\n\n/* ============================================================================\n// PHASE 4: IN-APP CAMERA PREVIEW - Delightful UI with joyous colors\n// ============================================================================ */\n\n/* Camera Preview Container */\n.FileUpload-module_cameraPreview__y5Hpw {\n position: relative;\n width: 100%;\n aspect-ratio: 3 / 4;\n max-height: 400px;\n background: #000;\n border-radius: 12px;\n overflow: hidden;\n margin-top: 12px;\n}\n\n/* Video Element */\n.FileUpload-module_cameraVideo__k8kfy {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/* Camera Controls Bar */\n.FileUpload-module_cameraControls__EAT-W {\n position: absolute;\n top: 12px;\n left: 0;\n right: 0;\n display: flex;\n justify-content: space-between;\n padding: 0 16px;\n z-index: 10;\n}\n\n.FileUpload-module_cameraControlBtn__vq5ab {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 42px;\n height: 42px;\n background: rgba(0, 0, 0, 0.5);\n backdrop-filter: blur(8px);\n border: none;\n border-radius: 50%;\n color: white;\n font-size: 20px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.FileUpload-module_cameraControlBtn__vq5ab:hover {\n background: rgba(0, 0, 0, 0.7);\n transform: scale(1.1);\n}\n\n.FileUpload-module_cameraControlBtn__vq5ab:active {\n transform: scale(0.95);\n}\n\n/* Capture Button */\n.FileUpload-module_captureBtn__7Y0Yi {\n position: absolute;\n bottom: 32px;\n left: 50%;\n transform: translateX(-50%);\n width: 72px;\n height: 72px;\n background: transparent;\n border: 4px solid white;\n border-radius: 50%;\n cursor: pointer;\n transition: all 0.2s ease;\n z-index: 100;\n touch-action: manipulation;\n -webkit-tap-highlight-color: transparent;\n}\n\n.FileUpload-module_captureBtnInner__3fzVL {\n width: 100%;\n height: 100%;\n background: white;\n border-radius: 50%;\n transition: all 0.2s ease;\n}\n\n.FileUpload-module_captureBtn__7Y0Yi:hover .FileUpload-module_captureBtnInner__3fzVL {\n transform: scale(0.9);\n}\n\n.FileUpload-module_captureBtn__7Y0Yi:active .FileUpload-module_captureBtnInner__3fzVL {\n transform: scale(0.8);\n background: #8B5CF6;\n}\n\n/* Captured Preview */\n.FileUpload-module_capturedPreview__8sCVd {\n width: 100%;\n aspect-ratio: 3 / 4;\n max-height: 400px;\n border-radius: 12px;\n overflow: hidden;\n margin-top: 12px;\n background: #000;\n}\n\n.FileUpload-module_capturedImage__0XlUC {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/* Captured Actions (Retake / Confirm) */\n.FileUpload-module_capturedActions__7zsfS {\n position: absolute;\n bottom: 24px;\n left: 0;\n right: 0;\n display: flex;\n justify-content: center;\n gap: 24px;\n padding: 0 16px;\n}\n\n.FileUpload-module_retakeBtn__ztglf,\n.FileUpload-module_confirmBtn__RJpS- {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 24px;\n border: none;\n border-radius: 24px;\n font-size: 14px;\n font-weight: 600;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.FileUpload-module_retakeBtn__ztglf {\n background: rgba(255, 255, 255, 0.2);\n backdrop-filter: blur(8px);\n color: white;\n}\n\n.FileUpload-module_retakeBtn__ztglf:hover {\n background: rgba(255, 255, 255, 0.3);\n}\n\n.FileUpload-module_confirmBtn__RJpS- {\n background: linear-gradient(135deg, #10B981 0%, #059669 100%);\n color: white;\n}\n\n.FileUpload-module_confirmBtn__RJpS-:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);\n}\n\n/* Camera Error */\n.FileUpload-module_cameraError__DwVo- {\n margin-top: 8px;\n padding: 12px;\n background: #FEF2F2;\n border: 1px solid #FECACA;\n border-radius: 8px;\n color: #DC2626;\n font-size: 14px;\n text-align: center;\n}\n\n/* Screen Flash Animation (capture moment) */\n@keyframes FileUpload-module_screenFlash__xu1rw {\n 0% { opacity: 0; }\n 50% { opacity: 1; background: white; }\n 100% { opacity: 0; }\n}\n\n.FileUpload-module_screenFlash__xu1rw {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: white;\n animation: FileUpload-module_screenFlash__xu1rw 0.3s ease-out;\n pointer-events: none;\n z-index: 200;\n}\n\n.FileUpload-module_errorMessage__AXjcm {\n margin-top: 8px;\n padding: 12px;\n border: 1px solid #dc3545;\n background: #fff5f5;\n border-radius: 8px;\n color: #dc3545;\n font-size: 14px;\n text-align: center;\n}\n\n.FileUpload-module_retryBtn__4lm-y {\n margin-left: 12px;\n padding: 4px 14px;\n background: #dc3545;\n color: #fff;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n font-size: 13px;\n font-weight: 600;\n transition: background 0.2s ease;\n}\n\n.FileUpload-module_retryBtn__4lm-y:hover {\n background: #b02a37;\n}\n\n@keyframes FileUpload-module_loadingPulse__CS4Se {\n 0%, 100% { opacity: 0.6; transform: scale(1); }\n 50% { opacity: 1; transform: scale(1.05); }\n}\n\n.FileUpload-module_cameraLoading__T-SW4 {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n background: #1a1a2e;\n color: #fff;\n font-size: 48px;\n animation: FileUpload-module_loadingPulse__CS4Se 1.5s ease-in-out infinite;\n}\n\n/* Crop container for react-cropper (Cropper.js) */\n.FileUpload-module_cropContainer__J3-11 {\n position: relative;\n width: 100%;\n height: 420px;\n margin-top: 12px;\n border-radius: 12px;\n overflow: hidden;\n background: #000;\n}\n\n.FileUpload-module_zoomSlider__TlqRu {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-top: 10px;\n padding: 0 4px;\n}\n\n.FileUpload-module_zoomRange__GXX68 {\n flex: 1;\n accent-color: #6c63ff;\n cursor: pointer;\n}\n\n.FileUpload-module_zoomBtn__pah4b {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n border: 1px solid #6c63ff;\n background: transparent;\n color: #6c63ff;\n font-size: 18px;\n cursor: pointer;\n line-height: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.FileUpload-module_zoomBtn__pah4b:hover {\n background: #6c63ff;\n color: #fff;\n}\n\n/* ============================================================================\n MULTI-FILE QUEUE — Delightful parallel upload UX\n ============================================================================ */\n\n@keyframes FileUpload-module_slideInRow__COE9n {\n from { opacity: 0; transform: translateY(-8px); }\n to { opacity: 1; transform: translateY(0); }\n}\n\n@keyframes FileUpload-module_popCheck__NQqID {\n 0% { transform: scale(0.5); opacity: 0; }\n 70% { transform: scale(1.15); }\n 100% { transform: scale(1); opacity: 1; }\n}\n\n@keyframes FileUpload-module_progressShimmer__jOjnv {\n 0% { transform: translateX(-100%); }\n 100% { transform: translateX(200%); }\n}\n\n@keyframes FileUpload-module_completePulse__IyePh {\n 0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }\n 50% { box-shadow: 0 0 0 6px rgba(16, 185, 129, 0.2); }\n}\n\n/* Drop zone — compact variant when queue already has entries */\n.FileUpload-module_multiDropZoneCompact__9CFq- {\n padding: 14px 30px;\n min-height: 56px;\n}\n\n/* File queue list */\n.FileUpload-module_fileList__NYlEu {\n list-style: none;\n margin: 12px 0 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n/* File row: grid layout — meta | badge | actions on row 1, progress on row 2 */\n.FileUpload-module_fileRow__1Fxul {\n display: grid;\n grid-template-columns: 1fr auto auto;\n grid-template-rows: auto auto;\n gap: 6px 12px;\n align-items: center;\n padding: 10px 14px;\n border: 1px solid #e5e7eb;\n border-left: 3px solid #9ca3af;\n border-radius: 8px;\n background: #fff;\n animation: FileUpload-module_slideInRow__COE9n 0.25s ease both;\n transition: border-color 0.2s ease, box-shadow 0.2s ease;\n}\n\n.FileUpload-module_fileRow_pending__pdNXE { border-left-color: #9ca3af; }\n.FileUpload-module_fileRow_uploading__MuNwL { border-left-color: #2980b9; }\n.FileUpload-module_fileRow_complete__zkAqi { border-left-color: #10b981; animation: FileUpload-module_completePulse__IyePh 0.6s ease; }\n.FileUpload-module_fileRow_error__ShiDk { border-left-color: #dc3545; animation: FileUpload-module_shake__xDhrR 0.5s ease; }\n\n/* File name and size */\n.FileUpload-module_fileRowMeta__zufyo {\n grid-column: 1;\n grid-row: 1;\n min-width: 0;\n}\n\n.FileUpload-module_fileRowFilename__4fIwi {\n display: block;\n font-size: 14px;\n font-weight: 500;\n color: #1f2937;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.FileUpload-module_fileRowSize__qTRVw {\n display: block;\n font-size: 12px;\n color: #6b7280;\n margin-top: 1px;\n}\n\n/* Status badge */\n.FileUpload-module_fileRowBadge__o6z-- {\n grid-column: 2;\n grid-row: 1;\n font-size: 11px;\n font-weight: 600;\n padding: 2px 9px;\n border-radius: 999px;\n white-space: nowrap;\n}\n\n.FileUpload-module_badge_pending__xQGJ0 { background: #f3f4f6; color: #6b7280; }\n.FileUpload-module_badge_uploading__8WaRF { background: #dbeafe; color: #1d4ed8; }\n.FileUpload-module_badge_complete__9nfZB { background: #d1fae5; color: #065f46; animation: FileUpload-module_popCheck__NQqID 0.4s ease; }\n.FileUpload-module_badge_error__2vDFn { background: #fee2e2; color: #991b1b; }\n\n/* Per-file progress bar — spans full width below the row header */\n.FileUpload-module_fileRowProgress__nR0ef {\n grid-column: 1 / -1;\n grid-row: 2;\n height: 3px;\n background: #e5e7eb;\n border-radius: 2px;\n overflow: hidden;\n}\n\n.FileUpload-module_fileRowProgressFill__WNeLC {\n height: 100%;\n background: #2980b9;\n border-radius: 2px;\n transition: width 0.25s ease;\n}\n\n.FileUpload-module_fileRowProgressIndeterminate__CThl- {\n height: 100%;\n width: 40%;\n background: linear-gradient(90deg, transparent, #2980b9, transparent);\n animation: FileUpload-module_progressShimmer__jOjnv 1.2s ease-in-out infinite;\n}\n\n/* Action buttons */\n.FileUpload-module_fileRowActions__5gWBm {\n grid-column: 3;\n grid-row: 1;\n display: flex;\n gap: 6px;\n align-items: center;\n}\n\n.FileUpload-module_removeFileBtn__M5al4 {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 26px;\n height: 26px;\n border: none;\n border-radius: 6px;\n background: transparent;\n color: #9ca3af;\n cursor: pointer;\n transition: background 0.15s ease, color 0.15s ease;\n}\n\n.FileUpload-module_removeFileBtn__M5al4:hover {\n background: #fee2e2;\n color: #dc3545;\n}\n\n.FileUpload-module_retryFileBtn__HOpA7 {\n font-size: 11px;\n font-weight: 600;\n padding: 3px 10px;\n border: 1px solid #dc3545;\n border-radius: 4px;\n background: transparent;\n color: #dc3545;\n cursor: pointer;\n transition: background 0.15s ease, color 0.15s ease;\n}\n\n.FileUpload-module_retryFileBtn__HOpA7:hover {\n background: #dc3545;\n color: #fff;\n}\n\n/* Clear all button */\n.FileUpload-module_clearAllBtn__v3oMP {\n margin-top: 8px;\n align-self: flex-end;\n padding: 5px 14px;\n font-size: 12px;\n font-weight: 500;\n color: #6b7280;\n background: transparent;\n border: 1px solid #e5e7eb;\n border-radius: 6px;\n cursor: pointer;\n transition: border-color 0.15s ease, color 0.15s ease;\n}\n\n.FileUpload-module_clearAllBtn__v3oMP:hover {\n border-color: #dc3545;\n color: #dc3545;\n}\n";
|
|
37
|
-
var styles = {"fileUploadContainer":"FileUpload-module_fileUploadContainer__Wy-Up","label":"FileUpload-module_label__nLqx4","fileInputContainer":"FileUpload-module_fileInputContainer__MfXbf","disabled":"FileUpload-module_disabled__FtUd7","fileInput":"FileUpload-module_fileInput__ns8S-","fileName":"FileUpload-module_fileName__h7Ij-","visibleElements":"FileUpload-module_visibleElements__JqQ1-","progressDialog":"FileUpload-module_progressDialog__agLef","progressBar":"FileUpload-module_progressBar__kePxX","progressFill":"FileUpload-module_progressFill__A00Zx","statusMessage":"FileUpload-module_statusMessage__LMpk4","successAnimation":"FileUpload-module_successAnimation__X-AGb","fadeIn":"FileUpload-module_fadeIn__U5yc7","errorAnimation":"FileUpload-module_errorAnimation__DSUBA","shake":"FileUpload-module_shake__xDhrR","dragOver":"FileUpload-module_dragOver__Saj5O","mobileButtons":"FileUpload-module_mobileButtons__stjus","mobileButton":"FileUpload-module_mobileButton__9LmQC","cameraPulse":"FileUpload-module_cameraPulse__RQDx7","cameraPreview":"FileUpload-module_cameraPreview__y5Hpw","cameraVideo":"FileUpload-module_cameraVideo__k8kfy","cameraControls":"FileUpload-module_cameraControls__EAT-W","cameraControlBtn":"FileUpload-module_cameraControlBtn__vq5ab","captureBtn":"FileUpload-module_captureBtn__7Y0Yi","captureBtnInner":"FileUpload-module_captureBtnInner__3fzVL","capturedPreview":"FileUpload-module_capturedPreview__8sCVd","capturedImage":"FileUpload-module_capturedImage__0XlUC","capturedActions":"FileUpload-module_capturedActions__7zsfS","retakeBtn":"FileUpload-module_retakeBtn__ztglf","confirmBtn":"FileUpload-module_confirmBtn__RJpS-","cameraError":"FileUpload-module_cameraError__DwVo-","screenFlash":"FileUpload-module_screenFlash__xu1rw","errorMessage":"FileUpload-module_errorMessage__AXjcm","retryBtn":"FileUpload-module_retryBtn__4lm-y","cameraLoading":"FileUpload-module_cameraLoading__T-SW4","loadingPulse":"FileUpload-module_loadingPulse__CS4Se","cropContainer":"FileUpload-module_cropContainer__J3-11","zoomSlider":"FileUpload-module_zoomSlider__TlqRu","zoomRange":"FileUpload-module_zoomRange__GXX68","zoomBtn":"FileUpload-module_zoomBtn__pah4b","multiDropZoneCompact":"FileUpload-module_multiDropZoneCompact__9CFq-","fileList":"FileUpload-module_fileList__NYlEu","fileRow":"FileUpload-module_fileRow__1Fxul","slideInRow":"FileUpload-module_slideInRow__COE9n","fileRow_pending":"FileUpload-module_fileRow_pending__pdNXE","fileRow_uploading":"FileUpload-module_fileRow_uploading__MuNwL","fileRow_complete":"FileUpload-module_fileRow_complete__zkAqi","completePulse":"FileUpload-module_completePulse__IyePh","fileRow_error":"FileUpload-module_fileRow_error__ShiDk","fileRowMeta":"FileUpload-module_fileRowMeta__zufyo","fileRowFilename":"FileUpload-module_fileRowFilename__4fIwi","fileRowSize":"FileUpload-module_fileRowSize__qTRVw","fileRowBadge":"FileUpload-module_fileRowBadge__o6z--","badge_pending":"FileUpload-module_badge_pending__xQGJ0","badge_uploading":"FileUpload-module_badge_uploading__8WaRF","badge_complete":"FileUpload-module_badge_complete__9nfZB","popCheck":"FileUpload-module_popCheck__NQqID","badge_error":"FileUpload-module_badge_error__2vDFn","fileRowProgress":"FileUpload-module_fileRowProgress__nR0ef","fileRowProgressFill":"FileUpload-module_fileRowProgressFill__WNeLC","fileRowProgressIndeterminate":"FileUpload-module_fileRowProgressIndeterminate__CThl-","progressShimmer":"FileUpload-module_progressShimmer__jOjnv","fileRowActions":"FileUpload-module_fileRowActions__5gWBm","removeFileBtn":"FileUpload-module_removeFileBtn__M5al4","retryFileBtn":"FileUpload-module_retryFileBtn__HOpA7","clearAllBtn":"FileUpload-module_clearAllBtn__v3oMP"};
|
|
36
|
+
var css_248z$1 = ".FileUpload-module_fileUploadContainer__Wy-Up {\n display: flex;\n flex-direction: column;\n margin: 20px 0;\n}\n\n.FileUpload-module_label__nLqx4 {\n margin-bottom: 8px;\n font-size: 16px;\n color: #333;\n}\n\n.FileUpload-module_fileInputContainer__MfXbf {\n display: flex;\n align-items: center;\n cursor: pointer;\n border: 2px dashed;\n border-color: var(--color-primary);\n border-radius: 8px;\n padding: 30px 30px;\n background-color: #fff;\n transition: background-color 0.25s ease, box-shadow 0.25s ease;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);\n}\n\n.FileUpload-module_disabled__FtUd7 {\n cursor: not-allowed;\n opacity: 0.5;\n pointer-events: none;\n}\n\n.FileUpload-module_fileInputContainer__MfXbf:hover {\n background-color: #f7f7f7;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n}\n\n.FileUpload-module_fileInput__ns8S- {\n display: none; /* Keep input hidden */\n}\n\n.FileUpload-module_fileName__h7Ij- {\n flex: 1;\n padding: 12px;\n border: 1px solid transparent; /* Added to maintain focus effect */\n color: #444;\n font-size: 16px;\n font-family: \"Arial\", sans-serif;\n transition: border-color 0.2s ease;\n text-align: center;\n}\n\n.FileUpload-module_visibleElements__JqQ1- {\n display: flex;\n flex-direction: row;\n gap: 10px;\n cursor: \"pointer\";\n border-radius: 5px;\n justify-content: center;\n align-items: center;\n width: 100%;\n}\n\n.FileUpload-module_visibleElements__JqQ1-:hover {\n color: var(--color-primary);\n font-weight: bold;\n}\n\n.FileUpload-module_fileName__h7Ij-:focus {\n outline: none;\n border-color: #2980b9; /* A sharper blue for focus */\n}\n\n.FileUpload-module_fileName__h7Ij-::placeholder {\n color: #999; /* Subtle placeholder color */\n}\n\n/* Progress dialog styles */\n.FileUpload-module_progressDialog__agLef {\n margin-top: 12px;\n width: 100%;\n background-color: #f7f7f7;\n border-radius: 8px;\n padding: 8px;\n}\n\n.FileUpload-module_progressBar__kePxX {\n width: 100%;\n background-color: #ddd;\n border-radius: 4px;\n overflow: hidden;\n}\n\n.FileUpload-module_progressFill__A00Zx {\n height: 10px;\n background-color: #2980b9; /* Blue color for progress fill */\n transition: width 0.25s ease;\n}\n\n/* Status message styling */\n.FileUpload-module_statusMessage__LMpk4 {\n margin-top: 12px;\n font-size: 16px;\n color: #2980b9;\n font-weight: bold;\n text-align: right;\n transition: opacity 0.5s ease, transform 0.5s ease;\n}\n\n/* Success animation for 'complete' status */\n.FileUpload-module_successAnimation__X-AGb {\n animation: FileUpload-module_fadeIn__U5yc7 0.5s ease;\n}\n\n/* Keyframe for fade-in effect */\n@keyframes FileUpload-module_fadeIn__U5yc7 {\n from {\n opacity: 0;\n transform: translateY(10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n/* Keyframe for error shake effect */\n@keyframes FileUpload-module_shake__xDhrR {\n 0%, 100% { transform: translateX(0); }\n 10%, 30%, 50%, 70%, 90% { transform: translateX(-5px); }\n 20%, 40%, 60%, 80% { transform: translateX(5px); }\n}\n\n/* Error animation */\n.FileUpload-module_errorAnimation__DSUBA {\n animation: FileUpload-module_shake__xDhrR 0.5s ease;\n color: #dc3545;\n}\n\n/* Style changes when dragging over the drop area */\n.FileUpload-module_fileInputContainer__MfXbf.FileUpload-module_dragOver__Saj5O {\n background-color: #eaf2f8;\n border-color: #2980b9;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n}\n\n/* ============================================================================\n// MOBILE BUTTONS - Delightful UI with joyous colors & dopamine effects\n// ============================================================================ */\n\n/* Pulse animation for mobile - subtle attention grabber */\n@keyframes FileUpload-module_cameraPulse__RQDx7 {\n 0%, 100% {\n box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.4);\n }\n 50% {\n box-shadow: 0 0 0 8px rgba(139, 92, 246, 0);\n }\n}\n\n/* Mobile buttons container - vertical column - stretches to fill space */\n.FileUpload-module_mobileButtons__stjus {\n display: none;\n flex-direction: column;\n gap: 12px;\n width: 100%;\n min-height: 120px;\n flex: 1;\n justify-content: center;\n}\n\n/* Individual mobile button - stretch to fill available space */\n.FileUpload-module_mobileButton__9LmQC {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n width: 100%;\n flex: 1;\n padding: 16px 20px;\n background: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 100%);\n color: white;\n font-size: 16px;\n font-weight: 600;\n border: none;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.FileUpload-module_mobileButton__9LmQC:hover:not(:disabled) {\n background: linear-gradient(135deg, #7C3AED 0%, #6D28D9 100%);\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(139, 92, 246, 0.4);\n}\n\n.FileUpload-module_mobileButton__9LmQC:active:not(:disabled) {\n transform: scale(0.95);\n}\n\n.FileUpload-module_mobileButton__9LmQC:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n/* Show mobile buttons on mobile/tablet only, hide desktop text */\n@media (pointer: coarse), (max-width: 1024px) {\n .FileUpload-module_mobileButtons__stjus {\n display: flex;\n animation: FileUpload-module_cameraPulse__RQDx7 2s ease-in-out infinite;\n }\n .FileUpload-module_visibleElements__JqQ1- {\n display: none;\n }\n}\n\n/* ============================================================================\n// PHASE 4: IN-APP CAMERA PREVIEW - Delightful UI with joyous colors\n// ============================================================================ */\n\n/* Camera Preview Container */\n.FileUpload-module_cameraPreview__y5Hpw {\n position: relative;\n width: 100%;\n aspect-ratio: 3 / 4;\n max-height: 400px;\n background: #000;\n border-radius: 12px;\n overflow: hidden;\n margin-top: 12px;\n}\n\n/* Video Element */\n.FileUpload-module_cameraVideo__k8kfy {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/* Camera Controls Bar */\n.FileUpload-module_cameraControls__EAT-W {\n position: absolute;\n top: 12px;\n left: 0;\n right: 0;\n display: flex;\n justify-content: space-between;\n padding: 0 16px;\n z-index: 10;\n}\n\n.FileUpload-module_cameraControlBtn__vq5ab {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 42px;\n height: 42px;\n background: rgba(0, 0, 0, 0.5);\n backdrop-filter: blur(8px);\n border: none;\n border-radius: 50%;\n color: white;\n font-size: 20px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.FileUpload-module_cameraControlBtn__vq5ab:hover {\n background: rgba(0, 0, 0, 0.7);\n transform: scale(1.1);\n}\n\n.FileUpload-module_cameraControlBtn__vq5ab:active {\n transform: scale(0.95);\n}\n\n/* Capture Button */\n.FileUpload-module_captureBtn__7Y0Yi {\n position: absolute;\n bottom: 32px;\n left: 50%;\n transform: translateX(-50%);\n width: 72px;\n height: 72px;\n background: transparent;\n border: 4px solid white;\n border-radius: 50%;\n cursor: pointer;\n transition: all 0.2s ease;\n z-index: 100;\n touch-action: manipulation;\n -webkit-tap-highlight-color: transparent;\n}\n\n.FileUpload-module_captureBtnInner__3fzVL {\n width: 100%;\n height: 100%;\n background: white;\n border-radius: 50%;\n transition: all 0.2s ease;\n}\n\n.FileUpload-module_captureBtn__7Y0Yi:hover .FileUpload-module_captureBtnInner__3fzVL {\n transform: scale(0.9);\n}\n\n.FileUpload-module_captureBtn__7Y0Yi:active .FileUpload-module_captureBtnInner__3fzVL {\n transform: scale(0.8);\n background: #8B5CF6;\n}\n\n/* Captured Preview */\n.FileUpload-module_capturedPreview__8sCVd {\n width: 100%;\n aspect-ratio: 3 / 4;\n max-height: 400px;\n border-radius: 12px;\n overflow: hidden;\n margin-top: 12px;\n background: #000;\n}\n\n.FileUpload-module_capturedImage__0XlUC {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/* Captured Actions (Retake / Confirm) */\n.FileUpload-module_capturedActions__7zsfS {\n position: absolute;\n bottom: 24px;\n left: 0;\n right: 0;\n display: flex;\n justify-content: center;\n gap: 24px;\n padding: 0 16px;\n}\n\n.FileUpload-module_retakeBtn__ztglf,\n.FileUpload-module_confirmBtn__RJpS- {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 24px;\n border: none;\n border-radius: 24px;\n font-size: 14px;\n font-weight: 600;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.FileUpload-module_retakeBtn__ztglf {\n background: rgba(255, 255, 255, 0.2);\n backdrop-filter: blur(8px);\n color: white;\n}\n\n.FileUpload-module_retakeBtn__ztglf:hover {\n background: rgba(255, 255, 255, 0.3);\n}\n\n.FileUpload-module_confirmBtn__RJpS- {\n background: linear-gradient(135deg, #10B981 0%, #059669 100%);\n color: white;\n}\n\n.FileUpload-module_confirmBtn__RJpS-:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);\n}\n\n/* Camera Error */\n.FileUpload-module_cameraError__DwVo- {\n margin-top: 8px;\n padding: 12px;\n background: #FEF2F2;\n border: 1px solid #FECACA;\n border-radius: 8px;\n color: #DC2626;\n font-size: 14px;\n text-align: center;\n}\n\n/* Screen Flash Animation (capture moment) */\n@keyframes FileUpload-module_screenFlash__xu1rw {\n 0% { opacity: 0; }\n 50% { opacity: 1; background: white; }\n 100% { opacity: 0; }\n}\n\n.FileUpload-module_screenFlash__xu1rw {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: white;\n animation: FileUpload-module_screenFlash__xu1rw 0.3s ease-out;\n pointer-events: none;\n z-index: 200;\n}\n\n.FileUpload-module_errorMessage__AXjcm {\n margin-top: 8px;\n padding: 12px;\n border: 1px solid #dc3545;\n background: #fff5f5;\n border-radius: 8px;\n color: #dc3545;\n font-size: 14px;\n text-align: center;\n}\n\n.FileUpload-module_retryBtn__4lm-y {\n margin-left: 12px;\n padding: 4px 14px;\n background: #dc3545;\n color: #fff;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n font-size: 13px;\n font-weight: 600;\n transition: background 0.2s ease;\n}\n\n.FileUpload-module_retryBtn__4lm-y:hover {\n background: #b02a37;\n}\n\n@keyframes FileUpload-module_loadingPulse__CS4Se {\n 0%, 100% { opacity: 0.6; transform: scale(1); }\n 50% { opacity: 1; transform: scale(1.05); }\n}\n\n.FileUpload-module_cameraLoading__T-SW4 {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n background: #1a1a2e;\n color: #fff;\n font-size: 48px;\n animation: FileUpload-module_loadingPulse__CS4Se 1.5s ease-in-out infinite;\n}\n\n/* Crop view — full-column flex wrapper */\n.FileUpload-module_cropWrapper__3s1XX {\n display: flex;\n flex-direction: column;\n width: 100%;\n}\n\n/* Normal-flow action buttons for the crop view */\n.FileUpload-module_cropActionsBar__qr5NA {\n display: flex;\n justify-content: center;\n gap: 24px;\n padding: 14px 16px 4px;\n}\n\n/* Crop container for react-cropper (Cropper.js) */\n.FileUpload-module_cropContainer__J3-11 {\n position: relative;\n width: 100%;\n height: 420px;\n margin-top: 12px;\n border-radius: 12px;\n overflow: hidden;\n background: #000;\n}\n\n.FileUpload-module_zoomSlider__TlqRu {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-top: 10px;\n padding: 0 4px;\n}\n\n.FileUpload-module_zoomRange__GXX68 {\n flex: 1;\n accent-color: #6c63ff;\n cursor: pointer;\n}\n\n.FileUpload-module_zoomBtn__pah4b {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n border: 1px solid #6c63ff;\n background: transparent;\n color: #6c63ff;\n font-size: 18px;\n cursor: pointer;\n line-height: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.FileUpload-module_zoomBtn__pah4b:hover {\n background: #6c63ff;\n color: #fff;\n}\n\n/* ============================================================================\n MULTI-FILE QUEUE — Delightful parallel upload UX\n ============================================================================ */\n\n@keyframes FileUpload-module_slideInRow__COE9n {\n from { opacity: 0; transform: translateY(-8px); }\n to { opacity: 1; transform: translateY(0); }\n}\n\n@keyframes FileUpload-module_popCheck__NQqID {\n 0% { transform: scale(0.5); opacity: 0; }\n 70% { transform: scale(1.15); }\n 100% { transform: scale(1); opacity: 1; }\n}\n\n@keyframes FileUpload-module_progressShimmer__jOjnv {\n 0% { transform: translateX(-100%); }\n 100% { transform: translateX(200%); }\n}\n\n@keyframes FileUpload-module_completePulse__IyePh {\n 0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }\n 50% { box-shadow: 0 0 0 6px rgba(16, 185, 129, 0.2); }\n}\n\n/* Drop zone — compact variant when queue already has entries */\n.FileUpload-module_multiDropZoneCompact__9CFq- {\n padding: 14px 30px;\n min-height: 56px;\n}\n\n/* File queue list */\n.FileUpload-module_fileList__NYlEu {\n list-style: none;\n margin: 12px 0 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n/* File row: grid layout — meta | badge | actions on row 1, progress on row 2 */\n.FileUpload-module_fileRow__1Fxul {\n display: grid;\n grid-template-columns: 1fr auto auto;\n grid-template-rows: auto auto;\n gap: 6px 12px;\n align-items: center;\n padding: 10px 14px;\n border: 1px solid #e5e7eb;\n border-left: 3px solid #9ca3af;\n border-radius: 8px;\n background: #fff;\n animation: FileUpload-module_slideInRow__COE9n 0.25s ease both;\n transition: border-color 0.2s ease, box-shadow 0.2s ease;\n}\n\n.FileUpload-module_fileRow_pending__pdNXE { border-left-color: #9ca3af; }\n.FileUpload-module_fileRow_uploading__MuNwL { border-left-color: #2980b9; }\n.FileUpload-module_fileRow_complete__zkAqi { border-left-color: #10b981; animation: FileUpload-module_completePulse__IyePh 0.6s ease; }\n.FileUpload-module_fileRow_error__ShiDk { border-left-color: #dc3545; animation: FileUpload-module_shake__xDhrR 0.5s ease; }\n\n/* File name and size */\n.FileUpload-module_fileRowMeta__zufyo {\n grid-column: 1;\n grid-row: 1;\n min-width: 0;\n}\n\n.FileUpload-module_fileRowFilename__4fIwi {\n display: block;\n font-size: 14px;\n font-weight: 500;\n color: #1f2937;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.FileUpload-module_fileRowSize__qTRVw {\n display: block;\n font-size: 12px;\n color: #6b7280;\n margin-top: 1px;\n}\n\n/* Status badge */\n.FileUpload-module_fileRowBadge__o6z-- {\n grid-column: 2;\n grid-row: 1;\n font-size: 11px;\n font-weight: 600;\n padding: 2px 9px;\n border-radius: 999px;\n white-space: nowrap;\n}\n\n.FileUpload-module_badge_pending__xQGJ0 { background: #f3f4f6; color: #6b7280; }\n.FileUpload-module_badge_uploading__8WaRF { background: #dbeafe; color: #1d4ed8; }\n.FileUpload-module_badge_complete__9nfZB { background: #d1fae5; color: #065f46; animation: FileUpload-module_popCheck__NQqID 0.4s ease; }\n.FileUpload-module_badge_error__2vDFn { background: #fee2e2; color: #991b1b; }\n\n/* Per-file progress bar — spans full width below the row header */\n.FileUpload-module_fileRowProgress__nR0ef {\n grid-column: 1 / -1;\n grid-row: 2;\n height: 3px;\n background: #e5e7eb;\n border-radius: 2px;\n overflow: hidden;\n}\n\n.FileUpload-module_fileRowProgressFill__WNeLC {\n height: 100%;\n background: #2980b9;\n border-radius: 2px;\n transition: width 0.25s ease;\n}\n\n.FileUpload-module_fileRowProgressIndeterminate__CThl- {\n height: 100%;\n width: 40%;\n background: linear-gradient(90deg, transparent, #2980b9, transparent);\n animation: FileUpload-module_progressShimmer__jOjnv 1.2s ease-in-out infinite;\n}\n\n/* Action buttons */\n.FileUpload-module_fileRowActions__5gWBm {\n grid-column: 3;\n grid-row: 1;\n display: flex;\n gap: 6px;\n align-items: center;\n}\n\n.FileUpload-module_removeFileBtn__M5al4 {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 26px;\n height: 26px;\n border: none;\n border-radius: 6px;\n background: transparent;\n color: #9ca3af;\n cursor: pointer;\n transition: background 0.15s ease, color 0.15s ease;\n}\n\n.FileUpload-module_removeFileBtn__M5al4:hover {\n background: #fee2e2;\n color: #dc3545;\n}\n\n.FileUpload-module_retryFileBtn__HOpA7 {\n font-size: 11px;\n font-weight: 600;\n padding: 3px 10px;\n border: 1px solid #dc3545;\n border-radius: 4px;\n background: transparent;\n color: #dc3545;\n cursor: pointer;\n transition: background 0.15s ease, color 0.15s ease;\n}\n\n.FileUpload-module_retryFileBtn__HOpA7:hover {\n background: #dc3545;\n color: #fff;\n}\n\n/* Clear all button */\n.FileUpload-module_clearAllBtn__v3oMP {\n margin-top: 8px;\n align-self: flex-end;\n padding: 5px 14px;\n font-size: 12px;\n font-weight: 500;\n color: #6b7280;\n background: transparent;\n border: 1px solid #e5e7eb;\n border-radius: 6px;\n cursor: pointer;\n transition: border-color 0.15s ease, color 0.15s ease;\n}\n\n.FileUpload-module_clearAllBtn__v3oMP:hover {\n border-color: #dc3545;\n color: #dc3545;\n}\n";
|
|
37
|
+
var styles = {"fileUploadContainer":"FileUpload-module_fileUploadContainer__Wy-Up","label":"FileUpload-module_label__nLqx4","fileInputContainer":"FileUpload-module_fileInputContainer__MfXbf","disabled":"FileUpload-module_disabled__FtUd7","fileInput":"FileUpload-module_fileInput__ns8S-","fileName":"FileUpload-module_fileName__h7Ij-","visibleElements":"FileUpload-module_visibleElements__JqQ1-","progressDialog":"FileUpload-module_progressDialog__agLef","progressBar":"FileUpload-module_progressBar__kePxX","progressFill":"FileUpload-module_progressFill__A00Zx","statusMessage":"FileUpload-module_statusMessage__LMpk4","successAnimation":"FileUpload-module_successAnimation__X-AGb","fadeIn":"FileUpload-module_fadeIn__U5yc7","errorAnimation":"FileUpload-module_errorAnimation__DSUBA","shake":"FileUpload-module_shake__xDhrR","dragOver":"FileUpload-module_dragOver__Saj5O","mobileButtons":"FileUpload-module_mobileButtons__stjus","mobileButton":"FileUpload-module_mobileButton__9LmQC","cameraPulse":"FileUpload-module_cameraPulse__RQDx7","cameraPreview":"FileUpload-module_cameraPreview__y5Hpw","cameraVideo":"FileUpload-module_cameraVideo__k8kfy","cameraControls":"FileUpload-module_cameraControls__EAT-W","cameraControlBtn":"FileUpload-module_cameraControlBtn__vq5ab","captureBtn":"FileUpload-module_captureBtn__7Y0Yi","captureBtnInner":"FileUpload-module_captureBtnInner__3fzVL","capturedPreview":"FileUpload-module_capturedPreview__8sCVd","capturedImage":"FileUpload-module_capturedImage__0XlUC","capturedActions":"FileUpload-module_capturedActions__7zsfS","retakeBtn":"FileUpload-module_retakeBtn__ztglf","confirmBtn":"FileUpload-module_confirmBtn__RJpS-","cameraError":"FileUpload-module_cameraError__DwVo-","screenFlash":"FileUpload-module_screenFlash__xu1rw","errorMessage":"FileUpload-module_errorMessage__AXjcm","retryBtn":"FileUpload-module_retryBtn__4lm-y","cameraLoading":"FileUpload-module_cameraLoading__T-SW4","loadingPulse":"FileUpload-module_loadingPulse__CS4Se","cropWrapper":"FileUpload-module_cropWrapper__3s1XX","cropActionsBar":"FileUpload-module_cropActionsBar__qr5NA","cropContainer":"FileUpload-module_cropContainer__J3-11","zoomSlider":"FileUpload-module_zoomSlider__TlqRu","zoomRange":"FileUpload-module_zoomRange__GXX68","zoomBtn":"FileUpload-module_zoomBtn__pah4b","multiDropZoneCompact":"FileUpload-module_multiDropZoneCompact__9CFq-","fileList":"FileUpload-module_fileList__NYlEu","fileRow":"FileUpload-module_fileRow__1Fxul","slideInRow":"FileUpload-module_slideInRow__COE9n","fileRow_pending":"FileUpload-module_fileRow_pending__pdNXE","fileRow_uploading":"FileUpload-module_fileRow_uploading__MuNwL","fileRow_complete":"FileUpload-module_fileRow_complete__zkAqi","completePulse":"FileUpload-module_completePulse__IyePh","fileRow_error":"FileUpload-module_fileRow_error__ShiDk","fileRowMeta":"FileUpload-module_fileRowMeta__zufyo","fileRowFilename":"FileUpload-module_fileRowFilename__4fIwi","fileRowSize":"FileUpload-module_fileRowSize__qTRVw","fileRowBadge":"FileUpload-module_fileRowBadge__o6z--","badge_pending":"FileUpload-module_badge_pending__xQGJ0","badge_uploading":"FileUpload-module_badge_uploading__8WaRF","badge_complete":"FileUpload-module_badge_complete__9nfZB","popCheck":"FileUpload-module_popCheck__NQqID","badge_error":"FileUpload-module_badge_error__2vDFn","fileRowProgress":"FileUpload-module_fileRowProgress__nR0ef","fileRowProgressFill":"FileUpload-module_fileRowProgressFill__WNeLC","fileRowProgressIndeterminate":"FileUpload-module_fileRowProgressIndeterminate__CThl-","progressShimmer":"FileUpload-module_progressShimmer__jOjnv","fileRowActions":"FileUpload-module_fileRowActions__5gWBm","removeFileBtn":"FileUpload-module_removeFileBtn__M5al4","retryFileBtn":"FileUpload-module_retryFileBtn__HOpA7","clearAllBtn":"FileUpload-module_clearAllBtn__v3oMP"};
|
|
38
38
|
styleInject(css_248z$1);
|
|
39
39
|
|
|
40
40
|
function useBrowser() {
|
|
@@ -3959,7 +3959,7 @@ assign(Cropper.prototype, render, preview, events, handlers, change, methods);
|
|
|
3959
3959
|
|
|
3960
3960
|
var n=function(){return n=Object.assign||function(e){for(var r,o=1,t=arguments.length;o<t;o++)for(var n in r=arguments[o])Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n]);return e},n.apply(this,arguments)};function a(e,r){var o={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&r.indexOf(t)<0&&(o[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(t=Object.getOwnPropertySymbols(e);n<t.length;n++)r.indexOf(t[n])<0&&Object.prototype.propertyIsEnumerable.call(e,t[n])&&(o[t[n]]=e[t[n]]);}return o}var c=["aspectRatio","autoCrop","autoCropArea","background","center","checkCrossOrigin","checkOrientation","cropBoxMovable","cropBoxResizable","data","dragMode","guides","highlight","initialAspectRatio","minCanvasHeight","minCanvasWidth","minContainerHeight","minContainerWidth","minCropBoxHeight","minCropBoxWidth","modal","movable","preview","responsive","restore","rotatable","scalable","toggleDragModeOnDblclick","viewMode","wheelZoomRatio","zoomOnTouch","zoomOnWheel","zoomable","cropstart","cropmove","cropend","crop","zoom","ready"],i={opacity:0,maxWidth:"100%"},l=e.forwardRef((function(l,s){var u=a(l,[]),p=u.dragMode,d=void 0===p?"crop":p,v=u.src,f=u.style,m=u.className,g=u.crossOrigin,y=u.scaleX,b=u.scaleY,h=u.enable,O=u.zoomTo,T=u.rotateTo,z=u.alt,C=void 0===z?"picture":z,w=u.ready,x=u.onInitialized,j=a(u,["dragMode","src","style","className","crossOrigin","scaleX","scaleY","enable","zoomTo","rotateTo","alt","ready","onInitialized"]),M={scaleY:b,scaleX:y,enable:h,zoomTo:O,rotateTo:T},E=function(){for(var o=[],t=0;t<arguments.length;t++)o[t]=arguments[t];var n=e.useRef(null);return e.useEffect((function(){o.forEach((function(e){e&&("function"==typeof e?e(n.current):e.current=n.current);}));}),[o]),n}(s,e.useRef(null));e.useEffect((function(){var e;(null===(e=E.current)||void 0===e?void 0:e.cropper)&&"number"==typeof O&&E.current.cropper.zoomTo(O);}),[u.zoomTo]),e.useEffect((function(){var e;(null===(e=E.current)||void 0===e?void 0:e.cropper)&&void 0!==v&&E.current.cropper.reset().clear().replace(v);}),[v]),e.useEffect((function(){if(null!==E.current){var e=new Cropper(E.current,n(n({dragMode:d},j),{ready:function(e){null!==e.currentTarget&&function(e,r){ void 0===r&&(r={});var o=r.enable,t=void 0===o||o,n=r.scaleX,a=void 0===n?1:n,c=r.scaleY,i=void 0===c?1:c,l=r.zoomTo,s=void 0===l?0:l,u=r.rotateTo;t?e.enable():e.disable(),e.scaleX(a),e.scaleY(i),void 0!==u&&e.rotateTo(u),s>0&&e.zoomTo(s);}(e.currentTarget.cropper,M),w&&w(e);}}));x&&x(e);}return function(){var e,r;null===(r=null===(e=E.current)||void 0===e?void 0:e.cropper)||void 0===r||r.destroy();}}),[E]);var R=function(e){return c.reduce((function(e,r){var o=e,t=r;return o[t],a(o,["symbol"==typeof t?t:t+""])}),e)}(n(n({},j),{crossOrigin:g,src:v,alt:C}));return e.createElement("div",{style:f,className:m},e.createElement("img",n({},R,{style:i,ref:E})))}));
|
|
3961
3961
|
|
|
3962
|
-
var css_248z = "/*!\n * Cropper.js v1.6.2\n * https://fengyuanchen.github.io/cropperjs\n *\n * Copyright 2015-present Chen Fengyuan\n * Released under the MIT license\n *\n * Date: 2024-04-21T07:43:02.731Z\n */\n\n.
|
|
3962
|
+
var css_248z = "/*!\n * Cropper.js v1.6.2\n * https://fengyuanchen.github.io/cropperjs\n *\n * Copyright 2015-present Chen Fengyuan\n * Released under the MIT license\n *\n * Date: 2024-04-21T07:43:02.731Z\n */\n\n.cropper-container {\n direction: ltr;\n font-size: 0;\n line-height: 0;\n position: relative;\n -ms-touch-action: none;\n touch-action: none;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n\n.cropper-container img {\n backface-visibility: hidden;\n display: block;\n height: 100%;\n image-orientation: 0deg;\n max-height: none !important;\n max-width: none !important;\n min-height: 0 !important;\n min-width: 0 !important;\n width: 100%;\n }\n\n.cropper-wrap-box,\n.cropper-canvas,\n.cropper-drag-box,\n.cropper-crop-box,\n.cropper-modal {\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n}\n\n.cropper-wrap-box,\n.cropper-canvas {\n overflow: hidden;\n}\n\n.cropper-drag-box {\n background-color: #fff;\n opacity: 0;\n}\n\n.cropper-modal {\n background-color: #000;\n opacity: 0.5;\n}\n\n.cropper-view-box {\n display: block;\n height: 100%;\n outline: 1px solid #39f;\n outline-color: rgba(51, 153, 255, 0.75);\n overflow: hidden;\n width: 100%;\n}\n\n.cropper-dashed {\n border: 0 dashed #eee;\n display: block;\n opacity: 0.5;\n position: absolute;\n}\n\n.cropper-dashed.dashed-h {\n border-bottom-width: 1px;\n border-top-width: 1px;\n height: calc(100% / 3);\n left: 0;\n top: calc(100% / 3);\n width: 100%;\n }\n\n.cropper-dashed.dashed-v {\n border-left-width: 1px;\n border-right-width: 1px;\n height: 100%;\n left: calc(100% / 3);\n top: 0;\n width: calc(100% / 3);\n }\n\n.cropper-center {\n display: block;\n height: 0;\n left: 50%;\n opacity: 0.75;\n position: absolute;\n top: 50%;\n width: 0;\n}\n\n.cropper-center::before,\n .cropper-center::after {\n background-color: #eee;\n content: ' ';\n display: block;\n position: absolute;\n }\n\n.cropper-center::before {\n height: 1px;\n left: -3px;\n top: 0;\n width: 7px;\n }\n\n.cropper-center::after {\n height: 7px;\n left: 0;\n top: -3px;\n width: 1px;\n }\n\n.cropper-face,\n.cropper-line,\n.cropper-point {\n display: block;\n height: 100%;\n opacity: 0.1;\n position: absolute;\n width: 100%;\n}\n\n.cropper-face {\n background-color: #fff;\n left: 0;\n top: 0;\n}\n\n.cropper-line {\n background-color: #39f;\n}\n\n.cropper-line.line-e {\n cursor: ew-resize;\n right: -3px;\n top: 0;\n width: 5px;\n }\n\n.cropper-line.line-n {\n cursor: ns-resize;\n height: 5px;\n left: 0;\n top: -3px;\n }\n\n.cropper-line.line-w {\n cursor: ew-resize;\n left: -3px;\n top: 0;\n width: 5px;\n }\n\n.cropper-line.line-s {\n bottom: -3px;\n cursor: ns-resize;\n height: 5px;\n left: 0;\n }\n\n.cropper-point {\n background-color: #39f;\n height: 5px;\n opacity: 0.75;\n width: 5px;\n}\n\n.cropper-point.point-e {\n cursor: ew-resize;\n margin-top: -3px;\n right: -3px;\n top: 50%;\n }\n\n.cropper-point.point-n {\n cursor: ns-resize;\n left: 50%;\n margin-left: -3px;\n top: -3px;\n }\n\n.cropper-point.point-w {\n cursor: ew-resize;\n left: -3px;\n margin-top: -3px;\n top: 50%;\n }\n\n.cropper-point.point-s {\n bottom: -3px;\n cursor: s-resize;\n left: 50%;\n margin-left: -3px;\n }\n\n.cropper-point.point-ne {\n cursor: nesw-resize;\n right: -3px;\n top: -3px;\n }\n\n.cropper-point.point-nw {\n cursor: nwse-resize;\n left: -3px;\n top: -3px;\n }\n\n.cropper-point.point-sw {\n bottom: -3px;\n cursor: nesw-resize;\n left: -3px;\n }\n\n.cropper-point.point-se {\n bottom: -3px;\n cursor: nwse-resize;\n height: 20px;\n opacity: 1;\n right: -3px;\n width: 20px;\n }\n\n@media (min-width: 768px) {\n\n.cropper-point.point-se {\n height: 15px;\n width: 15px;\n }\n }\n\n@media (min-width: 992px) {\n\n.cropper-point.point-se {\n height: 10px;\n width: 10px;\n }\n }\n\n@media (min-width: 1200px) {\n\n.cropper-point.point-se {\n height: 5px;\n opacity: 0.75;\n width: 5px;\n }\n }\n\n.cropper-point.point-se::before {\n background-color: #39f;\n bottom: -50%;\n content: ' ';\n display: block;\n height: 200%;\n opacity: 0;\n position: absolute;\n right: -50%;\n width: 200%;\n }\n\n.cropper-invisible {\n opacity: 0;\n}\n\n.cropper-bg {\n background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC');\n}\n\n.cropper-hide {\n display: block;\n height: 0;\n position: absolute;\n width: 0;\n}\n\n.cropper-hidden {\n display: none !important;\n}\n\n.cropper-move {\n cursor: move;\n}\n\n.cropper-crop {\n cursor: crosshair;\n}\n\n.cropper-disabled .cropper-drag-box,\n.cropper-disabled .cropper-face,\n.cropper-disabled .cropper-line,\n.cropper-disabled .cropper-point {\n cursor: not-allowed;\n}\n";
|
|
3963
3963
|
styleInject(css_248z);
|
|
3964
3964
|
|
|
3965
3965
|
const CameraCapture = ({ cameraView, facingMode, flashEnabled, capturedImage, cameraError, cameraLoading, videoRef, canvasRef, torchSupported, labels, icons, onCancel, onToggleCamera, onToggleFlash, onCapture, onRetake, onConfirm, onCropCancel, onApplyCrop, }) => {
|
|
@@ -3986,7 +3986,7 @@ const CameraCapture = ({ cameraView, facingMode, flashEnabled, capturedImage, ca
|
|
|
3986
3986
|
if (cameraView === "none")
|
|
3987
3987
|
return null;
|
|
3988
3988
|
if (cameraView === "crop" && capturedImage) {
|
|
3989
|
-
return (jsxRuntime.jsxs(
|
|
3989
|
+
return (jsxRuntime.jsxs("div", { className: styles.cropWrapper, children: [jsxRuntime.jsx("label", { className: styles.label, children: labels.cropTitle }), jsxRuntime.jsx("div", { className: styles.cropContainer, children: jsxRuntime.jsx(l, { ref: cropperRef, src: capturedImage, style: { height: 420, width: "100%" }, viewMode: 1, dragMode: "move", autoCropArea: 0.85, guides: true, cropBoxMovable: true, cropBoxResizable: true, zoomable: true, zoomOnTouch: true, zoomOnWheel: true, wheelZoomRatio: 0.1, toggleDragModeOnDblclick: false, background: false }) }), jsxRuntime.jsxs("div", { className: styles.zoomSlider, children: [jsxRuntime.jsx("button", { type: "button", className: styles.zoomBtn, onClick: () => cropperRef.current?.cropper.zoom(-0.1), "aria-label": "Zoom out", children: "\u2212" }), jsxRuntime.jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: zoomLevel, onChange: handleZoomChange, className: styles.zoomRange, "aria-label": "Zoom level" }), jsxRuntime.jsx("button", { type: "button", className: styles.zoomBtn, onClick: () => cropperRef.current?.cropper.zoom(0.1), "aria-label": "Zoom in", children: "+" })] }), jsxRuntime.jsxs("div", { className: styles.cropActionsBar, children: [jsxRuntime.jsxs("button", { type: "button", className: styles.retakeBtn, onClick: onCropCancel, children: [icons.close, jsxRuntime.jsx("span", { children: labels.cropCancel })] }), jsxRuntime.jsxs("button", { type: "button", className: styles.confirmBtn, onClick: handleApplyCrop, children: [icons.confirm, jsxRuntime.jsx("span", { children: labels.cropSave })] })] }), cameraError && (jsxRuntime.jsx("div", { className: styles.cameraError, children: cameraError }))] }));
|
|
3990
3990
|
}
|
|
3991
3991
|
if (cameraView === "captured" && capturedImage) {
|
|
3992
3992
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: styles.capturedPreview, children: [jsxRuntime.jsx("img", { src: capturedImage, alt: "Captured", className: styles.capturedImage }), jsxRuntime.jsxs("div", { className: styles.capturedActions, children: [jsxRuntime.jsxs("button", { type: "button", className: styles.retakeBtn, onClick: onRetake, children: [icons.retake, jsxRuntime.jsx("span", { children: labels.retake })] }), jsxRuntime.jsxs("button", { type: "button", className: styles.confirmBtn, onClick: onConfirm, children: [icons.confirm, jsxRuntime.jsx("span", { children: labels.usePhoto })] })] })] }), cameraError && (jsxRuntime.jsx("div", { className: styles.cameraError, children: cameraError }))] }));
|