/* FreeSize — icons, logo, app icon. All exported to window. */
const Icon = ({ path, size = 18, stroke = 1.7, fill = "none", style, children }) => (
  <svg
    width={size}
    height={size}
    viewBox="0 0 24 24"
    fill={fill}
    stroke="currentColor"
    strokeWidth={stroke}
    strokeLinecap="round"
    strokeLinejoin="round"
    style={style}
    aria-hidden="true"
  >
    {children || (Array.isArray(path) ? path.map((d, i) => <path key={i} d={d} />) : <path d={path} />)}
  </svg>
);

const IconChevron = (p) => <Icon {...p} path="M9 6l6 6-6 6" />;
const IconFolder = (p) => (
  <Icon {...p} path="M3 7a2 2 0 0 1 2-2h4l2 2h6a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
);
const IconFile = (p) => (
  <Icon {...p}>
    <path d="M6 3h7l5 5v13a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z" />
    <path d="M13 3v5h5" />
  </Icon>
);
const IconSearch = (p) => (
  <Icon {...p}>
    <circle cx="11" cy="11" r="7" />
    <path d="M21 21l-4.3-4.3" />
  </Icon>
);
const IconRadar = (p) => (
  <Icon {...p}>
    <circle cx="12" cy="12" r="9" />
    <circle cx="12" cy="12" r="4.5" />
    <path d="M12 12L19 7" />
  </Icon>
);
const IconSettings = (p) => (
  <Icon {...p}>
    <circle cx="12" cy="12" r="3" />
    <path d="M19.4 13.5a1.7 1.7 0 0 0 .34 1.87l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.7 1.7 0 0 0-1.87-.34 1.7 1.7 0 0 0-1.03 1.56V21a2 2 0 0 1-4 0v-.09a1.7 1.7 0 0 0-1.11-1.56 1.7 1.7 0 0 0-1.87.34l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.7 1.7 0 0 0 .34-1.87 1.7 1.7 0 0 0-1.56-1.03H3a2 2 0 0 1 0-4h.09a1.7 1.7 0 0 0 1.56-1.11 1.7 1.7 0 0 0-.34-1.87l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.7 1.7 0 0 0 1.87.34H9a1.7 1.7 0 0 0 1-1.56V3a2 2 0 0 1 4 0v.09a1.7 1.7 0 0 0 1 1.56 1.7 1.7 0 0 0 1.87-.34l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.7 1.7 0 0 0-.34 1.87V9a1.7 1.7 0 0 0 1.56 1H21a2 2 0 0 1 0 4h-.09a1.7 1.7 0 0 0-1.51 1z" />
  </Icon>
);
const IconFolderOpen = (p) => (
  <Icon {...p} path="M3 7a2 2 0 0 1 2-2h4l2 2h6a2 2 0 0 1 2 2H7a2 2 0 0 0-1.9 1.37L3 18z M3 18l2.1-7.6A2 2 0 0 1 7 9h13.5a1 1 0 0 1 .96 1.27L19.5 17a2 2 0 0 1-1.9 1.4H4.5" />
);
const IconExternal = (p) => (
  <Icon {...p}>
    <path d="M14 4h6v6" />
    <path d="M20 4l-9 9" />
    <path d="M19 14v5a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5" />
  </Icon>
);
const IconCheck = (p) => <Icon {...p} path="M5 12.5l4.5 4.5L19 6.5" />;
const IconX = (p) => <Icon {...p} path="M6 6l12 12M18 6L6 18" />;
const IconSun = (p) => (
  <Icon {...p}>
    <circle cx="12" cy="12" r="4.2" />
    <path d="M12 2v2.5M12 19.5V22M4.9 4.9l1.8 1.8M17.3 17.3l1.8 1.8M2 12h2.5M19.5 12H22M4.9 19.1l1.8-1.8M17.3 6.7l1.8-1.8" />
  </Icon>
);
const IconMoon = (p) => <Icon {...p} path="M20 13.2A8 8 0 1 1 10.8 4a6.3 6.3 0 0 0 9.2 9.2z" />;
const IconSliders = (p) => (
  <Icon {...p}>
    <path d="M4 7h10M18 7h2M4 17h2M10 17h10" />
    <circle cx="16" cy="7" r="2" />
    <circle cx="8" cy="17" r="2" />
  </Icon>
);
const IconRefresh = (p) => (
  <Icon {...p}>
    <path d="M20 11a8 8 0 1 0-.7 3.3" />
    <path d="M20 5v6h-6" />
  </Icon>
);
const IconChevDown = (p) => <Icon {...p} path="M6 9l6 6 6-6" />;
const IconHardDrive = (p) => (
  <Icon {...p}>
    <path d="M3 13l2.5-7A2 2 0 0 1 7.4 5h9.2a2 2 0 0 1 1.9 1.4L21 13v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
    <path d="M3 13h18" />
    <circle cx="7.5" cy="16" r="1" />
  </Icon>
);
const IconGrid = (p) => (
  <Icon {...p}>
    <rect x="3" y="3" width="8" height="11" rx="1.4" />
    <rect x="13" y="3" width="8" height="6" rx="1.4" />
    <rect x="13" y="11" width="8" height="10" rx="1.4" />
    <rect x="3" y="16" width="8" height="5" rx="1.4" />
  </Icon>
);
const IconList = (p) => (
  <Icon {...p}>
    <path d="M8 6h13M8 12h13M8 18h13" />
    <path d="M3.5 6h.01M3.5 12h.01M3.5 18h.01" />
  </Icon>
);
const IconLock = (p) => (
  <Icon {...p}>
    <rect x="4.5" y="10.5" width="15" height="10" rx="2" />
    <path d="M8 10.5V7.5a4 4 0 0 1 8 0v3" />
  </Icon>
);
const IconArrowRight = (p) => <Icon {...p} path="M5 12h14M13 6l6 6-6 6" />;
const IconInfo = (p) => (
  <Icon {...p}>
    <circle cx="12" cy="12" r="9" />
    <path d="M12 11v5M12 8h.01" />
  </Icon>
);
const IconSync = (p) => (
  <Icon {...p}>
    <path d="M4 9a8 8 0 0 1 13.7-3.3L20 8" />
    <path d="M20 4v4h-4" />
    <path d="M20 15a8 8 0 0 1-13.7 3.3L4 16" />
    <path d="M4 20v-4h4" />
  </Icon>
);
const IconSpark = (p) => (
  <Icon {...p} fill="currentColor" stroke="none" path="M12 2l1.8 6.5L20 10l-6.2 1.5L12 18l-1.8-6.5L4 10l6.2-1.5z" />
);
const IconSunburst = (p) => (
  <Icon {...p}>
    <circle cx="12" cy="12" r="9" />
    <circle cx="12" cy="12" r="3.4" />
    <path d="M12 3v5.6M19.8 13.5l-5.3-1.7M8.5 18.6l1.6-5.1" />
  </Icon>
);

// ---- App icon: a treemap tile built from rectangles + the heatmap palette ----
const AppIcon = ({ size = 28, radius }) => {
  const r = radius != null ? radius : size * 0.26;
  const heat = (window.FZ && window.FZ.heatColor) || (() => "#5ab");
  const pad = size * 0.085;
  const g = size * 0.05; // gap
  const inner = size - pad * 2;
  // partition the tile into treemap-like rects
  const w1 = inner * 0.56;
  const w2 = inner - w1 - g;
  const h1 = inner * 0.62;
  const h2 = inner - h1 - g;
  const rr = Math.max(1.5, size * 0.05);
  const tiles = [
    { x: pad, y: pad, w: w1, h: inner, t: 0.95 },
    { x: pad + w1 + g, y: pad, w: w2, h: h1, t: 0.55 },
    { x: pad + w1 + g, y: pad + h1 + g, w: w2 * 0.5 - g / 2, h: h2, t: 0.18 },
    { x: pad + w1 + g + w2 * 0.5 + g / 2, y: pad + h1 + g, w: w2 * 0.5 - g / 2, h: h2, t: 0.34 },
  ];
  return (
    <svg width={size} height={size} viewBox={`0 0 ${size} ${size}`} aria-hidden="true" style={{ display: "block" }}>
      <rect x="0" y="0" width={size} height={size} rx={r} className="appicon-bg" />
      {tiles.map((t, i) => (
        <rect key={i} x={t.x} y={t.y} width={t.w} height={t.h} rx={rr} fill={heat(t.t)} />
      ))}
    </svg>
  );
};

const Logo = ({ iconSize = 26, showSub = true }) => (
  <div className="brand">
    <AppIcon size={iconSize} />
    <div className="brand-text">
      <span className="brand-name">FreeSize</span>
      {showSub && <span className="brand-sub">Disk Space Analyzer</span>}
    </div>
  </div>
);

Object.assign(window, {
  Icon, IconChevron, IconChevDown, IconFolder, IconFolderOpen, IconFile, IconSearch,
  IconRadar, IconSettings, IconExternal, IconCheck, IconX, IconSun, IconMoon, IconSliders,
  IconRefresh, IconHardDrive, IconGrid, IconList, IconLock, IconArrowRight, IconInfo,
  IconSync, IconSpark, IconSunburst, AppIcon, Logo,
});