@uzum-tech/ui 1.12.21 → 1.13.0

package/lib/date-picker-v2/src/composables/useCalendarScroll.js

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCalendarScroll = useCalendarScroll;
+const vue_1 = require("vue");
+const config_1 = require("../config");
+function useCalendarScroll() {
+    // Локальные рефы для scrollbar
+    const monthScrollbarRef = (0, vue_1.ref)(null);
+    const yearScrollbarRef = (0, vue_1.ref)(null);
+    const calendarScrollbarRef = (0, vue_1.ref)(null);
+    // Прокрутить к месяцу в списке месяцев (левая колонка)
+    function scrollToMonthInMonthList(year, month) {
+        if (!monthScrollbarRef.value)
+            return;
+        const yearIndex = year - config_1.START_YEAR;
+        if (yearIndex < 0)
+            return;
+        // Позиция начала года + заголовок года + позиция месяца в году
+        const monthPosition = yearIndex * config_1.YEAR_GROUP_HEIGHT + config_1.YEAR_HEADER_HEIGHT;
+        // Отступ сверху чтобы месяц был примерно в центре видимой области (около 4-5 месяцев видно)
+        const offsetToCenter = month > 6 ? config_1.YEAR_HEADER_HEIGHT * 5 : 0;
+        monthScrollbarRef.value.scrollTo({
+            top: Math.max(0, monthPosition + offsetToCenter)
+        });
+    }
+    // Прокрутить к году в dropdown
+    function scrollToYear(year) {
+        const yearIndex = year - config_1.START_YEAR;
+        if (yearIndex >= 0 && yearScrollbarRef.value) {
+            yearScrollbarRef.value.scrollTo({
+                top: yearIndex * config_1.YEAR_HEADER_HEIGHT
+            });
+        }
+    }
+    function getMonthSectionHeight(rows) {
+        const safeRows = Math.max(1, rows);
+        return (config_1.CALENDAR_MONTH_TITLE_HEIGHT +
+            safeRows * config_1.DATE_CELL_HEIGHT +
+            (safeRows - 1) * config_1.DATE_CELL_GAP +
+            config_1.CALENDAR_MONTH_SECTION_MARGIN);
+    }
+    // Прокрутить к месяцу в календаре (правая колонка)
+    // Высота секции месяца зависит от количества строк (5 или 6)
+    function scrollToMonthInCalendar(month, monthRows) {
+        if (!calendarScrollbarRef.value)
+            return;
+        const safeIndex = Math.max(0, Math.min(month, monthRows.length - 1));
+        let monthPosition = 0;
+        for (let i = 0; i < safeIndex; i++) {
+            monthPosition += getMonthSectionHeight(monthRows[i]);
+        }
+        calendarScrollbarRef.value.scrollTo({
+            top: monthPosition
+        });
+    }
+    return {
+        monthScrollbarRef,
+        yearScrollbarRef,
+        calendarScrollbarRef,
+        scrollToMonthInMonthList,
+        scrollToYear,
+        scrollToMonthInCalendar
+    };
+}

package/lib/date-picker-v2/src/config.d.ts

@@ -0,0 +1,14 @@
+export declare const START_YEAR = 2000;
+export declare const END_YEAR = 2050;
+export declare const MONTH_ITEM_HEIGHT = 48;
+export declare const YEAR_HEADER_HEIGHT = 42;
+export declare const MONTH_ITEM_GAP = 0;
+export declare const YEAR_GROUP_HEIGHT: number;
+export declare const DATE_CELL_HEIGHT = 42;
+export declare const DATE_CELL_GAP = 4;
+export declare const CALENDAR_MONTH_TITLE_HEIGHT = 40;
+export declare const CALENDAR_DATE_GRID_HEIGHT: number;
+export declare const CALENDAR_MONTH_SECTION_MARGIN = 16;
+export declare const CALENDAR_MONTH_SECTION_HEIGHT: number;
+export declare const MONTH_NAMES: readonly ["Январь", "Февраль", "Март", "Апрель", "Май", "Июнь", "Июль", "Август", "Сентябрь", "Октябрь", "Ноябрь", "Декабрь"];
+export type DatePickerV2Type = 'date' | 'daterange';

package/lib/date-picker-v2/src/config.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MONTH_NAMES = exports.CALENDAR_MONTH_SECTION_HEIGHT = exports.CALENDAR_MONTH_SECTION_MARGIN = exports.CALENDAR_DATE_GRID_HEIGHT = exports.CALENDAR_MONTH_TITLE_HEIGHT = exports.DATE_CELL_GAP = exports.DATE_CELL_HEIGHT = exports.YEAR_GROUP_HEIGHT = exports.MONTH_ITEM_GAP = exports.YEAR_HEADER_HEIGHT = exports.MONTH_ITEM_HEIGHT = exports.END_YEAR = exports.START_YEAR = void 0;
+exports.START_YEAR = 2000;
+exports.END_YEAR = 2050;
+exports.MONTH_ITEM_HEIGHT = 48;
+exports.YEAR_HEADER_HEIGHT = 42;
+exports.MONTH_ITEM_GAP = 0;
+// Высота одной группы года = заголовок + 12 месяцев
+exports.YEAR_GROUP_HEIGHT = exports.YEAR_HEADER_HEIGHT + exports.MONTH_ITEM_HEIGHT * 12;
+// Константы для секции месяца в календаре (правая колонка)
+exports.DATE_CELL_HEIGHT = 42;
+exports.DATE_CELL_GAP = 4;
+// Высота заголовка месяца (padding-top: 12px + line-height ~20px + padding-bottom: 8px)
+exports.CALENDAR_MONTH_TITLE_HEIGHT = 40;
+// Высота сетки дат (6 строк * 42px + 5 gaps * 4px)
+exports.CALENDAR_DATE_GRID_HEIGHT = exports.DATE_CELL_HEIGHT * 6 + exports.DATE_CELL_GAP * 5;
+// Отступ снизу секции
+exports.CALENDAR_MONTH_SECTION_MARGIN = 16;
+// Общая высота секции месяца
+exports.CALENDAR_MONTH_SECTION_HEIGHT = exports.CALENDAR_MONTH_TITLE_HEIGHT +
+    exports.CALENDAR_DATE_GRID_HEIGHT +
+    exports.CALENDAR_MONTH_SECTION_MARGIN;
+exports.MONTH_NAMES = [
+    'Январь',
+    'Февраль',
+    'Март',
+    'Апрель',
+    'Май',
+    'Июнь',
+    'Июль',
+    'Август',
+    'Сентябрь',
+    'Октябрь',
+    'Ноябрь',
+    'Декабрь'
+];

package/lib/date-picker-v2/src/interface.d.ts

@@ -0,0 +1,42 @@
+import type { Ref, InjectionKey } from 'vue';
+import type { MergedTheme } from '../../_mixins';
+import type { DatePickerV2Theme } from '../styles';
+export type Value = number | null;
+export type RangeValue = [number, number] | null;
+export interface DateItem {
+    year: number;
+    month: number;
+    date: number;
+    ts: number;
+    isCurrentDate: boolean;
+    isCurrentMonth: boolean;
+    selected: boolean;
+    inRange: boolean;
+    isRangeStart: boolean;
+    isRangeEnd: boolean;
+    disabled: boolean;
+}
+export interface MonthItem {
+    year: number;
+    month: number;
+    label: string;
+    ts: number;
+}
+export interface YearItem {
+    year: number;
+    ts: number;
+}
+export type OnUpdateValue = (value: Value) => void;
+export type OnUpdateRangeValue = (value: RangeValue) => void;
+export type IsSingleDateDisabled = (date: number) => boolean;
+export type IsRangeDateDisabled = (date: number, position: 'start' | 'end', value: [number, number] | null) => boolean;
+export type IsDateDisabled = IsSingleDateDisabled | IsRangeDateDisabled;
+export type TriggerPreset = 'input' | 'select' | 'button';
+export interface DatePickerV2Injection {
+    mergedClsPrefixRef: Ref<string>;
+    mergedThemeRef: Ref<MergedTheme<DatePickerV2Theme>>;
+    localeRef: Ref<any>;
+    dateLocaleRef: Ref<any>;
+    isDateDisabledRef: Ref<IsDateDisabled | undefined>;
+}
+export declare const datePickerV2InjectionKey: InjectionKey<DatePickerV2Injection>;

package/lib/date-picker-v2/src/interface.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.datePickerV2InjectionKey = void 0;
+exports.datePickerV2InjectionKey = Symbol('datePickerV2');