Skip to main content

cmd + k interface for dash applications

Project description

dash kbar

cmd + k interface for dash applications

dash_kbar_animation

Installation

pip install dash_kbar

Usage

dash_kbar.DashKbar(
    id="input",
    actions=[
        {"name": "Action 1", "id": "action1"},
        {"name": "Action 2", "id": "action2"},
    ],
    style={
        "itemTextColor": "grey",
    },
)

Look into usage.py for a functioning example usage.

API

The following properties are accepted by DashKbar.

Property Description Type Default
id The ID used to identify this component in Dash callbacks str None
actions List of actions to display in the kbar list[dict[str, str]] []
style Style of the kbar dict[str, str] {}
selected ID of the selected item. You can use this prop in callbacks. str None
debug Show the id of the selected item in the browser console bool False

Actions

Actions should be a list of dictionaries with the following keys.

Key Description Type Required
name Name of the action str Yes
id ID of the action str Yes
subtitle Subtitle of the action str No
keywords Keywords of the action list[str] No
section Section of the action str No
icon Icon of the action str No
parent If this is a child item, give the id of the parent str No
actionable Boolean denoting whether selecting this action will change the selected property. Set this to False for parent actions where selecting the parent should show the child actions. bool No
shortcut Shortcut of the action list[str] No

Styling

Style should be a dictionary with one or more of the following keys.

Key Description Default
maxWidth Maximum width of the kbar 600px
width Width of the kbar 100%
background Background color of the kbar white
searchBackground Background color of the search input box transparent
searchTextColor Text color of the search input box grey
fontFamily Font family of the kbar sans-serif
itemTextColor Text color of the items grey
itemSubtitleTextColor Text color of the item subtitles grey
sectionTitleTextColor Text color of the section titles grey
selectedBackground Background color of the selected item rgba(34, 139, 230, 0.1)
selectedTextColor Text color of the selected item grey
selectedLeftBorderColor Left border color of the selected item rgba(34, 139, 230, 1)
boxShadow Box shadow of the kbar 0 0 20px rgba(0, 0, 0, 0.1)
borderRadius Border radius of the kbar 8px
searchBoxFontSize Font size of the search input box 16px
resultFontSize Font size of the items 14px
subtitleFontSize Font size of the item subtitles 12px
sectionTitleFontSize Font size of the section titles 10px

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

dash_kbar-0.4.0.tar.gz (101.1 kB view details)

Uploaded Source

Built Distribution

dash_kbar-0.4.0-py3-none-any.whl (101.3 kB view details)

Uploaded Python 3

File details

Details for the file dash_kbar-0.4.0.tar.gz.

File metadata

  • Download URL: dash_kbar-0.4.0.tar.gz
  • Upload date:
  • Size: 101.1 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/4.0.2 CPython/3.9.18

File hashes

Hashes for dash_kbar-0.4.0.tar.gz
Algorithm Hash digest
SHA256 d481dee2e9d860a59e9519ead32a0efee7093bd50c4d33423008fcfa32213089
MD5 b383c0b69c7e8495ec50c2e6aeb60bb9
BLAKE2b-256 9eafd43e2e933070d4d415ac2cbdd99ea624b939394d979513ba81f78cde9b8a

See more details on using hashes here.

File details

Details for the file dash_kbar-0.4.0-py3-none-any.whl.

File metadata

  • Download URL: dash_kbar-0.4.0-py3-none-any.whl
  • Upload date:
  • Size: 101.3 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/4.0.2 CPython/3.9.18

File hashes

Hashes for dash_kbar-0.4.0-py3-none-any.whl
Algorithm Hash digest
SHA256 858fdb2ef7d25ae5e512bb7de93cd9976eb2dde207d751d2f95665699c5ecdb8
MD5 15da61edf6cd36100e37da644af36905
BLAKE2b-256 2a85aa91564fc78e1380ecb81d966961b06aeb49684567af3cf1a8557ebd46f4

See more details on using hashes here.

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page