open-index/open-npm huggingface dataset:
npm package: @html_first/atla-as_builder
Description: quick compact builder for @html_first packages
Author: hakim_jazuli
Latest version: 1.1.2

# atlaAS_builder

-   designed for `@html_first` packages;
-   though it might still be usefull for general usage for bundling;

## installation

```shell
npm i @html_first/atla-as_builder
```

```js
// rollup.config.mjs
// @ts-check

import { _RollupSettings, _RollupTarget } from '@html_first/atla-as_builder';

const targets = [...`_RollupTarget[]` /** array of _RollupTarget instances */];

export default new _RollupSettings(targets, [
	/** 'packages_to_resolves' optional */
]).config;
```

then save to your script

```json
{
    ...
    "scripts":{
        ...
        "build":"rollup -c",
        "watch":"rollup -c -w",
        ...
    }
    ...
}
```

which then you can trigger by

```shell
npm run build
```

or

```shell
npm run watch
```
npm package: @html_first/element_modifier
Description: simple element modifier for @html_first; client only
Author: hakim_jazuli
Latest version: 1.3.0

# element_modifier

simple client side element modifier for `@html_first` internal dependency;

## installation

```shell
npm i @html_first/element_modifier
```

## js usage example

```js
// @ts-check

import { _$ } from '@html_first/element_modifier';

const element = document.querySelector('#example_element');

new _$(element)
	.attributes({
		visibility: 'visible',
	})
	.classList({
		add: [''],
		remove: ['box'],
	}) /** chainnable with _$ methods */;
```

## method list

-   `outerHTML`:
    > -   chainable: `false`;
    > -   params:
    >     > -   `value`: `string`;
-   `innerHTML`:
    > -   chainable: `true`;
    > -   params:
    >     > -   `value`: `string`;
-   `innerText`:
    > -   chainable: `true`;
    > -   params:
    >     > -   `value`: `string`;
-   `textContent`:
    > -   chainable: `true`;
    > -   params:
    >     > -   `value`: `string`;
-   `value`:
    > -   chainable: `true`;
    > -   params:
    >     > -   `value`: `string`;
-   `styles`:
    > -   chainable: `true`;
    > -   params:
    >     > -   `styles_object`: `Object.<string,string>`;
-   `classList`:
    > -   chainable: `true`;
    > -   params:
    >     > -   `class_list_definition`: `Object.<'add'|'remove',string[]>`;
-   `append`:
    > -   chainable: `true`;
    > -   detail: will append element as last child;
    > -   params:
    >     > -   `elem`: `'HTMLElement'|'Element'`;
-   `prepend`:
    > -   chainable: `true`;
    > -   detail: will prepend element as first child;
    > -   params:
    >     > -   `elem`: `'HTMLElement'|'Element'`;
-   `before`:
    > -   chainable: `true`;
    > -   detail: will insert element before `this.element`;
    > -   params:
    >     > -   `elem`: `'HTMLElement'|'Element'`;
-   `after`:
    > -   chainable: `true`;
    > -   detail: will insert element after `this.element`;
    > -   params:
    >     > -   `elem`: `'HTMLElement'|'Element'`;
-   `attributes`:
    > -   chainable: `true`;
    > -   detail: will modify `this.element` attributes;
    > -   params:
    >     > -   `custom_attribute_n_value`: `Object.<string,string|boolean>|NamedNodeMap`;
    > -   boolean to toggle attribute;
    > -   you can get NamedNodeMap from `${your_element}.attributes`;
-   `replace`:
    > -   chainable: `false`;
    > -   params:
    >     > -   `elem`: `HTMLElement|Element`;
-   `script`:
    > -   chainable: `true`;
    > -   params:
    >     > -   `callback`: `((element:HTMLElement|Element)=>Promise<any>)`;
    > -   where `arguement_0`(`element`) is `this.element`
    > -   this method return `promise`
    >     > -   which in atlaAS case, it will block your `__Queue` and enable you to perform async
    >     >     funtions like fetching things and stuffs...;
npm package: @html_first/simple_queue
Description: base queue handler for @html_first packages
Author: hakim_jazuli
Latest version: 1.3.1

# simple_queue
-   made for queue handler for `@html_first` internals;
-   but are generally capable enough for general usages;
## how to install
```shell
npm i @html_first/simple_queue
```


<h2 id="exported-api-and-type-list">exported-api-and-type-list</h2>

- [_Queue](#_queue)

- [_QueueFIFO](#_queuefifo)

- [_QueueObject](#_queueobject)

- [_QueueObjectFIFO](#_queueobjectfifo)

<h2 id="_queue">_Queue</h2>

*) <sub>[go to exported list](#exported-api-and-type-list)</sub>

queue handler with `unique id`;

*) <sub>[go to exported list](#exported-api-and-type-list)</sub>


<h2 id="_queuefifo">_QueueFIFO</h2>

*) <sub>[go to exported list](#exported-api-and-type-list)</sub>

queue handler `first in first out`;

*) <sub>[go to exported list](#exported-api-and-type-list)</sub>


<h2 id="_queueobject">_QueueObject</h2>

*) <sub>[go to exported list](#exported-api-and-type-list)</sub>

debouncing using `unique id` in conjuction with [_Queue](#_queue);```js// @ts-checkimport { _Queue, _QueueObject } from '@html_first/simple_queue';$queue = new _Queue();$queue.assign( ...new _QueueObject({	...options}));```

*) <sub>[go to exported list](#exported-api-and-type-list)</sub>


<h2 id="_queueobjectfifo">_QueueObjectFIFO</h2>

*) <sub>[go to exported list](#exported-api-and-type-list)</sub>

debouncing `first in first out` in conjuction with [_QueueFIFO](#_queuefifo)```js// @ts-checkimport { _QueueFIFO, _QueueObjectFIFO } from '@html_first/simple_queue';$queue = new _QueueFIFO();$queue.assign( ...new _QueueObjectFIFO({	...options}));```

*) <sub>[go to exported list](#exported-api-and-type-list)</sub>
npm package: @htmlacademy/ace-themes
Description: Ace editor themes pack
Author: Sergey Kluchkovsky
Latest version: 2.0.1

# ace-themes

Темы для редактора Ace

## Как это готовить

После подключения в качестве зависимости и `npm install`, файлы тем доступны в каталоге `$PROJECT_ROOT\/node\_modules/@htmlacademy/ace-themes`. Из пакета экспортируется список файлов, в которых лежат темы.

Вот так, например, сейчас копируются темы из `courses-core`:

``` javascript
const copy = require('gulp-copy');

gulp.task('ace-themes:import', () => {
  const themesBase = 'node_modules/@htmlacademy/ace-themes';
  const themesDepth = themesBase.split('/').length;
  const themesDest = 'content/assets/js/ace';

  const srcFiles = require('@htmlacademy/ace-themes').
    map((s) => join(themesBase, s));

  return (
    gulp.
      src(srcFiles).
      pipe(copy(themesDest, {prefix: themesDepth}))
  );
});
```
npm package: @htmlacademy/bitset
Description: Functions to work with bitsets in JavaScript
Author: Igor Alexeenko
Latest version: 0.1.1

# Bitset

[![NPM version][npm-image]][npm-url]
[![Build status][travis-image]][travis-url]
[![devDependency status][devdependency-image]][devdependency-url]

Tiny library for work with bit sets in JS

## Installation

```bash
$ npm i --save @htmlacademy/bitset
```

## Examples

_TBD_

## API

_TBD_

## Author

  - [Igor Alexeenko](https://github.com/o0)

## License

The MIT License, see the included `LICENSE` file.

[npm-image]: https://img.shields.io/npm/v/@htmlacademy/bitset.svg?style=flat
[npm-url]: https://www.npmjs.com/package/@htmlacademy/bitset
[travis-image]: https://travis-ci.org/htmlacademy/bitset.js.svg?branch=master
[travis-url]: https://travis-ci.org/htmlacademy/bitset.js
[devdependency-image]: https://david-dm.org/htmlacademy/bitset.js/dev-status.svg?style=flat-square
[devdependency-url]: https://david-dm.org/htmlacademy/bitset.js?type=dev
npm package: @htmlacademy/check-editorconfig
Description: Command line interface for project files with .editorconfig
Author: zeckson
Latest version: 0.0.5

check-editorconfig
==================

Simple command line interface (CLI) for [.editorconfig](http://editorconfig.org) based on the node-lintspaces module. 
Uses `.editorconfig` by default from current directory. To change default location use `-e` argument.
Supports [GLOB format](https://github.com/isaacs/node-glob).

## Install
```
$ npm install -g @htmlacademy/check-editorconfig
```


## Help
```
zeckson@mac ~/d/editorconfig-cli (master)> check-editorconfig --help                                                                                14:54:16

  Usage: check-editorconfig [options] <file ... or 'glob'>

  Options:

    -h, --help                              output usage information
    -e, --editorconfig <file>               pass .editorconfig (by default it will look in './.editorconfig')
    -i, --ignores <profile-name or regexp>  ignoring profiles. Like ('js-comments'|'java-comments'|'xml-comments'|'html-comments'|...). Defaults are 'js-comments'|'html-comments'
    -v, --verbose                           verbose output

```

## Example Commands

Check all JavaScript files recursively, using `./.editorconfig` as settings:

```
check-editorconfig **/*.js
```

The same as above but with [GLOB format](https://github.com/isaacs/node-glob):

```
check-editorconfig '**/*.js'
```

## Ignores
lintspaces supports [built-in ignores](https://github.com/schorfES/node-lintspaces#ignores-option).

Using built in ignores can be done like so:

```
check-editorconfig -i 'js-comments' -i 'c-comments'
```

If parameters are omitted, then `js-comments` and `html-comments` are used.
npm package: @htmlacademy/cra-template
Description: The base template for projects of htmlacademy
Latest version: 1.0.4

# @htmlacademy/cra-template

Шаблон [Create React App](https://github.com/facebook/create-react-app) для курса «[React. Разработка сложных клиентских приложений](https://htmlacademy.ru/intensive/react)» от HTML Academy.

Для создания нового проекта на основе шаблона используйте ключ `--template` со значением `@htmlacademy/cra-template`:

```sh
npx create-react-app project --template @htmlacademy/cra-template

# или

yarn create-react-app project --template @htmlacademy/cra-template
```
npm package: @htmlacademy/cra-template-typescript
Description: The base template for projects of htmlacademy
Latest version: 5.1.0

# @htmlacademy/cra-template-typescript

Шаблон [Create React App](https://github.com/facebook/create-react-app) для курса «[React. Разработка сложных клиентских приложений](https://htmlacademy.ru/intensive/react)» от HTML Academy.

Для создания нового проекта на основе шаблона используйте параметр `--template` со значением `@htmlacademy/cra-template-typescript`:

```sh
npx create-react-app project --template @htmlacademy/cra-template-typescript
```
npm package: @htmlacademy/dom-check
Description: Keep all dom-related checks inside single package
Author: Tangerine Cat
Latest version: 1.3.77

@htmlacademy/dom-check
======================

DomCheck is a [node.js](http://nodejs.org) module
to check some properties of selected DOM node.

[![Build Status](https://travis-ci.com/htmlacademy/dom-check.svg?token=Uwfd9vvEaasgEt5E5Rqo&branch=master)](https://travis-ci.com/htmlacademy/dom-check)

Simple tests usage
------------------

```javascript
var DomChecker = require('@htmlacademy/dom-check');
var checker = new DomChecker(aDocument);

// returns true if document has `.some-node`
checker.node('.some-node').hasNode();

// returns true if `.div-node` is a div
checker.node('.div-node').isTag('div');

// returns true, if trimmed textContent equals `hello`
checker.node('.div-with-text').textIsEqual('hello');
```

Compare with etalon
-------------------

> Please, note that `.reset()` method is called each time before running your changes starting from version 1.3.39-2.

```javascript
var DomChecker = require('@htmlacademy/dom-check');
var checker = new DomChecker(aDocument, {
  initialCode: {
    html: '...',   // some html code
    css: '...'     // some css code
  }
});

// returns true if document has `.some-node`
checker.changeEtalon(function() {
  // After running this callback
  //   `changeEtalon()` function puts all changes
  //   into etalon document, kept in iframe
  this.html(function() {   // select html mode and
    this.                  //   change it somehow
      find('Hello').       // Find first `Hello` string
      replace('Good-bye'); //   and replace it with `Good-bye`
  });
});

// Then you may check, for example:

// Attribute value
checker.node('.hello').hasSame('@width');

// Text content
checker.node('.hello').hasSame('text()');

// Several css-properties
checker.node('.hello').hasSame('padding-{top,left}');
// You may use 'color' or 'padding-*' format.
// It works, powered by minimatch

// Also, you may check a subtree!
checker.node('.hello').hasSameSubtree();
```

Find & replace methods
----------------------
 * `find()` — finds single match to replace. Single argument may be string or regular expression
 * `findAll()` — finds every match in string to replace. Single argument may be string or regular expression. Regular expression must have a `global` flag set
 * `findLine()` — find line to replace. Argument is 1-based number.
 * `findLines()` — find lines range to replace. Both arguments are 1-based numbers.
 * `replace()` — replace selection with provided value.
 * `remove()` — alias for `replace('')`.

Methods may be chained to select some fragment(s) in specified lines:

``` javascript
etalon.changeEtalon(function() {
  this.html(function() {
    this.
      findLines(1, 5).          // Select lines from 1 to 5
      findAll(/(foo|bar)/g).    // in those lines select all `foo` and `bar`
      replace('baz');           // and replace them with `baz`
  });
});
```

When `find()` or `findAll()` are used with regexp, `replace()` argument
may be a function. Function will get a match data, and its result
will be used as a value to replace selection.
npm package: @htmlacademy/editorconfig-cli
Description: Command line interface for project files with .editorconfig
Author: zeckson
Latest version: 3.0.0

# editorconfig-cli

[![Vulnerabilities count][vulnerabilities-image]][vulnerabilities-url]

Simple command line interface (CLI) for [.editorconfig](https://editorconfig.org) based on the node-lintspaces module.

Uses `.editorconfig` by default from current directory. To change default location use `-e` argument.
Supports [GLOB format](https://github.com/isaacs/node-glob).

## Install

Globaly:

```shell
npm i -g @htmlacademy/editorconfig-cli
```

Or localy in the project:

```shell
npm i -D @htmlacademy/editorconfig-cli
```

## Help

```shell
$ npx editorconfig-cli --help

  Usage: editorconfig-cli [options] <file ... or 'glob'>

  Options:
  -e, --editorconfig <file>                   pass configuration file.
                                              !Warning! absolute paths are not supported or will break on Windows OS. (default: ".editorconfig")
  -i, --ignores <profile-name or regexp...>   ignoring profiles. Like ('js-comments'|'java-comments'|'xml-comments'|'html-comments'|...). (default: ["js-comments","html-comments"])
  -j, --json <file>                           load GLOBs from JSON file. If no input passed, then it tries to find array in package.json (default: "package.json")
  -x, --exclude <regexp...>                   exclude files by patterns. (default: [`.*\\.min\\..*`])
  -v, --verbose                               verbose output
  -h, --help                                  display help for command
```

## Example Commands

Check all files in the project except those with the `.min.` suffix and listed in `./.gitignore`, using `./.editorconfig` as the settings:

```shell
editorconfig-cli
```

The same as above, but only JavaScript files:

```shell
editorconfig-cli **/*.js
```

The same as above, but with [GLOB format](https://github.com/isaacs/node-glob):

```shell
editorconfig-cli '**/*.js'
```

Load GLOBs from `package.json`:

```shell
editorconfig-cli
```

Format of JSON with GLOBs:

File: `glob.json`

```json
{
  "editorconfig-cli": [
    "./*.html",
    "./*.json",
    "./img/**/*.svg",
    "./js/**/*.js",
    "./less/**/*.less",
    "./sass/**/*.{sass,scss}",
    "./postcss/**/*.{css,pcss}"
  ]
}
```

Pass `glob.json` to CLI:

```shell
editorconfig-cli -j glob.json
```

## Ignores

lintspaces supports [built-in ignores](https://github.com/schorfES/node-lintspaces#ignores-option).

Using built in ignores can be done like so:

```shell
editorconfig-cli -i 'js-comments' -i 'c-comments'
```

If parameters are omitted, then `js-comments` and `html-comments` are used.

[vulnerabilities-url]: https://snyk.io/test/github/htmlacademy/editorconfig-cli
[vulnerabilities-image]: https://snyk.io/test/github/htmlacademy/editorconfig-cli/badge.svg
npm package: @htmlacademy/javascript-sandbox
Description: Sandbox to evaluate javascript safely
Author: Tangerine Cat
Latest version: 1.2.23

# javascript-sandbox
Sandbox to evaluate javascript code safely

[![Build Status](https://travis-ci.org/kaineer/javascript-sandbox.svg?branch=master)](https://travis-ci.org/kaineer/javascript-sandbox)


TODO:

 * Обрабатывать ситуацию со слишком глубоким стэком (бесконечная рекурсия)
 * Возвращать код, который не будет зависать (для вставки в html)
npm package: @htmlacademy/project-search
Description: Project structure searcher
Author: Nakleikoff
Latest version: 0.2.1

# project-search

[![NPM version][npm-image]][npm-url]
[![Build status][travis-image]][travis-url]

Module to search files in your project

## Install
```bash
$ npm install @htmlacademy/project-search
```

## Usage
```js
const search = require(`@htmlacademy/project-search`);

//  Find all html files in project
search.html('/path/to/your/project').then((files) => {
  files.forEach((file) => {
    console.log(file);
  })
});
```

## API

All methods return a Promise. If the Promise resolves it returns results of search. If promise rejects it returns an error message

- **html**(projectPath) — returns an Array with all `HTML` files in project path
- **css**(projectPath) — returns an Array with all `CSS` files in project path
- **js**(projectPath) — returns an Array with all `JavaScript` files in project path
- **images**(projectPath) — returns an Array with all images in project path. Include `jpeg`, `jpg`, `png`, `gif`, `png`, `svg`, `webp`, `bmp` files;
- **styles**(projectPath) — returns an Array with all files with styles definition. Include `css`, `less`, `sass`, `scss`, `pcss`, `postcss` files;
- **type**(projectPath, type) — returns an Array of all files with `type` extension in project path
- **file**(projectPath, file) — returns one file with name `file` in project path
- **dir**(projectPath, dir) — returns an Array of all directories with name `dir`. If `dir` isn't set, returns all directories in project path

[npm-image]: https://img.shields.io/npm/v/@htmlacademy/project-search.svg?style=flat
[npm-url]: https://www.npmjs.com/package/@htmlacademy/project-search
[travis-image]: https://travis-ci.org/htmlacademy/project-search.svg?branch=master
[travis-url]: https://travis-ci.org/htmlacademy/project-search