@snokam/ui 1.0.0

package/dist/components/core-values/values.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AlwaysAhead, ChangeIcon, LittleExtraIcon, WarmthIcon } from "./icons";
+const values = [
+    { icon: _jsx(AlwaysAhead, {}) },
+    { icon: _jsx(LittleExtraIcon, {}) },
+    { icon: _jsx(WarmthIcon, {}) },
+    { icon: _jsx(ChangeIcon, {}) },
+];
+export default values;
+//# sourceMappingURL=values.js.map

package/dist/components/core-values/values.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"values.js","sourceRoot":"","sources":["../../../src/components/core-values/values.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAM/E,MAAM,MAAM,GAAgB;IAC1B,EAAE,IAAI,EAAE,KAAC,WAAW,KAAG,EAAE;IACzB,EAAE,IAAI,EAAE,KAAC,eAAe,KAAG,EAAE;IAC7B,EAAE,IAAI,EAAE,KAAC,UAAU,KAAG,EAAE;IACxB,EAAE,IAAI,EAAE,KAAC,UAAU,KAAG,EAAE;CACzB,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/components/data-load-error/index.d.ts

@@ -0,0 +1,6 @@
+export interface DataLoadErrorProps {
+    label: string;
+}
+export declare function DataLoadError({ label }: DataLoadErrorProps): import("react").JSX.Element;
+export default DataLoadError;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/data-load-error/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/data-load-error/index.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,EAAE,kBAAkB,+BAQ1D;AAED,eAAe,aAAa,CAAC"}

package/dist/components/data-load-error/index.js

@@ -0,0 +1,9 @@
+"use client";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Alert } from "../alert";
+import { Wrapper } from "./styles";
+export function DataLoadError({ label }) {
+    return (_jsx(Wrapper, { children: _jsxs(Alert, { severity: "warning", children: ["Kunne ikke laste ", label, ". Pr\u00F8v \u00E5 oppdatere siden."] }) }));
+}
+export default DataLoadError;
+//# sourceMappingURL=index.js.map

package/dist/components/data-load-error/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/data-load-error/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAMnC,MAAM,UAAU,aAAa,CAAC,EAAE,KAAK,EAAsB;IACzD,OAAO,CACL,KAAC,OAAO,cACN,MAAC,KAAK,IAAC,QAAQ,EAAC,SAAS,kCACL,KAAK,2CACjB,GACA,CACX,CAAC;AACJ,CAAC;AAED,eAAe,aAAa,CAAC"}

package/dist/components/data-load-error/styles.d.ts

@@ -0,0 +1,5 @@
+export declare const Wrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+//# sourceMappingURL=styles.d.ts.map

package/dist/components/data-load-error/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/data-load-error/styles.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,OAAO;;;yGAGnB,CAAC"}

package/dist/components/data-load-error/styles.js

@@ -0,0 +1,6 @@
+import styled from "@emotion/styled";
+export const Wrapper = styled.div `
+  width: 100%;
+  margin: 16px 0;
+`;
+//# sourceMappingURL=styles.js.map

package/dist/components/data-load-error/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/data-load-error/styles.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,CAAC,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAGhC,CAAC"}

package/dist/components/dialog/index.d.ts

@@ -0,0 +1,4 @@
+import { DialogProps } from "@mui/material";
+export type { DialogProps };
+export declare const Dialog: (props: DialogProps) => import("react").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/dialog/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dialog/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAuB,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjE,YAAY,EAAE,WAAW,EAAE,CAAC;AAE5B,eAAO,MAAM,MAAM,GAAI,OAAO,WAAW,gCAA6B,CAAC"}

package/dist/components/dialog/index.js

@@ -0,0 +1,5 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Dialog as MuiDialog } from "@mui/material";
+export const Dialog = (props) => _jsx(MuiDialog, { ...props });
+//# sourceMappingURL=index.js.map

package/dist/components/dialog/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/dialog/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,MAAM,IAAI,SAAS,EAAe,MAAM,eAAe,CAAC;AAIjE,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,KAAC,SAAS,OAAK,KAAK,GAAI,CAAC"}

package/dist/components/divider/index.d.ts

@@ -0,0 +1,4 @@
+import { DividerProps } from "@mui/material";
+export type { DividerProps };
+export declare const Divider: (props: DividerProps) => import("react").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/divider/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/divider/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAyB,YAAY,EAAE,MAAM,eAAe,CAAC;AAEpE,YAAY,EAAE,YAAY,EAAE,CAAC;AAE7B,eAAO,MAAM,OAAO,GAAI,OAAO,YAAY,gCAA8B,CAAC"}

package/dist/components/divider/index.js

@@ -0,0 +1,5 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Divider as MuiDivider } from "@mui/material";
+export const Divider = (props) => _jsx(MuiDivider, { ...props });
+//# sourceMappingURL=index.js.map

package/dist/components/divider/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/divider/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,OAAO,IAAI,UAAU,EAAgB,MAAM,eAAe,CAAC;AAIpE,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,KAAmB,EAAE,EAAE,CAAC,KAAC,UAAU,OAAK,KAAK,GAAI,CAAC"}

package/dist/components/drawer/index.d.ts

@@ -0,0 +1,4 @@
+import { DrawerProps } from "@mui/material";
+export type { DrawerProps };
+export declare const Drawer: (props: DrawerProps) => import("react").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/drawer/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/drawer/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAuB,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjE,YAAY,EAAE,WAAW,EAAE,CAAC;AAE5B,eAAO,MAAM,MAAM,GAAI,OAAO,WAAW,gCAA6B,CAAC"}

package/dist/components/drawer/index.js

@@ -0,0 +1,5 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Drawer as MuiDrawer } from "@mui/material";
+export const Drawer = (props) => _jsx(MuiDrawer, { ...props });
+//# sourceMappingURL=index.js.map

package/dist/components/drawer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/drawer/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,MAAM,IAAI,SAAS,EAAe,MAAM,eAAe,CAAC;AAIjE,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,KAAC,SAAS,OAAK,KAAK,GAAI,CAAC"}

package/dist/components/dropzone/Dropzone.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { DropzoneProps } from "./types";
+export declare const Dropzone: React.FC<DropzoneProps>;
+//# sourceMappingURL=Dropzone.d.ts.map

package/dist/components/dropzone/Dropzone.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropzone.d.ts","sourceRoot":"","sources":["../../../src/components/dropzone/Dropzone.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAMrD,OAAO,EACL,aAAa,EAMd,MAAM,SAAS,CAAC;AAwBjB,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA8M5C,CAAC"}

package/dist/components/dropzone/Dropzone.js

@@ -0,0 +1,128 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { Box, Alert, CircularProgress } from "@mui/material";
+import { useDropzone } from "react-dropzone";
+import { SingleFilePreview } from "./components/SingleFilePreview";
+import { UploadArea } from "./components/UploadArea";
+import { FilePreviewCard } from "./components/FilePreviewCard";
+import { DEFAULT_COMPRESSION_OPTIONS, DEFAULT_ACCEPT, DropzoneTheme, } from "./types";
+import { useBatchUpload } from "./hooks/useBatchUpload";
+const DEFAULT_TEXTS = {
+    processingText: "Behandler",
+    files: "filer",
+    dragDropText: "Dra og slipp filer her, eller klikk for å velge",
+    fileTypesText: "Tillatte filtyper",
+    processingError: "Kunne ikke behandle filen",
+};
+import * as Styled from "./styled";
+import { getFileType } from "./utils/fileUtils";
+import { createThumbnailBlob } from "./utils/imageCompression";
+const buildPreviewUrl = async (file) => {
+    if (file.type.startsWith("image/")) {
+        const thumb = await createThumbnailBlob(file);
+        if (thumb)
+            return URL.createObjectURL(thumb);
+    }
+    return URL.createObjectURL(file);
+};
+export const Dropzone = ({ onFileSelect, onFilesSelect, selectedFile, selectedFiles = [], disabled = false, multiple = false, maxFiles = 1, accept = DEFAULT_ACCEPT, blobStorageOptions, compressionOptions = DEFAULT_COMPRESSION_OPTIONS, batchUploadOptions, label, helperText, theme = DropzoneTheme.Light, texts = DEFAULT_TEXTS, loading = false, className, style, maxSize, minSize, }) => {
+    const [uploading, setUploading] = useState(false);
+    const [error, setError] = useState(null);
+    const { batchUpload, processFile, batchProgress } = useBatchUpload({
+        blobStorageOptions,
+        compressionOptions,
+        batchUploadOptions,
+    });
+    const onDrop = useCallback(async (acceptedFiles) => {
+        if (disabled)
+            return;
+        setError(null);
+        setUploading(true);
+        try {
+            if (multiple) {
+                if (batchUploadOptions && acceptedFiles.length >= 1) {
+                    const prepared = [];
+                    for (const file of acceptedFiles) {
+                        prepared.push({
+                            file,
+                            preview: await buildPreviewUrl(file),
+                            type: getFileType(file),
+                        });
+                    }
+                    if (onFilesSelect) {
+                        await onFilesSelect([...(selectedFiles || []), ...prepared]);
+                    }
+                    await batchUpload(prepared);
+                }
+                else {
+                    const processedFiles = [];
+                    for (const file of acceptedFiles) {
+                        const processedFile = await processFile(file);
+                        processedFiles.push(processedFile);
+                    }
+                    if (onFilesSelect) {
+                        await onFilesSelect([
+                            ...(selectedFiles || []),
+                            ...processedFiles,
+                        ]);
+                    }
+                }
+            }
+            else {
+                const file = acceptedFiles[0];
+                if (file) {
+                    const processedFile = await processFile(file);
+                    if (onFileSelect) {
+                        await onFileSelect(processedFile);
+                    }
+                }
+            }
+        }
+        catch (error) {
+            console.error("File processing error:", error);
+            setError(error instanceof Error ? error.message : texts.processingError);
+        }
+        finally {
+            setUploading(false);
+        }
+    }, [
+        disabled,
+        multiple,
+        processFile,
+        onFileSelect,
+        onFilesSelect,
+        batchUpload,
+        batchUploadOptions,
+    ]);
+    const { getRootProps, getInputProps, fileRejections } = useDropzone({
+        onDrop,
+        accept,
+        disabled: disabled || uploading || loading,
+        multiple,
+        maxFiles: multiple ? maxFiles : 1,
+        maxSize,
+        minSize,
+    });
+    const removeSingleFile = useCallback(() => {
+        if (selectedFile) {
+            URL.revokeObjectURL(selectedFile?.preview);
+            if (onFileSelect) {
+                onFileSelect(null);
+            }
+        }
+    }, [selectedFile, onFileSelect]);
+    const removeMultipleFile = useCallback((index) => {
+        const newFiles = selectedFiles?.filter((_, i) => i !== index) || [];
+        if (onFilesSelect) {
+            onFilesSelect(newFiles);
+        }
+    }, [selectedFiles, onFilesSelect]);
+    return (_jsxs(Box, { className: className, style: style, children: [label && (_jsx(Styled.Label, { variant: "subtitle2", gutterBottom: true, theme: theme, children: label })), _jsxs(Styled.DropzoneContainer, { children: [loading && (_jsx(Styled.LoadingOverlay, { children: _jsx(CircularProgress, {}) })), !multiple && selectedFile ? (_jsx(SingleFilePreview, { selectedMedia: selectedFile, theme: theme, disabled: disabled || loading, onRemove: removeSingleFile })) : (_jsx(UploadArea, { getRootProps: getRootProps, getInputProps: getInputProps, disabled: disabled || loading, uploading: uploading, theme: theme, accept: accept, batchProgress: batchProgress, texts: {
+                            processingText: texts.processingText,
+                            files: texts.files,
+                            dragDropText: texts.dragDropText,
+                            fileTypesText: texts.fileTypesText,
+                        } }))] }), multiple && selectedFiles && selectedFiles.length > 0 && (_jsx(Styled.FileGrid, { children: selectedFiles.map((file, index) => (_jsx(FilePreviewCard, { file: file, index: index, theme: theme, onRemove: () => removeMultipleFile(index), disabled: disabled }, `${file.file.name}-${index}`))) })), helperText && (_jsx(Styled.HelperText, { variant: "caption", theme: theme, children: helperText })), error && (_jsx(Alert, { severity: "error", sx: { mt: 1 }, children: error })), fileRejections.length > 0 && (_jsx(Alert, { severity: "error", sx: { mt: 1 }, children: fileRejections.map((rejection, index) => (_jsxs("div", { children: [rejection.file.name, ":", " ", rejection.errors.map((error) => error.message).join(", ")] }, index))) }))] }));
+};
+//# sourceMappingURL=Dropzone.js.map

package/dist/components/dropzone/Dropzone.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropzone.js","sourceRoot":"","sources":["../../../src/components/dropzone/Dropzone.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAIL,2BAA2B,EAC3B,cAAc,EACd,aAAa,GACd,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,aAAa,GAAkB;IACnC,cAAc,EAAE,WAAW;IAC3B,KAAK,EAAE,OAAO;IACd,YAAY,EAAE,iDAAiD;IAC/D,aAAa,EAAE,mBAAmB;IAClC,eAAe,EAAE,2BAA2B;CAC7C,CAAC;AAEF,OAAO,KAAK,MAAM,MAAM,UAAU,CAAC;AACnC,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAE/D,MAAM,eAAe,GAAG,KAAK,EAAE,IAAU,EAAmB,EAAE;IAC5D,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE,CAAC;QACnC,MAAM,KAAK,GAAG,MAAM,mBAAmB,CAAC,IAAI,CAAC,CAAC;QAC9C,IAAI,KAAK;YAAE,OAAO,GAAG,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;IAC/C,CAAC;IACD,OAAO,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;AACnC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAA4B,CAAC,EAChD,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,aAAa,GAAG,EAAE,EAClB,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,CAAC,EACZ,MAAM,GAAG,cAAc,EACvB,kBAAkB,EAClB,kBAAkB,GAAG,2BAA2B,EAChD,kBAAkB,EAClB,KAAK,EACL,UAAU,EACV,KAAK,GAAG,aAAa,CAAC,KAAK,EAC3B,KAAK,GAAG,aAAa,EACrB,OAAO,GAAG,KAAK,EACf,SAAS,EACT,KAAK,EACL,OAAO,EACP,OAAO,GACR,EAAE,EAAE;IACH,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAExD,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,aAAa,EAAE,GAAG,cAAc,CAAC;QACjE,kBAAkB;QAClB,kBAAkB;QAClB,kBAAkB;KACnB,CAAC,CAAC;IAEH,MAAM,MAAM,GAAG,WAAW,CACxB,KAAK,EAAE,aAAqB,EAAE,EAAE;QAC9B,IAAI,QAAQ;YAAE,OAAO;QAErB,QAAQ,CAAC,IAAI,CAAC,CAAC;QACf,YAAY,CAAC,IAAI,CAAC,CAAC;QAEnB,IAAI,CAAC;YACH,IAAI,QAAQ,EAAE,CAAC;gBACb,IAAI,kBAAkB,IAAI,aAAa,CAAC,MAAM,IAAI,CAAC,EAAE,CAAC;oBACpD,MAAM,QAAQ,GAAsB,EAAE,CAAC;oBACvC,KAAK,MAAM,IAAI,IAAI,aAAa,EAAE,CAAC;wBACjC,QAAQ,CAAC,IAAI,CAAC;4BACZ,IAAI;4BACJ,OAAO,EAAE,MAAM,eAAe,CAAC,IAAI,CAAC;4BACpC,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC;yBACxB,CAAC,CAAC;oBACL,CAAC;oBAED,IAAI,aAAa,EAAE,CAAC;wBAClB,MAAM,aAAa,CAAC,CAAC,GAAG,CAAC,aAAa,IAAI,EAAE,CAAC,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC;oBAC/D,CAAC;oBAED,MAAM,WAAW,CAAC,QAAQ,CAAC,CAAC;gBAC9B,CAAC;qBAAM,CAAC;oBACN,MAAM,cAAc,GAAsB,EAAE,CAAC;oBAC7C,KAAK,MAAM,IAAI,IAAI,aAAa,EAAE,CAAC;wBACjC,MAAM,aAAa,GAAG,MAAM,WAAW,CAAC,IAAI,CAAC,CAAC;wBAC9C,cAAc,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;oBACrC,CAAC;oBAED,IAAI,aAAa,EAAE,CAAC;wBAClB,MAAM,aAAa,CAAC;4BAClB,GAAG,CAAC,aAAa,IAAI,EAAE,CAAC;4BACxB,GAAG,cAAc;yBAClB,CAAC,CAAC;oBACL,CAAC;gBACH,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,MAAM,IAAI,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC;gBAC9B,IAAI,IAAI,EAAE,CAAC;oBACT,MAAM,aAAa,GAAG,MAAM,WAAW,CAAC,IAAI,CAAC,CAAC;oBAC9C,IAAI,YAAY,EAAE,CAAC;wBACjB,MAAM,YAAY,CAAC,aAAa,CAAC,CAAC;oBACpC,CAAC;gBACH,CAAC;YACH,CAAC;QACH,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,OAAO,CAAC,KAAK,CAAC,wBAAwB,EAAE,KAAK,CAAC,CAAC;YAC/C,QAAQ,CACN,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,eAAe,CAC/D,CAAC;QACJ,CAAC;gBAAS,CAAC;YACT,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC;IACH,CAAC,EACD;QACE,QAAQ;QACR,QAAQ;QACR,WAAW;QACX,YAAY;QACZ,aAAa;QACb,WAAW;QACX,kBAAkB;KACnB,CACF,CAAC;IAEF,MAAM,EAAE,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,GAAG,WAAW,CAAC;QAClE,MAAM;QACN,MAAM;QACN,QAAQ,EAAE,QAAQ,IAAI,SAAS,IAAI,OAAO;QAC1C,QAAQ;QACR,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;QACjC,OAAO;QACP,OAAO;KACR,CAAC,CAAC;IAEH,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,IAAI,YAAY,EAAE,CAAC;YACjB,GAAG,CAAC,eAAe,CAAC,YAAY,EAAE,OAAO,CAAC,CAAC;YAC3C,IAAI,YAAY,EAAE,CAAC;gBACjB,YAAY,CAAC,IAAI,CAAC,CAAC;YACrB,CAAC;QACH,CAAC;IACH,CAAC,EAAE,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC;IAEjC,MAAM,kBAAkB,GAAG,WAAW,CACpC,CAAC,KAAa,EAAE,EAAE;QAChB,MAAM,QAAQ,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,IAAI,EAAE,CAAC;QACpE,IAAI,aAAa,EAAE,CAAC;YAClB,aAAa,CAAC,QAAQ,CAAC,CAAC;QAC1B,CAAC;IACH,CAAC,EACD,CAAC,aAAa,EAAE,aAAa,CAAC,CAC/B,CAAC;IAEF,OAAO,CACL,MAAC,GAAG,IAAC,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,aACpC,KAAK,IAAI,CACR,KAAC,MAAM,CAAC,KAAK,IAAC,OAAO,EAAC,WAAW,EAAC,YAAY,QAAC,KAAK,EAAE,KAAK,YACxD,KAAK,GACO,CAChB,EAED,MAAC,MAAM,CAAC,iBAAiB,eACtB,OAAO,IAAI,CACV,KAAC,MAAM,CAAC,cAAc,cACpB,KAAC,gBAAgB,KAAG,GACE,CACzB,EACA,CAAC,QAAQ,IAAI,YAAY,CAAC,CAAC,CAAC,CAC3B,KAAC,iBAAiB,IAChB,aAAa,EAAE,YAAY,EAC3B,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,IAAI,OAAO,EAC7B,QAAQ,EAAE,gBAAgB,GAC1B,CACH,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,IACT,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,QAAQ,IAAI,OAAO,EAC7B,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE;4BACL,cAAc,EAAE,KAAK,CAAC,cAAc;4BACpC,KAAK,EAAE,KAAK,CAAC,KAAK;4BAClB,YAAY,EAAE,KAAK,CAAC,YAAY;4BAChC,aAAa,EAAE,KAAK,CAAC,aAAa;yBACnC,GACD,CACH,IACwB,EAE1B,QAAQ,IAAI,aAAa,IAAI,aAAa,CAAC,MAAM,GAAG,CAAC,IAAI,CACxD,KAAC,MAAM,CAAC,QAAQ,cACb,aAAa,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAClC,KAAC,eAAe,IAEd,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,KAAK,CAAC,EACzC,QAAQ,EAAE,QAAQ,IALb,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,KAAK,EAAE,CAMjC,CACH,CAAC,GACc,CACnB,EAEA,UAAU,IAAI,CACb,KAAC,MAAM,CAAC,UAAU,IAAC,OAAO,EAAC,SAAS,EAAC,KAAK,EAAE,KAAK,YAC9C,UAAU,GACO,CACrB,EAEA,KAAK,IAAI,CACR,KAAC,KAAK,IAAC,QAAQ,EAAC,OAAO,EAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,YAClC,KAAK,GACA,CACT,EAEA,cAAc,CAAC,MAAM,GAAG,CAAC,IAAI,CAC5B,KAAC,KAAK,IAAC,QAAQ,EAAC,OAAO,EAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,YAClC,cAAc,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,EAAE,CAAC,CACxC,0BACG,SAAS,CAAC,IAAI,CAAC,IAAI,OAAG,GAAG,EACzB,SAAS,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,KAFlD,KAAK,CAGT,CACP,CAAC,GACI,CACT,IACG,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/components/dropzone/components/FilePreviewCard.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { MediaUploadData, DropzoneTheme } from "../types";
+interface FilePreviewCardProps {
+    file: MediaUploadData;
+    index: number;
+    theme: DropzoneTheme;
+    onRemove: () => void;
+    disabled: boolean;
+}
+export declare const FilePreviewCard: React.FC<FilePreviewCardProps>;
+export default FilePreviewCard;
+//# sourceMappingURL=FilePreviewCard.d.ts.map

package/dist/components/dropzone/components/FilePreviewCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilePreviewCard.d.ts","sourceRoot":"","sources":["../../../../src/components/dropzone/components/FilePreviewCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAI1D,UAAU,oBAAoB;IAC5B,IAAI,EAAE,eAAe,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAgE1D,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/dropzone/components/FilePreviewCard.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Tooltip } from "@mui/material";
+import { Delete } from "@mui/icons-material";
+import { usePageContent } from "@snokam/sanity-page-content";
+import { PDFPreviewCard } from "./PDFPreviewCard";
+import * as Styled from "./FilePreviewCard.styles";
+export const FilePreviewCard = ({ file, theme, onRemove, disabled, }) => {
+    const { getText } = usePageContent();
+    const formatFileSize = (bytes) => {
+        if (bytes === 0)
+            return "0 Bytes";
+        const k = 1024;
+        const sizes = ["Bytes", "KB", "MB", "GB"];
+        const i = Math.floor(Math.log(bytes) / Math.log(k));
+        return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i];
+    };
+    const renderPreview = () => {
+        if (file.type === "image") {
+            return _jsx(Styled.PreviewImage, { src: file.preview, alt: file.file.name });
+        }
+        else if (file.type === "video") {
+            return _jsx(Styled.PreviewVideo, { src: file.preview, muted: true });
+        }
+        else if (file.type === "document" &&
+            file.file.type === "application/pdf") {
+            return _jsx(PDFPreviewCard, { file: file.preview, theme: theme });
+        }
+        else {
+            return (_jsxs(Styled.GenericFileContainer, { children: [_jsx(Styled.GenericFileIcon, { theme: theme }), _jsx(Styled.GenericFileType, { variant: "caption", theme: theme, children: file.file.type.split("/")[1]?.toUpperCase() ||
+                            getText("dropzone.fileTypeText") })] }));
+        }
+    };
+    return (_jsxs(Styled.FileCard, { theme: theme, children: [_jsx(Styled.FileCardPreview, { children: renderPreview() }), _jsx(Styled.FileCardActions, { children: _jsx(Tooltip, { title: getText("dropzone.removeTooltip"), children: _jsx(Styled.RemoveButton, { onClick: onRemove, disabled: disabled, size: "small", children: _jsx(Delete, { fontSize: "small" }) }) }) }), _jsxs(Styled.FileCardInfo, { theme: theme, children: [_jsx(Styled.FileName, { variant: "body2", theme: theme, title: file.file.name, children: file.file.name }), _jsxs(Styled.FileSize, { variant: "caption", theme: theme, children: [formatFileSize(file.file.size), " \u2022 ", file.type] })] })] }));
+};
+export default FilePreviewCard;
+//# sourceMappingURL=FilePreviewCard.js.map

package/dist/components/dropzone/components/FilePreviewCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilePreviewCard.js","sourceRoot":"","sources":["../../../../src/components/dropzone/components/FilePreviewCard.tsx"],"names":[],"mappings":"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"}

package/dist/components/dropzone/components/FilePreviewCard.styles.d.ts

@@ -0,0 +1,57 @@
+import { DropzoneTheme } from "../types";
+export declare const FileCard: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    theme?: DropzoneTheme;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const FileCardPreview: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const FileCardInfo: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    theme?: DropzoneTheme;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const FileCardActions: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const PreviewImage: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+export declare const PreviewVideo: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, {}>;
+export declare const GenericFileContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const GenericFileIcon: import("@emotion/styled").StyledComponent<import("@mui/material").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").SVGProps<SVGSVGElement>, "className" | "style" | "classes" | "children" | "sx" | "color" | "fontSize" | "shapeRendering" | "htmlColor" | "inheritViewBox" | "titleAccess" | "viewBox"> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    theme: DropzoneTheme;
+}, {}, {}>;
+export declare const GenericFileType: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "className" | "style" | "classes" | "children" | "sx" | "color" | "variant" | "align" | "gutterBottom" | "noWrap" | "variantMapping"> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    theme: DropzoneTheme;
+}, {}, {}>;
+export declare const RemoveButton: import("@emotion/styled").StyledComponent<import("@mui/material").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, keyof import("@mui/material").IconButtonOwnProps> & Omit<import("@mui/material").ButtonBaseOwnProps, "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "nativeButton" | "onFocusVisible" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "type" | keyof import("@mui/material").IconButtonOwnProps> & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "nativeButton" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "type" | "color" | "disableFocusRipple" | "loading" | "loadingIndicator" | "size" | "edge"> & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;
+export declare const FileName: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "className" | "style" | "classes" | "children" | "sx" | "color" | "variant" | "align" | "gutterBottom" | "noWrap" | "variantMapping"> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    theme: DropzoneTheme;
+}, {}, {}>;
+export declare const FileSize: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "className" | "style" | "classes" | "children" | "sx" | "color" | "variant" | "align" | "gutterBottom" | "noWrap" | "variantMapping"> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    theme: DropzoneTheme;
+}, {}, {}>;
+//# sourceMappingURL=FilePreviewCard.styles.d.ts.map

package/dist/components/dropzone/components/FilePreviewCard.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilePreviewCard.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/dropzone/components/FilePreviewCard.styles.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,eAAO,MAAM,QAAQ;;;;YAAwB,aAAa;yGAwCzD,CAAC;AAEF,eAAO,MAAM,eAAe;;;yGAQ3B,CAAC;AAEF,eAAO,MAAM,YAAY;;;;YAAwB,aAAa;yGAwB7D,CAAC;AAEF,eAAO,MAAM,eAAe;;;yGAM3B,CAAC;AAEF,eAAO,MAAM,YAAY;;;gHAIxB,CAAC;AAEF,eAAO,MAAM,YAAY;;;kHAIxB,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;yGAQhC,CAAC;AAEF,eAAO,MAAM,eAAe;;;WACnB,aAAa;UAIrB,CAAC;AAEF,eAAO,MAAM,eAAe;;;WAA+B,aAAa;UAIvE,CAAC;AAEF,eAAO,MAAM,YAAY;;UAaxB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;WAA+B,aAAa;UAOhE,CAAC;AAEF,eAAO,MAAM,QAAQ;;;WAA+B,aAAa;UAIhE,CAAC"}

package/dist/components/dropzone/components/FilePreviewCard.styles.js

@@ -0,0 +1,141 @@
+import styled from "@emotion/styled";
+import { css } from "@emotion/react";
+import { Typography, IconButton } from "@mui/material";
+import { InsertDriveFile } from "@mui/icons-material";
+import { DropzoneTheme } from "../types";
+export const FileCard = styled.div `
+  display: flex;
+  flex-direction: column;
+  border-radius: 8px;
+  border: 1px solid;
+  overflow: hidden;
+  position: relative;
+  transition: all 0.2s ease;
+
+  ${({ theme }) => theme === DropzoneTheme.Dark
+    ? css `
+          background-color: var(--color-dark-gray, #2a2a2a);
+          border-color: var(--color-light-blue);
+          color: var(--color-light-blue);
+
+          &:hover {
+            background-color: var(--color-light-blue);
+            border-color: var(--color-light-blue);
+          }
+        `
+    : css `
+          background-color: var(--color-off-white, #f5f5f5);
+          border-color: var(--color-primary);
+          color: var(--color-primary);
+
+          &:hover {
+            background-color: var(--color-primary);
+            border-color: var(--color-primary);
+          }
+
+          [data-theme="dark"] & {
+            border-color: rgba(255, 255, 255, 0.14);
+            color: var(--color-light-blue);
+
+            &:hover {
+              border-color: rgba(255, 255, 255, 0.14);
+            }
+          }
+        `}
+`;
+export const FileCardPreview = styled.div `
+  width: 100%;
+  height: 150px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  position: relative;
+`;
+export const FileCardInfo = styled.div `
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  padding: 12px;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  backdrop-filter: blur(4px);
+  transition: all 0.2s ease;
+
+  ${({ theme }) => theme === DropzoneTheme.Dark
+    ? css `
+          background: rgba(7, 29, 65, 0.8);
+        `
+    : css `
+          background: rgba(225, 248, 255, 0.8);
+
+          [data-theme="dark"] & {
+            background: #0e2748;
+          }
+        `}
+`;
+export const FileCardActions = styled.div `
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  display: flex;
+  gap: 4px;
+`;
+export const PreviewImage = styled.img `
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+`;
+export const PreviewVideo = styled.video `
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+`;
+export const GenericFileContainer = styled.div `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  gap: 8px;
+`;
+export const GenericFileIcon = styled(InsertDriveFile) `
+  font-size: 48px;
+  color: inherit;
+`;
+export const GenericFileType = styled(Typography) `
+  color: inherit;
+  opacity: 0.7;
+  text-align: center;
+`;
+export const RemoveButton = styled(IconButton) `
+  background-color: rgba(0, 0, 0, 0.6);
+  color: white;
+  transition: background-color 0.2s;
+
+  &:hover {
+    background-color: rgba(0, 0, 0, 0.8);
+  }
+
+  &:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+`;
+export const FileName = styled(Typography) `
+  font-weight: 500;
+  font-size: 14px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: inherit;
+`;
+export const FileSize = styled(Typography) `
+  color: inherit;
+  opacity: 0.7;
+  font-size: 0.75rem;
+`;
+//# sourceMappingURL=FilePreviewCard.styles.js.map

package/dist/components/dropzone/components/FilePreviewCard.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilePreviewCard.styles.js","sourceRoot":"","sources":["../../../../src/components/dropzone/components/FilePreviewCard.styles.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAA2B;;;;;;;;;IASzD,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CACd,KAAK,KAAK,aAAa,CAAC,IAAI;IAC1B,CAAC,CAAC,GAAG,CAAA;;;;;;;;;SASF;IACH,CAAC,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;SAkBF;CACR,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;CAQxC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAA2B;;;;;;;;;;;;IAY7D,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CACd,KAAK,KAAK,aAAa,CAAC,IAAI;IAC1B,CAAC,CAAC,GAAG,CAAA;;SAEF;IACH,CAAC,CAAC,GAAG,CAAA;;;;;;SAMF;CACR,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;CAMxC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAIrC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAA;;;;CAIvC,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;CAQ7C,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,eAAe,CAAC,CAEpD;;;CAGD,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,UAAU,CAAC,CAA0B;;;;CAI1E,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,UAAU,CAAC,CAAA;;;;;;;;;;;;;CAa7C,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,UAAU,CAAC,CAA0B;;;;;;;CAOnE,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,UAAU,CAAC,CAA0B;;;;CAInE,CAAC"}

package/dist/components/dropzone/components/PDFPreview.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import { DropzoneTheme } from "../types";
+interface PDFPreviewProps {
+    file: string;
+    fileName: string;
+    fileSize: number;
+    theme: DropzoneTheme;
+}
+export declare const PDFPreview: React.FC<PDFPreviewProps>;
+export default PDFPreview;
+//# sourceMappingURL=PDFPreview.d.ts.map

package/dist/components/dropzone/components/PDFPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PDFPreview.d.ts","sourceRoot":"","sources":["../../../../src/components/dropzone/components/PDFPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAE5D,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAQzC,UAAU,eAAe;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,aAAa,CAAC;CACtB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAoGhD,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/components/dropzone/components/PDFPreview.js

@@ -0,0 +1,62 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useMemo } from "react";
+import { usePageContent } from "@snokam/sanity-page-content";
+import * as Styled from "./PDFPreview.styles";
+const PLACEHOLDER_PREFIX = "Placeholder for ";
+function withDefault(value, fallback) {
+    return value.startsWith(PLACEHOLDER_PREFIX) ? fallback : value;
+}
+export const PDFPreview = ({ file, fileName, fileSize: _fileSize, theme, }) => {
+    const { getText } = usePageContent();
+    const [numPages, setNumPages] = useState(0);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    const [isClient, setIsClient] = useState(false);
+    const [pdfComponents, setPdfComponents] = useState(null);
+    useEffect(() => {
+        if (typeof window !== "undefined") {
+            setIsClient(true);
+            import("react-pdf")
+                .then(async (reactPdf) => {
+                reactPdf.pdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${reactPdf.pdfjs.version}/build/pdf.worker.min.mjs`;
+                setPdfComponents({
+                    Document: reactPdf.Document,
+                    Page: reactPdf.Page,
+                });
+            })
+                .catch((err) => {
+                setError(`Failed to load PDF viewer: ${err.message}`);
+            })
+                .finally(() => {
+                setLoading(false);
+            });
+        }
+    }, []);
+    const fileSource = useMemo(() => (file?.startsWith("blob:") ? file : { url: file }), [file]);
+    const onDocumentLoadSuccess = ({ numPages }) => {
+        setNumPages(numPages);
+        setLoading(false);
+        setError(null);
+    };
+    const onDocumentLoadError = (error) => {
+        setLoading(false);
+        console.error("PDF load error:", error.message, "URL:", file);
+        setError(error.message);
+    };
+    if (error && file) {
+        return (_jsx(Styled.PreviewContainer, { theme: theme, children: _jsx(Styled.PreviewIframe, { src: file, title: fileName }) }));
+    }
+    if (loading || !isClient || !pdfComponents) {
+        return null;
+    }
+    if (!file) {
+        return null;
+    }
+    const { Document: PdfDocument, Page } = pdfComponents;
+    return (_jsx(Styled.PreviewContainer, { theme: theme, children: _jsx(PdfDocument, { file: fileSource, onLoadSuccess: onDocumentLoadSuccess, onLoadError: onDocumentLoadError, loading: null, children: numPages > 0 && (_jsxs(Styled.PageContainer, { children: [_jsx(Page, { pageNumber: 1, width: 280, renderTextLayer: false, renderAnnotationLayer: false }), numPages > 1 && (_jsx(Styled.PageInfo, { variant: "caption", theme: theme, children: withDefault(getText("dropzone.pdfPageInfo", {
+                            current: "1",
+                            total: `${numPages}`,
+                        }), `Side 1 av ${numPages}`) }))] })) }) }));
+};
+export default PDFPreview;
+//# sourceMappingURL=PDFPreview.js.map