feat(packages): add UI support for gestures and hotkeys (#1388)

Co-authored-by: Rahim <rahim.alwer@gmail.com> Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
2026-08-16 02:45:09 +00:00 · 2026-05-05 10:34:12 +10:00
parent 6c81f2d190
commit 0620814a67
187 changed files with 5665 additions and 405 deletions
@@ -0,0 +1,130 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+import { join } from 'node:path';
+
+import type { CustomPlugin, XastElement } from 'svgo';
+import { optimize } from 'svgo';
+
+import {
+  ASSETS_DIR,
+  createSvgoConfig,
+  getIconSets,
+  getSvgFiles,
+  PRESET_DEFAULT_OVERRIDES,
+  REMOVE_ATTRS_PLUGIN,
+  replaceColors,
+} from './shared.js';
+
+const SHAPES = new Set(['circle', 'ellipse', 'line', 'path', 'polygon', 'polyline', 'rect']);
+
+function allShapesUseCurrentColor(node: XastElement, inheritedFill: string): boolean {
+  for (const child of node.children) {
+    if (child.type !== 'element') continue;
+
+    const effectiveFill = child.attributes.fill ?? inheritedFill;
+
+    if (SHAPES.has(child.name)) {
+      if (effectiveFill !== 'currentColor') return false;
+    } else if (!allShapesUseCurrentColor(child, effectiveFill)) {
+      return false;
+    }
+  }
+  return true;
+}
+
+function hasShapeDescendant(node: XastElement): boolean {
+  for (const child of node.children) {
+    if (child.type !== 'element') continue;
+    if (SHAPES.has(child.name) || hasShapeDescendant(child)) return true;
+  }
+  return false;
+}
+
+function removeFillCurrentColor(node: XastElement): void {
+  if (node.attributes.fill === 'currentColor') {
+    delete node.attributes.fill;
+  }
+  for (const child of node.children) {
+    if (child.type === 'element') removeFillCurrentColor(child);
+  }
+}
+
+/**
+ * When the root `<svg>` has `fill="none"` but every shape descendant uses
+ * `fill="currentColor"` (directly or inherited from a `<g>`), hoist
+ * `fill="currentColor"` to the root and strip it from descendants.
+ *
+ * With `multipass: true`, SVGO's `collapseGroups` will then clean up any
+ * `<g>` elements left with no attributes on the next pass.
+ */
+const hoistCurrentColorFill: CustomPlugin = {
+  name: 'hoistCurrentColorFill',
+  fn: () => ({
+    element: {
+      exit(node) {
+        if (node.name !== 'svg') return;
+        if (node.attributes.fill !== 'none') return;
+        if (!hasShapeDescendant(node)) return;
+        if (!allShapesUseCurrentColor(node, 'none')) return;
+
+        node.attributes.fill = 'currentColor';
+
+        for (const child of node.children) {
+          if (child.type === 'element') removeFillCurrentColor(child);
+        }
+      },
+    },
+  }),
+};
+
+const SVGO_CONFIG = createSvgoConfig(
+  [
+    {
+      name: 'preset-default',
+      params: {
+        overrides: {
+          ...PRESET_DEFAULT_OVERRIDES,
+          convertShapeToPath: false,
+        },
+      },
+    },
+    REMOVE_ATTRS_PLUGIN,
+    hoistCurrentColorFill,
+  ],
+  {
+    js2svg: {
+      indent: 2,
+      pretty: true,
+    },
+  }
+);
+
+function formatFile(filePath: string): boolean {
+  const input = readFileSync(filePath, 'utf8');
+  const formatted = replaceColors(optimize(input, SVGO_CONFIG).data);
+
+  if (formatted !== input) {
+    writeFileSync(filePath, formatted);
+    return true;
+  }
+
+  return false;
+}
+
+function getAllSvgFiles(): string[] {
+  return getIconSets().flatMap((set) => getSvgFiles(set).map((file) => join(ASSETS_DIR, set, file)));
+}
+
+const files = process.argv.length > 2 ? process.argv.slice(2) : getAllSvgFiles();
+
+let changed = 0;
+
+for (const file of files) {
+  if (formatFile(file)) {
+    console.log(`  formatted: ${file}`);
+    changed++;
+  }
+}
+
+if (changed > 0) {
+  console.log(`\nFormatted ${changed} of ${files.length} SVG files.`);
+}