Dash-charlotte

... text_format = '{:.2%}'.format,
... text_className = 'red',
... cell_className = 'bg-shade1'
... )


python
>>> col = TableDropdownCol(
... id = ['id_1', 'id_2', 'id_n'],
... header = 'Button Column,
... header_style = {'background-color': 'cyan'},
... cell_className = 'bg-shade1',
... input_type = 'number',
... input_min = 0,
... input_max = 9,
... input_step = 1,
... input_value = [2,3,4]
... )

Table Improvements

Changed

- The `id` argument of `TableColumn` and its subclasses is now required.

Added

- Every original argument of the Dash components can be passed through kwargs. See examples below;
- New docstrings with examples to every table column subclass;
- A loading wrapper for each cell. Turn them on with `loading=True` column argument;
- `__repr__` and `__str__` methods to table columns.

Examples

python
>>> col = TableButtonCol(
... id = ['id_1', 'id_2', 'id_n'],
... header = 'Button Column,
... text = 'Default Text',
... icon = 'fas fa-exclamation-triangle',
... header_style = {'background-color': 'cyan'},
... button_size = 'sm',
... cell_className = 'bg-shade1'
... )


python
>>> col = TableDropdownCol(
... id = ['id_1', 'id_2', 'id_n'],
... header = 'Button Column,
... header_style = {'background-color': 'cyan'},
... cell_className = 'bg-shade1',
... dropdown_value = [True, False, True],
... dropdown_options = [
... {'label': 'Yes', 'value': True},
... {'label': 'No', 'value': False}
... ],
... dropdown_clearable = False
... )


python
>>> col = TableDropdownCol(
... id = ['id_1', 'id_2', 'id_n'],
... header = 'Button Column,
... header_style = {'background-color': 'cyan'},

The Button Update

Added

- Two types of Buttons:

For now, it is necessary to add `themes.BUTTONS` to the Dash's `external_stylesheets`.
This will probably be expanded in the next updates.

python
from dash import Dash
from dash_charlotte import themes
from dash_charlotte.components import Button

app = Dash(
name = __name__,
external_stylesheets = [
themes.CHARLOTTE_DARK,
themes.BUTTONS
]
)

Show a arrow character on hover
button1 = Button(
children = 'Arrow Button',
type = 'arrow',
color = 'green',
className = 'me-2'
)

Increase shadow on click
button2 = Button(
children = 'Shadow Button',
type = 'shadow',
color = 'red'
)



- New argument `row_id` for `components.Table`.

This iterable argument adds a id for each row of the table.

- New argument `input_step` for `components.TableInputCol`.

Adds a step argument for numeric input columns.


python
from dash_charlotte.components import Table, TableInputCol

tb_col = TableInputCol(
header = 'Number Input',
input_type = 'number',
input_min = 0,
input_max = 100,
input_step = 10
)

tb = Table(
columns = [tb_col],
row_id = df.col1.apply(lambda x: {'row_id': 1})
)


Fixed

- A circular import error of the version 0.2.x

Removed

- Removed `dash-labs` dependency

Fixed

- Small mistake causing an error on Github Actions

Added

- New `children` attribute to `components.Navbar`.

python
from dash_charlotte.components import Navbar

nav = Navbar(
title = 'Title',
children = content,
id = 'my-navbar'
)


Changed

- New ids for `Navbar` callbacks.

python
callback(
Output('my-navbar--title', 'children'),
Output('my-navbar--children', 'children'),
...


- Improved components type hinting;
- Removed Bootstrap dependency from `components.Footer`.

This is the changelog of version 0.2.2, aka **The Table Update**.

`dash_charlotte.components.Table`

Create a `Table` instance to serve as a wrapper for the table columns.

These table columns are subclasses of the `TableColumn` object.

- `TableButtonCol`
- `TableCheckBoxCol`
- `TableDropdownCol`
- `TableInputCol`
- `TableTextCol`

Each of these `TableColumn` objects is a type of column to be added to the `Table` parent component.

python
col1 = TableDropdownCol(
header = 'Dropdown',
cell_style = {'padding': 5},
dropdown_id = dropdown_data,
dropdown_placeholder = 'Select...',
dropdown_options = [
{'label': 'Yes', 'value': 1},
{'label': 'No', 'value': 0}
]
)

col2 = TableTextCol(
header = 'Style Format',
text = text_data,
text_formatting = format_callable
)

col3 = TableInputCol(
header = 'Number Input',
cell_style = {'padding': 5},
input_id = input_ids,
input_value = input_values,
input_type = 'number',
input_min = 0,
input_max = 9
)

col4 = TableTextCol(
header = 'String Format',
text = number_data,
text_formatting = '$ {:,.2f}'.format
)

col5 = TableButtonCol(
header = 'Button',
cell_style = {'text-align': 'center'},
button_icon = 'fas fa-exclamation-triangle',
button_text = button_text,
button_id = button_ids
)

table = Table(
columns = [col1, col2, col3, col4, col5],
bordered = True,
dark = False,
hover = True,
responsive = True,
striped = True,
className = 'mb-0'
)


Check the [example app](https://github.com/GusFurtado/dash-charlotte-live-demo/blob/main/pages/table.py) or the [live demo](https://dash-charlotte.herokuapp.com/table)

Small changes

- `Drawer` hides itself on small screens
- Add `dcc.Location` default attribute to `LoginForm`
- Change icon package dependencies of `Navbar`

General Dev Stuff

- Add new CDN links to minified CSS theme files.
- Autoupload to PyPI with GitHub Actions