@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 1.42 kB
JavaScript
;var e=require("@mui/material"),t=require("../styleblocks/interactionStates.js"),a=require("../styleblocks/selectedStyle.js");const s=e=>({boxShadow:e.custom.elevation.float});exports.backgroundBasedOnVariation=(e,t)=>{switch(e){case"sunken":return t.custom.palette.surface.sunken;case"raised":case"float":return t.custom.palette.surface.raised;case"overlay":return t.custom.palette.surface.overlay;default:return t.custom.palette.surface.default}},exports.createInteractiveStates=(e,a,r)=>({cursor:"pointer",transition:"all 150ms ease","&:hover":{boxShadow:s(e).boxShadow,background:t.getInteractionStateStyles(e,"hover",a?e.custom.palette.blue[0]:e.custom.palette.surface.raised)},"&:active":{boxShadow:s(e).boxShadow,background:t.getInteractionStateStyles(e,"active",a?e.custom.palette.blue[0]:e.custom.palette.surface.raised)}}),exports.float=s,exports.getBorderRadius=(e,t)=>{switch(t){case"xs":return e.spacing(e.custom.radius.xs);case"sm":return e.spacing(e.custom.radius.sm);case"md":return e.spacing(e.custom.radius.md);case"lg":return e.spacing(e.custom.radius.lg);default:return e.spacing(e.custom.radius.xl)}},exports.overlay=e=>({boxShadow:e.custom.elevation.overlay}),exports.raised=e=>({boxShadow:e.custom.elevation.raised}),exports.surfaceSelectedState=t=>({backgroundColor:a.selectedState(t).backgroundColor,[`&.${e.paperClasses.root}`]:{outline:`1px solid ${t.custom.palette.blue[500]}`}});