{
    "info": {
        "author": "Ryan rmarren1",
        "author_email": "rymarr@tuta.io",
        "bugtrack_url": null,
        "classifiers": [],
        "description": "# dash-ui\n\n### Grid\n`Grid` makes use of the\n[CSS grid](https://css-tricks.com/getting-started-css-grid/)\nto make creating dashboard-like layouts super easy in Dash.\n\n\n### ControlPanel\n`ControlPanel` adds a panel to the side of the grid which contains input components to change the state of the plot grid.\n\n\n##### A Simple Example Grid\nThis example is found in `simple_demo.py`\n![image](https://user-images.githubusercontent.com/10272301/39724456-dc7144c0-5216-11e8-8b01-18ddc19946e2.png)\n\n\nFirst we add the external css url `https://codepen.io/rmarren1/pen/mLqGRg.css`.\nThis is necessary for the grid to work. If you cannot use this (e.g. you\nare serving stylesheets locally) you can just serve the file at https://github.com/rmarren1/dash-ui/blob/master/dash_ui/style/css/grid.css .\n\nNext, we create a grid with the following call:\n`grid = dui.Grid(_id=\"grid\", num_rows=12, num_cols=12, grid_padding=5)`\n\n* `num_rows` is the number of rows in the grid, and must be between 1 and 12\n* `num_cols` is the number of columns in the grid, and must be between 1 and 12\n* `grid_padding` is the number of pixels to pad between grid elements, and must\nbe one of [0, 1, 2, 5, 10, 25, 50, 100].\n\nNow you can add any dash element as a grid element like so:\n\n```\ngrid.add_element(col=1, row=1, width=3, height=4, element=html.Div(\n    style={\"background-color\": \"red\", \"height\": \"100%\", \"width\": \"100%\"}\n))\n```\n\n* `row` is the starting row in the grid layout\n* `col` is the starting column in the grid layout\n* `height` is the number of rows the element should span.\n* `width` is the number of columns the element should span\n\nNote that the rows and columns are one indexed.\n\nFinally, we create the layout using the function\n`dui.Layout(grid=grid,)`\n\nand set `app.layout` as the object this function returns.\n\n\n##### A Grid with ControlPanel\nThis example shows the grid with real plots (see `advanced_demo.py`)\n![image](https://user-images.githubusercontent.com/10272301/40074922-03a07a74-5849-11e8-92f5-8a211d03b26f.png)\n\nIf a `ControlPanel` is not included, the grid will take up the entire screen.\nTo include the `ControlPanel`, create one using code like the following:\n```\ncontrolpanel = dui.ControlPanel(_id=\"controlpanel\")\ncontrolpanel.create_group(\n    group=\"State\",\n    group_title=\"Change the selected State.\"\n)\nstate_select = dcc.Dropdown(\n    id=\"state-dropdown\",\n    options=[{\n        'label': x.title(),\n        'value': x\n        } for x in df[\"state\"].tolist()\n    ],\n    value=df[\"state\"].tolist()[0]\n)\ncontrolpanel.add_element(state_select, \"State\")\n```\nthen include the `controlpanel` instance as an argument to the `dui.Layout` function, e.g.\n```\napp.layout = dui.Layout(\n    grid=grid,\n    controlpanel=controlpanel\n)\n```\nWe can also add plotly graph elements with the shortcut\n`grid.add_graph(col=1, row=1, width=3, height=4, graph_id=\"all-pie\")`\nwhich creates a grid element with a graph with the `id` declared in `graph_id`.\n\n\n\nWe can end up with this really nice interactive dashboard, with only\n200 lines of code.\n\n### Customizing the style\nTo have your own flavor of dashboard, simply fork the source SASS [here](https://codepen.io/rmarren1/pen/mLqGRg), make changes, then add the css from codepen to your project using:\n```\nmy_css_urls = [\n  \"https://codepen.io/your-codepen-name/pen/your-pen-identifier.css\",\n]\n\nfor url in my_css_urls:\n    app.css.append_css({\n        \"external_url\": url\n    })\n```",
        "description_content_type": "",
        "docs_url": null,
        "download_url": "",
        "downloads": {
            "last_day": -1,
            "last_month": -1,
            "last_week": -1
        },
        "home_page": "",
        "keywords": "",
        "license": "MIT",
        "maintainer": "",
        "maintainer_email": "",
        "name": "dash_ui",
        "package_url": "https://pypi.org/project/dash_ui/",
        "platform": "",
        "project_url": "https://pypi.org/project/dash_ui/",
        "project_urls": null,
        "release_url": "https://pypi.org/project/dash_ui/0.4.0/",
        "requires_dist": null,
        "requires_python": "",
        "summary": "Some abstractions to make creating UIs easier in Dash.",
        "version": "0.4.0"
    },
    "last_serial": 4193992,
    "releases": {
        "0.1.0": [
            {
                "comment_text": "",
                "digests": {
                    "md5": "9545a50edd445499002088e4e4289ad1",
                    "sha256": "1a56ada0b9aaee6ec98a124aed237651030dda27dd027b4e4e00d3c96b9fec7e"
                },
                "downloads": -1,
                "filename": "dash_ui-0.1.0.tar.gz",
                "has_sig": false,
                "md5_digest": "9545a50edd445499002088e4e4289ad1",
                "packagetype": "sdist",
                "python_version": "source",
                "requires_python": null,
                "size": 2990,
                "upload_time": "2018-05-07T21:06:01",
                "url": "https://files.pythonhosted.org/packages/4a/9a/cdcaa4ee95b7210cc87b27ed745112e5762c9efbc2e7b24271ed139a65b2/dash_ui-0.1.0.tar.gz"
            }
        ],
        "0.2.0": [
            {
                "comment_text": "",
                "digests": {
                    "md5": "4cd62d3421fdd98e104d444a00f89fe4",
                    "sha256": "525522699b1d9b202200f53e0c5f792d8c61de5d60c2d5de68bcf55c35d02844"
                },
                "downloads": -1,
                "filename": "dash_ui-0.2.0.tar.gz",
                "has_sig": false,
                "md5_digest": "4cd62d3421fdd98e104d444a00f89fe4",
                "packagetype": "sdist",
                "python_version": "source",
                "requires_python": null,
                "size": 3016,
                "upload_time": "2018-05-08T18:31:46",
                "url": "https://files.pythonhosted.org/packages/62/fe/ea0bf3abff7b8d72f6165942d2c94186a365affe4ad6a879996c15727183/dash_ui-0.2.0.tar.gz"
            }
        ],
        "0.3.0": [
            {
                "comment_text": "",
                "digests": {
                    "md5": "71b0c4fcc323f20a1a4f2332eb99aa73",
                    "sha256": "165bb2ca1851bd1fa0f93e4a44abc72ef4c44455841a948cb07366409485ea81"
                },
                "downloads": -1,
                "filename": "dash_ui-0.3.0.tar.gz",
                "has_sig": false,
                "md5_digest": "71b0c4fcc323f20a1a4f2332eb99aa73",
                "packagetype": "sdist",
                "python_version": "source",
                "requires_python": null,
                "size": 3484,
                "upload_time": "2018-05-15T18:03:33",
                "url": "https://files.pythonhosted.org/packages/76/81/4fb69d974037e2456b27f22242e1aa5afe8c2601cb37d63c78d8fcbc742c/dash_ui-0.3.0.tar.gz"
            }
        ],
        "0.3.1": [
            {
                "comment_text": "",
                "digests": {
                    "md5": "dad6cedb8636e3f2500feb509dd3fa12",
                    "sha256": "51274ac18e1e2bd4faf5b0cef98816359bc23e45f127e157b802b4234ce0c360"
                },
                "downloads": -1,
                "filename": "dash_ui-0.3.1.tar.gz",
                "has_sig": false,
                "md5_digest": "dad6cedb8636e3f2500feb509dd3fa12",
                "packagetype": "sdist",
                "python_version": "source",
                "requires_python": null,
                "size": 4170,
                "upload_time": "2018-05-19T17:54:42",
                "url": "https://files.pythonhosted.org/packages/48/69/a86261651d090631f4d0d27c3756271d1cd300a4838ead1308bf8b19a778/dash_ui-0.3.1.tar.gz"
            }
        ],
        "0.4.0": [
            {
                "comment_text": "",
                "digests": {
                    "md5": "837cc5d485599738dc015d0e9d13a5cb",
                    "sha256": "a9d771a7db41c67c0a01a208fda09064a90ab528b20bf1a223e931f8825640cc"
                },
                "downloads": -1,
                "filename": "dash_ui-0.4.0.tar.gz",
                "has_sig": false,
                "md5_digest": "837cc5d485599738dc015d0e9d13a5cb",
                "packagetype": "sdist",
                "python_version": "source",
                "requires_python": null,
                "size": 4280,
                "upload_time": "2018-06-22T20:06:54",
                "url": "https://files.pythonhosted.org/packages/d3/b9/0daa84e7f4048c7b77d88886f86e431a4bc270daf3bb642019a3e9fc1c97/dash_ui-0.4.0.tar.gz"
            }
        ],
        "0.5.0rc1": [
            {
                "comment_text": "",
                "digests": {
                    "md5": "4d2cb9118666f478d78856a00b3856aa",
                    "sha256": "e1df9e1b1cc31fb46c8d1b81bbd9bd8322ccd8fce9c41bf45d66013c56899a6e"
                },
                "downloads": -1,
                "filename": "dash_ui-0.5.0rc1.tar.gz",
                "has_sig": false,
                "md5_digest": "4d2cb9118666f478d78856a00b3856aa",
                "packagetype": "sdist",
                "python_version": "source",
                "requires_python": null,
                "size": 4507,
                "upload_time": "2018-08-21T21:18:28",
                "url": "https://files.pythonhosted.org/packages/67/83/9b8c54b5fe323f2c18d76cfa7a3963e3078b5c5cb97cd20159de0b8c8e94/dash_ui-0.5.0rc1.tar.gz"
            }
        ]
    },
    "urls": [
        {
            "comment_text": "",
            "digests": {
                "md5": "837cc5d485599738dc015d0e9d13a5cb",
                "sha256": "a9d771a7db41c67c0a01a208fda09064a90ab528b20bf1a223e931f8825640cc"
            },
            "downloads": -1,
            "filename": "dash_ui-0.4.0.tar.gz",
            "has_sig": false,
            "md5_digest": "837cc5d485599738dc015d0e9d13a5cb",
            "packagetype": "sdist",
            "python_version": "source",
            "requires_python": null,
            "size": 4280,
            "upload_time": "2018-06-22T20:06:54",
            "url": "https://files.pythonhosted.org/packages/d3/b9/0daa84e7f4048c7b77d88886f86e431a4bc270daf3bb642019a3e9fc1c97/dash_ui-0.4.0.tar.gz"
        }
    ]
}