Mercurial

diff design_system/src/components/icon.js @ 258:60a876c4587a

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[ui] Add semantic primitive ownership Build a layered Zenbu token and sizing system, make authored controls use native-underneath primitives, migrate mrjunejune without imposing visual surfaces, and document/enforce HTML ownership in the catalog and wiki. Co-authored-by: Copilot <[email protected]>
author MrJuneJune <me@mrjunejune.com>
date Wed, 05 Aug 2026 05:25:40 -0700
parents 2b6e732087ff
children 41a49c29a28f
line wrap: on
line diff
--- a/design_system/src/components/icon.js	Tue Aug 04 16:49:11 2026 -0700
+++ b/design_system/src/components/icon.js	Wed Aug 05 05:25:40 2026 -0700
@@ -28,7 +28,21 @@
   menu: ["M4 6h16", "M4 12h16", "M4 18h16"],
   moon: ["M20 15a8 8 0 0 1-11-11 9 9 0 1 0 11 11Z"],
   more: ["M5 12h.01", "M12 12h.01", "M19 12h.01"],
+  offline: [
+    "M5 12a7 7 0 0 1 10.5-6",
+    "M19 12a7 7 0 0 0-.7-3",
+    "M8.5 15.5a5 5 0 0 1 7 0",
+    "M11.5 19h1",
+    "M3 3l18 18",
+  ],
   pause: ["M8 5v14", "M16 5v14"],
+  paw: [
+    "M8 11c-1.7 0-3-1.5-3-3.3S6 4.5 7.7 4.5s2.5 1.5 2.5 3.3S9.7 11 8 11Z",
+    "M16 11c-1.7 0-2.2-1.5-2.2-3.2s.8-3.3 2.5-3.3S19 6 19 7.7 17.7 11 16 11Z",
+    "M5.3 15c-1.5 0-2.8-1.2-2.8-2.7s1.2-2.8 2.7-2.8S8 10.7 8 12.2 6.8 15 5.3 15Z",
+    "M18.7 15c-1.5 0-2.7-1.2-2.7-2.8s1.2-2.7 2.8-2.7 2.7 1.2 2.7 2.8-1.3 2.7-2.8 2.7Z",
+    "M7 18.5c0-3 2.2-5.5 5-5.5s5 2.5 5 5.5c0 1.5-1.2 2.5-2.7 2.5-.8 0-1.5-.4-2.3-.4s-1.5.4-2.3.4C8.2 21 7 20 7 18.5Z",
+  ],
   play: ["m8 5 11 7-11 7Z"],
   repository: ["M4 4h13a3 3 0 0 1 3 3v13H7a3 3 0 0 1-3-3Z", "M8 4v16"],
   retry: ["M4 4v6h6", "M5 9a8 8 0 1 1 2 8"],
@@ -99,7 +113,10 @@
       this.setAttribute("aria-hidden", "true");
     }
     this.dataset.zenIcon = known ? requested : "alert";
-    this.style.setProperty("--zen-icon-size", safeSize(this.getAttribute("size")));
+    this.style.setProperty(
+      "--zenbu-icon-size",
+      safeSize(this.getAttribute("size")),
+    );
     this.replaceChildren(svg);
   }
 }