udp-react-enterprise-component-library 25.18.1-beta.44 → 25.18.1-beta.45

package/dist/{FluentLink-DP2eDAH2.js.map → FluentLink-D-gKioCQ.js.map}

@@ -1 +1 @@
-{"version":3,"file":"FluentLink-DP2eDAH2.js","names":["Link","MuiLink"],"sources":["../src/UI/inputs/link/FluentLink.jsx"],"sourcesContent":["import React from 'react'\nimport { Link } from 'react-router-dom'\nimport {\n  Typography,\n  Link as MuiLink,\n  makeStyles,\n  useTheme\n} from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    textDecoration: 'none',\n    '& > * + *': {\n      marginLeft: theme.spacing(2)\n    }\n  },\n  link: {\n    textDecoration: 'none',\n    fontWeight: 700\n  }\n}))\n\nexport const FluentLink = (props) => {\n  const {\n    icon,\n    alt,\n    label,\n    children,\n    activeClassName,\n    to,\n    linkColor,\n    ...otherProps\n  } = props\n  const theme = useTheme()\n  const classes = useStyles()\n\n  return to && to.substring(0, 4) !== 'http' ? (\n    <Link\n      to={to}\n      activeClassName={activeClassName}\n      className={classes.link}\n      style={{\n        color:\n          linkColor === 'primary'\n            ? theme.palette.primary.main\n            : theme.palette.secondary.main\n      }}\n    >\n      {children}\n    </Link>\n  ) : (\n    <Typography component='div' className={classes.root}>\n      <MuiLink\n        {...otherProps}\n        href={to}\n        color={linkColor}\n        variant='body1'\n        style={{ textDecoration: 'none' }}\n      >\n        {children}\n      </MuiLink>\n    </Typography>\n  )\n}\n"],"mappings":";;;;;AASA,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM;EACJ,gBAAgB;EAChB,aAAa,EACX,YAAY,MAAM,QAAQ,EAAE,EAC7B;EACF;CACD,MAAM;EACJ,gBAAgB;EAChB,YAAY;EACb;CACF,EAAE;AAEH,MAAa,cAAc,UAAU;CACnC,MAAM,EACJ,MACA,KACA,OACA,UACA,iBACA,IACA,WACA,GAAG,eACD;CACJ,MAAM,QAAQ,UAAU;CACxB,MAAM,UAAU,WAAW;AAE3B,QAAO,MAAM,GAAG,UAAU,GAAG,EAAE,KAAK,SAClC,oCAACA;EACK;EACa;EACjB,WAAW,QAAQ;EACnB,OAAO,EACL,OACE,cAAc,YACV,MAAM,QAAQ,QAAQ,OACtB,MAAM,QAAQ,UAAU,MAC/B;IAEA,SACI,GAEP,oCAAC;EAAW,WAAU;EAAM,WAAW,QAAQ;IAC7C,oCAACC;EACC,GAAI;EACJ,MAAM;EACN,OAAO;EACP,SAAQ;EACR,OAAO,EAAE,gBAAgB,QAAQ;IAEhC,SACO,CACC"}
+{"version":3,"file":"FluentLink-D-gKioCQ.js","names":["Link","MuiLink"],"sources":["../src/UI/inputs/link/FluentLink.jsx"],"sourcesContent":["import React from 'react'\nimport { Link } from 'react-router-dom'\nimport {\n  Typography,\n  Link as MuiLink,\n  makeStyles,\n  useTheme\n} from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    textDecoration: 'none',\n    '& > * + *': {\n      marginLeft: theme.spacing(2)\n    }\n  },\n  link: {\n    textDecoration: 'none',\n    fontWeight: 700\n  }\n}))\n\nexport const FluentLink = (props) => {\n  const {\n    icon,\n    alt,\n    label,\n    children,\n    activeClassName,\n    to,\n    linkColor,\n    ...otherProps\n  } = props\n  const theme = useTheme()\n  const classes = useStyles()\n\n  return to && to.substring(0, 4) !== 'http' ? (\n    <Link\n      to={to}\n      activeClassName={activeClassName}\n      className={classes.link}\n      style={{\n        color:\n          linkColor === 'primary'\n            ? theme.palette.primary.main\n            : theme.palette.secondary.main\n      }}\n    >\n      {children}\n    </Link>\n  ) : (\n    <Typography component='div' className={classes.root}>\n      <MuiLink\n        {...otherProps}\n        href={to}\n        color={linkColor}\n        variant='body1'\n        style={{ textDecoration: 'none' }}\n      >\n        {children}\n      </MuiLink>\n    </Typography>\n  )\n}\n"],"mappings":";;;;;AASA,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM;EACJ,gBAAgB;EAChB,aAAa,EACX,YAAY,MAAM,QAAQ,EAAE,EAC7B;EACF;CACD,MAAM;EACJ,gBAAgB;EAChB,YAAY;EACb;CACF,EAAE;AAEH,MAAa,cAAc,UAAU;CACnC,MAAM,EACJ,MACA,KACA,OACA,UACA,iBACA,IACA,WACA,GAAG,eACD;CACJ,MAAM,QAAQ,UAAU;CACxB,MAAM,UAAU,WAAW;AAE3B,QAAO,MAAM,GAAG,UAAU,GAAG,EAAE,KAAK,SAClC,oCAACA;EACK;EACa;EACjB,WAAW,QAAQ;EACnB,OAAO,EACL,OACE,cAAc,YACV,MAAM,QAAQ,QAAQ,OACtB,MAAM,QAAQ,UAAU,MAC/B;IAEA,SACI,GAEP,oCAAC;EAAW,WAAU;EAAM,WAAW,QAAQ;IAC7C,oCAACC;EACC,GAAI;EACJ,MAAM;EACN,OAAO;EACP,SAAQ;EACR,OAAO,EAAE,gBAAgB,QAAQ;IAEhC,SACO,CACC"}

package/dist/{FluentRadioGroup-CCKelZVk.js → FluentRadioGroup-DWOMSBGp.js}

@@ -28,4 +28,4 @@ const FluentRadioGroup = (props) => {
 
 //#endregion
 export { FluentRadio as n, FluentRadioGroup as t };
-//# sourceMappingURL=FluentRadioGroup-CCKelZVk.js.map
+//# sourceMappingURL=FluentRadioGroup-DWOMSBGp.js.map

package/dist/{FluentRadioGroup-CCKelZVk.js.map → FluentRadioGroup-DWOMSBGp.js.map}

@@ -1 +1 @@
-{"version":3,"file":"FluentRadioGroup-CCKelZVk.js","names":[],"sources":["../src/UI/inputs/radio/FluentRadio.jsx","../src/UI/inputs/radio/FluentRadioGroup.jsx"],"sourcesContent":["import React from 'react';\nimport { Radio } from '@material-ui/core';\n\nexport const FluentRadio = props => {\n  const {\n    label,\n    value,\n    variant = 'outlined',\n    color = 'secondary',\n    ...otherProps\n  } = props;\n\n  return (\n    <Radio\n      id={'udpRecord-radio-' + value}\n      updrecordid={'udpRecord-radio-' + value}\n      label={label}\n      value={value}\n      variant={variant}\n      color={color}\n      {...otherProps}\n    />\n  );\n};\n","import React from 'react';\nimport { RadioGroup } from '@material-ui/core';\n\nexport const FluentRadioGroup = props => {\n  const {\n    name,\n    value,\n    ...otherProps\n  } = props;\n\n  return (\n    <RadioGroup\n      name={name}\n      value={value}\n      {...otherProps}\n    />\n  );\n};\n"],"mappings":";;;;AAGA,MAAa,eAAc,UAAS;CAClC,MAAM,EACJ,OACA,OACA,UAAU,YACV,QAAQ,aACR,GAAG,eACD;AAEJ,QACE,oCAAC;EACC,IAAI,qBAAqB;EACzB,aAAa,qBAAqB;EAC3B;EACA;EACE;EACF;EACP,GAAI;GACJ;;;;;AClBN,MAAa,oBAAmB,UAAS;CACvC,MAAM,EACJ,MACA,OACA,GAAG,eACD;AAEJ,QACE,oCAAC;EACO;EACC;EACP,GAAI;GACJ"}
+{"version":3,"file":"FluentRadioGroup-DWOMSBGp.js","names":[],"sources":["../src/UI/inputs/radio/FluentRadio.jsx","../src/UI/inputs/radio/FluentRadioGroup.jsx"],"sourcesContent":["import React from 'react';\nimport { Radio } from '@material-ui/core';\n\nexport const FluentRadio = props => {\n  const {\n    label,\n    value,\n    variant = 'outlined',\n    color = 'secondary',\n    ...otherProps\n  } = props;\n\n  return (\n    <Radio\n      id={'udpRecord-radio-' + value}\n      updrecordid={'udpRecord-radio-' + value}\n      label={label}\n      value={value}\n      variant={variant}\n      color={color}\n      {...otherProps}\n    />\n  );\n};\n","import React from 'react';\nimport { RadioGroup } from '@material-ui/core';\n\nexport const FluentRadioGroup = props => {\n  const {\n    name,\n    value,\n    ...otherProps\n  } = props;\n\n  return (\n    <RadioGroup\n      name={name}\n      value={value}\n      {...otherProps}\n    />\n  );\n};\n"],"mappings":";;;;AAGA,MAAa,eAAc,UAAS;CAClC,MAAM,EACJ,OACA,OACA,UAAU,YACV,QAAQ,aACR,GAAG,eACD;AAEJ,QACE,oCAAC;EACC,IAAI,qBAAqB;EACzB,aAAa,qBAAqB;EAC3B;EACA;EACE;EACF;EACP,GAAI;GACJ;;;;;AClBN,MAAa,oBAAmB,UAAS;CACvC,MAAM,EACJ,MACA,OACA,GAAG,eACD;AAEJ,QACE,oCAAC;EACO;EACC;EACP,GAAI;GACJ"}

package/dist/{FluentSelectMenu-yQMFZWEg.js → FluentSelectMenu-BEREJbe-.js}

@@ -25,4 +25,4 @@ const FluentSelectMenu = ({ data, id, onChange: onChangeProp, width = 300, autoC
 
 //#endregion
 export { FluentSelectMenu as t };
-//# sourceMappingURL=FluentSelectMenu-yQMFZWEg.js.map
+//# sourceMappingURL=FluentSelectMenu-BEREJbe-.js.map

package/dist/{FluentSelectMenu-yQMFZWEg.js.map → FluentSelectMenu-BEREJbe-.js.map}

@@ -1 +1 @@
-{"version":3,"file":"FluentSelectMenu-yQMFZWEg.js","names":["option"],"sources":["../src/UI/inputs/menus/FluentSelectMenu.jsx"],"sourcesContent":["/* eslint-disable no-use-before-define */\nimport React, { useCallback } from 'react';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport { FluentTextField } from '../textField/FluentTextField';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    '&[class*=\"MuiOutlinedInput-root\"][class*=\"MuiOutlinedInput-marginDense\"]':\n      {\n        padding: '4px 8px'\n      }\n  }\n}));\n\nexport const FluentSelectMenu = ({\n  data,\n  id,\n  onChange: onChangeProp,\n  width = 300,\n  // displayProperty = 'label',\n  autoCompleteProps,\n  displayProperty,\n  ...otherProps\n}) => {\n  const classes = useStyles();\n  // Modified onChange to work inside final-form Field component\n  // Also works with a passed in onChange function if not in Field component\n  const onChange = useCallback(\n    (e, value) => onChangeProp?.(value),\n    [onChangeProp]\n  );\n\n  // return (\n  //   <Autocomplete\n  //     classes={{\n  //       inputRoot: classes.root\n  //     }}\n  //     id={id}\n  //     onChange={onChange}\n  //     options={data}\n  //     getOptionLabel={\n  //       displayProperty\n  //         ? option[displayProperty]\n  //           ? option[displayProperty]\n  //           : ''\n  //         : option\n  //     }\n  //     style={{ width: width }}\n  //     {...autoCompleteProps}\n  //     renderInput={(params) => <FluentTextField {...otherProps} {...params} />}\n  //   />\n  // )\n  return (\n    <Autocomplete\n      classes={{\n        inputRoot: classes.root\n      }}\n      id={id}\n      onChange={onChange}\n      options={data}\n      getOptionLabel={(option) =>\n        displayProperty\n          ? option[displayProperty]\n            ? option[displayProperty]\n            : ''\n          : (option) => option\n      }\n      style={{ width: width }}\n      {...autoCompleteProps}\n      renderInput={(params) => (\n        <FluentTextField {...otherProps} {...params} />\n      )}\n    />\n  );\n};\n"],"mappings":";;;;;;AAMA,MAAM,YAAY,YAAY,WAAW,EACvC,MAAM,EACJ,gFACE,EACE,SAAS,WACV,EACJ,EACF,EAAE;AAEH,MAAa,oBAAoB,EAC/B,MACA,IACA,UAAU,cACV,QAAQ,KAER,mBACA,iBACA,GAAG,iBACC;CACJ,MAAM,UAAU,WAAW;CAG3B,MAAM,WAAW,aACd,GAAG,UAAU,eAAe,MAAM,EACnC,CAAC,aAAa,CACf;AAsBD,QACE,oCAAC;EACC,SAAS,EACP,WAAW,QAAQ,MACpB;EACG;EACM;EACV,SAAS;EACT,iBAAiB,WACf,kBACI,OAAO,mBACL,OAAO,mBACP,MACD,aAAWA;EAElB,OAAO,EAAS,OAAO;EACvB,GAAI;EACJ,cAAc,WACZ,oCAAC;GAAgB,GAAI;GAAY,GAAI;IAAU;GAEjD"}
+{"version":3,"file":"FluentSelectMenu-BEREJbe-.js","names":["option"],"sources":["../src/UI/inputs/menus/FluentSelectMenu.jsx"],"sourcesContent":["/* eslint-disable no-use-before-define */\nimport React, { useCallback } from 'react';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport { FluentTextField } from '../textField/FluentTextField';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    '&[class*=\"MuiOutlinedInput-root\"][class*=\"MuiOutlinedInput-marginDense\"]':\n      {\n        padding: '4px 8px'\n      }\n  }\n}));\n\nexport const FluentSelectMenu = ({\n  data,\n  id,\n  onChange: onChangeProp,\n  width = 300,\n  // displayProperty = 'label',\n  autoCompleteProps,\n  displayProperty,\n  ...otherProps\n}) => {\n  const classes = useStyles();\n  // Modified onChange to work inside final-form Field component\n  // Also works with a passed in onChange function if not in Field component\n  const onChange = useCallback(\n    (e, value) => onChangeProp?.(value),\n    [onChangeProp]\n  );\n\n  // return (\n  //   <Autocomplete\n  //     classes={{\n  //       inputRoot: classes.root\n  //     }}\n  //     id={id}\n  //     onChange={onChange}\n  //     options={data}\n  //     getOptionLabel={\n  //       displayProperty\n  //         ? option[displayProperty]\n  //           ? option[displayProperty]\n  //           : ''\n  //         : option\n  //     }\n  //     style={{ width: width }}\n  //     {...autoCompleteProps}\n  //     renderInput={(params) => <FluentTextField {...otherProps} {...params} />}\n  //   />\n  // )\n  return (\n    <Autocomplete\n      classes={{\n        inputRoot: classes.root\n      }}\n      id={id}\n      onChange={onChange}\n      options={data}\n      getOptionLabel={(option) =>\n        displayProperty\n          ? option[displayProperty]\n            ? option[displayProperty]\n            : ''\n          : (option) => option\n      }\n      style={{ width: width }}\n      {...autoCompleteProps}\n      renderInput={(params) => (\n        <FluentTextField {...otherProps} {...params} />\n      )}\n    />\n  );\n};\n"],"mappings":";;;;;;AAMA,MAAM,YAAY,YAAY,WAAW,EACvC,MAAM,EACJ,gFACE,EACE,SAAS,WACV,EACJ,EACF,EAAE;AAEH,MAAa,oBAAoB,EAC/B,MACA,IACA,UAAU,cACV,QAAQ,KAER,mBACA,iBACA,GAAG,iBACC;CACJ,MAAM,UAAU,WAAW;CAG3B,MAAM,WAAW,aACd,GAAG,UAAU,eAAe,MAAM,EACnC,CAAC,aAAa,CACf;AAsBD,QACE,oCAAC;EACC,SAAS,EACP,WAAW,QAAQ,MACpB;EACG;EACM;EACV,SAAS;EACT,iBAAiB,WACf,kBACI,OAAO,mBACL,OAAO,mBACP,MACD,aAAWA;EAElB,OAAO,EAAS,OAAO;EACvB,GAAI;EACJ,cAAc,WACZ,oCAAC;GAAgB,GAAI;GAAY,GAAI;IAAU;GAEjD"}

package/dist/{FluentSimpleSelect-DxxbQV37.js → FluentSimpleSelect-Djff-up8.js}

@@ -1,6 +1,6 @@
 import { t as apiMutate } from "./useAxiosMutate-DeqKSi5z.js";
 import { t as Box$1 } from "./Box-Colr5GEl.js";
-import { t as FluentSelectMenu } from "./FluentSelectMenu-yQMFZWEg.js";
+import { t as FluentSelectMenu } from "./FluentSelectMenu-BEREJbe-.js";
 import React, { Children, forwardRef, useCallback, useEffect, useRef, useState } from "react";
 import { CircularProgress, FormControl, InputBase, NativeSelect, TextField, Typography, makeStyles, withStyles } from "@material-ui/core";
 import Autocomplete from "@material-ui/lab/Autocomplete";
@@ -417,4 +417,4 @@ const FluentSimpleSelect = forwardRef(FluentSimpleSelectComponent);
 
 //#endregion
 export { FluentSelectGroupMenu as i, FluentScrollLoadAutocompleteMenu as n, SelectGroupMenu as r, FluentSimpleSelect as t };
-//# sourceMappingURL=FluentSimpleSelect-DxxbQV37.js.map
+//# sourceMappingURL=FluentSimpleSelect-Djff-up8.js.map

package/dist/{FluentSimpleSelect-DxxbQV37.js.map → FluentSimpleSelect-Djff-up8.js.map}

@@ -1 +1 @@
-{"version":3,"file":"FluentSimpleSelect-DxxbQV37.js","names":["useStyles","useStyles","useStyles","makeStyles","Box"],"sources":["../src/UI/inputs/menus/FluentSelectDirectoryMenu.jsx","../src/UI/inputs/menus/FluentSelectGroupMenu.jsx","../src/UI/inputs/menus/FluentScrollLoadAutocompleteMenu.jsx","../src/UI/inputs/menus/FluentSimpleSelect.jsx"],"sourcesContent":["/* eslint-disable no-use-before-define */\nimport React from 'react'\n\nimport Autocomplete from '@material-ui/lab/Autocomplete'\nimport { makeStyles, TextField } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n  textField: {\n    marginLeft: theme.spacing(1),\n    marginRight: theme.spacing(1)\n  },\n  dense: {\n    marginTop: theme.spacing(1)\n  },\n  input: {\n    borderRadius: 2,\n    height: 32,\n    padding: 0,\n    marginTop: 3\n  },\n  formTextInput: {\n    fontSize: 14\n  },\n  labelRoot: {\n    fontSize: 14\n  }\n}))\n\nexport const FluentSelectGroupMenu = ({\n  data,\n  placeholder,\n  id,\n  handleChange\n}) => {\n  const classes = useStyles()\n  const options =\n    data &&\n    data.map((option) => {\n      const firstLetter = option.label[0].toUpperCase()\n      return {\n        firstLetter: /[0-9]/.test(firstLetter) ? '0-9' : firstLetter,\n        ...option\n      }\n    })\n\n  return (\n    <Autocomplete\n      id={id}\n      onChange={(event, value) => handleChange(value)}\n      options={options.sort(\n        (a, b) => -b.firstLetter.localeCompare(a.firstLetter)\n      )}\n      groupBy={(option) => option.firstLetter}\n      getOptionLabel={(option) => option.label}\n      style={{ width: 300 }}\n      renderInput={(params) => (\n        <TextField\n          {...params}\n          label={!params.inputProps.value && placeholder}\n          variant='outlined'\n          size='small'\n          InputLabelProps={{\n            shrink: false,\n            classes: {\n              root: classes.labelRoot,\n              focused: classes.labelFocused\n            }\n          }}\n          SelectProps={{\n            MenuProps: {\n              className: classes.menu\n            }\n          }}\n        />\n      )}\n    />\n  )\n}\n","/* eslint-disable no-use-before-define */\nimport React from 'react'\n\nimport Autocomplete from '@material-ui/lab/Autocomplete'\nimport { makeStyles, TextField } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n  textField: {\n    marginLeft: theme.spacing(1),\n    marginRight: theme.spacing(1)\n  },\n  dense: {\n    marginTop: theme.spacing(1)\n  },\n  input: {\n    borderRadius: 2,\n    height: 32,\n    padding: 0,\n    marginTop: 3\n  },\n  formTextInput: {\n    fontSize: 14\n  },\n  labelRoot: {\n    fontSize: 14\n  }\n}))\n\nexport const SelectGroupMenu = ({ data, placeholder, id, handleChange, className }) => {\n  const classes = useStyles()\n  const options =\n    data &&\n    data.map((option) => {\n      const grouping = option.category\n      return {\n        grouping,\n        ...option\n      }\n    })\n\n  return (\n    <Autocomplete\n      className={className}\n      id={id}\n      onChange={(event, value) => handleChange(value)}\n      options={options.sort((a, b) => -b.grouping.localeCompare(a.grouping))}\n      groupBy={(option) => option.grouping}\n      getOptionLabel={(option) => option.label}\n      style={{ width: 300 }}\n      renderInput={(params) => (\n        <TextField\n          {...params}\n          label={!params.inputProps.value && placeholder}\n          variant='outlined'\n          size='small'\n          InputLabelProps={{\n            shrink: false,\n            classes: {\n              root: classes.labelRoot,\n              focused: classes.labelFocused\n            }\n          }}\n          SelectProps={{\n            MenuProps: {\n              className: classes.menu\n            }\n          }}\n        />\n      )}\n    />\n  )\n}\n","import React, {\n  useState,\n  useCallback,\n  useEffect,\n  forwardRef,\n  useRef,\n  Children,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport { CircularProgress } from '@material-ui/core';\nimport { apiMutate } from '../../../utilities/useAxiosMutate';\nimport { FluentSelectMenu } from './FluentSelectMenu';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useTranslation } from 'react-i18next';\nimport { Box } from '../../Box';\nimport Alert from '@material-ui/lab/Alert';\n\nconst useStyles = makeStyles((theme) => ({\n  listbox: {\n    position: 'relative',\n    maxHeight: 300,\n    overflow: 'auto',\n  },\n  listboxHidden: {\n    overflow: 'hidden',\n  },\n  loadingItem: {\n    textAlign: 'center',\n    padding: theme.spacing(1),\n  },\n  overlay: {\n    position: 'absolute',\n    inset: 0,\n    background: 'rgba(255,255,255,.95)',\n    display: 'flex',\n    flexDirection: 'column',\n    alignItems: 'center',\n    justifyContent: 'center',\n    zIndex: 1,\n  },\n  overlayText: {\n    marginTop: theme.spacing(1),\n  },\n  alert: {\n    marginTop: theme.spacing(1),\n  },\n}));\n\n/**\n* **FluentScrollLoadAutocompleteMenu**\n*\n* A drop‑in extension for MUI’s `<Autocomplete>` that:\n*\n* 1. Fetches paginated / sortable data from any REST endpoint  \n* 2. Implements infinite scrolling with automatic scroll‑position restore  \n* 3. Supports client‑side filtering, grouping   \n* 4. Displays a Material UI `<CircularProgress>` while loading and a MUI `<Alert>` on errors\n*\n* Internally it wraps **unity‑fluent‑library**’s `<FluentSelectMenu>` so you get the same\n* keyboard navigation and styling as the rest of the Fluent controls.\n*\n* ---\n*\n* ### Typical usage\n* ```jsx\n* const endpoint = (q, page, size, sortCol, sortDir) =>\n*   `/api/products?search=${q}&page=${page}&pageSize=${size}&sort=${sortCol}&dir=${sortDir}`;\n*\n* const map = (raw) => ({\n*   items: raw.items,\n*   total: raw.totalRows,\n* });\n*\n* <FluentScrollLoadAutocompleteMenu\n*   apiBaseUrl=\"https://api.example.com\"\n*   apiEndpoint={endpoint}\n*   mapResponse={map}\n*   onChange={(product) => console.log(product)}\n* />\n* ```\n* ---\n*\n* @param {Object}   props\n* @param {string}   props.apiBaseUrl   Base URL forwarded to **apiMutate**\n* @param {Function} props.apiEndpoint  `(keyword, page, pageSize, sortCol, sortDir) => string`\n* @param {Function} props.mapResponse  Maps raw API payload → `{ items, total }`\n* @param {Function} [props.onChange]   Fires when the user selects/clears an option\n* @param {Function} [props.getOptionLabel] Returns the display label for an item (default: `o.name`)\n* @param {Function} [props.groupBy]    Returns a group heading string for an item\n* @param {string}   [props.placeholder='Search…'] Placeholder text\n* @param {string}   [props.displayProperty='name'] Property passed to `<FluentSelectMenu>`\n* @param {number|string} [props.width=300] Fixed width of the component container\n* @param {boolean}  [props.fetchEnabled=true] Disable to work fully offline\n* @param {*}        [props.initialValue=null]  Pre‑selected value shown immediately\n* @param {Array}    [props.initialOptions=[]]  Pre‑loaded options shown immediately\n* @param {boolean}  [props.isPaginated=true]   Disable if your API returns the full list\n* @param {boolean}  [props.isSortable=true]    Disable server‑side sorting\n* @param {boolean}  [props.isFilterable=true]  Disable server‑side filtering\n* @param {number}   [props.pageSize=50]        Items per page when paginating\n* @param {string}   [props.sortColumn='Name']  Default sort column\n* @param {'ASC'|'DESC'} [props.sortDirection='ASC'] Default sort direction\n*\n* @returns {JSX.Element}\n*/\nexport const FluentScrollLoadAutocompleteMenu = ({\n  apiBaseUrl,\n  apiEndpoint,\n  apiConfig = {},\n  apiData = null,\n  mapResponse,\n  onChange,\n  getOptionLabel = (o) => o?.name ?? '',\n  groupBy,\n  placeholder = 'Search…',\n  displayProperty = 'name',\n  width = 300,\n  fetchEnabled = true,\n  initialValue = null,\n  initialOptions = [],\n  isPaginated = true,\n  isSortable = true,\n  isFilterable = true,\n  pageSize = 50,\n  sortColumn = 'Name',\n  sortDirection = 'ASC',\n}) => {\n  const classes = useStyles();\n  const [options, setOptions] = useState(initialOptions);\n  const [value, setValue] = useState(initialValue);\n  const [inputValue, setInputValue] = useState('');\n  const [loading, setLoading] = useState(false);\n  const [loadingMore, setLoadingMore] = useState(false);\n  const [error, setError] = useState(null);\n  const [pageNumber, setPageNumber] = useState(1);\n  const [totalRows, setTotalRows] = useState(0);\n\n  const configRef = useRef(apiConfig);\n  const dataRef = useRef(apiData);\n  const listboxRef = useRef(null);\n  const prevScrollPositionRef = useRef(0);\n\n  const { t } = useTranslation();\n\n  /**\n   * Fetches a page of data from the provided API endpoint and updates the component state accordingly.\n   *\n   * This function supports:\n   * - Filtering (if `isFilterable` is true)\n   * - Sorting (if `isSortable` is true)\n   * - Pagination (based on the `page` and `pageSize` arguments)\n   * - Infinite scroll appending (via the `append` flag)\n   *\n   * @function fetchPage\n   * @param {string} keyword - The keyword to filter results by (if filtering is enabled)\n   * @param {number} page - The page number to fetch\n   * @param {boolean} [append=false] - If true, appends results to the current list; otherwise replaces it\n   * @returns {Promise<void>} - Resolves once data is fetched and state is updated\n   */\n  const fetchPage = useCallback(\n    async (keyword, page, append = false) => {\n      if (!fetchEnabled) return;\n\n      setError(null);\n      page === 1 ? setLoading(true) : setLoadingMore(true);\n\n      try {\n        const url = apiEndpoint(\n          isFilterable ? keyword : '',\n          page,\n          pageSize,\n          isSortable ? sortColumn : '',\n          isSortable ? sortDirection : 'ASC'\n        );\n        const resp = await apiMutate(apiBaseUrl, url, configRef.current, dataRef.current);\n        const { items, total } = mapResponse(resp.data);\n\n        setOptions((prev) => (append ? [...prev, ...items] : items));\n        setTotalRows(total);\n        setPageNumber(page);\n      } catch (err) {\n        setError(err.response?.data?.message ?? err.message ?? t('Unknown error'));\n      } finally {\n        page === 1 ? setLoading(false) : setLoadingMore(false);\n      }\n    },\n    [\n      apiBaseUrl,\n      apiEndpoint,\n      mapResponse,\n      pageSize,\n      sortColumn,\n      sortDirection,\n      isFilterable,\n      isSortable,\n      fetchEnabled,\n      t,\n    ]\n  );\n\n  /* ---------- infinite scroll ---------- */\n  const handleListboxScroll = (e) => {\n    if (!isPaginated) return;\n\n    const node = e.currentTarget;\n    prevScrollPositionRef.current = node.scrollTop;\n\n    if (\n      node.scrollTop + node.clientHeight >= node.scrollHeight - 30 &&\n      !loadingMore &&\n      options.length < totalRows\n    ) {\n      fetchPage(inputValue, pageNumber + 1, true);\n    }\n  };\n\n  /**\n   * **Listbox**\n   *\n   * Custom scrollable container used by the Autocomplete dropdown.\n   * - Attaches a ref to preserve scroll position between pages.\n   * - Displays a loading message if no options are present initially.\n   * - Shows a full overlay spinner when `loadingMore` is true.\n   *\n   * This component is passed as the `ListboxComponent` to FluentSelectMenu’s\n   * Autocomplete integration, enabling infinite scroll with visual feedback.\n   *\n   * @param {Object} props\n   * @param {React.ReactNode} props.children - Option elements to render\n   * @param {boolean} props.initialLoading - Whether to show the “Loading…” message initially\n   * @param {React.Ref} ref - Forwarded ref from the Autocomplete dropdown\n   * @returns {JSX.Element}\n   */\n  const Listbox = forwardRef(({ children, initialLoading, ...other }, ref) => (\n    <ul\n      ref={(inst) => {\n        if (inst) listboxRef.current = inst;\n        if (typeof ref === 'function') ref(inst);\n        else if (ref) ref.current = inst;\n      }}\n      {...other}\n      style={{\n        position: 'relative',\n        maxHeight: 300,\n        overflow: loadingMore ? 'hidden' : 'auto',\n      }}\n    >\n      {Children.count(children) === 0 && initialLoading ? (\n        <li style={{ textAlign: 'center', padding: 8 }}>{t('Loading...')}</li>\n      ) : (\n        children\n      )}\n\n      {loadingMore && (\n        <Box className={classes.overlay}>\n          <CircularProgress size={20} />\n          <span className={classes.overlayText}>{t('Loading...')}</span>\n        </Box>\n      )}\n    </ul>\n  ));\n  Listbox.displayName = 'FluentSMAutocompleteListbox';\n\n  /* [Initial / filtered fetch] */\n  useEffect(() => {\n    if (!fetchEnabled || !isFilterable) return;\n    if (value && inputValue === getOptionLabel(value)) return;\n\n    const timer = setTimeout(() => fetchPage(inputValue, 1, false), 400);\n    return () => clearTimeout(timer);\n  }, [inputValue, fetchPage, value, getOptionLabel, isFilterable, fetchEnabled]);\n\n  // [Initial fetch when filtering is disabled]\n  useEffect(() => {\n    if (!fetchEnabled || isFilterable) return;\n    fetchPage('', 1, false);\n  }, [isFilterable, fetchEnabled, fetchPage]);\n\n  // [Restores scroll position after loading more items]\n  useEffect(() => {\n    if (!loadingMore && listboxRef.current) {\n      listboxRef.current.scrollTop = prevScrollPositionRef.current;\n    }\n  }, [options, loadingMore]);\n\n  useEffect(() => { configRef.current = apiConfig }, [apiConfig]);\n  useEffect(() => { dataRef.current = apiData }, [apiData]);\n\n  return (\n    <Box width={width}>\n      <FluentSelectMenu\n        placeholder={placeholder}\n        data={options}\n        displayProperty={displayProperty}\n        onChange={(val) => {\n          setValue(val);\n          onChange?.(val);\n        }}\n        InputProps={{\n          endAdornment:\n            loading && pageNumber === 1 ? (\n              <CircularProgress color=\"inherit\" size={20} />\n            ) : null,\n        }}\n        autoCompleteProps={{\n          value,\n          inputValue,\n          onInputChange: (_e, v) => setInputValue(v),\n          loading: loading && pageNumber === 1,\n          getOptionLabel,\n          groupBy,\n          ListboxComponent: Listbox,\n          ListboxProps: {\n            onScroll: handleListboxScroll,\n            initialLoading: loading && pageNumber === 1,\n          },\n        }}\n      />\n\n      {error && (\n        <Alert severity=\"error\" style={{ marginTop: 8 }}>\n          {error}\n        </Alert>\n      )}\n    </Box>\n  );\n};\n\nFluentScrollLoadAutocompleteMenu.propTypes = {\n  /** Base URL used by apiMutate */\n  apiBaseUrl: PropTypes.string.isRequired,\n\n  /** Builds the endpoint URL: (keyword, page, pageSize, sortCol, sortDir) => string */\n  apiEndpoint: PropTypes.func.isRequired,\n\n  /** Additional config passed to apiMutate */\n  apiConfig: PropTypes.object,\n\n  /** Raw API data passed to apiMutate */\n  apiData: PropTypes.any,\n\n  /** Maps raw API payload into { items, total } */\n  mapResponse: PropTypes.func.isRequired,\n\n  /** Called when the user selects or clears an option */\n  onChange: PropTypes.func,\n\n  /** Returns the text label for a given option */\n  getOptionLabel: PropTypes.func,\n\n  /** Returns the group heading for a given option */\n  groupBy: PropTypes.func,\n\n  placeholder: PropTypes.string,\n  displayProperty: PropTypes.string,\n  width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n\n  /* Behavior flags */\n  fetchEnabled: PropTypes.bool,\n  initialValue: PropTypes.any,\n  initialOptions: PropTypes.array,\n\n  isPaginated: PropTypes.bool,\n  isSortable: PropTypes.bool,\n  isFilterable: PropTypes.bool,\n\n  pageSize: PropTypes.number,\n  sortColumn: PropTypes.string,\n  sortDirection: PropTypes.oneOf(['ASC', 'DESC']),\n};\n","import React, {forwardRef} from 'react'\nimport {\n  makeStyles,\n  withStyles,\n  Typography,\n  FormControl,\n  NativeSelect,\n  InputBase\n} from '@material-ui/core'\nimport PropTypes from 'prop-types'\n\nconst FluentInput = withStyles((theme) => ({\n  root: {\n    'label + &': {\n      marginTop: theme.spacing(1)\n    }\n  },\n  input: {\n    borderRadius: 2,\n    position: 'relative',\n    border: '1px solid rgba(0, 0, 0, 0.23)',\n    fontSize: 14,\n    padding: '4px 8px',\n    height: 20,\n    transition: theme.transitions.create(['border-color', 'box-shadow']),\n    '&:focus': {\n      borderRadius: 2\n    }\n  }\n}))(InputBase)\n\nconst useStyles = makeStyles((theme) => ({\n  margin: {\n    marginTop: theme.spacing(1),\n    marginBottom: theme.spacing(1)\n  }\n}))\n\nconst FluentSimpleSelectComponent = ({\n  label,\n  children,\n  id,\n  value,\n  handleChange,\n  defaultValue\n}, ref) => {\n  const classes = useStyles()\n\n  return (\n    <div>\n      <FormControl className={classes.margin}>\n        <Typography\n          className={classes.label}\n          style={{\n            color: 'rgba(0, 0, 0, 0.54)',\n            fontWeight: 400,\n            letterSpacing: 0\n          }}\n        >\n          {label}\n        </Typography>\n        <NativeSelect\n          id={id}\n          inputRef={ref}\n          value={value}\n          onChange={handleChange}\n          defaultValue={defaultValue}\n          input={<FluentInput />}\n          noShrink='true'\n        >\n          {children}\n        </NativeSelect>\n      </FormControl>\n    </div>\n  )\n}\n\nFluentSimpleSelectComponent.propTypes = {\n  /**\n   * Label that appears above the selector\n   */\n  label: PropTypes.string,\n  /**\n   * Contents of the selected options (<option></option>)\n   */\n  children: PropTypes.node,\n  /**\n   * Function to handle option change\n   */\n  handleChange: PropTypes.func,\n  /**\n   * Value: the value of the selected item\n   */\n  value: PropTypes.string\n}\nexport const FluentSimpleSelect = forwardRef(FluentSimpleSelectComponent)\n"],"mappings":"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"}
+{"version":3,"file":"FluentSimpleSelect-Djff-up8.js","names":["useStyles","useStyles","useStyles","makeStyles","Box"],"sources":["../src/UI/inputs/menus/FluentSelectDirectoryMenu.jsx","../src/UI/inputs/menus/FluentSelectGroupMenu.jsx","../src/UI/inputs/menus/FluentScrollLoadAutocompleteMenu.jsx","../src/UI/inputs/menus/FluentSimpleSelect.jsx"],"sourcesContent":["/* eslint-disable no-use-before-define */\nimport React from 'react'\n\nimport Autocomplete from '@material-ui/lab/Autocomplete'\nimport { makeStyles, TextField } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n  textField: {\n    marginLeft: theme.spacing(1),\n    marginRight: theme.spacing(1)\n  },\n  dense: {\n    marginTop: theme.spacing(1)\n  },\n  input: {\n    borderRadius: 2,\n    height: 32,\n    padding: 0,\n    marginTop: 3\n  },\n  formTextInput: {\n    fontSize: 14\n  },\n  labelRoot: {\n    fontSize: 14\n  }\n}))\n\nexport const FluentSelectGroupMenu = ({\n  data,\n  placeholder,\n  id,\n  handleChange\n}) => {\n  const classes = useStyles()\n  const options =\n    data &&\n    data.map((option) => {\n      const firstLetter = option.label[0].toUpperCase()\n      return {\n        firstLetter: /[0-9]/.test(firstLetter) ? '0-9' : firstLetter,\n        ...option\n      }\n    })\n\n  return (\n    <Autocomplete\n      id={id}\n      onChange={(event, value) => handleChange(value)}\n      options={options.sort(\n        (a, b) => -b.firstLetter.localeCompare(a.firstLetter)\n      )}\n      groupBy={(option) => option.firstLetter}\n      getOptionLabel={(option) => option.label}\n      style={{ width: 300 }}\n      renderInput={(params) => (\n        <TextField\n          {...params}\n          label={!params.inputProps.value && placeholder}\n          variant='outlined'\n          size='small'\n          InputLabelProps={{\n            shrink: false,\n            classes: {\n              root: classes.labelRoot,\n              focused: classes.labelFocused\n            }\n          }}\n          SelectProps={{\n            MenuProps: {\n              className: classes.menu\n            }\n          }}\n        />\n      )}\n    />\n  )\n}\n","/* eslint-disable no-use-before-define */\nimport React from 'react'\n\nimport Autocomplete from '@material-ui/lab/Autocomplete'\nimport { makeStyles, TextField } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n  textField: {\n    marginLeft: theme.spacing(1),\n    marginRight: theme.spacing(1)\n  },\n  dense: {\n    marginTop: theme.spacing(1)\n  },\n  input: {\n    borderRadius: 2,\n    height: 32,\n    padding: 0,\n    marginTop: 3\n  },\n  formTextInput: {\n    fontSize: 14\n  },\n  labelRoot: {\n    fontSize: 14\n  }\n}))\n\nexport const SelectGroupMenu = ({ data, placeholder, id, handleChange, className }) => {\n  const classes = useStyles()\n  const options =\n    data &&\n    data.map((option) => {\n      const grouping = option.category\n      return {\n        grouping,\n        ...option\n      }\n    })\n\n  return (\n    <Autocomplete\n      className={className}\n      id={id}\n      onChange={(event, value) => handleChange(value)}\n      options={options.sort((a, b) => -b.grouping.localeCompare(a.grouping))}\n      groupBy={(option) => option.grouping}\n      getOptionLabel={(option) => option.label}\n      style={{ width: 300 }}\n      renderInput={(params) => (\n        <TextField\n          {...params}\n          label={!params.inputProps.value && placeholder}\n          variant='outlined'\n          size='small'\n          InputLabelProps={{\n            shrink: false,\n            classes: {\n              root: classes.labelRoot,\n              focused: classes.labelFocused\n            }\n          }}\n          SelectProps={{\n            MenuProps: {\n              className: classes.menu\n            }\n          }}\n        />\n      )}\n    />\n  )\n}\n","import React, {\n  useState,\n  useCallback,\n  useEffect,\n  forwardRef,\n  useRef,\n  Children,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport { CircularProgress } from '@material-ui/core';\nimport { apiMutate } from '../../../utilities/useAxiosMutate';\nimport { FluentSelectMenu } from './FluentSelectMenu';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useTranslation } from 'react-i18next';\nimport { Box } from '../../Box';\nimport Alert from '@material-ui/lab/Alert';\n\nconst useStyles = makeStyles((theme) => ({\n  listbox: {\n    position: 'relative',\n    maxHeight: 300,\n    overflow: 'auto',\n  },\n  listboxHidden: {\n    overflow: 'hidden',\n  },\n  loadingItem: {\n    textAlign: 'center',\n    padding: theme.spacing(1),\n  },\n  overlay: {\n    position: 'absolute',\n    inset: 0,\n    background: 'rgba(255,255,255,.95)',\n    display: 'flex',\n    flexDirection: 'column',\n    alignItems: 'center',\n    justifyContent: 'center',\n    zIndex: 1,\n  },\n  overlayText: {\n    marginTop: theme.spacing(1),\n  },\n  alert: {\n    marginTop: theme.spacing(1),\n  },\n}));\n\n/**\n* **FluentScrollLoadAutocompleteMenu**\n*\n* A drop‑in extension for MUI’s `<Autocomplete>` that:\n*\n* 1. Fetches paginated / sortable data from any REST endpoint  \n* 2. Implements infinite scrolling with automatic scroll‑position restore  \n* 3. Supports client‑side filtering, grouping   \n* 4. Displays a Material UI `<CircularProgress>` while loading and a MUI `<Alert>` on errors\n*\n* Internally it wraps **unity‑fluent‑library**’s `<FluentSelectMenu>` so you get the same\n* keyboard navigation and styling as the rest of the Fluent controls.\n*\n* ---\n*\n* ### Typical usage\n* ```jsx\n* const endpoint = (q, page, size, sortCol, sortDir) =>\n*   `/api/products?search=${q}&page=${page}&pageSize=${size}&sort=${sortCol}&dir=${sortDir}`;\n*\n* const map = (raw) => ({\n*   items: raw.items,\n*   total: raw.totalRows,\n* });\n*\n* <FluentScrollLoadAutocompleteMenu\n*   apiBaseUrl=\"https://api.example.com\"\n*   apiEndpoint={endpoint}\n*   mapResponse={map}\n*   onChange={(product) => console.log(product)}\n* />\n* ```\n* ---\n*\n* @param {Object}   props\n* @param {string}   props.apiBaseUrl   Base URL forwarded to **apiMutate**\n* @param {Function} props.apiEndpoint  `(keyword, page, pageSize, sortCol, sortDir) => string`\n* @param {Function} props.mapResponse  Maps raw API payload → `{ items, total }`\n* @param {Function} [props.onChange]   Fires when the user selects/clears an option\n* @param {Function} [props.getOptionLabel] Returns the display label for an item (default: `o.name`)\n* @param {Function} [props.groupBy]    Returns a group heading string for an item\n* @param {string}   [props.placeholder='Search…'] Placeholder text\n* @param {string}   [props.displayProperty='name'] Property passed to `<FluentSelectMenu>`\n* @param {number|string} [props.width=300] Fixed width of the component container\n* @param {boolean}  [props.fetchEnabled=true] Disable to work fully offline\n* @param {*}        [props.initialValue=null]  Pre‑selected value shown immediately\n* @param {Array}    [props.initialOptions=[]]  Pre‑loaded options shown immediately\n* @param {boolean}  [props.isPaginated=true]   Disable if your API returns the full list\n* @param {boolean}  [props.isSortable=true]    Disable server‑side sorting\n* @param {boolean}  [props.isFilterable=true]  Disable server‑side filtering\n* @param {number}   [props.pageSize=50]        Items per page when paginating\n* @param {string}   [props.sortColumn='Name']  Default sort column\n* @param {'ASC'|'DESC'} [props.sortDirection='ASC'] Default sort direction\n*\n* @returns {JSX.Element}\n*/\nexport const FluentScrollLoadAutocompleteMenu = ({\n  apiBaseUrl,\n  apiEndpoint,\n  apiConfig = {},\n  apiData = null,\n  mapResponse,\n  onChange,\n  getOptionLabel = (o) => o?.name ?? '',\n  groupBy,\n  placeholder = 'Search…',\n  displayProperty = 'name',\n  width = 300,\n  fetchEnabled = true,\n  initialValue = null,\n  initialOptions = [],\n  isPaginated = true,\n  isSortable = true,\n  isFilterable = true,\n  pageSize = 50,\n  sortColumn = 'Name',\n  sortDirection = 'ASC',\n}) => {\n  const classes = useStyles();\n  const [options, setOptions] = useState(initialOptions);\n  const [value, setValue] = useState(initialValue);\n  const [inputValue, setInputValue] = useState('');\n  const [loading, setLoading] = useState(false);\n  const [loadingMore, setLoadingMore] = useState(false);\n  const [error, setError] = useState(null);\n  const [pageNumber, setPageNumber] = useState(1);\n  const [totalRows, setTotalRows] = useState(0);\n\n  const configRef = useRef(apiConfig);\n  const dataRef = useRef(apiData);\n  const listboxRef = useRef(null);\n  const prevScrollPositionRef = useRef(0);\n\n  const { t } = useTranslation();\n\n  /**\n   * Fetches a page of data from the provided API endpoint and updates the component state accordingly.\n   *\n   * This function supports:\n   * - Filtering (if `isFilterable` is true)\n   * - Sorting (if `isSortable` is true)\n   * - Pagination (based on the `page` and `pageSize` arguments)\n   * - Infinite scroll appending (via the `append` flag)\n   *\n   * @function fetchPage\n   * @param {string} keyword - The keyword to filter results by (if filtering is enabled)\n   * @param {number} page - The page number to fetch\n   * @param {boolean} [append=false] - If true, appends results to the current list; otherwise replaces it\n   * @returns {Promise<void>} - Resolves once data is fetched and state is updated\n   */\n  const fetchPage = useCallback(\n    async (keyword, page, append = false) => {\n      if (!fetchEnabled) return;\n\n      setError(null);\n      page === 1 ? setLoading(true) : setLoadingMore(true);\n\n      try {\n        const url = apiEndpoint(\n          isFilterable ? keyword : '',\n          page,\n          pageSize,\n          isSortable ? sortColumn : '',\n          isSortable ? sortDirection : 'ASC'\n        );\n        const resp = await apiMutate(apiBaseUrl, url, configRef.current, dataRef.current);\n        const { items, total } = mapResponse(resp.data);\n\n        setOptions((prev) => (append ? [...prev, ...items] : items));\n        setTotalRows(total);\n        setPageNumber(page);\n      } catch (err) {\n        setError(err.response?.data?.message ?? err.message ?? t('Unknown error'));\n      } finally {\n        page === 1 ? setLoading(false) : setLoadingMore(false);\n      }\n    },\n    [\n      apiBaseUrl,\n      apiEndpoint,\n      mapResponse,\n      pageSize,\n      sortColumn,\n      sortDirection,\n      isFilterable,\n      isSortable,\n      fetchEnabled,\n      t,\n    ]\n  );\n\n  /* ---------- infinite scroll ---------- */\n  const handleListboxScroll = (e) => {\n    if (!isPaginated) return;\n\n    const node = e.currentTarget;\n    prevScrollPositionRef.current = node.scrollTop;\n\n    if (\n      node.scrollTop + node.clientHeight >= node.scrollHeight - 30 &&\n      !loadingMore &&\n      options.length < totalRows\n    ) {\n      fetchPage(inputValue, pageNumber + 1, true);\n    }\n  };\n\n  /**\n   * **Listbox**\n   *\n   * Custom scrollable container used by the Autocomplete dropdown.\n   * - Attaches a ref to preserve scroll position between pages.\n   * - Displays a loading message if no options are present initially.\n   * - Shows a full overlay spinner when `loadingMore` is true.\n   *\n   * This component is passed as the `ListboxComponent` to FluentSelectMenu’s\n   * Autocomplete integration, enabling infinite scroll with visual feedback.\n   *\n   * @param {Object} props\n   * @param {React.ReactNode} props.children - Option elements to render\n   * @param {boolean} props.initialLoading - Whether to show the “Loading…” message initially\n   * @param {React.Ref} ref - Forwarded ref from the Autocomplete dropdown\n   * @returns {JSX.Element}\n   */\n  const Listbox = forwardRef(({ children, initialLoading, ...other }, ref) => (\n    <ul\n      ref={(inst) => {\n        if (inst) listboxRef.current = inst;\n        if (typeof ref === 'function') ref(inst);\n        else if (ref) ref.current = inst;\n      }}\n      {...other}\n      style={{\n        position: 'relative',\n        maxHeight: 300,\n        overflow: loadingMore ? 'hidden' : 'auto',\n      }}\n    >\n      {Children.count(children) === 0 && initialLoading ? (\n        <li style={{ textAlign: 'center', padding: 8 }}>{t('Loading...')}</li>\n      ) : (\n        children\n      )}\n\n      {loadingMore && (\n        <Box className={classes.overlay}>\n          <CircularProgress size={20} />\n          <span className={classes.overlayText}>{t('Loading...')}</span>\n        </Box>\n      )}\n    </ul>\n  ));\n  Listbox.displayName = 'FluentSMAutocompleteListbox';\n\n  /* [Initial / filtered fetch] */\n  useEffect(() => {\n    if (!fetchEnabled || !isFilterable) return;\n    if (value && inputValue === getOptionLabel(value)) return;\n\n    const timer = setTimeout(() => fetchPage(inputValue, 1, false), 400);\n    return () => clearTimeout(timer);\n  }, [inputValue, fetchPage, value, getOptionLabel, isFilterable, fetchEnabled]);\n\n  // [Initial fetch when filtering is disabled]\n  useEffect(() => {\n    if (!fetchEnabled || isFilterable) return;\n    fetchPage('', 1, false);\n  }, [isFilterable, fetchEnabled, fetchPage]);\n\n  // [Restores scroll position after loading more items]\n  useEffect(() => {\n    if (!loadingMore && listboxRef.current) {\n      listboxRef.current.scrollTop = prevScrollPositionRef.current;\n    }\n  }, [options, loadingMore]);\n\n  useEffect(() => { configRef.current = apiConfig }, [apiConfig]);\n  useEffect(() => { dataRef.current = apiData }, [apiData]);\n\n  return (\n    <Box width={width}>\n      <FluentSelectMenu\n        placeholder={placeholder}\n        data={options}\n        displayProperty={displayProperty}\n        onChange={(val) => {\n          setValue(val);\n          onChange?.(val);\n        }}\n        InputProps={{\n          endAdornment:\n            loading && pageNumber === 1 ? (\n              <CircularProgress color=\"inherit\" size={20} />\n            ) : null,\n        }}\n        autoCompleteProps={{\n          value,\n          inputValue,\n          onInputChange: (_e, v) => setInputValue(v),\n          loading: loading && pageNumber === 1,\n          getOptionLabel,\n          groupBy,\n          ListboxComponent: Listbox,\n          ListboxProps: {\n            onScroll: handleListboxScroll,\n            initialLoading: loading && pageNumber === 1,\n          },\n        }}\n      />\n\n      {error && (\n        <Alert severity=\"error\" style={{ marginTop: 8 }}>\n          {error}\n        </Alert>\n      )}\n    </Box>\n  );\n};\n\nFluentScrollLoadAutocompleteMenu.propTypes = {\n  /** Base URL used by apiMutate */\n  apiBaseUrl: PropTypes.string.isRequired,\n\n  /** Builds the endpoint URL: (keyword, page, pageSize, sortCol, sortDir) => string */\n  apiEndpoint: PropTypes.func.isRequired,\n\n  /** Additional config passed to apiMutate */\n  apiConfig: PropTypes.object,\n\n  /** Raw API data passed to apiMutate */\n  apiData: PropTypes.any,\n\n  /** Maps raw API payload into { items, total } */\n  mapResponse: PropTypes.func.isRequired,\n\n  /** Called when the user selects or clears an option */\n  onChange: PropTypes.func,\n\n  /** Returns the text label for a given option */\n  getOptionLabel: PropTypes.func,\n\n  /** Returns the group heading for a given option */\n  groupBy: PropTypes.func,\n\n  placeholder: PropTypes.string,\n  displayProperty: PropTypes.string,\n  width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n\n  /* Behavior flags */\n  fetchEnabled: PropTypes.bool,\n  initialValue: PropTypes.any,\n  initialOptions: PropTypes.array,\n\n  isPaginated: PropTypes.bool,\n  isSortable: PropTypes.bool,\n  isFilterable: PropTypes.bool,\n\n  pageSize: PropTypes.number,\n  sortColumn: PropTypes.string,\n  sortDirection: PropTypes.oneOf(['ASC', 'DESC']),\n};\n","import React, {forwardRef} from 'react'\nimport {\n  makeStyles,\n  withStyles,\n  Typography,\n  FormControl,\n  NativeSelect,\n  InputBase\n} from '@material-ui/core'\nimport PropTypes from 'prop-types'\n\nconst FluentInput = withStyles((theme) => ({\n  root: {\n    'label + &': {\n      marginTop: theme.spacing(1)\n    }\n  },\n  input: {\n    borderRadius: 2,\n    position: 'relative',\n    border: '1px solid rgba(0, 0, 0, 0.23)',\n    fontSize: 14,\n    padding: '4px 8px',\n    height: 20,\n    transition: theme.transitions.create(['border-color', 'box-shadow']),\n    '&:focus': {\n      borderRadius: 2\n    }\n  }\n}))(InputBase)\n\nconst useStyles = makeStyles((theme) => ({\n  margin: {\n    marginTop: theme.spacing(1),\n    marginBottom: theme.spacing(1)\n  }\n}))\n\nconst FluentSimpleSelectComponent = ({\n  label,\n  children,\n  id,\n  value,\n  handleChange,\n  defaultValue\n}, ref) => {\n  const classes = useStyles()\n\n  return (\n    <div>\n      <FormControl className={classes.margin}>\n        <Typography\n          className={classes.label}\n          style={{\n            color: 'rgba(0, 0, 0, 0.54)',\n            fontWeight: 400,\n            letterSpacing: 0\n          }}\n        >\n          {label}\n        </Typography>\n        <NativeSelect\n          id={id}\n          inputRef={ref}\n          value={value}\n          onChange={handleChange}\n          defaultValue={defaultValue}\n          input={<FluentInput />}\n          noShrink='true'\n        >\n          {children}\n        </NativeSelect>\n      </FormControl>\n    </div>\n  )\n}\n\nFluentSimpleSelectComponent.propTypes = {\n  /**\n   * Label that appears above the selector\n   */\n  label: PropTypes.string,\n  /**\n   * Contents of the selected options (<option></option>)\n   */\n  children: PropTypes.node,\n  /**\n   * Function to handle option change\n   */\n  handleChange: PropTypes.func,\n  /**\n   * Value: the value of the selected item\n   */\n  value: PropTypes.string\n}\nexport const FluentSimpleSelect = forwardRef(FluentSimpleSelectComponent)\n"],"mappings":"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"}

package/dist/{FluentTimePicker-LUfZzJJZ.js → FluentTimePicker-hNcocKsd.js}

@@ -64,4 +64,4 @@ FluentTimePicker.propTypes = {
 
 //#endregion
 export { FluentTimePicker as t };
-//# sourceMappingURL=FluentTimePicker-LUfZzJJZ.js.map
+//# sourceMappingURL=FluentTimePicker-hNcocKsd.js.map

package/dist/{FluentTimePicker-LUfZzJJZ.js.map → FluentTimePicker-hNcocKsd.js.map}

@@ -1 +1 @@
-{"version":3,"file":"FluentTimePicker-LUfZzJJZ.js","names":[],"sources":["../src/UI/inputs/pickers/FluentTimePicker.jsx"],"sourcesContent":["import React from 'react'\nimport { KeyboardTimePicker } from '@material-ui/pickers'\nimport { makeStyles, InputAdornment } from '@material-ui/core'\nimport { EventDateIcon } from '@fluentui/react-icons'\nimport { MuiPickersUtilsProvider } from '@material-ui/pickers'\nimport DateFnsUtils from '@date-io/date-fns'\nimport PropTypes from 'prop-types'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {},\n  inputRoot: {\n    fontSize: 12\n  },\n  input: {\n    borderRadius: 2,\n    height: 32,\n    padding: 0,\n    paddingLeft: theme.spacing(1)\n  },\n  formTextInput: {\n    fontSize: 14\n  },\n  labelRoot: {\n    fontSize: 14\n  },\n  FormControl: {\n    display: 'none',\n    marginTop: 0\n  }\n}))\n\nexport const FluentTimePicker = (props) => {\n  const classes = useStyles()\n  const { id, label, startAdornment, endAdornment, ...otherProps } = props\n\n  return (\n    <div>\n      <MuiPickersUtilsProvider utils={DateFnsUtils}>\n        <KeyboardTimePicker\n          variant='inline'\n          margin='normal'\n          {...otherProps}\n          id={id}\n          inputVariant='outlined'\n          KeyboardButtonProps={{\n            'aria-label': 'change date'\n          }}\n          keyboardIcon={<EventDateIcon style={{ fontSize: 16 }} />}\n          InputProps={{\n            classes: {\n              root: classes.input,\n              input: classes.formTextInput,\n              ...props.InputProps?.classes\n            },\n            ...props.InputProps,\n            ...startAdornment,\n            ...endAdornment,\n            startAdornment: (\n              <InputAdornment\n                classes={{ root: classes.inputRoot }}\n                className={classes.inputRoot}\n                position='start'\n              >\n                {label}\n              </InputAdornment>\n            )\n          }}\n          InputLabelProps={{\n            shrink: false,\n            classes: {\n              root: classes.labelRoot,\n              focused: classes.labelFocused\n            }\n          }}\n        />\n      </MuiPickersUtilsProvider>\n    </div>\n  )\n}\n\nFluentTimePicker.propTypes = {\n  /**\n   * Adornment label (eg, From: )\n   */\n  label: PropTypes.string,\n  /**\n   * Id\n   */\n  id: PropTypes.string\n}\n"],"mappings":";;;;;;;;AAQA,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM,EAAE;CACR,WAAW,EACT,UAAU,IACX;CACD,OAAO;EACL,cAAc;EACd,QAAQ;EACR,SAAS;EACT,aAAa,MAAM,QAAQ,EAAE;EAC9B;CACD,eAAe,EACb,UAAU,IACX;CACD,WAAW,EACT,UAAU,IACX;CACD,aAAa;EACX,SAAS;EACT,WAAW;EACZ;CACF,EAAE;AAEH,MAAa,oBAAoB,UAAU;CACzC,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,IAAI,OAAO,gBAAgB,cAAc,GAAG,eAAe;AAEnE,QACE,oCAAC,aACC,oCAAC,2BAAwB,OAAO,gBAC9B,oCAAC;EACC,SAAQ;EACR,QAAO;EACP,GAAI;EACA;EACJ,cAAa;EACb,qBAAqB,EACnB,cAAc,eACf;EACD,cAAc,oCAAC,iBAAc,OAAO,EAAE,UAAU,IAAI,GAAI;EACxD,YAAY;GACV,SAAS;IACP,MAAM,QAAQ;IACd,OAAO,QAAQ;IACf,GAAG,MAAM,YAAY;IACtB;GACD,GAAG,MAAM;GACT,GAAG;GACH,GAAG;GACH,gBACE,oCAAC;IACC,SAAS,EAAE,MAAM,QAAQ,WAAW;IACpC,WAAW,QAAQ;IACnB,UAAS;MAER,MACc;GAEpB;EACD,iBAAiB;GACf,QAAQ;GACR,SAAS;IACP,MAAM,QAAQ;IACd,SAAS,QAAQ;IAClB;GACF;GACD,CACsB,CACtB;;AAIV,iBAAiB,YAAY;CAI3B,OAAO,UAAU;CAIjB,IAAI,UAAU;CACf"}
+{"version":3,"file":"FluentTimePicker-hNcocKsd.js","names":[],"sources":["../src/UI/inputs/pickers/FluentTimePicker.jsx"],"sourcesContent":["import React from 'react'\nimport { KeyboardTimePicker } from '@material-ui/pickers'\nimport { makeStyles, InputAdornment } from '@material-ui/core'\nimport { EventDateIcon } from '@fluentui/react-icons'\nimport { MuiPickersUtilsProvider } from '@material-ui/pickers'\nimport DateFnsUtils from '@date-io/date-fns'\nimport PropTypes from 'prop-types'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {},\n  inputRoot: {\n    fontSize: 12\n  },\n  input: {\n    borderRadius: 2,\n    height: 32,\n    padding: 0,\n    paddingLeft: theme.spacing(1)\n  },\n  formTextInput: {\n    fontSize: 14\n  },\n  labelRoot: {\n    fontSize: 14\n  },\n  FormControl: {\n    display: 'none',\n    marginTop: 0\n  }\n}))\n\nexport const FluentTimePicker = (props) => {\n  const classes = useStyles()\n  const { id, label, startAdornment, endAdornment, ...otherProps } = props\n\n  return (\n    <div>\n      <MuiPickersUtilsProvider utils={DateFnsUtils}>\n        <KeyboardTimePicker\n          variant='inline'\n          margin='normal'\n          {...otherProps}\n          id={id}\n          inputVariant='outlined'\n          KeyboardButtonProps={{\n            'aria-label': 'change date'\n          }}\n          keyboardIcon={<EventDateIcon style={{ fontSize: 16 }} />}\n          InputProps={{\n            classes: {\n              root: classes.input,\n              input: classes.formTextInput,\n              ...props.InputProps?.classes\n            },\n            ...props.InputProps,\n            ...startAdornment,\n            ...endAdornment,\n            startAdornment: (\n              <InputAdornment\n                classes={{ root: classes.inputRoot }}\n                className={classes.inputRoot}\n                position='start'\n              >\n                {label}\n              </InputAdornment>\n            )\n          }}\n          InputLabelProps={{\n            shrink: false,\n            classes: {\n              root: classes.labelRoot,\n              focused: classes.labelFocused\n            }\n          }}\n        />\n      </MuiPickersUtilsProvider>\n    </div>\n  )\n}\n\nFluentTimePicker.propTypes = {\n  /**\n   * Adornment label (eg, From: )\n   */\n  label: PropTypes.string,\n  /**\n   * Id\n   */\n  id: PropTypes.string\n}\n"],"mappings":";;;;;;;;AAQA,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM,EAAE;CACR,WAAW,EACT,UAAU,IACX;CACD,OAAO;EACL,cAAc;EACd,QAAQ;EACR,SAAS;EACT,aAAa,MAAM,QAAQ,EAAE;EAC9B;CACD,eAAe,EACb,UAAU,IACX;CACD,WAAW,EACT,UAAU,IACX;CACD,aAAa;EACX,SAAS;EACT,WAAW;EACZ;CACF,EAAE;AAEH,MAAa,oBAAoB,UAAU;CACzC,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,IAAI,OAAO,gBAAgB,cAAc,GAAG,eAAe;AAEnE,QACE,oCAAC,aACC,oCAAC,2BAAwB,OAAO,gBAC9B,oCAAC;EACC,SAAQ;EACR,QAAO;EACP,GAAI;EACA;EACJ,cAAa;EACb,qBAAqB,EACnB,cAAc,eACf;EACD,cAAc,oCAAC,iBAAc,OAAO,EAAE,UAAU,IAAI,GAAI;EACxD,YAAY;GACV,SAAS;IACP,MAAM,QAAQ;IACd,OAAO,QAAQ;IACf,GAAG,MAAM,YAAY;IACtB;GACD,GAAG,MAAM;GACT,GAAG;GACH,GAAG;GACH,gBACE,oCAAC;IACC,SAAS,EAAE,MAAM,QAAQ,WAAW;IACpC,WAAW,QAAQ;IACnB,UAAS;MAER,MACc;GAEpB;EACD,iBAAiB;GACf,QAAQ;GACR,SAAS;IACP,MAAM,QAAQ;IACd,SAAS,QAAQ;IAClB;GACF;GACD,CACsB,CACtB;;AAIV,iBAAiB,YAAY;CAI3B,OAAO,UAAU;CAIjB,IAAI,UAAU;CACf"}

package/dist/{FluentTimeline-BEPJHsgi.js → FluentTimeline-D8sfgLj1.js}

@@ -89,4 +89,4 @@ var FluentTimeline_default = FluentTimeline;
 
 //#endregion
 export { FluentTimeline_default as t };
-//# sourceMappingURL=FluentTimeline-BEPJHsgi.js.map
+//# sourceMappingURL=FluentTimeline-D8sfgLj1.js.map

package/dist/{FluentTimeline-BEPJHsgi.js.map → FluentTimeline-D8sfgLj1.js.map}

@@ -1 +1 @@
-{"version":3,"file":"FluentTimeline-BEPJHsgi.js","names":["useStyles","NumberVisualization"],"sources":["../src/UI/widgets/utils/NumberVisualization.jsx","../src/UI/widgets/FluentComponents/molecules/FluentTimeline.jsx"],"sourcesContent":["import React, { Fragment } from 'react'\nimport { Avatar, colors, makeStyles } from '@material-ui/core'\nimport clsx from 'clsx'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    minWidth: 30,\n    minHeight: 30,\n    maxWidth: 70,\n    maxHeight: 70,\n    // color: theme.palette.getContrastText(theme.palette.primary.dark),\n    color: theme?.palette?.primary?.dark\n  },\n  positive: {\n    backgroundColor: (props) =>\n      colors.teal[Math.ceil((props.number * 5) / 100) * 100]\n  },\n  negative: {\n    backgroundColor: (props) =>\n      colors.deepOrange[Math.abs(Math.ceil((props.number * 5) / 100) * 100)]\n  }\n}))\n\nconst NumberVisualization = (props) => {\n  const classes = useStyles(props)\n  const { number } = props\n\n  let displayCircle = ''\n\n  if (number > 0) {\n    displayCircle = (\n      <Avatar\n        className={clsx(classes.root, classes.positive)}\n        style={{\n          width: number * 2,\n          height: number * 2\n        }}\n      >\n        {number}\n      </Avatar>\n    )\n  } else {\n    displayCircle = (\n      <Avatar\n        className={clsx(classes.root, classes.negative)}\n        style={{\n          width: number * 2,\n          height: number * 2\n        }}\n      >\n        {number}\n      </Avatar>\n    )\n  }\n\n  return <Fragment> {displayCircle} </Fragment>\n}\nexport default NumberVisualization\n","import React from 'react'\nimport { makeStyles, Typography } from '@material-ui/core'\nimport NumberVisualization from '../../utils/NumberVisualization'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    display: 'flex',\n    flexDirection: 'row',\n    marginTop: theme.spacing(3),\n    marginLeft: theme.spacing(2),\n    overflow: 'auto'\n  },\n  dot: {\n    width: 10,\n    height: 10,\n    backgroundColor: 'white',\n    borderRadius: theme.shape.borderRadius + 25,\n    marginTop: theme.spacing(1)\n  },\n  timeLabels: {\n    color: 'white'\n  },\n  indicator: {\n    display: 'flex',\n    flexDirection: 'column',\n    justifyContent: 'flex-end',\n    marginRight: theme.spacing(2),\n    textAlign: 'center',\n    alignItems: 'center'\n  }\n}))\n\nconst TimeDot = (props) => {\n  const classes = useStyles()\n  const { dot } = props\n  return (\n    <div className={classes.indicator}>\n      <div className={classes.dot} />\n      <div className={classes.timeLabels}>\n        <Typography variant='overline'>{dot}</Typography>\n      </div>\n    </div>\n  )\n}\n\nconst Visualization = (props) => {\n  const classes = useStyles()\n  const { value, label } = props\n  return (\n    <div className={classes.indicator}>\n      <div>\n        <NumberVisualization number={value} />\n      </div>\n      <div>\n        <TimeDot dot={label} />\n      </div>\n    </div>\n  )\n}\n\nconst categoriesToDisplay = (categories) =>\n  categories.map((item) => {\n    return (\n      <Visualization key={item.label} value={item.value} label={item.label} />\n    )\n  })\n\nconst FluentTimeline = (props) => {\n  const classes = useStyles()\n  const { categories } = props\n\n  return <div className={classes.root}>{categoriesToDisplay(categories)}</div>\n}\nexport default FluentTimeline\n"],"mappings":";;;;;AAIA,MAAMA,cAAY,YAAY,WAAW;CACvC,MAAM;EACJ,UAAU;EACV,WAAW;EACX,UAAU;EACV,WAAW;EAEX,OAAO,OAAO,SAAS,SAAS;EACjC;CACD,UAAU,EACR,kBAAkB,UAChB,OAAO,KAAK,KAAK,KAAM,MAAM,SAAS,IAAK,IAAI,GAAG,MACrD;CACD,UAAU,EACR,kBAAkB,UAChB,OAAO,WAAW,KAAK,IAAI,KAAK,KAAM,MAAM,SAAS,IAAK,IAAI,GAAG,IAAI,GACxE;CACF,EAAE;AAEH,MAAM,uBAAuB,UAAU;CACrC,MAAM,UAAUA,YAAU,MAAM;CAChC,MAAM,EAAE,WAAW;CAEnB,IAAI,gBAAgB;AAEpB,KAAI,SAAS,EACX,iBACE,oCAAC;EACC,WAAW,KAAK,QAAQ,MAAM,QAAQ,SAAS;EAC/C,OAAO;GACL,OAAO,SAAS;GAChB,QAAQ,SAAS;GAClB;IAEA,OACM;KAGX,iBACE,oCAAC;EACC,WAAW,KAAK,QAAQ,MAAM,QAAQ,SAAS;EAC/C,OAAO;GACL,OAAO,SAAS;GAChB,QAAQ,SAAS;GAClB;IAEA,OACM;AAIb,QAAO,oCAAC,gBAAS,KAAE,eAAc,IAAY;;AAE/C,kCAAe;;;;ACrDf,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM;EACJ,SAAS;EACT,eAAe;EACf,WAAW,MAAM,QAAQ,EAAE;EAC3B,YAAY,MAAM,QAAQ,EAAE;EAC5B,UAAU;EACX;CACD,KAAK;EACH,OAAO;EACP,QAAQ;EACR,iBAAiB;EACjB,cAAc,MAAM,MAAM,eAAe;EACzC,WAAW,MAAM,QAAQ,EAAE;EAC5B;CACD,YAAY,EACV,OAAO,SACR;CACD,WAAW;EACT,SAAS;EACT,eAAe;EACf,gBAAgB;EAChB,aAAa,MAAM,QAAQ,EAAE;EAC7B,WAAW;EACX,YAAY;EACb;CACF,EAAE;AAEH,MAAM,WAAW,UAAU;CACzB,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,QAAQ;AAChB,QACE,oCAAC,SAAI,WAAW,QAAQ,aACtB,oCAAC,SAAI,WAAW,QAAQ,MAAO,EAC/B,oCAAC,SAAI,WAAW,QAAQ,cACtB,oCAAC,cAAW,SAAQ,cAAY,IAAiB,CAC7C,CACF;;AAIV,MAAM,iBAAiB,UAAU;CAC/B,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,OAAO,UAAU;AACzB,QACE,oCAAC,SAAI,WAAW,QAAQ,aACtB,oCAAC,aACC,oCAACC,+BAAoB,QAAQ,QAAS,CAClC,EACN,oCAAC,aACC,oCAAC,WAAQ,KAAK,QAAS,CACnB,CACF;;AAIV,MAAM,uBAAuB,eAC3B,WAAW,KAAK,SAAS;AACvB,QACE,oCAAC;EAAc,KAAK,KAAK;EAAO,OAAO,KAAK;EAAO,OAAO,KAAK;GAAS;EAE1E;AAEJ,MAAM,kBAAkB,UAAU;CAChC,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,eAAe;AAEvB,QAAO,oCAAC,SAAI,WAAW,QAAQ,QAAO,oBAAoB,WAAW,CAAO;;AAE9E,6BAAe"}
+{"version":3,"file":"FluentTimeline-D8sfgLj1.js","names":["useStyles","NumberVisualization"],"sources":["../src/UI/widgets/utils/NumberVisualization.jsx","../src/UI/widgets/FluentComponents/molecules/FluentTimeline.jsx"],"sourcesContent":["import React, { Fragment } from 'react'\nimport { Avatar, colors, makeStyles } from '@material-ui/core'\nimport clsx from 'clsx'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    minWidth: 30,\n    minHeight: 30,\n    maxWidth: 70,\n    maxHeight: 70,\n    // color: theme.palette.getContrastText(theme.palette.primary.dark),\n    color: theme?.palette?.primary?.dark\n  },\n  positive: {\n    backgroundColor: (props) =>\n      colors.teal[Math.ceil((props.number * 5) / 100) * 100]\n  },\n  negative: {\n    backgroundColor: (props) =>\n      colors.deepOrange[Math.abs(Math.ceil((props.number * 5) / 100) * 100)]\n  }\n}))\n\nconst NumberVisualization = (props) => {\n  const classes = useStyles(props)\n  const { number } = props\n\n  let displayCircle = ''\n\n  if (number > 0) {\n    displayCircle = (\n      <Avatar\n        className={clsx(classes.root, classes.positive)}\n        style={{\n          width: number * 2,\n          height: number * 2\n        }}\n      >\n        {number}\n      </Avatar>\n    )\n  } else {\n    displayCircle = (\n      <Avatar\n        className={clsx(classes.root, classes.negative)}\n        style={{\n          width: number * 2,\n          height: number * 2\n        }}\n      >\n        {number}\n      </Avatar>\n    )\n  }\n\n  return <Fragment> {displayCircle} </Fragment>\n}\nexport default NumberVisualization\n","import React from 'react'\nimport { makeStyles, Typography } from '@material-ui/core'\nimport NumberVisualization from '../../utils/NumberVisualization'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    display: 'flex',\n    flexDirection: 'row',\n    marginTop: theme.spacing(3),\n    marginLeft: theme.spacing(2),\n    overflow: 'auto'\n  },\n  dot: {\n    width: 10,\n    height: 10,\n    backgroundColor: 'white',\n    borderRadius: theme.shape.borderRadius + 25,\n    marginTop: theme.spacing(1)\n  },\n  timeLabels: {\n    color: 'white'\n  },\n  indicator: {\n    display: 'flex',\n    flexDirection: 'column',\n    justifyContent: 'flex-end',\n    marginRight: theme.spacing(2),\n    textAlign: 'center',\n    alignItems: 'center'\n  }\n}))\n\nconst TimeDot = (props) => {\n  const classes = useStyles()\n  const { dot } = props\n  return (\n    <div className={classes.indicator}>\n      <div className={classes.dot} />\n      <div className={classes.timeLabels}>\n        <Typography variant='overline'>{dot}</Typography>\n      </div>\n    </div>\n  )\n}\n\nconst Visualization = (props) => {\n  const classes = useStyles()\n  const { value, label } = props\n  return (\n    <div className={classes.indicator}>\n      <div>\n        <NumberVisualization number={value} />\n      </div>\n      <div>\n        <TimeDot dot={label} />\n      </div>\n    </div>\n  )\n}\n\nconst categoriesToDisplay = (categories) =>\n  categories.map((item) => {\n    return (\n      <Visualization key={item.label} value={item.value} label={item.label} />\n    )\n  })\n\nconst FluentTimeline = (props) => {\n  const classes = useStyles()\n  const { categories } = props\n\n  return <div className={classes.root}>{categoriesToDisplay(categories)}</div>\n}\nexport default FluentTimeline\n"],"mappings":";;;;;AAIA,MAAMA,cAAY,YAAY,WAAW;CACvC,MAAM;EACJ,UAAU;EACV,WAAW;EACX,UAAU;EACV,WAAW;EAEX,OAAO,OAAO,SAAS,SAAS;EACjC;CACD,UAAU,EACR,kBAAkB,UAChB,OAAO,KAAK,KAAK,KAAM,MAAM,SAAS,IAAK,IAAI,GAAG,MACrD;CACD,UAAU,EACR,kBAAkB,UAChB,OAAO,WAAW,KAAK,IAAI,KAAK,KAAM,MAAM,SAAS,IAAK,IAAI,GAAG,IAAI,GACxE;CACF,EAAE;AAEH,MAAM,uBAAuB,UAAU;CACrC,MAAM,UAAUA,YAAU,MAAM;CAChC,MAAM,EAAE,WAAW;CAEnB,IAAI,gBAAgB;AAEpB,KAAI,SAAS,EACX,iBACE,oCAAC;EACC,WAAW,KAAK,QAAQ,MAAM,QAAQ,SAAS;EAC/C,OAAO;GACL,OAAO,SAAS;GAChB,QAAQ,SAAS;GAClB;IAEA,OACM;KAGX,iBACE,oCAAC;EACC,WAAW,KAAK,QAAQ,MAAM,QAAQ,SAAS;EAC/C,OAAO;GACL,OAAO,SAAS;GAChB,QAAQ,SAAS;GAClB;IAEA,OACM;AAIb,QAAO,oCAAC,gBAAS,KAAE,eAAc,IAAY;;AAE/C,kCAAe;;;;ACrDf,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM;EACJ,SAAS;EACT,eAAe;EACf,WAAW,MAAM,QAAQ,EAAE;EAC3B,YAAY,MAAM,QAAQ,EAAE;EAC5B,UAAU;EACX;CACD,KAAK;EACH,OAAO;EACP,QAAQ;EACR,iBAAiB;EACjB,cAAc,MAAM,MAAM,eAAe;EACzC,WAAW,MAAM,QAAQ,EAAE;EAC5B;CACD,YAAY,EACV,OAAO,SACR;CACD,WAAW;EACT,SAAS;EACT,eAAe;EACf,gBAAgB;EAChB,aAAa,MAAM,QAAQ,EAAE;EAC7B,WAAW;EACX,YAAY;EACb;CACF,EAAE;AAEH,MAAM,WAAW,UAAU;CACzB,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,QAAQ;AAChB,QACE,oCAAC,SAAI,WAAW,QAAQ,aACtB,oCAAC,SAAI,WAAW,QAAQ,MAAO,EAC/B,oCAAC,SAAI,WAAW,QAAQ,cACtB,oCAAC,cAAW,SAAQ,cAAY,IAAiB,CAC7C,CACF;;AAIV,MAAM,iBAAiB,UAAU;CAC/B,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,OAAO,UAAU;AACzB,QACE,oCAAC,SAAI,WAAW,QAAQ,aACtB,oCAAC,aACC,oCAACC,+BAAoB,QAAQ,QAAS,CAClC,EACN,oCAAC,aACC,oCAAC,WAAQ,KAAK,QAAS,CACnB,CACF;;AAIV,MAAM,uBAAuB,eAC3B,WAAW,KAAK,SAAS;AACvB,QACE,oCAAC;EAAc,KAAK,KAAK;EAAO,OAAO,KAAK;EAAO,OAAO,KAAK;GAAS;EAE1E;AAEJ,MAAM,kBAAkB,UAAU;CAChC,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,eAAe;AAEvB,QAAO,oCAAC,SAAI,WAAW,QAAQ,QAAO,oBAAoB,WAAW,CAAO;;AAE9E,6BAAe"}

package/dist/{GraphCard-CcXwOERk.js → GraphCard-Dv4a99wo.js}

@@ -72,4 +72,4 @@ GraphCard.propTypes = {
 
 //#endregion
 export { GraphCard as t };
-//# sourceMappingURL=GraphCard-CcXwOERk.js.map
+//# sourceMappingURL=GraphCard-Dv4a99wo.js.map

package/dist/{GraphCard-CcXwOERk.js.map → GraphCard-Dv4a99wo.js.map}

@@ -1 +1 @@
-{"version":3,"file":"GraphCard-CcXwOERk.js","names":["PropTypes"],"sources":["../src/UI/dataDisplay/GraphCard/GraphCard.jsx"],"sourcesContent":["import React from 'react';\nimport { makeStyles } from '@material-ui/core';\nimport { MuiVegaLite } from '@material-vega/material-ui';\nimport { PropTypes } from 'prop-types';\nimport { AmbientCard } from '../../surfaces/cards/AmbientCard';\nimport { EmptyStateDisplay } from '../EmptyStateDisplay';\nimport { useTranslation } from 'react-i18next';\nimport clsx from 'clsx';\n\nconst useStyles = makeStyles((theme) => ({\n  infoPanel: {\n    display: 'flex',\n    flexDirection: 'row',\n    justifyContent: 'space-around',\n    alignItems: 'center',\n    alignSelf: 'stretch',\n    padding: '10px 32px'\n  },\n  graphSection: {\n    overflow: 'hidden',\n    '& svg': {\n      width: '100%',\n      height: '100%'\n    },\n    '& .vega-embed': {\n      width: '100%',\n      height: '100%'\n    },\n    paddingTop: theme.spacing(1),\n    margin: 0,\n    height: (props) => props?.graphHeight ?? '255px'\n  },\n  emptyStateDisplay: {\n    marginTop: theme.spacing(1),\n    marginBottom: theme.spacing(1),\n  }\n}));\n\n/**\n * `GraphCard` component\n */\nexport const GraphCard = (props) => {\n  const {\n    title,\n    showInfoPanel = true,\n    graphSpecs,\n    children,\n    headerColor,\n    className,\n    noData = false,\n    emptyStatePrimaryText,\n    emptyStateImageSrc,\n    emptyStateIconSize,\n    emptyStateImageWidth,\n    emptyStateClassName,\n    emptyStateIcon,\n    ...otherProps\n  } = props;\n  const classes = useStyles(props);\n  const { t } = useTranslation();\n\n  return (\n    <AmbientCard\n      fullWidth\n      title={title}\n      headerColor={headerColor}\n      {...otherProps}\n    >\n      {!noData ? (\n        <div>\n          {showInfoPanel && <div className={classes.infoPanel}>{children}</div>}\n          <div className={classes.graphSection}>\n            <MuiVegaLite\n              variant='verticalBarChart'\n              background='paper'\n              autoResize\n              actions={false}\n              spec={graphSpecs || {}}\n            />\n          </div>\n        </div>\n      ) : (\n        <div className={clsx(classes.emptyStateDisplay, emptyStateClassName)}>\n          <EmptyStateDisplay\n            primaryText={emptyStatePrimaryText ?? t('No results found')}\n            icon={emptyStateIcon}\n            iconSize={emptyStateIconSize}\n            imageSrc={emptyStateImageSrc}\n            imageWidth={emptyStateImageWidth}\n          />\n        </div>\n      )}\n    </AmbientCard>\n  );\n};\n\nGraphCard.propTypes = {\n  /**\n   * Optional, card title\n   */\n  title: PropTypes.string,\n\n  /**\n   * @type {?object}\n   {\n     graphSpecs: {} object see an example structure in https://vega.github.io/vega-lite/usage/typescript.html\n    }\n   */\n  graphSpecs: PropTypes.object.isRequired,\n\n  /**\n   * Optional, hide or show the top panel\n   */\n  showInfoPanel: PropTypes.bool,\n\n  /**\n   * Optional, content for the info panel behind the graph\n   */\n  children: PropTypes.node,\n\n  /**\n   * Optional, additional properties to apply some styles over the main container\n   */\n  style: PropTypes.object\n};\n"],"mappings":";;;;;;;;;;AASA,MAAM,YAAY,YAAY,WAAW;CACvC,WAAW;EACT,SAAS;EACT,eAAe;EACf,gBAAgB;EAChB,YAAY;EACZ,WAAW;EACX,SAAS;EACV;CACD,cAAc;EACZ,UAAU;EACV,SAAS;GACP,OAAO;GACP,QAAQ;GACT;EACD,iBAAiB;GACf,OAAO;GACP,QAAQ;GACT;EACD,YAAY,MAAM,QAAQ,EAAE;EAC5B,QAAQ;EACR,SAAS,UAAU,OAAO,eAAe;EAC1C;CACD,mBAAmB;EACjB,WAAW,MAAM,QAAQ,EAAE;EAC3B,cAAc,MAAM,QAAQ,EAAE;EAC/B;CACF,EAAE;;;;AAKH,MAAa,aAAa,UAAU;CAClC,MAAM,EACJ,OACA,gBAAgB,MAChB,YACA,UACA,aACA,WACA,SAAS,OACT,uBACA,oBACA,oBACA,sBACA,qBACA,gBACA,GAAG,eACD;CACJ,MAAM,UAAU,UAAU,MAAM;CAChC,MAAM,EAAE,MAAM,gBAAgB;AAE9B,QACE,oCAAC;EACC;EACO;EACM;EACb,GAAI;IAEH,CAAC,SACA,oCAAC,aACE,iBAAiB,oCAAC,SAAI,WAAW,QAAQ,aAAY,SAAe,EACrE,oCAAC,SAAI,WAAW,QAAQ,gBACtB,oCAAC;EACC,SAAQ;EACR,YAAW;EACX;EACA,SAAS;EACT,MAAM,cAAc,EAAE;GACtB,CACE,CACF,GAEN,oCAAC,SAAI,WAAW,KAAK,QAAQ,mBAAmB,oBAAoB,IAClE,oCAAC;EACC,aAAa,yBAAyB,EAAE,mBAAmB;EAC3D,MAAM;EACN,UAAU;EACV,UAAU;EACV,YAAY;GACZ,CACE,CAEI;;AAIlB,UAAU,YAAY;CAIpB,OAAOA,YAAU;CAQjB,YAAYA,YAAU,OAAO;CAK7B,eAAeA,YAAU;CAKzB,UAAUA,YAAU;CAKpB,OAAOA,YAAU;CAClB"}
+{"version":3,"file":"GraphCard-Dv4a99wo.js","names":["PropTypes"],"sources":["../src/UI/dataDisplay/GraphCard/GraphCard.jsx"],"sourcesContent":["import React from 'react';\nimport { makeStyles } from '@material-ui/core';\nimport { MuiVegaLite } from '@material-vega/material-ui';\nimport { PropTypes } from 'prop-types';\nimport { AmbientCard } from '../../surfaces/cards/AmbientCard';\nimport { EmptyStateDisplay } from '../EmptyStateDisplay';\nimport { useTranslation } from 'react-i18next';\nimport clsx from 'clsx';\n\nconst useStyles = makeStyles((theme) => ({\n  infoPanel: {\n    display: 'flex',\n    flexDirection: 'row',\n    justifyContent: 'space-around',\n    alignItems: 'center',\n    alignSelf: 'stretch',\n    padding: '10px 32px'\n  },\n  graphSection: {\n    overflow: 'hidden',\n    '& svg': {\n      width: '100%',\n      height: '100%'\n    },\n    '& .vega-embed': {\n      width: '100%',\n      height: '100%'\n    },\n    paddingTop: theme.spacing(1),\n    margin: 0,\n    height: (props) => props?.graphHeight ?? '255px'\n  },\n  emptyStateDisplay: {\n    marginTop: theme.spacing(1),\n    marginBottom: theme.spacing(1),\n  }\n}));\n\n/**\n * `GraphCard` component\n */\nexport const GraphCard = (props) => {\n  const {\n    title,\n    showInfoPanel = true,\n    graphSpecs,\n    children,\n    headerColor,\n    className,\n    noData = false,\n    emptyStatePrimaryText,\n    emptyStateImageSrc,\n    emptyStateIconSize,\n    emptyStateImageWidth,\n    emptyStateClassName,\n    emptyStateIcon,\n    ...otherProps\n  } = props;\n  const classes = useStyles(props);\n  const { t } = useTranslation();\n\n  return (\n    <AmbientCard\n      fullWidth\n      title={title}\n      headerColor={headerColor}\n      {...otherProps}\n    >\n      {!noData ? (\n        <div>\n          {showInfoPanel && <div className={classes.infoPanel}>{children}</div>}\n          <div className={classes.graphSection}>\n            <MuiVegaLite\n              variant='verticalBarChart'\n              background='paper'\n              autoResize\n              actions={false}\n              spec={graphSpecs || {}}\n            />\n          </div>\n        </div>\n      ) : (\n        <div className={clsx(classes.emptyStateDisplay, emptyStateClassName)}>\n          <EmptyStateDisplay\n            primaryText={emptyStatePrimaryText ?? t('No results found')}\n            icon={emptyStateIcon}\n            iconSize={emptyStateIconSize}\n            imageSrc={emptyStateImageSrc}\n            imageWidth={emptyStateImageWidth}\n          />\n        </div>\n      )}\n    </AmbientCard>\n  );\n};\n\nGraphCard.propTypes = {\n  /**\n   * Optional, card title\n   */\n  title: PropTypes.string,\n\n  /**\n   * @type {?object}\n   {\n     graphSpecs: {} object see an example structure in https://vega.github.io/vega-lite/usage/typescript.html\n    }\n   */\n  graphSpecs: PropTypes.object.isRequired,\n\n  /**\n   * Optional, hide or show the top panel\n   */\n  showInfoPanel: PropTypes.bool,\n\n  /**\n   * Optional, content for the info panel behind the graph\n   */\n  children: PropTypes.node,\n\n  /**\n   * Optional, additional properties to apply some styles over the main container\n   */\n  style: PropTypes.object\n};\n"],"mappings":";;;;;;;;;;AASA,MAAM,YAAY,YAAY,WAAW;CACvC,WAAW;EACT,SAAS;EACT,eAAe;EACf,gBAAgB;EAChB,YAAY;EACZ,WAAW;EACX,SAAS;EACV;CACD,cAAc;EACZ,UAAU;EACV,SAAS;GACP,OAAO;GACP,QAAQ;GACT;EACD,iBAAiB;GACf,OAAO;GACP,QAAQ;GACT;EACD,YAAY,MAAM,QAAQ,EAAE;EAC5B,QAAQ;EACR,SAAS,UAAU,OAAO,eAAe;EAC1C;CACD,mBAAmB;EACjB,WAAW,MAAM,QAAQ,EAAE;EAC3B,cAAc,MAAM,QAAQ,EAAE;EAC/B;CACF,EAAE;;;;AAKH,MAAa,aAAa,UAAU;CAClC,MAAM,EACJ,OACA,gBAAgB,MAChB,YACA,UACA,aACA,WACA,SAAS,OACT,uBACA,oBACA,oBACA,sBACA,qBACA,gBACA,GAAG,eACD;CACJ,MAAM,UAAU,UAAU,MAAM;CAChC,MAAM,EAAE,MAAM,gBAAgB;AAE9B,QACE,oCAAC;EACC;EACO;EACM;EACb,GAAI;IAEH,CAAC,SACA,oCAAC,aACE,iBAAiB,oCAAC,SAAI,WAAW,QAAQ,aAAY,SAAe,EACrE,oCAAC,SAAI,WAAW,QAAQ,gBACtB,oCAAC;EACC,SAAQ;EACR,YAAW;EACX;EACA,SAAS;EACT,MAAM,cAAc,EAAE;GACtB,CACE,CACF,GAEN,oCAAC,SAAI,WAAW,KAAK,QAAQ,mBAAmB,oBAAoB,IAClE,oCAAC;EACC,aAAa,yBAAyB,EAAE,mBAAmB;EAC3D,MAAM;EACN,UAAU;EACV,UAAU;EACV,YAAY;GACZ,CACE,CAEI;;AAIlB,UAAU,YAAY;CAIpB,OAAOA,YAAU;CAQjB,YAAYA,YAAU,OAAO;CAK7B,eAAeA,YAAU;CAKzB,UAAUA,YAAU;CAKpB,OAAOA,YAAU;CAClB"}

package/dist/{IconKey-CbK8_rol.js → IconKey-D7fZ_U4O.js}

@@ -57,4 +57,4 @@ IconKey.propTypes = {
 
 //#endregion
 export { ColorKey as n, IconKey as t };
-//# sourceMappingURL=IconKey-CbK8_rol.js.map
+//# sourceMappingURL=IconKey-D7fZ_U4O.js.map

package/dist/{IconKey-CbK8_rol.js.map → IconKey-D7fZ_U4O.js.map}

@@ -1 +1 @@
-{"version":3,"file":"IconKey-CbK8_rol.js","names":["useStyles"],"sources":["../src/UI/dataDisplay/map/ColorKey.jsx","../src/UI/dataDisplay/map/IconKey.jsx"],"sourcesContent":["import React from 'react'\nimport { makeStyles, Typography } from '@material-ui/core'\nimport PropTypes from 'prop-types'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {},\n  itemKey: {\n    width: theme.spacing(4),\n    height: theme.spacing(0.5),\n    marginTop: theme.spacing(0.5)\n  },\n  keyRoot: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    marginRight: theme.spacing(5),\n    width: theme.spacing(10)\n  }\n}))\n\nexport const ColorKey = ({ label, color }) => {\n  const classes = useStyles()\n  return (\n    <div className={classes.keyRoot}>\n      <Typography variant='caption'>{label}</Typography>\n      <div className={classes.itemKey} style={{ background: color }} />\n    </div>\n  )\n}\n\nColorKey.propTypes = {\n  /**\n   * Key label\n   */\n  label: PropTypes.string.isRequired,\n  /**\n   * Color of the key item\n   */\n  color: PropTypes.string.isRequired\n}\n","import React from 'react'\nimport { makeStyles, Typography } from '@material-ui/core'\nimport PropTypes from 'prop-types'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {},\n  keyRoot: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    marginRight: theme.spacing(5)\n  },\n  label: {\n    marginTop: 1,\n    marginLeft: theme.spacing(1)\n  }\n}))\n\nexport const IconKey = ({ label, icon }) => {\n  const classes = useStyles()\n  return (\n    <div className={classes.keyRoot}>\n      {icon}\n      <Typography className={classes.label} variant='caption'>\n        {label}\n      </Typography>\n    </div>\n  )\n}\n\nIconKey.propTypes = {\n  /**\n   * Key label\n   */\n  label: PropTypes.string.isRequired,\n  /**\n   * Icon for the key item\n   */\n  icon: PropTypes.string.isRequired\n}\n"],"mappings":";;;;;AAIA,MAAMA,cAAY,YAAY,WAAW;CACvC,MAAM,EAAE;CACR,SAAS;EACP,OAAO,MAAM,QAAQ,EAAE;EACvB,QAAQ,MAAM,QAAQ,GAAI;EAC1B,WAAW,MAAM,QAAQ,GAAI;EAC9B;CACD,SAAS;EACP,SAAS;EACT,gBAAgB;EAChB,aAAa,MAAM,QAAQ,EAAE;EAC7B,OAAO,MAAM,QAAQ,GAAG;EACzB;CACF,EAAE;AAEH,MAAa,YAAY,EAAE,OAAO,YAAY;CAC5C,MAAM,UAAUA,aAAW;AAC3B,QACE,oCAAC,SAAI,WAAW,QAAQ,WACtB,oCAAC,cAAW,SAAQ,aAAW,MAAmB,EAClD,oCAAC;EAAI,WAAW,QAAQ;EAAS,OAAO,EAAE,YAAY,OAAO;GAAI,CAC7D;;AAIV,SAAS,YAAY;CAInB,OAAO,UAAU,OAAO;CAIxB,OAAO,UAAU,OAAO;CACzB;;;;AClCD,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM,EAAE;CACR,SAAS;EACP,SAAS;EACT,gBAAgB;EAChB,aAAa,MAAM,QAAQ,EAAE;EAC9B;CACD,OAAO;EACL,WAAW;EACX,YAAY,MAAM,QAAQ,EAAE;EAC7B;CACF,EAAE;AAEH,MAAa,WAAW,EAAE,OAAO,WAAW;CAC1C,MAAM,UAAU,WAAW;AAC3B,QACE,oCAAC,SAAI,WAAW,QAAQ,WACrB,MACD,oCAAC;EAAW,WAAW,QAAQ;EAAO,SAAQ;IAC3C,MACU,CACT;;AAIV,QAAQ,YAAY;CAIlB,OAAO,UAAU,OAAO;CAIxB,MAAM,UAAU,OAAO;CACxB"}
+{"version":3,"file":"IconKey-D7fZ_U4O.js","names":["useStyles"],"sources":["../src/UI/dataDisplay/map/ColorKey.jsx","../src/UI/dataDisplay/map/IconKey.jsx"],"sourcesContent":["import React from 'react'\nimport { makeStyles, Typography } from '@material-ui/core'\nimport PropTypes from 'prop-types'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {},\n  itemKey: {\n    width: theme.spacing(4),\n    height: theme.spacing(0.5),\n    marginTop: theme.spacing(0.5)\n  },\n  keyRoot: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    marginRight: theme.spacing(5),\n    width: theme.spacing(10)\n  }\n}))\n\nexport const ColorKey = ({ label, color }) => {\n  const classes = useStyles()\n  return (\n    <div className={classes.keyRoot}>\n      <Typography variant='caption'>{label}</Typography>\n      <div className={classes.itemKey} style={{ background: color }} />\n    </div>\n  )\n}\n\nColorKey.propTypes = {\n  /**\n   * Key label\n   */\n  label: PropTypes.string.isRequired,\n  /**\n   * Color of the key item\n   */\n  color: PropTypes.string.isRequired\n}\n","import React from 'react'\nimport { makeStyles, Typography } from '@material-ui/core'\nimport PropTypes from 'prop-types'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {},\n  keyRoot: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    marginRight: theme.spacing(5)\n  },\n  label: {\n    marginTop: 1,\n    marginLeft: theme.spacing(1)\n  }\n}))\n\nexport const IconKey = ({ label, icon }) => {\n  const classes = useStyles()\n  return (\n    <div className={classes.keyRoot}>\n      {icon}\n      <Typography className={classes.label} variant='caption'>\n        {label}\n      </Typography>\n    </div>\n  )\n}\n\nIconKey.propTypes = {\n  /**\n   * Key label\n   */\n  label: PropTypes.string.isRequired,\n  /**\n   * Icon for the key item\n   */\n  icon: PropTypes.string.isRequired\n}\n"],"mappings":";;;;;AAIA,MAAMA,cAAY,YAAY,WAAW;CACvC,MAAM,EAAE;CACR,SAAS;EACP,OAAO,MAAM,QAAQ,EAAE;EACvB,QAAQ,MAAM,QAAQ,GAAI;EAC1B,WAAW,MAAM,QAAQ,GAAI;EAC9B;CACD,SAAS;EACP,SAAS;EACT,gBAAgB;EAChB,aAAa,MAAM,QAAQ,EAAE;EAC7B,OAAO,MAAM,QAAQ,GAAG;EACzB;CACF,EAAE;AAEH,MAAa,YAAY,EAAE,OAAO,YAAY;CAC5C,MAAM,UAAUA,aAAW;AAC3B,QACE,oCAAC,SAAI,WAAW,QAAQ,WACtB,oCAAC,cAAW,SAAQ,aAAW,MAAmB,EAClD,oCAAC;EAAI,WAAW,QAAQ;EAAS,OAAO,EAAE,YAAY,OAAO;GAAI,CAC7D;;AAIV,SAAS,YAAY;CAInB,OAAO,UAAU,OAAO;CAIxB,OAAO,UAAU,OAAO;CACzB;;;;AClCD,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM,EAAE;CACR,SAAS;EACP,SAAS;EACT,gBAAgB;EAChB,aAAa,MAAM,QAAQ,EAAE;EAC9B;CACD,OAAO;EACL,WAAW;EACX,YAAY,MAAM,QAAQ,EAAE;EAC7B;CACF,EAAE;AAEH,MAAa,WAAW,EAAE,OAAO,WAAW;CAC1C,MAAM,UAAU,WAAW;AAC3B,QACE,oCAAC,SAAI,WAAW,QAAQ,WACrB,MACD,oCAAC;EAAW,WAAW,QAAQ;EAAO,SAAQ;IAC3C,MACU,CACT;;AAIV,QAAQ,YAAY;CAIlB,OAAO,UAAU,OAAO;CAIxB,MAAM,UAAU,OAAO;CACxB"}

package/dist/{LineAndSparklinesWidget-KVAnvpKl.js → LineAndSparklinesWidget-CUq3QxmN.js}

@@ -98,4 +98,4 @@ var LineAndSparklinesWidget_exports = /* @__PURE__ */ __export({
 
 //#endregion
 export { LineAndSparklinesWidget_default as n, layout as r, LineAndSparklinesWidget_exports as t };
-//# sourceMappingURL=LineAndSparklinesWidget-KVAnvpKl.js.map
+//# sourceMappingURL=LineAndSparklinesWidget-CUq3QxmN.js.map

package/dist/{LineAndSparklinesWidget-KVAnvpKl.js.map → LineAndSparklinesWidget-CUq3QxmN.js.map}

@@ -1 +1 @@
-{"version":3,"file":"LineAndSparklinesWidget-KVAnvpKl.js","names":["WidgetCard","FluentStatNumber"],"sources":["../src/UI/widgets/library/LineAndSparklinesWidget/LineAndSparklinesWidget.jsx","../src/UI/widgets/library/LineAndSparklinesWidget/index.ts"],"sourcesContent":["import React, { forwardRef } from 'react'\nimport {\n  makeStyles,\n  Typography,\n  useTheme,\n  Divider,\n  Box\n} from '@material-ui/core'\nimport { MuiVegaLite } from '@material-vega/material-ui'\nimport { Sparklines, SparklinesLine } from 'react-sparklines'\nimport WidgetCard from '../../WidgetCard'\nimport FluentStatNumber from '../../FluentComponents/molecules/FluentStatNumber'\nimport { convertISODate } from '../../utils/ConvertISODate'\n\nexport const layout = {\n  w: { default: 2, min: 0, max: 4 },\n  h: { default: 2, min: 0, max: 4 }\n}\n\n// export const params = {\n//   mode: {\n//     defaultValue: 'chart',\n//   },\n// };\n\nconst useStyles = makeStyles((theme) => ({\n  displayItems: {\n    display: 'flex',\n    flexDirection: 'row',\n    width: '100%'\n  },\n  visualCaption: {\n    marginTop: theme.spacing(-1)\n  },\n  lineGraph: {\n    width: '100%',\n    '& svg': { width: '100%' }\n  }\n}))\n\nconst LineAndSparklinesWidget = (props, ref) => {\n  const { children, params, setParam, ...other } = props\n  const { mockData, apiUrl, theme, dateRange } = params\n  const classes = useStyles()\n  const mainTheme = useTheme()\n\n  return (\n    <WidgetCard ref={ref} title={mockData?.title} theme={theme} {...other}>\n      {mockData ? (\n        <div>\n          {dateRange && (\n            <Typography gutterBottom variant='caption' component='h3'>\n              From: {convertISODate(dateRange.from)} to:{' '}\n              {convertISODate(dateRange.to)}\n            </Typography>\n          )}\n          <div className={classes.displayItems}>\n            <div>\n              <FluentStatNumber number={mockData?.value} trend='up' />\n            </div>\n            <div style={{ width: '100%' }}>\n              <Sparklines\n                data={mockData?.sparklinesData}\n                strokeWidth={1}\n                style={{ width: '100%', height: 45, marginTop: 10 }}\n              >\n                <SparklinesLine color={mainTheme.palette.secondary.main} />\n              </Sparklines>\n              <div className={classes.visualCaption}>\n                <div>\n                  <Divider />\n                </div>\n\n                <Typography variant='caption'>{mockData?.label}</Typography>\n              </div>\n            </div>\n          </div>\n\n          <Box clone flex={1} mt={1} overflow='hidden'>\n            <MuiVegaLite\n              variant='areaLineChart'\n              style={{\n                width: '100%'\n              }}\n              spec={{\n                $schema: 'https://vega.github.io/schema/vega-lite/v4.json',\n                height: 150,\n                data: { values: mockData?.data },\n                mark: 'area',\n                encoding: {\n                  x: {\n                    field: 'xAxis',\n                    type: mockData?.xAxisType\n                  },\n                  y: {\n                    aggregate: 'sum',\n                    field: 'yAxis',\n                    type: mockData?.yAxisType,\n                    scale: { domain: mockData?.domain || '' }\n                  }\n                }\n              }}\n              autoResize='true'\n              width='container'\n            />\n          </Box>\n          {children}\n        </div>\n      ) : (\n        <Typography variant='subtitle2'>\n          Could not retrieve widget data. Please contact support.\n        </Typography>\n      )}\n    </WidgetCard>\n  )\n}\n\nexport default forwardRef(LineAndSparklinesWidget)\n","export * from './LineAndSparklinesWidget';\nexport {default } from './LineAndSparklinesWidget';\n"],"mappings":";;;;;;;;;;AAcA,MAAa,SAAS;CACpB,GAAG;EAAE,SAAS;EAAG,KAAK;EAAG,KAAK;EAAG;CACjC,GAAG;EAAE,SAAS;EAAG,KAAK;EAAG,KAAK;EAAG;CAClC;AAQD,MAAM,YAAY,YAAY,WAAW;CACvC,cAAc;EACZ,SAAS;EACT,eAAe;EACf,OAAO;EACR;CACD,eAAe,EACb,WAAW,MAAM,QAAQ,GAAG,EAC7B;CACD,WAAW;EACT,OAAO;EACP,SAAS,EAAE,OAAO,QAAQ;EAC3B;CACF,EAAE;AAEH,MAAM,2BAA2B,OAAO,QAAQ;CAC9C,MAAM,EAAE,UAAU,QAAQ,UAAU,GAAG,UAAU;CACjD,MAAM,EAAE,UAAU,QAAQ,OAAO,cAAc;CAC/C,MAAM,UAAU,WAAW;CAC3B,MAAM,YAAY,UAAU;AAE5B,QACE,oCAACA;EAAgB;EAAK,OAAO,UAAU;EAAc;EAAO,GAAI;IAC7D,WACC,oCAAC,aACE,aACC,oCAAC;EAAW;EAAa,SAAQ;EAAU,WAAU;IAAK,UACjD,eAAe,UAAU,KAAK,EAAC,QAAK,KAC1C,eAAe,UAAU,GAAG,CAClB,EAEf,oCAAC,SAAI,WAAW,QAAQ,gBACtB,oCAAC,aACC,oCAACC;EAAiB,QAAQ,UAAU;EAAO,OAAM;GAAO,CACpD,EACN,oCAAC,SAAI,OAAO,EAAE,OAAO,QAAQ,IAC3B,oCAAC;EACC,MAAM,UAAU;EAChB,aAAa;EACb,OAAO;GAAE,OAAO;GAAQ,QAAQ;GAAI,WAAW;GAAI;IAEnD,oCAAC,kBAAe,OAAO,UAAU,QAAQ,UAAU,OAAQ,CAChD,EACb,oCAAC,SAAI,WAAW,QAAQ,iBACtB,oCAAC,aACC,oCAAC,cAAU,CACP,EAEN,oCAAC,cAAW,SAAQ,aAAW,UAAU,MAAmB,CACxD,CACF,CACF,EAEN,oCAAC;EAAI;EAAM,MAAM;EAAG,IAAI;EAAG,UAAS;IAClC,oCAAC;EACC,SAAQ;EACR,OAAO,EACL,OAAO,QACR;EACD,MAAM;GACJ,SAAS;GACT,QAAQ;GACR,MAAM,EAAE,QAAQ,UAAU,MAAM;GAChC,MAAM;GACN,UAAU;IACR,GAAG;KACD,OAAO;KACP,MAAM,UAAU;KACjB;IACD,GAAG;KACD,WAAW;KACX,OAAO;KACP,MAAM,UAAU;KAChB,OAAO,EAAE,QAAQ,UAAU,UAAU,IAAI;KAC1C;IACF;GACF;EACD,YAAW;EACX,OAAM;GACN,CACE,EACL,SACG,GAEN,oCAAC,cAAW,SAAQ,eAAY,0DAEnB,CAEJ;;AAIjB,sCAAe,WAAW,wBAAwB"}
+{"version":3,"file":"LineAndSparklinesWidget-CUq3QxmN.js","names":["WidgetCard","FluentStatNumber"],"sources":["../src/UI/widgets/library/LineAndSparklinesWidget/LineAndSparklinesWidget.jsx","../src/UI/widgets/library/LineAndSparklinesWidget/index.ts"],"sourcesContent":["import React, { forwardRef } from 'react'\nimport {\n  makeStyles,\n  Typography,\n  useTheme,\n  Divider,\n  Box\n} from '@material-ui/core'\nimport { MuiVegaLite } from '@material-vega/material-ui'\nimport { Sparklines, SparklinesLine } from 'react-sparklines'\nimport WidgetCard from '../../WidgetCard'\nimport FluentStatNumber from '../../FluentComponents/molecules/FluentStatNumber'\nimport { convertISODate } from '../../utils/ConvertISODate'\n\nexport const layout = {\n  w: { default: 2, min: 0, max: 4 },\n  h: { default: 2, min: 0, max: 4 }\n}\n\n// export const params = {\n//   mode: {\n//     defaultValue: 'chart',\n//   },\n// };\n\nconst useStyles = makeStyles((theme) => ({\n  displayItems: {\n    display: 'flex',\n    flexDirection: 'row',\n    width: '100%'\n  },\n  visualCaption: {\n    marginTop: theme.spacing(-1)\n  },\n  lineGraph: {\n    width: '100%',\n    '& svg': { width: '100%' }\n  }\n}))\n\nconst LineAndSparklinesWidget = (props, ref) => {\n  const { children, params, setParam, ...other } = props\n  const { mockData, apiUrl, theme, dateRange } = params\n  const classes = useStyles()\n  const mainTheme = useTheme()\n\n  return (\n    <WidgetCard ref={ref} title={mockData?.title} theme={theme} {...other}>\n      {mockData ? (\n        <div>\n          {dateRange && (\n            <Typography gutterBottom variant='caption' component='h3'>\n              From: {convertISODate(dateRange.from)} to:{' '}\n              {convertISODate(dateRange.to)}\n            </Typography>\n          )}\n          <div className={classes.displayItems}>\n            <div>\n              <FluentStatNumber number={mockData?.value} trend='up' />\n            </div>\n            <div style={{ width: '100%' }}>\n              <Sparklines\n                data={mockData?.sparklinesData}\n                strokeWidth={1}\n                style={{ width: '100%', height: 45, marginTop: 10 }}\n              >\n                <SparklinesLine color={mainTheme.palette.secondary.main} />\n              </Sparklines>\n              <div className={classes.visualCaption}>\n                <div>\n                  <Divider />\n                </div>\n\n                <Typography variant='caption'>{mockData?.label}</Typography>\n              </div>\n            </div>\n          </div>\n\n          <Box clone flex={1} mt={1} overflow='hidden'>\n            <MuiVegaLite\n              variant='areaLineChart'\n              style={{\n                width: '100%'\n              }}\n              spec={{\n                $schema: 'https://vega.github.io/schema/vega-lite/v4.json',\n                height: 150,\n                data: { values: mockData?.data },\n                mark: 'area',\n                encoding: {\n                  x: {\n                    field: 'xAxis',\n                    type: mockData?.xAxisType\n                  },\n                  y: {\n                    aggregate: 'sum',\n                    field: 'yAxis',\n                    type: mockData?.yAxisType,\n                    scale: { domain: mockData?.domain || '' }\n                  }\n                }\n              }}\n              autoResize='true'\n              width='container'\n            />\n          </Box>\n          {children}\n        </div>\n      ) : (\n        <Typography variant='subtitle2'>\n          Could not retrieve widget data. Please contact support.\n        </Typography>\n      )}\n    </WidgetCard>\n  )\n}\n\nexport default forwardRef(LineAndSparklinesWidget)\n","export * from './LineAndSparklinesWidget';\nexport {default } from './LineAndSparklinesWidget';\n"],"mappings":";;;;;;;;;;AAcA,MAAa,SAAS;CACpB,GAAG;EAAE,SAAS;EAAG,KAAK;EAAG,KAAK;EAAG;CACjC,GAAG;EAAE,SAAS;EAAG,KAAK;EAAG,KAAK;EAAG;CAClC;AAQD,MAAM,YAAY,YAAY,WAAW;CACvC,cAAc;EACZ,SAAS;EACT,eAAe;EACf,OAAO;EACR;CACD,eAAe,EACb,WAAW,MAAM,QAAQ,GAAG,EAC7B;CACD,WAAW;EACT,OAAO;EACP,SAAS,EAAE,OAAO,QAAQ;EAC3B;CACF,EAAE;AAEH,MAAM,2BAA2B,OAAO,QAAQ;CAC9C,MAAM,EAAE,UAAU,QAAQ,UAAU,GAAG,UAAU;CACjD,MAAM,EAAE,UAAU,QAAQ,OAAO,cAAc;CAC/C,MAAM,UAAU,WAAW;CAC3B,MAAM,YAAY,UAAU;AAE5B,QACE,oCAACA;EAAgB;EAAK,OAAO,UAAU;EAAc;EAAO,GAAI;IAC7D,WACC,oCAAC,aACE,aACC,oCAAC;EAAW;EAAa,SAAQ;EAAU,WAAU;IAAK,UACjD,eAAe,UAAU,KAAK,EAAC,QAAK,KAC1C,eAAe,UAAU,GAAG,CAClB,EAEf,oCAAC,SAAI,WAAW,QAAQ,gBACtB,oCAAC,aACC,oCAACC;EAAiB,QAAQ,UAAU;EAAO,OAAM;GAAO,CACpD,EACN,oCAAC,SAAI,OAAO,EAAE,OAAO,QAAQ,IAC3B,oCAAC;EACC,MAAM,UAAU;EAChB,aAAa;EACb,OAAO;GAAE,OAAO;GAAQ,QAAQ;GAAI,WAAW;GAAI;IAEnD,oCAAC,kBAAe,OAAO,UAAU,QAAQ,UAAU,OAAQ,CAChD,EACb,oCAAC,SAAI,WAAW,QAAQ,iBACtB,oCAAC,aACC,oCAAC,cAAU,CACP,EAEN,oCAAC,cAAW,SAAQ,aAAW,UAAU,MAAmB,CACxD,CACF,CACF,EAEN,oCAAC;EAAI;EAAM,MAAM;EAAG,IAAI;EAAG,UAAS;IAClC,oCAAC;EACC,SAAQ;EACR,OAAO,EACL,OAAO,QACR;EACD,MAAM;GACJ,SAAS;GACT,QAAQ;GACR,MAAM,EAAE,QAAQ,UAAU,MAAM;GAChC,MAAM;GACN,UAAU;IACR,GAAG;KACD,OAAO;KACP,MAAM,UAAU;KACjB;IACD,GAAG;KACD,WAAW;KACX,OAAO;KACP,MAAM,UAAU;KAChB,OAAO,EAAE,QAAQ,UAAU,UAAU,IAAI;KAC1C;IACF;GACF;EACD,YAAW;EACX,OAAM;GACN,CACE,EACL,SACG,GAEN,oCAAC,cAAW,SAAQ,eAAY,0DAEnB,CAEJ;;AAIjB,sCAAe,WAAW,wBAAwB"}

package/dist/{LineGraphWidget-CYjLiV5B.js → LineGraphWidget-DOwAVdTR.js}

@@ -89,4 +89,4 @@ var LineGraphWidget_exports = /* @__PURE__ */ __export({
 
 //#endregion
 export { params as i, LineGraphWidget_default as n, layout as r, LineGraphWidget_exports as t };
-//# sourceMappingURL=LineGraphWidget-CYjLiV5B.js.map
+//# sourceMappingURL=LineGraphWidget-DOwAVdTR.js.map

package/dist/{LineGraphWidget-CYjLiV5B.js.map → LineGraphWidget-DOwAVdTR.js.map}

@@ -1 +1 @@
-{"version":3,"file":"LineGraphWidget-CYjLiV5B.js","names":["params","WidgetCard","FluentStatsSnippet"],"sources":["../src/UI/widgets/library/LineGraphWidget/LineGraphWidget.jsx","../src/UI/widgets/library/LineGraphWidget/index.ts"],"sourcesContent":["import React, { forwardRef, Fragment } from 'react'\nimport { Grid, Box, Typography } from '@material-ui/core'\nimport { MuiVegaLite } from '@material-vega/material-ui'\nimport WidgetCard from '../../WidgetCard'\nimport FluentStatsSnippet from '../../FluentComponents/atoms/FluentStatsSnippet'\nimport { convertISODate } from '../../utils/ConvertISODate'\n\nexport const layout = {\n  w: { default: 2, min: 0, max: 4 },\n  h: { default: 2, min: 0, max: 4 }\n}\n\nexport const params = {\n  mode: {\n    defaultValue: 'chart'\n  }\n}\n\nconst LineGraphWidget = (props, ref) => {\n  const { children, params, setParam, ...other } = props\n  const { mockData, apiUrl, theme, dateRange } = params\n\n  return (\n    <WidgetCard ref={ref} {...other} title={mockData?.title} theme={theme}>\n      {mockData ? (\n        <Fragment>\n          {dateRange && (\n            <Typography gutterBottom variant='caption' component='h3'>\n              From: {convertISODate(dateRange.from)} to:{' '}\n              {convertISODate(dateRange.to)}{' '}\n            </Typography>\n          )}\n          {mockData?.stats && (\n            <Grid container>\n              {mockData?.stats.map((stat) => (\n                <Grid item xs={3} key={stat.label}>\n                  <FluentStatsSnippet\n                    label={stat.label}\n                    amount={stat.currentValue}\n                    prevAmount={stat.previousValue}\n                  />\n                </Grid>\n              ))}\n            </Grid>\n          )}\n          <Box clone flex={1} mt={1} overflow='hidden'>\n            <MuiVegaLite\n              variant='lineChart'\n              color='secondary'\n              spec={{\n                $schema: 'https://vega.github.io/schema/vega-lite/v4.json',\n                description: mockData?.description,\n                data: {\n                  values: mockData?.data\n                },\n                mark: 'line',\n                encoding: {\n                  x: { field: 'xAxis', type: mockData?.xAxisType },\n                  y: {\n                    field: 'yAxis',\n                    type: mockData?.yAxisType\n                  },\n                  color: {\n                    field: 'label',\n                    type: 'nominal',\n                    legend: { direction: 'vertical', orient: 'right' }\n                  }\n                }\n              }}\n              width='container'\n              height='container'\n              autoResize='true'\n            />\n          </Box>\n          {children}\n        </Fragment>\n      ) : (\n        <Typography variant='subtitle2'>\n          Could not retrieve widget data. Please contact support.\n        </Typography>\n      )}\n    </WidgetCard>\n  )\n}\n\nexport default forwardRef(LineGraphWidget)\n","export * from './LineGraphWidget';\nexport {default} from './LineGraphWidget';\n"],"mappings":";;;;;;;;;AAOA,MAAa,SAAS;CACpB,GAAG;EAAE,SAAS;EAAG,KAAK;EAAG,KAAK;EAAG;CACjC,GAAG;EAAE,SAAS;EAAG,KAAK;EAAG,KAAK;EAAG;CAClC;AAED,MAAa,SAAS,EACpB,MAAM,EACJ,cAAc,SACf,EACF;AAED,MAAM,mBAAmB,OAAO,QAAQ;CACtC,MAAM,EAAE,UAAU,kBAAQ,UAAU,GAAG,UAAU;CACjD,MAAM,EAAE,UAAU,QAAQ,OAAO,cAAcA;AAE/C,QACE,oCAACC;EAAgB;EAAK,GAAI;EAAO,OAAO,UAAU;EAAc;IAC7D,WACC,oCAAC,gBACE,aACC,oCAAC;EAAW;EAAa,SAAQ;EAAU,WAAU;IAAK,UACjD,eAAe,UAAU,KAAK,EAAC,QAAK,KAC1C,eAAe,UAAU,GAAG,EAAE,IACpB,EAEd,UAAU,SACT,oCAAC,QAAK,mBACH,UAAU,MAAM,KAAK,SACpB,oCAAC;EAAK;EAAK,IAAI;EAAG,KAAK,KAAK;IAC1B,oCAACC;EACC,OAAO,KAAK;EACZ,QAAQ,KAAK;EACb,YAAY,KAAK;GACjB,CACG,CACP,CACG,EAET,oCAAC;EAAI;EAAM,MAAM;EAAG,IAAI;EAAG,UAAS;IAClC,oCAAC;EACC,SAAQ;EACR,OAAM;EACN,MAAM;GACJ,SAAS;GACT,aAAa,UAAU;GACvB,MAAM,EACJ,QAAQ,UAAU,MACnB;GACD,MAAM;GACN,UAAU;IACR,GAAG;KAAE,OAAO;KAAS,MAAM,UAAU;KAAW;IAChD,GAAG;KACD,OAAO;KACP,MAAM,UAAU;KACjB;IACD,OAAO;KACL,OAAO;KACP,MAAM;KACN,QAAQ;MAAE,WAAW;MAAY,QAAQ;MAAS;KACnD;IACF;GACF;EACD,OAAM;EACN,QAAO;EACP,YAAW;GACX,CACE,EACL,SACQ,GAEX,oCAAC,cAAW,SAAQ,eAAY,0DAEnB,CAEJ;;AAIjB,8BAAe,WAAW,gBAAgB"}
+{"version":3,"file":"LineGraphWidget-DOwAVdTR.js","names":["params","WidgetCard","FluentStatsSnippet"],"sources":["../src/UI/widgets/library/LineGraphWidget/LineGraphWidget.jsx","../src/UI/widgets/library/LineGraphWidget/index.ts"],"sourcesContent":["import React, { forwardRef, Fragment } from 'react'\nimport { Grid, Box, Typography } from '@material-ui/core'\nimport { MuiVegaLite } from '@material-vega/material-ui'\nimport WidgetCard from '../../WidgetCard'\nimport FluentStatsSnippet from '../../FluentComponents/atoms/FluentStatsSnippet'\nimport { convertISODate } from '../../utils/ConvertISODate'\n\nexport const layout = {\n  w: { default: 2, min: 0, max: 4 },\n  h: { default: 2, min: 0, max: 4 }\n}\n\nexport const params = {\n  mode: {\n    defaultValue: 'chart'\n  }\n}\n\nconst LineGraphWidget = (props, ref) => {\n  const { children, params, setParam, ...other } = props\n  const { mockData, apiUrl, theme, dateRange } = params\n\n  return (\n    <WidgetCard ref={ref} {...other} title={mockData?.title} theme={theme}>\n      {mockData ? (\n        <Fragment>\n          {dateRange && (\n            <Typography gutterBottom variant='caption' component='h3'>\n              From: {convertISODate(dateRange.from)} to:{' '}\n              {convertISODate(dateRange.to)}{' '}\n            </Typography>\n          )}\n          {mockData?.stats && (\n            <Grid container>\n              {mockData?.stats.map((stat) => (\n                <Grid item xs={3} key={stat.label}>\n                  <FluentStatsSnippet\n                    label={stat.label}\n                    amount={stat.currentValue}\n                    prevAmount={stat.previousValue}\n                  />\n                </Grid>\n              ))}\n            </Grid>\n          )}\n          <Box clone flex={1} mt={1} overflow='hidden'>\n            <MuiVegaLite\n              variant='lineChart'\n              color='secondary'\n              spec={{\n                $schema: 'https://vega.github.io/schema/vega-lite/v4.json',\n                description: mockData?.description,\n                data: {\n                  values: mockData?.data\n                },\n                mark: 'line',\n                encoding: {\n                  x: { field: 'xAxis', type: mockData?.xAxisType },\n                  y: {\n                    field: 'yAxis',\n                    type: mockData?.yAxisType\n                  },\n                  color: {\n                    field: 'label',\n                    type: 'nominal',\n                    legend: { direction: 'vertical', orient: 'right' }\n                  }\n                }\n              }}\n              width='container'\n              height='container'\n              autoResize='true'\n            />\n          </Box>\n          {children}\n        </Fragment>\n      ) : (\n        <Typography variant='subtitle2'>\n          Could not retrieve widget data. Please contact support.\n        </Typography>\n      )}\n    </WidgetCard>\n  )\n}\n\nexport default forwardRef(LineGraphWidget)\n","export * from './LineGraphWidget';\nexport {default} from './LineGraphWidget';\n"],"mappings":";;;;;;;;;AAOA,MAAa,SAAS;CACpB,GAAG;EAAE,SAAS;EAAG,KAAK;EAAG,KAAK;EAAG;CACjC,GAAG;EAAE,SAAS;EAAG,KAAK;EAAG,KAAK;EAAG;CAClC;AAED,MAAa,SAAS,EACpB,MAAM,EACJ,cAAc,SACf,EACF;AAED,MAAM,mBAAmB,OAAO,QAAQ;CACtC,MAAM,EAAE,UAAU,kBAAQ,UAAU,GAAG,UAAU;CACjD,MAAM,EAAE,UAAU,QAAQ,OAAO,cAAcA;AAE/C,QACE,oCAACC;EAAgB;EAAK,GAAI;EAAO,OAAO,UAAU;EAAc;IAC7D,WACC,oCAAC,gBACE,aACC,oCAAC;EAAW;EAAa,SAAQ;EAAU,WAAU;IAAK,UACjD,eAAe,UAAU,KAAK,EAAC,QAAK,KAC1C,eAAe,UAAU,GAAG,EAAE,IACpB,EAEd,UAAU,SACT,oCAAC,QAAK,mBACH,UAAU,MAAM,KAAK,SACpB,oCAAC;EAAK;EAAK,IAAI;EAAG,KAAK,KAAK;IAC1B,oCAACC;EACC,OAAO,KAAK;EACZ,QAAQ,KAAK;EACb,YAAY,KAAK;GACjB,CACG,CACP,CACG,EAET,oCAAC;EAAI;EAAM,MAAM;EAAG,IAAI;EAAG,UAAS;IAClC,oCAAC;EACC,SAAQ;EACR,OAAM;EACN,MAAM;GACJ,SAAS;GACT,aAAa,UAAU;GACvB,MAAM,EACJ,QAAQ,UAAU,MACnB;GACD,MAAM;GACN,UAAU;IACR,GAAG;KAAE,OAAO;KAAS,MAAM,UAAU;KAAW;IAChD,GAAG;KACD,OAAO;KACP,MAAM,UAAU;KACjB;IACD,OAAO;KACL,OAAO;KACP,MAAM;KACN,QAAQ;MAAE,WAAW;MAAY,QAAQ;MAAS;KACnD;IACF;GACF;EACD,OAAM;EACN,QAAO;EACP,YAAW;GACX,CACE,EACL,SACQ,GAEX,oCAAC,cAAW,SAAQ,eAAY,0DAEnB,CAEJ;;AAIjB,8BAAe,WAAW,gBAAgB"}

package/dist/MenuPage-DP1ATpru.js

@@ -0,0 +1,3 @@
+import { t as MenuPage_default } from "./MenuPage-fqEs3MSY.js";
+
+export { MenuPage_default as default };

package/dist/{MenuPage-BS8ti9lx.js → MenuPage-fqEs3MSY.js}

@@ -9,7 +9,7 @@ import { t as PageContainer } from "./PageContainer-DTXNLt_2.js";
 import { n as useBuildEnvironment, t as APP_RIBBON_SPACE } from "./useBuildEnvironment-2gdqpmBX.js";
 import { t as NodeLoader } from "./NodeLoader-6vxxLuHg.js";
 import { t as UtilitySideBar } from "./UtilitySideBar-wvrocDGI.js";
-import { t as BaseTreeMenu } from "./BaseTreeMenu-nKjw3cil.js";
+import { t as BaseTreeMenu } from "./BaseTreeMenu-CBFIl0VF.js";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { makeStyles } from "@material-ui/core";
 import { Prompt, useHistory, useLocation } from "react-router-dom";
@@ -237,4 +237,4 @@ var MenuPage_default = MenuPage;
 
 //#endregion
 export { MenuPage_default as t };
-//# sourceMappingURL=MenuPage-BS8ti9lx.js.map
+//# sourceMappingURL=MenuPage-fqEs3MSY.js.map

package/dist/{MenuPage-BS8ti9lx.js.map → MenuPage-fqEs3MSY.js.map}

@@ -1 +1 @@
-{"version":3,"file":"MenuPage-BS8ti9lx.js","names":[],"sources":["../src/menuPage/MenuPage.jsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { useHistory, useLocation, Prompt } from 'react-router-dom';\nimport { useAxiosGet } from '../utilities/useAxiosGet';\nimport { UtilitySideBar } from '../UI/utilityDisplay/UtilitySideBar';\nimport { makeStyles } from '@material-ui/core';\nimport { PageContainer } from '../page/PageContainer';\nimport { transformMenuPageTree } from '../utilities/tree/TreeUtilities';\nimport { BaseTreeMenu } from '../treeMenu/BaseTreeMenu';\nimport { TreeViewModeEnums } from '../enums/unitySystemEnums';\nimport { DndProvider } from 'react-dnd';\nimport { HTML5Backend } from 'react-dnd-html5-backend';\nimport { useUser } from '../utilities/auth/useUser';\nimport { useShellStore } from '../stores/shellStore';\nimport { NodeLoader } from '../UI/feedback/NodeLoader';\nimport {\n  APP_RIBBON_SPACE,\n  useBuildEnvironment\n} from '../shell/ui/useBuildEnvironment';\nimport { useSetLocationState } from '../hooks/useSetLocationState';\nimport { useTranslation } from 'react-i18next';\nimport { ConfigService } from '../configService';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    flex: 1,\n    minHeight: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 56}px)`,\n    display: 'grid',\n    gridTemplateAreas: ['sidebar content'].map((line) => `\"${line}\"`).join(' '),\n    gridTemplateColumns: 'auto 1fr',\n    gridTemplateRows: 'auto 1fr'\n  },\n  sidebar: {\n    gridArea: 'sidebar',\n    marginRight: theme.spacing(1)\n  },\n  content: {\n    gridArea: 'content',\n    display: 'flex',\n    flexDirection: 'column',\n    position: 'relative',\n    zIndex: 1,\n    height: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 56}px)`,\n    overflowY: 'auto'\n  },\n  menuContent: {\n    marginTop: theme.spacing(1),\n    height: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 116}px)`,\n    overflowX: 'hidden'\n  },\n  loader: {\n    marginRight: theme.spacing(1),\n    marginLeft: theme.spacing(1)\n  },\n  loadingContent: {\n    flex: 1,\n    display: 'flex',\n    flexDirection: 'column',\n    alignItems: 'center',\n    justifyContent: 'center'\n  }\n}));\n\n// Define a stable constant for empty headers to prevent useEffect loops\nconst EMPTY_HEADERS = {};\n\n// Helper to find a node deep in the tree (Moved outside to ensure stability)\nconst findNodeById = (nodes, id) => {\n  if (!nodes || !id) return null;\n  for (const node of nodes) {\n    if (String(node.id) === String(id)) return node;\n    if (node.children) {\n      const found = findNodeById(node.children, id);\n      if (found) return found;\n    }\n  }\n  return null;\n};\n\nconst MenuPage = (props) => {\n  const buildEnv = useBuildEnvironment();\n  const classes = useStyles({\n    ...props,\n    appRibbonSpace: buildEnv ? APP_RIBBON_SPACE : 0\n  });\n  const history = useHistory();\n  const location = useLocation();\n  const user = useUser();\n  const { t } = useTranslation();\n  const setLocationState = useSetLocationState();\n\n  const {\n    innerMenuOverride,\n    mainContent,\n    menuTitle,\n    allowMissingPageParam = false,\n    searchParamsTransformer\n  } = props;\n\n  // --- STATE ---\n  const [sidebarExpanded, setSidebarExpanded] = useState(true);\n  const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);\n  const { setSubHeaderActionHasChildren, setNavigationExpanded } = useShellStore();\n\n  // --- DATA FETCHING ---\n  const innerMenuId = location.pathname.replace('/menupage/', '');\n\n  const [{ data: fetchedInnerMenu, loading: menuLoading }] = useAxiosGet(\n    ConfigService.tenantV1ApiUrl,\n    `menus/${innerMenuId}`,\n    EMPTY_HEADERS,\n    !innerMenuId,\n    false\n  );\n\n  const innerMenu = innerMenuOverride ?? fetchedInnerMenu;\n\n  // --- MEMOIZED DATA ---\n  const menuItemsList = useMemo(() => {\n    if (!innerMenu) return [];\n\n    return innerMenu.menuItemInstanceStructureViews?.reduce((acc, menuInstance) => {\n      const updatedMenu = transformMenuPageTree(menuInstance);\n      if (updatedMenu) acc.push(updatedMenu);\n      return acc;\n    }, []) ?? [];\n  }, [innerMenu]);\n\n  // --- CORE REFACTOR: DERIVE SELECTED NODE ---\n  const pageId = new URLSearchParams(location.search).get('page');\n\n  const selectedNode = useMemo(() => {\n    if (!menuItemsList.length) return null;\n\n    // 1. Try to find the node requested in URL\n    const found = findNodeById(menuItemsList, pageId);\n    if (found) return found;\n\n    // 2. Default to first item\n    // Even if allowMissingPageParam is true, we still want to RETURN the node for rendering,\n    // we just don't want the Redirector useEffect to force it into the URL.\n    return menuItemsList[0];\n  }, [menuItemsList, pageId]);\n\n  // Fetch Page Data based on the derived node\n  const [{ data: pageData, loading: pageLoading }] = useAxiosGet(\n    ConfigService.tenantV1ApiUrl,\n    `page/${selectedNode?.properties?.page?.id}`,\n    EMPTY_HEADERS,\n    !selectedNode?.properties?.page?.id,\n    false\n  );\n\n  // --- ACTIONS ---\n\n  const buildSearchString = useCallback((params, node, menuIndex) => {\n    if (typeof searchParamsTransformer === 'function') {\n      const result = searchParamsTransformer({\n        searchParams: params,\n        node,\n        menuIndex,\n        location\n      });\n      if (result === null) return '';\n      if (result instanceof URLSearchParams) return result.toString();\n      if (typeof result === 'string') return result;\n      if (result !== undefined) return String(result);\n    }\n    return params.toString();\n  }, [location, searchParamsTransformer]);\n\n  const handleSelectedNode = useCallback((node, menuIndex) => {\n    // 1. Check if we are \"selecting\" the current node to clear query params if needed\n    if (allowMissingPageParam) {\n      const firstNode = menuItemsList?.[0];\n      if (firstNode && String(node?.id) === String(firstNode.id)) {\n        if (location.search) {\n          history.replace({ pathname: location.pathname, search: '' });\n        }\n        setHasUnsavedChanges(false);\n        return;\n      }\n    }\n\n    // 2. Build URL\n    const searchParams = new URLSearchParams(location.search);\n    searchParams.set('page', node.id);\n    const searchString = buildSearchString(searchParams, node, menuIndex);\n\n    // 3. Navigate (The URL change will trigger the re-render & selectedNode update)\n    history.push({\n      pathname: location.pathname,\n      search: searchString\n    });\n\n    // Note: We don't set 'selectedNode' manually anymore. It is derived.\n  }, [history, location, allowMissingPageParam, menuItemsList, buildSearchString]);\n\n  const handleSidebarExpandClick = useCallback(() => {\n    setSidebarExpanded((expanded) => !expanded);\n  }, []);\n\n  const handleDropNode = useCallback(() => {\n    // TODO: Implement if we need to for next Phase\n  }, []);\n\n  // --- EFFECTS ---\n\n  // 1. URL SYNCHRONIZATION (The \"Redirector\")\n  // Ensures URL matches the selected node (e.g. on initial load or default selection)\n  useEffect(() => {\n    if (selectedNode && !allowMissingPageParam) {\n      const currentUrlId = new URLSearchParams(location.search).get('page');\n\n      if (String(selectedNode.id) !== String(currentUrlId)) {\n        const newParams = new URLSearchParams(location.search);\n        newParams.set('page', selectedNode.id);\n\n        history.replace({\n          pathname: location.pathname,\n          search: newParams.toString()\n        });\n      }\n    }\n  }, [selectedNode?.id, location.search, history, allowMissingPageParam]);\n\n  // 2. UI CLEANUP (The \"Reactor\")\n  // Runs only when the ACTUAL selected ID changes to reset UI state\n  useEffect(() => {\n    if (selectedNode?.id) {\n      setNavigationExpanded(false);\n      setHasUnsavedChanges(false);\n      setSubHeaderActionHasChildren(false);\n    }\n  }, [selectedNode?.id, setNavigationExpanded, setSubHeaderActionHasChildren]);\n\n  // 3. BREADCRUMB / LABEL SYNC\n  useEffect(() => {\n    if (innerMenu && location.state?.label !== t(innerMenu?.name)) {\n      setLocationState({ label: t(innerMenu?.name) });\n    }\n  }, [setLocationState, t, innerMenu, location.state?.label]);\n\n\n  // --- RENDER ---\n  return (\n    <DndProvider backend={HTML5Backend}>\n      <Prompt\n        when={hasUnsavedChanges}\n        message='You have unsaved changes. Are you sure you want to leave this page?'\n      />\n      <div className={classes.root}>\n        <div className={classes.sidebar}>\n          <UtilitySideBar\n            title={innerMenu?.name || menuTitle}\n            isUsingChildren={true}\n            resizable={true}\n            removePadding={true}\n            removeTopLayoutUnit={true}\n            onUtilitySidebarToggleExpandClick={handleSidebarExpandClick}\n            collapsedWidth={64}\n          >\n            <div className={classes.menuContent} key={innerMenuId}>\n              {menuItemsList?.length > 0 && !menuLoading &&\n                menuItemsList.map((menuItems, index) => (\n                  <div key={menuItems.id} className={classes.nodeContainer}>\n                    <BaseTreeMenu\n                      menuItems={menuItems}\n                      onSelectNode={handleSelectedNode}\n                      onDropNode={handleDropNode}\n                      menuIndex={index}\n                      selectedNodeId={selectedNode?.id}\n                      selectedNodeParentId={selectedNode?.parentId}\n                      sidebarExpanded={sidebarExpanded}\n                      treeViewMode={TreeViewModeEnums.Classic}\n                    />\n                  </div>\n                ))}\n              {menuLoading && (\n                <div className={classes.loader}>\n                  <NodeLoader loading={menuLoading} />\n                </div>\n              )}\n            </div>\n          </UtilitySideBar>\n        </div>\n        <div className={classes.content}>\n          {mainContent ? (\n            typeof mainContent === 'function'\n              ? mainContent({ selectedNode, menuItemsList })\n              : mainContent\n          ) : (\n            selectedNode?.properties?.page?.id && (\n              <PageContainer\n                user={user}\n                key={selectedNode?.id}\n                pageData={pageData}\n                pageLoading={pageLoading}\n                widgetParams={{\n                  pageId: pageData?.pageId,\n                  entityName: selectedNode?.properties?.page?.entity?.entityName,\n                  pbiReportCode: selectedNode?.properties?.page?.pbiReportCode,\n                  requiredFieldsMap: selectedNode?.properties?.page?.requiredFieldMapping,\n                  udpTagId: selectedNode?.properties?.page?.udpTagId,\n                  queryId: selectedNode?.properties?.page?.queryId,\n                  inquiryTreeId: selectedNode?.properties?.page?.inquiryTreeId,\n                  setHasUnsavedChanges: setHasUnsavedChanges\n                }}\n                disableMargins={true}\n                fromMenu={true}\n              />\n            )\n          )}\n        </div>\n      </div>\n    </DndProvider>\n  );\n};\n\nexport default MenuPage;\n"],"mappings":"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"}
+{"version":3,"file":"MenuPage-fqEs3MSY.js","names":[],"sources":["../src/menuPage/MenuPage.jsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { useHistory, useLocation, Prompt } from 'react-router-dom';\nimport { useAxiosGet } from '../utilities/useAxiosGet';\nimport { UtilitySideBar } from '../UI/utilityDisplay/UtilitySideBar';\nimport { makeStyles } from '@material-ui/core';\nimport { PageContainer } from '../page/PageContainer';\nimport { transformMenuPageTree } from '../utilities/tree/TreeUtilities';\nimport { BaseTreeMenu } from '../treeMenu/BaseTreeMenu';\nimport { TreeViewModeEnums } from '../enums/unitySystemEnums';\nimport { DndProvider } from 'react-dnd';\nimport { HTML5Backend } from 'react-dnd-html5-backend';\nimport { useUser } from '../utilities/auth/useUser';\nimport { useShellStore } from '../stores/shellStore';\nimport { NodeLoader } from '../UI/feedback/NodeLoader';\nimport {\n  APP_RIBBON_SPACE,\n  useBuildEnvironment\n} from '../shell/ui/useBuildEnvironment';\nimport { useSetLocationState } from '../hooks/useSetLocationState';\nimport { useTranslation } from 'react-i18next';\nimport { ConfigService } from '../configService';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    flex: 1,\n    minHeight: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 56}px)`,\n    display: 'grid',\n    gridTemplateAreas: ['sidebar content'].map((line) => `\"${line}\"`).join(' '),\n    gridTemplateColumns: 'auto 1fr',\n    gridTemplateRows: 'auto 1fr'\n  },\n  sidebar: {\n    gridArea: 'sidebar',\n    marginRight: theme.spacing(1)\n  },\n  content: {\n    gridArea: 'content',\n    display: 'flex',\n    flexDirection: 'column',\n    position: 'relative',\n    zIndex: 1,\n    height: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 56}px)`,\n    overflowY: 'auto'\n  },\n  menuContent: {\n    marginTop: theme.spacing(1),\n    height: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 116}px)`,\n    overflowX: 'hidden'\n  },\n  loader: {\n    marginRight: theme.spacing(1),\n    marginLeft: theme.spacing(1)\n  },\n  loadingContent: {\n    flex: 1,\n    display: 'flex',\n    flexDirection: 'column',\n    alignItems: 'center',\n    justifyContent: 'center'\n  }\n}));\n\n// Define a stable constant for empty headers to prevent useEffect loops\nconst EMPTY_HEADERS = {};\n\n// Helper to find a node deep in the tree (Moved outside to ensure stability)\nconst findNodeById = (nodes, id) => {\n  if (!nodes || !id) return null;\n  for (const node of nodes) {\n    if (String(node.id) === String(id)) return node;\n    if (node.children) {\n      const found = findNodeById(node.children, id);\n      if (found) return found;\n    }\n  }\n  return null;\n};\n\nconst MenuPage = (props) => {\n  const buildEnv = useBuildEnvironment();\n  const classes = useStyles({\n    ...props,\n    appRibbonSpace: buildEnv ? APP_RIBBON_SPACE : 0\n  });\n  const history = useHistory();\n  const location = useLocation();\n  const user = useUser();\n  const { t } = useTranslation();\n  const setLocationState = useSetLocationState();\n\n  const {\n    innerMenuOverride,\n    mainContent,\n    menuTitle,\n    allowMissingPageParam = false,\n    searchParamsTransformer\n  } = props;\n\n  // --- STATE ---\n  const [sidebarExpanded, setSidebarExpanded] = useState(true);\n  const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);\n  const { setSubHeaderActionHasChildren, setNavigationExpanded } = useShellStore();\n\n  // --- DATA FETCHING ---\n  const innerMenuId = location.pathname.replace('/menupage/', '');\n\n  const [{ data: fetchedInnerMenu, loading: menuLoading }] = useAxiosGet(\n    ConfigService.tenantV1ApiUrl,\n    `menus/${innerMenuId}`,\n    EMPTY_HEADERS,\n    !innerMenuId,\n    false\n  );\n\n  const innerMenu = innerMenuOverride ?? fetchedInnerMenu;\n\n  // --- MEMOIZED DATA ---\n  const menuItemsList = useMemo(() => {\n    if (!innerMenu) return [];\n\n    return innerMenu.menuItemInstanceStructureViews?.reduce((acc, menuInstance) => {\n      const updatedMenu = transformMenuPageTree(menuInstance);\n      if (updatedMenu) acc.push(updatedMenu);\n      return acc;\n    }, []) ?? [];\n  }, [innerMenu]);\n\n  // --- CORE REFACTOR: DERIVE SELECTED NODE ---\n  const pageId = new URLSearchParams(location.search).get('page');\n\n  const selectedNode = useMemo(() => {\n    if (!menuItemsList.length) return null;\n\n    // 1. Try to find the node requested in URL\n    const found = findNodeById(menuItemsList, pageId);\n    if (found) return found;\n\n    // 2. Default to first item\n    // Even if allowMissingPageParam is true, we still want to RETURN the node for rendering,\n    // we just don't want the Redirector useEffect to force it into the URL.\n    return menuItemsList[0];\n  }, [menuItemsList, pageId]);\n\n  // Fetch Page Data based on the derived node\n  const [{ data: pageData, loading: pageLoading }] = useAxiosGet(\n    ConfigService.tenantV1ApiUrl,\n    `page/${selectedNode?.properties?.page?.id}`,\n    EMPTY_HEADERS,\n    !selectedNode?.properties?.page?.id,\n    false\n  );\n\n  // --- ACTIONS ---\n\n  const buildSearchString = useCallback((params, node, menuIndex) => {\n    if (typeof searchParamsTransformer === 'function') {\n      const result = searchParamsTransformer({\n        searchParams: params,\n        node,\n        menuIndex,\n        location\n      });\n      if (result === null) return '';\n      if (result instanceof URLSearchParams) return result.toString();\n      if (typeof result === 'string') return result;\n      if (result !== undefined) return String(result);\n    }\n    return params.toString();\n  }, [location, searchParamsTransformer]);\n\n  const handleSelectedNode = useCallback((node, menuIndex) => {\n    // 1. Check if we are \"selecting\" the current node to clear query params if needed\n    if (allowMissingPageParam) {\n      const firstNode = menuItemsList?.[0];\n      if (firstNode && String(node?.id) === String(firstNode.id)) {\n        if (location.search) {\n          history.replace({ pathname: location.pathname, search: '' });\n        }\n        setHasUnsavedChanges(false);\n        return;\n      }\n    }\n\n    // 2. Build URL\n    const searchParams = new URLSearchParams(location.search);\n    searchParams.set('page', node.id);\n    const searchString = buildSearchString(searchParams, node, menuIndex);\n\n    // 3. Navigate (The URL change will trigger the re-render & selectedNode update)\n    history.push({\n      pathname: location.pathname,\n      search: searchString\n    });\n\n    // Note: We don't set 'selectedNode' manually anymore. It is derived.\n  }, [history, location, allowMissingPageParam, menuItemsList, buildSearchString]);\n\n  const handleSidebarExpandClick = useCallback(() => {\n    setSidebarExpanded((expanded) => !expanded);\n  }, []);\n\n  const handleDropNode = useCallback(() => {\n    // TODO: Implement if we need to for next Phase\n  }, []);\n\n  // --- EFFECTS ---\n\n  // 1. URL SYNCHRONIZATION (The \"Redirector\")\n  // Ensures URL matches the selected node (e.g. on initial load or default selection)\n  useEffect(() => {\n    if (selectedNode && !allowMissingPageParam) {\n      const currentUrlId = new URLSearchParams(location.search).get('page');\n\n      if (String(selectedNode.id) !== String(currentUrlId)) {\n        const newParams = new URLSearchParams(location.search);\n        newParams.set('page', selectedNode.id);\n\n        history.replace({\n          pathname: location.pathname,\n          search: newParams.toString()\n        });\n      }\n    }\n  }, [selectedNode?.id, location.search, history, allowMissingPageParam]);\n\n  // 2. UI CLEANUP (The \"Reactor\")\n  // Runs only when the ACTUAL selected ID changes to reset UI state\n  useEffect(() => {\n    if (selectedNode?.id) {\n      setNavigationExpanded(false);\n      setHasUnsavedChanges(false);\n      setSubHeaderActionHasChildren(false);\n    }\n  }, [selectedNode?.id, setNavigationExpanded, setSubHeaderActionHasChildren]);\n\n  // 3. BREADCRUMB / LABEL SYNC\n  useEffect(() => {\n    if (innerMenu && location.state?.label !== t(innerMenu?.name)) {\n      setLocationState({ label: t(innerMenu?.name) });\n    }\n  }, [setLocationState, t, innerMenu, location.state?.label]);\n\n\n  // --- RENDER ---\n  return (\n    <DndProvider backend={HTML5Backend}>\n      <Prompt\n        when={hasUnsavedChanges}\n        message='You have unsaved changes. Are you sure you want to leave this page?'\n      />\n      <div className={classes.root}>\n        <div className={classes.sidebar}>\n          <UtilitySideBar\n            title={innerMenu?.name || menuTitle}\n            isUsingChildren={true}\n            resizable={true}\n            removePadding={true}\n            removeTopLayoutUnit={true}\n            onUtilitySidebarToggleExpandClick={handleSidebarExpandClick}\n            collapsedWidth={64}\n          >\n            <div className={classes.menuContent} key={innerMenuId}>\n              {menuItemsList?.length > 0 && !menuLoading &&\n                menuItemsList.map((menuItems, index) => (\n                  <div key={menuItems.id} className={classes.nodeContainer}>\n                    <BaseTreeMenu\n                      menuItems={menuItems}\n                      onSelectNode={handleSelectedNode}\n                      onDropNode={handleDropNode}\n                      menuIndex={index}\n                      selectedNodeId={selectedNode?.id}\n                      selectedNodeParentId={selectedNode?.parentId}\n                      sidebarExpanded={sidebarExpanded}\n                      treeViewMode={TreeViewModeEnums.Classic}\n                    />\n                  </div>\n                ))}\n              {menuLoading && (\n                <div className={classes.loader}>\n                  <NodeLoader loading={menuLoading} />\n                </div>\n              )}\n            </div>\n          </UtilitySideBar>\n        </div>\n        <div className={classes.content}>\n          {mainContent ? (\n            typeof mainContent === 'function'\n              ? mainContent({ selectedNode, menuItemsList })\n              : mainContent\n          ) : (\n            selectedNode?.properties?.page?.id && (\n              <PageContainer\n                user={user}\n                key={selectedNode?.id}\n                pageData={pageData}\n                pageLoading={pageLoading}\n                widgetParams={{\n                  pageId: pageData?.pageId,\n                  entityName: selectedNode?.properties?.page?.entity?.entityName,\n                  pbiReportCode: selectedNode?.properties?.page?.pbiReportCode,\n                  requiredFieldsMap: selectedNode?.properties?.page?.requiredFieldMapping,\n                  udpTagId: selectedNode?.properties?.page?.udpTagId,\n                  queryId: selectedNode?.properties?.page?.queryId,\n                  inquiryTreeId: selectedNode?.properties?.page?.inquiryTreeId,\n                  setHasUnsavedChanges: setHasUnsavedChanges\n                }}\n                disableMargins={true}\n                fromMenu={true}\n              />\n            )\n          )}\n        </div>\n      </div>\n    </DndProvider>\n  );\n};\n\nexport default MenuPage;\n"],"mappings":"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"}

package/dist/{MyExportsPage-BwcVZASe.js → MyExportsPage-DMcJRz8T.js}

@@ -10,7 +10,7 @@ import { t as TableContainer } from "./TableContainer-CcHjtMCa.js";
 import { t as AmbientAutoComplete } from "./AmbientAutoComplete-TYJ_JlO5.js";
 import { t as AmbientAlert } from "./AmbientAlert-DcYkGCUm.js";
 import { t as EmptyStateDisplay } from "./EmptyStateDisplay-YOwCw38_.js";
-import { t as StatusCellRenderer } from "./StatusCellRenderer-BuPuvngw.js";
+import { t as StatusCellRenderer } from "./StatusCellRenderer-E7SYy9Qk.js";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { DownloadIcon, ErrorIcon, StatusCircleCheckmarkIcon } from "@fluentui/react-icons";
 
@@ -213,4 +213,4 @@ var MyExportsPage_default = MyExportsPage;
 
 //#endregion
 export { MyExportsPage_default as n, MyExportsPage as t };
-//# sourceMappingURL=MyExportsPage-BwcVZASe.js.map
+//# sourceMappingURL=MyExportsPage-DMcJRz8T.js.map

package/dist/{MyExportsPage-BwcVZASe.js.map → MyExportsPage-DMcJRz8T.js.map}

@@ -1 +1 @@
-{"version":3,"file":"MyExportsPage-BwcVZASe.js","names":[],"sources":["../src/udp/export/MyExportsPage.jsx"],"sourcesContent":["import React, { useMemo, useState, useCallback, useEffect } from 'react';\nimport {\n  StatusCircleCheckmarkIcon,\n  ErrorIcon,\n  DownloadIcon\n} from '@fluentui/react-icons';\nimport { getSanitizedName } from '../../utilities/entities/entityUtilities';\nimport { FluentDialog } from '../../UI/feedback/FluentDialog';\nimport { EmptyStateDisplay } from '../../UI/dataDisplay/EmptyStateDisplay';\nimport { useAxiosGet } from '../../utilities/useAxiosGet';\nimport { ActionsRenderer } from '../../UI/templates/ui/renderers/ActionsRenderer';\nimport { AmbientAlert } from '../../UI/feedback/AmbientAlert';\nimport { TableContainer } from '../../maintenanceEngine/tableBrowser/TableContainer';\nimport { StatusCellRenderer } from '../../UI/templates/ui/renderers/StatusCellRenderer';\nimport { useUser } from '../../utilities/auth/useUser';\nimport { AmbientAutoComplete } from '../../UI/inputs/textField/AmbientAutoComplete';\nimport { executeQueryWithParameters } from '../utilities/methodUtils';\nimport { useHandleAxiosSnackbar } from '../../utilities/apiHelpers';\nimport { ConfigService } from '../../configService';\n\nexport const MyExportsPage = (props) => {\n  const { productId } = props;\n  const user = useUser();\n  const [product, setProduct] = useState();\n  const [downloadLinkLoading, setDownloadLinkLoading] = useState(false);\n  const [fileResultData, setFileResultData] = useState();\n  const [downloadOpen, setDownloadOpen] = useState(false);\n  const [noDownloadMethod, setNoDownloadMethod] = useState(false);\n\n  const { handleErrorSnackbar, handleSuccessSnackbar } =\n    useHandleAxiosSnackbar();\n\n  const [{ data: products, loading: productsLoading }] = useAxiosGet(\n    ConfigService.tenantV2ApiUrl,\n    `tenant/products?tenantId=${user?.currentTenantId}&isSubscribable=${!user\n      ?.can?.CAN_MANAGE_CATALOGS_FOR_UNSUBSCRIBABLE_PRODUCTS}`,\n    {},\n    !user\n  );\n\n  const [{ data: apiCatalog, loading: catalogLoading, error: catalogError }] =\n    useAxiosGet(\n      ConfigService.integrationV1ApiUrl,\n      `tenantProductApiCatalogBase/tenant/${user?.currentTenantId}/product/${\n        productId ? productId : product?.productId\n      }`,\n      {},\n      !(product || productId),\n      false\n    );\n\n  const [{ data: udpJobEntity, loading: jobEntityLoading }] = useAxiosGet(\n    ConfigService.integrationV1ApiUrl,\n    `apicatalog/${apiCatalog?.apiCatalogId}/promotedMethodEntities/udpJob/product/${apiCatalog?.productId}?compareSanitizedName=true`,\n    {},\n    !apiCatalog?.productId || !apiCatalog?.apiCatalogId,\n    false\n  );\n\n  const refetchfileResultData = useCallback(\n    async (selectedRecord) => {\n      if (udpJobEntity?.unityBaseGetFileResultMethod?.apiMethodId) {\n        setDownloadLinkLoading(true);\n        await executeQueryWithParameters(\n          {\n            data: { JobId: selectedRecord?.id }\n          },\n          udpJobEntity?.unityBaseGetFileResultMethod?.apiMethodId\n        )\n          .then((res) => {\n            setFileResultData(res.data);\n          })\n          .catch((err) => {});\n        setDownloadLinkLoading(false);\n      } else {\n        setNoDownloadMethod(true);\n      }\n    },\n    [udpJobEntity?.unityBaseGetFileResultMethod?.apiMethodId]\n  );\n\n  const handleSelectRecord = useCallback(\n    (data) => {\n      refetchfileResultData(data);\n      setDownloadOpen(true);\n    },\n    [refetchfileResultData]\n  );\n\n  const getOptionLabel = (val) => {\n    return val?.name;\n  };\n\n  const handleProductChange = useCallback((val) => {\n    setProduct(val);\n  }, []);\n\n  const handleFileDownload = useCallback(() => {\n    if (fileResultData?.link) {\n      const link = document.createElement('a');\n      link.href = fileResultData?.link;\n      link.download = '';\n      document.body.appendChild(link);\n      link.click();\n      document.body.removeChild(link);\n      setDownloadOpen(false);\n      handleSuccessSnackbar('File successfully downloaded');\n    }\n  }, [fileResultData?.link, handleSuccessSnackbar]);\n\n  const getJobStatus = (value) => {\n    if (value === 1) {\n      return null;\n    } else if (value === 2) {\n      return 'info';\n    } else if (value === 3) {\n      return 'success';\n    } else if (value === 4) {\n      return 'error';\n    }\n  };\n\n  const getJobLabel = (value) => {\n    if (value === 1) {\n      return 'Pending';\n    } else if (value === 2) {\n      return 'Running';\n    } else if (value === 3) {\n      return 'Completed';\n    } else if (value === 4) {\n      return 'Failed';\n    }\n  };\n\n  useEffect(() => {\n    if (catalogError) {\n      handleErrorSnackbar(\n        '',\n        'Error fetching catalog for the selected product'\n      );\n    }\n  }, [catalogError, handleErrorSnackbar]);\n\n  const filterElements = useMemo(() => {\n    return [\n      {\n        searchField: 'jobTypeId',\n        searchOperator: '=',\n        searchValue: 2\n      }\n    ];\n  }, []);\n\n  const actionList = useMemo(() => {\n    return [\n      {\n        id: 1,\n        title: 'Download',\n        icon: DownloadIcon,\n        onClick: handleSelectRecord,\n        disabled: false,\n        checkDisabled: (value) => value?.statusId !== 3\n      }\n    ];\n  }, [handleSelectRecord]);\n\n  const columnDefs = useMemo(\n    () => [\n      {\n        headerName: 'Id',\n        sortable: true,\n        field: 'id',\n        suppressMenu: true\n      },\n      {\n        headerName: 'Name',\n        sortable: false,\n        field: 'name',\n        minWidth: 140,\n        suppressMenu: true,\n        valueFormatter: (data) => getSanitizedName(data.data.name)\n      },\n      {\n        headerName: 'Date',\n        sortable: false,\n        valueFormatter: (data) =>\n          new Date(data.data.startTime).toLocaleString(),\n        minWidth: 130,\n        suppressMenu: true\n        //sort: 'desc',\n      },\n      {\n        headerName: 'Status',\n        field: 'statusId',\n        wrapText: true,\n        autoHeight: true,\n        sortable: false,\n        cellRenderer: 'statusCellRenderer',\n        cellRendererParams: { getStatus: getJobStatus, getLabel: getJobLabel },\n        minWidth: 130,\n        maxWidth: 130,\n        suppressMenu: true\n      },\n\n      {\n        headerName: 'Actions',\n        filter: false,\n        pinned: 'right',\n        cellRenderer: 'actionsRenderer',\n        width: 120,\n        maxWidth: 120,\n        cellRendererParams: {\n          actionList: actionList,\n          value: (data) => data\n        },\n        suppressMenu: true,\n        sortable: false,\n        cellStyle: { display: 'flex', alignItems: 'center' }\n      }\n    ],\n    [actionList]\n  );\n\n  return (\n    <div>\n      {udpJobEntity && !udpJobEntity?.unityBaseSearchMethod?.apiMethodId && (\n        <AmbientAlert\n          alertMessage={\"UdpJob's search method must be promoted\"}\n          showAlert={true}\n          alertSeverity={'error'}\n        />\n      )}\n\n      {!productId && (\n        <div style={{ margin: '0px 5px 5px 5px' }}>\n          <AmbientAutoComplete\n            isMultiple={false}\n            id={'product'}\n            name={'product'}\n            label='Product'\n            onChange={handleProductChange}\n            options={products}\n            size='small'\n            getOptionLabelFunction={getOptionLabel}\n            value={product}\n            required\n          />\n        </div>\n      )}\n      <TableContainer\n        loading={productsLoading || catalogLoading || jobEntityLoading}\n        title={`Exports`}\n        isServerSide={true}\n        eagerLoad={false}\n        logicalSearchOperator={2}\n        promotedEntity={udpJobEntity}\n        filterElements={filterElements}\n        actionList={actionList}\n        customColumnDefs={columnDefs}\n        frameworkComponents={{\n          statusCellRenderer: StatusCellRenderer,\n          actionsRenderer: ActionsRenderer\n        }}\n        hideSearchBar\n        hiddenActionButtons={[\n          'saveView',\n          'views',\n          'insights',\n          'importExport',\n          'group',\n          'filter',\n          'columns',\n          'clearFilters',\n          'fitGrid',\n          'expandGrid'\n        ]}\n        height={'calc(100vh - 167px)'}\n        dynamicSizing\n      />\n      <FluentDialog\n        actionOne={handleFileDownload}\n        actionTwo={() => setDownloadOpen(false)}\n        labelOne='Download'\n        labelTwo='Cancel'\n        open={downloadOpen}\n        handleClose={() => setDownloadOpen(false)}\n        disableOne={noDownloadMethod || downloadLinkLoading}\n        progress={downloadLinkLoading}\n        fullWidth\n      >\n        {noDownloadMethod ? (\n          <AmbientAlert\n            alertMessage={\"UdpJob's get file result method must be promoted\"}\n            showAlert={true}\n            alertSeverity={'error'}\n          />\n        ) : downloadLinkLoading ? (\n          <EmptyStateDisplay primaryText={'Fetching download link...'} />\n        ) : (\n          <EmptyStateDisplay\n            icon={noDownloadMethod ? ErrorIcon : StatusCircleCheckmarkIcon}\n            primaryText={!noDownloadMethod && 'File is ready to download!'}\n          />\n        )}\n      </FluentDialog>\n    </div>\n  );\n};\n\nexport default MyExportsPage;\n"],"mappings":"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"}
+{"version":3,"file":"MyExportsPage-DMcJRz8T.js","names":[],"sources":["../src/udp/export/MyExportsPage.jsx"],"sourcesContent":["import React, { useMemo, useState, useCallback, useEffect } from 'react';\nimport {\n  StatusCircleCheckmarkIcon,\n  ErrorIcon,\n  DownloadIcon\n} from '@fluentui/react-icons';\nimport { getSanitizedName } from '../../utilities/entities/entityUtilities';\nimport { FluentDialog } from '../../UI/feedback/FluentDialog';\nimport { EmptyStateDisplay } from '../../UI/dataDisplay/EmptyStateDisplay';\nimport { useAxiosGet } from '../../utilities/useAxiosGet';\nimport { ActionsRenderer } from '../../UI/templates/ui/renderers/ActionsRenderer';\nimport { AmbientAlert } from '../../UI/feedback/AmbientAlert';\nimport { TableContainer } from '../../maintenanceEngine/tableBrowser/TableContainer';\nimport { StatusCellRenderer } from '../../UI/templates/ui/renderers/StatusCellRenderer';\nimport { useUser } from '../../utilities/auth/useUser';\nimport { AmbientAutoComplete } from '../../UI/inputs/textField/AmbientAutoComplete';\nimport { executeQueryWithParameters } from '../utilities/methodUtils';\nimport { useHandleAxiosSnackbar } from '../../utilities/apiHelpers';\nimport { ConfigService } from '../../configService';\n\nexport const MyExportsPage = (props) => {\n  const { productId } = props;\n  const user = useUser();\n  const [product, setProduct] = useState();\n  const [downloadLinkLoading, setDownloadLinkLoading] = useState(false);\n  const [fileResultData, setFileResultData] = useState();\n  const [downloadOpen, setDownloadOpen] = useState(false);\n  const [noDownloadMethod, setNoDownloadMethod] = useState(false);\n\n  const { handleErrorSnackbar, handleSuccessSnackbar } =\n    useHandleAxiosSnackbar();\n\n  const [{ data: products, loading: productsLoading }] = useAxiosGet(\n    ConfigService.tenantV2ApiUrl,\n    `tenant/products?tenantId=${user?.currentTenantId}&isSubscribable=${!user\n      ?.can?.CAN_MANAGE_CATALOGS_FOR_UNSUBSCRIBABLE_PRODUCTS}`,\n    {},\n    !user\n  );\n\n  const [{ data: apiCatalog, loading: catalogLoading, error: catalogError }] =\n    useAxiosGet(\n      ConfigService.integrationV1ApiUrl,\n      `tenantProductApiCatalogBase/tenant/${user?.currentTenantId}/product/${\n        productId ? productId : product?.productId\n      }`,\n      {},\n      !(product || productId),\n      false\n    );\n\n  const [{ data: udpJobEntity, loading: jobEntityLoading }] = useAxiosGet(\n    ConfigService.integrationV1ApiUrl,\n    `apicatalog/${apiCatalog?.apiCatalogId}/promotedMethodEntities/udpJob/product/${apiCatalog?.productId}?compareSanitizedName=true`,\n    {},\n    !apiCatalog?.productId || !apiCatalog?.apiCatalogId,\n    false\n  );\n\n  const refetchfileResultData = useCallback(\n    async (selectedRecord) => {\n      if (udpJobEntity?.unityBaseGetFileResultMethod?.apiMethodId) {\n        setDownloadLinkLoading(true);\n        await executeQueryWithParameters(\n          {\n            data: { JobId: selectedRecord?.id }\n          },\n          udpJobEntity?.unityBaseGetFileResultMethod?.apiMethodId\n        )\n          .then((res) => {\n            setFileResultData(res.data);\n          })\n          .catch((err) => {});\n        setDownloadLinkLoading(false);\n      } else {\n        setNoDownloadMethod(true);\n      }\n    },\n    [udpJobEntity?.unityBaseGetFileResultMethod?.apiMethodId]\n  );\n\n  const handleSelectRecord = useCallback(\n    (data) => {\n      refetchfileResultData(data);\n      setDownloadOpen(true);\n    },\n    [refetchfileResultData]\n  );\n\n  const getOptionLabel = (val) => {\n    return val?.name;\n  };\n\n  const handleProductChange = useCallback((val) => {\n    setProduct(val);\n  }, []);\n\n  const handleFileDownload = useCallback(() => {\n    if (fileResultData?.link) {\n      const link = document.createElement('a');\n      link.href = fileResultData?.link;\n      link.download = '';\n      document.body.appendChild(link);\n      link.click();\n      document.body.removeChild(link);\n      setDownloadOpen(false);\n      handleSuccessSnackbar('File successfully downloaded');\n    }\n  }, [fileResultData?.link, handleSuccessSnackbar]);\n\n  const getJobStatus = (value) => {\n    if (value === 1) {\n      return null;\n    } else if (value === 2) {\n      return 'info';\n    } else if (value === 3) {\n      return 'success';\n    } else if (value === 4) {\n      return 'error';\n    }\n  };\n\n  const getJobLabel = (value) => {\n    if (value === 1) {\n      return 'Pending';\n    } else if (value === 2) {\n      return 'Running';\n    } else if (value === 3) {\n      return 'Completed';\n    } else if (value === 4) {\n      return 'Failed';\n    }\n  };\n\n  useEffect(() => {\n    if (catalogError) {\n      handleErrorSnackbar(\n        '',\n        'Error fetching catalog for the selected product'\n      );\n    }\n  }, [catalogError, handleErrorSnackbar]);\n\n  const filterElements = useMemo(() => {\n    return [\n      {\n        searchField: 'jobTypeId',\n        searchOperator: '=',\n        searchValue: 2\n      }\n    ];\n  }, []);\n\n  const actionList = useMemo(() => {\n    return [\n      {\n        id: 1,\n        title: 'Download',\n        icon: DownloadIcon,\n        onClick: handleSelectRecord,\n        disabled: false,\n        checkDisabled: (value) => value?.statusId !== 3\n      }\n    ];\n  }, [handleSelectRecord]);\n\n  const columnDefs = useMemo(\n    () => [\n      {\n        headerName: 'Id',\n        sortable: true,\n        field: 'id',\n        suppressMenu: true\n      },\n      {\n        headerName: 'Name',\n        sortable: false,\n        field: 'name',\n        minWidth: 140,\n        suppressMenu: true,\n        valueFormatter: (data) => getSanitizedName(data.data.name)\n      },\n      {\n        headerName: 'Date',\n        sortable: false,\n        valueFormatter: (data) =>\n          new Date(data.data.startTime).toLocaleString(),\n        minWidth: 130,\n        suppressMenu: true\n        //sort: 'desc',\n      },\n      {\n        headerName: 'Status',\n        field: 'statusId',\n        wrapText: true,\n        autoHeight: true,\n        sortable: false,\n        cellRenderer: 'statusCellRenderer',\n        cellRendererParams: { getStatus: getJobStatus, getLabel: getJobLabel },\n        minWidth: 130,\n        maxWidth: 130,\n        suppressMenu: true\n      },\n\n      {\n        headerName: 'Actions',\n        filter: false,\n        pinned: 'right',\n        cellRenderer: 'actionsRenderer',\n        width: 120,\n        maxWidth: 120,\n        cellRendererParams: {\n          actionList: actionList,\n          value: (data) => data\n        },\n        suppressMenu: true,\n        sortable: false,\n        cellStyle: { display: 'flex', alignItems: 'center' }\n      }\n    ],\n    [actionList]\n  );\n\n  return (\n    <div>\n      {udpJobEntity && !udpJobEntity?.unityBaseSearchMethod?.apiMethodId && (\n        <AmbientAlert\n          alertMessage={\"UdpJob's search method must be promoted\"}\n          showAlert={true}\n          alertSeverity={'error'}\n        />\n      )}\n\n      {!productId && (\n        <div style={{ margin: '0px 5px 5px 5px' }}>\n          <AmbientAutoComplete\n            isMultiple={false}\n            id={'product'}\n            name={'product'}\n            label='Product'\n            onChange={handleProductChange}\n            options={products}\n            size='small'\n            getOptionLabelFunction={getOptionLabel}\n            value={product}\n            required\n          />\n        </div>\n      )}\n      <TableContainer\n        loading={productsLoading || catalogLoading || jobEntityLoading}\n        title={`Exports`}\n        isServerSide={true}\n        eagerLoad={false}\n        logicalSearchOperator={2}\n        promotedEntity={udpJobEntity}\n        filterElements={filterElements}\n        actionList={actionList}\n        customColumnDefs={columnDefs}\n        frameworkComponents={{\n          statusCellRenderer: StatusCellRenderer,\n          actionsRenderer: ActionsRenderer\n        }}\n        hideSearchBar\n        hiddenActionButtons={[\n          'saveView',\n          'views',\n          'insights',\n          'importExport',\n          'group',\n          'filter',\n          'columns',\n          'clearFilters',\n          'fitGrid',\n          'expandGrid'\n        ]}\n        height={'calc(100vh - 167px)'}\n        dynamicSizing\n      />\n      <FluentDialog\n        actionOne={handleFileDownload}\n        actionTwo={() => setDownloadOpen(false)}\n        labelOne='Download'\n        labelTwo='Cancel'\n        open={downloadOpen}\n        handleClose={() => setDownloadOpen(false)}\n        disableOne={noDownloadMethod || downloadLinkLoading}\n        progress={downloadLinkLoading}\n        fullWidth\n      >\n        {noDownloadMethod ? (\n          <AmbientAlert\n            alertMessage={\"UdpJob's get file result method must be promoted\"}\n            showAlert={true}\n            alertSeverity={'error'}\n          />\n        ) : downloadLinkLoading ? (\n          <EmptyStateDisplay primaryText={'Fetching download link...'} />\n        ) : (\n          <EmptyStateDisplay\n            icon={noDownloadMethod ? ErrorIcon : StatusCircleCheckmarkIcon}\n            primaryText={!noDownloadMethod && 'File is ready to download!'}\n          />\n        )}\n      </FluentDialog>\n    </div>\n  );\n};\n\nexport default MyExportsPage;\n"],"mappings":"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"}

package/dist/MyExportsPage-zF3FjtDl.js

@@ -0,0 +1,3 @@
+import { n as MyExportsPage_default, t as MyExportsPage } from "./MyExportsPage-DMcJRz8T.js";
+
+export { MyExportsPage, MyExportsPage_default as default };