Core components for webviz config
Project description
Webviz core components
webviz_core_components
is a Dash component library for use in webviz
.
You can quickly get started with:
- Run
pip install webviz-core-components
- Run
python usage.py
- Visit http://localhost:8050 in your web browser
:warning: The components here are used by
webviz-config
. In order to facilitate a strong CSP configuration, this package has a side effect of changing the Plotly distribution coming withdash-core-components
to one that do not rely oneval()
. More specifically it changes fromplotly-full
toplotly-cartesian
bundle. This will be necessary in order to enforce a strong CSP configuration as long as thisplotly
issue and thisdash-core-components
issue both are open. Note that this side-effect only takes place ifdash-core-components
is installed, which is a requirement if theGraph
component from this repository is going to be used.
Contributing
This project was generated by the dash-component-boilerplate. It contains the minimal set of code required to create a custom Dash component.
Install dependencies
If you have selected install_dependencies during the prompt, you can skip this part.
-
Install npm packages
npm install
-
Create a virtual env and activate.
virtualenv venv . venv/bin/activate
Note: venv\Scripts\activate for windows
-
Install python packages required to build components.
pip install .[dependencies] pip install dash[dev]
-
Install the python packages for testing (optional)
pip install .[tests] pip install dash[testing]
The second of these commands appears to be necessary as long as this
pip
issue is open.
Write component code in src/lib/components/<component_name>.react.js
-
The demo app is in
src/demo
and you will import your example component code into your demo app. -
Test your code in a Python environment:
- Build your code
npm run build
- Run and modify the
usage.py
sample dash app:python usage.py
- Build your code
-
Write tests for your component.
-
A sample test is available in
tests/test_usage.py
, it will loadusage.py
and you can then automate interactions with selenium. -
Run the tests with
pytest tests
. -
The Dash team uses these types of integration tests extensively. Browse the Dash component code on GitHub for more examples of testing (e.g. dash-core-components).
-
-
Add custom styles to your component by putting your custom CSS files into your distribution folder (
webviz_subsurface_components
).-
Make sure that they are referenced in
MANIFEST.in
so that they get properly included when you're ready to publish your component. -
Make sure the stylesheets are added to the
_css_dist
dict inwebviz_core_components/__init__.py
so dash will serve them automatically when the component suite is requested.
-
Build code and install
- Build your code:
npm run build
- Install the Python package:
pip install -e .
Project details
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Hashes for webviz_core_components-0.0.9.tar.gz
Algorithm | Hash digest | |
---|---|---|
SHA256 | dcd765942f10fb8fe4b9665f14a1e145270c0bc7496df9d4a3398ecdf6f7eafc |
|
MD5 | 5e915e1698848f84af97d86a1cdbb40a |
|
BLAKE2b-256 | 719d2a6845d89af835316d8ba5b472e1e538f1a276ba39723a509607a9ea860d |