@topvisor/ui 1.0.20-selector2-3 → 1.0.20-selector2-4

package/components/dialog/dialog/composables/dialogHandle.d.ts

@@ -0,0 +1,108 @@
+import { ComponentInstance, ComponentInternalInstance, Ref } from 'vue';
+import { default as TopDialog } from '../dialog.vue';
+import { MoveDirection } from '../../lib/types';
+import { TopDialogComponent } from './types';
+/**
+ * Объект для работы с диалоговым окном
+ *
+ * Каждое окно уникально и может быть открыто одновременно только один раз
+ *
+ * Можно определить много окон, после чего с ними можно вести работу в любой части приложения
+ */
+export declare class TopDialogHandle<T extends TopDialogComponent> {
+    /**
+     * Индентификатор, определяется на уровне компонента TopDialogComponent
+     *
+     * Может использоваться в навигации для открытия нужных окон с нужными настройками
+     */
+    id: string;
+    /**
+     * ID, используемый в верстке диалогового окна
+     */
+    idAttr: string;
+    /**
+     * Пользовательский компонент диалогового окна
+     */
+    Component: T;
+    /**
+     * Компонент инициирован
+     *
+     * Устанавливается после первого вызова useTopDialog()
+     */
+    isMounted: Ref<boolean, boolean>;
+    /**
+     * Компонент готов к использованию
+     *
+     * Используется для внутренних преобразований после отрисовки
+     */
+    isReady: Ref<boolean, boolean>;
+    /**
+     * Диалоговое окно открыто
+     */
+    isOpened: Ref<boolean, boolean>;
+    /**
+     * Имя активной страницы дилогового окна
+     */
+    pageActive: Ref<string, string>;
+    /**
+     * Диалоговое окно находится в состоянии загрузки своей страницы
+     */
+    isLoadingPage: Ref<boolean, boolean>;
+    /**
+     * Следующая активная страница
+     *
+     * В один момент времени может потребоваться отобразить две страницы, чтобы воспроизвести анимацию
+     */
+    pageActiveNext: Ref<string, string>;
+    /**
+     * props компонента, доступны после инициализации
+     */
+    props?: ComponentInstance<T>['$props'];
+    /**
+     * emit базового компонента `TopDialog`
+     */
+    emit?: ComponentInstance<typeof TopDialog>['$emit'];
+    /**
+     * Одноразовое событие на закрытие диалогового окна
+     *
+     * Используется для привязки окна к сценариям использования
+     */
+    onCloseOnce?: (props: typeof this.props, pageName: string) => void;
+    constructor(TopDialogComponent: T);
+    /**
+     * Событие - компонент инициирован
+     */
+    onMounted(topDialogComponent: ComponentInternalInstance, topDialogBaseComponent: ComponentInternalInstance): void;
+    /**
+     * Открыть диалоговое окно
+     *
+     * Учтите, что props в диалоговом окне будут доступны не сразу, а только после инициализации vue компонента
+     */
+    open(pageName?: string, props?: {}, args?: [], onCloseOnce?: typeof this.onCloseOnce, moveDirection?: MoveDirection): Promise<void>;
+    /**
+     * Открыть диалоговое окно как ссылку, для хеш-навигации
+     *
+     * Диалоговые окна загружаются по имени, см. настройку плагина Core topDialogLoader
+     */
+    openAsLink(pageName?: string, props?: {}, _args?: string[], onCloseOnce?: typeof this.onCloseOnce, moveDirection?: MoveDirection): Promise<void>;
+    /**
+     * Закрыть диалоговое окно
+     *
+     * Не меняет состояние компонента диалогового окна
+     */
+    close(): Promise<void>;
+    /**
+     * Размонтировать $.dialog
+     */
+    destroy(): Promise<void>;
+    /**
+     * Устанвоить props
+     *
+     * Полностью сбрасывается состояние props
+     */
+    setProps(props?: ComponentInstance<T>['$props']): Promise<void>;
+    /**
+     * Проверить, есть ли необходимость отрисовки страницы диалогового окна
+     */
+    needShowPage(pageName: string): boolean;
+}

package/components/dialog/dialog/composables/types.d.ts

@@ -0,0 +1,11 @@
+import { Component } from 'vue';
+/**
+ * Компонент с определением конкретного диалогового окна с использованием компонента `TopDialog`
+ */
+export type TopDialogComponent = Component & {
+    id?: string;
+};
+export type AsyncDialogComponentResolveResult<T extends TopDialogComponent> = {
+    default: T;
+};
+export type AsyncTopDialogComponentLoader<T extends TopDialogComponent> = () => Promise<AsyncDialogComponentResolveResult<T>>;

package/components/dialog/dialog/composables/utils.d.ts

@@ -0,0 +1,21 @@
+import { TopDialogHandle } from './dialogHandle';
+import { AsyncTopDialogHandle } from './asyncDialogHandle';
+import { AsyncTopDialogComponentLoader, TopDialogComponent } from './types';
+/**
+ * Получить объект управленя текущим диалоговым окном
+ */
+export declare const useTopDialogSelf: () => TopDialogHandle<TopDialogComponent>;
+/**
+ * Получить объект управленя диалоговым окном
+ *
+ * При первом вызове компонент диалогового окна будет внедрен в компонент DialogWrapper
+ */
+export declare const useTopDialog: <T extends TopDialogComponent>(DialogComponent: T) => TopDialogHandle<T>;
+/**
+ * Получить объект управленя асинхронным диалоговым окном
+ *
+ * Компонент диалогового окна будет загружен и инициирован при первом взаимодействии с объектом
+ *
+ * Использует useTopDialog()
+ */
+export declare const useAsyncTopDialog: <T extends TopDialogComponent>(resolve: AsyncTopDialogComponentLoader<T>) => AsyncTopDialogHandle<T>;

package/components/dialog/dialog/dialog.vue.d.ts

@@ -0,0 +1,28 @@
+import { Props, Slots } from './types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<Slots> & Slots;
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    close: (pageName: string) => any;
+    open: (pageName: string) => any;
+}, string, PublicProps, Readonly<Props> & Readonly<{
+    onClose?: ((pageName: string) => any) | undefined;
+    onOpen?: ((pageName: string) => any) | undefined;
+}>, {
+    width: string;
+    height: string;
+    modal: boolean;
+    historyType: "push" | "replace";
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/dialog/dialog/dialogs/dialogs.vue.d.ts

@@ -0,0 +1,10 @@
+import { TopDialogHandle } from '../composables/dialogHandle';
+import { TopDialogComponent } from '../composables/types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+export declare const getDialogWorker: (id: string) => TopDialogHandle<TopDialogComponent> | undefined;
+/**
+ * Добавить компонент диалогового окна для использования
+ */
+export declare const addDialogWorker: <T extends TopDialogComponent>(TopDialogComponent: T) => TopDialogHandle<T>;
+declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>;
+export default _default;

package/components/dialog/dialog/page/page.vue.d.ts

@@ -0,0 +1,19 @@
+import { Props, Slots } from './types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<Slots> & Slots;
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<Props> & Readonly<{}>, {
+    order: number;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/dialog/dialog/page/types.d.ts

@@ -0,0 +1,72 @@
+export interface Props extends PropsCommon {
+    /**
+     * Статус загрузки страницы диалогового окна
+     *
+     * При включении взаимодействие со страницей блокируется, отображается анимация загрузки
+     */
+    isLoading?: boolean;
+}
+/**
+ * Общие props для компонентов реализуюущих TopDialogPage
+ */
+export interface PropsCommon {
+    /**
+     * Имя страницы для диалогового окна
+     *
+     * Имя страницы нужно для навигации между страницами в одном диалоговом окне
+     */
+    name: string;
+    /**
+     * Порядкой номер страницы в диалоговом окне
+     *
+     * Одна и та же страница может быть подключена в разные диалоговые окна и иметь разный порядковый номер
+     */
+    order: number;
+    /**
+     * Имя предыдущей страницы
+     *
+     * Для кнопки Назад / Закрыть в мобильной версии
+     */
+    prevName?: string;
+    /**
+     * Стиль отображения футера, при котороым элементы растягиваются на всю ширину
+     *
+     * Разрешены переносы
+     */
+    footerFullWith?: boolean;
+}
+/**
+ * Общие props для компонентов реализуюущих TopDialogPage
+ *
+ * Для не SFC компонентов
+ */
+export declare const propsPageCommon: {
+    name: {
+        type: StringConstructor;
+        required: boolean;
+    };
+    order: {
+        type: NumberConstructor;
+        required: boolean;
+    };
+    prevName: StringConstructor;
+    footerFullWith: BooleanConstructor;
+};
+export interface Slots {
+    /**
+     * Шапка страницы
+     */
+    header(props: {}): any;
+    /**
+     * Кнопки для шапки страницы
+     */
+    headerButtons(props: {}): any;
+    /**
+     * Контент страницы
+     */
+    body(props: {}): any;
+    /**
+     * Футер страницы
+     */
+    footer(props: {}): any;
+}

package/components/dialog/dialog/pageComponent/pageComponent.vue.d.ts

@@ -0,0 +1,6 @@
+import { Props } from './types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+declare const _default: DefineComponent<Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<Props> & Readonly<{}>, {
+    keepAlive: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+export default _default;

package/components/dialog/dialog/pageComponent/types.d.ts

@@ -0,0 +1,18 @@
+import { PropsCommon } from '../page/types';
+import { Component } from 'vue';
+export interface Props extends PropsCommon {
+    /**
+     * Компонент страницы с реализицией TopDialogPage
+     */
+    component: Component;
+    /**
+     * Кешировать ли эту страницу
+     *
+     * По умолчанию: true
+     */
+    keepAlive?: boolean;
+    /**
+     * Произвольный набор props, который будет передан в компонент страницы
+     */
+    props?: Record<string, any>;
+}

package/components/dialog/dialog/stories/autoload.d.ts

@@ -0,0 +1,2 @@
+import { TopDialogLoad } from '../../lib/types';
+export declare const load: TopDialogLoad;

package/components/dialog/dialog/stories/dialog_example/pages/utils.d.ts

@@ -0,0 +1,7 @@
+import { DefineProps } from 'vue';
+import { TopDialogPagePropsCommon } from '../../..';
+/**
+ * Логирования в console.log() событий страницы диалогового окна
+ * @param props
+ */
+export declare const useLog: (props: DefineProps<TopDialogPagePropsCommon, never>) => void;

package/components/dialog/dialog/types.d.ts

@@ -0,0 +1,58 @@
+export interface Props {
+    id: string;
+    /**
+     * Имя активной страницы
+     */
+    pageActive: string;
+    /**
+     * Базовая ширина окна
+     */
+    width?: string;
+    /**
+     * Базовая высота окна
+     *
+     * Установите auto, если окно должно подстраиваться под размеры содержимого
+     *
+     * Установите значение, если окно должно подстраиваться под размеры содержимого
+     *
+     * @example 'auto'
+     * @example '200px'
+     */
+    height?: string;
+    /**
+     * Является ли окно модальным
+     *
+     * @see https://api.jqueryui.com/dialog/#option-modal
+     */
+    modal?: boolean;
+    /**
+     * Позиция окна
+     *
+     * @see https://api.jqueryui.com/dialog/#option-position
+     */
+    position?: string;
+    /**
+     * Для хеш-навигации
+     */
+    historyType?: 'push' | 'replace';
+    /**
+     * Список css классов для диалогового окна
+     */
+    classes?: string[];
+}
+export type Emits = {
+    /**
+     * Диалоговое окно было открыто
+     */
+    open: [pageName: string];
+    /**
+     * Диалоговое окно было закрыто
+     */
+    close: [pageName: string];
+};
+export interface Slots {
+    /**
+     * Слот с компонентами `TopDialogPage` и / или `TopDialogPageComponent`
+     */
+    default(props: {}): any;
+}

package/components/dialog/dialog.d.ts

@@ -0,0 +1,6 @@
+export { default as TopDialog } from './dialog/dialog.vue';
+export { default as TopDialogPage } from './dialog/page/page.vue';
+export type { PropsCommon as TopDialogPagePropsCommon } from './dialog/page/types';
+export { propsPageCommon } from './dialog/page/types';
+export { default as TopDialogPageComponent } from './dialog/pageComponent/pageComponent.vue';
+export { useTopDialogSelf } from './dialog/composables/utils';

package/components/dialog/lib/types.d.ts

@@ -0,0 +1,21 @@
+export type TopDialogOptions = {
+    /**
+     * Загрузчик для компонентов диалоговых окон по их id
+     */
+    load?: TopDialogLoad;
+    /**
+     * Глобальный декоратор на событие инициализации диалогового окна
+     */
+    decoratorOnCreate?: DecoratorOnCreate;
+    /**
+     * Пауза перед загрузкой утилиты диалоговых окон в ms
+     *
+     * Для производительности
+     *
+     * Утилиты будут в любом случае загружены при работе с диалоговыми окнами, но их не надо грузить каждый раз после открытия страинцы
+     */
+    autoInitDelay?: number;
+};
+export type TopDialogLoad = (dialogId: string) => Promise<void>;
+export type DecoratorOnCreate = (elDialog: HTMLElement) => Promise<void>;
+export type MoveDirection = 'next' | 'prev' | 'none';

package/components/dialog/lib/utils.d.ts

@@ -0,0 +1,14 @@
+import { MoveDirection } from './types';
+import { $el } from '../../types';
+export declare const TopDialogUtils: {
+    updatePageVue: (dialogId: string, pageName?: string, pageNameNext?: string) => Promise<void>;
+    recalcPositions: () => void;
+    toViewDirty: (toViewPageName: string, moveDirection?: MoveDirection) => Promise<void>;
+    toView: (viewNameOr$Dialog: $el | string, pageName?: string, args?: string[], moveDirection?: MoveDirection, callback?: Function) => Promise<void>;
+    toViewPage: ($dialog: $el, pageName?: string, args?: string[], moveDirection?: MoveDirection) => Promise<void>;
+    toPrevPage: ($dialog: $el) => void;
+    setLoading: ($page: $el, isLoading: boolean, duration?: number) => void;
+    isLoading: ($page: $el) => boolean;
+    inAnimation: ($dialog: $el) => boolean;
+    close: (dialogId: string) => void;
+};

package/components/dialog/lib/utils.globalEvents.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Инициализация глобальных событий для диалоговых окон
+ *
+ * Проивзодится один раз при подклчюении диалогового окна
+ *
+ * События не размонитруются
+ */
+export declare const initDialogGlobalEvents: () => void;

package/components/dialog/lib/worker.d.ts

@@ -0,0 +1,60 @@
+import { MoveDirection, TopDialogOptions } from './types';
+import { $el } from '../../types';
+export declare abstract class TopDialogWorker {
+    static state: {
+        load: TopDialogOptions["load"] | undefined;
+        decoratorOnCreate: TopDialogOptions["decoratorOnCreate"] | undefined;
+        /**
+         * Порядковай номер перехода в диалоговых окнах
+         *
+         * Для расчета направления Вперед / Назад
+         */
+        viewPageN: number;
+        locationHashPrev: string;
+    };
+    private static inited;
+    /**
+     * Инициировать события слежения за парамтерами url
+     *
+     * Если в параметрах есть запрос на открытие диалогового окна, TopDialog будет автоматически подключен на страницу
+     */
+    static init(options?: TopDialogOptions): void;
+    static getDialogsUtils(): Promise<{
+        updatePageVue: (dialogId: string, pageName?: string, pageNameNext?: string) => Promise<void>;
+        recalcPositions: () => void;
+        toViewDirty: (toViewPageName: string, moveDirection?: MoveDirection) => Promise<void>;
+        toView: (viewNameOr$Dialog: $el | string, pageName?: string, args?: string[], moveDirection?: MoveDirection, callback?: Function) => Promise<void>;
+        toViewPage: ($dialog: $el, pageName?: string, args?: string[], moveDirection?: MoveDirection) => Promise<void>;
+        toPrevPage: ($dialog: $el) => void;
+        setLoading: ($page: $el, isLoading: boolean, duration?: number) => void;
+        isLoading: ($page: $el) => boolean;
+        inAnimation: ($dialog: $el) => boolean;
+        close: (dialogId: string) => void;
+    }>;
+    static get$dialog($el: $el): JQuery<HTMLElement>;
+    static get$page($el: $el): JQuery<HTMLElement>;
+    /**
+     * Получить элементы страницы в шапке и в контенте
+     */
+    static get$pairPage($el: $el): JQuery<HTMLElement>;
+    /**
+     * Закрыть диалоговое окно
+     */
+    static close(dialogId: string): void;
+    /**
+     * Размонтировать $.dialog
+     */
+    static destroy(dialogId: string): void;
+    /**
+     * Сгенерировать ссылку на страницу в диалоговом окне
+     * @param toView - указатель в формате: dialog_{{ dialogId }}={{ pageName }}:{{ args }}
+     * @param moveDirection
+     */
+    static genViewPageHash(toView: string, moveDirection?: MoveDirection): string;
+    /**
+     * Сравнить версию открытых диалоговых окон
+     * @returns вернет true, если состояния открытых окон изменилось
+     */
+    static compareStates(hash: string, hash2: string): boolean;
+    static opendDialogsFromUrl: () => Promise<true | void>;
+}

package/components/forms/avatar/avatar.d.ts

@@ -0,0 +1,38 @@
+export interface Props {
+    size?: Size;
+    /**
+     * Изображение для аватара пользователя
+     */
+    image: string;
+    /**
+     * Имя пользователя
+     */
+    nickname?: string;
+    /**
+     * Флаг того, что пользователь online
+     */
+    isOnline?: boolean;
+    /**
+     * Время в формате Y-m-d H:i:s, когда пользователь был онлайн
+     */
+    lastActiveTime?: string;
+    /**
+     * Объект со списком перевода Online и LastSeen
+     */
+    i18n?: I18n;
+}
+/**
+ * Размеры аватара
+ */
+export declare const sizes: {
+    readonly 24: 24;
+    readonly 28: 28;
+    readonly 40: 40;
+    readonly 64: 64;
+};
+export type Size = typeof sizes[keyof typeof sizes];
+type I18n = {
+    Online: string;
+    LastSeen: string;
+};
+export {};

package/components/forms/avatar/avatar.vue.d.ts

@@ -0,0 +1,10 @@
+import { Props, Size } from './avatar';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+declare const _default: DefineComponent<Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<Props> & Readonly<{}>, {
+    i18n: {
+        Online: string;
+        LastSeen: string;
+    };
+    size: Size;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/components/forms/button/button.vue.d.ts

@@ -0,0 +1,25 @@
+import { Props, Color, Style } from './types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { Size } from '../helpers';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+        html?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<Props> & Readonly<{}>, {
+    size: Size;
+    color: Color;
+    styling: Style;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/forms/button/types.d.ts

@@ -0,0 +1,53 @@
+import { Size, sizes } from '../helpers';
+/**
+ * Определение параметров
+ */
+export interface Props {
+    color?: Color;
+    styling?: Style;
+    size?: Size;
+    name?: string;
+    title?: string;
+    icon?: string;
+    icon2?: string;
+    /**
+     * Ссылка
+     *
+     * Если указана ссылка, isSubmit не может быть true
+     */
+    href?: string;
+    /**
+     * Добавить на кнопку бейдж с числом
+     */
+    badgeNumber?: number;
+    /**
+     * Расположить badge после текста
+     */
+    badgePosAfterText?: boolean;
+    disabled?: boolean;
+    isSubmit?: boolean;
+    isActive?: boolean;
+    isProgress?: boolean;
+}
+/**
+ * Определение событий
+ */
+export interface Emits {
+}
+export declare const colors: {
+    readonly theme: "theme";
+    readonly blue: "blue";
+    readonly green: "green";
+    readonly orange: "orange";
+    readonly red: "red";
+    readonly pink: "pink";
+    readonly brand: "brand";
+};
+export type Color = typeof colors[keyof typeof colors];
+export declare const styles: {
+    readonly Regular: "";
+    readonly Soft: "soft";
+    readonly Outline: "outline";
+};
+export type Style = typeof styles[keyof typeof styles];
+export { sizes };

package/components/forms/checkbox/checkbox.d.ts

@@ -0,0 +1,21 @@
+type ModelValue = boolean | number[] | string[] | Set<number> | Set<string> | undefined;
+export interface Props {
+    /**
+     * Может быть одного из типов:
+     * - boolean
+     * - number[]
+     * - string[]
+     * - Set<number>
+     * - Set<string>
+     *
+     * [подробнее](https://vuejs.org/guide/essentials/forms.html#checkbox)
+     */
+    modelValue: ModelValue;
+    name?: string;
+    value?: string;
+    description?: string;
+    disabled?: boolean;
+    indeterminate?: boolean;
+    isError?: boolean;
+}
+export {};