tmp/webapp-docs/frontend/components/icons.js

import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
/**
 * Shared monochrome action icons (stroke = `currentColor`) used across the composer toolbar
 * and elsewhere, so the buttons read as one cohesive set. Each is a tiny stateless SVG.
 * @module gui/components/icons
 */

// Common SVG attributes for the stroked icons.
const ico = {
  width: 18,
  height: 18,
  viewBox: "0 0 24 24",
  fill: "none",
  stroke: "currentColor",
  strokeWidth: 2,
  strokeLinecap: "round",
  strokeLinejoin: "round"
};
export const ShareIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("circle", {
    cx: "18",
    cy: "5",
    r: "3"
  }, void 0, false), /*#__PURE__*/_jsxDEV("circle", {
    cx: "6",
    cy: "12",
    r: "3"
  }, void 0, false), /*#__PURE__*/_jsxDEV("circle", {
    cx: "18",
    cy: "19",
    r: "3"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "8.59",
    y1: "13.51",
    x2: "15.42",
    y2: "17.49"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "15.41",
    y1: "6.51",
    x2: "8.59",
    y2: "10.49"
  }, void 0, false)]
}, void 0, true);
export const ShuffleIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("polyline", {
    points: "16 3 21 3 21 8"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "4",
    y1: "20",
    x2: "21",
    y2: "3"
  }, void 0, false), /*#__PURE__*/_jsxDEV("polyline", {
    points: "21 16 21 21 16 21"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "15",
    y1: "15",
    x2: "21",
    y2: "21"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "4",
    y1: "4",
    x2: "9",
    y2: "9"
  }, void 0, false)]
}, void 0, true);
export const SparkleIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  fill: "currentColor",
  stroke: "none",
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("path", {
    d: "M12 2.5l1.9 5.6 5.6 1.9-5.6 1.9L12 17.5l-1.9-5.6L4.5 10l5.6-1.9z"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M19 14.5l.8 2.2 2.2.8-2.2.8-.8 2.2-.8-2.2-2.2-.8 2.2-.8z"
  }, void 0, false)]
}, void 0, true);
export const WandIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: /*#__PURE__*/_jsxDEV("path", {
    d: "M15 4V2M15 16v-2M8 9h2M20 9h2M17.8 11.8 19 13M15 9h0M17.8 6.2 19 5M3 21l9-9M12.2 6.2 11 5"
  }, void 0, false)
}, void 0, false);
export const TagIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("path", {
    d: "M20.59 13.41 13.42 20.58a2 2 0 0 1-2.83 0L3 13V3h10l7.59 7.59a2 2 0 0 1 0 2.82z"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "7",
    y1: "7",
    x2: "7.01",
    y2: "7"
  }, void 0, false)]
}, void 0, true);
export const GearIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("circle", {
    cx: "12",
    cy: "12",
    r: "3"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"
  }, void 0, false)]
}, void 0, true);

// Hamburger / overflow trigger for the header links menu.
export const MenuIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("line", {
    x1: "3",
    y1: "6",
    x2: "21",
    y2: "6"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "3",
    y1: "12",
    x2: "21",
    y2: "12"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "3",
    y1: "18",
    x2: "21",
    y2: "18"
  }, void 0, false)]
}, void 0, true);

// Blocks (2x2 grid) — the phone trigger that opens the building-block palette drawer.
export const BlocksIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("rect", {
    x: "3",
    y: "3",
    width: "7",
    height: "7",
    rx: "1.5"
  }, void 0, false), /*#__PURE__*/_jsxDEV("rect", {
    x: "14",
    y: "3",
    width: "7",
    height: "7",
    rx: "1.5"
  }, void 0, false), /*#__PURE__*/_jsxDEV("rect", {
    x: "3",
    y: "14",
    width: "7",
    height: "7",
    rx: "1.5"
  }, void 0, false), /*#__PURE__*/_jsxDEV("rect", {
    x: "14",
    y: "14",
    width: "7",
    height: "7",
    rx: "1.5"
  }, void 0, false)]
}, void 0, true);

// Chevron-left — a clean "back" affordance (Manage master/detail back button).
export const ChevronLeftIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  width: 16,
  height: 16,
  "aria-hidden": "true",
  children: /*#__PURE__*/_jsxDEV("polyline", {
    points: "15 18 9 12 15 6"
  }, void 0, false)
}, void 0, false);

// Trash / delete — used for "clear" actions (per-prompt clear, Clear all).
export const TrashIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("polyline", {
    points: "3 6 5 6 21 6"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "10",
    y1: "11",
    x2: "10",
    y2: "17"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "14",
    y1: "11",
    x2: "14",
    y2: "17"
  }, void 0, false)]
}, void 0, true);

// More / overflow (horizontal three-dots) — the top-bar control-pile collapse trigger on
// narrow screens. Distinct from MenuIcon (the links hamburger) so the two read differently.
export const MoreIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  fill: "currentColor",
  stroke: "none",
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("circle", {
    cx: "5",
    cy: "12",
    r: "2"
  }, void 0, false), /*#__PURE__*/_jsxDEV("circle", {
    cx: "12",
    cy: "12",
    r: "2"
  }, void 0, false), /*#__PURE__*/_jsxDEV("circle", {
    cx: "19",
    cy: "12",
    r: "2"
  }, void 0, false)]
}, void 0, true);

// GitHub mark (filled).
export const GitHubIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  fill: "currentColor",
  stroke: "none",
  "aria-hidden": "true",
  children: /*#__PURE__*/_jsxDEV("path", {
    d: "M12 .5C5.73.5.5 5.73.5 12a11.5 11.5 0 0 0 7.86 10.92c.58.1.79-.25.79-.56v-2c-3.2.7-3.88-1.37-3.88-1.37-.53-1.34-1.3-1.7-1.3-1.7-1.06-.72.08-.71.08-.71 1.17.08 1.78 1.2 1.78 1.2 1.04 1.78 2.73 1.27 3.4.97.1-.75.4-1.27.74-1.56-2.56-.29-5.25-1.28-5.25-5.7 0-1.26.45-2.29 1.19-3.1-.12-.29-.52-1.46.11-3.05 0 0 .97-.31 3.18 1.18a11 11 0 0 1 5.8 0c2.2-1.5 3.17-1.18 3.17-1.18.63 1.59.23 2.76.11 3.05.74.81 1.19 1.84 1.19 3.1 0 4.43-2.69 5.41-5.26 5.69.41.36.78 1.06.78 2.14v3.18c0 .31.21.67.8.56A11.5 11.5 0 0 0 23.5 12C23.5 5.73 18.27.5 12 .5z"
  }, void 0, false)
}, void 0, false);

// Book / docs.
export const BookIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("path", {
    d: "M4 19.5A2.5 2.5 0 0 1 6.5 17H20"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"
  }, void 0, false)]
}, void 0, true);

// Home (fairyfox homepage).
export const HomeIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("path", {
    d: "M3 9.5 12 3l9 6.5"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M5 10v10h14V10"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M9 20v-6h6v6"
  }, void 0, false)]
}, void 0, true);

// Small external-link glyph (decorates each menu link).
export const ExternalLinkIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  width: 14,
  height: 14,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("path", {
    d: "M15 3h6v6"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M10 14 21 3"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M21 14v7H3V3h7"
  }, void 0, false)]
}, void 0, true);

// Shield (privacy policy).
export const ShieldIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: /*#__PURE__*/_jsxDEV("path", {
    d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"
  }, void 0, false)
}, void 0, false);

// Document with lines (terms & conditions).
export const FileTextIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("path", {
    d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M14 2v6h6"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "8",
    y1: "13",
    x2: "16",
    y2: "13"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "8",
    y1: "17",
    x2: "16",
    y2: "17"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "8",
    y1: "9",
    x2: "10",
    y2: "9"
  }, void 0, false)]
}, void 0, true);

// Cookie (cookies policy).
export const CookieIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("path", {
    d: "M12 2a10 10 0 1 0 10 10 4 4 0 0 1-5-5 4 4 0 0 1-5-5z"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M8.5 8.5h.01"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M15 9h.01"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M8 14h.01"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M13 15h.01"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M16 14h.01"
  }, void 0, false)]
}, void 0, true);

// Download (get the pre-built desktop app).
export const DownloadIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("path", {
    d: "M12 3v12"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "m7 10 5 5 5-5"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M5 21h14"
  }, void 0, false)]
}, void 0, true);

// Server / self-host (run the online edition or build it yourself).
export const ServerIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("rect", {
    x: "3",
    y: "4",
    width: "18",
    height: "7",
    rx: "1"
  }, void 0, false), /*#__PURE__*/_jsxDEV("rect", {
    x: "3",
    y: "13",
    width: "18",
    height: "7",
    rx: "1"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M7 7.5h.01"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M7 16.5h.01"
  }, void 0, false)]
}, void 0, true);

// X / close — dismiss the update banner.
export const CloseIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  width: 16,
  height: 16,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("line", {
    x1: "18",
    y1: "6",
    x2: "6",
    y2: "18"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "6",
    y1: "6",
    x2: "18",
    y2: "18"
  }, void 0, false)]
}, void 0, true);

// Copy (two overlapping sheets) — copy the git update command.
export const CopyIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  width: 16,
  height: 16,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("rect", {
    x: "9",
    y: "9",
    width: "13",
    height: "13",
    rx: "2"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"
  }, void 0, false)]
}, void 0, true);

// Palette (Appearance / theme picker trigger).
export const PaletteIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("circle", {
    cx: "13.5",
    cy: "6.5",
    r: ".5",
    fill: "currentColor"
  }, void 0, false), /*#__PURE__*/_jsxDEV("circle", {
    cx: "17.5",
    cy: "10.5",
    r: ".5",
    fill: "currentColor"
  }, void 0, false), /*#__PURE__*/_jsxDEV("circle", {
    cx: "8.5",
    cy: "7.5",
    r: ".5",
    fill: "currentColor"
  }, void 0, false), /*#__PURE__*/_jsxDEV("circle", {
    cx: "6.5",
    cy: "12.5",
    r: ".5",
    fill: "currentColor"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M12 2a10 10 0 0 0 0 20 2 2 0 0 0 2-2 2 2 0 0 1 2-2h1.5a4.5 4.5 0 0 0 4.5-4.5A9.5 9.5 0 0 0 12 2z"
  }, void 0, false)]
}, void 0, true);

// Sun (light base).
export const SunIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("circle", {
    cx: "12",
    cy: "12",
    r: "4"
  }, void 0, false), /*#__PURE__*/_jsxDEV("path", {
    d: "M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M6.34 17.66l-1.41 1.41M19.07 4.93l-1.41 1.41"
  }, void 0, false)]
}, void 0, true);

// Moon (dark base).
export const MoonIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: /*#__PURE__*/_jsxDEV("path", {
    d: "M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"
  }, void 0, false)
}, void 0, false);

// Monitor (System / follow the OS).
export const MonitorIcon = () => /*#__PURE__*/_jsxDEV("svg", {
  ...ico,
  "aria-hidden": "true",
  children: [/*#__PURE__*/_jsxDEV("rect", {
    x: "2",
    y: "3",
    width: "20",
    height: "14",
    rx: "2"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "8",
    y1: "21",
    x2: "16",
    y2: "21"
  }, void 0, false), /*#__PURE__*/_jsxDEV("line", {
    x1: "12",
    y1: "17",
    x2: "12",
    y2: "21"
  }, void 0, false)]
}, void 0, true);