@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 1.08 kB
JavaScript
import{jsx as o}from"react/jsx-runtime";import{styled as r,ButtonGroup as t,buttonGroupClasses as e,iconButtonClasses as i}from"@mui/material";import a,{cloneElement as d}from"react";import{getIconSizing as l,getIconButtonSizing as n,toggle as s,defaultStyle as u}from"../IconButtonBase/IconButton.variant-helpers.js";const c=r(t,{shouldForwardProp:o=>"groupRaised"!==o})(({theme:o,variation:r,iconColor:t,sizing:a="lg",groupRaised:d=!1})=>({[`&.${e.root}`]:{backgroundColor:o.custom.palette.input.default,border:`1px solid ${o.custom.palette.stroke.default}`,overflow:"hidden",...d&&{boxShadow:o.custom.elevation.raised,border:"none"},[`& .${i.root}`]:{borderRadius:0},"& > button":{borderRadius:0,..."default"===r&&{...u(o)},..."toggle"===r&&{...s(o)},...a&&{height:"raised"!==r?`calc(${n(a).height}px - 2px)`:n(a).width,width:"raised"!==r?`calc(${n(a).width}px - 2px)`:n(a).width}},"& .MuiSvgIcon-root":{...a&&{...l(a)},color:t||o.custom.palette.icon.primary}}})),p=({children:r,...t})=>o(c,{...t,children:a.Children.map(r,o=>o?d(o,{sizing:t.sizing}):null)});export{p as default};