nuxt-charts 0.1.0-beta.7 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.md +41 -39
  2. package/dist/module.json +1 -1
  3. package/package.json +4 -4
package/README.md CHANGED
@@ -3,14 +3,16 @@
3
3
  [![npm version][npm-version-src]][npm-version-href]
4
4
  [![npm downloads][npm-downloads-src]][npm-downloads-href]
5
5
 
6
- > Nuxt module for vue-chrts
6
+ > Nuxt module for vue-s
7
7
 
8
8
  ## Features
9
9
 
10
10
  - 📊 Use beautiful chart components in your Nuxt applications
11
11
  - 🔄 Auto-imports for all chart components
12
- - 🎛ïļ Configure which components to include
13
- - ðŸŠķ Tree-shakable - only import what you use
12
+ - 📊 Multiple types: Line, Bar, Area, Donut
13
+ - ðŸŽĻ Easily customizable
14
+ - ðŸ’Ą Simple, intuitive API
15
+ - 🚀 Built with Vue 3 and TypeScript
14
16
 
15
17
  ## Installation
16
18
 
@@ -32,22 +34,7 @@ Add the module to your Nuxt config:
32
34
  ```ts
33
35
  // nuxt.config.ts
34
36
  export default defineNuxtConfig({
35
- modules: ["nuxt-charts"],
36
-
37
- // Optional configuration
38
- vueChrts: {
39
- // Add prefix to component names (default: 'Chrt')
40
- prefix: "Chrt",
41
-
42
- // Make components globally available (default: true)
43
- global: true,
44
-
45
- // Only include specific components (default: all components)
46
- include: ["AreaChart", "LineChart"],
47
-
48
- // Enable auto-imports (default: true)
49
- autoImports: true,
50
- },
37
+ modules: ["nuxt-charts"]
51
38
  });
52
39
  ```
53
40
 
@@ -56,35 +43,50 @@ Then use the components in your Nuxt application:
56
43
  ```vue
57
44
  <template>
58
45
  <div class="chart-wrapper">
59
- <ChrtLineChart
60
- :data="data"
61
- :height="300"
62
- :accessor="accessor"
63
- :x-axis-title="xAxisTitle"
64
- />
46
+ <LineChart
47
+ :data="data"
48
+ :categories="categories"
49
+ :height="300"
50
+ :xFormatter="xFormatter"
51
+ xLabel="Month"
52
+ yLabel="Amount"
53
+ />
65
54
  </div>
66
55
  </template>
67
56
 
68
57
  <script setup>
69
- // The types are auto-imported
70
- const data = ref([
71
- { date: "2023-01", value: 100 },
72
- { date: "2023-02", value: 200 },
73
- { date: "2023-03", value: 150 },
74
- ]);
75
-
76
- const accessor = (d) => d.value;
77
- const xAxisTitle = "Month";
58
+ import { LineChart } from 'vue-chrts';
59
+
60
+ const data = [
61
+ { month: 'Jan', sales: 100, profit: 50 },
62
+ { month: 'Feb', sales: 120, profit: 55 },
63
+ { month: 'Mar', sales: 180, profit: 80 },
64
+ { month: 'Apr', sales: 110, profit: 40 },
65
+ { month: 'May', sales: 90, profit: 30 },
66
+ ];
67
+
68
+ const categories = {
69
+ sales: {
70
+ name: 'Sales',
71
+ color: '#3b82f6'
72
+ },
73
+ profit: {
74
+ name: 'Profit',
75
+ color: '#10b981'
76
+ }
77
+ };
78
+
79
+ const xFormatter = (i) => data[i].month;
78
80
  </script>
79
81
  ```
80
82
 
81
83
  ## Available Components
82
84
 
83
- - `ChrtAreaChart` - Area chart
84
- - `ChrtAreaStackedChart` - Stacked area chart
85
- - `ChrtLineChart` - Line chart
86
- - `ChrtBarChart` - Bar chart
87
- - `ChrtDonutChart` - Donut chart
85
+ - `AreaChart` - Area chart
86
+ - `AreaStackedChart` - Stacked area chart
87
+ - `LineChart` - Line chart
88
+ - `BarChart` - Bar chart
89
+ - `DonutChart` - Donut chart
88
90
 
89
91
  ## Auto-imported Types
90
92
 
package/dist/module.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "compatibility": {
5
5
  "nuxt": "^3.0.0"
6
6
  },
7
- "version": "0.1.0-beta.7",
7
+ "version": "0.1.2",
8
8
  "builder": {
9
9
  "@nuxt/module-builder": "0.8.4",
10
10
  "unbuild": "unknown"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "nuxt-charts",
3
- "version": "0.1.0-beta.7",
3
+ "version": "0.1.2",
4
4
  "description": "Nuxt module for vue-chrts",
5
5
  "license": "MIT",
6
6
  "type": "module",
@@ -29,7 +29,7 @@
29
29
  "dependencies": {
30
30
  "@nuxt/kit": "^3.11.1",
31
31
  "@unovis/vue": "^1.5.1",
32
- "vue-chrts": "0.1.0"
32
+ "vue-chrts": "0.1.2"
33
33
  },
34
34
  "devDependencies": {
35
35
  "@nuxt/eslint": "1.3.0",
@@ -38,9 +38,9 @@
38
38
  "@nuxt/schema": "^3.11.1",
39
39
  "@types/node": "^20.12.10",
40
40
  "changelogen": "^0.6.1",
41
- "vitest": "^3.1.1",
42
41
  "eslint": "^8.57.0",
43
42
  "nuxt": "^3.11.1",
44
- "typescript": "^5.4.5"
43
+ "typescript": "^5.4.5",
44
+ "vitest": "^3.1.1"
45
45
  }
46
46
  }