open-index/open-npm huggingface dataset:
npm package: @seatentacle/design-tokens
Description: Design tokens are a set of visual design attributes needed to create custom themes
Author: Dmitry Gusarov
Latest version: 1.1.0

# SeaTentacle Design Tokens

[![GitHub license](https://img.shields.io/github/license/seatentacle/design-tokens?style=flat-square)](https://github.com/seatentacle/design-tokens/blob/master/LICENSE)
[![NPM Version](https://img.shields.io/npm/v/@seatentacle/design-tokens?style=flat-square)](https://www.npmjs.com/package/@seatentacle/design-tokens)
[![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg?style=flat-square)](https://github.com/semantic-release/semantic-release)

Design tokens are a set of visual design attributes needed to create custom themes. It should be used instead literal values such as background colors, font size, etc.

## Installation

Run the npm command to add the package to your project.

```sh
npm i --save @seatentacle/design-tokens
```

## Usage

The first step is to add the package import to the file where you want to use design tokens.

To use standard tokens, just copy this line to the top of your file.

```js
import { defaultTokens } from '@seatentacle/design-tokens'
```

You can call the token you need by simply typing `defaultTokens` and using dot-notation, continue typing the name of the desired token, for example: `defaultTokens.backgroundButtonInfo`.

## Format

Tokens are wratten in JavaScript and primarily intended for use with `css-in-js` libraries such as [styled-components](https://styled-components.com). Also, for the convenience of using tokens in TypeScript, the package contains the declaration files `.d.ts`.

## License

The code is licensed under [MIT](https://github.com/seatentacle/design-tokens/blob/master/LICENSE)
npm package: @seatentacle/eslint-plugin
Description: An opensource collection of ESlint configs used by SeaTentacle
Author: Dmitry Gusarov
Latest version: 1.2.0

# SeaTentacle ESLint Plugin

[![GitHub license](https://img.shields.io/github/license/seatentacle/eslint-plugin?style=flat-square)](https://github.com/seatentacle/eslint-plugin/blob/master/LICENSE)
[![NPM Version](https://img.shields.io/npm/v/@seatentacle/eslint-plugin?style=flat-square)](https://www.npmjs.com/package/@seatentacle/eslint-plugin)
[![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg?style=flat-square)](https://github.com/semantic-release/semantic-release)

## Installation

The plugin uses [`@typescript-eslint/parser`](https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/parser) even for javascript projects.

```sh
npm i --save-dev @seatentacle/eslint-plugin
```

**Note: make sure that your project has [`typescript`](https://www.npmjs.com/package/typescript) and [`eslint`](https://www.npmjs.com/package/eslint) installed.**

## Usage

Add `@seatentacle` to the _plugins_ section of a `.eslintrc` file. In the _extends_ section add the desired config.

```json
{
  "plugin": [
    "@seatentacle"
  ],
  "extends": [
    "plugin:@eseatentacle/javascript"
  ]
}
```

**Note: make sure the appropriate extensions are passed in the `eslint` command. By default, `eslint` searches only for `.js` files.**

## Configs

The plugin contains two configs:

* `plugin:@seatentacle/javascript` describes general rules
* `plugin:@seatentacle/typescript` contains javascript config and rules specific for TS

## License

The code is licensed under [MIT](https://github.com/seatentacle/eslint-plugin/blob/master/LICENSE).