Python code editor with syntax highlighting in Plotly Dash!
dash-editor-components relies on react simple code editor and prismJS.
You can install dash-editor-components with pip
:
pip install dash-editor-components
dash-editor-components was created by Quantee, a company providing statistical and data science solutions in the insurance sector. In one of the apps that we provide for our insurance clients, we have created a module to tweak existing machine learning models by editing Python code. This is a by-product of this project and we share it with the community!
Just include PythonEditor component in your app and you are ready to go!
import dash_editor_components
import dash
import dash_html_components as html
app = dash.Dash(__name__)
app.layout = html.Div([
dash_editor_components.PythonEditor(
id='input'
)
])
if __name__ == '__main__':
app.run_server(debug=True)
- How can I change the font size?
Just include style={'fontSize': your_value}
property, where your_value
is for example '16px'.
- Is it possible to use other prism themes?
dash-editor-components comes with preloaded css for styling, however you can change container__editor and token css with your own stylesheet.
- How to access current code in PythonEditor in Dash callback?
Just write Dash callback with Input(your_id, 'value')
or State(your_id, 'value')
, where your_id
is ID of PythonEditor component.
This project was generated by the dash-component-boilerplate it contains the minimal set of code required to create your own custom Dash component.