udp-react-enterprise-component-library 25.16.1 → 25.16.2-beta.10

package/dist/AddressListItem-Bd9OFX1z.js

@@ -0,0 +1,19 @@
+import React from "react";
+import { Divider, Typography, makeStyles } from "@material-ui/core";
+
+//#region src/UI/dataDisplay/address/AddressListItem.jsx
+const useStyles = makeStyles((theme) => ({ divider: {
+	marginTop: theme.spacing(1),
+	marginBottom: theme.spacing(1)
+} }));
+const AddressListItem = ({ children }) => {
+	const classes = useStyles();
+	return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement(Typography, {
+		variant: "body2",
+		className: classes.divider
+	}, children), /* @__PURE__ */ React.createElement(Divider, null));
+};
+
+//#endregion
+export { AddressListItem as t };
+//# sourceMappingURL=AddressListItem-Bd9OFX1z.js.map

package/dist/AddressListItem-Bd9OFX1z.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddressListItem-Bd9OFX1z.js","names":[],"sources":["../src/UI/dataDisplay/address/AddressListItem.jsx"],"sourcesContent":["import React from 'react'\nimport { makeStyles, Divider, Typography } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n  divider: {\n    marginTop: theme.spacing(1),\n    marginBottom: theme.spacing(1)\n  }\n}))\n\nexport const AddressListItem = ({ children }) => {\n  const classes = useStyles()\n\n  return (\n    <div className={classes.root}>\n      <Typography variant='body2' className={classes.divider}>\n        {children}\n      </Typography>\n      <Divider />\n    </div>\n  )\n}\n"],"mappings":";;;;AAGA,MAAM,YAAY,YAAY,WAAW,EACvC,SAAS;CACP,WAAW,MAAM,QAAQ,EAAE;CAC3B,cAAc,MAAM,QAAQ,EAAE;CAC/B,EACF,EAAE;AAEH,MAAa,mBAAmB,EAAE,eAAe;CAC/C,MAAM,UAAU,WAAW;AAE3B,QACE,oCAAC,SAAI,WAAW,QAAQ,QACtB,oCAAC;EAAW,SAAQ;EAAQ,WAAW,QAAQ;IAC5C,SACU,EACb,oCAAC,cAAU,CACP"}

package/dist/Adornment-Ciq1X7he.js

@@ -0,0 +1,19 @@
+import React from "react";
+import { makeStyles } from "@material-ui/core";
+import PropTypes from "prop-types";
+
+//#region src/UI/components/feedback/Adornment.jsx
+const useStyles = makeStyles((theme) => ({ root: (props) => ({
+	width: theme.spacing(.5),
+	height: "100%",
+	background: theme.palette[props.color].main
+}) }));
+const Adornment = (props) => {
+	const classes = useStyles(props);
+	return /* @__PURE__ */ React.createElement("div", { className: classes.root });
+};
+Adornment.propTypes = { color: PropTypes.string };
+
+//#endregion
+export { Adornment as t };
+//# sourceMappingURL=Adornment-Ciq1X7he.js.map

package/dist/Adornment-Ciq1X7he.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Adornment-Ciq1X7he.js","names":[],"sources":["../src/UI/components/feedback/Adornment.jsx"],"sourcesContent":["import React from 'react';\nimport { makeStyles } from '@material-ui/core';\nimport PropTypes from 'prop-types';\n\n\nconst useStyles = makeStyles((theme) => ({\n  root: props => ({\n    width: theme.spacing(0.5),\n    height: \"100%\",\n    background: theme.palette[props.color].main\n  })\n}));\n\nexport const Adornment = (props) => {\n  const classes = useStyles(props);\n\n  return <div className={classes.root} />;\n};\n\nAdornment.propTypes = {\n  color: PropTypes.string\n}\n"],"mappings":";;;;;AAKA,MAAM,YAAY,YAAY,WAAW,EACvC,OAAM,WAAU;CACd,OAAO,MAAM,QAAQ,GAAI;CACzB,QAAQ;CACR,YAAY,MAAM,QAAQ,MAAM,OAAO;CACxC,GACF,EAAE;AAEH,MAAa,aAAa,UAAU;CAClC,MAAM,UAAU,UAAU,MAAM;AAEhC,QAAO,oCAAC,SAAI,WAAW,QAAQ,OAAQ;;AAGzC,UAAU,YAAY,EACpB,OAAO,UAAU,QAClB"}

package/dist/AgTable-B2xTzAm2.js

@@ -0,0 +1,184 @@
+import { t as useId } from "./useId-I-OmRBmB.js";
+import React, { Children, useCallback, useMemo, useReducer } from "react";
+import { Box, Button, ButtonGroup, ClickAwayListener, Grid, Grow, MenuItem, MenuList, Paper, Popper, makeStyles } from "@material-ui/core";
+import clsx from "clsx";
+import invariant from "invariant";
+import { AllModules } from "@ag-grid-enterprise/all-modules";
+import "@ag-grid-enterprise/all-modules/dist/styles/ag-grid.css";
+import "@ag-grid-enterprise/all-modules/dist/styles/ag-theme-material.css";
+import "./utilities/aggrid/ag-grid-styles.scss";
+import { AgGridReact } from "@ag-grid-community/react";
+import { ExcelExportModule } from "@ag-grid-enterprise/excel-export";
+import { bindPopper, bindTrigger, usePopupState } from "material-ui-popup-state/hooks";
+import { ArrowDropDown } from "@material-ui/icons";
+import { LicenseManager } from "@ag-grid-enterprise/core";
+
+//#region src/AGLicense.js
+const LicenseKey = "Using_this_{AG_Grid}_Enterprise_key_{AG-080613}_in_excess_of_the_licence_granted_is_not_permitted___Please_report_misuse_to_legal@ag-grid.com___For_help_with_changing_this_key_please_contact_info@ag-grid.com___{Univerus_Software_Inc}_is_granted_a_{Single_Application}_Developer_License_for_the_application_{MAIS_eRec}_only_for_{1}_Front-End_JavaScript_developer___All_Front-End_JavaScript_developers_working_on_{MAIS_eRec}_need_to_be_licensed___{MAIS_eRec}_has_not_been_granted_a_Deployment_License_Add-on___This_key_works_with_{AG_Grid}_Enterprise_versions_released_before_{28_June_2026}____[v3]_[01]_MTc4MjYwMTIwMDAwMA==5c7d1487ecb13b28e75415d34b7cf694";
+
+//#endregion
+//#region src/utilities/aggrid/SplitButton.jsx
+const useStyles$1 = makeStyles((theme) => ({
+	arrowButtonRoot: { padding: 0 },
+	menu: { zIndex: theme.zIndex.tooltip },
+	paper: {}
+}), { name: "SplitButton" });
+/**
+* https://material-ui.com/components/button-group/#split-button
+*/
+const SplitButton = (props) => {
+	const classes = useStyles$1(props);
+	const { popupName, color, size, variant, label, "aria-label": ariaLabel, children } = props;
+	const popupState = usePopupState({
+		variant: "popper",
+		popupId: useId(popupName)
+	});
+	const firstItem = Children.toArray(children)[0];
+	const setAnchorEl = useCallback((ref) => {
+		if (ref) popupState.setAnchorEl(ref);
+	}, []);
+	return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ButtonGroup, {
+		variant,
+		color,
+		size,
+		ref: setAnchorEl,
+		"aria-label": ariaLabel
+	}, /* @__PURE__ */ React.createElement(Button, { onClick: firstItem?.props?.onClick }, label || firstItem?.props?.children), /* @__PURE__ */ React.createElement(Button, {
+		...bindTrigger(popupState),
+		className: classes.arrowButtonRoot,
+		color,
+		size: "small",
+		"aria-expanded": popupState.isOpen ? true : void 0
+	}, /* @__PURE__ */ React.createElement(ArrowDropDown, null))), /* @__PURE__ */ React.createElement(Popper, {
+		...bindPopper(popupState),
+		role: void 0,
+		transition: true,
+		disablePortal: true,
+		className: classes.menu
+	}, ({ TransitionProps, placement }) => /* @__PURE__ */ React.createElement(Grow, {
+		...TransitionProps,
+		style: { transformOrigin: placement === "bottom" ? "center top" : "center bottom" }
+	}, /* @__PURE__ */ React.createElement(Paper, { className: classes.paper }, /* @__PURE__ */ React.createElement(ClickAwayListener, { onClickAway: popupState.close }, /* @__PURE__ */ React.createElement(MenuList, null, children))))));
+};
+
+//#endregion
+//#region src/utilities/aggrid/AgTable.tsx
+LicenseManager.setLicenseKey(LicenseKey);
+const useStyles = makeStyles((theme) => ({
+	root: {
+		flex: 1,
+		height: (props) => props?.height ? props.height : "calc(100vh - 280px)"
+	},
+	AgGrid: (props) => ({
+		"--ag-control-panel-background-color": theme.palette.primary.light,
+		"--ag-checkbox-checked-color": theme.palette.primary.main,
+		...props.hideHeader ? {} : {
+			"--ag-header-background-color": theme.palette.primary.main,
+			"--ag-header-foreground-color": theme.palette.primary.light
+		}
+	})
+}), { name: "AgTable" });
+const globalModules = [...AllModules, ExcelExportModule];
+/**
+* Utility hook for getting the ag-grid APIs into state
+*/
+function useAgGridApi() {
+	const [{ gridApi, gridColumnApi }, onGridReady] = useReducer((state, params) => {
+		return {
+			gridApi: params.api,
+			gridColumnApi: params.columnApi
+		};
+	}, {});
+	return {
+		gridApi,
+		gridColumnApi,
+		onGridReady
+	};
+}
+/**
+* Size/Export buttons for AgGrid tables
+*/
+const AgTableButtons = (props) => {
+	const { gridApi, gridColumnApi } = props;
+	const exportToCSV = useCallback(() => {
+		invariant(gridApi, `gridApi not ready`);
+		gridApi?.exportDataAsCsv({
+			allColumns: true,
+			fileName: "export"
+		});
+	}, [gridApi]);
+	const exportToExcel = useCallback(() => {
+		invariant(gridApi, `gridApi not ready`);
+		gridApi?.exportDataAsExcel({
+			allColumns: true,
+			fileName: "export"
+		});
+	}, [gridApi]);
+	const sizeToFit = useCallback((params) => {
+		invariant(gridApi, `gridApi not ready`);
+		gridApi?.sizeColumnsToFit();
+	}, [gridApi]);
+	const autoSizeAll = useCallback((skipHeader) => {
+		invariant(gridColumnApi, `gridColumnApi not ready`);
+		const allColumnIds = [];
+		gridColumnApi?.getAllColumns()?.forEach((column) => {
+			allColumnIds.push(column.getColId());
+		});
+		gridColumnApi?.autoSizeColumns(allColumnIds, skipHeader);
+	}, [gridColumnApi]);
+	const autoSizeAllWithHeader = useCallback(() => autoSizeAll(false), [autoSizeAll]);
+	const autoSizeAllWithoutHeader = useCallback(() => autoSizeAll(false), [autoSizeAll]);
+	return /* @__PURE__ */ React.createElement(Box, { mb: 1 }, /* @__PURE__ */ React.createElement(Grid, {
+		container: true,
+		direction: "row",
+		spacing: 1,
+		justify: "flex-end"
+	}, /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Button, {
+		variant: "outlined",
+		size: "small",
+		onClick: sizeToFit
+	}, "Size to Fit")), /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(SplitButton, {
+		popupName: "auto-size",
+		variant: "outlined",
+		size: "small",
+		label: "Auto-Size"
+	}, /* @__PURE__ */ React.createElement(MenuItem, { onClick: autoSizeAllWithHeader }, "All"), /* @__PURE__ */ React.createElement(MenuItem, { onClick: autoSizeAllWithoutHeader }, "Skip Header"))), /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(SplitButton, {
+		popupName: "export",
+		variant: "outlined",
+		size: "small",
+		label: "Export"
+	}, /* @__PURE__ */ React.createElement(MenuItem, { onClick: exportToExcel }, "Excel"), /* @__PURE__ */ React.createElement(MenuItem, { onClick: exportToCSV }, "CSV")))));
+};
+/**
+* AgGrid with tweaks
+*/
+const AgTable = (props) => {
+	const classes = useStyles(props);
+	const { modules: modulesProp, className, getRowHeight, rowModelType, isUsingAgRowHeight = false, hideHeader = false } = props;
+	const modules = useMemo(() => modulesProp ? globalModules.concat(modulesProp) : globalModules, [modulesProp]);
+	const calculateRowHeight = (params) => {
+		if (params.node.level === 0) return 48;
+		if (params.node.level === 1) return 32;
+		return 16;
+	};
+	const rowHeightFunction = useCallback((params) => {
+		if (rowModelType === "serverSide") if (isUsingAgRowHeight) return;
+		else if (getRowHeight) return getRowHeight(params);
+		else return calculateRowHeight(params);
+		else if (getRowHeight) return getRowHeight(params);
+	}, [getRowHeight, isUsingAgRowHeight]);
+	const onGridSizeChanged = () => {
+		if (props.dynamicSizing) props.api?.sizeColumnsToFit();
+	};
+	return /* @__PURE__ */ React.createElement("div", { className: clsx("ag-theme-material", classes.root, className) }, /* @__PURE__ */ React.createElement(AgGridReact, {
+		...props,
+		modules,
+		onGridSizeChanged,
+		getRowHeight: rowHeightFunction,
+		className: classes.AgGrid
+	}));
+};
+
+//#endregion
+export { LicenseKey as a, SplitButton as i, AgTableButtons as n, useAgGridApi as r, AgTable as t };
+//# sourceMappingURL=AgTable-B2xTzAm2.js.map

package/dist/AgTable-B2xTzAm2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AgTable-B2xTzAm2.js","names":["useStyles","ArrowDropDownIcon","globalModules: Module[]","AgTableButtons: FC<AgTableButttonsProps>","allColumnIds: string[]","AgTable: FC<AgTableProps>","calculateRowHeight: (\n    params: RowHeightParams\n  ) => number | null | undefined"],"sources":["../src/AGLicense.js","../src/utilities/aggrid/SplitButton.jsx","../src/utilities/aggrid/AgTable.tsx"],"sourcesContent":["export const LicenseKey =\n  'Using_this_{AG_Grid}_Enterprise_key_{AG-080613}_in_excess_of_the_licence_granted_is_not_permitted___Please_report_misuse_to_legal@ag-grid.com___For_help_with_changing_this_key_please_contact_info@ag-grid.com___{Univerus_Software_Inc}_is_granted_a_{Single_Application}_Developer_License_for_the_application_{MAIS_eRec}_only_for_{1}_Front-End_JavaScript_developer___All_Front-End_JavaScript_developers_working_on_{MAIS_eRec}_need_to_be_licensed___{MAIS_eRec}_has_not_been_granted_a_Deployment_License_Add-on___This_key_works_with_{AG_Grid}_Enterprise_versions_released_before_{28_June_2026}____[v3]_[01]_MTc4MjYwMTIwMDAwMA==5c7d1487ecb13b28e75415d34b7cf694';\n","import React, { Children, useCallback } from 'react';\nimport {\n  usePopupState,\n  bindTrigger,\n  bindPopper,\n} from 'material-ui-popup-state/hooks';\nimport useId from '../../UI/widgets/utils/useId';\nimport {\n  Button,\n  ButtonGroup,\n  Popper,\n  Grow,\n  Paper,\n  ClickAwayListener,\n  MenuList,\n  makeStyles,\n} from '@material-ui/core';\nimport { ArrowDropDown as ArrowDropDownIcon } from '@material-ui/icons';\n\nconst useStyles = makeStyles(\n  theme => ({\n    arrowButtonRoot: {\n      padding: 0,\n    },\n    menu: {\n      zIndex: theme.zIndex.tooltip,\n    },\n    paper: {},\n  }),\n  { name: 'SplitButton' }\n);\n\n/**\n * https://material-ui.com/components/button-group/#split-button\n */\nexport const SplitButton = props => {\n  const classes = useStyles(props);\n  const {\n    popupName,\n    color,\n    size,\n    variant,\n    label,\n    'aria-label': ariaLabel,\n    children,\n  } = props;\n  const popupId = useId(popupName);\n  const popupState = usePopupState({ variant: 'popper', popupId });\n\n  const firstItem = Children.toArray(children)[0];\n\n  const setAnchorEl = useCallback(ref => {\n    if (ref) popupState.setAnchorEl(ref);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <React.Fragment>\n      <ButtonGroup\n        variant={variant}\n        color={color}\n        size={size}\n        ref={setAnchorEl}\n        aria-label={ariaLabel}\n      >\n        <Button onClick={firstItem?.props?.onClick}>\n          {label || firstItem?.props?.children}\n        </Button>\n        <Button\n          {...bindTrigger(popupState)}\n          className={classes.arrowButtonRoot}\n          color={color}\n          size=\"small\"\n          aria-expanded={popupState.isOpen ? true : undefined}\n        // @fixme Allow labels for this button\n        >\n          <ArrowDropDownIcon />\n        </Button>\n      </ButtonGroup>\n      <Popper\n        {...bindPopper(popupState)}\n        role={undefined}\n        transition\n        disablePortal\n        className={classes.menu}\n      >\n        {({ TransitionProps, placement }) => (\n          <Grow\n            {...TransitionProps}\n            style={{\n              transformOrigin:\n                placement === 'bottom' ? 'center top' : 'center bottom',\n            }}\n          >\n            <Paper className={classes.paper}>\n              <ClickAwayListener onClickAway={popupState.close}>\n                <MenuList /*id={popupState.popupId}*/>{children}</MenuList>\n              </ClickAwayListener>\n            </Paper>\n          </Grow>\n        )}\n      </Popper>\n    </React.Fragment>\n  );\n};\n","import { AllModules, RowHeightParams } from '@ag-grid-enterprise/all-modules';\nimport {\n  AgGridEvent,\n  ColumnApi,\n  GridApi,\n  Module\n} from '@ag-grid-enterprise/all-modules/dist/cjs/main';\nimport '@ag-grid-enterprise/all-modules/dist/styles/ag-grid.css';\nimport '@ag-grid-enterprise/all-modules/dist/styles/ag-theme-material.css';\nimport './ag-grid-styles.scss';\nimport { AgGridReact, AgGridReactProps } from '@ag-grid-community/react';\nimport { ExcelExportModule } from '@ag-grid-enterprise/excel-export';\nimport {\n  Box,\n  Button,\n  Grid,\n  makeStyles,\n  MenuItem,\n  useTheme\n} from '@material-ui/core';\nimport clsx from 'clsx';\nimport invariant from 'invariant';\nimport React, {\n  Dispatch,\n  FC,\n  Reducer,\n  useCallback,\n  useMemo,\n  useReducer\n} from 'react';\nimport { SplitButton } from './SplitButton';\nimport { LicenseManager } from '@ag-grid-enterprise/core';\nimport { LicenseKey } from '../../AGLicense';\n\nLicenseManager.setLicenseKey(LicenseKey);\n\nconst useStyles = makeStyles(\n  (theme) => ({\n    root: {\n      flex: 1,\n      height: (props: any) =>\n        props?.height ? props.height : 'calc(100vh - 280px)'\n    },\n    AgGrid: (props: any) => ({\n      '--ag-control-panel-background-color': theme.palette.primary.light,\n      '--ag-checkbox-checked-color': theme.palette.primary.main,\n      ...(props.hideHeader ? {} : {\n        '--ag-header-background-color': theme.palette.primary.main,\n        '--ag-header-foreground-color': theme.palette.primary.light,\n      }),\n    })\n  }),\n  { name: 'AgTable' }\n);\n\nconst globalModules: Module[] = [...AllModules, ExcelExportModule];\n\ninterface AgGridApi {\n  gridApi?: GridApi;\n  gridColumnApi?: ColumnApi;\n}\n\ninterface UseAgGridApi extends AgGridApi {\n  onGridReady: Dispatch<AgGridEvent>;\n}\n\n/**\n * Utility hook for getting the ag-grid APIs into state\n */\nexport function useAgGridApi(): UseAgGridApi {\n  const [{ gridApi, gridColumnApi }, onGridReady] = useReducer<\n    Reducer<AgGridApi, AgGridEvent>\n  >((state, params) => {\n    return { gridApi: params.api, gridColumnApi: params.columnApi };\n  }, {});\n\n  return { gridApi, gridColumnApi, onGridReady };\n}\n\nexport interface AgTableButttonsProps {\n  gridApi?: GridApi;\n  gridColumnApi?: ColumnApi;\n}\n\n/**\n * Size/Export buttons for AgGrid tables\n */\nexport const AgTableButtons: FC<AgTableButttonsProps> = (props) => {\n  const { gridApi, gridColumnApi } = props;\n\n  const exportToCSV = useCallback(() => {\n    invariant(gridApi, `gridApi not ready`);\n    gridApi?.exportDataAsCsv({\n      allColumns: true,\n      fileName: 'export'\n    });\n  }, [gridApi]);\n  const exportToExcel = useCallback(() => {\n    invariant(gridApi, `gridApi not ready`);\n    gridApi?.exportDataAsExcel({\n      allColumns: true,\n      fileName: 'export'\n    });\n  }, [gridApi]);\n\n  const sizeToFit = useCallback(\n    (params: any) => {\n      invariant(gridApi, `gridApi not ready`);\n      gridApi?.sizeColumnsToFit();\n    },\n    [gridApi]\n  );\n\n  const autoSizeAll = useCallback(\n    (skipHeader: any) => {\n      invariant(gridColumnApi, `gridColumnApi not ready`);\n      const allColumnIds: string[] = [];\n      gridColumnApi\n        ?.getAllColumns()\n        ?.forEach((column: { getColId: () => string }) => {\n          allColumnIds.push(column.getColId());\n        });\n      gridColumnApi?.autoSizeColumns(allColumnIds, skipHeader);\n    },\n    [gridColumnApi]\n  );\n  const autoSizeAllWithHeader = useCallback(\n    () => autoSizeAll(false),\n    [autoSizeAll]\n  );\n  const autoSizeAllWithoutHeader = useCallback(\n    () => autoSizeAll(false),\n    [autoSizeAll]\n  );\n\n  return (\n    // @ts-ignore\n    <Box mb={1}>\n      <Grid container direction='row' spacing={1} justify='flex-end'>\n        <Grid item>\n          <Button variant='outlined' size='small' onClick={sizeToFit}>\n            Size to Fit\n          </Button>\n        </Grid>\n        <Grid item>\n          <SplitButton\n            popupName='auto-size'\n            variant='outlined'\n            size='small'\n            label='Auto-Size'\n          >\n            <MenuItem onClick={autoSizeAllWithHeader}>All</MenuItem>\n            <MenuItem onClick={autoSizeAllWithoutHeader}>Skip Header</MenuItem>\n          </SplitButton>\n        </Grid>\n        <Grid item>\n          <SplitButton\n            popupName='export'\n            variant='outlined'\n            size='small'\n            label='Export'\n          >\n            <MenuItem onClick={exportToExcel}>Excel</MenuItem>\n            <MenuItem onClick={exportToCSV}>CSV</MenuItem>\n          </SplitButton>\n        </Grid>\n      </Grid>\n    </Box>\n  );\n};\n\ninterface AgTableProps extends AgGridReactProps {\n  dynamicSizing?: boolean;\n  className?: string;\n  isUsingAgRowHeight?: boolean;\n  hideHeader?: boolean; // Add the hideHeader prop\n}\n\n/**\n * AgGrid with tweaks\n */\nexport const AgTable: FC<AgTableProps> = (props) => {\n  const classes = useStyles(props);\n  const {\n    modules: modulesProp,\n    className,\n    getRowHeight,\n    rowModelType,\n    isUsingAgRowHeight = false,\n    hideHeader = false // Add the hideHeader prop to the destructuring\n  } = props;\n  const modules = useMemo<Module[]>(\n    () => (modulesProp ? globalModules.concat(modulesProp) : globalModules),\n    [modulesProp]\n  );\n\n  const calculateRowHeight: (\n    params: RowHeightParams\n  ) => number | null | undefined = (params) => {\n    if (params.node.level === 0) {\n      return 48;\n    }\n    if (params.node.level === 1) {\n      return 32;\n    }\n    return 16;\n  };\n\n  const rowHeightFunction = useCallback(\n    (params) => {\n      if (rowModelType === 'serverSide') {\n        if (isUsingAgRowHeight) {\n          return undefined;\n        } else {\n          if (getRowHeight) {\n            return getRowHeight(params);\n          } else {\n            return calculateRowHeight(params);\n          }\n        }\n      } else {\n        if (getRowHeight) {\n          return getRowHeight(params);\n        }\n      }\n      return undefined;\n    },\n    [getRowHeight, isUsingAgRowHeight]\n  );\n\n  const onGridSizeChanged = () => {\n    if (props.dynamicSizing) {\n      props.api?.sizeColumnsToFit();\n    }\n  };\n\n  return (\n    <div className={clsx('ag-theme-material', classes.root, className)}>\n      <AgGridReact\n        {...props}\n        modules={modules}\n        onGridSizeChanged={onGridSizeChanged}\n        getRowHeight={rowHeightFunction}\n        className={classes.AgGrid}\n      />\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/AggregateChip-BF6RL_4_.js

@@ -0,0 +1,242 @@
+import { t as ConfigService } from "./configService-C4uoG3wj.js";
+import { k as SeverityTypeEnums } from "./unitySystemEnums-DQSkCr3D.js";
+import { t as useAxiosGet } from "./useAxiosGet-BMoXHfLN.js";
+import { t as StatusChip } from "./StatusChip-DZAN88VU.js";
+import { n as executeQueryInstance } from "./methodUtils-DEk9B4A8.js";
+import { t as getThresholdStatus } from "./aggregateUtils-BTBSWD8I.js";
+import React, { memo, useEffect, useMemo, useState } from "react";
+import { ButtonBase, CircularProgress, Typography, makeStyles } from "@material-ui/core";
+import PropTypes from "prop-types";
+import { Alert } from "@material-ui/lab";
+
+//#region src/UI/dataDisplay/entityHeader/ui/AlertPill.jsx
+/**
+* Styles for the AlertPill component
+*/
+const useStyles = makeStyles((theme) => {
+	const endRadius = theme.spacing(3);
+	return {
+		root: {
+			display: "flex",
+			flexDirection: "row",
+			overflow: "hidden",
+			flexGrow: 0,
+			alignSelf: "start"
+		},
+		alertRoot: {
+			padding: theme.spacing(0, 1.5, 0, 1),
+			borderRadius: 0,
+			"&:first-of-type": {
+				borderTopLeftRadius: endRadius,
+				borderBottomLeftRadius: endRadius
+			},
+			"&:last-of-type": {
+				borderTopRightRadius: endRadius,
+				borderBottomRightRadius: endRadius
+			}
+		},
+		alertIcon: { marginRight: theme.spacing(.5) },
+		buttonBase: {
+			borderRadius: endRadius,
+			overflow: "hidden"
+		},
+		defaultSeverityAlert: { backgroundColor: theme.palette.grey[400] }
+	};
+});
+/**
+* Memoized version of the Alert component
+*
+* @param {object} props - Component props
+* @param {number} props.count - The count to display in the Alert
+* @param {boolean} props.hide - Whether the Alert should be hidden
+* @param {string} props.severity - The severity of the Alert
+* @param {object} props.alertProps - Additional props to pass to the Alert component
+* @param {number} props.maxCount - Max count to show before displaying as "{maxCount}+"
+* @returns {JSX.Element | null} - The Alert component, or null if the count is falsy or hide is true
+*/
+const MemoizedAlert = memo((props) => {
+	const { count, hide, severity, alertProps, maxCount, label } = props;
+	const classes = useStyles(props);
+	if (count && !hide) {
+		let displayCount = count;
+		if (maxCount && count > maxCount) displayCount = `${maxCount}+`;
+		if (severity === SeverityTypeEnums.Default) return /* @__PURE__ */ React.createElement(Alert, {
+			severity: SeverityTypeEnums.Info,
+			...alertProps,
+			className: classes.defaultSeverityAlert
+		}, displayCount);
+		return /* @__PURE__ */ React.createElement(Alert, {
+			severity,
+			...alertProps
+		}, label ? label : displayCount);
+	}
+	return null;
+});
+MemoizedAlert.displayName = "MemoizedAlert";
+/**
+* The AlertPill component displays a row of Alerts, each with a count and a severity level.
+* Alerts can be hidden by setting the corresponding hide prop to true.
+*
+* @param {object} props - Component props
+* @param {function} [props.handleClick] - The click event handler.
+* @param {number} props.maxCount - Max count to show before displaying as "{maxCount}+"
+* @param {number} props.errorCount - The count for the error Alert
+* @param {number} props.warningCount - The count for the warning Alert
+* @param {number} props.successCount - The count for the success Alert
+* @param {number} props.infoCount - The count for the info Alert
+* @param {number} props.defaultCount - The count for the default Alert
+* @param {string} props.errorLabel - The label for the error Alert
+* @param {string} props.warningLabel - The label for the warning Alert
+* @param {string} props.successLabel - The label for the success Alert
+* @param {string} props.infoLabel - The label for the info Alert
+* @param {string} props.defaultLabel - The label for the default Alert
+* @param {boolean} props.hideError - Whether the error Alert should be hidden
+* @param {boolean} props.hideWarning - Whether the warning Alert should be hidden
+* @param {boolean} props.hideSuccess - Whether the success Alert should be hidden
+* @param {boolean} props.hideInfo - Whether the info Alert should be hidden
+* @param {boolean} props.hideDefault - Whether the default Alert should be hidden
+* @param {string} props.variant - The variant of the Alert
+* @param {function} [props.handleClick] - The click event handler.
+* @param {number} props.maxCount - Max count to show before displaying as "{maxCount}+"
+* @returns {JSX.Element} - The AlertPill component
+*/
+const AlertPill = (props) => {
+	const { variant = "filled", handleClick, maxCount, errorCount, warningCount, successCount, infoCount, defaultCount, errorLabel, warningLabel, successLabel, infoLabel, defaultLabel, hideError = false, hideWarning = false, hideSuccess = false, hideInfo = false, hideDefault = false } = props;
+	const classes = useStyles(props);
+	const alertProps = {
+		variant: {
+			filled: "filled",
+			standard: "hint",
+			outlined: "outlined",
+			text: ""
+		}[variant],
+		classes: {
+			root: classes.alertRoot,
+			icon: classes.alertIcon
+		}
+	};
+	return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement(ButtonBase, {
+		onClick: handleClick,
+		className: classes.buttonBase
+	}, /* @__PURE__ */ React.createElement(MemoizedAlert, {
+		count: errorCount,
+		hide: hideError,
+		severity: SeverityTypeEnums.Error,
+		alertProps,
+		maxCount,
+		label: errorLabel
+	}), /* @__PURE__ */ React.createElement(MemoizedAlert, {
+		count: warningCount,
+		hide: hideWarning,
+		severity: SeverityTypeEnums.Warning,
+		alertProps,
+		maxCount,
+		label: warningLabel
+	}), /* @__PURE__ */ React.createElement(MemoizedAlert, {
+		count: successCount,
+		hide: hideSuccess,
+		severity: SeverityTypeEnums.Success,
+		alertProps,
+		maxCount,
+		label: successLabel
+	}), /* @__PURE__ */ React.createElement(MemoizedAlert, {
+		count: infoCount,
+		hide: hideInfo,
+		severity: SeverityTypeEnums.Info,
+		alertProps,
+		maxCount,
+		label: infoLabel
+	}), /* @__PURE__ */ React.createElement(MemoizedAlert, {
+		count: defaultCount,
+		hide: hideDefault,
+		severity: SeverityTypeEnums.Default,
+		alertProps,
+		maxCount,
+		label: defaultLabel
+	})));
+};
+
+//#endregion
+//#region src/UI/utilityDisplay/AggregateChip.jsx
+const AggregateChip = (props) => {
+	const { aggregateThresholdId, aggregateThresholdParamMappings, label, chipColor, setStatus, isActionable = false, isAlert = false, hideAlert = false, onAlertClick } = props;
+	const [color, setColor] = useState(chipColor);
+	const [aggregateValue, setAggregateValue] = useState(null);
+	const [loading, setLoading] = useState(false);
+	const [{ data: aggregateThreshold, loading: loadingAggregateThreshold }] = useAxiosGet(ConfigService.integrationV2ApiUrl, `aggregateThreshold/${aggregateThresholdId}`, {}, !!!aggregateThresholdId);
+	const alertDisplayLabel = useMemo(() => {
+		if (!label) return aggregateValue;
+		return `${label.replace("{value}", aggregateValue)}`;
+	}, [aggregateValue, label]);
+	useEffect(() => {
+		const setAggregateData = async (apiMethodInstanceId, valueKey) => {
+			setLoading(true);
+			const response = await executeQueryInstance(aggregateThresholdParamMappings ? { data: aggregateThresholdParamMappings } : { data: {} }, apiMethodInstanceId).catch((res) => setLoading(false));
+			if (response?.status === 200 && valueKey) {
+				const aggregateResult = response.data?.aggregateResults && response.data?.aggregateResults[0];
+				if (aggregateResult) setAggregateValue(aggregateResult[valueKey] ? Math.round(aggregateResult[valueKey]) : "");
+			}
+			setLoading(false);
+		};
+		if (aggregateThreshold) setAggregateData(aggregateThreshold.apiMethodInstanceId, aggregateThreshold.aggregateKey);
+	}, [aggregateThreshold]);
+	useEffect(() => {
+		if (aggregateThreshold && aggregateValue) {
+			const status = getThresholdStatus(aggregateThreshold, aggregateValue);
+			setColor(status);
+			if (setStatus) setStatus(status || "default");
+		}
+	}, [
+		aggregateThreshold,
+		aggregateValue,
+		setStatus
+	]);
+	if (loading || loadingAggregateThreshold) return /* @__PURE__ */ React.createElement(CircularProgress, { size: 18 });
+	if (!color && !isAlert) return /* @__PURE__ */ React.createElement(Typography, {
+		variant: "caption2",
+		style: { fontSize: "0.7rem" }
+	}, label || aggregateValue);
+	if (isAlert) return /* @__PURE__ */ React.createElement(AlertPill, {
+		handleClick: onAlertClick,
+		successCount: color === SeverityTypeEnums.Success ? aggregateValue : "",
+		errorCount: color === SeverityTypeEnums.Error ? aggregateValue : "",
+		warningCount: color === SeverityTypeEnums.Warning ? aggregateValue : "",
+		infoCount: color === SeverityTypeEnums.Info ? aggregateValue : "",
+		defaultCount: !color && (aggregateValue || ""),
+		successLabel: color === SeverityTypeEnums.Success ? alertDisplayLabel : "",
+		errorLabel: color === SeverityTypeEnums.Error ? alertDisplayLabel : "",
+		warningLabel: color === SeverityTypeEnums.Warning ? alertDisplayLabel : "",
+		infoLabel: color === SeverityTypeEnums.Info ? alertDisplayLabel : "",
+		defaultLabel: !color && (alertDisplayLabel || ""),
+		hideSuccess: color === SeverityTypeEnums.Success ? hideAlert : false,
+		hideError: color === SeverityTypeEnums.Error ? hideAlert : false,
+		hideWarning: color === SeverityTypeEnums.Warning ? hideAlert : false,
+		hideInfo: color === SeverityTypeEnums.Info ? hideAlert : false,
+		hideDefault: !color ? hideAlert : false
+	});
+	return label || aggregateValue ? /* @__PURE__ */ React.createElement(StatusChip, {
+		label: label || aggregateValue,
+		status: color,
+		useSmallChip: true,
+		isActionable
+	}) : null;
+};
+AggregateChip.propTypes = {
+	chipColor: PropTypes.oneOf([
+		"success",
+		"error",
+		"warning",
+		"info",
+		void 0,
+		null
+	]),
+	aggregateThresholdId: PropTypes.oneOf([
+		PropTypes.string,
+		void 0,
+		null
+	])
+};
+
+//#endregion
+export { AlertPill as n, AggregateChip as t };
+//# sourceMappingURL=AggregateChip-BF6RL_4_.js.map

package/dist/AggregateChip-BF6RL_4_.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AggregateChip-BF6RL_4_.js","names":[],"sources":["../src/UI/dataDisplay/entityHeader/ui/AlertPill.jsx","../src/UI/utilityDisplay/AggregateChip.jsx"],"sourcesContent":["import React, { memo } from 'react';\nimport { ButtonBase, makeStyles } from '@material-ui/core';\nimport { Alert } from '@material-ui/lab';\nimport { SeverityTypeEnums } from '../../../../enums/unitySystemEnums';\n\n/**\n * Styles for the AlertPill component\n */\n\nconst useStyles = makeStyles((theme) => {\n  const endRadius = theme.spacing(3);\n  return {\n    root: {\n      display: 'flex',\n      flexDirection: 'row',\n      // borderRadius: endRadius,\n      overflow: 'hidden',\n      flexGrow: 0,\n      alignSelf: 'start'\n    },\n    alertRoot: {\n      // mui alert class\n      padding: theme.spacing(0, 1.5, 0, 1),\n      borderRadius: 0,\n      '&:first-of-type': {\n        borderTopLeftRadius: endRadius,\n        borderBottomLeftRadius: endRadius\n      },\n      '&:last-of-type': {\n        borderTopRightRadius: endRadius,\n        borderBottomRightRadius: endRadius\n      }\n    },\n    alertIcon: {\n      // mui alert icon class\n      marginRight: theme.spacing(0.5)\n    },\n    buttonBase: {\n      borderRadius: endRadius,\n      overflow: 'hidden'\n    },\n    defaultSeverityAlert: {\n      backgroundColor: theme.palette.grey[400]\n    }\n  };\n});\n\n/**\n * Memoized version of the Alert component\n *\n * @param {object} props - Component props\n * @param {number} props.count - The count to display in the Alert\n * @param {boolean} props.hide - Whether the Alert should be hidden\n * @param {string} props.severity - The severity of the Alert\n * @param {object} props.alertProps - Additional props to pass to the Alert component\n * @param {number} props.maxCount - Max count to show before displaying as \"{maxCount}+\"\n * @returns {JSX.Element | null} - The Alert component, or null if the count is falsy or hide is true\n */\nconst MemoizedAlert = memo((props) => {\n  const { count, hide, severity, alertProps, maxCount, label } = props;\n  const classes = useStyles(props);\n\n  if (count && !hide) {\n    let displayCount = count;\n    if (maxCount && count > maxCount) {\n      displayCount = `${maxCount}+`;\n    }\n\n    if (severity === SeverityTypeEnums.Default) {\n      return (\n        <Alert\n          severity={SeverityTypeEnums.Info}\n          {...alertProps}\n          className={classes.defaultSeverityAlert}\n        >\n          {displayCount}\n        </Alert>\n      );\n    }\n\n    return (\n      <Alert severity={severity} {...alertProps}>\n        {label ? label : displayCount}\n      </Alert>\n    );\n  }\n\n  return null;\n});\n\nMemoizedAlert.displayName = 'MemoizedAlert';\n\n/**\n * The AlertPill component displays a row of Alerts, each with a count and a severity level.\n * Alerts can be hidden by setting the corresponding hide prop to true.\n *\n * @param {object} props - Component props\n * @param {function} [props.handleClick] - The click event handler.\n * @param {number} props.maxCount - Max count to show before displaying as \"{maxCount}+\"\n * @param {number} props.errorCount - The count for the error Alert\n * @param {number} props.warningCount - The count for the warning Alert\n * @param {number} props.successCount - The count for the success Alert\n * @param {number} props.infoCount - The count for the info Alert\n * @param {number} props.defaultCount - The count for the default Alert\n * @param {string} props.errorLabel - The label for the error Alert\n * @param {string} props.warningLabel - The label for the warning Alert\n * @param {string} props.successLabel - The label for the success Alert\n * @param {string} props.infoLabel - The label for the info Alert\n * @param {string} props.defaultLabel - The label for the default Alert\n * @param {boolean} props.hideError - Whether the error Alert should be hidden\n * @param {boolean} props.hideWarning - Whether the warning Alert should be hidden\n * @param {boolean} props.hideSuccess - Whether the success Alert should be hidden\n * @param {boolean} props.hideInfo - Whether the info Alert should be hidden\n * @param {boolean} props.hideDefault - Whether the default Alert should be hidden\n * @param {string} props.variant - The variant of the Alert\n * @param {function} [props.handleClick] - The click event handler.\n * @param {number} props.maxCount - Max count to show before displaying as \"{maxCount}+\"\n * @returns {JSX.Element} - The AlertPill component\n */\nexport const AlertPill = (props) => {\n  const {\n    variant = 'filled',\n    handleClick,\n    maxCount,\n    errorCount,\n    warningCount,\n    successCount,\n    infoCount,\n    defaultCount,\n    errorLabel,\n    warningLabel,\n    successLabel,\n    infoLabel,\n    defaultLabel,\n    hideError = false,\n    hideWarning = false,\n    hideSuccess = false,\n    hideInfo = false,\n    hideDefault = false\n  } = props;\n  const classes = useStyles(props);\n\n  const variantMapping = {\n    filled: 'filled',\n    standard: 'hint',\n    outlined: 'outlined',\n    text: ''\n  };\n\n  const alertProps = {\n    variant: variantMapping[variant],\n    classes: {\n      root: classes.alertRoot,\n      icon: classes.alertIcon\n    }\n  };\n\n  return (\n    <div className={classes.root}>\n      <ButtonBase onClick={handleClick} className={classes.buttonBase}>\n        <MemoizedAlert\n          count={errorCount}\n          hide={hideError}\n          severity={SeverityTypeEnums.Error}\n          alertProps={alertProps}\n          maxCount={maxCount}\n          label={errorLabel}\n        />\n        <MemoizedAlert\n          count={warningCount}\n          hide={hideWarning}\n          severity={SeverityTypeEnums.Warning}\n          alertProps={alertProps}\n          maxCount={maxCount}\n          label={warningLabel}\n        />\n        <MemoizedAlert\n          count={successCount}\n          hide={hideSuccess}\n          severity={SeverityTypeEnums.Success}\n          alertProps={alertProps}\n          maxCount={maxCount}\n          label={successLabel}\n        />\n        <MemoizedAlert\n          count={infoCount}\n          hide={hideInfo}\n          severity={SeverityTypeEnums.Info}\n          alertProps={alertProps}\n          maxCount={maxCount}\n          label={infoLabel}\n        />\n        <MemoizedAlert\n          count={defaultCount}\n          hide={hideDefault}\n          severity={SeverityTypeEnums.Default}\n          alertProps={alertProps}\n          maxCount={maxCount}\n          label={defaultLabel}\n        />\n      </ButtonBase>\n    </div>\n  );\n};\n","import React, { useEffect, useMemo, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { StatusChip } from '../dataDisplay/status/StatusChip';\nimport { useAxiosGet } from '../../utilities/useAxiosGet';\nimport { Typography, CircularProgress } from '@material-ui/core';\nimport { executeQueryInstance } from '../../udp/utilities/methodUtils';\nimport { getThresholdStatus } from './utilities/aggregateUtils';\nimport { AlertPill } from '../dataDisplay/entityHeader/ui/AlertPill';\nimport { SeverityTypeEnums } from '../../enums/unitySystemEnums';\nimport { ConfigService } from '../../configService';\n\nexport const AggregateChip = (props) => {\n  const {\n    aggregateThresholdId,\n    aggregateThresholdParamMappings,\n    label,\n    chipColor,\n    setStatus,\n    isActionable = false,\n    isAlert = false,\n    hideAlert = false,\n    onAlertClick\n  } = props;\n  const [color, setColor] = useState(chipColor);\n  const [aggregateValue, setAggregateValue] = useState(null);\n  const [loading, setLoading] = useState(false);\n  const [{ data: aggregateThreshold, loading: loadingAggregateThreshold }] =\n    useAxiosGet(\n      ConfigService.integrationV2ApiUrl,\n      `aggregateThreshold/${aggregateThresholdId}`,\n      {},\n      !!!aggregateThresholdId\n    );\n\n  const alertDisplayLabel = useMemo(() => {\n    if (!label) {\n      return aggregateValue;\n    }\n    return `${label.replace('{value}', aggregateValue)}`;\n  }, [aggregateValue, label]);\n\n  useEffect(() => {\n    const setAggregateData = async (apiMethodInstanceId, valueKey) => {\n      setLoading(true);\n      const data = aggregateThresholdParamMappings\n        ? { data: aggregateThresholdParamMappings }\n        : { data: {} };\n      const response = await executeQueryInstance(\n        data,\n        apiMethodInstanceId\n      ).catch((res) => setLoading(false));\n      if (response?.status === 200 && valueKey) {\n        const aggregateResult =\n          response.data?.aggregateResults && response.data?.aggregateResults[0];\n        if (aggregateResult) {\n          setAggregateValue(\n            aggregateResult[valueKey]\n              ? Math.round(aggregateResult[valueKey])\n              : ''\n          );\n        }\n      }\n      setLoading(false);\n    };\n    if (aggregateThreshold) {\n      setAggregateData(\n        aggregateThreshold.apiMethodInstanceId,\n        aggregateThreshold.aggregateKey\n      );\n    }\n    // when aggregateThresholdParamMappings changes we don't want to re-render chip\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [aggregateThreshold]);\n\n  useEffect(() => {\n    if (aggregateThreshold && aggregateValue) {\n      const status = getThresholdStatus(aggregateThreshold, aggregateValue);\n      setColor(status);\n      if (setStatus) {\n        setStatus(status || 'default');\n      }\n    }\n  }, [aggregateThreshold, aggregateValue, setStatus]);\n\n  if (loading || loadingAggregateThreshold) {\n    return <CircularProgress size={18} />;\n  }\n\n  if (!color && !isAlert) {\n    return (\n      <Typography variant='caption2' style={{ fontSize: '0.7rem' }}>\n        {label || aggregateValue}\n      </Typography>\n    );\n  }\n\n  if (isAlert) {\n    return (\n      <AlertPill\n        handleClick={onAlertClick}\n        successCount={color === SeverityTypeEnums.Success ? aggregateValue : ''}\n        errorCount={color === SeverityTypeEnums.Error ? aggregateValue : ''}\n        warningCount={color === SeverityTypeEnums.Warning ? aggregateValue : ''}\n        infoCount={color === SeverityTypeEnums.Info ? aggregateValue : ''}\n        defaultCount={!color && (aggregateValue || '')}\n        successLabel={\n          color === SeverityTypeEnums.Success ? alertDisplayLabel : ''\n        }\n        errorLabel={color === SeverityTypeEnums.Error ? alertDisplayLabel : ''}\n        warningLabel={\n          color === SeverityTypeEnums.Warning ? alertDisplayLabel : ''\n        }\n        infoLabel={color === SeverityTypeEnums.Info ? alertDisplayLabel : ''}\n        defaultLabel={!color && (alertDisplayLabel || '')}\n        hideSuccess={color === SeverityTypeEnums.Success ? hideAlert : false}\n        hideError={color === SeverityTypeEnums.Error ? hideAlert : false}\n        hideWarning={color === SeverityTypeEnums.Warning ? hideAlert : false}\n        hideInfo={color === SeverityTypeEnums.Info ? hideAlert : false}\n        hideDefault={!color ? hideAlert : false}\n      />\n    );\n  }\n\n  return label || aggregateValue ? (\n    <StatusChip\n      label={label || aggregateValue}\n      status={color}\n      useSmallChip={true}\n      isActionable={isActionable}\n    />\n  ) : null;\n};\n\nAggregateChip.propTypes = {\n  /**\n   * Color of chip\n   */\n  chipColor: PropTypes.oneOf([\n    'success',\n    'error',\n    'warning',\n    'info',\n    undefined,\n    null\n  ]),\n  /**\n   * Id of AggregateThreshold\n   */\n  aggregateThresholdId: PropTypes.oneOf([PropTypes.string, undefined, null])\n};\n"],"mappings":"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"}

package/dist/AlertContainer-BwUF4KSm.js

@@ -0,0 +1,45 @@
+import { i as mapRule, t as evaluateRule } from "./RuleUtilities-D5ACzikQ.js";
+import React, { useEffect, useState } from "react";
+import { Chip, makeStyles, useTheme } from "@material-ui/core";
+
+//#region src/UI/AlertContainer.jsx
+const useStyles = makeStyles((theme) => ({
+	root: {
+		display: "grid",
+		gridTemplateColumns: "auto auto"
+	},
+	alertContainer: { margin: "0.3em" },
+	chipStyle: {
+		maxWidth: "150px",
+		textOverflow: "ellipsis"
+	}
+}));
+const AlertContainer = (props) => {
+	const { data } = props;
+	const theme = useTheme();
+	const [alertData, setAlertData] = useState([]);
+	const classes = useStyles(props);
+	useEffect(() => {
+		if (data?.properties?.alerts) {
+			let tempData = [];
+			data.properties.alerts.forEach((alert) => {
+				if (evaluateRule(mapRule(alert.propertyMapping, alert.jsonLogic), data.nodeObj, data.properties?.joiningEntityCatalogObjectKey, data.wasLazyLoaded)) tempData.push(alert);
+			});
+			setAlertData(tempData);
+		}
+	}, [data]);
+	if (alertData.length > 0) return /* @__PURE__ */ React.createElement("div", { className: classes.root }, alertData.filter((item, i) => i % 2 === 0).map((alert) => /* @__PURE__ */ React.createElement("div", { className: classes.alertContainer }, /* @__PURE__ */ React.createElement(Chip, {
+		label: alert.label,
+		style: { backgroundColor: alert ? alert.alertColor.hex : theme.palette.secondary.main },
+		className: classes.chipStyle
+	}))), alertData.filter((item, i) => i % 2 !== 0 && i !== 0).map((alert) => /* @__PURE__ */ React.createElement("div", { className: classes.alertContainer }, /* @__PURE__ */ React.createElement(Chip, {
+		label: alert.label,
+		style: { backgroundColor: alert ? alert.alertColor.hex : theme.palette.secondary.main },
+		className: classes.chipStyle
+	}))));
+	else return null;
+};
+
+//#endregion
+export { AlertContainer as t };
+//# sourceMappingURL=AlertContainer-BwUF4KSm.js.map

package/dist/AlertContainer-BwUF4KSm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlertContainer-BwUF4KSm.js","names":[],"sources":["../src/UI/AlertContainer.jsx"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { evaluateRule, mapRule } from '../utilities/rules/RuleUtilities';\nimport { Chip, useTheme, makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    display: 'grid',\n    gridTemplateColumns: 'auto auto'\n  },\n  alertContainer: {\n    margin: '0.3em'\n  },\n  chipStyle: {\n    maxWidth: '150px',\n    textOverflow: 'ellipsis'\n  }\n}));\n\nexport const AlertContainer = (props) => {\n  const { data } = props;\n\n  const theme = useTheme();\n  const [alertData, setAlertData] = useState([]);\n  const classes = useStyles(props);\n\n  useEffect(() => {\n    if (data?.properties?.alerts) {\n      let tempData = [];\n      data.properties.alerts.forEach((alert) => {\n        let res = mapRule(alert.propertyMapping, alert.jsonLogic);\n        if (\n          evaluateRule(\n            res,\n            data.nodeObj,\n            data.properties?.joiningEntityCatalogObjectKey,\n            data.wasLazyLoaded\n          )\n        ) {\n          tempData.push(alert);\n        }\n      });\n      setAlertData(tempData);\n    }\n  }, [data]);\n\n  if (alertData.length > 0) {\n    return (\n      <div className={classes.root}>\n        {alertData\n          .filter((item, i) => i % 2 === 0)\n          .map((alert) => (\n            <div className={classes.alertContainer}>\n              <Chip\n                label={alert.label}\n                style={{\n                  backgroundColor: alert\n                    ? alert.alertColor.hex\n                    : theme.palette.secondary.main\n                }}\n                className={classes.chipStyle}\n              />\n            </div>\n          ))}\n\n        {alertData\n          .filter((item, i) => i % 2 !== 0 && i !== 0)\n          .map((alert) => (\n            <div className={classes.alertContainer}>\n              <Chip\n                label={alert.label}\n                style={{\n                  backgroundColor: alert\n                    ? alert.alertColor.hex\n                    : theme.palette.secondary.main\n                }}\n                className={classes.chipStyle}\n              />\n            </div>\n          ))}\n      </div>\n    );\n  } else {\n    return null;\n  }\n};\n"],"mappings":";;;;;AAIA,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM;EACJ,SAAS;EACT,qBAAqB;EACtB;CACD,gBAAgB,EACd,QAAQ,SACT;CACD,WAAW;EACT,UAAU;EACV,cAAc;EACf;CACF,EAAE;AAEH,MAAa,kBAAkB,UAAU;CACvC,MAAM,EAAE,SAAS;CAEjB,MAAM,QAAQ,UAAU;CACxB,MAAM,CAAC,WAAW,gBAAgB,SAAS,EAAE,CAAC;CAC9C,MAAM,UAAU,UAAU,MAAM;AAEhC,iBAAgB;AACd,MAAI,MAAM,YAAY,QAAQ;GAC5B,IAAI,WAAW,EAAE;AACjB,QAAK,WAAW,OAAO,SAAS,UAAU;AAExC,QACE,aAFQ,QAAQ,MAAM,iBAAiB,MAAM,UAAU,EAIrD,KAAK,SACL,KAAK,YAAY,+BACjB,KAAK,cACN,CAED,UAAS,KAAK,MAAM;KAEtB;AACF,gBAAa,SAAS;;IAEvB,CAAC,KAAK,CAAC;AAEV,KAAI,UAAU,SAAS,EACrB,QACE,oCAAC,SAAI,WAAW,QAAQ,QACrB,UACE,QAAQ,MAAM,MAAM,IAAI,MAAM,EAAE,CAChC,KAAK,UACJ,oCAAC,SAAI,WAAW,QAAQ,kBACtB,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,EACL,iBAAiB,QACb,MAAM,WAAW,MACjB,MAAM,QAAQ,UAAU,MAC7B;EACD,WAAW,QAAQ;GACnB,CACE,CACN,EAEH,UACE,QAAQ,MAAM,MAAM,IAAI,MAAM,KAAK,MAAM,EAAE,CAC3C,KAAK,UACJ,oCAAC,SAAI,WAAW,QAAQ,kBACtB,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,EACL,iBAAiB,QACb,MAAM,WAAW,MACjB,MAAM,QAAQ,UAAU,MAC7B;EACD,WAAW,QAAQ;GACnB,CACE,CACN,CACA;KAGR,QAAO"}