From 42bc322fd3874a0bda919dd4f0ea1acd95863cb4 Mon Sep 17 00:00:00 2001
From: sBouzols <sylvain.bouzols@gmail.com>
Date: Thu, 4 Sep 2025 12:03:46 +0200
Subject: [PATCH] feat(LeftPanelOpenIcon): Wrap with `SvgIcon` from MUI to use
 Material Symbols SVG icons with the same API as Material Icons from MUI (same
 props, same CSS and all).

Signed-off-by: sBouzols <sylvain.bouzols@gmail.com>
---
 demo/src/app.jsx                           |  2 ++
 src/components/icons/LeftPanelOpenIcon.tsx | 16 +++-------------
 2 files changed, 5 insertions(+), 13 deletions(-)

diff --git a/demo/src/app.jsx b/demo/src/app.jsx
index f4100148..549663cf 100644
--- a/demo/src/app.jsx
+++ b/demo/src/app.jsx
@@ -103,6 +103,7 @@ import {
     networkModificationsFr,
     logout,
     equipmentStyles,
+    LeftPanelOpenIcon,
 } from '../../src';
 
 const messages = {
@@ -612,6 +613,7 @@ function AppContent({ language, onLanguageClick }) {
             <hr />
             <hr />
             {testIcons()}
+            <LeftPanelOpenIcon fontSize="large" color="secondary" />
             <hr />
 
             <PermanentSnackButton />
diff --git a/src/components/icons/LeftPanelOpenIcon.tsx b/src/components/icons/LeftPanelOpenIcon.tsx
index 69a36566..a0e7ea17 100644
--- a/src/components/icons/LeftPanelOpenIcon.tsx
+++ b/src/components/icons/LeftPanelOpenIcon.tsx
@@ -6,18 +6,8 @@
  */
 
 import LeftPanelOpen from '@material-symbols/svg-400/outlined/left_panel_open.svg?react';
-import { useTheme } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
-export function LeftPanelOpenIcon() {
-    const theme = useTheme();
-
-    return (
-        <LeftPanelOpen
-            style={{
-                width: 24,
-                height: 24,
-                fill: theme.palette.text.primary,
-            }}
-        />
-    );
+export function LeftPanelOpenIcon(props: SvgIconProps) {
+    return <SvgIcon component={LeftPanelOpen} inheritViewBox {...props} />;
 }