@coko/client/dist/ui/common/Spin.js

Client side common code for coko apps

import { grid as e } from "../../toolkit/themeHelper.js";
import "../../toolkit/index.js";
import "react";
import t, { css as n, keyframes as r } from "styled-components";
import { jsx as i, jsxs as a } from "react/jsx-runtime";
import { Spin as o } from "antd";
//#region src/ui/common/Spin.tsx
var s = t(o)`
  ${(e) => e.$isNested && n`
      z-index: 4;

      > div {
        position: absolute;
        left: 50%;
        top: 50%;
        margin: -20px;
      }
    `};
`, c = r`
  0%,
  100% {
    transform: scale(0);
  }

  50% {
    transform: scale(1);
  }
`, l = t.div`
  &&& {
    height: ${(t) => e(t.$size)(t)};
    position: relative;
    width: ${(t) => e(t.$size)(t)};
  }
`, u = t.div`
  animation: ${c} 2s infinite ease-in-out;
  background-color: ${(e) => e.theme.colorPrimary};
  border-radius: 50%;
  height: 100%;
  left: 0;
  opacity: 0.6;
  position: absolute;
  top: 0;
  width: 100%;
`, d = t(u)`
  animation-delay: -1s;
`, f = t.div`
  height: 100%;

  .ant-spin-nested-loading {
    height: 100%;

    > div {
      height: 100%;

      > div.ant-spin-spinning {
        height: 100%;
      }
    }
  }
`, p = ({ size: e = 10, className: t }) => /* @__PURE__ */ a(l, {
	$size: e,
	className: t,
	children: [/* @__PURE__ */ i(u, {}), /* @__PURE__ */ i(d, {})]
}), m = (e) => {
	let { className: t, children: n, renderBackground: r = !0, size: a = 10, spinning: o, ...c } = e, l = r || !r && !o, u = /* @__PURE__ */ i(s, {
		$isNested: !!n,
		$renderBackground: r,
		className: t,
		indicator: /* @__PURE__ */ i(p, { size: a }),
		spinning: o,
		...c,
		children: l && n
	});
	return l ? u : /* @__PURE__ */ i(f, { children: u });
};
//#endregion
export { p as Indicator, m as default };