diff --git a/CHANGELOG.md b/CHANGELOG.md index 7535790b3..4ea319b34 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,11 @@ All notable changes to this project will be documented in this file. This project adheres to [Semantic Versioning](http://semver.org/). +## [0.7.1] - 2017-07-24 +### Fixed +- Clearing a Graph selection box sets the `selectedData` value to `None` (`null` in JavaScript). Before, it didn't change the `selectedData` property, preventing the user and the Dash developer from clearing selections. Fixes https://github.com/plotly/dash/issues/97, thanks to @pmbaumgartner for reporting. + + ## [0.7.0] - 2017-07-20 ### Added - The `clearable` property to the `Dropdown`, which toggles on and off the "x" on the side of the dropdown that clears the current selection. diff --git a/dash_core_components/version.py b/dash_core_components/version.py index a71c5c7f1..f0788a87a 100644 --- a/dash_core_components/version.py +++ b/dash_core_components/version.py @@ -1 +1 @@ -__version__ = '0.7.0' +__version__ = '0.7.1' diff --git a/package.json b/package.json index 401d31534..179324968 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "dash-core-components", - "version": "0.7.0", + "version": "0.7.1", "description": "Core component suite for Dash", "repository": { "type": "git", diff --git a/src/components/Graph.react.js b/src/components/Graph.react.js index 4ecd3197e..130c0f8d8 100644 --- a/src/components/Graph.react.js +++ b/src/components/Graph.react.js @@ -1,5 +1,5 @@ import React, {Component, PropTypes} from 'react'; -import {contains, filter, has, type} from 'ramda'; +import {contains, filter, has, isNil, type} from 'ramda'; /* global Plotly:true */ const filterEventData = (gd, eventData, event) => { @@ -7,6 +7,10 @@ const filterEventData = (gd, eventData, event) => { if (contains(event, ['click', 'hover', 'selected'])) { const points = []; + if (isNil(eventData)) { + return null; + } + /* * remove `data`, `layout`, `xaxis`, etc * objects from the event data since they're so big @@ -80,23 +84,35 @@ export default class PlotlyGraph extends Component { gd.on('plotly_click', (eventData) => { const clickData = filterEventData(gd, eventData, 'click'); - if (setProps) setProps({clickData}); - if (fireEvent) fireEvent({event: 'click'}); + if (!isNil(clickData)) { + if (setProps) setProps({clickData}); + if (fireEvent) fireEvent({event: 'click'}); + } }); gd.on('plotly_hover', (eventData) => { const hoverData = filterEventData(gd, eventData, 'hover'); - if (setProps) setProps({hoverData}); - if (fireEvent) fireEvent({event: 'hover'}) + if (!isNil(hoverData)) { + if (setProps) setProps({hoverData}); + if (fireEvent) fireEvent({event: 'hover'}) + } }); gd.on('plotly_selected', (eventData) => { const selectedData = filterEventData(gd, eventData, 'selected'); - if (setProps) setProps({selectedData}); + if (!isNil(selectedData)) { + if (setProps) setProps({selectedData}); + if (fireEvent) fireEvent({event: 'selected'}); + } + }); + gd.on('plotly_deselect', () => { + if (setProps) setProps({selectedData: null}); if (fireEvent) fireEvent({event: 'selected'}); }); gd.on('plotly_relayout', (eventData) => { const relayoutData = filterEventData(gd, eventData, 'relayout'); - if (setProps) setProps({relayoutData}); - if (fireEvent) fireEvent({event: 'relayout'}); + if (!isNil(relayoutData)) { + if (setProps) setProps({relayoutData}); + if (fireEvent) fireEvent({event: 'relayout'}); + } }); gd.on('plotly_unhover', () => { if (clear_on_unhover) {