@dxtmisha/wiki 0.39.1 → 0.39.3

package/src/media/functional/ru/datetimeRef.mdx

@@ -1,274 +0,0 @@
-import {Meta} from '@storybook/addon-docs/blocks'
-
-<Meta title='@dxtmisha/functional/ru/Classes/Ref/DatetimeRef'/>
-
-# Класс DatetimeRef
-
-Vue-ориентированный класс для работы с датами с реактивными computed свойствами. Обеспечивает автоматическое отслеживание изменений даты, формата вывода и локали с полной интеграцией в реактивную систему Vue.
-
-## Основные возможности
-
-- **Vue Reactivity** — использует computed свойства и ref/watch для реактивности
-- **Автоматические обновления** — автоматически пересчитывает значения при изменении входных данных
-- **Гибкий ввод** — принимает Date объекты, строки, числа или реактивные refs
-- **Поддержка локали** — автоматическое форматирование на основе кодов страны и языка
-- **Множественные форматы** — поддерживает различные форматы вывода даты/времени
-- **Компоненты даты** — реактивные computed свойства для всех компонентов даты
-- **Часовые пояса** — правильная поддержка часовых поясов с учётом локали
-- **Интеграция Watch** — автоматически отслеживает изменения во всех входных параметрах
-
-## Конструктор
-
-### `constructor`
-
-Создаёт экземпляр DatetimeRef с реактивными параметрами.
-
-**Параметры:**
-- `date: RefOrNormal<NumberOrStringOrDate>` — дата для обработки (ref или обычное значение)
-- `type?: RefOrNormal<GeoDate>` — тип формата даты для вывода (по умолчанию: 'date')
-- `code?: RefOrNormal<string>` — код страны и языка (по умолчанию: текущая локация)
-
-**Типы GeoDate:**
-- `'full'` — полная дата и время
-- `'datetime'` — дата с временем
-- `'date'` — только дата
-- `'year-month'` — год и месяц
-- `'year'` — только год
-- `'month'` — только месяц
-- `'day'` — только день
-- `'day-month'` — день и месяц
-- `'time'` — только время
-- `'hour-minute'` — часы и минуты
-- `'hour'` — только часы
-- `'minute'` — только минуты
-- `'second'` — только секунды
-
-```javascript
-import { DatetimeRef } from '@dxtmisha/functional'
-import { ref } from 'vue'
-
-// С ref данными
-const dateRef = ref(new Date())
-const formatRef = ref('datetime')
-const localeRef = ref('ru-RU')
-
-const datetime = new DatetimeRef(dateRef, formatRef, localeRef)
-
-// С обычными данными
-const staticDatetime = new DatetimeRef('2024-01-15', 'date', 'ru-RU')
-```
-
-## Реактивные computed свойства
-
-### `getYear`
-
-Возвращает год указанной даты.
-
-**Возвращает:** `ComputedRef<number>` — реактивное значение года
-
-```javascript
-const yearValue = datetime.getYear()
-// Автоматически обновляется при изменении даты
-```
-
-### `getMonth`
-
-Возвращает месяц как значение с нулевым основанием (0 = январь, 11 = декабрь).
-
-**Возвращает:** `ComputedRef<number>` — реактивное значение месяца (0-11)
-
-```javascript
-const monthValue = datetime.getMonth()
-```
-
-### `getDay`
-
-Возвращает день месяца.
-
-**Возвращает:** `ComputedRef<number>` — реактивное значение дня (1-31)
-
-```javascript
-const dayValue = datetime.getDay()
-```
-
-### `getHour`
-
-Возвращает час по местному времени.
-
-**Возвращает:** `ComputedRef<number>` — реактивное значение часа (0-23)
-
-```javascript
-const hourValue = datetime.getHour()
-```
-
-### `getMinute`
-
-Возвращает минуты по местному времени.
-
-**Возвращает:** `ComputedRef<number>` — реактивное значение минут (0-59)
-
-```javascript
-const minuteValue = datetime.getMinute()
-```
-
-### `getSecond`
-
-Возвращает секунды по местному времени.
-
-**Возвращает:** `ComputedRef<number>` — реактивное значение секунд (0-59)
-
-```javascript
-const secondValue = datetime.getSecond()
-```
-
-### `getMaxDay`
-
-Возвращает последний день месяца для текущей даты.
-
-**Возвращает:** `ComputedRef<number>` — реактивное максимальное количество дней в месяце (28-31)
-
-```javascript
-const maxDayValue = datetime.getMaxDay()
-```
-
-### `getHoursType`
-
-Возвращает формат часов (12-часовой или 24-часовой).
-
-**Возвращает:** `ComputedRef<GeoHours>` — реактивный формат часов ('12' | '24')
-
-```javascript
-const hoursFormat = datetime.getHoursType()
-```
-
-### `getFirstDayCode`
-
-Возвращает код первого дня недели для текущей локали.
-
-**Возвращает:** `ComputedRef<GeoFirstDay>` — реактивный код первого дня (0 = воскресенье, 1 = понедельник, 6 = суббота)
-
-```javascript
-const firstDayCode = datetime.getFirstDayCode()
-```
-
-## Методы получения данных
-
-### `getItem`
-
-Возвращает исходные входные данные для даты.
-
-**Возвращает:** `RefOrNormal<NumberOrStringOrDate>` — исходные входные данные
-
-```javascript
-const originalInput = datetime.getItem()
-```
-
-### `getDate`
-
-Возвращает реактивный объект Date.
-
-**Возвращает:** `Ref<Date>` — реактивный объект Date
-
-```javascript
-const reactiveDate = datetime.getDate()
-```
-
-### `getDatetime`
-
-Возвращает экземпляр базового класса Datetime.
-
-**Возвращает:** `Datetime` — объект базового класса Datetime
-
-```javascript
-const baseDateTime = datetime.getDatetime()
-```
-
-## Методы форматирования
-
-### `locale`
-
-Включает языково-зависимое форматирование даты и времени.
-
-**Параметры:**
-- `type?: GeoDate` — тип формата даты (по умолчанию: текущий тип)
-- `styleOptions?: Intl.DateTimeFormatOptions['month'] | Intl.DateTimeFormatOptions` — опции форматирования
-
-**Возвращает:** `ComputedRef<string>` — реактивная отформатированная строка даты
-
-```javascript
-// Базовое форматирование
-const formatted = datetime.locale()
-
-// Пользовательское форматирование
-const monthName = datetime.locale('month', 'long')
-const fullFormat = datetime.locale('full', {
-  weekday: 'long',
-  month: 'long'
-})
-```
-
-### `standard`
-
-Возвращает дату в стандартном формате с опциональной информацией о часовом поясе.
-
-**Параметры:**
-- `timeZone?: boolean` — добавить информацию о часовом поясе (по умолчанию: true)
-
-**Возвращает:** `ComputedRef<string>` — реактивная дата в стандартном формате
-
-```javascript
-// С часовым поясом
-const withTz = datetime.standard()
-
-// Без часового пояса
-const withoutTz = datetime.standard(false)
-```
-
-## Практические примеры
-
-### Vue компонент с реактивной датой
-
-```html
-<template>
-  <div>
-    <span>{{ datetime.getYear() }}/{{ datetime.getMonth() + 1 }}/{{ datetime.getDay() }}</span>
-    <span>{{ datetime.locale() }}</span>
-  </div>
-</template>
-
-<script setup>
-import { DatetimeRef } from '@dxtmisha/functional'
-import { ref } from 'vue'
-
-const currentDate = ref(new Date())
-const datetime = new DatetimeRef(currentDate, 'datetime', 'ru-RU')
-</script>
-```
-
-### Composable для работы с датами
-
-```javascript
-export function useDatetime(initialDate) {
-  const date = ref(initialDate || new Date())
-  const datetime = new DatetimeRef(date, 'date', 'ru-RU')
-
-  return {
-    datetime,
-    year: datetime.getYear(),
-    formatted: datetime.locale()
-  }
-}
-```
-
-### Реактивные изменения формата
-
-```javascript
-const dateValue = ref(new Date())
-const formatType = ref('date')
-const datetime = new DatetimeRef(dateValue, formatType, 'ru-RU')
-
-// Все computed свойства автоматически обновятся
-formatType.value = 'datetime'
-```
-
-Класс DatetimeRef предоставляет мощную реактивную систему работы с датами для Vue приложений с автоматическим отслеживанием изменений и форматированием.

package/src/media/functional/ru/elementUtils.mdx

@@ -1,175 +0,0 @@
-import {Meta} from '@storybook/addon-docs/blocks'
-
-<Meta title='@dxtmisha/functional/ru/Element Utils'/>
-
-# Утилиты для работы с DOM элементами
-
-Набор функций для создания, поиска и манипуляции DOM элементами.
-
-## `createElement`
-
-Создает новый HTML элемент с указанным тегом и опционально добавляет его в родительский элемент.
-
-**Параметры:**
-- `parentElement?: HTMLElement` — родительский элемент для вставки (опционально)
-- `tagName: string` — тег создаваемого элемента (по умолчанию `'div'`)
-- `options?: Partial<T> | Record<keyof T, T[keyof T]> | ((element: T) => void)` — объект атрибутов или функция настройки (опционально)
-- `referenceElement?: HTMLElement` — элемент, перед которым вставить новый (опционально)
-
-```javascript
-import { createElement } from '@dxtmisha/functional'
-
-const div = createElement() // <div>
-const button = createElement(parent, 'button') // <button> в parent
-const input = createElement(parent, 'input', { type: 'text' }) // <input type="text">
-```
-
-## `domQuerySelector`
-
-Безопасно ищет первый элемент, соответствующий CSS селектору.
-
-**Параметры:**
-- `selectors: string` — CSS селектор для поиска
-
-```javascript
-import { domQuerySelector } from '@dxtmisha/functional'
-
-const header = domQuerySelector('#header') // HTMLElement | undefined
-const button = domQuerySelector('.submit-btn') // HTMLElement | undefined
-const input = domQuerySelector('input[type="email"]') // HTMLInputElement | undefined
-```
-
-## `domQuerySelectorAll`
-
-Безопасно ищет все элементы, соответствующие CSS селектору.
-
-**Параметры:**
-- `selectors: string` — CSS селектор для поиска
-
-```javascript
-import { domQuerySelectorAll } from '@dxtmisha/functional'
-
-const buttons = domQuerySelectorAll('button') // NodeList | undefined
-const items = domQuerySelectorAll('.menu-item') // NodeList | undefined
-const links = domQuerySelectorAll('a[href]') // NodeList | undefined
-```
-
-## `getAttributes`
-
-Получает все атрибуты HTML элемента в виде объекта ключ-значение.
-
-**Параметры:**
-- `element?: ElementOrString<E>` — селектор или элемент для получения атрибутов
-
-```javascript
-import { getAttributes } from '@dxtmisha/functional'
-
-const attrs = getAttributes('#my-element') // { id: 'my-element', class: 'btn' }
-const buttonAttrs = getAttributes(button) // { type: 'submit', disabled: '' }
-```
-
-## `getElement`
-
-Универсальная функция для получения DOM элемента. Принимает CSS селектор, элемент или window.
-
-**Параметры:**
-- `element?: ElementOrString<E>` — селектор, элемент или window
-
-```javascript
-import { getElement } from '@dxtmisha/functional'
-
-const header = getElement('#header') // HTMLElement | undefined
-const sameEl = getElement(existingEl) // возвращает existingEl
-const bodyEl = getElement(window) // возвращает document.body
-```
-
-## `getElementId`
-
-Получает ID элемента или создает уникальный ID, если элемент не имеет атрибута `id`.
-
-**Параметры:**
-- `element?: ElementOrString<E>` — элемент для получения ID
-- `selector?: string` — дополнительный селектор для добавления к ID
-
-```javascript
-import { getElementId } from '@dxtmisha/functional'
-
-const id1 = getElementId(elementWithId) // 'existing'
-const id2 = getElementId(elementNoId) // 'id-123456' (сгенерированный)
-const id3 = getElementId('#header', ' .title') // '#header .title'
-```
-
-## `getElementItem`
-
-Получает значение свойства элемента по ключу с возможностью указания значения по умолчанию.
-
-**Параметры:**
-- `element: ElementOrString<T>` — элемент для проверки
-- `index: K | string` — ключ свойства для получения
-- `defaultValue?: D` — значение по умолчанию
-
-```javascript
-import { getElementItem } from '@dxtmisha/functional'
-
-const value = getElementItem(input, 'value') // значение input
-const type = getElementItem(input, 'type', 'text') // тип или 'text' по умолчанию
-const width = getElementItem(element, 'offsetWidth')
-```
-
-## `getElementOrWindow`
-
-Возвращает window объект как есть или получает DOM элемент.
-
-**Параметры:**
-- `element?: ElementOrString<E>` — селектор, элемент или window
-
-```javascript
-import { getElementOrWindow } from '@dxtmisha/functional'
-
-const windowObj = getElementOrWindow(window) // window
-const element = getElementOrWindow('#container') // HTMLElement
-```
-
-## `goScroll`
-
-Плавно прокручивает страницу или элемент к указанной позиции.
-
-**Параметры:**
-- `element?: ElementOrString<E>` — элемент для прокрутки (по умолчанию window)
-- `top?: number` — позиция по вертикали
-- `left?: number` — позиция по горизонтали
-
-```javascript
-import { goScroll } from '@dxtmisha/functional'
-
-goScroll(window, 0) // прокрутка наверх
-goScroll('#container', 100, 50) // прокрутка элемента
-```
-
-## `initScrollbarOffset`
-
-Инициализирует данные для управления скроллом, устанавливая CSS-переменную с шириной полосы прокрутки.
-
-```javascript
-import { initScrollbarOffset } from '@dxtmisha/functional'
-
-// Инициализация при загрузке приложения
-await initScrollbarOffset() // устанавливает --sys-scrollbar-offset в CSS
-```
-
-## `setElementItem`
-
-Устанавливает значение свойства элемента по ключу.
-
-**Параметры:**
-- `element: ElementOrString<T>` — элемент для изменения
-- `index: K | string` — ключ свойства для установки
-- `value: any` — новое значение
-
-```javascript
-import { setElementItem } from '@dxtmisha/functional'
-
-setElementItem(input, 'value', 'новое значение')
-setElementItem('#my-element', 'textContent', 'Hello World')
-setElementItem(button, 'disabled', true)
-```