import { jsx as _jsx } from "react/jsx-runtime";
import styled, { css } from 'styled-components';
import { defaultThemeProp } from '../../theme';
const defaultProps = {
    width: 'auto',
    height: 'auto',
    variant: 'default'
};
export const StyledRectangleSkeleton = styled.div(props => {
    const { width, height, variant } = props;
    const { skeleton: skeletonBackground } = props.theme.base.palette;
    const { 'border-radius': borderRadius } = props.theme.base;
    return css `
    margin: 0.25rem;
    background-color: ${skeletonBackground};
    ${variant === 'button'
        ? `border-radius: calc(2 * ${borderRadius});
      width: 6.875rem;
      height: 2rem`
        : `width: ${width};
      height: ${height}`}
  `;
});
StyledRectangleSkeleton.defaultProps = defaultThemeProp;
const RectangleSkeleton = (props) => {
    return _jsx(StyledRectangleSkeleton, { ...props, "aria-disabled": true });
};
RectangleSkeleton.defaultProps = defaultProps;
export default RectangleSkeleton;
//# sourceMappingURL=RectangleSkeleton.js.map