@easy-editor/materials-dashboard-radar-chart 0.0.2

package/src/constants.ts

@@ -0,0 +1,51 @@
+/**
+ * 物料常量配置
+ * 统一管理全局变量名等配置，确保 meta.ts 和 rollup.config.js 使用相同的值
+ */
+
+/**
+ * UMD 全局变量基础名称
+ */
+export const COMPONENT_NAME = 'EasyEditorMaterialsTechRadarChart'
+
+/**
+ * 包名
+ */
+export const PACKAGE_NAME = '@easy-editor/materials-dashboard-tech-radar-chart'
+
+/**
+ * 默认颜色
+ */
+export const DEFAULT_COLORS = ['#00d4ff', '#00ff88', '#ff6b6b', '#ffd93d', '#6bcbff', '#c56bff']
+
+/**
+ * 默认维度
+ */
+export const DEFAULT_DIMENSIONS = ['Attack', 'Defense', 'Speed', 'Magic', 'HP']
+
+/**
+ * 雷达图数据点类型
+ */
+export interface RadarDataPoint {
+  dimension: string
+  [key: string]: number | string | undefined
+}
+
+/**
+ * 默认数据
+ */
+export const DEFAULT_DATA: RadarDataPoint[] = [
+  { dimension: 'Attack', player1: 85, player2: 70 },
+  { dimension: 'Defense', player1: 70, player2: 90 },
+  { dimension: 'Speed', player1: 95, player2: 60 },
+  { dimension: 'Magic', player1: 60, player2: 85 },
+  { dimension: 'HP', player1: 75, player2: 80 },
+]
+
+/**
+ * 默认系列配置
+ */
+export const DEFAULT_SERIES = [
+  { name: 'Player 1', dataKey: 'player1', color: '#00d4ff' },
+  { name: 'Player 2', dataKey: 'player2', color: '#00ff88' },
+]

package/src/index.tsx

@@ -0,0 +1,7 @@
+/**
+ * RadarChart Entry
+ * 雷达图组件入口
+ */
+
+export { default as component } from './component'
+export { default as meta } from './meta'

package/src/meta.ts

@@ -0,0 +1,23 @@
+import type { ComponentMetadata } from '@easy-editor/core'
+import { MaterialGroup } from '@easy-editor/materials-shared'
+import { COMPONENT_NAME, PACKAGE_NAME } from './constants'
+import configure from './configure'
+import snippets from './snippets'
+import pkg from '../package.json'
+
+const meta: ComponentMetadata = {
+  componentName: COMPONENT_NAME,
+  title: '雷达图',
+  group: MaterialGroup.CHART,
+  devMode: 'proCode',
+  npm: {
+    package: PACKAGE_NAME,
+    version: pkg.version,
+    globalName: COMPONENT_NAME,
+    componentName: COMPONENT_NAME,
+  },
+  snippets,
+  configure,
+}
+
+export default meta

package/src/snippets.ts

@@ -0,0 +1,57 @@
+import type { Snippet } from '@easy-editor/core'
+import { COMPONENT_NAME, DEFAULT_DATA, DEFAULT_SERIES } from './constants'
+
+const snippets: Snippet[] = [
+  {
+    title: '雷达图',
+    screenshot: '',
+    schema: {
+      componentName: COMPONENT_NAME,
+      props: {
+        data: DEFAULT_DATA,
+        dimensionKey: 'dimension',
+        series: DEFAULT_SERIES,
+        showGrid: true,
+        fillOpacity: 0.3,
+        glowEffect: true,
+        showLegend: true,
+      },
+      $dashboard: {
+        rect: {
+          width: 400,
+          height: 300,
+        },
+      },
+    },
+  },
+  {
+    title: '单系列雷达图',
+    screenshot: '',
+    schema: {
+      componentName: COMPONENT_NAME,
+      props: {
+        data: [
+          { dimension: 'Attack', value: 85 },
+          { dimension: 'Defense', value: 70 },
+          { dimension: 'Speed', value: 95 },
+          { dimension: 'Magic', value: 60 },
+          { dimension: 'HP', value: 75 },
+        ],
+        dimensionKey: 'dimension',
+        series: [{ name: 'Stats', dataKey: 'value', color: '#00d4ff' }],
+        showGrid: true,
+        fillOpacity: 0.4,
+        glowEffect: true,
+        showLegend: false,
+      },
+      $dashboard: {
+        rect: {
+          width: 400,
+          height: 300,
+        },
+      },
+    },
+  },
+]
+
+export default snippets

package/src/type.d.ts

@@ -0,0 +1,8 @@
+/**
+ * CSS Modules Type Declarations
+ */
+
+declare module '*.module.css' {
+  const classes: { readonly [key: string]: string }
+  export default classes
+}

package/tsconfig.build.json

@@ -0,0 +1,12 @@
+{
+  "extends": "../../../../tsconfig.json",
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "strictPropertyInitialization": false,
+    "outDir": "./dist",
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["./src"]
+}

package/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true
+  },
+  "extends": "./tsconfig.build.json",
+  "include": ["./src", "./test"]
+}

package/tsconfig.test.json

@@ -0,0 +1,7 @@
+{
+  "extends": "./tsconfig.build.json",
+  "compilerOptions": {
+    "noEmit": true
+  },
+  "include": ["./src"]
+}

package/vite.config.ts

@@ -0,0 +1,54 @@
+/**
+ * Vite Configuration for Material Development
+ * 物料开发 Vite 配置
+ */
+
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+import { materialDevPlugin } from './.vite/plugins/vite-plugin-material-dev'
+import { externalDeps } from './.vite/plugins/vite-plugin-external-deps'
+
+export default defineConfig({
+  plugins: [
+    react(),
+    // 外部化 React/ReactDOM，使用父应用提供的实例
+    externalDeps({
+      externals: ['react', 'react-dom', 'react/jsx-runtime', '@easy-editor/core'],
+      globals: {
+        react: 'React',
+        'react-dom': 'ReactDOM',
+        'react/jsx-runtime': 'jsxRuntime',
+        '@easy-editor/core': 'EasyEditorCore',
+      },
+    }),
+    materialDevPlugin({
+      entry: '/src/index.tsx',
+    }),
+  ],
+  server: {
+    port: 5001,
+    host: 'localhost',
+    cors: true,
+    hmr: {
+      port: 5001,
+    },
+  },
+  build: {
+    target: 'esnext',
+    rollupOptions: {
+      // 确保生产构建也外部化这些依赖
+      external: ['react', 'react-dom', 'react/jsx-runtime', '@easy-editor/core'],
+      output: {
+        globals: {
+          react: 'React',
+          'react-dom': 'ReactDOM',
+          'react/jsx-runtime': 'jsxRuntime',
+          '@easy-editor/core': 'EasyEditorCore',
+        },
+      },
+    },
+  },
+  resolve: {
+    dedupe: ['react', 'react-dom'],
+  },
+})