open-index/open-npm huggingface dataset:
npm package: @fbcpck/bookmarklet
Description: A JavaScript bookmarklet compiler and demo page creator with greasemonkey userscript-like metadata options
Author: Peter Coles / FabulousCupcake
Latest version: 1.1.0

# Bookmarklet: sane development, familiar format

[![Build Status](https://travis-ci.org/mrcoles/bookmarklet.svg?branch=master)](https://travis-ci.org/mrcoles/bookmarklet)
[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)

Bookmarklet is a nodejs module for compiling bookmarklets in server-side code and directly from the shell. You can run it on any JavaScript file—it will minify it using uglify-js, wrap it in a self executing function, and return an escaped bookmarklet.

More so, it supports a metadata block—modeled after the [greasemonkey userscript metadata block](http://wiki.greasespot.net/Metadata_Block)—to specify metadata, external stylesheets and script includes, which can look like this:

    // ==Bookmarklet==
    // @name LoveGames
    // @author Old Gregg
    // @style !loadOnce https://mrcoles.com/media/css/silly.css
    // @script https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
    // ==/Bookmarklet==

Most notably, you can specify any external scripts that you’d like your bookmarklet to include via the `@script` rule, which can be repeated as many times as you’d like.

NOTE: currently with script includes you have to handle `noConflict` scenarios yourself, e.g., you might want to start off a script with `var $ = jQuery.noConflict(true)`.

In addition, any css files included with `@style` will be injected.

By default, every time the bookmark is hit, it will add the script and style tags again. You customize each one per line by adding a `!loadOnce` declaration between the `@style` or `@script` param and the path for the asset. See the example above.

As of v1.0.0, this now uses Babel with the present "env" to make the code backwards compatible before minifying it.

This project is open to suggestions & pull requests.

Also, if you’re just looking for a quick way to throw together a bookmarklet, try my [browser-based bookmarklet creator](http://mrcoles.com/bookmarklet/).

### Installation

The dependency can be found on [NPM as “bookmarklet”](https://www.npmjs.org/package/bookmarklet). You can install it with:

```bash
npm install bookmarklet
```

### Usage

You can easily see usage by running `bookmarklet -h`:

```bash
> bookmarklet -h
Bookmarklet v0.0.1 usage: bookmarklet [-d | --demo] source [destination]

-d | --demo - output a demo HTML page for sharing the bookmarklet
source      - path to file to read from or `-` for stdin
destination - path to file to write to
```

The default output is the raw bookmarlet code. _NEW_ add the `--demo` flag to output a test HTML page that includes the bookmarklet on it.

### Testing

A very basic test script can be run via `bash test/run.sh`
npm package: @fbem/core
Description: Functional BEM core
Author: Vladislav Ivanov
Latest version: 2.0.13

# @fbem/core [![npm](https://img.shields.io/npm/v/@fbem/core)](https://www.npmjs.com/package/@fbem/core)

**@fbem/core** is a core package for functional BEM.
It provides utility for parsing BEM entities into BEM structure, 
which is used for code generation.

This package is base for all other packages. Basically you shouldn't use it.

## Getting started

```console
npm i @fbem/core
```

## Types

```typescript
type NamingOptions = {
  prefix: string;
  elem: string;
  modName: string;
  modVal: string;
};

type StringMod = {
  type: 'string';
  values: Record<string, string>;
};

type BooleanMod = {
  type: 'boolean';
  value: string;
};

type Mod = StringMod | BooleanMod;

type BemParams = {
  base: string;
  mods: Record<string, Mod>;
};

type BemFunctionName = string;

type BemStructure = Record<BemFunctionName, BemParams>;

const createBemStructure: (classesMap: Record<string, string>, naming: NamingOptions) => BemStructure;

const parseBem: (className: string, naming: NamingOptions) => {
  block: string;
  elem: string;
  modName: string;
  modVal: string;
}
```

## API

### `createBemStructure: (classesMap: Record<string, string>, naming: NamingOptions) => BemStructure`

#### Description
The function is used to convert a map of CSS classes into a structure that is used for code generation.

### `parseBem: (className: string, naming: NamingOptions) => { block: string; elem: string; modName: string; modVal: string; }`

#### Description
The function is used to parse the CSS class into its constituent entities.
npm package: @fbem/typescript-plugin
Description: Functional BEM TypeScript plugin
Author: Vladislav Ivanov
Latest version: 2.0.14

# @fbem/typescript-plugin [![npm](https://img.shields.io/npm/v/@fbem/typescript-plugin)](https://www.npmjs.com/package/@fbem/typescript-plugin)

**@fbem/typescript-plugin** is a plugin for TypeScript. Plugin provides type definitions for generated BEM functions.

## Getting started

```console
npm i -D @fbem/typescript-plugin
```

**tsconfig.json**
```json
{
  "compilerOptions": {
    "plugins": [
      { 
        "name": "@fbem/typescript-plugin",
      }
    ]
  }
}
```

## Options

| Option | Description     |                   Default value                         |
|:------------:|:------:|:---------------------------------------------------------------:|
|     match    | Match pattern of what files should plugin process       |                              `"\\.css"`                             |
|    naming    | BEM naming rules for parsing CSS       | `{ "elem": "__", "modName": "\_", "modVal": "\_", "prefix": "cn" }` |
|   postcssOptions | Allows loading plugins (only supported ones) from PostCSS configuration and disable some of them    | `{ "useConfig": false, "excludePlugins": [] }`

useConfig	false	Set to true to load plugins from your PostCSS config.
excludePlugins	false	Only sync plugins are supported. Use this to set an array of async plugins to exclude (i.e. ['postcss-mixins'])

For VS Code users it's important to use [workspace version of TypeScript](https://code.visualstudio.com/docs/typescript/typescript-compiling#_using-the-workspace-version-of-typescript).

And last but not least: add a declaration (.d.ts) file with the following content into your project:
```ts
declare module '*.css';
```

## Troubleshooting

The first thing to do in case of problems is to make sure that the root of the project in the IDE is the folder with `tsconfig` file. Make sure you are using the workspace version of TypeScript. Try to restart TS server. If the problem persists, then open an issue, but please attach the TS server logs.
npm package: @fbem/utils
Description: Functional BEM utils
Author: Vladislav Ivanov
Latest version: 2.0.17

# @fbem/utils [![npm](https://img.shields.io/npm/v/@fbem/utils)](https://www.npmjs.com/package/@fbem/utils)

**@fbem/utils** is a package which contains useful utils for functional BEM.

## Getting started

```console
npm i @fbem/utils
```

## API

### `compose: (...fns: BemFunction[]) => BemFunction`

#### Description

Use this function when you have multiple style files (e.g. a separate file for each modifier) ​​to 
compose different BEM functions into one. `compose` merges interfaces fields and their types. Take a look below.

#### Example #1
```ts
import { compose } from '@fbem/utils';
// or import compose from '@fbem/utils/dist/compose';

import { cnButton as modDisabled } from './_disabled/button_disabled.css';
import { cnButton as modStyle } from './_style/button_style.css';
import { cnButton as base } from './button.css';

const cnButton = compose(base, modDisabled, modStyle);

cnButton({ style: 'flat', disabled: true }, ['mix']); // 'button button_style_flat button_disabled mix'
```

#### Example #2
```ts
import { compose } from '@fbem/utils';
// or import compose from '@fbem/utils/dist/compose';

import { cnButton as modTypePrimary } from './_type/_primary/button_type_primary.css';
import { cnButton as modTypeSecondary } from './_type/_secondary/button_type_secondary.css';
import { cnButton as base } from './button.css';

const cnButton = compose(base, modTypePrimary, modTypeSecondary);

cnButton({ type: 'primary' }); // 'button button_type_primary'
```
npm package: @fbi-js/eslint-config
Description: ESLint base config
Latest version: 1.2.2

# @fbi-js/eslint-config

ESLint config for [JavaScript Standard Style](https://standardjs.com/).

## Usage

```bash
npm i -D @fbi-js/eslint-config
```

`./package.json` (you can also use other [configuration files](https://eslint.org/docs/user-guide/configuring#using-configuration-files-1))

```json
{
  "eslintConfig": {
    "extends": ["@fbi-js"]
  }
}
```

## Included packages

- [eslint-config-standard](https://github.com/standard/eslint-config-standard): rules for JavaScript Standard Style
- [eslint-plugin-import](https://github.com/benmosher/eslint-plugin-import): support linting of ES2015+ (ES6+) import/export syntax
- [eslint-plugin-node](https://github.com/mysticatea/eslint-plugin-node): rules for Node.js
- [eslint-plugin-promise](https://github.com/xjamundx/eslint-plugin-promise): best practices for JavaScript promises

## JavaScript Standard Style Rules

- [English](https://standardjs.com/rules.html)
- [中文](https://standardjs.com/rules-zhcn.html)

## License

Licensed under [MIT](https://opensource.org/licenses/MIT).
npm package: @fbi-js/eslint-config-react
Description: ESLint config for React.js project
Latest version: 1.2.2

# @fbi-js/eslint-config-react

ESLint config for React.js project. Extends

- [@fbi-js/eslint-config](https://github.com/fbi-js/config/tree/main/packages/eslint-config)
- [eslint-config-standard-jsx](https://github.com/standard/eslint-config-standard-jsx)
- [eslint-config-standard-react](https://github.com/standard/eslint-config-standard-react)

## Usage

```bash
npm i -D @fbi-js/eslint-config-react
```

`./package.json` (you can also use other [configuration files](https://eslint.org/docs/user-guide/configuring#using-configuration-files-1))

```json
{
  "eslintConfig": {
    "extends": [
      "@fbi-js/react"
    ]
  }
}
```

## License

Licensed under [MIT](https://opensource.org/licenses/MIT).
npm package: @fbi-js/eslint-config-react-typescript
Description: ESLint config for React.js+Typescript project
Latest version: 1.2.2

# @fbi-js/eslint-config-react-typescript

ESLint config for React.js+Typescript project. Extends

- [@fbi-js/eslint-config-react](https://github.com/fbi-js/config/tree/main/packages/eslint-config-react)
- [@fbi-js/eslint-config-typescript](https://github.com/fbi-js/config/tree/main/packages/eslint-config-typescript)

## Usage

```bash
npm i -D @fbi-js/eslint-config-react-typescript
```

`./package.json` (you can also use other [configuration files](https://eslint.org/docs/user-guide/configuring#using-configuration-files-1))

```json
{
  "eslintConfig": {
    "extends": [
      "@fbi-js/react-typescript"
    ]
  }
}
```

## License

Licensed under [MIT](https://opensource.org/licenses/MIT).
npm package: @fbi-js/eslint-config-typescript
Description: ESLint config for Typescript project
Latest version: 1.2.2

# @fbi-js/eslint-config-typescript

ESLint config for Typescript project. Extends

- [@fbi-js/eslint-config](https://github.com/fbi-js/config/tree/main/packages/eslint-config)
- [@typescript-eslint/eslint-plugin](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin)

## Usage

```bash
npm i -D @fbi-js/eslint-config-typescript
```

`./package.json` (you can also use other [configuration files](https://eslint.org/docs/user-guide/configuring#using-configuration-files-1))

```json
{
  "eslintConfig": {
    "extends": ["@fbi-js/typescript"]
  }
}
```

## License

Licensed under [MIT](https://opensource.org/licenses/MIT).
npm package: @fbi-js/eslint-config-vue
Description: ESLint config for Vue.js project
Latest version: 1.2.2

# @fbi-js/eslint-config-vue

ESLint config for Vue.js project. Extends

- [@fbi-js/eslint-config](https://github.com/fbi-js/config/tree/main/packages/eslint-config)
- [eslint-plugin-vue](https://github.com/vuejs/eslint-plugin-vue)

## Usage

```bash
npm i -D @fbi-js/eslint-config-vue
```

`./package.json` (you can also use other [configuration files](https://eslint.org/docs/user-guide/configuring#using-configuration-files-1))

```json
{
  "eslintConfig": {
    "extends": ["@fbi-js/vue"]
  }
}
```

## License

Licensed under [MIT](https://opensource.org/licenses/MIT).
npm package: @fbi-js/eslint-config-vue-typescript
Description: ESLint config for Vue.js+Typescript project
Latest version: 1.2.2

# @fbi-js/eslint-config-vue-typescript

ESLint config for Vue.js+Typescript project. Extends

- [@fbi-js/eslint-config-typescript](https://github.com/fbi-js/config/tree/main/packages/eslint-config-typescript)
- [@fbi-js/eslint-config-vue](https://github.com/fbi-js/config/tree/main/packages/eslint-config-vue)

## Usage

```bash
npm i -D @fbi-js/eslint-config-vue-typescript
```

`./package.json` (you can also use other [configuration files](https://eslint.org/docs/user-guide/configuring#using-configuration-files-1))

```json
{
  "eslintConfig": {
    "extends": ["@fbi-js/vue-typescript"]
  }
}
```

## License

Licensed under [MIT](https://opensource.org/licenses/MIT).
npm package: @fbi-js/stylelint-config
Description: StyleLint config
Latest version: 1.2.2

# @fbi-js/stylelint-config

StyleLint config. Extends

- [stylelint-config-standard](https://github.com/stylelint/stylelint-config-standard)
- [stylelint-config-prettier](https://github.com/prettier/stylelint-config-prettier)

## Usage

```bash
npm i -D @fbi-js/stylelint-config
```

`./package.json` (you can also use other [configuration files](https://stylelint.io/user-guide/configure))

```json
{
  "stylelint": {
    "extends": ["@fbi-js/stylelint-config"]
  }
}
```

## License

Licensed under [MIT](https://opensource.org/licenses/MIT).
npm package: @fbi-js/tsconfig
Description: tsconfig collection
Latest version: 1.2.2

# @fbi-js/tsconfig

## Usage

```bash
npm i -D @fbi-js/tsconfig
```

`./tsconfig.json`:

- Normal typescript project

  ```json
  {
    "extends": "@fbi-js/tsconfig/base",
    "compilerOptions": {
      "outDir": "./lib"
    }
  }
  ```

- React.js typescript project

  ```json
  {
    "extends": "@fbi-js/tsconfig/react",
    "compilerOptions": {
      "baseUrl": "./",
      "outDir": "dist"
    }
  }
  ```

- Vue.js typescript project

  ```json
  {
    "extends": "@fbi-js/tsconfig/vue",
    "compilerOptions": {
      "baseUrl": "./",
      "outDir": "dist"
    },
    "include": ["src"]
  }
  ```

## License

Licensed under [MIT](https://opensource.org/licenses/MIT).
npm package: @fbi-js/webpack-config-base
Description: Webpack base config
Author: fbi
Latest version: 1.6.3

# @fbi-js/webpack-config-base

Webpack base config.

## Features

- JavaScript
- TypeScript
- SASS
- LESS
- PostCSS
- ESLint
- StyleLint

## Usage

```bash
npm i -D @fbi-js/webpack-config-base webpack@5 webpack-dev-server@next
```

- `./webpack.config.js`

  ```js
  const config = require('@fbi-js/webpack-config-base').default

  // default
  module.exports = config()

  // extends
  module.exports = {
    ...config(),
    entry: './index.js'
  }

  // with options
  module.exports = config({
    options: {
      isTs: true
    }
  })
  ```

- or `./webpack.config.ts`

  ```ts
  import config from '@fbi-js/webpack-config-base'

  // default
  export default config()

  // extends
  export default {
    ...config(),
    entry: './index.js'
  }

  // with options
  export default config({
    options: {
      isTs: true
    }
  })
  ```

## Options

```ts
interface Options {
  // project title (used by html-webpack-plugin and webpackbar)
  title?: string
  // using typescript or not
  isTs?: boolean
  // common paths config. Type: https://github.com/fbi-js/config/blob/main/packages/webpack-config-base/src/types.ts#L4
  paths: PathsConfig
  // used by webpack.DefinePlugin. https://webpack.js.org/plugins/define-plugin/
  definePluginData: Record<string, any>
  // https://webpack.js.org/configuration/optimization/
  optimization: Configuration['optimization']
  // https://webpack.js.org/configuration/performance/
  performance: Configuration['performance']
  // https://webpack.js.org/configuration/stats/
  stats: Configuration['stats']
  // https://webpack.js.org/configuration/dev-server/
  devServer: Record<string, any>
  // https://github.com/babel/babel-loader#options
  babel: Record<string, any>
  // https://github.com/webpack-contrib/css-loader#options
  css: Record<string, any>
  // https://github.com/webpack-contrib/postcss-loader#options
  postcss: Record<string, any>
  // https://github.com/webpack-contrib/sass-loader#options
  sass: Record<string, any>
  // https://github.com/webpack-contrib/less-loader#options
  less: Record<string, any>
  // https://github.com/webpack-contrib/eslint-webpack-plugin#options
  eslint: Record<string, any>
  // https://github.com/webpack-contrib/stylelint-webpack-plugin#options
  stylelint: Record<string, any>
  // https://github.com/survivejs/webpack-merge#mergewithrules
  mergeRules: MergeRules
}
```

## License

Licensed under [MIT](https://opensource.org/licenses/MIT).
npm package: @fbi-js/webpack-config-react
Description: Webpack config for React.js project
Author: fbi
Latest version: 1.4.3

# @fbi-js/webpack-config-react

Webpack config for React.js project. Extends [@fbi-js/webpack-config-base](https://github.com/fbi-js/config/blob/main/packages/webpack-config-base)

## Usage

```bash
npm i -D @fbi-js/webpack-config-react webpack@5 webpack-dev-server@next
```

- `./webpack.config.js`

  ```js
  const config = require('@fbi-js/webpack-config-react').default

  // default
  module.exports = config()

  // extends
  module.exports = {
    ...config(),
    entry: './index.js'
  }

  // with options
  module.exports = config({
    options: {
      isTs: true
    }
  })
  ```

- or `./webpack.config.ts`

  ```ts
  import config from '@fbi-js/webpack-config-react'

  // default
  export default config()

  // extends
  export default {
    ...config(),
    entry: './index.js'
  }

  // with options
  export default config({
    options: {
      isTs: true
    }
  })
  ```

## [Options](https://github.com/fbi-js/config/blob/main/packages/webpack-config-base/README.md#options)

## License

Licensed under [MIT](https://opensource.org/licenses/MIT).
npm package: @fbi-js/webpack-config-vue
Description: Webpack config for Vue.js project
Author: fbi
Latest version: 1.4.3

# @fbi-js/webpack-config-vue

Webpack config for Vue.js project. Extends [@fbi-js/webpack-config-base](https://github.com/fbi-js/config/blob/main/packages/webpack-config-base)

## Usage

```bash
npm i -D @fbi-js/webpack-config-vue webpack@5 webpack-dev-server@next
```

- `./webpack.config.js`

  ```js
  const config = require('@fbi-js/webpack-config-vue').default

  // default
  module.exports = config()

  // extends
  module.exports = {
    ...config(),
    entry: './index.js'
  }

  // with options
  module.exports = config({
    options: {
      isTs: true
    }
  })
  ```

- or `./webpack.config.ts`

  ```ts
  import config from '@fbi-js/webpack-config-vue'

  // default
  export default config()

  // extends
  export default {
    ...config(),
    entry: './index.js'
  }

  // with options
  export default config({
    options: {
      isTs: true
    }
  })
  ```

## [Options](https://github.com/fbi-js/config/blob/main/packages/webpack-config-base/README.md#options)

## `svg` usage

```bash
<template>
  <div>
    <Logo width="60" />
    <div class="bg-svg" />
  </div>
</template>

<script lang="ts">
  import Logo from '@/assets/img/logo.svg'

  export default {
    components: {
      Logo
    }
  }
</script>

<style scoped lang="scss">
  .bg-svg {
    background-image: url('~@/assets/img/logo.svg?inline'); // `?inline` is required
  }
</style>
```

## License

Licensed under [MIT](https://opensource.org/licenses/MIT).
npm package: @fbkl/viola
Description: Patch Element component chalk theme.
Author: yi.shyang@ele.me
Latest version: 2.20.1

# @shadoll/viola
> element component chalk theme.


## Installation
```shell
npm i @shadoll/viola -S
```

## Usage

отличие от обычного пакета

- объявляете переменные верхнего класса
```scss
// sass | scss

// mix
$viola-core: 'fk-tomato'; // без точки
$namespace: #{$viola-core+' .el'};
$namespace2: #{$viola-core+'.el'};

// optional
$--color-primary: violet;
```
обратить внимание на переменную `$core-class` - название класса (без точки)
`$namespace` и `$namespace2` - служебные (нужны для sass @mixin)

- после переменных импортируете пакет на верхнем уровне
```scss
// sass | scss
@import "~@shadoll/viola/src";
```

---

если не будете использовать эти особенности - не рекомендую использовать этот 
пакет взамен обычного `element-theme-chalk` , так как тут он немного "раздувается".

ниже документация от родного пакета `element-theme-chalk`

Use Sass import
```css
@import '@shadoll/viola';
```

Or Use webpack
```javascript
import '@shadoll/viola';
```

Or
```html
<link rel="stylesheet" href="path/to/node_modules/@shadoll/viola/lib/index.css">
```

##  Import on demand
```javascript
import '@shadoll/viola/lib/input.css';
import '@shadoll/viola/lib/select.css';

// ...
```
npm package: @fbl-plugins/crypto
Description: FBL file encryption/decryption plugin
Author: FireBlink LTD
Latest version: 1.4.1

# FBL Plugins: Crypto

Encrypt/decrypt files with ease in your [fbl](https://fbl.fireblink.com) flows.

[![Tests](https://github.com/FireBlinkLTD/fbl-plugins-crypto/workflows/Tests/badge.svg)](https://github.com/FireBlinkLTD/fbl-plugins-crypto/actions?query=workflow%3ATests)
[![Known Vulnerabilities](https://snyk.io/test/github/FireBlinkLTD/fbl-plugins-crypto/badge.svg)](https://snyk.io/test/github/FireBlinkLTD/fbl-plugins-crypto)
[![codecov](https://codecov.io/gh/FireBlinkLTD/fbl-plugins-crypto/branch/master/graph/badge.svg)](https://codecov.io/gh/FireBlinkLTD/fbl-plugins-crypto)
[![Total alerts](https://img.shields.io/lgtm/alerts/g/FireBlinkLTD/fbl-plugins-crypto.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/FireBlinkLTD/fbl-plugins-crypto/alerts/)
[![Language grade: JavaScript](https://img.shields.io/lgtm/grade/javascript/g/FireBlinkLTD/fbl-plugins-crypto.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/FireBlinkLTD/fbl-plugins-crypto/context:javascript)

## Integration

There are multiple ways how plugin can be integrated into your flow.

### package.json

This is the most recommended way. Create `package.json` next to your flow file with following content:

```json
{
  "name": "flow-name",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "fbl": "fbl"
  },
  "license": "UNLICENSED",
  "dependencies": {
    "@fbl-plugins/crypto": "1.1.0",
    "fbl": "1.7.0"
  }
}
```

Then you can install dependencies as any other node module `yarn install` depending on the package manager of your choice.

After that you can use `yarn fbl <args>` to execute your flow or even register a custom script inside "scripts".

### Global installation

`npm i -g @fbl-plugins/crypto`

### Register plugin to be accessible by fbl

- via cli: `fbl -p @fbl-plugins/crypto <args>`
- via flow:

```yaml
requires:
  fbl: '>=1.7.0'
  plugins:
    '@fbl-plugins/crypto': '>=1.1.0'

pipeline:
  # your flow goes here
```

## Action Handlers

- [encrypt](docs/encrypt.md)
- [decrypt](docs/decrypt.md)

## Template Utilities

- [password generator](docs/templateUtilities.md)
npm package: @fbl-plugins/html-to-img
Description: fbl plugin to generate images based on HTML files
Author: FireBlink LTD
Latest version: 1.2.1

# FBL Plugins: HTML to Image

Allows to convert any HTML document into image inside [fbl](https://fbl.fireblink.com) flow.

[![Tests](https://github.com/FireBlinkLTD/fbl-plugins-html-to-img/workflows/Tests/badge.svg)](https://github.com/FireBlinkLTD/fbl-plugins-html-to-img/actions?query=workflow%3ATests)
[![Known Vulnerabilities](https://snyk.io/test/github/FireBlinkLTD/fbl-plugins-html-to-img/badge.svg)](https://snyk.io/test/github/FireBlinkLTD/fbl-plugins-html-to-img)
[![codecov](https://codecov.io/gh/FireBlinkLTD/fbl-plugins-html-to-img/branch/master/graph/badge.svg)](https://codecov.io/gh/FireBlinkLTD/fbl-plugins-html-to-img)
[![Total alerts](https://img.shields.io/lgtm/alerts/g/FireBlinkLTD/fbl-plugins-html-to-img.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/FireBlinkLTD/fbl-plugins-html-to-img/alerts/)
[![Language grade: JavaScript](https://img.shields.io/lgtm/grade/javascript/g/FireBlinkLTD/fbl-plugins-html-to-img.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/FireBlinkLTD/fbl-plugins-html-to-img/context:javascript)

## Integration

There are multiple ways how plugin can be integrated into your flow.

### package.json

This is the most recommended way. Create `package.json` next to your flow file with following content:

```json
{
  "name": "flow-name",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "fbl": "fbl"
  },
  "license": "UNLICENSED",
  "dependencies": {
    "@fbl-plugins/html-to-img": "1.0.0",
    "fbl": "1.9.2"
  }
}
```

Then you can install dependencies as any other node module `yarn install` depending on the package manager of your choice.

After that you can use `yarn fbl <args>` to execute your flow or even register a custom script inside "scripts".

### Global installation

`npm i -g @fbl-plugins/html-to-img`

### Register plugin to be accessible by fbl

- via cli: `fbl -p @fbl-plugins/html-to-img <args>`
- via flow:

```yaml
requires:
  fbl: '>=1.9.2'
  plugins:
    '@fbl-plugins/html-to-img': '>=1.0.0'

pipeline:
  # your flow goes here
```

## Documentation

Read more [here](docs/README.md).
npm package: @fbl-plugins/html-to-pdf
Description: fbl plugin to generate PDF documents based on HTML files
Author: FireBlink LTD
Latest version: 1.3.1

# FBL Plugins: HTML to PDF

Allows to convert any HTML document into PDF file inside [fbl](https://fbl.fireblink.com) flow.

[![Tests](https://github.com/FireBlinkLTD/fbl-plugins-html-to-pdf/workflows/Tests/badge.svg)](https://github.com/FireBlinkLTD/fbl-plugins-html-to-pdf/actions?query=workflow%3ATests)
[![Known Vulnerabilities](https://snyk.io/test/github/FireBlinkLTD/fbl-plugins-html-to-pdf/badge.svg)](https://snyk.io/test/github/FireBlinkLTD/fbl-plugins-html-to-pdf)
[![codecov](https://codecov.io/gh/FireBlinkLTD/fbl-plugins-html-to-pdf/branch/master/graph/badge.svg)](https://codecov.io/gh/FireBlinkLTD/fbl-plugins-html-to-pdf)
[![Total alerts](https://img.shields.io/lgtm/alerts/g/FireBlinkLTD/fbl-plugins-html-to-pdf.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/FireBlinkLTD/fbl-plugins-html-to-pdf/alerts/)
[![Language grade: JavaScript](https://img.shields.io/lgtm/grade/javascript/g/FireBlinkLTD/fbl-plugins-html-to-pdf.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/FireBlinkLTD/fbl-plugins-html-to-pdf/context:javascript)

## Integration

There are multiple ways how plugin can be integrated into your flow.

### package.json

This is the most recommended way. Create `package.json` next to your flow file with following content:

```json
{
  "name": "flow-name",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "fbl": "fbl"
  },
  "license": "UNLICENSED",
  "dependencies": {
    "@fbl-plugins/html-to-pdf": "1.0.2",
    "fbl": "1.9.2"
  }
}
```

Then you can install dependencies as any other node module `yarn install` depending on the package manager of your choice.

After that you can use `yarn fbl <args>` to execute your flow or even register a custom script inside "scripts".

### Global installation

`npm i -g @fbl-plugins/html-to-pdf`

### Register plugin to be accessible by fbl

- via cli: `fbl -p @fbl-plugins/html-to-pdf <args>`
- via flow:

```yaml
requires:
  fbl: '>=1.9.2'
  plugins:
    '@fbl-plugins/html-to-pdf': '>=1.0.2'

pipeline:
  # your flow goes here
```

## Documentation

Read more [here](docs/README.md).
npm package: @fbl-plugins/http
Description: fbl plugin to make http requests
Author: FireBlink LTD
Latest version: 1.5.1

# FBL Plugins: HTTP Request

Make REST calls. Submit forms, upload and download files through HTTP(s) protocol. All these and a little bit more you can do with HTTP plugin for [fbl](https://fbl.fireblink.com).

[![Tests](https://github.com/FireBlinkLTD/fbl-plugins-http/workflows/Tests/badge.svg)](https://github.com/FireBlinkLTD/fbl-plugins-http/actions?query=workflow%3ATests)
[![Known Vulnerabilities](https://snyk.io/test/github/FireBlinkLTD/fbl-plugins-http/badge.svg)](https://snyk.io/test/github/FireBlinkLTD/fbl-plugins-http)
[![codecov](https://codecov.io/gh/FireBlinkLTD/fbl-plugins-http/branch/master/graph/badge.svg)](https://codecov.io/gh/FireBlinkLTD/fbl-plugins-http)
[![Total alerts](https://img.shields.io/lgtm/alerts/g/FireBlinkLTD/fbl-plugins-http.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/FireBlinkLTD/fbl-plugins-http/alerts/)
[![Language grade: JavaScript](https://img.shields.io/lgtm/grade/javascript/g/FireBlinkLTD/fbl-plugins-http.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/FireBlinkLTD/fbl-plugins-http/context:javascript)

## Integration

There are multiple ways how plugin can be integrated into your flow.

### package.json

This is the most recommended way. Create `package.json` next to your flow file with following content:

```json
{
  "name": "flow-name",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "fbl": "fbl"
  },
  "license": "UNLICENSED",
  "dependencies": {
    "@fbl-plugins/http": "1.1.1",
    "fbl": "1.8.0"
  }
}
```

Then you can install dependencies as any other node module `yarn install` depending on the package manager of your choice.

After that you can use `yarn fbl <args>` to execute your flow or even register a custom script inside "scripts".

### Global installation

`npm i -g @fbl-plugins/http`

### Register plugin to be accessible by fbl

- via cli: `fbl -p @fbl-plugins/http <args>`
- via flow:

```yaml
requires:
  fbl: '>=1.8.0'
  plugins:
    '@fbl-plugins/http': '>=1.1.1'

pipeline:
  # your flow goes here
```

## Documentation

Read more [here](docs/README.md).
npm package: @fbo/spaces
Description: A spacing library using custom properties
Author: Ralf Hortt
Latest version: 1.0.0

# Spaces

| Bezeichnung / Auflösung |       | >= 768 | >= 1024 | >= 1440 | >= 1920 |
|-------------------------|-------|--------|---------|---------|---------|
| xxxs                    |    4  |     4  |     4   |     4   |     4   |
| xxs                     |    8  |     8  |     8   |     8   |     8   |
| xs                      |   12  |    12  |    12   |    12   |    12   |
| s                       |   16  |    16  |    16   |    16   |    16   |
| ms                      |   24  |    24  |    24   |    24   |    24   |
| m                       |   32  |    32  |    36   |    36   |    42   |
| l                       |   36  |    36  |    42   |    48   |    54   |
| xl                      |   42  |    42  |    54   |    64   |    76   |
| xxl                     |   48  |    54  |    64   |    76   |    96   |
| xxxl                    |   54  |    64  |    76   |    96   |   128   |

![Spaces Graph](https://fbogmbh.github.io/Spaces/img/spaces-graph.png)

## Installation

`bower install spaces --save`

## Usage

```css
var(--spaces-xxxs)
var(--spaces-xxs)
var(--spaces-xs)
var(--spaces-s)
var(--spaces-ms)
var(--spaces-m)
var(--spaces-l)
var(--spaces-xl)
var(--spaces-xxl)
var(--spaces-xxxl)
```

## Example
```css
.element {
  padding: var(--space-xxxs)
}
```
npm package: @fbomb-finance/exchange-sdk
Description: 🛠 An SDK for building applications on top of fBOMB exchange.
Latest version: 1.0.8

# Pancakeswap SDK

[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
[![Actions Status](https://github.com/pancakeswap/pancakeswap-sdk/workflows/CI/badge.svg)](https://github.com/pancakeswap/pancakeswap-sdk)
[![npm version](https://img.shields.io/npm/v/@pancakeswap-lib/sdk/latest.svg)](https://www.npmjs.com/package/@pancakeswap-lib/sdk/v/latest)

## Running tests

To run the tests, follow these steps. You must have at least node v10 and [yarn](https://yarnpkg.com/) installed.

First clone the repository:

```sh
git clone https://github.com/pancakeswap/pancakeswap-sdk.git
```

Move into the pancakeswap-sdk working directory

```sh
cd pancakeswap-sdk/
```

Install dependencies

```sh
yarn install
```

Run tests

```sh
yarn test
```

You should see output like the following:

```sh
yarn run v1.22.4
$ tsdx test
 PASS  test/constants.test.ts
 PASS  test/pair.test.ts
 PASS  test/fraction.test.ts
 PASS  test/miscellaneous.test.ts
 PASS  test/entities.test.ts
 PASS  test/trade.test.ts

Test Suites: 1 skipped, 6 passed, 6 of 7 total
Tests:       3 skipped, 82 passed, 85 total
Snapshots:   0 total
Time:        5.091s
Ran all test suites.
✨  Done in 6.61s.
```
npm package: @fbomb-finance/uikit
Description: Set of UI components for fbomb projects
Latest version: 0.41.11

# 🥞 Pancake UIkit

[![Version](https://img.shields.io/npm/v/@pancakeswap-libs/uikit)](https://www.npmjs.com/package/@pancakeswap-libs/uikit) [![Size](https://img.shields.io/bundlephobia/min/@pancakeswap-libs/uikit)](https://www.npmjs.com/package/@pancakeswap-libs/uikit)

fBOMB UIkit is a set of React components and hooks used to build pages on fBOMB's apps. It also contains a theme file for dark and light mode.

## Install

`yarn add @fbomb-finance/uikit`

## Setup

### Theme

Before using Pancake UIkit, you need to provide the theme file to styled-component.

```
import { ThemeProvider } from 'styled-components'
import { light, dark } from '@fbomb-finance/uikit'
...
<ThemeProvider theme={isDark}>...</ThemeProvider>
```

### Reset

A reset CSS is available as a global styled component.

```
import { ResetCSS } from '@fbomb-finance/uikit'
...
<ResetCSS />
```

### Types

This project is built with Typescript and export all the relevant types.

## How to use the UIkit

If you want to use components from the UIkit, check the [Storybook documentation](https://pancakeswap.github.io/pancake-uikit/)
npm package: @fbomb-finance/uikit-v2
Description: Set of UI components for fbomb projects
Latest version: 0.42.18

# FBomb UIkit

fBOMB UIkit is a set of React components and hooks used to build pages on fBOMB's apps. It also contains a theme file for dark and light mode.

## Install

`yarn add @fbomb-finance/uikit`

## Setup

### Theme

Before using FBomb UIkit, you need to provide the theme file to styled-component.

```
import { ThemeProvider } from 'styled-components'
import { light, dark } from '@fbomb-finance/uikit'
...
<ThemeProvider theme={isDark}>...</ThemeProvider>
```

### Reset

A reset CSS is available as a global styled component.

```
import { ResetCSS } from '@fbomb-finance/uikit'
...
<ResetCSS />
```

### Types

This project is built with Typescript and export all the relevant types.

## How to use the UIkit

If you want to use components from the UIkit, check the [Storybook documentation](https://fbomb-finance.github.io/fbomb-uikit/)