@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 1.16 kB
JavaScript
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Check as o}from"@mui/icons-material";import{styled as i,MenuItem as r,Box as l}from"@mui/material";import{selectItemBaseStyles as a}from"../Select/StyledSelect.variant-helpers.js";const n=i(r)(({theme:e,sizing:t})=>({...{...a(e,t)},"&.Mui-focusVisible":{backgroundColor:e.custom.palette.interaction.hover},"&:hover":{backgroundColor:e.custom.palette.interaction.hover},"&.Mui-selected":{backgroundColor:e.custom.palette.interaction.press,"&.Mui-focusVisible":{backgroundColor:e.custom.palette.interaction.press},"&:hover":{backgroundColor:e.custom.palette.interaction.press}},"&.MuiButtonBase-root.MuiMenuItem-root.Mui-disabled":{backgroundColor:e.custom.palette.input.default,color:e.custom.palette.text.disabled,"&:before":{backgroundColor:e.custom.palette.interaction.disabled}}})),s=({children:i,selected:r,...a})=>e(n,{...a,children:t(l,{display:"flex",justifyContent:"space-between",alignItems:"center",width:"100%",gap:2,children:[e(l,{children:i}),e(l,{sx:{display:"flex",alignItems:"center"},children:e(o,{sx:{visibility:r?"visible":"hidden",fontSize:"16px"}})})]})});export{s as default};