Release 1.0.0 (#734)

* Release 1.0.0

* Update changelog

* remove references to Bootstrap 4

* rerun CI

dash_bootstrap_components/_version.py

@@ -1 +1 @@
-__version__ = "1.0.0-dev"
+__version__ = "1.0.0"

docs/components_page/components/button.md

@@ -5,7 +5,7 @@ lead: Documentation and examples for Bootstrap's button styles with _dash-bootst
 
 ## Examples
 
-Bootstrap includes several predefined button styles based on the predefined contextual colors. Chooose between them using the `color` argument.
+Bootstrap includes several predefined button styles based on the predefined contextual colors. Choose between them using the `color` argument.
 
 {{example:components/button/simple.py:buttons}}
 

docs/components_page/components/card.md

@@ -57,13 +57,13 @@ As mentioned previously, cards assume no specific width, so they will expand to
 
 ### Using grid components
 
-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`.
+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`.
 
 {{example:components/card/sizing/grid.py:cards}}
 
 ### Using Bootstrap utility classes
 
-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.
+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.
 
 {{example:components/card/sizing/utility.py:cards}}
 

docs/components_page/components/form.md

@@ -7,7 +7,7 @@ When building Dash apps we rarely make use of HTML forms, instead attaching call
 
 ## Examples
 
-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.
+Bootstrap's form components can be used to group labels, controls, optional help text, and form validation messaging. See this simple example.
 
 {{example:components/form/simple.py:form}}
 
@@ -47,7 +47,7 @@ The `FormFeedback` component should be added to a `html.Div` containing the `Inp
 
 ## Dash Core Components
 
-The `Form` and `FormGroup` components can also be used with _dash-core-components_.
+`Form` and other components can also be used with _dash-core-components_.
 
 {{example:components/form/dash_core.py:form}}
 

docs/components_page/components/index.md

@@ -24,4 +24,4 @@ For example, a simple application incorporating example above could look like th
 
 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.
 
-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/).
+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

@@ -5,7 +5,7 @@ lead: Components for laying out your Dash app, including wrapping containers, an
 
 ## Examples
 
-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.
+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.
 
 There are three main layout components in _dash-bootstrap-components_: `Container`, `Row`, and `Col`.
 
@@ -20,7 +20,7 @@ For best results, make sure you adhere to the following two rules when construct
 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.
 2. The immediate children of any `Row` component should always be `Col` components. Your content should go inside the `Col` components.
 
-For much more detail on the Bootstrap grid system, see the [Bootstrap documentation](https://getbootstrap.com/docs/4.2/layout/grid/).
+For much more detail on the Bootstrap grid system, see the [Bootstrap documentation](https://getbootstrap.com/docs/5.1/layout/grid/).
 
 ## Row with columns
 
@@ -84,7 +84,7 @@ Sometimes you may wish to use Bootstrap's grid system for specifying the layout
 
 {{code-example:components/layout/grid_only.py}}
 
-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.
+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.
 
 {{apidoc:src/components/layout/Container.js}}
 

docs/content/changelog.md

@@ -6,12 +6,12 @@ title: Changelog
 
 This page documents notable changes in dash-bootstrap-components releases.
 
-## 1.0.0 - 2021/XX/XX
+## 1.0.0 - 2021/10/19
 
-v1 of _dash-bootstrap-components_! This release contains loads of new features, but also breaking changes. Please read the changelog carefully for full details.
+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.
 
 ### Added
-- 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))
+- 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))
 - New CDN links for icons from Bootstrap Icons and Font Awesome ([PR 661](https://github.com/facultyai/dash-bootstrap-components/pull/661))
 - CDN Links for four new Bootswatch themes: `QUARTZ`, `MORPH`, `VAPOR` and `ZEPHYR`.
 - 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,
 ### Changed
 - 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)).
 
+## 0.13.1 - 2021/9/22
+
+### Fixed
+
+- Fix cursor jump issue in `Input` component. ([PR 707](https://github.com/facultyai/dash-bootstrap-components/pull/707))
+
 ## 0.13.0 - 2021/7/31
 
 ### Added

docs/content/docs/quickstart.md

@@ -30,7 +30,7 @@ conda install -c conda-forge dash-bootstrap-components
 ```
 -----
 R
-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.
+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.
 
 ```r
 install.packages("devtools")
@@ -51,7 +51,7 @@ install_github('facultyai/[email protected]')
 ```
 -----
 Julia
-To get started make sure you have [installed Dash.jl](https://dash-julia.plotly.com/installation). You can then install `DashBootstrapComponents` as follows
+To get started make sure you have [installed Dash.jl](https://dash.plotly.com/julia/installation). You can then install `DashBootstrapComponents` as follows
 
 ```julia-repl
 pkg> add DashBootstrapComponents
@@ -79,12 +79,13 @@ To use _dash-bootstrap-components_ you must do two things:
 
 ### Linking a stylesheet
 
-_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.
+_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.
 
-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
+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
 
 ~~~bootstrap-tabs
 Python
+
 In Python, each CDN link is available within the `dbc.themes` submodule and can
 be used when instantiating the `app` object.
 
@@ -96,6 +97,7 @@ app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP])
 ```
 -----
 R
+
 Once you have imported _dash-bootstrap-components_ with
 `library(dashBootstrapComponents)`, the `dbcThemes` list will be loaded into
 your global namespace and can be used when instantiating the `app` object.
@@ -110,6 +112,8 @@ app <- Dash$new(external_stylesheets = dbcThemes$BOOTSTRAP)
 -----
 Julia
 
+Once you have imported _dash-bootstrap-components_ with `using DashBootstrapComponents`, you can access CDN links through the `dbc_themes` named tuple.
+
 ```julia
 using Dash, DashBootstrapComponents
 
@@ -183,5 +187,5 @@ Check out these [example apps][examples] made with _dash-bootstrap-components_.
 [docs-themes]: /docs/themes
 [docs-icons]: /docs/icons
 [docs-components]: /docs/components
-[bootstrapcdn]: https://www.bootstrapcdn.com/
+[jsdelivr]: https://www.jsdelivr.com/
 [examples]: /examples

docs/content/docs/themes.md

@@ -6,13 +6,13 @@ title: Themes
 
 <p class="lead">Customise your app by choosing from different Bootstrap and Bootswatch themes.</p>
 
-_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.
+_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.
 
 You can link to a stylesheet served over a CDN, or serve CSS locally depending on your needs.
 
 ## Packaged CDN links
 
-_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.
+_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.
 
 ~~~bootstrap-tabs
 Python
@@ -84,21 +84,21 @@ Each theme such as is simply a BootstrapCDN URL stored as a string, so using the
 Python
 
 ```python
-BS = "https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
+BS = "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
 app = dash.Dash(external_stylesheets=[BS])
 ```
 -----
 R
 
 ```r
-BS <- "https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
+BS <- "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
 app <- Dash$new(external_stylesheets = BS)
 ```
 -----
 Julia
 
 ```julia
-BS = "https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
+BS = "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
 app = dash(external_stylesheets=[BS])
 ```
 ~~~
@@ -113,17 +113,16 @@ The easiest way to link a local stylesheet is to place it in a folder named `ass
 
 <h2 id="available-themes">Available themes</h2>
 
-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.
+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.
 
 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/).
 
 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.
 
 [dash-docs-external]: https://dash.plotly.com/external-resources/
-[bootstrapcdn]: https://www.bootstrapcdn.com/
 [bootstrap]:https://getbootstrap.com/
-[bootstrap-download]: https://getbootstrap.com/docs/4.6/getting-started/download/
-[bootstrap-compile]: https://getbootstrap.com/docs/4.6/getting-started/theming/
-[bootstrap-themes]: https://themes.getbootstrap.com/
+[bootstrap-download]: https://getbootstrap.com/docs/5.0/getting-started/download/
+[bootstrap-compile]: https://getbootstrap.com/docs/5.0/customize/overview/
 [bootswatch]: https://bootswatch.com/
 [bootswatch-themes]: https://www.bootstrapcdn.com/bootswatch/
+[jsdelivr]: https://www.jsdelivr.com/

docs/examples/__init__.py

@@ -19,7 +19,7 @@
 
 GITHUB_EXAMPLES = (
     "https://github.com/"
-    "facultyai/dash-bootstrap-components/blob/main/examples/"
+    "facultyai/dash-bootstrap-components/blob/main/examples/python"
 )
 
 INDEX_STRING_TEMPLATE = """{% extends "example.html" %}

docs/templates/index.html

@@ -98,7 +98,7 @@ <h2>Highly customisable</h2>
       </div>
       <div class="col-12 col-lg-6">
         <p class="lead">
-          Dash Bootstrap Components is compatible with any Bootstrap v4
+          Dash Bootstrap Components is compatible with any Bootstrap v5
           stylesheet of your choice. Learn how to customise the look of your app
           using the bundled themes or your own custom themes.
         </p>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "dash-bootstrap-components",
-  "version": "1.0.0-dev",
+  "version": "1.0.0",
   "description": "Bootstrap components for Plotly Dash",
   "repository": "github:facultyai/dash-bootstrap-components",
   "main": "lib/dash-bootstrap-components.min.js",

tests/test_version.py

@@ -2,4 +2,4 @@
 
 
 def test_version():
-    assert __version__ == "1.0.0-dev"
+    assert __version__ == "1.0.0"