import {
  Icon
} from "./chunk-RWIZ7Q74.js";

// src/components/Loading.tsx
import styled from "@emotion/styled";
import { jsx } from "@emotion/react/jsx-runtime";
var defaultProps = {
  size: 60,
  center: true,
  ml: 0
};
function Loading({
  center = defaultProps.center,
  size = defaultProps.size,
  ml = defaultProps.ml
}) {
  return /* @__PURE__ */ jsx(LoadingWrapper, { center, ml, children: /* @__PURE__ */ jsx(Rotate, { children: /* @__PURE__ */ jsx(Icon, { name: "LoadingSpinner", width: size }) }) });
}
Loading.defaultProps = defaultProps;
var LoadingWrapper = styled.div`
  flex-grow: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 100%;
  margin-left: ${({ ml }) => ml}px;

  ${({ center }) => center && `
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 !important;
  `}
`;
var Rotate = styled.div`
  display: inline-flex;
  animation: rotate 0.5s linear infinite;

  @keyframes rotate {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
`;

export {
  Loading,
  LoadingWrapper
};
