streamlit-navigation-bar


Namestreamlit-navigation-bar JSON
Version 3.3.0 PyPI version JSON
download
home_pagehttps://github.com/gabrieltempass/streamlit-navigation-bar
SummaryA component that allows you to place a navigation bar in your Streamlit app.
upload_time2024-05-13 20:52:22
maintainerNone
docs_urlNone
authorGabriel Tem Pass
requires_python>=3.8
licenseMIT License
keywords
VCS
bugtrack_url
requirements No requirements were recorded.
Travis-CI No Travis.
coveralls test coverage No coveralls. 
            [![PyPI - Version](https://img.shields.io/pypi/v/streamlit-navigation-bar)](https://pypi.org/project/streamlit-navigation-bar/)
[![Downloads](https://static.pepy.tech/badge/streamlit-navigation-bar/month)](https://pepy.tech/project/streamlit-navigation-bar)
[![GitHub License](https://img.shields.io/github/license/gabrieltempass/streamlit-navigation-bar?color=blue)](https://github.com/gabrieltempass/streamlit-navigation-bar/blob/main/LICENSE)

# Streamlit Navigation Bar

**A component that allows you to place a navigation bar in your Streamlit app.**

The navbar was built to:
* Be simple to use
* Look great out of the box
* Apply custom styles
* Integrate with Streamlit’s UI
* Have a well-written documentation

It has some cool functionalities, like displaying an optional logo and external URLs. It also matches the active theme by default.

## Installation

Open a terminal and run:

``` bash
pip install streamlit-navigation-bar
```

## Example

Here is a basic example of how to use it:
``` python
import streamlit as st
from streamlit_navigation_bar import st_navbar

page = st_navbar(["Home", "Documentation", "Examples", "Community", "About"])
st.write(page)
```
[![Example 1](https://github.com/gabrieltempass/streamlit-navigation-bar/raw/main/images/st_navbar_1.gif)](https://st-navbar-1.streamlit.app/)
[**[App]**](https://st-navbar-1.streamlit.app/) 
[**[Source]**](https://github.com/gabrieltempass/streamlit-navigation-bar/blob/main/examples/st_navbar_1/streamlit_app.py)

Jump to the [examples gallery](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Examples) to see more demos of what the navbar is capable of.

## Documentation

The complete documentation is on the [GitHub Wiki](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki).
There, you can check:
* [API reference](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference)
    * [Usage](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#usage)
    * [Parameters](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#parameters)
    * [Returns](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#returns)
    * [Styles](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#styles)
        * [Document Object Model](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#document-object-model)
        * [CSS variables](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#css-variables)
        * [Default style](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#default-style)
        * [Maximum width](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#maximum-width)
    * [Options](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#options)
* [Multipage](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Multipage)
    * [Streamlit's structure](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Multipage#streamlits-structure)
    * [Recommended structure](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Multipage#recommended-structure)
* [Examples](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Examples)
* [Roadmap](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Roadmap)

## Requirements

To use the navigation bar component in your Streamlit app, you will need:
* **Python >= 3.8**
* **Streamlit >= 1.33**
* **[Streamlit Theme](https://github.com/gabrieltempass/streamlit-theme) >= 1.2.3**
* The CSS adjustment depends on the
  [browser compatibility with the :has pseudo-class](https://developer.mozilla.org/en-US/docs/Web/CSS/:has#browser_compatibility)

## Contributing

You are welcome to help develop the Streamlit Navigation Bar! There are
multiple ways to contribute, such as [reporting a bug](https://github.com/gabrieltempass/streamlit-navigation-bar/issues/new?assignees=&labels=bug&projects=&template=bug_report.yml)
or [requesting a feature](https://github.com/gabrieltempass/streamlit-navigation-bar/issues/new?assignees=&labels=enhancement&projects=&template=feature_request.yml).
You can also just [ask a question](https://github.com/gabrieltempass/streamlit-navigation-bar/issues/new?assignees=&labels=question&projects=&template=ask_question.yml),
or join the discussions in the [community forum](https://discuss.streamlit.io/t/new-component-streamlit-navigation-bar/66032).
To submit code for a pull request, make sure to read the
[guide on how to contribute](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Contributing).

## References

The Streamlit Navigation Bar was made with:
* The [streamlit-component-vue-vite-template](https://github.com/gabrieltempass/streamlit-component-vue-vite-template),
  by [@gabrieltempass](https://github.com/gabrieltempass)
* The [st-theme](https://github.com/gabrieltempass/streamlit-theme)
  component, by [@gabrieltempass](https://github.com/gabrieltempass)

And based on:
* The [streamlit-option-menu](https://github.com/victoryhb/streamlit-option-menu/tree/master)
  component, by [@victoryhb](https://github.com/victoryhb)
* The [styleable container](https://arnaudmiribel.github.io/streamlit-extras/extras/stylable_container/),
  by [@LukasMasuch](https://github.com/LukasMasuch)

Raw data

            {
    "_id": null,
    "home_page": "https://github.com/gabrieltempass/streamlit-navigation-bar",
    "name": "streamlit-navigation-bar",
    "maintainer": null,
    "docs_url": null,
    "requires_python": ">=3.8",
    "maintainer_email": null,
    "keywords": null,
    "author": "Gabriel Tem Pass",
    "author_email": "redo_hint_0x@icloud.com",
    "download_url": "https://files.pythonhosted.org/packages/33/f5/5f950940d4e729bfb441245ca1a979be6a2feb862162af07c799575fc4d1/streamlit-navigation-bar-3.3.0.tar.gz",
    "platform": null,
    "description": "[![PyPI - Version](https://img.shields.io/pypi/v/streamlit-navigation-bar)](https://pypi.org/project/streamlit-navigation-bar/)\n[![Downloads](https://static.pepy.tech/badge/streamlit-navigation-bar/month)](https://pepy.tech/project/streamlit-navigation-bar)\n[![GitHub License](https://img.shields.io/github/license/gabrieltempass/streamlit-navigation-bar?color=blue)](https://github.com/gabrieltempass/streamlit-navigation-bar/blob/main/LICENSE)\n\n# Streamlit Navigation Bar\n\n**A component that allows you to place a navigation bar in your Streamlit app.**\n\nThe navbar was built to:\n* Be simple to use\n* Look great out of the box\n* Apply custom styles\n* Integrate with Streamlit\u2019s UI\n* Have a well-written documentation\n\nIt has some cool functionalities, like displaying an optional logo and external URLs. It also matches the active theme by default.\n\n## Installation\n\nOpen a terminal and run:\n\n``` bash\npip install streamlit-navigation-bar\n```\n\n## Example\n\nHere is a basic example of how to use it:\n``` python\nimport streamlit as st\nfrom streamlit_navigation_bar import st_navbar\n\npage = st_navbar([\"Home\", \"Documentation\", \"Examples\", \"Community\", \"About\"])\nst.write(page)\n```\n[![Example 1](https://github.com/gabrieltempass/streamlit-navigation-bar/raw/main/images/st_navbar_1.gif)](https://st-navbar-1.streamlit.app/)\n[**[App]**](https://st-navbar-1.streamlit.app/) \n[**[Source]**](https://github.com/gabrieltempass/streamlit-navigation-bar/blob/main/examples/st_navbar_1/streamlit_app.py)\n\nJump to the [examples gallery](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Examples) to see more demos of what the navbar is capable of.\n\n## Documentation\n\nThe complete documentation is on the [GitHub Wiki](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki).\nThere, you can check:\n* [API reference](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference)\n    * [Usage](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#usage)\n    * [Parameters](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#parameters)\n    * [Returns](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#returns)\n    * [Styles](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#styles)\n        * [Document Object Model](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#document-object-model)\n        * [CSS variables](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#css-variables)\n        * [Default style](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#default-style)\n        * [Maximum width](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#maximum-width)\n    * [Options](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference#options)\n* [Multipage](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Multipage)\n    * [Streamlit's structure](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Multipage#streamlits-structure)\n    * [Recommended structure](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Multipage#recommended-structure)\n* [Examples](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Examples)\n* [Roadmap](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Roadmap)\n\n## Requirements\n\nTo use the navigation bar component in your Streamlit app, you will need:\n* **Python >= 3.8**\n* **Streamlit >= 1.33**\n* **[Streamlit Theme](https://github.com/gabrieltempass/streamlit-theme) >= 1.2.3**\n* The CSS adjustment depends on the\n  [browser compatibility with the :has pseudo-class](https://developer.mozilla.org/en-US/docs/Web/CSS/:has#browser_compatibility)\n\n## Contributing\n\nYou are welcome to help develop the Streamlit Navigation Bar! There are\nmultiple ways to contribute, such as [reporting a bug](https://github.com/gabrieltempass/streamlit-navigation-bar/issues/new?assignees=&labels=bug&projects=&template=bug_report.yml)\nor [requesting a feature](https://github.com/gabrieltempass/streamlit-navigation-bar/issues/new?assignees=&labels=enhancement&projects=&template=feature_request.yml).\nYou can also just [ask a question](https://github.com/gabrieltempass/streamlit-navigation-bar/issues/new?assignees=&labels=question&projects=&template=ask_question.yml),\nor join the discussions in the [community forum](https://discuss.streamlit.io/t/new-component-streamlit-navigation-bar/66032).\nTo submit code for a pull request, make sure to read the\n[guide on how to contribute](https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/Contributing).\n\n## References\n\nThe Streamlit Navigation Bar was made with:\n* The [streamlit-component-vue-vite-template](https://github.com/gabrieltempass/streamlit-component-vue-vite-template),\n  by [@gabrieltempass](https://github.com/gabrieltempass)\n* The [st-theme](https://github.com/gabrieltempass/streamlit-theme)\n  component, by [@gabrieltempass](https://github.com/gabrieltempass)\n\nAnd based on:\n* The [streamlit-option-menu](https://github.com/victoryhb/streamlit-option-menu/tree/master)\n  component, by [@victoryhb](https://github.com/victoryhb)\n* The [styleable container](https://arnaudmiribel.github.io/streamlit-extras/extras/stylable_container/),\n  by [@LukasMasuch](https://github.com/LukasMasuch)\n\n\n",
    "bugtrack_url": null,
    "license": "MIT License",
    "summary": "A component that allows you to place a navigation bar in your Streamlit app.",
    "version": "3.3.0",
    "project_urls": {
        "Bug Tracker": "https://github.com/gabrieltempass/streamlit-navigation-bar/issues",
        "Community": "https://discuss.streamlit.io/t/new-component-streamlit-navigation-bar/66032",
        "Documentation": "https://github.com/gabrieltempass/streamlit-navigation-bar/wiki/API-reference",
        "Homepage": "https://github.com/gabrieltempass/streamlit-navigation-bar",
        "Release notes": "https://github.com/gabrieltempass/streamlit-navigation-bar/releases",
        "Source Code": "https://github.com/gabrieltempass/streamlit-navigation-bar"
    },
    "split_keywords": [],
    "urls": [
        {
            "comment_text": "",
            "digests": {
                "blake2b_256": "342f44010a5393faf2c6f5506096f3cff6bc618bc010f412a56c30a99398f52c",
                "md5": "58907508137ac099794e1fca10497dc9",
                "sha256": "25be9657d7f44c0d4f2759a12bd75de7bb0829ed1dc69d9a5e91a77bc69924d8"
            },
            "downloads": -1,
            "filename": "streamlit_navigation_bar-3.3.0-py3-none-any.whl",
            "has_sig": false,
            "md5_digest": "58907508137ac099794e1fca10497dc9",
            "packagetype": "bdist_wheel",
            "python_version": "py3",
            "requires_python": ">=3.8",
            "size": 84888,
            "upload_time": "2024-05-13T20:52:20",
            "upload_time_iso_8601": "2024-05-13T20:52:20.618318Z",
            "url": "https://files.pythonhosted.org/packages/34/2f/44010a5393faf2c6f5506096f3cff6bc618bc010f412a56c30a99398f52c/streamlit_navigation_bar-3.3.0-py3-none-any.whl",
            "yanked": false,
            "yanked_reason": null
        },
        {
            "comment_text": "",
            "digests": {
                "blake2b_256": "33f55f950940d4e729bfb441245ca1a979be6a2feb862162af07c799575fc4d1",
                "md5": "b1f9670d4b546d87885960913b8d232b",
                "sha256": "f458c3f9bbb72a3fa07a28c1db98eceabdd49b19f71fafb44dc36042e0d4b4c4"
            },
            "downloads": -1,
            "filename": "streamlit-navigation-bar-3.3.0.tar.gz",
            "has_sig": false,
            "md5_digest": "b1f9670d4b546d87885960913b8d232b",
            "packagetype": "sdist",
            "python_version": "source",
            "requires_python": ">=3.8",
            "size": 83477,
            "upload_time": "2024-05-13T20:52:22",
            "upload_time_iso_8601": "2024-05-13T20:52:22.553791Z",
            "url": "https://files.pythonhosted.org/packages/33/f5/5f950940d4e729bfb441245ca1a979be6a2feb862162af07c799575fc4d1/streamlit-navigation-bar-3.3.0.tar.gz",
            "yanked": false,
            "yanked_reason": null
        }
    ],
    "upload_time": "2024-05-13 20:52:22",
    "github": true,
    "gitlab": false,
    "bitbucket": false,
    "codeberg": false,
    "github_user": "gabrieltempass",
    "github_project": "streamlit-navigation-bar",
    "travis_ci": false,
    "coveralls": false,
    "github_actions": false,
    "requirements": [],
    "lcname": "streamlit-navigation-bar"
}
Gabriel Tem Pass
Elapsed time: 0.23430s