# Шаблоны

## 0. Введение

TODO

## 1. Файлы с исходным кодом

TODO

## 2. Форматирование

### 2.1. Переносы

### 2.1.1 Тег

Перенос тега (разрывать тег) стоит, если:

1. Он выходит за установленную виртуальную границу (`120` символов).
2. Хотя бы один атрибут содержит выражения из нескольких операндов.
3. Тег включает более 3 атрибутов.

Если строка с тегом требует переноса, то переносить необходимо все атрибуты. При этом первый из них должен быть записан на следующей строке с одним отступом:

```markup
    <!--Хорошо-->
    <component name="Name" title="TITLE" value="performer"></component>

    <!--Хорошо-->
    <component
        name="Name"
        title="TITLE"
        data="some data"
        value="performer"
        onclick="console.log(event)"
    />

    <!--Плохо-->
    <!--Вариант неудачен тем, что при изменении длины первой строки приходится исправлять отступы для всех других строк.-->
    <!--Во-первых, это рутинная операциях, во-вторых, её не все делают, -->
    <!--во-вторых, иногда форматирование портится незаметно при автоматизированной замене, -->
    <!--например, названия компонента/блока/элемента.-->
    <component name="Name"
               title="TITLE"
               data="some data"
               value="performer"
               onclick="console.log(event)"></component>

    <!--Плохо-->
    <!--Вариант неудачен тем, что читать становится довольно сложновато. Наибольшие проблемы появляются при ревью изменений. -->
    <!--Они не очень наглядны в таких длинных строках, их просмотр становится более трудоёмким.-->
    <component name="Name" title="TITLE" value="performer" data="some data" type="text" mode="primary" onclick="console.log(event)" onfocus="onfocus()" onmouseleave="onmouseleave"></component>
```

### 2.1.2 Содержимое тега

Недопустимо оставлять содержимое тега на одной строке с закрывающей скобкой тега.

```markup
    <!--Плохо-->
    <component
        name="Name"
        title="TITLE"
        data="some data"
        value="performer"
        onclick="console.log(event)"
    >Info</component>

    <!--Хорошо-->
    <component
        name="Name"
        title="TITLE"
        data="some data"
        value="performer"
        onclick="console.log(event)"
    >
        Info
    </component>
```

## 3. Использование возможностей языка

### 3.1.1. Пустой тег

Если технически это возможно, т.е. мы технически можем так записать и такой вариант поддерживается устройствами пользователей, то пустой тег записывать без закрывающего тега.

```markup
    <!--Плохо-->
    <component></component>

    <!--Хорошо (при наличии технической возможности)-->
    <component/>
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://eigenspace.gitbook.io/dev-standards/ru/templates.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.