Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add css-api #515

Merged
merged 4 commits into from
Sep 23, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
54 changes: 27 additions & 27 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
**english** | [русский](https://github.com/yandex-cloud/yfm-transform/blob/master/README.ru.md)
- - -

---

[![NPM version](https://img.shields.io/npm/v/@diplodoc/transform.svg?style=flat)](https://www.npmjs.org/package/@diplodoc/transform)

Expand All @@ -11,49 +12,49 @@ Use it in your code to work with text during program execution. For example, to

1. Install a package:

```shell
npm i @diplodoc/transform
```
```shell
npm i @diplodoc/transform
```

1. Add the package in your code using the `require()` or `import()` function:

```javascript
const transform = require('@diplodoc/transform');
```
```javascript
const transform = require('@diplodoc/transform');
```

1. To ensure text is displayed properly, add CSS styles and client scripts to the project:

```css
@import '~@diplodoc/transform/dist/css/yfm.css';
```
```css
@import '~@diplodoc/transform/dist/css/yfm.css';
```

```javascript
import '@diplodoc/transform/dist/js/yfm';
```
```javascript
import '@diplodoc/transform/dist/js/yfm';
```

## Usage {#use}

The package provides the `transform()` function:

* Input data: [Settings](settings.md) and a string with YFM.
* Returned value: An object with the `result` and `logs` fields.
- Input data: [Settings](settings.md) and a string with YFM.
- Returned value: An object with the `result` and `logs` fields.

### Result field

`result`: Resulting object, contains the fields:

* `html`: A line with HTML.
* `meta`: [Metadata](../../syntax/meta.md#meta) from the transmitted content.
* `title`: The document title. Returned if `extractTitle = true` or `needTitle = true`.
* `headings`: A list of document headers.
- `html`: A line with HTML.
- `meta`: [Metadata](../../syntax/meta.md#meta) from the transmitted content.
- `title`: The document title. Returned if `extractTitle = true` or `needTitle = true`.
- `headings`: A list of document headers.

### Logs field

`logs`: Information about the transformation process, includes arrays:

* `error`: Errors.
* `warn`: Warnings.
* `info`: Additional information.
- `error`: Errors.
- `warn`: Warnings.
- `info`: Additional information.

### Example of a function invocation

Expand All @@ -62,15 +63,14 @@ const fs = require('fs');
const transform = require('@diplodoc/transform');

const content = fs.readFileSync(filePath, 'utf');
const vars = { user: { name: 'Alice' } };
const vars = {user: {name: 'Alice'}};

const {
result: {html, meta, title, headings},
logs,
} = transform(content, {vars});
result: {html, meta, title, headings},
logs,
} = transform(content, {vars});
```

## License

MIT

57 changes: 30 additions & 27 deletions README.ru.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
**русский** | [english](https://github.com/yandex-cloud/yfm-transform/blob/master/README.md)
- - -

---

[![NPM version](https://img.shields.io/npm/v/@diplodoc/transform.svg?style=flat)](https://www.npmjs.org/package/@diplodoc/transform)

Expand All @@ -11,46 +12,49 @@

1. Установите пакет:

```shell
npm i @diplodoc/transform
```
```shell
npm i @diplodoc/transform
```

1. Подключите пакет в своем коде, используя функцию `require()` или `import()`:

```javascript
const transform = require('@diplodoc/transform');
```
```javascript
const transform = require('@diplodoc/transform');
```

1. Для корректного отображения подключите в проект CSS-стили и клиентские скрипты:

```css
@import '~@diplodoc/transform/dist/css/yfm.css';
```
```css
@import '~@diplodoc/transform/dist/css/yfm.css';
```

```javascript
import '@diplodoc/transform/dist/js/yfm';
```
```javascript
import '@diplodoc/transform/dist/js/yfm';
```

## Использование {#use}

Пакет предоставляет функцию `transform()`:
* входные данные — строка с YFM и [настройки](settings.md);
* возвращаемое значение — объект с полями `result` и `logs`.

- входные данные — строка с YFM и [настройки](settings.md);
- возвращаемое значение — объект с полями `result` и `logs`.

### Поле result

`result` — объект результата, содержит поля:
* `html` — строка с HTML.
* `meta` — [метаданные](../../syntax/meta.md#meta) из переданного контента.
* `title` — заголовок документа. Возвращается, если заданы настройки `extractTitle = true` или `needTitle = true`.
* `headings` — список заголовков документа.

- `html` — строка с HTML.
- `meta` — [метаданные](../../syntax/meta.md#meta) из переданного контента.
- `title` — заголовок документа. Возвращается, если заданы настройки `extractTitle = true` или `needTitle = true`.
- `headings` — список заголовков документа.

### Поле logs

`logs` — информация о процессе трансформации, включает массивы:
* `error` — ошибки.
* `warn` — предупреждения.
* `info` — дополнительная информация.

- `error` — ошибки.
- `warn` — предупреждения.
- `info` — дополнительная информация.

### Пример вызова функции

Expand All @@ -59,15 +63,14 @@ const fs = require('fs');
const transform = require('@diplodoc/transform');

const content = fs.readFileSync(filePath, 'utf');
const vars = { user: { name: 'Alice' } };
const vars = {user: {name: 'Alice'}};

const {
result: {html, meta, title, headings},
logs,
} = transform(content, {vars});
result: {html, meta, title, headings},
logs,
} = transform(content, {vars});
```


## License

MIT
Loading
Loading