import { useMemo } from 'react';
import SmartSankeyChart from '../../charts/SmartSankeyChart';
import { buildSankeyMockData } from '../../charts/chart-sankey-mock';
import { normalizeDataColorToken } from '../../charts/chart-common';

/** Dashboard 桑基图预览（节点 + 连线 hover，连线默认 20% 透明度）。 */
export default function SankeyChartPreview({
  height = 420,
  dataColorToken = 'data-0',
  showDataTitle = true,
  style,
}) {
  const spec = useMemo(() => {
    const { nodes, links } = buildSankeyMockData();
    return {
      nodes,
      links,
      config: {
        height: Number(height) || 420,
        title: 'AI与客服流向分析',
        dataColorToken: normalizeDataColorToken(dataColorToken),
        showDataTitle,
      },
    };
  }, [height, dataColorToken, showDataTitle]);

  return (
    <div style={{ width: '100%', ...(style || {}) }}>
      <SmartSankeyChart spec={spec} />
    </div>
  );
}
