udp-react-enterprise-component-library 25.18.1-beta.54 → 25.18.1-beta.56

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (64) hide show
  1. package/dist/{AmbientVisualizationCard-Dig-Mh_G.js → AmbientVisualizationCard-BmTQR121.js} +2 -2
  2. package/dist/{AmbientVisualizationCard-Dig-Mh_G.js.map → AmbientVisualizationCard-BmTQR121.js.map} +1 -1
  3. package/dist/{AmbientVisualizer-B1Xwwe0J.js → AmbientVisualizer-BABKxgsK.js} +1 -1
  4. package/dist/{AmbientVisualizer-B1Xwwe0J.js.map → AmbientVisualizer-BABKxgsK.js.map} +1 -1
  5. package/dist/{CardList-BPNGTxsh.js → CardList-B8nTYXo7.js} +1 -1
  6. package/dist/{CardList-BPNGTxsh.js.map → CardList-B8nTYXo7.js.map} +1 -1
  7. package/dist/{Directory-CoEKdRkU.js → Directory-MpK8T6IZ.js} +1 -1
  8. package/dist/{Directory-CoEKdRkU.js.map → Directory-MpK8T6IZ.js.map} +1 -1
  9. package/dist/{EntityHeader-DKkYwvsi.js → EntityHeader-C3Ae5BLK.js} +1 -1
  10. package/dist/{EntityHeader-DKkYwvsi.js.map → EntityHeader-C3Ae5BLK.js.map} +1 -1
  11. package/dist/{FieldArrayCard-C1I5_qJ4.js → FieldArrayCard-Ds_ysYWL.js} +2 -2
  12. package/dist/{FieldArrayCard-C1I5_qJ4.js.map → FieldArrayCard-Ds_ysYWL.js.map} +1 -1
  13. package/dist/{FluentLink-D-gKioCQ.js → FluentLink-CkA7BUEB.js} +1 -1
  14. package/dist/{FluentLink-D-gKioCQ.js.map → FluentLink-CkA7BUEB.js.map} +1 -1
  15. package/dist/{FluentSelectMenu-BEREJbe-.js → FluentSelectMenu-Cx274cVa.js} +1 -1
  16. package/dist/{FluentSelectMenu-BEREJbe-.js.map → FluentSelectMenu-Cx274cVa.js.map} +1 -1
  17. package/dist/{FluentSimpleSelect-Djff-up8.js → FluentSimpleSelect-BfoxBQj4.js} +2 -2
  18. package/dist/{FluentSimpleSelect-Djff-up8.js.map → FluentSimpleSelect-BfoxBQj4.js.map} +1 -1
  19. package/dist/{FluentTimePicker-hNcocKsd.js → FluentTimePicker-BFxFcgvX.js} +1 -1
  20. package/dist/{FluentTimePicker-hNcocKsd.js.map → FluentTimePicker-BFxFcgvX.js.map} +1 -1
  21. package/dist/{GraphCard-Dv4a99wo.js → GraphCard-BhcSveF4.js} +1 -1
  22. package/dist/{GraphCard-Dv4a99wo.js.map → GraphCard-BhcSveF4.js.map} +1 -1
  23. package/dist/{IconKey-D7fZ_U4O.js → IconKey-BLHF3hfg.js} +1 -1
  24. package/dist/{IconKey-D7fZ_U4O.js.map → IconKey-BLHF3hfg.js.map} +1 -1
  25. package/dist/{Notes-UkwV2z4D.js → Notes-YAF2dipI.js} +1 -1
  26. package/dist/{Notes-UkwV2z4D.js.map → Notes-YAF2dipI.js.map} +1 -1
  27. package/dist/{PaymentForm-CtrVBoH8.js → PaymentForm-DFJrSIy8.js} +2 -2
  28. package/dist/{PaymentForm-CtrVBoH8.js.map → PaymentForm-DFJrSIy8.js.map} +1 -1
  29. package/dist/{TicketCard-IqCCKSc0.js → TicketCard-CpttpQoj.js} +1 -1
  30. package/dist/{TicketCard-IqCCKSc0.js.map → TicketCard-CpttpQoj.js.map} +1 -1
  31. package/dist/UI/dataDisplay/GraphCard/index.js +1 -1
  32. package/dist/UI/dataDisplay/cardList/index.js +1 -1
  33. package/dist/UI/dataDisplay/directory/index.js +1 -1
  34. package/dist/UI/dataDisplay/entityHeader/index.js +1 -1
  35. package/dist/UI/dataDisplay/map/index.js +1 -1
  36. package/dist/UI/dataDisplay/notes/index.js +1 -1
  37. package/dist/UI/dataDisplay/ticketCard/index.js +1 -1
  38. package/dist/UI/dataDisplay/visualization/index.js +1 -1
  39. package/dist/UI/inputs/fieldArrayCard/index.js +1 -1
  40. package/dist/UI/inputs/link/index.js +1 -1
  41. package/dist/UI/inputs/menus/index.js +2 -2
  42. package/dist/UI/inputs/pickers/index.js +2 -2
  43. package/dist/UI/surfaces/cards/chartDisplayCards/index.js +1 -1
  44. package/dist/{pickers-B-bB40GS.js → UdpTimeSelector-Dc5RiWq-.js} +1 -1
  45. package/dist/UdpTimeSelector-Dc5RiWq-.js.map +1 -0
  46. package/dist/{UdpTransactionsPage-CCcw7ZRU.js → UdpTransactionsPage-CNl_xeZO.js} +126 -47
  47. package/dist/UdpTransactionsPage-CNl_xeZO.js.map +1 -0
  48. package/dist/index.js +18 -18
  49. package/dist/types/src/maintenanceEngine/tableBrowser/TableColumnDefs.d.ts +1 -1
  50. package/dist/types/src/maintenanceEngine/tableBrowser/TableColumnDefs.d.ts.map +1 -1
  51. package/dist/types/src/udp/pages/UdpTransactionsPage/components/EditTransactionDetailsForm.d.ts.map +1 -1
  52. package/dist/types/src/udp/pages/UdpTransactionsPage/components/EditTransactionDetailsFormFields.d.ts +1 -0
  53. package/dist/types/src/udp/pages/UdpTransactionsPage/components/EditTransactionDetailsFormFields.d.ts.map +1 -1
  54. package/dist/types/tsconfig.tsbuildinfo +1 -1
  55. package/dist/udp/pages/UdpPages/index.js +1 -1
  56. package/dist/udp/pages/UdpTransactionsPage/index.js +1 -1
  57. package/dist/uploader/index.js +1 -1
  58. package/dist/{uploader-CGVZIlR1.js → uploader-YWjDebFN.js} +1 -1
  59. package/dist/{uploader-CGVZIlR1.js.map → uploader-YWjDebFN.js.map} +1 -1
  60. package/dist/utilities/form/paymentForm/index.js +1 -1
  61. package/export-map.json +1 -1
  62. package/package.json +2 -2
  63. package/dist/UdpTransactionsPage-CCcw7ZRU.js.map +0 -1
  64. package/dist/pickers-B-bB40GS.js.map +0 -1
@@ -5,7 +5,7 @@ import { t as SummaryBlock } from "./SummaryBlock-BjUNDl4q.js";
5
5
  import { n as FluentSimpleTab, t as FluentSimpleTabs } from "./FluentSimpleTabs-BghyAzdO.js";
6
6
  import { t as FluentTabPanel } from "./FluentTabPanel-DZPtDTkV.js";
7
7
  import { t as AmbientToggleButtonGroup } from "./AmbientToggleButtonGroup-Bi9yW5gC.js";
8
- import { t as AmbientVisualizer } from "./AmbientVisualizer-B1Xwwe0J.js";
8
+ import { t as AmbientVisualizer } from "./AmbientVisualizer-BABKxgsK.js";
9
9
  import { t as TokenGroupItem } from "./TokenGroupItem-BK0dx4cD.js";
10
10
  import React, { useState } from "react";
11
11
  import { Box, Divider, Typography, makeStyles } from "@material-ui/core";
@@ -229,4 +229,4 @@ const AmbientVisualizationCard = ({ title, toggleList1, toggleList2, toggleList3
229
229
 
230
230
  //#endregion
231
231
  export { AmbientSplitStatCard as n, AmbientVisualizationCard as t };
232
- //# sourceMappingURL=AmbientVisualizationCard-Dig-Mh_G.js.map
232
+ //# sourceMappingURL=AmbientVisualizationCard-BmTQR121.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"AmbientVisualizationCard-Dig-Mh_G.js","names":["useStyles"],"sources":["../src/UI/surfaces/cards/chartDisplayCards/AmbientSplitStatCard.jsx","../src/UI/surfaces/cards/chartDisplayCards/AmbientVisualizationCard.jsx"],"sourcesContent":["import React from 'react';\nimport { makeStyles, Typography, Divider, Box } from '@material-ui/core';\nimport { SummaryBlock } from '../../../dataDisplay/SummaryBlock';\nimport { MuiVegaLite } from '@material-vega/material-ui';\nimport { LayoutUnit } from '../../../../layout/LayoutUnit';\n\nconst useStyles = makeStyles((theme) => ({\n rootContainer: {\n background: '#FFFFFF',\n boxShadow: '0px 1px 4px rgba(0, 0, 0, 0.08)',\n borderRadius: '6px',\n display: 'flex',\n justifyContent: 'center',\n flexDirection: 'column'\n },\n infoContainer: {\n display: 'flex',\n justifyContent: 'center',\n paddingLeft: theme.spacing(3)\n },\n divider: {\n width: '100%',\n height: '1px'\n },\n subContainer: {\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'flex-start',\n alignItems: 'center',\n width: '100%'\n },\n subContainerGraph: {\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'flex-start',\n alignItems: 'start',\n width: '100%'\n },\n graphContainer: {\n display: 'flex',\n paddingLeft: theme.spacing(3)\n }\n}));\n\nconst defaultBlockSpecs = {\n alertType: 'default',\n value: '0',\n startLabel: '$',\n label: '',\n labelVariant: 'subtitle2',\n width: '100%',\n style: { border: 'none' }\n};\n\n/**\n * `AmbientSplitStatCard` component\n */\nexport const AmbientSplitStatCard = (props) => {\n const {\n title,\n subtitle,\n cardsSpecs,\n graphTitle,\n graphVariant,\n graphSpec,\n style\n } = props;\n\n const classes = useStyles(props);\n\n return (\n <div className={classes.rootContainer} style={style}>\n <div className={classes.infoContainer}>\n <div className={classes.subContainerGraph}>\n <LayoutUnit unit='xxs' />\n <Typography\n variant='h6'\n style={{\n fontStyle: 'normal',\n fontWeight: 500,\n fontSize: '19px'\n }}\n >\n {title}\n </Typography>\n <LayoutUnit unit='nudge' />\n <SummaryBlock\n {...(cardsSpecs?.SummaryBlockOne || defaultBlockSpecs)}\n />\n <LayoutUnit unit='xxs' />\n <Typography variant='subtitle2' style={{ fontWeight: 400 }}>\n {subtitle}\n </Typography>\n <LayoutUnit unit='xxs' />\n </div>\n <Divider orientation='vertical' />\n <div className={classes.subContainer}>\n <SummaryBlock\n {...(cardsSpecs?.SummaryBlockTwo || defaultBlockSpecs)}\n />\n <Divider orientation='horizontal' className={classes.divider} />\n <SummaryBlock\n {...(cardsSpecs?.SummaryBlockThree || defaultBlockSpecs)}\n />\n </div>\n </div>\n <Divider orientation='horizontal' className={classes.divider} />\n <LayoutUnit unit='nudge' />\n <div className={classes.graphContainer}>\n <Typography variant='subtitle1'>{graphTitle}</Typography>\n <LayoutUnit unit='nudge' />\n </div>\n <Box\n clone\n overflow='hidden'\n sx={{\n width: '100%',\n minWidth: '100%',\n '& svg': {\n width: '100%'\n }\n }}\n >\n <MuiVegaLite\n variant={graphVariant || 'verticalBarChart'}\n background='paper'\n autoResize\n actions={false}\n spec={graphSpec}\n />\n </Box>\n <LayoutUnit unit='xxs' />\n </div>\n );\n};\n","import React, { useState } from 'react';\nimport { makeStyles } from '@material-ui/core';\nimport { AmbientToggleButton } from '../../../inputs/buttons/AmbientToggleButton';\nimport { AmbientToggleButtonGroup } from '../../../inputs/buttons/AmbientToggleButtonGroup';\nimport { TokenGroupItem } from '../../../templates/ui/TokenGroupItem';\nimport { FluentTabPanel } from '../../../navigation/tabs/defaultTabs/FluentTabPanel';\nimport { FluentSimpleTab } from '../../../navigation/tabs/defaultTabs/FluentSimpleTab';\nimport { FluentSimpleTabs } from '../../../navigation/tabs/defaultTabs/FluentSimpleTabs';\nimport { AmbientVisualizer } from '../../../dataDisplay/visualization/AmbientVisualizer';\nimport { AmbientCard } from '../AmbientCard';\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n position: 'relative'\n },\n item: {\n marginRight: theme.spacing(2)\n },\n tabPanelContents: {\n marginLeft: theme.spacing(2)\n },\n togglePadding: {\n padding: theme.spacing(2)\n }\n}));\n\nexport const AmbientVisualizationCard = ({\n title,\n toggleList1,\n toggleList2,\n toggleList3,\n tabList,\n tabContent1,\n tabContent2,\n tabContent3\n}) => {\n const classes = useStyles();\n\n const [value, setValue] = useState(0);\n const [toggleValue, setToggleValue] = useState('month');\n\n const handleChange = (event, newValue) => {\n setValue(newValue);\n };\n\n const selectToggle = (event, nextView) => {\n setToggleValue(nextView);\n };\n\n return (\n <AmbientCard\n title={title}\n customAdornment=' '\n visualization={\n <div>\n <FluentTabPanel value={value} index={0}>\n <div className={classes.tabPanelContents}>\n {tabContent1 &&\n tabContent1.map((item) => {\n return (\n toggleValue === item.value && (\n <div>\n <AmbientVisualizer\n values={item.values}\n visualization={item.chartType}\n verticalBarColor={item.verticalBarColor}\n verticalBarBand={item.verticalBarBand}\n verticalBarXfield={item.verticalBarXfield}\n verticalBarXtype={item.verticalBarXtype}\n verticalBarYfield={item.verticalBarYfield}\n verticalBarYtype={item.verticalBarYtype}\n styleThin={item.styleThin}\n />\n </div>\n )\n );\n })}\n </div>\n </FluentTabPanel>\n <FluentTabPanel value={value} index={1}>\n <div className={classes.tabPanelContents}>\n {tabContent2 &&\n tabContent2.map((item) => {\n return (\n toggleValue === item.value && (\n <div>\n <AmbientVisualizer\n values={item.values}\n visualization={item.chartType}\n verticalBarColor={item.verticalBarColor}\n verticalBarBand={item.verticalBarBand}\n verticalBarXfield={item.verticalBarXfield}\n verticalBarXtype={item.verticalBarXtype}\n verticalBarYfield={item.verticalBarYfield}\n verticalBarYtype={item.verticalBarYtype}\n styleThin={item.styleThin}\n />\n </div>\n )\n );\n })}\n </div>\n </FluentTabPanel>\n <FluentTabPanel value={value} index={2}>\n <div className={classes.tabPanelContents}>\n {tabContent3 &&\n tabContent3.map((item) => {\n return (\n toggleValue === item.value && (\n <div>\n <AmbientVisualizer\n values={item.values}\n visualization={item.chartType}\n verticalBarColor={item.verticalBarColor}\n verticalBarBand={item.verticalBarBand}\n verticalBarXfield={item.verticalBarXfield}\n verticalBarXtype={item.verticalBarXtype}\n verticalBarYfield={item.verticalBarYfield}\n verticalBarYtype={item.verticalBarYtype}\n styleThin={item.styleThin}\n />\n </div>\n )\n );\n })}\n </div>\n </FluentTabPanel>\n <div>\n <FluentSimpleTabs\n value={value}\n onChange={handleChange}\n aria-label='simple tabs example'\n >\n {tabList &&\n tabList.map((item) => {\n return <FluentSimpleTab label={item.label} />;\n })}\n </FluentSimpleTabs>\n\n <FluentTabPanel value={value} index={0}>\n <div className={classes.togglePadding}>\n <AmbientToggleButtonGroup\n orientation='horizontal'\n value={toggleValue}\n >\n {toggleList1 &&\n toggleList1.map((item) => {\n return (\n <AmbientToggleButton\n value={item.value}\n aria-label={item.ariaLabel}\n onMouseUp={item.onClick}\n onClick={selectToggle}\n className={classes.item}\n >\n <TokenGroupItem label={item.label} icon={item.icon} />\n </AmbientToggleButton>\n );\n })}\n </AmbientToggleButtonGroup>\n </div>\n </FluentTabPanel>\n <FluentTabPanel value={value} index={1}>\n <div className={classes.togglePadding}>\n <AmbientToggleButtonGroup\n orientation='horizontal'\n value={toggleValue}\n >\n {toggleList2 &&\n toggleList2.map((item) => {\n return (\n <AmbientToggleButton\n value={item.value}\n aria-label={item.ariaLabel}\n onMouseUp={item.onClick}\n onClick={selectToggle}\n className={classes.item}\n >\n <TokenGroupItem label={item.label} icon={item.icon} />\n </AmbientToggleButton>\n );\n })}\n </AmbientToggleButtonGroup>\n </div>\n </FluentTabPanel>\n <FluentTabPanel value={value} index={2}>\n <div className={classes.togglePadding}>\n <AmbientToggleButtonGroup\n orientation='horizontal'\n value={toggleValue}\n >\n {toggleList3 &&\n toggleList3.map((item) => {\n return (\n <AmbientToggleButton\n value={item.value}\n aria-label={item.ariaLabel}\n onMouseUp={item.onClick}\n onClick={selectToggle}\n className={classes.item}\n >\n <TokenGroupItem label={item.label} icon={item.icon} />\n </AmbientToggleButton>\n );\n })}\n </AmbientToggleButtonGroup>\n </div>\n </FluentTabPanel>\n </div>\n </div>\n }\n />\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"AmbientVisualizationCard-BmTQR121.js","names":["useStyles"],"sources":["../src/UI/surfaces/cards/chartDisplayCards/AmbientSplitStatCard.jsx","../src/UI/surfaces/cards/chartDisplayCards/AmbientVisualizationCard.jsx"],"sourcesContent":["import React from 'react';\nimport { makeStyles, Typography, Divider, Box } from '@material-ui/core';\nimport { SummaryBlock } from '../../../dataDisplay/SummaryBlock';\nimport { MuiVegaLite } from '@material-vega/material-ui';\nimport { LayoutUnit } from '../../../../layout/LayoutUnit';\n\nconst useStyles = makeStyles((theme) => ({\n rootContainer: {\n background: '#FFFFFF',\n boxShadow: '0px 1px 4px rgba(0, 0, 0, 0.08)',\n borderRadius: '6px',\n display: 'flex',\n justifyContent: 'center',\n flexDirection: 'column'\n },\n infoContainer: {\n display: 'flex',\n justifyContent: 'center',\n paddingLeft: theme.spacing(3)\n },\n divider: {\n width: '100%',\n height: '1px'\n },\n subContainer: {\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'flex-start',\n alignItems: 'center',\n width: '100%'\n },\n subContainerGraph: {\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'flex-start',\n alignItems: 'start',\n width: '100%'\n },\n graphContainer: {\n display: 'flex',\n paddingLeft: theme.spacing(3)\n }\n}));\n\nconst defaultBlockSpecs = {\n alertType: 'default',\n value: '0',\n startLabel: '$',\n label: '',\n labelVariant: 'subtitle2',\n width: '100%',\n style: { border: 'none' }\n};\n\n/**\n * `AmbientSplitStatCard` component\n */\nexport const AmbientSplitStatCard = (props) => {\n const {\n title,\n subtitle,\n cardsSpecs,\n graphTitle,\n graphVariant,\n graphSpec,\n style\n } = props;\n\n const classes = useStyles(props);\n\n return (\n <div className={classes.rootContainer} style={style}>\n <div className={classes.infoContainer}>\n <div className={classes.subContainerGraph}>\n <LayoutUnit unit='xxs' />\n <Typography\n variant='h6'\n style={{\n fontStyle: 'normal',\n fontWeight: 500,\n fontSize: '19px'\n }}\n >\n {title}\n </Typography>\n <LayoutUnit unit='nudge' />\n <SummaryBlock\n {...(cardsSpecs?.SummaryBlockOne || defaultBlockSpecs)}\n />\n <LayoutUnit unit='xxs' />\n <Typography variant='subtitle2' style={{ fontWeight: 400 }}>\n {subtitle}\n </Typography>\n <LayoutUnit unit='xxs' />\n </div>\n <Divider orientation='vertical' />\n <div className={classes.subContainer}>\n <SummaryBlock\n {...(cardsSpecs?.SummaryBlockTwo || defaultBlockSpecs)}\n />\n <Divider orientation='horizontal' className={classes.divider} />\n <SummaryBlock\n {...(cardsSpecs?.SummaryBlockThree || defaultBlockSpecs)}\n />\n </div>\n </div>\n <Divider orientation='horizontal' className={classes.divider} />\n <LayoutUnit unit='nudge' />\n <div className={classes.graphContainer}>\n <Typography variant='subtitle1'>{graphTitle}</Typography>\n <LayoutUnit unit='nudge' />\n </div>\n <Box\n clone\n overflow='hidden'\n sx={{\n width: '100%',\n minWidth: '100%',\n '& svg': {\n width: '100%'\n }\n }}\n >\n <MuiVegaLite\n variant={graphVariant || 'verticalBarChart'}\n background='paper'\n autoResize\n actions={false}\n spec={graphSpec}\n />\n </Box>\n <LayoutUnit unit='xxs' />\n </div>\n );\n};\n","import React, { useState } from 'react';\nimport { makeStyles } from '@material-ui/core';\nimport { AmbientToggleButton } from '../../../inputs/buttons/AmbientToggleButton';\nimport { AmbientToggleButtonGroup } from '../../../inputs/buttons/AmbientToggleButtonGroup';\nimport { TokenGroupItem } from '../../../templates/ui/TokenGroupItem';\nimport { FluentTabPanel } from '../../../navigation/tabs/defaultTabs/FluentTabPanel';\nimport { FluentSimpleTab } from '../../../navigation/tabs/defaultTabs/FluentSimpleTab';\nimport { FluentSimpleTabs } from '../../../navigation/tabs/defaultTabs/FluentSimpleTabs';\nimport { AmbientVisualizer } from '../../../dataDisplay/visualization/AmbientVisualizer';\nimport { AmbientCard } from '../AmbientCard';\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n position: 'relative'\n },\n item: {\n marginRight: theme.spacing(2)\n },\n tabPanelContents: {\n marginLeft: theme.spacing(2)\n },\n togglePadding: {\n padding: theme.spacing(2)\n }\n}));\n\nexport const AmbientVisualizationCard = ({\n title,\n toggleList1,\n toggleList2,\n toggleList3,\n tabList,\n tabContent1,\n tabContent2,\n tabContent3\n}) => {\n const classes = useStyles();\n\n const [value, setValue] = useState(0);\n const [toggleValue, setToggleValue] = useState('month');\n\n const handleChange = (event, newValue) => {\n setValue(newValue);\n };\n\n const selectToggle = (event, nextView) => {\n setToggleValue(nextView);\n };\n\n return (\n <AmbientCard\n title={title}\n customAdornment=' '\n visualization={\n <div>\n <FluentTabPanel value={value} index={0}>\n <div className={classes.tabPanelContents}>\n {tabContent1 &&\n tabContent1.map((item) => {\n return (\n toggleValue === item.value && (\n <div>\n <AmbientVisualizer\n values={item.values}\n visualization={item.chartType}\n verticalBarColor={item.verticalBarColor}\n verticalBarBand={item.verticalBarBand}\n verticalBarXfield={item.verticalBarXfield}\n verticalBarXtype={item.verticalBarXtype}\n verticalBarYfield={item.verticalBarYfield}\n verticalBarYtype={item.verticalBarYtype}\n styleThin={item.styleThin}\n />\n </div>\n )\n );\n })}\n </div>\n </FluentTabPanel>\n <FluentTabPanel value={value} index={1}>\n <div className={classes.tabPanelContents}>\n {tabContent2 &&\n tabContent2.map((item) => {\n return (\n toggleValue === item.value && (\n <div>\n <AmbientVisualizer\n values={item.values}\n visualization={item.chartType}\n verticalBarColor={item.verticalBarColor}\n verticalBarBand={item.verticalBarBand}\n verticalBarXfield={item.verticalBarXfield}\n verticalBarXtype={item.verticalBarXtype}\n verticalBarYfield={item.verticalBarYfield}\n verticalBarYtype={item.verticalBarYtype}\n styleThin={item.styleThin}\n />\n </div>\n )\n );\n })}\n </div>\n </FluentTabPanel>\n <FluentTabPanel value={value} index={2}>\n <div className={classes.tabPanelContents}>\n {tabContent3 &&\n tabContent3.map((item) => {\n return (\n toggleValue === item.value && (\n <div>\n <AmbientVisualizer\n values={item.values}\n visualization={item.chartType}\n verticalBarColor={item.verticalBarColor}\n verticalBarBand={item.verticalBarBand}\n verticalBarXfield={item.verticalBarXfield}\n verticalBarXtype={item.verticalBarXtype}\n verticalBarYfield={item.verticalBarYfield}\n verticalBarYtype={item.verticalBarYtype}\n styleThin={item.styleThin}\n />\n </div>\n )\n );\n })}\n </div>\n </FluentTabPanel>\n <div>\n <FluentSimpleTabs\n value={value}\n onChange={handleChange}\n aria-label='simple tabs example'\n >\n {tabList &&\n tabList.map((item) => {\n return <FluentSimpleTab label={item.label} />;\n })}\n </FluentSimpleTabs>\n\n <FluentTabPanel value={value} index={0}>\n <div className={classes.togglePadding}>\n <AmbientToggleButtonGroup\n orientation='horizontal'\n value={toggleValue}\n >\n {toggleList1 &&\n toggleList1.map((item) => {\n return (\n <AmbientToggleButton\n value={item.value}\n aria-label={item.ariaLabel}\n onMouseUp={item.onClick}\n onClick={selectToggle}\n className={classes.item}\n >\n <TokenGroupItem label={item.label} icon={item.icon} />\n </AmbientToggleButton>\n );\n })}\n </AmbientToggleButtonGroup>\n </div>\n </FluentTabPanel>\n <FluentTabPanel value={value} index={1}>\n <div className={classes.togglePadding}>\n <AmbientToggleButtonGroup\n orientation='horizontal'\n value={toggleValue}\n >\n {toggleList2 &&\n toggleList2.map((item) => {\n return (\n <AmbientToggleButton\n value={item.value}\n aria-label={item.ariaLabel}\n onMouseUp={item.onClick}\n onClick={selectToggle}\n className={classes.item}\n >\n <TokenGroupItem label={item.label} icon={item.icon} />\n </AmbientToggleButton>\n );\n })}\n </AmbientToggleButtonGroup>\n </div>\n </FluentTabPanel>\n <FluentTabPanel value={value} index={2}>\n <div className={classes.togglePadding}>\n <AmbientToggleButtonGroup\n orientation='horizontal'\n value={toggleValue}\n >\n {toggleList3 &&\n toggleList3.map((item) => {\n return (\n <AmbientToggleButton\n value={item.value}\n aria-label={item.ariaLabel}\n onMouseUp={item.onClick}\n onClick={selectToggle}\n className={classes.item}\n >\n <TokenGroupItem label={item.label} icon={item.icon} />\n </AmbientToggleButton>\n );\n })}\n </AmbientToggleButtonGroup>\n </div>\n </FluentTabPanel>\n </div>\n </div>\n }\n />\n );\n};\n"],"mappings":"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"}
@@ -624,4 +624,4 @@ const AmbientVisualizer = ({ values, visualization, verticalBarWidth = 70, verti
624
624
 
625
625
  //#endregion
626
626
  export { GaugeGraph as n, RatioVisulization as r, AmbientVisualizer as t };
627
- //# sourceMappingURL=AmbientVisualizer-B1Xwwe0J.js.map
627
+ //# sourceMappingURL=AmbientVisualizer-BABKxgsK.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"AmbientVisualizer-B1Xwwe0J.js","names":["n","FluentDisplayNumbers"],"sources":["../src/UI/dataDisplay/visualization/RatioVisulization.jsx","../src/UI/dataDisplay/visualization/GaugeGraph.jsx","../src/UI/dataDisplay/visualization/AmbientVisualizer.jsx"],"sourcesContent":["import React, {useState} from 'react'\nimport FluentDisplayNumbers from '../../widgets/FluentComponents/atoms/FluentDisplayNumbers'\nimport {makeStyles, Typography } from '@material-ui/core'\nimport { LayoutUnit } from '../../../layout/LayoutUnit'\n\nconst useStyles = makeStyles(\n (theme) => ({\n root: {\n display: 'flex',\n justifyContent: 'center',\n // flexDirection: 'column',\n },\n wrapper: {\n display: 'flex',\n flexDirection: 'row',\n // justifyContent: 'center',\n height: 150,\n color: theme.palette.secondary.main\n }\n }),\n { next: 'RadioVisualization' }\n)\n\n\nexport const RatioVisulization = ({title, n, m}) => {\n\n const [val, setVal] = useState()\n\n const classes = useStyles()\n\n // In the ratio m : n, the quantities (numbers) m and n are called the terms of the ratio. \n // The first term (i.e. m) is called antecedent and the second term (i.e. is n) is called consequent.\n\n // 15/25 = (15 ÷ 5)/(25 ÷ 5) = 3/5\n\n\n\n function number_test(n)\n{\n const result = (n - Math.floor(n)) !== 0; \n \n if (result)\n return false\n else\n return true\n }\n\n console.log(number_test(10));\n\n\nconst loopReduceRatio = (n,m) => {\n let i = 0\n let options = []\n let test = []\n\n while (i < 9) {\n\n const ren = test.length + 1\n\n const nr = n/ren\n const mr = m/ren\n test.push(nr)\n\n number_test(nr) && number_test(mr) && options.push(nr, mr)\n i++\n\n \n let commonN = []\n let commonM = []\n\n const nVal = options.map((item => {\n return commonN.push(n / item)\n }))\n \n const mVal = options.map((item => {\n return commonM.push(m / item)\n }))\n\n\n // setVal(nVal)\n\n // commonN.push(nVal)\n // commonM.push(mVal)\n \n\n const intersection = commonN.filter(element => commonM.includes(element));\n\n console.log('options', intersection)\n\n const intersectionT = intersection.filter(function(item) {\n return item !== 1\n })\n\n setVal(intersectionT)\n \n }\n\n}\n\n\n\n// console.log('RATIO:' , loopReduceRatio(15, 25))\n\n\n return (\n <div className={classes.root} >\n <div>{val && val.map((item => {\n return (\n item\n )\n }))}</div>\n {/* <button onClick={()=>loopReduceRatio(15,25)} >Test</button> */}\n <div >\n <Typography variant=\"subtitle2\" > Student to Teature Ratio </Typography>\n <LayoutUnit unit=\"xs\" />\n <div className={classes.wrapper} >\n <FluentDisplayNumbers number={n} label=\"Teacher\" />\n <FluentDisplayNumbers number=\":\" />\n <FluentDisplayNumbers number={m} label=\"Students\" />\n </div>\n </div>\n </div>\n \n \n )\n\n}","import React from 'react';\nimport { Vega } from 'react-vega';\nimport { useTheme, lighten } from '@material-ui/core';\nimport { getEllipseColor } from '../../../utilities/style/colorConverter';\n\nexport const GaugeGraph = (props) => {\n const {\n title = '',\n unitLabel = '',\n legend = '',\n showTicks = false,\n ticksNumber = 6,\n backgroundColor,\n fillColor = 'warning',\n value = 0,\n minValue = 0,\n maxValue = 100,\n width = 350,\n height = 180\n } = props;\n const theme = useTheme();\n\n const specs = {\n $schema: 'https://vega.github.io/schema/vega/v5.json',\n width: width,\n height: height,\n padding: { left: 0, right: 0, top: 0, bottom: 0 },\n data: [\n {\n name: 'ticks',\n transform: [\n {\n type: 'sequence',\n as: 'data',\n start: {\n signal: '0'\n },\n stop: {\n signal: '(maxValue - minValue) + 0.1'\n },\n step: {\n signal: '(maxValue - minValue)/(ticksNumber-1)'\n }\n },\n {\n type: 'formula',\n expr: 'datum.data + minValue',\n as: 'data_2'\n },\n {\n type: 'formula',\n as: 'radianRef',\n expr: 'PI * (datum.data/(maxValue - minValue))'\n },\n {\n type: 'formula',\n as: 'x',\n expr: 'centerX - ((outerRadius - (outerRadius - innerRadius) * 0.6) * cos(datum.radianRef))'\n },\n {\n type: 'formula',\n as: 'y',\n expr: 'centerY - ((outerRadius - (outerRadius - innerRadius) * 0.7) * sin(datum.radianRef))'\n }\n ]\n }\n ],\n signals: [\n {\n name: 'centerX',\n update: 'width/2'\n },\n {\n name: 'centerY',\n update: 'height/2 + outerRadius/2'\n },\n {\n name: 'outerRadius',\n update: 'targetValue ? radiusRef * 0.9 : radiusRef * 0.95'\n },\n {\n name: 'radiusRef',\n update: 'max(width/2, height/2)' // TODO: Important max or min functions are allowed\n },\n {\n name: 'innerRadius',\n update: 'outerRadius - outerRadius * 0.25'\n },\n {\n name: 'targetValue',\n value: value\n },\n {\n name: 'backgroundColor',\n value: backgroundColor\n ? lighten(getEllipseColor(theme, backgroundColor), 0.6)\n : lighten(theme.palette.secondary.main, 0.6)\n },\n {\n name: 'ticksNumber',\n value: ticksNumber\n },\n {\n name: 'mainValue',\n value: value\n },\n {\n name: 'title',\n value: title\n },\n {\n name: 'unit',\n value: unitLabel\n },\n {\n name: 'usedValue',\n update: 'min(max(minValue, mainValue), maxValue)'\n },\n {\n name: 'minValue',\n value: minValue\n },\n {\n name: 'maxValue',\n value: maxValue\n },\n {\n name: 'fillColor',\n value: fillColor\n ? getEllipseColor(theme, fillColor)\n : theme.palette.secondary.main\n },\n {\n name: 'ticksColor',\n value: theme.palette.text.primary\n },\n {\n name: 'showTicks',\n value: showTicks\n },\n {\n name: 'fontFactor',\n update: '(radiusRef/5)/25'\n },\n {\n name: 'hasTarget',\n update: 'isNumber(targetValue) === true'\n },\n {\n name: 'targetRule',\n update:\n '(showTarget && hasTarget && (minValue <= targetValue) && (targetValue <= maxValue)) ? 1 : 0'\n },\n {\n name: 'showTarget',\n value: true\n },\n {\n name: 'targetStatus',\n update:\n 'mainValue === targetValue ? 0 : mainValue > targetValue ? lowIsGood ? -1 : 1 : lowIsGood ? 1 : -1'\n },\n {\n name: 'lowIsGood',\n value: false\n },\n {\n name: 'legend',\n value: legend\n }\n ],\n scales: [\n {\n name: 'gaugeScale',\n type: 'linear',\n domain: { data: 'ticks', field: 'data_2' },\n zero: false,\n range: { signal: '[-PI/2, PI/2]' }\n },\n {\n name: 'tickScale',\n type: 'linear',\n domain: { data: 'ticks', field: 'data' },\n range: { signal: '[PI/2, -PI/2]' }\n },\n {\n name: 'targetStatusColorScale',\n domain: [-1, 0, 1],\n range: ['red', 'orange', 'green']\n }\n ],\n axes: [],\n legends: [],\n marks: [\n {\n type: 'arc',\n name: 'gauge',\n encode: {\n enter: {\n x: { signal: 'centerX' },\n y: { signal: 'centerY' },\n startAngle: { signal: '-PI/2' },\n endAngle: { signal: 'PI/2' },\n outerRadius: { signal: 'outerRadius' },\n innerRadius: { signal: 'innerRadius' },\n fill: { signal: 'backgroundColor' }\n }\n }\n },\n {\n type: 'arc',\n encode: {\n enter: {\n startAngle: { signal: '-PI/2' }\n },\n update: {\n x: { signal: 'centerX' },\n y: { signal: 'centerY' },\n innerRadius: { signal: 'innerRadius' },\n outerRadius: { signal: 'outerRadius' },\n endAngle: { scale: 'gaugeScale', signal: 'usedValue' },\n fill: { signal: 'fillColor' }\n }\n }\n },\n {\n type: 'arc',\n description: 'ticks on the arc',\n from: { data: 'ticks' },\n encode: {\n enter: {\n x: { signal: 'centerX' },\n y: { signal: 'centerY' },\n outerRadius: { signal: 'outerRadius' },\n innerRadius: { signal: 'outerRadius - (radiusRef*0.05)' },\n startAngle: {\n scale: 'tickScale',\n field: 'data'\n },\n endAngle: {\n scale: 'tickScale',\n field: 'data'\n },\n stroke: { signal: 'ticksColor' },\n opacity: { signal: 'showTicks ? 1 : 0' }\n }\n }\n },\n {\n type: 'text',\n from: { data: 'ticks' },\n encode: {\n enter: {\n align: { value: 'center' },\n baseline: { value: 'alphabetic' }\n },\n update: {\n text: { signal: \"format(datum.data_2, '.0f')\" },\n x: { field: 'x' },\n y: { field: 'y' },\n fontSize: { signal: 'fontFactor* 11' },\n fill: { signal: 'ticksColor' },\n opacity: { signal: 'showTicks ? 1 : 0' }\n }\n }\n },\n {\n type: 'text',\n description:\n 'displayed min value at the bottom left of gauge when showTicks is false',\n from: { data: 'gauge' },\n encode: {\n enter: {\n align: { value: 'center' },\n baseline: { value: 'top' }\n },\n update: {\n text: { signal: 'minValue' },\n x: {\n signal: 'centerX - outerRadius + (outerRadius - innerRadius)/2'\n },\n y: { signal: 'centerY', offset: { signal: 'fontFactor*5' } },\n fontSize: { signal: 'fontFactor * 11' },\n opacity: { signal: 'showTicks ? 0 : 1' }\n }\n }\n },\n {\n type: 'text',\n description:\n 'displayed max value at the bottom right of gauge when showTicks is false',\n from: { data: 'gauge' },\n encode: {\n enter: {\n align: { value: 'center' },\n baseline: { value: 'top' }\n },\n update: {\n text: { signal: 'maxValue' },\n x: {\n signal: 'centerX + innerRadius + (outerRadius - innerRadius)/2'\n },\n y: { signal: 'centerY', offset: { signal: 'fontFactor*5' } },\n fontSize: { signal: 'fontFactor * 11' },\n opacity: { signal: 'showTicks ? 0 : 1' }\n }\n }\n },\n {\n type: 'text',\n description: 'displayed a title for the chart ',\n name: 'titleLabel',\n encode: {\n enter: {\n x: { signal: 'centerX' },\n baseline: { value: 'top' },\n align: { value: 'center' }\n },\n update: {\n text: { signal: 'title' },\n y: { signal: 'centerY', offset: { signal: 'fontFactor * -50' } },\n fontSize: { signal: 'fontFactor * 14' },\n fill: { signal: 'fillColor' }\n }\n }\n },\n {\n type: 'text',\n description: 'displayed main value at the bottom center of the gauge ',\n name: 'gaugeValue',\n encode: {\n enter: {\n x: { signal: 'centerX' },\n baseline: { value: 'top' },\n align: { value: 'center' }\n },\n update: {\n text: { signal: \"format(mainValue, '.1f') + unit \" },\n y: { signal: 'centerY', offset: { signal: 'fontFactor * -25' } },\n fontSize: { signal: 'fontFactor * 20' }\n }\n }\n },\n {\n type: 'text',\n name: 'targetDiff',\n description: 'add status with symbol and difference and percentage',\n from: { data: 'gaugeValue' },\n encode: {\n enter: {\n x: { signal: 'centerX' },\n align: { value: 'center' },\n baseline: { value: 'top' }\n },\n update: {\n text: { signal: 'legend' },\n y: { signal: 'centerY', offset: { signal: 'fontFactor * -4' } },\n fontSize: { signal: 'fontFactor * 10' },\n opacity: { signal: ' targetRule ? 1 : 0' }\n }\n }\n }\n ]\n };\n\n return <Vega spec={specs} actions={false} />;\n};\n","import React from 'react';\nimport { MuiVegaLite } from '@material-vega/material-ui';\nimport { useTheme } from '@material-ui/core';\nimport { RatioVisulization } from './RatioVisulization';\nimport { GaugeGraph } from './GaugeGraph';\n\nexport const AmbientVisualizer = ({\n values,\n visualization,\n verticalBarWidth = 70,\n verticalBarColor = 'primary',\n verticalBarBand = 0.9,\n verticalBarBandThin = 0.1,\n styleThin,\n verticalBarXfield = 'category',\n verticalBarXtype = 'nominal',\n verticalBarYfield = 'amount',\n verticalBarYtype = 'quantitative',\n horizontalBarWidth = 265,\n horizontalBarHeight = 35,\n horizontalBarColor = 'primary',\n horizontalBarBand = 0.7,\n horizontalBarBandThin = 0.1,\n horizontalBarXfield = 'amount',\n horizontalBarXtype = 'quantitative',\n horizontalBarYfield = 'category',\n horizontalBarYtype = 'nominal',\n areaLineHeight = 150,\n areaLineWidth = 350,\n areaLineXtimeUnit = 'yearmonth',\n areaLineXfield = 'date',\n areaLineXtype = 'temporal',\n areaLineXaxisFormat = '%Y',\n areaLineYaggergate = 'sum',\n areaLineYfield = 'count',\n areaLineType = 'quantitative',\n layeredChartLayer,\n donutChartInnerRadius = 50,\n pieThetaField,\n pieThetaType = 'quantitative',\n pieColorField,\n pieColorType = 'nominal',\n tooltip,\n encodingTooltip = null,\n chartWidth,\n chartHeight,\n xTitle,\n yTitle,\n linePoint,\n lineXtimeUnit,\n lineXfield,\n lineXtype,\n lineYaggergate,\n lineYfield,\n lineYtype,\n lineColorField,\n lineColorType = 'nominal',\n vegaLiteSpecProps = {},\n gaugeTitle = '',\n gaugeUnitLabel = '',\n gaugeLegend = '',\n gaugeShowTicks = false,\n gaugeTicksNumber,\n gaugeBackgroundColor = 'secondary',\n gaugeFillColor = 'warning',\n gaugeValue = 0,\n gaugeMinValue = 0,\n gaugeMaxValue = 100,\n}) => {\n const theme = useTheme();\n const verticalBar = (\n <MuiVegaLite\n variant=\"verticalBarChart\"\n actions={false}\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v4.json',\n width: { step: verticalBarWidth },\n data: {\n values: values,\n },\n mark: 'bar',\n encoding: {\n color: {\n value:\n verticalBarColor === 'primary'\n ? theme.palette.primary.main\n : theme.palette.secondary.main,\n },\n x: {\n field: verticalBarXfield,\n type: verticalBarXtype,\n axis: {\n ticks: false,\n },\n band: styleThin ? verticalBarBandThin : verticalBarBand,\n },\n y: {\n field: verticalBarYfield,\n type: verticalBarYtype,\n axis: {\n format: '',\n },\n },\n tooltip: encodingTooltip,\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const horizontalBar = (\n <MuiVegaLite\n variant=\"horizontalBarChart\"\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v4.json',\n height: { step: horizontalBarHeight },\n width: horizontalBarWidth,\n data: {\n values: values,\n },\n mark: 'bar',\n encoding: {\n color: { value: theme.palette.secondary.main },\n // color: {\"value\": horizontalBarColor === 'primary' ? theme.palette.primary.main : theme.palette.secondary.main},\n x: {\n field: horizontalBarXfield,\n type: horizontalBarXtype,\n axis: {\n format: 's',\n },\n },\n y: {\n field: horizontalBarYfield,\n type: horizontalBarYtype,\n\n band: styleThin ? horizontalBarBandThin : horizontalBarBand,\n },\n tooltip: encodingTooltip,\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const areaLine = (\n <MuiVegaLite\n variant=\"areaLineChart\"\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v4.json',\n width: areaLineWidth,\n height: areaLineHeight,\n data: {\n values: values,\n },\n\n mark: 'area',\n encoding: {\n x: {\n timeUnit: areaLineXtimeUnit,\n field: areaLineXfield,\n type: areaLineXtype,\n axis: { format: areaLineXaxisFormat },\n },\n y: {\n aggregate: areaLineYaggergate,\n field: areaLineYfield,\n type: areaLineType,\n },\n tooltip: encodingTooltip,\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const numberRatio = (\n <RatioVisulization\n // @todo Update for production use.\n m={15}\n n={1}\n />\n );\n\n const layeredChart = (\n <MuiVegaLite\n variant=\"verticalBarChart\"\n actions={false}\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v5.json',\n width: chartWidth,\n height: chartHeight,\n autosize: 'fit',\n data: values\n ? {\n values: values,\n }\n : null,\n layer: layeredChartLayer,\n config: {\n legend: {\n orient: 'bottom',\n layout: { bottom: { anchor: 'middle' } },\n },\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const pie = (\n <MuiVegaLite\n variant={visualization === 'pie' ? 'pieChart' : 'donutChart'}\n actions={false}\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v5.json',\n width: chartWidth,\n height: chartHeight,\n data: {\n values: values,\n },\n config: {\n legend: {\n orient: 'bottom',\n layout: { bottom: { anchor: 'middle' } },\n },\n },\n mark: {\n type: 'arc',\n innerRadius: visualization === 'pie' ? 0 : donutChartInnerRadius,\n tooltip: tooltip,\n },\n encoding: {\n theta: { field: pieThetaField, type: pieThetaType },\n color: { field: pieColorField, type: pieColorType },\n tooltip: encodingTooltip,\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const line = (\n <MuiVegaLite\n variant=\"lineChart\"\n actions={false}\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v5.json',\n width: chartWidth,\n height: chartHeight,\n autosize: 'fit',\n data: {\n values: values,\n },\n mark: {\n type: 'line',\n point: linePoint,\n tooltip: tooltip,\n },\n config: {\n legend: {\n orient: 'bottom',\n layout: { bottom: { anchor: 'middle' } },\n },\n },\n encoding: {\n x: {\n field: lineXfield,\n type: lineXtype,\n timeUnit: lineXtimeUnit,\n title: xTitle,\n },\n y: {\n field: lineYfield,\n type: lineYtype,\n title: yTitle,\n aggregate: lineYaggergate,\n },\n color: lineColorField\n ? {\n field: lineColorField,\n type: lineColorType,\n }\n : null,\n tooltip: encodingTooltip,\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const gauge = (\n <GaugeGraph\n title={gaugeTitle}\n unitLabel={gaugeUnitLabel}\n legend={gaugeLegend}\n showTicks={gaugeShowTicks}\n ticksNumber={gaugeTicksNumber}\n backgroundColor={gaugeBackgroundColor}\n fillColor={gaugeFillColor}\n value={gaugeValue}\n minValue={gaugeMinValue}\n maxValue={gaugeMaxValue}\n width={chartWidth}\n height={chartHeight}\n />\n );\n\n let type = '';\n\n switch (visualization) {\n case 'verticalBar':\n type = verticalBar;\n break;\n case 'horizontalBar':\n type = horizontalBar;\n break;\n case 'areaLine':\n type = areaLine;\n break;\n case 'numberRatio':\n type = numberRatio;\n break;\n case 'layeredChart':\n type = layeredChart;\n break;\n case 'donut':\n type = pie;\n break;\n case 'pie':\n type = pie;\n break;\n case 'line':\n type = line;\n break;\n case 'gauge':\n type = gauge;\n break;\n default:\n }\n\n return type;\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"AmbientVisualizer-BABKxgsK.js","names":["n","FluentDisplayNumbers"],"sources":["../src/UI/dataDisplay/visualization/RatioVisulization.jsx","../src/UI/dataDisplay/visualization/GaugeGraph.jsx","../src/UI/dataDisplay/visualization/AmbientVisualizer.jsx"],"sourcesContent":["import React, {useState} from 'react'\nimport FluentDisplayNumbers from '../../widgets/FluentComponents/atoms/FluentDisplayNumbers'\nimport {makeStyles, Typography } from '@material-ui/core'\nimport { LayoutUnit } from '../../../layout/LayoutUnit'\n\nconst useStyles = makeStyles(\n (theme) => ({\n root: {\n display: 'flex',\n justifyContent: 'center',\n // flexDirection: 'column',\n },\n wrapper: {\n display: 'flex',\n flexDirection: 'row',\n // justifyContent: 'center',\n height: 150,\n color: theme.palette.secondary.main\n }\n }),\n { next: 'RadioVisualization' }\n)\n\n\nexport const RatioVisulization = ({title, n, m}) => {\n\n const [val, setVal] = useState()\n\n const classes = useStyles()\n\n // In the ratio m : n, the quantities (numbers) m and n are called the terms of the ratio. \n // The first term (i.e. m) is called antecedent and the second term (i.e. is n) is called consequent.\n\n // 15/25 = (15 ÷ 5)/(25 ÷ 5) = 3/5\n\n\n\n function number_test(n)\n{\n const result = (n - Math.floor(n)) !== 0; \n \n if (result)\n return false\n else\n return true\n }\n\n console.log(number_test(10));\n\n\nconst loopReduceRatio = (n,m) => {\n let i = 0\n let options = []\n let test = []\n\n while (i < 9) {\n\n const ren = test.length + 1\n\n const nr = n/ren\n const mr = m/ren\n test.push(nr)\n\n number_test(nr) && number_test(mr) && options.push(nr, mr)\n i++\n\n \n let commonN = []\n let commonM = []\n\n const nVal = options.map((item => {\n return commonN.push(n / item)\n }))\n \n const mVal = options.map((item => {\n return commonM.push(m / item)\n }))\n\n\n // setVal(nVal)\n\n // commonN.push(nVal)\n // commonM.push(mVal)\n \n\n const intersection = commonN.filter(element => commonM.includes(element));\n\n console.log('options', intersection)\n\n const intersectionT = intersection.filter(function(item) {\n return item !== 1\n })\n\n setVal(intersectionT)\n \n }\n\n}\n\n\n\n// console.log('RATIO:' , loopReduceRatio(15, 25))\n\n\n return (\n <div className={classes.root} >\n <div>{val && val.map((item => {\n return (\n item\n )\n }))}</div>\n {/* <button onClick={()=>loopReduceRatio(15,25)} >Test</button> */}\n <div >\n <Typography variant=\"subtitle2\" > Student to Teature Ratio </Typography>\n <LayoutUnit unit=\"xs\" />\n <div className={classes.wrapper} >\n <FluentDisplayNumbers number={n} label=\"Teacher\" />\n <FluentDisplayNumbers number=\":\" />\n <FluentDisplayNumbers number={m} label=\"Students\" />\n </div>\n </div>\n </div>\n \n \n )\n\n}","import React from 'react';\nimport { Vega } from 'react-vega';\nimport { useTheme, lighten } from '@material-ui/core';\nimport { getEllipseColor } from '../../../utilities/style/colorConverter';\n\nexport const GaugeGraph = (props) => {\n const {\n title = '',\n unitLabel = '',\n legend = '',\n showTicks = false,\n ticksNumber = 6,\n backgroundColor,\n fillColor = 'warning',\n value = 0,\n minValue = 0,\n maxValue = 100,\n width = 350,\n height = 180\n } = props;\n const theme = useTheme();\n\n const specs = {\n $schema: 'https://vega.github.io/schema/vega/v5.json',\n width: width,\n height: height,\n padding: { left: 0, right: 0, top: 0, bottom: 0 },\n data: [\n {\n name: 'ticks',\n transform: [\n {\n type: 'sequence',\n as: 'data',\n start: {\n signal: '0'\n },\n stop: {\n signal: '(maxValue - minValue) + 0.1'\n },\n step: {\n signal: '(maxValue - minValue)/(ticksNumber-1)'\n }\n },\n {\n type: 'formula',\n expr: 'datum.data + minValue',\n as: 'data_2'\n },\n {\n type: 'formula',\n as: 'radianRef',\n expr: 'PI * (datum.data/(maxValue - minValue))'\n },\n {\n type: 'formula',\n as: 'x',\n expr: 'centerX - ((outerRadius - (outerRadius - innerRadius) * 0.6) * cos(datum.radianRef))'\n },\n {\n type: 'formula',\n as: 'y',\n expr: 'centerY - ((outerRadius - (outerRadius - innerRadius) * 0.7) * sin(datum.radianRef))'\n }\n ]\n }\n ],\n signals: [\n {\n name: 'centerX',\n update: 'width/2'\n },\n {\n name: 'centerY',\n update: 'height/2 + outerRadius/2'\n },\n {\n name: 'outerRadius',\n update: 'targetValue ? radiusRef * 0.9 : radiusRef * 0.95'\n },\n {\n name: 'radiusRef',\n update: 'max(width/2, height/2)' // TODO: Important max or min functions are allowed\n },\n {\n name: 'innerRadius',\n update: 'outerRadius - outerRadius * 0.25'\n },\n {\n name: 'targetValue',\n value: value\n },\n {\n name: 'backgroundColor',\n value: backgroundColor\n ? lighten(getEllipseColor(theme, backgroundColor), 0.6)\n : lighten(theme.palette.secondary.main, 0.6)\n },\n {\n name: 'ticksNumber',\n value: ticksNumber\n },\n {\n name: 'mainValue',\n value: value\n },\n {\n name: 'title',\n value: title\n },\n {\n name: 'unit',\n value: unitLabel\n },\n {\n name: 'usedValue',\n update: 'min(max(minValue, mainValue), maxValue)'\n },\n {\n name: 'minValue',\n value: minValue\n },\n {\n name: 'maxValue',\n value: maxValue\n },\n {\n name: 'fillColor',\n value: fillColor\n ? getEllipseColor(theme, fillColor)\n : theme.palette.secondary.main\n },\n {\n name: 'ticksColor',\n value: theme.palette.text.primary\n },\n {\n name: 'showTicks',\n value: showTicks\n },\n {\n name: 'fontFactor',\n update: '(radiusRef/5)/25'\n },\n {\n name: 'hasTarget',\n update: 'isNumber(targetValue) === true'\n },\n {\n name: 'targetRule',\n update:\n '(showTarget && hasTarget && (minValue <= targetValue) && (targetValue <= maxValue)) ? 1 : 0'\n },\n {\n name: 'showTarget',\n value: true\n },\n {\n name: 'targetStatus',\n update:\n 'mainValue === targetValue ? 0 : mainValue > targetValue ? lowIsGood ? -1 : 1 : lowIsGood ? 1 : -1'\n },\n {\n name: 'lowIsGood',\n value: false\n },\n {\n name: 'legend',\n value: legend\n }\n ],\n scales: [\n {\n name: 'gaugeScale',\n type: 'linear',\n domain: { data: 'ticks', field: 'data_2' },\n zero: false,\n range: { signal: '[-PI/2, PI/2]' }\n },\n {\n name: 'tickScale',\n type: 'linear',\n domain: { data: 'ticks', field: 'data' },\n range: { signal: '[PI/2, -PI/2]' }\n },\n {\n name: 'targetStatusColorScale',\n domain: [-1, 0, 1],\n range: ['red', 'orange', 'green']\n }\n ],\n axes: [],\n legends: [],\n marks: [\n {\n type: 'arc',\n name: 'gauge',\n encode: {\n enter: {\n x: { signal: 'centerX' },\n y: { signal: 'centerY' },\n startAngle: { signal: '-PI/2' },\n endAngle: { signal: 'PI/2' },\n outerRadius: { signal: 'outerRadius' },\n innerRadius: { signal: 'innerRadius' },\n fill: { signal: 'backgroundColor' }\n }\n }\n },\n {\n type: 'arc',\n encode: {\n enter: {\n startAngle: { signal: '-PI/2' }\n },\n update: {\n x: { signal: 'centerX' },\n y: { signal: 'centerY' },\n innerRadius: { signal: 'innerRadius' },\n outerRadius: { signal: 'outerRadius' },\n endAngle: { scale: 'gaugeScale', signal: 'usedValue' },\n fill: { signal: 'fillColor' }\n }\n }\n },\n {\n type: 'arc',\n description: 'ticks on the arc',\n from: { data: 'ticks' },\n encode: {\n enter: {\n x: { signal: 'centerX' },\n y: { signal: 'centerY' },\n outerRadius: { signal: 'outerRadius' },\n innerRadius: { signal: 'outerRadius - (radiusRef*0.05)' },\n startAngle: {\n scale: 'tickScale',\n field: 'data'\n },\n endAngle: {\n scale: 'tickScale',\n field: 'data'\n },\n stroke: { signal: 'ticksColor' },\n opacity: { signal: 'showTicks ? 1 : 0' }\n }\n }\n },\n {\n type: 'text',\n from: { data: 'ticks' },\n encode: {\n enter: {\n align: { value: 'center' },\n baseline: { value: 'alphabetic' }\n },\n update: {\n text: { signal: \"format(datum.data_2, '.0f')\" },\n x: { field: 'x' },\n y: { field: 'y' },\n fontSize: { signal: 'fontFactor* 11' },\n fill: { signal: 'ticksColor' },\n opacity: { signal: 'showTicks ? 1 : 0' }\n }\n }\n },\n {\n type: 'text',\n description:\n 'displayed min value at the bottom left of gauge when showTicks is false',\n from: { data: 'gauge' },\n encode: {\n enter: {\n align: { value: 'center' },\n baseline: { value: 'top' }\n },\n update: {\n text: { signal: 'minValue' },\n x: {\n signal: 'centerX - outerRadius + (outerRadius - innerRadius)/2'\n },\n y: { signal: 'centerY', offset: { signal: 'fontFactor*5' } },\n fontSize: { signal: 'fontFactor * 11' },\n opacity: { signal: 'showTicks ? 0 : 1' }\n }\n }\n },\n {\n type: 'text',\n description:\n 'displayed max value at the bottom right of gauge when showTicks is false',\n from: { data: 'gauge' },\n encode: {\n enter: {\n align: { value: 'center' },\n baseline: { value: 'top' }\n },\n update: {\n text: { signal: 'maxValue' },\n x: {\n signal: 'centerX + innerRadius + (outerRadius - innerRadius)/2'\n },\n y: { signal: 'centerY', offset: { signal: 'fontFactor*5' } },\n fontSize: { signal: 'fontFactor * 11' },\n opacity: { signal: 'showTicks ? 0 : 1' }\n }\n }\n },\n {\n type: 'text',\n description: 'displayed a title for the chart ',\n name: 'titleLabel',\n encode: {\n enter: {\n x: { signal: 'centerX' },\n baseline: { value: 'top' },\n align: { value: 'center' }\n },\n update: {\n text: { signal: 'title' },\n y: { signal: 'centerY', offset: { signal: 'fontFactor * -50' } },\n fontSize: { signal: 'fontFactor * 14' },\n fill: { signal: 'fillColor' }\n }\n }\n },\n {\n type: 'text',\n description: 'displayed main value at the bottom center of the gauge ',\n name: 'gaugeValue',\n encode: {\n enter: {\n x: { signal: 'centerX' },\n baseline: { value: 'top' },\n align: { value: 'center' }\n },\n update: {\n text: { signal: \"format(mainValue, '.1f') + unit \" },\n y: { signal: 'centerY', offset: { signal: 'fontFactor * -25' } },\n fontSize: { signal: 'fontFactor * 20' }\n }\n }\n },\n {\n type: 'text',\n name: 'targetDiff',\n description: 'add status with symbol and difference and percentage',\n from: { data: 'gaugeValue' },\n encode: {\n enter: {\n x: { signal: 'centerX' },\n align: { value: 'center' },\n baseline: { value: 'top' }\n },\n update: {\n text: { signal: 'legend' },\n y: { signal: 'centerY', offset: { signal: 'fontFactor * -4' } },\n fontSize: { signal: 'fontFactor * 10' },\n opacity: { signal: ' targetRule ? 1 : 0' }\n }\n }\n }\n ]\n };\n\n return <Vega spec={specs} actions={false} />;\n};\n","import React from 'react';\nimport { MuiVegaLite } from '@material-vega/material-ui';\nimport { useTheme } from '@material-ui/core';\nimport { RatioVisulization } from './RatioVisulization';\nimport { GaugeGraph } from './GaugeGraph';\n\nexport const AmbientVisualizer = ({\n values,\n visualization,\n verticalBarWidth = 70,\n verticalBarColor = 'primary',\n verticalBarBand = 0.9,\n verticalBarBandThin = 0.1,\n styleThin,\n verticalBarXfield = 'category',\n verticalBarXtype = 'nominal',\n verticalBarYfield = 'amount',\n verticalBarYtype = 'quantitative',\n horizontalBarWidth = 265,\n horizontalBarHeight = 35,\n horizontalBarColor = 'primary',\n horizontalBarBand = 0.7,\n horizontalBarBandThin = 0.1,\n horizontalBarXfield = 'amount',\n horizontalBarXtype = 'quantitative',\n horizontalBarYfield = 'category',\n horizontalBarYtype = 'nominal',\n areaLineHeight = 150,\n areaLineWidth = 350,\n areaLineXtimeUnit = 'yearmonth',\n areaLineXfield = 'date',\n areaLineXtype = 'temporal',\n areaLineXaxisFormat = '%Y',\n areaLineYaggergate = 'sum',\n areaLineYfield = 'count',\n areaLineType = 'quantitative',\n layeredChartLayer,\n donutChartInnerRadius = 50,\n pieThetaField,\n pieThetaType = 'quantitative',\n pieColorField,\n pieColorType = 'nominal',\n tooltip,\n encodingTooltip = null,\n chartWidth,\n chartHeight,\n xTitle,\n yTitle,\n linePoint,\n lineXtimeUnit,\n lineXfield,\n lineXtype,\n lineYaggergate,\n lineYfield,\n lineYtype,\n lineColorField,\n lineColorType = 'nominal',\n vegaLiteSpecProps = {},\n gaugeTitle = '',\n gaugeUnitLabel = '',\n gaugeLegend = '',\n gaugeShowTicks = false,\n gaugeTicksNumber,\n gaugeBackgroundColor = 'secondary',\n gaugeFillColor = 'warning',\n gaugeValue = 0,\n gaugeMinValue = 0,\n gaugeMaxValue = 100,\n}) => {\n const theme = useTheme();\n const verticalBar = (\n <MuiVegaLite\n variant=\"verticalBarChart\"\n actions={false}\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v4.json',\n width: { step: verticalBarWidth },\n data: {\n values: values,\n },\n mark: 'bar',\n encoding: {\n color: {\n value:\n verticalBarColor === 'primary'\n ? theme.palette.primary.main\n : theme.palette.secondary.main,\n },\n x: {\n field: verticalBarXfield,\n type: verticalBarXtype,\n axis: {\n ticks: false,\n },\n band: styleThin ? verticalBarBandThin : verticalBarBand,\n },\n y: {\n field: verticalBarYfield,\n type: verticalBarYtype,\n axis: {\n format: '',\n },\n },\n tooltip: encodingTooltip,\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const horizontalBar = (\n <MuiVegaLite\n variant=\"horizontalBarChart\"\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v4.json',\n height: { step: horizontalBarHeight },\n width: horizontalBarWidth,\n data: {\n values: values,\n },\n mark: 'bar',\n encoding: {\n color: { value: theme.palette.secondary.main },\n // color: {\"value\": horizontalBarColor === 'primary' ? theme.palette.primary.main : theme.palette.secondary.main},\n x: {\n field: horizontalBarXfield,\n type: horizontalBarXtype,\n axis: {\n format: 's',\n },\n },\n y: {\n field: horizontalBarYfield,\n type: horizontalBarYtype,\n\n band: styleThin ? horizontalBarBandThin : horizontalBarBand,\n },\n tooltip: encodingTooltip,\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const areaLine = (\n <MuiVegaLite\n variant=\"areaLineChart\"\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v4.json',\n width: areaLineWidth,\n height: areaLineHeight,\n data: {\n values: values,\n },\n\n mark: 'area',\n encoding: {\n x: {\n timeUnit: areaLineXtimeUnit,\n field: areaLineXfield,\n type: areaLineXtype,\n axis: { format: areaLineXaxisFormat },\n },\n y: {\n aggregate: areaLineYaggergate,\n field: areaLineYfield,\n type: areaLineType,\n },\n tooltip: encodingTooltip,\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const numberRatio = (\n <RatioVisulization\n // @todo Update for production use.\n m={15}\n n={1}\n />\n );\n\n const layeredChart = (\n <MuiVegaLite\n variant=\"verticalBarChart\"\n actions={false}\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v5.json',\n width: chartWidth,\n height: chartHeight,\n autosize: 'fit',\n data: values\n ? {\n values: values,\n }\n : null,\n layer: layeredChartLayer,\n config: {\n legend: {\n orient: 'bottom',\n layout: { bottom: { anchor: 'middle' } },\n },\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const pie = (\n <MuiVegaLite\n variant={visualization === 'pie' ? 'pieChart' : 'donutChart'}\n actions={false}\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v5.json',\n width: chartWidth,\n height: chartHeight,\n data: {\n values: values,\n },\n config: {\n legend: {\n orient: 'bottom',\n layout: { bottom: { anchor: 'middle' } },\n },\n },\n mark: {\n type: 'arc',\n innerRadius: visualization === 'pie' ? 0 : donutChartInnerRadius,\n tooltip: tooltip,\n },\n encoding: {\n theta: { field: pieThetaField, type: pieThetaType },\n color: { field: pieColorField, type: pieColorType },\n tooltip: encodingTooltip,\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const line = (\n <MuiVegaLite\n variant=\"lineChart\"\n actions={false}\n spec={{\n $schema: 'https://vega.github.io/schema/vega-lite/v5.json',\n width: chartWidth,\n height: chartHeight,\n autosize: 'fit',\n data: {\n values: values,\n },\n mark: {\n type: 'line',\n point: linePoint,\n tooltip: tooltip,\n },\n config: {\n legend: {\n orient: 'bottom',\n layout: { bottom: { anchor: 'middle' } },\n },\n },\n encoding: {\n x: {\n field: lineXfield,\n type: lineXtype,\n timeUnit: lineXtimeUnit,\n title: xTitle,\n },\n y: {\n field: lineYfield,\n type: lineYtype,\n title: yTitle,\n aggregate: lineYaggergate,\n },\n color: lineColorField\n ? {\n field: lineColorField,\n type: lineColorType,\n }\n : null,\n tooltip: encodingTooltip,\n },\n ...vegaLiteSpecProps,\n }}\n />\n );\n\n const gauge = (\n <GaugeGraph\n title={gaugeTitle}\n unitLabel={gaugeUnitLabel}\n legend={gaugeLegend}\n showTicks={gaugeShowTicks}\n ticksNumber={gaugeTicksNumber}\n backgroundColor={gaugeBackgroundColor}\n fillColor={gaugeFillColor}\n value={gaugeValue}\n minValue={gaugeMinValue}\n maxValue={gaugeMaxValue}\n width={chartWidth}\n height={chartHeight}\n />\n );\n\n let type = '';\n\n switch (visualization) {\n case 'verticalBar':\n type = verticalBar;\n break;\n case 'horizontalBar':\n type = horizontalBar;\n break;\n case 'areaLine':\n type = areaLine;\n break;\n case 'numberRatio':\n type = numberRatio;\n break;\n case 'layeredChart':\n type = layeredChart;\n break;\n case 'donut':\n type = pie;\n break;\n case 'pie':\n type = pie;\n break;\n case 'line':\n type = line;\n break;\n case 'gauge':\n type = gauge;\n break;\n default:\n }\n\n return type;\n};\n"],"mappings":"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"}
@@ -75,4 +75,4 @@ CardList.defaultProps = {
75
75
 
76
76
  //#endregion
77
77
  export { PaginationPlacement as n, CardList as t };
78
- //# sourceMappingURL=CardList-BPNGTxsh.js.map
78
+ //# sourceMappingURL=CardList-B8nTYXo7.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CardList-BPNGTxsh.js","names":["CircularProgress"],"sources":["../src/UI/dataDisplay/cardList/enum.ts","../src/UI/dataDisplay/cardList/CardList.jsx"],"sourcesContent":["export enum PaginationPlacement {\n RIGHT = 'right',\n LEFT = 'left',\n CENTER = 'center'\n}\n","import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { makeStyles } from '@material-ui/core';\nimport clsx from 'clsx';\nimport Pagination from '@material-ui/lab/Pagination';\nimport { CircularProgress } from '../../loading/CircularProgress';\nimport { PaginationPlacement } from './enum';\n\nconst useStyles = makeStyles(() => ({\n paginationWrapper: {\n display: 'flex'\n },\n centerPagination: {\n justifyContent: 'center'\n },\n rightPagination: {\n justifyContent: 'flex-end'\n }\n}));\n\nexport const CardList = ({\n itemComponent: ItemComponent,\n data = [],\n componentDataMap,\n pagination = false,\n itemsPerPage = 10,\n isServerSide = false,\n totalItems = 0,\n onPageChange = null,\n currentPage = 1,\n isLoading = false,\n paginationPlacement = PaginationPlacement.LEFT\n}) => {\n const [clientPage, setClientPage] = useState(1);\n const classes = useStyles();\n\n const page = isServerSide ? currentPage : clientPage;\n\n const safeData = Array.isArray(data) ? data : [];\n\n const paginatedData =\n pagination && !isServerSide\n ? safeData.slice((page - 1) * itemsPerPage, page * itemsPerPage)\n : safeData;\n\n const handlePageChange = (event, value) => {\n if (isServerSide) {\n onPageChange(value);\n } else {\n setClientPage(value);\n }\n };\n\n const mappedData = (item) => {\n const props = {};\n for (const [key, value] of Object.entries(componentDataMap)) {\n props[value] = item[key];\n }\n return props;\n };\n\n return (\n <div>\n {isLoading ? (\n <CircularProgress />\n ) : (\n <>\n {paginatedData.map((item, index) => (\n <ItemComponent key={index} {...mappedData(item)} />\n ))}\n {pagination && (\n <div\n className={clsx(classes.paginationWrapper, {\n [classes.centerPagination]:\n paginationPlacement === PaginationPlacement.CENTER,\n [classes.rightPagination]:\n paginationPlacement === PaginationPlacement.RIGHT\n })}\n >\n <Pagination\n count={Math.ceil(\n isServerSide\n ? totalItems / itemsPerPage\n : safeData.length / itemsPerPage\n )}\n page={page}\n onChange={handlePageChange}\n disabled={isLoading}\n />\n </div>\n )}\n </>\n )}\n </div>\n );\n};\n\nCardList.propTypes = {\n itemComponent: PropTypes.elementType.isRequired,\n data: PropTypes.arrayOf(PropTypes.object),\n componentDataMap: PropTypes.objectOf(PropTypes.string).isRequired,\n pagination: PropTypes.bool,\n itemsPerPage: PropTypes.number,\n isServerSide: PropTypes.bool,\n totalItems: PropTypes.number,\n onPageChange: PropTypes.func,\n currentPage: PropTypes.number,\n isLoading: PropTypes.bool,\n paginationPlacement: PropTypes.string\n};\n\nCardList.defaultProps = {\n data: [],\n pagination: false,\n itemsPerPage: 10,\n isServerSide: false,\n totalItems: 0,\n onPageChange: null,\n currentPage: 1,\n isLoading: false,\n paginationPlacement: PaginationPlacement.LEFT\n};\n"],"mappings":";;;;;;;;AAAA,IAAY,sEAAL;AACL;AACA;AACA;;;;;;ACKF,MAAM,YAAY,kBAAkB;CAClC,mBAAmB,EACjB,SAAS,QACV;CACD,kBAAkB,EAChB,gBAAgB,UACjB;CACD,iBAAiB,EACf,gBAAgB,YACjB;CACF,EAAE;AAEH,MAAa,YAAY,EACvB,eAAe,eACf,OAAO,EAAE,EACT,kBACA,aAAa,OACb,eAAe,IACf,eAAe,OACf,aAAa,GACb,eAAe,MACf,cAAc,GACd,YAAY,OACZ,sBAAsB,oBAAoB,WACtC;CACJ,MAAM,CAAC,YAAY,iBAAiB,SAAS,EAAE;CAC/C,MAAM,UAAU,WAAW;CAE3B,MAAM,OAAO,eAAe,cAAc;CAE1C,MAAM,WAAW,MAAM,QAAQ,KAAK,GAAG,OAAO,EAAE;CAEhD,MAAM,gBACJ,cAAc,CAAC,eACX,SAAS,OAAO,OAAO,KAAK,cAAc,OAAO,aAAa,GAC9D;CAEN,MAAM,oBAAoB,OAAO,UAAU;AACzC,MAAI,aACF,cAAa,MAAM;MAEnB,eAAc,MAAM;;CAIxB,MAAM,cAAc,SAAS;EAC3B,MAAM,QAAQ,EAAE;AAChB,OAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,iBAAiB,CACzD,OAAM,SAAS,KAAK;AAEtB,SAAO;;AAGT,QACE,oCAAC,aACE,YACC,oCAACA,yBAAmB,GAEpB,0DACG,cAAc,KAAK,MAAM,UACxB,oCAAC;EAAc,KAAK;EAAO,GAAI,WAAW,KAAK;GAAI,CACnD,EACD,cACC,oCAAC,SACC,WAAW,KAAK,QAAQ,mBAAmB;GACxC,QAAQ,mBACP,wBAAwB,oBAAoB;GAC7C,QAAQ,kBACP,wBAAwB,oBAAoB;EAC/C,CAAC,IAEF,oCAAC;EACC,OAAO,KAAK,KACV,eACI,aAAa,eACb,SAAS,SAAS,aACvB;EACK;EACN,UAAU;EACV,UAAU;GACV,CACE,CAEP,CAED;;AAIV,SAAS,YAAY;CACnB,eAAe,UAAU,YAAY;CACrC,MAAM,UAAU,QAAQ,UAAU,OAAO;CACzC,kBAAkB,UAAU,SAAS,UAAU,OAAO,CAAC;CACvD,YAAY,UAAU;CACtB,cAAc,UAAU;CACxB,cAAc,UAAU;CACxB,YAAY,UAAU;CACtB,cAAc,UAAU;CACxB,aAAa,UAAU;CACvB,WAAW,UAAU;CACrB,qBAAqB,UAAU;CAChC;AAED,SAAS,eAAe;CACtB,MAAM,EAAE;CACR,YAAY;CACZ,cAAc;CACd,cAAc;CACd,YAAY;CACZ,cAAc;CACd,aAAa;CACb,WAAW;CACX,qBAAqB,oBAAoB;CAC1C"}
1
+ {"version":3,"file":"CardList-B8nTYXo7.js","names":["CircularProgress"],"sources":["../src/UI/dataDisplay/cardList/enum.ts","../src/UI/dataDisplay/cardList/CardList.jsx"],"sourcesContent":["export enum PaginationPlacement {\n RIGHT = 'right',\n LEFT = 'left',\n CENTER = 'center'\n}\n","import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { makeStyles } from '@material-ui/core';\nimport clsx from 'clsx';\nimport Pagination from '@material-ui/lab/Pagination';\nimport { CircularProgress } from '../../loading/CircularProgress';\nimport { PaginationPlacement } from './enum';\n\nconst useStyles = makeStyles(() => ({\n paginationWrapper: {\n display: 'flex'\n },\n centerPagination: {\n justifyContent: 'center'\n },\n rightPagination: {\n justifyContent: 'flex-end'\n }\n}));\n\nexport const CardList = ({\n itemComponent: ItemComponent,\n data = [],\n componentDataMap,\n pagination = false,\n itemsPerPage = 10,\n isServerSide = false,\n totalItems = 0,\n onPageChange = null,\n currentPage = 1,\n isLoading = false,\n paginationPlacement = PaginationPlacement.LEFT\n}) => {\n const [clientPage, setClientPage] = useState(1);\n const classes = useStyles();\n\n const page = isServerSide ? currentPage : clientPage;\n\n const safeData = Array.isArray(data) ? data : [];\n\n const paginatedData =\n pagination && !isServerSide\n ? safeData.slice((page - 1) * itemsPerPage, page * itemsPerPage)\n : safeData;\n\n const handlePageChange = (event, value) => {\n if (isServerSide) {\n onPageChange(value);\n } else {\n setClientPage(value);\n }\n };\n\n const mappedData = (item) => {\n const props = {};\n for (const [key, value] of Object.entries(componentDataMap)) {\n props[value] = item[key];\n }\n return props;\n };\n\n return (\n <div>\n {isLoading ? (\n <CircularProgress />\n ) : (\n <>\n {paginatedData.map((item, index) => (\n <ItemComponent key={index} {...mappedData(item)} />\n ))}\n {pagination && (\n <div\n className={clsx(classes.paginationWrapper, {\n [classes.centerPagination]:\n paginationPlacement === PaginationPlacement.CENTER,\n [classes.rightPagination]:\n paginationPlacement === PaginationPlacement.RIGHT\n })}\n >\n <Pagination\n count={Math.ceil(\n isServerSide\n ? totalItems / itemsPerPage\n : safeData.length / itemsPerPage\n )}\n page={page}\n onChange={handlePageChange}\n disabled={isLoading}\n />\n </div>\n )}\n </>\n )}\n </div>\n );\n};\n\nCardList.propTypes = {\n itemComponent: PropTypes.elementType.isRequired,\n data: PropTypes.arrayOf(PropTypes.object),\n componentDataMap: PropTypes.objectOf(PropTypes.string).isRequired,\n pagination: PropTypes.bool,\n itemsPerPage: PropTypes.number,\n isServerSide: PropTypes.bool,\n totalItems: PropTypes.number,\n onPageChange: PropTypes.func,\n currentPage: PropTypes.number,\n isLoading: PropTypes.bool,\n paginationPlacement: PropTypes.string\n};\n\nCardList.defaultProps = {\n data: [],\n pagination: false,\n itemsPerPage: 10,\n isServerSide: false,\n totalItems: 0,\n onPageChange: null,\n currentPage: 1,\n isLoading: false,\n paginationPlacement: PaginationPlacement.LEFT\n};\n"],"mappings":";;;;;;;;AAAA,IAAY,sEAAL;AACL;AACA;AACA;;;;;;ACKF,MAAM,YAAY,kBAAkB;CAClC,mBAAmB,EACjB,SAAS,QACV;CACD,kBAAkB,EAChB,gBAAgB,UACjB;CACD,iBAAiB,EACf,gBAAgB,YACjB;CACF,EAAE;AAEH,MAAa,YAAY,EACvB,eAAe,eACf,OAAO,EAAE,EACT,kBACA,aAAa,OACb,eAAe,IACf,eAAe,OACf,aAAa,GACb,eAAe,MACf,cAAc,GACd,YAAY,OACZ,sBAAsB,oBAAoB,WACtC;CACJ,MAAM,CAAC,YAAY,iBAAiB,SAAS,EAAE;CAC/C,MAAM,UAAU,WAAW;CAE3B,MAAM,OAAO,eAAe,cAAc;CAE1C,MAAM,WAAW,MAAM,QAAQ,KAAK,GAAG,OAAO,EAAE;CAEhD,MAAM,gBACJ,cAAc,CAAC,eACX,SAAS,OAAO,OAAO,KAAK,cAAc,OAAO,aAAa,GAC9D;CAEN,MAAM,oBAAoB,OAAO,UAAU;AACzC,MAAI,aACF,cAAa,MAAM;MAEnB,eAAc,MAAM;;CAIxB,MAAM,cAAc,SAAS;EAC3B,MAAM,QAAQ,EAAE;AAChB,OAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,iBAAiB,CACzD,OAAM,SAAS,KAAK;AAEtB,SAAO;;AAGT,QACE,oCAAC,aACE,YACC,oCAACA,yBAAmB,GAEpB,0DACG,cAAc,KAAK,MAAM,UACxB,oCAAC;EAAc,KAAK;EAAO,GAAI,WAAW,KAAK;GAAI,CACnD,EACD,cACC,oCAAC,SACC,WAAW,KAAK,QAAQ,mBAAmB;GACxC,QAAQ,mBACP,wBAAwB,oBAAoB;GAC7C,QAAQ,kBACP,wBAAwB,oBAAoB;EAC/C,CAAC,IAEF,oCAAC;EACC,OAAO,KAAK,KACV,eACI,aAAa,eACb,SAAS,SAAS,aACvB;EACK;EACN,UAAU;EACV,UAAU;GACV,CACE,CAEP,CAED;;AAIV,SAAS,YAAY;CACnB,eAAe,UAAU,YAAY;CACrC,MAAM,UAAU,QAAQ,UAAU,OAAO;CACzC,kBAAkB,UAAU,SAAS,UAAU,OAAO,CAAC;CACvD,YAAY,UAAU;CACtB,cAAc,UAAU;CACxB,cAAc,UAAU;CACxB,YAAY,UAAU;CACtB,cAAc,UAAU;CACxB,aAAa,UAAU;CACvB,WAAW,UAAU;CACrB,qBAAqB,UAAU;CAChC;AAED,SAAS,eAAe;CACtB,MAAM,EAAE;CACR,YAAY;CACZ,cAAc;CACd,cAAc;CACd,YAAY;CACZ,cAAc;CACd,aAAa;CACb,WAAW;CACX,qBAAqB,oBAAoB;CAC1C"}
@@ -49,4 +49,4 @@ const Directory = ({ data, success, warning, error, info, key, statusKey }) => {
49
49
 
50
50
  //#endregion
51
51
  export { DirectoryListItem as n, Directory as t };
52
- //# sourceMappingURL=Directory-CoEKdRkU.js.map
52
+ //# sourceMappingURL=Directory-MpK8T6IZ.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Directory-CoEKdRkU.js","names":["useStyles","item"],"sources":["../src/UI/dataDisplay/directory/DirectoryListItem.jsx","../src/UI/dataDisplay/directory/Directory.jsx"],"sourcesContent":["import React from 'react'\nimport { makeStyles, Typography, Divider } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n divider: {\n marginTop: theme.spacing(1)\n },\n content: {\n marginLeft: theme.spacing(4)\n }\n}))\n\nexport const DirectoryListItem = ({ children, letter }) => {\n const classes = useStyles()\n\n return (\n <div className={classes.root}>\n <div>\n <Typography variant='h4'>{letter}</Typography>\n </div>\n <div className={classes.content}>\n {children}\n <div>\n <Divider className={classes.divider} />\n </div>\n </div>\n </div>\n )\n}\n","import React from 'react'\nimport { makeStyles } from '@material-ui/core'\nimport { DirectoryListItem } from './DirectoryListItem'\nimport { StatusChip } from '../status/StatusChip'\n\nconst useStyles = makeStyles((theme) => ({\n root: {}\n}))\n\nexport const Directory = ({\n data,\n success,\n warning,\n error,\n info,\n key,\n statusKey\n}) => {\n const classes = useStyles()\n\n const dataTransform = data.reduce((r, e) => {\n const alphabet = e.name[0]\n if (!r[alphabet]) r[alphabet] = { alphabet, record: [e] }\n else r[alphabet].record.push(e)\n return r\n }, {})\n\n const result = Object.values(dataTransform)\n\n return (\n <div className={classes.root}>\n {result.map((item) => {\n return (\n <DirectoryListItem key={key} letter={item.alphabet}>\n {item.record.map((item) => {\n return (\n <div style={{ marginBottom: 8 }} key={statusKey}>\n <StatusChip\n success={success}\n warning={warning}\n error={error}\n info={info}\n label={item.name}\n status={item.status}\n />\n </div>\n )\n })}\n </DirectoryListItem>\n )\n })}\n </div>\n )\n}\n"],"mappings":";;;;;AAGA,MAAMA,cAAY,YAAY,WAAW;CACvC,SAAS,EACP,WAAW,MAAM,QAAQ,EAAE,EAC5B;CACD,SAAS,EACP,YAAY,MAAM,QAAQ,EAAE,EAC7B;CACF,EAAE;AAEH,MAAa,qBAAqB,EAAE,UAAU,aAAa;CACzD,MAAM,UAAUA,aAAW;AAE3B,QACE,oCAAC,SAAI,WAAW,QAAQ,QACtB,oCAAC,aACC,oCAAC,cAAW,SAAQ,QAAM,OAAoB,CAC1C,EACN,oCAAC,SAAI,WAAW,QAAQ,WACrB,UACD,oCAAC,aACC,oCAAC,WAAQ,WAAW,QAAQ,UAAW,CACnC,CACF,CACF;;;;;ACrBV,MAAM,YAAY,YAAY,WAAW,EACvC,MAAM,EAAE,EACT,EAAE;AAEH,MAAa,aAAa,EACxB,MACA,SACA,SACA,OACA,MACA,KACA,gBACI;CACJ,MAAM,UAAU,WAAW;CAE3B,MAAM,gBAAgB,KAAK,QAAQ,GAAG,MAAM;EAC1C,MAAM,WAAW,EAAE,KAAK;AACxB,MAAI,CAAC,EAAE,UAAW,GAAE,YAAY;GAAE;GAAU,QAAQ,CAAC,EAAE;GAAE;MACpD,GAAE,UAAU,OAAO,KAAK,EAAE;AAC/B,SAAO;IACN,EAAE,CAAC;CAEN,MAAM,SAAS,OAAO,OAAO,cAAc;AAE3C,QACE,oCAAC,SAAI,WAAW,QAAQ,QACrB,OAAO,KAAK,SAAS;AACpB,SACE,oCAAC;GAAuB;GAAK,QAAQ,KAAK;KACvC,KAAK,OAAO,KAAK,WAAS;AACzB,UACE,oCAAC;IAAI,OAAO,EAAE,cAAc,GAAG;IAAE,KAAK;MACpC,oCAAC;IACU;IACA;IACF;IACD;IACN,OAAOC,OAAK;IACZ,QAAQA,OAAK;KACb,CACE;IAER,CACgB;GAEtB,CACE"}
1
+ {"version":3,"file":"Directory-MpK8T6IZ.js","names":["useStyles","item"],"sources":["../src/UI/dataDisplay/directory/DirectoryListItem.jsx","../src/UI/dataDisplay/directory/Directory.jsx"],"sourcesContent":["import React from 'react'\nimport { makeStyles, Typography, Divider } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n divider: {\n marginTop: theme.spacing(1)\n },\n content: {\n marginLeft: theme.spacing(4)\n }\n}))\n\nexport const DirectoryListItem = ({ children, letter }) => {\n const classes = useStyles()\n\n return (\n <div className={classes.root}>\n <div>\n <Typography variant='h4'>{letter}</Typography>\n </div>\n <div className={classes.content}>\n {children}\n <div>\n <Divider className={classes.divider} />\n </div>\n </div>\n </div>\n )\n}\n","import React from 'react'\nimport { makeStyles } from '@material-ui/core'\nimport { DirectoryListItem } from './DirectoryListItem'\nimport { StatusChip } from '../status/StatusChip'\n\nconst useStyles = makeStyles((theme) => ({\n root: {}\n}))\n\nexport const Directory = ({\n data,\n success,\n warning,\n error,\n info,\n key,\n statusKey\n}) => {\n const classes = useStyles()\n\n const dataTransform = data.reduce((r, e) => {\n const alphabet = e.name[0]\n if (!r[alphabet]) r[alphabet] = { alphabet, record: [e] }\n else r[alphabet].record.push(e)\n return r\n }, {})\n\n const result = Object.values(dataTransform)\n\n return (\n <div className={classes.root}>\n {result.map((item) => {\n return (\n <DirectoryListItem key={key} letter={item.alphabet}>\n {item.record.map((item) => {\n return (\n <div style={{ marginBottom: 8 }} key={statusKey}>\n <StatusChip\n success={success}\n warning={warning}\n error={error}\n info={info}\n label={item.name}\n status={item.status}\n />\n </div>\n )\n })}\n </DirectoryListItem>\n )\n })}\n </div>\n )\n}\n"],"mappings":";;;;;AAGA,MAAMA,cAAY,YAAY,WAAW;CACvC,SAAS,EACP,WAAW,MAAM,QAAQ,EAAE,EAC5B;CACD,SAAS,EACP,YAAY,MAAM,QAAQ,EAAE,EAC7B;CACF,EAAE;AAEH,MAAa,qBAAqB,EAAE,UAAU,aAAa;CACzD,MAAM,UAAUA,aAAW;AAE3B,QACE,oCAAC,SAAI,WAAW,QAAQ,QACtB,oCAAC,aACC,oCAAC,cAAW,SAAQ,QAAM,OAAoB,CAC1C,EACN,oCAAC,SAAI,WAAW,QAAQ,WACrB,UACD,oCAAC,aACC,oCAAC,WAAQ,WAAW,QAAQ,UAAW,CACnC,CACF,CACF;;;;;ACrBV,MAAM,YAAY,YAAY,WAAW,EACvC,MAAM,EAAE,EACT,EAAE;AAEH,MAAa,aAAa,EACxB,MACA,SACA,SACA,OACA,MACA,KACA,gBACI;CACJ,MAAM,UAAU,WAAW;CAE3B,MAAM,gBAAgB,KAAK,QAAQ,GAAG,MAAM;EAC1C,MAAM,WAAW,EAAE,KAAK;AACxB,MAAI,CAAC,EAAE,UAAW,GAAE,YAAY;GAAE;GAAU,QAAQ,CAAC,EAAE;GAAE;MACpD,GAAE,UAAU,OAAO,KAAK,EAAE;AAC/B,SAAO;IACN,EAAE,CAAC;CAEN,MAAM,SAAS,OAAO,OAAO,cAAc;AAE3C,QACE,oCAAC,SAAI,WAAW,QAAQ,QACrB,OAAO,KAAK,SAAS;AACpB,SACE,oCAAC;GAAuB;GAAK,QAAQ,KAAK;KACvC,KAAK,OAAO,KAAK,WAAS;AACzB,UACE,oCAAC;IAAI,OAAO,EAAE,cAAc,GAAG;IAAE,KAAK;MACpC,oCAAC;IACU;IACA;IACF;IACD;IACN,OAAOC,OAAK;IACZ,QAAQA,OAAK;KACb,CACE;IAER,CACgB;GAEtB,CACE"}
@@ -525,4 +525,4 @@ EntityHeader.propTypes = {
525
525
 
526
526
  //#endregion
527
527
  export { EntityHeader as t };
528
- //# sourceMappingURL=EntityHeader-DKkYwvsi.js.map
528
+ //# sourceMappingURL=EntityHeader-C3Ae5BLK.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"EntityHeader-DKkYwvsi.js","names":["useStyles","useStyles","useStyles","useStyles","useStyles","useStyles","useTheme","useStyles"],"sources":["../src/UI/dataDisplay/entityHeader/ui/EntityHeaderContainer.jsx","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderList.jsx","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderListItem.jsx","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderStatList.jsx","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderStatListItem.jsx","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderSection.jsx","../src/UI/dataDisplay/entityHeader/functions/useElementWidth.js","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderFlags.jsx","../src/UI/dataDisplay/entityHeader/EntityHeader.jsx"],"sourcesContent":["import React, { Children, cloneElement } from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { makeStyles, Divider, darken, alpha } from '@material-ui/core';\n\nconst useStyles = makeStyles(theme => ({\n root: props => ({\n display: 'flex',\n flexDirection: props.direction === 'column' ? 'column' : 'row',\n }),\n rootBgDark: props => ({\n backgroundColor: darken(\n props.color === 'primary'\n ? theme.palette.primary.main\n : theme.palette.secondary.main,\n 0.2\n ),\n color: theme.palette.getContrastText(\n props.color === 'primary'\n ? theme.palette.primary.main\n : theme.palette.secondary.main\n ),\n }),\n rootBgSoft: props => ({\n backgroundColor: alpha(\n props.color === 'primary'\n ? theme.palette.primary.main\n : theme.palette.secondary.main,\n 0.15\n ),\n }),\n rootBgCustom: props => ({\n backgroundColor: props.background,\n color: props.color,\n }),\n}));\n\nexport const EntityHeaderContainer = props => {\n const { children, showSeperator, background } = props;\n const arrayChildren = Children.toArray(children);\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true, // always applies\n [classes.rootBg]: background === 'light' || !background, // if background = 'light'\n [classes.rootBgDark]: background === 'dark', // if background = 'dark'\n [classes.rootBgSoft]: background === 'soft', // if background = 'soft'\n [classes.rootBgCustom]:\n background &&\n background !== 'light' &&\n background !== 'dark' &&\n background !== 'soft',\n })}\n >\n {Children.map(arrayChildren, (child, index) => {\n const isLast = index === arrayChildren.length - 1;\n return (\n <>\n {cloneElement(child, {\n isLast,\n })}\n {!isLast && showSeperator && (\n <Divider orientation=\"vertical\" flexItem />\n )}\n </>\n );\n })}\n </div>\n );\n};\n\nEntityHeaderContainer.propTypes = {\n children: PropTypes.node.isRequired,\n showSeperator: PropTypes.bool,\n background: PropTypes.oneOf(['light', 'dark', 'soft']),\n direction: PropTypes.oneOf(['row', 'column']),\n color: PropTypes.oneOf(['primary', 'secondary']),\n};\n\nEntityHeaderContainer.defaultProps = {\n showSeperator: true,\n background: 'light',\n direction: 'row',\n color: 'primary',\n};\n","import React, { Children, cloneElement } from 'react';\nimport clsx from 'clsx';\nimport { makeStyles, Divider } from '@material-ui/core';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n // listStyle: 'none',\n },\n}));\n\nexport const EntityHeaderList = props => {\n const { children, showSeperator = false } = props;\n const arrayChildren = Children.toArray(children);\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true,\n })}\n >\n {Children.map(arrayChildren, (child, index) => {\n const isLast = index === arrayChildren.length - 1;\n return (\n <>\n {cloneElement(child, {\n isLast,\n })}\n {!isLast && showSeperator && <Divider />}\n </>\n );\n })}\n </div>\n );\n};\n","import React, { useState } from 'react';\nimport clsx from 'clsx';\nimport { Link, lighten, makeStyles, Typography } from '@material-ui/core';\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n display: 'flex'\n },\n labelRoot: {\n color: 'inherit',\n marginRight: theme.spacing(0.5),\n opacity: 0.6\n },\n valueRoot: {\n color: 'inherit'\n // fontWeight: theme.typography.fontWeightMedium,\n },\n link: {\n color: 'inherit',\n textDecoration: 'none',\n '&:hover': {\n textDecoration: 'underline'\n }\n }\n}));\n\nexport const EntityHeaderListItem = (props) => {\n const {\n label,\n value,\n link,\n hideLabelSeperator = false,\n disablePadding = false\n } = props;\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true,\n [classes.rootPadding]: !disablePadding\n })}\n >\n {!!label && (\n <Typography variant={'body1'} className={classes.labelRoot}>\n {label}\n {!hideLabelSeperator && ':'}\n </Typography>\n )}\n {!!value && (\n <Typography\n variant={'body1'}\n className={clsx({\n [classes.valueRoot]: true,\n [classes.valueFontWeigth]: true\n })}\n >\n {link ? (\n <Link\n href={link}\n className={classes.link}\n target='_blank'\n >\n {value}\n </Link>\n ) : (\n value\n )}\n </Typography>\n )}\n </div>\n );\n};\n","import React, { Children, cloneElement, useState } from 'react';\nimport clsx from 'clsx';\nimport { makeStyles, Typography, Divider } from '@material-ui/core';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n display: 'flex',\n flexWrap: 'wrap',\n '& > *': {\n marginLeft: 1,\n },\n },\n rootFlexGrow: {\n flexGrow: 1,\n },\n}));\n\nexport const EntityHeaderStatList = props => {\n const { children, showSeperator, flexGrow = false } = props;\n const arrayChildren = Children.toArray(children);\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true, //always applies\n [classes.rootFlexGrow]: flexGrow,\n })}\n >\n {Children.map(arrayChildren, (child, index) => {\n const isLast = index === arrayChildren.length - 1;\n return (\n <>\n {cloneElement(child, {\n isLast,\n })}\n {!isLast && showSeperator && (\n <Divider orientation=\"vertical\" flexItem />\n )}\n </>\n );\n })}\n </div>\n );\n};\n","import React from 'react';\nimport clsx from 'clsx';\nimport { alpha, Avatar, makeStyles, Typography } from '@material-ui/core';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n // padding: theme.spacing(1),\n },\n rootFlexGrow: {\n flexGrow: 1,\n },\n rootBlock: props => ({\n justifyContent: 'center',\n padding: theme.spacing(1),\n }),\n rootBlockDefault: props => ({\n backgroundColor: alpha(\n theme.palette.type === 'dark'\n ? theme.palette.common.black\n : theme.palette.common.white,\n 0.25\n ),\n }),\n rootBlockError: props => ({\n backgroundColor: alpha(\n theme.palette.error.main,\n theme.palette.type === 'dark' ? 0.7 : 0.1\n ),\n }),\n rootBlockSuccess: props => ({\n backgroundColor: alpha(\n theme.palette.success.main,\n theme.palette.type === 'dark' ? 0.2 : 0.3\n ),\n }),\n labelRoot: {\n color: 'inherit',\n opacity: 0.6,\n },\n rootLabelError: (props) => ({\n color: theme.palette.error.main\n }),\n rootLabelSuccess: (props) => ({\n color: theme.palette.success.main\n }),\n valueRoot: {\n color: 'inherit',\n fontWeight: theme.typography.fontWeightMedium,\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n },\n beforeValue: {\n marginRight: theme.spacing(0.3),\n },\n afterValue: {},\n icon: {\n marginRight: theme.spacing(1),\n },\n iconAvatar: {\n backgroundColor: 'transparent',\n },\n content: props => ({\n display: 'flex',\n flexDirection: 'column',\n // alignItems: 'center',\n alignItems: props.icon ? 'left' : 'center',\n }),\n}));\n\nexport const EntityHeaderStatListItem = props => {\n const {\n label = 'Label',\n value = 'Value',\n beforeValue,\n afterValue,\n flexGrow = false,\n labelColor,\n icon,\n } = props;\n\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true,\n [classes.rootFlexGrow]: flexGrow,\n [classes.rootBlock]: true,\n // [classes.rootBlockDefault]: !labelColor,\n // [classes.rootBlockError]: labelColor === 'error',\n // [classes.rootBlockSuccess]: labelColor === 'success',\n })}\n >\n {icon && (\n <div className={classes.icon}>\n <Avatar className={classes.iconAvatar}>{icon}</Avatar>\n </div>\n )}\n <div className={classes.content}>\n {!!value && (\n <div\n className={clsx({\n [classes.valueRoot]: true,\n })}\n >\n {beforeValue && (\n <Typography variant={'body1'} className={classes.beforeValue}>\n {beforeValue}\n </Typography>\n )}\n <Typography\n variant={'h5'}\n className={clsx({\n [classes.rootLabelError]: labelColor === 'error',\n [classes.rootLabelSuccess]: labelColor === 'success'\n })}\n >\n {value}\n </Typography>\n {afterValue && (\n <Typography variant={'body1'} className={classes.afterValue}>\n {afterValue}\n </Typography>\n )}\n </div>\n )}\n {!!label && (\n <Typography\n variant={'subtitle3'}\n className={classes.labelRoot}\n component=\"div\"\n >\n {label}\n </Typography>\n )}\n </div>\n </div>\n );\n};\n","import React from 'react';\nimport clsx from 'clsx';\nimport PropTypes from 'prop-types';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n display: 'flex'\n },\n rootFlexGrow: {\n flexGrow: 1\n },\n rootFlexAlignStart: {\n alignItems: 'flex-start'\n },\n rootFlexAlignCenter: {\n alignItems: 'center'\n },\n rootFlexAlignEnd: {\n alignItems: 'flex-end'\n },\n rootFlexAlignStretch: {\n alignItems: 'stretch'\n },\n rootGutter: {\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2)\n },\n rootPadding: {\n paddingTop: theme.spacing(1),\n paddingBottom: theme.spacing(1)\n },\n rootFlexJustifyStart: {\n justifyContent: 'flex-start'\n },\n rootFlexJustifyEnd: {\n justifyContent: 'flex-end'\n }\n}));\n\nexport const EntityHeaderSection = (props) => {\n const {\n children,\n disableGutter,\n disablePadding,\n flexGrow,\n justifyContent,\n alignItems\n } = props;\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true, //always applies\n [classes.rootGutter]: !disableGutter,\n [classes.rootPadding]: !disablePadding,\n [classes.rootFlexGrow]: flexGrow,\n [classes.rootFlexJustifyStart]: justifyContent === 'start',\n [classes.rootFlexJustifyEnd]: justifyContent === 'end',\n [classes.rootFlexAlignStart]: alignItems === 'start',\n [classes.rootFlexAlignCenter]: alignItems === 'center',\n [classes.rootFlexAlignEnd]: alignItems === 'end',\n [classes.rootFlexAlignStretch]: alignItems === 'stretch'\n })}\n >\n {children}\n </div>\n );\n};\n\nEntityHeaderSection.propTypes = {\n children: PropTypes.node.isRequired,\n disableGutter: PropTypes.bool,\n disablePadding: PropTypes.bool,\n flexGrow: PropTypes.bool,\n justifyContent: PropTypes.oneOf(['start', 'end']),\n alignItems: PropTypes.oneOf(['start', 'center', 'end', 'stretch'])\n};\n\nEntityHeaderSection.defaultProps = {\n disableGutter: false,\n disablePadding: false,\n flexGrow: false\n};\n","import { useTheme } from '@material-ui/core/styles';\nimport { useLayoutEffect, useState } from 'react';\nimport PropTypes from 'prop-types';\n\n/**\n * Custom hook that returns the current breakpoint of a provided element's width and helpers to compare against breakpoints.\n * @param {any} ref - The ref object whose current element will be observed for width changes.\n * @returns {{\n * currentBreakpoint: string | null,\n * isBreakpointUp: (breakpoint: string) => boolean,\n * isBreakpointDown: (breakpoint: string) => boolean,\n * }}\n */\nfunction useElementWidth(ref) {\n const theme = useTheme();\n const [width, setWidth] = useState(null);\n\n useLayoutEffect(() => {\n const resizeObserver = new ResizeObserver(entries => {\n for (let entry of entries) {\n if (entry.target === ref.current) {\n setWidth(entry.contentRect.width);\n }\n }\n });\n\n resizeObserver.observe(ref.current);\n\n return () => {\n resizeObserver.unobserve(ref.current);\n };\n }, [ref]);\n\n const currentBreakpoint =\n width !== null\n ? Object.keys(theme.breakpoints.values).reduce((acc, breakpoint) => {\n if (width >= theme.breakpoints.values[breakpoint]) {\n return breakpoint;\n }\n return acc;\n }, null)\n : null;\n\n const isBreakpointUp = breakpoint => {\n const breakpoints = Object.keys(theme.breakpoints.values);\n const index = breakpoints.indexOf(breakpoint);\n const currentIndex = breakpoints.indexOf(currentBreakpoint);\n return index <= currentIndex;\n };\n\n const isBreakpointDown = breakpoint => {\n const breakpoints = Object.keys(theme.breakpoints.values);\n const index = breakpoints.indexOf(breakpoint);\n const currentIndex = breakpoints.indexOf(currentBreakpoint);\n return index >= currentIndex;\n };\n\n return {\n currentBreakpoint,\n isBreakpointUp,\n isBreakpointDown,\n };\n}\n\nexport { useElementWidth };\n\nuseElementWidth.propTypes = {\n ref: PropTypes.shape({\n current: PropTypes.instanceOf(Element),\n }),\n};\n","import React from 'react';\nimport { makeStyles } from '@material-ui/core';\nimport { ChipAlphabet } from '../../ChipAlphabet';\nimport { FluentIcon } from '../../../../utilities/iconLibrary/FluentIcon';\nimport { FlagIcon } from '@fluentui/react-icons';\n\nconst useStyles = makeStyles(theme => ({\n flagIcon: {\n marginRight: theme.spacing(2),\n },\n chipContainer: {\n marginBottom: theme.spacing(-1),\n '& > *': {\n marginRight: theme.spacing(1),\n marginBottom: theme.spacing(1),\n },\n },\n}));\n\nfunction flagLetter(str) {\n return str.charAt(0).toUpperCase();\n}\n\nexport const EntityHeaderFlags = ({ data = [], color = 'primary' }) => {\n const classes = useStyles();\n\n if (!data && data.length === 0) {\n return;\n }\n\n return (\n <>\n <FluentIcon\n size=\"small\"\n component={FlagIcon}\n className={classes.flagIcon}\n />\n <div className={classes.chipContainer}>\n {data.map(item => {\n return (\n <ChipAlphabet\n avatar\n avatarCharacter={flagLetter(item.label)}\n label={item.label}\n handleClick={() => item.handleClick}\n />\n );\n })}\n </div>\n </>\n );\n};\n","import React, { useRef, useState, useEffect } from 'react';\nimport { makeStyles } from '@material-ui/core';\nimport { EntityHeaderContainer } from './ui/EntityHeaderContainer';\nimport { EntityHeaderList } from './ui/EntityHeaderList';\nimport { EntityHeaderListItem } from './ui/EntityHeaderListItem';\nimport { EntityHeaderStatList } from './ui/EntityHeaderStatList';\nimport { EntityHeaderStatListItem } from './ui/EntityHeaderStatListItem';\nimport { EntityHeaderSection } from './ui/EntityHeaderSection';\nimport { AlertPill } from './ui/AlertPill';\n\nimport { ChartIcon } from '@fluentui/react-icons';\nimport { useElementWidth } from './functions/useElementWidth';\nimport { IconRenderer } from '../../templates/ui/renderers/IconRenderer';\nimport { EntityHeaderFlags } from './ui/EntityHeaderFlags';\nimport PropTypes from 'prop-types';\nimport { UdpAlertsContainer } from '../../utilityDisplay/alerts/UdpAlertsContainer';\n\nconst useStyles = makeStyles((theme) => ({\n root: {}\n}));\n// https://univerus.atlassian.net/wiki/spaces/UDP/pages/2398257255/Entity+Header\nexport const EntityHeader = (props) => {\n const {\n sectionProps,\n background,\n color,\n kpiProps,\n hiddenSections,\n chips,\n alerts,\n useUdpAlerts\n } = props;\n\n const classes = useStyles(props);\n const { section1, section2, section3, section4 } = sectionProps;\n const { kpi1, kpi2, kpi3, kpi4 } = kpiProps;\n\n const componentRef = useRef();\n const [compactSize, setCompactSize] = useState(true);\n\n const { isBreakpointUp } = useElementWidth(componentRef);\n\n useEffect(() => {\n if (isBreakpointUp('md')) {\n setCompactSize(false);\n // setDividedList(false);\n } else {\n setCompactSize(true);\n // setDividedList(true);\n }\n }, [isBreakpointUp]);\n\n return (\n <div ref={componentRef}>\n {/* Container used when compactSize is true */}\n {!!compactSize && (\n <EntityHeaderContainer\n direction='row'\n showSeperator\n background={background}\n color={color}\n >\n <EntityHeaderSection flexGrow>\n <EntityHeaderList>\n {!section1?.hidden &&\n section1?.values?.length &&\n section1.values?.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n\n {!section2?.hidden &&\n section2?.values?.length &&\n section2.values?.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n\n {!section3?.hidden &&\n section3?.values?.length &&\n section3.values?.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n\n {!section4?.hidden &&\n section4?.values?.length &&\n section4.values?.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n </EntityHeaderList>\n </EntityHeaderSection>\n </EntityHeaderContainer>\n )}\n {/* */}\n <EntityHeaderContainer\n direction='row'\n showSeperator\n background={background}\n color={color}\n >\n {!compactSize && (\n <>\n {!section1?.hidden && (\n <EntityHeaderSection flexGrow>\n <EntityHeaderList>\n {!!section1?.values?.length &&\n section1.values.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n </EntityHeaderList>\n </EntityHeaderSection>\n )}\n {!section2?.hidden && (\n <EntityHeaderSection flexGrow>\n <EntityHeaderList>\n {!!section2?.values?.length &&\n section2.values.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n </EntityHeaderList>\n </EntityHeaderSection>\n )}\n {!section3?.hidden && (\n <EntityHeaderSection flexGrow>\n <EntityHeaderList>\n {!!section3?.values?.length &&\n section3.values.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n </EntityHeaderList>\n </EntityHeaderSection>\n )}\n {!section4?.hidden && (\n <EntityHeaderSection flexGrow>\n <EntityHeaderList>\n {!!section4?.values?.length &&\n section4.values.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n </EntityHeaderList>\n </EntityHeaderSection>\n )}\n </>\n )}\n {!kpiProps.hidden && (\n <EntityHeaderSection flexGrow>\n <EntityHeaderStatList flexGrow>\n {!kpi1?.hidden && (\n <EntityHeaderStatListItem\n value={kpi1?.value}\n label={kpi1?.label}\n labelColor={kpi1?.labelColor}\n flexGrow\n icon={\n <IconRenderer\n noBorder={true}\n removeContainer={true}\n value={{\n color: { hex: '#' + kpi1?.color },\n name: kpi1?.icon || 'ChartIcon'\n }}\n />\n }\n />\n )}\n {!kpi2?.hidden && (\n <EntityHeaderStatListItem\n value={kpi2?.value}\n label={kpi2?.label}\n labelColor={kpi2?.labelColor}\n flexGrow\n icon={\n <IconRenderer\n noBorder={true}\n removeContainer={true}\n value={{\n color: { hex: '#' + kpi2?.color },\n name: kpi2?.icon || 'ChartIcon'\n }}\n />\n }\n />\n )}\n {!kpi3?.hidden && (\n <EntityHeaderStatListItem\n value={kpi3?.value}\n label={kpi3?.label}\n labelColor={kpi3?.labelColor}\n flexGrow\n icon={\n <IconRenderer\n noBorder={true}\n removeContainer={true}\n value={{\n color: { hex: '#' + kpi3?.color },\n name: kpi3?.icon || 'ChartIcon'\n }}\n />\n }\n />\n )}\n {!kpi4?.hidden && (\n <EntityHeaderStatListItem\n value={kpi4?.value}\n label={kpi4?.label}\n labelColor={kpi4?.labelColor}\n flexGrow\n icon={\n <IconRenderer\n noBorder={true}\n removeContainer={true}\n value={{\n color: { hex: '#' + kpi4?.color },\n name: kpi4?.icon || 'ChartIcon'\n }}\n />\n }\n />\n )}\n </EntityHeaderStatList>\n </EntityHeaderSection>\n )}\n </EntityHeaderContainer>\n {(!hiddenSections.chips || !hiddenSections.alert) && (\n <EntityHeaderContainer\n className={classes.root}\n background={background}\n color={color}\n >\n {!hiddenSections.chips && (\n <EntityHeaderSection flexGrow alignItems={'center'}>\n <EntityHeaderFlags\n data={chips?.map((chip) => ({ label: chip }))}\n />\n </EntityHeaderSection>\n )}\n {/* */}\n <EntityHeaderSection flexGrow />\n {!hiddenSections.alert && (\n <EntityHeaderSection>\n {/* <PehAlertPill\n alertPillProps={{ errorLabel: '5', warningLabel: '2' }}\n /> */}\n {useUdpAlerts ? (\n <UdpAlertsContainer />\n ) : (\n <AlertPill\n errorCount={alerts?.error}\n warningCount={alerts?.warning}\n />\n )}\n </EntityHeaderSection>\n )}\n </EntityHeaderContainer>\n )}\n </div>\n );\n};\n\nEntityHeader.propTypes = {\n sectionProps: PropTypes.shape({\n section1: PropTypes.shape({\n hidden: PropTypes.bool,\n values: PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string\n })\n )\n }),\n section2: PropTypes.shape({\n hidden: PropTypes.bool,\n values: PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string\n })\n )\n }),\n section3: PropTypes.shape({\n hidden: PropTypes.bool,\n values: PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string\n })\n )\n })\n }).isRequired,\n background: PropTypes.string,\n color: PropTypes.string,\n kpiProps: PropTypes.shape({\n hidden: PropTypes.bool,\n kpi1: PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string,\n color: PropTypes.string,\n icon: PropTypes.string,\n hidden: PropTypes.bool\n }),\n kpi2: PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string,\n color: PropTypes.string,\n icon: PropTypes.string,\n hidden: PropTypes.bool\n }),\n kpi3: PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string,\n color: PropTypes.string,\n icon: PropTypes.string,\n hidden: PropTypes.bool\n }),\n kpi4: PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string,\n color: PropTypes.string,\n icon: PropTypes.string,\n hidden: PropTypes.bool\n })\n }).isRequired,\n hiddenSections: PropTypes.shape({\n alert: PropTypes.bool,\n chips: PropTypes.bool\n }),\n chips: PropTypes.arrayOf(PropTypes.string),\n alerts: PropTypes.shape({\n warning: PropTypes.number,\n error: PropTypes.number\n })\n};\n"],"mappings":";;;;;;;;;;;;;AAKA,MAAMA,cAAY,YAAW,WAAU;CACrC,OAAM,WAAU;EACd,SAAS;EACT,eAAe,MAAM,cAAc,WAAW,WAAW;EAC1D;CACD,aAAY,WAAU;EACpB,iBAAiB,OACf,MAAM,UAAU,YACZ,MAAM,QAAQ,QAAQ,OACtB,MAAM,QAAQ,UAAU,MAC5B,GACD;EACD,OAAO,MAAM,QAAQ,gBACnB,MAAM,UAAU,YACZ,MAAM,QAAQ,QAAQ,OACtB,MAAM,QAAQ,UAAU,KAC7B;EACF;CACD,aAAY,WAAU,EACpB,iBAAiB,MACf,MAAM,UAAU,YACZ,MAAM,QAAQ,QAAQ,OACtB,MAAM,QAAQ,UAAU,MAC5B,IACD,EACF;CACD,eAAc,WAAU;EACtB,iBAAiB,MAAM;EACvB,OAAO,MAAM;EACd;CACF,EAAE;AAEH,MAAa,yBAAwB,UAAS;CAC5C,MAAM,EAAE,UAAU,eAAe,eAAe;CAChD,MAAM,gBAAgB,SAAS,QAAQ,SAAS;CAChD,MAAM,UAAUA,YAAU,MAAM;AAEhC,QACE,oCAAC,SACC,WAAW,KAAK;GACb,QAAQ,OAAO;GACf,QAAQ,SAAS,eAAe,WAAW,CAAC;GAC5C,QAAQ,aAAa,eAAe;GACpC,QAAQ,aAAa,eAAe;GACpC,QAAQ,eACP,cACA,eAAe,WACf,eAAe,UACf,eAAe;EAClB,CAAC,IAED,SAAS,IAAI,gBAAgB,OAAO,UAAU;EAC7C,MAAM,SAAS,UAAU,cAAc,SAAS;AAChD,SACE,0DACG,aAAa,OAAO,EACnB,QACD,CAAC,EACD,CAAC,UAAU,iBACV,oCAAC;GAAQ,aAAY;GAAW;IAAW,CAE5C;GAEL,CACE;;AAIV,sBAAsB,YAAY;CAChC,UAAU,UAAU,KAAK;CACzB,eAAe,UAAU;CACzB,YAAY,UAAU,MAAM;EAAC;EAAS;EAAQ;EAAO,CAAC;CACtD,WAAW,UAAU,MAAM,CAAC,OAAO,SAAS,CAAC;CAC7C,OAAO,UAAU,MAAM,CAAC,WAAW,YAAY,CAAC;CACjD;AAED,sBAAsB,eAAe;CACnC,eAAe;CACf,YAAY;CACZ,WAAW;CACX,OAAO;CACR;;;;AClFD,MAAMC,cAAY,YAAW,WAAU,EACrC,MAAM,EAEL,EACF,EAAE;AAEH,MAAa,oBAAmB,UAAS;CACvC,MAAM,EAAE,UAAU,gBAAgB,UAAU;CAC5C,MAAM,gBAAgB,SAAS,QAAQ,SAAS;CAChD,MAAM,UAAUA,YAAU,MAAM;AAEhC,QACE,oCAAC,SACC,WAAW,KAAK,GACb,QAAQ,OAAO,MACjB,CAAC,IAED,SAAS,IAAI,gBAAgB,OAAO,UAAU;EAC7C,MAAM,SAAS,UAAU,cAAc,SAAS;AAChD,SACE,0DACG,aAAa,OAAO,EACnB,QACD,CAAC,EACD,CAAC,UAAU,iBAAiB,oCAAC,cAAU,CACvC;GAEL,CACE;;;;;AC5BV,MAAMC,cAAY,YAAY,WAAW;CACvC,MAAM,EACJ,SAAS,QACV;CACD,WAAW;EACT,OAAO;EACP,aAAa,MAAM,QAAQ,GAAI;EAC/B,SAAS;EACV;CACD,WAAW,EACT,OAAO,WAER;CACD,MAAM;EACJ,OAAO;EACP,gBAAgB;EAChB,WAAW,EACT,gBAAgB,aACjB;EACF;CACF,EAAE;AAEH,MAAa,wBAAwB,UAAU;CAC7C,MAAM,EACJ,OACA,OACA,MACA,qBAAqB,OACrB,iBAAiB,UACf;CACJ,MAAM,UAAUA,YAAU,MAAM;AAEhC,QACE,oCAAC,SACC,WAAW,KAAK;GACb,QAAQ,OAAO;GACf,QAAQ,cAAc,CAAC;EACzB,CAAC,IAED,CAAC,CAAC,SACD,oCAAC;EAAW,SAAS;EAAS,WAAW,QAAQ;IAC9C,OACA,CAAC,sBAAsB,IACb,EAEd,CAAC,CAAC,SACD,oCAAC;EACC,SAAS;EACT,WAAW,KAAK;IACb,QAAQ,YAAY;IACpB,QAAQ,kBAAkB;GAC5B,CAAC;IAED,OACC,oCAAC;EACC,MAAM;EACN,WAAW,QAAQ;EACnB,QAAO;IAEN,MACI,GAEP,MAES,CAEX;;;;;AClEV,MAAMC,cAAY,YAAW,WAAU;CACrC,MAAM;EACJ,SAAS;EACT,UAAU;EACV,SAAS,EACP,YAAY,GACb;EACF;CACD,cAAc,EACZ,UAAU,GACX;CACF,EAAE;AAEH,MAAa,wBAAuB,UAAS;CAC3C,MAAM,EAAE,UAAU,eAAe,WAAW,UAAU;CACtD,MAAM,gBAAgB,SAAS,QAAQ,SAAS;CAChD,MAAM,UAAUA,YAAU,MAAM;AAEhC,QACE,oCAAC,SACC,WAAW,KAAK;GACb,QAAQ,OAAO;GACf,QAAQ,eAAe;EACzB,CAAC,IAED,SAAS,IAAI,gBAAgB,OAAO,UAAU;EAC7C,MAAM,SAAS,UAAU,cAAc,SAAS;AAChD,SACE,0DACG,aAAa,OAAO,EACnB,QACD,CAAC,EACD,CAAC,UAAU,iBACV,oCAAC;GAAQ,aAAY;GAAW;IAAW,CAE5C;GAEL,CACE;;;;;ACtCV,MAAMC,cAAY,YAAW,WAAU;CACrC,MAAM;EACJ,SAAS;EACT,eAAe;EACf,YAAY;EAEb;CACD,cAAc,EACZ,UAAU,GACX;CACD,YAAW,WAAU;EACnB,gBAAgB;EAChB,SAAS,MAAM,QAAQ,EAAE;EAC1B;CACD,mBAAkB,WAAU,EAC1B,iBAAiB,MACf,MAAM,QAAQ,SAAS,SACnB,MAAM,QAAQ,OAAO,QACrB,MAAM,QAAQ,OAAO,OACzB,IACD,EACF;CACD,iBAAgB,WAAU,EACxB,iBAAiB,MACf,MAAM,QAAQ,MAAM,MACpB,MAAM,QAAQ,SAAS,SAAS,KAAM,GACvC,EACF;CACD,mBAAkB,WAAU,EAC1B,iBAAiB,MACf,MAAM,QAAQ,QAAQ,MACtB,MAAM,QAAQ,SAAS,SAAS,KAAM,GACvC,EACF;CACD,WAAW;EACT,OAAO;EACP,SAAS;EACV;CACD,iBAAiB,WAAW,EAC1B,OAAO,MAAM,QAAQ,MAAM,MAC5B;CACD,mBAAmB,WAAW,EAC5B,OAAO,MAAM,QAAQ,QAAQ,MAC9B;CACD,WAAW;EACT,OAAO;EACP,YAAY,MAAM,WAAW;EAC7B,SAAS;EACT,gBAAgB;EAChB,YAAY;EACb;CACD,aAAa,EACX,aAAa,MAAM,QAAQ,GAAI,EAChC;CACD,YAAY,EAAE;CACd,MAAM,EACJ,aAAa,MAAM,QAAQ,EAAE,EAC9B;CACD,YAAY,EACV,iBAAiB,eAClB;CACD,UAAS,WAAU;EACjB,SAAS;EACT,eAAe;EAEf,YAAY,MAAM,OAAO,SAAS;EACnC;CACF,EAAE;AAEH,MAAa,4BAA2B,UAAS;CAC/C,MAAM,EACJ,QAAQ,SACR,QAAQ,SACR,aACA,YACA,WAAW,OACX,YACA,SACE;CAEJ,MAAM,UAAUA,YAAU,MAAM;AAEhC,QACE,oCAAC,SACC,WAAW,KAAK;GACb,QAAQ,OAAO;GACf,QAAQ,eAAe;GACvB,QAAQ,YAAY;EAItB,CAAC,IAED,QACC,oCAAC,SAAI,WAAW,QAAQ,QACtB,oCAAC,UAAO,WAAW,QAAQ,cAAa,KAAc,CAClD,EAER,oCAAC,SAAI,WAAW,QAAQ,WACrB,CAAC,CAAC,SACD,oCAAC,SACC,WAAW,KAAK,GACb,QAAQ,YAAY,MACtB,CAAC,IAED,eACC,oCAAC;EAAW,SAAS;EAAS,WAAW,QAAQ;IAC9C,YACU,EAEf,oCAAC;EACC,SAAS;EACT,WAAW,KAAK;IACb,QAAQ,iBAAiB,eAAe;IACxC,QAAQ,mBAAmB,eAAe;GAC5C,CAAC;IAED,MACU,EACZ,cACC,oCAAC;EAAW,SAAS;EAAS,WAAW,QAAQ;IAC9C,WACU,CAEX,EAEP,CAAC,CAAC,SACD,oCAAC;EACC,SAAS;EACT,WAAW,QAAQ;EACnB,WAAU;IAET,MACU,CAEX,CACF;;;;;ACvIV,MAAMC,cAAY,YAAY,WAAW;CACvC,MAAM,EACJ,SAAS,QACV;CACD,cAAc,EACZ,UAAU,GACX;CACD,oBAAoB,EAClB,YAAY,cACb;CACD,qBAAqB,EACnB,YAAY,UACb;CACD,kBAAkB,EAChB,YAAY,YACb;CACD,sBAAsB,EACpB,YAAY,WACb;CACD,YAAY;EACV,aAAa,MAAM,QAAQ,EAAE;EAC7B,cAAc,MAAM,QAAQ,EAAE;EAC/B;CACD,aAAa;EACX,YAAY,MAAM,QAAQ,EAAE;EAC5B,eAAe,MAAM,QAAQ,EAAE;EAChC;CACD,sBAAsB,EACpB,gBAAgB,cACjB;CACD,oBAAoB,EAClB,gBAAgB,YACjB;CACF,EAAE;AAEH,MAAa,uBAAuB,UAAU;CAC5C,MAAM,EACJ,UACA,eACA,gBACA,UACA,gBACA,eACE;CACJ,MAAM,UAAUA,YAAU,MAAM;AAEhC,QACE,oCAAC,SACC,WAAW,KAAK;GACb,QAAQ,OAAO;GACf,QAAQ,aAAa,CAAC;GACtB,QAAQ,cAAc,CAAC;GACvB,QAAQ,eAAe;GACvB,QAAQ,uBAAuB,mBAAmB;GAClD,QAAQ,qBAAqB,mBAAmB;GAChD,QAAQ,qBAAqB,eAAe;GAC5C,QAAQ,sBAAsB,eAAe;GAC7C,QAAQ,mBAAmB,eAAe;GAC1C,QAAQ,uBAAuB,eAAe;EAChD,CAAC,IAED,SACG;;AAIV,oBAAoB,YAAY;CAC9B,UAAU,UAAU,KAAK;CACzB,eAAe,UAAU;CACzB,gBAAgB,UAAU;CAC1B,UAAU,UAAU;CACpB,gBAAgB,UAAU,MAAM,CAAC,SAAS,MAAM,CAAC;CACjD,YAAY,UAAU,MAAM;EAAC;EAAS;EAAU;EAAO;EAAU,CAAC;CACnE;AAED,oBAAoB,eAAe;CACjC,eAAe;CACf,gBAAgB;CAChB,UAAU;CACX;;;;;;;;;;;;;ACvED,SAAS,gBAAgB,KAAK;CAC5B,MAAM,QAAQC,YAAU;CACxB,MAAM,CAAC,OAAO,YAAY,SAAS,KAAK;AAExC,uBAAsB;EACpB,MAAM,iBAAiB,IAAI,gBAAe,YAAW;AACnD,QAAK,IAAI,SAAS,QAChB,KAAI,MAAM,WAAW,IAAI,QACvB,UAAS,MAAM,YAAY,MAAM;IAGrC;AAEF,iBAAe,QAAQ,IAAI,QAAQ;AAEnC,eAAa;AACX,kBAAe,UAAU,IAAI,QAAQ;;IAEtC,CAAC,IAAI,CAAC;CAET,MAAM,oBACJ,UAAU,OACN,OAAO,KAAK,MAAM,YAAY,OAAO,CAAC,QAAQ,KAAK,eAAe;AAChE,MAAI,SAAS,MAAM,YAAY,OAAO,YACpC,QAAO;AAET,SAAO;IACN,KAAK,GACR;CAEN,MAAM,kBAAiB,eAAc;EACnC,MAAM,cAAc,OAAO,KAAK,MAAM,YAAY,OAAO;AAGzD,SAFc,YAAY,QAAQ,WAAW,IACxB,YAAY,QAAQ,kBAAkB;;CAI7D,MAAM,oBAAmB,eAAc;EACrC,MAAM,cAAc,OAAO,KAAK,MAAM,YAAY,OAAO;AAGzD,SAFc,YAAY,QAAQ,WAAW,IACxB,YAAY,QAAQ,kBAAkB;;AAI7D,QAAO;EACL;EACA;EACA;EACD;;AAKH,gBAAgB,YAAY,EAC1B,KAAK,UAAU,MAAM,EACnB,SAAS,UAAU,WAAW,QAAQ,EACvC,CAAC,EACH;;;;AChED,MAAMC,cAAY,YAAW,WAAU;CACrC,UAAU,EACR,aAAa,MAAM,QAAQ,EAAE,EAC9B;CACD,eAAe;EACb,cAAc,MAAM,QAAQ,GAAG;EAC/B,SAAS;GACP,aAAa,MAAM,QAAQ,EAAE;GAC7B,cAAc,MAAM,QAAQ,EAAE;GAC/B;EACF;CACF,EAAE;AAEH,SAAS,WAAW,KAAK;AACvB,QAAO,IAAI,OAAO,EAAE,CAAC,aAAa;;AAGpC,MAAa,qBAAqB,EAAE,OAAO,EAAE,EAAE,QAAQ,gBAAgB;CACrE,MAAM,UAAUA,aAAW;AAE3B,KAAI,CAAC,QAAQ,KAAK,WAAW,EAC3B;AAGF,QACE,0DACE,oCAAC;EACC,MAAK;EACL,WAAW;EACX,WAAW,QAAQ;GACnB,EACF,oCAAC,SAAI,WAAW,QAAQ,iBACrB,KAAK,KAAI,SAAQ;AAChB,SACE,oCAAC;GACC;GACA,iBAAiB,WAAW,KAAK,MAAM;GACvC,OAAO,KAAK;GACZ,mBAAmB,KAAK;IACxB;GAEJ,CACE,CACL;;;;;AChCP,MAAM,YAAY,YAAY,WAAW,EACvC,MAAM,EAAE,EACT,EAAE;AAEH,MAAa,gBAAgB,UAAU;CACrC,MAAM,EACJ,cACA,YACA,OACA,UACA,gBACA,OACA,QACA,iBACE;CAEJ,MAAM,UAAU,UAAU,MAAM;CAChC,MAAM,EAAE,UAAU,UAAU,UAAU,aAAa;CACnD,MAAM,EAAE,MAAM,MAAM,MAAM,SAAS;CAEnC,MAAM,eAAe,QAAQ;CAC7B,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CAEpD,MAAM,EAAE,mBAAmB,gBAAgB,aAAa;AAExD,iBAAgB;AACd,MAAI,eAAe,KAAK,CACtB,gBAAe,MAAM;MAGrB,gBAAe,KAAK;IAGrB,CAAC,eAAe,CAAC;AAEpB,QACE,oCAAC,SAAI,KAAK,gBAEP,CAAC,CAAC,eACD,oCAAC;EACC,WAAU;EACV;EACY;EACL;IAEP,oCAAC,uBAAoB,kBACnB,oCAAC,wBACE,CAAC,UAAU,UACV,UAAU,QAAQ,UAClB,SAAS,QAAQ,KAAK,SACpB,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,MAAM,MAAM;GACZ,CACF,EAEH,CAAC,UAAU,UACV,UAAU,QAAQ,UAClB,SAAS,QAAQ,KAAK,SACpB,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,MAAM,MAAM;GACZ,CACF,EAEH,CAAC,UAAU,UACV,UAAU,QAAQ,UAClB,SAAS,QAAQ,KAAK,SACpB,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,MAAM,MAAM;GACZ,CACF,EAEH,CAAC,UAAU,UACV,UAAU,QAAQ,UAClB,SAAS,QAAQ,KAAK,SACpB,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,MAAM,MAAM;GACZ,CACF,CACa,CACC,CACA,EAG1B,oCAAC;EACC,WAAU;EACV;EACY;EACL;IAEN,CAAC,eACA,0DACG,CAAC,UAAU,UACV,oCAAC,uBAAoB,kBACnB,oCAAC,wBACE,CAAC,CAAC,UAAU,QAAQ,UACnB,SAAS,OAAO,KAAK,SACnB,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,MAAM,MAAM;GACZ,CACF,CACa,CACC,EAEvB,CAAC,UAAU,UACV,oCAAC,uBAAoB,kBACnB,oCAAC,wBACE,CAAC,CAAC,UAAU,QAAQ,UACnB,SAAS,OAAO,KAAK,SACnB,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,MAAM,MAAM;GACZ,CACF,CACa,CACC,EAEvB,CAAC,UAAU,UACV,oCAAC,uBAAoB,kBACnB,oCAAC,wBACE,CAAC,CAAC,UAAU,QAAQ,UACnB,SAAS,OAAO,KAAK,SACnB,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,MAAM,MAAM;GACZ,CACF,CACa,CACC,EAEvB,CAAC,UAAU,UACV,oCAAC,uBAAoB,kBACnB,oCAAC,wBACE,CAAC,CAAC,UAAU,QAAQ,UACnB,SAAS,OAAO,KAAK,SACnB,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,MAAM,MAAM;GACZ,CACF,CACa,CACC,CAEvB,EAEJ,CAAC,SAAS,UACT,oCAAC,uBAAoB,kBACnB,oCAAC,wBAAqB,kBACnB,CAAC,MAAM,UACN,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,YAAY,MAAM;EAClB;EACA,MACE,oCAAC;GACC,UAAU;GACV,iBAAiB;GACjB,OAAO;IACL,OAAO,EAAE,KAAK,MAAM,MAAM,OAAO;IACjC,MAAM,MAAM,QAAQ;IACrB;IACD;GAEJ,EAEH,CAAC,MAAM,UACN,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,YAAY,MAAM;EAClB;EACA,MACE,oCAAC;GACC,UAAU;GACV,iBAAiB;GACjB,OAAO;IACL,OAAO,EAAE,KAAK,MAAM,MAAM,OAAO;IACjC,MAAM,MAAM,QAAQ;IACrB;IACD;GAEJ,EAEH,CAAC,MAAM,UACN,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,YAAY,MAAM;EAClB;EACA,MACE,oCAAC;GACC,UAAU;GACV,iBAAiB;GACjB,OAAO;IACL,OAAO,EAAE,KAAK,MAAM,MAAM,OAAO;IACjC,MAAM,MAAM,QAAQ;IACrB;IACD;GAEJ,EAEH,CAAC,MAAM,UACN,oCAAC;EACC,OAAO,MAAM;EACb,OAAO,MAAM;EACb,YAAY,MAAM;EAClB;EACA,MACE,oCAAC;GACC,UAAU;GACV,iBAAiB;GACjB,OAAO;IACL,OAAO,EAAE,KAAK,MAAM,MAAM,OAAO;IACjC,MAAM,MAAM,QAAQ;IACrB;IACD;GAEJ,CAEiB,CACH,CAEF,GACtB,CAAC,eAAe,SAAS,CAAC,eAAe,UACzC,oCAAC;EACC,WAAW,QAAQ;EACP;EACL;IAEN,CAAC,eAAe,SACf,oCAAC;EAAoB;EAAS,YAAY;IACxC,oCAAC,qBACC,MAAM,OAAO,KAAK,UAAU,EAAE,OAAO,MAAM,EAAE,GAC7C,CACkB,EAGxB,oCAAC,uBAAoB,iBAAW,EAC/B,CAAC,eAAe,SACf,oCAAC,2BAIE,eACC,oCAAC,yBAAqB,GAEtB,oCAAC;EACC,YAAY,QAAQ;EACpB,cAAc,QAAQ;GACtB,CAEgB,CAEF,CAEtB;;AAIV,aAAa,YAAY;CACvB,cAAc,UAAU,MAAM;EAC5B,UAAU,UAAU,MAAM;GACxB,QAAQ,UAAU;GAClB,QAAQ,UAAU,QAChB,UAAU,MAAM;IACd,OAAO,UAAU;IACjB,OAAO,UAAU;IAClB,CAAC,CACH;GACF,CAAC;EACF,UAAU,UAAU,MAAM;GACxB,QAAQ,UAAU;GAClB,QAAQ,UAAU,QAChB,UAAU,MAAM;IACd,OAAO,UAAU;IACjB,OAAO,UAAU;IAClB,CAAC,CACH;GACF,CAAC;EACF,UAAU,UAAU,MAAM;GACxB,QAAQ,UAAU;GAClB,QAAQ,UAAU,QAChB,UAAU,MAAM;IACd,OAAO,UAAU;IACjB,OAAO,UAAU;IAClB,CAAC,CACH;GACF,CAAC;EACH,CAAC,CAAC;CACH,YAAY,UAAU;CACtB,OAAO,UAAU;CACjB,UAAU,UAAU,MAAM;EACxB,QAAQ,UAAU;EAClB,MAAM,UAAU,MAAM;GACpB,OAAO,UAAU;GACjB,OAAO,UAAU;GACjB,OAAO,UAAU;GACjB,MAAM,UAAU;GAChB,QAAQ,UAAU;GACnB,CAAC;EACF,MAAM,UAAU,MAAM;GACpB,OAAO,UAAU;GACjB,OAAO,UAAU;GACjB,OAAO,UAAU;GACjB,MAAM,UAAU;GAChB,QAAQ,UAAU;GACnB,CAAC;EACF,MAAM,UAAU,MAAM;GACpB,OAAO,UAAU;GACjB,OAAO,UAAU;GACjB,OAAO,UAAU;GACjB,MAAM,UAAU;GAChB,QAAQ,UAAU;GACnB,CAAC;EACF,MAAM,UAAU,MAAM;GACpB,OAAO,UAAU;GACjB,OAAO,UAAU;GACjB,OAAO,UAAU;GACjB,MAAM,UAAU;GAChB,QAAQ,UAAU;GACnB,CAAC;EACH,CAAC,CAAC;CACH,gBAAgB,UAAU,MAAM;EAC9B,OAAO,UAAU;EACjB,OAAO,UAAU;EAClB,CAAC;CACF,OAAO,UAAU,QAAQ,UAAU,OAAO;CAC1C,QAAQ,UAAU,MAAM;EACtB,SAAS,UAAU;EACnB,OAAO,UAAU;EAClB,CAAC;CACH"}
1
+ {"version":3,"file":"EntityHeader-C3Ae5BLK.js","names":["useStyles","useStyles","useStyles","useStyles","useStyles","useStyles","useTheme","useStyles"],"sources":["../src/UI/dataDisplay/entityHeader/ui/EntityHeaderContainer.jsx","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderList.jsx","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderListItem.jsx","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderStatList.jsx","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderStatListItem.jsx","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderSection.jsx","../src/UI/dataDisplay/entityHeader/functions/useElementWidth.js","../src/UI/dataDisplay/entityHeader/ui/EntityHeaderFlags.jsx","../src/UI/dataDisplay/entityHeader/EntityHeader.jsx"],"sourcesContent":["import React, { Children, cloneElement } from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { makeStyles, Divider, darken, alpha } from '@material-ui/core';\n\nconst useStyles = makeStyles(theme => ({\n root: props => ({\n display: 'flex',\n flexDirection: props.direction === 'column' ? 'column' : 'row',\n }),\n rootBgDark: props => ({\n backgroundColor: darken(\n props.color === 'primary'\n ? theme.palette.primary.main\n : theme.palette.secondary.main,\n 0.2\n ),\n color: theme.palette.getContrastText(\n props.color === 'primary'\n ? theme.palette.primary.main\n : theme.palette.secondary.main\n ),\n }),\n rootBgSoft: props => ({\n backgroundColor: alpha(\n props.color === 'primary'\n ? theme.palette.primary.main\n : theme.palette.secondary.main,\n 0.15\n ),\n }),\n rootBgCustom: props => ({\n backgroundColor: props.background,\n color: props.color,\n }),\n}));\n\nexport const EntityHeaderContainer = props => {\n const { children, showSeperator, background } = props;\n const arrayChildren = Children.toArray(children);\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true, // always applies\n [classes.rootBg]: background === 'light' || !background, // if background = 'light'\n [classes.rootBgDark]: background === 'dark', // if background = 'dark'\n [classes.rootBgSoft]: background === 'soft', // if background = 'soft'\n [classes.rootBgCustom]:\n background &&\n background !== 'light' &&\n background !== 'dark' &&\n background !== 'soft',\n })}\n >\n {Children.map(arrayChildren, (child, index) => {\n const isLast = index === arrayChildren.length - 1;\n return (\n <>\n {cloneElement(child, {\n isLast,\n })}\n {!isLast && showSeperator && (\n <Divider orientation=\"vertical\" flexItem />\n )}\n </>\n );\n })}\n </div>\n );\n};\n\nEntityHeaderContainer.propTypes = {\n children: PropTypes.node.isRequired,\n showSeperator: PropTypes.bool,\n background: PropTypes.oneOf(['light', 'dark', 'soft']),\n direction: PropTypes.oneOf(['row', 'column']),\n color: PropTypes.oneOf(['primary', 'secondary']),\n};\n\nEntityHeaderContainer.defaultProps = {\n showSeperator: true,\n background: 'light',\n direction: 'row',\n color: 'primary',\n};\n","import React, { Children, cloneElement } from 'react';\nimport clsx from 'clsx';\nimport { makeStyles, Divider } from '@material-ui/core';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n // listStyle: 'none',\n },\n}));\n\nexport const EntityHeaderList = props => {\n const { children, showSeperator = false } = props;\n const arrayChildren = Children.toArray(children);\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true,\n })}\n >\n {Children.map(arrayChildren, (child, index) => {\n const isLast = index === arrayChildren.length - 1;\n return (\n <>\n {cloneElement(child, {\n isLast,\n })}\n {!isLast && showSeperator && <Divider />}\n </>\n );\n })}\n </div>\n );\n};\n","import React, { useState } from 'react';\nimport clsx from 'clsx';\nimport { Link, lighten, makeStyles, Typography } from '@material-ui/core';\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n display: 'flex'\n },\n labelRoot: {\n color: 'inherit',\n marginRight: theme.spacing(0.5),\n opacity: 0.6\n },\n valueRoot: {\n color: 'inherit'\n // fontWeight: theme.typography.fontWeightMedium,\n },\n link: {\n color: 'inherit',\n textDecoration: 'none',\n '&:hover': {\n textDecoration: 'underline'\n }\n }\n}));\n\nexport const EntityHeaderListItem = (props) => {\n const {\n label,\n value,\n link,\n hideLabelSeperator = false,\n disablePadding = false\n } = props;\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true,\n [classes.rootPadding]: !disablePadding\n })}\n >\n {!!label && (\n <Typography variant={'body1'} className={classes.labelRoot}>\n {label}\n {!hideLabelSeperator && ':'}\n </Typography>\n )}\n {!!value && (\n <Typography\n variant={'body1'}\n className={clsx({\n [classes.valueRoot]: true,\n [classes.valueFontWeigth]: true\n })}\n >\n {link ? (\n <Link\n href={link}\n className={classes.link}\n target='_blank'\n >\n {value}\n </Link>\n ) : (\n value\n )}\n </Typography>\n )}\n </div>\n );\n};\n","import React, { Children, cloneElement, useState } from 'react';\nimport clsx from 'clsx';\nimport { makeStyles, Typography, Divider } from '@material-ui/core';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n display: 'flex',\n flexWrap: 'wrap',\n '& > *': {\n marginLeft: 1,\n },\n },\n rootFlexGrow: {\n flexGrow: 1,\n },\n}));\n\nexport const EntityHeaderStatList = props => {\n const { children, showSeperator, flexGrow = false } = props;\n const arrayChildren = Children.toArray(children);\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true, //always applies\n [classes.rootFlexGrow]: flexGrow,\n })}\n >\n {Children.map(arrayChildren, (child, index) => {\n const isLast = index === arrayChildren.length - 1;\n return (\n <>\n {cloneElement(child, {\n isLast,\n })}\n {!isLast && showSeperator && (\n <Divider orientation=\"vertical\" flexItem />\n )}\n </>\n );\n })}\n </div>\n );\n};\n","import React from 'react';\nimport clsx from 'clsx';\nimport { alpha, Avatar, makeStyles, Typography } from '@material-ui/core';\n\nconst useStyles = makeStyles(theme => ({\n root: {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n // padding: theme.spacing(1),\n },\n rootFlexGrow: {\n flexGrow: 1,\n },\n rootBlock: props => ({\n justifyContent: 'center',\n padding: theme.spacing(1),\n }),\n rootBlockDefault: props => ({\n backgroundColor: alpha(\n theme.palette.type === 'dark'\n ? theme.palette.common.black\n : theme.palette.common.white,\n 0.25\n ),\n }),\n rootBlockError: props => ({\n backgroundColor: alpha(\n theme.palette.error.main,\n theme.palette.type === 'dark' ? 0.7 : 0.1\n ),\n }),\n rootBlockSuccess: props => ({\n backgroundColor: alpha(\n theme.palette.success.main,\n theme.palette.type === 'dark' ? 0.2 : 0.3\n ),\n }),\n labelRoot: {\n color: 'inherit',\n opacity: 0.6,\n },\n rootLabelError: (props) => ({\n color: theme.palette.error.main\n }),\n rootLabelSuccess: (props) => ({\n color: theme.palette.success.main\n }),\n valueRoot: {\n color: 'inherit',\n fontWeight: theme.typography.fontWeightMedium,\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n },\n beforeValue: {\n marginRight: theme.spacing(0.3),\n },\n afterValue: {},\n icon: {\n marginRight: theme.spacing(1),\n },\n iconAvatar: {\n backgroundColor: 'transparent',\n },\n content: props => ({\n display: 'flex',\n flexDirection: 'column',\n // alignItems: 'center',\n alignItems: props.icon ? 'left' : 'center',\n }),\n}));\n\nexport const EntityHeaderStatListItem = props => {\n const {\n label = 'Label',\n value = 'Value',\n beforeValue,\n afterValue,\n flexGrow = false,\n labelColor,\n icon,\n } = props;\n\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true,\n [classes.rootFlexGrow]: flexGrow,\n [classes.rootBlock]: true,\n // [classes.rootBlockDefault]: !labelColor,\n // [classes.rootBlockError]: labelColor === 'error',\n // [classes.rootBlockSuccess]: labelColor === 'success',\n })}\n >\n {icon && (\n <div className={classes.icon}>\n <Avatar className={classes.iconAvatar}>{icon}</Avatar>\n </div>\n )}\n <div className={classes.content}>\n {!!value && (\n <div\n className={clsx({\n [classes.valueRoot]: true,\n })}\n >\n {beforeValue && (\n <Typography variant={'body1'} className={classes.beforeValue}>\n {beforeValue}\n </Typography>\n )}\n <Typography\n variant={'h5'}\n className={clsx({\n [classes.rootLabelError]: labelColor === 'error',\n [classes.rootLabelSuccess]: labelColor === 'success'\n })}\n >\n {value}\n </Typography>\n {afterValue && (\n <Typography variant={'body1'} className={classes.afterValue}>\n {afterValue}\n </Typography>\n )}\n </div>\n )}\n {!!label && (\n <Typography\n variant={'subtitle3'}\n className={classes.labelRoot}\n component=\"div\"\n >\n {label}\n </Typography>\n )}\n </div>\n </div>\n );\n};\n","import React from 'react';\nimport clsx from 'clsx';\nimport PropTypes from 'prop-types';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n display: 'flex'\n },\n rootFlexGrow: {\n flexGrow: 1\n },\n rootFlexAlignStart: {\n alignItems: 'flex-start'\n },\n rootFlexAlignCenter: {\n alignItems: 'center'\n },\n rootFlexAlignEnd: {\n alignItems: 'flex-end'\n },\n rootFlexAlignStretch: {\n alignItems: 'stretch'\n },\n rootGutter: {\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2)\n },\n rootPadding: {\n paddingTop: theme.spacing(1),\n paddingBottom: theme.spacing(1)\n },\n rootFlexJustifyStart: {\n justifyContent: 'flex-start'\n },\n rootFlexJustifyEnd: {\n justifyContent: 'flex-end'\n }\n}));\n\nexport const EntityHeaderSection = (props) => {\n const {\n children,\n disableGutter,\n disablePadding,\n flexGrow,\n justifyContent,\n alignItems\n } = props;\n const classes = useStyles(props);\n\n return (\n <div\n className={clsx({\n [classes.root]: true, //always applies\n [classes.rootGutter]: !disableGutter,\n [classes.rootPadding]: !disablePadding,\n [classes.rootFlexGrow]: flexGrow,\n [classes.rootFlexJustifyStart]: justifyContent === 'start',\n [classes.rootFlexJustifyEnd]: justifyContent === 'end',\n [classes.rootFlexAlignStart]: alignItems === 'start',\n [classes.rootFlexAlignCenter]: alignItems === 'center',\n [classes.rootFlexAlignEnd]: alignItems === 'end',\n [classes.rootFlexAlignStretch]: alignItems === 'stretch'\n })}\n >\n {children}\n </div>\n );\n};\n\nEntityHeaderSection.propTypes = {\n children: PropTypes.node.isRequired,\n disableGutter: PropTypes.bool,\n disablePadding: PropTypes.bool,\n flexGrow: PropTypes.bool,\n justifyContent: PropTypes.oneOf(['start', 'end']),\n alignItems: PropTypes.oneOf(['start', 'center', 'end', 'stretch'])\n};\n\nEntityHeaderSection.defaultProps = {\n disableGutter: false,\n disablePadding: false,\n flexGrow: false\n};\n","import { useTheme } from '@material-ui/core/styles';\nimport { useLayoutEffect, useState } from 'react';\nimport PropTypes from 'prop-types';\n\n/**\n * Custom hook that returns the current breakpoint of a provided element's width and helpers to compare against breakpoints.\n * @param {any} ref - The ref object whose current element will be observed for width changes.\n * @returns {{\n * currentBreakpoint: string | null,\n * isBreakpointUp: (breakpoint: string) => boolean,\n * isBreakpointDown: (breakpoint: string) => boolean,\n * }}\n */\nfunction useElementWidth(ref) {\n const theme = useTheme();\n const [width, setWidth] = useState(null);\n\n useLayoutEffect(() => {\n const resizeObserver = new ResizeObserver(entries => {\n for (let entry of entries) {\n if (entry.target === ref.current) {\n setWidth(entry.contentRect.width);\n }\n }\n });\n\n resizeObserver.observe(ref.current);\n\n return () => {\n resizeObserver.unobserve(ref.current);\n };\n }, [ref]);\n\n const currentBreakpoint =\n width !== null\n ? Object.keys(theme.breakpoints.values).reduce((acc, breakpoint) => {\n if (width >= theme.breakpoints.values[breakpoint]) {\n return breakpoint;\n }\n return acc;\n }, null)\n : null;\n\n const isBreakpointUp = breakpoint => {\n const breakpoints = Object.keys(theme.breakpoints.values);\n const index = breakpoints.indexOf(breakpoint);\n const currentIndex = breakpoints.indexOf(currentBreakpoint);\n return index <= currentIndex;\n };\n\n const isBreakpointDown = breakpoint => {\n const breakpoints = Object.keys(theme.breakpoints.values);\n const index = breakpoints.indexOf(breakpoint);\n const currentIndex = breakpoints.indexOf(currentBreakpoint);\n return index >= currentIndex;\n };\n\n return {\n currentBreakpoint,\n isBreakpointUp,\n isBreakpointDown,\n };\n}\n\nexport { useElementWidth };\n\nuseElementWidth.propTypes = {\n ref: PropTypes.shape({\n current: PropTypes.instanceOf(Element),\n }),\n};\n","import React from 'react';\nimport { makeStyles } from '@material-ui/core';\nimport { ChipAlphabet } from '../../ChipAlphabet';\nimport { FluentIcon } from '../../../../utilities/iconLibrary/FluentIcon';\nimport { FlagIcon } from '@fluentui/react-icons';\n\nconst useStyles = makeStyles(theme => ({\n flagIcon: {\n marginRight: theme.spacing(2),\n },\n chipContainer: {\n marginBottom: theme.spacing(-1),\n '& > *': {\n marginRight: theme.spacing(1),\n marginBottom: theme.spacing(1),\n },\n },\n}));\n\nfunction flagLetter(str) {\n return str.charAt(0).toUpperCase();\n}\n\nexport const EntityHeaderFlags = ({ data = [], color = 'primary' }) => {\n const classes = useStyles();\n\n if (!data && data.length === 0) {\n return;\n }\n\n return (\n <>\n <FluentIcon\n size=\"small\"\n component={FlagIcon}\n className={classes.flagIcon}\n />\n <div className={classes.chipContainer}>\n {data.map(item => {\n return (\n <ChipAlphabet\n avatar\n avatarCharacter={flagLetter(item.label)}\n label={item.label}\n handleClick={() => item.handleClick}\n />\n );\n })}\n </div>\n </>\n );\n};\n","import React, { useRef, useState, useEffect } from 'react';\nimport { makeStyles } from '@material-ui/core';\nimport { EntityHeaderContainer } from './ui/EntityHeaderContainer';\nimport { EntityHeaderList } from './ui/EntityHeaderList';\nimport { EntityHeaderListItem } from './ui/EntityHeaderListItem';\nimport { EntityHeaderStatList } from './ui/EntityHeaderStatList';\nimport { EntityHeaderStatListItem } from './ui/EntityHeaderStatListItem';\nimport { EntityHeaderSection } from './ui/EntityHeaderSection';\nimport { AlertPill } from './ui/AlertPill';\n\nimport { ChartIcon } from '@fluentui/react-icons';\nimport { useElementWidth } from './functions/useElementWidth';\nimport { IconRenderer } from '../../templates/ui/renderers/IconRenderer';\nimport { EntityHeaderFlags } from './ui/EntityHeaderFlags';\nimport PropTypes from 'prop-types';\nimport { UdpAlertsContainer } from '../../utilityDisplay/alerts/UdpAlertsContainer';\n\nconst useStyles = makeStyles((theme) => ({\n root: {}\n}));\n// https://univerus.atlassian.net/wiki/spaces/UDP/pages/2398257255/Entity+Header\nexport const EntityHeader = (props) => {\n const {\n sectionProps,\n background,\n color,\n kpiProps,\n hiddenSections,\n chips,\n alerts,\n useUdpAlerts\n } = props;\n\n const classes = useStyles(props);\n const { section1, section2, section3, section4 } = sectionProps;\n const { kpi1, kpi2, kpi3, kpi4 } = kpiProps;\n\n const componentRef = useRef();\n const [compactSize, setCompactSize] = useState(true);\n\n const { isBreakpointUp } = useElementWidth(componentRef);\n\n useEffect(() => {\n if (isBreakpointUp('md')) {\n setCompactSize(false);\n // setDividedList(false);\n } else {\n setCompactSize(true);\n // setDividedList(true);\n }\n }, [isBreakpointUp]);\n\n return (\n <div ref={componentRef}>\n {/* Container used when compactSize is true */}\n {!!compactSize && (\n <EntityHeaderContainer\n direction='row'\n showSeperator\n background={background}\n color={color}\n >\n <EntityHeaderSection flexGrow>\n <EntityHeaderList>\n {!section1?.hidden &&\n section1?.values?.length &&\n section1.values?.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n\n {!section2?.hidden &&\n section2?.values?.length &&\n section2.values?.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n\n {!section3?.hidden &&\n section3?.values?.length &&\n section3.values?.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n\n {!section4?.hidden &&\n section4?.values?.length &&\n section4.values?.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n </EntityHeaderList>\n </EntityHeaderSection>\n </EntityHeaderContainer>\n )}\n {/* */}\n <EntityHeaderContainer\n direction='row'\n showSeperator\n background={background}\n color={color}\n >\n {!compactSize && (\n <>\n {!section1?.hidden && (\n <EntityHeaderSection flexGrow>\n <EntityHeaderList>\n {!!section1?.values?.length &&\n section1.values.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n </EntityHeaderList>\n </EntityHeaderSection>\n )}\n {!section2?.hidden && (\n <EntityHeaderSection flexGrow>\n <EntityHeaderList>\n {!!section2?.values?.length &&\n section2.values.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n </EntityHeaderList>\n </EntityHeaderSection>\n )}\n {!section3?.hidden && (\n <EntityHeaderSection flexGrow>\n <EntityHeaderList>\n {!!section3?.values?.length &&\n section3.values.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n </EntityHeaderList>\n </EntityHeaderSection>\n )}\n {!section4?.hidden && (\n <EntityHeaderSection flexGrow>\n <EntityHeaderList>\n {!!section4?.values?.length &&\n section4.values.map((item) => (\n <EntityHeaderListItem\n label={item?.label}\n value={item?.value}\n link={item?.link}\n />\n ))}\n </EntityHeaderList>\n </EntityHeaderSection>\n )}\n </>\n )}\n {!kpiProps.hidden && (\n <EntityHeaderSection flexGrow>\n <EntityHeaderStatList flexGrow>\n {!kpi1?.hidden && (\n <EntityHeaderStatListItem\n value={kpi1?.value}\n label={kpi1?.label}\n labelColor={kpi1?.labelColor}\n flexGrow\n icon={\n <IconRenderer\n noBorder={true}\n removeContainer={true}\n value={{\n color: { hex: '#' + kpi1?.color },\n name: kpi1?.icon || 'ChartIcon'\n }}\n />\n }\n />\n )}\n {!kpi2?.hidden && (\n <EntityHeaderStatListItem\n value={kpi2?.value}\n label={kpi2?.label}\n labelColor={kpi2?.labelColor}\n flexGrow\n icon={\n <IconRenderer\n noBorder={true}\n removeContainer={true}\n value={{\n color: { hex: '#' + kpi2?.color },\n name: kpi2?.icon || 'ChartIcon'\n }}\n />\n }\n />\n )}\n {!kpi3?.hidden && (\n <EntityHeaderStatListItem\n value={kpi3?.value}\n label={kpi3?.label}\n labelColor={kpi3?.labelColor}\n flexGrow\n icon={\n <IconRenderer\n noBorder={true}\n removeContainer={true}\n value={{\n color: { hex: '#' + kpi3?.color },\n name: kpi3?.icon || 'ChartIcon'\n }}\n />\n }\n />\n )}\n {!kpi4?.hidden && (\n <EntityHeaderStatListItem\n value={kpi4?.value}\n label={kpi4?.label}\n labelColor={kpi4?.labelColor}\n flexGrow\n icon={\n <IconRenderer\n noBorder={true}\n removeContainer={true}\n value={{\n color: { hex: '#' + kpi4?.color },\n name: kpi4?.icon || 'ChartIcon'\n }}\n />\n }\n />\n )}\n </EntityHeaderStatList>\n </EntityHeaderSection>\n )}\n </EntityHeaderContainer>\n {(!hiddenSections.chips || !hiddenSections.alert) && (\n <EntityHeaderContainer\n className={classes.root}\n background={background}\n color={color}\n >\n {!hiddenSections.chips && (\n <EntityHeaderSection flexGrow alignItems={'center'}>\n <EntityHeaderFlags\n data={chips?.map((chip) => ({ label: chip }))}\n />\n </EntityHeaderSection>\n )}\n {/* */}\n <EntityHeaderSection flexGrow />\n {!hiddenSections.alert && (\n <EntityHeaderSection>\n {/* <PehAlertPill\n alertPillProps={{ errorLabel: '5', warningLabel: '2' }}\n /> */}\n {useUdpAlerts ? (\n <UdpAlertsContainer />\n ) : (\n <AlertPill\n errorCount={alerts?.error}\n warningCount={alerts?.warning}\n />\n )}\n </EntityHeaderSection>\n )}\n </EntityHeaderContainer>\n )}\n </div>\n );\n};\n\nEntityHeader.propTypes = {\n sectionProps: PropTypes.shape({\n section1: PropTypes.shape({\n hidden: PropTypes.bool,\n values: PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string\n })\n )\n }),\n section2: PropTypes.shape({\n hidden: PropTypes.bool,\n values: PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string\n })\n )\n }),\n section3: PropTypes.shape({\n hidden: PropTypes.bool,\n values: PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string\n })\n )\n })\n }).isRequired,\n background: PropTypes.string,\n color: PropTypes.string,\n kpiProps: PropTypes.shape({\n hidden: PropTypes.bool,\n kpi1: PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string,\n color: PropTypes.string,\n icon: PropTypes.string,\n hidden: PropTypes.bool\n }),\n kpi2: PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string,\n color: PropTypes.string,\n icon: PropTypes.string,\n hidden: PropTypes.bool\n }),\n kpi3: PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string,\n color: PropTypes.string,\n icon: PropTypes.string,\n hidden: PropTypes.bool\n }),\n kpi4: PropTypes.shape({\n label: PropTypes.string,\n value: PropTypes.string,\n color: PropTypes.string,\n icon: PropTypes.string,\n hidden: PropTypes.bool\n })\n }).isRequired,\n hiddenSections: PropTypes.shape({\n alert: PropTypes.bool,\n chips: PropTypes.bool\n }),\n chips: PropTypes.arrayOf(PropTypes.string),\n alerts: PropTypes.shape({\n warning: PropTypes.number,\n error: PropTypes.number\n })\n};\n"],"mappings":"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"}
@@ -17,7 +17,7 @@ import { t as FormControlLabel$1 } from "./FormControlLabel-C_X37EhG.js";
17
17
  import { t as Grid$1 } from "./Grid-D1-yWIw5.js";
18
18
  import { t as FluentCheckbox } from "./FluentCheckbox-CX7XgoFz.js";
19
19
  import { t as EmptyStateDisplay } from "./EmptyStateDisplay-YOwCw38_.js";
20
- import { t as FluentTimePicker } from "./FluentTimePicker-hNcocKsd.js";
20
+ import { t as FluentTimePicker } from "./FluentTimePicker-BFxFcgvX.js";
21
21
  import React, { useCallback, useEffect, useMemo, useState } from "react";
22
22
  import { makeStyles } from "@material-ui/core";
23
23
  import { AddIcon, DeleteIcon } from "@fluentui/react-icons";
@@ -401,4 +401,4 @@ const FieldArrayCard = (props) => {
401
401
 
402
402
  //#endregion
403
403
  export { FieldType as n, FieldArrayCard as t };
404
- //# sourceMappingURL=FieldArrayCard-C1I5_qJ4.js.map
404
+ //# sourceMappingURL=FieldArrayCard-Ds_ysYWL.js.map