gradio/ui
Dawood Khan 9fff1e0fe8
Enable multi-select on gradio.Dropdown (#2871)
* multiselect dropdown

* fixes

* more fixes

* changes

* changelog

* formatting

* format notebooks

* type fixes

* notebok fix

* remove console log

* notebook fix

* type fix

* Revert "format notebooks"

This reverts commit fb8762ecff.

* notebook fix

* bug fixes

* Update CHANGELOG.md

* Excluding untracked files from demo notebook check action (#2897)

* excluding untracked files from wget

* changelog

* fix setting default values

* typeability and arrow key support

* python types

* reformat

* another type check

* minor fixes + interactive false fix

* change remove token styling

* separate multiselect into separate file

* style fixes

* Update CHANGELOG.md

* Update CHANGELOG.md

* Update CHANGELOG.md

* some more style fixes

* small bug fix

* addressed pr comments

* fix active color highlighting

Co-authored-by: Ali Abdalla <ali.si3luwa@gmail.com>
Co-authored-by: Abubakar Abid <abubakar@huggingface.co>
2023-01-04 19:13:46 -05:00
..
packages Enable multi-select on gradio.Dropdown (#2871) 2023-01-04 19:13:46 -05:00
.editorconfig add typescript (#521) 2022-02-02 14:02:09 +00:00
.gitignore add test infra + add browser tests to CI (#852) 2022-03-23 15:19:12 +00:00
.npmrc fix pnpm filters for 7.x (#1927) 2022-08-02 12:02:06 -07:00
.prettierignore Form layout (#1054) 2022-04-22 10:19:59 +01:00
.prettierrc.json add typescript (#521) 2022-02-02 14:02:09 +00:00
globals.d.ts Allow gradio embeds in colab without share (#2455) 2022-11-03 15:51:30 -07:00
JSX.d.ts Fix the types (#1843) 2022-07-21 19:12:46 +01:00
package-lock.json changes 2022-03-02 22:59:36 +00:00
package.json add snapshot testing (#2438) 2022-10-12 17:30:42 +01:00
playwright-setup.js Fix the types (#1843) 2022-07-21 19:12:46 +01:00
playwright.config.js add test infra + add browser tests to CI (#852) 2022-03-23 15:19:12 +00:00
pnpm-lock.yaml Add Progress Bar component (#2750) 2022-12-30 11:45:54 -08:00
pnpm-workspace.yaml undo pretty format of website 2022-02-14 16:50:15 -05:00
postcss.config.cjs fix tooling issues 2022-02-25 12:24:32 +00:00
README.md Update text (#1050) 2022-04-21 10:07:43 +01:00
svelte.config.js fix tooling issues 2022-02-25 12:24:32 +00:00
tailwind.config.cjs distribute gradio as a web component (#1444) 2022-06-07 11:11:44 -07:00
tsconfig.json Fix the types (#1843) 2022-07-21 19:12:46 +01:00
vitest.config.ts add unit tests (#602) 2022-02-14 15:24:04 +00:00

gradio-ui

This folder contains all of the Gradio UI and component source code.

Note: The below assumes you are in the ui directory unless alternative instructions are given.

setup

This folder is managed as 'monorepo' a multi-package repository which make dependency management very simple. In order to do this we use pnpm as our package manager.

Make sure pnpm is installed by following the installation instructions for your system.

You will also need node which you probably already have

running the application

Install all dependencies from the ui folder:

pnpm i

This will install the dependencies for all packages within the ui folder and link any local packages

local development

To develop locally, open two terminal tabs from the root of the repository.

Run the python test server, from the root directory:

cd demo/kitchen_sink
python run.py

This will start a development server on port 7860 that the web app is expecting.

Run the web app:

cd ui #move back into ui if you haven't already
pnpm dev

building for production

From the ui folder run the build.

pnpm build

This will create the necessary files in ui/app/public and also in gradio/templates/frontend.

quality checks

The repos currently has two quality checks that can be run locally and are run in CI.

formatting

Formatting is handled by prettier to ensure consistent formatting and prevent style-focused conversations. Formatting failures will fails CI and should be reoslve before merging.

To check formatting:

pnpm format:check

If you have formatting failures then you can run the following command to fix them:

pnpm format:write

type checking

We use TypeScript to provide static types to javascript code. These checks are also run in CI.

to typecheck the code:

pnpm ts:check

ci checks

Currently the following checks are run in CI:

  • Format check (pnpm format:check)
  • Type check (pnpm ts:check)
  • Build as a smoke test (pnpm build)