Skip to content

Commit 0a25b03

Browse files
authored
Release 1.0.0 (#734)
* Release 1.0.0 * Update changelog * remove references to Bootstrap 4 * rerun CI
1 parent 50f651a commit 0a25b03

File tree

13 files changed

+41
-32
lines changed

13 files changed

+41
-32
lines changed

dash_bootstrap_components/_version.py

+1-1
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
__version__ = "1.0.0-dev"
1+
__version__ = "1.0.0"

docs/components_page/components/button.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ lead: Documentation and examples for Bootstrap's button styles with _dash-bootst
55

66
## Examples
77

8-
Bootstrap includes several predefined button styles based on the predefined contextual colors. Chooose between them using the `color` argument.
8+
Bootstrap includes several predefined button styles based on the predefined contextual colors. Choose between them using the `color` argument.
99

1010
{{example:components/button/simple.py:buttons}}
1111

docs/components_page/components/card.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -57,13 +57,13 @@ As mentioned previously, cards assume no specific width, so they will expand to
5757

5858
### Using grid components
5959

60-
Wrap cards in `Row` and `Col` components to control their width and layout. In this example we use the `width` argument of `Col` to make the first card take up a third of the available width, and the second card two thirds. See the [layout documentation](/l/components/layout) for more details on `Row` and `Col`.
60+
Wrap cards in `Row` and `Col` components to control their width and layout. In this example we use the `width` argument of `Col` to make the first card take up a third of the available width, and the second card two thirds. See the [layout documentation](/docs/components/layout) for more details on `Row` and `Col`.
6161

6262
{{example:components/card/sizing/grid.py:cards}}
6363

6464
### Using Bootstrap utility classes
6565

66-
Bootstrap comes with several CSS utility classes built in, including some for sizing. For example, the class `w-50` sets `width:50%`. We can can apply these classes to quickly set the desired width of the cards. See the [Bootstrap documentation](https://getbootstrap.com/docs/4.3/utilities/sizing/) for more details.
66+
Bootstrap comes with several CSS utility classes built in, including some for sizing. For example, the class `w-50` sets `width:50%`. We can can apply these classes to quickly set the desired width of the cards. See the [Bootstrap documentation](https://getbootstrap.com/docs/5.0/utilities/sizing/) for more details.
6767

6868
{{example:components/card/sizing/utility.py:cards}}
6969

docs/components_page/components/form.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ When building Dash apps we rarely make use of HTML forms, instead attaching call
77

88
## Examples
99

10-
The `FormGroup` is the easiest way to add structure to forms. It encourages proper grouping of labels, controls, optional help text, and form validation messaging. See this simple example.
10+
Bootstrap's form components can be used to group labels, controls, optional help text, and form validation messaging. See this simple example.
1111

1212
{{example:components/form/simple.py:form}}
1313

@@ -47,7 +47,7 @@ The `FormFeedback` component should be added to a `html.Div` containing the `Inp
4747

4848
## Dash Core Components
4949

50-
The `Form` and `FormGroup` components can also be used with _dash-core-components_.
50+
`Form` and other components can also be used with _dash-core-components_.
5151

5252
{{example:components/form/dash_core.py:form}}
5353

docs/components_page/components/index.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,4 +24,4 @@ For example, a simple application incorporating example above could look like th
2424

2525
There is more detail on this in the [Quickstart](/docs/quickstart/) instructions for creating a basic app. Additionally, the [examples](https://github.com/facultyai/dash-bootstrap-components/tree/main/examples) in our GitHub repository demonstrate how multiple components can be combined to create a feature rich application.
2626

27-
For more details on Dash in general, please refer to the official Dash documentation for [Python](https://dash.plotly.com/), [R](https://dashr.plotly.com/), or [Julia](https://dash-julia.plotly.com/).
27+
For more details on Dash in general, please refer to the official Dash documentation for [Python](https://dash.plotly.com/), [R](https://dash.plotly.com/r/), or [Julia](https://dash.plotly.com/julia/).

docs/components_page/components/layout.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ lead: Components for laying out your Dash app, including wrapping containers, an
55

66
## Examples
77

8-
Layout in Bootstrap is controlled using the grid system. The Bootstrap grid has twelve columns, and five responsive tiers (allowing you to specify different behaviours on different screen sizes, see below). The width of your columns can be specified in terms of how many of the twelve grid columns it should span, or you can allow the columns to expand or shrink to fit either their content or the available space in the row.
8+
Layout in Bootstrap is controlled using the grid system. The Bootstrap grid has twelve columns, and six responsive tiers (allowing you to specify different behaviours on different screen sizes, see below). The width of your columns can be specified in terms of how many of the twelve grid columns it should span, or you can allow the columns to expand or shrink to fit either their content or the available space in the row.
99

1010
There are three main layout components in _dash-bootstrap-components_: `Container`, `Row`, and `Col`.
1111

@@ -20,7 +20,7 @@ For best results, make sure you adhere to the following two rules when construct
2020
1. Only use `Row` and `Col` inside a `Container`. A single `Container` wrapping your entire app's content is fine. Set `fluid=True` if you don't want the margins that `Container` adds by default. Since the content of this page is wrapped with a `Container`, the snippets below don't explicitly include them.
2121
2. The immediate children of any `Row` component should always be `Col` components. Your content should go inside the `Col` components.
2222

23-
For much more detail on the Bootstrap grid system, see the [Bootstrap documentation](https://getbootstrap.com/docs/4.2/layout/grid/).
23+
For much more detail on the Bootstrap grid system, see the [Bootstrap documentation](https://getbootstrap.com/docs/5.1/layout/grid/).
2424

2525
## Row with columns
2626

@@ -84,7 +84,7 @@ Sometimes you may wish to use Bootstrap's grid system for specifying the layout
8484

8585
{{code-example:components/layout/grid_only.py}}
8686

87-
Alternatively download `bootstrap-grid.css` from the [Bootstrap website](https://getbootstrap.com/docs/4.2/getting-started/download/) and place it in your app's `assets/` directory. See the [Plotly Dash documentation](https://dash.plot.ly/external-resources) for details.
87+
Alternatively download `bootstrap-grid.css` from the [Bootstrap website](https://getbootstrap.com/docs/5.1/getting-started/download/) and place it in your app's `assets/` directory. See the [Plotly Dash documentation](https://dash.plotly.com/external-resources) for details.
8888

8989
{{apidoc:src/components/layout/Container.js}}
9090

docs/content/changelog.md

+9-3
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,12 @@ title: Changelog
66

77
This page documents notable changes in dash-bootstrap-components releases.
88

9-
## 1.0.0 - 2021/XX/XX
9+
## 1.0.0 - 2021/10/19
1010

11-
v1 of _dash-bootstrap-components_! This release contains loads of new features, but also breaking changes. Please read the changelog carefully for full details.
11+
v1 of _dash-bootstrap-components_! This release contains loads of new features, but also breaking changes. Please read the changelog carefully, and refer to the [migration guide](/migration-guide/) for full details of the changes.
1212

1313
### Added
14-
- Six new components! [Accordion](/docs/components/accordion), [Breadcrumb](/docs/components/breadcrumb), [FormFloating](/docs/components/form), [Offcanvas](/docs/components/offcanvas), [Pagination](/docs/components/pagination), and [Switch](/docs/components/input) ([PR 646](https://github.com/facultyai/dash-bootstrap-components/pull/646)) ([PR 689](https://github.com/facultyai/dash-bootstrap-components/pull/689))
14+
- Seven new components! [Accordion](/docs/components/accordion), [Breadcrumb](/docs/components/breadcrumb), [FormFloating](/docs/components/form), [ModalTitle](/docs/components/modal), [Offcanvas](/docs/components/offcanvas), [Pagination](/docs/components/pagination), and [Switch](/docs/components/input) ([PR 646](https://github.com/facultyai/dash-bootstrap-components/pull/646)) ([PR 689](https://github.com/facultyai/dash-bootstrap-components/pull/689))
1515
- New CDN links for icons from Bootstrap Icons and Font Awesome ([PR 661](https://github.com/facultyai/dash-bootstrap-components/pull/661))
1616
- CDN Links for four new Bootswatch themes: `QUARTZ`, `MORPH`, `VAPOR` and `ZEPHYR`.
1717
- All components now accept `class_name` as an alternative to `className`. If both are specified then `class_name` will take precedence. `class_name` should be preferred from now on. ([PR 642](https://github.com/facultyai/dash-bootstrap-components/pull/642))
@@ -23,6 +23,12 @@ v1 of _dash-bootstrap-components_! This release contains loads of new features,
2323
### Changed
2424
- Components are all now built for Bootstrap 5. CDN links have all been updated. There are multiple breaking changes in the component props. Please see the [migration-guide](/migration-guide) for full details on the changes ([PR 646](https://github.com/facultyai/dash-bootstrap-components/pull/646)).
2525

26+
## 0.13.1 - 2021/9/22
27+
28+
### Fixed
29+
30+
- Fix cursor jump issue in `Input` component. ([PR 707](https://github.com/facultyai/dash-bootstrap-components/pull/707))
31+
2632
## 0.13.0 - 2021/7/31
2733

2834
### Added

docs/content/docs/quickstart.md

+9-5
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ conda install -c conda-forge dash-bootstrap-components
3030
```
3131
-----
3232
R
33-
To get started make sure you have [installed Dash for R](https://dashr.plotly.com/installation). If you didn't already install it in order to install Dash for R, we also need to make sure that the _devtools_ library is installed.
33+
To get started make sure you have [installed Dash for R](https://dash.plotly.com/r/installation). If you didn't already install it in order to install Dash for R, we also need to make sure that the _devtools_ library is installed.
3434
3535
```r
3636
install.packages("devtools")
@@ -51,7 +51,7 @@ install_github('facultyai/dash-bootstrap-components@r0.10.0')
5151
```
5252
-----
5353
Julia
54-
To get started make sure you have [installed Dash.jl](https://dash-julia.plotly.com/installation). You can then install `DashBootstrapComponents` as follows
54+
To get started make sure you have [installed Dash.jl](https://dash.plotly.com/julia/installation). You can then install `DashBootstrapComponents` as follows
5555
5656
```julia-repl
5757
pkg> add DashBootstrapComponents
@@ -79,12 +79,13 @@ To use _dash-bootstrap-components_ you must do two things:
7979

8080
### Linking a stylesheet
8181

82-
_dash-bootstrap-components_ doesn't come with CSS included. This is to give you the freedom to use any Bootstrap v4 stylesheet of your choice. This means however that in order for the components to be styled properly, you must link to a stylesheet yourself.
82+
_dash-bootstrap-components_ doesn't come with CSS included. This is to give you the freedom to use any Bootstrap v5 stylesheet of your choice. This means however that in order for the components to be styled properly, you must link to a stylesheet yourself.
8383

84-
For convenience, links to [BootstrapCDN][bootstrapcdn] for standard Bootstrap and each Bootswatch theme are available as part of _dash-bootstrap-components_ and can be used as follows
84+
For convenience, CDN links to [JSDelivr][jsdelivr] for standard Bootstrap and each Bootswatch theme are available as part of _dash-bootstrap-components_ and can be used as follows
8585

8686
~~~bootstrap-tabs
8787
Python
88+
8889
In Python, each CDN link is available within the `dbc.themes` submodule and can
8990
be used when instantiating the `app` object.
9091
@@ -96,6 +97,7 @@ app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP])
9697
```
9798
-----
9899
R
100+
99101
Once you have imported _dash-bootstrap-components_ with
100102
`library(dashBootstrapComponents)`, the `dbcThemes` list will be loaded into
101103
your global namespace and can be used when instantiating the `app` object.
@@ -110,6 +112,8 @@ app <- Dash$new(external_stylesheets = dbcThemes$BOOTSTRAP)
110112
-----
111113
Julia
112114
115+
Once you have imported _dash-bootstrap-components_ with `using DashBootstrapComponents`, you can access CDN links through the `dbc_themes` named tuple.
116+
113117
```julia
114118
using Dash, DashBootstrapComponents
115119
@@ -183,5 +187,5 @@ Check out these [example apps][examples] made with _dash-bootstrap-components_.
183187
[docs-themes]: /docs/themes
184188
[docs-icons]: /docs/icons
185189
[docs-components]: /docs/components
186-
[bootstrapcdn]: https://www.bootstrapcdn.com/
190+
[jsdelivr]: https://www.jsdelivr.com/
187191
[examples]: /examples

docs/content/docs/themes.md

+9-10
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,13 @@ title: Themes
66

77
<p class="lead">Customise your app by choosing from different Bootstrap and Bootswatch themes.</p>
88

9-
_dash-bootstrap-components_ doesn't come with CSS included. This is to give you the freedom to use any Bootstrap v4 stylesheet of your choice, so you can achieve the look you want in your app.
9+
_dash-bootstrap-components_ doesn't come with CSS included. This is to give you the freedom to use any Bootstrap v5 stylesheet of your choice, so you can achieve the look you want in your app.
1010

1111
You can link to a stylesheet served over a CDN, or serve CSS locally depending on your needs.
1212

1313
## Packaged CDN links
1414

15-
_dash-bootstrap-components_ contains links to Bootstrap and Bootswatch stylesheets hosted on [BootstrapCDN][bootstrapcdn] so you can conveniently link to one of them in your app. The easiest way to do so is to use the `external_stylesheets` argument when instantiating your app.
15+
_dash-bootstrap-components_ contains links to Bootstrap and Bootswatch stylesheets hosted on [JSDelivr][jsdelivr] so you can conveniently link to one of them in your app. The easiest way to do so is to use the `external_stylesheets` argument when instantiating your app.
1616

1717
~~~bootstrap-tabs
1818
Python
@@ -84,21 +84,21 @@ Each theme such as is simply a BootstrapCDN URL stored as a string, so using the
8484
Python
8585
8686
```python
87-
BS = "https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
87+
BS = "https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css"
8888
app = dash.Dash(external_stylesheets=[BS])
8989
```
9090
-----
9191
R
9292
9393
```r
94-
BS <- "https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
94+
BS <- "https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css"
9595
app <- Dash$new(external_stylesheets = BS)
9696
```
9797
-----
9898
Julia
9999
100100
```julia
101-
BS = "https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
101+
BS = "https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css"
102102
app = dash(external_stylesheets=[BS])
103103
```
104104
~~~
@@ -113,17 +113,16 @@ The easiest way to link a local stylesheet is to place it in a folder named `ass
113113

114114
<h2 id="available-themes">Available themes</h2>
115115

116-
There are numerous free to use Bootstrap stylesheets available on the web. The `dash_bootstrap_components.themes` module contains CDN links for Bootstrap and all of the [Bootswatch themes][bootswatch-themes]. Bootstrap also maintains its own [themes website][bootstrap-themes] which lists a number of free and premium themes that you could incorporate into your apps.
116+
There are numerous free to use Bootstrap stylesheets available on the web. The `dash_bootstrap_components.themes` module contains CDN links for Bootstrap and all of the [Bootswatch themes][bootswatch]. Bootstrap also maintains its own [themes website][bootstrap-themes] which lists a number of free and premium themes that you could incorporate into your apps.
117117

118118
To start with, we recommend experimenting with some of the Bootswatch themes available in the `dash_bootstrap_components.themes` module. The full list of available themes is [`CERULEAN`](https://bootswatch.com/cerulean/), [`COSMO`](https://bootswatch.com/cosmo/), [`CYBORG`](https://bootswatch.com/cyborg/), [`DARKLY`](https://bootswatch.com/darkly/), [`FLATLY`](https://bootswatch.com/flatly/), [`JOURNAL`](https://bootswatch.com/journal/), [`LITERA`](https://bootswatch.com/litera/), [`LUMEN`](https://bootswatch.com/lumen/), [`LUX`](https://bootswatch.com/lux/), [`MATERIA`](https://bootswatch.com/materia/), [`MINTY`](https://bootswatch.com/minty/), [`MORPH`](https://bootswatch.com/morph/), [`PULSE`](https://bootswatch.com/pulse/), [`QUARTZ`](https://bootswatch.com/quartz/), [`SANDSTONE`](https://bootswatch.com/sandstone/), [`SIMPLEX`](https://bootswatch.com/simplex/), [`SKETCHY`](https://bootswatch.com/sketchy/), [`SLATE`](https://bootswatch.com/slate/), [`SOLAR`](https://bootswatch.com/solar/), [`SPACELAB`](https://bootswatch.com/spacelab/), [`SUPERHERO`](https://bootswatch.com/superhero/), [`UNITED`](https://bootswatch.com/united/), [`VAPOR`](https://bootswatch.com/vapor/), [`YETI`](https://bootswatch.com/yeti/), [`ZEPHYR`](https://bootswatch.com/zephyr/).
119119

120120
Check out the [theme explorer](/docs/themes/explorer/) for a live demo of dash-bootstrap-components using all of the different available themes. You may also like to check out the [dash-bootstrap-css](https://github.com/tcbegley/dash-bootstrap-css) project which contains Bootstrap stylesheets that apply consistent styling to various components from dash-core-components.
121121

122122
[dash-docs-external]: https://dash.plotly.com/external-resources/
123-
[bootstrapcdn]: https://www.bootstrapcdn.com/
124123
[bootstrap]:https://getbootstrap.com/
125-
[bootstrap-download]: https://getbootstrap.com/docs/4.6/getting-started/download/
126-
[bootstrap-compile]: https://getbootstrap.com/docs/4.6/getting-started/theming/
127-
[bootstrap-themes]: https://themes.getbootstrap.com/
124+
[bootstrap-download]: https://getbootstrap.com/docs/5.0/getting-started/download/
125+
[bootstrap-compile]: https://getbootstrap.com/docs/5.0/customize/overview/
128126
[bootswatch]: https://bootswatch.com/
129127
[bootswatch-themes]: https://www.bootstrapcdn.com/bootswatch/
128+
[jsdelivr]: https://www.jsdelivr.com/

docs/examples/__init__.py

+1-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919

2020
GITHUB_EXAMPLES = (
2121
"https://github.com/"
22-
"facultyai/dash-bootstrap-components/blob/main/examples/"
22+
"facultyai/dash-bootstrap-components/blob/main/examples/python"
2323
)
2424

2525
INDEX_STRING_TEMPLATE = """{% extends "example.html" %}

docs/templates/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ <h2>Highly customisable</h2>
9898
</div>
9999
<div class="col-12 col-lg-6">
100100
<p class="lead">
101-
Dash Bootstrap Components is compatible with any Bootstrap v4
101+
Dash Bootstrap Components is compatible with any Bootstrap v5
102102
stylesheet of your choice. Learn how to customise the look of your app
103103
using the bundled themes or your own custom themes.
104104
</p>

package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "dash-bootstrap-components",
3-
"version": "1.0.0-dev",
3+
"version": "1.0.0",
44
"description": "Bootstrap components for Plotly Dash",
55
"repository": "github:facultyai/dash-bootstrap-components",
66
"main": "lib/dash-bootstrap-components.min.js",

tests/test_version.py

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,4 @@
22

33

44
def test_version():
5-
assert __version__ == "1.0.0-dev"
5+
assert __version__ == "1.0.0"

0 commit comments

Comments
 (0)