{"version":3,"file":"MenuLoader.mjs","names":["React","makeStyles","Skeleton","useStyles","theme","root","nodeWrapper","display","flexDirection","flex","margin","gap","MenuLoader","props","$","_c","numOfPlaceholderNodes","t0","undefined","classes","t1","t2","_","i","Array","fill","map"],"sources":["../../../src/UI/feedback/MenuLoader.jsx"],"sourcesContent":["import React from 'react'\nimport { makeStyles } from '@material-ui/core'\nimport Skeleton from '@material-ui/lab/Skeleton'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {},\n  nodeWrapper: {\n    display: 'flex',\n    flexDirection: 'row',\n    flex: 1,\n    margin: 10,\n    gap: 2,\n  }\n}))\n\n\nexport const MenuLoader = props => {\n  const {numOfPlaceholderNodes = 1} = props\n  const classes = useStyles()\n\n  return(\n    <div>\n      {Array(numOfPlaceholderNodes).fill().map((_, i) => (\n        <div key={i} className={classes.nodeWrapper}>\n          <Skeleton variant=\"circle\" width={20} height={20}/>\n          <Skeleton variant='rect' width={'100%'} height={20} />\n        </div>\n      ))}\n    </div>\n  )\n}\n\n"],"mappings":";;;;;AAIA,MAAMG,YAAYF,YAAYG,WAAW;CACvCC,MAAM,EAAE;CACRC,aAAa;EACXC,SAAS;EACTC,eAAe;EACfC,MAAM;EACNC,QAAQ;EACRC,KAAK;EACP;CACD,EAAE;AAGH,MAAaC,cAAaC,UAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CACxB,MAAA,EAAAC,uBAAAC,OAAoCJ;CAA7B,MAAAG,wBAAAC,OAAAC,KAAAA,IAAA,IAAAD;CACP,MAAAE,UAAgBhB,WAAW;CAAA,IAAAiB;AAAA,KAAAN,EAAA,OAAAK,WAAAL,EAAA,OAAAE,uBAAA;EAAA,IAAAK;AAAA,MAAAP,EAAA,OAAAK,SAAA;AAIkBE,SAAAC,GAAAC,MACvC,sBAAA,cAAA,OAAA;IAAUA,KAAAA;IAAc,WAAAJ,QAAOb;IAIhC,EAHG,sBAAA,cAAC,UAAD;IAAkB,SAAA;IAAgB,OAAA;IAAY,QAAA;IAC9C,CAAA,EAAA,sBAAA,cAAC,UAAD;IAAkB,SAAA;IAAc,OAAA;IAAgB,QAAA;IAClD,CAAA,CACD;AAAAQ,KAAA,KAAAK;AAAAL,KAAA,KAAAO;QAAAA,MAAAP,EAAA;AALAM,OAAAI,MAAMR,sBAAsB,CAAAS,MAAO,CAAAC,IAAKL,GAKvC;AAAAP,IAAA,KAAAK;AAAAL,IAAA,KAAAE;AAAAF,IAAA,KAAAM;OAAAA,MAAAN,EAAA;CAAA,IAAAO;AAAA,KAAAP,EAAA,OAAAM,IAAA;AANJC,OAAA,sBAAA,cAAA,OAAA,MACGD,GAMG;AAAAN,IAAA,KAAAM;AAAAN,IAAA,KAAAO;OAAAA,MAAAP,EAAA;AAAA,QAPNO"}