x-next 1.7.0 → 1.8.0

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 +38 -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 -0
  19. package/dist/components/heatmap/index.d.ts +30 -0
  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 +244 -169
  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/style/heatmap.css CHANGED
@@ -1 +1 @@
1
- :root{--x-heatmap-color-level-1: var(--x-color-primary-1);--x-heatmap-color-level-2: var(--x-color-primary-2);--x-heatmap-color-level-3: var(--x-color-primary-3);--x-heatmap-color-level-4: var(--x-color-primary-5);--x-heatmap-color-level-5: var(--x-color-primary-6);--x-heatmap-color-empty: var(--x-color-fill-2);--x-heatmap-color-text: var(--x-color-text-3);--x-heatmap-border-radius-cell: var(--x-border-radius-small);--x-heatmap-border-radius-tooltip: var(--x-border-radius-medium);--x-heatmap-color-tooltip-bg: var(--x-color-overlay-tooltip-bg);--x-heatmap-color-tooltip-text: var(--x-color-white);--x-heatmap-shadow-tooltip: var(--x-shadow-popover);--x-heatmap-color-cell-border: var(--x-color-border-subtle);--x-heatmap-margin-label: var(--x-spacing-1);--x-heatmap-spacing-week-label: var(--x-spacing-1);--x-heatmap-spacing-indicator: var(--x-spacing-2);--x-heatmap-spacing-footer: var(--x-spacing-4)}.x-heatmap{position:relative;display:inline-block;color:var(--x-heatmap-color-text);font-size:var(--x-font-size-caption);--x-heatmap-cell-size: 12px;--x-heatmap-cell-gap: var(--x-spacing-1)}.x-heatmap--body{display:flex;align-items:flex-start;gap:var(--x-heatmap-margin-label)}.x-heatmap--week-labels{display:grid;flex:none;grid-auto-flow:column;align-items:center;padding-top:calc(var(--x-font-size-caption)*1.5 + var(--x-heatmap-spacing-week-label))}.x-heatmap--week-label{height:var(--x-heatmap-cell-size);margin-bottom:var(--x-heatmap-cell-gap);line-height:var(--x-heatmap-cell-size);text-align:right;white-space:nowrap}.x-heatmap--grid-wrapper{position:relative;min-width:0}.x-heatmap--month-labels{display:grid;grid-auto-flow:column;height:calc(var(--x-font-size-caption)*1.5);margin-bottom:var(--x-heatmap-spacing-week-label)}.x-heatmap--month-label{grid-row:1;line-height:1.5;white-space:nowrap}.x-heatmap--grid{display:grid;grid-auto-flow:column;gap:var(--x-heatmap-cell-gap)}.x-heatmap--cell{width:var(--x-heatmap-cell-size);height:var(--x-heatmap-cell-size);border-radius:var(--x-heatmap-border-radius-cell);cursor:pointer;transition:opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear),outline-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-heatmap--cell:hover{outline:1px solid var(--x-heatmap-color-cell-border);outline-offset:1px}.x-heatmap--cell:focus-visible{outline:2px solid var(--x-color-primary-text);outline-offset:1px}.x-heatmap--cell.-out-of-range{opacity:.45}.x-heatmap--tooltip{position:absolute;z-index:1;padding:var(--x-spacing-2) var(--x-spacing-4);color:var(--x-heatmap-color-tooltip-text);font-size:var(--x-font-size-caption);line-height:1.5;white-space:nowrap;background-color:var(--x-heatmap-color-tooltip-bg);border-radius:var(--x-heatmap-border-radius-tooltip);box-shadow:var(--x-heatmap-shadow-tooltip);pointer-events:none;transform:translate(-50%, 0);opacity:0;transition:opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-heatmap--tooltip.-visible{opacity:1}.x-heatmap--indicator{display:flex;gap:var(--x-heatmap-spacing-indicator);align-items:center;justify-content:flex-end;margin-top:var(--x-heatmap-spacing-indicator);line-height:1}.x-heatmap--indicator-swatch{width:var(--x-heatmap-cell-size);height:var(--x-heatmap-cell-size);border-radius:var(--x-heatmap-border-radius-cell)}.x-heatmap--indicator-leading.x-heatmap--indicator-trailing{white-space:nowrap}.x-heatmap--footer{margin-top:var(--x-heatmap-spacing-footer)}
1
+ :root{--x-heatmap-color-level-1: var(--x-color-primary-1);--x-heatmap-color-level-2: var(--x-color-primary-2);--x-heatmap-color-level-3: var(--x-color-primary-3);--x-heatmap-color-level-4: var(--x-color-primary-5);--x-heatmap-color-level-5: var(--x-color-primary-6);--x-heatmap-color-empty: var(--x-color-fill-2);--x-heatmap-color-text: var(--x-color-text-3);--x-heatmap-border-radius-cell: var(--x-border-radius-small);--x-heatmap-border-radius-tooltip: var(--x-border-radius-medium);--x-heatmap-color-tooltip-bg: var(--x-color-overlay-tooltip-bg);--x-heatmap-color-tooltip-text: var(--x-color-white);--x-heatmap-shadow-tooltip: var(--x-shadow-popover);--x-heatmap-color-cell-border: var(--x-color-border-subtle);--x-heatmap-margin-label: var(--x-spacing-1);--x-heatmap-spacing-week-label: var(--x-spacing-1);--x-heatmap-spacing-indicator: var(--x-spacing-2);--x-heatmap-spacing-footer: var(--x-spacing-4)}.x-heatmap{position:relative;display:inline-block;color:var(--x-heatmap-color-text);font-size:var(--x-font-size-caption);--x-heatmap-cell-size: 12px;--x-heatmap-cell-gap: var(--x-spacing-1)}.x-heatmap--body{display:flex;align-items:flex-start;gap:var(--x-heatmap-margin-label)}.x-heatmap--week-labels{display:grid;flex:none;grid-auto-flow:column;align-items:center;padding-top:calc(var(--x-font-size-caption)*1.5 + var(--x-heatmap-spacing-week-label))}.x-heatmap--week-label{height:var(--x-heatmap-cell-size);margin-bottom:var(--x-heatmap-cell-gap);line-height:var(--x-heatmap-cell-size);text-align:right;white-space:nowrap}.x-heatmap--grid-wrapper{position:relative;min-width:0}.x-heatmap--month-labels{display:grid;grid-auto-flow:column;height:calc(var(--x-font-size-caption)*1.5);margin-bottom:var(--x-heatmap-spacing-week-label)}.x-heatmap--month-label{grid-row:1;line-height:1.5;white-space:nowrap}.x-heatmap--grid{position:relative;display:grid;grid-auto-flow:column;gap:var(--x-heatmap-cell-gap)}.x-heatmap--cell{width:var(--x-heatmap-cell-size);height:var(--x-heatmap-cell-size);border-radius:var(--x-heatmap-border-radius-cell);cursor:pointer;transition:opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear),outline-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-heatmap--cell:hover{outline:1px solid var(--x-heatmap-color-cell-border);outline-offset:1px}.x-heatmap--cell:focus-visible{outline:2px solid var(--x-color-primary-text);outline-offset:1px}.x-heatmap-is-out-of-range{opacity:.45}.x-heatmap--tooltip{position:absolute;z-index:1;padding:var(--x-spacing-2) var(--x-spacing-4);color:var(--x-heatmap-color-tooltip-text);font-size:var(--x-font-size-caption);line-height:1.5;white-space:nowrap;background-color:var(--x-heatmap-color-tooltip-bg);border-radius:var(--x-heatmap-border-radius-tooltip);box-shadow:var(--x-heatmap-shadow-tooltip);pointer-events:none;transform:translate(-50%, 0);opacity:0;transition:opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-heatmap-is-visible{opacity:1}.x-heatmap--indicator{display:flex;gap:var(--x-heatmap-spacing-indicator);align-items:center;justify-content:flex-end;margin-top:var(--x-heatmap-spacing-indicator);line-height:1}.x-heatmap--indicator-swatch{width:var(--x-heatmap-cell-size);height:var(--x-heatmap-cell-size);border-radius:var(--x-heatmap-border-radius-cell)}.x-heatmap--indicator-leading.x-heatmap--indicator-trailing{white-space:nowrap}.x-heatmap--footer{margin-top:var(--x-heatmap-spacing-footer)}.x-heatmap--grid:focus-visible{outline:2px solid var(--x-color-border-focus);outline-offset:2px;border-radius:var(--x-border-radius-small)}.x-heatmap--live{position:absolute;width:1px;height:1px;overflow:hidden;white-space:nowrap;clip-path:inset(50%)}
package/dist/style/line-chart.css ADDED
@@ -0,0 +1 @@
1
+ :root{--x-line-chart-stroke-width: 2;--x-line-chart-area-opacity: 0.16;--x-line-chart-size-point: 3;--x-line-chart-size-point-active: 4.5;--x-line-chart-line-active-width: 1}.x-line-chart{position:relative;width:100%}.x-line-chart--canvas{position:relative;width:100%}.x-line-chart--svg{display:block;max-width:100%;overflow:visible;outline:none;cursor:default}.x-line-chart--svg:focus-visible{outline:2px solid var(--x-color-border-focus);outline-offset:2px;border-radius:var(--x-border-radius-small)}.x-line-chart--line{stroke-width:var(--x-line-chart-stroke-width);stroke-linecap:round;stroke-linejoin:round;transition:stroke-opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-line-chart--area{opacity:var(--x-line-chart-area-opacity);transition:opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-line-chart--point{cursor:pointer}.x-line-chart--point-dot{stroke:var(--x-chart-color-point-halo);stroke-width:1;transition:r var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-line-chart--active-line{stroke:var(--x-chart-color-active-line);stroke-width:var(--x-line-chart-line-active-width);stroke-dasharray:3 3;pointer-events:none}.x-line-chart--series{transition:opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-line-chart--canvas:has(.x-line-chart--series.x-line-chart-is-active) .x-line-chart--series:not(.x-line-chart-is-active){opacity:.4}
package/dist/style/line-chart.js ADDED
@@ -0,0 +1,2 @@
1
+ import './base.css';
2
+ import './line-chart.css';
package/dist/style/pie-chart.css ADDED
@@ -0,0 +1 @@
1
+ :root{--x-pie-chart-segment-opacity: 0.85;--x-pie-chart-segment-opacity-active: 1;--x-pie-chart-segment-opacity-dimmed: 0.35;--x-pie-chart-stroke-segment: var(--x-color-bg-surface);--x-pie-chart-stroke-width-segment: 1}.x-pie-chart{position:relative;width:100%}.x-pie-chart--canvas{position:relative;width:100%}.x-pie-chart--svg{display:block;max-width:100%;outline:none}.x-pie-chart--svg:focus-visible{outline:2px solid var(--x-color-border-focus);outline-offset:2px;border-radius:var(--x-border-radius-small)}.x-pie-chart--segment{stroke:var(--x-pie-chart-stroke-segment);stroke-width:var(--x-pie-chart-stroke-width-segment);cursor:pointer;opacity:var(--x-pie-chart-segment-opacity);transition:opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-pie-chart-is-active{opacity:var(--x-pie-chart-segment-opacity-active)}.x-pie-chart-is-dimmed{opacity:var(--x-pie-chart-segment-opacity-dimmed)}.x-pie-chart--label{user-select:none;pointer-events:none}.x-pie-chart--center-value{font-weight:var(--x-font-weight-500);font-variant-numeric:tabular-nums}.x-pie-chart--center-label{user-select:none}
package/dist/style/pie-chart.js ADDED
@@ -0,0 +1,2 @@
1
+ import './base.css';
2
+ import './pie-chart.css';