@primer/react/dist/SkeletonAvatar/SkeletonAvatar.js

An implementation of GitHub's Primer Design System using React

import { c } from 'react-compiler-runtime';
import { isResponsiveValue } from '../hooks/useResponsiveValue.js';
import { DEFAULT_AVATAR_SIZE } from '../Avatar/Avatar.js';
import { SkeletonBox } from '../Skeleton/SkeletonBox.js';
import classes from './SkeletonAvatar.module.css.js';
import { clsx } from 'clsx';
import { jsx } from 'react/jsx-runtime';

function SkeletonAvatar(t0) {
  const $ = c(26);
  let className;
  let rest;
  let square;
  let style;
  let t1;
  if ($[0] !== t0) {
    ({
      size: t1,
      square,
      className,
      style,
      ...rest
    } = t0);
    $[0] = t0;
    $[1] = className;
    $[2] = rest;
    $[3] = square;
    $[4] = style;
    $[5] = t1;
  } else {
    className = $[1];
    rest = $[2];
    square = $[3];
    style = $[4];
    t1 = $[5];
  }
  const size = t1 === undefined ? DEFAULT_AVATAR_SIZE : t1;
  let t2;
  if ($[6] !== size) {
    t2 = isResponsiveValue(size);
    $[6] = size;
    $[7] = t2;
  } else {
    t2 = $[7];
  }
  const responsive = t2;
  let cssSizeVars;
  if ($[8] !== responsive || $[9] !== size) {
    cssSizeVars = {};
    if (responsive) {
      let t3;
      if ($[11] !== size) {
        t3 = Object.entries(size);
        $[11] = size;
        $[12] = t3;
      } else {
        t3 = $[12];
      }
      for (const [key, value] of t3) {
        cssSizeVars[`--avatarSize-${key}`] = `${value}px`;
      }
    } else {
      cssSizeVars["--avatarSize-regular"] = `${size}px`;
    }
    $[8] = responsive;
    $[9] = size;
    $[10] = cssSizeVars;
  } else {
    cssSizeVars = $[10];
  }
  let t3;
  if ($[13] !== className) {
    t3 = clsx(className, classes.SkeletonAvatar);
    $[13] = className;
    $[14] = t3;
  } else {
    t3 = $[14];
  }
  const t4 = responsive ? "" : undefined;
  const t5 = square ? "" : undefined;
  let t6;
  if ($[15] !== style) {
    t6 = style || {};
    $[15] = style;
    $[16] = t6;
  } else {
    t6 = $[16];
  }
  let t7;
  if ($[17] !== cssSizeVars || $[18] !== t6) {
    t7 = {
      ...t6,
      ...cssSizeVars
    };
    $[17] = cssSizeVars;
    $[18] = t6;
    $[19] = t7;
  } else {
    t7 = $[19];
  }
  let t8;
  if ($[20] !== rest || $[21] !== t3 || $[22] !== t4 || $[23] !== t5 || $[24] !== t7) {
    t8 = /*#__PURE__*/jsx(SkeletonBox, {
      className: t3,
      ...rest,
      "data-component": "SkeletonAvatar",
      "data-responsive": t4,
      "data-square": t5,
      style: t7
    });
    $[20] = rest;
    $[21] = t3;
    $[22] = t4;
    $[23] = t5;
    $[24] = t7;
    $[25] = t8;
  } else {
    t8 = $[25];
  }
  return t8;
}

export { SkeletonAvatar };