udp-react-enterprise-component-library 25.16.0 → 25.16.2-beta.1

package/dist/PasswordResetRedirect-MMUb4reI.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordResetRedirect-MMUb4reI.js","names":["errorDescription"],"sources":["../src/routes/components/PasswordResetRedirect.jsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { clearStoredPath } from '../../utilities/redirect/LocalRedirectUrlStorage';\n\nexport const PasswordResetRedirect = (props) => {\n  const [errorDescription, setErrorDescription] = useState(null);\n\n  useEffect(() => {\n    // Get the hash portion of the URL\n    const hash = window.location.hash || ''; // Fallback to empty string if no hash\n\n    if (props?.error?.errorMessage) {\n      formatError(props?.error?.errorMessage);\n    } else if (hash) {\n      // Parse the hash to get query parameters\n      const params = new URLSearchParams(hash.substring(1)); // Remove \"#\" and parse\n\n      // Get and decode the error_description\n      const errorDescription = params.get('error_description');\n\n      if (errorDescription) {\n        formatError(errorDescription);\n        // Decode the URL-encoded string\n      }\n    }\n  }, [props?.error?.errorMessage]);\n\n  const formatError = (errorDescription) => {\n    const decodedDescription = decodeURIComponent(errorDescription).replace(\n      /%0d%0a/g,\n      '\\n'\n    ); // Replace %0d%0a with newlines for clarity\n\n    if (decodedDescription.includes('AADB2C90208')) {\n      // Hardcoded message for AADB2C90208 (a specific error code, often related to user not found or invalid credentials)\n      setErrorDescription('The password reset link has expired.');\n      // Check for \"AADB2C\" or \"AADB2C90208\" in the decoded description\n    } else if (decodedDescription.includes('AADB2C')) {\n      // Hardcoded message for generic AADB2C errors\n      setErrorDescription('Unable to find an account associated to that email.');\n    } else {\n      // Fallback message if neither error is found (optional)\n      setErrorDescription('An unexpected error occurred.');\n    }\n  };\n\n  const handleGoHome = () => {\n    clearStoredPath();\n    window.location.href = '/';\n  };\n\n  return (\n    <div>\n      <div style={{ textAlign: 'center', marginTop: '50px' }}>\n        <img\n          src='https://customb2cpolicydevtest.blob.core.windows.net/root/unitylogo.svg'\n          alt='Unity Logo'\n          width='300'\n          style={{ height: 'auto', marginBottom: 50 }}\n        />\n        {errorDescription ? (\n          <h2>{errorDescription}</h2>\n        ) : (\n          <h2>\n            Your password has been successfully reset\n          </h2>\n        )}\n        {errorDescription !== 'The password reset link has expired.' && (\n        <p>Please click below to return to the sign in page</p>)}\n\n        {errorDescription !== 'The password reset link has expired.' && (\n          <button\n            onClick={handleGoHome}\n            style={{\n              marginTop: '10px',\n              backgroundColor: '#0C2F50',\n              color: 'white',\n              border: 'none',\n              padding: '10px 20px',\n              cursor: 'pointer',\n              borderRadius: '5px',\n              fontSize: '16px'\n            }}\n          >\n            Sign In\n          </button>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default PasswordResetRedirect;\n"],"mappings":";;;;AAGA,MAAa,yBAAyB,UAAU;CAC9C,MAAM,CAAC,kBAAkB,uBAAuB,SAAS,KAAK;AAE9D,iBAAgB;EAEd,MAAM,OAAO,OAAO,SAAS,QAAQ;AAErC,MAAI,OAAO,OAAO,aAChB,aAAY,OAAO,OAAO,aAAa;WAC9B,MAAM;GAKf,MAAMA,qBAHS,IAAI,gBAAgB,KAAK,UAAU,EAAE,CAAC,CAGrB,IAAI,oBAAoB;AAExD,OAAIA,mBACF,aAAYA,mBAAiB;;IAIhC,CAAC,OAAO,OAAO,aAAa,CAAC;CAEhC,MAAM,eAAe,uBAAqB;EACxC,MAAM,qBAAqB,mBAAmBA,mBAAiB,CAAC,QAC9D,WACA,KACD;AAED,MAAI,mBAAmB,SAAS,cAAc,CAE5C,qBAAoB,uCAAuC;WAElD,mBAAmB,SAAS,SAAS,CAE9C,qBAAoB,sDAAsD;MAG1E,qBAAoB,gCAAgC;;CAIxD,MAAM,qBAAqB;AACzB,mBAAiB;AACjB,SAAO,SAAS,OAAO;;AAGzB,QACE,oCAAC,aACC,oCAAC,SAAI,OAAO;EAAE,WAAW;EAAU,WAAW;EAAQ,IACpD,oCAAC;EACC,KAAI;EACJ,KAAI;EACJ,OAAM;EACN,OAAO;GAAE,QAAQ;GAAQ,cAAc;GAAI;GAC3C,EACD,mBACC,oCAAC,YAAI,iBAAsB,GAE3B,oCAAC,YAAG,4CAEC,EAEN,qBAAqB,0CACtB,oCAAC,WAAE,mDAAoD,EAEtD,qBAAqB,0CACpB,oCAAC;EACC,SAAS;EACT,OAAO;GACL,WAAW;GACX,iBAAiB;GACjB,OAAO;GACP,QAAQ;GACR,SAAS;GACT,QAAQ;GACR,cAAc;GACd,UAAU;GACX;IACF,UAEQ,CAEP,CACF;;AAIV,oCAAe"}

package/dist/PowerBIReport-CYX6YxbE.js

@@ -0,0 +1,60 @@
+import { useAxiosGet } from "./useAxiosGet-CAH3ZOZ8.js";
+import { useSetLocationState } from "./useSetLocationState-BGgFvNVh.js";
+import { LoadingOverlay_default } from "./LoadingOverlay-DBYfWYwS.js";
+import { useIsUnityAuthenticated } from "./useIsUnityAuthenticated-n3QuDnIj.js";
+import React, { useEffect, useMemo } from "react";
+import { ConfigService } from "udp-react-stencil-component-library";
+import { useHistory } from "react-router-dom";
+import { useTranslation } from "react-i18next";
+import Alert from "@material-ui/lab/Alert";
+import { Report } from "powerbi-report-component";
+
+//#region src/reports/PowerBIReport.jsx
+const PowerBIReport = (props) => {
+	const userIsAuthenticated = useIsUnityAuthenticated();
+	const { id, reportParameters } = props;
+	const i18n = useTranslation().t;
+	const history = useHistory();
+	const setLocationState = useSetLocationState();
+	const reportStyle = { height: "calc(100vh - 51px)" };
+	const [{ data: reportData, loading, error }] = useAxiosGet(ConfigService.productV1ApiUrl, `UdpPBIReport/Access/${id}`, {}, !!!userIsAuthenticated || !!!id);
+	const urlWithParameters = useMemo(() => {
+		if (reportData?.embedUrl) if (reportParameters) {
+			let paramsString = "";
+			Object.keys(reportParameters).forEach((key) => {
+				const paramString = `&rp:${key}=${reportParameters[key]}`;
+				paramsString += paramString;
+			});
+			return reportData.embedUrl + paramsString;
+		} else return reportData.embedUrl;
+		else return "";
+	}, [reportData?.embedUrl, reportParameters]);
+	useEffect(() => {
+		if (!history?.location?.state) setLocationState({ label: i18n("Report") });
+	}, [
+		setLocationState,
+		i18n,
+		history
+	]);
+	if (loading) return /* @__PURE__ */ React.createElement(LoadingOverlay_default, null);
+	if (error) return /* @__PURE__ */ React.createElement(Alert, {
+		severity: "error",
+		onClose: () => {}
+	}, i18n("shared.messages.error"));
+	if (!userIsAuthenticated) return null;
+	if (!reportData || !reportData.embedToken || !urlWithParameters || !reportData.reportId) return /* @__PURE__ */ React.createElement("div", null);
+	return /* @__PURE__ */ React.createElement(Report, {
+		key: reportData.reportId,
+		embedType: "report",
+		tokenType: "Embed",
+		accessToken: reportData.embedToken,
+		embedUrl: urlWithParameters,
+		embedId: reportData.reportId,
+		permissions: "All",
+		style: reportStyle
+	});
+};
+
+//#endregion
+export { PowerBIReport };
+//# sourceMappingURL=PowerBIReport-CYX6YxbE.js.map

package/dist/PowerBIReport-CYX6YxbE.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PowerBIReport-CYX6YxbE.js","names":["LoadingOverlay"],"sources":["../src/reports/PowerBIReport.jsx"],"sourcesContent":["import React, { useEffect, useMemo } from 'react';\nimport Alert from '@material-ui/lab/Alert';\nimport { Report } from 'powerbi-report-component';\nimport { useTranslation } from 'react-i18next';\nimport { useIsUnityAuthenticated } from '../utilities/auth/useIsUnityAuthenticated';\nimport { useAxiosGet } from '../utilities/useAxiosGet';\nimport LoadingOverlay from '../UI/loading/LoadingOverlay';\nimport { useHistory } from 'react-router-dom';\nimport { useSetLocationState } from '../hooks/useSetLocationState';\nimport { ConfigService } from 'udp-react-stencil-component-library';\n\nexport const PowerBIReport = (props) => {\n  const userIsAuthenticated = useIsUnityAuthenticated();\n  const { id, reportParameters } = props;\n  const i18n = useTranslation().t;\n  const history = useHistory();\n  const setLocationState = useSetLocationState();\n\n  const reportStyle = {\n    height: 'calc(100vh - 51px)'\n  };\n\n  const [{ data: reportData, loading, error }] = useAxiosGet(\n    ConfigService.productV1ApiUrl,\n    `UdpPBIReport/Access/${id}`,\n    {},\n    !!!userIsAuthenticated || !!!id\n  );\n\n  const urlWithParameters = useMemo(() => {\n    if (reportData?.embedUrl) {\n      if (reportParameters) {\n        let paramsString = '';\n        Object.keys(reportParameters).forEach((key) => {\n          const paramString = `&rp:${key}=${reportParameters[key]}`;\n          paramsString += paramString;\n        });\n        return reportData.embedUrl + paramsString;\n      } else {\n        return reportData.embedUrl;\n      }\n    } else return '';\n  }, [reportData?.embedUrl, reportParameters]);\n\n  // Setting location state label so that if this page was saved to favorites\n  // we can determine the bread crumb\n  useEffect(() => {\n    if (!history?.location?.state) {\n      setLocationState({ label: i18n('Report') });\n    }\n  }, [setLocationState, i18n, history]);\n\n  if (loading) return <LoadingOverlay />;\n\n  if (error) {\n    return (\n      <Alert severity='error' onClose={() => {}}>\n        {i18n('shared.messages.error')}\n      </Alert>\n    );\n  }\n\n  if (!userIsAuthenticated) return null;\n\n  if (\n    !reportData ||\n    !reportData.embedToken ||\n    !urlWithParameters ||\n    !reportData.reportId\n  ) {\n    //If no report is found, should we display something?\n    //Right now it will display a blank screen\n    return <div />;\n  }\n\n  return (\n    <Report\n      key={reportData.reportId}\n      embedType='report'\n      tokenType='Embed'\n      accessToken={reportData.embedToken}\n      embedUrl={urlWithParameters}\n      embedId={reportData.reportId}\n      permissions='All'\n      style={reportStyle}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAWA,MAAa,iBAAiB,UAAU;CACtC,MAAM,sBAAsB,yBAAyB;CACrD,MAAM,EAAE,IAAI,qBAAqB;CACjC,MAAM,OAAO,gBAAgB,CAAC;CAC9B,MAAM,UAAU,YAAY;CAC5B,MAAM,mBAAmB,qBAAqB;CAE9C,MAAM,cAAc,EAClB,QAAQ,sBACT;CAED,MAAM,CAAC,EAAE,MAAM,YAAY,SAAS,WAAW,YAC7C,cAAc,iBACd,uBAAuB,MACvB,EAAE,EACF,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,GAC9B;CAED,MAAM,oBAAoB,cAAc;AACtC,MAAI,YAAY,SACd,KAAI,kBAAkB;GACpB,IAAI,eAAe;AACnB,UAAO,KAAK,iBAAiB,CAAC,SAAS,QAAQ;IAC7C,MAAM,cAAc,OAAO,IAAI,GAAG,iBAAiB;AACnD,oBAAgB;KAChB;AACF,UAAO,WAAW,WAAW;QAE7B,QAAO,WAAW;MAEf,QAAO;IACb,CAAC,YAAY,UAAU,iBAAiB,CAAC;AAI5C,iBAAgB;AACd,MAAI,CAAC,SAAS,UAAU,MACtB,kBAAiB,EAAE,OAAO,KAAK,SAAS,EAAE,CAAC;IAE5C;EAAC;EAAkB;EAAM;EAAQ,CAAC;AAErC,KAAI,QAAS,QAAO,oCAACA,6BAAiB;AAEtC,KAAI,MACF,QACE,oCAAC;EAAM,UAAS;EAAQ,eAAe;IACpC,KAAK,wBAAwB,CACxB;AAIZ,KAAI,CAAC,oBAAqB,QAAO;AAEjC,KACE,CAAC,cACD,CAAC,WAAW,cACZ,CAAC,qBACD,CAAC,WAAW,SAIZ,QAAO,oCAAC,YAAM;AAGhB,QACE,oCAAC;EACC,KAAK,WAAW;EAChB,WAAU;EACV,WAAU;EACV,aAAa,WAAW;EACxB,UAAU;EACV,SAAS,WAAW;EACpB,aAAY;EACZ,OAAO;GACP"}

package/dist/PrimaryActionButton-CQXyHAeG.js

@@ -0,0 +1,36 @@
+import React from "react";
+import { Button, makeStyles } from "@material-ui/core";
+
+//#region src/UI/inputs/buttons/PrimaryActionButton.jsx
+const useStyles = makeStyles((theme) => ({
+	root: {
+		borderRadius: 0,
+		padding: "calc(.875rem - 3px) 23px calc(.875rem - 3px) 15px"
+	},
+	label: { textTransform: "none" },
+	endIcon: {
+		display: "flex",
+		justifyContent: "flex-end",
+		marginLeft: theme.spacing(2)
+	}
+}));
+const PrimaryActionButton = ({ children, icon,...otherProps }) => {
+	const classes = useStyles();
+	return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Button, {
+		...otherProps,
+		disableElevation: true,
+		classes: {
+			root: classes.root,
+			label: classes.label,
+			endIcon: classes.endIcon
+		},
+		variant: "contained",
+		color: "secondary",
+		endIcon: icon
+	}, children));
+};
+var PrimaryActionButton_default = PrimaryActionButton;
+
+//#endregion
+export { PrimaryActionButton, PrimaryActionButton_default };
+//# sourceMappingURL=PrimaryActionButton-CQXyHAeG.js.map

package/dist/PrimaryActionButton-CQXyHAeG.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PrimaryActionButton-CQXyHAeG.js","names":[],"sources":["../src/UI/inputs/buttons/PrimaryActionButton.jsx"],"sourcesContent":["import React from 'react'\nimport { makeStyles, Button } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    borderRadius: 0,\n    padding: 'calc(.875rem - 3px) 23px calc(.875rem - 3px) 15px'\n  },\n  label: {\n    textTransform: 'none'\n  },\n  endIcon: {\n    display: 'flex',\n    justifyContent: 'flex-end',\n    marginLeft: theme.spacing(2)\n  }\n}))\n\nexport const PrimaryActionButton = ({ children, icon, ...otherProps }) => {\n  const classes = useStyles()\n\n  return (\n    <div>\n      <Button\n        {...otherProps}\n        disableElevation\n        classes={{\n          root: classes.root,\n          label: classes.label,\n          endIcon: classes.endIcon\n        }}\n        variant='contained'\n        color='secondary'\n        endIcon={icon}\n      >\n        {children}\n      </Button>\n    </div>\n  )\n}\nexport default PrimaryActionButton\n"],"mappings":";;;;AAGA,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM;EACJ,cAAc;EACd,SAAS;EACV;CACD,OAAO,EACL,eAAe,QAChB;CACD,SAAS;EACP,SAAS;EACT,gBAAgB;EAChB,YAAY,MAAM,QAAQ,EAAE;EAC7B;CACF,EAAE;AAEH,MAAa,uBAAuB,EAAE,UAAU,KAAM,GAAG,iBAAiB;CACxE,MAAM,UAAU,WAAW;AAE3B,QACE,oCAAC,aACC,oCAAC;EACC,GAAI;EACJ;EACA,SAAS;GACP,MAAM,QAAQ;GACd,OAAO,QAAQ;GACf,SAAS,QAAQ;GAClB;EACD,SAAQ;EACR,OAAM;EACN,SAAS;IAER,SACM,CACL;;AAGV,kCAAe"}

package/dist/PrimaryActionHeader-D9vn0zfH.js

@@ -0,0 +1,547 @@
+import { FluentIconButton } from "./FluentIconButton-le92OnEc.js";
+import { useShellStore } from "./shellStore-Bqwtbs_K.js";
+import { PrimaryActionButton } from "./PrimaryActionButton-CQXyHAeG.js";
+import { useTeleporterStore } from "./teleporterStore-hSgRrvso.js";
+import { AmbientPopoverMenuItem, ToolBarButton } from "./AmbientPopoverMenuItem-Dy3rQ7sp.js";
+import { StandardTitle } from "./StandardTitle-DkEO3oI5.js";
+import { StatusChip } from "./StatusChip-Bw-0wE_B.js";
+import { UdpTabs } from "./UdpTabs-C7pvmyRq.js";
+import React, { Fragment, useMemo, useState } from "react";
+import { Collapse, Divider, LinearProgress, Popover, Slide, Typography, lighten, makeStyles } from "@material-ui/core";
+import clsx from "clsx";
+import { ArrowUpRightIcon, ChevronFold10Icon, ChevronRightIcon, ChevronUnfold10Icon, ClearIcon, DeleteIcon, ExcelDocumentIcon, FilterIcon, GroupListIcon, MaximumValueIcon, MoreVerticalIcon, PDFIcon, SaveIcon, SearchIcon, TextDocumentIcon } from "@fluentui/react-icons";
+import PropTypes from "prop-types";
+import ArrowBackIcon from "@material-ui/icons/esm/ArrowBack";
+
+//#region src/UI/utilityDisplay/utilityHeader/ui/PAHExport.jsx
+const useStyles$1 = makeStyles((theme) => ({
+	root: {},
+	popoverRoot: {},
+	icon: { color: theme.palette.secondary.main }
+}));
+const PAHExport = ({ exportCSV, exportExcel, exportPDF }) => {
+	const classes = useStyles$1();
+	const [anchorEl, setAnchorEl] = useState(null);
+	const handleClick = (event) => {
+		setAnchorEl(event.currentTarget);
+	};
+	const handleClose = () => {
+		setAnchorEl(null);
+	};
+	const open = Boolean(anchorEl);
+	const id = open ? "simple-popover" : void 0;
+	const gridControlsExport = [{
+		label: "Export CSV",
+		component: TextDocumentIcon,
+		click: exportCSV,
+		key: 1
+	}, {
+		label: "Export Excel",
+		component: ExcelDocumentIcon,
+		click: exportExcel,
+		key: 2
+	}];
+	return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement(FluentIconButton, {
+		className: classes.icon,
+		icon: ArrowUpRightIcon,
+		onClick: handleClick
+	}), /* @__PURE__ */ React.createElement(Popover, {
+		classes: { root: classes.popoverRoot },
+		square: true,
+		elevation: 1,
+		id,
+		open,
+		anchorEl,
+		onClose: handleClose,
+		anchorOrigin: {
+			vertical: "bottom",
+			horizontal: "left"
+		},
+		transformOrigin: {
+			vertical: "top",
+			horizontal: "left"
+		}
+	}, /* @__PURE__ */ React.createElement("div", { style: { width: 140 } }, /* @__PURE__ */ React.createElement("div", null, gridControlsExport.map((item) => {
+		return /* @__PURE__ */ React.createElement(AmbientPopoverMenuItem, {
+			label: item.label,
+			component: item.component,
+			click: item.click
+		});
+	})))));
+};
+
+//#endregion
+//#region src/UI/utilityDisplay/utilityHeader/ui/teleporter.ts
+const useAllTeleporters = () => {
+	const teleporterMap = useTeleporterStore((state) => state.teleporterMap);
+	return useMemo(() => {
+		const result = [];
+		for (const [targetId, locationMap] of teleporterMap.entries()) for (const [location, entry] of locationMap.entries()) result.push([
+			targetId,
+			location,
+			entry.teleporter
+		]);
+		return result;
+	}, [teleporterMap]);
+};
+
+//#endregion
+//#region src/UI/utilityDisplay/utilityHeader/PrimaryActionHeader.jsx
+const useStyles = makeStyles((theme) => ({
+	root: {
+		display: "flex",
+		[theme.breakpoints.between("xs", "sm")]: { height: 50 }
+	},
+	title: { margin: theme.spacing(2) },
+	titleWrapper: {
+		paddingLeft: theme.spacing(2),
+		paddingRight: (props) => props.single ? theme.spacing(2) : 0,
+		display: "flex",
+		alignItems: "center"
+	},
+	subHeaderWrapper: {
+		width: "100%",
+		marginTop: 0,
+		[theme.breakpoints.down("xs")]: { justifyContent: "flex-start" }
+	},
+	subHeader: {
+		minWidth: (props) => props.subheader && 320,
+		marginLeft: theme.spacing(2),
+		[theme.breakpoints.between("sm", "lg")]: { display: "none" },
+		[theme.breakpoints.down("xs")]: { display: "none" }
+	},
+	denseSubtitle: {
+		marginTop: theme.spacing(1.2),
+		marginLeft: theme.spacing(2)
+	},
+	actionRow: {
+		display: "flex",
+		flex: 1,
+		alignItems: "center"
+	},
+	secondaryButtons: {
+		display: "flex",
+		[theme.breakpoints.down("sm")]: { display: "none" },
+		alignItems: "center"
+	},
+	secondaryButtonsMobile: {
+		display: "flex",
+		padding: theme.spacing(1),
+		background: theme.palette.divider,
+		[theme.breakpoints.up("sm")]: { display: "none" }
+	},
+	search: {
+		marginRight: theme.spacing(2),
+		marginTop: theme.spacing(3),
+		flex: 1
+	},
+	close: { marginRight: theme.spacing(2) },
+	pab: {
+		display: "flex",
+		[theme.breakpoints.between("xs", "sm")]: {
+			position: "fixed",
+			bottom: theme.spacing(2),
+			right: theme.spacing(2),
+			zIndex: theme.zIndex.appBar
+		}
+	},
+	titleOnly: { paddingBottom: theme.spacing(1) },
+	advancedOptions: {
+		backgroundColor: "#EEEEEE",
+		width: "100%"
+	},
+	tabPageButtons: {
+		height: 50,
+		borderTop: `1px solid ${theme.palette.divider}`,
+		paddingLeft: theme.spacing(2),
+		backgroundColor: "#EEEEEE"
+	},
+	divider: {
+		height: 25,
+		marginLeft: theme.spacing(1),
+		marginRight: theme.spacing(2)
+	},
+	functionIcons: {
+		fontSize: 18,
+		color: theme.palette.secondary.main
+	},
+	tabRow: {
+		maxWidth: 500,
+		[theme.breakpoints.down("sm")]: { width: 300 },
+		minHeight: "48px"
+	},
+	fullTabs: {
+		[theme.breakpoints.down("xl")]: { maxWidth: 700 },
+		[theme.breakpoints.down("lg")]: { maxWidth: 500 },
+		[theme.breakpoints.down("sm")]: { maxWidth: "100vw" },
+		minHeight: "48px"
+	},
+	iconButton: {
+		marginTop: 9,
+		marginLeft: 4
+	},
+	titleWrapperBack: {
+		display: "flex",
+		flex: (props) => props.title && 1
+	},
+	buttomButtonRow: {
+		display: "flex",
+		width: "100%"
+	},
+	bottomButtonsLeft: {
+		display: "flex",
+		flex: 1,
+		justifyContent: "flex-start"
+	},
+	bottomButtonsRigth: {
+		display: "flex",
+		justifyContent: "flex-end"
+	},
+	single: { display: "flex" },
+	containerStyle: {
+		background: lighten(theme.palette.secondary.light, .9),
+		padding: theme.spacing(1),
+		paddingLeft: theme.spacing(2),
+		borderTop: `1px solid ${theme.palette.divider} `
+	},
+	gridControlLineUp: {
+		display: "flex",
+		alignItems: "center",
+		marginRight: theme.spacing(2)
+	},
+	additionalTitleComponent: { marginLeft: theme.spacing(2) }
+}));
+const PrimaryActionHeader = (props) => {
+	const classes = useStyles(props);
+	const { buttonLabel, title, subheader, handleClick, secondaryButtons, hidePAB = false, search, searchField, expandOptions, handleMouseLeave, expandedContent, handleChange, value, tabList, tabs, resizeGrid, collapse, expandAllItems, groups, showGroups, grid, clickBack, topRowSecondary, bottomRowSecondary, bottomRowSecondaryRight, loading, openGroups, openFilter, altInputs, loadingVal, exportGrid, openSearch = false, styleSearch, stepper, pabDisabled, switcher, single, lowerTray, lowerTraySearch, lowerTrayGrid, upperTrayGrid, exportCSV, exportExcel, exportPDF, expand, expandGrid, collapseGrid, resize, gridApi, saveGridConfig, deleteGridConfig, clearGridConfig, hideActionRow = false, allowAdditionalTitleComponent = false, allowAdditionalRightComponent = true, StatusChipProps = null, tabProps, tabVariant, additionalComponentId = "",...otherProps } = props;
+	const [searchExpanded, setSearchExpanded] = useState(openSearch);
+	const currentContainerId = useShellStore((state) => state.currentContainerId);
+	const allTeleporters = useAllTeleporters();
+	const expandSearch = () => {
+		setSearchExpanded(!searchExpanded);
+	};
+	const gridControlsExpand = [{
+		label: "",
+		aria: "expand",
+		component: ChevronUnfold10Icon,
+		click: expandGrid,
+		id: 1
+	}];
+	const gridControlsResize = [{
+		label: "",
+		aria: "resize",
+		component: MaximumValueIcon,
+		click: resizeGrid,
+		id: 2
+	}];
+	const gridControlsCollapse = [{
+		label: "",
+		aria: "collapse",
+		component: ChevronFold10Icon,
+		click: collapseGrid,
+		id: 3
+	}];
+	const gridControlsGroup = [{
+		label: "Group",
+		component: GroupListIcon,
+		click: openGroups,
+		id: 4
+	}];
+	const gridControlsFilter = [{
+		label: "Filter",
+		component: FilterIcon,
+		click: openFilter,
+		id: 5
+	}];
+	const gridControlsSave = [{
+		label: "Save Grid Configuration",
+		component: SaveIcon,
+		click: saveGridConfig,
+		id: 6
+	}];
+	const gridControlsDelete = [{
+		label: "Delete Grid Configuration",
+		component: DeleteIcon,
+		click: deleteGridConfig,
+		id: 7
+	}];
+	const gridControlsClear = [{
+		label: "Clear Grid Configuration",
+		component: ClearIcon,
+		click: clearGridConfig,
+		id: 8
+	}];
+	const gridControlsExport = /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(PAHExport, {
+		exportCSV: exportCSV || (() => gridApi?.exportDataAsCsv()),
+		exportExcel: exportExcel || (() => gridApi?.exportDataAsExcel()),
+		exportPDF
+	}));
+	const gridControlExpand = gridControlsExpand && /* @__PURE__ */ React.createElement("div", null, gridControlsExpand.map((item) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			title: item.label,
+			expanded: true,
+			component: item.component,
+			click: item.click,
+			aria: item.aria,
+			key: item.id
+		});
+	}));
+	const gridControlResize = gridControlsResize && /* @__PURE__ */ React.createElement("div", null, gridControlsResize.map((item) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			title: item.label,
+			expanded: true,
+			component: item.component,
+			click: item.click,
+			aria: item.aria,
+			key: item.id
+		});
+	}));
+	const gridControlCollapse = gridControlsCollapse && /* @__PURE__ */ React.createElement("div", null, gridControlsCollapse.map((item) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			title: item.label,
+			expanded: true,
+			component: item.component,
+			click: item.click,
+			aria: item.aria,
+			key: item.id
+		});
+	}));
+	const gridControlSave = gridControlsSave && /* @__PURE__ */ React.createElement("div", null, gridControlsSave.map((item) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			title: item.label,
+			expanded: true,
+			component: item.component,
+			click: item.click,
+			aria: item.aria,
+			key: item.id
+		});
+	}));
+	const gridControlDelete = gridControlsDelete && /* @__PURE__ */ React.createElement("div", null, gridControlsDelete.map((item) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			title: item.label,
+			expanded: true,
+			component: item.component,
+			click: item.click,
+			aria: item.aria,
+			key: item.id
+		});
+	}));
+	const gridControlClear = gridControlsClear && /* @__PURE__ */ React.createElement("div", null, gridControlsClear.map((item) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			title: item.label,
+			expanded: true,
+			component: item.component,
+			click: item.click,
+			aria: item.aria,
+			key: item.id
+		});
+	}));
+	const searchToggle = /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { style: { display: "flex" } }, searchExpanded && /* @__PURE__ */ React.createElement(FluentIconButton, {
+		click: expandSearch,
+		"aria-label": "close search",
+		className: classes.close,
+		icon: ChevronRightIcon,
+		onClick: expandSearch,
+		size: "small"
+	})), /* @__PURE__ */ React.createElement("div", {
+		className: classes.search,
+		style: { flex: 1 }
+	}, /* @__PURE__ */ React.createElement("div", null, searchExpanded && /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Slide, {
+		direction: "left",
+		in: expandSearch,
+		mountOnEnter: true,
+		unmountOnExit: true
+	}, /* @__PURE__ */ React.createElement("div", { className: classes.searchWrapper }, searchField))))));
+	const LowerTrayShell = ({ children }) => {
+		return /* @__PURE__ */ React.createElement("div", { className: classes.containerStyle }, children);
+	};
+	const GridControlLineUp = () => {
+		return /* @__PURE__ */ React.createElement("div", { className: classes.gridControlLineUp }, saveGridConfig && gridControlSave, deleteGridConfig && gridControlDelete, clearGridConfig && gridControlClear, expandGrid && gridControlExpand, resizeGrid && gridControlResize, collapseGrid && gridControlCollapse, exportGrid && gridControlsExport);
+	};
+	const additionalTitleTeleportedComponents = useMemo(() => {
+		const components = [];
+		allTeleporters.forEach(([targetId, location, teleporter]) => {
+			const Target = teleporter.Target;
+			if (targetId === additionalComponentId && location === "title") components.push(/* @__PURE__ */ React.createElement("div", {
+				key: targetId,
+				className: "teleport-target"
+			}, /* @__PURE__ */ React.createElement(Target, null)));
+		});
+		return components;
+	}, [additionalComponentId, allTeleporters]);
+	return /* @__PURE__ */ React.createElement("div", { key: currentContainerId }, /* @__PURE__ */ React.createElement("div", { className: single && classes.single }, /* @__PURE__ */ React.createElement("div", { className: classes.titleWrapperBack }, clickBack && /* @__PURE__ */ React.createElement("div", { className: classes.iconButton }, /* @__PURE__ */ React.createElement(FluentIconButton, {
+		icon: ArrowBackIcon,
+		onClick: clickBack
+	})), title && /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement("div", { className: classes.titleWrapper }, /* @__PURE__ */ React.createElement(StandardTitle, { removeMarginTop: single }, title), single && subheader && /* @__PURE__ */ React.createElement(Typography, {
+		className: classes.denseSubtitle,
+		variant: "subtitle1",
+		component: "h2"
+	}, subheader), allowAdditionalTitleComponent && /* @__PURE__ */ React.createElement("div", { className: classes.additionalTitleComponent }, additionalTitleTeleportedComponents.map((value$1) => {
+		return value$1;
+	})))), !title && allowAdditionalTitleComponent && /* @__PURE__ */ React.createElement("div", { className: classes.additionalTitleComponent }, additionalTitleTeleportedComponents.map((value$1) => {
+		return value$1;
+	})), StatusChipProps && /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement("div", { className: classes.titleWrapper }, /* @__PURE__ */ React.createElement(StatusChip, {
+		label: StatusChipProps?.label,
+		status: StatusChipProps?.status
+	})))), /* @__PURE__ */ React.createElement("div", { className: classes.subHeaderWrapper }, stepper, !hideActionRow && /* @__PURE__ */ React.createElement("div", { className: classes.actionRow }, !single && subheader && /* @__PURE__ */ React.createElement(Typography, {
+		className: classes.denseSubtitle,
+		variant: "subtitle1",
+		component: "h2"
+	}, subheader), /* @__PURE__ */ React.createElement("div", { className: grid ? classes.tabRow : classes.fullTabs }, tabList?.length > 0 && /* @__PURE__ */ React.createElement(UdpTabs, {
+		value,
+		onChange: handleChange,
+		tabList,
+		variant: tabVariant
+	})), search && searchToggle, /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React.createElement("div", { className: classes.secondaryButtons }, !searchExpanded && search && /* @__PURE__ */ React.createElement(ToolBarButton, {
+		label: "Search",
+		component: SearchIcon,
+		click: expandSearch
+	}), search && /* @__PURE__ */ React.createElement(Divider, {
+		orientation: "vertical",
+		className: classes.divider
+	}), (expandGrid || resizeGrid || collapseGrid || exportGrid || saveGridConfig || deleteGridConfig || clearGridConfig) && upperTrayGrid && /* @__PURE__ */ React.createElement(GridControlLineUp, { expand }), grid && openFilter && gridControlsFilter.map((item) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			title: item.label,
+			expanded: true,
+			component: item.component,
+			click: item.click,
+			aria: item.aria,
+			key: item.id
+		});
+	}), grid && openGroups && gridControlsGroup.map((item) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			title: item.label,
+			expanded: true,
+			component: item.component,
+			click: item.click,
+			aria: item.aria,
+			key: item.id
+		});
+	}), grid && searchExpanded && /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(FluentIconButton, {
+		id: "udpRecord-PrimaryActionHeader-ClosePanel",
+		udprecordid: "udpRecord-PrimaryActionHeader-ClosePanel",
+		icon: MoreVerticalIcon,
+		"aria-label": "Close Panel"
+	})), secondaryButtons && !tabs && secondaryButtons.map((item, index) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			expanded: searchExpanded,
+			component: item.component,
+			click: item.click,
+			key: item.id ?? index,
+			aria: item.label,
+			disabled: item.disabled
+		});
+	})), /* @__PURE__ */ React.createElement("div", null, allowAdditionalRightComponent && allTeleporters.map(([targetId, location, teleporter]) => {
+		const Target = teleporter.Target;
+		if (targetId === additionalComponentId && location === "right") return /* @__PURE__ */ React.createElement("div", {
+			key: targetId,
+			className: "teleport-target"
+		}, /* @__PURE__ */ React.createElement(Target, null));
+		else return null;
+	})), !hidePAB && /* @__PURE__ */ React.createElement("div", { className: classes.pab }, topRowSecondary && topRowSecondary.map((item, index) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			expanded: searchExpanded,
+			component: item.component,
+			click: item.click,
+			key: item.id ?? index,
+			aria: item.label
+		});
+	}), /* @__PURE__ */ React.createElement(PrimaryActionButton, {
+		disabled: pabDisabled,
+		onClick: handleClick,
+		...otherProps
+	}, buttonLabel)))), /* @__PURE__ */ React.createElement("div", { className: clsx(classes.secondaryButtons, (altInputs || bottomRowSecondary) && classes.tabPageButtons) }, /* @__PURE__ */ React.createElement("div", { className: classes.buttomButtonRow }, /* @__PURE__ */ React.createElement("div", { className: classes.bottomButtonsLeft }, bottomRowSecondary && bottomRowSecondary.map((item, index) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			expanded: !tabs && searchExpanded,
+			component: item.component,
+			click: item.click,
+			key: item.id ?? index
+		});
+	})), /* @__PURE__ */ React.createElement("div", { className: classes.bottomButtonsRigth }, bottomRowSecondaryRight && bottomRowSecondaryRight.map((item, index) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			expanded: !tabs && searchExpanded,
+			component: item.component,
+			click: item.click,
+			key: item.id ?? index
+		});
+	})), altInputs), /* @__PURE__ */ React.createElement("div", null, showGroups && /* @__PURE__ */ React.createElement(Divider, null), showGroups && groups)), /* @__PURE__ */ React.createElement(Collapse, {
+		in: expandOptions,
+		timeout: "auto"
+	}, /* @__PURE__ */ React.createElement("div", { onMouseLeave: handleMouseLeave }, /* @__PURE__ */ React.createElement("div", { className: classes.advancedOptions }, expandedContent))), loading && /* @__PURE__ */ React.createElement(LinearProgress, { value: loadingVal })), lowerTray && /* @__PURE__ */ React.createElement(LowerTrayShell, null, /* @__PURE__ */ React.createElement("div", { style: {
+		display: "flex",
+		justifyContent: "flex-end"
+	} }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex" } }, !searchExpanded && lowerTraySearch && /* @__PURE__ */ React.createElement(ToolBarButton, {
+		label: "Search",
+		component: SearchIcon,
+		click: expandSearch
+	}), searchToggle), lowerTrayGrid && /* @__PURE__ */ React.createElement(GridControlLineUp, null))), /* @__PURE__ */ React.createElement("div", { className: classes.secondaryButtonsMobile }, secondaryButtons && !tabs && secondaryButtons.map((item, index) => {
+		return /* @__PURE__ */ React.createElement(ToolBarButton, {
+			label: item.label,
+			expanded: searchExpanded,
+			component: item.component,
+			click: item.click,
+			key: item.id ?? index,
+			aria: item.label,
+			disabled: item.disabled
+		});
+	})));
+};
+PrimaryActionHeader.propTypes = {
+	buttonLabel: PropTypes.string,
+	title: PropTypes.string.isRequired,
+	subheader: PropTypes.string,
+	handleClick: PropTypes.func,
+	secondaryButtons: PropTypes.arrayOf(PropTypes.shape({
+		label: PropTypes.string,
+		component: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
+		click: PropTypes.func,
+		key: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
+	})),
+	hidePAB: PropTypes.bool,
+	search: PropTypes.bool,
+	searchField: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
+	expandOptions: PropTypes.func,
+	handleMouseLeave: PropTypes.string,
+	expandedContent: PropTypes.node,
+	handleChange: PropTypes.string,
+	value: PropTypes.oneOfType([PropTypes.node, false]),
+	tabList: PropTypes.node,
+	tabs: PropTypes.bool,
+	resizeGrid: PropTypes.func,
+	collapse: PropTypes.func,
+	expandAllItems: PropTypes.func,
+	saveGridConfig: PropTypes.func,
+	deleteGridConfig: PropTypes.func,
+	clearGridConfig: PropTypes.func,
+	groups: PropTypes.node,
+	grid: PropTypes.bool,
+	otherProps: PropTypes.any,
+	bottomRowSecondary: PropTypes.array,
+	topRowSecondary: PropTypes.array,
+	clickBack: PropTypes.func,
+	loading: PropTypes.bool,
+	loadingVal: PropTypes.number,
+	openGroups: PropTypes.func,
+	openFilter: PropTypes.func,
+	altInputs: PropTypes.node,
+	hideActionRow: PropTypes.bool,
+	tabProps: PropTypes.object,
+	single: PropTypes.bool
+};
+PrimaryActionHeader.defaultProps = { hidePAB: false };
+
+//#endregion
+export { PAHExport, PrimaryActionHeader, useAllTeleporters };
+//# sourceMappingURL=PrimaryActionHeader-D9vn0zfH.js.map