udp-react-enterprise-component-library 25.18.1-beta.2 → 25.18.1-beta.21

package/dist/CrudTableSidePanel-CXOSojmw.js

@@ -0,0 +1,120 @@
+import { t as ConfigService } from "./configService-C4uoG3wj.js";
+import { t as useUser } from "./useUser-wpHGo6jU.js";
+import { N as UdpEnums } from "./unitySystemEnums-DQSkCr3D.js";
+import { t as LayoutUnit } from "./LayoutUnit-D4jJvonh.js";
+import { t as useAxiosGet } from "./useAxiosGet-vvPjwB4W.js";
+import { t as PageContainer } from "./PageContainer-N4d5KO-T.js";
+import { t as CrudForm } from "./CrudForm-DzmNPfVa.js";
+import React, { useMemo } from "react";
+import { Divider, makeStyles } from "@material-ui/core";
+import PropTypes from "prop-types";
+import { Skeleton } from "@material-ui/lab";
+import { DndProvider } from "react-dnd";
+import { HTML5Backend } from "react-dnd-html5-backend";
+
+//#region src/maintenanceEngine/entityAttributeActions.js
+const UDP_LOOKUP_ENTITY_ATTRIBUTES_TO_HIDE = [
+	"businessObjectKey",
+	"clusterId",
+	"data",
+	"domainName"
+];
+
+//#endregion
+//#region src/maintenanceEngine/crudBrowser/CrudTableSidePanel.jsx
+const useStyles = makeStyles((theme) => ({
+	root: {},
+	divider: { marginTop: theme.spacing(2) }
+}));
+const FIELD_NUMBER = 10;
+const CrudTableSidePanel = (props) => {
+	const { entityAttributes, udpFieldInfos, foreignKeyData, crudTableEditionData, closeSideSheet, onCreate, onUpdate, pageId, setSideSheetWidth, setSideSheetButtonLabel, setSideSheetOnSubmit, setSideSheetProps, isNewEntry, entityData, entityName } = props;
+	const user = useUser();
+	const classes = useStyles();
+	const [{ data: page, loading: loadingPage }] = useAxiosGet(ConfigService.tenantV1ApiUrl, `page/${pageId}`, {}, !!!pageId, false);
+	const skeleton = useMemo(() => {
+		const skeletonArr = [];
+		for (let i = 0; i < FIELD_NUMBER; i++) skeletonArr.push(/* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Skeleton, {
+			key: i,
+			variant: "rect",
+			className: classes.skeleton
+		}), /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "xxs" })));
+		return skeletonArr;
+	}, [classes]);
+	const filteredEntityAttributes = useMemo(() => {
+		if (entityName?.toLowerCase().includes(UdpEnums.Udp_Lookup.toLowerCase())) return entityAttributes.filter((attr) => !UDP_LOOKUP_ENTITY_ATTRIBUTES_TO_HIDE.includes(attr.name));
+		return entityAttributes.filter((attr) => attr.name !== "businessObjectKey");
+	}, [entityAttributes, entityName]);
+	const sideSheetContent = useMemo(() => {
+		if (page) return /* @__PURE__ */ React.createElement(DndProvider, { backend: HTML5Backend }, /* @__PURE__ */ React.createElement(PageContainer, {
+			user,
+			key: pageId,
+			pageData: page,
+			widgetParams: {
+				pageId: page?.pageId,
+				entityAttributes: filteredEntityAttributes,
+				entityData,
+				entityName,
+				foreignKeyData,
+				isNewEntry,
+				udpFieldInfos,
+				nodeObj: crudTableEditionData,
+				setSideSheetWidth,
+				setSideSheetButtonLabel,
+				setSideSheetOnSubmit,
+				closeSideSheet,
+				setSideSheetProps,
+				onCreate,
+				onUpdate
+			},
+			disableMargins: true
+		}));
+		else return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(CrudForm, {
+			entityAttributes: filteredEntityAttributes,
+			udpFieldInfos,
+			foreignKeyData,
+			crudTableEditionData,
+			closeSideSheet,
+			onCreate,
+			onUpdate,
+			isNewEntry,
+			entityData,
+			entityName
+		}), /* @__PURE__ */ React.createElement("div", { className: classes.divider }, /* @__PURE__ */ React.createElement(Divider, null)));
+	}, [
+		page,
+		user,
+		pageId,
+		setSideSheetWidth,
+		setSideSheetButtonLabel,
+		setSideSheetOnSubmit,
+		setSideSheetProps,
+		closeSideSheet,
+		onCreate,
+		onUpdate,
+		filteredEntityAttributes,
+		foreignKeyData,
+		isNewEntry,
+		entityData,
+		classes,
+		entityName,
+		udpFieldInfos,
+		crudTableEditionData
+	]);
+	return /* @__PURE__ */ React.createElement("div", null, loadingPage ? /* @__PURE__ */ React.createElement(React.Fragment, null, skeleton.map((sk) => sk), /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "md" }), /* @__PURE__ */ React.createElement(Skeleton, {
+		variant: "rect",
+		className: classes.skeletonButton
+	})) : sideSheetContent);
+};
+CrudTableSidePanel.propTypes = {
+	entityAttributes: PropTypes.array,
+	foreignKeyData: PropTypes.array,
+	crudTableEditionData: PropTypes.array,
+	closeSideSheet: PropTypes.func,
+	onCreate: PropTypes.func,
+	onUpdate: PropTypes.func
+};
+
+//#endregion
+export { UDP_LOOKUP_ENTITY_ATTRIBUTES_TO_HIDE as n, CrudTableSidePanel as t };
+//# sourceMappingURL=CrudTableSidePanel-CXOSojmw.js.map

package/dist/CrudTableSidePanel-CXOSojmw.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CrudTableSidePanel-CXOSojmw.js","names":[],"sources":["../src/maintenanceEngine/entityAttributeActions.js","../src/maintenanceEngine/crudBrowser/CrudTableSidePanel.jsx"],"sourcesContent":["export const UDP_LOOKUP_ENTITY_ATTRIBUTES_TO_HIDE = [\n  'businessObjectKey',\n  'clusterId',\n  'data',\n  'domainName'\n];\n","import { Divider, makeStyles } from '@material-ui/core';\nimport PropTypes from 'prop-types';\nimport React, { useMemo } from 'react';\nimport { CrudForm } from '../../UI/forms/CrudForm';\nimport { useUser } from '../../utilities/auth/useUser';\nimport { DndProvider } from 'react-dnd';\nimport { HTML5Backend } from 'react-dnd-html5-backend';\nimport { PageContainer } from '../../page/PageContainer';\nimport { useAxiosGet } from '../../utilities/useAxiosGet';\nimport { Skeleton } from '@material-ui/lab';\nimport { LayoutUnit } from '../../layout/LayoutUnit';\nimport { UdpEnums } from '../../enums/unitySystemEnums';\nimport { UDP_LOOKUP_ENTITY_ATTRIBUTES_TO_HIDE } from '../entityAttributeActions';\nimport { ConfigService } from '../../configService';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {},\n  divider: {\n    marginTop: theme.spacing(2)\n  }\n}));\n\nconst FIELD_NUMBER = 10;\n\nexport const CrudTableSidePanel = (props) => {\n  const {\n    entityAttributes,\n    udpFieldInfos,\n    foreignKeyData,\n    crudTableEditionData,\n    closeSideSheet,\n    onCreate,\n    onUpdate,\n    pageId,\n    setSideSheetWidth,\n    setSideSheetButtonLabel,\n    setSideSheetOnSubmit,\n    setSideSheetProps,\n    isNewEntry,\n    entityData,\n    entityName\n  } = props;\n  const user = useUser();\n  const classes = useStyles();\n\n  const [{ data: page, loading: loadingPage }] = useAxiosGet(\n    ConfigService.tenantV1ApiUrl,\n    `page/${pageId}`,\n    {},\n    !!!pageId,\n    false\n  );\n\n  const skeleton = useMemo(() => {\n    const skeletonArr = [];\n    for (let i = 0; i < FIELD_NUMBER; i++) {\n      skeletonArr.push(\n        <>\n          <Skeleton key={i} variant='rect' className={classes.skeleton} />\n          <LayoutUnit unit='xxs' />\n        </>\n      );\n    }\n    return skeletonArr;\n  }, [classes]);\n\n  // LAA UNT-3026: Remove businessObjectKey field from the side panel crud form\n  const filteredEntityAttributes = useMemo(() => {\n    if (entityName?.toLowerCase().includes(UdpEnums.Udp_Lookup.toLowerCase())) {\n      return entityAttributes.filter(\n        (attr) => !UDP_LOOKUP_ENTITY_ATTRIBUTES_TO_HIDE.includes(attr.name)\n      );\n    }\n    return entityAttributes.filter((attr) => attr.name !== 'businessObjectKey');\n  }, [entityAttributes, entityName]);\n\n  const sideSheetContent = useMemo(() => {\n    if (page) {\n      return (\n        <DndProvider backend={HTML5Backend}>\n          <PageContainer\n            user={user}\n            key={pageId}\n            pageData={page}\n            widgetParams={{\n              pageId: page?.pageId,\n              entityAttributes: filteredEntityAttributes,\n              entityData: entityData,\n              entityName: entityName,\n              foreignKeyData: foreignKeyData,\n              isNewEntry: isNewEntry,\n              udpFieldInfos: udpFieldInfos,\n              nodeObj: crudTableEditionData,\n              setSideSheetWidth: setSideSheetWidth,\n              setSideSheetButtonLabel: setSideSheetButtonLabel,\n              setSideSheetOnSubmit: setSideSheetOnSubmit,\n              closeSideSheet: closeSideSheet,\n              setSideSheetProps: setSideSheetProps,\n              onCreate: onCreate,\n              onUpdate: onUpdate\n            }}\n            disableMargins={true}\n          />\n        </DndProvider>\n      );\n    } else {\n      return (\n        <>\n          <CrudForm\n            entityAttributes={filteredEntityAttributes}\n            udpFieldInfos={udpFieldInfos}\n            foreignKeyData={foreignKeyData}\n            crudTableEditionData={crudTableEditionData}\n            closeSideSheet={closeSideSheet}\n            onCreate={onCreate}\n            onUpdate={onUpdate}\n            isNewEntry={isNewEntry}\n            entityData={entityData}\n            entityName={entityName}\n          />\n          <div className={classes.divider}>\n            <Divider />\n          </div>\n        </>\n      );\n    }\n  }, [\n    page,\n    user,\n    pageId,\n    setSideSheetWidth,\n    setSideSheetButtonLabel,\n    setSideSheetOnSubmit,\n    setSideSheetProps,\n    closeSideSheet,\n    onCreate,\n    onUpdate,\n    filteredEntityAttributes,\n    foreignKeyData,\n    isNewEntry,\n    entityData,\n    classes,\n    entityName,\n    udpFieldInfos,\n    crudTableEditionData\n  ]);\n\n  return (\n    <div>\n      {loadingPage ? (\n        <>\n          {skeleton.map((sk) => sk)}\n          <LayoutUnit unit='md' />\n          <Skeleton variant='rect' className={classes.skeletonButton} />\n        </>\n      ) : (\n        sideSheetContent\n      )}\n    </div>\n  );\n};\n\nCrudTableSidePanel.propTypes = {\n  /**\n   * Entity attributes for selected entity within catalog\n   */\n  entityAttributes: PropTypes.array,\n  /**\n   * Foreign key data for selected entity within catalog\n   */\n  foreignKeyData: PropTypes.array,\n  /**\n   * Entity data\n   */\n  crudTableEditionData: PropTypes.array,\n  /**\n   * onClick event for closing sidesheet\n   */\n  closeSideSheet: PropTypes.func,\n  /**\n   * onClick event for creating\n   */\n  onCreate: PropTypes.func,\n  /**\n   * onClick event for updating\n   */\n  onUpdate: PropTypes.func\n};\n"],"mappings":";;;;;;;;;;;;;;;AAAA,MAAa,uCAAuC;CAClD;CACA;CACA;CACA;CACD;;;;ACUD,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM,EAAE;CACR,SAAS,EACP,WAAW,MAAM,QAAQ,EAAE,EAC5B;CACF,EAAE;AAEH,MAAM,eAAe;AAErB,MAAa,sBAAsB,UAAU;CAC3C,MAAM,EACJ,kBACA,eACA,gBACA,sBACA,gBACA,UACA,UACA,QACA,mBACA,yBACA,sBACA,mBACA,YACA,YACA,eACE;CACJ,MAAM,OAAO,SAAS;CACtB,MAAM,UAAU,WAAW;CAE3B,MAAM,CAAC,EAAE,MAAM,MAAM,SAAS,iBAAiB,YAC7C,cAAc,gBACd,QAAQ,UACR,EAAE,EACF,CAAC,CAAC,CAAC,QACH,MACD;CAED,MAAM,WAAW,cAAc;EAC7B,MAAM,cAAc,EAAE;AACtB,OAAK,IAAI,IAAI,GAAG,IAAI,cAAc,IAChC,aAAY,KACV,0DACE,oCAAC;GAAS,KAAK;GAAG,SAAQ;GAAO,WAAW,QAAQ;IAAY,EAChE,oCAAC,cAAW,MAAK,QAAQ,CACxB,CACJ;AAEH,SAAO;IACN,CAAC,QAAQ,CAAC;CAGb,MAAM,2BAA2B,cAAc;AAC7C,MAAI,YAAY,aAAa,CAAC,SAAS,SAAS,WAAW,aAAa,CAAC,CACvE,QAAO,iBAAiB,QACrB,SAAS,CAAC,qCAAqC,SAAS,KAAK,KAAK,CACpE;AAEH,SAAO,iBAAiB,QAAQ,SAAS,KAAK,SAAS,oBAAoB;IAC1E,CAAC,kBAAkB,WAAW,CAAC;CAElC,MAAM,mBAAmB,cAAc;AACrC,MAAI,KACF,QACE,oCAAC,eAAY,SAAS,gBACpB,oCAAC;GACO;GACN,KAAK;GACL,UAAU;GACV,cAAc;IACZ,QAAQ,MAAM;IACd,kBAAkB;IACN;IACA;IACI;IACJ;IACG;IACf,SAAS;IACU;IACM;IACH;IACN;IACG;IACT;IACA;IACX;GACD,gBAAgB;IAChB,CACU;MAGhB,QACE,0DACE,oCAAC;GACC,kBAAkB;GACH;GACC;GACM;GACN;GACN;GACA;GACE;GACA;GACA;IACZ,EACF,oCAAC,SAAI,WAAW,QAAQ,WACtB,oCAAC,cAAU,CACP,CACL;IAGN;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,oCAAC,aACE,cACC,0DACG,SAAS,KAAK,OAAO,GAAG,EACzB,oCAAC,cAAW,MAAK,OAAO,EACxB,oCAAC;EAAS,SAAQ;EAAO,WAAW,QAAQ;GAAkB,CAC7D,GAEH,iBAEE;;AAIV,mBAAmB,YAAY;CAI7B,kBAAkB,UAAU;CAI5B,gBAAgB,UAAU;CAI1B,sBAAsB,UAAU;CAIhC,gBAAgB,UAAU;CAI1B,UAAU,UAAU;CAIpB,UAAU,UAAU;CACrB"}

package/dist/DashboardWidget-F4pnOQAe.js

@@ -0,0 +1,290 @@
+import { n as useShellStore } from "./shellStore-C8zfPsZ-.js";
+import { n as FUICardHeaderMenu, r as FUICard_default } from "./FUICard-DmszpY_T.js";
+import { t as FUIMenuItem_default } from "./FUIMenuItem-BZJKJa91.js";
+import { t as PageLoading } from "./PageLoading-GD6E2uMU.js";
+import React, { Suspense, isValidElement, lazy, memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { CircularProgress, lighten, makeStyles, useTheme } from "@material-ui/core";
+import clsx from "clsx";
+import { DeleteIcon } from "@fluentui/react-icons";
+import { v4 } from "uuid";
+import { useDragLayer } from "react-dnd";
+import { Responsive } from "react-grid-layout";
+import { useMeasure } from "react-use";
+import "react-grid-layout/css/styles.css";
+import "react-resizable/css/styles.css";
+
+//#region src/dashboard/getWidgetLayout.ts
+const getW = (w) => {
+	if (typeof w === "object") return {
+		w: w.default,
+		minW: w.min,
+		maxW: w.max
+	};
+	if (typeof w === "number") return { w };
+	return { w: 2 };
+};
+const getH = (h) => {
+	if (typeof h === "object") return {
+		h: h.default,
+		minH: h.min,
+		maxH: h.max
+	};
+	if (typeof h === "number") return { h };
+	return { h: 2 };
+};
+/**
+* Get a default layout for widgets of a type
+*/
+function getWidgetLayout(getWidget, widgetType) {
+	const { w, h } = (getWidget && getWidget(widgetType)?.layout) ?? {};
+	const layout = {
+		...getW(w),
+		...getH(h)
+	};
+	const wResizable = "minW" in layout || "maxW" in layout;
+	const hResizable = "minH" in layout || "maxH" in layout;
+	layout.isResizable = wResizable || hResizable;
+	return layout;
+}
+
+//#endregion
+//#region src/dashboard/DashboardCardGrid.jsx
+const useStyle = makeStyles((theme) => ({ root: {
+	display: "flex",
+	flexDirection: "column",
+	width: "100%",
+	height: "100%",
+	marginBottom: (props) => props?.disableMargin ? "" : theme.spacing(3)
+} }), { name: "DashboardCardGrid" });
+const DASHBOARD_WIDGET = Symbol("DASHBOARD_WIDGET");
+const breakpoints = {
+	xs: 0,
+	xl: 1150
+};
+const breakpointCols = {
+	xs: 4,
+	xl: 4
+};
+/**
+* Grid layout for dashboard cards
+*/
+const DashboardCardGrid = (props) => {
+	const classes = useStyle(props);
+	const { children, onCreateCard, gridProperties, ...other } = props;
+	const { getWidget } = useShellStore();
+	const rglRef = useRef();
+	const [ref, { width }] = useMeasure();
+	const theme = useTheme();
+	const { droppingWidgetType } = useDragLayer((monitor) => {
+		if (monitor.getItemType() === DASHBOARD_WIDGET) {
+			const { id: wigetType } = monitor.getItem();
+			return { droppingWidgetType: wigetType };
+		}
+		return { droppingWidgetType: null };
+	});
+	const [droppingItemLayout, setDroppingItemLayout] = useState(null);
+	useEffect(() => {
+		let isMounted = true;
+		const resolveLayout = async (widgetDefPromise) => {
+			try {
+				const module = await widgetDefPromise;
+				const layout = getWidgetLayout(module?.default || module);
+				if (isMounted) setDroppingItemLayout({
+					i: v4(),
+					...layout
+				});
+			} catch (e) {
+				console.error(`Error resolving layout for widget type "${droppingWidgetType}"`, e);
+				const fallbackLayout = getWidgetLayout(null);
+				if (isMounted) setDroppingItemLayout({
+					i: v4(),
+					...fallbackLayout
+				});
+			}
+		};
+		if (droppingWidgetType) {
+			const res = getWidget(droppingWidgetType);
+			if (res?.then) {
+				setDroppingItemLayout(null);
+				resolveLayout(res);
+			} else {
+				const layout = getWidgetLayout(res);
+				setDroppingItemLayout({
+					i: v4(),
+					...layout
+				});
+			}
+		} else setDroppingItemLayout(null);
+		return () => {
+			isMounted = false;
+		};
+	}, [droppingWidgetType, getWidget]);
+	const drag = useCallback((layout, oldLayoutItem, layoutItem, placeholder) => {}, []);
+	const resize = useCallback((layout, oldLayoutItem, layoutItem, placeholder) => {
+		if (layoutItem.w >= 6 && layoutItem.w < 8) {
+			layoutItem.w = 4;
+			placeholder.w = 4;
+		}
+	}, []);
+	const drop = useCallback((layout, item) => {
+		if (droppingWidgetType) {
+			const { x, y, w, h } = item;
+			const { breakpoint } = rglRef.current.state;
+			if (onCreateCard) onCreateCard({
+				widgetType: droppingWidgetType,
+				id: v4(),
+				layout: { [breakpoint]: {
+					x,
+					y,
+					w,
+					h
+				} },
+				params: []
+			});
+		}
+	}, [droppingWidgetType, onCreateCard]);
+	return /* @__PURE__ */ React.createElement("div", {
+		ref,
+		className: classes.root
+	}, width ? /* @__PURE__ */ React.createElement(Responsive, {
+		ref: rglRef,
+		...other,
+		width,
+		breakpoints,
+		cols: breakpointCols,
+		rowHeight: 128,
+		margin: [theme.spacing(3), theme.spacing(3)],
+		containerPadding: [0, 0],
+		draggableHandle: "[data-handle]",
+		onDrag: drag,
+		onResize: resize,
+		onDrop: drop,
+		isDroppable: gridProperties?.isDroppable || false,
+		isDraggable: gridProperties?.isDraggable || false,
+		droppingItem: droppingItemLayout,
+		style: { height: "100%" }
+	}, children) : null);
+};
+var DashboardCardGrid_default = DashboardCardGrid;
+
+//#endregion
+//#region src/dashboard/WidgetCard.jsx
+/**
+* Core component for dashboard widget cards
+*/
+const WidgetCard = (props) => {
+	const { children, headerActions, className, widgetType, id, layout, params, setParam, onDelete, loading, errors, theme, hideWidgetName, innerPadding, contentHeight, contentMaxHeight, ...other } = props;
+	const classes = makeStyles((theme$1) => ({
+		root: { "&.react-resizable-hide .react-resizable-handle": { display: "none" } },
+		darkRoot: {
+			"&.react-resizable-hide .react-resizable-handle": { display: "none" },
+			background: "#424242",
+			color: "white"
+		},
+		anyRoot: { "& .MuiCardContent-root": {
+			justifyContent: "space-between",
+			overflow: "auto",
+			padding: 0
+		} },
+		handle: {
+			cursor: "move",
+			"&:hover": { backgroundColor: theme$1.palette.action.hover },
+			display: hideWidgetName && "none"
+		},
+		loadingContent: {
+			flex: 1,
+			display: "flex",
+			flexDirection: "column",
+			alignItems: "center",
+			justifyContent: "center"
+		},
+		innerWidgetContentContainer: {
+			height: widgetType === "TransformerLoadWidget" ? "auto" : contentHeight ? contentHeight : "100%",
+			maxHeight: contentMaxHeight ? contentMaxHeight : "",
+			minWidth: widgetType === "ProgressBarWidget" ? 0 : 270,
+			display: "flex",
+			flexDirection: "column",
+			justifyContent: "space-between",
+			padding: innerPadding || (widgetType === "VEERegisterRead" ? 0 : theme$1.spacing(2))
+		}
+	}))();
+	const raised = /(^|\s)react-draggable-dragging(\s|$)/.test(className ?? "");
+	let body = children;
+	if (loading && !body) body = /* @__PURE__ */ React.createElement("div", { className: classes.loadingContent }, /* @__PURE__ */ React.createElement(CircularProgress, { size: 64 }));
+	if (errors && !body) body = /* @__PURE__ */ React.createElement("div", null, "Unexpected error");
+	return /* @__PURE__ */ React.createElement(FUICard_default, {
+		...other,
+		className: clsx(className, theme === "dark" ? classes.darkRoot : classes.root, classes.anyRoot),
+		raised,
+		CardHeaderProps: {
+			className: classes.handle,
+			"data-handle": true
+		},
+		headerActions: /* @__PURE__ */ React.createElement(React.Fragment, null, headerActions, /* @__PURE__ */ React.createElement(FUICardHeaderMenu, null, /* @__PURE__ */ React.createElement(FUIMenuItem_default, {
+			onClick: onDelete,
+			fluentIcon: DeleteIcon,
+			primary: "Delete"
+		})))
+	}, /* @__PURE__ */ React.createElement("div", { className: classes.innerWidgetContentContainer }, body));
+};
+
+//#endregion
+//#region src/dashboard/DashboardWidget.jsx
+/**
+* Widget implementation for dashboards that correctly handles lazy-loading.
+*/
+const DashboardWidget = (props) => {
+	const { widgetType, id, deleteCard, children, params: paramValues, setParams, ...other } = props;
+	const { getWidget, isValidWidget } = useShellStore();
+	const onDelete = useCallback(() => {
+		deleteCard(id);
+	}, [deleteCard, id]);
+	const { Widget, params: paramDefs } = useMemo(() => {
+		if (!isValidWidget?.(widgetType)) return {};
+		const res = getWidget(widgetType);
+		if (!res) return {};
+		if (res.$$typeof === Symbol.for("react.lazy")) return {
+			Widget: res,
+			params: {}
+		};
+		if (res && typeof res === "object" && !isValidElement(res) && !res.then) return {
+			Widget: res.Widget || res.default || null,
+			params: res.params || {}
+		};
+		console.warn(`getWidget returned an unexpected type for "${widgetType}":`, res);
+		return {};
+	}, [
+		widgetType,
+		getWidget,
+		isValidWidget
+	]);
+	const params = useMemo(() => {
+		if (!paramDefs) return paramValues || {};
+		return {
+			...Object.fromEntries(Object.entries(paramDefs).map(([key, { defaultValue }]) => [key, defaultValue])),
+			...paramValues
+		};
+	}, [paramDefs, paramValues]);
+	const setParam = useCallback((name, value) => setParams(id, { [name]: value }), [id, setParams]);
+	if (!isValidWidget || !getWidget) return /* @__PURE__ */ React.createElement(WidgetCard, {
+		...other,
+		title: "Error"
+	}, "isValidWidget or getWidget functions are not defined");
+	if (!Widget) return /* @__PURE__ */ React.createElement(WidgetCard, {
+		...other,
+		title: "Error"
+	}, "Unknown widget type \"", widgetType, "\".");
+	const widgetElement = /* @__PURE__ */ React.createElement(Widget, {
+		...other,
+		id,
+		params,
+		setParam,
+		onDelete
+	}, children);
+	return /* @__PURE__ */ React.createElement(Suspense, { fallback: /* @__PURE__ */ React.createElement(PageLoading, null) }, widgetElement);
+};
+var DashboardWidget_default = memo(DashboardWidget);
+
+//#endregion
+export { getWidgetLayout as i, WidgetCard as n, DashboardCardGrid_default as r, DashboardWidget_default as t };
+//# sourceMappingURL=DashboardWidget-F4pnOQAe.js.map

package/dist/DashboardWidget-F4pnOQAe.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardWidget-F4pnOQAe.js","names":["layout: Omit<Layout, 'i' | 'x' | 'y'>","uuid","ResponsiveGridLayout","theme","FUICard","FUIMenuItem"],"sources":["../src/dashboard/getWidgetLayout.ts","../src/dashboard/DashboardCardGrid.jsx","../src/dashboard/WidgetCard.jsx","../src/dashboard/DashboardWidget.jsx"],"sourcesContent":["import { Layout } from 'react-grid-layout';\nimport { LayoutDimension } from './types';\n\nconst getW = (\n  w: LayoutDimension | undefined\n): Pick<Layout, 'w' | 'minW' | 'maxW'> => {\n  if (typeof w === 'object') {\n    return {\n      w: w.default,\n      minW: w.min,\n      maxW: w.max\n    };\n  }\n\n  if (typeof w === 'number') {\n    return { w };\n  }\n\n  return { w: 2 };\n};\n\nconst getH = (\n  h: LayoutDimension | undefined\n): Pick<Layout, 'h' | 'minH' | 'maxH'> => {\n  if (typeof h === 'object') {\n    return {\n      h: h.default,\n      minH: h.min,\n      maxH: h.max\n    };\n  }\n\n  if (typeof h === 'number') {\n    return { h };\n  }\n\n  return { h: 2 };\n};\n\n/**\n * Get a default layout for widgets of a type\n */\nexport default function getWidgetLayout(\n  getWidget: Function,\n  widgetType: string\n): Omit<Layout, 'i' | 'x' | 'y'> {\n  const { w, h } = (getWidget && getWidget(widgetType)?.layout) ?? {};\n\n  const layout: Omit<Layout, 'i' | 'x' | 'y'> = {\n    ...getW(w),\n    ...getH(h)\n  };\n\n  const wResizable = 'minW' in layout || 'maxW' in layout;\n  const hResizable = 'minH' in layout || 'maxH' in layout;\n  layout.isResizable = wResizable || hResizable;\n\n  return layout;\n}\n","import { v4 as uuid } from 'uuid';\nimport React, { useCallback, useMemo, useRef, useState, useEffect } from 'react';\nimport { Responsive as ResponsiveGridLayout } from 'react-grid-layout';\nimport { makeStyles, useTheme } from '@material-ui/core';\nimport { useMeasure } from 'react-use';\nimport 'react-grid-layout/css/styles.css';\nimport 'react-resizable/css/styles.css';\nimport { useDragLayer } from 'react-dnd';\nimport getWidgetLayout from './getWidgetLayout.ts';\nimport { useShellStore } from '../stores/shellStore';\n\nconst useStyle = makeStyles(\n  (theme) => ({\n    root: {\n      display: 'flex',\n      flexDirection: 'column',\n      width: '100%',\n      height: '100%',\n      marginBottom: (props) => (props?.disableMargin ? '' : theme.spacing(3))\n    }\n  }),\n  { name: 'DashboardCardGrid' }\n);\n\nconst DASHBOARD_WIDGET = Symbol('DASHBOARD_WIDGET');\n\nconst breakpoints = {\n  xs: 0,\n  xl: 1150\n};\n\nconst breakpointCols = {\n  xs: 4,\n  xl: 4\n};\n\n/**\n * Grid layout for dashboard cards\n */\nconst DashboardCardGrid = (props) => {\n  const classes = useStyle(props);\n  const { children, onCreateCard, gridProperties, ...other } = props;\n  const { getWidget } = useShellStore();\n  const rglRef = useRef();\n  const [ref, { width }] = useMeasure();\n  const theme = useTheme();\n  const { droppingWidgetType } = useDragLayer((monitor) => {\n    if (monitor.getItemType() === DASHBOARD_WIDGET) {\n      const { id: wigetType } = monitor.getItem();\n      return { droppingWidgetType: wigetType };\n    }\n\n    return { droppingWidgetType: null };\n  });\n\n  const [droppingItemLayout, setDroppingItemLayout] = useState(null);\n\n  useEffect(() => {\n    let isMounted = true;\n\n    // Asynchronously resolve the widget definition to get its layout properties\n    const resolveLayout = async (widgetDefPromise) => {\n      try {\n        const module = await widgetDefPromise;\n        // Handle ES modules with default exports\n        const widgetDef = module?.default || module;\n        // Use the external layout getter, assuming it can handle the resolved definition\n        const layout = getWidgetLayout(widgetDef);\n        if (isMounted) {\n          setDroppingItemLayout({ i: uuid(), ...layout });\n        }\n      } catch (e) {\n        console.error(`Error resolving layout for widget type \"${droppingWidgetType}\"`, e);\n        // Fallback to a default layout on error\n        const fallbackLayout = getWidgetLayout(null);\n        if (isMounted) {\n          setDroppingItemLayout({ i: uuid(), ...fallbackLayout });\n        }\n      }\n    };\n\n    if (droppingWidgetType) {\n      const res = getWidget(droppingWidgetType);\n      // Check if the result is a promise (for async widgets)\n      if (res?.then) {\n        setDroppingItemLayout(null); // Clear previous layout while loading\n        resolveLayout(res);\n      } else {\n        // Handle synchronously available widget definitions\n        const layout = getWidgetLayout(res);\n        setDroppingItemLayout({ i: uuid(), ...layout });\n      }\n    } else {\n      setDroppingItemLayout(null);\n    }\n\n    return () => {\n      isMounted = false;\n    };\n  }, [droppingWidgetType, getWidget]);\n\n  const drag = useCallback((layout, oldLayoutItem, layoutItem, placeholder) => {\n    // Cards larger than 1 should snap to columns that are a multiple of 2\n    // if (layoutItem.w > 1) {\n    //   // @fixme This affects the visual placeholder, but doesn't actually fix the layout item when its dropped\n    //   placeholder.x = layoutItem.x = Math.floor(layoutItem.x / 2) * 2;\n    // }\n  }, []);\n\n  const resize = useCallback(\n    (layout, oldLayoutItem, layoutItem, placeholder) => {\n      // Widths larger than 1 should be a multiple of 2\n      // The small size of columns is just so we can have small 1x1 tiles that are 1/2 the size of normal cards\n      // if (layoutItem.w > 1) {\n      //   const w = Math.floor(layoutItem.w / 2) * 3;\n      //   layoutItem.w = w;\n      //   placeholder.w = w;\n      // }\n\n      // There is no 3 (i.e. 6) column layout so don't allow cards to be that size either\n      if (layoutItem.w >= 6 && layoutItem.w < 8) {\n        layoutItem.w = 4;\n        placeholder.w = 4;\n      }\n    },\n    []\n  );\n\n  const drop = useCallback(\n    (layout, item) => {\n      if (droppingWidgetType) {\n        const { x, y, w, h } = item;\n        const { breakpoint } = rglRef.current.state;\n        if (onCreateCard)\n          onCreateCard({\n            widgetType: droppingWidgetType,\n            id: uuid(),\n            layout: {\n              [breakpoint]: {\n                x,\n                y,\n                w,\n                h\n              }\n            },\n            params: []\n          });\n      }\n    },\n    [droppingWidgetType, onCreateCard]\n  );\n\n  return (\n    <div ref={ref} className={classes.root}>\n      {width ? (\n        <ResponsiveGridLayout\n          ref={rglRef}\n          {...other}\n          width={width}\n          breakpoints={breakpoints}\n          cols={breakpointCols}\n          rowHeight={128}\n          margin={[theme.spacing(3), theme.spacing(3)]}\n          containerPadding={[0, 0]}\n          draggableHandle='[data-handle]'\n          onDrag={drag}\n          onResize={resize}\n          onDrop={drop}\n          isDroppable={gridProperties?.isDroppable || false}\n          isDraggable={gridProperties?.isDraggable || false}\n          droppingItem={droppingItemLayout}\n          style={{\n            height: '100%'\n          }}\n        >\n          {children}\n        </ResponsiveGridLayout>\n      ) : null}\n    </div>\n  );\n};\n\nexport default DashboardCardGrid;\n","import { DeleteIcon } from '@fluentui/react-icons';\nimport { makeStyles, CircularProgress, lighten } from '@material-ui/core';\nimport clsx from 'clsx';\nimport React from 'react';\nimport FUICard, { FUICardHeaderMenu } from '../UI/surfaces/cards/fluentCards/FUICard';\nimport FUIMenuItem from '../UI/widgets/FluentComponents/FUIMenuItem';\n\n/**\n * Core component for dashboard widget cards\n */\nexport const WidgetCard = (props) => {\n  const {\n    children,\n    headerActions,\n    className,\n    widgetType,\n    id,\n    layout,\n    params,\n    setParam,\n    onDelete,\n    loading,\n    errors,\n    theme,\n    hideWidgetName,\n    innerPadding,\n    contentHeight,\n    contentMaxHeight,\n    ...other\n  } = props;\n\n  const useStyles = makeStyles((theme) => ({\n    root: {\n      '&.react-resizable-hide .react-resizable-handle': {\n        display: 'none'\n      }\n    },\n    darkRoot: {\n      '&.react-resizable-hide .react-resizable-handle': {\n        display: 'none'\n      },\n      background: '#424242',\n      color: 'white'\n    },\n    anyRoot: {\n      '& .MuiCardContent-root': {\n        justifyContent: 'space-between',\n        overflow: 'auto',\n        padding: 0\n      }\n    },\n    handle: {\n      cursor: 'move',\n      '&:hover': {\n        backgroundColor: theme.palette.action.hover\n      },\n      display: hideWidgetName && 'none'\n    },\n    loadingContent: {\n      flex: 1,\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n      justifyContent: 'center'\n    },\n    innerWidgetContentContainer: {\n      height:\n        widgetType === 'TransformerLoadWidget'\n          ? 'auto'\n          : contentHeight\n          ? contentHeight\n          : '100%',\n      maxHeight: contentMaxHeight ? contentMaxHeight : '',\n      minWidth: widgetType === 'ProgressBarWidget' ? 0 : 270,\n      display: 'flex',\n      flexDirection: 'column',\n      justifyContent: 'space-between',\n      padding:\n        innerPadding ||\n        (widgetType === 'VEERegisterRead' ? 0 : theme.spacing(2))\n    }\n  }));\n  const classes = useStyles();\n  const raised = /(^|\\s)react-draggable-dragging(\\s|$)/.test(className ?? '');\n\n  let body = children;\n  if (loading && !body) {\n    body = (\n      <div className={classes.loadingContent}>\n        <CircularProgress size={64} />\n      </div>\n    );\n  }\n  if (errors && !body) {\n    body = <div>Unexpected error</div>;\n  }\n\n  return (\n    <FUICard\n      {...other}\n      className={clsx(\n        className,\n        theme === 'dark' ? classes.darkRoot : classes.root,\n        classes.anyRoot\n      )}\n      raised={raised}\n      CardHeaderProps={{\n        className: classes.handle,\n        'data-handle': true\n      }}\n      headerActions={\n        <>\n          {headerActions}\n          <FUICardHeaderMenu>\n            <FUIMenuItem\n              onClick={onDelete}\n              fluentIcon={DeleteIcon}\n              primary='Delete'\n            />\n          </FUICardHeaderMenu>\n        </>\n      }\n    >\n      <div className={classes.innerWidgetContentContainer}>{body}</div>\n    </FUICard>\n  );\n};\n","import React, { memo, useCallback, useMemo, Suspense, lazy, isValidElement } from 'react';\nimport { WidgetCard } from './WidgetCard';\nimport { useShellStore } from '../stores/shellStore';\nimport { PageLoading } from '../UI/feedback/PageLoading';\n\n/**\n * Widget implementation for dashboards that correctly handles lazy-loading.\n */\nconst DashboardWidget = (props) => {\n  const {\n    widgetType,\n    id,\n    deleteCard,\n    children,\n    params: paramValues,\n    setParams,\n    ...other\n  } = props;\n  const { getWidget, isValidWidget } = useShellStore();\n\n  const onDelete = useCallback(() => {\n    deleteCard(id);\n  }, [deleteCard, id]);\n\n  const { Widget, params: paramDefs } = useMemo(() => {\n    if (!isValidWidget?.(widgetType)) {\n      return {};\n    }\n    const res = getWidget(widgetType);\n\n    // If getWidget returns null or undefined, widget not found\n    if (!res) {\n      return {};\n    }\n\n    // If it's already a React.lazy component (LazyExoticComponent), use it directly\n    // React.lazy components have a $$typeof property set to Symbol.for('react.lazy')\n    if (res.$$typeof === Symbol.for('react.lazy')) {\n      return { Widget: res, params: {} };\n    }\n\n    // Handle descriptor object format (widget with params)\n    if (res && typeof res === 'object' && !isValidElement(res) && !res.then) {\n      const widgetComp = res.Widget || res.default || null;\n      return { Widget: widgetComp, params: res.params || {} };\n    }\n\n    // If we receive anything else, it's an unsupported format.\n    console.warn(`getWidget returned an unexpected type for \"${widgetType}\":`, res);\n    return {};\n  }, [widgetType, getWidget, isValidWidget]);\n\n  const params = useMemo(() => {\n    if (!paramDefs) return paramValues || {};\n\n    const defaultParams = Object.fromEntries(\n      Object.entries(paramDefs).map(([key, { defaultValue }]) => [key, defaultValue])\n    );\n    return { ...defaultParams, ...paramValues };\n  }, [paramDefs, paramValues]);\n\n  const setParam = useCallback(\n    (name, value) => setParams(id, { [name]: value }),\n    [id, setParams]\n  );\n\n  if (!isValidWidget || !getWidget) {\n    return (\n      <WidgetCard {...other} title=\"Error\">\n        isValidWidget or getWidget functions are not defined\n      </WidgetCard>\n    );\n  }\n\n  if (!Widget) {\n    return (\n      <WidgetCard {...other} title=\"Error\">\n        Unknown widget type \"{widgetType}\".\n      </WidgetCard>\n    );\n  }\n\n  const widgetElement = (\n    <Widget\n      {...other}\n      id={id}\n      params={params}\n      setParam={setParam}\n      onDelete={onDelete}\n    >\n      {children}\n    </Widget>\n  );\n\n  return <Suspense fallback={<PageLoading />}>{widgetElement}</Suspense>;\n};\n\nexport default memo(DashboardWidget);\n\n"],"mappings":"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"}