Skip to content
/ ui Public

๐Ÿ’โ€โ™€๏ธ Inclusive Vue Components

Notifications You must be signed in to change notification settings

tournantdev/ui

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

Tournant UI

In the kitchen, the tournant is the person moving around, helping out.

Tournant UI aims to be this. For User Interfaces. Tournant UI will not replace your complete UI or dictate how to you design your elements.

But if you need to integrate inclusive components in your site, Tournant UI will be there. Like a helping hand.

Note

This is still in early development. Many components needed are missing. If you are able to contribute, please do!

Components

This project aims to provide common user interface patterns. It revolves around the WAI-ARIA design patterns and examples list. But it is not limited to it.

You can track our progress and development plans in the Component Development project. Again, if you are able to contribute one of the components, please do so. If you need one of the components but donโ€™t feel like you can build it on your own, open a feature request issue.

Acknowledgment

Tournant is heavily inspired by projects such as Reach UI, Inclusive Components and Accessible App.

Feedback & Contributions

Contributions are always welcome.

We have written down detailed contribution guidelines.

Please be aware that all contributions have to follow our Code of Conduct. Contributions of any kind which to not adhere to it will be removed. No exceptions will be made.

Thanks. ๐Ÿ’ž

Development

If you want to improve the component, follow these steps.

Tournant UI uses Lerna. You will need to bootstrap the project folder:

yarn bootstrap

This will install all packages and hoist them to the project root folder.

Create a Component

We maintain a CLI helper tool named Communard to quickly scaffold the folder structure needed to develop a new component. It is integrated into the project. You can start it by running yarn run create.

To develop your components please use Storybook as explained in the contribution documentation.

Build packages

To build all packages run:

yarn build

Run your tests

yarn run test

Lints and fixes files

yarn run lint

Publish Packages

๐Ÿ’ Note: You need to have access to the npm @tournant organisation to run this command.

Before you are able to use the integrated Lerna publishing flow the package needs to be on NPM already. We recommend np for doing so.

To publish everything run:

yarn publish:packages

Authorship

Tournant UI is maintained by Marcus and Oscar. But, in reality, this project wouldnโ€™t be possible without the amazing community that has evolved around inclusive web development. Thanks, yโ€™all.

Special thanks to Ryan Florence and the Reach UI project, from which we blatantly copied lots of the architecutural decisions and the idea itself.

Marcus Herrmann | @marcus-herrmann | www.marcus.io Oscar Braunert | @ovlb | www.ovl.design