@archytechtor/ui 0.0.0-stage → 0.2.0

package/dist/lib/format.d.ts

@@ -0,0 +1,67 @@
+import { PluralFormsT } from "./locale.js";
+/**
+ * Дата в любом виде, который понимает конструктор Date
+ */
+export type DateInputT = Date | number | string;
+/**
+ * Настройки форматирования денег
+ * @property fractionDigits - знаков после запятой; по умолчанию 0 для целых сумм и 2 для дробных
+ * @property currency - код валюты ISO 4217, по умолчанию RUB
+ */
+export interface MoneyFormatOptionsI {
+  fractionDigits?: number;
+  currency?: string;
+}
+/**
+ * Отформатировать дату: 31.12.2026
+ * @param value - дата, timestamp или строка
+ * @param pattern - шаблон date-fns, по умолчанию dd.MM.yyyy
+ * @returns строка даты или пустая строка, если дата не распознана
+ */
+export declare function formatDate(value: DateInputT, pattern?: string): string;
+/**
+ * Отформатировать дату и время: 31.12.2026 23:59
+ * @param value - дата, timestamp или строка
+ * @returns строка даты и времени или пустая строка, если дата не распознана
+ */
+export declare function formatDateTime(value: DateInputT): string;
+/**
+ * Отформатировать число: 1 234 567,89 (разделитель тысяч — неразрывный пробел)
+ * @param value - число
+ * @param options - настройки Intl.NumberFormat
+ * @returns строка числа
+ */
+export declare function formatNumber(value: number, options?: Intl.NumberFormatOptions): string;
+/**
+ * Отформатировать сумму: 1 234,50 ₽ (символ валюты после суммы)
+ * @param value - сумма
+ * @param options - знаков после запятой и валюта
+ * @returns строка суммы
+ */
+export declare function formatMoney(value: number, options?: MoneyFormatOptionsI): string;
+/**
+ * Отформатировать телефон: +7 (912) 345-67-89.
+ * Неполный номер форматируется по мере ввода: +7 (912) 34
+ * @param value - телефон в любом виде: 89123456789, +7 912 345 67 89, 9123456789
+ * @returns телефон в формате +7 (XXX) XXX-XX-XX или пустая строка, если цифр нет
+ */
+export declare function formatPhone(value: string): string;
+/**
+ * Привести телефон к виду +79123456789
+ * @param value - телефон в любом виде
+ * @returns телефон в формате E.164 или null, если цифр не 10
+ */
+export declare function normalizePhone(value: string): string | null;
+/**
+ * Выбрать форму слова по числу: 1 файл, 2 файла, 5 файлов
+ * @param count - число
+ * @param forms - формы слова для 1, 2 и 5
+ * @returns подходящая форма слова
+ */
+export declare function pluralize(count: number, forms: PluralFormsT): string;
+/**
+ * Время в виде «3:05» или «1:03:05»
+ * @param seconds - секунды
+ * @returns строка времени
+ */
+export declare function formatDuration(seconds: number): string;

package/dist/lib/format.js

@@ -0,0 +1,130 @@
+import { DATE_FORMAT, DATE_TIME_FORMAT, NUMBER_LOCALE, dateLocale } from "./locale.js";
+import { format, isValid } from "date-fns";
+// src/lib/format.ts
+/**
+* Привести значение к дате
+* @param value - дата, timestamp или строка
+* @returns дата или null, если значение не распознано
+*/
+function toDate(value) {
+	const date = value instanceof Date ? value : new Date(value);
+	if (!isValid(date)) return null;
+	return date;
+}
+/**
+* Отформатировать дату: 31.12.2026
+* @param value - дата, timestamp или строка
+* @param pattern - шаблон date-fns, по умолчанию dd.MM.yyyy
+* @returns строка даты или пустая строка, если дата не распознана
+*/
+function formatDate(value, pattern = DATE_FORMAT) {
+	const date = toDate(value);
+	if (date === null) return "";
+	return format(date, pattern, { locale: dateLocale });
+}
+/**
+* Отформатировать дату и время: 31.12.2026 23:59
+* @param value - дата, timestamp или строка
+* @returns строка даты и времени или пустая строка, если дата не распознана
+*/
+function formatDateTime(value) {
+	return formatDate(value, DATE_TIME_FORMAT);
+}
+/**
+* Отформатировать число: 1 234 567,89 (разделитель тысяч — неразрывный пробел)
+* @param value - число
+* @param options - настройки Intl.NumberFormat
+* @returns строка числа
+*/
+function formatNumber(value, options) {
+	return new Intl.NumberFormat(NUMBER_LOCALE, options).format(value);
+}
+/**
+* Отформатировать сумму: 1 234,50 ₽ (символ валюты после суммы)
+* @param value - сумма
+* @param options - знаков после запятой и валюта
+* @returns строка суммы
+*/
+function formatMoney(value, options = {}) {
+	const defaultDigits = Number.isInteger(value) ? 0 : 2;
+	const fractionDigits = options.fractionDigits ?? defaultDigits;
+	return formatNumber(value, {
+		style: "currency",
+		currency: options.currency ?? "RUB",
+		minimumFractionDigits: fractionDigits,
+		maximumFractionDigits: fractionDigits
+	});
+}
+/**
+* Получить 10 цифр номера без кода страны.
+* Ведущие 7 или 8 отбрасываются, если номер введён с кодом страны.
+* @param value - телефон в любом виде
+* @returns до 10 цифр номера
+*/
+function getPhoneDigits(value) {
+	const digits = value.replace(/\D/g, "");
+	if (value.trim().startsWith("+7") || digits.length > 10 && /^[78]/.test(digits)) return digits.slice(1, 11);
+	return digits.slice(0, 10);
+}
+/**
+* Отформатировать телефон: +7 (912) 345-67-89.
+* Неполный номер форматируется по мере ввода: +7 (912) 34
+* @param value - телефон в любом виде: 89123456789, +7 912 345 67 89, 9123456789
+* @returns телефон в формате +7 (XXX) XXX-XX-XX или пустая строка, если цифр нет
+*/
+function formatPhone(value) {
+	const digits = getPhoneDigits(value);
+	if (digits.length === 0) return "";
+	const code = digits.slice(0, 3);
+	const first = digits.slice(3, 6);
+	const second = digits.slice(6, 8);
+	const third = digits.slice(8, 10);
+	let result = `+7 (${code}`;
+	if (digits.length >= 3) result += ")";
+	if (first) result += ` ${first}`;
+	if (second) result += `-${second}`;
+	if (third) result += `-${third}`;
+	return result;
+}
+/**
+* Привести телефон к виду +79123456789
+* @param value - телефон в любом виде
+* @returns телефон в формате E.164 или null, если цифр не 10
+*/
+function normalizePhone(value) {
+	const digits = getPhoneDigits(value);
+	if (digits.length !== 10) return null;
+	return `+7${digits}`;
+}
+/**
+* Выбрать форму слова по числу: 1 файл, 2 файла, 5 файлов
+* @param count - число
+* @param forms - формы слова для 1, 2 и 5
+* @returns подходящая форма слова
+*/
+function pluralize(count, forms) {
+	const [one, few, many] = forms;
+	if (!Number.isInteger(count)) return few;
+	const absolute = Math.abs(count);
+	const lastDigit = absolute % 10;
+	const lastTwoDigits = absolute % 100;
+	if (lastTwoDigits >= 11 && lastTwoDigits <= 14) return many;
+	if (lastDigit === 1) return one;
+	if (lastDigit >= 2 && lastDigit <= 4) return few;
+	return many;
+}
+/**
+* Время в виде «3:05» или «1:03:05»
+* @param seconds - секунды
+* @returns строка времени
+*/
+function formatDuration(seconds) {
+	if (!Number.isFinite(seconds) || seconds < 0) return "0:00";
+	const total = Math.floor(seconds);
+	const hours = Math.floor(total / 3600);
+	const minutes = Math.floor(total % 3600 / 60);
+	const rest = String(total % 60).padStart(2, "0");
+	if (hours > 0) return `${hours}:${String(minutes).padStart(2, "0")}:${rest}`;
+	return `${minutes}:${rest}`;
+}
+export { formatDate, formatDateTime, formatDuration, formatMoney, formatNumber, formatPhone, normalizePhone, pluralize };

package/dist/lib/locale.d.ts

@@ -0,0 +1,104 @@
+/**
+ * Единый источник русских форматов и текстов по умолчанию.
+ * Локализации нет: компоненты используют только эти константы,
+ * а любой текст переопределяется пропом компонента.
+ */
+/** Локаль date-fns */
+export declare const dateLocale: import("date-fns").Locale;
+/** Первый день недели: понедельник */
+export declare const weekStartsOn = 1;
+/** Формат даты: 31.12.2026 */
+export declare const DATE_FORMAT = "dd.MM.yyyy";
+/** Формат даты и времени: 31.12.2026 23:59 */
+export declare const DATE_TIME_FORMAT = "dd.MM.yyyy HH:mm";
+/** Формат времени, 24 часа: 23:59 */
+export declare const TIME_FORMAT = "HH:mm";
+/** Маска ввода даты */
+export declare const DATE_MASK = "дд.мм.гггг";
+/** Локаль Intl для чисел и денег */
+export declare const NUMBER_LOCALE = "ru-RU";
+/** Код валюты */
+export declare const CURRENCY = "RUB";
+/** Символ валюты: ставится после суммы */
+export declare const CURRENCY_SYMBOL = "₽";
+/** Код страны в телефоне */
+export declare const PHONE_COUNTRY_CODE = "+7";
+/** Количество цифр номера без кода страны */
+export declare const PHONE_DIGITS = 10;
+/** Маска ввода телефона */
+export declare const PHONE_MASK = "+7 (___) ___-__-__";
+/**
+ * Формы слова для pluralize: [1 файл, 2 файла, 5 файлов]
+ */
+export type PluralFormsT = readonly [one: string, few: string, many: string];
+/** Тексты интерфейса по умолчанию */
+export declare const texts: {
+  readonly close: "Закрыть";
+  readonly open: "Открыть";
+  readonly cancel: "Отмена";
+  readonly confirm: "Подтвердить";
+  readonly save: "Сохранить";
+  readonly delete: "Удалить";
+  readonly edit: "Изменить";
+  readonly search: "Поиск";
+  readonly searchPlaceholder: "Поиск…";
+  readonly loading: "Загрузка…";
+  readonly empty: "Ничего не найдено";
+  readonly noData: "Нет данных";
+  readonly previous: "Назад";
+  readonly next: "Далее";
+  readonly previousPage: "Предыдущая страница";
+  readonly nextPage: "Следующая страница";
+  readonly morePages: "Ещё страницы";
+  readonly more: "Ещё";
+  readonly select: "Выбрать";
+  readonly selectPlaceholder: "Выберите значение";
+  readonly clear: "Очистить";
+  readonly copy: "Копировать";
+  readonly copied: "Скопировано";
+  readonly done: "Готово";
+  readonly holdToConfirm: "Нажмите и удерживайте, чтобы подтвердить";
+  readonly increase: "Увеличить";
+  readonly decrease: "Уменьшить";
+  readonly value: "Значение";
+  readonly required: "Обязательное поле";
+  readonly toggleMenu: "Открыть меню";
+  readonly toggleSidebar: "Переключить боковую панель";
+  readonly sidebar: "Боковая панель";
+  readonly sidebarDescription: "Боковая панель на мобильном экране";
+  readonly breadcrumb: "Навигационная цепочка";
+  readonly pagination: "Постраничная навигация";
+  readonly today: "Сегодня";
+  readonly pickDate: "Выберите дату";
+  readonly minimum: "Минимум";
+  readonly maximum: "Максимум";
+  readonly pickDateRange: "Выберите период";
+  readonly previousMonth: "Предыдущий месяц";
+  readonly nextMonth: "Следующий месяц";
+  readonly previousSlide: "Предыдущий слайд";
+  readonly nextSlide: "Следующий слайд";
+  readonly carousel: "карусель";
+  readonly slide: "слайд";
+  readonly notifications: "Уведомления";
+  readonly firstPage: "Первая страница";
+  readonly lastPage: "Последняя страница";
+  readonly rowsPerPage: "Строк на странице";
+  readonly page: "Страница";
+  readonly of: "из";
+  readonly selected: "Выбрано";
+  readonly sortAscending: "По возрастанию";
+  readonly sortDescending: "По убыванию";
+  readonly hide: "Скрыть";
+  readonly view: "Вид";
+  readonly columns: "Столбцы";
+  readonly suggestions: "Варианты";
+  readonly openList: "Открыть список";
+  readonly commandPalette: "Палитра команд";
+  readonly commandPaletteDescription: "Найдите команду для запуска…";
+};
+/** Формы слова «строка» для pluralize */
+export declare const ROW_FORMS: PluralFormsT;
+/**
+ * Ключ текста интерфейса по умолчанию
+ */
+export type TextKeyT = keyof typeof texts;

package/dist/lib/locale.js

@@ -0,0 +1,103 @@
+import { ru } from "date-fns/locale/ru";
+// src/lib/locale.ts
+/**
+* Единый источник русских форматов и текстов по умолчанию.
+* Локализации нет: компоненты используют только эти константы,
+* а любой текст переопределяется пропом компонента.
+*/
+/** Локаль date-fns */
+const dateLocale = ru;
+/** Первый день недели: понедельник */
+const weekStartsOn = 1;
+/** Формат даты: 31.12.2026 */
+const DATE_FORMAT = "dd.MM.yyyy";
+/** Формат даты и времени: 31.12.2026 23:59 */
+const DATE_TIME_FORMAT = "dd.MM.yyyy HH:mm";
+/** Формат времени, 24 часа: 23:59 */
+const TIME_FORMAT = "HH:mm";
+/** Маска ввода даты */
+const DATE_MASK = "дд.мм.гггг";
+/** Локаль Intl для чисел и денег */
+const NUMBER_LOCALE = "ru-RU";
+/** Код валюты */
+const CURRENCY = "RUB";
+/** Символ валюты: ставится после суммы */
+const CURRENCY_SYMBOL = "₽";
+/** Код страны в телефоне */
+const PHONE_COUNTRY_CODE = "+7";
+/** Количество цифр номера без кода страны */
+const PHONE_DIGITS = 10;
+/** Маска ввода телефона */
+const PHONE_MASK = "+7 (___) ___-__-__";
+/** Тексты интерфейса по умолчанию */
+const texts = {
+	close: "Закрыть",
+	open: "Открыть",
+	cancel: "Отмена",
+	confirm: "Подтвердить",
+	save: "Сохранить",
+	delete: "Удалить",
+	edit: "Изменить",
+	search: "Поиск",
+	searchPlaceholder: "Поиск…",
+	loading: "Загрузка…",
+	empty: "Ничего не найдено",
+	noData: "Нет данных",
+	previous: "Назад",
+	next: "Далее",
+	previousPage: "Предыдущая страница",
+	nextPage: "Следующая страница",
+	morePages: "Ещё страницы",
+	more: "Ещё",
+	select: "Выбрать",
+	selectPlaceholder: "Выберите значение",
+	clear: "Очистить",
+	copy: "Копировать",
+	copied: "Скопировано",
+	done: "Готово",
+	holdToConfirm: "Нажмите и удерживайте, чтобы подтвердить",
+	increase: "Увеличить",
+	decrease: "Уменьшить",
+	value: "Значение",
+	required: "Обязательное поле",
+	toggleMenu: "Открыть меню",
+	toggleSidebar: "Переключить боковую панель",
+	sidebar: "Боковая панель",
+	sidebarDescription: "Боковая панель на мобильном экране",
+	breadcrumb: "Навигационная цепочка",
+	pagination: "Постраничная навигация",
+	today: "Сегодня",
+	pickDate: "Выберите дату",
+	minimum: "Минимум",
+	maximum: "Максимум",
+	pickDateRange: "Выберите период",
+	previousMonth: "Предыдущий месяц",
+	nextMonth: "Следующий месяц",
+	previousSlide: "Предыдущий слайд",
+	nextSlide: "Следующий слайд",
+	carousel: "карусель",
+	slide: "слайд",
+	notifications: "Уведомления",
+	firstPage: "Первая страница",
+	lastPage: "Последняя страница",
+	rowsPerPage: "Строк на странице",
+	page: "Страница",
+	of: "из",
+	selected: "Выбрано",
+	sortAscending: "По возрастанию",
+	sortDescending: "По убыванию",
+	hide: "Скрыть",
+	view: "Вид",
+	columns: "Столбцы",
+	suggestions: "Варианты",
+	openList: "Открыть список",
+	commandPalette: "Палитра команд",
+	commandPaletteDescription: "Найдите команду для запуска…"
+};
+/** Формы слова «строка» для pluralize */
+const ROW_FORMS = [
+	"строки",
+	"строк",
+	"строк"
+];
+export { CURRENCY, CURRENCY_SYMBOL, DATE_FORMAT, DATE_MASK, DATE_TIME_FORMAT, NUMBER_LOCALE, PHONE_COUNTRY_CODE, PHONE_DIGITS, PHONE_MASK, ROW_FORMS, TIME_FORMAT, dateLocale, texts, weekStartsOn };

package/dist/lib/part-props.d.ts

@@ -0,0 +1,15 @@
+import { CSSProperties } from "react";
+/**
+ * Пропсы части на Base UI: className только строкой, render и style описаны по-русски.
+ * Свой элемент вместо стандартного передают через render: render={<Button />} или render={<a href />}
+ */
+export type PartPropsT<PropsT extends {
+  render?: unknown;
+}> = Omit<PropsT, 'className' | 'render' | 'style'> & {
+  /** Классы элемента */
+  className?: string;
+  /** Свой элемент вместо стандартного: render={<Button />}. Стили и пропсы переходят на него */
+  render?: PropsT['render'];
+  /** Инлайн-стили элемента */
+  style?: CSSProperties;
+};

package/dist/lib/use-controllable-state.js

@@ -0,0 +1,22 @@
+"use client";
+import { useCallback, useEffect, useRef, useState } from "react";
+// src/lib/use-controllable-state.ts
+/**
+* Состояние в контролируемом (value + onChange) или неконтролируемом (defaultValue) режиме
+* @param options - параметры состояния
+* @returns текущее значение и функция изменения
+*/
+function useControllableState({ prop, defaultProp, onChange }) {
+	const [inner, setInner] = useState(defaultProp);
+	const isControlled = prop !== void 0;
+	const value = isControlled ? prop : inner;
+	const onChangeRef = useRef(onChange);
+	useEffect(() => {
+		onChangeRef.current = onChange;
+	});
+	return [value, useCallback((next) => {
+		if (!isControlled) setInner(next);
+		if (next !== value) onChangeRef.current?.(next);
+	}, [isControlled, value])];
+}
+export { useControllableState };

package/dist/lib/utils.d.ts

@@ -0,0 +1,9 @@
+import { ClassValue } from "clsx";
+/**
+ * Склеить классы и разрешить конфликты Tailwind: последний класс побеждает.
+ * Заодно при первом вызове в браузере включает слежку за источником фокуса (installFocusSource):
+ * cn вызывают все компоненты, так кольцо фокуса работает без отдельной настройки
+ * @param inputs - классы, объекты и массивы в формате clsx
+ * @returns итоговая строка классов
+ */
+export declare function cn(...inputs: ClassValue[]): string;

package/dist/lib/utils.js

@@ -0,0 +1,16 @@
+import { installFocusSource } from "./focus-source.js";
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+// src/lib/utils.ts
+/**
+* Склеить классы и разрешить конфликты Tailwind: последний класс побеждает.
+* Заодно при первом вызове в браузере включает слежку за источником фокуса (installFocusSource):
+* cn вызывают все компоненты, так кольцо фокуса работает без отдельной настройки
+* @param inputs - классы, объекты и массивы в формате clsx
+* @returns итоговая строка классов
+*/
+function cn(...inputs) {
+	installFocusSource();
+	return twMerge(clsx(inputs));
+}
+export { cn };

package/dist/styles/index.css

@@ -0,0 +1,128 @@
+/*
+ * Точка входа стилей @archytechtor/ui. Подключение в приложении:
+ *
+ *   @import "tailwindcss";
+ *   @import "@archytechtor/ui/styles.css";
+ *
+ * Файл компилирует Tailwind потребителя. Все стили библиотеки лежат в @layer base,
+ * а классы компонентов — обычные утилиты в слое utilities, поэтому утилиты
+ * и собственный CSS приложения всегда побеждают.
+ */
+@import 'tw-animate-css';
+@import './theme.css';
+@import './utilities.css';
+
+/* Классы компонентов из собранных файлов пакета (dist) */
+@source "../**/*.js";
+
+/* Тёмная тема — класс .dark на корне (или на любом предке) */
+@custom-variant dark (&:where(.dark, .dark *));
+
+/* Ориентация Radix-примитивов: data-horizontal:… и data-vertical:… */
+@custom-variant data-horizontal (&[data-orientation=horizontal]);
+@custom-variant data-vertical (&[data-orientation=vertical]);
+
+/*
+ * Состояния: data-state у Radix или отдельный атрибут у Base UI и своих частей
+ * (data-open, data-active="true"). Значение "false" не считается
+ */
+@custom-variant data-checked (&:is([data-state=checked], [data-checked]:not([data-checked=false])));
+@custom-variant data-unchecked (&:is([data-state=unchecked], [data-unchecked]:not([data-unchecked=false])));
+@custom-variant data-open (&:is([data-state=open], [data-open]:not([data-open=false])));
+@custom-variant data-closed (&:is([data-state=closed], [data-closed]:not([data-closed=false])));
+@custom-variant data-active (&:is([data-state=active], [data-active]:not([data-active=false])));
+@custom-variant data-disabled (&:is([data-disabled]:not([data-disabled=false])));
+
+/*
+ * Кольцо фокуса — только при работе с клавиатуры. <html data-focus-source="pointer"> ставится при
+ * нажатии мышью или касании (lib/focus-source.ts): focus-visible и keyboard тогда не срабатывают.
+ * keyboard — для состояний фокуса без focus-visible: has-[input:focus-visible], focus-within
+ */
+@custom-variant focus-visible (&:focus-visible:where(:root:not([data-focus-source=pointer]) *));
+@custom-variant keyboard (&:where(:root:not([data-focus-source=pointer]) *));
+
+@theme inline {
+	--radius-sm: calc(var(--radius) * 0.6);
+	--radius-md: calc(var(--radius) * 0.8);
+	--radius-lg: var(--radius);
+	--radius-xl: calc(var(--radius) * 1.4);
+	--radius-2xl: calc(var(--radius) * 1.8);
+	--radius-3xl: calc(var(--radius) * 2.2);
+	--radius-4xl: calc(var(--radius) * 2.6);
+	/* пружина без отскока (≈430ms) и с отскоком (≈600ms): переезды индикаторов, отпускание нажатия */
+	--ease-spring: linear(0, 0.0254, 0.0881, 0.1723, 0.2666, 0.3629, 0.4561, 0.5427, 0.621, 0.6901, 0.7499, 0.8009, 0.8436, 0.8789, 0.9077, 0.9309, 0.9494, 0.9638, 0.975, 0.9834, 0.9898, 0.9944, 0.9977, 0.9999, 1.0014, 1.0023, 1.0028, 1.003, 1.0029, 1.0028, 1.0025, 1.0023, 1);
+	--ease-spring-bounce: linear(0, 0.0409, 0.1444, 0.2848, 0.4409, 0.596, 0.7384, 0.8607, 0.9592, 1.0329, 1.0832, 1.1128, 1.1253, 1.1245, 1.1143, 1.0982, 1.079, 1.0591, 1.0403, 1.0237, 1.01, 0.9994, 0.9918, 0.987, 0.9846, 0.9841, 0.9849, 0.9867, 0.989, 0.9915, 0.9939, 0.9962, 1);
+	/* прорисовка линии svg: у path нужны pathLength=1 и stroke-dasharray=1 */
+	--animate-draw: draw 350ms cubic-bezier(0.23, 1, 0.32, 1) 80ms both;
+
+	@keyframes draw {
+		from {
+			stroke-dashoffset: 1;
+		}
+		to {
+			stroke-dashoffset: 0;
+		}
+	}
+	--color-background: var(--background);
+	--color-foreground: var(--foreground);
+	--color-card: var(--card);
+	--color-card-foreground: var(--card-foreground);
+	--color-popover: var(--popover);
+	--color-popover-foreground: var(--popover-foreground);
+	--color-primary: var(--primary);
+	--color-primary-foreground: var(--primary-foreground);
+	--color-secondary: var(--secondary);
+	--color-secondary-foreground: var(--secondary-foreground);
+	--color-muted: var(--muted);
+	--color-muted-foreground: var(--muted-foreground);
+	--color-accent: var(--accent);
+	--color-accent-foreground: var(--accent-foreground);
+	--color-destructive: var(--destructive);
+	--color-destructive-foreground: var(--destructive-foreground);
+	--color-success: var(--success);
+	--color-success-foreground: var(--success-foreground);
+	--color-border: var(--border);
+	--color-input: var(--input);
+	--color-ring: var(--ring);
+	--color-chart-1: var(--chart-1);
+	--color-chart-2: var(--chart-2);
+	--color-chart-3: var(--chart-3);
+	--color-chart-4: var(--chart-4);
+	--color-chart-5: var(--chart-5);
+	--color-sidebar: var(--sidebar);
+	--color-sidebar-foreground: var(--sidebar-foreground);
+	--color-sidebar-primary: var(--sidebar-primary);
+	--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+	--color-sidebar-accent: var(--sidebar-accent);
+	--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+	--color-sidebar-border: var(--sidebar-border);
+	--color-sidebar-ring: var(--sidebar-ring);
+}
+
+@layer base {
+	* {
+		@apply border-border outline-ring/50;
+	}
+
+	body {
+		@apply bg-background text-foreground;
+	}
+
+	/*
+	 * Автозаполнение: браузер красит поле своим фоном (!important в стилях браузера, перебить нельзя).
+	 * Смену фона растягиваем на сутки — поле остаётся своего цвета, текст — цвета темы.
+	 * !important нужен, чтобы transition-colors у поля не отменил задержку
+	 */
+	/* правила раздельно: незнакомый браузеру селектор в списке отменил бы всё правило */
+	:is(input, textarea, select):-webkit-autofill {
+		-webkit-text-fill-color: var(--foreground);
+		caret-color: var(--foreground);
+		transition: background-color 86400s step-end, color 86400s step-end !important;
+	}
+
+	:is(input, textarea, select):autofill {
+		-webkit-text-fill-color: var(--foreground);
+		caret-color: var(--foreground);
+		transition: background-color 86400s step-end, color 86400s step-end !important;
+	}
+}