udp-react-enterprise-component-library 25.18.1-beta.37 → 25.18.1-beta.39

package/dist/AmbientStepper-Dv1WH2x1.js

@@ -1,175 +0,0 @@
-import * as React$1 from "react";
-import React from "react";
-import { Typography, withStyles } from "@material-ui/core";
-import clsx from "clsx";
-import PropTypes from "prop-types";
-import { makeStyles as makeStyles$1, withStyles as withStyles$1 } from "@material-ui/core/styles";
-import Stepper$1 from "@material-ui/core/Stepper";
-import Step$1 from "@material-ui/core/Step";
-import Check from "@material-ui/icons/esm/Check";
-import StepConnector$1 from "@material-ui/core/StepConnector";
-
-//#region src/UI/inputs/menus/AmbientStepper/StepLabel.jsx
-const styles = (theme) => ({
-	root: {
-		display: "flex",
-		alignItems: "center",
-		"&$alternativeLabel": { flexDirection: "column" },
-		"&$disabled": { cursor: "default" }
-	},
-	horizontal: {},
-	vertical: {},
-	label: {
-		color: theme.palette.text.secondary,
-		"&$active": {
-			color: theme.palette.text.primary,
-			fontWeight: 500
-		},
-		"&$completed": {
-			color: theme.palette.text.primary,
-			fontWeight: 500
-		},
-		"&$alternativeLabel": { textAlign: "center" },
-		"&$error": { color: theme.palette.error.main }
-	},
-	active: {},
-	completed: {},
-	error: {},
-	disabled: {},
-	iconContainer: {
-		flexShrink: 0,
-		display: "flex",
-		paddingRight: 8,
-		"&$alternativeLabel": { paddingRight: 0 }
-	},
-	alternativeLabel: {},
-	labelContainer: { width: "100%" }
-});
-const StepLabel$1 = React$1.forwardRef(function StepLabel$2(props, ref) {
-	const { active = false, alternativeLabel = false, children, classes, className, completed = false, disabled = false, error = false, expanded, icon, last, optional, orientation = "horizontal", StepIconComponent: StepIconComponentProp, StepIconProps, ...other } = props;
-	let StepIconComponent = StepIconComponentProp;
-	return /* @__PURE__ */ React$1.createElement("span", {
-		className: clsx(classes.root, classes[orientation], {
-			[classes.disabled]: disabled,
-			[classes.alternativeLabel]: alternativeLabel,
-			[classes.error]: error
-		}, className),
-		ref,
-		...other
-	}, icon || StepIconComponent ? /* @__PURE__ */ React$1.createElement("span", { className: clsx(classes.iconContainer, { [classes.alternativeLabel]: alternativeLabel }) }, /* @__PURE__ */ React$1.createElement(StepIconComponent, {
-		completed,
-		active,
-		error,
-		icon,
-		...StepIconProps
-	})) : null, /* @__PURE__ */ React$1.createElement("span", { className: classes.labelContainer }, children ? /* @__PURE__ */ React$1.createElement(Typography, {
-		variant: "body2",
-		component: "span",
-		display: "block",
-		className: clsx(classes.label, {
-			[classes.alternativeLabel]: alternativeLabel,
-			[classes.completed]: completed,
-			[classes.active]: active,
-			[classes.error]: error
-		})
-	}, children) : null, optional));
-});
-StepLabel$1.propTypes = {
-	children: PropTypes.node,
-	classes: PropTypes.object,
-	className: PropTypes.string,
-	disabled: PropTypes.bool,
-	error: PropTypes.bool,
-	icon: PropTypes.node,
-	optional: PropTypes.node,
-	StepIconComponent: PropTypes.elementType,
-	StepIconProps: PropTypes.object
-};
-StepLabel$1.muiName = "StepLabel";
-/**
-* Explicit any export to avoid non-portable inferred React types in declaration output.
-* @type {any}
-*/
-const StepLabelExport = withStyles(styles, { name: "MuiStepLabel" })(StepLabel$1);
-var StepLabel_default = StepLabelExport;
-
-//#endregion
-//#region src/UI/inputs/menus/AmbientStepper/AmbientStepper.jsx
-const QontoConnector = withStyles$1({
-	alternativeLabel: {
-		top: 10,
-		left: "calc(-50% + 16px)",
-		right: "calc(50% + 16px)"
-	},
-	active: { "& $line": { borderColor: "#09A58C" } },
-	completed: { "& $line": { borderColor: "#09A58C" } },
-	line: {
-		borderColor: "#eaeaf0",
-		borderTopWidth: 3,
-		borderRadius: 1
-	}
-})(StepConnector$1);
-const useQontoStepIconStyles = makeStyles$1({
-	root: {
-		color: "#09A58C",
-		display: "flex",
-		height: 22,
-		alignItems: "center"
-	},
-	active: { color: "#09A58C" },
-	circle: {
-		width: 16,
-		height: 16,
-		borderRadius: "50%",
-		border: "2px solid currentColor"
-	},
-	completed: {
-		color: "#09A58C",
-		zIndex: 1,
-		fontSize: 18
-	},
-	stepLabel: { display: "none" },
-	rootStepper: { background: "blue" }
-});
-const QontoStepIcon = (props) => {
-	const classes = useQontoStepIconStyles();
-	const { active, completed } = props;
-	return /* @__PURE__ */ React.createElement("div", { className: clsx(classes.root, { [classes.active]: active }) }, completed ? /* @__PURE__ */ React.createElement(Check, { className: classes.completed }) : /* @__PURE__ */ React.createElement("div", { className: classes.circle }));
-};
-QontoStepIcon.propTypes = {
-	active: PropTypes.bool,
-	completed: PropTypes.bool
-};
-const useStyles = makeStyles$1((theme) => ({
-	root: { width: "100%" },
-	button: { marginRight: theme.spacing(1) },
-	instructions: {
-		marginTop: theme.spacing(1),
-		marginBottom: theme.spacing(1)
-	},
-	rootStep: { marginTop: 0 }
-}));
-const AmbientStepper = ({ activeStep, steps, orientation }) => {
-	const classes = useStyles();
-	return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement(Stepper$1, {
-		style: {
-			background: "transparent",
-			padding: 0
-		},
-		classes: { root: classes.rootStepper },
-		alternativeLabel: true,
-		activeStep,
-		connector: /* @__PURE__ */ React.createElement(QontoConnector, null),
-		orietation: orientation
-	}, steps.map((label) => /* @__PURE__ */ React.createElement(Step$1, {
-		classes: { root: classes.rootStep },
-		key: label
-	}, /* @__PURE__ */ React.createElement(StepLabel_default, {
-		className: classes.stepLabel,
-		StepIconComponent: QontoStepIcon
-	}, /* @__PURE__ */ React.createElement("span", { style: { fontSize: 14 } }, label))))));
-};
-
-//#endregion
-export { styles as n, AmbientStepper as t };
-//# sourceMappingURL=AmbientStepper-Dv1WH2x1.js.map

package/dist/AmbientStepper-Dv1WH2x1.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AmbientStepper-Dv1WH2x1.js","names":["StepLabel","React","withStyles","StepConnector","makeStyles","Stepper","Step","StepLabel"],"sources":["../src/UI/inputs/menus/AmbientStepper/StepLabel.jsx","../src/UI/inputs/menus/AmbientStepper/AmbientStepper.jsx"],"sourcesContent":["import * as React from 'react'\nimport PropTypes from 'prop-types'\nimport clsx from 'clsx'\nimport { withStyles, Typography } from '@material-ui/core'\n\nexport const styles = (theme) => ({\n  /* Styles applied to the root element. */\n  root: {\n    display: 'flex',\n    alignItems: 'center',\n    '&$alternativeLabel': {\n      flexDirection: 'column'\n    },\n    '&$disabled': {\n      cursor: 'default'\n    }\n  },\n  /* Styles applied to the root element if `orientation=\"horizontal\"`. */\n  horizontal: {},\n  /* Styles applied to the root element if `orientation=\"vertical\"`. */\n  vertical: {},\n  /* Styles applied to the `Typography` component which wraps `children`. */\n  label: {\n    color: theme.palette.text.secondary,\n    '&$active': {\n      color: theme.palette.text.primary,\n      fontWeight: 500\n    },\n    '&$completed': {\n      color: theme.palette.text.primary,\n      fontWeight: 500\n    },\n    '&$alternativeLabel': {\n      textAlign: 'center'\n      // marginTop: 16,\n    },\n    '&$error': {\n      color: theme.palette.error.main\n    }\n  },\n  /* Pseudo-class applied to the `Typography` component if `active={true}`. */\n  active: {},\n  /* Pseudo-class applied to the `Typography` component if `completed={true}`. */\n  completed: {},\n  /* Pseudo-class applied to the root element and `Typography` component if `error={true}`. */\n  error: {},\n  /* Pseudo-class applied to the root element and `Typography` component if `disabled={true}`. */\n  disabled: {},\n  /* Styles applied to the `icon` container element. */\n  iconContainer: {\n    flexShrink: 0, // Fix IE 11 issue\n    display: 'flex',\n    paddingRight: 8,\n    '&$alternativeLabel': {\n      paddingRight: 0\n    }\n  },\n  /* Pseudo-class applied to the root and icon container and `Typography` if `alternativeLabel={true}`. */\n  alternativeLabel: {},\n  /* Styles applied to the container element which wraps `Typography` and `optional`. */\n  labelContainer: {\n    width: '100%'\n  }\n})\n\nconst StepLabel = React.forwardRef(function StepLabel(props, ref) {\n  const {\n    // eslint-disable-next-line react/prop-types\n    active = false,\n    // eslint-disable-next-line react/prop-types\n    alternativeLabel = false,\n    children,\n    classes,\n    className,\n    // eslint-disable-next-line react/prop-types\n    completed = false,\n    disabled = false,\n    error = false,\n    // eslint-disable-next-line react/prop-types\n    expanded,\n    icon,\n    // eslint-disable-next-line react/prop-types\n    last,\n    optional,\n    // eslint-disable-next-line react/prop-types\n    orientation = 'horizontal',\n    StepIconComponent: StepIconComponentProp,\n    StepIconProps,\n    ...other\n  } = props\n\n  let StepIconComponent = StepIconComponentProp\n\n  return (\n    <span\n      className={clsx(\n        classes.root,\n        classes[orientation],\n        {\n          [classes.disabled]: disabled,\n          [classes.alternativeLabel]: alternativeLabel,\n          [classes.error]: error\n        },\n        className\n      )}\n      ref={ref}\n      {...other}\n    >\n      {icon || StepIconComponent ? (\n        <span\n          className={clsx(classes.iconContainer, {\n            [classes.alternativeLabel]: alternativeLabel\n          })}\n        >\n          <StepIconComponent\n            completed={completed}\n            active={active}\n            error={error}\n            icon={icon}\n            {...StepIconProps}\n          />\n        </span>\n      ) : null}\n      <span className={classes.labelContainer}>\n        {children ? (\n          <Typography\n            variant='body2'\n            component='span'\n            display='block'\n            className={clsx(classes.label, {\n              [classes.alternativeLabel]: alternativeLabel,\n              [classes.completed]: completed,\n              [classes.active]: active,\n              [classes.error]: error\n            })}\n          >\n            {children}\n          </Typography>\n        ) : null}\n        {optional}\n      </span>\n    </span>\n  )\n})\n\nStepLabel.propTypes = {\n  // ----------------------------- Warning --------------------------------\n  // | These PropTypes are generated from the TypeScript type definitions |\n  // |     To update them edit the d.ts file and run \"yarn proptypes\"     |\n  // ----------------------------------------------------------------------\n  /**\n   * In most cases will simply be a string containing a title for the label.\n   */\n  children: PropTypes.node,\n  /**\n   * Override or extend the styles applied to the component.\n   * See [CSS API](#css) below for more details.\n   */\n  classes: PropTypes.object,\n  /**\n   * @ignore\n   */\n  className: PropTypes.string,\n  /**\n   * Mark the step as disabled, will also disable the button if\n   * `StepLabelButton` is a child of `StepLabel`. Is passed to child components.\n   */\n  disabled: PropTypes.bool,\n  /**\n   * Mark the step as failed.\n   */\n  error: PropTypes.bool,\n  /**\n   * Override the default label of the step icon.\n   */\n  icon: PropTypes.node,\n  /**\n   * The optional node to display.\n   */\n  optional: PropTypes.node,\n  /**\n   * The component to render in place of the [`StepIcon`](/api/step-icon/).\n   */\n  StepIconComponent: PropTypes.elementType,\n  /**\n   * Props applied to the [`StepIcon`](/api/step-icon/) element.\n   */\n  StepIconProps: PropTypes.object\n}\n\nStepLabel.muiName = 'StepLabel'\n\n/**\n * Explicit any export to avoid non-portable inferred React types in declaration output.\n * @type {any}\n */\nconst StepLabelExport = withStyles(styles, { name: 'MuiStepLabel' })(StepLabel)\n\nexport default StepLabelExport\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { makeStyles, withStyles } from '@material-ui/core/styles'\nimport clsx from 'clsx'\nimport Stepper from '@material-ui/core/Stepper'\nimport Step from '@material-ui/core/Step'\n// import StepLabel from '@material-ui/core/StepLabel';\nimport Check from '@material-ui/icons/esm/Check'\nimport StepConnector from '@material-ui/core/StepConnector'\nimport StepLabel from './StepLabel'\n\nconst QontoConnector = withStyles({\n  alternativeLabel: {\n    top: 10,\n    left: 'calc(-50% + 16px)',\n    right: 'calc(50% + 16px)'\n  },\n  active: {\n    '& $line': {\n      borderColor: '#09A58C'\n    }\n  },\n  completed: {\n    '& $line': {\n      borderColor: '#09A58C'\n    }\n  },\n  line: {\n    borderColor: '#eaeaf0',\n    borderTopWidth: 3,\n    borderRadius: 1\n  }\n})(StepConnector)\n\nconst useQontoStepIconStyles = makeStyles({\n  root: {\n    color: '#09A58C',\n    display: 'flex',\n    height: 22,\n    alignItems: 'center'\n  },\n  active: {\n    color: '#09A58C'\n  },\n  circle: {\n    width: 16,\n    height: 16,\n    borderRadius: '50%',\n    border: '2px solid currentColor'\n  },\n  completed: {\n    color: '#09A58C',\n    zIndex: 1,\n    fontSize: 18\n  },\n  stepLabel: {\n    display: 'none'\n  },\n  rootStepper: {\n    background: 'blue'\n  }\n})\n\nconst QontoStepIcon = (props) => {\n  const classes = useQontoStepIconStyles()\n  const { active, completed } = props\n\n  return (\n    <div\n      className={clsx(classes.root, {\n        [classes.active]: active\n      })}\n    >\n      {completed ? (\n        <Check className={classes.completed} />\n      ) : (\n        <div className={classes.circle} />\n      )}\n    </div>\n  )\n}\n\nQontoStepIcon.propTypes = {\n  /**\n   * Whether this step is active.\n   */\n  active: PropTypes.bool,\n  /**\n   * Mark the step as completed. Is passed to child components.\n   */\n  completed: PropTypes.bool\n}\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    width: '100%'\n  },\n  button: {\n    marginRight: theme.spacing(1)\n  },\n  instructions: {\n    marginTop: theme.spacing(1),\n    marginBottom: theme.spacing(1)\n  },\n  rootStep: {\n    marginTop: 0\n  }\n}))\n\n// function getSteps() {\n//   return [\n//     'Select campaign settings',\n//     'Create an ad group',\n//     'Create an ad',\n//     'another',\n//   ];\n// }\n\nexport const AmbientStepper = ({ activeStep, steps, orientation }) => {\n  const classes = useStyles()\n\n  return (\n    <div className={classes.root}>\n      <Stepper\n        style={{ background: 'transparent', padding: 0 }}\n        classes={{ root: classes.rootStepper }}\n        alternativeLabel\n        activeStep={activeStep}\n        connector={<QontoConnector />}\n        orietation={orientation}\n      >\n        {steps.map((label) => (\n          <Step classes={{ root: classes.rootStep }} key={label}>\n            <StepLabel\n              className={classes.stepLabel}\n              StepIconComponent={QontoStepIcon}\n            >\n              <span style={{ fontSize: 14 }}>{label}</span>\n            </StepLabel>\n          </Step>\n        ))}\n      </Stepper>\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/AmbientToast-Cez7Ybdf.js

@@ -1,70 +0,0 @@
-import { t as FluentIconButton } from "./FluentIconButton-Dc95mE3v.js";
-import React from "react";
-import { Button, Snackbar, makeStyles, useTheme } from "@material-ui/core";
-import { ChromeCloseIcon } from "@fluentui/react-icons";
-
-//#region src/UI/feedback/AmbientToast.jsx
-const useStyles = makeStyles((theme) => ({
-	root: {
-		maxWidth: 600,
-		"& > * + *": { marginTop: theme.spacing(2) },
-		display: "flex"
-	},
-	alertSecondary: { borderLeft: `4px solid ${theme.palette.secondary.main}` },
-	alertPrimary: { borderLeft: `4px solid ${theme.palette.primary.main}` },
-	alertSuccess: { borderLeft: `4px solid ${theme.palette.success.main}` },
-	alertWarning: { borderLeft: `4px solid ${theme.palette.warning.main}` },
-	alertError: {
-		borderLeft: `4px solid ${theme.palette.error.main}`,
-		color: theme.palette.error.main
-	},
-	alertInfo: { borderLeft: `4px solid ${theme.palette.info.main}` },
-	"@global": { ".MuiSnackbarContent-root": { borderRadius: 0 } }
-}));
-const AmbientToast = (props) => {
-	const classes = useStyles(props);
-	const { noticeType, noticeButton, noticeMessage, closeNotice, noticeOpen, noticeAction } = props;
-	const theme = useTheme();
-	const alertColor = () => {
-		if (noticeType === "secondary") return classes.alertSecondary;
-		else if (noticeType === "primary") return classes.alertPrimary;
-		else if (noticeType === "success") return classes.alertSuccess;
-		else if (noticeType === "warning") return classes.alertWarning;
-		else if (noticeType === "error") return classes.alertError;
-		else if (noticeType === "info") return classes.alertInfo;
-	};
-	const alertText = () => {
-		if (noticeType === "secondary") return theme.palette.secondary.main;
-		else if (noticeType === "primary") return theme.palette.primary.main;
-		else if (noticeType === "success") return theme.palette.success.main;
-		else if (noticeType === "warning") return theme.palette.warning.main;
-		else if (noticeType === "error") return theme.palette.error.main;
-		else if (noticeType === "info") return theme.palette.info.main;
-	};
-	return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement(Snackbar, {
-		classes: { root: alertColor() },
-		anchorOrigin: {
-			vertical: "bottom",
-			horizontal: "right"
-		},
-		open: noticeOpen,
-		onClose: closeNotice,
-		message: noticeMessage,
-		key: 1,
-		action: /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Button, {
-			style: { color: alertText() },
-			size: "small",
-			onClick: noticeAction
-		}, noticeButton), /* @__PURE__ */ React.createElement(FluentIconButton, {
-			style: { color: "white" },
-			size: "small",
-			onClick: closeNotice,
-			icon: ChromeCloseIcon,
-			className: classes.icon
-		}))
-	}));
-};
-
-//#endregion
-export { AmbientToast as t };
-//# sourceMappingURL=AmbientToast-Cez7Ybdf.js.map

package/dist/AmbientToast-Cez7Ybdf.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AmbientToast-Cez7Ybdf.js","names":[],"sources":["../src/UI/feedback/AmbientToast.jsx"],"sourcesContent":["import React from 'react';\nimport { Button, makeStyles, Snackbar, useTheme } from '@material-ui/core'\nimport {FluentIconButton} from '../inputs/buttons/FluentIconButton'\nimport { ChromeCloseIcon } from '@fluentui/react-icons'\n\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    maxWidth: 600,\n    '& > * + *': {\n      marginTop: theme.spacing(2),\n    },\n    display: 'flex'\n  },\n  alertSecondary: {\n    borderLeft: `4px solid ${theme.palette.secondary.main}`\n  },\n  alertPrimary: {\n    borderLeft: `4px solid ${theme.palette.primary.main}`\n  },\n  alertSuccess: {\n    borderLeft: `4px solid ${theme.palette.success.main}`\n  },\n  alertWarning: {\n    borderLeft: `4px solid ${theme.palette.warning.main}`\n  },\n  alertError: {\n    borderLeft: `4px solid ${theme.palette.error.main}`,\n    color: theme.palette.error.main\n  },\n  alertInfo: {\n    borderLeft: `4px solid ${theme.palette.info.main}`\n  },\n  '@global': {\n    '.MuiSnackbarContent-root': {\n      borderRadius: 0,\n    },\n  }\n}));\n\nexport const AmbientToast = (props) => {\n  const classes = useStyles(props);\n\n  const {noticeType, noticeButton, noticeMessage, closeNotice, noticeOpen, noticeAction} = props;\n\n  const theme = useTheme()\n\n  const alertColor = () => {\n    if(noticeType === 'secondary') {\n      let alertLevel = classes.alertSecondary\n      return alertLevel\n      \n    } else if (noticeType === 'primary') {\n      let alertLevel = classes.alertPrimary\n      return alertLevel\n    } else if (noticeType === 'success') {\n      let alertLevel = classes.alertSuccess\n      return alertLevel\n    } else if (noticeType === 'warning') {\n      let alertLevel = classes.alertWarning\n      return alertLevel\n    } else if (noticeType === 'error') {\n      let alertLevel = classes.alertError\n      return alertLevel\n    } else if (noticeType === 'info') {\n      let alertLevel = classes.alertInfo\n      return alertLevel\n    }\n  }\n\n\n  const alertText = () => {\n    if(noticeType === 'secondary'){\n      return theme.palette.secondary.main\n    } else if (noticeType === 'primary') {\n      return theme.palette.primary.main\n    } else if (noticeType === 'success') {\n      return theme.palette.success.main\n    } else if (noticeType === 'warning') {\n      return theme.palette.warning.main\n    } else if (noticeType === 'error') {\n      return theme.palette.error.main\n    } else if (noticeType === 'info') {\n      return theme.palette.info.main\n    }\n  }\n\n  return (\n    <div className={classes.root}>   \n      <Snackbar\n        classes={{root: alertColor() }}\n        anchorOrigin={{ vertical:'bottom', horizontal:'right' }}\n        open={noticeOpen}\n        onClose={closeNotice}\n        message={noticeMessage}\n        key={1}\n        action={\n          <div>\n            <Button style={{color: alertText()}} size=\"small\" onClick={noticeAction}>\n              {noticeButton}\n            </Button>\n            <FluentIconButton\n                style={{color: 'white'}}\n                      size=\"small\"\n                      onClick={closeNotice}\n                      icon={ChromeCloseIcon}\n                      className={classes.icon}\n                    />\n          </div>\n        }\n      />\n    </div>\n  );\n}"],"mappings":";;;;;;AAMA,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM;EACJ,UAAU;EACV,aAAa,EACX,WAAW,MAAM,QAAQ,EAAE,EAC5B;EACD,SAAS;EACV;CACD,gBAAgB,EACd,YAAY,aAAa,MAAM,QAAQ,UAAU,QAClD;CACD,cAAc,EACZ,YAAY,aAAa,MAAM,QAAQ,QAAQ,QAChD;CACD,cAAc,EACZ,YAAY,aAAa,MAAM,QAAQ,QAAQ,QAChD;CACD,cAAc,EACZ,YAAY,aAAa,MAAM,QAAQ,QAAQ,QAChD;CACD,YAAY;EACV,YAAY,aAAa,MAAM,QAAQ,MAAM;EAC7C,OAAO,MAAM,QAAQ,MAAM;EAC5B;CACD,WAAW,EACT,YAAY,aAAa,MAAM,QAAQ,KAAK,QAC7C;CACD,WAAW,EACT,4BAA4B,EAC1B,cAAc,GACf,EACF;CACF,EAAE;AAEH,MAAa,gBAAgB,UAAU;CACrC,MAAM,UAAU,UAAU,MAAM;CAEhC,MAAM,EAAC,YAAY,cAAc,eAAe,aAAa,YAAY,iBAAgB;CAEzF,MAAM,QAAQ,UAAU;CAExB,MAAM,mBAAmB;AACvB,MAAG,eAAe,YAEhB,QADiB,QAAQ;WAGhB,eAAe,UAExB,QADiB,QAAQ;WAEhB,eAAe,UAExB,QADiB,QAAQ;WAEhB,eAAe,UAExB,QADiB,QAAQ;WAEhB,eAAe,QAExB,QADiB,QAAQ;WAEhB,eAAe,OAExB,QADiB,QAAQ;;CAM7B,MAAM,kBAAkB;AACtB,MAAG,eAAe,YAChB,QAAO,MAAM,QAAQ,UAAU;WACtB,eAAe,UACxB,QAAO,MAAM,QAAQ,QAAQ;WACpB,eAAe,UACxB,QAAO,MAAM,QAAQ,QAAQ;WACpB,eAAe,UACxB,QAAO,MAAM,QAAQ,QAAQ;WACpB,eAAe,QACxB,QAAO,MAAM,QAAQ,MAAM;WAClB,eAAe,OACxB,QAAO,MAAM,QAAQ,KAAK;;AAI9B,QACE,oCAAC,SAAI,WAAW,QAAQ,QACtB,oCAAC;EACC,SAAS,EAAC,MAAM,YAAY,EAAE;EAC9B,cAAc;GAAE,UAAS;GAAU,YAAW;GAAS;EACvD,MAAM;EACN,SAAS;EACT,SAAS;EACT,KAAK;EACL,QACE,oCAAC,aACC,oCAAC;GAAO,OAAO,EAAC,OAAO,WAAW,EAAC;GAAE,MAAK;GAAQ,SAAS;KACxD,aACM,EACT,oCAAC;GACG,OAAO,EAAC,OAAO,SAAQ;GACjB,MAAK;GACL,SAAS;GACT,MAAM;GACN,WAAW,QAAQ;IACnB,CACN;GAER,CACE"}

package/dist/AmbientToggleButtonGroup-Da1kkmpN.js

@@ -1,87 +0,0 @@
-import { t as isValueSelected } from "./isValueSelected-DhRqZZPu.js";
-import React, { Children, cloneElement, forwardRef, isValidElement } from "react";
-import clsx from "clsx";
-import PropTypes from "prop-types";
-import { makeStyles } from "@material-ui/core/styles";
-import { isFragment } from "react-is";
-import { capitalize } from "@material-ui/core/utils";
-
-//#region src/UI/inputs/buttons/AmbientToggleButtonGroup.jsx
-const useStyles = makeStyles((theme) => ({
-	item: { marginRight: 8 },
-	root: {
-		display: "inline-flex",
-		padding: 0
-	},
-	vertical: { flexDirection: "column" },
-	grouped: {},
-	groupedHorizontal: {
-		borderRadius: 25,
-		padding: 0,
-		paddingRight: 16,
-		"&:not(:first-child)": {
-			marginTop: 16,
-			borderRadius: 25,
-			paddingRight: 16,
-			padding: 0
-		},
-		"&:not(:last-child)": {
-			padding: 0,
-			borderRadius: 25,
-			paddingRight: 16
-		}
-	}
-}));
-const AmbientToggleButtonGroup = forwardRef(function AmbientToggleButton(props, ref) {
-	const { children, className, exclusive = false, onChange, orientation = "horizontal", size = "medium", value, ...other } = props;
-	const classes = useStyles();
-	const handleChange = (event, buttonValue) => {
-		if (!onChange) return;
-		const index = value && value.indexOf(buttonValue);
-		let newValue;
-		if (value && index >= 0) {
-			newValue = value.slice();
-			newValue.splice(index, 1);
-		} else newValue = value ? value.concat(buttonValue) : [buttonValue];
-		onChange(event, newValue);
-	};
-	const handleExclusiveChange = (event, buttonValue) => {
-		if (!onChange) return;
-		onChange(event, value === buttonValue ? null : buttonValue);
-	};
-	return /* @__PURE__ */ React.createElement("div", {
-		role: "group",
-		className: clsx(classes.root, { [classes.vertical]: orientation === "vertical" }, className),
-		ref,
-		...other
-	}, Children.map(children, (child) => {
-		if (!isValidElement(child)) return null;
-		if (process.env.NODE_ENV !== "production") {
-			if (isFragment(child)) console.error(["Material-UI: The ToggleButtonGroup component doesn't accept a Fragment as a child.", "Consider providing an array instead."].join("\n"));
-		}
-		return cloneElement(child, {
-			className: clsx(classes.grouped, classes[`grouped${capitalize(orientation)}`], child.props.className),
-			onChange: exclusive ? handleExclusiveChange : handleChange,
-			selected: child.props.selected === void 0 ? isValueSelected(child.props.value, value) : child.props.selected,
-			size: child.props.size || size
-		});
-	}));
-});
-AmbientToggleButtonGroup.propTypes = {
-	children: PropTypes.node,
-	classes: PropTypes.object,
-	className: PropTypes.string,
-	exclusive: PropTypes.bool,
-	onChange: PropTypes.func,
-	orientation: PropTypes.oneOf(["horizontal", "vertical"]),
-	size: PropTypes.oneOf([
-		"large",
-		"medium",
-		"small"
-	]),
-	value: PropTypes.any
-};
-
-//#endregion
-export { AmbientToggleButtonGroup as t };
-//# sourceMappingURL=AmbientToggleButtonGroup-Da1kkmpN.js.map

package/dist/AmbientToggleButtonGroup-Da1kkmpN.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AmbientToggleButtonGroup-Da1kkmpN.js","names":[],"sources":["../src/UI/inputs/buttons/AmbientToggleButtonGroup.jsx"],"sourcesContent":["import React, {forwardRef, Children, isValidElement, cloneElement} from 'react';\nimport { isFragment } from 'react-is';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport isValueSelected from '../../../utilities/isValueSelected';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { capitalize } from '@material-ui/core/utils';\n\nconst useStyles = makeStyles((theme) => ({\n  item: {\n    marginRight: 8\n  },\n   /* Styles applied to the root element. */\n   root: {\n    display: 'inline-flex',\n    padding: 0\n  },\n  /* Styles applied to the root element if `orientation=\"vertical\"`. */\n  vertical: {\n    flexDirection: 'column',\n  },\n  /* Styles applied to the children. */\n  grouped: {},\n  /* Styles applied to the children if `orientation=\"horizontal\"`. */\n  groupedHorizontal: {\n    borderRadius: 25,\n    padding: 0,\n    paddingRight: 16,\n  '&:not(:first-child)': {\n    marginTop: 16,\n    borderRadius: 25,\n    paddingRight: 16,\n    padding: 0\n  },\n  '&:not(:last-child)': {\n    padding: 0,\n    borderRadius: 25,\n    paddingRight: 16,\n  },\n    \n   },\n}))\n\n\n\nexport const AmbientToggleButtonGroup = forwardRef(function AmbientToggleButton(props, ref) {\n  const {\n    children,\n    // classes,\n    className,\n    exclusive = false,\n    onChange,\n    orientation = 'horizontal',\n    size = 'medium',\n    value,\n    ...other\n  } = props;\n\n  const classes = useStyles()\n\n  const handleChange = (event, buttonValue) => {\n    if (!onChange) {\n      return;\n    }\n\n    const index = value && value.indexOf(buttonValue);\n    let newValue;\n\n    if (value && index >= 0) {\n      newValue = value.slice();\n      newValue.splice(index, 1);\n    } else {\n      newValue = value ? value.concat(buttonValue) : [buttonValue];\n    }\n\n    onChange(event, newValue);\n  };\n\n  const handleExclusiveChange = (event, buttonValue) => {\n    if (!onChange) {\n      return;\n    }\n\n    onChange(event, value === buttonValue ? null : buttonValue);\n  };\n\n  return (\n    <div\n      role=\"group\"\n      className={clsx(\n        classes.root,\n        {\n          [classes.vertical]: orientation === 'vertical',\n        },\n        className,\n      )}\n      ref={ref}\n      {...other}\n    >\n      {Children.map(children, (child) => {\n        if (!isValidElement(child)) {\n          return null;\n        }\n\n        if (process.env.NODE_ENV !== 'production') {\n          if (isFragment(child)) {\n            console.error(\n              [\n                \"Material-UI: The ToggleButtonGroup component doesn't accept a Fragment as a child.\",\n                'Consider providing an array instead.',\n              ].join('\\n'),\n            );\n          }\n        }\n\n        return cloneElement(child, {\n          className: clsx(\n            classes.grouped,\n            classes[`grouped${capitalize(orientation)}`],\n            child.props.className,\n          ),\n          onChange: exclusive ? handleExclusiveChange : handleChange,\n          selected:\n            child.props.selected === undefined\n              ? isValueSelected(child.props.value, value)\n              : child.props.selected,\n          size: child.props.size || size,\n        });\n      })}\n    </div>\n  );\n});\n\nAmbientToggleButtonGroup.propTypes = {\n  // ----------------------------- Warning --------------------------------\n  // | These PropTypes are generated from the TypeScript type definitions |\n  // |     To update them edit the d.ts file and run \"yarn proptypes\"     |\n  // ----------------------------------------------------------------------\n  /**\n   * The content of the button.\n   */\n  children: PropTypes.node,\n  /**\n   * Override or extend the styles applied to the component.\n   * See [CSS API](#css) below for more details.\n   */\n  classes: PropTypes.object,\n  /**\n   * @ignore\n   */\n  className: PropTypes.string,\n  /**\n   * If `true`, only allow one of the child ToggleButton values to be selected.\n   */\n  exclusive: PropTypes.bool,\n  /**\n   * Callback fired when the value changes.\n   *\n   * @param {object} event The event source of the callback.\n   * @param {any} value of the selected buttons. When `exclusive` is true\n   * this is a single value; when false an array of selected values. If no value\n   * is selected and `exclusive` is true the value is null; when false an empty array.\n   */\n  onChange: PropTypes.func,\n  /**\n   * The group orientation (layout flow direction).\n   */\n  orientation: PropTypes.oneOf(['horizontal', 'vertical']),\n  /**\n   * The size of the buttons.\n   */\n  size: PropTypes.oneOf(['large', 'medium', 'small']),\n  /**\n   * The currently selected value within the group or an array of selected\n   * values when `exclusive` is false.\n   *\n   * The value must have reference equality with the option in order to be selected.\n   */\n  value: PropTypes.any,\n};\n\n// export default withStyles(styles, { name: 'MuiToggleButtonGroup' })(AmbientToggleButtonGroup);"],"mappings":";;;;;;;;;AAQA,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM,EACJ,aAAa,GACd;CAEA,MAAM;EACL,SAAS;EACT,SAAS;EACV;CAED,UAAU,EACR,eAAe,UAChB;CAED,SAAS,EAAE;CAEX,mBAAmB;EACjB,cAAc;EACd,SAAS;EACT,cAAc;EAChB,uBAAuB;GACrB,WAAW;GACX,cAAc;GACd,cAAc;GACd,SAAS;GACV;EACD,sBAAsB;GACpB,SAAS;GACT,cAAc;GACd,cAAc;GACf;EAEC;CACH,EAAE;AAIH,MAAa,2BAA2B,WAAW,SAAS,oBAAoB,OAAO,KAAK;CAC1F,MAAM,EACJ,UAEA,WACA,YAAY,OACZ,UACA,cAAc,cACd,OAAO,UACP,OACA,GAAG,UACD;CAEJ,MAAM,UAAU,WAAW;CAE3B,MAAM,gBAAgB,OAAO,gBAAgB;AAC3C,MAAI,CAAC,SACH;EAGF,MAAM,QAAQ,SAAS,MAAM,QAAQ,YAAY;EACjD,IAAI;AAEJ,MAAI,SAAS,SAAS,GAAG;AACvB,cAAW,MAAM,OAAO;AACxB,YAAS,OAAO,OAAO,EAAE;QAEzB,YAAW,QAAQ,MAAM,OAAO,YAAY,GAAG,CAAC,YAAY;AAG9D,WAAS,OAAO,SAAS;;CAG3B,MAAM,yBAAyB,OAAO,gBAAgB;AACpD,MAAI,CAAC,SACH;AAGF,WAAS,OAAO,UAAU,cAAc,OAAO,YAAY;;AAG7D,QACE,oCAAC;EACC,MAAK;EACL,WAAW,KACT,QAAQ,MACR,GACG,QAAQ,WAAW,gBAAgB,YACrC,EACD,UACD;EACI;EACL,GAAI;IAEH,SAAS,IAAI,WAAW,UAAU;AACjC,MAAI,CAAC,eAAe,MAAM,CACxB,QAAO;AAGT,MAAI,QAAQ,IAAI,aAAa,cAC3B;OAAI,WAAW,MAAM,CACnB,SAAQ,MACN,CACE,sFACA,uCACD,CAAC,KAAK,KAAK,CACb;;AAIL,SAAO,aAAa,OAAO;GACzB,WAAW,KACT,QAAQ,SACR,QAAQ,UAAU,WAAW,YAAY,KACzC,MAAM,MAAM,UACb;GACD,UAAU,YAAY,wBAAwB;GAC9C,UACE,MAAM,MAAM,aAAa,SACrB,gBAAgB,MAAM,MAAM,OAAO,MAAM,GACzC,MAAM,MAAM;GAClB,MAAM,MAAM,MAAM,QAAQ;GAC3B,CAAC;GACF,CACE;EAER;AAEF,yBAAyB,YAAY;CAQnC,UAAU,UAAU;CAKpB,SAAS,UAAU;CAInB,WAAW,UAAU;CAIrB,WAAW,UAAU;CASrB,UAAU,UAAU;CAIpB,aAAa,UAAU,MAAM,CAAC,cAAc,WAAW,CAAC;CAIxD,MAAM,UAAU,MAAM;EAAC;EAAS;EAAU;EAAQ,CAAC;CAOnD,OAAO,UAAU;CAClB"}

package/dist/AmbientVisualizationCard-BAGEKWJD.js

@@ -1,232 +0,0 @@
-import { t as LayoutUnit } from "./LayoutUnit-D4jJvonh.js";
-import { t as AmbientCard } from "./AmbientCard-CLW4bPCu.js";
-import { t as AmbientToggleButton } from "./AmbientToggleButton-BjyjXj8S.js";
-import { t as SummaryBlock } from "./SummaryBlock-BjUNDl4q.js";
-import { n as FluentSimpleTab, t as FluentSimpleTabs } from "./FluentSimpleTabs-Dw2U4b_m.js";
-import { t as FluentTabPanel } from "./FluentTabPanel-CkB7ruQb.js";
-import { t as AmbientToggleButtonGroup } from "./AmbientToggleButtonGroup-Da1kkmpN.js";
-import { t as AmbientVisualizer } from "./AmbientVisualizer-DQb7oRtt.js";
-import { t as TokenGroupItem } from "./TokenGroupItem-DBHuBDVC.js";
-import React, { useState } from "react";
-import { Box, Divider, Typography, makeStyles } from "@material-ui/core";
-import { MuiVegaLite } from "@material-vega/material-ui";
-
-//#region src/UI/surfaces/cards/chartDisplayCards/AmbientSplitStatCard.jsx
-const useStyles$1 = makeStyles((theme) => ({
-	rootContainer: {
-		background: "#FFFFFF",
-		boxShadow: "0px 1px 4px rgba(0, 0, 0, 0.08)",
-		borderRadius: "6px",
-		display: "flex",
-		justifyContent: "center",
-		flexDirection: "column"
-	},
-	infoContainer: {
-		display: "flex",
-		justifyContent: "center",
-		paddingLeft: theme.spacing(3)
-	},
-	divider: {
-		width: "100%",
-		height: "1px"
-	},
-	subContainer: {
-		display: "flex",
-		flexDirection: "column",
-		justifyContent: "flex-start",
-		alignItems: "center",
-		width: "100%"
-	},
-	subContainerGraph: {
-		display: "flex",
-		flexDirection: "column",
-		justifyContent: "flex-start",
-		alignItems: "start",
-		width: "100%"
-	},
-	graphContainer: {
-		display: "flex",
-		paddingLeft: theme.spacing(3)
-	}
-}));
-const defaultBlockSpecs = {
-	alertType: "default",
-	value: "0",
-	startLabel: "$",
-	label: "",
-	labelVariant: "subtitle2",
-	width: "100%",
-	style: { border: "none" }
-};
-/**
-* `AmbientSplitStatCard` component
-*/
-const AmbientSplitStatCard = (props) => {
-	const { title, subtitle, cardsSpecs, graphTitle, graphVariant, graphSpec, style } = props;
-	const classes = useStyles$1(props);
-	return /* @__PURE__ */ React.createElement("div", {
-		className: classes.rootContainer,
-		style
-	}, /* @__PURE__ */ React.createElement("div", { className: classes.infoContainer }, /* @__PURE__ */ React.createElement("div", { className: classes.subContainerGraph }, /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "xxs" }), /* @__PURE__ */ React.createElement(Typography, {
-		variant: "h6",
-		style: {
-			fontStyle: "normal",
-			fontWeight: 500,
-			fontSize: "19px"
-		}
-	}, title), /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "nudge" }), /* @__PURE__ */ React.createElement(SummaryBlock, cardsSpecs?.SummaryBlockOne || defaultBlockSpecs), /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "xxs" }), /* @__PURE__ */ React.createElement(Typography, {
-		variant: "subtitle2",
-		style: { fontWeight: 400 }
-	}, subtitle), /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "xxs" })), /* @__PURE__ */ React.createElement(Divider, { orientation: "vertical" }), /* @__PURE__ */ React.createElement("div", { className: classes.subContainer }, /* @__PURE__ */ React.createElement(SummaryBlock, cardsSpecs?.SummaryBlockTwo || defaultBlockSpecs), /* @__PURE__ */ React.createElement(Divider, {
-		orientation: "horizontal",
-		className: classes.divider
-	}), /* @__PURE__ */ React.createElement(SummaryBlock, cardsSpecs?.SummaryBlockThree || defaultBlockSpecs))), /* @__PURE__ */ React.createElement(Divider, {
-		orientation: "horizontal",
-		className: classes.divider
-	}), /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "nudge" }), /* @__PURE__ */ React.createElement("div", { className: classes.graphContainer }, /* @__PURE__ */ React.createElement(Typography, { variant: "subtitle1" }, graphTitle), /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "nudge" })), /* @__PURE__ */ React.createElement(Box, {
-		clone: true,
-		overflow: "hidden",
-		sx: {
-			width: "100%",
-			minWidth: "100%",
-			"& svg": { width: "100%" }
-		}
-	}, /* @__PURE__ */ React.createElement(MuiVegaLite, {
-		variant: graphVariant || "verticalBarChart",
-		background: "paper",
-		autoResize: true,
-		actions: false,
-		spec: graphSpec
-	})), /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "xxs" }));
-};
-
-//#endregion
-//#region src/UI/surfaces/cards/chartDisplayCards/AmbientVisualizationCard.jsx
-const useStyles = makeStyles((theme) => ({
-	root: { position: "relative" },
-	item: { marginRight: theme.spacing(2) },
-	tabPanelContents: { marginLeft: theme.spacing(2) },
-	togglePadding: { padding: theme.spacing(2) }
-}));
-const AmbientVisualizationCard = ({ title, toggleList1, toggleList2, toggleList3, tabList, tabContent1, tabContent2, tabContent3 }) => {
-	const classes = useStyles();
-	const [value, setValue] = useState(0);
-	const [toggleValue, setToggleValue] = useState("month");
-	const handleChange = (event, newValue) => {
-		setValue(newValue);
-	};
-	const selectToggle = (event, nextView) => {
-		setToggleValue(nextView);
-	};
-	return /* @__PURE__ */ React.createElement(AmbientCard, {
-		title,
-		customAdornment: " ",
-		visualization: /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(FluentTabPanel, {
-			value,
-			index: 0
-		}, /* @__PURE__ */ React.createElement("div", { className: classes.tabPanelContents }, tabContent1 && tabContent1.map((item) => {
-			return toggleValue === item.value && /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(AmbientVisualizer, {
-				values: item.values,
-				visualization: item.chartType,
-				verticalBarColor: item.verticalBarColor,
-				verticalBarBand: item.verticalBarBand,
-				verticalBarXfield: item.verticalBarXfield,
-				verticalBarXtype: item.verticalBarXtype,
-				verticalBarYfield: item.verticalBarYfield,
-				verticalBarYtype: item.verticalBarYtype,
-				styleThin: item.styleThin
-			}));
-		}))), /* @__PURE__ */ React.createElement(FluentTabPanel, {
-			value,
-			index: 1
-		}, /* @__PURE__ */ React.createElement("div", { className: classes.tabPanelContents }, tabContent2 && tabContent2.map((item) => {
-			return toggleValue === item.value && /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(AmbientVisualizer, {
-				values: item.values,
-				visualization: item.chartType,
-				verticalBarColor: item.verticalBarColor,
-				verticalBarBand: item.verticalBarBand,
-				verticalBarXfield: item.verticalBarXfield,
-				verticalBarXtype: item.verticalBarXtype,
-				verticalBarYfield: item.verticalBarYfield,
-				verticalBarYtype: item.verticalBarYtype,
-				styleThin: item.styleThin
-			}));
-		}))), /* @__PURE__ */ React.createElement(FluentTabPanel, {
-			value,
-			index: 2
-		}, /* @__PURE__ */ React.createElement("div", { className: classes.tabPanelContents }, tabContent3 && tabContent3.map((item) => {
-			return toggleValue === item.value && /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(AmbientVisualizer, {
-				values: item.values,
-				visualization: item.chartType,
-				verticalBarColor: item.verticalBarColor,
-				verticalBarBand: item.verticalBarBand,
-				verticalBarXfield: item.verticalBarXfield,
-				verticalBarXtype: item.verticalBarXtype,
-				verticalBarYfield: item.verticalBarYfield,
-				verticalBarYtype: item.verticalBarYtype,
-				styleThin: item.styleThin
-			}));
-		}))), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(FluentSimpleTabs, {
-			value,
-			onChange: handleChange,
-			"aria-label": "simple tabs example"
-		}, tabList && tabList.map((item) => {
-			return /* @__PURE__ */ React.createElement(FluentSimpleTab, { label: item.label });
-		})), /* @__PURE__ */ React.createElement(FluentTabPanel, {
-			value,
-			index: 0
-		}, /* @__PURE__ */ React.createElement("div", { className: classes.togglePadding }, /* @__PURE__ */ React.createElement(AmbientToggleButtonGroup, {
-			orientation: "horizontal",
-			value: toggleValue
-		}, toggleList1 && toggleList1.map((item) => {
-			return /* @__PURE__ */ React.createElement(AmbientToggleButton, {
-				value: item.value,
-				"aria-label": item.ariaLabel,
-				onMouseUp: item.onClick,
-				onClick: selectToggle,
-				className: classes.item
-			}, /* @__PURE__ */ React.createElement(TokenGroupItem, {
-				label: item.label,
-				icon: item.icon
-			}));
-		})))), /* @__PURE__ */ React.createElement(FluentTabPanel, {
-			value,
-			index: 1
-		}, /* @__PURE__ */ React.createElement("div", { className: classes.togglePadding }, /* @__PURE__ */ React.createElement(AmbientToggleButtonGroup, {
-			orientation: "horizontal",
-			value: toggleValue
-		}, toggleList2 && toggleList2.map((item) => {
-			return /* @__PURE__ */ React.createElement(AmbientToggleButton, {
-				value: item.value,
-				"aria-label": item.ariaLabel,
-				onMouseUp: item.onClick,
-				onClick: selectToggle,
-				className: classes.item
-			}, /* @__PURE__ */ React.createElement(TokenGroupItem, {
-				label: item.label,
-				icon: item.icon
-			}));
-		})))), /* @__PURE__ */ React.createElement(FluentTabPanel, {
-			value,
-			index: 2
-		}, /* @__PURE__ */ React.createElement("div", { className: classes.togglePadding }, /* @__PURE__ */ React.createElement(AmbientToggleButtonGroup, {
-			orientation: "horizontal",
-			value: toggleValue
-		}, toggleList3 && toggleList3.map((item) => {
-			return /* @__PURE__ */ React.createElement(AmbientToggleButton, {
-				value: item.value,
-				"aria-label": item.ariaLabel,
-				onMouseUp: item.onClick,
-				onClick: selectToggle,
-				className: classes.item
-			}, /* @__PURE__ */ React.createElement(TokenGroupItem, {
-				label: item.label,
-				icon: item.icon
-			}));
-		}))))))
-	});
-};
-
-//#endregion
-export { AmbientSplitStatCard as n, AmbientVisualizationCard as t };
-//# sourceMappingURL=AmbientVisualizationCard-BAGEKWJD.js.map