From 8d54bb9e44610c286ab10813c1526964fefaaa9b Mon Sep 17 00:00:00 2001 From: Krivonos Aleksandr Date: Fri, 25 Sep 2026 13:47:41 +0300 Subject: [PATCH 1/2] docs: add custom quarter names example --- .../Calendar/Calendar.template-doc.mdx | 20 ++++++++++++++++ .../DatePicker/DatePicker.template-doc.mdx | 23 +++++++++++++++++++ .../DateTimePicker.template-doc.mdx | 23 +++++++++++++++++++ .../docs/components/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/DatePicker.mdx | 23 +++++++++++++++++++ .../docs/components/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/data-entry/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/data-entry/DatePicker.mdx | 23 +++++++++++++++++++ .../components/data-entry/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/DatePicker.mdx | 23 +++++++++++++++++++ .../docs/components/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/DatePicker.mdx | 23 +++++++++++++++++++ .../docs/components/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/data-entry/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/data-entry/DatePicker.mdx | 23 +++++++++++++++++++ .../components/data-entry/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/data-entry/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/data-entry/DatePicker.mdx | 23 +++++++++++++++++++ .../docs/components/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/DatePicker.mdx | 23 +++++++++++++++++++ .../docs/components/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/data-entry/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/data-entry/DatePicker.mdx | 23 +++++++++++++++++++ .../components/data-entry/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/DatePicker.mdx | 23 +++++++++++++++++++ .../docs/components/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/DatePicker.mdx | 23 +++++++++++++++++++ .../docs/components/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/data-entry/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/data-entry/DatePicker.mdx | 23 +++++++++++++++++++ .../components/data-entry/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/data-entry/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/data-entry/DatePicker.mdx | 23 +++++++++++++++++++ .../components/data-entry/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/DatePicker.mdx | 23 +++++++++++++++++++ .../docs/components/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/data-entry/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/data-entry/DatePicker.mdx | 23 +++++++++++++++++++ .../components/data-entry/DateTimePicker.mdx | 23 +++++++++++++++++++ .../docs/components/data-entry/Calendar.mdx | 20 ++++++++++++++++ .../docs/components/data-entry/DatePicker.mdx | 23 +++++++++++++++++++ .../components/data-entry/DateTimePicker.mdx | 23 +++++++++++++++++++ 46 files changed, 1013 insertions(+) diff --git a/packages/plasma-new-hope/src/components/Calendar/Calendar.template-doc.mdx b/packages/plasma-new-hope/src/components/Calendar/Calendar.template-doc.mdx index c328bd0177..371179e3dd 100644 --- a/packages/plasma-new-hope/src/components/Calendar/Calendar.template-doc.mdx +++ b/packages/plasma-new-hope/src/components/Calendar/Calendar.template-doc.mdx @@ -293,6 +293,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/{{ package }}'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/packages/plasma-new-hope/src/components/DatePicker/DatePicker.template-doc.mdx b/packages/plasma-new-hope/src/components/DatePicker/DatePicker.template-doc.mdx index 3c27a42b4b..df78fa9391 100644 --- a/packages/plasma-new-hope/src/components/DatePicker/DatePicker.template-doc.mdx +++ b/packages/plasma-new-hope/src/components/DatePicker/DatePicker.template-doc.mdx @@ -257,6 +257,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/{{ package }}'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/packages/plasma-new-hope/src/components/DateTimePicker/DateTimePicker.template-doc.mdx b/packages/plasma-new-hope/src/components/DateTimePicker/DateTimePicker.template-doc.mdx index f0e11d34d3..c0e9a9e034 100644 --- a/packages/plasma-new-hope/src/components/DateTimePicker/DateTimePicker.template-doc.mdx +++ b/packages/plasma-new-hope/src/components/DateTimePicker/DateTimePicker.template-doc.mdx @@ -281,6 +281,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/{{ package }}'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/plasma-b2c-docs/docs/components/Calendar.mdx b/website/plasma-b2c-docs/docs/components/Calendar.mdx index b4cb7bc00a..6617d6f932 100644 --- a/website/plasma-b2c-docs/docs/components/Calendar.mdx +++ b/website/plasma-b2c-docs/docs/components/Calendar.mdx @@ -294,6 +294,26 @@ export function App() { ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/plasma-b2c'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/plasma-b2c-docs/docs/components/DatePicker.mdx b/website/plasma-b2c-docs/docs/components/DatePicker.mdx index d5c6fc6d7a..8992890437 100644 --- a/website/plasma-b2c-docs/docs/components/DatePicker.mdx +++ b/website/plasma-b2c-docs/docs/components/DatePicker.mdx @@ -257,6 +257,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/plasma-b2c'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/plasma-b2c-docs/docs/components/DateTimePicker.mdx b/website/plasma-b2c-docs/docs/components/DateTimePicker.mdx index 71e9e609f8..f851632ed2 100644 --- a/website/plasma-b2c-docs/docs/components/DateTimePicker.mdx +++ b/website/plasma-b2c-docs/docs/components/DateTimePicker.mdx @@ -281,6 +281,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/plasma-b2c'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/plasma-giga-docs/docs/components/data-entry/Calendar.mdx b/website/plasma-giga-docs/docs/components/data-entry/Calendar.mdx index 3721825a20..48a7a5520b 100644 --- a/website/plasma-giga-docs/docs/components/data-entry/Calendar.mdx +++ b/website/plasma-giga-docs/docs/components/data-entry/Calendar.mdx @@ -290,6 +290,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/plasma-giga'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/plasma-giga-docs/docs/components/data-entry/DatePicker.mdx b/website/plasma-giga-docs/docs/components/data-entry/DatePicker.mdx index 37ac7b1d70..1c65e76ab7 100644 --- a/website/plasma-giga-docs/docs/components/data-entry/DatePicker.mdx +++ b/website/plasma-giga-docs/docs/components/data-entry/DatePicker.mdx @@ -259,6 +259,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/plasma-giga'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/plasma-giga-docs/docs/components/data-entry/DateTimePicker.mdx b/website/plasma-giga-docs/docs/components/data-entry/DateTimePicker.mdx index 038e021fe6..bd8c73c781 100644 --- a/website/plasma-giga-docs/docs/components/data-entry/DateTimePicker.mdx +++ b/website/plasma-giga-docs/docs/components/data-entry/DateTimePicker.mdx @@ -283,6 +283,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/plasma-giga'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/plasma-homeds-docs/docs/components/DatePicker.mdx b/website/plasma-homeds-docs/docs/components/DatePicker.mdx index 6d983a6cfc..19a2a06ed9 100644 --- a/website/plasma-homeds-docs/docs/components/DatePicker.mdx +++ b/website/plasma-homeds-docs/docs/components/DatePicker.mdx @@ -257,6 +257,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/plasma-homeds'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/plasma-homeds-docs/docs/components/DateTimePicker.mdx b/website/plasma-homeds-docs/docs/components/DateTimePicker.mdx index 89acd1e3ad..d481628d2a 100644 --- a/website/plasma-homeds-docs/docs/components/DateTimePicker.mdx +++ b/website/plasma-homeds-docs/docs/components/DateTimePicker.mdx @@ -281,6 +281,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/plasma-homeds'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/plasma-web-docs/docs/components/Calendar.mdx b/website/plasma-web-docs/docs/components/Calendar.mdx index b4325f36ab..385684245b 100644 --- a/website/plasma-web-docs/docs/components/Calendar.mdx +++ b/website/plasma-web-docs/docs/components/Calendar.mdx @@ -293,6 +293,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/plasma-web'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/plasma-web-docs/docs/components/DatePicker.mdx b/website/plasma-web-docs/docs/components/DatePicker.mdx index d08ee80c6a..945808c920 100644 --- a/website/plasma-web-docs/docs/components/DatePicker.mdx +++ b/website/plasma-web-docs/docs/components/DatePicker.mdx @@ -257,6 +257,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/plasma-web'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/plasma-web-docs/docs/components/DateTimePicker.mdx b/website/plasma-web-docs/docs/components/DateTimePicker.mdx index 20b988eae3..d2af2f0f6d 100644 --- a/website/plasma-web-docs/docs/components/DateTimePicker.mdx +++ b/website/plasma-web-docs/docs/components/DateTimePicker.mdx @@ -281,6 +281,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/plasma-web'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/sdds-bizcom-docs/docs/components/data-entry/Calendar.mdx b/website/sdds-bizcom-docs/docs/components/data-entry/Calendar.mdx index ce3aeeb472..b92b495f68 100644 --- a/website/sdds-bizcom-docs/docs/components/data-entry/Calendar.mdx +++ b/website/sdds-bizcom-docs/docs/components/data-entry/Calendar.mdx @@ -290,6 +290,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/sdds-bizcom'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/sdds-bizcom-docs/docs/components/data-entry/DatePicker.mdx b/website/sdds-bizcom-docs/docs/components/data-entry/DatePicker.mdx index 8d573580c9..0c4662fb90 100644 --- a/website/sdds-bizcom-docs/docs/components/data-entry/DatePicker.mdx +++ b/website/sdds-bizcom-docs/docs/components/data-entry/DatePicker.mdx @@ -259,6 +259,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/sdds-bizcom'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/sdds-bizcom-docs/docs/components/data-entry/DateTimePicker.mdx b/website/sdds-bizcom-docs/docs/components/data-entry/DateTimePicker.mdx index 08ba5b58e1..0c22329c79 100644 --- a/website/sdds-bizcom-docs/docs/components/data-entry/DateTimePicker.mdx +++ b/website/sdds-bizcom-docs/docs/components/data-entry/DateTimePicker.mdx @@ -283,6 +283,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/sdds-bizcom'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/sdds-cs-docs/docs/components/data-entry/Calendar.mdx b/website/sdds-cs-docs/docs/components/data-entry/Calendar.mdx index 958a89c51b..ff4116caa4 100644 --- a/website/sdds-cs-docs/docs/components/data-entry/Calendar.mdx +++ b/website/sdds-cs-docs/docs/components/data-entry/Calendar.mdx @@ -290,6 +290,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/sdds-cs'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/sdds-cs-docs/docs/components/data-entry/DatePicker.mdx b/website/sdds-cs-docs/docs/components/data-entry/DatePicker.mdx index 135892b57e..055ca447c7 100644 --- a/website/sdds-cs-docs/docs/components/data-entry/DatePicker.mdx +++ b/website/sdds-cs-docs/docs/components/data-entry/DatePicker.mdx @@ -216,6 +216,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/sdds-cs'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/sdds-dfa-docs/docs/components/Calendar.mdx b/website/sdds-dfa-docs/docs/components/Calendar.mdx index 29cb1c159f..7fd98fc25e 100644 --- a/website/sdds-dfa-docs/docs/components/Calendar.mdx +++ b/website/sdds-dfa-docs/docs/components/Calendar.mdx @@ -294,6 +294,26 @@ export function App() { ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/sdds-dfa'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/sdds-dfa-docs/docs/components/DatePicker.mdx b/website/sdds-dfa-docs/docs/components/DatePicker.mdx index da501c5876..dad46a5676 100644 --- a/website/sdds-dfa-docs/docs/components/DatePicker.mdx +++ b/website/sdds-dfa-docs/docs/components/DatePicker.mdx @@ -257,6 +257,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/sdds-dfa'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/sdds-dfa-docs/docs/components/DateTimePicker.mdx b/website/sdds-dfa-docs/docs/components/DateTimePicker.mdx index cfbdaa386a..ce5d3ea70e 100644 --- a/website/sdds-dfa-docs/docs/components/DateTimePicker.mdx +++ b/website/sdds-dfa-docs/docs/components/DateTimePicker.mdx @@ -241,6 +241,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/sdds-dfa'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/sdds-finai-docs/docs/components/data-entry/Calendar.mdx b/website/sdds-finai-docs/docs/components/data-entry/Calendar.mdx index c4b923f7d8..a48c43c239 100644 --- a/website/sdds-finai-docs/docs/components/data-entry/Calendar.mdx +++ b/website/sdds-finai-docs/docs/components/data-entry/Calendar.mdx @@ -290,6 +290,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/sdds-finai'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/sdds-finai-docs/docs/components/data-entry/DatePicker.mdx b/website/sdds-finai-docs/docs/components/data-entry/DatePicker.mdx index 889708e8c9..59826a5f02 100644 --- a/website/sdds-finai-docs/docs/components/data-entry/DatePicker.mdx +++ b/website/sdds-finai-docs/docs/components/data-entry/DatePicker.mdx @@ -250,6 +250,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/sdds-finai'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/sdds-finai-docs/docs/components/data-entry/DateTimePicker.mdx b/website/sdds-finai-docs/docs/components/data-entry/DateTimePicker.mdx index 8bcf72fade..34ef53f678 100644 --- a/website/sdds-finai-docs/docs/components/data-entry/DateTimePicker.mdx +++ b/website/sdds-finai-docs/docs/components/data-entry/DateTimePicker.mdx @@ -293,6 +293,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/sdds-finai'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/sdds-insol-docs/docs/components/Calendar.mdx b/website/sdds-insol-docs/docs/components/Calendar.mdx index ad042a2172..d2afca83ab 100644 --- a/website/sdds-insol-docs/docs/components/Calendar.mdx +++ b/website/sdds-insol-docs/docs/components/Calendar.mdx @@ -293,6 +293,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/sdds-insol'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/sdds-insol-docs/docs/components/DatePicker.mdx b/website/sdds-insol-docs/docs/components/DatePicker.mdx index f9aa309ca2..3312c49cc8 100644 --- a/website/sdds-insol-docs/docs/components/DatePicker.mdx +++ b/website/sdds-insol-docs/docs/components/DatePicker.mdx @@ -257,6 +257,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/sdds-insol'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/sdds-insol-docs/docs/components/DateTimePicker.mdx b/website/sdds-insol-docs/docs/components/DateTimePicker.mdx index aedc8275d8..990eba7dba 100644 --- a/website/sdds-insol-docs/docs/components/DateTimePicker.mdx +++ b/website/sdds-insol-docs/docs/components/DateTimePicker.mdx @@ -241,6 +241,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/sdds-insol'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/sdds-insol-next-docs/docs/components/Calendar.mdx b/website/sdds-insol-next-docs/docs/components/Calendar.mdx index 1d6b4179b2..7fcedd26d5 100644 --- a/website/sdds-insol-next-docs/docs/components/Calendar.mdx +++ b/website/sdds-insol-next-docs/docs/components/Calendar.mdx @@ -293,6 +293,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/sdds-insol-next'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/sdds-insol-next-docs/docs/components/DatePicker.mdx b/website/sdds-insol-next-docs/docs/components/DatePicker.mdx index 9fd55b7076..3a1341811a 100644 --- a/website/sdds-insol-next-docs/docs/components/DatePicker.mdx +++ b/website/sdds-insol-next-docs/docs/components/DatePicker.mdx @@ -257,6 +257,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/sdds-insol-next'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/sdds-insol-next-docs/docs/components/DateTimePicker.mdx b/website/sdds-insol-next-docs/docs/components/DateTimePicker.mdx index f485371b82..baf3b94445 100644 --- a/website/sdds-insol-next-docs/docs/components/DateTimePicker.mdx +++ b/website/sdds-insol-next-docs/docs/components/DateTimePicker.mdx @@ -241,6 +241,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/sdds-insol-next'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/sdds-netology-docs/docs/components/data-entry/Calendar.mdx b/website/sdds-netology-docs/docs/components/data-entry/Calendar.mdx index f514deb4fd..c6da7a3802 100644 --- a/website/sdds-netology-docs/docs/components/data-entry/Calendar.mdx +++ b/website/sdds-netology-docs/docs/components/data-entry/Calendar.mdx @@ -290,6 +290,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/sdds-netology'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/sdds-netology-docs/docs/components/data-entry/DatePicker.mdx b/website/sdds-netology-docs/docs/components/data-entry/DatePicker.mdx index bd7d65a903..0e476f8f64 100644 --- a/website/sdds-netology-docs/docs/components/data-entry/DatePicker.mdx +++ b/website/sdds-netology-docs/docs/components/data-entry/DatePicker.mdx @@ -259,6 +259,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/sdds-netology'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/sdds-netology-docs/docs/components/data-entry/DateTimePicker.mdx b/website/sdds-netology-docs/docs/components/data-entry/DateTimePicker.mdx index 7faad9ddfd..6e5773a286 100644 --- a/website/sdds-netology-docs/docs/components/data-entry/DateTimePicker.mdx +++ b/website/sdds-netology-docs/docs/components/data-entry/DateTimePicker.mdx @@ -283,6 +283,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/sdds-netology'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/sdds-platform-ai-docs/docs/components/data-entry/Calendar.mdx b/website/sdds-platform-ai-docs/docs/components/data-entry/Calendar.mdx index 8a9e7e499d..31d301c928 100644 --- a/website/sdds-platform-ai-docs/docs/components/data-entry/Calendar.mdx +++ b/website/sdds-platform-ai-docs/docs/components/data-entry/Calendar.mdx @@ -290,6 +290,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/sdds-platform-ai'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/sdds-platform-ai-docs/docs/components/data-entry/DatePicker.mdx b/website/sdds-platform-ai-docs/docs/components/data-entry/DatePicker.mdx index 3186bf29f4..f667132a54 100644 --- a/website/sdds-platform-ai-docs/docs/components/data-entry/DatePicker.mdx +++ b/website/sdds-platform-ai-docs/docs/components/data-entry/DatePicker.mdx @@ -259,6 +259,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/sdds-platform-ai'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/sdds-platform-ai-docs/docs/components/data-entry/DateTimePicker.mdx b/website/sdds-platform-ai-docs/docs/components/data-entry/DateTimePicker.mdx index f0e08c87f0..a863805935 100644 --- a/website/sdds-platform-ai-docs/docs/components/data-entry/DateTimePicker.mdx +++ b/website/sdds-platform-ai-docs/docs/components/data-entry/DateTimePicker.mdx @@ -243,6 +243,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/sdds-platform-ai'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/sdds-sbcom-docs/docs/components/Calendar.mdx b/website/sdds-sbcom-docs/docs/components/Calendar.mdx index 33cabaeba0..9a92a6bc4a 100644 --- a/website/sdds-sbcom-docs/docs/components/Calendar.mdx +++ b/website/sdds-sbcom-docs/docs/components/Calendar.mdx @@ -293,6 +293,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/sdds-sbcom'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/sdds-sbcom-docs/docs/components/DatePicker.mdx b/website/sdds-sbcom-docs/docs/components/DatePicker.mdx index a88cd17e0e..ec99619638 100644 --- a/website/sdds-sbcom-docs/docs/components/DatePicker.mdx +++ b/website/sdds-sbcom-docs/docs/components/DatePicker.mdx @@ -257,6 +257,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/sdds-sbcom'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/sdds-sbcom-docs/docs/components/DateTimePicker.mdx b/website/sdds-sbcom-docs/docs/components/DateTimePicker.mdx index 803c3316be..64e9577410 100644 --- a/website/sdds-sbcom-docs/docs/components/DateTimePicker.mdx +++ b/website/sdds-sbcom-docs/docs/components/DateTimePicker.mdx @@ -281,6 +281,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/sdds-sbcom'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/sdds-scan-docs/docs/components/data-entry/Calendar.mdx b/website/sdds-scan-docs/docs/components/data-entry/Calendar.mdx index 953a18c498..a9916390e8 100644 --- a/website/sdds-scan-docs/docs/components/data-entry/Calendar.mdx +++ b/website/sdds-scan-docs/docs/components/data-entry/Calendar.mdx @@ -280,6 +280,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/sdds-scan'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/sdds-scan-docs/docs/components/data-entry/DatePicker.mdx b/website/sdds-scan-docs/docs/components/data-entry/DatePicker.mdx index 062d6b3ba2..f5b40e14e5 100644 --- a/website/sdds-scan-docs/docs/components/data-entry/DatePicker.mdx +++ b/website/sdds-scan-docs/docs/components/data-entry/DatePicker.mdx @@ -222,6 +222,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/sdds-scan'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/sdds-scan-docs/docs/components/data-entry/DateTimePicker.mdx b/website/sdds-scan-docs/docs/components/data-entry/DateTimePicker.mdx index 56d64f2c59..de74672809 100644 --- a/website/sdds-scan-docs/docs/components/data-entry/DateTimePicker.mdx +++ b/website/sdds-scan-docs/docs/components/data-entry/DateTimePicker.mdx @@ -243,6 +243,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/sdds-scan'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, diff --git a/website/sdds-serv-docs/docs/components/data-entry/Calendar.mdx b/website/sdds-serv-docs/docs/components/data-entry/Calendar.mdx index 3bbead0e72..de2947f0e6 100644 --- a/website/sdds-serv-docs/docs/components/data-entry/Calendar.mdx +++ b/website/sdds-serv-docs/docs/components/data-entry/Calendar.mdx @@ -290,6 +290,26 @@ export function App() { } ``` +## Пользовательские названия кварталов. + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { CalendarBase } from '@salutejs/sdds-serv'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ## Выбор языка. Для выбора языка необходимо указать свойство `locale: 'ru' | 'en'`. diff --git a/website/sdds-serv-docs/docs/components/data-entry/DatePicker.mdx b/website/sdds-serv-docs/docs/components/data-entry/DatePicker.mdx index 14b4f626c9..0e9dfaab1b 100644 --- a/website/sdds-serv-docs/docs/components/data-entry/DatePicker.mdx +++ b/website/sdds-serv-docs/docs/components/data-entry/DatePicker.mdx @@ -259,6 +259,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DatePicker } from '@salutejs/sdds-serv'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### Язык даты Язык даты задается с помощью свойства `lang`. diff --git a/website/sdds-serv-docs/docs/components/data-entry/DateTimePicker.mdx b/website/sdds-serv-docs/docs/components/data-entry/DateTimePicker.mdx index a8cdf70ff6..47e4eea45a 100644 --- a/website/sdds-serv-docs/docs/components/data-entry/DateTimePicker.mdx +++ b/website/sdds-serv-docs/docs/components/data-entry/DateTimePicker.mdx @@ -283,6 +283,29 @@ export function App() { } ``` +### Пользовательские названия кварталов + +Названия кварталов задаются с помощью свойства `quarterNames`. По умолчанию используются значения `Q1`, `Q2`, `Q3`, `Q4`. + +```tsx live +import React from 'react'; +import { DateTimePicker } from '@salutejs/sdds-serv'; + +export function App() { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + return ( + + ); +} +``` + ### 12-часовой формат (AM/PM) Свойство `hasTimeFormat` включает 12-часовой формат: колонка часов показывает значения `12`, `01`–`11`, From 8c4f82fb135468f374c99eb9509bdd79b9e1302a Mon Sep 17 00:00:00 2001 From: Krivonos Aleksandr Date: Fri, 25 Sep 2026 13:37:38 +0300 Subject: [PATCH 2/2] feat: add custom quarterNames to Calendar-like --- .../Calendar/Calendar.component-test.tsx | 18 +++++++- .../src/components/Calendar/Calendar.types.ts | 5 +++ .../Calendar/CalendarBase/CalendarBase.tsx | 2 + .../CalendarDouble/CalendarDouble.tsx | 3 ++ .../src/components/Calendar/hooks/types.ts | 1 + .../components/Calendar/hooks/useQuarters.ts | 18 ++++++-- .../ui/CalendarQuarters/CalendarQuarters.tsx | 2 + .../CalendarQuarters.types.ts | 1 + .../components/Calendar/utils/constants.ts | 12 ++--- .../DatePicker/DatePicker.component-test.tsx | 44 +++++++++++++++++++ .../DatePicker/DatePickerBase.types.ts | 6 +++ .../DatePicker/RangeDate/RangeDate.tsx | 3 ++ .../RangeDatePopover/RangeDatePopover.tsx | 3 ++ .../DatePicker/SingleDate/SingleDate.tsx | 3 ++ .../DatePicker/hooks/useDatePicker.ts | 3 +- .../DateTimePicker.component-test.tsx | 23 ++++++++++ .../DateTimePicker/DateTimePicker.tsx | 3 ++ .../DateTimePicker/DateTimePicker.types.ts | 1 + .../DateTimePicker/hooks/useDateTimePicker.ts | 3 +- 19 files changed, 141 insertions(+), 13 deletions(-) diff --git a/packages/plasma-new-hope/src/components/Calendar/Calendar.component-test.tsx b/packages/plasma-new-hope/src/components/Calendar/Calendar.component-test.tsx index 6b0f27e29c..c1ad6d2e52 100644 --- a/packages/plasma-new-hope/src/components/Calendar/Calendar.component-test.tsx +++ b/packages/plasma-new-hope/src/components/Calendar/Calendar.component-test.tsx @@ -170,6 +170,7 @@ describeFn('Calendar', () => { uncontrolled = false, renderFromDate, onChangeVisibleDate, + quarterNames, } = args; const [value, setValue] = useState(baseValue); @@ -223,7 +224,12 @@ describeFn('Calendar', () => { renderFromDate, }), Months: getCalendarComponent({ type: 'Months', eventMonthList: monthEvents, stretched }), - Quarters: getCalendarComponent({ type: 'Quarters', eventQuarterList: quarterEvents, stretched }), + Quarters: getCalendarComponent({ + type: 'Quarters', + eventQuarterList: quarterEvents, + quarterNames, + stretched, + }), Years: getCalendarComponent({ type: 'Years', eventYearList: yearEvents, stretched }), }; @@ -247,6 +253,16 @@ describeFn('Calendar', () => { cy.matchImageSnapshot(); }); + it('custom quarter names', () => { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + + mount(); + + quarterNames.forEach((quarterName) => { + cy.contains('[role="gridcell"]', quarterName).should('be.visible'); + }); + }); + itSkipForWebkit('default: double calendar', () => { mount(
diff --git a/packages/plasma-new-hope/src/components/Calendar/Calendar.types.ts b/packages/plasma-new-hope/src/components/Calendar/Calendar.types.ts index c9c5240f02..1344345918 100644 --- a/packages/plasma-new-hope/src/components/Calendar/Calendar.types.ts +++ b/packages/plasma-new-hope/src/components/Calendar/Calendar.types.ts @@ -208,6 +208,11 @@ export interface Calendar extends HTMLAttributes { * Список отключенных кварталов. */ disabledQuarterList?: DisabledDay[]; + /** + * Названия кварталов. + * @default ['Q1', 'Q2', 'Q3', 'Q4'] + */ + quarterNames?: string[]; /** * Список событий по годам. */ diff --git a/packages/plasma-new-hope/src/components/Calendar/CalendarBase/CalendarBase.tsx b/packages/plasma-new-hope/src/components/Calendar/CalendarBase/CalendarBase.tsx index 7b64b22681..30a276c1b5 100644 --- a/packages/plasma-new-hope/src/components/Calendar/CalendarBase/CalendarBase.tsx +++ b/packages/plasma-new-hope/src/components/Calendar/CalendarBase/CalendarBase.tsx @@ -54,6 +54,7 @@ export const calendarBaseRoot = ( disabledMonthList, eventQuarterList, disabledQuarterList, + quarterNames, eventYearList, disabledYearList, locale = 'ru', @@ -305,6 +306,7 @@ export const calendarBaseRoot = ( max={max} eventList={eventQuarterList} disabledList={disabledQuarterList} + quarterNames={quarterNames} hoveredQuarter={hoveredItem} selectIndexes={selectIndexes} onChangeQuarter={handleOnChangeQuarter} diff --git a/packages/plasma-new-hope/src/components/Calendar/CalendarDouble/CalendarDouble.tsx b/packages/plasma-new-hope/src/components/Calendar/CalendarDouble/CalendarDouble.tsx index 9c14b27e0d..7f16e9cd4a 100644 --- a/packages/plasma-new-hope/src/components/Calendar/CalendarDouble/CalendarDouble.tsx +++ b/packages/plasma-new-hope/src/components/Calendar/CalendarDouble/CalendarDouble.tsx @@ -55,6 +55,7 @@ export const calendarDoubleRoot = ( disabledMonthList, eventQuarterList, disabledQuarterList, + quarterNames, eventYearList, disabledYearList, locale = 'ru', @@ -401,6 +402,7 @@ export const calendarDoubleRoot = ( max={max} eventList={eventQuarterList} disabledList={disabledQuarterList} + quarterNames={quarterNames} hoveredQuarter={hoveredItem} selectIndexes={selectIndexes} onChangeQuarter={handleOnChangeQuarter} @@ -419,6 +421,7 @@ export const calendarDoubleRoot = ( max={max} eventList={eventQuarterList} disabledList={disabledQuarterList} + quarterNames={quarterNames} hoveredQuarter={hoveredItem} selectIndexes={selectIndexes} onChangeQuarter={handleOnChangeQuarter} diff --git a/packages/plasma-new-hope/src/components/Calendar/hooks/types.ts b/packages/plasma-new-hope/src/components/Calendar/hooks/types.ts index 714f9c2afa..2379b80347 100644 --- a/packages/plasma-new-hope/src/components/Calendar/hooks/types.ts +++ b/packages/plasma-new-hope/src/components/Calendar/hooks/types.ts @@ -47,6 +47,7 @@ export type UseMonthsArgs = { export type UseQuartersArgs = { includeEdgeDates?: boolean; + quarterNames?: string[]; } & UseDateStructureArgs; export type UseYearsArgs = { diff --git a/packages/plasma-new-hope/src/components/Calendar/hooks/useQuarters.ts b/packages/plasma-new-hope/src/components/Calendar/hooks/useQuarters.ts index ac511b0b0c..1fd473695b 100644 --- a/packages/plasma-new-hope/src/components/Calendar/hooks/useQuarters.ts +++ b/packages/plasma-new-hope/src/components/Calendar/hooks/useQuarters.ts @@ -17,10 +17,20 @@ import type { UseQuartersArgs } from './types'; /** * Хук для получения списка месяцев. */ -export const useQuarters = ({ date, value, eventList, disabledList, min, max, includeEdgeDates }: UseQuartersArgs) => +export const useQuarters = ({ + date, + value, + eventList, + disabledList, + min, + max, + includeEdgeDates, + quarterNames = QUARTER_NAMES, +}: UseQuartersArgs) => useMemo(() => { - const quarters = QUARTER_NAMES.map((quarterName: string) => { - const { monthIndex, day } = quarterDates[quarterName]; + const quarters = QUARTER_NAMES.map((defaultQuarterName, quarterIndex) => { + const quarterName = quarterNames[quarterIndex] ?? defaultQuarterName; + const { monthIndex, day } = quarterDates[quarterIndex]; return { quarterName, @@ -48,4 +58,4 @@ export const useQuarters = ({ date, value, eventList, disabledList, min, max, in } return getMatrix(quarters, 2); - }, [date, value, eventList, disabledList, max, min]); + }, [date, value, eventList, disabledList, max, min, includeEdgeDates, quarterNames]); diff --git a/packages/plasma-new-hope/src/components/Calendar/ui/CalendarQuarters/CalendarQuarters.tsx b/packages/plasma-new-hope/src/components/Calendar/ui/CalendarQuarters/CalendarQuarters.tsx index 7287e1d0aa..b15a196a6c 100644 --- a/packages/plasma-new-hope/src/components/Calendar/ui/CalendarQuarters/CalendarQuarters.tsx +++ b/packages/plasma-new-hope/src/components/Calendar/ui/CalendarQuarters/CalendarQuarters.tsx @@ -19,6 +19,7 @@ export const CalendarQuarters: React.FC = ({ disabledList, min, max, + quarterNames, outerRefs, isDouble, isSecond, @@ -39,6 +40,7 @@ export const CalendarQuarters: React.FC = ({ disabledList, min: minDate, max: maxDate, + quarterNames, }); const selectedRef = useRef(selected); const onSetSelectedRef = useRef(onSetSelected); diff --git a/packages/plasma-new-hope/src/components/Calendar/ui/CalendarQuarters/CalendarQuarters.types.ts b/packages/plasma-new-hope/src/components/Calendar/ui/CalendarQuarters/CalendarQuarters.types.ts index 4f55f11521..233dc605bb 100644 --- a/packages/plasma-new-hope/src/components/Calendar/ui/CalendarQuarters/CalendarQuarters.types.ts +++ b/packages/plasma-new-hope/src/components/Calendar/ui/CalendarQuarters/CalendarQuarters.types.ts @@ -7,6 +7,7 @@ export interface CalendarQuartersProps extends HTMLAttributes { value: CalendarValueType; outerRefs: MutableRefObject; onChangeQuarter: (date: DateObject, coord: number[], quarterName: string) => void; + quarterNames?: string[]; eventList?: EventDay[]; disabledList?: DisabledDay[]; min?: Date; diff --git a/packages/plasma-new-hope/src/components/Calendar/utils/constants.ts b/packages/plasma-new-hope/src/components/Calendar/utils/constants.ts index 3c465313e1..ff11e1459c 100644 --- a/packages/plasma-new-hope/src/components/Calendar/utils/constants.ts +++ b/packages/plasma-new-hope/src/components/Calendar/utils/constants.ts @@ -50,24 +50,24 @@ export const offsetMap = { export const QUARTER_NAMES = ['Q1', 'Q2', 'Q3', 'Q4']; -export const quarterDates: Record = { - Q1: { +export const quarterDates: QuarterPartialDate[] = [ + { monthIndex: 0, day: 1, }, - Q2: { + { monthIndex: 3, day: 1, }, - Q3: { + { monthIndex: 6, day: 1, }, - Q4: { + { monthIndex: 9, day: 1, }, -}; +]; export const SHORT_DAY_NAMES: LocalMap = { ru: WEEKS.map(callbackDayFormatter('ru', { weekday: 'short' })), diff --git a/packages/plasma-new-hope/src/components/DatePicker/DatePicker.component-test.tsx b/packages/plasma-new-hope/src/components/DatePicker/DatePicker.component-test.tsx index 68bc3fd394..8398b535ba 100644 --- a/packages/plasma-new-hope/src/components/DatePicker/DatePicker.component-test.tsx +++ b/packages/plasma-new-hope/src/components/DatePicker/DatePicker.component-test.tsx @@ -305,6 +305,28 @@ describeFn('DatePicker', () => { cy.matchImageSnapshot(); }); + it('custom quarter names', () => { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + const onCommitDate = cy.stub().as('onCommitDate'); + + mount( + , + ); + + cy.get('input').first().click(); + quarterNames.forEach((quarterName) => { + cy.contains('[role="gridcell"]', quarterName).should('be.visible'); + }); + + cy.get('input').first().type('14.06.2023'); + cy.get('@onCommitDate').its('lastCall.args.1.dateInfo.name').should('equal', quarterNames[1]); + }); + it('input date from calendar', () => { mount( { cy.matchImageSnapshot(); }); + it('custom quarter names', () => { + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + const onCommitFirstDate = cy.stub().as('onCommitFirstDate'); + + mount( + , + ); + + cy.get('input').first().click(); + quarterNames.forEach((quarterName) => { + cy.contains('[role="gridcell"]', quarterName).should('be.visible'); + }); + + cy.get('input').first().type('14.06.2023'); + cy.get('@onCommitFirstDate').its('lastCall.args.1.dateInfo.name').should('equal', quarterNames[1]); + }); + it('change only second date', () => { mount(); diff --git a/packages/plasma-new-hope/src/components/DatePicker/DatePickerBase.types.ts b/packages/plasma-new-hope/src/components/DatePicker/DatePickerBase.types.ts index 444faa38dc..bc4b1502e5 100644 --- a/packages/plasma-new-hope/src/components/DatePicker/DatePickerBase.types.ts +++ b/packages/plasma-new-hope/src/components/DatePicker/DatePickerBase.types.ts @@ -117,6 +117,11 @@ export type DatePickerCalendarProps = { * Список отключенных кварталов. */ disabledQuarterList?: DisabledDay[]; + /** + * Названия кварталов. + * @default ['Q1', 'Q2', 'Q3', 'Q4'] + */ + quarterNames?: string[]; /** * Список событий по годам. */ @@ -211,6 +216,7 @@ export type UseDatePickerProps = { min?: Date; max?: Date; includeEdgeDates?: boolean; + quarterNames?: string[]; setInnerDate: Dispatch>; setCorrectDates: Dispatch< SetStateAction<{ diff --git a/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.tsx b/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.tsx index 78c5397803..2cbbe0189e 100644 --- a/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.tsx +++ b/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.tsx @@ -130,6 +130,7 @@ export const datePickerRangeRoot = (Root: RootProps { cy.matchImageSnapshot(); }); + it('custom quarter names', () => { + cy.viewport(750, 700); + const quarterNames = ['Первый квартал', 'Второй квартал', 'Третий квартал', 'Четвертый квартал']; + const onCommitDate = cy.stub().as('onCommitDate'); + + mount( + , + ); + + cy.get('input').first().click(); + quarterNames.forEach((quarterName) => { + cy.contains('[role="gridcell"]', quarterName).should('be.visible'); + }); + + cy.get('input').first().type('14.06.2023 05:06:07'); + cy.get('@onCommitDate').its('lastCall.args.1.quarterInfo.name').should('equal', quarterNames[1]); + }); + it('input date from calendar', () => { cy.viewport(750, 700); mount( diff --git a/packages/plasma-new-hope/src/components/DateTimePicker/DateTimePicker.tsx b/packages/plasma-new-hope/src/components/DateTimePicker/DateTimePicker.tsx index 768f73da30..300d08f3e9 100644 --- a/packages/plasma-new-hope/src/components/DateTimePicker/DateTimePicker.tsx +++ b/packages/plasma-new-hope/src/components/DateTimePicker/DateTimePicker.tsx @@ -76,6 +76,7 @@ export const dateTimePickerRoot = (Root: RootProps