@mozaic-ds/chart 0.1.0-beta.29 → 0.1.0-beta.30

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 (56) hide show
  1. package/README.md +1 -1
  2. package/dist/mozaic-chart.js +2303 -2109
  3. package/dist/mozaic-chart.umd.cjs +9 -9
  4. package/dist/style.css +1 -1
  5. package/package.json +1 -1
  6. package/src/assets/base.css +1 -1
  7. package/src/components/bar/BarChart.stories.ts +99 -99
  8. package/src/components/bar/BarChart.vue +70 -53
  9. package/src/components/bar/index.ts +3 -3
  10. package/src/components/bubble/BubbleChart.stories.ts +12 -12
  11. package/src/components/bubble/BubbleChart.vue +118 -91
  12. package/src/components/bubble/index.ts +3 -3
  13. package/src/components/doughnut/DoughnutChart.stories.ts +38 -37
  14. package/src/components/doughnut/DoughnutChart.vue +89 -71
  15. package/src/components/doughnut/index.ts +3 -3
  16. package/src/components/index.ts +4 -4
  17. package/src/components/line/LineChart.stories.ts +38 -38
  18. package/src/components/line/LineChart.vue +54 -51
  19. package/src/components/line/index.ts +3 -3
  20. package/src/components/mixed/MixedBarLineChart.stories.ts +15 -15
  21. package/src/components/mixed/MixedBarLineChart.vue +44 -44
  22. package/src/components/mixed/index.ts +1 -1
  23. package/src/components/radar/RadarChart.stories.ts +100 -100
  24. package/src/components/radar/RadarChart.vue +41 -34
  25. package/src/components/radar/index.ts +3 -3
  26. package/src/main.ts +14 -7
  27. package/src/plugin.ts +9 -9
  28. package/src/services/BarChartFunctions.ts +133 -35
  29. package/src/services/BubbleTooltipService.ts +58 -56
  30. package/src/services/ChartsCommonLegend.ts +271 -127
  31. package/src/services/ColorFunctions.ts +1 -1
  32. package/src/services/DoughnutChartFunctions.ts +42 -13
  33. package/src/services/FormatUtilities.ts +28 -14
  34. package/src/services/GenericTooltipService.ts +125 -65
  35. package/src/services/MixedBarLineFunctions.ts +46 -44
  36. package/src/services/PatternFunctions.ts +25 -18
  37. package/src/services/RadarChartFunctions.ts +5 -5
  38. package/src/services/patterns/ChartDesign.ts +35 -24
  39. package/src/services/patterns/patternCircles.ts +63 -36
  40. package/src/services/patterns/patternDashedDiagonals.ts +64 -57
  41. package/src/services/patterns/patternDiagonals.ts +138 -106
  42. package/src/services/patterns/patternSquares.ts +86 -80
  43. package/src/services/patterns/patternVerticalLines.ts +76 -69
  44. package/src/services/patterns/patternZigzag.ts +92 -85
  45. package/src/stories/Changelog.mdx +2 -2
  46. package/src/stories/Contributing.mdx +2 -2
  47. package/src/stories/GettingStarted.mdx +5 -5
  48. package/src/stories/SupportAndOnboarding.mdx +6 -6
  49. package/src/types/AxisDefinition.ts +0 -2
  50. package/src/types/Chart.ts +9 -7
  51. package/src/types/DoughnutData.ts +8 -0
  52. package/src/types/GenericData.ts +10 -10
  53. package/src/types/LineChart.ts +4 -4
  54. package/src/types/RadarData.ts +33 -29
  55. package/src/types/TooltipChartType.ts +7 -7
  56. package/src/vite-env.d.ts +3 -3
package/dist/style.css CHANGED
@@ -1 +1 @@
1
- .mc-checkbox__input:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E");background-position:center center}.mc-checkbox__input:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.container[data-v-aaa6e255]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-aaa6e255]{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:20px}.container[data-v-b0907849]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-b0907849]{display:flex;flex-direction:column;justify-content:center;align-items:center}.container[data-v-8e74b12a]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-8e74b12a]{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:20px}.container[data-v-00cff15e]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-00cff15e]{display:flex;flex-direction:column;justify-content:center;align-items:center}.mc-checkbox__input:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E");background-position:center center}.mc-checkbox__input:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.container[data-v-6a9cb065]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-6a9cb065]{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:20px}.mc-checkbox{align-items:center;display:flex}.mc-checkbox__label{font-size:1rem;line-height:1.125;cursor:pointer;margin-left:.5rem;color:#000}.mc-checkbox__input{font-family:LeroyMerlin,sans-serif;font-weight:400;box-sizing:border-box;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;margin:0;box-shadow:none;border:none;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;border-radius:4px;border:2px solid #666666;background-color:#fff;position:relative;transition:all .2s ease;cursor:pointer}.mc-checkbox__input[type=number]::-webkit-inner-spin-button,.mc-checkbox__input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0}.mc-checkbox__input[type=number]{-moz-appearance:textfield}.mc-checkbox__input[type=search]::-webkit-search-decoration:hover,.mc-checkbox__input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-checkbox__input::-ms-check{background-color:#fff;border:2px solid #666666;border-radius:4px;color:#fff}.mc-checkbox__input:hover{border-color:#191919}.mc-checkbox__input:hover::-ms-check{border-color:#191919}.mc-checkbox__input:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #0b96cc}.mc-checkbox__input:focus::-ms-check{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #0b96cc}.mc-checkbox__input:checked,.mc-checkbox__input:indeterminate{background-color:#46a610;border-color:#46a610;background-size:1rem 1rem}.mc-checkbox__input:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E");background-position:center center}.mc-checkbox__input:checked::-ms-check{background-color:#46a610;border-color:#46a610}.mc-checkbox__input:checked:hover:not(:disabled){border-color:#035010}.mc-checkbox__input:checked:hover:not(:disabled)::-ms-check{border-color:#035010}.mc-checkbox__input:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled{background-color:#e6e6e6;border-color:#e6e6e6;cursor:not-allowed}.mc-checkbox__input:disabled::-ms-check{background-color:#e6e6e6;border-color:#e6e6e6}.mc-checkbox__input:disabled:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled+.mc-checkbox__label{color:gray}.mc-checkbox__input.is-invalid{border-color:#c61112}.mc-checkbox__input.is-invalid::-ms-check{border-color:#c61112}.mc-checkbox__input.is-invalid:hover{border-color:#530000}.mc-checkbox__input.is-invalid:hover::-ms-check{border-color:#530000}.container[data-v-a786496d]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-a786496d]{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:20px}.chart-legend[data-v-a786496d]{display:flex;gap:4px;font-size:14px;align-items:center;margin:1.375rem 1.0625rem;color:#666}.bubble-icon[data-v-a786496d]{width:16px;height:16px}
1
+ .mc-checkbox__input:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E");background-position:center center}.mc-checkbox__input:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.container[data-v-360144b2]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-360144b2]{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:20px}.container[data-v-42646243]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-42646243]{display:grid;place-items:center}.main canvas[data-v-42646243]{grid-area:1/1}.main .centered-label[data-v-42646243]{grid-area:1/1;place-self:center;text-align:center}.container[data-v-e51b4953]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-e51b4953]{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:20px}.container[data-v-e82dcdc6]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-e82dcdc6]{display:flex;flex-direction:column;justify-content:center;align-items:center}.mc-checkbox__input:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E");background-position:center center}.mc-checkbox__input:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.container[data-v-e2792cc7]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-e2792cc7]{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:20px}.mc-checkbox{align-items:center;display:flex}.mc-checkbox__label{font-size:1rem;line-height:1.125;cursor:pointer;margin-left:.5rem;color:#000}.mc-checkbox__input{font-family:LeroyMerlin,sans-serif;font-weight:400;box-sizing:border-box;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;margin:0;box-shadow:none;border:none;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;border-radius:4px;border:2px solid #666666;background-color:#fff;position:relative;transition:all .2s ease;cursor:pointer}.mc-checkbox__input[type=number]::-webkit-inner-spin-button,.mc-checkbox__input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0}.mc-checkbox__input[type=number]{-moz-appearance:textfield}.mc-checkbox__input[type=search]::-webkit-search-decoration:hover,.mc-checkbox__input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-checkbox__input::-ms-check{background-color:#fff;border:2px solid #666666;border-radius:4px;color:#fff}.mc-checkbox__input:hover{border-color:#191919}.mc-checkbox__input:hover::-ms-check{border-color:#191919}.mc-checkbox__input:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #0b96cc}.mc-checkbox__input:focus::-ms-check{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #0b96cc}.mc-checkbox__input:checked,.mc-checkbox__input:indeterminate{background-color:#46a610;border-color:#46a610;background-size:1rem 1rem}.mc-checkbox__input:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E");background-position:center center}.mc-checkbox__input:checked::-ms-check{background-color:#46a610;border-color:#46a610}.mc-checkbox__input:checked:hover:not(:disabled){border-color:#035010}.mc-checkbox__input:checked:hover:not(:disabled)::-ms-check{border-color:#035010}.mc-checkbox__input:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23ffffff' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled{background-color:#e6e6e6;border-color:#e6e6e6;cursor:not-allowed}.mc-checkbox__input:disabled::-ms-check{background-color:#e6e6e6;border-color:#e6e6e6}.mc-checkbox__input:disabled:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M7.63 11.21a1 1 0 0 1-1.38 0l-2.92-2.6a1 1 0 1 1 1.34-1.48l2.22 2 4.41-4.34a1 1 0 1 1 1.4 1.42z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23999999' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E")}.mc-checkbox__input:disabled+.mc-checkbox__label{color:gray}.mc-checkbox__input.is-invalid{border-color:#c61112}.mc-checkbox__input.is-invalid::-ms-check{border-color:#c61112}.mc-checkbox__input.is-invalid:hover{border-color:#530000}.mc-checkbox__input.is-invalid:hover::-ms-check{border-color:#530000}.container[data-v-8359da14]{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:400;font-family:Roboto,sans-serif}.main[data-v-8359da14]{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:20px}.chart-legend[data-v-8359da14]{display:flex;gap:4px;font-size:14px;align-items:center;margin:1.375rem 1.0625rem;color:#666}.bubble-icon[data-v-8359da14]{width:16px;height:16px}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mozaic-ds/chart",
3
- "version": "0.1.0-beta.29",
3
+ "version": "0.1.0-beta.30",
4
4
  "type": "module",
5
5
  "scripts": {
6
6
  "build": "vue-tsc && vite build",
package/src/assets/base.css CHANGED
@@ -1,2 +1,2 @@
1
1
  @import url('https://fonts.googleapis.com/css?family=Roboto+Condensed&display=swap');
2
- @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
2
+ @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
package/src/components/bar/BarChart.stories.ts CHANGED
@@ -1,11 +1,11 @@
1
1
  // BarChart.stories.ts
2
2
 
3
- import type { Meta, StoryObj } from "@storybook/vue3";
4
- import BarChart from "./BarChart.vue";
3
+ import type { Meta, StoryObj } from '@storybook/vue3';
4
+ import BarChart from './BarChart.vue';
5
5
 
6
6
  const meta = {
7
- title: "Charts/Bar",
8
- component: BarChart,
7
+ title: 'Charts/Bar',
8
+ component: BarChart
9
9
  } satisfies Meta<typeof BarChart>;
10
10
 
11
11
  export default meta;
@@ -13,295 +13,295 @@ type Story = StoryObj<typeof meta>;
13
13
 
14
14
  export const Default = {
15
15
  args: {
16
- width: "500px",
17
- height: "400px",
18
- tooltipFirstLineLabel: "content",
19
- tooltipSecondLineLabel: "content2",
16
+ width: '500px',
17
+ height: '400px',
18
+ tooltipFirstLineLabel: 'content',
19
+ tooltipSecondLineLabel: 'content2',
20
20
  disableAccessibility: false,
21
21
  newPatternsOrder: [0, 4, 1, 2, 3, 5],
22
- labels: ["Data One", "Data Two", "Data Three"],
22
+ labels: ['Data One', 'Data Two', 'Data Three'],
23
23
  colourSet: 0,
24
24
  xAxisTitle: 'X Axis Title',
25
25
  yAxisTitle: 'Y Axis Title',
26
26
  datasets: [
27
27
  {
28
- label: "Data One",
28
+ label: 'Data One',
29
29
  data: [
30
30
  {
31
31
  amount: 163790.23,
32
32
  rate: 1.719528,
33
- amountUnit: "€",
33
+ amountUnit: '€'
34
34
  },
35
35
  {
36
36
  amount: 217064,
37
37
  rate: 2.278815,
38
- amountUnit: "€",
38
+ amountUnit: '€'
39
39
  },
40
40
  {
41
41
  amount: 9144447.23,
42
42
  rate: 96.0016569,
43
- amountUnit: "€",
44
- },
45
- ],
43
+ amountUnit: '€'
44
+ }
45
+ ]
46
46
  },
47
47
  {
48
- label: "Data Two",
48
+ label: 'Data Two',
49
49
  data: [
50
50
  {
51
51
  amount: 103144.22,
52
52
  rate: 1.1232806,
53
- amountUnit: "€",
53
+ amountUnit: '€'
54
54
  },
55
55
  {
56
56
  amount: 297474.14,
57
57
  rate: 3.2396087,
58
- amountUnit: "€",
58
+ amountUnit: '€'
59
59
  },
60
60
  {
61
61
  amount: 8781791.1,
62
62
  rate: 95.6371107,
63
- amountUnit: "€",
64
- },
65
- ],
66
- },
63
+ amountUnit: '€'
64
+ }
65
+ ]
66
+ }
67
67
  ],
68
- unit: "%",
69
- },
68
+ unit: '%'
69
+ }
70
70
  } satisfies Story;
71
71
 
72
72
  export const MultipleData = {
73
73
  args: {
74
- width: "700px",
75
- height: "400px",
76
- tooltipFirstLineLabel: "content",
77
- tooltipSecondLineLabel: "content2",
74
+ width: '700px',
75
+ height: '400px',
76
+ tooltipFirstLineLabel: 'content',
77
+ tooltipSecondLineLabel: 'content2',
78
78
  disableAccessibility: false,
79
79
  labels: [
80
- "Data One",
81
- "Data Two",
82
- "Data Three",
83
- "Data Four",
84
- "Data Five",
85
- "Data Six",
86
- "Data Seven",
87
- "Data Eight",
88
- "Data Nine",
89
- "Data Ten",
90
- "Data Eleven",
91
- "Data Twelve",
80
+ 'Data One',
81
+ 'Data Two',
82
+ 'Data Three',
83
+ 'Data Four',
84
+ 'Data Five',
85
+ 'Data Six',
86
+ 'Data Seven',
87
+ 'Data Eight',
88
+ 'Data Nine',
89
+ 'Data Ten',
90
+ 'Data Eleven',
91
+ 'Data Twelve'
92
92
  ],
93
93
  colourSet: 1,
94
94
  datasets: [
95
95
  {
96
- label: "Data One",
96
+ label: 'Data One',
97
97
  data: [
98
98
  {
99
99
  amount: 163790.23,
100
100
  rate: 1.719528,
101
- amountUnit: "€",
101
+ amountUnit: '€'
102
102
  },
103
103
  {
104
104
  amount: 217064,
105
105
  rate: 2.278815,
106
- amountUnit: "€",
106
+ amountUnit: '€'
107
107
  },
108
108
  {
109
109
  amount: 9144447.23,
110
110
  rate: 6.0016569,
111
- amountUnit: "€",
111
+ amountUnit: '€'
112
112
  },
113
113
  {
114
114
  amount: 9144447.23,
115
115
  rate: 46.0016569,
116
- amountUnit: "€",
116
+ amountUnit: '€'
117
117
  },
118
118
  {
119
119
  amount: 9144447.23,
120
120
  rate: 66.0016569,
121
- amountUnit: "€",
121
+ amountUnit: '€'
122
122
  },
123
123
  {
124
124
  amount: 9144447.23,
125
125
  rate: 9.0016569,
126
- amountUnit: "€",
126
+ amountUnit: '€'
127
127
  },
128
128
  {
129
129
  amount: 9144447.23,
130
130
  rate: 46.0016569,
131
- amountUnit: "€",
131
+ amountUnit: '€'
132
132
  },
133
133
  {
134
134
  amount: 9144447.23,
135
135
  rate: 26.0016569,
136
- amountUnit: "€",
136
+ amountUnit: '€'
137
137
  },
138
138
  {
139
139
  amount: 9144447.23,
140
140
  rate: 81.0016569,
141
- amountUnit: "€",
141
+ amountUnit: '€'
142
142
  },
143
143
  {
144
144
  amount: 9144447.23,
145
145
  rate: 11.0016569,
146
- amountUnit: "€",
146
+ amountUnit: '€'
147
147
  },
148
148
  {
149
149
  amount: 9144447.23,
150
150
  rate: 90.0016569,
151
- amountUnit: "€",
151
+ amountUnit: '€'
152
152
  },
153
153
  {
154
154
  amount: 9144447.23,
155
155
  rate: 50.0016569,
156
- amountUnit: "€",
157
- },
158
- ],
156
+ amountUnit: '€'
157
+ }
158
+ ]
159
159
  },
160
160
  {
161
- label: "Data Two",
161
+ label: 'Data Two',
162
162
  data: [
163
163
  {
164
164
  amount: 103144.22,
165
165
  rate: 1.1232806,
166
- amountUnit: "€",
166
+ amountUnit: '€'
167
167
  },
168
168
  {
169
169
  amount: 297474.14,
170
170
  rate: 3.2396087,
171
- amountUnit: "€",
171
+ amountUnit: '€'
172
172
  },
173
173
  {
174
174
  amount: 8781791.1,
175
175
  rate: 95.6371107,
176
- amountUnit: "€",
176
+ amountUnit: '€'
177
177
  },
178
178
  {
179
179
  amount: 8781791.1,
180
180
  rate: 45.6371107,
181
- amountUnit: "€",
181
+ amountUnit: '€'
182
182
  },
183
183
  {
184
184
  amount: 8781791.1,
185
185
  rate: 40.6371107,
186
- amountUnit: "€",
186
+ amountUnit: '€'
187
187
  },
188
188
  {
189
189
  amount: 8781791.1,
190
190
  rate: 6.6371107,
191
- amountUnit: "€",
191
+ amountUnit: '€'
192
192
  },
193
193
  {
194
194
  amount: 8781791.1,
195
195
  rate: 7.6371107,
196
- amountUnit: "€",
196
+ amountUnit: '€'
197
197
  },
198
198
  {
199
199
  amount: 8781791.1,
200
200
  rate: 39.6371107,
201
- amountUnit: "€",
201
+ amountUnit: '€'
202
202
  },
203
203
  {
204
204
  amount: 8781791.1,
205
205
  rate: 30.6371107,
206
- amountUnit: "€",
206
+ amountUnit: '€'
207
207
  },
208
208
  {
209
209
  amount: 8781791.1,
210
210
  rate: 50.6371107,
211
- amountUnit: "€",
211
+ amountUnit: '€'
212
212
  },
213
213
  {
214
214
  amount: 8781791.1,
215
215
  rate: 59.6371107,
216
- amountUnit: "€",
216
+ amountUnit: '€'
217
217
  },
218
218
  {
219
219
  amount: 8781791.1,
220
220
  rate: 4.6371107,
221
- amountUnit: "€",
222
- },
223
- ],
224
- },
221
+ amountUnit: '€'
222
+ }
223
+ ]
224
+ }
225
225
  ],
226
- unit: "%",
227
- },
226
+ unit: '%'
227
+ }
228
228
  } satisfies Story;
229
229
 
230
230
  export const StackedBarChart = {
231
231
  args: {
232
- width: "700px",
233
- height: "400px",
234
- tooltipFirstLineLabel: "content",
235
- tooltipSecondLineLabel: "content2",
232
+ width: '700px',
233
+ height: '400px',
234
+ tooltipFirstLineLabel: 'content',
235
+ tooltipSecondLineLabel: 'content2',
236
236
  disableAccessibility: false,
237
237
  stacked: true,
238
- labels: ["Category One", "Category Two", "Category Three"],
238
+ labels: ['Category One', 'Category Two', 'Category Three'],
239
239
  colourSet: 3,
240
240
  datasets: [
241
241
  {
242
- label: "Dataset One",
242
+ label: 'Dataset One',
243
243
  stack: 0,
244
244
  data: [
245
245
  {
246
246
  amount: 103144.22,
247
247
  rate: 100.1232806,
248
- amountUnit: "€",
248
+ amountUnit: '€'
249
249
  },
250
250
  {
251
251
  amount: 297474.14,
252
252
  rate: 3.2396087,
253
- amountUnit: "€",
253
+ amountUnit: '€'
254
254
  },
255
255
  {
256
256
  amount: 8781791.1,
257
257
  rate: 95.6371107,
258
- amountUnit: "€",
259
- },
260
- ],
258
+ amountUnit: '€'
259
+ }
260
+ ]
261
261
  },
262
262
  {
263
- label: "Dataset Two",
263
+ label: 'Dataset Two',
264
264
  stack: 1,
265
265
  data: [
266
266
  {
267
267
  amount: 103144.22,
268
268
  rate: 1.1232806,
269
- amountUnit: "€",
269
+ amountUnit: '€'
270
270
  },
271
271
  {
272
272
  amount: 297474.14,
273
273
  rate: 3.2396087,
274
- amountUnit: "€",
274
+ amountUnit: '€'
275
275
  },
276
276
  {
277
277
  amount: 8781791.1,
278
278
  rate: 95.6371107,
279
- amountUnit: "€",
280
- },
281
- ],
279
+ amountUnit: '€'
280
+ }
281
+ ]
282
282
  },
283
283
  {
284
- label: "Dataset Three",
284
+ label: 'Dataset Three',
285
285
  stack: 1,
286
286
  data: [
287
287
  {
288
288
  amount: 103144.22,
289
289
  rate: 1.1232806,
290
- amountUnit: "€",
290
+ amountUnit: '€'
291
291
  },
292
292
  {
293
293
  amount: 297474.14,
294
294
  rate: 3.2396087,
295
- amountUnit: "€",
295
+ amountUnit: '€'
296
296
  },
297
297
  {
298
298
  amount: 8781791.1,
299
299
  rate: 95.6371107,
300
- amountUnit: "€",
301
- },
302
- ],
303
- },
300
+ amountUnit: '€'
301
+ }
302
+ ]
303
+ }
304
304
  ],
305
- unit: "%",
306
- },
305
+ unit: '%'
306
+ }
307
307
  } satisfies Story;