단순이동평균선 이름 표시방식 변경

frontend/src/components/ChartCustomOverlaySettingsModal.tsx

@@ -17,6 +17,8 @@ interface ChartCustomOverlaySettingsModalProps {
   selection: ChartCustomOverlaySelection;
   onSave: (selection: ChartCustomOverlaySelection) => void;
   onCancel: () => void;
+  /** SMA 보조지표 params — MA5일 등 동적 라벨 */
+  smaParams?: Record<string, number | string | boolean>;
 }
 
 const SECTION_META: Array<{
@@ -56,6 +58,7 @@ const ChartCustomOverlaySettingsModal: React.FC<ChartCustomOverlaySettingsModalP
   selection,
   onSave,
   onCancel,
+  smaParams,
 }) => {
   const draftRef = useRef(cloneChartCustomOverlaySelection(selection));
   const [, bump] = useState(0);
@@ -110,7 +113,7 @@ const ChartCustomOverlaySettingsModal: React.FC<ChartCustomOverlaySettingsModalP
           return (
             <GridToggle
               key={pid}
-              label={smaMaLabel(i)}
+              label={smaMaLabel(i, smaParams)}
               checked={draft.smaPlots[pid] !== false}
               onChange={v => patch(d => { d.smaPlots[pid] = v; })}
             />

frontend/src/components/ChartSlot.tsx

@@ -1120,6 +1120,7 @@ const ChartSlot = forwardRef<ChartSlotHandle, ChartSlotProps>(function ChartSlot
             selection={customOverlaySelection}
             onSave={sel => handleSaveCustomOverlaySelection('custom', sel)}
             onCancel={() => setCustomOverlaySettingsSlot(null)}
+            smaParams={indicators.find(i => i.type === 'SMA')?.params}
           />
         )}
         {customOverlaySettingsSlot === 'custom1' && !compactMode && (
@@ -1128,6 +1129,7 @@ const ChartSlot = forwardRef<ChartSlotHandle, ChartSlotProps>(function ChartSlot
             selection={custom1OverlaySelection}
             onSave={sel => handleSaveCustomOverlaySelection('custom1', sel)}
             onCancel={() => setCustomOverlaySettingsSlot(null)}
+            smaParams={indicators.find(i => i.type === 'SMA')?.params}
           />
         )}
 

frontend/src/components/IndicatorSettingsForm.tsx

@@ -5,7 +5,6 @@ import React, { useState, useCallback, useEffect, useRef } from 'react';
 import type { IndicatorConfig, Timeframe } from '../types';
 import { getIndicatorDef } from '../utils/indicatorRegistry';
 import type { PlotDef, HLineDef } from '../utils/indicatorRegistry';
-import { getPlotLabel } from '../utils/indicatorLabels';
 import { getNumericParamSpec } from '../utils/indicatorParamSpec';
 import NumericParamInput from './NumericParamInput';
 import SmaPeriodInput from './SmaPeriodInput';
@@ -14,6 +13,7 @@ import {
   SMA_MA_COUNT,
   smaPeriodKey,
   smaPlotId,
+  formatSmaMaDisplayLabel,
 } from '../utils/smaConfig';
 import PlotLineStylePicker from './PlotLineStylePicker';
 import {
@@ -188,8 +188,14 @@ const IndicatorSettingsForm: React.FC<IndicatorSettingsFormProps> = ({
   }, [plotVis, patch]);
 
   const handleSmaPeriod = useCallback((maIndex: number, v: number) => {
-    patch({ params: { ...params, [smaPeriodKey(maIndex)]: v } });
-  }, [params, patch]);
+    const nextParams = { ...params, [smaPeriodKey(maIndex)]: v };
+    const nextPlots = plots.map((pl, i) =>
+      i === maIndex - 1
+        ? { ...pl, title: formatSmaMaDisplayLabel(nextParams, maIndex) }
+        : pl,
+    );
+    patch({ params: nextParams, plots: nextPlots });
+  }, [params, plots, patch]);
 
   const handleSmaToggle = useCallback((plotIndex: number, enabled: boolean) => {
     patch({ plotVis: { ...plotVis, [smaPlotId(plotIndex)]: enabled } });
@@ -254,7 +260,9 @@ const IndicatorSettingsForm: React.FC<IndicatorSettingsFormProps> = ({
                   />
                   <span className="ism-toggle-slider" />
                 </label>
-                <label className="ism-label ism-sma-ma-label">{getPlotLabel(`MA${maNum}`)}</label>
+                <label className="ism-label ism-sma-ma-label">
+                  {formatSmaMaDisplayLabel(params, maNum)}
+                </label>
                 <div
                   className="ism-control ism-sma-ma-control"
                   onMouseDown={e => e.stopPropagation()}
@@ -268,7 +276,7 @@ const IndicatorSettingsForm: React.FC<IndicatorSettingsFormProps> = ({
                   {plot && !inputsOnly && (
                     <PlotLineStylePicker
                       disabled={!enabled}
-                      title={`MA${maNum}`}
+                      title={formatSmaMaDisplayLabel(params, maNum)}
                       value={{
                         color: plot.color,
                         lineWidth: plot.lineWidth,

frontend/src/components/paneLegendLayout.ts

@@ -6,6 +6,7 @@ import { ChartManager } from '../utils/ChartManager';
 import { getIndicatorDef, getIndicatorChartTitle } from '../utils/indicatorRegistry';
 import { getGlobalParamKeys, getPlotParamKeys } from '../utils/indicatorSettingsLayout';
 import { formatBbLegendLabel } from '../utils/bollingerConfig';
+import { formatSmaMaDisplayLabel, SMA_MA_COUNT, smaPlotId } from '../utils/smaConfig';
 
 export interface PaneItem {
   id:         string;
@@ -23,6 +24,17 @@ function makeLabel(config: IndicatorConfig): string {
   if (config.type === 'BollingerBands') {
     return formatBbLegendLabel(config.params ?? {});
   }
+  if (config.type === 'SMA') {
+    const params = (config.params ?? {}) as Record<string, number | string | boolean>;
+    const vis = config.plotVisibility ?? {};
+    const labels: string[] = [];
+    for (let i = 0; i < SMA_MA_COUNT; i++) {
+      const pid = smaPlotId(i);
+      if (vis[pid] === false) continue;
+      labels.push(formatSmaMaDisplayLabel(params, i + 1));
+    }
+    return labels.length ? labels.join(' · ') : getIndicatorChartTitle('SMA');
+  }
   const name = getIndicatorChartTitle(config.type);
   const def = getIndicatorDef(config.type);
   const params = (config.params ?? def?.defaultParams ?? {}) as Record<string, number | string | boolean>;