@olenbetong/synergi-react 2.5.2 → 2.5.3

package/es/components/AppMenu/index.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import "./AppMenu.css";
 import { useData, useLoading } from "@olenbetong/appframe-react";
 import { useEffect, useMemo, useRef, useState } from "react";

package/es/components/Checkbox/index.js

@@ -10,7 +10,7 @@ export const Checkbox = forwardRef(function Checkbox({ className, disabled = fal
     inputId = id ?? inputId;
     let inputIdRef = `#${inputId}`;
     let input = useRef(null);
-    // biome-ignore lint/correctness/useExhaustiveDependencies: Ref object
+    // oxlint-disable-next-line react-hooks/exhaustive-deps -- Ref object
     useEffect(() => {
         if (typeof ref === "function") {
             ref(input.current);

package/es/components/ImageEditor/ImageEditor.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import ArrowBackIcon from "@mui/icons-material/ArrowBack";
 import CheckIcon from "@mui/icons-material/Check";
 import RedoIcon from "@mui/icons-material/Redo";

package/es/components/ImageEditor/defaultPlugins.d.ts

@@ -1,4 +1,4 @@
 /** Default set of image editing plugins in display order. */
-export declare const defaultPlugins: (import("./types.js").ToolPlugin | import("./types.js").ActionPlugin)[];
+export declare const defaultPlugins: (import("./types.js").ActionPlugin | import("./types.js").ToolPlugin)[];
 /** Default view plugin providing zoom and pan. */
 export declare const defaultViewPlugin: import("./types.js").ViewPlugin;

package/es/components/ImageEditor/plugins/cropPlugin/CropOverlay.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Alert, CircularProgress, Typography } from "@mui/material";
 import { getLocalizedString } from "@olenbetong/appframe-core";
 import { CropCanvas } from "../../CropCanvas.js";

package/es/components/ImageEditor/plugins/cropPlugin/CropToolbar.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import CheckIcon from "@mui/icons-material/Check";
 import CloseIcon from "@mui/icons-material/Close";
 import { Button, CircularProgress } from "@mui/material";

package/es/components/ImageEditor/plugins/cropPlugin/useCropTool.js

@@ -86,7 +86,7 @@ export function useCropTool(imageUrl, enabled) {
     };
 }
 /** Loads the image at native resolution, maps relative corners, and warps. */
-// biome-ignore lint/suspicious/noExplicitAny: OpenCV.js types
+// oxlint-disable-next-line typescript/no-explicit-any -- OpenCV.js types
 function cropImageAtFullResolution(cv, imageUrl, relCorners) {
     return new Promise((resolve, reject) => {
         let img = new Image();
@@ -106,7 +106,7 @@ function cropImageAtFullResolution(cv, imageUrl, relCorners) {
     });
 }
 /** Performs a perspective warp using OpenCV.js. */
-// biome-ignore lint/suspicious/noExplicitAny: OpenCV.js types
+// oxlint-disable-next-line typescript/no-explicit-any -- OpenCV.js types
 function perspectiveCrop(cv, srcCanvas, corners) {
     let [tl, tr, br, bl] = corners;
     let outW = Math.round(Math.max(Math.hypot(tr.x - tl.x, tr.y - tl.y), Math.hypot(br.x - bl.x, br.y - bl.y)));

package/es/components/ImageEditor/plugins/redactPlugin/RedactOverlay.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useZoom } from "../zoomPlugin/ZoomContext.js";
 import { useRedactContext } from "./RedactContext.js";
 import { normRect } from "./useRedactTool.js";

package/es/components/ImageEditor/plugins/redactPlugin/RedactToolbar.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import CheckIcon from "@mui/icons-material/Check";
 import CloseIcon from "@mui/icons-material/Close";
 import DeleteSweepIcon from "@mui/icons-material/DeleteSweep";

package/es/components/ImageEditor/plugins/zoomPlugin/ZoomControls.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import ZoomInIcon from "@mui/icons-material/ZoomIn";
 import ZoomInMapIcon from "@mui/icons-material/ZoomInMap";
 import ZoomOutIcon from "@mui/icons-material/ZoomOut";

package/es/components/MergeProgressDialog/index.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Button, DialogActions, LinearProgress, Link, Typography } from "@mui/material";
 import { getLocalizedString } from "@olenbetong/appframe-core";
 import { ResponsiveDialog } from "@olenbetong/appframe-mui";
@@ -23,7 +23,7 @@ export function MergeProgressDialog({ open, onClose, getMergerId, mergeType = "p
         return () => clearInterval(timer);
     }, [phase.kind]);
     // Start the merge job each time the dialog opens
-    // biome-ignore lint/correctness/useExhaustiveDependencies: intentionally only re-runs on open change
+    // oxlint-disable-next-line react-hooks/exhaustive-deps -- intentionally only re-runs on open change
     useEffect(() => {
         if (!open)
             return;

package/es/components/Portal/index.js

@@ -9,7 +9,7 @@ export function Portal({ children, root, type = "div" }) {
     const forceUpdate = useForceUpdate();
     const mountNode = useRef(null);
     const portalNode = useRef(null);
-    // biome-ignore lint/correctness/useExhaustiveDependencies: because reasons
+    // oxlint-disable-next-line react-hooks/exhaustive-deps -- because reasons
     useEffect(() => {
         const ownerDocument = mountNode.current?.ownerDocument;
         if (ownerDocument && !portalNode.current) {

package/es/components/Sidebar/index.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import "./index.css";
 import clsx from "clsx";
 import { useEffect, useRef, useState } from "react";
@@ -23,7 +23,7 @@ export function Sidebar(props) {
         element?.addEventListener("transitionend", toggleHiddenContent);
         return () => element?.removeEventListener("transitionend", toggleHiddenContent);
     }, [open]);
-    // biome-ignore lint/correctness/useExhaustiveDependencies: TODO
+    // oxlint-disable-next-line react-hooks/exhaustive-deps -- TODO
     useEffect(() => {
         function handleCloseSidebar(evt) {
             if (evt.key === "Escape") {

package/es/elements/ElementDamage/DamageFormButtons.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Add from "@mui/icons-material/Add";
 import { Button } from "@mui/material";
 import { getLocalizedString } from "@olenbetong/appframe-core";

package/es/elements/ElementDamage/DescriptionInput.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Autocomplete, Button, TextField } from "@mui/material";
 import { getLocalizedString } from "@olenbetong/appframe-core";
 import { useEffect, useRef, useState } from "react";

package/es/elements/ElementDamage/DuplicateDamage/DesktopView.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Grid, Typography } from "@mui/material";
 import { getLocalizedString } from "@olenbetong/appframe-core";
 import { Link } from "@olenbetong/appframe-mui";

package/es/elements/ElementDamage/DuplicateDamage/DublicateElementDamageDialog.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Add from "@mui/icons-material/Add";
 import { Button, Dialog, DialogActions, DialogContent, DialogTitle, Grid, useMediaQuery } from "@mui/material";
 import { getLocalizedString } from "@olenbetong/appframe-core";

package/es/elements/ElementDamage/HiddenDamageFields.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function HiddenDamageFields({ primKey, ID }) {
     return (_jsxs(_Fragment, { children: [_jsx("input", { type: "hidden", name: "PrimKey", value: primKey }), _jsx("input", { type: "hidden", name: "ID", value: ID })] }));
 }

package/es/elements/ElementDamage/RegisterFix.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import CheckIcon from "@mui/icons-material/Check";
 import { Button, Checkbox, FormControlLabel, Typography } from "@mui/material";
 import { getLocalizedString, localize } from "@olenbetong/appframe-core";

package/es/elements/ElementDamage/TransportElementSelect.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import DropDownArrowIcon from "@mui/icons-material/KeyboardArrowDown";
 import { Button, ListItemText, Menu, MenuItem } from "@mui/material";
 import { getLocalizedString } from "@olenbetong/appframe-core";

package/es/elements/ElementLookup.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import SearchIcon from "@mui/icons-material/Search";
 import { IconButton, TextField } from "@mui/material";
 import { getLocalizedString } from "@olenbetong/appframe-core";

package/es/elements/ElementLookupDialog/HIDScanner/index.js

@@ -1,4 +1,4 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import "./index.css";
 import { Box, Button } from "@mui/material";
 import { getLocalizedString } from "@olenbetong/appframe-core";

package/es/elements/ProjectSelect.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Autocomplete, ListItem, ListItemText, TextField } from "@mui/material";
 import { getLocalizedString } from "@olenbetong/appframe-core";
 import { useDataWithFilter, useDebounce } from "@olenbetong/appframe-react";

package/es/useTranslation/index.js

@@ -27,7 +27,7 @@ export function useTranslation(text, targetLanguage, apiKey) {
     let [from, setSourceLang] = useState(null);
     let [isTranslating, setIsTranslating] = useState(false);
     let textRef = useRef(text);
-    // biome-ignore lint/correctness/useExhaustiveDependencies: this is a way of resetting the state so we don't show outdated translations when the text changes
+    // oxlint-disable-next-line react-hooks/exhaustive-deps -- this is a way of resetting the state so we don't show outdated translations when the text changes
     useEffect(() => {
         textRef.current = text;
         return () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@olenbetong/synergi-react",
-  "version": "2.5.2",
+  "version": "2.5.3",
   "description": "Standalone React component for SynergiWeb and Partner Portal",
   "type": "module",
   "exports": {
@@ -23,8 +23,8 @@
   "license": "MIT",
   "peerDependencies": {
     "@mui/material": ">=9.0.0",
-    "react": ">=18.2.0",
-    "react-dom": ">=18.2.0"
+    "react": ">=19.2.7",
+    "react-dom": ">=19.2.7"
   },
   "sideEffects": false,
   "dependencies": {
@@ -36,7 +36,7 @@
     "filepond-plugin-image-exif-orientation": "^1.0.11",
     "filepond-plugin-image-preview": "^4.6.12",
     "filepond-plugin-image-resize": "^2.0.10",
-    "filepond-plugin-image-transform": "^3.8.7",
+    "filepond-plugin-image-transform": "^3.8.8",
     "localforage": "^1.10.0",
     "mitt": "^3.0.1",
     "pdf-lib": "^1.17.1",
@@ -44,8 +44,8 @@
     "react-pdf": "^10.4.1",
     "@olenbetong/appframe-core": "2.11.10",
     "@olenbetong/appframe-data": "1.5.0",
-    "@olenbetong/appframe-react": "1.22.0",
-    "@olenbetong/appframe-mui": "6.3.0"
+    "@olenbetong/appframe-react": "1.23.0",
+    "@olenbetong/appframe-mui": "6.4.0"
   },
   "repository": {
     "type": "git",

package/src/components/AppMenu/index.tsx

@@ -124,7 +124,7 @@ export function AppMenu({ dataObject }: AppMenuProps) {
 				</svg>
 			</button>
 
-			{/* biome-ignore lint/a11y/useKeyWithClickEvents: backdrop click handled via mouse coords */}
+			{/* oxlint-disable-next-line jsx-a11y/click-events-have-key-events -- backdrop click handled via mouse coords */}
 			<dialog
 				ref={dialogRef}
 				className="app-menu-dialog"

package/src/components/Checkbox/index.tsx

@@ -39,7 +39,7 @@ export const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(function Che
 	let inputIdRef = `#${inputId}`;
 	let input = useRef<HTMLInputElement>(null);
 
-	// biome-ignore lint/correctness/useExhaustiveDependencies: Ref object
+	// oxlint-disable-next-line react-hooks/exhaustive-deps -- Ref object
 	useEffect(() => {
 		if (typeof ref === "function") {
 			ref(input.current);

package/src/components/DateNavigator/index.tsx

@@ -168,9 +168,9 @@ export function DateNavigator({
 	}
 
 	return (
-		// biome-ignore lint/a11y/noNoninteractiveTabindex: I hate this component
-		// biome-ignore lint/a11y/noStaticElementInteractions: legacy component
-		// biome-ignore lint/a11y/useAriaPropsSupportedByRole: legacy component
+		// oxlint-disable-next-line jsx-a11y/no-noninteractive-tabindex -- I hate this component
+		// oxlint-disable-next-line jsx-a11y/no-static-element-interactions -- legacy component
+		// oxlint-disable-next-line jsx-a11y/role-supports-aria-props -- legacy component
 		<div className="ObDateNavigator-root" onKeyDown={handleKeyDown} tabIndex={0} aria-label="Date navigator">
 			<Arrow direction="left" onClick={() => updateDate(new Date(dateUtc - oneDay))} disabled={disablePrev} />
 			<div className="ObDateNavigator-date">{text}</div>

package/src/components/ImageEditor/plugins/cropPlugin/useCropTool.ts

@@ -120,7 +120,7 @@ export function useCropTool(imageUrl: string, enabled: boolean): CropToolState {
 }
 
 /** Loads the image at native resolution, maps relative corners, and warps. */
-// biome-ignore lint/suspicious/noExplicitAny: OpenCV.js types
+// oxlint-disable-next-line typescript/no-explicit-any -- OpenCV.js types
 function cropImageAtFullResolution(cv: any, imageUrl: string, relCorners: Quad): Promise<Blob> {
 	return new Promise((resolve, reject) => {
 		let img = new Image();
@@ -141,7 +141,7 @@ function cropImageAtFullResolution(cv: any, imageUrl: string, relCorners: Quad):
 }
 
 /** Performs a perspective warp using OpenCV.js. */
-// biome-ignore lint/suspicious/noExplicitAny: OpenCV.js types
+// oxlint-disable-next-line typescript/no-explicit-any -- OpenCV.js types
 function perspectiveCrop(cv: any, srcCanvas: HTMLCanvasElement, corners: Quad): Promise<Blob> {
 	let [tl, tr, br, bl] = corners;
 	let outW = Math.round(Math.max(Math.hypot(tr.x - tl.x, tr.y - tl.y), Math.hypot(br.x - bl.x, br.y - bl.y)));

package/src/components/MergeProgressDialog/index.tsx

@@ -38,7 +38,7 @@ export function MergeProgressDialog({ open, onClose, getMergerId, mergeType = "p
 	}, [phase.kind]);
 
 	// Start the merge job each time the dialog opens
-	// biome-ignore lint/correctness/useExhaustiveDependencies: intentionally only re-runs on open change
+	// oxlint-disable-next-line react-hooks/exhaustive-deps -- intentionally only re-runs on open change
 	useEffect(() => {
 		if (!open) return;
 

package/src/components/Portal/index.tsx

@@ -18,7 +18,7 @@ export function Portal({ children, root, type = "div" }: PortalProps) {
 	const mountNode = useRef<HTMLDivElement>(null);
 	const portalNode = useRef<HTMLElement | null>(null);
 
-	// biome-ignore lint/correctness/useExhaustiveDependencies: because reasons
+	// oxlint-disable-next-line react-hooks/exhaustive-deps -- because reasons
 	useEffect(() => {
 		const ownerDocument = mountNode.current?.ownerDocument;
 		if (ownerDocument && !portalNode.current) {

package/src/components/Sidebar/index.tsx

@@ -49,7 +49,7 @@ export function Sidebar(props: SidebarProps) {
 		return () => element?.removeEventListener("transitionend", toggleHiddenContent);
 	}, [open]);
 
-	// biome-ignore lint/correctness/useExhaustiveDependencies: TODO
+	// oxlint-disable-next-line react-hooks/exhaustive-deps -- TODO
 	useEffect(() => {
 		function handleCloseSidebar(evt: KeyboardEvent) {
 			if (evt.key === "Escape") {
@@ -106,7 +106,7 @@ export function Sidebar(props: SidebarProps) {
 			>
 				{(open || !hidden) && children}
 			</div>
-			{/** biome-ignore lint/a11y/noStaticElementInteractions: legacy component */}
+			{/** oxlint-disable-next-line jsx-a11y/no-static-element-interactions -- legacy component */}
 			<div
 				role="presentation"
 				tabIndex={-1}

package/src/components/SplitContainer/index.tsx

@@ -67,7 +67,7 @@ type DividerProps = {
 
 const Divider = forwardRef<HTMLDivElement, DividerProps>(function Divider(props: DividerProps, ref) {
 	return (
-		// biome-ignore lint/a11y/useSemanticElements: NO!
+		// oxlint-disable-next-line jsx-a11y/prefer-tag-over-role -- NO!
 		<div
 			className={clsx("ObSplitContainer-divider", props.className)}
 			tabIndex={0}

package/src/components/Toolbar/index.tsx

@@ -94,7 +94,7 @@ function BreadcrumbsInner({ items }: ToolbarBreadcrumbsProps) {
 						{overflowOpen && (
 							<ul className="ob-breadcrumbs__overflow-menu" role="menu">
 								{hiddenItems.map((item, index) => (
-									// biome-ignore lint/suspicious/noArrayIndexKey: stable list with no reordering
+									// oxlint-disable-next-line react/no-array-index-key -- stable list with no reordering
 									<li key={index} role="menuitem">
 										{item.href ? <a href={item.href}>{item.label}</a> : <span>{item.label}</span>}
 									</li>

package/src/components/ValueToggleGroup/index.tsx

@@ -30,7 +30,7 @@ export const ValueToggleGroup = forwardRef<HTMLFieldSetElement, ValueToggleGroup
 	let isControlled = value !== undefined;
 
 	return (
-		// biome-ignore lint/a11y/noNoninteractiveElementToInteractiveRole: legacy component
+		// oxlint-disable-next-line jsx-a11y/no-noninteractive-element-to-interactive-role -- legacy component
 		<fieldset className={clsx("ObValueToggleGroup", orientation, className)} role="radiogroup" ref={ref} style={style}>
 			{options.map((opt) => {
 				return (

package/src/useTranslation/index.ts

@@ -35,7 +35,7 @@ export function useTranslation(text: string, targetLanguage: string, apiKey: str
 	let [isTranslating, setIsTranslating] = useState(false);
 	let textRef = useRef(text);
 
-	// biome-ignore lint/correctness/useExhaustiveDependencies: this is a way of resetting the state so we don't show outdated translations when the text changes
+	// oxlint-disable-next-line react-hooks/exhaustive-deps -- this is a way of resetting the state so we don't show outdated translations when the text changes
 	useEffect(() => {
 		textRef.current = text;
 		return () => {