Merge branch 'master' into renovate/major-typescript-eslint-monorepo

.nvmrc

@@ -1 +1 @@
-20.11.0
+20.11.1

CHANGELOG.md

@@ -1,6 +1,10 @@
 # Changelog
 
-## v4.2.4 [2023-12-29]
+## v4.3.0 []
+
+### BREAKING CHANGES
+
+- [refactor] - Move all plugins to their own repositories in https://github.com/cal-heatmap/
 
 ### Fixes
 

index.js

@@ -1,7 +1,4 @@
 import CalHeatmap from './src/CalHeatmap';
-import Tooltip from './src/plugins/Tooltip';
-import Legend from './src/plugins/Legend';
-import LegendLite from './src/plugins/LegendLite';
 import VERSION from './src/version';
 
-export { CalHeatmap as default, Tooltip, Legend, LegendLite, VERSION };
+export { CalHeatmap as default, VERSION };

package.json

@@ -1,6 +1,6 @@
 {
   "name": "cal-heatmap",
-  "version": "4.2.4",
+  "version": "4.3.0-beta.4",
   "description": "Cal-Heatmap is a javascript module to create calendar heatmap to visualize time series data",
   "keywords": [
     "calendar",
@@ -13,40 +13,19 @@
     ".": {
       "import": "./dist/cal-heatmap.esm.js",
       "require": "./dist/cal-heatmap.js",
-      "types": "./src/types/index.d.ts"
+      "types": "./src/types.d.ts"
     },
     "./package.json": "./package.json",
-    "./cal-heatmap.css": "./dist/cal-heatmap.css",
-    "./plugins/Tooltip": {
-      "import": "./dist/plugins/Tooltip.esm.js",
-      "require": "./dist/plugins/Tooltip.js",
-      "types": "./src/types/plugins/Tooltip.d.ts"
-    },
-    "./plugins/Legend": {
-      "import": "./dist/plugins/Legend.esm.js",
-      "require": "./dist/plugins/Legend.js",
-      "types": "./src/types/plugins/Legend.d.ts"
-    },
-    "./plugins/LegendLite": {
-      "import": "./dist/plugins/LegendLite.esm.js",
-      "require": "./dist/plugins/LegendLite.js",
-      "types": "./src/types/plugins/LegendLite.d.ts"
-    },
-    "./plugins/CalendarLabel": {
-      "import": "./dist/plugins/CalendarLabel.esm.js",
-      "require": "./dist/plugins/CalendarLabel.js",
-      "types": "./src/types/plugins/CalendarLabel.d.ts"
-    }
+    "./cal-heatmap.css": "./dist/cal-heatmap.css"
   },
   "directories": {
     "test": "test"
   },
-  "types": "./src/types/index.d.ts",
+  "types": "./src/types.d.ts",
   "node": ">=14.16",
   "browserslist": "last 2 versions, not dead, > 0.2%",
   "dependencies": {
     "@observablehq/plot": "^0.6.0",
-    "@popperjs/core": "^2.11.6",
     "core-js": "^3.35.1",
     "d3-color": "^3.1.0",
     "d3-fetch": "^3.0.1",
@@ -65,10 +44,7 @@
     "@rollup/plugin-replace": "^5.0.1",
     "@rollup/plugin-terser": "^0.4.0",
     "@rollup/plugin-typescript": "^11.0.0",
-    "@types/d3-color": "^3.1.0",
-    "@types/d3-fetch": "^3.0.1",
-    "@types/d3-selection": "^3.0.3",
-    "@types/d3-transition": "^3.0.2",
+    "@types/d3": "^7.4.3",
     "@types/jest": "^29.2.4",
     "@types/lodash-es": "^4.17.6",
     "@types/selenium-webdriver": "^4.1.10",
@@ -117,7 +93,7 @@
   "homepage": "https://cal-heatmap.com",
   "author": {
     "name": "Wan Qi Chen",
-    "url": "http://www.kamisama.me"
+    "url": "https://github.com/wa0x6e"
   },
   "license": "MIT",
   "bugs": "https://github.com/wa0x6e/cal-heatmap/issues",
@@ -127,7 +103,7 @@
   ],
   "files": [
     "dist",
-    "src/types"
+    "src/types.d.ts"
   ],
   "config": {
     "commitizen": {

rollup.config.js

@@ -53,12 +53,10 @@ writeFileSync(
 );
 
 const globals = {
-  '@popperjs/core': 'Popper',
   'd3-selection': 'd3',
   d3: 'd3',
   'd3-color': 'd3',
   'd3-fetch': 'd3',
-  'd3-selection': 'd3',
   'd3-transition': 'd3',
 };
 
@@ -117,7 +115,7 @@ const exportConfig = (input, name, output, options = {}) => {
 };
 
 export default [
-  ...exportConfig('src/CalHeatmap.ts', 'CalHeatmap', pkg.name, {
+  ...exportConfig('src/index.ts', 'CalHeatmap', pkg.name, {
     external: [
       'd3',
       'd3-color',
@@ -127,17 +125,5 @@ export default [
       'd3-selection',
       'd3-transition',
     ],
-  }),
-  ...exportConfig('src/plugins/Tooltip.ts', 'Tooltip', 'plugins/Tooltip', {
-    external: ['@popperjs/core'],
-  }),
-  ...exportConfig('src/plugins/Legend.ts', 'Legend', 'plugins/Legend', {
-    external: ['d3-selection', 'd3'],
-  }),
-  ...exportConfig('src/plugins/LegendLite.ts', 'LegendLite', 'plugins/LegendLite', {
-    external: ['d3-selection', 'd3'],
-  }),
-  ...exportConfig('src/plugins/CalendarLabel.ts', 'CalendarLabel', 'plugins/CalendarLabel', {
-    external: ['d3-selection', 'd3'],
-  }),
+  })
 ];

src/CalHeatmap.ts

@@ -12,25 +12,23 @@ import DomainCollection from './calendar/DomainCollection';
 import DateHelper from './helpers/DateHelper';
 import validate from './options/OptionsValidator';
 import PluginManager from './plugins/PluginManager';
+import TemplateCollection from './TemplateCollection';
+import { ScrollDirection } from './constants';
 import VERSION from './version';
 
 import './cal-heatmap.scss';
 
-import TemplateCollection from './TemplateCollection';
-
 import type { OptionsType } from './options/Options';
 import type {
   Template,
   Dimensions,
-  PluginDefinition,
+  IPlugin,
   Timestamp,
   DeepPartial,
-} from './types/index';
-
-import { ScrollDirection } from './constant';
+} from './types';
 
 export default class CalHeatmap {
-  static VERSION = VERSION;
+  static readonly VERSION = VERSION;
 
   options: Options;
 
@@ -93,12 +91,13 @@ export default class CalHeatmap {
    * Setup and paint the calendar with the given options
    *
    * @param  {Object} options The Options object
+   * @param  {Array} plugins An optional array of plugins to add to the calendar
    * @return A Promise, which will fulfill once all the underlying asynchronous
    * tasks settle, whether resolved or rejected.
    */
   async paint(
     options?: DeepPartial<OptionsType>,
-    plugins?: PluginDefinition[] | PluginDefinition,
+    plugins?: IPlugin[] | IPlugin,
   ): Promise<unknown> {
     this.options.init(options);
     await this.dateHelper.setup(this.options);
@@ -112,7 +111,7 @@ export default class CalHeatmap {
     }
 
     if (plugins) {
-      this.pluginManager.add(castArray(plugins as any) as PluginDefinition[]);
+      this.pluginManager.add(castArray(plugins));
     }
 
     this.calendarPainter.setup();

src/DataFetcher.ts

@@ -3,7 +3,7 @@ import {
 } from 'd3-fetch';
 
 import type { DataOptions, DataRecord } from './options/Options';
-import type { Timestamp } from './types/index';
+import type { Timestamp } from './types';
 import type CalHeatmap from './CalHeatmap';
 
 export default class DataFetcher {

src/TemplateCollection.ts

@@ -2,7 +2,7 @@ import castArray from 'lodash-es/castArray';
 
 import DefaultTemplates from './templates/index';
 import type Options from './options/Options';
-import type { Template, TemplateResult } from './types/index';
+import type { Template, TemplateResult } from './types';
 import type DateHelper from './helpers/DateHelper';
 
 export default class TemplateCollection {

src/cal-heatmap.scss

@@ -66,70 +66,3 @@
     }
   }
 }
-
-#ch-plugin-legend {
-  > svg {
-    background: transparent;
-    color: currentColor;
-  }
-}
-
-#ch-tooltip {
-  $arrow-size: 8px;
-
-  padding: 5px 10px;
-  background: #222;
-  color: #bbb;
-  font-size: 12px;
-  line-height: 1.4;
-  text-align: center;
-  border-radius: 2px;
-  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
-  display: none;
-  box-sizing: border-box;
-
-  &[data-show] {
-    display: block;
-  }
-
-  &-arrow,
-  &-arrow::before {
-    background: inherit;
-    width: $arrow-size;
-    height: $arrow-size;
-    position: absolute;
-  }
-
-  &-arrow {
-    visibility: hidden;
-  }
-
-  &-arrow::before {
-    visibility: visible;
-    content: '';
-    transform: rotate(45deg);
-  }
-
-  &[data-popper-placement^='top'] > &-arrow {
-    bottom: calc($arrow-size / -2);
-    margin-left: calc($arrow-size / -2);
-  }
-
-  &[data-popper-placement^='bottom'] > &-arrow {
-    top: calc($arrow-size / -2);
-    margin-left: calc($arrow-size / -2);
-  }
-
-  &[data-popper-placement^='left'] > &-arrow {
-    right: calc($arrow-size / -2);
-  }
-
-  &[data-popper-placement^='right'] > &-arrow {
-    left: calc($arrow-size / -2);
-  }
-
-  &[data-theme='dark'] {
-    background: #636e7b;
-    color: #cdd9e5;
-  }
-}

src/calendar/CalendarPainter.ts

@@ -2,12 +2,13 @@ import { select } from 'd3-selection';
 
 import DomainsContainerPainter from '../domain/DomainsContainerPainter';
 import PluginPainter from '../plugins/PluginPainter';
+import {
+  ScrollDirection,
+  CALENDAR_CONTAINER_SELECTOR,
+} from '../constants';
 
 import type CalHeatmap from '../CalHeatmap';
-import { ScrollDirection } from '../constant';
-import type { Dimensions } from '../types/index';
-
-export const DEFAULT_SELECTOR = '.ch-container';
+import type { Dimensions } from '../types';
 
 export default class CalendarPainter {
   calendar: CalHeatmap;
@@ -38,7 +39,7 @@ export default class CalendarPainter {
       this.root = select(itemSelector)
         .append('svg')
         .attr('data-theme', theme)
-        .attr('class', DEFAULT_SELECTOR.slice(1));
+        .attr('class', CALENDAR_CONTAINER_SELECTOR.slice(1));
       this.domainsContainerPainter.setup();
     }
 

src/calendar/DomainCollection.ts

@@ -1,6 +1,6 @@
 import castArray from 'lodash-es/castArray';
 
-import type { SubDomain, DomainType, Timestamp } from '../types/index';
+import type { SubDomain, DomainType, Timestamp } from '../types';
 import type {
   DataOptions,
   DataGroupType,

src/calendar/Navigator.ts

@@ -1,8 +1,8 @@
-import { ScrollDirection } from '../constant';
+import { ScrollDirection } from '../constants';
 
 import type CalHeatmap from '../CalHeatmap';
 import type DomainCollection from './DomainCollection';
-import type { Timestamp } from '../types/index';
+import type { Timestamp } from '../types';
 
 export default class Navigator {
   calendar: CalHeatmap;

src/calendar/Populator.ts

@@ -1,9 +1,9 @@
 import isFunction from 'lodash-es/isFunction';
 import { hcl } from 'd3-color';
-import { normalizedScale, applyScaleStyle } from '../scale';
+import { normalizedScale, applyScaleStyle } from '../helpers/ScaleHelper';
 
 import type CalHeatmap from '../CalHeatmap';
-import type { SubDomain, Timestamp } from '../types/index';
+import type { SubDomain, Timestamp } from '../types';
 
 export default class Populator {
   calendar: CalHeatmap;

src/constant.ts → src/constants.ts

@@ -28,3 +28,9 @@ export const SCALE_BASE_OPACITY_COLOR = 'red';
 export const SCALE_BASE_COLOR_SCHEME = 'YlOrBr';
 export const SCALE_BASE_COLOR_TYPE = 'quantize';
 export const SCALE_BASE_COLOR_DOMAIN = [0, 100];
+
+export const CALENDAR_CONTAINER_SELECTOR = '.ch-container';
+export const DOMAIN_SELECTOR = '.ch-domain';
+export const DOMAIN_LABEL_SELECTOR = '.ch-domain-text';
+export const SUBDOMAIN_SELECTOR = '.ch-subdomain';
+export const SUBDOMAIN_HIGHLIGHT_CLASSNAME = 'highlight';

src/domain/DomainCoordinates.ts

@@ -1,10 +1,10 @@
-import { ScrollDirection } from '../constant';
+import { ScrollDirection } from '../constants';
 import { horizontalPadding, verticalPadding } from '../helpers/PositionHelper';
 
 import type CalHeatmap from '../CalHeatmap';
 import type DomainPainter from './DomainPainter';
 import type DomainCollection from '../calendar/DomainCollection';
-import type { SubDomain, Dimensions, Timestamp } from '../types/index';
+import type { SubDomain, Dimensions, Timestamp } from '../types';
 
 type SubDomainWithCoordinates = Required<SubDomain> & {
   pre_x: number;