@forter/chart - npm Package Compare versions

Comparing version 4.0.8 to 5.0.0

_virtual/_rollupPluginBabelHelpers.js

@@ -0,1 +1,38 @@
+function _getPrototypeOf(o) {
+  _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
+    return o.__proto__ || Object.getPrototypeOf(o);
+  };
+  return _getPrototypeOf(o);
+}
+
+function _superPropBase(object, property) {
+  while (!Object.prototype.hasOwnProperty.call(object, property)) {
+    object = _getPrototypeOf(object);
+    if (object === null) break;
+  }
+
+  return object;
+}
+
+function _get(target, property, receiver) {
+  if (typeof Reflect !== "undefined" && Reflect.get) {
+    _get = Reflect.get;
+  } else {
+    _get = function _get(target, property, receiver) {
+      var base = _superPropBase(target, property);
+
+      if (!base) return;
+      var desc = Object.getOwnPropertyDescriptor(base, property);
+
+      if (desc.get) {
+        return desc.get.call(receiver);
+      }
+
+      return desc.value;
+    };
+  }
+
+  return _get(target, property, receiver || target);
+}
+
 function _toArray(arr) {
@@ -433,3 +470,3 @@ return _arrayWithHoles(arr) || _iterableToArray(arr) || _nonIterableRest();
 
-export { _arrayWithHoles as arrayWithHoles, _decorate as decorate, _iterableToArray as iterableToArray, _nonIterableRest as nonIterableRest, _toArray as toArray, _toPrimitive as toPrimitive, _toPropertyKey as toPropertyKey };
+export { _arrayWithHoles as arrayWithHoles, _decorate as decorate, _get as get, _getPrototypeOf as getPrototypeOf, _iterableToArray as iterableToArray, _nonIterableRest as nonIterableRest, _superPropBase as superPropBase, _toArray as toArray, _toPrimitive as toPrimitive, _toPropertyKey as toPropertyKey };
 //# sourceMappingURL=_rollupPluginBabelHelpers.js.map

CHANGELOG.md

@@ -6,99 +6,16 @@ # Change Log
 
-## [4.0.8](https://github.com/forter/web-components/compare/@forter/chart@4.0.6...@forter/chart@4.0.8) (2020-04-06)
+# [5.0.0](https://github.com/forter/web-components/compare/@forter/chart@4.0.8...@forter/chart@5.0.0) (2021-08-23)
 
-**Note:** Version bump only for package @forter/chart
 
-
-
-
-
-## [4.0.6](https://github.com/forter/web-components/compare/@forter/chart@4.0.5...@forter/chart@4.0.6) (2020-03-09)
-
-**Note:** Version bump only for package @forter/chart
-
-
-
-
-
-## [4.0.5](https://github.com/forter/web-components/compare/@forter/chart@4.0.4...@forter/chart@4.0.5) (2020-02-05)
-
-**Note:** Version bump only for package @forter/chart
-
-
-
-
-
-## [4.0.4](https://github.com/forter/web-components/compare/@forter/chart@4.0.3...@forter/chart@4.0.4) (2020-02-04)
-
-**Note:** Version bump only for package @forter/chart
-
-
-
-
-
-## [4.0.3](https://github.com/forter/web-components/compare/@forter/chart@4.0.2...@forter/chart@4.0.3) (2020-01-10)
-
-**Note:** Version bump only for package @forter/chart
-
-
-
-
-
-## [4.0.2](https://github.com/forter/web-components/compare/@forter/chart@4.0.1...@forter/chart@4.0.2) (2020-01-07)
-
-**Note:** Version bump only for package @forter/chart
-
-
-
-
-
-## [4.0.1](https://github.com/forter/web-components/compare/@forter/chart@4.0.0...@forter/chart@4.0.1) (2019-11-27)
-
-**Note:** Version bump only for package @forter/chart
-
-
-
-
-
-# [4.0.0](https://github.com/forter/web-components/compare/@forter/chart@3.0.2...@forter/chart@4.0.0) (2019-09-19)
-
-
 ### Bug Fixes
 
-* **layout:** remove slots from fc-card ([b6d4aad](https://github.com/forter/web-components/commit/b6d4aad))
+* **chart:** added .eslintignore ([8306805](https://github.com/forter/web-components/commit/8306805))
+* **chart:** added to gitignore ([66c7cec](https://github.com/forter/web-components/commit/66c7cec))
+* **chart:** deleted eslintignore ([68d860d](https://github.com/forter/web-components/commit/68d860d))
+* **chart:** fixed lint ([9709d21](https://github.com/forter/web-components/commit/9709d21))
 
 
-### BREAKING CHANGES
-
-* **layout:** removes named slots from <fc-card>
-
-affects: @forter/layout
-
-
-
-
-
-## [3.0.2](https://github.com/forter/web-components/compare/@forter/chart@3.0.1...@forter/chart@3.0.2) (2019-09-16)
-
-**Note:** Version bump only for package @forter/chart
-
-
-
-
-
-## [3.0.1](https://github.com/forter/web-components/compare/@forter/chart@3.0.0...@forter/chart@3.0.1) (2019-09-09)
-
-**Note:** Version bump only for package @forter/chart
-
-
-
-
-
-# [3.0.0](https://github.com/forter/web-components/compare/@forter/chart@2.0.2...@forter/chart@3.0.0) (2019-09-02)
-
-
 ### Features
 
-* **chart:** making chart support color schemas ([7240da4](https://github.com/forter/web-components/commit/7240da4))
-* **helpers:** break helpers up into smaller packages ([c315923](https://github.com/forter/web-components/commit/c315923))
+* **dashboard:** dashboard initial commit ([294124b](https://github.com/forter/web-components/commit/294124b))
 
@@ -108,67 +25,2 @@
 
-* **helpers:** Deprecates most functionality in \`helpers\` and moves them to new packages
-
-
-
-
-
-## [2.0.2](https://github.com/forter/web-components/compare/@forter/chart@2.0.1...@forter/chart@2.0.2) (2019-07-22)
-
-**Note:** Version bump only for package @forter/chart
-
-
-
-
-
-## 2.0.1 (2019-07-11)
-
-
-### Bug Fixes
-
-* add missing lit deps to packages ([e1ce672](https://github.com/forter/web-components/commit/e1ce672))
-* align sibling versions ([84e4f9a](https://github.com/forter/web-components/commit/84e4f9a))
-* change scope to forter ([299eaa1](https://github.com/forter/web-components/commit/299eaa1))
-* update dependencies ([2040402](https://github.com/forter/web-components/commit/2040402))
-* **icon:** add size property ([8c40f21](https://github.com/forter/web-components/commit/8c40f21))
-
-
-### Features
-
-* add built packages for dist ([ea4a920](https://github.com/forter/web-components/commit/ea4a920))
-* add storybook ([dac303e](https://github.com/forter/web-components/commit/dac303e))
-* adds npm run link script for local dev ([920895c](https://github.com/forter/web-components/commit/920895c))
-* publish sourcemaps ([d68dc11](https://github.com/forter/web-components/commit/d68dc11))
-
-
-### BREAKING CHANGES
-
-* **icon:** remove width and height properties
-* moves css to \`.css.js\`
-
-
-
-
-
-# 2.0.0 (2019-07-11)
-
-
-### Bug Fixes
-
-* add missing lit deps to packages ([e1ce672](https://github.com/forter/web-components/commit/e1ce672))
-* align sibling versions ([84e4f9a](https://github.com/forter/web-components/commit/84e4f9a))
-* change scope to forter ([299eaa1](https://github.com/forter/web-components/commit/299eaa1))
-* update dependencies ([2040402](https://github.com/forter/web-components/commit/2040402))
-* **icon:** add size property ([8c40f21](https://github.com/forter/web-components/commit/8c40f21))
-
-
-### Features
-
-* add built packages for dist ([ea4a920](https://github.com/forter/web-components/commit/ea4a920))
-* add storybook ([dac303e](https://github.com/forter/web-components/commit/dac303e))
-* adds npm run link script for local dev ([920895c](https://github.com/forter/web-components/commit/920895c))
-
-
-### BREAKING CHANGES
-
-* **icon:** remove width and height properties
-* moves css to \`.css.js\`
+* **dashboard:** updated fc-chart to the latest version of chart.js

package.json

 {
   "name": "@forter/chart",
-  "version": "4.0.8",
-  "description": "Chart from Forter Components",
+  "version": "5.0.0",
+  "description": "chart from Forter Components",
+  "author": "Forter Developers",
+  "license": "Apache-2.0",
+  "contributors": [
+    "Omer Anati <[e-mail]>"
+  ],
   "main": "index.js",
@@ -31,2 +36,8 @@ "module": "index.js",
   ],
+  "nyc": {
+    "exclude": [
+      "src/**/*.spec.js",
+      "*.spec.js"
+    ]
+  },
   "keywords": [
@@ -38,15 +49,13 @@ "web-components",
   ],
-  "author": "Forter Developers",
-  "license": "Apache-2.0",
   "bugs": {
     "url": "https://github.com/forter/web-components/issues"
   },
-  "homepage": "https://github.com/forter/web-components#readme",
   "dependencies": {
     "@forter/core": "^2.0.5",
-    "chart.js": "^2.7.3",
-    "lit-element": "^2.1.0",
-    "lit-html": "^1.1.0"
+    "chart.js": "3.5.0",
+    "chartjs-adapter-moment": "^1.0.0",
+    "chartjs-plugin-annotation": "1.0.2",
+    "lodash-es": "^4.17.21"
   },
-  "gitHead": "e5656b1ed9d4533b603332dd93e241493195ebca"
+  "gitHead": "07461b86d6059a279e87f741a67aaecc126e13b5"
 }

src/fc-chart.spec.js

@@ -8,13 +8,6 @@ import { assertWebComponentRender } from '@forter/test-helpers';
 
+const tagName = 'fc-chart';
+
 const properties = markdownToProperties(FcChart, markdown);
 
-describe(FcChart.is, assertWebComponentRender(
-  FcChart.is,
-  properties, {
-    chaiDomDiffOpts: {
-      ignoreAttributes: [
-        { tags: ['canvas'], attributes: ['style', 'width', 'height'] },
-      ],
-    },
-  }
-));
+describe(tagName, assertWebComponentRender(tagName, properties));

src/FcChart.js

 import { LitElement, html, property } from 'lit-element';
-import 'chart.js';
+import { Chart, registerables } from 'chart.js';
+import annotationPlugin from 'chartjs-plugin-annotation';
+import { get, merge } from 'lodash-es';
 import style from './fc-chart.css';
+import 'chartjs-adapter-moment';
 
-const { Chart } = window;
+export const SUPPORTED_CHART_TYPES = ['line'];
 
-Chart.defaults.global.legend.position = 'bottom';
-Chart.defaults.global.legend.labels.usePointStyle = true;
-Chart.defaults.global.legend.labels.boxWidth = 15;
-
-Chart.plugins.register({
-  afterDraw: function(chart) {
-    if (chart.data.datasets.length === 0) {
-      // No data is present
-      const { ctx } = chart.chart;
-      const { width } = chart.chart;
-      const { height } = chart.chart;
-      chart.clear();
-
-      ctx.save();
-      ctx.textAlign = 'center';
-      ctx.textBaseline = 'middle';
-      ctx.font = '16px normal \'Helvetica Nueue\'';
-      ctx.fillText('No data to display', width / 2, height / 2);
-      ctx.restore();
+export const DEFAULT_OPTIONS = {
+  maintainAspectRatio: false,
+  interaction: {
+    mode: 'nearest',
+    intersect: false
+  },
+  plugins: {
+    legend: {
+      display: false
+    },
+    tooltip: {
+      usePointStyle: true,
+      // enabled: false,
+    },
+    autocolors: false,
+  },
+  scales: {
+    y: {
+      type: 'linear',
+      min: 8,
+      max: 15,
+      grid: {
+        borderDash: [2, 1],
+        borderColor: 'transparent',
+        lineColor: '#DADEE4',
+        drawTicks: true,
+        tickColor: 'transparent',
+        tickLength: 10
+      },
+      ticks: {
+        stepSize: 3,
+        color: '#8696AC',
+        padding: 0
+      },
+      border: false,
+      align: 'start'
+    },
+    x: {
+      adapters: {
+        date: 'chartjs-adapter-moment'
+      },
+      type: 'time',
+      time: {
+        unit: 'day',
+        displayFormats: {
+          quarter: 'MMM YYYY'
+        }
+      },
+      beginAtZero: true,
+      grid: {
+        color: 'transparent',
+        borderColor: '#B5BECC',
+        borderWidth: 1,
+        drawTicks: true,
+        tickColor: '#B5BECC',
+        lineWidth: 1,
+        tickLength: 6
+      },
+      ticks: {
+        color: '#8696AC',
+        stepSize: 1,
+        align: 'start'
+      }
     }
-  },
-});
+  }
+};
 
-/** @typedef {Object} ChartData */
-/** @typedef {Object} ChartOptions */
+export const DEFAULT_DATASET_CONFIG = {
+  label: '1',
+  borderColor: '#009A1A',
+  borderWidth: 3,
+  pointRadius: 0,
+  pointHitRadius: 0,
+  pointHoverRadius: 0,
+  borderJoinStyle: 'round',
+  borderCapStyle: 'round',
+  tension: 0.3,
+  cubicInterpolationMode: 'monotone',
+};
 
 /**
- * Custom Element wrapper for chart.js
- * <!-- Author: Liron Goldenberg <[e-mail]> -->
+ * An element by Forter
+ * <!-- Author: Omer Anati <[e-mail]> -->
  *
+ * ## Usage
+ *
+ * ```html
+ * <script>
+ *   import '@forter/chart';
+ * </script>
+ *
+ * <fc-chart
+ *  config={"series":[{"seriesType":"LINE","label":"AGGS.APPROVED.LABEL","aggregation":{"key":"APPROVED","filters":{},"dimensions":[{"key":"TRANS_TIME","label":"DIMENSION.TRANS_TIME.LABEL"}],"data":[{"dimensions":["2021/07/02"],"value":10},{"dimensions":["2021/07/05"],"value":11},{"dimensions":["2021/07/11"],"value":10},{"dimensions":["2021/07/18"],"value":12}]}}]}
+ * >
+ * </fc-chart>
+ * ```
+ *
+* @element fc-chart
+ * @cssprop --fc-chart-disabled-color - color.
+ * @cssprop --fc-chart-disabled-color - disabled color. example: `gray`
  */
 export class FcChart extends LitElement {
-  @property({ type: Object }) items = [];
-
   /**
-   * Chart type
-   * @type {'bar'|'doughnut'|'horizontalBar'|'line'|'pie'|'polarArea'|'radar'}
+   * If the element is disabled
+   * @type {Boolean}
    * @attr
    */
-  @property({ type: String }) type = 'line'; // tslint:disable-line:no-reserved-keywords
+  @property({ type: Boolean }) disabled = false;
 
-  /**
-   * Chart colour palette from forter theme
-   * @type {'default'|'positive'|'negative'}
-   * @attr
-   */
-  @property({ type: String }) palette = 'default';
+  @property( { type: Object }) config;
 
-  /**
-   * Chart data
-   * @type {ChartData}
-   */
-  @property({ type: Object }) data = {
-    labels: [],
-    datasets: [
-      {
-        label: 'Number of Lessons done',
-        backgroundColor: '#6741d9',
-        borderColor: '#6741d9',
-        data: [],
-        fill: false,
-      },
-    ],
-  };
+  @property( { type: String }) type = 'line';
 
-  /**
-   * Chart Options
-   * @type {ChartOptions}
-   */
-  @property({ type: Object }) options = {
-    responsive: true,
-    maintainAspectRatio: false,
-    title: {
-      display: false,
-    },
-    tooltips: {
-      mode: 'index',
-      intersect: false,
-    },
-    hover: {
-      mode: 'nearest',
-      intersect: true,
-    },
-  };
-
   /** @inheritdoc */
@@ -98,120 +129,95 @@ static is = 'fc-chart';
 
-  chart;
+  firstUpdated() {
+    this.context = this.shadowRoot.getElementById('myChart').getContext('2d');
+    Chart.register([annotationPlugin]);
+    Chart.register(...registerables);
+  }
 
-  /** @inheritdoc */
-  render() {
-    return html`
-      <div id="canvas-container">
-        <canvas></canvas>
-      </div>
-    `;
+  updated(_changedProperties) {
+    super.updated(_changedProperties);
+    const { config } = this;
+    this.chart = config && new Chart(this.context, this.getConfig(config));
   }
 
-  getColor(palette, i) {
-    return getComputedStyle(this).getPropertyValue(`--chart-${palette}-${i + 1}`).trim();
+  getConfig(config) {
+    let chartJSConfig = {};
+
+    chartJSConfig = this.generateBasicConfig(config, chartJSConfig);
+    chartJSConfig = this.insertYAxisTicks(config, chartJSConfig);
+    chartJSConfig = this.insertXAxisTicks(config, chartJSConfig);
+
+    return chartJSConfig;
   }
 
-  fillColors() {
-    const { palette, type } = this;
+  generateBasicConfig(config, chartJSConfig) {
+    const basicConfig = {
+      type: this.type,
+      data: {
+        datasets: this.extractDatasets(config)
+      },
+      options: DEFAULT_OPTIONS
+    };
 
-    this.data.datasets.map((dataset, index) => {
-      if (['line', 'scatter', 'radar'].includes(type)) {
-        dataset.backgroundColor = this.getColor(palette, index);
-        return;
+    return merge(chartJSConfig, basicConfig);
+  }
+
+  extractDatasets(config) {
+    const { series = [] } = config;
+    return series.map(dataset => {
+      const { seriesType } = dataset;
+
+      const config = {
+        data: (dataset.aggregation.data || []).map(item => ({
+          x: item.dimensions[0],
+          y: item.value
+        })),
+        ...DEFAULT_DATASET_CONFIG,
+        ...dataset.style
+      };
+
+      if (seriesType && SUPPORTED_CHART_TYPES.includes(seriesType.toLowerCase())) {
+        config.type = seriesType.toLowerCase();
       }
-      dataset.backgroundColor = [];
-      dataset.data.map((x, i) =>
-        dataset.backgroundColor.push(
-          this.getColor(palette, i)
-        )
-      );
+
+      return config;
     });
   }
 
-  /**
-   * Initializes chart.js data.
-   * Adds observe.
-   * Adds resize listener
-   * @inheritdoc
-   */
-  firstUpdated() {
-    const { data, options, type } = this;
+  insertYAxisTicks(config, chartJSConfig) {
+    const symbol = get(config, 'style.options.scales.y.ticks.forterSymbol');
 
+    if (symbol) {
+      const callback = function(value, index, values) {
+        return `${value}${symbol}`;
+      };
 
-    if (this.items && this.items.length > 0) {
-      data.labels = this.items.map(x => x.date);
-      data.datasets[0].data = this.items.map(x => x.count);
-    }
+      const callbackObject = { options: { scales: { y: { ticks: { callback } } } } };
 
-    this.fillColors();
-
-    if (!this.chart) {
-      const ctx = this.shadowRoot.querySelector('canvas').getContext('2d');
-      this.chart = new Chart(ctx, {
-        type,
-        data,
-        options,
-      });
-    } else {
-      this.chart.type = this.type;
-      this.chart.data = data;
-      this.chart.options = options;
-      this.chart.update();
+      chartJSConfig = merge(chartJSConfig, callbackObject);
     }
-    this.chart.data = this.observe(this.chart.data);
-    Object.keys(this.chart.data).map(
-      prop => (this.chart.data[prop] = this.observe(this.chart.data[prop])),
-    );
-    this.chart.data.datasets = this.chart.data.datasets.map(dataset => {
-      /* eslint no-param-reassign: 0 */
-      dataset.data = this.observe(dataset.data);
 
-      return this.observe(dataset);
-    });
-    const { chart } = this;
-
-    window.addEventListener('resize', () => {
-      if (chart) {
-        chart.resize();
-      }
-    });
+    return chartJSConfig;
   }
 
-  /** @inheritdoc */
-  updated() {
-    this.fillColors();
-    this.chart.type = this.type;
-    this.chart.data = this.data;
-    this.chart.options = this.options;
-    this.chart.update();
-  }
+  insertXAxisTicks(config, chartJSConfig) {
+    const callback = function(value, index, values) {
+      return index % 7 === 0 && index === values.length - 1
+        ? ''
+        : index % 7 === 0
+          ? `WEEK ${(index + 7) / 7}`
+          : null;
+    };
 
-  /**
-   * Use Proxy to watch object props change
-   * @param {Object} obj
-   * @return {Proxy}
-   * @protected
-   */
-  observe(obj) {
-    const updateChart = () => this.updateChart;
+    const callbackObject = { options: { scales: { x: { ticks: { callback } } } } };
 
-    return new Proxy(obj, {
-      set: (target, prop, val) => {
-        target[prop] = val;
-        Promise.resolve().then(updateChart);
+    chartJSConfig = merge(chartJSConfig, callbackObject);
 
-        return true;
-      },
-    });
+    return chartJSConfig;
   }
 
-  /**
-   * Manually update chart
-   * @protected
-   */
-  updateChart() {
-    if (this.chart) {
-      this.chart.update();
-    }
+  render() {
+    return html`
+      <canvas id="myChart"></canvas>
+    `;
   }
 }

web-components.json

 {
   "version": 2,
-  "tags": []
+  "tags": [
+    {
+      "name": "fc-chart",
+      "description": "An element by Forter\n<!-- Author: Omer Anati <[e-mail]> -->\n\n## Usage\n\n```html\n<script>\n   import '@forter/chart';\n</script>\n\n<fc-chart\n  config={\"series\":[{\"seriesType\":\"LINE\",\"label\":\"AGGS.APPROVED.LABEL\",\"aggregation\":{\"key\":\"APPROVED\",\"filters\":{},\"dimensions\":[{\"key\":\"TRANS_TIME\",\"label\":\"DIMENSION.TRANS_TIME.LABEL\"}],\"data\":[{\"dimensions\":[\"2021/07/02\"],\"value\":10},{\"dimensions\":[\"2021/07/05\"],\"value\":11},{\"dimensions\":[\"2021/07/11\"],\"value\":10},{\"dimensions\":[\"2021/07/18\"],\"value\":12}]}}]}\n>\n</fc-chart>\n```",
+      "jsDoc": "/**\n * An element by Forter\n * <!-- Author: Omer Anati <[e-mail]> -->\n *\n * ## Usage\n *\n * ```html\n * <script>\n *   import '@forter/chart';\n * </script>\n *\n * <fc-chart\n *  config={\"series\":[{\"seriesType\":\"LINE\",\"label\":\"AGGS.APPROVED.LABEL\",\"aggregation\":{\"key\":\"APPROVED\",\"filters\":{},\"dimensions\":[{\"key\":\"TRANS_TIME\",\"label\":\"DIMENSION.TRANS_TIME.LABEL\"}],\"data\":[{\"dimensions\":[\"2021/07/02\"],\"value\":10},{\"dimensions\":[\"2021/07/05\"],\"value\":11},{\"dimensions\":[\"2021/07/11\"],\"value\":10},{\"dimensions\":[\"2021/07/18\"],\"value\":12}]}}]}\n * >\n * </fc-chart>\n * ```\n *\n* @element fc-chart\n * @cssprop --fc-chart-disabled-color - color.\n * @cssprop --fc-chart-disabled-color - disabled color. example: `gray`\n */",
+      "attributes": [
+        {
+          "name": "disabled",
+          "description": "If the element is disabled",
+          "jsDoc": "/**\n   * If the element is disabled\n   * @type {Boolean}\n   * @attr\n   */",
+          "type": "boolean"
+        },
+        {
+          "name": "config",
+          "type": "any"
+        },
+        {
+          "name": "type",
+          "type": "string"
+        }
+      ],
+      "properties": [
+        {
+          "name": "disabled",
+          "description": "If the element is disabled",
+          "jsDoc": "/**\n   * If the element is disabled\n   * @type {Boolean}\n   * @attr\n   */",
+          "type": "boolean"
+        },
+        {
+          "name": "config",
+          "type": "any"
+        },
+        {
+          "name": "type",
+          "type": "string"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--fc-chart-disabled-color",
+          "description": "disabled color. example: `gray`"
+        }
+      ]
+    }
+  ]
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

62913

increased by4.41%

Number of package files

29

increased by16%

Lines of code

1063

increased by0.95%

Number of lines in readme file

32

increased by3100%

Worsened metrics

Dependency count

5

increased by25%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedchartjs-adapter-moment@^1.0.0

• + Addedchartjs-plugin-annotation@1.0.2

• + Addedlodash-es@^4.17.21

• + Addedchart.js@3.5.0(transitive)

• + Addedchartjs-adapter-moment@1.0.1(transitive)

• + Addedchartjs-plugin-annotation@1.0.2(transitive)

• + Addedlodash-es@4.17.21(transitive)

• - Removedlit-element@^2.1.0

• - Removedlit-html@^1.1.0

• - Removedchart.js@2.9.4(transitive)

• - Removedchartjs-color@2.4.1(transitive)

• - Removedchartjs-color-string@0.6.0(transitive)

• - Removedcolor-convert@1.9.3(transitive)

• - Removedcolor-name@1.1.31.1.4(transitive)

• - Removedlit-element@2.5.1(transitive)

• - Removedlit-html@1.4.1(transitive)

• Updatedchart.js@3.5.0