@dxtmisha/constructor 0.30.1 → 0.39.3

package/dist/constructors/List/List.d.ts

@@ -0,0 +1,175 @@
+import { Ref, ToRefs, ComputedRef } from 'vue';
+import { ConstrBind, ConstrEmit, DesignComp, ListDataRef, ListDataItem, ListList, ConstrClass, ConstrStyles, ListDataFull, ListDataBasic } from '@dxtmisha/functional';
+import { EventClickInclude } from '../../classes/EventClickInclude';
+import { WindowClassesInclude } from '../Window';
+import { ListSearch } from './ListSearch';
+import { ListFocus } from './ListFocus';
+import { ListGo } from './ListGo';
+import { ListControl } from './ListControl';
+import { ListComponents, ListEmits, ListSlots } from './types';
+import { ListProps } from './props';
+import { IconValue, IconPropsBasic } from '../Icon';
+import { ListGroupSlotsPropsInclude } from '../ListGroup';
+import { NumberOrString, ItemList } from '@dxtmisha/functional-basic';
+import { ImagePropsBasic } from '../Image';
+import { BadgePropsBasic } from '../Badge';
+import { ProgressPropsBasic } from '../Progress';
+import { RouteLocationRaw } from 'vue-router';
+import { EventClickValue, RoleType } from '../../library';
+/**
+ * List
+ */
+export declare class List {
+    protected readonly props: ListProps;
+    protected readonly refs: ToRefs<ListProps>;
+    protected readonly element: Ref<HTMLElement | undefined>;
+    protected readonly classDesign: string;
+    protected readonly className: string;
+    protected readonly components?: DesignComp<ListComponents, ListProps> | undefined;
+    protected readonly slots?: ListSlots | undefined;
+    protected readonly emits?: ConstrEmit<ListEmits> | undefined;
+    readonly search: ListSearch;
+    readonly focus: ListFocus;
+    readonly data: ListDataRef;
+    readonly event: EventClickInclude;
+    readonly go: ListGo;
+    readonly control: ListControl;
+    readonly windowClasses: WindowClassesInclude;
+    /** Unique list identifier/ Уникальный идентификатор списка */
+    protected readonly id: number;
+    /**
+     * Constructor
+     * @param props input data/ входные данные
+     * @param refs input data in the form of reactive elements/ входные данные в виде реактивных элементов
+     * @param element input element/ элемент ввода
+     * @param classDesign design name/ название дизайна
+     * @param className class name/ название класса
+     * @param components object for working with components/ объект для работы с компонентами
+     * @param slots object for working with slots/ объект для работы со слотами
+     * @param emits the function is called when an event is triggered/ функция вызывается, когда срабатывает событие
+     */
+    constructor(props: ListProps, refs: ToRefs<ListProps>, element: Ref<HTMLElement | undefined>, classDesign: string, className: string, components?: DesignComp<ListComponents, ListProps> | undefined, slots?: ListSlots | undefined, emits?: ConstrEmit<ListEmits> | undefined);
+    /**
+     * Computed list data
+     *
+     * Вычисляемые данные списка
+     * */
+    readonly list: ComputedRef<ListList>;
+    /**
+     * Computed CSS classes for the cell component.
+     *
+     * Вычисляемые CSS классы для компонента ячейки.
+     */
+    readonly classes: ComputedRef<ConstrClass>;
+    /**
+     * Computed binding properties for list items/
+     * Вычисляемые привязочные свойства для элементов списка
+     * */
+    protected readonly itemBinds: ComputedRef<{
+        listId: number;
+        index?: any;
+        href?: string;
+        tag: "button" | "a" | "span" | "div" | string;
+        filterMode?: boolean;
+        divider: boolean;
+        tabindex?: number | string;
+        type?: string;
+        parent?: string;
+        search?: string;
+        isMenu?: boolean;
+        isItemMenu?: boolean;
+        highlight?: string;
+        highlightLengthStart?: number;
+        value?: any;
+        label?: NumberOrString;
+        labelId?: string;
+        description?: string | number;
+        prefix?: string | number;
+        caption?: string | number;
+        suffix?: string | number;
+        iconTrailing?: IconValue< IconPropsBasic<ImagePropsBasic>> | undefined;
+        iconTrailingTurnOnly?: boolean;
+        iconTrailingDirOnly?: boolean;
+        iconTrailingPalette?: boolean;
+        selected?: boolean;
+        iconTurn?: boolean;
+        iconHide?: boolean;
+        iconDir?: boolean;
+        iconPalette?: boolean;
+        iconAttrs?: ConstrBind< IconPropsBasic<ImagePropsBasic>> | undefined;
+        icon?: IconValue< IconPropsBasic<ImagePropsBasic>> | undefined;
+        badge?: string | number | ConstrBind< BadgePropsBasic<IconPropsBasic<ImagePropsBasic>>> | undefined;
+        badgeDot?: boolean;
+        loading?: boolean | ConstrBind< ProgressPropsBasic> | undefined;
+        isSkeleton?: boolean;
+        readonly?: boolean;
+        disabled?: boolean;
+        to?: string | RouteLocationRaw;
+        detail?: EventClickValue["detail"];
+        role?: RoleType;
+        key?: string;
+        class?: ConstrClass;
+        style?: ConstrStyles;
+        onClick: (event: MouseEvent, options?: EventClickValue) => void;
+    }>;
+    /**
+     * Returns information about the opening status of a group item.
+     *
+     * Возвращает информацию о статусе открытия группового элемента.
+     * @param item List item data/ данные элемента списка
+     */
+    isOpenGroup(item: ConstrBind<ListDataItem>): boolean;
+    /**
+     * Gets binding properties for a list item
+     *
+     * Получает привязочные свойства для элемента списка
+     * @param item List item data/ данные элемента списка
+     */
+    getItem(item: ConstrBind<ListDataItem>): ConstrBind< ItemList>;
+    /**
+     * Gets binding properties for a group item in the list
+     *
+     * Получает привязочные свойства для группового элемента в списке
+     * @param item List item data/ данные элемента списка
+     */
+    getItemGroup(item: ConstrBind<ListDataItem>): ConstrBind< ItemList>;
+    /**
+     * Gets binding properties for a menu item in the list
+     *
+     * Получает привязочные свойства для элемента меню в списке
+     * @param item List item data/ данные элемента списка
+     */
+    getItemMenu(item: ConstrBind<ListDataItem>): ConstrBind< ItemList>;
+    /**
+     * Gets binding properties for a group management item with down arrow
+     *
+     * Получает привязочные свойства для элемента управления группой со стрелкой вниз
+     * @param item List item data/ данные элемента списка
+     * @param props additional properties/ дополнительные свойства
+     */
+    getItemManagementFormGroup(item: ConstrBind<ListDataItem>, props: ListGroupSlotsPropsInclude): ConstrBind<ListDataItem>;
+    /**
+     * Gets binding properties for a menu management item with right arrow
+     *
+     * Получает привязочные свойства для элемента управления меню со стрелкой вправо
+     * @param item List item data/ данные элемента списка
+     * @param open Whether the menu is open/ открыто ли меню
+     */
+    getItemManagementFormMenu(item: ConstrBind<ListDataItem>, open: boolean): ConstrBind<ListDataItem>;
+    /**
+     * Returns a sublist for a group item.
+     *
+     * Возвращает подсписок для группового элемента.
+     * @param item List item data/ данные элемента списка
+     */
+    getList(item: ConstrBind<ListDataItem>): ListDataFull<ListDataBasic>;
+    /**
+     * Internal method to create management item binding properties
+     *
+     * Внутренний метод для создания привязочных свойств элемента управления
+     * @param item List item data/ данные элемента списка
+     * @param open Whether the item is open/ открыт ли элемент
+     * @param icon Icon to display/ иконка для отображения
+     */
+    protected getItemManagement(item: ConstrBind<ListDataItem>, open: boolean, icon?: IconValue): ConstrBind<ListDataItem>;
+}

package/dist/constructors/List/ListControl.d.ts

@@ -0,0 +1,75 @@
+import { EventItem, ListDataRef } from '@dxtmisha/functional';
+import { ListSearch } from './ListSearch';
+import { ListGo } from './ListGo';
+import { ListProps } from './props';
+import { ComputedRef } from 'vue';
+/**
+ * Class for managing keyboard navigation and event handling in list components.
+ * Provides keyboard shortcuts, search functionality, and navigation controls.
+ *
+ * Класс для управления навигацией с клавиатуры и обработкой событий в компонентах списка.
+ * Предоставляет клавиатурные сокращения, функциональность поиска и элементы управления навигацией.
+ */
+export declare class ListControl {
+    protected readonly props: ListProps;
+    protected readonly search: ListSearch;
+    protected readonly data: ListDataRef;
+    protected readonly go: ListGo;
+    protected event?: EventItem<HTMLElement, any>;
+    /**
+     * Creates an instance of ListControl for managing keyboard navigation and events.
+     *
+     * Создает экземпляр ListControl для управления навигацией с клавиатуры и событиями.
+     * @param props input data/ входные данные
+     * @param search search functionality controller / контроллер функциональности поиска
+     * @param data list data manager / менеджер данных списка
+     * @param go navigation controller / контроллер навигации
+     */
+    constructor(props: ListProps, search: ListSearch, data: ListDataRef, go: ListGo);
+    /**
+     * Checks if the menu is active.
+     *
+     * Проверяет, активное ли меню.
+     */
+    readonly isActive: ComputedRef<boolean>;
+    /**
+     * Checks if the event target is not an input.
+     *
+     * Проверяет, не является ли цель события input.
+     * @param target selected element/ выбранный элемент
+     */
+    protected isNotInput(target: HTMLElement): boolean;
+    /**
+     * Gets the currently active input element with menu control.
+     *
+     * Получает текущий активный элемент input с управлением меню.
+     * @returns active input element or undefined / активный элемент input или undefined
+     */
+    protected getActiveElement(): HTMLInputElement | undefined;
+    /**
+     * Starts the event.
+     *
+     * Запускает событие.
+     */
+    protected start(): void;
+    /**
+     * Stops the event.
+     *
+     * Останавливает событие.
+     */
+    protected stop(): void;
+    /**
+     * Updates the search value based on keyboard input.
+     *
+     * Обновляет значение поиска на основе ввода с клавиатуры.
+     * @param event keyboard event / событие клавиатуры
+     */
+    protected updateSearch(event: KeyboardEvent): void;
+    /**
+     * Method for tracking keys when a window is open.
+     *
+     * Метод для отслеживания нажатий при открытом окне.
+     * @param event event object/ объект события
+     */
+    protected readonly on: (event: KeyboardEvent) => void;
+}

package/dist/constructors/List/ListDesign.d.ts

@@ -0,0 +1,142 @@
+import { VNode } from 'vue';
+import { ConstrOptions, ConstrStyles, DesignConstructorAbstract, ListDataItem, ListList, ListType, ConstrBind } from '@dxtmisha/functional';
+import { List } from './List';
+import { ListPropsBasic } from './props';
+import { ListClasses, ListComponents, ListEmits, ListExpose, ListSlots } from './types';
+import { WindowControlItem } from '../Window';
+import { ListGroupSlotsPropsInclude } from '../ListGroup';
+import { ItemList } from '@dxtmisha/functional-basic';
+/**
+ * ListDesign
+ */
+export declare class ListDesign<COMP extends ListComponents, EXPOSE extends ListExpose, CLASSES extends ListClasses, P extends ListPropsBasic> extends DesignConstructorAbstract<HTMLDivElement, COMP, ListEmits, EXPOSE, ListSlots, CLASSES, P> {
+    protected readonly item: List;
+    /**
+     * Constructor
+     * @param name class name/ название класса
+     * @param props properties/ свойства
+     * @param options list of additional parameters/ список дополнительных параметров
+     */
+    constructor(name: string, props: Readonly<P>, options?: ConstrOptions<COMP, ListEmits, P>);
+    /**
+     * Initialization of all the necessary properties for work
+     *
+     * Инициализация всех необходимых свойств для работы.
+     */
+    protected initExpose(): EXPOSE;
+    /**
+     * Improvement of the obtained list of classes.
+     *
+     * Доработка полученного списка классов.
+     */
+    protected initClasses(): Partial<CLASSES>;
+    /**
+     * Refinement of the received list of styles.
+     *
+     * Доработка полученного списка стилей.
+     */
+    protected initStyles(): ConstrStyles;
+    /**
+     * A method for rendering.
+     *
+     * Метод для рендеринга.
+     */
+    protected initRender(): VNode;
+    /**
+     * Generates all elements from the list.
+     *
+     * Генерирует все элементы из списка.
+     */
+    readonly renderData: () => VNode[];
+    /**
+     * Generates an element.
+     *
+     * Генерирует элемент.
+     * @param type type of list/ тип списка
+     * @param item selected element/ выбранный элемент
+     */
+    readonly renderItem: (type: ListType, item: ListDataItem) => VNode;
+    /**
+     * Generates a group element.
+     *
+     * Генерирует групповой элемент.
+     * @param item selected element/ выбранный элемент
+     * @param props data for working with the group/ данные для работы с группой
+     */
+    readonly renderItemGroup: (item: ListDataItem, props: ListGroupSlotsPropsInclude) => VNode;
+    /**
+     * Generates a menu element.
+     *
+     * Генерирует элемент меню.
+     * @param item selected element/ выбранный элемент
+     * @param props data for working with the menu/ данные для работы с меню
+     */
+    readonly renderItemMenu: (item: ListDataItem, props: WindowControlItem) => VNode;
+    /**
+     * Generates a break between elements.
+     *
+     * Генерирует разрыв между элементами.
+     * @param item selected element/ выбранный элемент
+     */
+    readonly renderSpace: (item: ListDataItem) => VNode;
+    /**
+     * Generates a dividing line.
+     *
+     * Генерирует линию разделения.
+     * @param item selected element/ выбранный элемент
+     */
+    readonly renderLine: (item: ListDataItem) => VNode;
+    /**
+     * Generates a subtitle.
+     *
+     * Генерирует подзаголовок.
+     * @param item selected element/ выбранный элемент
+     */
+    readonly renderSubtitle: (item: ListDataItem) => VNode;
+    /**
+     * Generates HTML code by the slot name or the value of the `label` field.
+     *
+     * Генерирует HTML-код по названию слота или значению поля `label`.
+     * @param item selected element/ выбранный элемент
+     */
+    readonly renderHtml: (item: ListDataItem) => VNode;
+    /**
+     * Generates a group of lists.
+     *
+     * Генерирует группу списков.
+     * @param item selected element/ выбранный элемент
+     */
+    readonly renderGroup: (item: ListDataItem) => VNode;
+    /**
+     * Generates a menu of lists.
+     *
+     * Генерирует меню списков.
+     * @param item selected element/ выбранный элемент
+     * @param first is the first element/ является ли первым элементом
+     */
+    readonly renderMenu: (item: ListDataItem, first: boolean) => VNode;
+    /**
+     * Generates all elements from the list.
+     *
+     * Генерирует все элементы из списка.
+     * @param type type of list/ тип списка
+     * @param data selected element/ выбранный элемент
+     * @param first is the first element/ является ли первым элементом
+     */
+    protected renderDataByItem(type: ListType, data: ListList, first?: boolean): VNode[];
+    /**
+     * Determines if highlighting is required.
+     *
+     * Определяет, требуется ли выделение.
+     * @param item selected element/ выбранный элемент
+     */
+    protected isHighlight(item: ListDataItem): boolean;
+    /**
+     * Returns binding properties for the item.
+     *
+     * Возвращает привязочные свойства для элемента.
+     * @param type type of list/ тип списка
+     * @param item selected element/ выбранный элемент
+     */
+    protected getItemAttrs(type: ListType, item: ListDataItem): ConstrBind<ItemList>;
+}

package/dist/constructors/List/ListFocus.d.ts

@@ -0,0 +1,114 @@
+import { Ref, ComputedRef } from 'vue';
+import { ListDataItem } from '@dxtmisha/functional';
+import { ListProps } from './props';
+import { NumberOrStringOrBoolean } from '@dxtmisha/functional-basic';
+/**
+ * Class for working with element focus.
+ *
+ * Класс для работы с фокусировкой элемента.
+ */
+export declare class ListFocus {
+    protected readonly props: ListProps;
+    protected readonly element: Ref<HTMLElement | undefined>;
+    protected readonly listId: number;
+    readonly item: Ref<ListDataItem | undefined, ListDataItem | undefined>;
+    /**
+     * Constructor
+     * @param props input data/ входные данные
+     * @param element input element/ элемент ввода
+     * @param listId unique list identifier/ уникальный идентификатор списка
+     */
+    constructor(props: ListProps, element: Ref<HTMLElement | undefined>, listId: number);
+    /** Returns the value of the selected element/ Возвращает значение выбранного элемента */
+    readonly focus: ComputedRef< NumberOrStringOrBoolean | undefined>;
+    /**
+     * Returns the selected element.
+     *
+     * Возвращает выбранный элемент.
+     * @param index element index/ индекс элемента
+     */
+    isElement(index?: string): boolean;
+    /**
+     * Checks if the element is an item.
+     *
+     * Проверяет, является ли элемент элементом.
+     */
+    isItem(): boolean;
+    /**
+     * Checks if the element is a group.
+     *
+     * Проверяет, является ли элемент группой.
+     */
+    isGroup(): boolean;
+    /**
+     * Checks if the element is a menu.
+     *
+     * Проверяет, является ли элемент меню.
+     */
+    isMenu(): boolean;
+    /**
+     * Checks if the group or menu is open.
+     *
+     * Проверяет, открыта ли группа или меню.
+     */
+    isOpen(): boolean;
+    /**
+     * Returns the selected element.
+     *
+     * Возвращает выбранный элемент.
+     */
+    get(): ListDataItem | undefined;
+    /**
+     * Returns the selector for the desired element by its index.
+     *
+     * Возвращает селектор нужного элемента по его индексу.
+     * @param index element index/ индекс элемента
+     */
+    getSelector(index?: string): string;
+    /**
+     * Returns the HTML element of the selected item.
+     *
+     * Возвращает HTML элемент выбранного элемента.
+     * @param index element index/ индекс элемента
+     */
+    getElement(index?: string): HTMLDivElement | undefined;
+    /**
+     * Changes the selected element.
+     *
+     * Изменяет выбранный элемент.
+     * @param item new value/ новое значение
+     */
+    set(item: ListDataItem | undefined): this;
+    /**
+     * Resets the selected element.
+     *
+     * Сбрасывает выбранный элемент.
+     */
+    reset(): this;
+    /**
+     * Performs a click on the selected element.
+     *
+     * Выполняет клик на выбранном элементе.
+     */
+    click(): void;
+    /**
+     * Moves to the value in focus.
+     *
+     * Перемещает к значению в фокусе.
+     */
+    toElementFocus(): boolean;
+    /**
+     * Scrolls to the desired element by its index.
+     *
+     * Скроллирует к нужному элементу по его индексу.
+     * @param index element index/ индекс элемента
+     */
+    toElementSelected(index: string): this;
+    /**
+     * Scrolls to the desired element.
+     *
+     * Скроллирует к нужному элементу.
+     * @param element the element to scroll to/ элемент, до которого надо проскроллить
+     */
+    protected toElement(element?: HTMLElement): void;
+}

package/dist/constructors/List/ListGo.d.ts

@@ -0,0 +1,111 @@
+import { ConstrEmit, ListDataRef } from '@dxtmisha/functional';
+import { ListFocus } from './ListFocus';
+import { ListProps } from './props';
+import { ListEmits } from './types';
+/**
+ * Class for working with element focus.
+ *
+ * Класс для работы с фокусировкой элемента.
+ */
+export declare class ListGo {
+    protected readonly props: ListProps;
+    protected readonly focus: ListFocus;
+    protected readonly data: ListDataRef;
+    protected readonly emits?: ConstrEmit<ListEmits> | undefined;
+    protected index: number;
+    /**
+     * Constructor
+     * @param props input data/ входные данные
+     * @param focus object of the class for working with focus/ объект класса для работы с фокусировкой
+     * @param data object of the class for working with the list/ объект класса для работы со списком
+     * @param emits the function is called when an event is triggered/ функция вызывается, когда срабатывает событие
+     */
+    constructor(props: ListProps, focus: ListFocus, data: ListDataRef, emits?: ConstrEmit<ListEmits> | undefined);
+    /**
+     * Changing the index in focus by the number in the array.
+     *
+     * Изменение значения в фокусе по номеру в массиве.
+     * @param index number in the array/ номер в массиве
+     */
+    set(index: number): boolean;
+    /**
+     * Changes the selected element.
+     *
+     * Изменяет выбранный элемент.
+     * @param value new value/ новое значение
+     */
+    preparation(value: any): void;
+    /**
+     * Scrolls the element to the selected element
+     *
+     * Прокрутить элемент до выбранного элемента
+     */
+    preparationBySelected(): void;
+    /**
+     * Moves the selected value back.
+     *
+     * Перемещает выбранное значение назад.
+     */
+    previous(): void;
+    /**
+     * Moves the selected value forward.
+     *
+     * Перемещает выбранное значение вперед.
+     */
+    next(): void;
+    /**
+     * Reset all records to the initial state.
+     *
+     * Сброс всех записей до начального состояния.
+     */
+    reset(): void;
+    /**
+     * Opens the window if the element is in it.
+     *
+     * Открывает окно, если элемент в нем.
+     */
+    open(): void;
+    /**
+     * Closes the window if the element is in it.
+     *
+     * Закрывает окно, если элемент в нем.
+     */
+    close(): void;
+    /**
+     * Stops the event.
+     *
+     * Останавливает событие.
+     */
+    stop(): void;
+    /**
+     * Checks if the next element is in the same window.
+     *
+     * Проверяет, находится ли следующий элемент в том же окне.
+     */
+    protected isFirstByParent(): boolean;
+    /**
+     * Checks if the next element is in the same window.
+     *
+     * Проверяет, находится ли следующий элемент в том же окне.
+     */
+    protected isLastByParent(): boolean;
+    /**
+     * Checks if the element is in a window.
+     *
+     * Проверяет, находится ли элемент в окне.
+     */
+    protected getMainItem(): HTMLDivElement | undefined;
+    /**
+     * Changing the index in focus by the number in the array.
+     *
+     * Изменение значения в фокусе по номеру в массиве.
+     * @param index number in the array/ номер в массиве
+     */
+    protected setByIndex(index: number): void;
+    /**
+     * Moves the selected value forward by type.
+     *
+     * Перемещает выбранное значение вперед по типу.
+     */
+    protected nextByType(): void;
+}

package/dist/constructors/List/ListSearch.d.ts

@@ -0,0 +1,59 @@
+import { ListProps } from './props';
+import { Ref, ComputedRef } from 'vue';
+/**
+ * Class for working with search.
+ *
+ * Класс для работы с поиском.
+ */
+export declare class ListSearch {
+    protected readonly props: ListProps;
+    readonly item: Ref<string | undefined, string | undefined>;
+    protected timeout?: any;
+    /**
+     * Constructor
+     * @param props input data/ входные данные
+     */
+    constructor(props: ListProps);
+    /** Current search string/ Текущая строка поиска */
+    readonly highlight: ComputedRef<string | undefined>;
+    /**
+     * Adds a new character to the search.
+     *
+     * Добавляет новый символ к поиску.
+     * @param char new character/ новый символ
+     */
+    add(char: string): void;
+    /**
+     * Sets the search string.
+     *
+     * Устанавливает строку поиска.
+     * @param value new value/ новое значение
+     */
+    set(value?: string): void;
+    /**
+     * Resets the search string.
+     *
+     * Сбрасывает строку поиска.
+     */
+    reset(): this;
+    /**
+     * Returns a processed value.
+     *
+     * Возвращает обработанное значение.
+     * @param value source value/ исходное значение
+     */
+    protected getValue(value?: string): string | undefined;
+    /**
+     * Appends a character to the search string.
+     *
+     * Добавляет символ к строке поиска.
+     * @param char new character/ новый символ
+     */
+    protected addChar(char: string): this;
+    /**
+     * Schedules reset to the initial state after a delay.
+     *
+     * Планирует сброс к исходному состоянию после задержки.
+     */
+    protected makeReset(): this;
+}

package/dist/constructors/List/basicTypes.d.ts

@@ -0,0 +1,3 @@
+export type ListComponentInclude = {
+    list?: object;
+};