fix(sw): correct footer auxiliary button state colors

packages/sw/src/components/sw-footer/icons.tsx

@@ -1,4 +1,4 @@
-import type { ReactElement } from "react"
+import { useId, type ReactElement } from "react"
 import line from "./assets/tool-line.svg"
 import lineOn from "./assets/tool-line-on.svg"
 import pline from "./assets/tool-pline.svg"
@@ -19,12 +19,6 @@ import hatch from "./assets/tool-hatch.svg"
 import hatchOn from "./assets/tool-hatch-on.svg"
 import ncopy from "./assets/tool-ncopy.svg"
 import ncopyOn from "./assets/tool-ncopy-on.svg"
-import objectSnap from "./assets/aux-object-snap.svg"
-import selectionEffect from "./assets/aux-selection.svg"
-import orthogonal from "./assets/aux-orthogonal.svg"
-import gridSnap from "./assets/aux-grid-snap.svg"
-import gridBackground from "./assets/aux-grid.svg"
-import lineWeight from "./assets/aux-lineweight.svg"
 
 const img = (src: string, width: number, height = width): ReactElement => <img src={src} width={width} height={height} alt="" draggable={false} />
 
@@ -49,12 +43,41 @@ export const swFooterToolIcons: Record<SWFooterToolIconName, { icon: ReactElemen
 
 export type SWFooterAuxIconName = "objectSnap" | "selectionEffect" | "orthogonal" | "gridSnap" | "gridBackground" | "lineWeight"
 
-/** Figma auxiliary toggle icons (26:10104: 객체스냅, 선택효과, 직각교차, 격자스냅, 격자배경, 선가중치). */
-export const swFooterAuxIcons: Record<SWFooterAuxIconName, ReactElement> = {
-  objectSnap: img(objectSnap, 17),
-  selectionEffect: img(selectionEffect, 16),
-  orthogonal: img(orthogonal, 18),
-  gridSnap: img(gridSnap, 16),
-  gridBackground: img(gridBackground, 17),
-  lineWeight: img(lineWeight, 16, 15),
+/**
+ * Auxiliary toggle icon, drawn inline so the button state reaches it: the fill is `currentColor` (Figma Default
+ * #F1EDE5, Variant2 / Variant3 #FF5C00 — the only difference between the variants), the 1px OUTSIDE outline stays
+ * black 90% (a 2px stroke masked by the shape). Paths are the Figma exports of btn_객체스냅 … (26:9248 – 26:9412).
+ */
+function AuxIcon({ d, width, height }: { d: string; width: number; height: number }) {
+  const mask = `${useId()}aux-outline`
+  return (
+    <svg width={width} height={height} viewBox={`0 0 ${width} ${height}`} fill="none" aria-hidden="true" focusable="false">
+      <path d={d} fillRule="evenodd" clipRule="evenodd" fill="currentColor" />
+      <mask id={mask} maskUnits="userSpaceOnUse" x="0" y="0" width={width} height={height} fill="black">
+        <rect fill="white" width={width} height={height} />
+        <path d={d} fillRule="evenodd" clipRule="evenodd" />
+      </mask>
+      <path d={d} stroke="black" strokeOpacity={0.9} strokeWidth={2} mask={`url(#${mask})`} />
+    </svg>
+  )
 }
+
+const AUX_PATHS: Record<SWFooterAuxIconName, [string, number, number]> = {
+  objectSnap: ["M5 1H1V5H2V16H16V2H5V1ZM3 5H5V3H15V15H3V5Z", 17, 17],
+  selectionEffect: ["M15 15V1H1V15H15ZM14 14H2V2.70718L9.29282 10H7V11H10H11V10V7H10V9.29297L2.70703 2H14V14Z", 16, 16],
+  orthogonal: ["M1 1H2V12H6V16H17V17H6H2H1V16V12V1Z", 18, 18],
+  gridSnap: ["M3 1H1V3H3V1ZM3 5H1V7H3V5ZM1 9H3V11H1V9ZM3 13H1V15H3V13ZM5 1H7V3H5V1ZM7 5H5V7H7V5ZM5 9H7V11H5V9ZM7 13H5V15H7V13ZM9 1H11V3H9V1ZM11 5H9V7H11V5ZM9 9H11V11H9V9ZM11 13H9V15H11V13ZM13 1H15V3H13V1ZM15 5H13V7H15V5ZM13 9H15V11H13V9ZM15 13H13V15H15V13Z", 16, 16],
+  gridBackground: ["M4 1H3V3L1 3V4H3V8H1V9H3V13H1V14H3V16H4V14H8V16H9V14H13V16H14V14H16V13H14V9H16V8H14V4H16V3L14 3V1H13V3L9 3V1H8V3L4 3V1ZM13 13V9H9V13H13ZM8 13V9H4V13H8ZM8 8H4V4H8V8ZM13 8H9V4H13V8Z", 17, 17],
+  lineWeight: ["M1 1H15V3H1V1ZM1 5H15V8H1V5ZM15 10H1V14H15V10Z", 16, 15],
+}
+
+/**
+ * Figma auxiliary toggle icons (26:10104: 객체스냅, 선택효과, 직각교차, 격자스냅, 격자배경, 선가중치). Inline SVG with
+ * a `currentColor` fill: `SWFooterAuxButton` colors them per state (Default #F1EDE5, pressed #FF5C00).
+ */
+export const swFooterAuxIcons: Record<SWFooterAuxIconName, ReactElement> = Object.fromEntries(
+  (Object.keys(AUX_PATHS) as SWFooterAuxIconName[]).map(name => {
+    const [d, width, height] = AUX_PATHS[name]
+    return [name, <AuxIcon key={name} d={d} width={width} height={height} />]
+  }),
+) as Record<SWFooterAuxIconName, ReactElement>