@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 1.04 kB
JavaScript
;var t=require("react/jsx-runtime"),e=require("@mui/material"),r=require("../ButtonBase/Button.variant-helpers.js"),o=require("../ButtonBase/ButtonBase.js");const i=e.styled(o,{shouldForwardProp:t=>!["variation","destructive","sizing"].includes(t)})(({theme:t,variation:e,sizing:o,destructive:i})=>({color:t.custom.palette.text.primary,...o&&{...r.getButtonTypography(o)},...o&&{...r.getButtonSizing(o)},...o&&{...r.getIconSizing(o)},...r.buttonPadding(),"&:hover:before":{backgroundColor:t.custom.palette.interaction.hover},"&:focus:before":{backgroundColor:t.custom.palette.interaction.hover},"&:active:before":{backgroundColor:t.custom.palette.interaction.press},"&:disabled":{backgroundColor:t.custom.palette.interaction.disabled,color:t.custom.palette.text.disabled},..."subtle"===e&&{...r.subtle(t,i)},..."outlined"===e&&{...r.outlined(t,i)},..."secondary"===e&&{...r.secondary(t,i)},..."primary"===e&&{...r.primary(t,i)}}));module.exports=({sizing:e="lg",variation:r="primary",...o})=>t.jsx(i,{variation:r,sizing:e,...o});