x-next 1.7.0 → 1.8.1

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 (88) hide show
  1. package/AI_USAGE.md +129 -4
  2. package/CHANGELOG.md +47 -0
  3. package/dist/_hooks/use-chart-size.d.ts +25 -0
  4. package/dist/_utils/chart/index.d.ts +6 -0
  5. package/dist/_utils/chart/padding.d.ts +15 -0
  6. package/dist/_utils/chart/path.d.ts +34 -0
  7. package/dist/_utils/chart/scale.d.ts +55 -0
  8. package/dist/components/_components/chart/ChartAxis.d.ts +85 -0
  9. package/dist/components/_components/chart/ChartLegend.d.ts +26 -0
  10. package/dist/components/_components/chart/ChartTooltip.d.ts +76 -0
  11. package/dist/components/_components/chart/colors.d.ts +10 -0
  12. package/dist/components/_components/chart/interface.d.ts +38 -0
  13. package/dist/components/bar-chart/BarChart.d.ts +278 -0
  14. package/dist/components/bar-chart/helpers/layout.d.ts +55 -0
  15. package/dist/components/bar-chart/index.d.ts +600 -0
  16. package/dist/components/bar-chart/interface.d.ts +74 -0
  17. package/dist/components/bar-chart/props.d.ts +145 -0
  18. package/dist/components/heatmap/Heatmap.d.ts +10 -1
  19. package/dist/components/heatmap/index.d.ts +30 -3
  20. package/dist/components/index.d.ts +3 -0
  21. package/dist/components/line-chart/LineChart.d.ts +295 -0
  22. package/dist/components/line-chart/helpers/layout.d.ts +74 -0
  23. package/dist/components/line-chart/index.d.ts +614 -0
  24. package/dist/components/line-chart/interface.d.ts +76 -0
  25. package/dist/components/line-chart/props.d.ts +173 -0
  26. package/dist/components/pie-chart/PieChart.d.ts +219 -0
  27. package/dist/components/pie-chart/index.d.ts +470 -0
  28. package/dist/components/pie-chart/interface.d.ts +58 -0
  29. package/dist/components/pie-chart/props.d.ts +107 -0
  30. package/dist/components/trend-chart/components/TrendChart.d.ts +19 -96
  31. package/dist/components/trend-chart/index.d.ts +33 -187
  32. package/dist/components/trend-chart/props.d.ts +9 -78
  33. package/dist/components/trend-chart/themes.d.ts +0 -1
  34. package/dist/es/_hooks/use-chart-size.js +25 -0
  35. package/dist/es/_styles/palette-aliases.js +5 -0
  36. package/dist/es/_utils/chart/padding.js +22 -0
  37. package/dist/es/_utils/chart/path.js +69 -0
  38. package/dist/es/_utils/chart/scale.js +77 -0
  39. package/dist/es/components/_components/chart/ChartAxis.js +79 -0
  40. package/dist/es/components/_components/chart/ChartLegend.js +53 -0
  41. package/dist/es/components/_components/chart/ChartTooltip.js +64 -0
  42. package/dist/es/components/_components/chart/colors.js +12 -0
  43. package/dist/es/components/bar-chart/BarChart.js +470 -0
  44. package/dist/es/components/bar-chart/helpers/layout.js +53 -0
  45. package/dist/es/components/bar-chart/index.js +8 -0
  46. package/dist/es/components/bar-chart/props.js +148 -0
  47. package/dist/es/components/heatmap/Heatmap.js +249 -172
  48. package/dist/es/components/index.js +132 -126
  49. package/dist/es/components/line-chart/LineChart.js +532 -0
  50. package/dist/es/components/line-chart/helpers/layout.js +80 -0
  51. package/dist/es/components/line-chart/index.js +8 -0
  52. package/dist/es/components/line-chart/props.js +178 -0
  53. package/dist/es/components/pie-chart/PieChart.js +397 -0
  54. package/dist/es/components/pie-chart/index.js +8 -0
  55. package/dist/es/components/pie-chart/props.js +104 -0
  56. package/dist/es/components/trend-chart/components/TrendChart.js +143 -183
  57. package/dist/es/components/trend-chart/components/trend-chart-curve.js +85 -81
  58. package/dist/es/components/trend-chart/props.js +28 -74
  59. package/dist/es/components/trend-chart/themes.js +30 -31
  60. package/dist/es/index.js +193 -187
  61. package/dist/es/locale/en-US.js +8 -1
  62. package/dist/es/locale/zh-CN.js +8 -1
  63. package/dist/es/style.css +1 -1
  64. package/dist/index.cjs +4 -4
  65. package/dist/index.umd.js +4 -4
  66. package/dist/locale/interface.d.ts +13 -0
  67. package/dist/style/bar-chart.css +1 -0
  68. package/dist/style/bar-chart.js +2 -0
  69. package/dist/style/base.css +1 -1
  70. package/dist/style/heatmap.css +1 -1
  71. package/dist/style/line-chart.css +1 -0
  72. package/dist/style/line-chart.js +2 -0
  73. package/dist/style/pie-chart.css +1 -0
  74. package/dist/style/pie-chart.js +2 -0
  75. package/dist/style.css +1 -1
  76. package/dist/types.d.ts +3 -0
  77. package/package.json +1 -1
  78. package/volar.d.ts +3 -0
  79. package/dist/components/trend-chart/components/trend-chart-grid.d.ts +0 -55
  80. package/dist/components/trend-chart/components/trend-chart-labels.d.ts +0 -26
  81. package/dist/components/trend-chart/helpers/genPath.d.ts +0 -8
  82. package/dist/components/trend-chart/helpers/getPadding.d.ts +0 -8
  83. package/dist/components/trend-chart/helpers/validatePadding.d.ts +0 -2
  84. package/dist/es/components/trend-chart/components/trend-chart-grid.js +0 -62
  85. package/dist/es/components/trend-chart/components/trend-chart-labels.js +0 -75
  86. package/dist/es/components/trend-chart/helpers/genPath.js +0 -22
  87. package/dist/es/components/trend-chart/helpers/getPadding.js +0 -21
  88. package/dist/es/components/trend-chart/helpers/validatePadding.js +0 -7
package/dist/types.d.ts CHANGED
@@ -89,6 +89,9 @@ declare module 'vue' {
89
89
  XColorPicker: (typeof import('x-next'))['ColorPicker'];
90
90
  XHeatmap: (typeof import('x-next'))['Heatmap'];
91
91
  XUpload: (typeof import('x-next'))['Upload'];
92
+ XBarChart: (typeof import('x-next'))['BarChart'];
93
+ XLineChart: (typeof import('x-next'))['LineChart'];
94
+ XPieChart: (typeof import('x-next'))['PieChart'];
92
95
  }
93
96
  }
94
97
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "x-next",
3
- "version": "1.7.0",
3
+ "version": "1.8.1",
4
4
  "private": false,
5
5
  "description": "A Vue 3 and TypeScript component library for enterprise applications.",
6
6
  "keywords": [
package/volar.d.ts CHANGED
@@ -90,6 +90,9 @@ declare module 'vue' {
90
90
  XColorPicker: (typeof import('x-next'))['ColorPicker']
91
91
  XHeatmap: (typeof import('x-next'))['Heatmap']
92
92
  XUpload: (typeof import('x-next'))['Upload']
93
+ XBarChart: (typeof import('x-next'))['BarChart']
94
+ XLineChart: (typeof import('x-next'))['LineChart']
95
+ XPieChart: (typeof import('x-next'))['PieChart']
93
96
  }
94
97
  }
95
98
  export {}
@@ -1,55 +0,0 @@
1
- import { VNode } from 'vue';
2
- declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
3
- boundary: {
4
- required: boolean;
5
- type: import('vue').PropType<import('../props').Boundary>;
6
- default: () => void;
7
- };
8
- verticalLines: {
9
- default: boolean;
10
- type: BooleanConstructor;
11
- };
12
- verticalLinesNumber: {
13
- default: number;
14
- type: NumberConstructor;
15
- };
16
- horizontalLines: {
17
- default: boolean;
18
- type: BooleanConstructor;
19
- };
20
- horizontalLinesNumber: {
21
- default: number;
22
- type: NumberConstructor;
23
- };
24
- }>, () => VNode<import('vue').RendererNode, import('vue').RendererElement, {
25
- [key: string]: any;
26
- }> | null, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
27
- boundary: {
28
- required: boolean;
29
- type: import('vue').PropType<import('../props').Boundary>;
30
- default: () => void;
31
- };
32
- verticalLines: {
33
- default: boolean;
34
- type: BooleanConstructor;
35
- };
36
- verticalLinesNumber: {
37
- default: number;
38
- type: NumberConstructor;
39
- };
40
- horizontalLines: {
41
- default: boolean;
42
- type: BooleanConstructor;
43
- };
44
- horizontalLinesNumber: {
45
- default: number;
46
- type: NumberConstructor;
47
- };
48
- }>> & Readonly<{}>, {
49
- boundary: import('../props').Boundary;
50
- verticalLines: boolean;
51
- verticalLinesNumber: number;
52
- horizontalLines: boolean;
53
- horizontalLinesNumber: number;
54
- }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
55
- export default _default;
@@ -1,26 +0,0 @@
1
- import { VNode } from 'vue';
2
- declare const _default: import('vue').DefineComponent<{
3
- boundary: import('../props').Boundary;
4
- yLabelsTextFormatter: Function;
5
- color?: import('../../../_props/css').CSSColor | undefined;
6
- fontSize?: number | undefined;
7
- minValue?: number | undefined;
8
- maxValue?: number | undefined;
9
- xLabels?: unknown[] | undefined;
10
- yLabels?: number | undefined;
11
- }, () => VNode<import('vue').RendererNode, import('vue').RendererElement, {
12
- [key: string]: any;
13
- }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
14
- boundary: import('../props').Boundary;
15
- yLabelsTextFormatter: Function;
16
- color?: import('../../../_props/css').CSSColor | undefined;
17
- fontSize?: number | undefined;
18
- minValue?: number | undefined;
19
- maxValue?: number | undefined;
20
- xLabels?: unknown[] | undefined;
21
- yLabels?: number | undefined;
22
- }> & Readonly<{}>, {
23
- boundary: import('../props').Boundary;
24
- yLabelsTextFormatter: Function;
25
- }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
26
- export default _default;
@@ -1,8 +0,0 @@
1
- import { Point } from '../props';
2
- declare const _default: (points: Point[], smooth: boolean, { maxY }: {
3
- maxY: any;
4
- }) => {
5
- linePath: string;
6
- fillPath: string;
7
- };
8
- export default _default;
@@ -1,8 +0,0 @@
1
- import { Padding } from '../props';
2
- /**
3
- * 获取padding
4
- *
5
- * 支持 CSS 简写风格的 1-4 个值字符串(如 '5 10'),也支持单个非负数字。
6
- */
7
- declare const _default: (padding: string | number) => Padding;
8
- export default _default;
@@ -1,2 +0,0 @@
1
- declare const _default: (padding: string) => boolean;
2
- export default _default;
@@ -1,62 +0,0 @@
1
- import { defineComponent as b, computed as u, h as i } from "vue";
2
- import { getComponentPrefix as h } from "../../../_utils/config.js";
3
- import { trendChartGridProps as y } from "../props.js";
4
- import { TrendChartAxisColor as m } from "../themes.js";
5
- const N = b({
6
- name: h("TrendChartGrid"),
7
- props: y,
8
- setup(n) {
9
- const c = (e) => {
10
- const t = n.verticalLinesNumber > 1 ? (n.boundary.maxX - n.boundary.minX) / (n.verticalLinesNumber - 1) : 0, r = n.boundary.minX + t * (e - 1), a = n.boundary.minY, o = n.boundary.maxY;
11
- return {
12
- x1: r,
13
- x2: r,
14
- y1: a,
15
- y2: o,
16
- style: { stroke: m }
17
- };
18
- }, d = (e) => {
19
- const t = n.horizontalLinesNumber > 1 ? (n.boundary.maxY - n.boundary.minY) / (n.horizontalLinesNumber - 1) : 0, r = n.boundary.maxY - t * (e - 1), a = n.boundary.minX, o = n.boundary.maxX;
20
- return {
21
- x1: a,
22
- x2: o,
23
- y1: r,
24
- y2: r,
25
- style: { stroke: m }
26
- };
27
- }, l = u(() => {
28
- if (n.verticalLines && n.verticalLinesNumber > 0) {
29
- const e = [];
30
- for (let t = 1; t <= n.verticalLinesNumber; t++)
31
- e.push(
32
- i("line", {
33
- class: "line",
34
- ...c(t)
35
- })
36
- );
37
- return i("g", { class: "vertical" }, e);
38
- }
39
- return null;
40
- }), s = u(() => {
41
- if (n.horizontalLines && n.horizontalLinesNumber > 0) {
42
- const e = [];
43
- for (let t = 1; t <= n.horizontalLinesNumber; t++)
44
- e.push(
45
- i("line", {
46
- class: "line",
47
- ...d(t)
48
- })
49
- );
50
- return i("g", { class: "horizontal" }, e);
51
- }
52
- return null;
53
- });
54
- return () => {
55
- const e = [];
56
- return l.value && e.push(l.value), s.value && e.push(s.value), e.length === 0 ? null : i("g", null, e);
57
- };
58
- }
59
- });
60
- export {
61
- N as default
62
- };
@@ -1,75 +0,0 @@
1
- import { defineComponent as h, computed as l, h as t } from "vue";
2
- import { getComponentPrefix as v } from "../../../_utils/config.js";
3
- import { trendChartLabelsProps as Y } from "../props.js";
4
- import { TrendChartAxisColor as d } from "../themes.js";
5
- const S = h({
6
- name: v("TrendChartLabels"),
7
- props: Y,
8
- setup(e) {
9
- const u = l(() => {
10
- if (e.fontSize)
11
- return e.fontSize;
12
- const a = e.boundary.maxY - e.boundary.minY;
13
- return a >= 100 ? 12 : a >= 60 ? 11 : 10;
14
- }), c = l(() => e.color ?? "var(--x-color-text-secondary)"), b = l(() => ({
15
- fill: c.value,
16
- fontSize: `${u.value}px`
17
- })), x = (a) => {
18
- var y;
19
- const n = ((y = e.xLabels) == null ? void 0 : y.length) ?? 0, r = n > 1 ? (e.boundary.maxX - e.boundary.minX) / (n - 1) : 0, o = n > 1 ? e.boundary.minX + r * a : e.boundary.minX + (e.boundary.maxX - e.boundary.minX) / 2, s = e.boundary.maxY;
20
- return { transform: `translate(${o}, ${s})` };
21
- }, f = (a) => {
22
- const n = e.yLabels ?? 0, r = n > 1 ? (e.boundary.maxY - e.boundary.minY) / (n - 1) : 0, o = e.boundary.minX, s = n > 1 ? e.boundary.maxY - r * a : e.boundary.minY + (e.boundary.maxY - e.boundary.minY) / 2;
23
- return { transform: `translate(${o}, ${s})` };
24
- }, L = (a) => {
25
- const n = e.yLabels ?? 0;
26
- return n <= 1 ? e.minValue : e.minValue + (e.maxValue - e.minValue) / (n - 1) * a;
27
- }, m = l(() => e.xLabels && e.xLabels.length ? t(
28
- "g",
29
- { class: "x-labels" },
30
- e.xLabels.map(
31
- (a, n) => t("g", { class: "label", ...x(n) }, [
32
- t(
33
- "text",
34
- {
35
- dy: u.value + 5,
36
- "text-anchor": "middle",
37
- style: b.value
38
- },
39
- a
40
- ),
41
- t("line", { style: { stroke: d }, y2: 5 })
42
- ])
43
- )
44
- ) : null), i = l(() => {
45
- if (e.yLabels && e.yLabels > 0) {
46
- const a = [];
47
- for (let n = 0; n < e.yLabels; n++)
48
- a.push(
49
- t("g", { class: "label", ...f(n) }, [
50
- t(
51
- "text",
52
- {
53
- dx: -10,
54
- dy: u.value / 4,
55
- "text-anchor": "end",
56
- style: b.value
57
- },
58
- e.yLabelsTextFormatter(L(n))
59
- ),
60
- t("line", { style: { stroke: d }, x1: 0, x2: -5 })
61
- ])
62
- );
63
- return t("g", { class: "y-labels" }, a);
64
- }
65
- return null;
66
- });
67
- return () => {
68
- const a = [];
69
- return m.value && a.push(m.value), i.value && a.push(i.value), t("g", a);
70
- };
71
- }
72
- });
73
- export {
74
- S as default
75
- };
@@ -1,22 +0,0 @@
1
- const P = (e, n, { maxY: $ }) => {
2
- if (!e.length)
3
- return { linePath: "", fillPath: "" };
4
- if (e.length === 1) {
5
- const [t] = e;
6
- return { linePath: `M ${t.x},${t.y}`, fillPath: "" };
7
- }
8
- const l = e.shift(), a = e[e.length - 1], c = (e[0].x - l.x) / 2;
9
- let h = `M ${l.x},${l.y}`;
10
- e.forEach((t, x) => {
11
- if (!n) h += ` L${t.x},${t.y}`;
12
- else {
13
- const r = e[x - 1] || l;
14
- h += ` C ${c + r.x},${r.y} ${c + r.x},${t.y} ${t.x},${t.y}`;
15
- }
16
- });
17
- let f = h;
18
- return a.y !== $ && (f += ` L${a.x},${$}`), l.y !== $ && (f += ` L${l.x},${$}`), f += " Z", { linePath: h, fillPath: f };
19
- };
20
- export {
21
- P as default
22
- };
@@ -1,21 +0,0 @@
1
- const l = (o) => {
2
- const t = (typeof o == "number" ? `${o}` : o).split(" ").filter((r) => r !== "").map((r) => Number(r));
3
- let e = {};
4
- switch (t.length) {
5
- case 4:
6
- e = { top: t[0], right: t[1], bottom: t[2], left: t[3] };
7
- break;
8
- case 3:
9
- e = { top: t[0], right: t[1], bottom: t[2], left: t[1] };
10
- break;
11
- case 2:
12
- e = { top: t[0], right: t[1], bottom: t[0], left: t[1] };
13
- break;
14
- default:
15
- e = { top: t[0], right: t[0], bottom: t[0], left: t[0] };
16
- }
17
- return e;
18
- };
19
- export {
20
- l as default
21
- };
@@ -1,7 +0,0 @@
1
- const a = (n) => {
2
- const r = n.split(" ").filter((e) => e !== ""), t = r.map((e) => Number(e));
3
- return t.length < 1 || t.length > 4 ? !1 : r.every((e) => /^\d+(\.\d+)?$/.test(e)) && t.every((e) => e >= 0);
4
- };
5
- export {
6
- a as default
7
- };