plotly · Marc-Andre-Rivet · Nov 19, 2019 · Oct 24, 2019 · Nov 5, 2019 · Nov 5, 2019
diff --git a/.babelrc b/.babelrc
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -1,7 +1,7 @@
 version: 2
 
 jobs:
-    'python-3.6': 
+    'python-3.6':
         docker:
             - image: circleci/python:3.6-stretch-node-browsers
               environment:
@@ -52,13 +52,13 @@ jobs:
                   command: |
                       . venv/bin/activate
                       pytest dash_canvas
-            
+
             - run:
                   name: Run usage tests
                   command: |
                       . venv/bin/activate
                       pip install -r tests/requirements.txt
-                      pytest tests --webdriver Chrome
+                      pytest tests
 
 
 

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -0,0 +1,7 @@
+# Change Log for dash-canvas
+All notable changes to this project will be documented in this file.
+This project adheres to [Semantic Versioning](http://semver.org/).
+
+## [0.1.0] - 2019-11-05
+### Added
+- [#29](https://github.com/plotly/dash-canvas/pull/29) Async canvas component
diff --git a/MANIFEST.in b/MANIFEST.in
@@ -1,5 +1,6 @@
 include dash_canvas/dash_canvas.min.js
 include dash_canvas/dash_canvas.dev.js
+include dash_canvas/async~*.js
 include dash_canvas/metadata.json
 include dash_canvas/package.json
 include README.md
diff --git a/babel.config.js b/babel.config.js
@@ -0,0 +1,9 @@
+module.exports = {
+  presets: [
+    '@babel/env',
+    '@babel/react'
+  ],
+  plugins: [
+    '@babel/plugin-syntax-dynamic-import'
+  ]
+};
diff --git a/dash_canvas/DashCanvas.py b/dash_canvas/DashCanvas.py
@@ -10,36 +10,33 @@ class DashCanvas(Component):
 
 Keyword arguments:
 - id (string; optional): The ID used to identify this component in Dash callbacks
-- image_content (string; optional): Image data string, formatted as png or jpg data string. Can be
+- image_content (string; default ''): Image data string, formatted as png or jpg data string. Can be
 generated by utils.io_utils.array_to_data_string.
-- zoom (number; optional): Zoom factor
-- width (number; optional): Width of the canvas
-- height (number; optional): Height of the canvas
-- scale (number; optional): Scaling ratio between canvas width and image width
-- tool (string; optional): Selection of drawing tool, among ["pencil", "pan", "circle",
+- zoom (number; default 1): Zoom factor
+- width (number; default 500): Width of the canvas
+- height (number; default 500): Height of the canvas
+- scale (number; default 1): Scaling ratio between canvas width and image width
+- tool (string; default "pencil"): Selection of drawing tool, among ["pencil", "pan", "circle",
 "rectangle", "select", "line"].
-- lineWidth (number; optional): Width of drawing line (in pencil mode)
-- lineColor (string; optional): Color of drawing line (in pencil mode). Can be a text string,
+- lineWidth (number; default 10): Width of drawing line (in pencil mode)
+- lineColor (string; default 'red'): Color of drawing line (in pencil mode). Can be a text string,
 like 'yellow', 'red', or a color triplet like 'rgb(255, 0, 0)'.
 Alpha is possible with 'rgba(255, 0, 0, 0.5)'.
-- goButtonTitle (string; optional): Title of button
-- filename (string; optional): Name of image file to load (URL string)
-- trigger (number; optional): Counter of how many times the save button was pressed
+- goButtonTitle (string; default 'Save'): Title of button
+- filename (string; default ''): Name of image file to load (URL string)
+- trigger (number; default 0): Counter of how many times the save button was pressed
 (to be used mostly as input)
-- json_data (string; optional): Sketch content as JSON string, containing background image and
+- json_data (string; default ''): Sketch content as JSON string, containing background image and
 annotations. Use utils.parse_json.parse_jsonstring to parse
 this string.
-- hide_buttons (list; optional): Names of buttons to hide. Names are "zoom", "pan", "line", "pencil",
-"rectangle", "undo", "select".
-
-Available events: """
+- hide_buttons (list of strings; optional): Names of buttons to hide. Names are "zoom", "pan", "line", "pencil",
+"rectangle", "undo", "select"."""
     @_explicitize_args
     def __init__(self, id=Component.UNDEFINED, image_content=Component.UNDEFINED, zoom=Component.UNDEFINED, width=Component.UNDEFINED, height=Component.UNDEFINED, scale=Component.UNDEFINED, tool=Component.UNDEFINED, lineWidth=Component.UNDEFINED, lineColor=Component.UNDEFINED, goButtonTitle=Component.UNDEFINED, filename=Component.UNDEFINED, trigger=Component.UNDEFINED, json_data=Component.UNDEFINED, hide_buttons=Component.UNDEFINED, **kwargs):
         self._prop_names = ['id', 'image_content', 'zoom', 'width', 'height', 'scale', 'tool', 'lineWidth', 'lineColor', 'goButtonTitle', 'filename', 'trigger', 'json_data', 'hide_buttons']
         self._type = 'DashCanvas'
         self._namespace = 'dash_canvas'
         self._valid_wildcard_attributes =            []
-        self.available_events = []
         self.available_properties = ['id', 'image_content', 'zoom', 'width', 'height', 'scale', 'tool', 'lineWidth', 'lineColor', 'goButtonTitle', 'filename', 'trigger', 'json_data', 'hide_buttons']
         self.available_wildcard_properties =            []
 
@@ -53,26 +50,3 @@ def __init__(self, id=Component.UNDEFINED, image_content=Component.UNDEFINED, zo
                 raise TypeError(
                     'Required argument `' + k + '` was not specified.')
         super(DashCanvas, self).__init__(**args)
-
-    def __repr__(self):
-        if(any(getattr(self, c, None) is not None
-               for c in self._prop_names
-               if c is not self._prop_names[0])
-           or any(getattr(self, c, None) is not None
-                  for c in self.__dict__.keys()
-                  if any(c.startswith(wc_attr)
-                  for wc_attr in self._valid_wildcard_attributes))):
-            props_string = ', '.join([c+'='+repr(getattr(self, c, None))
-                                      for c in self._prop_names
-                                      if getattr(self, c, None) is not None])
-            wilds_string = ', '.join([c+'='+repr(getattr(self, c, None))
-                                      for c in self.__dict__.keys()
-                                      if any([c.startswith(wc_attr)
-                                      for wc_attr in
-                                      self._valid_wildcard_attributes])])
-            return ('DashCanvas(' + props_string +
-                   (', ' + wilds_string if wilds_string != '' else '') + ')')
-        else:
-            return (
-                'DashCanvas(' +
-                repr(getattr(self, self._prop_names[0], None)) + ')')
diff --git a/dash_canvas/__init__.py b/dash_canvas/__init__.py
@@ -28,14 +28,39 @@
 
 _this_module = _sys.modules[__name__]
 
+async_resources = [
+    'canvas'
+]
+
+_js_dist = []
+
+_js_dist.extend([{
+        'relative_package_path': 'async~{}.js'.format(async_resource),
+        'external_url': (
+            'https://unpkg.com/dash-canvas@{}'
+            '/dash_canvas/async~{}.js'
+        ).format(__version__, async_resource),
+        'namespace': 'dash_canvas',
+        'async': True
+    } for async_resource in async_resources])
 
-_js_dist = [
+_js_dist.extend([{
+        'relative_package_path': 'async~{}.js.map'.format(async_resource),
+        'external_url': (
+            'https://unpkg.com/dash-canvas@{}'
+            '/dash_canvas/async~{}.js.map'
+        ).format(__version__, async_resource),
+        'namespace': 'dash_canvas',
+        'dynamic': True
+    } for async_resource in async_resources])
+
+_js_dist.extend([
     {
         'relative_package_path': 'dash_canvas.min.js',
         'dev_package_path': 'dash_canvas.dev.js',
         'namespace': package_name
     }
-]
+])
 
 _css_dist = []
 

diff --git a/dash_canvas/async~canvas.dev.js b/dash_canvas/async~canvas.dev.js
diff --git a/dash_canvas/async~canvas.js b/dash_canvas/async~canvas.js
diff --git a/dash_canvas/dash_canvas.dev.js b/dash_canvas/dash_canvas.dev.js
diff --git a/dash_canvas/dash_canvas.min.js b/dash_canvas/dash_canvas.min.js
diff --git a/dash_canvas/metadata.json b/dash_canvas/metadata.json
@@ -2,90 +2,7 @@
   "src/lib/components/DashCanvas.react.js": {
     "description": "Canvas component for drawing on a background image and selecting\nregions.",
     "displayName": "DashCanvas",
-    "methods": [
-      {
-        "name": "_save",
-        "docblock": null,
-        "modifiers": [],
-        "params": [],
-        "returns": null
-      },
-      {
-        "name": "_undo",
-        "docblock": null,
-        "modifiers": [],
-        "params": [],
-        "returns": null
-      },
-      {
-        "name": "_redo",
-        "docblock": null,
-        "modifiers": [],
-        "params": [],
-        "returns": null
-      },
-      {
-        "name": "_zoom_factor",
-        "docblock": null,
-        "modifiers": [],
-        "params": [
-          {
-            "name": "factor",
-            "type": null
-          }
-        ],
-        "returns": null
-      },
-      {
-        "name": "_zoom",
-        "docblock": null,
-        "modifiers": [],
-        "params": [],
-        "returns": null
-      },
-      {
-        "name": "_unzoom",
-        "docblock": null,
-        "modifiers": [],
-        "params": [],
-        "returns": null
-      },
-      {
-        "name": "_pantool",
-        "docblock": null,
-        "modifiers": [],
-        "params": [],
-        "returns": null
-      },
-      {
-        "name": "_penciltool",
-        "docblock": null,
-        "modifiers": [],
-        "params": [],
-        "returns": null
-      },
-      {
-        "name": "_linetool",
-        "docblock": null,
-        "modifiers": [],
-        "params": [],
-        "returns": null
-      },
-      {
-        "name": "_rectangletool",
-        "docblock": null,
-        "modifiers": [],
-        "params": [],
-        "returns": null
-      },
-      {
-        "name": "_selecttool",
-        "docblock": null,
-        "modifiers": [],
-        "params": [],
-        "returns": null
-      }
-    ],
+    "methods": [],
     "props": {
       "id": {
         "type": {

diff --git a/dash_canvas/package.json b/dash_canvas/package.json
@@ -1,13 +1,13 @@
 {
     "name": "dash_canvas",
-    "version": "0.0.11",
+    "version": "0.1.0",
     "description": "Sketching pad for dash based on react-sketch",
     "repository": {
-      "type": "git",
-      "url": "[email protected]:plotly/dash-canvas.git"
+        "type": "git",
+        "url": "[email protected]:plotly/dash-canvas.git"
     },
     "bugs": {
-      "url": "https://github.com/plotly/dash-canvas/issues"
+        "url": "https://github.com/plotly/dash-canvas/issues"
     },
     "homepage": "https://github.com/plotly/dash-canvas",
     "main": "build/index.js",
@@ -18,7 +18,7 @@
         "build:js-dev": "webpack --mode development",
         "build:js": "webpack --mode production",
         "build:py": "node ./extract-meta.js src/lib/components > dash_canvas/metadata.json && copyfiles package.json dash_canvas && venv/bin/python -c \"import dash; dash.development.component_loader.generate_classes('dash_canvas', 'dash_canvas/metadata.json')\"",
-        "build:all": "npm run build:js & npm run build:js-dev & npm run build:py"
+        "build:all": "npm run build:js && npm run build:js-dev && npm run build:py"
     },
     "author": "Emmanuelle Gouillart <[email protected]>",
     "license": "MIT",
@@ -32,9 +32,15 @@
         "plotly-icons": ">=1.0"
     },
     "devDependencies": {
-        "babel-core": "^6.26.3",
+        "@babel/cli": "^7.6.2",
+        "@babel/core": "^7.6.2",
+        "@babel/plugin-syntax-dynamic-import": "^7.2.0",
+        "@babel/polyfill": "^7.6.0",
+        "@babel/preset-env": "^7.6.2",
+        "@babel/preset-react": "^7.0.0",
+        "@plotly/webpack-dash-dynamic-import": "^1.1.2",
         "babel-eslint": "^8.2.3",
-        "babel-loader": "^7.1.4",
+        "babel-loader": "^8.0.6",
         "copyfiles": "^2.0.0",
         "babel-preset-env": "^1.7.0",
         "babel-preset-react": "^6.24.1",
@@ -45,11 +51,11 @@
         "eslint-plugin-react": "^7.9.1",
         "npm": "^6.1.0",
         "flexboxgrid": "^6.3.1",
-        "react-docgen": "^2.20.1",
+        "react-docgen": "^4.1.1",
         "react-dropzone": "4.2.7",
         "style-loader": "^0.21.0",
-        "webpack": "^4.20.2",
-        "webpack-cli": "^3.1.1",
+        "webpack": "^4.41.0",
+        "webpack-cli": "^3.3.9",
         "webpack-serve": "^1.0.2"
     },
     "peerDependencies": {
@@ -60,4 +66,4 @@
         "node": ">=8.11.0",
         "npm": ">=6.1.0"
     }
-}
+}