Tekus Design System

Welcome to the Tekus Design System brought to you by Tekus UX/UI team.

• Tailored for building Tekus apps: Using the Design System results in UIs that reflect the Tekus look and feel.
• Continuously updated: As long as you’re using the latest version of the Design System, your pages are always up to date with Tekus UI changes.

Getting Started 🚀

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites 📝

First start by cloning the project into your machine, then you need to run the following command within the source path:

npm install

Finally start the storybook to view and interact with all the available components using the following command:

npm run storybook

And you will see something like this running in your local machine:

Use a component from the library

Prerequisites 📝

First you have to install the library inside the project where you want to use the component, using the following command:

npm i @tekus/design-system

Then you have to import the library component inside your component if you are working with standalone components or inside the target module of your project. Here you have an example to correctly import the search bar component from the library:

And do not forget to import inside your module or standalone component:

Once you have selected the component that you want to use and imported to your app, you can go to the storybook docs related with this specific component and click on the "show code" link:

Then you will see something like this:

Now you can copy this code and paste it directly in you html file within the app you want to use the component, as follows:

Note:

You need to ensure that you have installed all the peer dependencies related with the exact component that you want to use.

Built with 🏗️

• NPM
• Angular
• StoryBook

Contributions 🖇️

If you want to contribute to Tekus Design System, please follow these guidelines:

• Send a pull request from a branch with a meaningful name.
• Make changes using Conventional Commits for easy versioning management. You will get an error message if you don't follow this, so you can either do it manually or use a vscode extension like Conventional Commits

Versioning 🔩

We use SemVer for versioning. For the versions available, see the tags on this repository.

License

This library does not have an explicit license attached. All rights are reserved and any use or distribution is prohibited without the explicit permission of the copyright holder.

If you are interested in using, modifying, or distributing this library, please contact Tekus for more information.