import { c as _c } from "react/compiler-runtime";
import * as stylex from "@stylexjs/stylex";
import { memo } from "react";
import { interaction } from "./mixins";
import { size } from "./tokens.stylex";
const spin = stylex.keyframes({
  from: {
    rotate: "0deg"
  },
  to: {
    rotate: "360deg"
  }
});
const throb = stylex.keyframes({
  from: {
    opacity: 0.1
  },
  to: {
    opacity: 0.5
  }
});
const styles = stylex.create({
  svg: {
    fill: "currentColor",
    opacity: 0.5
  },
  idle: {
    animationName: throb,
    animationDuration: "1s",
    animationTimingFunction: "ease-in-out",
    animationIterationCount: "infinite",
    animationDirection: "alternate"
  },
  pulling: progressDegree => ({
    maskImage: `conic-gradient(from ${progressDegree}deg, #fff0, #ffff)`
  }),
  refreshing: {
    animationName: spin,
    animationDuration: "3s",
    animationTimingFunction: "linear",
    animationIterationCount: "infinite"
  },
  done: {
    // We're setting the class instantly and don't remember the previous state
    // This means that the icon may be spinning before
    // we cannot retain its position, so it will jump back to the initial rotation. This would be visible if we'd animate the opacity.
    // transition: `opacity ${duration.slow}`,
    visibility: "hidden"
  }
});
const sizes = stylex.create({
  small: {
    width: size.px4,
    height: size.px4,
    maxWidth: size.px4,
    maxHeight: size.px4
  },
  medium: {
    width: size.px8,
    height: size.px8,
    maxWidth: size.px8,
    maxHeight: size.px8
  }
});
export default memo(function RefreshSpinner(t0) {
  const $ = _c(8);
  const {
    size,
    status,
    pullPosition,
    style
  } = t0;
  let t1;
  if ($[0] !== pullPosition || $[1] !== size || $[2] !== status || $[3] !== style) {
    t1 = stylex.props(interaction.inert, styles.svg, sizes[size], status === "pulling" ? styles.pulling(pullPosition) : styles[status], style);
    $[0] = pullPosition;
    $[1] = size;
    $[2] = status;
    $[3] = style;
    $[4] = t1;
  } else {
    t1 = $[4];
  }
  let t2;
  if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
    t2 = <path d="M512 64a32 32 0 0 1 32 32v192a32 32 0 0 1-64 0V96a32 32 0 0 1 32-32zm0 640a32 32 0 0 1 32 32v192a32 32 0 1 1-64 0V736a32 32 0 0 1 32-32zm448-192a32 32 0 0 1-32 32H736a32 32 0 1 1 0-64h192a32 32 0 0 1 32 32zm-640 0a32 32 0 0 1-32 32H96a32 32 0 0 1 0-64h192a32 32 0 0 1 32 32zM195.2 195.2a32 32 0 0 1 45.2 0l136 135.8a32 32 0 0 1-45.3 45.3L195.2 240.4a32 32 0 0 1 0-45.2zm452.5 452.5a32 32 0 0 1 45.3 0l135.8 135.9a32 32 0 0 1-45.2 45.2L647.7 693a32 32 0 0 1 0-45.3zm181.1-452.4a32 32 0 0 1 0 45.1L693 376.4a32 32 0 0 1-45.3-45.3l135.9-135.8a32 32 0 0 1 45.2 0zM376.3 647.7a32 32 0 0 1 0 45.3L240.4 828.8a32 32 0 0 1-45.2-45.2L331 647.7a32 32 0 0 1 45.3 0z" />;
    $[5] = t2;
  } else {
    t2 = $[5];
  }
  let t3;
  if ($[6] !== t1) {
    t3 = <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 1024 1024" {...t1}>{t2}</svg>;
    $[6] = t1;
    $[7] = t3;
  } else {
    t3 = $[7];
  }
  return t3;
});
//# sourceMappingURL=RefreshSpinner.jsx.map