ChopsUI: Starting point for rewriting chops-header in lit-element.

Bug: 852887
Change-Id: I018e977f83b24ed1de2dc506d0abdf590f6912fe
Reviewed-by: Sean McCullough <>
Commit-Queue: Tiffany Zhang <>
Cr-Original-Commit-Position: refs/heads/master@{#19639}
Cr-Mirrored-Commit: 8fc5ad4a30238d126c07edc9d926da28babf13b9
12 files changed
tree: 1d658cda31623a9046af33bb32db39b1f2ed4c1f
  1. demos/
  2. elements/
  3. .eslintrc.json
  4. .gitignore
  5. karma.conf.js
  6. lerna.json
  7. package-lock.json
  8. package.json
  10. webpack.config.js


This directory contains Web Components that are meant to be shared by Chrome Operations' application frontends.

ChopsUI packages are published publicly on NPM under the @chopsui organization. To be added to this org, please send your NPM username to zhangtiff@.

Publishing packages

TODO(zhangtiff): Streamline the process of publishing multiple packages, especially once we add more packages.

Packages are currently independently published from each other. Thus, in order to publish/update an individual package, move into the directory for the package you want to update and publish the package.

For example, in order to update chops-header, you would run:

cd elements/chops-header
npm publish --access public

You will have to login to an NPM account with access to the @chopsui org to have publish permissions.

Testing demos locally

To run demos locally, we use webpack-dev-server to serve static files.

You need to installthe following dependencies:

npm install -g webpack-cli webpack-dev-server

Then, to run a demo, run:

npm start

Then navigate to your demo URL. For example, for chops-header this URL is:


Downloading packages

Install the name of the specific package you're looking and install it within the @chopsui package scope. For example, to install chops-header, run:

npm install @chopsui/chops-header