@vertesia/ui 1.2.0 → 1.4.0-dev.20260615.042549Z

package/src/features/magic-pdf/AnnotatedImageSlider.tsx

@@ -1,9 +1,9 @@
-import { Button, Center, VTooltip } from "@vertesia/ui/core";
-import clsx from "clsx";
-import { ChevronsDown, ChevronsUp, Image, Loader2, Maximize, Minus, Plus, ScanSearch } from "lucide-react";
-import { useRef, KeyboardEvent, useState, useEffect, useCallback } from "react";
-import { useUITranslation } from '../../i18n/index.js';
-import { ImageType, useMagicPdfContext } from "./MagicPdfProvider";
+import { Button, Center, VTooltip } from '@vertesia/ui/core';
+import { useUITranslation } from '@vertesia/ui/i18n';
+import clsx from 'clsx';
+import { ChevronsDown, ChevronsUp, Image, Loader2, Maximize, Minus, Plus, ScanSearch } from 'lucide-react';
+import { type KeyboardEvent, useCallback, useEffect, useRef, useState } from 'react';
+import { ImageType, useMagicPdfContext } from './MagicPdfProvider';
 
 // Zoom levels as percentages (100 = fit to width)
 const ZOOM_LEVELS = [50, 75, 100, 125, 150, 200, 300];
@@ -55,7 +55,7 @@ export function AnnotatedImageSlider({ className, currentPage, onChange }: Annot
     const { imageProvider, count } = useMagicPdfContext();
 
     const zoomIn = useCallback(() => {
-        let currentIndex = ZOOM_LEVELS.findIndex(level => level >= zoom);
+        let currentIndex = ZOOM_LEVELS.findIndex((level) => level >= zoom);
         if (currentIndex === -1) {
             currentIndex = ZOOM_LEVELS.length - 1;
         }
@@ -64,7 +64,7 @@ export function AnnotatedImageSlider({ className, currentPage, onChange }: Annot
     }, [zoom]);
 
     const zoomOut = useCallback(() => {
-        let currentIndex = ZOOM_LEVELS.findIndex(level => level >= zoom);
+        let currentIndex = ZOOM_LEVELS.findIndex((level) => level >= zoom);
         if (currentIndex === -1) {
             currentIndex = ZOOM_LEVELS.length - 1;
         }
@@ -78,7 +78,8 @@ export function AnnotatedImageSlider({ className, currentPage, onChange }: Annot
 
     // Load first image to determine aspect ratio
     useEffect(() => {
-        imageProvider.getPageImageUrl(1, imageType)
+        imageProvider
+            .getPageImageUrl(1, imageType)
             .then((url) => {
                 const img = new window.Image();
                 img.onload = () => {
@@ -119,7 +120,7 @@ export function AnnotatedImageSlider({ className, currentPage, onChange }: Annot
                 const url = await imageProvider.getPageImageUrl(page, imageType);
                 if (!cancelled) {
                     loadedPagesRef.current.add(page);
-                    setLoadedUrls(prev => new Map(prev).set(page, url));
+                    setLoadedUrls((prev) => new Map(prev).set(page, url));
                 }
             } catch {
                 // Skip failed pages
@@ -128,7 +129,9 @@ export function AnnotatedImageSlider({ className, currentPage, onChange }: Annot
 
         // Start all loads in parallel - prioritized pages will update state first
         // since they're fetched first in the loadOrder
-        loadOrder.forEach(page => loadPage(page));
+        loadOrder.forEach((page) => {
+            void loadPage(page);
+        });
 
         return () => {
             cancelled = true;
@@ -253,9 +256,9 @@ export function AnnotatedImageSlider({ className, currentPage, onChange }: Annot
         <div ref={ref} className={clsx('flex flex-col items-stretch gap-y-2', className)}>
             <div className="relative flex items-center justify-center px-2 h-9">
                 <Button variant="ghost" size="xs" onClick={goPrev} alt={t('pdf.previousPage')}>
-                    <ChevronsUp className='size-4' />
+                    <ChevronsUp className="size-4" />
                 </Button>
-                <div className="absolute left-2 flex items-center gap-x-1">
+                <div className="absolute start-2 flex items-center gap-x-1">
                     <ImageTypeButton
                         type={ImageType.original}
                         currentType={imageType}
@@ -280,13 +283,14 @@ export function AnnotatedImageSlider({ className, currentPage, onChange }: Annot
                         canZoomOut={zoom > ZOOM_LEVELS[0]}
                     />
                 </div>
-                <div className="absolute right-2">
+                <div className="absolute end-2">
                     <PageNavigator currentPage={currentPage} totalPages={count} onChange={onChange} />
                 </div>
             </div>
-            <div ref={scrollContainerRef} className='flex flex-col items-center gap-2 flex-1 overflow-y-auto px-2'>
+            <div ref={scrollContainerRef} className="flex flex-col items-center gap-2 flex-1 overflow-y-auto px-2">
                 {Array.from({ length: count }, (_, index) => (
                     <PageThumbnail
+                        // biome-ignore lint/suspicious/noArrayIndexKey: list order is stable for this render
                         key={index}
                         currentPage={currentPage}
                         pageNumber={index + 1}
@@ -299,7 +303,7 @@ export function AnnotatedImageSlider({ className, currentPage, onChange }: Annot
             </div>
             <div className="flex items-center justify-center h-9">
                 <Button variant="ghost" size="xs" onClick={goNext} alt={t('pdf.nextPage')}>
-                    <ChevronsDown className='size-4' />
+                    <ChevronsDown className="size-4" />
                 </Button>
             </div>
         </div>
@@ -317,17 +321,20 @@ function ImageTypeButton({ type, currentType, onClick, icon, tooltip }: ImageTyp
     const isSelected = type === currentType;
     return (
         <VTooltip description={tooltip} placement="bottom" size="xs">
-            <button
+            <Button
+                variant="unstyled"
+                aria-label={tooltip}
+                aria-pressed={isSelected}
                 className={clsx(
-                    "p-1 rounded cursor-pointer transition-colors",
+                    'p-1 rounded cursor-pointer transition-colors',
                     isSelected
-                        ? "text-primary bg-primary/10"
-                        : "text-muted-foreground hover:text-foreground hover:bg-muted"
+                        ? 'text-primary bg-primary/10'
+                        : 'text-muted-foreground hover:text-foreground hover:bg-muted',
                 )}
                 onClick={onClick}
             >
                 {icon}
-            </button>
+            </Button>
         </VTooltip>
     );
 }
@@ -345,48 +352,52 @@ function ZoomControls({ zoom, onZoomIn, onZoomOut, onFitToView, canZoomIn, canZo
     return (
         <div className="flex items-center gap-x-0.5">
             <VTooltip description={t('pdf.zoomOut')} placement="bottom" size="xs">
-                <button
+                <Button
+                    variant="unstyled"
+                    aria-label={t('pdf.zoomOut')}
                     className={clsx(
-                        "p-1 rounded cursor-pointer transition-colors",
+                        'p-1 rounded cursor-pointer transition-colors',
                         canZoomOut
-                            ? "text-muted-foreground hover:text-foreground hover:bg-muted"
-                            : "text-muted-foreground/40 cursor-not-allowed"
+                            ? 'text-muted-foreground hover:text-foreground hover:bg-muted'
+                            : 'text-muted-foreground/40 cursor-not-allowed',
                     )}
                     onClick={onZoomOut}
                     disabled={!canZoomOut}
                 >
                     <Minus className="size-4" />
-                </button>
+                </Button>
             </VTooltip>
-            <span className="text-xs text-muted-foreground min-w-[32px] text-center">
-                {zoom}%
-            </span>
+            <span className="text-xs text-muted-foreground min-w-[32px] text-center">{zoom}%</span>
             <VTooltip description={t('pdf.zoomIn')} placement="bottom" size="xs">
-                <button
+                <Button
+                    variant="unstyled"
+                    aria-label={t('pdf.zoomIn')}
                     className={clsx(
-                        "p-1 rounded cursor-pointer transition-colors",
+                        'p-1 rounded cursor-pointer transition-colors',
                         canZoomIn
-                            ? "text-muted-foreground hover:text-foreground hover:bg-muted"
-                            : "text-muted-foreground/40 cursor-not-allowed"
+                            ? 'text-muted-foreground hover:text-foreground hover:bg-muted'
+                            : 'text-muted-foreground/40 cursor-not-allowed',
                     )}
                     onClick={onZoomIn}
                     disabled={!canZoomIn}
                 >
                     <Plus className="size-4" />
-                </button>
+                </Button>
             </VTooltip>
             <VTooltip description={t('pdf.fitToWidth')} placement="bottom" size="xs">
-                <button
+                <Button
+                    variant="unstyled"
+                    aria-label={t('pdf.fitToWidth')}
                     className={clsx(
-                        "p-1 rounded cursor-pointer transition-colors",
+                        'p-1 rounded cursor-pointer transition-colors',
                         zoom !== DEFAULT_ZOOM
-                            ? "text-muted-foreground hover:text-foreground hover:bg-muted"
-                            : "text-muted-foreground/40"
+                            ? 'text-muted-foreground hover:text-foreground hover:bg-muted'
+                            : 'text-muted-foreground/40',
                     )}
                     onClick={onFitToView}
                 >
                     <Maximize className="size-4" />
-                </button>
+                </Button>
             </VTooltip>
         </div>
     );
@@ -410,10 +421,14 @@ function PageThumbnail({ pageNumber, currentPage, aspectRatio, zoom, url, onSele
             data-page={pageNumber}
             style={{ width: `${widthPercent}%` }}
         >
-            <div
+            <Button
+                variant="unstyled"
+                size="none"
+                aria-pressed={isSelected}
+                aria-label={`Page ${pageNumber}`}
                 className={clsx(
-                    'relative border-[2px] cursor-pointer overflow-hidden flex items-center justify-center bg-muted/50 w-full',
-                    isSelected ? "border-primary" : "border-border"
+                    'relative border-[2px] cursor-pointer overflow-hidden !flex items-center justify-center bg-muted/50 w-full',
+                    isSelected ? 'border-primary' : 'border-border',
                 )}
                 style={{ aspectRatio: `1 / ${aspectRatio}` }}
                 onClick={onSelect}
@@ -423,7 +438,7 @@ function PageThumbnail({ pageNumber, currentPage, aspectRatio, zoom, url, onSele
                 ) : (
                     <Loader2 className="w-6 h-6 animate-spin text-muted-foreground" />
                 )}
-            </div>
+            </Button>
             <Center className="text-sm text-muted-foreground pt-1 font-semibold">{pageNumber}</Center>
         </div>
     );
@@ -446,7 +461,7 @@ function PageNavigator({ currentPage, totalPages, onChange }: PageNavigatorProps
 
     const handleSubmit = () => {
         const page = parseInt(inputValue, 10);
-        if (!isNaN(page) && page >= 1 && page <= totalPages) {
+        if (!Number.isNaN(page) && page >= 1 && page <= totalPages) {
             onChange(page);
         } else {
             // Reset to current page if invalid

package/src/features/magic-pdf/DownloadPopover.tsx

@@ -1,42 +1,37 @@
-import { ContentObject, DocumentMetadata } from "@vertesia/common";
-import { Button, Popover, PopoverContent, PopoverTrigger } from "@vertesia/ui/core";
-import { useUserSession } from "@vertesia/ui/session";
-import { Download } from "lucide-react";
-import { useUITranslation } from '../../i18n/index.js';
-import { getResourceUrl } from "./MagicPdfProvider";
+import type { ContentObject, DocumentMetadata } from '@vertesia/common';
+import { Button, Popover, PopoverContent, PopoverTrigger } from '@vertesia/ui/core';
+import { useUITranslation } from '@vertesia/ui/i18n';
+import { useUserSession } from '@vertesia/ui/session';
+import { Download } from 'lucide-react';
+import { getResourceUrl } from './MagicPdfProvider';
 
 interface DownloadPopoverProps {
     object: ContentObject;
 }
 export function DownloadPopover({ object }: DownloadPopoverProps) {
     const { t } = useUITranslation();
-    const { client } = useUserSession()
+    const { client } = useUserSession();
     const onDownload = (name: string) => {
-        getResourceUrl(client, object.id, name).then(url => window.open(url, '_blank'));
-    }
+        void getResourceUrl(client, object.id, name).then((url) => window.open(url, '_blank'));
+    };
 
     const getProcessorType = (): string => {
-        if (object.metadata?.type === "document") {
+        if (object.metadata?.type === 'document') {
             const docMetadata = object.metadata as DocumentMetadata;
-            return docMetadata.content_processor?.type || "xml";
+            return docMetadata.content_processor?.type || 'xml';
         }
-        return "xml"; // default
+        return 'xml'; // default
     };
 
     const processorType = getProcessorType();
 
-    const buttonClass = "p-2 cursor-pointer hover:bg-muted text-left text-sm";
+    const buttonClass = 'p-2 cursor-pointer hover:bg-muted text-start text-sm';
 
     // For markdown processor, only one download option - render simple button
-    if (processorType === "markdown") {
+    if (processorType === 'markdown') {
         return (
-            <Button
-                variant="ghost"
-                size="xs"
-                onClick={() => onDownload("document.md")}
-                alt={t('pdf.download')}
-            >
-                <Download className='size-4' />
+            <Button variant="ghost" size="xs" onClick={() => onDownload('document.md')} alt={t('pdf.download')}>
+                <Download className="size-4" />
             </Button>
         );
     }
@@ -45,27 +40,27 @@ export function DownloadPopover({ object }: DownloadPopoverProps) {
     return (
         <Popover>
             <PopoverTrigger>
-                <Button
-                    variant="ghost"
-                    size="xs"
-                    alt={t('pdf.download')}
-                >
-                    <Download className='size-4' />
+                <Button variant="ghost" size="xs" alt={t('pdf.download')}>
+                    <Download className="size-4" />
                 </Button>
             </PopoverTrigger>
             <PopoverContent align="start" className="p-0 w-auto">
                 <div className="min-w-[200px] flex flex-col divide-y divide-border">
-                    <button className={buttonClass} onClick={() => onDownload("annotated.pdf")}>
+                    <Button variant="unstyled" className={buttonClass} onClick={() => onDownload('annotated.pdf')}>
                         annotated.pdf
-                    </button>
-                    <button className={buttonClass} onClick={() => onDownload("document.xml")}>
+                    </Button>
+                    <Button variant="unstyled" className={buttonClass} onClick={() => onDownload('document.xml')}>
                         document.xml
-                    </button>
-                    <button className={buttonClass} onClick={() => onDownload("analyzed-pages.json")}>
+                    </Button>
+                    <Button
+                        variant="unstyled"
+                        className={buttonClass}
+                        onClick={() => onDownload('analyzed-pages.json')}
+                    >
                         analyzed-pages.json
-                    </button>
+                    </Button>
                 </div>
             </PopoverContent>
         </Popover>
-    )
+    );
 }

package/src/features/magic-pdf/ExtractedContentView.tsx

@@ -1,8 +1,8 @@
-import { JSONCode, XMLViewer, MarkdownRenderer } from '@vertesia/ui/widgets';
+import { JSONCode, MarkdownRenderer, XMLViewer } from '@vertesia/ui/widgets';
 import { Loader2 } from 'lucide-react';
-import { useEffect, useState } from "react";
-import { useMagicPdfContext } from "./MagicPdfProvider";
-import { ViewType } from "./types";
+import { useEffect, useState } from 'react';
+import { useMagicPdfContext } from './MagicPdfProvider';
+import type { ViewType } from './types';
 
 function LoadingSpinner({ className }: { className?: string }) {
     return (
@@ -12,16 +12,15 @@ function LoadingSpinner({ className }: { className?: string }) {
     );
 }
 
-
 interface ExtractedContentViewProps {
     pageNumber: number;
     viewType: ViewType;
 }
 export function ExtractedContentView({ viewType, pageNumber }: ExtractedContentViewProps) {
     switch (viewType) {
-        case "json":
+        case 'json':
             return <JsonPageLayoutView pageNumber={pageNumber} />;
-        case "markdown":
+        case 'markdown':
             return <MarkdownPageView pageNumber={pageNumber} />;
         default:
             return <XmlPageView pageNumber={pageNumber} />;
@@ -37,7 +36,7 @@ function XmlPageView({ pageNumber }: XmlPageViewProps) {
         <div className="px-4 py-2">
             <XMLViewer xml={pages[pageNumber - 1]} collapsible />
         </div>
-    )
+    );
 }
 
 interface JsonPageLayoutViewProps {
@@ -52,7 +51,8 @@ function JsonPageLayoutView({ pageNumber }: JsonPageLayoutViewProps) {
     useEffect(() => {
         setLoading(true);
         setError(null);
-        layoutProvider.getPageLayout(pageNumber)
+        layoutProvider
+            .getPageLayout(pageNumber)
             .then((layoutContent) => {
                 setContent(layoutContent ? JSON.parse(layoutContent) : null);
                 setLoading(false);
@@ -73,11 +73,7 @@ function JsonPageLayoutView({ pageNumber }: JsonPageLayoutViewProps) {
     }
 
     if (error) {
-        return (
-            <div className="px-4 py-2 text-red-500 text-sm">
-                {error}
-            </div>
-        );
+        return <div className="px-4 py-2 text-red-500 text-sm">{error}</div>;
     }
 
     return content ? <JSONCode className="w-full" data={content} /> : null;
@@ -95,7 +91,8 @@ function MarkdownPageView({ pageNumber }: MarkdownPageViewProps) {
     useEffect(() => {
         setLoading(true);
         setError(null);
-        markdownProvider.getPageMarkdown(pageNumber)
+        markdownProvider
+            .getPageMarkdown(pageNumber)
             .then((md) => {
                 setContent(md);
                 setLoading(false);
@@ -117,16 +114,12 @@ function MarkdownPageView({ pageNumber }: MarkdownPageViewProps) {
     }
 
     if (error) {
-        return (
-            <div className="px-4 py-2 text-red-500 text-sm">
-                {error}
-            </div>
-        );
+        return <div className="px-4 py-2 text-red-500 text-sm">{error}</div>;
     }
 
     return (
         <div className="px-4 py-2 prose prose-sm max-w-none dark:prose-invert">
             {content ? <MarkdownRenderer>{content}</MarkdownRenderer> : <div>No markdown content available</div>}
         </div>
-    )
+    );
 }

package/src/features/magic-pdf/MagicPdfProvider.tsx

@@ -1,14 +1,10 @@
-import { useUserSession } from "@vertesia/ui/session";
-import { VertesiaClient } from "@vertesia/client";
-import {
-    ContentObject,
-    DocumentMetadata,
-    PDF_RENDITION_NAME,
-} from "@vertesia/common";
-import React, { createContext, useEffect, useState } from "react";
+import type { VertesiaClient } from '@vertesia/client';
+import { type ContentObject, type DocumentMetadata, PDF_RENDITION_NAME } from '@vertesia/common';
+import { useUserSession } from '@vertesia/ui/session';
+import React, { createContext, useEffect, useState } from 'react';
 
 const DEFAULT_PAGE_COUNT = 10;
-const ADVANCED_PROCESSING_PREFIX = "magic-pdf";
+const ADVANCED_PROCESSING_PREFIX = 'magic-pdf';
 
 export enum ImageType {
     original = 'original',
@@ -34,7 +30,7 @@ export class PageImageProvider {
     constructor(
         private client: VertesiaClient,
         private objectId: string,
-        public totalPages: number
+        public totalPages: number,
     ) {}
 
     private getCacheKey(page: number, type: ImageType): string {
@@ -90,7 +86,7 @@ class PageLayoutProvider {
     constructor(
         private client: VertesiaClient,
         private objectId: string,
-        public totalPages: number
+        public totalPages: number,
     ) {}
 
     async getPageLayout(page: number): Promise<string> {
@@ -118,9 +114,9 @@ class PageLayoutProvider {
     private async fetchPageLayout(page: number): Promise<string> {
         const path = `${ADVANCED_PROCESSING_PREFIX}/${this.objectId}/pages/page-${page}.layout.json`;
         const response = await this.client.files.getDownloadUrl(path);
-        const result = await fetch(response.url, { method: "GET" });
+        const result = await fetch(response.url, { method: 'GET' });
         if (!result.ok) {
-            throw new Error("Failed to fetch json layout: " + result.statusText);
+            throw new Error(`Failed to fetch json layout: ${result.statusText}`);
         }
         return result.text();
     }
@@ -160,8 +156,7 @@ function extractMarkdownPages(content: string, totalPages: number): string[] {
 
     // Find all page markers and their positions
     const markers: { page: number; index: number }[] = [];
-    let match;
-    while ((match = pageDelimiterRegex.exec(content)) !== null) {
+    for (const match of content.matchAll(pageDelimiterRegex)) {
         markers.push({
             page: parseInt(match[1], 10),
             index: match.index + match[0].length,
@@ -182,7 +177,8 @@ function extractMarkdownPages(content: string, totalPages: number): string[] {
         // Find the actual end by looking for the next delimiter or end of content
         const nextDelimiterMatch = content.slice(startIndex).match(/<!--\s*\{\s*"page"\s*:\s*\d+\s*\}\s*-->/);
         const actualEndIndex = nextDelimiterMatch
-            ? startIndex + nextDelimiterMatch.index!
+            ? // biome-ignore lint/style/noNonNullAssertion: intentional non-null assertion; TS can't prove narrowing here
+              startIndex + nextDelimiterMatch.index!
             : content.length;
 
         let pageContent = content.slice(startIndex, actualEndIndex).trim();
@@ -213,7 +209,7 @@ export function MagicPdfProvider({ children, object }: MagicPdfProviderProps) {
         if (isMarkdownProcessor && object.text) {
             markdownProvider.initFromContent(object.text);
         }
-        const xml = object.text ? cleanXml(object.text) : "";
+        const xml = object.text ? cleanXml(object.text) : '';
         return {
             count: page_count,
             layoutProvider: new PageLayoutProvider(client, object.id, page_count),
@@ -231,67 +227,56 @@ export function MagicPdfProvider({ children, object }: MagicPdfProviderProps) {
             // For markdown processor, fetch the PDF URL lazily
             // Priority: PDF rendition > source (only if source is PDF)
             const metadata = object.metadata as DocumentMetadata;
-            const pdfRendition = metadata?.renditions?.find(r => r.name === PDF_RENDITION_NAME);
+            const pdfRendition = metadata?.renditions?.find((r) => r.name === PDF_RENDITION_NAME);
             const isPdfSource = object.content?.type === 'application/pdf';
             const sourceToResolve = pdfRendition?.content?.source || (isPdfSource ? object.content?.source : undefined);
 
             if (sourceToResolve) {
-                client.store.objects.getDownloadUrl(sourceToResolve, undefined, 'inline')
+                client.store.objects
+                    .getDownloadUrl(sourceToResolve, undefined, 'inline')
                     .then((response) => {
-                        setInfo(prev => ({ ...prev, pdfUrl: response.url, pdfUrlLoading: false }));
+                        setInfo((prev) => ({ ...prev, pdfUrl: response.url, pdfUrlLoading: false }));
                     })
                     .catch((e) => {
                         console.warn('Failed to get PDF URL:', e);
-                        setInfo(prev => ({ ...prev, pdfUrlLoading: false }));
+                        setInfo((prev) => ({ ...prev, pdfUrlLoading: false }));
                     });
             } else {
-                setInfo(prev => ({ ...prev, pdfUrlLoading: false }));
+                setInfo((prev) => ({ ...prev, pdfUrlLoading: false }));
             }
         } else {
             // For XML processor, no pre-loading needed - images load on demand
-            setInfo(prev => ({ ...prev, pdfUrlLoading: false }));
+            setInfo((prev) => ({ ...prev, pdfUrlLoading: false }));
         }
-    }, [object.id, client, isMarkdownProcessor, page_count]);
+    }, [client, isMarkdownProcessor, object.metadata, object.content?.type, object.content?.source]);
 
-    return (
-        <MagicPdfContext.Provider value={info}>
-            {children}
-        </MagicPdfContext.Provider>
-    );
+    return <MagicPdfContext.Provider value={info}>{children}</MagicPdfContext.Provider>;
 }
 
-export function getResourceUrl(
-    vertesia: VertesiaClient,
-    objectId: string,
-    name: string,
-): Promise<string> {
-    return vertesia.files
-        .getDownloadUrl(`${ADVANCED_PROCESSING_PREFIX}/${objectId}/${name}`)
-        .then((r) => r.url);
+export function getResourceUrl(vertesia: VertesiaClient, objectId: string, name: string): Promise<string> {
+    return vertesia.files.getDownloadUrl(`${ADVANCED_PROCESSING_PREFIX}/${objectId}/${name}`).then((r) => r.url);
 }
 
 export function useMagicPdfContext() {
     const context = React.useContext(MagicPdfContext);
     if (!context) {
-        throw new Error(
-            "useMagicPdfContext must be used within a MagicPdfProvider",
-        );
+        throw new Error('useMagicPdfContext must be used within a MagicPdfProvider');
     }
     return context;
 }
 
 function extractXmlPages(xml: string): string[] {
     // Parse the XML string
-    const doc = new DOMParser().parseFromString(cleanXml(xml), "text/xml");
-    const pages = doc.getElementsByTagName("page");
+    const doc = new DOMParser().parseFromString(cleanXml(xml), 'text/xml');
+    const pages = doc.getElementsByTagName('page');
     const serializer = new XMLSerializer();
     return Array.from(pages).map((p) => serializer.serializeToString(p));
 }
 
 function cleanXml(xml: string) {
     const cleanedXML = xml
-        // eslint-disable-next-line no-control-regex
-        .replace(/[\x00-\x08\x0B\x0C\x0E-\x1F\x7F]/g, "")
-        .replace(/<\?xml.*?\?>/g, "");
+        // biome-ignore lint/suspicious/noControlCharactersInRegex: deliberately stripping XML-illegal control characters
+        .replace(/[\x00-\x08\x0B\x0C\x0E-\x1F\x7F]/g, '')
+        .replace(/<\?xml.*?\?>/g, '');
     return cleanedXML;
 }