import React from 'react';
import classNames from 'classnames';
import { jsx as _jsx } from "react/jsx-runtime";
export const THINKING_ICON_SIZES = {
  SM: 'sm',
  MD: 'md'
};
// Bar geometry in natural SVG coordinates (viewBox 0 0 18.667 18).
const BARS = [{
  top: 0,
  left: 0,
  width: 9.334
}, {
  top: 2,
  left: 9.334,
  width: 4.661
}, {
  top: 4,
  left: 0,
  width: 9.334
}, {
  top: 6,
  left: 14,
  width: 4.667
}, {
  top: 8,
  left: 0,
  width: 14
}, {
  top: 10,
  left: 14,
  width: 4.667
}, {
  top: 12,
  left: 0,
  width: 9.334
}, {
  top: 14,
  left: 9.334,
  width: 4.661
}, {
  top: 16,
  left: 0,
  width: 9.334
}];
const BAR_HEIGHT = 2;

// Staggered cascade: left backbone bars enter first, right accent bars follow.
// Entry order: r1 → r7 → r3 → r9 → r5 → r8 → r2 → r4 → r6
const DELAYS = [0.0, 0.62, 0.22, 0.7, 0.44, 0.76, 0.12, 0.54, 0.32];
export function ThinkingIcon({
  size = THINKING_ICON_SIZES.MD
}) {
  return /*#__PURE__*/_jsx("svg", {
    className: classNames('thinking-icon', size),
    viewBox: "0 0 18.667 18",
    "aria-hidden": "true",
    children: BARS.map((bar, i) => /*#__PURE__*/_jsx("rect", {
      className: "bar",
      x: bar.left,
      y: bar.top,
      width: bar.width,
      height: BAR_HEIGHT
      // eslint-disable-next-line react/forbid-dom-props
      ,
      style: {
        animationDelay: `${DELAYS[i]}s`
      }
    }, i))
  });
}