From 7ab5e6d0cef2ea95247ea86f7eed752078fc6b45 Mon Sep 17 00:00:00 2001
From: Ebad Yousefzadeh <ebad.yousefzade@gmail.com>
Date: Fri, 8 May 2026 23:28:47 +0330
Subject: [PATCH] fix(a11y): default icons to aria-hidden=true

---
 icon-sprite/src/_shared.tsx                   |  4 +--
 icon-sprite/tests/run-all-tests.js            |  5 +++
 .../tests/test-accessibility-defaults.test.js | 31 +++++++++++++++++++
 3 files changed, 38 insertions(+), 2 deletions(-)
 create mode 100644 icon-sprite/tests/test-accessibility-defaults.test.js

diff --git a/icon-sprite/src/_shared.tsx b/icon-sprite/src/_shared.tsx
index f3afbc74..0d49cd62 100644
--- a/icon-sprite/src/_shared.tsx
+++ b/icon-sprite/src/_shared.tsx
@@ -20,10 +20,10 @@ export type IconProps = React.SVGProps<SVGSVGElement> & {
 };
 
 // Ultra-minimal renderUse - all logic in one place
-export function renderUse(id: string, path: string, { size, width, height, style, strokeWidth, ...rest }: IconProps) {
-	return (
+export function renderUse(id: string, path: string, { size, width, height, style, strokeWidth, "aria-hidden": ariaHidden, ...rest }: IconProps) {	return (
 		<svg
 			{...rest}
+      aria-hidden={ariaHidden === undefined ? true : ariaHidden}
 			width={width ?? size ?? 24}
 			height={height ?? size ?? 24}
 			style={strokeWidth != null ? ({ "--icon-stroke-width": strokeWidth, ...style } as React.CSSProperties) : style}
diff --git a/icon-sprite/tests/run-all-tests.js b/icon-sprite/tests/run-all-tests.js
index 63b3e60d..4cb7fa7f 100644
--- a/icon-sprite/tests/run-all-tests.js
+++ b/icon-sprite/tests/run-all-tests.js
@@ -18,6 +18,11 @@ const testSuites = [
 		file: "test-lucide-compat.test.js",
 		description: "Verify drop-in replacement for lucide-react (same export names)",
 	},
+	{
+		name: "Accessibility Defaults",
+		file: "test-accessibility-defaults.test.js",
+		description: "Verify icons are aria-hidden by default and user overrides win",
+	},
 	{
 		name: "Sprite ID Match Tests",
 		file: "test-sprite-id-match.test.js",
diff --git a/icon-sprite/tests/test-accessibility-defaults.test.js b/icon-sprite/tests/test-accessibility-defaults.test.js
new file mode 100644
index 00000000..93cad8ba
--- /dev/null
+++ b/icon-sprite/tests/test-accessibility-defaults.test.js
@@ -0,0 +1,31 @@
+#!/usr/bin/env node
+/**
+ * Test: Verify icon accessibility defaults match lucide-react behavior.
+ */
+import path from "path";
+import { fileURLToPath } from "url";
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+try {
+	const { renderUse } = await import(path.resolve(__dirname, "../dist/_shared.js"));
+	const defaultIcon = renderUse("bell", "/sprite.svg", {});
+	if (defaultIcon.props["aria-hidden"] !== true) {
+		throw new Error(`Expected default aria-hidden=true, got ${String(defaultIcon.props["aria-hidden"])}`);
+	}
+	const exposedIcon = renderUse("bell", "/sprite.svg", {
+		"aria-hidden": false,
+		role: "img",
+		"aria-label": "Notifications",
+	});
+	if (exposedIcon.props["aria-hidden"] !== false) {
+		throw new Error(`Expected aria-hidden override=false, got ${String(exposedIcon.props["aria-hidden"])}`);
+	}
+	if (exposedIcon.props.role !== "img" || exposedIcon.props["aria-label"] !== "Notifications") {
+		throw new Error("Expected explicit accessibility props to pass through");
+	}
+	console.log("✅ Icons default to aria-hidden=true.");
+	console.log("✅ Explicit accessibility props override the default.");
+} catch (e) {
+	console.error(`❌ Test failed: ${e.message}`);
+	process.exit(1);
+}