@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 1.85 kB
JavaScript
;var o=require("../../BrandCore/primitiveVariables.js");const e={xs:3*o.base,sm:3.5*o.base,md:4*o.base,lg:5*o.base,xl:6*o.base},t={xs:2*o.base,sm:2*o.base,md:2*o.base,lg:2.5*o.base,xl:3*o.base};exports.IconSizeMap=t,exports.buttonSizeMap=e,exports.defaultStyle=o=>({backgroundColor:o.custom.palette.interaction.none,color:o.custom.palette.icon.primary}),exports.elevated=o=>({backgroundColor:o.custom.palette.surface.raised,boxShadow:o.custom.elevation.overlay,color:o.custom.palette.icon.primary,"&:focus-visible:after":{boxShadow:o.custom.boxShadow.input.focus},"&.MuiIconButton-root:disabled":{boxShadow:"none"}}),exports.getIconButtonRadius=(o,e)=>({borderRadius:"default"===o?e.spacing(e.custom.radius.md):e.custom.radius.round}),exports.getIconButtonSizing=o=>({height:e[o],width:e[o]}),exports.getIconSizing=o=>({height:t[o],width:t[o]}),exports.outlined=o=>({backgroundColor:o.custom.palette.surface.raised,border:`1px solid ${o.custom.palette.stroke.default}`,color:o.custom.palette.icon.primary,"&.MuiIconButton-root:disabled":{border:"none"}}),exports.raised=o=>({backgroundColor:o.custom.palette.surface.raised,boxShadow:o.custom.elevation.raised,color:o.custom.palette.icon.primary,"&:focus-visible:after":{boxShadow:o.custom.boxShadow.input.focus},"&.MuiIconButton-root:disabled":{boxShadow:"none"}}),exports.toggle=o=>({"&.MuiButtonBase-root":{color:o.custom.palette.icon.primary,backgroundColor:o.custom.palette.purple[100],"&:focus:before":{backgroundColor:"none"},"&:hover:before":{backgroundColor:o.custom.palette.interaction.hoverOnDark},"&:active:before":{backgroundColor:o.custom.palette.interaction.pressOnDark},"&:focus-visible:before":{backgroundColor:o.custom.palette.surface.transparent},"&.Mui-disabled":{backgroundColor:o.custom.palette.interaction.disabled,"&:before":{color:o.custom.palette.icon.disabled}}}});