@pallasoft/ps-file-components 1.5.0 → 2.0.1

package/dist/components/ps-document-scanner-loader.d.ts

@@ -1 +1 @@
-export declare const PsDocumentScannerLoader: import("react").LazyExoticComponent<({ fileName, isAutoCapture, jpegQuality, labels, maxDimension, maxPages, onClose, onComplete, outputFormat, }: import("../models/ps-document-scanner-sheet-props").PsDocumentScannerSheetProps) => import("react").ReactPortal | null>;
+export declare const PsDocumentScannerLoader: import("react").LazyExoticComponent<({ fileName, jpegQuality, labels, maxDimension, onClose, onComplete, }: import("../models/ps-document-scanner-sheet-props").PsDocumentScannerSheetProps) => import("react").ReactPortal | null>;

package/dist/components/ps-document-scanner-sheet.d.ts

@@ -1,2 +1,2 @@
 import type { PsDocumentScannerSheetProps } from '../models/ps-document-scanner-sheet-props';
-export declare const PsDocumentScannerSheet: ({ fileName, isAutoCapture, jpegQuality, labels, maxDimension, maxPages, onClose, onComplete, outputFormat, }: PsDocumentScannerSheetProps) => import("react").ReactPortal | null;
+export declare const PsDocumentScannerSheet: ({ fileName, jpegQuality, labels, maxDimension, onClose, onComplete, }: PsDocumentScannerSheetProps) => import("react").ReactPortal | null;

package/dist/components/ps-document-scanner-sheet.js

@@ -12,81 +12,52 @@ const ps_scan_step_1 = require("../constants/ps-scan-step");
 const use_ps_focus_trap_1 = require("../hooks/use-ps-focus-trap");
 const use_ps_scan_camera_1 = require("../hooks/use-ps-scan-camera");
 const use_ps_scan_live_detection_1 = require("../hooks/use-ps-scan-live-detection");
-const use_ps_scan_pages_1 = require("../hooks/use-ps-scan-pages");
-const use_ps_scan_previews_1 = require("../hooks/use-ps-scan-previews");
-const ps_scan_output_service_1 = require("../services/ps-scan-output-service");
+const use_ps_scan_photo_1 = require("../hooks/use-ps-scan-photo");
+const ps_scan_file_name_service_1 = require("../services/ps-scan-file-name-service");
 const ps_scan_pipeline_service_1 = require("../services/ps-scan-pipeline-service");
-const ps_scan_template_service_1 = require("../services/ps-scan-template-service");
 const ps_scan_camera_view_1 = require("./ps-scan-camera-view");
 const ps_scan_crop_editor_1 = require("./ps-scan-crop-editor");
 const ps_scan_icon_button_1 = require("./ps-scan-icon-button");
 const ps_scan_permission_view_1 = require("./ps-scan-permission-view");
-const ps_scan_review_1 = require("./ps-scan-review");
-const PsDocumentScannerSheet = ({ fileName, isAutoCapture, jpegQuality, labels, maxDimension, maxPages, onClose, onComplete, outputFormat, }) => {
+const ps_scan_preview_1 = require("./ps-scan-preview");
+const PsDocumentScannerSheet = ({ fileName, jpegQuality, labels, maxDimension, onClose, onComplete, }) => {
     const tier = (0, ps_core_components_1.usePsViewport)();
     const zIndex = (0, ps_core_components_1.usePsLayerZIndex)(ps_design_system_1.PallasoftZIndex.Modal);
     const content = (0, react_1.useRef)(null);
-    const { add, move, pages, remove, replace, setCorners, update } = (0, use_ps_scan_pages_1.usePsScanPages)();
+    const { clear, detectAgain, load, photo, setCorners } = (0, use_ps_scan_photo_1.usePsScanPhoto)();
     const [step, setStep] = (0, react_1.useState)(ps_scan_step_1.PsScanStep.Camera);
-    const [cropReturn, setCropReturn] = (0, react_1.useState)(ps_scan_step_1.PsScanStep.Camera);
-    const [activeId, setActiveId] = (0, react_1.useState)('');
-    const [retakeId, setRetakeId] = (0, react_1.useState)('');
+    const [result, setResult] = (0, react_1.useState)(null);
     const [announcement, setAnnouncement] = (0, react_1.useState)('');
     const [error, setError] = (0, react_1.useState)('');
-    const [isBusy, setIsBusy] = (0, react_1.useState)(false);
     const [isCapturing, setIsCapturing] = (0, react_1.useState)(false);
-    const [isAuto, setIsAuto] = (0, react_1.useState)(isAutoCapture);
     const [flashKey, setFlashKey] = (0, react_1.useState)(0);
     const camera = (0, use_ps_scan_camera_1.usePsScanCamera)(step === ps_scan_step_1.PsScanStep.Camera);
     const isReady = camera.status === ps_scan_camera_status_1.PsScanCameraStatus.Ready;
-    const isFull = pages.length >= maxPages;
-    const previews = (0, use_ps_scan_previews_1.usePsScanPreviews)(pages);
-    const page = pages.find((item) => item.id === activeId);
-    const lastPage = pages[pages.length - 1];
     const isDesktop = tier === ps_design_system_1.PallasoftViewportTier.Desktop;
     const isCameraStep = step === ps_scan_step_1.PsScanStep.Camera;
     const showsCamera = isReady || camera.status === ps_scan_camera_status_1.PsScanCameraStatus.Starting;
+    const detection = (0, use_ps_scan_live_detection_1.usePsScanLiveDetection)(camera.videoRef, isCameraStep && isReady);
     (0, ps_core_components_1.usePsScrollLock)(true);
     (0, ps_core_components_1.usePsRestoreFocus)(true);
     (0, use_ps_focus_trap_1.usePsFocusTrap)(content, true, onClose);
+    (0, react_1.useEffect)(() => () => {
+        if (result !== null)
+            URL.revokeObjectURL(result.url);
+    }, [result]);
     const edgeMessage = (isDetected) => isDetected ? labels.edgesFound : labels.edgesNotFound;
-    const addFiles = async (files, after) => {
+    const accept = async (source) => {
         setError('');
         try {
-            const images = files.filter((file) => file.type === '' || file.type.startsWith('image/'));
-            if (retakeId !== '' && images.length > 0) {
-                const added = await replace(retakeId, images[0]);
-                setActiveId(retakeId);
-                setRetakeId('');
-                setStep(ps_scan_step_1.PsScanStep.Crop);
-                setAnnouncement(edgeMessage(added.isDetected));
-                return;
-            }
-            const room = Math.max(0, maxPages - pages.length);
-            if (images.length > room)
-                setError(labels.maxPages);
-            const added = await add(images.slice(0, room));
-            if (added.length === 0)
-                return;
-            const position = pages.length + added.length;
-            setActiveId(added[added.length - 1].page.id);
-            setAnnouncement(ps_scan_template_service_1.PsScanTemplateService.fill(labels.pageAdded, { position }));
-            if (after === null)
-                return;
-            if (added.length === 1) {
-                setCropReturn(after);
-                setStep(ps_scan_step_1.PsScanStep.Crop);
-                setAnnouncement(edgeMessage(added[0].isDetected));
-            }
-            else
-                setStep(ps_scan_step_1.PsScanStep.Review);
+            const added = await load(source);
+            setAnnouncement(edgeMessage(added.isDetected));
+            setStep(ps_scan_step_1.PsScanStep.Crop);
         }
         catch {
             setError(labels.processFailed);
         }
     };
-    const capture = async (isAutomatic) => {
-        if (isCapturing || isFull)
+    const capture = async () => {
+        if (isCapturing)
             return;
         setIsCapturing(true);
         try {
@@ -94,93 +65,52 @@ const PsDocumentScannerSheet = ({ fileName, isAutoCapture, jpegQuality, labels,
             if (blob === null)
                 return;
             setFlashKey((current) => current + 1);
-            await addFiles([blob], isAutomatic && retakeId === '' ? null : ps_scan_step_1.PsScanStep.Camera);
+            await accept(blob);
         }
         finally {
             setIsCapturing(false);
         }
     };
-    const detection = (0, use_ps_scan_live_detection_1.usePsScanLiveDetection)(camera.videoRef, isCameraStep && isReady, isAuto, () => capture(true));
-    const autoDetect = async () => {
-        if (page === undefined)
-            return;
-        const prepared = await ps_scan_pipeline_service_1.PsScanPipelineService.prepare(page.source);
-        setCorners(page.id, prepared.corners);
-        setAnnouncement(edgeMessage(prepared.isDetected));
-    };
-    const keep = () => setStep(cropReturn === ps_scan_step_1.PsScanStep.Camera && !isFull ? ps_scan_step_1.PsScanStep.Camera : ps_scan_step_1.PsScanStep.Review);
+    const autoDetect = async () => setAnnouncement(edgeMessage(await detectAgain()));
     const retake = () => {
-        if (page === undefined)
-            return;
-        if (step === ps_scan_step_1.PsScanStep.Review)
-            setCropReturn(ps_scan_step_1.PsScanStep.Review);
-        setRetakeId(page.id);
-        setStep(ps_scan_step_1.PsScanStep.Camera);
-    };
-    const openCamera = () => {
-        setRetakeId('');
-        setCropReturn(ps_scan_step_1.PsScanStep.Camera);
+        clear();
+        setResult(null);
+        setError('');
         setStep(ps_scan_step_1.PsScanStep.Camera);
     };
-    const openReview = () => {
-        if (pages.length === 0)
-            return;
-        setRetakeId('');
-        if (page === undefined)
-            setActiveId(lastPage.id);
-        setStep(ps_scan_step_1.PsScanStep.Review);
-    };
-    const editCrop = () => {
-        setCropReturn(ps_scan_step_1.PsScanStep.Review);
+    const adjust = () => {
+        setResult(null);
+        setError('');
         setStep(ps_scan_step_1.PsScanStep.Crop);
     };
-    const deletePage = () => {
-        if (page === undefined)
+    const flatten = async () => {
+        if (photo === null)
             return;
-        const index = pages.findIndex((item) => item.id === page.id);
-        const rest = pages.filter((item) => item.id !== page.id);
-        remove(page.id);
-        setAnnouncement(labels.pageDeleted);
-        if (rest.length === 0) {
-            setActiveId('');
-            openCamera();
-        }
-        else
-            setActiveId(rest[Math.min(index, rest.length - 1)].id);
-    };
-    const finish = async () => {
-        setIsBusy(true);
+        setResult(null);
         setError('');
+        setStep(ps_scan_step_1.PsScanStep.Preview);
         try {
-            const files = await ps_scan_output_service_1.PsScanOutputService.build(pages, {
-                fileName,
-                format: outputFormat,
-                jpegQuality,
-                maxDimension,
-            });
-            onComplete(files);
-            onClose();
+            const rendered = await ps_scan_pipeline_service_1.PsScanPipelineService.render(photo.source, photo.corners, maxDimension, jpegQuality);
+            setResult({ ...rendered, url: URL.createObjectURL(rendered.blob) });
         }
         catch {
             setError(labels.processFailed);
-            setIsBusy(false);
         }
     };
-    const moveTo = (0, react_1.useCallback)((from, to) => {
-        move(from, to);
-        setAnnouncement(ps_scan_template_service_1.PsScanTemplateService.fill(labels.pageMoved, {
-            count: pages.length,
-            page: `${labels.page} ${from + 1}`,
-            position: to + 1,
-        }));
-    }, [move, pages.length, labels]);
-    const fromLibrary = (files) => addFiles(files, ps_scan_step_1.PsScanStep.Review);
+    const use = () => {
+        if (result === null)
+            return;
+        onComplete([
+            new File([result.blob], ps_scan_file_name_service_1.PsScanFileNameService.build(fileName), { type: 'image/jpeg' }),
+        ]);
+        onClose();
+    };
     if (typeof document === 'undefined')
         return null;
     return (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)("div", { "aria-label": labels.title, "aria-modal": 'true', className: isDesktop
             ? 'fixed inset-0 flex items-center justify-center bg-black/70 p-6 backdrop-blur-sm animate-ps-fade-in'
             : 'fixed inset-0 bg-black animate-ps-fade-in', role: 'dialog', style: { zIndex }, children: (0, jsx_runtime_1.jsx)(ps_core_components_1.PsLayer, { zIndex: zIndex, children: (0, jsx_runtime_1.jsxs)("div", { className: isDesktop
                     ? 'relative h-[min(52rem,calc(100dvh-3rem))] w-[min(76rem,calc(100vw-3rem))] overflow-hidden rounded-2xl bg-black text-white shadow-2xl ring-1 ring-white/10 animate-ps-scale-in'
-                    : 'relative h-full overflow-hidden bg-black text-white', ref: content, children: [(0, jsx_runtime_1.jsx)("p", { "aria-live": 'polite', className: 'sr-only', role: 'status', children: announcement }), isCameraStep && showsCamera ? ((0, jsx_runtime_1.jsx)(ps_scan_camera_view_1.PsScanCameraView, { canTorch: camera.canTorch, detection: detection, flashKey: flashKey, isAuto: isAuto, isBusy: isCapturing, isFull: isFull, isMultiple: maxPages > 1, isReady: isReady, isTorchOn: camera.isTorchOn, labels: labels, lastPreview: lastPage === undefined ? undefined : previews[lastPage.id], onCapture: () => capture(false), onClose: onClose, onDone: openReview, onFiles: fromLibrary, onToggleAuto: () => setIsAuto((current) => !current), onToggleTorch: camera.toggleTorch, pageCount: pages.length, videoRef: camera.videoRef, videoTarget: camera.attachVideo })) : null, isCameraStep && !showsCamera ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ps_scan_permission_view_1.PsScanPermissionView, { isMultiple: maxPages > 1, labels: labels, onAllow: camera.allow, onFiles: fromLibrary, status: camera.status }), (0, jsx_runtime_1.jsx)("div", { className: 'absolute left-4 top-[max(1rem,env(safe-area-inset-top))] flex gap-2', children: (0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { iconKey: ps_icons_1.PsIconKey.Close, label: labels.close, onClick: onClose }) }), pages.length > 0 ? ((0, jsx_runtime_1.jsx)("div", { className: 'absolute right-4 top-[max(1rem,env(safe-area-inset-top))]', children: (0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { iconKey: ps_icons_1.PsIconKey.Check, label: ps_scan_template_service_1.PsScanTemplateService.fill(labels.viewPages, { count: pages.length }), onClick: openReview }) })) : null] })) : null, step === ps_scan_step_1.PsScanStep.Crop && page !== undefined ? ((0, jsx_runtime_1.jsx)(ps_scan_crop_editor_1.PsScanCropEditor, { labels: labels, onAutoDetect: autoDetect, onChange: (corners) => setCorners(page.id, corners), onKeep: keep, onRetake: retake, page: page })) : null, step === ps_scan_step_1.PsScanStep.Review && page !== undefined ? ((0, jsx_runtime_1.jsx)(ps_scan_review_1.PsScanReview, { canAddPage: !isFull, error: error, isBusy: isBusy, labels: labels, onAddPage: openCamera, onClose: onClose, onDelete: deletePage, onEditCrop: editCrop, onFilter: (filter) => update(page.id, { filter }), onFinish: finish, onMove: moveTo, onRetake: retake, onRotate: () => update(page.id, { rotation: (page.rotation + 90) % 360 }), onSelect: setActiveId, page: page, pages: pages, previews: previews })) : null, isCameraStep && error !== '' ? ((0, jsx_runtime_1.jsx)("p", { className: 'absolute inset-x-4 bottom-36 mx-auto max-w-sm rounded-ps-control bg-danger px-3 py-2 text-center text-sm text-white', role: 'alert', children: error })) : null] }) }) }), document.body);
+                    : 'relative h-full overflow-hidden bg-black text-white', ref: content, children: [(0, jsx_runtime_1.jsx)("p", { "aria-live": 'polite', className: 'sr-only', role: 'status', children: announcement }), isCameraStep && showsCamera ? ((0, jsx_runtime_1.jsx)(ps_scan_camera_view_1.PsScanCameraView, { canTorch: camera.canTorch, detection: detection, flashKey: flashKey, isBusy: isCapturing, isReady: isReady, isTorchOn: camera.isTorchOn, labels: labels, onCapture: capture, onClose: onClose, onFile: accept, onToggleTorch: camera.toggleTorch, videoRef: camera.videoRef, videoTarget: camera.attachVideo })) : null, isCameraStep && !showsCamera ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ps_scan_permission_view_1.PsScanPermissionView, { labels: labels, onAllow: camera.allow, onFile: accept, status: camera.status }), (0, jsx_runtime_1.jsx)("div", { className: 'absolute left-4 top-[max(1rem,env(safe-area-inset-top))] flex gap-2', children: (0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { iconKey: ps_icons_1.PsIconKey.Close, label: labels.close, onClick: onClose }) })] })) : null, step === ps_scan_step_1.PsScanStep.Crop && photo !== null ? ((0, jsx_runtime_1.jsx)(ps_scan_crop_editor_1.PsScanCropEditor, { labels: labels, onAutoDetect: autoDetect, onChange: setCorners, onContinue: flatten, onRetake: retake, photo: photo })) : null, step === ps_scan_step_1.PsScanStep.Preview ? ((0, jsx_runtime_1.jsx)(ps_scan_preview_1.PsScanPreview, { error: error, labels: labels, onAdjust: adjust, onRetake: retake, onUse: use, result: result })) : null, isCameraStep && error !== '' ? ((0, jsx_runtime_1.jsx)("p", { className: 'absolute inset-x-4 bottom-36 mx-auto max-w-sm rounded-ps-control bg-danger px-3 py-2 text-center text-sm text-white', role: 'alert', children: error })) : null] }) }) }), document.body);
 };
 exports.PsDocumentScannerSheet = PsDocumentScannerSheet;

package/dist/components/ps-document-scanner.d.ts

@@ -1,2 +1,2 @@
 import type { PsDocumentScannerProps } from '../models/ps-document-scanner-props';
-export declare const PsDocumentScanner: ({ fileName, isAutoCapture, isOpen, jpegQuality, labels, maxDimension, maxPages, onClose, onComplete, outputFormat, }: PsDocumentScannerProps) => import("react").JSX.Element | null;
+export declare const PsDocumentScanner: ({ fileName, isOpen, jpegQuality, labels, maxDimension, onClose, onComplete, }: PsDocumentScannerProps) => import("react").JSX.Element | null;

package/dist/components/ps-document-scanner.js

@@ -6,12 +6,11 @@ const react_1 = require("react");
 const ps_core_components_1 = require("@pallasoft/ps-core-components");
 const ps_document_scanner_labels_1 = require("../constants/ps-document-scanner-labels");
 const ps_scan_config_1 = require("../constants/ps-scan-config");
-const ps_scan_output_format_1 = require("../constants/ps-scan-output-format");
 const ps_document_scanner_loader_1 = require("./ps-document-scanner-loader");
-const PsDocumentScanner = ({ fileName = ps_scan_config_1.PsScanConfig.defaultFileName, isAutoCapture = false, isOpen, jpegQuality = ps_scan_config_1.PsScanConfig.defaultJpegQuality, labels, maxDimension = ps_scan_config_1.PsScanConfig.defaultMaxDimension, maxPages = ps_scan_config_1.PsScanConfig.defaultMaxPages, onClose, onComplete, outputFormat = ps_scan_output_format_1.PsScanOutputFormat.Pdf, }) => {
+const PsDocumentScanner = ({ fileName = ps_scan_config_1.PsScanConfig.defaultFileName, isOpen, jpegQuality = ps_scan_config_1.PsScanConfig.defaultJpegQuality, labels, maxDimension = ps_scan_config_1.PsScanConfig.defaultMaxDimension, onClose, onComplete, }) => {
     const isHydrated = (0, ps_core_components_1.usePsHydrated)();
     if (!isOpen || !isHydrated)
         return null;
-    return ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: null, children: (0, jsx_runtime_1.jsx)(ps_document_scanner_loader_1.PsDocumentScannerLoader, { fileName: fileName, isAutoCapture: isAutoCapture, jpegQuality: jpegQuality, labels: { ...ps_document_scanner_labels_1.PsDocumentScannerLabels, ...labels }, maxDimension: maxDimension, maxPages: maxPages, onClose: onClose, onComplete: onComplete, outputFormat: outputFormat }) }));
+    return ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: null, children: (0, jsx_runtime_1.jsx)(ps_document_scanner_loader_1.PsDocumentScannerLoader, { fileName: fileName, jpegQuality: jpegQuality, labels: { ...ps_document_scanner_labels_1.PsDocumentScannerLabels, ...labels }, maxDimension: maxDimension, onClose: onClose, onComplete: onComplete }) }));
 };
 exports.PsDocumentScanner = PsDocumentScanner;

package/dist/components/ps-file-delete-confirm.js

@@ -4,5 +4,5 @@ exports.PsFileDeleteConfirm = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const ps_core_components_1 = require("@pallasoft/ps-core-components");
 const ps_popovers_1 = require("@pallasoft/ps-popovers");
-const PsFileDeleteConfirm = ({ fileName, isDeleting, isOpen, labels, onCancel, onConfirm, }) => ((0, jsx_runtime_1.jsx)(ps_popovers_1.PsModal, { eyebrow: fileName, isOpen: isOpen, onClose: onCancel, size: 'sm', title: labels.deleteConfirm, children: (0, jsx_runtime_1.jsxs)("div", { className: 'flex flex-col gap-5', children: [(0, jsx_runtime_1.jsxs)("p", { className: 'text-sm text-ink/70', children: [(0, jsx_runtime_1.jsx)("span", { className: 'font-medium text-ink', children: fileName }), " ", labels.deleteConfirmBody] }), (0, jsx_runtime_1.jsxs)("div", { className: 'flex justify-end gap-2 border-t border-line pt-4', children: [(0, jsx_runtime_1.jsx)(ps_core_components_1.PsButton, { disabled: isDeleting, onClick: onCancel, type: 'button', variant: 'ghost', children: labels.deleteCancel }), (0, jsx_runtime_1.jsx)(ps_core_components_1.PsButton, { isLoading: isDeleting, onClick: onConfirm, type: 'button', variant: 'danger', children: labels.delete })] })] }) }));
+const PsFileDeleteConfirm = ({ fileName, isDeleting, isOpen, labels, onCancel, onConfirm, }) => ((0, jsx_runtime_1.jsx)(ps_popovers_1.PsModal, { eyebrow: fileName, footer: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ps_core_components_1.PsButton, { disabled: isDeleting, onClick: onCancel, type: 'button', variant: 'surface', children: labels.deleteCancel }), (0, jsx_runtime_1.jsx)(ps_core_components_1.PsButton, { isLoading: isDeleting, onClick: onConfirm, type: 'button', variant: 'danger', children: labels.delete })] }), isOpen: isOpen, onClose: onCancel, size: 'sm', title: labels.deleteConfirm, children: (0, jsx_runtime_1.jsxs)("p", { className: 'text-sm text-ink/70', children: [(0, jsx_runtime_1.jsx)("span", { className: 'font-medium text-ink', children: fileName }), " ", labels.deleteConfirmBody] }) }));
 exports.PsFileDeleteConfirm = PsFileDeleteConfirm;

package/dist/components/ps-scan-camera-view.d.ts

@@ -6,22 +6,15 @@ export interface PsScanCameraViewProps {
     canTorch: boolean;
     detection: PsScanLiveDetection;
     flashKey: number;
-    isAuto: boolean;
     isBusy: boolean;
-    isFull: boolean;
-    isMultiple: boolean;
     isReady: boolean;
     isTorchOn: boolean;
     labels: PsLabelSet<typeof PsDocumentScannerLabels>;
-    lastPreview: string | undefined;
     onCapture: () => void;
     onClose: () => void;
-    onDone: () => void;
-    onFiles: (files: File[]) => void;
-    onToggleAuto: () => void;
+    onFile: (file: File) => void;
     onToggleTorch: () => void;
-    pageCount: number;
     videoRef: RefObject<HTMLVideoElement | null>;
     videoTarget: RefCallback<HTMLVideoElement>;
 }
-export declare const PsScanCameraView: ({ canTorch, detection, flashKey, isAuto, isBusy, isFull, isMultiple, isReady, isTorchOn, labels, lastPreview, onCapture, onClose, onDone, onFiles, onToggleAuto, onToggleTorch, pageCount, videoRef, videoTarget, }: PsScanCameraViewProps) => import("react").JSX.Element;
+export declare const PsScanCameraView: ({ canTorch, detection, flashKey, isBusy, isReady, isTorchOn, labels, onCapture, onClose, onFile, onToggleTorch, videoRef, videoTarget, }: PsScanCameraViewProps) => import("react").JSX.Element;

package/dist/components/ps-scan-camera-view.js

@@ -7,28 +7,19 @@ const ps_core_components_1 = require("@pallasoft/ps-core-components");
 const ps_design_system_1 = require("@pallasoft/ps-design-system");
 const ps_icons_1 = require("@pallasoft/ps-icons");
 const ps_scan_chrome_classes_1 = require("../constants/ps-scan-chrome-classes");
-const ps_scan_template_service_1 = require("../services/ps-scan-template-service");
-const ps_scan_button_1 = require("./ps-scan-button");
 const ps_scan_icon_button_1 = require("./ps-scan-icon-button");
-const ps_scan_page_stack_1 = require("./ps-scan-page-stack");
 const ps_scan_photo_button_1 = require("./ps-scan-photo-button");
 const ps_scan_shutter_1 = require("./ps-scan-shutter");
 const ps_scan_viewfinder_overlay_1 = require("./ps-scan-viewfinder-overlay");
-const PsScanCameraView = ({ canTorch, detection, flashKey, isAuto, isBusy, isFull, isMultiple, isReady, isTorchOn, labels, lastPreview, onCapture, onClose, onDone, onFiles, onToggleAuto, onToggleTorch, pageCount, videoRef, videoTarget, }) => {
+const PsScanCameraView = ({ canTorch, detection, flashKey, isBusy, isReady, isTorchOn, labels, onCapture, onClose, onFile, onToggleTorch, videoRef, videoTarget, }) => {
     const [areaRef, area] = (0, ps_core_components_1.usePsElementSize)();
     const [video, setVideo] = (0, react_1.useState)({ height: 0, width: 0 });
-    const hint = isFull
-        ? labels.maxPages
-        : detection.quad === null
-            ? labels.hintFind
-            : isAuto
-                ? labels.hintHold
-                : labels.hintFound;
+    const hint = detection.quad === null ? labels.hintFind : labels.hintFound;
     const measure = () => {
         const element = videoRef.current;
         if (element !== null)
             setVideo({ height: element.videoHeight, width: element.videoWidth });
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: 'relative h-full min-h-0 overflow-hidden bg-black text-white', children: [(0, jsx_runtime_1.jsxs)("div", { className: 'absolute inset-0', ref: areaRef, children: [(0, jsx_runtime_1.jsx)("video", { "aria-hidden": 'true', autoPlay: true, className: ps_design_system_1.PallasoftClassNameService.merge('size-full object-cover transition-opacity duration-300', isReady ? 'opacity-100' : 'opacity-0'), muted: true, onLoadedMetadata: measure, onResize: measure, playsInline: true, ref: videoTarget }), isReady ? ((0, jsx_runtime_1.jsx)(ps_scan_viewfinder_overlay_1.PsScanViewfinderOverlay, { area: area, quad: detection.quad, video: video })) : null] }), isReady ? null : ((0, jsx_runtime_1.jsxs)("div", { className: 'absolute inset-0 flex flex-col items-center justify-center gap-3 text-sm text-white/75', role: 'status', children: [(0, jsx_runtime_1.jsx)(ps_core_components_1.PsSpinner, { color: 'current', label: labels.cameraStarting, size: 'small' }), (0, jsx_runtime_1.jsx)("span", { children: labels.cameraStarting })] })), flashKey > 0 ? ((0, jsx_runtime_1.jsx)("div", { "aria-hidden": 'true', className: 'pointer-events-none absolute inset-0 bg-white animate-ps-fade-out' }, flashKey)) : null, (0, jsx_runtime_1.jsxs)("div", { className: 'absolute inset-x-0 top-0 flex items-start justify-between gap-3 bg-gradient-to-b from-black/60 to-transparent px-4 pb-10 pt-[max(1rem,env(safe-area-inset-top))]', children: [(0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { iconKey: ps_icons_1.PsIconKey.Close, label: labels.close, onClick: onClose }), (0, jsx_runtime_1.jsxs)("div", { className: 'flex items-center gap-2', children: [canTorch && isReady ? ((0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { iconKey: ps_icons_1.PsIconKey.Flash, isPressed: isTorchOn, label: isTorchOn ? labels.torchOff : labels.torchOn, onClick: onToggleTorch })) : null, (0, jsx_runtime_1.jsx)("button", { "aria-label": labels.autoCapture, "aria-pressed": isAuto, className: ps_design_system_1.PallasoftClassNameService.merge(ps_scan_chrome_classes_1.PsScanChromeClasses.button, 'border-transparent', isAuto ? ps_scan_chrome_classes_1.PsScanChromeClasses.iconOn : ps_scan_chrome_classes_1.PsScanChromeClasses.iconOff), onClick: onToggleAuto, title: labels.autoCapture, type: 'button', children: labels.auto })] })] }), isReady ? ((0, jsx_runtime_1.jsx)("div", { className: 'absolute inset-x-0 top-[calc(max(1rem,env(safe-area-inset-top))+3.75rem)] flex justify-center px-4', children: (0, jsx_runtime_1.jsx)("p", { "aria-live": 'polite', className: ps_scan_chrome_classes_1.PsScanChromeClasses.pill, children: hint }) })) : null, (0, jsx_runtime_1.jsxs)("div", { className: 'absolute inset-x-0 bottom-0 grid grid-cols-[1fr_auto_1fr] items-center gap-4 bg-gradient-to-t from-black/80 to-transparent px-5 pb-[max(1.5rem,env(safe-area-inset-bottom))] pt-12', children: [(0, jsx_runtime_1.jsx)("div", { className: 'flex justify-start', children: pageCount > 0 ? ((0, jsx_runtime_1.jsx)(ps_scan_page_stack_1.PsScanPageStack, { count: pageCount, label: ps_scan_template_service_1.PsScanTemplateService.fill(labels.viewPages, { count: pageCount }), onOpen: onDone, preview: lastPreview })) : ((0, jsx_runtime_1.jsx)(ps_scan_photo_button_1.PsScanPhotoButton, { isIconOnly: true, isMultiple: isMultiple, label: labels.choosePhotos, onFiles: onFiles })) }), (0, jsx_runtime_1.jsx)(ps_scan_shutter_1.PsScanShutter, { disabled: !isReady || isFull || isBusy, label: labels.capture, onCapture: onCapture, progress: detection.progress }), (0, jsx_runtime_1.jsx)("div", { className: 'flex justify-end', children: pageCount > 0 ? ((0, jsx_runtime_1.jsx)(ps_scan_button_1.PsScanButton, { isPrimary: true, onClick: onDone, children: labels.done })) : null })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: 'relative h-full min-h-0 overflow-hidden bg-black text-white', children: [(0, jsx_runtime_1.jsxs)("div", { className: 'absolute inset-0', ref: areaRef, children: [(0, jsx_runtime_1.jsx)("video", { "aria-hidden": 'true', autoPlay: true, className: ps_design_system_1.PallasoftClassNameService.merge('size-full object-cover transition-opacity duration-300', isReady ? 'opacity-100' : 'opacity-0'), muted: true, onLoadedMetadata: measure, onResize: measure, playsInline: true, ref: videoTarget }), isReady ? ((0, jsx_runtime_1.jsx)(ps_scan_viewfinder_overlay_1.PsScanViewfinderOverlay, { area: area, quad: detection.quad, video: video })) : null] }), isReady ? null : ((0, jsx_runtime_1.jsxs)("div", { className: 'absolute inset-0 flex flex-col items-center justify-center gap-3 text-sm text-white/75', role: 'status', children: [(0, jsx_runtime_1.jsx)(ps_core_components_1.PsSpinner, { color: 'current', label: labels.cameraStarting, size: 'small' }), (0, jsx_runtime_1.jsx)("span", { children: labels.cameraStarting })] })), flashKey > 0 ? ((0, jsx_runtime_1.jsx)("div", { "aria-hidden": 'true', className: 'pointer-events-none absolute inset-0 bg-white animate-ps-fade-out' }, flashKey)) : null, (0, jsx_runtime_1.jsxs)("div", { className: 'absolute inset-x-0 top-0 flex items-start justify-between gap-3 bg-gradient-to-b from-black/60 to-transparent px-4 pb-10 pt-[max(1rem,env(safe-area-inset-top))]', children: [(0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { iconKey: ps_icons_1.PsIconKey.Close, label: labels.close, onClick: onClose }), (0, jsx_runtime_1.jsx)("div", { className: 'flex items-center gap-2', children: canTorch && isReady ? ((0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { iconKey: ps_icons_1.PsIconKey.Flash, isPressed: isTorchOn, label: isTorchOn ? labels.torchOff : labels.torchOn, onClick: onToggleTorch })) : null })] }), isReady ? ((0, jsx_runtime_1.jsx)("div", { className: 'absolute inset-x-0 top-[calc(max(1rem,env(safe-area-inset-top))+3.75rem)] flex justify-center px-4', children: (0, jsx_runtime_1.jsx)("p", { "aria-live": 'polite', className: ps_scan_chrome_classes_1.PsScanChromeClasses.pill, children: hint }) })) : null, (0, jsx_runtime_1.jsxs)("div", { className: 'absolute inset-x-0 bottom-0 grid grid-cols-[1fr_auto_1fr] items-center gap-4 bg-gradient-to-t from-black/80 to-transparent px-5 pb-[max(1.5rem,env(safe-area-inset-bottom))] pt-12', children: [(0, jsx_runtime_1.jsx)("div", { className: 'flex justify-start', children: (0, jsx_runtime_1.jsx)(ps_scan_photo_button_1.PsScanPhotoButton, { isIconOnly: true, label: labels.choosePhoto, onFile: onFile }) }), (0, jsx_runtime_1.jsx)(ps_scan_shutter_1.PsScanShutter, { disabled: !isReady || isBusy, label: labels.capture, onCapture: onCapture }), (0, jsx_runtime_1.jsx)("span", { "aria-hidden": 'true' })] })] }));
 };
 exports.PsScanCameraView = PsScanCameraView;

package/dist/components/ps-scan-crop-editor.d.ts

@@ -1,13 +1,13 @@
 import { PsDocumentScannerLabels } from '../constants/ps-document-scanner-labels';
 import type { PsLabelSet } from '../models/ps-label-set';
-import type { PsScanPage } from '../models/ps-scan-page';
+import type { PsScanPhoto } from '../models/ps-scan-photo';
 import type { PsScanQuad } from '../models/ps-scan-quad';
 export interface PsScanCropEditorProps {
     labels: PsLabelSet<typeof PsDocumentScannerLabels>;
     onAutoDetect: () => void;
     onChange: (corners: PsScanQuad) => void;
-    onKeep: () => void;
+    onContinue: () => void;
     onRetake: () => void;
-    page: PsScanPage;
+    photo: PsScanPhoto;
 }
-export declare const PsScanCropEditor: ({ labels, onAutoDetect, onChange, onKeep, onRetake, page, }: PsScanCropEditorProps) => import("react").JSX.Element;
+export declare const PsScanCropEditor: ({ labels, onAutoDetect, onChange, onContinue, onRetake, photo, }: PsScanCropEditorProps) => import("react").JSX.Element;

package/dist/components/ps-scan-crop-editor.js

@@ -12,19 +12,19 @@ const ps_scan_geometry_service_1 = require("../services/ps-scan-geometry-service
 const ps_scan_button_1 = require("./ps-scan-button");
 const ps_scan_icon_button_1 = require("./ps-scan-icon-button");
 const ps_scan_loupe_1 = require("./ps-scan-loupe");
-const PsScanCropEditor = ({ labels, onAutoDetect, onChange, onKeep, onRetake, page, }) => {
+const PsScanCropEditor = ({ labels, onAutoDetect, onChange, onContinue, onRetake, photo, }) => {
     const [areaRef, area] = (0, ps_core_components_1.usePsElementSize)();
     const stageRef = (0, react_1.useRef)(null);
     const [activeIndex, setActiveIndex] = (0, react_1.useState)(null);
     const hintId = 'ps-scan-crop-hint';
-    const size = ps_scan_geometry_service_1.PsScanGeometryService.fit(area, { height: page.height, width: page.width });
+    const size = ps_scan_geometry_service_1.PsScanGeometryService.fit(area, { height: photo.height, width: photo.width });
     const cornerLabels = [
         labels.cornerTopLeft,
         labels.cornerTopRight,
         labels.cornerBottomRight,
         labels.cornerBottomLeft,
     ];
-    const outline = page.corners
+    const outline = photo.corners
         .map((point) => `${point.x * size.width},${point.y * size.height}`)
         .join(' L');
     const move = (index, event) => {
@@ -36,7 +36,7 @@ const PsScanCropEditor = ({ labels, onAutoDetect, onChange, onKeep, onRetake, pa
             x: (event.clientX - rect.left) / rect.width,
             y: (event.clientY - rect.top) / rect.height,
         });
-        const next = page.corners.map((corner, at) => (at === index ? point : corner));
+        const next = photo.corners.map((corner, at) => (at === index ? point : corner));
         if (ps_scan_geometry_service_1.PsScanGeometryService.isUsable(next))
             onChange(next);
     };
@@ -56,14 +56,14 @@ const PsScanCropEditor = ({ labels, onAutoDetect, onChange, onKeep, onRetake, pa
         if (delta === undefined)
             return;
         event.preventDefault();
-        onChange(ps_scan_geometry_service_1.PsScanGeometryService.nudge(page.corners, index, delta[0], delta[1]));
+        onChange(ps_scan_geometry_service_1.PsScanGeometryService.nudge(photo.corners, index, delta[0], delta[1]));
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: 'flex h-full min-h-0 flex-col bg-black text-white animate-ps-fade-in', children: [(0, jsx_runtime_1.jsxs)("header", { className: 'grid shrink-0 grid-cols-[2.75rem_1fr_2.75rem] items-center gap-3 px-4 pb-1 pt-[max(1rem,env(safe-area-inset-top))]', children: [(0, jsx_runtime_1.jsx)("span", { "aria-hidden": 'true' }), (0, jsx_runtime_1.jsx)("h2", { className: 'truncate text-center text-base font-semibold', children: labels.cropTitle }), (0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { iconKey: ps_icons_1.PsIconKey.Spark, label: labels.autoDetect, onClick: onAutoDetect })] }), (0, jsx_runtime_1.jsx)("p", { className: 'shrink-0 px-6 text-center text-sm text-white/65', id: hintId, children: labels.cropHint }), (0, jsx_runtime_1.jsx)("div", { className: 'flex min-h-0 flex-1 items-center justify-center px-8 py-6', ref: areaRef, children: (0, jsx_runtime_1.jsxs)("div", { className: 'relative touch-none select-none', ref: stageRef, style: { height: size.height, width: size.width }, children: [(0, jsx_runtime_1.jsx)("img", { alt: '', className: 'absolute inset-0 size-full rounded-sm', draggable: false, src: page.sourceUrl }), (0, jsx_runtime_1.jsxs)("svg", { "aria-hidden": 'true', className: 'pointer-events-none absolute inset-0 size-full overflow-visible', viewBox: `0 0 ${Math.max(1, size.width)} ${Math.max(1, size.height)}`, children: [(0, jsx_runtime_1.jsx)("path", { className: 'fill-black/55', d: `M0 0H${size.width}V${size.height}H0Z M${outline}Z`, fillRule: 'evenodd' }), (0, jsx_runtime_1.jsx)("path", { className: 'fill-none stroke-primary', d: `M${outline}Z`, strokeLinejoin: 'round', strokeWidth: '2.5' })] }), ps_scan_corner_order_1.PsScanCornerOrder.map((key, index) => ((0, jsx_runtime_1.jsx)("button", { "aria-describedby": hintId, "aria-label": cornerLabels[index], className: 'ps-focus-ring absolute flex size-12 -translate-x-1/2 -translate-y-1/2 cursor-grab touch-none items-center justify-center rounded-full active:cursor-grabbing', onKeyDown: (event) => nudge(index, event), onPointerCancel: release, onPointerDown: (event) => {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: 'flex h-full min-h-0 flex-col bg-black text-white animate-ps-fade-in', children: [(0, jsx_runtime_1.jsxs)("header", { className: 'grid shrink-0 grid-cols-[2.75rem_1fr_2.75rem] items-center gap-3 px-4 pb-1 pt-[max(1rem,env(safe-area-inset-top))]', children: [(0, jsx_runtime_1.jsx)("span", { "aria-hidden": 'true' }), (0, jsx_runtime_1.jsx)("h2", { className: 'truncate text-center text-base font-semibold', children: labels.cropTitle }), (0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { iconKey: ps_icons_1.PsIconKey.Spark, label: labels.autoDetect, onClick: onAutoDetect })] }), (0, jsx_runtime_1.jsxs)("p", { className: 'shrink-0 px-6 text-center text-sm text-white/65', id: hintId, children: [photo.isDetected ? labels.edgesFound : labels.edgesNotFound, " ", labels.cropHint] }), (0, jsx_runtime_1.jsx)("div", { className: 'flex min-h-0 flex-1 items-center justify-center px-8 py-6', ref: areaRef, children: (0, jsx_runtime_1.jsxs)("div", { className: 'relative touch-none select-none', ref: stageRef, style: { height: size.height, width: size.width }, children: [(0, jsx_runtime_1.jsx)("img", { alt: '', className: 'absolute inset-0 size-full rounded-sm', draggable: false, src: photo.sourceUrl }), (0, jsx_runtime_1.jsxs)("svg", { "aria-hidden": 'true', className: 'pointer-events-none absolute inset-0 size-full overflow-visible', viewBox: `0 0 ${Math.max(1, size.width)} ${Math.max(1, size.height)}`, children: [(0, jsx_runtime_1.jsx)("path", { className: 'fill-black/55', d: `M0 0H${size.width}V${size.height}H0Z M${outline}Z`, fillRule: 'evenodd' }), (0, jsx_runtime_1.jsx)("path", { className: 'fill-none stroke-primary', d: `M${outline}Z`, strokeLinejoin: 'round', strokeWidth: '2.5' })] }), ps_scan_corner_order_1.PsScanCornerOrder.map((key, index) => ((0, jsx_runtime_1.jsx)("button", { "aria-describedby": hintId, "aria-label": cornerLabels[index], className: 'ps-focus-ring absolute flex size-11 -translate-x-1/2 -translate-y-1/2 cursor-grab touch-none items-center justify-center rounded-full active:cursor-grabbing', onKeyDown: (event) => nudge(index, event), onPointerCancel: release, onPointerDown: (event) => {
                                 event.currentTarget.setPointerCapture(event.pointerId);
                                 setActiveIndex(index);
                             }, onPointerMove: (event) => move(index, event), onPointerUp: release, style: {
-                                left: `${page.corners[index].x * 100}%`,
-                                top: `${page.corners[index].y * 100}%`,
-                            }, type: 'button', children: (0, jsx_runtime_1.jsx)("span", { className: ps_design_system_1.PallasoftClassNameService.merge('size-6 rounded-full border-[3px] border-white bg-primary shadow-lg transition-transform duration-150', activeIndex === index ? 'scale-125' : '') }) }, key))), activeIndex === null ? null : ((0, jsx_runtime_1.jsx)(ps_scan_loupe_1.PsScanLoupe, { corners: page.corners, point: page.corners[activeIndex], source: page.sourceUrl, stage: size }))] }) }), (0, jsx_runtime_1.jsxs)("footer", { className: 'mx-auto grid w-full max-w-md shrink-0 grid-cols-2 gap-3 px-4 pb-[max(1.25rem,env(safe-area-inset-bottom))] pt-2', children: [(0, jsx_runtime_1.jsx)(ps_scan_button_1.PsScanButton, { isLarge: true, onClick: onRetake, children: labels.retake }), (0, jsx_runtime_1.jsx)(ps_scan_button_1.PsScanButton, { isLarge: true, isPrimary: true, onClick: onKeep, children: labels.keepScan })] })] }));
+                                left: `${photo.corners[index].x * 100}%`,
+                                top: `${photo.corners[index].y * 100}%`,
+                            }, type: 'button', children: (0, jsx_runtime_1.jsx)("span", { className: ps_design_system_1.PallasoftClassNameService.merge('size-6 rounded-full border-[3px] border-white bg-primary shadow-lg transition-transform duration-150', activeIndex === index ? 'scale-125' : '') }) }, key))), activeIndex === null ? null : ((0, jsx_runtime_1.jsx)(ps_scan_loupe_1.PsScanLoupe, { corners: photo.corners, point: photo.corners[activeIndex], source: photo.sourceUrl, stage: size }))] }) }), (0, jsx_runtime_1.jsxs)("footer", { className: 'mx-auto grid w-full max-w-md shrink-0 grid-cols-2 gap-3 px-4 pb-[max(1.25rem,env(safe-area-inset-bottom))] pt-2', children: [(0, jsx_runtime_1.jsx)(ps_scan_button_1.PsScanButton, { isLarge: true, onClick: onRetake, children: labels.retake }), (0, jsx_runtime_1.jsx)(ps_scan_button_1.PsScanButton, { isLarge: true, isPrimary: true, onClick: onContinue, children: labels.continue })] })] }));
 };
 exports.PsScanCropEditor = PsScanCropEditor;

package/dist/components/ps-scan-permission-view.d.ts

@@ -2,10 +2,9 @@ import { PsDocumentScannerLabels } from '../constants/ps-document-scanner-labels
 import { PsScanCameraStatus } from '../constants/ps-scan-camera-status';
 import type { PsLabelSet } from '../models/ps-label-set';
 export interface PsScanPermissionViewProps {
-    isMultiple: boolean;
     labels: PsLabelSet<typeof PsDocumentScannerLabels>;
     onAllow: () => void;
-    onFiles: (files: File[]) => void;
+    onFile: (file: File) => void;
     status: PsScanCameraStatus;
 }
-export declare const PsScanPermissionView: ({ isMultiple, labels, onAllow, onFiles, status, }: PsScanPermissionViewProps) => import("react").JSX.Element;
+export declare const PsScanPermissionView: ({ labels, onAllow, onFile, status, }: PsScanPermissionViewProps) => import("react").JSX.Element;

package/dist/components/ps-scan-permission-view.js

@@ -9,7 +9,7 @@ const ps_scan_button_1 = require("./ps-scan-button");
 const ps_scan_denied_steps_1 = require("./ps-scan-denied-steps");
 const ps_scan_illustration_1 = require("./ps-scan-illustration");
 const ps_scan_photo_button_1 = require("./ps-scan-photo-button");
-const PsScanPermissionView = ({ isMultiple, labels, onAllow, onFiles, status, }) => {
+const PsScanPermissionView = ({ labels, onAllow, onFile, status, }) => {
     if (status === ps_scan_camera_status_1.PsScanCameraStatus.Checking || status === ps_scan_camera_status_1.PsScanCameraStatus.Starting)
         return ((0, jsx_runtime_1.jsxs)("div", { className: 'flex h-full flex-col items-center justify-center gap-3 text-sm text-white/75', role: 'status', children: [(0, jsx_runtime_1.jsx)(ps_core_components_1.PsSpinner, { color: 'current', label: labels.cameraStarting, size: 'small' }), (0, jsx_runtime_1.jsx)("span", { children: labels.cameraStarting })] }));
     const screens = {
@@ -43,6 +43,6 @@ const PsScanPermissionView = ({ isMultiple, labels, onAllow, onFiles, status, })
     const screen = screens[status];
     const isPrimer = status === ps_scan_camera_status_1.PsScanCameraStatus.Prompt;
     const canRetry = status === ps_scan_camera_status_1.PsScanCameraStatus.Denied || status === ps_scan_camera_status_1.PsScanCameraStatus.Busy;
-    return ((0, jsx_runtime_1.jsx)("div", { className: 'flex h-full min-h-0 flex-col overflow-y-auto', children: (0, jsx_runtime_1.jsxs)("div", { className: 'm-auto flex w-full max-w-sm flex-col items-center gap-6 px-6 pb-[max(1.5rem,env(safe-area-inset-bottom))] pt-20 text-center animate-ps-slide-up', children: [isPrimer ? ((0, jsx_runtime_1.jsx)(ps_scan_illustration_1.PsScanIllustration, {})) : ((0, jsx_runtime_1.jsx)("span", { className: 'flex size-20 items-center justify-center rounded-full bg-white/10 text-white', children: (0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'size-9', iconKey: screen.iconKey }) })), (0, jsx_runtime_1.jsxs)("div", { className: 'flex flex-col gap-2', children: [(0, jsx_runtime_1.jsx)("h2", { className: 'text-xl font-semibold leading-tight text-white sm:text-2xl', children: screen.title }), (0, jsx_runtime_1.jsx)("p", { className: 'text-sm leading-6 text-white/70', children: screen.body })] }), status === ps_scan_camera_status_1.PsScanCameraStatus.Denied ? (0, jsx_runtime_1.jsx)(ps_scan_denied_steps_1.PsScanDeniedSteps, { labels: labels }) : null, (0, jsx_runtime_1.jsxs)("div", { className: 'flex w-full flex-col gap-3', children: [isPrimer || canRetry ? ((0, jsx_runtime_1.jsx)(ps_scan_button_1.PsScanButton, { className: 'w-full', isLarge: true, isPrimary: true, leadingIcon: isPrimer ? ((0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'size-4', iconKey: ps_icons_1.PsIconKey.Camera })) : undefined, onClick: onAllow, children: isPrimer ? labels.allowCamera : labels.tryAgain })) : null, (0, jsx_runtime_1.jsx)(ps_scan_photo_button_1.PsScanPhotoButton, { className: 'w-full', isMultiple: isMultiple, label: labels.choosePhoto, onFiles: onFiles })] })] }) }));
+    return ((0, jsx_runtime_1.jsx)("div", { className: 'flex h-full min-h-0 flex-col overflow-y-auto', children: (0, jsx_runtime_1.jsxs)("div", { className: 'm-auto flex w-full max-w-sm flex-col items-center gap-6 px-6 pb-[max(1.5rem,env(safe-area-inset-bottom))] pt-20 text-center animate-ps-slide-up', children: [isPrimer ? ((0, jsx_runtime_1.jsx)(ps_scan_illustration_1.PsScanIllustration, {})) : ((0, jsx_runtime_1.jsx)("span", { className: 'flex size-20 items-center justify-center rounded-full bg-white/10 text-white', children: (0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'size-9', iconKey: screen.iconKey }) })), (0, jsx_runtime_1.jsxs)("div", { className: 'flex flex-col gap-2', children: [(0, jsx_runtime_1.jsx)("h2", { className: 'text-xl font-semibold leading-tight text-white sm:text-2xl', children: screen.title }), (0, jsx_runtime_1.jsx)("p", { className: 'text-sm leading-6 text-white/70', children: screen.body })] }), status === ps_scan_camera_status_1.PsScanCameraStatus.Denied ? (0, jsx_runtime_1.jsx)(ps_scan_denied_steps_1.PsScanDeniedSteps, { labels: labels }) : null, (0, jsx_runtime_1.jsxs)("div", { className: 'flex w-full flex-col gap-3', children: [isPrimer || canRetry ? ((0, jsx_runtime_1.jsx)(ps_scan_button_1.PsScanButton, { className: 'w-full', isLarge: true, isPrimary: true, leadingIcon: isPrimer ? ((0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'size-4', iconKey: ps_icons_1.PsIconKey.Camera })) : undefined, onClick: onAllow, children: isPrimer ? labels.allowCamera : labels.tryAgain })) : null, (0, jsx_runtime_1.jsx)(ps_scan_photo_button_1.PsScanPhotoButton, { className: 'w-full', label: labels.choosePhoto, onFile: onFile })] })] }) }));
 };
 exports.PsScanPermissionView = PsScanPermissionView;

package/dist/components/ps-scan-photo-button.d.ts

@@ -1,8 +1,7 @@
 export interface PsScanPhotoButtonProps {
     className?: string;
     isIconOnly?: boolean;
-    isMultiple: boolean;
     label: string;
-    onFiles: (files: File[]) => void;
+    onFile: (file: File) => void;
 }
-export declare const PsScanPhotoButton: ({ className, isIconOnly, isMultiple, label, onFiles, }: PsScanPhotoButtonProps) => import("react").JSX.Element;
+export declare const PsScanPhotoButton: ({ className, isIconOnly, label, onFile, }: PsScanPhotoButtonProps) => import("react").JSX.Element;

package/dist/components/ps-scan-photo-button.js

@@ -6,15 +6,15 @@ const react_1 = require("react");
 const ps_icons_1 = require("@pallasoft/ps-icons");
 const ps_scan_button_1 = require("./ps-scan-button");
 const ps_scan_icon_button_1 = require("./ps-scan-icon-button");
-const PsScanPhotoButton = ({ className, isIconOnly = false, isMultiple, label, onFiles, }) => {
+const PsScanPhotoButton = ({ className, isIconOnly = false, label, onFile, }) => {
     const input = (0, react_1.useRef)(null);
     const open = () => input.current?.click();
     const onChange = (event) => {
-        const files = Array.from(event.target.files === null ? [] : event.target.files);
+        const file = event.target.files === null ? undefined : event.target.files[0];
         event.target.value = '';
-        if (files.length > 0)
-            onFiles(files);
+        if (file !== undefined)
+            onFile(file);
     };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isIconOnly ? ((0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { className: className, iconKey: ps_icons_1.PsIconKey.Image, label: label, onClick: open })) : ((0, jsx_runtime_1.jsx)(ps_scan_button_1.PsScanButton, { className: className, isLarge: true, leadingIcon: (0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'size-4', iconKey: ps_icons_1.PsIconKey.Image }), onClick: open, children: label })), (0, jsx_runtime_1.jsx)("input", { accept: 'image/*', "aria-hidden": 'true', className: 'sr-only', multiple: isMultiple, onChange: onChange, ref: input, tabIndex: -1, type: 'file' })] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isIconOnly ? ((0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { className: className, iconKey: ps_icons_1.PsIconKey.Image, label: label, onClick: open })) : ((0, jsx_runtime_1.jsx)(ps_scan_button_1.PsScanButton, { className: className, isLarge: true, leadingIcon: (0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'size-4', iconKey: ps_icons_1.PsIconKey.Image }), onClick: open, children: label })), (0, jsx_runtime_1.jsx)("input", { accept: 'image/*', "aria-hidden": 'true', className: 'sr-only', onChange: onChange, ref: input, tabIndex: -1, type: 'file' })] }));
 };
 exports.PsScanPhotoButton = PsScanPhotoButton;

package/dist/components/ps-scan-preview.d.ts

@@ -0,0 +1,12 @@
+import { PsDocumentScannerLabels } from '../constants/ps-document-scanner-labels';
+import type { PsLabelSet } from '../models/ps-label-set';
+import type { PsScanResult } from '../models/ps-scan-result';
+export interface PsScanPreviewProps {
+    error: string;
+    labels: PsLabelSet<typeof PsDocumentScannerLabels>;
+    onAdjust: () => void;
+    onRetake: () => void;
+    onUse: () => void;
+    result: PsScanResult | null;
+}
+export declare const PsScanPreview: ({ error, labels, onAdjust, onRetake, onUse, result, }: PsScanPreviewProps) => import("react").JSX.Element;

package/dist/components/ps-scan-preview.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsScanPreview = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ps_core_components_1 = require("@pallasoft/ps-core-components");
+const ps_icons_1 = require("@pallasoft/ps-icons");
+const ps_scan_button_1 = require("./ps-scan-button");
+const ps_scan_icon_button_1 = require("./ps-scan-icon-button");
+const PsScanPreview = ({ error, labels, onAdjust, onRetake, onUse, result, }) => ((0, jsx_runtime_1.jsxs)("div", { className: 'flex h-full min-h-0 flex-col bg-black text-white animate-ps-fade-in', children: [(0, jsx_runtime_1.jsxs)("header", { className: 'grid shrink-0 grid-cols-[2.75rem_1fr_2.75rem] items-center gap-3 px-4 pb-1 pt-[max(1rem,env(safe-area-inset-top))]', children: [(0, jsx_runtime_1.jsx)(ps_scan_icon_button_1.PsScanIconButton, { iconKey: ps_icons_1.PsIconKey.Crop, label: labels.cropTitle, onClick: onAdjust }), (0, jsx_runtime_1.jsx)("h2", { className: 'truncate text-center text-base font-semibold', children: labels.previewTitle }), (0, jsx_runtime_1.jsx)("span", { "aria-hidden": 'true' })] }), (0, jsx_runtime_1.jsx)("div", { className: 'flex min-h-0 flex-1 items-center justify-center px-6 py-4', children: result === null ? ((0, jsx_runtime_1.jsxs)("div", { className: 'flex flex-col items-center gap-3 text-sm text-white/75', role: 'status', children: [(0, jsx_runtime_1.jsx)(ps_core_components_1.PsSpinner, { color: 'current', label: labels.preparing, size: 'small' }), (0, jsx_runtime_1.jsx)("span", { children: labels.preparing })] })) : ((0, jsx_runtime_1.jsx)("img", { alt: labels.previewAlt, className: 'max-h-full max-w-full rounded-sm bg-white object-contain shadow-[0_24px_60px_-20px_rgb(0_0_0/0.9)] animate-ps-fade-in', src: result.url })) }), error === '' ? null : ((0, jsx_runtime_1.jsx)("p", { className: 'mx-auto mb-2 max-w-sm rounded-ps-control bg-danger px-3 py-2 text-center text-sm text-white', role: 'alert', children: error })), (0, jsx_runtime_1.jsxs)("footer", { className: 'mx-auto grid w-full max-w-md shrink-0 grid-cols-2 gap-3 px-4 pb-[max(1.25rem,env(safe-area-inset-bottom))] pt-2', children: [(0, jsx_runtime_1.jsx)(ps_scan_button_1.PsScanButton, { isLarge: true, onClick: onRetake, children: labels.retake }), (0, jsx_runtime_1.jsx)(ps_scan_button_1.PsScanButton, { disabled: result === null, isLarge: true, isPrimary: true, leadingIcon: (0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'size-4', iconKey: ps_icons_1.PsIconKey.Check }), onClick: onUse, children: labels.useScan })] })] }));
+exports.PsScanPreview = PsScanPreview;

package/dist/components/ps-scan-shutter.d.ts

@@ -2,6 +2,5 @@ export interface PsScanShutterProps {
     disabled: boolean;
     label: string;
     onCapture: () => void;
-    progress: number;
 }
-export declare const PsScanShutter: ({ disabled, label, onCapture, progress }: PsScanShutterProps) => import("react").JSX.Element;
+export declare const PsScanShutter: ({ disabled, label, onCapture }: PsScanShutterProps) => import("react").JSX.Element;

package/dist/components/ps-scan-shutter.js

@@ -2,5 +2,5 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PsScanShutter = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const PsScanShutter = ({ disabled, label, onCapture, progress }) => ((0, jsx_runtime_1.jsxs)("button", { "aria-label": label, className: 'ps-focus-ring group relative flex size-[4.75rem] shrink-0 items-center justify-center rounded-full disabled:opacity-40', disabled: disabled, onClick: onCapture, title: label, type: 'button', children: [(0, jsx_runtime_1.jsxs)("svg", { "aria-hidden": 'true', className: 'absolute inset-0 size-full -rotate-90', viewBox: '0 0 76 76', children: [(0, jsx_runtime_1.jsx)("circle", { className: 'stroke-white', cx: '38', cy: '38', fill: 'none', r: '35', strokeWidth: '4' }), (0, jsx_runtime_1.jsx)("circle", { className: 'stroke-primary transition-[stroke-dashoffset] duration-150 ease-linear', cx: '38', cy: '38', fill: 'none', pathLength: '100', r: '35', strokeDasharray: '100', strokeDashoffset: 100 - Math.round(progress * 100), strokeLinecap: 'round', strokeWidth: '4' })] }), (0, jsx_runtime_1.jsx)("span", { className: 'size-[3.75rem] rounded-full bg-white transition-transform duration-150 group-active:scale-90' })] }));
+const PsScanShutter = ({ disabled, label, onCapture }) => ((0, jsx_runtime_1.jsxs)("button", { "aria-label": label, className: 'ps-focus-ring group relative flex size-[4.75rem] shrink-0 items-center justify-center rounded-full disabled:opacity-40', disabled: disabled, onClick: onCapture, title: label, type: 'button', children: [(0, jsx_runtime_1.jsx)("svg", { "aria-hidden": 'true', className: 'absolute inset-0 size-full -rotate-90', viewBox: '0 0 76 76', children: (0, jsx_runtime_1.jsx)("circle", { className: 'stroke-white', cx: '38', cy: '38', fill: 'none', r: '35', strokeWidth: '4' }) }), (0, jsx_runtime_1.jsx)("span", { className: 'size-[3.75rem] rounded-full bg-white transition-transform duration-150 group-active:scale-90' })] }));
 exports.PsScanShutter = PsScanShutter;

package/dist/components/ps-upload-modal.js

@@ -11,6 +11,6 @@ const PsUploadModal = ({ isOpen, labels, onClose, queue }) => {
     const text = { ...ps_upload_labels_1.PsUploadLabels, ...labels };
     const summary = ps_upload_queue_service_1.PsUploadQueueService.summary(queue.items);
     const title = queue.isBusy ? text.title : summary.failed > 0 ? text.titleFailed : text.titleDone;
-    return ((0, jsx_runtime_1.jsx)(ps_popovers_1.PsModal, { isOpen: isOpen, onClose: onClose, size: 'md', title: title, children: (0, jsx_runtime_1.jsxs)("div", { className: 'flex flex-col gap-5', children: [(0, jsx_runtime_1.jsx)("ul", { className: 'flex max-h-[50vh] flex-col gap-2 overflow-y-auto', children: queue.items.map((item) => ((0, jsx_runtime_1.jsx)(ps_upload_row_1.PsUploadRow, { item: item, labels: text, onCancel: () => queue.cancel(item.id), onRemove: () => queue.remove(item.id), onRetry: () => queue.retry(item.id) }, item.id))) }), (0, jsx_runtime_1.jsxs)("div", { className: 'flex flex-wrap items-center justify-end gap-2 border-t border-line pt-4', children: [queue.isBusy ? ((0, jsx_runtime_1.jsx)(ps_core_components_1.PsButton, { onClick: () => queue.items.forEach((item) => queue.cancel(item.id)), type: 'button', variant: 'ghost', children: text.cancelAll })) : null, (0, jsx_runtime_1.jsx)(ps_core_components_1.PsButton, { onClick: onClose, type: 'button', variant: 'primary', children: text.finish })] })] }) }));
+    return ((0, jsx_runtime_1.jsx)(ps_popovers_1.PsModal, { footer: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [queue.isBusy ? ((0, jsx_runtime_1.jsx)(ps_core_components_1.PsButton, { onClick: () => queue.items.forEach((item) => queue.cancel(item.id)), type: 'button', variant: 'surface', children: text.cancelAll })) : null, (0, jsx_runtime_1.jsx)(ps_core_components_1.PsButton, { onClick: onClose, type: 'button', variant: 'primary', children: text.finish })] }), isOpen: isOpen, onClose: onClose, size: 'md', title: title, children: (0, jsx_runtime_1.jsx)("ul", { className: 'flex flex-col gap-2', children: queue.items.map((item) => ((0, jsx_runtime_1.jsx)(ps_upload_row_1.PsUploadRow, { item: item, labels: text, onCancel: () => queue.cancel(item.id), onRemove: () => queue.remove(item.id), onRetry: () => queue.retry(item.id) }, item.id))) }) }));
 };
 exports.PsUploadModal = PsUploadModal;