@hitachivantara/uikit-react-lab 3.55.0 → 4.0.1-next.2

package/dist/modern/ImageCarousel/ImageCarousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageCarousel.js","names":["React","useState","useRef","useEffect","useCallback","PropTypes","clsx","setId","useUniqueId","HvButton","HvContainer","HvTypography","HvGrid","HvStack","HvPanel","useScrollTo","Button","makeStyles","withStyles","Fade","Backwards","Forwards","Close","Fullscreen","styles","HvImageCarousel","props","className","classes","documents","title","id","fullscreen","fullscreenProp","thumbnails","lowCardinality","infiniteCarousel","xs","onChange","counter","currentStep","setCurrentStep","visibleArrows","variant","others","elementId","setFullscreen","options","map","element","src","value","sliceStart","setSliceStart","selImage","setImage","offset","setOffset","imageHover","setImageHover","direction","useStyles","theme","button","backgroundColor","hv","palette","atmosphere","atmo3","imageBox","minWidth","display","justifyContent","allImages","width","style","selectedIndex","setScrollTo","selectedBigIndex","setBigScrollTo","refBackwards","refForwards","typeCircle","handleSelection","event","index","wrappedOnChange","handleFocus","focus","current","handleBigSelection","handleVisibility","image","document","getElementById","panel","container","containerWidth","offsetWidth","offsetPanel","offsetLeft","offsetImage","imageWidth","scroll","scrollLeft","activeElement","undefined","changeSlice","length","nextImage","next","previousImage","previous","styleThumbnail","img","thumbnailSelected","circleType","xsSelectedCircle","selectedCircle","miniCircle","root","fullscreenStyle","closeButton","imageContainer","stack","appear","enter","exit","selectedImage","lowButtons","xsCircles","slice","divCounter","color","circles","normalButtons","hidden","i","thumbnailButton","propTypes","string","shape","xsMode","xsImage","isRequired","array","node","func","bool","number","name"],"sources":["../../../src/ImageCarousel/ImageCarousel.js"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport {\n  setId,\n  useUniqueId,\n  HvButton,\n  HvContainer,\n  HvTypography,\n  HvGrid,\n  HvStack,\n  HvPanel,\n  useScrollTo,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { Button, makeStyles, withStyles, Fade } from \"@material-ui/core\";\n\nimport { Backwards, Forwards, Close, Fullscreen } from \"@hitachivantara/uikit-react-icons\";\n\nimport styles from \"./styles\";\n/**\n * ImageCarousel description/documentation paragraph\n */\nconst HvImageCarousel = (props) => {\n  const {\n    className,\n    classes,\n    documents,\n    title,\n    id,\n    fullscreen: fullscreenProp = false,\n    thumbnails = false,\n    lowCardinality = false,\n    infiniteCarousel = false,\n    xs = false,\n    onChange,\n    counter = false,\n    currentStep = 0,\n    setCurrentStep,\n    visibleArrows = false,\n    variant = \"contain\",\n    ...others\n  } = props;\n  const elementId = useUniqueId(id, \"hvcarousel\");\n  const [fullscreen, setFullscreen] = useState(false);\n  const options = documents.map((element) => ({\n    src: element.src,\n    value: setId(elementId, element.value),\n  }));\n\n  const [sliceStart, setSliceStart] = useState(0);\n  const [selImage, setImage] = useState(currentStep);\n  const [offset, setOffset] = useState(0);\n  const [imageHover, setImageHover] = useState(false);\n  let direction = \"next\";\n  const useStyles = makeStyles((theme) => ({\n    button: {\n      backgroundColor: theme.hv.palette.atmosphere.atmo3,\n    },\n    imageBox: {\n      minWidth: \"100%\",\n      display: \"flex\",\n      justifyContent: \"center\",\n    },\n    allImages: {\n      width: \"max-content\",\n      display: \"flex\",\n    },\n  }));\n  const style = useStyles();\n\n  const [selectedIndex, setScrollTo] = useScrollTo(\n    0,\n    setId(elementId, \"panel\"),\n    false,\n    100,\n    documents,\n    onChange,\n    \"row\"\n  );\n  const [selectedBigIndex, setBigScrollTo] = useScrollTo(\n    0,\n    setId(elementId, \"bigPanel\"),\n    false,\n    0,\n    options,\n    onChange,\n    \"row\"\n  );\n  const refBackwards = useRef(null);\n  const refForwards = useRef(null);\n  let typeCircle = \"circle\";\n\n  const handleSelection = useCallback(\n    (event, value, index) => {\n      const wrappedOnChange = () => {\n        onChange?.(event, index);\n      };\n      setScrollTo(event, value, index, wrappedOnChange);\n    },\n    [onChange, setScrollTo]\n  );\n\n  const handleFocus = (focus) => {\n    if (focus === refBackwards.current || focus === refForwards.current) focus.focus();\n  };\n\n  const handleBigSelection = useCallback(\n    (event, value, index) => {\n      const wrappedOnChange = () => {\n        onChange?.(event, index);\n      };\n      setBigScrollTo(event, value, index, wrappedOnChange);\n    },\n    [onChange, setBigScrollTo]\n  );\n\n  const handleVisibility = useCallback(\n    (event, value, index) => {\n      const image = document.getElementById(value);\n      const panel = document.getElementById(setId(elementId, \"panel\"));\n      const container = document.getElementById(setId(elementId, \"container\"));\n      const containerWidth = container.offsetWidth;\n      const offsetPanel = panel.offsetLeft;\n      const offsetImage = image.offsetLeft;\n      const imageWidth = image.offsetWidth;\n      const scroll = panel.scrollLeft;\n      const focus = document.activeElement;\n\n      if (\n        offsetPanel + offsetImage + offset + imageWidth - scroll > containerWidth ||\n        offsetImage - scroll < 0\n      ) {\n        handleSelection(event, value, index);\n        handleFocus(focus);\n      }\n    },\n    [elementId, handleSelection, offset]\n  );\n\n  useEffect(() => {\n    setCurrentStep?.(selImage);\n  }, [selImage, setCurrentStep]);\n\n  useEffect(() => {\n    if (fullscreen) setOffset(150);\n    else setOffset(0);\n\n    if (thumbnails) {\n      handleVisibility(undefined, documents[selImage].value, selImage, selectedIndex);\n    }\n    handleBigSelection(undefined, options[selImage].value, selImage, selectedBigIndex);\n  }, [\n    documents,\n    fullscreen,\n    handleBigSelection,\n    handleVisibility,\n    options,\n    selImage,\n    selectedBigIndex,\n    selectedIndex,\n    thumbnails,\n  ]);\n\n  const changeSlice = () => {\n    if (direction === \"next\") {\n      if (infiniteCarousel && selImage === documents.length - 1) setSliceStart(0);\n      else if (selImage > sliceStart + 2 && selImage !== documents.length - 2)\n        setSliceStart(sliceStart + 1);\n    }\n    if (direction === \"prev\") {\n      if (infiniteCarousel && selImage === 0)\n        setSliceStart(documents.length > 5 ? documents.length - 5 : 0);\n      else if (selImage < sliceStart + 2 && selImage !== 1) setSliceStart(sliceStart - 1);\n    }\n  };\n\n  const nextImage = () => {\n    let next;\n    if (selImage !== documents.length - 1) next = selImage + 1;\n    else if (infiniteCarousel) next = 0;\n    setImage(next);\n    if (xs) {\n      direction = \"next\";\n      changeSlice();\n    }\n  };\n\n  const previousImage = () => {\n    let previous;\n    if (selImage !== 0) previous = selImage - 1;\n    else if (infiniteCarousel) previous = documents.length - 1;\n    setImage(previous);\n    if (xs) {\n      direction = \"prev\";\n      changeSlice();\n    }\n  };\n\n  const styleThumbnail = (index) => {\n    if (index !== selImage) return classes.img;\n    return classes.thumbnailSelected;\n  };\n\n  const circleType = (index) => {\n    if (index === selImage) {\n      typeCircle = \"BigCircle\";\n      if (xs) return classes.xsSelectedCircle;\n      return classes.selectedCircle;\n    }\n    typeCircle = \"Circle\";\n    return classes.miniCircle;\n  };\n\n  return (\n    <HvContainer\n      id={setId(elementId, \"container\")}\n      className={clsx(\n        className,\n        classes.root,\n        fullscreen ? classes.fullscreenStyle : \"\",\n        xs ? \"xs\" : \"nxs\"\n      )}\n      {...others}\n    >\n      {!xs && (\n        <div className={classes.title}>\n          <div>{title}</div>\n          {fullscreenProp && (\n            <div>\n              {fullscreen ? (\n                <HvButton\n                  className={classes.closeButton}\n                  icon\n                  aria-label=\"Close\"\n                  onClick={() => setFullscreen(!fullscreen)}\n                >\n                  <Close />\n                </HvButton>\n              ) : (\n                <HvButton icon aria-label=\"Fullscreen\" onClick={() => setFullscreen(true)}>\n                  <Fullscreen />\n                </HvButton>\n              )}\n            </div>\n          )}\n        </div>\n      )}\n      <HvContainer\n        className={clsx(\n          classes.imageContainer,\n          !xs ? \"nxs\" : \"\",\n          fullscreen ? \"fullscreen\" : \"notFullscreen\"\n        )}\n        onFocus={() => setImageHover(true)}\n        onMouseOver={() => setImageHover(true)}\n        onBlur={() => setImageHover(false)}\n        onMouseOut={() => setImageHover(false)}\n      >\n        <HvPanel\n          className={clsx(classes.stack, xs ? \"xs\" : \"nxs\")}\n          id={setId(elementId, \"bigPanel\")}\n        >\n          {options.map((element, index) => (\n            <div className={style.imageBox} id={element.value} key={`div ${element.value}`}>\n              <Fade in={selImage === index || xs} timeout={{ appear: 500, enter: 1200, exit: 200 }}>\n                <img\n                  className={clsx(\n                    classes.selectedImage,\n                    xs ? \"xs\" : \"nxs\",\n                    fullscreen ? \"fullscreen\" : \"notFullscreen\",\n                    variant\n                  )}\n                  src={element.src}\n                  alt={element.value}\n                  key={`image ${element.value}`}\n                />\n              </Fade>\n            </div>\n          ))}\n        </HvPanel>\n        {(xs || lowCardinality) && (\n          <div className={clsx(classes.lowButtons, !xs ? \"nxs\" : \"\")}>\n            <div>\n              <Fade in={imageHover || visibleArrows}>\n                <HvButton\n                  ref={refBackwards}\n                  className={classes.button}\n                  icon\n                  aria-label=\"Backwards\"\n                  onClick={(event) => previousImage(event)}\n                >\n                  <Backwards />\n                </HvButton>\n              </Fade>\n            </div>\n            <div>\n              <Fade in={imageHover || visibleArrows}>\n                <HvButton\n                  ref={refForwards}\n                  className={classes.button}\n                  icon\n                  aria-label=\"Forwards\"\n                  onClick={(event) => nextImage(event)}\n                >\n                  <Forwards />\n                </HvButton>\n              </Fade>\n            </div>\n          </div>\n        )}\n        {xs && (\n          <div className={classes.xsCircles}>\n            {documents\n              .map((element, index) => (\n                <span\n                  className={circleType(index)}\n                  title={typeCircle}\n                  key={`Circle ${element.value}`}\n                />\n              ))\n              .slice(sliceStart, sliceStart + 5)}\n          </div>\n        )}\n        {counter && (\n          <div className={clsx(classes.divCounter, !xs ? \"nxs\" : \"\")}>\n            <span className={classes.counter}>\n              <HvTypography variant=\"normalText\" style={{ color: \"white\" }}>\n                {`${selImage + 1}/${documents.length}`}\n              </HvTypography>\n            </span>\n          </div>\n        )}\n      </HvContainer>\n      {!xs && (\n        <>\n          {lowCardinality ? (\n            <div className={classes.circles}>\n              {documents.map((element, index) => (\n                <span\n                  className={circleType(index)}\n                  title={`${typeCircle} ${index}`}\n                  key={`Circle ${element.value}`}\n                />\n              ))}\n            </div>\n          ) : (\n            <HvGrid\n              className={clsx(classes.normalButtons)}\n              container\n              justifyContent=\"space-between\"\n              alignItems=\"center\"\n            >\n              <HvGrid item>\n                <HvButton\n                  className={infiniteCarousel || selImage !== 0 ? \"\" : classes.hidden}\n                  ref={refBackwards}\n                  icon\n                  aria-label=\"Backwards\"\n                  onClick={(event) => previousImage(event)}\n                >\n                  <Backwards />\n                </HvButton>\n              </HvGrid>\n              <HvGrid item>\n                <HvTypography variant=\"highlightText\" component=\"a\">\n                  {selImage + 1}\n                </HvTypography>\n                <HvTypography variant=\"normalText\" component=\"a\">\n                  {` /  ${documents.length}`}\n                </HvTypography>\n              </HvGrid>\n              <HvGrid item>\n                <HvButton\n                  className={\n                    infiniteCarousel || selImage !== documents.length - 1 ? \"\" : classes.hidden\n                  }\n                  ref={refForwards}\n                  icon\n                  aria-label=\"Forwards\"\n                  onClick={(event) => nextImage(event)}\n                >\n                  <Forwards />\n                </HvButton>\n              </HvGrid>\n            </HvGrid>\n          )}\n          {thumbnails && (\n            <HvPanel className={classes.panel} id={setId(elementId, \"panel\")}>\n              <HvStack key=\"Thumbnails\" direction=\"row\" spacing=\"xs\" withNavigation>\n                {documents.map((element, i) => (\n                  <Button\n                    id={element.value}\n                    key={`Button ${element.value}`}\n                    className={classes.thumbnailButton}\n                    onClick={() => setImage(i)}\n                  >\n                    <img\n                      className={styleThumbnail(i)}\n                      src={element.src}\n                      alt={element.value}\n                      key={`Thumbnail ${element.value}`}\n                    />\n                  </Button>\n                ))}\n              </HvStack>\n            </HvPanel>\n          )}\n        </>\n      )}\n    </HvContainer>\n  );\n};\n\nHvImageCarousel.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the component SelectedImage.\n     */\n    selectedImage: PropTypes.string,\n    /**\n     * Styles applied to xs mode\n     */\n    xsMode: PropTypes.string,\n    /**\n     * Styles applied to image in xsMode\n     */\n    xsImage: PropTypes.string,\n    /**\n     * Styles applied to panel with low cardinality circles\n     */\n    circles: PropTypes.string,\n    /**\n     * Styles applied to xs mode circles\n     */\n    xsCircles: PropTypes.string,\n    /**\n     * Styles applied to unavailable button\n     */\n    hidden: PropTypes.string,\n    /**\n     * Styles applied to the carousel title\n     */\n    title: PropTypes.string,\n    /**\n     * Styles applied to the counter\n     */\n    counter: PropTypes.string,\n    /**\n     * Styles applied to the div with the counter\n     */\n    divCounter: PropTypes.string,\n    /**\n     * Styles applied to the thumbnails\n     */\n    img: PropTypes.string,\n    /**\n     * Styles applied to the selected thumbnail\n     */\n    thumbnailSelected: PropTypes.string,\n    /**\n     * Styles applied to the thumbnail button\n     */\n    thumbnailButton: PropTypes.string,\n    /**\n     * Styles applied to the low cardinality circles\n     */\n    miniCircle: PropTypes.string,\n    /**\n     * Styles applied to the circle of the selected image\n     */\n    selectedCircle: PropTypes.string,\n    /**\n     * Styles applied to the circle of the selected image in xsmode\n     */\n    xsSelectedCircle: PropTypes.string,\n    /**\n     * Styles applied to the panel with low cardinality buttons\n     */\n    lowButtons: PropTypes.string,\n    /**\n     * Styles applied to the container of the selected image\n     */\n    imageContainer: PropTypes.string,\n    /**\n     * Styles applied to the panel with the thumbnails\n     */\n    stack: PropTypes.string,\n    /**\n     * Styles applied to the panel that contains the buttons and counter in default mode\n     */\n    normalButtons: PropTypes.string,\n    /**\n     * Styles applied to fullscreen mode.\n     */\n    fullscreenStyle: PropTypes.string,\n    /**\n     * Styles applied to close button in fullscreen mode.\n     */\n    closeButton: PropTypes.string,\n    /**\n     * Styles applied to change image buttons.\n     */\n    button: PropTypes.string,\n    /**\n     * Styles applied to thumbnails panel.\n     */\n    panel: PropTypes.string,\n  }).isRequired,\n  /**\n   * Documents to be displayed.\n   */\n  documents: PropTypes.array.isRequired,\n  /**\n   * Title of the image carousel\n   */\n  title: PropTypes.node,\n  /**\n   * A function called each time the selected image changes.\n   */\n  onChange: PropTypes.func,\n  /**\n   * Id to be applied to the root node.\n   */\n  id: PropTypes.string,\n  /**\n   * A flag that activates the thumbnails.\n   */\n  thumbnails: PropTypes.bool,\n  /**\n   * A flag that switches to low cardinality mode\n   */\n  lowCardinality: PropTypes.bool,\n  /**\n   * A flag that activates the infinite carousel behavior\n   */\n  infiniteCarousel: PropTypes.bool,\n  /**\n   * A flag that activates a counter on the top right corner of the selected image\n   */\n  counter: PropTypes.bool,\n  /**\n   * Set Image Carousel to fullscreen mode\n   */\n  fullscreen: PropTypes.bool,\n  /**\n   * Set selected image to a particular image in documents\n   */\n  currentStep: PropTypes.number,\n  /**\n   * Function that changes the selected image\n   */\n  setCurrentStep: PropTypes.func,\n  /**\n   * Image Carousel set to xs mode\n   */\n  xs: PropTypes.bool,\n  /**\n   * Arrows always displayed in low cardinality or xs mode\n   */\n  visibleArrows: PropTypes.bool,\n  /**\n   * Selected image fit variant\n   */\n  variant: PropTypes.string,\n};\n\nexport default withStyles(styles, { name: \"HvImageCarousel\" })(HvImageCarousel);\n"],"mappings":";;;;;;;AAAA,OAAOA,KAAP,IAAgBC,QAAhB,EAA0BC,MAA1B,EAAkCC,SAAlC,EAA6CC,WAA7C,QAAgE,OAAhE;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,IAAP,MAAiB,MAAjB;AACA,SACEC,KADF,EAEEC,WAFF,EAGEC,QAHF,EAIEC,WAJF,EAKEC,YALF,EAMEC,MANF,EAOEC,OAPF,EAQEC,OARF,EASEC,WATF,QAUO,kCAVP;AAYA,SAASC,MAAT,EAAiBC,UAAjB,EAA6BC,UAA7B,EAAyCC,IAAzC,QAAqD,mBAArD;AAEA,SAASC,SAAT,EAAoBC,QAApB,EAA8BC,KAA9B,EAAqCC,UAArC,QAAuD,mCAAvD;AAEA,OAAOC,MAAP,MAAmB,UAAnB;AACA;AACA;AACA;;AACA,MAAMC,eAAe,GAAIC,KAAD,IAAW;EACjC,MAAM;IACJC,SADI;IAEJC,OAFI;IAGJC,SAHI;IAIJC,KAJI;IAKJC,EALI;IAMJC,UAAU,EAAEC,cAAc,GAAG,KANzB;IAOJC,UAAU,GAAG,KAPT;IAQJC,cAAc,GAAG,KARb;IASJC,gBAAgB,GAAG,KATf;IAUJC,EAAE,GAAG,KAVD;IAWJC,QAXI;IAYJC,OAAO,GAAG,KAZN;IAaJC,WAAW,GAAG,CAbV;IAcJC,cAdI;IAeJC,aAAa,GAAG,KAfZ;IAgBJC,OAAO,GAAG;EAhBN,IAkBFjB,KAlBJ;EAAA,MAiBKkB,MAjBL,4BAkBIlB,KAlBJ;;EAmBA,MAAMmB,SAAS,GAAGrC,WAAW,CAACuB,EAAD,EAAK,YAAL,CAA7B;EACA,MAAM,CAACC,UAAD,EAAac,aAAb,IAA8B7C,QAAQ,CAAC,KAAD,CAA5C;EACA,MAAM8C,OAAO,GAAGlB,SAAS,CAACmB,GAAV,CAAeC,OAAD,KAAc;IAC1CC,GAAG,EAAED,OAAO,CAACC,GAD6B;IAE1CC,KAAK,EAAE5C,KAAK,CAACsC,SAAD,EAAYI,OAAO,CAACE,KAApB;EAF8B,CAAd,CAAd,CAAhB;EAKA,MAAM,CAACC,UAAD,EAAaC,aAAb,IAA8BpD,QAAQ,CAAC,CAAD,CAA5C;EACA,MAAM,CAACqD,QAAD,EAAWC,QAAX,IAAuBtD,QAAQ,CAACuC,WAAD,CAArC;EACA,MAAM,CAACgB,MAAD,EAASC,SAAT,IAAsBxD,QAAQ,CAAC,CAAD,CAApC;EACA,MAAM,CAACyD,UAAD,EAAaC,aAAb,IAA8B1D,QAAQ,CAAC,KAAD,CAA5C;EACA,IAAI2D,SAAS,GAAG,MAAhB;EACA,MAAMC,SAAS,GAAG5C,UAAU,CAAE6C,KAAD,KAAY;IACvCC,MAAM,EAAE;MACNC,eAAe,EAAEF,KAAK,CAACG,EAAN,CAASC,OAAT,CAAiBC,UAAjB,CAA4BC;IADvC,CAD+B;IAIvCC,QAAQ,EAAE;MACRC,QAAQ,EAAE,MADF;MAERC,OAAO,EAAE,MAFD;MAGRC,cAAc,EAAE;IAHR,CAJ6B;IASvCC,SAAS,EAAE;MACTC,KAAK,EAAE,aADE;MAETH,OAAO,EAAE;IAFA;EAT4B,CAAZ,CAAD,CAA5B;EAcA,MAAMI,KAAK,GAAGd,SAAS,EAAvB;EAEA,MAAM,CAACe,aAAD,EAAgBC,WAAhB,IAA+B9D,WAAW,CAC9C,CAD8C,EAE9CR,KAAK,CAACsC,SAAD,EAAY,OAAZ,CAFyC,EAG9C,KAH8C,EAI9C,GAJ8C,EAK9ChB,SAL8C,EAM9CS,QAN8C,EAO9C,KAP8C,CAAhD;EASA,MAAM,CAACwC,gBAAD,EAAmBC,cAAnB,IAAqChE,WAAW,CACpD,CADoD,EAEpDR,KAAK,CAACsC,SAAD,EAAY,UAAZ,CAF+C,EAGpD,KAHoD,EAIpD,CAJoD,EAKpDE,OALoD,EAMpDT,QANoD,EAOpD,KAPoD,CAAtD;EASA,MAAM0C,YAAY,GAAG9E,MAAM,CAAC,IAAD,CAA3B;EACA,MAAM+E,WAAW,GAAG/E,MAAM,CAAC,IAAD,CAA1B;EACA,IAAIgF,UAAU,GAAG,QAAjB;EAEA,MAAMC,eAAe,GAAG/E,WAAW,CACjC,CAACgF,KAAD,EAAQjC,KAAR,EAAekC,KAAf,KAAyB;IACvB,MAAMC,eAAe,GAAG,MAAM;MAC5BhD,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAG8C,KAAH,EAAUC,KAAV,CAAR;IACD,CAFD;;IAGAR,WAAW,CAACO,KAAD,EAAQjC,KAAR,EAAekC,KAAf,EAAsBC,eAAtB,CAAX;EACD,CANgC,EAOjC,CAAChD,QAAD,EAAWuC,WAAX,CAPiC,CAAnC;;EAUA,MAAMU,WAAW,GAAIC,KAAD,IAAW;IAC7B,IAAIA,KAAK,KAAKR,YAAY,CAACS,OAAvB,IAAkCD,KAAK,KAAKP,WAAW,CAACQ,OAA5D,EAAqED,KAAK,CAACA,KAAN;EACtE,CAFD;;EAIA,MAAME,kBAAkB,GAAGtF,WAAW,CACpC,CAACgF,KAAD,EAAQjC,KAAR,EAAekC,KAAf,KAAyB;IACvB,MAAMC,eAAe,GAAG,MAAM;MAC5BhD,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAG8C,KAAH,EAAUC,KAAV,CAAR;IACD,CAFD;;IAGAN,cAAc,CAACK,KAAD,EAAQjC,KAAR,EAAekC,KAAf,EAAsBC,eAAtB,CAAd;EACD,CANmC,EAOpC,CAAChD,QAAD,EAAWyC,cAAX,CAPoC,CAAtC;EAUA,MAAMY,gBAAgB,GAAGvF,WAAW,CAClC,CAACgF,KAAD,EAAQjC,KAAR,EAAekC,KAAf,KAAyB;IACvB,MAAMO,KAAK,GAAGC,QAAQ,CAACC,cAAT,CAAwB3C,KAAxB,CAAd;IACA,MAAM4C,KAAK,GAAGF,QAAQ,CAACC,cAAT,CAAwBvF,KAAK,CAACsC,SAAD,EAAY,OAAZ,CAA7B,CAAd;IACA,MAAMmD,SAAS,GAAGH,QAAQ,CAACC,cAAT,CAAwBvF,KAAK,CAACsC,SAAD,EAAY,WAAZ,CAA7B,CAAlB;IACA,MAAMoD,cAAc,GAAGD,SAAS,CAACE,WAAjC;IACA,MAAMC,WAAW,GAAGJ,KAAK,CAACK,UAA1B;IACA,MAAMC,WAAW,GAAGT,KAAK,CAACQ,UAA1B;IACA,MAAME,UAAU,GAAGV,KAAK,CAACM,WAAzB;IACA,MAAMK,MAAM,GAAGR,KAAK,CAACS,UAArB;IACA,MAAMhB,KAAK,GAAGK,QAAQ,CAACY,aAAvB;;IAEA,IACEN,WAAW,GAAGE,WAAd,GAA4B7C,MAA5B,GAAqC8C,UAArC,GAAkDC,MAAlD,GAA2DN,cAA3D,IACAI,WAAW,GAAGE,MAAd,GAAuB,CAFzB,EAGE;MACApB,eAAe,CAACC,KAAD,EAAQjC,KAAR,EAAekC,KAAf,CAAf;MACAE,WAAW,CAACC,KAAD,CAAX;IACD;EACF,CAnBiC,EAoBlC,CAAC3C,SAAD,EAAYsC,eAAZ,EAA6B3B,MAA7B,CApBkC,CAApC;EAuBArD,SAAS,CAAC,MAAM;IACdsC,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAGa,QAAH,CAAd;EACD,CAFQ,EAEN,CAACA,QAAD,EAAWb,cAAX,CAFM,CAAT;EAIAtC,SAAS,CAAC,MAAM;IACd,IAAI6B,UAAJ,EAAgByB,SAAS,CAAC,GAAD,CAAT,CAAhB,KACKA,SAAS,CAAC,CAAD,CAAT;;IAEL,IAAIvB,UAAJ,EAAgB;MACdyD,gBAAgB,CAACe,SAAD,EAAY7E,SAAS,CAACyB,QAAD,CAAT,CAAoBH,KAAhC,EAAuCG,QAAvC,EAAiDsB,aAAjD,CAAhB;IACD;;IACDc,kBAAkB,CAACgB,SAAD,EAAY3D,OAAO,CAACO,QAAD,CAAP,CAAkBH,KAA9B,EAAqCG,QAArC,EAA+CwB,gBAA/C,CAAlB;EACD,CARQ,EAQN,CACDjD,SADC,EAEDG,UAFC,EAGD0D,kBAHC,EAIDC,gBAJC,EAKD5C,OALC,EAMDO,QANC,EAODwB,gBAPC,EAQDF,aARC,EASD1C,UATC,CARM,CAAT;;EAoBA,MAAMyE,WAAW,GAAG,MAAM;IACxB,IAAI/C,SAAS,KAAK,MAAlB,EAA0B;MACxB,IAAIxB,gBAAgB,IAAIkB,QAAQ,KAAKzB,SAAS,CAAC+E,MAAV,GAAmB,CAAxD,EAA2DvD,aAAa,CAAC,CAAD,CAAb,CAA3D,KACK,IAAIC,QAAQ,GAAGF,UAAU,GAAG,CAAxB,IAA6BE,QAAQ,KAAKzB,SAAS,CAAC+E,MAAV,GAAmB,CAAjE,EACHvD,aAAa,CAACD,UAAU,GAAG,CAAd,CAAb;IACH;;IACD,IAAIQ,SAAS,KAAK,MAAlB,EAA0B;MACxB,IAAIxB,gBAAgB,IAAIkB,QAAQ,KAAK,CAArC,EACED,aAAa,CAACxB,SAAS,CAAC+E,MAAV,GAAmB,CAAnB,GAAuB/E,SAAS,CAAC+E,MAAV,GAAmB,CAA1C,GAA8C,CAA/C,CAAb,CADF,KAEK,IAAItD,QAAQ,GAAGF,UAAU,GAAG,CAAxB,IAA6BE,QAAQ,KAAK,CAA9C,EAAiDD,aAAa,CAACD,UAAU,GAAG,CAAd,CAAb;IACvD;EACF,CAXD;;EAaA,MAAMyD,SAAS,GAAG,MAAM;IACtB,IAAIC,IAAJ;IACA,IAAIxD,QAAQ,KAAKzB,SAAS,CAAC+E,MAAV,GAAmB,CAApC,EAAuCE,IAAI,GAAGxD,QAAQ,GAAG,CAAlB,CAAvC,KACK,IAAIlB,gBAAJ,EAAsB0E,IAAI,GAAG,CAAP;IAC3BvD,QAAQ,CAACuD,IAAD,CAAR;;IACA,IAAIzE,EAAJ,EAAQ;MACNuB,SAAS,GAAG,MAAZ;MACA+C,WAAW;IACZ;EACF,CATD;;EAWA,MAAMI,aAAa,GAAG,MAAM;IAC1B,IAAIC,QAAJ;IACA,IAAI1D,QAAQ,KAAK,CAAjB,EAAoB0D,QAAQ,GAAG1D,QAAQ,GAAG,CAAtB,CAApB,KACK,IAAIlB,gBAAJ,EAAsB4E,QAAQ,GAAGnF,SAAS,CAAC+E,MAAV,GAAmB,CAA9B;IAC3BrD,QAAQ,CAACyD,QAAD,CAAR;;IACA,IAAI3E,EAAJ,EAAQ;MACNuB,SAAS,GAAG,MAAZ;MACA+C,WAAW;IACZ;EACF,CATD;;EAWA,MAAMM,cAAc,GAAI5B,KAAD,IAAW;IAChC,IAAIA,KAAK,KAAK/B,QAAd,EAAwB,OAAO1B,OAAO,CAACsF,GAAf;IACxB,OAAOtF,OAAO,CAACuF,iBAAf;EACD,CAHD;;EAKA,MAAMC,UAAU,GAAI/B,KAAD,IAAW;IAC5B,IAAIA,KAAK,KAAK/B,QAAd,EAAwB;MACtB4B,UAAU,GAAG,WAAb;MACA,IAAI7C,EAAJ,EAAQ,OAAOT,OAAO,CAACyF,gBAAf;MACR,OAAOzF,OAAO,CAAC0F,cAAf;IACD;;IACDpC,UAAU,GAAG,QAAb;IACA,OAAOtD,OAAO,CAAC2F,UAAf;EACD,CARD;;EAUA,oBACE,oBAAC,WAAD;IACE,EAAE,EAAEhH,KAAK,CAACsC,SAAD,EAAY,WAAZ,CADX;IAEE,SAAS,EAAEvC,IAAI,CACbqB,SADa,EAEbC,OAAO,CAAC4F,IAFK,EAIbnF,EAAE,GAAG,IAAH,GAAU,KAJC,EAGbL,UAHa,IAGAJ,OAAO,CAAC6F,eAHR;EAFjB,GAQM7E,MARN,GAUG,CAACP,EAAD,iBACC;IAAK,SAAS,EAAET,OAAO,CAACE;EAAxB,gBACE,iCAAMA,KAAN,CADF,EAEGG,cAAc,iBACb,iCACGD,UAAU,gBACT,oBAAC,QAAD;IACE,SAAS,EAAEJ,OAAO,CAAC8F,WADrB;IAEE,IAAI,MAFN;IAGE,cAAW,OAHb;IAIE,OAAO,EAAE,MAAM5E,aAAa,CAAC,CAACd,UAAF;EAJ9B,oCAME,oBAAC,KAAD,OANF,EADS,gBAUT,oBAAC,QAAD;IAAU,IAAI,MAAd;IAAe,cAAW,YAA1B;IAAuC,OAAO,EAAE,MAAMc,aAAa,CAAC,IAAD;EAAnE,8CACE,oBAAC,UAAD,OADF,EAXJ,CAHJ,CAXJ,eAiCE,oBAAC,WAAD;IACE,SAAS,EAAExC,IAAI,CACbsB,OAAO,CAAC+F,cADK,EAGb3F,UAAU,GAAG,YAAH,GAAkB,eAHf,EAEb,CAACK,EAFY,IAEP,KAFO,CADjB;IAME,OAAO,EAAE,MAAMsB,aAAa,CAAC,IAAD,CAN9B;IAOE,WAAW,EAAE,MAAMA,aAAa,CAAC,IAAD,CAPlC;IAQE,MAAM,EAAE,MAAMA,aAAa,CAAC,KAAD,CAR7B;IASE,UAAU,EAAE,MAAMA,aAAa,CAAC,KAAD;EATjC,gBAWE,oBAAC,OAAD;IACE,SAAS,EAAErD,IAAI,CAACsB,OAAO,CAACgG,KAAT,EAAgBvF,EAAE,GAAG,IAAH,GAAU,KAA5B,CADjB;IAEE,EAAE,EAAE9B,KAAK,CAACsC,SAAD,EAAY,UAAZ;EAFX,GAIGE,OAAO,CAACC,GAAR,CAAY,CAACC,OAAD,EAAUoC,KAAV,kBACX;IAAK,SAAS,EAAEV,KAAK,CAACN,QAAtB;IAAgC,EAAE,EAAEpB,OAAO,CAACE,KAA5C;IAAmD,GAAG,EAAG,OAAMF,OAAO,CAACE,KAAM;EAA7E,gBACE,oBAAC,IAAD;IAAM,EAAE,EAAEG,QAAQ,KAAK+B,KAAb,IAAsBhD,EAAhC;IAAoC,OAAO,EAAE;MAAEwF,MAAM,EAAE,GAAV;MAAeC,KAAK,EAAE,IAAtB;MAA4BC,IAAI,EAAE;IAAlC;EAA7C,gBACE;IACE,SAAS,EAAEzH,IAAI,CACbsB,OAAO,CAACoG,aADK,EAEb3F,EAAE,GAAG,IAAH,GAAU,KAFC,EAGbL,UAAU,GAAG,YAAH,GAAkB,eAHf,EAIbW,OAJa,CADjB;IAOE,GAAG,EAAEM,OAAO,CAACC,GAPf;IAQE,GAAG,EAAED,OAAO,CAACE,KARf;IASE,GAAG,EAAG,SAAQF,OAAO,CAACE,KAAM;EAT9B,EADF,CADF,CADD,CAJH,CAXF,EAiCG,CAACd,EAAE,IAAIF,cAAP,kBACC;IAAK,SAAS,EAAE7B,IAAI,CAACsB,OAAO,CAACqG,UAAT,EAAqB,CAAC5F,EAAtB,IAA2B,KAA3B;EAApB,gBACE,8CACE,oBAAC,IAAD;IAAM,EAAE,EAAEqB,UAAU,IAAIhB;EAAxB,gBACE,oBAAC,QAAD;IACE,GAAG,EAAEsC,YADP;IAEE,SAAS,EAAEpD,OAAO,CAACmC,MAFrB;IAGE,IAAI,MAHN;IAIE,cAAW,WAJb;IAKE,OAAO,EAAGqB,KAAD,IAAW2B,aAAa,CAAC3B,KAAD;EALnC,4CAOE,oBAAC,SAAD,OAPF,EADF,CADF,CADF,eAcE,8CACE,oBAAC,IAAD;IAAM,EAAE,EAAE1B,UAAU,IAAIhB;EAAxB,gBACE,oBAAC,QAAD;IACE,GAAG,EAAEuC,WADP;IAEE,SAAS,EAAErD,OAAO,CAACmC,MAFrB;IAGE,IAAI,MAHN;IAIE,cAAW,UAJb;IAKE,OAAO,EAAGqB,KAAD,IAAWyB,SAAS,CAACzB,KAAD;EAL/B,0CAOE,oBAAC,QAAD,OAPF,EADF,CADF,CAdF,CAlCJ,EA+DG/C,EAAE,iBACD;IAAK,SAAS,EAAET,OAAO,CAACsG;EAAxB,GACGrG,SAAS,CACPmB,GADF,CACM,CAACC,OAAD,EAAUoC,KAAV,kBACH;IACE,SAAS,EAAE+B,UAAU,CAAC/B,KAAD,CADvB;IAEE,KAAK,EAAEH,UAFT;IAGE,GAAG,EAAG,UAASjC,OAAO,CAACE,KAAM;EAH/B,EAFH,EAQEgF,KARF,CAQQ/E,UARR,EAQoBA,UAAU,GAAG,CARjC,CADH,CAhEJ,EA4EGb,OAAO,iBACN;IAAK,SAAS,EAAEjC,IAAI,CAACsB,OAAO,CAACwG,UAAT,EAAqB,CAAC/F,EAAtB,IAA2B,KAA3B;EAApB,gBACE;IAAM,SAAS,EAAET,OAAO,CAACW;EAAzB,gBACE,oBAAC,YAAD;IAAc,OAAO,EAAC,YAAtB;IAAmC,KAAK,EAAE;MAAE8F,KAAK,EAAE;IAAT;EAA1C,GACI,GAAE/E,QAAQ,GAAG,CAAE,IAAGzB,SAAS,CAAC+E,MAAO,EADvC,CADF,CADF,CA7EJ,CAjCF,EAuHG,CAACvE,EAAD,iBACC,0CACGF,cAAc,gBACb;IAAK,SAAS,EAAEP,OAAO,CAAC0G;EAAxB,GACGzG,SAAS,CAACmB,GAAV,CAAc,CAACC,OAAD,EAAUoC,KAAV,kBACb;IACE,SAAS,EAAE+B,UAAU,CAAC/B,KAAD,CADvB;IAEE,KAAK,EAAG,GAAEH,UAAW,IAAGG,KAAM,EAFhC;IAGE,GAAG,EAAG,UAASpC,OAAO,CAACE,KAAM;EAH/B,EADD,CADH,CADa,gBAWb,oBAAC,MAAD;IACE,SAAS,EAAE7C,IAAI,CAACsB,OAAO,CAAC2G,aAAT,CADjB;IAEE,SAAS,MAFX;IAGE,cAAc,EAAC,eAHjB;IAIE,UAAU,EAAC;EAJb,gBAME,oBAAC,MAAD;IAAQ,IAAI;EAAZ,gBACE,oBAAC,QAAD;IACE,SAAS,EAAEnG,gBAAgB,IAAIkB,QAAQ,KAAK,CAAjC,GAAqC,EAArC,GAA0C1B,OAAO,CAAC4G,MAD/D;IAEE,GAAG,EAAExD,YAFP;IAGE,IAAI,MAHN;IAIE,cAAW,WAJb;IAKE,OAAO,EAAGI,KAAD,IAAW2B,aAAa,CAAC3B,KAAD;EALnC,8CAOE,oBAAC,SAAD,OAPF,EADF,CANF,eAiBE,oBAAC,MAAD;IAAQ,IAAI;EAAZ,gBACE,oBAAC,YAAD;IAAc,OAAO,EAAC,eAAtB;IAAsC,SAAS,EAAC;EAAhD,GACG9B,QAAQ,GAAG,CADd,CADF,eAIE,oBAAC,YAAD;IAAc,OAAO,EAAC,YAAtB;IAAmC,SAAS,EAAC;EAA7C,GACI,OAAMzB,SAAS,CAAC+E,MAAO,EAD3B,CAJF,CAjBF,eAyBE,oBAAC,MAAD;IAAQ,IAAI;EAAZ,gBACE,oBAAC,QAAD;IACE,SAAS,EACPxE,gBAAgB,IAAIkB,QAAQ,KAAKzB,SAAS,CAAC+E,MAAV,GAAmB,CAApD,GAAwD,EAAxD,GAA6DhF,OAAO,CAAC4G,MAFzE;IAIE,GAAG,EAAEvD,WAJP;IAKE,IAAI,MALN;IAME,cAAW,UANb;IAOE,OAAO,EAAGG,KAAD,IAAWyB,SAAS,CAACzB,KAAD;EAP/B,4CASE,oBAAC,QAAD,OATF,EADF,CAzBF,CAZJ,EAoDGlD,UAAU,iBACT,oBAAC,OAAD;IAAS,SAAS,EAAEN,OAAO,CAACmE,KAA5B;IAAmC,EAAE,EAAExF,KAAK,CAACsC,SAAD,EAAY,OAAZ;EAA5C,gBACE,oBAAC,OAAD;IAAS,GAAG,EAAC,YAAb;IAA0B,SAAS,EAAC,KAApC;IAA0C,OAAO,EAAC,IAAlD;IAAuD,cAAc;EAArE,GACGhB,SAAS,CAACmB,GAAV,CAAc,CAACC,OAAD,EAAUwF,CAAV,kBACb,oBAAC,MAAD;IACE,EAAE,EAAExF,OAAO,CAACE,KADd;IAEE,GAAG,EAAG,UAASF,OAAO,CAACE,KAAM,EAF/B;IAGE,SAAS,EAAEvB,OAAO,CAAC8G,eAHrB;IAIE,OAAO,EAAE,MAAMnF,QAAQ,CAACkF,CAAD;EAJzB,gBAME;IACE,SAAS,EAAExB,cAAc,CAACwB,CAAD,CAD3B;IAEE,GAAG,EAAExF,OAAO,CAACC,GAFf;IAGE,GAAG,EAAED,OAAO,CAACE,KAHf;IAIE,GAAG,EAAG,aAAYF,OAAO,CAACE,KAAM;EAJlC,EANF,CADD,CADH,CADF,CArDJ,CAxHJ,CADF;AAsMD,CArYD;;AAuYA,wCAAA1B,eAAe,CAACkH,SAAhB,GAA4B;EAC1B;AACF;AACA;EACEhH,SAAS,EAAEtB,SAAS,CAACuI,MAJK;;EAK1B;AACF;AACA;EACEhH,OAAO,EAAEvB,SAAS,CAACwI,KAAV,CAAgB;IACvB;AACJ;AACA;IACIrB,IAAI,EAAEnH,SAAS,CAACuI,MAJO;;IAKvB;AACJ;AACA;IACIZ,aAAa,EAAE3H,SAAS,CAACuI,MARF;;IASvB;AACJ;AACA;IACIE,MAAM,EAAEzI,SAAS,CAACuI,MAZK;;IAavB;AACJ;AACA;IACIG,OAAO,EAAE1I,SAAS,CAACuI,MAhBI;;IAiBvB;AACJ;AACA;IACIN,OAAO,EAAEjI,SAAS,CAACuI,MApBI;;IAqBvB;AACJ;AACA;IACIV,SAAS,EAAE7H,SAAS,CAACuI,MAxBE;;IAyBvB;AACJ;AACA;IACIJ,MAAM,EAAEnI,SAAS,CAACuI,MA5BK;;IA6BvB;AACJ;AACA;IACI9G,KAAK,EAAEzB,SAAS,CAACuI,MAhCM;;IAiCvB;AACJ;AACA;IACIrG,OAAO,EAAElC,SAAS,CAACuI,MApCI;;IAqCvB;AACJ;AACA;IACIR,UAAU,EAAE/H,SAAS,CAACuI,MAxCC;;IAyCvB;AACJ;AACA;IACI1B,GAAG,EAAE7G,SAAS,CAACuI,MA5CQ;;IA6CvB;AACJ;AACA;IACIzB,iBAAiB,EAAE9G,SAAS,CAACuI,MAhDN;;IAiDvB;AACJ;AACA;IACIF,eAAe,EAAErI,SAAS,CAACuI,MApDJ;;IAqDvB;AACJ;AACA;IACIrB,UAAU,EAAElH,SAAS,CAACuI,MAxDC;;IAyDvB;AACJ;AACA;IACItB,cAAc,EAAEjH,SAAS,CAACuI,MA5DH;;IA6DvB;AACJ;AACA;IACIvB,gBAAgB,EAAEhH,SAAS,CAACuI,MAhEL;;IAiEvB;AACJ;AACA;IACIX,UAAU,EAAE5H,SAAS,CAACuI,MApEC;;IAqEvB;AACJ;AACA;IACIjB,cAAc,EAAEtH,SAAS,CAACuI,MAxEH;;IAyEvB;AACJ;AACA;IACIhB,KAAK,EAAEvH,SAAS,CAACuI,MA5EM;;IA6EvB;AACJ;AACA;IACIL,aAAa,EAAElI,SAAS,CAACuI,MAhFF;;IAiFvB;AACJ;AACA;IACInB,eAAe,EAAEpH,SAAS,CAACuI,MApFJ;;IAqFvB;AACJ;AACA;IACIlB,WAAW,EAAErH,SAAS,CAACuI,MAxFA;;IAyFvB;AACJ;AACA;IACI7E,MAAM,EAAE1D,SAAS,CAACuI,MA5FK;;IA6FvB;AACJ;AACA;IACI7C,KAAK,EAAE1F,SAAS,CAACuI;EAhGM,CAAhB,EAiGNI,UAzGuB;;EA0G1B;AACF;AACA;EACEnH,SAAS,EAAExB,SAAS,CAAC4I,KAAV,CAAgBD,UA7GD;;EA8G1B;AACF;AACA;EACElH,KAAK,EAAEzB,SAAS,CAAC6I,IAjHS;;EAkH1B;AACF;AACA;EACE5G,QAAQ,EAAEjC,SAAS,CAAC8I,IArHM;;EAsH1B;AACF;AACA;EACEpH,EAAE,EAAE1B,SAAS,CAACuI,MAzHY;;EA0H1B;AACF;AACA;EACE1G,UAAU,EAAE7B,SAAS,CAAC+I,IA7HI;;EA8H1B;AACF;AACA;EACEjH,cAAc,EAAE9B,SAAS,CAAC+I,IAjIA;;EAkI1B;AACF;AACA;EACEhH,gBAAgB,EAAE/B,SAAS,CAAC+I,IArIF;;EAsI1B;AACF;AACA;EACE7G,OAAO,EAAElC,SAAS,CAAC+I,IAzIO;;EA0I1B;AACF;AACA;EACEpH,UAAU,EAAE3B,SAAS,CAAC+I,IA7II;;EA8I1B;AACF;AACA;EACE5G,WAAW,EAAEnC,SAAS,CAACgJ,MAjJG;;EAkJ1B;AACF;AACA;EACE5G,cAAc,EAAEpC,SAAS,CAAC8I,IArJA;;EAsJ1B;AACF;AACA;EACE9G,EAAE,EAAEhC,SAAS,CAAC+I,IAzJY;;EA0J1B;AACF;AACA;EACE1G,aAAa,EAAErC,SAAS,CAAC+I,IA7JC;;EA8J1B;AACF;AACA;EACEzG,OAAO,EAAEtC,SAAS,CAACuI;AAjKO,CAA5B;AAoKA,eAAe1H,UAAU,CAACM,MAAD,EAAS;EAAE8H,IAAI,EAAE;AAAR,CAAT,CAAV,CAAgD7H,eAAhD,CAAf"}
+{"version":3,"file":"ImageCarousel.js","names":["React","useState","useRef","useEffect","useCallback","PropTypes","clsx","setId","useUniqueId","HvButton","HvContainer","HvTypography","HvGrid","HvStack","HvPanel","useScrollTo","Button","Fade","withStyles","makeStyles","Backwards","Forwards","Close","Fullscreen","styles","HvImageCarousel","props","className","classes","documents","title","id","fullscreen","fullscreenProp","thumbnails","lowCardinality","infiniteCarousel","xs","onChange","counter","currentStep","setCurrentStep","visibleArrows","variant","others","elementId","setFullscreen","options","map","element","src","value","sliceStart","setSliceStart","selImage","setImage","offset","setOffset","imageHover","setImageHover","direction","useStyles","theme","button","backgroundColor","hv","palette","atmosphere","atmo3","imageBox","minWidth","display","justifyContent","allImages","width","style","selectedIndex","setScrollTo","selectedBigIndex","setBigScrollTo","refBackwards","refForwards","typeCircle","handleSelection","event","index","wrappedOnChange","handleFocus","focus","current","handleBigSelection","handleVisibility","image","document","getElementById","panel","container","containerWidth","offsetWidth","offsetPanel","offsetLeft","offsetImage","imageWidth","scroll","scrollLeft","activeElement","undefined","changeSlice","length","nextImage","next","previousImage","previous","styleThumbnail","img","thumbnailSelected","circleType","xsSelectedCircle","selectedCircle","miniCircle","root","fullscreenStyle","closeButton","imageContainer","stack","appear","enter","exit","selectedImage","lowButtons","xsCircles","slice","divCounter","color","circles","normalButtons","hidden","i","thumbnailButton","propTypes","string","shape","xsMode","xsImage","isRequired","array","node","func","bool","number","name"],"sources":["../../../src/ImageCarousel/ImageCarousel.js"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport {\n  setId,\n  useUniqueId,\n  HvButton,\n  HvContainer,\n  HvTypography,\n  HvGrid,\n  HvStack,\n  HvPanel,\n  useScrollTo,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { Button, Fade } from \"@mui/material\";\nimport { withStyles, makeStyles } from \"@mui/styles\";\n\nimport { Backwards, Forwards, Close, Fullscreen } from \"@hitachivantara/uikit-react-icons\";\n\nimport styles from \"./styles\";\n/**\n * ImageCarousel description/documentation paragraph\n */\nconst HvImageCarousel = (props) => {\n  const {\n    className,\n    classes,\n    documents,\n    title,\n    id,\n    fullscreen: fullscreenProp = false,\n    thumbnails = false,\n    lowCardinality = false,\n    infiniteCarousel = false,\n    xs = false,\n    onChange,\n    counter = false,\n    currentStep = 0,\n    setCurrentStep,\n    visibleArrows = false,\n    variant = \"contain\",\n    ...others\n  } = props;\n  const elementId = useUniqueId(id, \"hvcarousel\");\n  const [fullscreen, setFullscreen] = useState(false);\n  const options = documents.map((element) => ({\n    src: element.src,\n    value: setId(elementId, element.value),\n  }));\n\n  const [sliceStart, setSliceStart] = useState(0);\n  const [selImage, setImage] = useState(currentStep);\n  const [offset, setOffset] = useState(0);\n  const [imageHover, setImageHover] = useState(false);\n  let direction = \"next\";\n  const useStyles = makeStyles((theme) => ({\n    button: {\n      backgroundColor: theme.hv.palette.atmosphere.atmo3,\n    },\n    imageBox: {\n      minWidth: \"100%\",\n      display: \"flex\",\n      justifyContent: \"center\",\n    },\n    allImages: {\n      width: \"max-content\",\n      display: \"flex\",\n    },\n  }));\n  const style = useStyles();\n\n  const [selectedIndex, setScrollTo] = useScrollTo(\n    0,\n    setId(elementId, \"panel\"),\n    false,\n    100,\n    documents,\n    onChange,\n    \"row\"\n  );\n  const [selectedBigIndex, setBigScrollTo] = useScrollTo(\n    0,\n    setId(elementId, \"bigPanel\"),\n    false,\n    0,\n    options,\n    onChange,\n    \"row\"\n  );\n  const refBackwards = useRef(null);\n  const refForwards = useRef(null);\n  let typeCircle = \"circle\";\n\n  const handleSelection = useCallback(\n    (event, value, index) => {\n      const wrappedOnChange = () => {\n        onChange?.(event, index);\n      };\n      setScrollTo(event, value, index, wrappedOnChange);\n    },\n    [onChange, setScrollTo]\n  );\n\n  const handleFocus = (focus) => {\n    if (focus === refBackwards.current || focus === refForwards.current) focus.focus();\n  };\n\n  const handleBigSelection = useCallback(\n    (event, value, index) => {\n      const wrappedOnChange = () => {\n        onChange?.(event, index);\n      };\n      setBigScrollTo(event, value, index, wrappedOnChange);\n    },\n    [onChange, setBigScrollTo]\n  );\n\n  const handleVisibility = useCallback(\n    (event, value, index) => {\n      const image = document.getElementById(value);\n      const panel = document.getElementById(setId(elementId, \"panel\"));\n      const container = document.getElementById(setId(elementId, \"container\"));\n      const containerWidth = container.offsetWidth;\n      const offsetPanel = panel.offsetLeft;\n      const offsetImage = image.offsetLeft;\n      const imageWidth = image.offsetWidth;\n      const scroll = panel.scrollLeft;\n      const focus = document.activeElement;\n\n      if (\n        offsetPanel + offsetImage + offset + imageWidth - scroll > containerWidth ||\n        offsetImage - scroll < 0\n      ) {\n        handleSelection(event, value, index);\n        handleFocus(focus);\n      }\n    },\n    [elementId, handleSelection, offset]\n  );\n\n  useEffect(() => {\n    setCurrentStep?.(selImage);\n  }, [selImage, setCurrentStep]);\n\n  useEffect(() => {\n    if (fullscreen) setOffset(150);\n    else setOffset(0);\n\n    if (thumbnails) {\n      handleVisibility(undefined, documents[selImage].value, selImage, selectedIndex);\n    }\n    handleBigSelection(undefined, options[selImage].value, selImage, selectedBigIndex);\n  }, [\n    documents,\n    fullscreen,\n    handleBigSelection,\n    handleVisibility,\n    options,\n    selImage,\n    selectedBigIndex,\n    selectedIndex,\n    thumbnails,\n  ]);\n\n  const changeSlice = () => {\n    if (direction === \"next\") {\n      if (infiniteCarousel && selImage === documents.length - 1) setSliceStart(0);\n      else if (selImage > sliceStart + 2 && selImage !== documents.length - 2)\n        setSliceStart(sliceStart + 1);\n    }\n    if (direction === \"prev\") {\n      if (infiniteCarousel && selImage === 0)\n        setSliceStart(documents.length > 5 ? documents.length - 5 : 0);\n      else if (selImage < sliceStart + 2 && selImage !== 1) setSliceStart(sliceStart - 1);\n    }\n  };\n\n  const nextImage = () => {\n    let next;\n    if (selImage !== documents.length - 1) next = selImage + 1;\n    else if (infiniteCarousel) next = 0;\n    setImage(next);\n    if (xs) {\n      direction = \"next\";\n      changeSlice();\n    }\n  };\n\n  const previousImage = () => {\n    let previous;\n    if (selImage !== 0) previous = selImage - 1;\n    else if (infiniteCarousel) previous = documents.length - 1;\n    setImage(previous);\n    if (xs) {\n      direction = \"prev\";\n      changeSlice();\n    }\n  };\n\n  const styleThumbnail = (index) => {\n    if (index !== selImage) return classes.img;\n    return classes.thumbnailSelected;\n  };\n\n  const circleType = (index) => {\n    if (index === selImage) {\n      typeCircle = \"BigCircle\";\n      if (xs) return classes.xsSelectedCircle;\n      return classes.selectedCircle;\n    }\n    typeCircle = \"Circle\";\n    return classes.miniCircle;\n  };\n\n  return (\n    <HvContainer\n      id={setId(elementId, \"container\")}\n      className={clsx(\n        className,\n        classes.root,\n        fullscreen ? classes.fullscreenStyle : \"\",\n        xs ? \"xs\" : \"nxs\"\n      )}\n      {...others}\n    >\n      {!xs && (\n        <div className={classes.title}>\n          <div>{title}</div>\n          {fullscreenProp && (\n            <div>\n              {fullscreen ? (\n                <HvButton\n                  className={classes.closeButton}\n                  icon\n                  aria-label=\"Close\"\n                  onClick={() => setFullscreen(!fullscreen)}\n                >\n                  <Close />\n                </HvButton>\n              ) : (\n                <HvButton icon aria-label=\"Fullscreen\" onClick={() => setFullscreen(true)}>\n                  <Fullscreen />\n                </HvButton>\n              )}\n            </div>\n          )}\n        </div>\n      )}\n      <HvContainer\n        className={clsx(\n          classes.imageContainer,\n          !xs ? \"nxs\" : \"\",\n          fullscreen ? \"fullscreen\" : \"notFullscreen\"\n        )}\n        onFocus={() => setImageHover(true)}\n        onMouseOver={() => setImageHover(true)}\n        onBlur={() => setImageHover(false)}\n        onMouseOut={() => setImageHover(false)}\n      >\n        <HvPanel\n          className={clsx(classes.stack, xs ? \"xs\" : \"nxs\")}\n          id={setId(elementId, \"bigPanel\")}\n        >\n          {options.map((element, index) => (\n            <div className={style.imageBox} id={element.value} key={`div ${element.value}`}>\n              <Fade in={selImage === index || xs} timeout={{ appear: 500, enter: 1200, exit: 200 }}>\n                <img\n                  className={clsx(\n                    classes.selectedImage,\n                    xs ? \"xs\" : \"nxs\",\n                    fullscreen ? \"fullscreen\" : \"notFullscreen\",\n                    variant\n                  )}\n                  src={element.src}\n                  alt={element.value}\n                  key={`image ${element.value}`}\n                />\n              </Fade>\n            </div>\n          ))}\n        </HvPanel>\n        {(xs || lowCardinality) && (\n          <div className={clsx(classes.lowButtons, !xs ? \"nxs\" : \"\")}>\n            <div>\n              <Fade in={imageHover || visibleArrows}>\n                <HvButton\n                  ref={refBackwards}\n                  className={classes.button}\n                  icon\n                  aria-label=\"Backwards\"\n                  onClick={(event) => previousImage(event)}\n                >\n                  <Backwards />\n                </HvButton>\n              </Fade>\n            </div>\n            <div>\n              <Fade in={imageHover || visibleArrows}>\n                <HvButton\n                  ref={refForwards}\n                  className={classes.button}\n                  icon\n                  aria-label=\"Forwards\"\n                  onClick={(event) => nextImage(event)}\n                >\n                  <Forwards />\n                </HvButton>\n              </Fade>\n            </div>\n          </div>\n        )}\n        {xs && (\n          <div className={classes.xsCircles}>\n            {documents\n              .map((element, index) => (\n                <span\n                  className={circleType(index)}\n                  title={typeCircle}\n                  key={`Circle ${element.value}`}\n                />\n              ))\n              .slice(sliceStart, sliceStart + 5)}\n          </div>\n        )}\n        {counter && (\n          <div className={clsx(classes.divCounter, !xs ? \"nxs\" : \"\")}>\n            <span className={classes.counter}>\n              <HvTypography variant=\"normalText\" style={{ color: \"white\" }}>\n                {`${selImage + 1}/${documents.length}`}\n              </HvTypography>\n            </span>\n          </div>\n        )}\n      </HvContainer>\n      {!xs && (\n        <>\n          {lowCardinality ? (\n            <div className={classes.circles}>\n              {documents.map((element, index) => (\n                <span\n                  className={circleType(index)}\n                  title={`${typeCircle} ${index}`}\n                  key={`Circle ${element.value}`}\n                />\n              ))}\n            </div>\n          ) : (\n            <HvGrid\n              className={clsx(classes.normalButtons)}\n              container\n              justifyContent=\"space-between\"\n              alignItems=\"center\"\n            >\n              <HvGrid item>\n                <HvButton\n                  className={infiniteCarousel || selImage !== 0 ? \"\" : classes.hidden}\n                  ref={refBackwards}\n                  icon\n                  aria-label=\"Backwards\"\n                  onClick={(event) => previousImage(event)}\n                >\n                  <Backwards />\n                </HvButton>\n              </HvGrid>\n              <HvGrid item>\n                <HvTypography variant=\"highlightText\" component=\"a\">\n                  {selImage + 1}\n                </HvTypography>\n                <HvTypography variant=\"normalText\" component=\"a\">\n                  {` /  ${documents.length}`}\n                </HvTypography>\n              </HvGrid>\n              <HvGrid item>\n                <HvButton\n                  className={\n                    infiniteCarousel || selImage !== documents.length - 1 ? \"\" : classes.hidden\n                  }\n                  ref={refForwards}\n                  icon\n                  aria-label=\"Forwards\"\n                  onClick={(event) => nextImage(event)}\n                >\n                  <Forwards />\n                </HvButton>\n              </HvGrid>\n            </HvGrid>\n          )}\n          {thumbnails && (\n            <HvPanel className={classes.panel} id={setId(elementId, \"panel\")}>\n              <HvStack key=\"Thumbnails\" direction=\"row\" spacing=\"xs\" withNavigation>\n                {documents.map((element, i) => (\n                  <Button\n                    id={element.value}\n                    key={`Button ${element.value}`}\n                    className={classes.thumbnailButton}\n                    onClick={() => setImage(i)}\n                  >\n                    <img\n                      className={styleThumbnail(i)}\n                      src={element.src}\n                      alt={element.value}\n                      key={`Thumbnail ${element.value}`}\n                    />\n                  </Button>\n                ))}\n              </HvStack>\n            </HvPanel>\n          )}\n        </>\n      )}\n    </HvContainer>\n  );\n};\n\nHvImageCarousel.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the component SelectedImage.\n     */\n    selectedImage: PropTypes.string,\n    /**\n     * Styles applied to xs mode\n     */\n    xsMode: PropTypes.string,\n    /**\n     * Styles applied to image in xsMode\n     */\n    xsImage: PropTypes.string,\n    /**\n     * Styles applied to panel with low cardinality circles\n     */\n    circles: PropTypes.string,\n    /**\n     * Styles applied to xs mode circles\n     */\n    xsCircles: PropTypes.string,\n    /**\n     * Styles applied to unavailable button\n     */\n    hidden: PropTypes.string,\n    /**\n     * Styles applied to the carousel title\n     */\n    title: PropTypes.string,\n    /**\n     * Styles applied to the counter\n     */\n    counter: PropTypes.string,\n    /**\n     * Styles applied to the div with the counter\n     */\n    divCounter: PropTypes.string,\n    /**\n     * Styles applied to the thumbnails\n     */\n    img: PropTypes.string,\n    /**\n     * Styles applied to the selected thumbnail\n     */\n    thumbnailSelected: PropTypes.string,\n    /**\n     * Styles applied to the thumbnail button\n     */\n    thumbnailButton: PropTypes.string,\n    /**\n     * Styles applied to the low cardinality circles\n     */\n    miniCircle: PropTypes.string,\n    /**\n     * Styles applied to the circle of the selected image\n     */\n    selectedCircle: PropTypes.string,\n    /**\n     * Styles applied to the circle of the selected image in xsmode\n     */\n    xsSelectedCircle: PropTypes.string,\n    /**\n     * Styles applied to the panel with low cardinality buttons\n     */\n    lowButtons: PropTypes.string,\n    /**\n     * Styles applied to the container of the selected image\n     */\n    imageContainer: PropTypes.string,\n    /**\n     * Styles applied to the panel with the thumbnails\n     */\n    stack: PropTypes.string,\n    /**\n     * Styles applied to the panel that contains the buttons and counter in default mode\n     */\n    normalButtons: PropTypes.string,\n    /**\n     * Styles applied to fullscreen mode.\n     */\n    fullscreenStyle: PropTypes.string,\n    /**\n     * Styles applied to close button in fullscreen mode.\n     */\n    closeButton: PropTypes.string,\n    /**\n     * Styles applied to change image buttons.\n     */\n    button: PropTypes.string,\n    /**\n     * Styles applied to thumbnails panel.\n     */\n    panel: PropTypes.string,\n  }).isRequired,\n  /**\n   * Documents to be displayed.\n   */\n  documents: PropTypes.array.isRequired,\n  /**\n   * Title of the image carousel\n   */\n  title: PropTypes.node,\n  /**\n   * A function called each time the selected image changes.\n   */\n  onChange: PropTypes.func,\n  /**\n   * Id to be applied to the root node.\n   */\n  id: PropTypes.string,\n  /**\n   * A flag that activates the thumbnails.\n   */\n  thumbnails: PropTypes.bool,\n  /**\n   * A flag that switches to low cardinality mode\n   */\n  lowCardinality: PropTypes.bool,\n  /**\n   * A flag that activates the infinite carousel behavior\n   */\n  infiniteCarousel: PropTypes.bool,\n  /**\n   * A flag that activates a counter on the top right corner of the selected image\n   */\n  counter: PropTypes.bool,\n  /**\n   * Set Image Carousel to fullscreen mode\n   */\n  fullscreen: PropTypes.bool,\n  /**\n   * Set selected image to a particular image in documents\n   */\n  currentStep: PropTypes.number,\n  /**\n   * Function that changes the selected image\n   */\n  setCurrentStep: PropTypes.func,\n  /**\n   * Image Carousel set to xs mode\n   */\n  xs: PropTypes.bool,\n  /**\n   * Arrows always displayed in low cardinality or xs mode\n   */\n  visibleArrows: PropTypes.bool,\n  /**\n   * Selected image fit variant\n   */\n  variant: PropTypes.string,\n};\n\nexport default withStyles(styles, { name: \"HvImageCarousel\" })(HvImageCarousel);\n"],"mappings":"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"}

package/dist/modern/InlineEditor/InlineEditor.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { StandardProps } from "@material-ui/core";
+import { StandardProps } from "@mui/material";
 import {
   HvBaseInputProps,
   HvButtonProps,

package/dist/modern/InlineEditor/InlineEditor.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 const _excluded = ["className", "classes", "value", "defaultValue", "showIcon", "component", "variant", "placeholder", "onBlur", "onChange", "onKeyDown", "buttonProps", "typographyProps"];
@@ -11,7 +10,7 @@ import "core-js/modules/web.dom-collections.iterator.js";
 import React, { useLayoutEffect, useRef, useState } from "react";
 import PropTypes from "prop-types";
 import clsx from "clsx";
-import { withStyles, useTheme } from "@material-ui/core";
+import { withStyles, useTheme } from "@mui/styles";
 import { HvButton, HvInput, HvTypography, isKeypress, KeyboardCodes, useControlled } from "@hitachivantara/uikit-react-core";
 import { Edit } from "@hitachivantara/uikit-react-icons";
 import styles from "./styles";
@@ -20,6 +19,9 @@ import styles from "./styles";
  * between viewing and editing, making it an efficient method of updating a record.
  */
 
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+
 const HvInlineEditor = props => {
   const {
     className,
@@ -83,37 +85,42 @@ const HvInlineEditor = props => {
     onChange === null || onChange === void 0 ? void 0 : onChange(event, val);
   };
 
-  return /*#__PURE__*/React.createElement("div", {
-    className: clsx(className, classes.root)
-  }, editMode ? /*#__PURE__*/React.createElement(InputComponent, _extends({
-    inputRef: inputRef,
-    classes: {
-      root: classes.inputRoot,
-      input: classes.input,
-      inputBorderContainer: classes.inputBorderContainer
-    },
-    inputProps: {
-      style: _objectSpread(_objectSpread({}, typographyStyles), {}, {
-        height: InputComponent === HvInput ? lineHeight : undefined
-      })
-    },
-    value: value,
-    onBlur: handleBlur,
-    onChange: handleChange,
-    onKeyDown: handleKeyDown
-  }, others)) : /*#__PURE__*/React.createElement(HvButton, _extends({
-    category: "ghost",
-    overrideIconColors: false,
-    className: clsx(classes.button, parseInt(lineHeight, 10) >= 28 && classes.largeText),
-    onClick: handleClick
-  }, buttonProps), /*#__PURE__*/React.createElement(HvTypography, _extends({
-    variant: variant,
-    className: clsx(classes.text, !value && classes.textEmpty)
-  }, typographyProps), value || placeholder), /*#__PURE__*/React.createElement(Edit, {
-    color: "atmo5",
-    role: "presentation",
-    className: clsx(classes.icon, showIcon && classes.iconVisible)
-  })));
+  return /*#__PURE__*/_jsx("div", {
+    className: clsx(className, classes.root),
+    children: editMode ? /*#__PURE__*/_jsx(InputComponent, _objectSpread({
+      inputRef: inputRef,
+      classes: {
+        root: classes.inputRoot,
+        input: classes.input,
+        inputBorderContainer: classes.inputBorderContainer
+      },
+      inputProps: {
+        style: _objectSpread(_objectSpread({}, typographyStyles), {}, {
+          height: InputComponent === HvInput ? lineHeight : undefined
+        })
+      },
+      value: value,
+      onBlur: handleBlur,
+      onChange: handleChange,
+      onKeyDown: handleKeyDown
+    }, others)) : /*#__PURE__*/_jsxs(HvButton, _objectSpread(_objectSpread({
+      category: "ghost",
+      overrideIconColors: false,
+      className: clsx(classes.button, parseInt(lineHeight, 10) >= 28 && classes.largeText),
+      onClick: handleClick
+    }, buttonProps), {}, {
+      children: [/*#__PURE__*/_jsx(HvTypography, _objectSpread(_objectSpread({
+        variant: variant,
+        className: clsx(classes.text, !value && classes.textEmpty)
+      }, typographyProps), {}, {
+        children: value || placeholder
+      })), /*#__PURE__*/_jsx(Edit, {
+        color: "atmo5",
+        role: "presentation",
+        className: clsx(classes.icon, showIcon && classes.iconVisible)
+      })]
+    }))
+  });
 };
 
 process.env.NODE_ENV !== "production" ? HvInlineEditor.propTypes = {

package/dist/modern/InlineEditor/InlineEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineEditor.js","names":["React","useLayoutEffect","useRef","useState","PropTypes","clsx","withStyles","useTheme","HvButton","HvInput","HvTypography","isKeypress","KeyboardCodes","useControlled","Edit","styles","HvInlineEditor","props","className","classes","value","valueProp","defaultValue","showIcon","component","InputComponent","variant","placeholder","onBlur","onChange","onKeyDown","buttonProps","typographyProps","others","setValue","editMode","setEditMode","cachedValue","setCachedValue","inputRef","theme","typographyStyles","hv","typography","lineHeight","input","current","focus","select","handleClick","handleBlur","event","newValue","handleKeyDown","Esc","handleChange","val","root","inputRoot","inputBorderContainer","style","height","undefined","button","parseInt","largeText","text","textEmpty","icon","iconVisible","propTypes","string","shape","isRequired","bool","elementType","func","instanceOf","Object","name"],"sources":["../../../src/InlineEditor/InlineEditor.js"],"sourcesContent":["import React, { useLayoutEffect, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { withStyles, useTheme } from \"@material-ui/core\";\nimport {\n  HvButton,\n  HvInput,\n  HvTypography,\n  isKeypress,\n  KeyboardCodes,\n  useControlled,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Edit } from \"@hitachivantara/uikit-react-icons\";\n\nimport styles from \"./styles\";\n\n/**\n * An Inline Editor allows the user to edit a record without making a major switch\n * between viewing and editing, making it an efficient method of updating a record.\n */\nconst HvInlineEditor = (props) => {\n  const {\n    className,\n    classes,\n    value: valueProp,\n    defaultValue,\n    showIcon,\n    component: InputComponent = HvInput,\n    variant = \"normalText\",\n    placeholder = \"Enter text\",\n    onBlur,\n    onChange,\n    onKeyDown,\n    buttonProps,\n    typographyProps,\n    ...others\n  } = props;\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n  const [editMode, setEditMode] = useState(false);\n  const [cachedValue, setCachedValue] = useState(value);\n  const inputRef = useRef();\n  const theme = useTheme();\n\n  const typographyStyles = theme.hv.typography[variant] || {};\n  const { lineHeight } = typographyStyles;\n\n  useLayoutEffect(() => {\n    const input = inputRef.current;\n    if (editMode && input) {\n      input.focus();\n      input.select();\n    }\n  }, [editMode]);\n\n  const handleClick = () => {\n    setEditMode(true);\n    setCachedValue(value);\n  };\n\n  const handleBlur = (event) => {\n    setEditMode(false);\n\n    const newValue = value || cachedValue; // empty values should be ignored\n    setValue(newValue);\n    onBlur?.(event, newValue);\n  };\n\n  const handleKeyDown = (event) => {\n    if (isKeypress(event, KeyboardCodes.Esc)) {\n      setEditMode(false);\n      setValue(cachedValue);\n    }\n    onKeyDown?.(event);\n  };\n\n  const handleChange = (event, val) => {\n    setValue(val);\n    onChange?.(event, val);\n  };\n\n  return (\n    <div className={clsx(className, classes.root)}>\n      {editMode ? (\n        <InputComponent\n          inputRef={inputRef}\n          classes={{\n            root: classes.inputRoot,\n            input: classes.input,\n            inputBorderContainer: classes.inputBorderContainer,\n          }}\n          inputProps={{\n            style: {\n              ...typographyStyles,\n              height: InputComponent === HvInput ? lineHeight : undefined,\n            },\n          }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          {...others}\n        />\n      ) : (\n        <HvButton\n          category=\"ghost\"\n          overrideIconColors={false}\n          className={clsx(classes.button, {\n            [classes.largeText]: parseInt(lineHeight, 10) >= 28,\n          })}\n          onClick={handleClick}\n          {...buttonProps}\n        >\n          <HvTypography\n            variant={variant}\n            className={clsx(classes.text, { [classes.textEmpty]: !value })}\n            {...typographyProps}\n          >\n            {value || placeholder}\n          </HvTypography>\n          <Edit\n            color=\"atmo5\"\n            role=\"presentation\"\n            className={clsx(classes.icon, {\n              [classes.iconVisible]: showIcon,\n            })}\n          />\n        </HvButton>\n      )}\n    </div>\n  );\n};\n\nHvInlineEditor.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes: PropTypes.shape({\n    root: PropTypes.string,\n    input: PropTypes.string,\n    inputRoot: PropTypes.string,\n    inputBorderContainer: PropTypes.string,\n    text: PropTypes.string,\n    textEmpty: PropTypes.string,\n    button: PropTypes.string,\n    icon: PropTypes.string,\n    iconVisible: PropTypes.string,\n    largeText: PropTypes.string,\n  }).isRequired,\n  /**\n   * The value of the input element, for controlled usage.\n   */\n  value: PropTypes.string,\n  /**\n   * The default value of the input element, for uncontrolled usage.\n   */\n  defaultValue: PropTypes.string,\n  /**\n   * Whether the Edit icon should always be visible\n   */\n  showIcon: PropTypes.bool,\n  /**\n   * Component to use as the input. The component \"inherit\" from `HvBaseInput` (such as `HvInput` or `HvTextArea`)\n   */\n  component: PropTypes.elementType,\n  /**\n   * Variant of the HvTypography to display\n   */\n  variant: PropTypes.string,\n  /**\n   * The placeholder value of the HvTypography.\n   */\n  placeholder: PropTypes.string,\n  /**\n   * Called when the input is blurred.\n   */\n  onBlur: PropTypes.func,\n  /**\n   * Called when the input value is changed.\n   */\n  onChange: PropTypes.func,\n  /**\n   * Called when a key is pressed on the input.\n   */\n  onKeyDown: PropTypes.func,\n  /**\n   * Props passed to the HvButton component\n   */\n  buttonProps: PropTypes.instanceOf(Object),\n  /**\n   * Props passed to the HvTypography text component\n   */\n  typographyProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, { name: \"HvInlineEditor\" })(HvInlineEditor);\n"],"mappings":"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"}
+{"version":3,"file":"InlineEditor.js","names":["React","useLayoutEffect","useRef","useState","PropTypes","clsx","withStyles","useTheme","HvButton","HvInput","HvTypography","isKeypress","KeyboardCodes","useControlled","Edit","styles","HvInlineEditor","props","className","classes","value","valueProp","defaultValue","showIcon","component","InputComponent","variant","placeholder","onBlur","onChange","onKeyDown","buttonProps","typographyProps","others","setValue","editMode","setEditMode","cachedValue","setCachedValue","inputRef","theme","typographyStyles","hv","typography","lineHeight","input","current","focus","select","handleClick","handleBlur","event","newValue","handleKeyDown","Esc","handleChange","val","root","inputRoot","inputBorderContainer","style","height","undefined","button","parseInt","largeText","text","textEmpty","icon","iconVisible","propTypes","string","shape","isRequired","bool","elementType","func","instanceOf","Object","name"],"sources":["../../../src/InlineEditor/InlineEditor.js"],"sourcesContent":["import React, { useLayoutEffect, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles, useTheme } from \"@mui/styles\";\n\nimport {\n  HvButton,\n  HvInput,\n  HvTypography,\n  isKeypress,\n  KeyboardCodes,\n  useControlled,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Edit } from \"@hitachivantara/uikit-react-icons\";\n\nimport styles from \"./styles\";\n\n/**\n * An Inline Editor allows the user to edit a record without making a major switch\n * between viewing and editing, making it an efficient method of updating a record.\n */\nconst HvInlineEditor = (props) => {\n  const {\n    className,\n    classes,\n    value: valueProp,\n    defaultValue,\n    showIcon,\n    component: InputComponent = HvInput,\n    variant = \"normalText\",\n    placeholder = \"Enter text\",\n    onBlur,\n    onChange,\n    onKeyDown,\n    buttonProps,\n    typographyProps,\n    ...others\n  } = props;\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n  const [editMode, setEditMode] = useState(false);\n  const [cachedValue, setCachedValue] = useState(value);\n  const inputRef = useRef();\n  const theme = useTheme();\n\n  const typographyStyles = theme.hv.typography[variant] || {};\n  const { lineHeight } = typographyStyles;\n\n  useLayoutEffect(() => {\n    const input = inputRef.current;\n    if (editMode && input) {\n      input.focus();\n      input.select();\n    }\n  }, [editMode]);\n\n  const handleClick = () => {\n    setEditMode(true);\n    setCachedValue(value);\n  };\n\n  const handleBlur = (event) => {\n    setEditMode(false);\n\n    const newValue = value || cachedValue; // empty values should be ignored\n    setValue(newValue);\n    onBlur?.(event, newValue);\n  };\n\n  const handleKeyDown = (event) => {\n    if (isKeypress(event, KeyboardCodes.Esc)) {\n      setEditMode(false);\n      setValue(cachedValue);\n    }\n    onKeyDown?.(event);\n  };\n\n  const handleChange = (event, val) => {\n    setValue(val);\n    onChange?.(event, val);\n  };\n\n  return (\n    <div className={clsx(className, classes.root)}>\n      {editMode ? (\n        <InputComponent\n          inputRef={inputRef}\n          classes={{\n            root: classes.inputRoot,\n            input: classes.input,\n            inputBorderContainer: classes.inputBorderContainer,\n          }}\n          inputProps={{\n            style: {\n              ...typographyStyles,\n              height: InputComponent === HvInput ? lineHeight : undefined,\n            },\n          }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          {...others}\n        />\n      ) : (\n        <HvButton\n          category=\"ghost\"\n          overrideIconColors={false}\n          className={clsx(classes.button, {\n            [classes.largeText]: parseInt(lineHeight, 10) >= 28,\n          })}\n          onClick={handleClick}\n          {...buttonProps}\n        >\n          <HvTypography\n            variant={variant}\n            className={clsx(classes.text, { [classes.textEmpty]: !value })}\n            {...typographyProps}\n          >\n            {value || placeholder}\n          </HvTypography>\n          <Edit\n            color=\"atmo5\"\n            role=\"presentation\"\n            className={clsx(classes.icon, {\n              [classes.iconVisible]: showIcon,\n            })}\n          />\n        </HvButton>\n      )}\n    </div>\n  );\n};\n\nHvInlineEditor.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes: PropTypes.shape({\n    root: PropTypes.string,\n    input: PropTypes.string,\n    inputRoot: PropTypes.string,\n    inputBorderContainer: PropTypes.string,\n    text: PropTypes.string,\n    textEmpty: PropTypes.string,\n    button: PropTypes.string,\n    icon: PropTypes.string,\n    iconVisible: PropTypes.string,\n    largeText: PropTypes.string,\n  }).isRequired,\n  /**\n   * The value of the input element, for controlled usage.\n   */\n  value: PropTypes.string,\n  /**\n   * The default value of the input element, for uncontrolled usage.\n   */\n  defaultValue: PropTypes.string,\n  /**\n   * Whether the Edit icon should always be visible\n   */\n  showIcon: PropTypes.bool,\n  /**\n   * Component to use as the input. The component \"inherit\" from `HvBaseInput` (such as `HvInput` or `HvTextArea`)\n   */\n  component: PropTypes.elementType,\n  /**\n   * Variant of the HvTypography to display\n   */\n  variant: PropTypes.string,\n  /**\n   * The placeholder value of the HvTypography.\n   */\n  placeholder: PropTypes.string,\n  /**\n   * Called when the input is blurred.\n   */\n  onBlur: PropTypes.func,\n  /**\n   * Called when the input value is changed.\n   */\n  onChange: PropTypes.func,\n  /**\n   * Called when a key is pressed on the input.\n   */\n  onKeyDown: PropTypes.func,\n  /**\n   * Props passed to the HvButton component\n   */\n  buttonProps: PropTypes.instanceOf(Object),\n  /**\n   * Props passed to the HvTypography text component\n   */\n  typographyProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, { name: \"HvInlineEditor\" })(HvInlineEditor);\n"],"mappings":"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"}

package/dist/modern/NavigationAnchors/NavigationAnchors.d.ts

@@ -1,4 +1,4 @@
-import { StandardProps } from "@material-ui/core";
+import { StandardProps } from "@mui/material";
 import { HvListContainerProps } from "@hitachivantara/uikit-react-core";
 
 interface Option {

package/dist/modern/NavigationAnchors/NavigationAnchors.js

@@ -1,14 +1,21 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 const _excluded = ["selectedIndex", "scrollElementId", "href", "onClick", "className", "classes", "options", "floating", "offset"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 import "core-js/modules/web.dom-collections.iterator.js";
 import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import PropTypes from "prop-types";
 import clsx from "clsx";
-import { deprecatedPropType, withStyles } from "@material-ui/core";
+import { deprecatedPropType } from "@mui/material";
+import { withStyles } from "@mui/styles";
 import { HvListContainer, HvListItem } from "@hitachivantara/uikit-react-core";
 import styles from "./styles";
 import navigationOption from "./NavigationOption";
+import { jsx as _jsx } from "react/jsx-runtime";
 const RETRY_MAX = 5;
 
 const getScrollTop = (c = window) => {
@@ -223,20 +230,22 @@ const NavigationAnchors = _ref => {
       return navigationOption(option.label);
     });
   }, [options]);
-  return /*#__PURE__*/React.createElement(HvListContainer, _extends({
+  return /*#__PURE__*/_jsx(HvListContainer, _objectSpread(_objectSpread({
     interactive: true,
     className: clsx(className, classes.root)
-  }, other), options.map((option, index) => {
-    const NavOpt = navOptions[index];
-    return /*#__PURE__*/React.createElement(HvListItem, {
-      classes: {
-        selected: classes.listItemSelected,
-        gutters: classes.listItemGutters
-      },
-      key: option.key || option.label,
-      onClick: event => handleListItemClick(event, option.value, index),
-      selected: selectedIndex === index
-    }, /*#__PURE__*/React.createElement(NavOpt, null));
+  }, other), {}, {
+    children: options.map((option, index) => {
+      const NavOpt = navOptions[index];
+      return /*#__PURE__*/_jsx(HvListItem, {
+        classes: {
+          selected: classes.listItemSelected,
+          gutters: classes.listItemGutters
+        },
+        onClick: event => handleListItemClick(event, option.value, index),
+        selected: selectedIndex === index,
+        children: /*#__PURE__*/_jsx(NavOpt, {})
+      }, option.key || option.label);
+    })
   }));
 };
 

package/dist/modern/NavigationAnchors/NavigationAnchors.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationAnchors.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","PropTypes","clsx","deprecatedPropType","withStyles","HvListContainer","HvListItem","styles","navigationOption","RETRY_MAX","getScrollTop","c","window","scrollY","pageYOffset","document","documentElement","scrollTop","body","verticalScrollOffset","t","getBoundingClientRect","top","getComputedStyle","position","offsetTop","scrollElement","element","container","offset","elemTop","scrollTo","behavior","isScrolledToTheBottom","containerScrollTop","scrollHeight","innerHeight","offsetHeight","findFirstVisibleElement","options","boundsTop","i","length","ele","getElementById","value","NavigationAnchors","selectedIndex","selectedIndexProp","scrollElementId","href","onClick","className","classes","floating","other","setSelectedIndex","scrollEle","requestedAnimationFrame","lastContainerScrollTop","selectedIndexRef","current","checkScroll","requestAnimationFrame","firstVisibleElementIndex","newSelectedIndex","isScrollingDown","addEventListener","removeEventListener","cancelAnimationFrame","checkRenderedInterval","hashValue","location","hash","split","option","find","o","retry","setInterval","clearInterval","handleListItemClick","event","id","index","history","pushState","navOptions","map","label","root","NavOpt","selected","listItemSelected","gutters","listItemGutters","key","propTypes","string","shape","isRequired","arrayOf","number","bool","func","name"],"sources":["../../../src/NavigationAnchors/NavigationAnchors.js"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { deprecatedPropType, withStyles } from \"@material-ui/core\";\nimport { HvListContainer, HvListItem } from \"@hitachivantara/uikit-react-core\";\nimport styles from \"./styles\";\nimport navigationOption from \"./NavigationOption\";\n\nconst RETRY_MAX = 5;\n\nconst getScrollTop = (c = window) => {\n  if (c === window) {\n    return (\n      window.scrollY ||\n      window.pageYOffset ||\n      (document.documentElement && document.documentElement.scrollTop) ||\n      document.body.scrollTop\n    );\n  }\n\n  return c.scrollTop;\n};\n\nconst verticalScrollOffset = (t, c = window) => {\n  if (c === window) {\n    return (t?.getBoundingClientRect?.().top || 0) + (window.scrollY || window.pageYOffset);\n  }\n  if (getComputedStyle(c).position !== \"static\") {\n    return t.offsetTop;\n  }\n\n  return t.offsetTop - c.offsetTop;\n};\n\nconst scrollElement = (element, container, offset = 0) => {\n  const elemTop = verticalScrollOffset(element, container);\n  container.scrollTo({\n    top: elemTop - offset,\n    behavior: \"smooth\",\n  });\n};\n\nconst isScrolledToTheBottom = (container) => {\n  const containerScrollTop = getScrollTop(container);\n\n  if (container === window) {\n    // accounting for cases where html/body are set to height:100%\n    const scrollHeight =\n      (document.documentElement && document.documentElement.scrollHeight) ||\n      document.body.scrollHeight;\n\n    return containerScrollTop + window.innerHeight >= scrollHeight;\n  }\n\n  return containerScrollTop + container.offsetHeight >= container.scrollHeight;\n};\n\n// find the last nav item that whose top scrolled out of the container's visible area\nconst findFirstVisibleElement = (container, options, offset) => {\n  const boundsTop = verticalScrollOffset(container);\n\n  let i = 0;\n  // find index of first element whose top is still visible inside the container\n  for (; i < options.length; i += 1) {\n    const ele = document.getElementById(options[i].value);\n\n    if (ele) {\n      const elemTop = verticalScrollOffset(ele) - (options[i].offset || offset);\n\n      if (elemTop > boundsTop) {\n        break;\n      }\n    }\n  }\n\n  // return the previous index, the element that last scrolled past the top\n  return i - 1;\n};\n\n/**\n * A navigation component to help in changing views, still in development\n */\nconst NavigationAnchors = ({\n  selectedIndex: selectedIndexProp = 0,\n  scrollElementId,\n  href = true,\n  onClick,\n  className,\n  classes,\n  options,\n  floating,\n  offset = 0,\n  ...other\n}) => {\n  const [selectedIndex, setSelectedIndex] = useState(selectedIndexProp);\n\n  const scrollEle = useRef();\n  const requestedAnimationFrame = useRef(0);\n\n  const lastContainerScrollTop = useRef();\n\n  // ref to use a often-changing value in useCallback, has recommended in\n  // https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback\n  const selectedIndexRef = useRef(selectedIndex);\n  useEffect(() => {\n    selectedIndexRef.current = selectedIndex;\n  }, [selectedIndex]);\n\n  // get and store the container's dom element\n  useEffect(() => {\n    scrollEle.current = (scrollElementId && document.getElementById(scrollElementId)) || window;\n    lastContainerScrollTop.current = verticalScrollOffset(scrollEle.current);\n  }, [scrollElementId]);\n\n  const checkScroll = useCallback(() => {\n    if (requestedAnimationFrame.current === 0 && window?.requestAnimationFrame) {\n      requestedAnimationFrame.current = window.requestAnimationFrame(() => {\n        requestedAnimationFrame.current = 0;\n\n        const firstVisibleElementIndex = findFirstVisibleElement(\n          scrollEle.current,\n          options,\n          offset\n        );\n\n        let newSelectedIndex = firstVisibleElementIndex;\n\n        // select the first element when all elements are bellow the container's top\n        if (firstVisibleElementIndex < 0) {\n          newSelectedIndex = 0;\n        }\n\n        // if the user has reached the bottom of the container, select the first nav item still visible\n        // (usually this selects the last nav item, when it can't reach the top the container)\n        // in theory only needed when scrolling down, but no... because of the Safari bouncing behaviour\n        if (newSelectedIndex < options.length - 1 && isScrolledToTheBottom(scrollEle.current)) {\n          newSelectedIndex += 1;\n        }\n\n        const containerScrollTop = getScrollTop(scrollEle.current);\n        const isScrollingDown = containerScrollTop > lastContainerScrollTop.current;\n        lastContainerScrollTop.current = containerScrollTop;\n\n        // only update the selected item if the scroll direction is moving away from it\n        if (isScrollingDown) {\n          if (newSelectedIndex < selectedIndexRef.current) {\n            newSelectedIndex = selectedIndexRef.current;\n          }\n        } else if (newSelectedIndex > selectedIndexRef.current) {\n          newSelectedIndex = selectedIndexRef.current;\n        }\n\n        setSelectedIndex(newSelectedIndex);\n      });\n    }\n  }, [offset, options]);\n\n  // registers and unregisters the scroll listener\n  useEffect(() => {\n    if (scrollEle.current) {\n      scrollEle.current.addEventListener(\"scroll\", checkScroll, false);\n    }\n\n    return () => {\n      if (scrollEle.current) {\n        scrollEle.current.removeEventListener(\"scroll\", checkScroll);\n      }\n\n      if (requestedAnimationFrame.current !== 0) {\n        window.cancelAnimationFrame(requestedAnimationFrame.current);\n        requestedAnimationFrame.current = 0;\n      }\n    };\n  }, [checkScroll]);\n\n  // waits for the elements to be rendered and scrolls to the one referenced\n  // in the URL hash, if any\n  useEffect(() => {\n    let checkRenderedInterval;\n\n    if (href) {\n      const hashValue = document.location.hash.split(\"#\")[1] || \"\";\n\n      const option = options.find((o) => o.value === hashValue);\n\n      if (option) {\n        let retry = 0;\n        checkRenderedInterval = setInterval(() => {\n          const ele = document.getElementById(option.value);\n\n          if (ele) {\n            scrollElement(ele, scrollEle.current, option.offset || offset);\n            clearInterval(checkRenderedInterval);\n          } else {\n            retry += 1;\n            if (retry === RETRY_MAX) {\n              clearInterval(checkRenderedInterval);\n            }\n          }\n        }, 1000);\n      }\n    }\n\n    return () => {\n      clearInterval(checkRenderedInterval);\n    };\n\n    // we really want to run this just in the first load\n    // in fact this doesn't even belong here, the logic should be external\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const handleListItemClick = (event, id, index) => {\n    const option = options.find((o) => o.value === id);\n\n    if (option) {\n      const ele = document.getElementById(id);\n      if (ele) {\n        scrollElement(ele, scrollEle.current, option.offset || offset);\n      }\n\n      if (!href && onClick) {\n        onClick(event, index, option);\n      } else if (href) {\n        window.history.pushState({}, \"\", `#${options[index].value}`);\n      }\n\n      setSelectedIndex(index);\n\n      // Safari scrolls immediately (no smooth scroll support),\n      // so this ref value must be updated asap\n      selectedIndexRef.current = index;\n    }\n  };\n\n  const navOptions = useMemo(() => {\n    return options.map((option) => {\n      return navigationOption(option.label);\n    });\n  }, [options]);\n\n  return (\n    <HvListContainer interactive className={clsx(className, classes.root)} {...other}>\n      {options.map((option, index) => {\n        const NavOpt = navOptions[index];\n\n        return (\n          <HvListItem\n            classes={{\n              selected: classes.listItemSelected,\n              gutters: classes.listItemGutters,\n            }}\n            key={option.key || option.label}\n            onClick={(event) => handleListItemClick(event, option.value, index)}\n            selected={selectedIndex === index}\n          >\n            <NavOpt />\n          </HvListItem>\n        );\n      })}\n    </HvListContainer>\n  );\n};\n\nNavigationAnchors.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    root: PropTypes.string,\n    listItemGutters: PropTypes.string,\n    listItemSelected: PropTypes.string,\n  }).isRequired,\n  /**\n   * An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied\n   */\n  options: PropTypes.arrayOf(\n    PropTypes.shape({\n      key: PropTypes.string,\n      value: PropTypes.string.isRequired,\n      label: PropTypes.string.isRequired,\n      offset: PropTypes.number,\n    })\n  ).isRequired,\n  /**\n   * True if the href location link should be applied. It will create an a element around every list item\n   */\n  href: PropTypes.bool,\n  /**\n   * A callback called on click of every list item, if the href is false\n   */\n  onClick: PropTypes.func,\n  /**\n   * Whether the anchors are always in a fixed position\n   *\n   * @deprecated Currently does nothing. Style the component instead.\n   */\n  floating: deprecatedPropType(PropTypes.bool),\n  /**\n   * Currently selected index passed from the parent.\n   */\n  selectedIndex: PropTypes.number,\n  /**\n   * The Id of the scrollable container containing displayed elements.\n   *\n   * Defaults to `window` if unspecified.\n   */\n  scrollElementId: PropTypes.string,\n  /**\n   * Defines the offset from the top of each element for getting an optimal viewing region in the container.\n   * This allows to exclude regions of the container that are obscured by other content (such as fixed-positioned toolbars or titles)\n   * or to put more breathing room between the targeted element and the edges of the container.\n   *\n   * Each element can also have a specific offset via the options property.\n   */\n  offset: PropTypes.number,\n};\n\nexport default withStyles(styles, { name: \"HvNavigationAnchors\" })(NavigationAnchors);\n"],"mappings":"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"}
+{"version":3,"file":"NavigationAnchors.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","PropTypes","clsx","deprecatedPropType","withStyles","HvListContainer","HvListItem","styles","navigationOption","RETRY_MAX","getScrollTop","c","window","scrollY","pageYOffset","document","documentElement","scrollTop","body","verticalScrollOffset","t","getBoundingClientRect","top","getComputedStyle","position","offsetTop","scrollElement","element","container","offset","elemTop","scrollTo","behavior","isScrolledToTheBottom","containerScrollTop","scrollHeight","innerHeight","offsetHeight","findFirstVisibleElement","options","boundsTop","i","length","ele","getElementById","value","NavigationAnchors","selectedIndex","selectedIndexProp","scrollElementId","href","onClick","className","classes","floating","other","setSelectedIndex","scrollEle","requestedAnimationFrame","lastContainerScrollTop","selectedIndexRef","current","checkScroll","requestAnimationFrame","firstVisibleElementIndex","newSelectedIndex","isScrollingDown","addEventListener","removeEventListener","cancelAnimationFrame","checkRenderedInterval","hashValue","location","hash","split","option","find","o","retry","setInterval","clearInterval","handleListItemClick","event","id","index","history","pushState","navOptions","map","label","root","NavOpt","selected","listItemSelected","gutters","listItemGutters","key","propTypes","string","shape","isRequired","arrayOf","number","bool","func","name"],"sources":["../../../src/NavigationAnchors/NavigationAnchors.js"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { deprecatedPropType } from \"@mui/material\";\nimport { withStyles } from \"@mui/styles\";\nimport { HvListContainer, HvListItem } from \"@hitachivantara/uikit-react-core\";\nimport styles from \"./styles\";\nimport navigationOption from \"./NavigationOption\";\n\nconst RETRY_MAX = 5;\n\nconst getScrollTop = (c = window) => {\n  if (c === window) {\n    return (\n      window.scrollY ||\n      window.pageYOffset ||\n      (document.documentElement && document.documentElement.scrollTop) ||\n      document.body.scrollTop\n    );\n  }\n\n  return c.scrollTop;\n};\n\nconst verticalScrollOffset = (t, c = window) => {\n  if (c === window) {\n    return (t?.getBoundingClientRect?.().top || 0) + (window.scrollY || window.pageYOffset);\n  }\n  if (getComputedStyle(c).position !== \"static\") {\n    return t.offsetTop;\n  }\n\n  return t.offsetTop - c.offsetTop;\n};\n\nconst scrollElement = (element, container, offset = 0) => {\n  const elemTop = verticalScrollOffset(element, container);\n  container.scrollTo({\n    top: elemTop - offset,\n    behavior: \"smooth\",\n  });\n};\n\nconst isScrolledToTheBottom = (container) => {\n  const containerScrollTop = getScrollTop(container);\n\n  if (container === window) {\n    // accounting for cases where html/body are set to height:100%\n    const scrollHeight =\n      (document.documentElement && document.documentElement.scrollHeight) ||\n      document.body.scrollHeight;\n\n    return containerScrollTop + window.innerHeight >= scrollHeight;\n  }\n\n  return containerScrollTop + container.offsetHeight >= container.scrollHeight;\n};\n\n// find the last nav item that whose top scrolled out of the container's visible area\nconst findFirstVisibleElement = (container, options, offset) => {\n  const boundsTop = verticalScrollOffset(container);\n\n  let i = 0;\n  // find index of first element whose top is still visible inside the container\n  for (; i < options.length; i += 1) {\n    const ele = document.getElementById(options[i].value);\n\n    if (ele) {\n      const elemTop = verticalScrollOffset(ele) - (options[i].offset || offset);\n\n      if (elemTop > boundsTop) {\n        break;\n      }\n    }\n  }\n\n  // return the previous index, the element that last scrolled past the top\n  return i - 1;\n};\n\n/**\n * A navigation component to help in changing views, still in development\n */\nconst NavigationAnchors = ({\n  selectedIndex: selectedIndexProp = 0,\n  scrollElementId,\n  href = true,\n  onClick,\n  className,\n  classes,\n  options,\n  floating,\n  offset = 0,\n  ...other\n}) => {\n  const [selectedIndex, setSelectedIndex] = useState(selectedIndexProp);\n\n  const scrollEle = useRef();\n  const requestedAnimationFrame = useRef(0);\n\n  const lastContainerScrollTop = useRef();\n\n  // ref to use a often-changing value in useCallback, has recommended in\n  // https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback\n  const selectedIndexRef = useRef(selectedIndex);\n  useEffect(() => {\n    selectedIndexRef.current = selectedIndex;\n  }, [selectedIndex]);\n\n  // get and store the container's dom element\n  useEffect(() => {\n    scrollEle.current = (scrollElementId && document.getElementById(scrollElementId)) || window;\n    lastContainerScrollTop.current = verticalScrollOffset(scrollEle.current);\n  }, [scrollElementId]);\n\n  const checkScroll = useCallback(() => {\n    if (requestedAnimationFrame.current === 0 && window?.requestAnimationFrame) {\n      requestedAnimationFrame.current = window.requestAnimationFrame(() => {\n        requestedAnimationFrame.current = 0;\n\n        const firstVisibleElementIndex = findFirstVisibleElement(\n          scrollEle.current,\n          options,\n          offset\n        );\n\n        let newSelectedIndex = firstVisibleElementIndex;\n\n        // select the first element when all elements are bellow the container's top\n        if (firstVisibleElementIndex < 0) {\n          newSelectedIndex = 0;\n        }\n\n        // if the user has reached the bottom of the container, select the first nav item still visible\n        // (usually this selects the last nav item, when it can't reach the top the container)\n        // in theory only needed when scrolling down, but no... because of the Safari bouncing behaviour\n        if (newSelectedIndex < options.length - 1 && isScrolledToTheBottom(scrollEle.current)) {\n          newSelectedIndex += 1;\n        }\n\n        const containerScrollTop = getScrollTop(scrollEle.current);\n        const isScrollingDown = containerScrollTop > lastContainerScrollTop.current;\n        lastContainerScrollTop.current = containerScrollTop;\n\n        // only update the selected item if the scroll direction is moving away from it\n        if (isScrollingDown) {\n          if (newSelectedIndex < selectedIndexRef.current) {\n            newSelectedIndex = selectedIndexRef.current;\n          }\n        } else if (newSelectedIndex > selectedIndexRef.current) {\n          newSelectedIndex = selectedIndexRef.current;\n        }\n\n        setSelectedIndex(newSelectedIndex);\n      });\n    }\n  }, [offset, options]);\n\n  // registers and unregisters the scroll listener\n  useEffect(() => {\n    if (scrollEle.current) {\n      scrollEle.current.addEventListener(\"scroll\", checkScroll, false);\n    }\n\n    return () => {\n      if (scrollEle.current) {\n        scrollEle.current.removeEventListener(\"scroll\", checkScroll);\n      }\n\n      if (requestedAnimationFrame.current !== 0) {\n        window.cancelAnimationFrame(requestedAnimationFrame.current);\n        requestedAnimationFrame.current = 0;\n      }\n    };\n  }, [checkScroll]);\n\n  // waits for the elements to be rendered and scrolls to the one referenced\n  // in the URL hash, if any\n  useEffect(() => {\n    let checkRenderedInterval;\n\n    if (href) {\n      const hashValue = document.location.hash.split(\"#\")[1] || \"\";\n\n      const option = options.find((o) => o.value === hashValue);\n\n      if (option) {\n        let retry = 0;\n        checkRenderedInterval = setInterval(() => {\n          const ele = document.getElementById(option.value);\n\n          if (ele) {\n            scrollElement(ele, scrollEle.current, option.offset || offset);\n            clearInterval(checkRenderedInterval);\n          } else {\n            retry += 1;\n            if (retry === RETRY_MAX) {\n              clearInterval(checkRenderedInterval);\n            }\n          }\n        }, 1000);\n      }\n    }\n\n    return () => {\n      clearInterval(checkRenderedInterval);\n    };\n\n    // we really want to run this just in the first load\n    // in fact this doesn't even belong here, the logic should be external\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const handleListItemClick = (event, id, index) => {\n    const option = options.find((o) => o.value === id);\n\n    if (option) {\n      const ele = document.getElementById(id);\n      if (ele) {\n        scrollElement(ele, scrollEle.current, option.offset || offset);\n      }\n\n      if (!href && onClick) {\n        onClick(event, index, option);\n      } else if (href) {\n        window.history.pushState({}, \"\", `#${options[index].value}`);\n      }\n\n      setSelectedIndex(index);\n\n      // Safari scrolls immediately (no smooth scroll support),\n      // so this ref value must be updated asap\n      selectedIndexRef.current = index;\n    }\n  };\n\n  const navOptions = useMemo(() => {\n    return options.map((option) => {\n      return navigationOption(option.label);\n    });\n  }, [options]);\n\n  return (\n    <HvListContainer interactive className={clsx(className, classes.root)} {...other}>\n      {options.map((option, index) => {\n        const NavOpt = navOptions[index];\n\n        return (\n          <HvListItem\n            classes={{\n              selected: classes.listItemSelected,\n              gutters: classes.listItemGutters,\n            }}\n            key={option.key || option.label}\n            onClick={(event) => handleListItemClick(event, option.value, index)}\n            selected={selectedIndex === index}\n          >\n            <NavOpt />\n          </HvListItem>\n        );\n      })}\n    </HvListContainer>\n  );\n};\n\nNavigationAnchors.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    root: PropTypes.string,\n    listItemGutters: PropTypes.string,\n    listItemSelected: PropTypes.string,\n  }).isRequired,\n  /**\n   * An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied\n   */\n  options: PropTypes.arrayOf(\n    PropTypes.shape({\n      key: PropTypes.string,\n      value: PropTypes.string.isRequired,\n      label: PropTypes.string.isRequired,\n      offset: PropTypes.number,\n    })\n  ).isRequired,\n  /**\n   * True if the href location link should be applied. It will create an a element around every list item\n   */\n  href: PropTypes.bool,\n  /**\n   * A callback called on click of every list item, if the href is false\n   */\n  onClick: PropTypes.func,\n  /**\n   * Whether the anchors are always in a fixed position\n   *\n   * @deprecated Currently does nothing. Style the component instead.\n   */\n  floating: deprecatedPropType(PropTypes.bool),\n  /**\n   * Currently selected index passed from the parent.\n   */\n  selectedIndex: PropTypes.number,\n  /**\n   * The Id of the scrollable container containing displayed elements.\n   *\n   * Defaults to `window` if unspecified.\n   */\n  scrollElementId: PropTypes.string,\n  /**\n   * Defines the offset from the top of each element for getting an optimal viewing region in the container.\n   * This allows to exclude regions of the container that are obscured by other content (such as fixed-positioned toolbars or titles)\n   * or to put more breathing room between the targeted element and the edges of the container.\n   *\n   * Each element can also have a specific offset via the options property.\n   */\n  offset: PropTypes.number,\n};\n\nexport default withStyles(styles, { name: \"HvNavigationAnchors\" })(NavigationAnchors);\n"],"mappings":"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"}

package/dist/modern/NotificationPanel/EmptyStatePanel/EmptyStatePanel.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { StandardProps } from "@material-ui/core";
+import { StandardProps } from "@mui/material";
 
 export type HvEmptyStatePanelClassKey =
   | "emptyStateRoot"

package/dist/modern/NotificationPanel/EmptyStatePanel/EmptyStatePanel.js

@@ -4,8 +4,9 @@ import React from "react";
 import PropTypes from "prop-types";
 import { HvEmptyState } from "@hitachivantara/uikit-react-core";
 import { Alert } from "@hitachivantara/uikit-react-icons";
-import { withStyles } from "@material-ui/core";
+import { withStyles } from "@mui/styles";
 import styles from "./styles";
+import { jsx as _jsx } from "react/jsx-runtime";
 
 const EmptyStatePanel = ({
   id,
@@ -15,11 +16,11 @@ const EmptyStatePanel = ({
   message,
   icon
 }) => {
-  return /*#__PURE__*/React.createElement(HvEmptyState, {
+  return /*#__PURE__*/_jsx(HvEmptyState, {
     id: id,
     title: title,
     message: message,
-    icon: icon || _Alert || (_Alert = /*#__PURE__*/React.createElement(Alert, null)),
+    icon: icon || _Alert || (_Alert = /*#__PURE__*/_jsx(Alert, {})),
     className: className,
     classes: {
       root: classes.emptyStateRoot,

package/dist/modern/NotificationPanel/EmptyStatePanel/EmptyStatePanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyStatePanel.js","names":["React","PropTypes","HvEmptyState","Alert","withStyles","styles","EmptyStatePanel","id","classes","className","title","message","icon","root","emptyStateRoot","container","emptyStateContainer","iconContainer","emptyStateIconContainer","titleContainer","emptyStateTitleContainer","propTypes","string","isRequired","shape","element","name"],"sources":["../../../../src/NotificationPanel/EmptyStatePanel/EmptyStatePanel.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport { HvEmptyState } from \"@hitachivantara/uikit-react-core\";\nimport { Alert } from \"@hitachivantara/uikit-react-icons\";\n\nimport { withStyles } from \"@material-ui/core\";\nimport styles from \"./styles\";\n\nconst EmptyStatePanel = ({ id, classes, className, title, message, icon }) => {\n  return (\n    <HvEmptyState\n      id={id}\n      title={title}\n      message={message}\n      icon={icon || <Alert />}\n      className={className}\n      classes={{\n        root: classes.emptyStateRoot,\n        container: classes.emptyStateContainer,\n        iconContainer: classes.emptyStateIconContainer,\n        titleContainer: classes.emptyStateTitleContainer,\n      }}\n    />\n  );\n};\n\nEmptyStatePanel.propTypes = {\n  /**\n   * Id of the EmptyStatePanel\n   */\n  id: PropTypes.string.isRequired,\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root of the panel.\n     */\n    emptyStateRoot: PropTypes.string,\n    /**\n     * Styles applied to the EmptyStatePanel container.\n     */\n    emptyStateContainer: PropTypes.string,\n\n    /**\n     * Styles applied to the empty state container icon.\n     */\n    emptyStateIconContainer: PropTypes.string,\n\n    /**\n     * Styles applied to the EmptyStatePanel title.\n     */\n    emptyStateTitleContainer: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * Class names to be applied to the accordion.\n   */\n  className: PropTypes.string,\n  /**\n   * Title of the EmptyStatePanel\n   */\n  title: PropTypes.string.isRequired,\n  /**\n   * Message of the EmptyStatePanel\n   */\n  message: PropTypes.string.isRequired,\n  /**\n   * Empty Panel Icon\n   */\n  icon: PropTypes.element,\n};\nexport default withStyles(styles, { name: \"HvEmptyStatePanel\" })(EmptyStatePanel);\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAASC,YAAT,QAA6B,kCAA7B;AACA,SAASC,KAAT,QAAsB,mCAAtB;AAEA,SAASC,UAAT,QAA2B,mBAA3B;AACA,OAAOC,MAAP,MAAmB,UAAnB;;AAEA,MAAMC,eAAe,GAAG,CAAC;EAAEC,EAAF;EAAMC,OAAN;EAAeC,SAAf;EAA0BC,KAA1B;EAAiCC,OAAjC;EAA0CC;AAA1C,CAAD,KAAsD;EAC5E,oBACE,oBAAC,YAAD;IACE,EAAE,EAAEL,EADN;IAEE,KAAK,EAAEG,KAFT;IAGE,OAAO,EAAEC,OAHX;IAIE,IAAI,EAAEC,IAAI,qCAAI,oBAAC,KAAD,OAAJ,CAJZ;IAKE,SAAS,EAAEH,SALb;IAME,OAAO,EAAE;MACPI,IAAI,EAAEL,OAAO,CAACM,cADP;MAEPC,SAAS,EAAEP,OAAO,CAACQ,mBAFZ;MAGPC,aAAa,EAAET,OAAO,CAACU,uBAHhB;MAIPC,cAAc,EAAEX,OAAO,CAACY;IAJjB;EANX,EADF;AAeD,CAhBD;;AAkBA,wCAAAd,eAAe,CAACe,SAAhB,GAA4B;EAC1B;AACF;AACA;EACEd,EAAE,EAAEN,SAAS,CAACqB,MAAV,CAAiBC,UAJK;;EAK1B;AACF;AACA;EACEf,OAAO,EAAEP,SAAS,CAACuB,KAAV,CAAgB;IACvB;AACJ;AACA;IACIV,cAAc,EAAEb,SAAS,CAACqB,MAJH;;IAKvB;AACJ;AACA;IACIN,mBAAmB,EAAEf,SAAS,CAACqB,MARR;;IAUvB;AACJ;AACA;IACIJ,uBAAuB,EAAEjB,SAAS,CAACqB,MAbZ;;IAevB;AACJ;AACA;IACIF,wBAAwB,EAAEnB,SAAS,CAACqB;EAlBb,CAAhB,EAmBNC,UA3BuB;;EA6B1B;AACF;AACA;EACEd,SAAS,EAAER,SAAS,CAACqB,MAhCK;;EAiC1B;AACF;AACA;EACEZ,KAAK,EAAET,SAAS,CAACqB,MAAV,CAAiBC,UApCE;;EAqC1B;AACF;AACA;EACEZ,OAAO,EAAEV,SAAS,CAACqB,MAAV,CAAiBC,UAxCA;;EAyC1B;AACF;AACA;EACEX,IAAI,EAAEX,SAAS,CAACwB;AA5CU,CAA5B;AA8CA,eAAerB,UAAU,CAACC,MAAD,EAAS;EAAEqB,IAAI,EAAE;AAAR,CAAT,CAAV,CAAkDpB,eAAlD,CAAf"}
+{"version":3,"file":"EmptyStatePanel.js","names":["React","PropTypes","HvEmptyState","Alert","withStyles","styles","EmptyStatePanel","id","classes","className","title","message","icon","root","emptyStateRoot","container","emptyStateContainer","iconContainer","emptyStateIconContainer","titleContainer","emptyStateTitleContainer","propTypes","string","isRequired","shape","element","name"],"sources":["../../../../src/NotificationPanel/EmptyStatePanel/EmptyStatePanel.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport { HvEmptyState } from \"@hitachivantara/uikit-react-core\";\nimport { Alert } from \"@hitachivantara/uikit-react-icons\";\n\nimport { withStyles } from \"@mui/styles\";\nimport styles from \"./styles\";\n\nconst EmptyStatePanel = ({ id, classes, className, title, message, icon }) => {\n  return (\n    <HvEmptyState\n      id={id}\n      title={title}\n      message={message}\n      icon={icon || <Alert />}\n      className={className}\n      classes={{\n        root: classes.emptyStateRoot,\n        container: classes.emptyStateContainer,\n        iconContainer: classes.emptyStateIconContainer,\n        titleContainer: classes.emptyStateTitleContainer,\n      }}\n    />\n  );\n};\n\nEmptyStatePanel.propTypes = {\n  /**\n   * Id of the EmptyStatePanel\n   */\n  id: PropTypes.string.isRequired,\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root of the panel.\n     */\n    emptyStateRoot: PropTypes.string,\n    /**\n     * Styles applied to the EmptyStatePanel container.\n     */\n    emptyStateContainer: PropTypes.string,\n\n    /**\n     * Styles applied to the empty state container icon.\n     */\n    emptyStateIconContainer: PropTypes.string,\n\n    /**\n     * Styles applied to the EmptyStatePanel title.\n     */\n    emptyStateTitleContainer: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * Class names to be applied to the accordion.\n   */\n  className: PropTypes.string,\n  /**\n   * Title of the EmptyStatePanel\n   */\n  title: PropTypes.string.isRequired,\n  /**\n   * Message of the EmptyStatePanel\n   */\n  message: PropTypes.string.isRequired,\n  /**\n   * Empty Panel Icon\n   */\n  icon: PropTypes.element,\n};\nexport default withStyles(styles, { name: \"HvEmptyStatePanel\" })(EmptyStatePanel);\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAASC,YAAT,QAA6B,kCAA7B;AACA,SAASC,KAAT,QAAsB,mCAAtB;AAEA,SAASC,UAAT,QAA2B,aAA3B;AACA,OAAOC,MAAP,MAAmB,UAAnB;;;AAEA,MAAMC,eAAe,GAAG,CAAC;EAAEC,EAAF;EAAMC,OAAN;EAAeC,SAAf;EAA0BC,KAA1B;EAAiCC,OAAjC;EAA0CC;AAA1C,CAAD,KAAsD;EAC5E,oBACE,KAAC,YAAD;IACE,EAAE,EAAEL,EADN;IAEE,KAAK,EAAEG,KAFT;IAGE,OAAO,EAAEC,OAHX;IAIE,IAAI,EAAEC,IAAI,qCAAI,KAAC,KAAD,KAAJ,CAJZ;IAKE,SAAS,EAAEH,SALb;IAME,OAAO,EAAE;MACPI,IAAI,EAAEL,OAAO,CAACM,cADP;MAEPC,SAAS,EAAEP,OAAO,CAACQ,mBAFZ;MAGPC,aAAa,EAAET,OAAO,CAACU,uBAHhB;MAIPC,cAAc,EAAEX,OAAO,CAACY;IAJjB;EANX,EADF;AAeD,CAhBD;;AAkBA,wCAAAd,eAAe,CAACe,SAAhB,GAA4B;EAC1B;AACF;AACA;EACEd,EAAE,EAAEN,SAAS,CAACqB,MAAV,CAAiBC,UAJK;;EAK1B;AACF;AACA;EACEf,OAAO,EAAEP,SAAS,CAACuB,KAAV,CAAgB;IACvB;AACJ;AACA;IACIV,cAAc,EAAEb,SAAS,CAACqB,MAJH;;IAKvB;AACJ;AACA;IACIN,mBAAmB,EAAEf,SAAS,CAACqB,MARR;;IAUvB;AACJ;AACA;IACIJ,uBAAuB,EAAEjB,SAAS,CAACqB,MAbZ;;IAevB;AACJ;AACA;IACIF,wBAAwB,EAAEnB,SAAS,CAACqB;EAlBb,CAAhB,EAmBNC,UA3BuB;;EA6B1B;AACF;AACA;EACEd,SAAS,EAAER,SAAS,CAACqB,MAhCK;;EAiC1B;AACF;AACA;EACEZ,KAAK,EAAET,SAAS,CAACqB,MAAV,CAAiBC,UApCE;;EAqC1B;AACF;AACA;EACEZ,OAAO,EAAEV,SAAS,CAACqB,MAAV,CAAiBC,UAxCA;;EAyC1B;AACF;AACA;EACEX,IAAI,EAAEX,SAAS,CAACwB;AA5CU,CAA5B;AA8CA,eAAerB,UAAU,CAACC,MAAD,EAAS;EAAEqB,IAAI,EAAE;AAAR,CAAT,CAAV,CAAkDpB,eAAlD,CAAf"}

package/dist/modern/NotificationPanel/Notification/Notification.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { StandardProps } from "@material-ui/core";
+import { StandardProps } from "@mui/material";
 
 export type HvNotificationClassKey =
   | "root"