@olenbetong/synergi-react 2.5.0 → 2.5.2

package/es/components/AppMenu/AppMenu.css

@@ -0,0 +1,158 @@
+/* App Menu – trigger button */
+.app-menu-trigger {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	padding: var(--ds-spacing-2);
+	background: transparent;
+	border: none;
+	border-radius: var(--ds-border-radius-md);
+	color: var(--ds-color-neutral-text-default);
+	cursor: pointer;
+	line-height: 1;
+	transition: background 0.15s ease;
+}
+
+.app-menu-trigger:hover {
+	background: var(--ds-color-neutral-background-hover);
+}
+
+.app-menu-trigger:focus-visible {
+	outline: 2px solid var(--ds-color-focus-outer);
+	outline-offset: 2px;
+}
+
+.app-menu-icon {
+	display: block;
+}
+
+/* Dialog backdrop */
+.app-menu-dialog::backdrop {
+	background: rgba(0, 0, 0, 0.4);
+}
+
+/* Dialog container */
+.app-menu-dialog {
+	padding: 0;
+	border: 1px solid var(--ds-color-neutral-border-default);
+	border-radius: var(--ds-border-radius-lg);
+	background: var(--ds-color-neutral-background-default);
+	box-shadow: var(--ds-shadow-lg, 0 8px 32px rgba(0, 0, 0, 0.18));
+	max-width: min(90vw, 36rem);
+	width: 100%;
+	max-height: min(90vh, 40rem);
+	overflow: hidden;
+	display: flex;
+	flex-direction: column;
+}
+
+/* Inner wrapper – scrollable */
+.app-menu-dialog-inner {
+	display: flex;
+	flex-direction: column;
+	gap: 0;
+	padding: var(--ds-spacing-4);
+	overflow: hidden;
+	height: 100%;
+}
+
+/* Search row */
+.app-menu-search-row {
+	margin-bottom: var(--ds-spacing-3);
+}
+
+.app-menu-search {
+	width: 100%;
+	padding: var(--ds-spacing-2) var(--ds-spacing-3);
+	font-size: var(--ds-font-size-md);
+	border: 1px solid var(--ds-color-neutral-border-strong);
+	border-radius: var(--ds-border-radius-md);
+	background: var(--ds-color-neutral-background-subtle);
+	color: var(--ds-color-neutral-text-default);
+	box-sizing: border-box;
+}
+
+.app-menu-search:focus {
+	outline: 2px solid var(--ds-color-focus-outer);
+	outline-offset: 2px;
+	border-color: var(--ds-color-accent-border-strong);
+}
+
+/* Loading / empty states */
+.app-menu-loading,
+.app-menu-empty {
+	text-align: center;
+	color: var(--ds-color-neutral-text-subtle);
+	font-size: var(--ds-font-size-sm);
+	padding: var(--ds-spacing-4) 0;
+	margin: 0;
+}
+
+/* Groups scroll area */
+.app-menu-groups {
+	overflow-y: auto;
+	flex: 1 1 auto;
+	display: flex;
+	flex-direction: column;
+	gap: var(--ds-spacing-4);
+}
+
+/* Individual group */
+.app-menu-group {
+	display: flex;
+	flex-direction: column;
+	gap: var(--ds-spacing-1);
+}
+
+.app-menu-group-title {
+	font-size: var(--ds-font-size-xs);
+	font-weight: var(--ds-font-weight-medium, 600);
+	text-transform: uppercase;
+	letter-spacing: 0.06em;
+	color: var(--ds-color-neutral-text-subtle);
+	margin: 0 0 var(--ds-spacing-1);
+	padding: 0;
+}
+
+/* App list */
+.app-menu-list {
+	list-style: none;
+	margin: 0;
+	padding: 0;
+	display: grid;
+	grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
+	gap: var(--ds-spacing-1);
+}
+
+.app-menu-item {
+	display: contents;
+}
+
+/* App link tiles */
+.app-menu-link {
+	display: flex;
+	align-items: center;
+	padding: var(--ds-spacing-2) var(--ds-spacing-3);
+	border-radius: var(--ds-border-radius-sm);
+	font-size: var(--ds-font-size-sm);
+	color: var(--ds-color-neutral-text-default);
+	text-decoration: none;
+	background: var(--ds-color-neutral-background-subtle);
+	border: 1px solid transparent;
+	transition:
+		background 0.12s ease,
+		border-color 0.12s ease;
+	word-break: break-word;
+	line-height: 1.4;
+}
+
+.app-menu-link:hover {
+	background: var(--ds-color-accent-background-hover, var(--ds-color-neutral-background-hover));
+	border-color: var(--ds-color-accent-border-default, var(--ds-color-neutral-border-default));
+	color: var(--ds-color-accent-text-default, var(--ds-color-neutral-text-default));
+}
+
+.app-menu-link:focus-visible {
+	outline: 2px solid var(--ds-color-focus-outer);
+	outline-offset: 2px;
+}

package/es/components/AppMenu/index.d.ts

@@ -0,0 +1,12 @@
+import "./AppMenu.css";
+import type { DataObject } from "@olenbetong/appframe-data";
+export type AppMenuArticle = {
+    ArticleId: string;
+    Title: string | null;
+    MenuGroup: string | null;
+    Path: string | null;
+};
+export type AppMenuProps = {
+    dataObject: DataObject<AppMenuArticle>;
+};
+export declare function AppMenu({ dataObject }: AppMenuProps): import("react").JSX.Element;

package/es/components/AppMenu/index.js

@@ -0,0 +1,85 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import "./AppMenu.css";
+import { useData, useLoading } from "@olenbetong/appframe-react";
+import { useEffect, useMemo, useRef, useState } from "react";
+/** Strip version suffixes from ArticleId for building hrefs. */
+function stripVersionSuffix(articleId) {
+    if (articleId.length > 9 && articleId[articleId.length - 8] === ".") {
+        return articleId.slice(0, -8);
+    }
+    if (articleId.length > 5 && articleId[articleId.length - 4] === ".") {
+        return articleId.slice(0, -4);
+    }
+    return articleId;
+}
+/** Group records by MenuGroup, returning an ordered list of [group, items] pairs. */
+function groupByMenuGroup(items) {
+    let map = new Map();
+    for (let item of items) {
+        let key = item.MenuGroup ?? "";
+        let list = map.get(key);
+        if (!list) {
+            list = [];
+            map.set(key, list);
+        }
+        list.push(item);
+    }
+    return [...map.entries()];
+}
+export function AppMenu({ dataObject }) {
+    let dialogRef = useRef(null);
+    let searchRef = useRef(null);
+    let [search, setSearch] = useState("");
+    let [isOpen, setIsOpen] = useState(false);
+    let isLoading = useLoading(dataObject);
+    let allArticles = useData(dataObject);
+    // Refresh data when opened for the first time
+    useEffect(() => {
+        if (isOpen && allArticles.length === 0 && !isLoading) {
+            dataObject.refreshDataSource();
+        }
+    }, [isOpen, allArticles.length, isLoading, dataObject]);
+    let filtered = useMemo(() => {
+        if (!search.trim())
+            return allArticles;
+        let lower = search.toLowerCase();
+        return allArticles.filter((a) => (a.Title ?? "").toLowerCase().includes(lower));
+    }, [allArticles, search]);
+    let groups = useMemo(() => groupByMenuGroup(filtered), [filtered]);
+    function openDialog() {
+        let dialog = dialogRef.current;
+        if (!dialog)
+            return;
+        setIsOpen(true);
+        dialog.showModal();
+        // Focus search after dialog opens
+        requestAnimationFrame(() => searchRef.current?.focus());
+    }
+    function closeDialog() {
+        let dialog = dialogRef.current;
+        if (!dialog)
+            return;
+        setSearch("");
+        setIsOpen(false);
+        dialog.close();
+    }
+    function handleBackdropClick(e) {
+        // Close when clicking outside the dialog content (on the backdrop)
+        let rect = dialogRef.current?.getBoundingClientRect();
+        if (!rect)
+            return;
+        let { clientX, clientY } = e;
+        if (clientX < rect.left || clientX > rect.right || clientY < rect.top || clientY > rect.bottom) {
+            closeDialog();
+        }
+    }
+    // Native <dialog> handles Escape automatically — just sync state
+    function handleCancel() {
+        setSearch("");
+        setIsOpen(false);
+    }
+    return (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", className: "app-menu-trigger", "aria-label": "Open app menu", "aria-haspopup": "dialog", "aria-expanded": isOpen, onClick: openDialog, children: _jsx("svg", { className: "app-menu-icon", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", focusable: "false", width: "24", height: "24", children: _jsx("path", { d: "M4 6h4V4H4v2zm0 5h4V9H4v2zm0 5h4v-2H4v2zM10 4v2h10V4H10zm0 7h10V9H10v2zm0 5h10v-2H10v2z" }) }) }), _jsx("dialog", { ref: dialogRef, className: "app-menu-dialog", "aria-label": "App menu", onClick: handleBackdropClick, onCancel: handleCancel, children: _jsxs("div", { className: "app-menu-dialog-inner", children: [_jsxs("div", { className: "app-menu-search-row", children: [_jsx("label", { htmlFor: "app-menu-search", className: "visually-hidden", children: "Search apps" }), _jsx("input", { ref: searchRef, id: "app-menu-search", type: "search", className: "app-menu-search", placeholder: "Search apps\u2026", value: search, onChange: (e) => setSearch(e.target.value), autoComplete: "off" })] }), isLoading && _jsx("p", { className: "app-menu-loading", children: "Loading\u2026" }), !isLoading && groups.length === 0 && _jsx("p", { className: "app-menu-empty", children: "No apps found." }), _jsx("div", { className: "app-menu-groups", children: groups.map(([group, items]) => (_jsxs("section", { className: "app-menu-group", children: [group && _jsx("h2", { className: "app-menu-group-title", children: group }), _jsx("ul", { className: "app-menu-list", children: items.map((article) => {
+                                            let href = `/${stripVersionSuffix(article.ArticleId)}`;
+                                            return (_jsx("li", { className: "app-menu-item", children: _jsx("a", { href: href, className: "app-menu-link", onClick: closeDialog, children: article.Title ?? article.ArticleId }) }, article.ArticleId));
+                                        }) })] }, group))) })] }) })] }));
+}

package/es/components/AppShell/index.d.ts

@@ -0,0 +1,5 @@
+import { type ReactNode } from "react";
+export type AppShellProps = {
+    children: ReactNode;
+};
+export declare function AppShell({ children }: AppShellProps): import("react").JSX.Element;

package/es/components/AppShell/index.js

@@ -0,0 +1,112 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { StyledEngineProvider, ThemeProvider } from "@mui/material";
+import { createTheme as muiCreateTheme } from "@mui/material/styles";
+import { AppErrorBoundary } from "@olenbetong/appframe-mui";
+import { generateApiDataObject, SortOrder } from "@olenbetong/appframe-data";
+import { useEffect, useState } from "react";
+import { createPortal } from "react-dom";
+import { AppMenu } from "../AppMenu/index.js";
+// Created once — shared across all AppShell instances on a page.
+const dsMenuArticles = generateApiDataObject({
+    resource: "aviw_WebShared_Articles",
+    id: "dsMenuArticles",
+    allowUpdate: false,
+    allowInsert: false,
+    allowDelete: false,
+    dynamicLoading: false,
+    fields: [
+        { name: "ArticleId", type: "string", nullable: false },
+        { name: "Title", type: "string", nullable: true },
+        { name: "MenuGroup", type: "string", nullable: true },
+        { name: "Path", type: "string", nullable: true },
+    ],
+    parameters: {
+        maxRecords: -1,
+        whereClause: "ListOnFrontPage = 1 AND SysApp = 0 AND HideFromNav = 0 AND (IsPublishedVersion IS NULL OR IsPublishedVersion = 1) AND ISNULL(ParentArticleId, '') <> 'news'",
+        sortOrder: [{ MenuGroup: SortOrder.Asc }, { Title: SortOrder.Asc }],
+    },
+});
+function buildMuiTheme() {
+    const s = getComputedStyle(document.body);
+    const get = (v) => s.getPropertyValue(v).trim();
+    return muiCreateTheme({
+        palette: {
+            primary: {
+                main: get("--ds-color-brand-base-default") || "#116069",
+                dark: get("--ds-color-brand-base-hover") || "#0d4b52",
+                contrastText: get("--ds-color-brand-base-contrast-default") || "#ffffff",
+            },
+            secondary: {
+                main: get("--ds-color-brand-light-base-default") || "#1a95a2",
+            },
+        },
+        typography: {
+            fontFamily: [
+                "-apple-system",
+                "BlinkMacSystemFont",
+                '"Segoe UI"',
+                "Roboto",
+                '"Helvetica Neue"',
+                "Arial",
+                "sans-serif",
+                '"Apple Color Emoji"',
+                '"Segoe UI Emoji"',
+                '"Segoe UI Symbol"',
+            ].join(","),
+        },
+        components: {
+            MuiTypography: {
+                styleOverrides: {
+                    h1: { fontSize: "2.488rem" },
+                    h2: { fontSize: "2.074rem" },
+                    h3: { fontSize: "1.728rem" },
+                    h4: { fontSize: "1.44rem" },
+                    h5: { fontSize: "1.2rem" },
+                    h6: { fontSize: "1rem" },
+                },
+            },
+            MuiAppBar: {
+                styleOverrides: {
+                    root: {
+                        "& .MuiTypography-h1": {
+                            fontSize: "1.25rem",
+                            fontWeight: "500",
+                        },
+                    },
+                },
+            },
+            MuiButton: {
+                styleOverrides: {
+                    root: { borderRadius: 2 },
+                },
+            },
+            MuiDialogTitle: {
+                styleOverrides: {
+                    root: {
+                        fontSize: "1.2rem",
+                        fontWeight: 500,
+                        paddingLeft: 16,
+                        paddingRight: 16,
+                    },
+                },
+            },
+            MuiFormLabel: {
+                styleOverrides: {
+                    root: { color: "rgba(0, 0, 0, 0.72)" },
+                },
+            },
+            MuiTextField: { defaultProps: { variant: "filled" } },
+            MuiSelect: { defaultProps: { variant: "filled" } },
+            MuiFormControl: { defaultProps: { variant: "filled" } },
+        },
+    });
+}
+export function AppShell({ children }) {
+    const [theme, setTheme] = useState(() => buildMuiTheme());
+    // Re-read tokens after mount so CSS variables are fully resolved.
+    useEffect(() => {
+        setTheme(buildMuiTheme());
+    }, []);
+    const appMenuSlot = document.getElementById("ob-toolbar-app-menu");
+    return (_jsx(StyledEngineProvider, { injectFirst: true, children: _jsx(ThemeProvider, { theme: theme, children: _jsxs(AppErrorBoundary, { children: [appMenuSlot && createPortal(_jsx(AppMenu, { dataObject: dsMenuArticles }), appMenuSlot), children] }) }) }));
+}

package/es/components/ColorCard/index.d.ts

@@ -3,14 +3,14 @@ export type ColorCardProps = Pick<React.HTMLAttributes<HTMLDivElement>, "id" | "
     as?: "a" | "div" | "button" | "span" | "section" | "article";
     href?: string;
 };
-export declare function ColorCard({ as: Component, children, className, href, ...other }: ColorCardProps): import("react/jsx-runtime").JSX.Element;
-export declare function CardStepList({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
-export declare function CardStep({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+export declare function ColorCard({ as: Component, children, className, href, ...other }: ColorCardProps): import("react").JSX.Element;
+export declare function CardStepList({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+export declare function CardStep({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
 export declare function CardColumn({ children, className, minor, ...other }: React.HTMLAttributes<HTMLDivElement> & {
     minor?: boolean;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export declare function CardDetail({ children, className, label, primary, ...other }: React.HTMLAttributes<HTMLDivElement> & {
     label?: React.ReactNode;
     primary?: boolean;
-}): import("react/jsx-runtime").JSX.Element;
-export declare function CardLabel({ children, className, ...other }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
+export declare function CardLabel({ children, className, ...other }: React.HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;

package/es/components/DateNavigator/index.d.ts

@@ -7,4 +7,4 @@ export type DateNavigatorProps = {
     minDate?: Date | string | number;
     maxDate?: Date | string | number;
 };
-export declare function DateNavigator({ date: dateProp, defaultDate, disableTodayButton, onChange, minDate: minDateProp, maxDate: maxDateProp, }: DateNavigatorProps): import("react/jsx-runtime").JSX.Element;
+export declare function DateNavigator({ date: dateProp, defaultDate, disableTodayButton, onChange, minDate: minDateProp, maxDate: maxDateProp, }: DateNavigatorProps): import("react").JSX.Element;

package/es/components/FilePond.d.ts

@@ -41,4 +41,4 @@ type FileStoreDataObjectRecord = {
     Damage: boolean;
     DamageID: number | null;
 };
-export declare function FilePond<T extends FileStoreDataObjectRecord>({ dataObject, fields, onUploadStart, onFileUploaded, onFinishedUploads, onFileRemoved, onError, fieldName, filePondOptions, primKey, attachmentPrimKeys, whereClause, inputRef: inputRefProp, ...props }: FilePondProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function FilePond<T extends FileStoreDataObjectRecord>({ dataObject, fields, onUploadStart, onFileUploaded, onFinishedUploads, onFileRemoved, onError, fieldName, filePondOptions, primKey, attachmentPrimKeys, whereClause, inputRef: inputRefProp, ...props }: FilePondProps<T>): import("react").JSX.Element;

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

@@ -10,5 +10,5 @@ interface Props {
  * Absolutely-positioned draggable corner handle.
  * Position is in CSS pixels relative to the nearest `position: relative` ancestor.
  */
-export declare function DragHandle({ x, y, onChange, containerWidth, containerHeight }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function DragHandle({ x, y, onChange, containerWidth, containerHeight }: Props): import("react").JSX.Element;
 export {};

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

@@ -12,5 +12,5 @@ interface Props {
  * Tracks the pointer delta so both corners on this edge move by the same amount,
  * preserving the edge angle.
  */
-export declare function EdgeHandle({ x, y, axis, onChange }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function EdgeHandle({ x, y, axis, onChange }: Props): import("react").JSX.Element;
 export {};

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

@@ -7,5 +7,5 @@ interface Props {
     isSmall: boolean;
 }
 /** Renders a labelled Button on large screens and a Tooltip-wrapped IconButton on small ones. */
-export declare function ResponsiveButton({ icon, label, onClick, disabled, isSmall }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function ResponsiveButton({ icon, label, onClick, disabled, isSmall }: Props): import("react").JSX.Element;
 export {};

package/es/components/ImageEditor/plugins/cropPlugin/CropContext.d.ts

@@ -5,6 +5,6 @@ interface CropContextValue extends CropToolState {
     onApply: (blob: Blob, actions: EditAction[]) => void;
     onCancel: () => void;
 }
-export declare function CropProvider({ imageUrl, onApply, onCancel, children }: ToolProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function CropProvider({ imageUrl, onApply, onCancel, children }: ToolProviderProps): import("react").JSX.Element;
 export declare function useCropContext(): CropContextValue;
 export {};

package/es/components/ImageEditor/plugins/cropPlugin/CropOverlay.d.ts

@@ -1,2 +1,2 @@
 /** Canvas-area overlay for the crop tool. Reads all state from CropContext. */
-export declare function CropOverlay(): import("react/jsx-runtime").JSX.Element;
+export declare function CropOverlay(): import("react").JSX.Element;

package/es/components/ImageEditor/plugins/cropPlugin/CropToolbar.d.ts

@@ -1,2 +1,2 @@
 /** Toolbar shown while the crop tool is active. Reads state from CropContext. */
-export declare function CropToolbar(): import("react/jsx-runtime").JSX.Element;
+export declare function CropToolbar(): import("react").JSX.Element;

package/es/components/ImageEditor/plugins/redactPlugin/RedactContext.d.ts

@@ -5,6 +5,6 @@ interface RedactContextValue extends RedactToolState {
     onApply: (blob: Blob, actions: EditAction[]) => void;
     onCancel: () => void;
 }
-export declare function RedactProvider({ imageUrl, onApply, onCancel, children }: ToolProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function RedactProvider({ imageUrl, onApply, onCancel, children }: ToolProviderProps): import("react").JSX.Element;
 export declare function useRedactContext(): RedactContextValue;
 export {};

package/es/components/ImageEditor/plugins/redactPlugin/RedactOverlay.d.ts

@@ -3,4 +3,4 @@
  * Uses an SVG layer over the image for drawing; blur preview uses SVG feGaussianBlur
  * so the live preview matches the final applied output.
  */
-export declare function RedactOverlay(): import("react/jsx-runtime").JSX.Element;
+export declare function RedactOverlay(): import("react").JSX.Element;

package/es/components/ImageEditor/plugins/redactPlugin/RedactToolbar.d.ts

@@ -1,2 +1,2 @@
 /** Toolbar shown while the redact tool is active. Reads state from RedactContext. */
-export declare function RedactToolbar(): import("react/jsx-runtime").JSX.Element;
+export declare function RedactToolbar(): import("react").JSX.Element;

package/es/components/ImageEditor/plugins/zoomPlugin/ZoomCanvas.d.ts

@@ -16,5 +16,5 @@ interface Props {
  * • 2-finger pinch + translate: simultaneous zoom + pan anchored at midpoint
  * • 1-finger drag (when panEnabled): pan
  */
-export declare function ZoomCanvas({ children, panEnabled }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function ZoomCanvas({ children, panEnabled }: Props): import("react").JSX.Element;
 export {};

package/es/components/ImageEditor/plugins/zoomPlugin/ZoomContext.d.ts

@@ -3,4 +3,4 @@ import { type ZoomPanResult } from "./useZoomPan.js";
 export declare function useZoom(): ZoomPanResult;
 export declare function ZoomProvider({ children }: {
     children: ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;

package/es/components/ImageEditor/plugins/zoomPlugin/ZoomControls.d.ts

@@ -2,5 +2,5 @@ interface Props {
     disabled?: boolean;
     isSmall?: boolean;
 }
-export declare function ZoomControls({ disabled, isSmall }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function ZoomControls({ disabled, isSmall }: Props): import("react").JSX.Element;
 export {};

package/es/components/LinkedCardList/index.d.ts

@@ -1,8 +1,8 @@
 import "./index.css";
-export declare function LinkedList({ children, className, ...other }: React.HTMLProps<HTMLUListElement>): import("react/jsx-runtime").JSX.Element;
+export declare function LinkedList({ children, className, ...other }: React.HTMLProps<HTMLUListElement>): import("react").JSX.Element;
 export declare function LinkedListItem({ children, className, label, ...other }: React.HTMLProps<HTMLLIElement> & {
     label: React.ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export declare function Card({ as, children, className, ...other }: React.HTMLProps<HTMLDivElement> & {
     as?: any;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;

package/es/components/MergeProgressDialog/index.d.ts

@@ -5,4 +5,4 @@ export type MergeProgressDialogProps = {
     getMergerId: () => Promise<string | number>;
     mergeType?: "pdf" | "zip";
 };
-export declare function MergeProgressDialog({ open, onClose, getMergerId, mergeType }: MergeProgressDialogProps): import("react/jsx-runtime").JSX.Element;
+export declare function MergeProgressDialog({ open, onClose, getMergerId, mergeType }: MergeProgressDialogProps): import("react").JSX.Element;

package/es/components/PageBanner/index.d.ts

@@ -3,20 +3,20 @@ import React from "react";
 export type PageBannerProps = React.HTMLProps<HTMLDivElement> & {
     as?: "header" | "section" | "div";
 };
-export declare function PageBanner({ as, className, children, ...other }: PageBannerProps): import("react/jsx-runtime").JSX.Element;
+export declare function PageBanner({ as, className, children, ...other }: PageBannerProps): React.JSX.Element;
 export type BannerImageProps = React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>;
 export declare const BannerImage: React.ForwardRefExoticComponent<Omit<BannerImageProps, "ref"> & React.RefAttributes<HTMLImageElement>>;
 export type TabListProps = Pick<React.HTMLProps<HTMLDivElement>, "id" | "className" | "children"> & {
     as?: "ul" | "ol" | "nav" | "div" | "span";
     sticky?: boolean;
 };
-export declare function TabList({ as, className, children, sticky, ...other }: TabListProps): import("react/jsx-runtime").JSX.Element;
+export declare function TabList({ as, className, children, sticky, ...other }: TabListProps): React.JSX.Element;
 export type TabProps = Pick<React.HTMLProps<HTMLDivElement>, "id" | "className" | "children"> & {
     active?: boolean;
     as?: "a" | "li" | "div" | "span";
 };
-export declare function Tab({ active, as, className, children, ...other }: TabProps): import("react/jsx-runtime").JSX.Element;
+export declare function Tab({ active, as, className, children, ...other }: TabProps): React.JSX.Element;
 export type TitleProps = Pick<React.HTMLProps<HTMLDivElement>, "id" | "className" | "children"> & {
     as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div" | "span" | "p";
 };
-export declare function Title({ as, className, children, ...other }: TitleProps): import("react/jsx-runtime").JSX.Element;
+export declare function Title({ as, className, children, ...other }: TitleProps): React.JSX.Element;

package/es/components/PdfViewer/PdfViewer.d.ts

@@ -3,5 +3,5 @@ type PdfViewerProps = {
     url?: string;
     file?: string | Blob | ArrayBuffer;
 };
-export declare function PdfViewer({ url, file }: PdfViewerProps): import("react/jsx-runtime").JSX.Element;
+export declare function PdfViewer({ url, file }: PdfViewerProps): import("react").JSX.Element;
 export {};

package/es/components/Portal/index.d.ts

@@ -3,4 +3,4 @@ export type PortalProps = {
     root?: string;
     type?: string;
 };
-export declare function Portal({ children, root, type }: PortalProps): import("react/jsx-runtime").JSX.Element;
+export declare function Portal({ children, root, type }: PortalProps): import("react").JSX.Element;

package/es/components/Sidebar/index.d.ts

@@ -6,4 +6,4 @@ export type SidebarProps = React.HTMLAttributes<HTMLDivElement> & {
     pullRight?: boolean;
     shadow?: boolean;
 };
-export declare function Sidebar(props: SidebarProps): import("react/jsx-runtime").JSX.Element;
+export declare function Sidebar(props: SidebarProps): import("react").JSX.Element;

package/es/components/Spinner/index.d.ts

@@ -7,4 +7,4 @@ export declare function Spinner({ className, fullPage, ...rest }: {
     [x: string]: any;
     className?: string | undefined;
     fullPage?: boolean | undefined;
-}): import("react/jsx-runtime").JSX.Element;
+}): React.JSX.Element;

package/es/components/SplitContainer/index.d.ts

@@ -19,4 +19,4 @@ export type SplitContainerProps = {
      */
     id?: string;
 };
-export declare function SplitContainer({ className, children, direction, fixedPanel, panelClassName, defaultFixedSize, layoutVersion, min, max, id, }: SplitContainerProps): import("react/jsx-runtime").JSX.Element;
+export declare function SplitContainer({ className, children, direction, fixedPanel, panelClassName, defaultFixedSize, layoutVersion, min, max, id, }: SplitContainerProps): React.JSX.Element;

package/es/components/Toolbar/index.d.ts

@@ -12,4 +12,4 @@ export type BreadcrumbItem = {
 export type ToolbarBreadcrumbsProps = {
     items: BreadcrumbItem[];
 };
-export declare function ToolbarBreadcrumbs({ items }: ToolbarBreadcrumbsProps): import("react/jsx-runtime").JSX.Element;
+export declare function ToolbarBreadcrumbs({ items }: ToolbarBreadcrumbsProps): import("react").JSX.Element;

package/es/elements/ElementDamage/DamageFormButtons.d.ts

@@ -5,5 +5,5 @@ type DamageFormButtonsProps = {
     handleDelete: () => void;
     handleCancel: () => void;
 };
-export declare function DamageFormButtonsProps({ isEdit, loading, uploadingFile, handleDelete, handleCancel, }: DamageFormButtonsProps): import("react/jsx-runtime").JSX.Element;
+export declare function DamageFormButtonsProps({ isEdit, loading, uploadingFile, handleDelete, handleCancel, }: DamageFormButtonsProps): import("react").JSX.Element;
 export {};

package/es/elements/ElementDamage/DescriptionInput.d.ts

@@ -12,5 +12,5 @@ type DescriptionInputProps = {
     onCopyPrevDamage?: (value: DescriptionInputType) => void;
     onChange?: (value: DescriptionInputType) => void;
 };
-export declare function DescriptionInput({ value, defaultValue, descriptionOptions, storageNamespace, onCopyPrevDamage, onChange, }: DescriptionInputProps): import("react/jsx-runtime").JSX.Element;
+export declare function DescriptionInput({ value, defaultValue, descriptionOptions, storageNamespace, onCopyPrevDamage, onChange, }: DescriptionInputProps): import("react").JSX.Element;
 export {};

package/es/elements/ElementDamage/DuplicateDamage/DesktopView.d.ts

@@ -3,6 +3,6 @@ type ElementDamagesItemProps = {
     record: DamagesRecord;
     linkToDamage: boolean;
 };
-export declare function ElementDamagesItem({ record, linkToDamage }: ElementDamagesItemProps): import("react/jsx-runtime").JSX.Element;
-export declare function ElementDamagesHeader(): import("react/jsx-runtime").JSX.Element;
+export declare function ElementDamagesItem({ record, linkToDamage }: ElementDamagesItemProps): import("react").JSX.Element;
+export declare function ElementDamagesHeader(): import("react").JSX.Element;
 export {};

package/es/elements/ElementDamage/DuplicateDamage/DublicateElementDamageDialog.d.ts

@@ -7,5 +7,5 @@ type DuplicateElementDamageDialogProps = {
     loading: boolean;
     linkToDamage: boolean;
 };
-export declare function DuplicateElementDamageDialog({ open, onClose, record, onRegisterAnyway, loading, linkToDamage, }: DuplicateElementDamageDialogProps): import("react/jsx-runtime").JSX.Element;
+export declare function DuplicateElementDamageDialog({ open, onClose, record, onRegisterAnyway, loading, linkToDamage, }: DuplicateElementDamageDialogProps): import("react").JSX.Element;
 export {};

package/es/elements/ElementDamage/DuplicateDamage/PhoneView.d.ts

@@ -3,5 +3,5 @@ type DuplicatePhoneViewItemProps = {
     record: DamagesRecord;
     linkToDamage: boolean;
 };
-export declare function DuplicatePhoneViewItem({ record, linkToDamage }: DuplicatePhoneViewItemProps): import("react/jsx-runtime").JSX.Element;
+export declare function DuplicatePhoneViewItem({ record, linkToDamage }: DuplicatePhoneViewItemProps): import("react").JSX.Element;
 export {};