import r from"prop-types";import{makeStyles as e,Typography as a}from"@material-ui/core";import{jsx as i,jsxs as o}from"react/jsx-runtime";var t=e((function(r){return{root:{display:"flex",flexWrap:"wrap",alignItems:"center",marginTop:r.spacing(1)/2},formationItem:{display:"flex",alignItems:"center",marginRight:r.spacing(1)},marker:{width:8,height:8,borderRadius:"50%"},label:{color:r.palette.primary.text6,fontSize:"10px",marginLeft:r.spacing(1)}}}));function n(r){var e=r.formations,n=r.formationColors,m=t();return i("div",{className:m.root,children:e.map((function(r){return o("div",{className:m.formationItem,children:[i("div",{className:m.marker,style:{backgroundColor:n[r]}}),i(a,{className:m.label,children:r})]},r)}))})}n.propTypes={formations:r.arrayOf(r.string).isRequired,formationColors:r.shape({}).isRequired};export{n as default};
//# sourceMappingURL=FormationsLegend.js.map
