'use client';

import React from 'react';
import { Card } from '@/components/ui/card';
import { FolderTree } from 'lucide-react';

export function CategoryInstructions() {
  return (
    <Card className="p-4 bg-blue-50 dark:bg-blue-900/20 border-blue-200 dark:border-blue-800">
      <h4 className="text-blue-900 dark:text-blue-100 mb-2">
        <FolderTree className="w-4 h-4 inline mr-2" />
        分类字典说明
      </h4>
      <ul className="space-y-1 text-sm text-blue-800 dark:text-blue-200">
        <li>• 支持多级树形结构，可无限级嵌套</li>
        <li>• 点击文件夹图标可展开/收起子分类</li>
        <li>• 鼠标悬停在分类上可显示操作按钮</li>
        <li>• 删除前需先删除所有子分类</li>
        <li>• 分类编码建议使用层级编码规则（如 IND001-01）</li>
      </ul>
    </Card>
  );
}