@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 1.7 kB
JavaScript
import{styled as e,Box as t,ListItemButton as o,listItemButtonClasses as i}from"@mui/material";const n=e(t)(({theme:e})=>({display:"flex",flexDirection:"column",gap:e.spacing(e.custom.margin.md),width:"100%",minWidth:440,maxWidth:500,boxSizing:"border-box"})),a=e(t)(({theme:e})=>({display:"flex",gap:"1px",alignItems:"center",height:56,width:"100%"})),r=e(t)(({theme:e})=>({display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between",width:"100%",gap:e.spacing(e.custom.margin.xs)})),s=e(o)(({theme:e,zeroDataMode:t})=>({[`&.${i.root}`]:{cursor:t?"none":"pointer"},borderRadius:e.spacing(e.custom.radius.md),padding:0,backgroundColor:e.custom.palette.interaction.none,height:"100%",display:"flex",flexGrow:1,flexBasis:0,flexDirection:"column",alignItems:"center",justifyContent:"space-between","&:hover":{backgroundColor:t?e.custom.palette.interaction.none:e.custom.palette.interaction.hover},"&:active":{backgroundColor:t?e.custom.palette.interaction.none:e.custom.palette.interaction.press},"&.Mui-selected":{backgroundColor:t?e.custom.palette.interaction.none:e.custom.palette.interaction.press},"&.Mui-disabled":{opacity:1}})),c=e(t)(({theme:e,color:t})=>({width:24,aspectRatio:"1",borderRadius:"100%",backgroundColor:t})),l=e(t)(({theme:e})=>({height:36,display:"flex",alignItems:"center",justifyContent:"center"}));e(t)(({theme:e,color:t,animateBars:o})=>({flex:1,backgroundColor:t,borderRadius:e.spacing(e.custom.radius.sm),transition:o?"height 1s ease-in-out":void 0,height:"100%"}));export{s as LikertActionControllerWrapper,r as LikertGraphActionsControllerContainer,a as LikertGraphBarContainer,n as LikertGraphContainer,l as LikertGraphLabel,c as SwatchIndicator};