Skip to content

Commit

Permalink
update docs
Browse files Browse the repository at this point in the history
  • Loading branch information
uvarov-frontend committed Nov 7, 2023
1 parent 93f0441 commit 281fbad
Show file tree
Hide file tree
Showing 6 changed files with 138 additions and 6 deletions.
44 changes: 44 additions & 0 deletions docs/en/reference/additionally/actions.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -197,3 +197,47 @@ This method triggers during the calendar initialization and any changes. It prov
- `date` - the full date in the `YYYY-MM-DD` format;
- `HTMLElement` - the parent (wrapper) HTML element of the day;
- `HTMLButtonElement` - the child (button) HTML element of the day.

---

## actions.hideCalendar()

`Type: Function`

`Default: null`

`Options: hideCalendar(HTMLInputElement, HTMLElement) => void | null`

```js
new VanillaCalendar('#calendar', {
actions: {
hideCalendar(HTMLInputElement, HTMLElement) {},
},
});
```

This method triggers when the calendar is hiding, but only if the <a href="/docs/reference/main/main-settings#input">`input`</a> parameter is set to `true`.
- `HTMLInputElement` - represents the root HTML element, which is an input field;
- `HTMLElement` - root HTML element of the calendar.

---

## actions.showCalendar()

`Type: Function`

`Default: null`

`Options: showCalendar(HTMLInputElement, HTMLElement) => void | null`

```js
new VanillaCalendar('#calendar', {
actions: {
showCalendar(HTMLInputElement, HTMLElement) {},
},
});
```

This method triggers when displaying the calendar to the user, but only if the <a href="/docs/reference/main/main-settings#input">`input`</a> parameter is set to `true`.
- `HTMLInputElement` - represents the root HTML element, which is an input field;
- `HTMLElement` - root HTML element of the calendar.
13 changes: 11 additions & 2 deletions docs/en/reference/main/initialize-and-update.mdx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# Initialization, Update, and Reset
# Initialization, Update, Reset, and Destroy

The `init()` method is the main method of the instance, which initiates the calendar's initialization process.

Expand All @@ -9,7 +9,8 @@ calendar.init();

It's essential to note that you also have the ability to update the calendar with new settings at any time using the `update()` or `reset()` methods.

Unlike `reset()`, the `update()` method preserves the user-selected dates, month, and year after the update.
- The `update()` method allows you to apply new settings to the calendar while preserving the user-selected dates, month, and year after the update.
- The `reset()` method completely resets the calendar to its initial state, discarding any user-selected dates.

Example of usage:

Expand All @@ -21,3 +22,11 @@ calendar.update();
// or
calendar.reset();
```

Additionally, if you want to completely remove the calendar instance, you can use the `destroy()` method.

Example of usage:

```js
calendar.destroy();
```
13 changes: 13 additions & 0 deletions docs/en/reference/main/readonly-options.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,19 @@ The `HTMLElement` property contains the root HTML element in which the calendar

- - -

## HTMLOriginalElement

`Type: HTMLElement`

```js
const calendar = new VanillaCalendar('#calendar');
console.log(calendar.HTMLOriginalElement);
```

The `HTMLOriginalElement` property contains the original root HTML element without any modifications, in which the calendar was initialized.

- - -

## HTMLInputElement

`Type: HTMLElement`
Expand Down
44 changes: 44 additions & 0 deletions docs/ru/reference/additionally/actions.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -200,3 +200,47 @@ new VanillaCalendar('#calendar', {
- `date` - полная дата в формате `YYYY-MM-DD`;
- `HTMLElement` - родительский (обертка) HTML-элемент дня;
- `HTMLButtonElement` - дочерний (кнопка) HTML-элемент дня.

---

## actions.hideCalendar()

`Type: Function`

`Default: null`

`Options: hideCalendar(HTMLInputElement, HTMLElement) => void | null`

```js
new VanillaCalendar('#calendar', {
actions: {
hideCalendar(HTMLInputElement, HTMLElement) {},
},
});
```

Этот метод срабатывает при скрытии календаря, но только если для параметра <a href="/docs/reference/main/main-settings#input">`input`</a> установлено значение `true`.
- `HTMLInputElement` - представляет корневой элемент HTML, который является полем ввода;
- `HTMLElement` - корневой HTML-элемент календаря.

---

## actions.showCalendar()

`Type: Function`

`Default: null`

`Options: showCalendar(HTMLInputElement, HTMLElement) => void | null`

```js
new VanillaCalendar('#calendar', {
actions: {
showCalendar(HTMLInputElement, HTMLElement) {},
},
});
```

Этот метод срабатывает при отображении календаря пользователю, но только если для параметра <a href="/docs/reference/main/main-settings#input">`input`</a> установлено значение `true`.
- `HTMLInputElement` - представляет корневой элемент HTML, который является полем ввода;
- `HTMLElement` - корневой HTML-элемент календаря.
17 changes: 13 additions & 4 deletions docs/ru/reference/main/initialize-and-update.mdx
Original file line number Diff line number Diff line change
@@ -1,15 +1,16 @@
# Инициализация, Обновление и Сброс
# Инициализация, Обновление, Сброс и Уничтожение

Метод `init()` - это основной метод экземпляра, который запускает процесс инициализации календаря.
Метод `init()` является основным методом экземпляра, который запускает процесс инициализации календаря.

```js
const calendar = new VanillaCalendar(element, params);
calendar.init();
```

Важно отметить, что вы также имеете возможность обновлять календарь с новыми настройками в любой момент, используя методы `update()` или `reset()`.
Важно отметить, что у вас также есть возможность обновить календарь с новыми настройками в любое время с использованием методов `update()` или `reset()`.

Метод `update()`, в отличие от `reset()`, сохраняет выбранные пользователем даты, месяц и год после обновления.
- Метод `update()` позволяет вам применить новые настройки к календарю, при этом сохраняя выбранные пользователем даты, месяц и год после обновления.
- Метод `reset()` полностью сбрасывает календарь до начального состояния, удаляя выбранные пользователем даты.

Пример использования:

Expand All @@ -21,3 +22,11 @@ calendar.update();
// or
calendar.reset();
```

Кроме того, если вам нужно полностью удалить экземпляр календаря, вы можете использовать метод `destroy()`:

Пример использования:

```js
calendar.destroy();
```
13 changes: 13 additions & 0 deletions docs/ru/reference/main/readonly-options.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,19 @@ console.log(calendar.HTMLElement);

- - -

## HTMLOriginalElement

`Type: HTMLElement`

```js
const calendar = new VanillaCalendar('#calendar');
console.log(calendar.HTMLOriginalElement);
```

Свойство `HTMLOriginalElement` содержит исходный корневой HTML-элемент без модификаций, в котором был инициализирован календарь.

- - -

## HTMLInputElement

`Type: HTMLElement`
Expand Down

0 comments on commit 281fbad

Please sign in to comment.