Skip to content

Commit

Permalink
feat(v6): use d3 v6 build with webpack 5
Browse files Browse the repository at this point in the history
  • Loading branch information
@shayh
shayh committed Aug 16, 2023
1 parent 2b4764c commit ba6cd8b
Show file tree
Hide file tree
Showing 17 changed files with 5,828 additions and 7,651 deletions.
2 changes: 1 addition & 1 deletion .gitignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ node_modules
demos/build

# Builds
sandbox/build
sandbox/build/
dist
docs
*.tgz
Expand Down
8 changes: 4 additions & 4 deletions demos/src/demo-brush.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { select, event } from 'd3-selection';
import { select } from 'd3-selection';
import { timeFormat } from 'd3-time-format';
// import PubSub from 'pubsub-js';

Expand Down Expand Up @@ -133,7 +133,7 @@ if (select('.js-brush-chart-container').node()) {
? brushContainer.node().getBoundingClientRect().width
: false;
const missingDataBrushContainer = select(
'.js-other-brush-chart-container'
'.js-other-brush-chart-container',
);
const missingDataContainerWidth = missingDataBrushContainer.node()
? missingDataBrushContainer.node().getBoundingClientRect().width
Expand All @@ -152,11 +152,11 @@ if (select('.js-brush-chart-container').node()) {
// Redraw charts on window resize
// PubSub.subscribe('resize', redrawCharts);

select('#clear-selection').on('click', function (e) {
select('#clear-selection').on('click', function (event) {
brushChart.dateRange([null, null]);
event.preventDefault();
});
select('#other-clear-selection').on('click', function (e) {
select('#other-clear-selection').on('click', function (event) {
missingDataBrushChart.dateRange([null, null]);
event.preventDefault();
});
Expand Down
192 changes: 97 additions & 95 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@
"check": "yarn run lint:styles && yarn run lint:js && yarn test:once",
"clean": "yarn cache clean && rimraf node_modules",
"demos:compile": "webpack --progress --colors --env=demos",
"demos:serve": "webpack-dev-server --content-base docs/ --inline --hot --port 8001 --env=demos",
"demos:serve": "webpack-dev-server --static docs/ --hot --port 8001 --env=demos",
"demos:watch": "webpack --watch --progress --colors --env=demos",
"docs": "webpack --env=demos && grunt docs",
"format": "prettier --loglevel warn --write \"**/*.js\"",
Expand All @@ -52,7 +52,7 @@
"release:minor": "grunt release:minor",
"release": "grunt release:patch",
"sandbox:compile": "webpack --env=sandbox",
"sandbox": "webpack-dev-server --env=sandbox --hot --content-base sandbox/ --inline",
"sandbox": "webpack-dev-server --env=sandbox --hot --static sandbox/",
"start": "concurrently \"yarn run docs\" \"yarn run demos:serve\" \"yarn run sandbox\"",
"stylelint:fix": "stylelint 'src/styles/**/*.scss' --fix",
"stylelint": "stylelint 'src/styles/**/*.scss'",
Expand Down Expand Up @@ -308,112 +308,114 @@
}
},
"dependencies": {
"base-64": "^0.1.0",
"d3-axis": "^1.0.12",
"d3-brush": "^1.1.6",
"base-64": "^1.0.0",
"d3-array": "^3.2.4",
"d3-axis": "^3.0.0",
"d3-brush": "^3.0.0",
"d3-collection": "^1.0.7",
"d3-format": "^1.4.5",
"d3-scale": "^3.2.4",
"d3-selection": "^1.4.1",
"d3-shape": "^1.3.7",
"d3-time": "^1.1.0",
"d3-time-format": "^3.0.0",
"d3-transition": "^1.3.2",
"d3-ease": "^3.0.1",
"d3-format": "^3.1.0",
"d3-scale": "^4.0.2",
"d3-selection": "^3.0.0",
"d3-shape": "^3.2.0",
"d3-time": "^3.1.0",
"d3-time-format": "^4.1.0",
"d3-transition": "^3.0.1",
"d3-voronoi": "^1.1.4",
"d3-zoom": "^1.8.3"
"d3-zoom": "^3.0.0"
},
"devDependencies": {
"@babel/core": "^7.2.0",
"@babel/eslint-parser": "^7.12.1",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-decorators": "^7.0.0",
"@babel/plugin-proposal-do-expressions": "^7.0.0",
"@babel/plugin-proposal-export-default-from": "^7.0.0",
"@babel/plugin-proposal-export-namespace-from": "^7.0.0",
"@babel/plugin-proposal-function-bind": "^7.0.0",
"@babel/plugin-proposal-function-sent": "^7.0.0",
"@babel/plugin-proposal-json-strings": "^7.0.0",
"@babel/plugin-proposal-logical-assignment-operators": "^7.0.0",
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.0.0",
"@babel/plugin-proposal-numeric-separator": "^7.0.0",
"@babel/plugin-proposal-optional-chaining": "^7.0.0",
"@babel/plugin-proposal-pipeline-operator": "^7.0.0",
"@babel/plugin-proposal-throw-expressions": "^7.0.0",
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
"@babel/plugin-syntax-import-meta": "^7.0.0",
"@babel/plugin-transform-async-to-generator": "^7.4.4",
"@babel/plugin-transform-runtime": "^7.4.4",
"@babel/preset-env": "^7.0.0",
"@babel/runtime": "^7.4.5",
"@commitlint/cli": "^16.2.1",
"@commitlint/config-conventional": "^16.2.1",
"@types/d3-selection": "^1.4.1",
"@typescript-eslint/parser": "^4.6.1",
"babel-loader": "^8.0.0",
"babel-plugin-async-import": "^2.0.2",
"babel-plugin-istanbul": "^6.0.0",
"base-64": "^0.1.0",
"brace": "0.10.0",
"concurrently": "^4.1.0",
"css-loader": "3.0.0",
"css-minimizer-webpack-plugin": "^3.4.1",
"d3": "^5.16.0",
"es-check": "^6.0.0",
"eslint": "^7.13.0",
"eslint-loader": "^2.1.2",
"@babel/core": "^7.22.10",
"@babel/eslint-parser": "^7.22.10",
"@babel/plugin-proposal-class-properties": "^7.18.6",
"@babel/plugin-proposal-decorators": "^7.22.10",
"@babel/plugin-proposal-do-expressions": "^7.22.5",
"@babel/plugin-proposal-export-default-from": "^7.22.5",
"@babel/plugin-proposal-export-namespace-from": "^7.18.9",
"@babel/plugin-proposal-function-bind": "^7.22.5",
"@babel/plugin-proposal-function-sent": "^7.22.5",
"@babel/plugin-proposal-json-strings": "^7.18.6",
"@babel/plugin-proposal-logical-assignment-operators": "^7.20.7",
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6",
"@babel/plugin-proposal-numeric-separator": "^7.18.6",
"@babel/plugin-proposal-optional-chaining": "^7.21.0",
"@babel/plugin-proposal-pipeline-operator": "^7.22.5",
"@babel/plugin-proposal-throw-expressions": "^7.22.5",
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
"@babel/plugin-syntax-import-meta": "^7.10.4",
"@babel/plugin-transform-async-to-generator": "^7.22.5",
"@babel/plugin-transform-runtime": "^7.22.10",
"@babel/preset-env": "^7.22.10",
"@babel/runtime": "^7.22.10",
"@commitlint/cli": "^17.7.1",
"@commitlint/config-conventional": "^17.7.0",
"@types/d3-selection": "^3.0.5",
"@typescript-eslint/parser": "^6.4.0",
"babel-loader": "^9.1.3",
"babel-plugin-async-import": "^2.1.0",
"babel-plugin-istanbul": "^6.1.1",
"base-64": "^1.0.0",
"brace": "0.11.1",
"concurrently": "^8.2.0",
"css-loader": "6.8.1",
"css-minimizer-webpack-plugin": "^5.0.1",
"d3": "^7.8.5",
"es-check": "^7.1.1",
"eslint": "^8.47.0",
"eslint-loader": "^4.0.2",
"extract-loader": "^5.1.0",
"file-loader": "^6.2.0",
"grunt": "1.0.4",
"grunt-babel": "6.0.0",
"grunt": "1.6.1",
"grunt-babel": "8.0.0",
"grunt-contrib-watch": "1.1.0",
"grunt-jsdoc": "2.4.0",
"grunt-karma": "2.0.0",
"grunt-release": "git://github.com/beevelop/grunt-release",
"grunt-jsdoc": "2.4.1",
"grunt-karma": "4.0.2",
"grunt-release": "0.14.0",
"grunt-reload": "^0.2.0",
"grunt-sass": "3.0.2",
"grunt-sync": "0.8.0",
"husky": "^7.0.0",
"grunt-sass": "3.1.0",
"grunt-sync": "0.8.2",
"husky": "^8.0.3",
"ink-docstrap": "1.3.2",
"istanbul-instrumenter-loader": "3.0.1",
"jasmine-core": "3.7.1",
"jasmine-core": "5.1.0",
"jasmine-jquery": "2.1.1",
"jquery": "3.5.0",
"jsdoc": "3.6.1",
"karma": "6.3.2",
"karma-babel-preprocessor": "8.0.1",
"karma-chrome-launcher": "3.1.0",
"karma-coverage": "2.0.3",
"karma-jasmine": "4.0.1",
"karma-sourcemap-loader": "^0.3.8",
"karma-webpack": "4.0.2",
"lint-staged": ">=10",
"load-grunt-tasks": "5.0.0",
"moment": "2.24.0",
"node-gyp": "8.4.1",
"node-sass": "6.0.1",
"jquery": "3.7.0",
"jsdoc": "4.0.2",
"karma": "6.4.2",
"karma-babel-preprocessor": "8.0.2",
"karma-chrome-launcher": "3.2.0",
"karma-coverage": "2.2.1",
"karma-jasmine": "5.1.0",
"karma-sourcemap-loader": "^0.4.0",
"karma-webpack": "5.0.0",
"lint-staged": ">=14",
"load-grunt-tasks": "5.1.0",
"moment": "2.29.4",
"node-gyp": "9.4.0",
"node-sass": "9.0.0",
"optimize-css-assets-webpack-plugin": "^6.0.1",
"phantomjs-polyfill-find": "ptim/phantomjs-polyfill-find",
"prettier": "^2.0.5",
"prismjs": "1.21.0",
"pubsub-js": "1.7.0",
"rimraf": "^2.6.3",
"sanitize-html": "1.20.1",
"sass-loader": "6.0.6",
"shelljs": "0.7.8",
"style-loader": "0.23.1",
"stylelint": "^13.6.0",
"stylelint-config-sass-guidelines": "^7.0.0",
"stylelint-config-standard": "^20.0.0",
"stylelint-scss": "^3.17.2",
"typescript": "^3.9.2",
"underscore": "1.9.1",
"webpack": "4.46.0",
"webpack-bundle-analyzer": "3.3.2",
"webpack-cli": "^3.3.5",
"webpack-dev-server": "3.7.2",
"webpack-fix-style-only-entries": "^0.6.1",
"webpack-merge": "4.2.1",
"yargs": "8.0.2"
"prettier": "^3.0.2",
"prismjs": "1.29.0",
"pubsub-js": "1.9.4",
"rimraf": "^5.0.1",
"sanitize-html": "2.11.0",
"sass-loader": "13.3.2",
"shelljs": "0.8.5",
"style-loader": "3.3.3",
"stylelint": "^15.10.2",
"stylelint-config-sass-guidelines": "^10.0.0",
"stylelint-config-standard": "^34.0.0",
"stylelint-scss": "^5.1.0",
"typescript": "^5.1.6",
"underscore": "1.13.6",
"webpack": "5.88.2",
"webpack-bundle-analyzer": "4.9.0",
"webpack-cli": "^5.1.4",
"webpack-dev-server": "4.15.1",
"webpack-merge": "5.9.0",
"webpack-remove-empty-scripts": "^1.0.3",
"yargs": "17.7.2"
},
"lint-staged": {
"*.js": [
Expand Down
21 changes: 10 additions & 11 deletions sandbox/sandbox.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ const { dataEditor, configEditor } = editorHelpers({
const charts = Object.keys(defaultConfig);
const tooltipTypes = Object.keys(tooltipConfigs).reduce(
(m, i) => ({ ...m, [i]: i }),
{}
{},
);

const state = {
Expand Down Expand Up @@ -102,7 +102,7 @@ function setInitialData() {
function setHandlers() {
d3.select(`.${chartSelectorClass}`).on(
'change',
_handleChartSelectorChange
_handleChartSelectorChange,
);
d3.select(`.${dataSelectorClass}`).on('change', _handleDataSelectorChange);

Expand All @@ -112,13 +112,11 @@ function setHandlers() {
d3.select(`.${configSubmitButtonClass}`).on('click', _handleConfigUpdate);
d3.select(`.${configResetButtonClass}`).on('click', _handleConfigReset);

d3.select(`.${configAddTooltipClass}`).on(
'click',
_handleAddTooltip.bind(null, tooltipTypes.basic)
d3.select(`.${configAddTooltipClass}`).on('click', () =>
_handleAddTooltip(tooltipTypes.basic),
);
d3.select(`.${configAddMiniTooltipClass}`).on(
'click',
_handleAddTooltip.bind(null, tooltipTypes.mini)
d3.select(`.${configAddMiniTooltipClass}`).on('click', () =>
_handleAddTooltip(tooltipTypes.mini),
);
}

Expand Down Expand Up @@ -160,7 +158,7 @@ function setChartSelectorType() {
function setNewChart(
chartData = getCurrentData(),
chartInitString = getCurrentConfig(),
chartType = getCurrentType()
chartType = getCurrentType(),
) {
domHelpers.removeBriteChartContainer();
domHelpers.addBritechartContainer();
Expand All @@ -177,12 +175,13 @@ function setNewChart(
try {
eval(chartInitString);
} catch (e) {
// eslint-disable-next-line no-console
console.error(e);
}

d3.select(`.${britechartContainerClass}`).datum(chartData).call(chart);
d3.select(
`.${britechartContainerClass} ${constants.chartConfigs[chartType].tooltipSelector}`
`.${britechartContainerClass} ${constants.chartConfigs[chartType].tooltipSelector}`,
)
.datum([])
.call(tip);
Expand Down Expand Up @@ -303,7 +302,7 @@ function _handleDataUpdate() {
freshData = evalDataString(rawData);
} catch (e) {
errors.push(
new Error('Could not parse the data from the input field', rawData)
new Error('Could not parse the data from the input field', rawData),
);
}

Expand Down

0 comments on commit ba6cd8b

Please sign in to comment.