interface Props {
  /** 正文行数 */
  lines?: number;
  /** 左侧头像位 */
  avatar?: boolean;
  label?: string;
  className?: string;
}

/**
 * 玻璃骨架：加载中的占位块。
 * 保持最终版式的高度与节奏，数据到达后整块替换；不做闪烁。
 */
export function GlassAppleSkeleton({
  lines = 3,
  avatar = false,
  label = '加载中',
  className = '',
}: Props) {
  return (
    <div
      role="status"
      aria-busy="true"
      aria-label={label}
      className={`flex items-start gap-3 ${className}`}
    >
      {avatar && (
        <span
          aria-hidden="true"
          className="
            size-10 shrink-0 rounded-full
            bg-[var(--glass-bg)] border border-[var(--glass-border)]
            backdrop-blur-xl shadow-[var(--glass-inset)]
          "
        />
      )}
      <div className="flex-1 space-y-2.5 pt-0.5">
        {Array.from({ length: lines }).map((_, i) => (
          <span
            key={i}
            aria-hidden="true"
            className="
              block h-3 rounded-full
              bg-[var(--glass-bg)] border border-[var(--glass-border)]
              shadow-[var(--glass-inset)]
            "
            style={{ width: `${Math.max(42, 100 - i * 14)}%` }}
          />
        ))}
      </div>
    </div>
  );
}