@topvisor/ui 1.3.5-5.0 → 1.4.0-TopGroupSelector.10

package/src/components/project/groupSelector/groups/utils.d.ts

@@ -0,0 +1,92 @@
+import { Folder } from '../folders/types';
+import { Group } from './types';
+import { paths } from 'topvisor-openapi/src/ts/Topvisor';
+import { components } from 'topvisor-openapi/src/ts/TV/API/Params/FieldsTrait';
+import { components } from 'topvisor-openapi/src/ts/TV/API/Params/OrdersTrait';
+import { components } from 'topvisor-openapi/src/ts/TV/API/Params/FiltersTrait';
+import { components } from 'topvisor-openapi/src/ts/TV/API/Params/LimitTrait';
+import { components } from 'topvisor-openapi/src/ts/TV/API/Params/OffsetTrait';
+import { components } from 'topvisor-openapi/src/ts/TV/API/Params/ProjectIdTrait';
+import { components } from 'topvisor-openapi/src/ts/TV/API/Params/FetchStyleTrait';
+import { components } from 'topvisor-openapi/src/ts/Keywords_2/Types/Groups/ToType';
+/**
+ * Элемент - группа ненайдена
+ *
+ * Указывается несуществующий id
+ */
+export declare const groupNone: Group;
+/**
+ * Элемент для выбора всех групп
+ */
+export declare const groupAll: Group;
+/**
+ * Элемент - `Все группы`
+ */
+export declare const genGroupAll: () => Group;
+/**
+ * Элемент - `Выберите группу`
+ */
+export declare const genGroupPlaceholder: () => Group;
+/**
+ * Сгенерировать список групп для TopSelector
+ */
+export declare const genItems: (groups: Group[], on?: boolean, folderForFilter?: Folder) => Group[];
+/**
+ * Создать API запрос на получение групп
+ */
+export declare const genApiGetGroups: (client: Api.Client<Api.TV.Paths, true>) => Api.ClientRequest<Api.ClientRequestContext< paths, "/get/keywords_2/groups/", true>, ("name" | "id" | "folder_id" | "folder_path")[], Api.Params<Api.ClientRequestContext< paths, "/get/keywords_2/groups/", true>, undefined, {
+    "COUNT(*)"?: any;
+    id?: any;
+    project_id?: any;
+    folder_id?: any;
+    name?: any;
+    on?: any;
+    status?: any;
+    ord?: any;
+    folder_path?: any;
+    folder_ord?: any;
+    count_keywords?: any;
+    volume?: any;
+    "POSITIONS_AVG()"?: any;
+    "POSITIONS_TOP10()"?: any;
+    "POSITIONS_VISIBILITY()"?: any;
+}, {
+    folder_id_depth?: boolean | null;
+    show_trash?: number;
+    fields?: components["schemas"]["TV.API.Params.FieldsTrait"]["fields"];
+    orders?: components["schemas"]["TV.API.Params.OrdersTrait"]["orders"];
+    filters?: components["schemas"]["TV.API.Params.FiltersTrait"]["filters"];
+    id?: components["schemas"]["TV.API.Params.FiltersTrait"]["id"];
+    limit?: components["schemas"]["TV.API.Params.LimitTrait"]["limit"];
+    offset?: components["schemas"]["TV.API.Params.OffsetTrait"]["offset"];
+    project_id: components["schemas"]["TV.API.Params.ProjectIdTrait"]["project_id"];
+    fetch_style?: components["schemas"]["TV.API.Params.FetchStyleTrait"]["fetch_style"];
+}>, Api.ModelFields<{
+    "COUNT(*)"?: any;
+    id?: any;
+    project_id?: any;
+    folder_id?: any;
+    name?: any;
+    on?: any;
+    status?: any;
+    ord?: any;
+    folder_path?: any;
+    folder_ord?: any;
+    count_keywords?: any;
+    volume?: any;
+    "POSITIONS_AVG()"?: any;
+    "POSITIONS_TOP10()"?: any;
+    "POSITIONS_VISIBILITY()"?: any;
+}> | undefined>;
+/**
+ * Создать API запрос на получение групп
+ */
+export declare const genApiAddGroup: (client: Api.Client<Api.TV.Paths, true>) => Api.ClientRequest<Api.ClientRequestContext< paths, "/add/keywords_2/groups/", true>, never, Omit<{
+    to_id?: number;
+    to_type?: components["schemas"]["Keywords_2.Types.Groups.ToType"];
+    names?: unknown[] | null;
+    name?: unknown[] | null;
+    on?: boolean;
+    status?: boolean;
+    project_id: components["schemas"]["TV.API.Params.ProjectIdTrait"]["project_id"];
+}, "fields" | "filters" | "orders" | "fetch_style">, never>;

package/src/components/project/groupSelector/stories/mocks/folders.d.ts

@@ -0,0 +1,4 @@
+import { Folder, FolderTree } from '../../folders/types';
+export declare const folders: FolderTree;
+export declare const useFoldersFlat: () => Map<number, Folder>;
+export declare const folderExample: Folder;

package/src/components/project/groupSelector/stories/mocks/groups.d.ts

@@ -0,0 +1,2 @@
+import { Group } from '../../groups/types';
+export declare const groups: Group[];

package/src/components/project/groupSelector/stories/mocks/index.d.ts

@@ -0,0 +1,7 @@
+import { client } from '../../../../../storybook/api/client';
+import { Client } from '../../../../../api/api/client/client';
+import { paths } from 'topvisor-openapi/src/ts/Topvisor';
+export * from './folders';
+export * from './groups';
+declare const clientMocked: Client<paths, true>;
+export { client, clientMocked, };

package/src/components/project/groupSelector/types.d.ts

@@ -0,0 +1,133 @@
+import { FolderTree } from './folders/types';
+import { Group, Props as GroupsProps } from './groups/types';
+export interface Props {
+    /**
+     * id выбранной папки
+     *
+     * Если фильтр не нужен - 0, это значит корневая папка
+     */
+    folderId: number;
+    /**
+     * Выбранная папка
+     */
+    folder?: GroupsProps['folder'];
+    /**
+     * Id выбранной группы
+     *
+     * Укажите `0` для выбора первой группы в списке
+     *
+     * Если группа не выбрана - `null`
+     */
+    groupId: number | null;
+    /**
+     * Выбранная группа
+     */
+    group?: GroupsProps['group'];
+    projectId: number;
+    /**
+     * Дерево папок
+     *
+     * Условно опциональный параметр, обязателен, если указан `props.groups`.
+     * Режим, при котором загрузка папок идет через API, а группы указываются в props, не несет смысла и не поддерживается.
+     *
+     * Работает аналогично `props.groups`
+     *
+     * @see `props.groups`
+     */
+    folders?: FolderTree;
+    /**
+     * Группы
+     *
+     * Если параметр не указан:
+     * - будет использовать загрузка групп через `props.client`
+     *
+     * Если параметр указан:
+     * - загрузка через `props.client` производиться не будет
+     * - требует указывать `props.folders`, так как в API нет `childsIds`
+     *
+     * @subcategory Группы
+     */
+    groups?: Group[];
+    /**
+     * Фильтр активности группы
+     *
+     * @subcategory Группы
+     */
+    on?: boolean;
+    /**
+     * Добавить возможность выбора всех групп
+     *
+     * В этом режиме вместо "Корневой папки" для гармоничного стиля будет выводиться "Все папки"
+     *
+     * @subcategory Группы
+     */
+    canSelectAllGroups?: boolean;
+    /**
+     * Добавить возможность добавления группы
+     *
+     * Если при поиске группа в указанной папке не найдена, то появится кнопка "Добавить группу"
+     *
+     * Работает в двух режимах:
+     * - произвольный выбор группы, при `canAddGroup=true`
+     * - автоматическое добавление новой группы через API, при `canAddGroup=api`, требует `props.client`
+     *
+     * После добавления группы через API выполняет `update:groups`
+     *
+     * @subcategory Группы
+     */
+    canAddGroup?: GroupsProps['canAdd'];
+    /**
+     * Правило атвовыбора группы при инициализации и смене папки
+     * - `first`: будет выбрана первая группа, если ее нет будет использоваться режим `placeholder`
+     * - `placeholder`: будет выбираться `id=ITEM_ID_ALL` с текстом "Выберите группу"
+     *
+     * Для фильтров, где есть `props.canSelectAll` рекомендуется использовать `first`
+     *
+     * Для форм, где автовыбор не желателен, рекомендуется использовать `placeholder`
+     *
+     * При отправке формы проверяйте, что указан не `ITEM_ID_ALL`, если требуется выбор конкретной группы
+     *
+     * @subcategory Группы
+     */
+    autoselect?: GroupsProps['autoselect'];
+    /**
+     * Отобразить кнопку смены значения для выбора группы
+     */
+    addChanger?: boolean;
+    /**
+     * Показывать поле для выбора папки
+     *
+     * Если не указано, то папки будут отображаться, если их больше 1
+     */
+    showFolders?: boolean;
+    /**
+     * Показывать поле для выбора группы
+     */
+    showGroups?: boolean;
+    /**
+     * Выводить иконку в полях выбора папки и группы
+     */
+    addIcon?: boolean;
+    /**
+     * Настроенный API клиент для выполнения запросов
+     *
+     * Будет использоваться:
+     * - для загрузки групп, если не указан `props.groups`
+     * - для добавления новых групп, если указан `props.canAddGroup=api`
+     *
+     * @const
+     */
+    client?: Api.Client<Api.TV.Paths, true>;
+}
+export type Emits = {
+    /**
+     * Группы в проекте были изменены
+     *
+     * Вызывается, если указан api client, так как в других случаях группы не меняются
+     *
+     * Если `props.groups` не указан, то emit будет вызван без указания `groups`:
+     * - кеш api всех `TopGroupSelector` на странице с тем же `projectId` будет сброшен автоматически
+     * - при необходимости вручную реализовать обновления других состояний, связанных со списком групп проекта
+     */
+    'update:groups': [groups?: Group[]];
+};

package/src/components/project/project.d.ts

@@ -1,7 +1,8 @@
-export { default as TopSelectorCompetitors } from './selectorCompetitors/selectorCompetitors.vue';
-export { useItemsFromCompetitors } from './selectorCompetitors/composables';
-export { default as TopSelectorRegion } from './selectorRegion/selectorRegion.vue';
-export { findRegion, genSearcherByKey, dialogSelectorRegions } from './selectorRegion/utils/utils';
+export { default as TopCompetitorSelector } from './competitorSelector/competitorSelector.vue';
+export { useItemsFromCompetitors } from './competitorSelector/composables';
+export { default as TopRegionSelector } from './regionSelector/regionSelector.vue';
+export { findRegion, genSearcherByKey, dialogRegionSelector } from './regionSelector/utils/utils';
+export { default as TopGroupSelector } from './groupSelector/groupSelector.vue';
 export type { Emits as TopTagSelectorEmits, Tag, TagId, TagIdExclude } from './tagSelector/types';
 export { genElPopupOpener as genElTopTagSelectorPopupOpener, renderElPopupOpener as renderElTopTagSelectorPopupOpener, } from './tagSelector/utils/el';
 export { default as TopTagSelector } from './tagSelector/tagSelector.vue';

package/src/components/project/{selectorRegion → regionSelector}/utils/utils.d.ts

@@ -1,7 +1,7 @@
 import { Region, Searcher, SearcherByKey } from '../types';
 import { AsyncTopDialogHandle } from '../../../dialog/dialog/composables/asyncDialogHandle';
 import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
-import { Props } from '../dialog_selectorRegions/types';
+import { Props } from '../dialog_regionSelectorRegions/types';
 /**
  * Генерация Map ПС с Map регионов из массива searchers
  * - ключ для ПС - searcherKey
@@ -27,8 +27,8 @@ export declare const findRegion: (forFrequency: boolean, searchRegion: Partial<R
 /**
  * Открыть диалоговое окно с выбором нескольких регионов
  *
- * @see import('../dialog_selectorRegions/types').Props
+ * @see import('../dialog_regionSelectorRegions/types').Props
  */
-export declare const dialogSelectorRegions: AsyncTopDialogHandle<DefineComponent<Partial< Props>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<Partial< Props>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
+export declare const dialogRegionSelector: AsyncTopDialogHandle<DefineComponent<Partial< Props>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<Partial< Props>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
     elRegions: HTMLDivElement;
 }, HTMLDivElement>>;

package/src/core/utils/composables/useWatch.d.ts

@@ -0,0 +1,32 @@
+import { WatchOptions, WatchSource, WatchStopHandle } from 'vue';
+type UnwrapSource<T> = T extends WatchSource<infer V> ? V : T extends object ? T : never;
+type Changes<T> = Partial<{
+    [K in keyof T]: {
+        old: UnwrapSource<T[K]> | undefined;
+        new: UnwrapSource<T[K]>;
+    };
+}>;
+/**
+ * useWatch — расширенный `watch` с измененным callback
+ * - принимает объект с реактивными свойствами, точно такими же, как при указании в массиве в стандартном `watch`
+ * - callback возвращает изменившиеся свойства в объекте `changes` с `{old, new}`
+ *
+ * Если у вас есть несколько `watch`, которые меняют одно состояние, то могут возникнуть проблемы:
+ * - рост длины цепочек `watch`, когда один `watch` приводит к срабатыванию другого
+ * - лишние вызовы при согласованных состояниях, когда разные `watch` устанавливают одно и то же значение
+ * - гонка при несогласованных состояниях, когда разные `watch` в разные тики при этом одновременно могут устанавливать разные состояния
+ *
+ * Если у вас такой случай и его нельзя упростить, то используйте `useWatch`, в остальных случаях используйте только стандартный `watch`
+ *
+ * @example
+ *
+ * ```js
+ *
+ * useWatch({ a: ref(5), b: ref('word') }, (changes) => {
+ * 	console.log(changes.a?.new, changes.a?.old);
+ * 	console.log(changes.b?.new, changes.b?.old);
+ * });
+ * ```
+ */
+export declare function useWatch<T extends Record<string, WatchSource>>(sourcesObj: T, cb: (changes: Changes<T>, onCleanup: (fn: () => void) => void) => void | Promise<void>, options?: WatchOptions): WatchStopHandle;
+export {};

package/tabs/tabs.amd.js

@@ -1,2 +1,2 @@
-define(["require","exports","vue","../require/css.amd!../assets/tabs.css"],(function(b,s,e){"use strict";if(typeof e>"u")var e=window.Vue;const n={class:e.normalizeClass({"top-tabs":!0})},l={key:0,class:"top-tabs_header"},r={class:"top-tabs_contents"},d=e.defineComponent({__name:"tabs",props:{id:{}},setup(a){return(t,o)=>(e.openBlock(),e.createElementBlock("div",n,[e.renderSlot(t.$slots,"buttons"),t.$slots.header?(e.openBlock(),e.createElementBlock("div",l,[e.renderSlot(t.$slots,"header")])):e.createCommentVNode("",!0),e.createElementVNode("div",r,[e.renderSlot(t.$slots,"contents")])]))}}),i=["id","name","value","checked","disabled"],c=["for"],p=e.defineComponent({__name:"tab",props:{tabsId:{},name:{},title:{},active:{type:Boolean},disabled:{type:Boolean}},setup(a){return(t,o)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("input",{type:"radio",class:"top-tabs_tabInput top-unvisible",id:t.tabsId+t.name,name:t.tabsId,value:t.name,checked:t.active,disabled:t.disabled},null,8,i),e.createElementVNode("label",{class:e.normalizeClass({"top-tabs_tabLabel":!0,"top-forms-focusable":!0,"top-disabled":t.disabled}),for:t.tabsId+t.name},[e.renderSlot(t.$slots,"default")],10,c)],64))}}),u=["data-tabs-name"],m=e.defineComponent({__name:"content",props:{name:{}},setup(a){return(t,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass({"top-tabs_content":!0}),"data-tabs-name":t.name},[e.renderSlot(t.$slots,"default")],8,u))}});s.TopTabs=d,s.TopTabsContent=m,s.TopTabsTab=p,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})}));
+define(["require","exports","vue","../require/css.amd!../assets/tabs.css"],(function(p,n,e){"use strict";if(typeof e>"u")var e=window.Vue;const o={class:e.normalizeClass({"top-tabs":!0})},l={key:0,class:"top-tabs_header"},d={class:"top-tabs_contents"},c=e.defineComponent({__name:"tabs",props:{id:{}},setup(t){return(a,s)=>(e.openBlock(),e.createElementBlock("div",o,[e.renderSlot(a.$slots,"buttons"),a.$slots.header?(e.openBlock(),e.createElementBlock("div",l,[e.renderSlot(a.$slots,"header")])):e.createCommentVNode("",!0),e.createElementVNode("div",d,[e.renderSlot(a.$slots,"contents")])]))}}),r=["id","name","value","checked","disabled"],i=["for"],u=e.defineComponent({__name:"tab",props:{tabsId:{},name:{},title:{},active:{type:Boolean},disabled:{type:Boolean}},setup(t){return(a,s)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("input",{type:"radio",class:"top-tabs_tabInput top-unvisible",id:t.tabsId+t.name,name:t.tabsId,value:t.name,checked:t.active,disabled:t.disabled},null,8,r),e.createElementVNode("label",{class:e.normalizeClass({"top-tabs_tabLabel":!0,"top-forms-focusable":!0,"top-disabled":t.disabled}),for:t.tabsId+t.name},[e.renderSlot(a.$slots,"default")],10,i)],64))}}),m=["data-tabs-name"],b=e.defineComponent({__name:"content",props:{name:{}},setup(t){return(a,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass({"top-tabs_content":!0}),"data-tabs-name":t.name},[e.renderSlot(a.$slots,"default")],8,m))}});n.TopTabs=c,n.TopTabsContent=b,n.TopTabsTab=u,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})}));
 //# sourceMappingURL=tabs.amd.js.map

package/tabs/tabs.amd.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.amd.js","sources":["../../src/components/tabs/tabs/tabs.vue","../../src/components/tabs/tabs/tab.vue","../../src/components/tabs/tabs/content.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Props } from './types';\n\ndefineProps<Props>();\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabs': true,\n\t\t}\"\n\t>\n\t\t<!-- @slot Кнопки вкладок, ожидает передачу компонентов TabTitle -->\n\t\t<slot name=\"buttons\"></slot>\n\n\t\t<div v-if=\"$slots.header\" class=\"top-tabs_header\">\n\t\t\t<!-- @slot Слот с проивзольным содержимым, которое будет добавлено справа от вкладок -->\n\t\t\t<slot name=\"header\"></slot>\n\t\t</div>\n\n\t\t<div class=\"top-tabs_contents\">\n\t\t\t<!-- @slot Контент вкладок, ожидает передачу компонентов TabContent -->\n\t\t\t<slot name=\"contents\"></slot>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n.top-tabs {\n\tbackground: var(--color-layout-front-1);\n\tborder-radius: 8px;\n\tborder: 1px solid var(--color-line-2-opacity);\n\tpadding: 0;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\talign-items: stretch;\n}\n\n.top-tabs_header {\n\tpadding: 6px;\n\tmargin-left: auto;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tflex-wrap: wrap;\n}\n\n/* Содержимое вкладок */\n.top-tabs_contents {\n\tborder-top: 1px solid var(--color-line-2-opacity);\n\twidth: 100%;\n\tmargin-top: -1px;\n}\n\n/* Состояние открытости вкладок */\n.top-tabs_tabInput:checked:nth-child(1) ~ .top-tabs_contents > .top-tabs_content:nth-child(1),\n.top-tabs_tabInput:checked:nth-child(3) ~ .top-tabs_contents > .top-tabs_content:nth-child(2),\n.top-tabs_tabInput:checked:nth-child(5) ~ .top-tabs_contents > .top-tabs_content:nth-child(3),\n.top-tabs_tabInput:checked:nth-child(7) ~ .top-tabs_contents > .top-tabs_content:nth-child(4),\n.top-tabs_tabInput:checked:nth-child(9) ~ .top-tabs_contents > .top-tabs_content:nth-child(5),\n.top-tabs_tabInput:checked:nth-child(11) ~ .top-tabs_contents > .top-tabs_content:nth-child(6) {\n\tdisplay: block;\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { PropsTab } from './types';\n\ndefineProps<PropsTab>();\n</script>\n\n<template>\n\t<input\n\t\ttype=\"radio\"\n\t\tclass=\"top-tabs_tabInput top-unvisible\"\n\t\t:id=\"tabsId + name\"\n\t\t:name=\"tabsId\"\n\t\t:value=\"name\"\n\t\t:checked=\"active\"\n\t\t:disabled=\"disabled\"\n\t/>\n\n\t<label\n\t\t:class=\"{\n\t\t\t'top-tabs_tabLabel': true,\n\t\t\t'top-forms-focusable': true,\n\t\t\t'top-disabled': disabled,\n\t\t}\"\n\t\t:for=\"tabsId + name\"\n\t>\n\t\t<slot></slot>\n\t</label>\n</template>\n\n<style>\n.top-tabs_tabLabel {\n\tcolor: var(--color-text-1);\n\tcursor: pointer;\n\tborder-bottom: 2px solid transparent;\n\tpadding: 14px 20px;\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.top-tabs_tabLabel:hover {\n\tborder-color: var(--color-line-2);\n}\n\n.top-tabs_tabInput:checked + .top-tabs_tabLabel {\n\tborder-color: var(--color-line-primary-1);\n\tcolor: var(--color-text-primary);\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { PropsContent } from './types';\n\ndefineProps<PropsContent>();\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabs_content': true,\n\t\t}\"\n\t\t:data-tabs-name=\"name\"\n\t>\n\t\t<slot></slot>\n\t</div>\n</template>\n\n<style>\n.top-tabs_content {\n\tpadding: 14px;\n\toverflow: auto;\n\tdisplay: none;\n}\n</style>\n"],"names":["vue","_ctx","_hoisted_2$1","name","tabsId","disabled","_hoisted_1"],"mappings":"gXAwBOA,EAAA,WAAAC,EAAA,OAAA,SAAA,EAXuBA,EAAA,OAAA,QAAAD,EAAA,UAAA,EAAAA,EAAA,mBAAA,MAAAE,EAAA,CAKtBF,EAAA,WAAAC,EAAA,OAAA,QAAA,CADsB,CAAA,GAAAD,EAAA,mBAAA,GAAA,EAAA,gCAMtBA,EAAA,WAAAC,EAAA,OAAA,UAAA,qWCbQE,KAAAA,EAAAA,OACPC,MAAAA,EAAAA,KACCD,QAAAA,EAAAA,0BAEGE,EAAAA,KAAAA,EAAAA,CAAAA,iIAIgFA,CAAAA,qBAK5EF,EAAAA,sNCfP,mBAAA,4BAGSA,EAAAA,iCAEJ,EAAA,EAAAG,CAAA"}
+{"version":3,"file":"tabs.amd.js","sources":["../../src/components/tabs/tabs/tabs.vue","../../src/components/tabs/tabs/tab.vue","../../src/components/tabs/tabs/content.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Props } from './types';\n\ndefineProps<Props>();\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabs': true,\n\t\t}\"\n\t>\n\t\t<!-- @slot Кнопки вкладок, ожидает передачу компонентов TabTitle -->\n\t\t<slot name=\"buttons\"></slot>\n\n\t\t<div v-if=\"$slots.header\" class=\"top-tabs_header\">\n\t\t\t<!-- @slot Слот с проивзольным содержимым, которое будет добавлено справа от вкладок -->\n\t\t\t<slot name=\"header\"></slot>\n\t\t</div>\n\n\t\t<div class=\"top-tabs_contents\">\n\t\t\t<!-- @slot Контент вкладок, ожидает передачу компонентов TabContent -->\n\t\t\t<slot name=\"contents\"></slot>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n.top-tabs {\n\tbackground: var(--color-layout-front-1);\n\tborder-radius: 8px;\n\tborder: 1px solid var(--color-line-2-opacity);\n\tpadding: 0;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\talign-items: stretch;\n}\n\n.top-tabs_header {\n\tpadding: 6px;\n\tmargin-left: auto;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tflex-wrap: wrap;\n}\n\n/* Содержимое вкладок */\n.top-tabs_contents {\n\tborder-top: 1px solid var(--color-line-2-opacity);\n\twidth: 100%;\n\tmargin-top: -1px;\n}\n\n/* Состояние открытости вкладок */\n.top-tabs_tabInput:checked:nth-child(1) ~ .top-tabs_contents > .top-tabs_content:nth-child(1),\n.top-tabs_tabInput:checked:nth-child(3) ~ .top-tabs_contents > .top-tabs_content:nth-child(2),\n.top-tabs_tabInput:checked:nth-child(5) ~ .top-tabs_contents > .top-tabs_content:nth-child(3),\n.top-tabs_tabInput:checked:nth-child(7) ~ .top-tabs_contents > .top-tabs_content:nth-child(4),\n.top-tabs_tabInput:checked:nth-child(9) ~ .top-tabs_contents > .top-tabs_content:nth-child(5),\n.top-tabs_tabInput:checked:nth-child(11) ~ .top-tabs_contents > .top-tabs_content:nth-child(6) {\n\tdisplay: block;\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { PropsTab } from './types';\n\ndefineProps<PropsTab>();\n</script>\n\n<template>\n\t<input\n\t\ttype=\"radio\"\n\t\tclass=\"top-tabs_tabInput top-unvisible\"\n\t\t:id=\"tabsId + name\"\n\t\t:name=\"tabsId\"\n\t\t:value=\"name\"\n\t\t:checked=\"active\"\n\t\t:disabled=\"disabled\"\n\t/>\n\n\t<label\n\t\t:class=\"{\n\t\t\t'top-tabs_tabLabel': true,\n\t\t\t'top-forms-focusable': true,\n\t\t\t'top-disabled': disabled,\n\t\t}\"\n\t\t:for=\"tabsId + name\"\n\t>\n\t\t<slot></slot>\n\t</label>\n</template>\n\n<style>\n.top-tabs_tabLabel {\n\tcolor: var(--color-text-1);\n\tcursor: pointer;\n\tborder-bottom: 2px solid transparent;\n\tpadding: 14px 20px;\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.top-tabs_tabLabel:hover {\n\tborder-color: var(--color-line-2);\n}\n\n.top-tabs_tabInput:checked + .top-tabs_tabLabel {\n\tborder-color: var(--color-line-primary-1);\n\tcolor: var(--color-text-primary);\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { PropsContent } from './types';\n\ndefineProps<PropsContent>();\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabs_content': true,\n\t\t}\"\n\t\t:data-tabs-name=\"name\"\n\t>\n\t\t<slot></slot>\n\t</div>\n</template>\n\n<style>\n.top-tabs_content {\n\tpadding: 14px;\n\toverflow: auto;\n\tdisplay: none;\n}\n</style>\n"],"names":["vue","_ctx","_hoisted_2$1","__props","_hoisted_1$1","_hoisted_1"],"mappings":"gXAwBOA,EAAA,WAAAC,EAAA,OAAA,SAAA,EAXuBA,EAAA,OAAA,QAAAD,EAAA,UAAA,EAAAA,EAAA,mBAAA,MAAAE,EAAA,CAKtBF,EAAA,WAAAC,EAAA,OAAA,QAAA,CADsB,CAAA,GAAAD,EAAA,mBAAA,GAAA,EAAA,gCAMtBA,EAAA,WAAAC,EAAA,OAAA,UAAA,qWCbQ,KAAAE,EAAA,OACP,MAAAA,EAAA,KACC,QAAAA,EAAA,0BAEG,EAAA,KAAA,EAAAC,CAAA,iIAIgF,CAAA,qBAK5E,EAAA,sNCfP,mBAAA,4BAGS,EAAA,iCAEJ,EAAA,EAAAC,CAAA"}

package/tabs/tabs.js

@@ -3,31 +3,31 @@
 		const fileNames = ['../assets/tabs.css'].map(fileName => import.meta.resolve(fileName));
 		_autoloadCSSCore.insertCSSLinkToPage(fileNames, true);
 	
-import { defineComponent as n, createElementBlock as t, openBlock as a, normalizeClass as d, renderSlot as s, createCommentVNode as p, createElementVNode as o, Fragment as i } from "vue";
-const b = {
-  class: /* @__PURE__ */ d({
+import { defineComponent as d, createElementBlock as s, openBlock as n, normalizeClass as l, renderSlot as a, createCommentVNode as i, createElementVNode as o, Fragment as b } from "vue";
+const r = {
+  class: /* @__PURE__ */ l({
     "top-tabs": !0
   })
-}, c = {
+}, m = {
   key: 0,
   class: "top-tabs_header"
-}, m = { class: "top-tabs_contents" }, $ = /* @__PURE__ */ n({
+}, u = { class: "top-tabs_contents" }, $ = /* @__PURE__ */ d({
   __name: "tabs",
   props: {
     id: {}
   },
-  setup(l) {
-    return (e, r) => (a(), t("div", b, [
-      s(e.$slots, "buttons"),
-      e.$slots.header ? (a(), t("div", c, [
-        s(e.$slots, "header")
-      ])) : p("", !0),
-      o("div", m, [
-        s(e.$slots, "contents")
+  setup(e) {
+    return (t, c) => (n(), s("div", r, [
+      a(t.$slots, "buttons"),
+      t.$slots.header ? (n(), s("div", m, [
+        a(t.$slots, "header")
+      ])) : i("", !0),
+      o("div", u, [
+        a(t.$slots, "contents")
       ])
     ]));
   }
-}), u = ["id", "name", "value", "checked", "disabled"], _ = ["for"], v = /* @__PURE__ */ n({
+}), p = ["id", "name", "value", "checked", "disabled"], _ = ["for"], v = /* @__PURE__ */ d({
   __name: "tab",
   props: {
     tabsId: {},
@@ -36,8 +36,8 @@ const b = {
     active: { type: Boolean },
     disabled: { type: Boolean }
   },
-  setup(l) {
-    return (e, r) => (a(), t(i, null, [
+  setup(e) {
+    return (t, c) => (n(), s(b, null, [
       o("input", {
         type: "radio",
         class: "top-tabs_tabInput top-unvisible",
@@ -46,32 +46,32 @@ const b = {
         value: e.name,
         checked: e.active,
         disabled: e.disabled
-      }, null, 8, u),
+      }, null, 8, p),
       o("label", {
-        class: d({
+        class: l({
           "top-tabs_tabLabel": !0,
           "top-forms-focusable": !0,
           "top-disabled": e.disabled
         }),
         for: e.tabsId + e.name
       }, [
-        s(e.$slots, "default")
+        a(t.$slots, "default")
       ], 10, _)
     ], 64));
   }
-}), h = ["data-tabs-name"], T = /* @__PURE__ */ n({
+}), h = ["data-tabs-name"], T = /* @__PURE__ */ d({
   __name: "content",
   props: {
     name: {}
   },
-  setup(l) {
-    return (e, r) => (a(), t("div", {
-      class: d({
+  setup(e) {
+    return (t, c) => (n(), s("div", {
+      class: l({
         "top-tabs_content": !0
       }),
       "data-tabs-name": e.name
     }, [
-      s(e.$slots, "default")
+      a(t.$slots, "default")
     ], 8, h));
   }
 });

package/tabs/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","sources":["../../src/components/tabs/tabs/tabs.vue","../../src/components/tabs/tabs/tab.vue","../../src/components/tabs/tabs/content.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Props } from './types';\n\ndefineProps<Props>();\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabs': true,\n\t\t}\"\n\t>\n\t\t<!-- @slot Кнопки вкладок, ожидает передачу компонентов TabTitle -->\n\t\t<slot name=\"buttons\"></slot>\n\n\t\t<div v-if=\"$slots.header\" class=\"top-tabs_header\">\n\t\t\t<!-- @slot Слот с проивзольным содержимым, которое будет добавлено справа от вкладок -->\n\t\t\t<slot name=\"header\"></slot>\n\t\t</div>\n\n\t\t<div class=\"top-tabs_contents\">\n\t\t\t<!-- @slot Контент вкладок, ожидает передачу компонентов TabContent -->\n\t\t\t<slot name=\"contents\"></slot>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n.top-tabs {\n\tbackground: var(--color-layout-front-1);\n\tborder-radius: 8px;\n\tborder: 1px solid var(--color-line-2-opacity);\n\tpadding: 0;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\talign-items: stretch;\n}\n\n.top-tabs_header {\n\tpadding: 6px;\n\tmargin-left: auto;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tflex-wrap: wrap;\n}\n\n/* Содержимое вкладок */\n.top-tabs_contents {\n\tborder-top: 1px solid var(--color-line-2-opacity);\n\twidth: 100%;\n\tmargin-top: -1px;\n}\n\n/* Состояние открытости вкладок */\n.top-tabs_tabInput:checked:nth-child(1) ~ .top-tabs_contents > .top-tabs_content:nth-child(1),\n.top-tabs_tabInput:checked:nth-child(3) ~ .top-tabs_contents > .top-tabs_content:nth-child(2),\n.top-tabs_tabInput:checked:nth-child(5) ~ .top-tabs_contents > .top-tabs_content:nth-child(3),\n.top-tabs_tabInput:checked:nth-child(7) ~ .top-tabs_contents > .top-tabs_content:nth-child(4),\n.top-tabs_tabInput:checked:nth-child(9) ~ .top-tabs_contents > .top-tabs_content:nth-child(5),\n.top-tabs_tabInput:checked:nth-child(11) ~ .top-tabs_contents > .top-tabs_content:nth-child(6) {\n\tdisplay: block;\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { PropsTab } from './types';\n\ndefineProps<PropsTab>();\n</script>\n\n<template>\n\t<input\n\t\ttype=\"radio\"\n\t\tclass=\"top-tabs_tabInput top-unvisible\"\n\t\t:id=\"tabsId + name\"\n\t\t:name=\"tabsId\"\n\t\t:value=\"name\"\n\t\t:checked=\"active\"\n\t\t:disabled=\"disabled\"\n\t/>\n\n\t<label\n\t\t:class=\"{\n\t\t\t'top-tabs_tabLabel': true,\n\t\t\t'top-forms-focusable': true,\n\t\t\t'top-disabled': disabled,\n\t\t}\"\n\t\t:for=\"tabsId + name\"\n\t>\n\t\t<slot></slot>\n\t</label>\n</template>\n\n<style>\n.top-tabs_tabLabel {\n\tcolor: var(--color-text-1);\n\tcursor: pointer;\n\tborder-bottom: 2px solid transparent;\n\tpadding: 14px 20px;\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.top-tabs_tabLabel:hover {\n\tborder-color: var(--color-line-2);\n}\n\n.top-tabs_tabInput:checked + .top-tabs_tabLabel {\n\tborder-color: var(--color-line-primary-1);\n\tcolor: var(--color-text-primary);\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { PropsContent } from './types';\n\ndefineProps<PropsContent>();\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabs_content': true,\n\t\t}\"\n\t\t:data-tabs-name=\"name\"\n\t>\n\t\t<slot></slot>\n\t</div>\n</template>\n\n<style>\n.top-tabs_content {\n\tpadding: 14px;\n\toverflow: auto;\n\tdisplay: none;\n}\n</style>\n"],"names":["_openBlock","_createElementBlock","_hoisted_1","_renderSlot","_ctx","$slots","_hoisted_2","_createElementVNode","_hoisted_3","tabsId","name","active","disabled","_normalizeClass"],"mappings":";;;;;;;;;;;;;;sBAOCA,EAAA,GAAAC,EAiBM,OAjBNC,GAiBM;AAAA,MAXLC,EAA4BC,EAAA,QAAA,SAAA;AAAA,MAEjBC,EAAAA,OAAO,UAAlBL,KAAAC,EAGM,OAHNK,GAGM;AAAA,QADLH,EAA2BC,EAAA,QAAA,QAAA;AAAA,MAAA;MAG5BG,EAGM,OAHNC,GAGM;AAAA,QADLL,EAA6BC,EAAA,QAAA,UAAA;AAAA,MAAA;;;;;;;;;;;;;;MCf/BG,EAQE,SAAA;AAAA,QAPD,MAAK;AAAA,QACL,OAAM;AAAA,QACL,IAAIE,EAAAA,SAASC,EAAAA;AAAAA,QACb,MAAMD,EAAAA;AAAAA,QACN,OAAOC,EAAAA;AAAAA,QACP,SAASC,EAAAA;AAAAA,QACT,UAAUC,EAAAA;AAAAA,MAAAA;MAGZL,EASQ,SAAA;AAAA,QARN,OAAKM,EAAA;AAAA;;0BAAqFD,EAAAA;AAAAA,QAAAA;QAK1F,KAAKH,EAAAA,SAASC,EAAAA;AAAAA,MAAAA;QAEfP,EAAaC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;;;;;;2BClBdH,EAOM,OAAA;AAAA,MANJ,OAAKY,EAAE;AAAA;OAEP;AAAA,MACA,kBAAgBH,EAAAA;AAAAA,IAAAA;MAEjBP,EAAaC,EAAA,QAAA,SAAA;AAAA,IAAA;;;"}
+{"version":3,"file":"tabs.js","sources":["../../src/components/tabs/tabs/tabs.vue","../../src/components/tabs/tabs/tab.vue","../../src/components/tabs/tabs/content.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Props } from './types';\n\ndefineProps<Props>();\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabs': true,\n\t\t}\"\n\t>\n\t\t<!-- @slot Кнопки вкладок, ожидает передачу компонентов TabTitle -->\n\t\t<slot name=\"buttons\"></slot>\n\n\t\t<div v-if=\"$slots.header\" class=\"top-tabs_header\">\n\t\t\t<!-- @slot Слот с проивзольным содержимым, которое будет добавлено справа от вкладок -->\n\t\t\t<slot name=\"header\"></slot>\n\t\t</div>\n\n\t\t<div class=\"top-tabs_contents\">\n\t\t\t<!-- @slot Контент вкладок, ожидает передачу компонентов TabContent -->\n\t\t\t<slot name=\"contents\"></slot>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n.top-tabs {\n\tbackground: var(--color-layout-front-1);\n\tborder-radius: 8px;\n\tborder: 1px solid var(--color-line-2-opacity);\n\tpadding: 0;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\talign-items: stretch;\n}\n\n.top-tabs_header {\n\tpadding: 6px;\n\tmargin-left: auto;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tflex-wrap: wrap;\n}\n\n/* Содержимое вкладок */\n.top-tabs_contents {\n\tborder-top: 1px solid var(--color-line-2-opacity);\n\twidth: 100%;\n\tmargin-top: -1px;\n}\n\n/* Состояние открытости вкладок */\n.top-tabs_tabInput:checked:nth-child(1) ~ .top-tabs_contents > .top-tabs_content:nth-child(1),\n.top-tabs_tabInput:checked:nth-child(3) ~ .top-tabs_contents > .top-tabs_content:nth-child(2),\n.top-tabs_tabInput:checked:nth-child(5) ~ .top-tabs_contents > .top-tabs_content:nth-child(3),\n.top-tabs_tabInput:checked:nth-child(7) ~ .top-tabs_contents > .top-tabs_content:nth-child(4),\n.top-tabs_tabInput:checked:nth-child(9) ~ .top-tabs_contents > .top-tabs_content:nth-child(5),\n.top-tabs_tabInput:checked:nth-child(11) ~ .top-tabs_contents > .top-tabs_content:nth-child(6) {\n\tdisplay: block;\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { PropsTab } from './types';\n\ndefineProps<PropsTab>();\n</script>\n\n<template>\n\t<input\n\t\ttype=\"radio\"\n\t\tclass=\"top-tabs_tabInput top-unvisible\"\n\t\t:id=\"tabsId + name\"\n\t\t:name=\"tabsId\"\n\t\t:value=\"name\"\n\t\t:checked=\"active\"\n\t\t:disabled=\"disabled\"\n\t/>\n\n\t<label\n\t\t:class=\"{\n\t\t\t'top-tabs_tabLabel': true,\n\t\t\t'top-forms-focusable': true,\n\t\t\t'top-disabled': disabled,\n\t\t}\"\n\t\t:for=\"tabsId + name\"\n\t>\n\t\t<slot></slot>\n\t</label>\n</template>\n\n<style>\n.top-tabs_tabLabel {\n\tcolor: var(--color-text-1);\n\tcursor: pointer;\n\tborder-bottom: 2px solid transparent;\n\tpadding: 14px 20px;\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.top-tabs_tabLabel:hover {\n\tborder-color: var(--color-line-2);\n}\n\n.top-tabs_tabInput:checked + .top-tabs_tabLabel {\n\tborder-color: var(--color-line-primary-1);\n\tcolor: var(--color-text-primary);\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { PropsContent } from './types';\n\ndefineProps<PropsContent>();\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabs_content': true,\n\t\t}\"\n\t\t:data-tabs-name=\"name\"\n\t>\n\t\t<slot></slot>\n\t</div>\n</template>\n\n<style>\n.top-tabs_content {\n\tpadding: 14px;\n\toverflow: auto;\n\tdisplay: none;\n}\n</style>\n"],"names":["_openBlock","_createElementBlock","_hoisted_1","_renderSlot","_ctx","$slots","_hoisted_2","_createElementVNode","_hoisted_3","__props","_normalizeClass"],"mappings":";;;;;;;;;;;;;;sBAOCA,EAAA,GAAAC,EAiBM,OAjBNC,GAiBM;AAAA,MAXLC,EAA4BC,EAAA,QAAA,SAAA;AAAA,MAEjBC,EAAAA,OAAO,UAAlBL,KAAAC,EAGM,OAHNK,GAGM;AAAA,QADLH,EAA2BC,EAAA,QAAA,QAAA;AAAA,MAAA;MAG5BG,EAGM,OAHNC,GAGM;AAAA,QADLL,EAA6BC,EAAA,QAAA,UAAA;AAAA,MAAA;;;;;;;;;;;;;;MCf/BG,EAQE,SAAA;AAAA,QAPD,MAAK;AAAA,QACL,OAAM;AAAA,QACL,IAAIE,EAAA,SAASA,EAAA;AAAA,QACb,MAAMA,EAAA;AAAA,QACN,OAAOA,EAAA;AAAA,QACP,SAASA,EAAA;AAAA,QACT,UAAUA,EAAA;AAAA,MAAA;MAGZF,EASQ,SAAA;AAAA,QARN,OAAKG,EAAA;AAAA;;0BAAqFD,EAAA;AAAA,QAAA;QAK1F,KAAKA,EAAA,SAASA,EAAA;AAAA,MAAA;QAEfN,EAAaC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;;;;;;2BClBdH,EAOM,OAAA;AAAA,MANJ,OAAKS,EAAE;AAAA;OAEP;AAAA,MACA,kBAAgBD,EAAA;AAAA,IAAA;MAEjBN,EAAaC,EAAA,QAAA,SAAA;AAAA,IAAA;;;"}

package/tabsView/tabsView.amd.js

@@ -1,2 +1,2 @@
-define(["require","exports","vue","../.chunks/forms-DXX5M4DO.amd","../utils/route.amd","../.chunks/store-YRW59xEF.amd","../.chunks/listItem.vue_vue_type_script_setup_true_lang-DzV225TL.amd","../.chunks/popupHint.vue_vue_type_style_index_0_lang-Cce9ZdtW.amd","../utils/system.amd","../require/css.amd!../assets/tabsView.css","../require/css.amd!../assets/popupHint.css"],(function(J,h,e,m,f,g,_,G,L){"use strict";if(typeof e>"u")var e=window.Vue;const w=(o,n)=>`top:${String(o)}:${n}`,b={loadLocalStorge:(o,n)=>{if(!n.$id)return;const t=w(o,n.$id);try{const a=JSON.parse(localStorage.getItem(t));typeof a==typeof n[o]&&(n[o]=a)}catch{console.warn(new Error(`В localStorage[${t}] не корректный json`))}},addSaverLocalStorge:(o,n)=>{if(!n.$id)return;const t=w(o,n.$id);e.watch(()=>n[o],()=>{localStorage.setItem(t,JSON.stringify(n[o]))},{immediate:!0})}},k=new Set;addEventListener("popstate",o=>{k.forEach(n=>n(o))});const V=Symbol(),E=(o,n)=>{const t=g.defineStore(V,()=>{const a=e.computed(()=>o.showMenuInPopup??m.Core.state.isMobile),i=e.computed(()=>o.pageMod),u=e.ref(!1),r=e.ref(void 0),l=e.ref(!0);return{showMenuInPopup:a,pageMod:i,isShort:u,activeItemName:n,component:r,scrollable:l}},o.idState);if(o.isShortable){const a="isShort";b.loadLocalStorge(a,t),b.addSaverLocalStorge(a,t)}if(t.$id){const a=i=>{n.value=f.getHash(t.$id)};k.add(a)}return t},S=()=>g.useStore(V),P={key:1,class:"top-ellipsis"},v=e.defineComponent({__name:"menuItem",props:{name:{},href:{},icon:{},disabled:{type:Boolean},component:{default:void 0},scrollable:{type:Boolean,default:!0}},setup(o){const n=o,t=S(),a=e.computed(()=>n.name&&t.$id?f.genHash(t.$id,n.name):n.href),i=e.computed(()=>t.showMenuInPopup?_._sfc_main$1:a?"a":"button"),u=r=>{!n.href&&a.value&&r.preventDefault(),n.name&&(t.activeItemName=n.name)};return(r,l)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(i.value),{target:"_self",class:e.normalizeClass({"top-tabsView_menuItem":!e.unref(t).showMenuInPopup,"top-active":r.name&&e.unref(t).activeItemName===r.name,"top-disabled":r.disabled,"top-spa-disabled":!0}),href:a.value,"data-top-icon":r.icon||void 0,disabled:r.disabled||void 0,onClick:u},{default:e.withCtx(()=>[e.unref(t).showMenuInPopup?e.renderSlot(r.$slots,"default",{key:0}):r.$slots.default&&!e.unref(t).isShort?(e.openBlock(),e.createElementBlock("span",P,[e.renderSlot(r.$slots,"default")])):e.createCommentVNode("",!0)]),_:3},8,["class","href","data-top-icon","disabled"]))}}),B=o=>(o==null?void 0:o.name)==="AsyncComponentWrapper"&&!(o!=null&&o.__asyncResolved),T=async(o,n)=>{(o==null?void 0:o.name)==="AsyncComponentWrapper"&&(o!=null&&o.__asyncResolved||(o.__asyncLoader(),await L.sleepWhile(()=>n()&&B(o),200)))},z={class:"top-tabsView_menuOpener"},H=["data-top-icon"],R={class:"top-ellipsis"},O={class:"top-tabsView_menuList"},D={key:0,class:"top-tabsView_menuFooter"},K=e.defineComponent({__name:"menu",props:e.mergeModels({isShortable:{type:Boolean},isLoading:{type:Boolean}},{isLoading:{},isLoadingModifiers:{}}),emits:["update:isLoading"],setup(o){const n=e.useModel(o,"isLoading"),t=S(),a=e.useSlots(),i=new Map,u=()=>{if(!a.default)return;const c=a.default({}).find(s=>s.key==="_menu");c&&r(c.children)},r=c=>{c.forEach(s=>{var I,$,N,C;if(s.type.__name&&s.type.__name!==v.__name)return;if(!s.type.__name&&typeof s.children=="object"){r(s.children);return}if(!((I=s.props)!=null&&I.name)||($=s.props)!=null&&$.disabled)return;const M={title:((C=(N=s.children).default)==null?void 0:C.call(N)[0].children).trim(),icon:s.props.icon,component:s.props.component?e.markRaw(s.props.component):v.props.component.default,scrollable:s.props.scrollable??v.props.scrollable.default};i.set(s.props.name,M)})},l=e.ref(null);let d=0;e.watch(()=>t.activeItemName,async()=>{const c=++d;if(i.size===0&&u(),i.size===0){t.activeItemName="";return}if(l.value=i.get(t.activeItemName)??null,!l.value&&t.$id){const s=f.getHash(t.$id);if(l.value=i.get(s)??null,l.value){t.activeItemName=s;return}}if(!l.value){t.activeItemName=i.keys().next().value;return}if(l.value.component===t.component){n.value=!1;return}t.$id&&f.setHash(t.$id,t.activeItemName,!1),n.value=!0,await T(l.value.component,()=>c===d),c===d&&(t.scrollable=l.value.scrollable,t.component=l.value.component,l.value&&!t.component&&console.warn(`Компонент вкладки ${t.activeItemName} не найден. Добавьте props.component для пункта меню ${t.activeItemName}.`))},{immediate:!0});const p=e.ref();let y;return e.onMounted(()=>{y=new ResizeObserver(()=>{p.value.parentElement.style.setProperty("--top-tabsView-contents-offset-top",p.value.offsetHeight+"px")}),y.observe(p.value)}),e.onUnmounted(()=>{y.disconnect()}),(c,s)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"elRef",ref:p,class:e.normalizeClass({"top-tabsView_menu":!0,"top-tabsView_menu-inPopup_0":!e.unref(t).showMenuInPopup,"top-tabsView_menu-inPopup_1":e.unref(t).showMenuInPopup,"top-tabsView_menu-short":e.unref(t).isShort&&!e.unref(t).showMenuInPopup})},[e.unref(t).showMenuInPopup?(e.openBlock(),e.createBlock(e.unref(_._sfc_main),{key:0},{opener:e.withCtx(()=>[e.createElementVNode("div",z,[l.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"top-tabsView_menuOpenerActiveItem","data-top-icon":l.value.icon},[e.createElementVNode("span",R,e.toDisplayString(l.value.title),1)],8,H)):e.createCommentVNode("",!0),s[1]||(s[1]=e.createElementVNode("div",{class:"top-tabsView_menuOpenerIcon","data-top-icon":""},null,-1))])]),contentList:e.withCtx(()=>[e.renderSlot(c.$slots,"default")]),_:3})):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createElementVNode("div",O,[e.renderSlot(c.$slots,"default")]),c.isShortable?(e.openBlock(),e.createElementBlock("div",D,[c.isShortable?(e.openBlock(),e.createBlock(v,{key:0,icon:e.unref(t).isShort?"":"",onClick:s[0]||(s[0]=M=>e.unref(t).isShort=!e.unref(t).isShort)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(t).isShort?"":"Свернуть"),1)]),_:1},8,["icon"])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],64))],2))}}),j=e.defineComponent({__name:"tabsView",props:e.mergeModels({modelValue:{},pageMod:{type:Boolean},showMenuInPopup:{type:Boolean,default:void 0},isShortable:{type:Boolean,default:!1},idState:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(o){const n=o,t=e.useModel(o,"modelValue"),a=E(n,t),i=Math.random();n.pageMod&&m.Core.state.documentClassModificators.set(i,"top-hasTabsViewPageMod"),e.onUnmounted(()=>{n.pageMod&&m.Core.state.documentClassModificators.delete(i),a.$id&&f.delHash(a.$id,a.activeItemName,!0)});const u=e.ref(),r=e.ref(!1);return e.watch([u,()=>a.component],()=>{r.value=B(a.component)},{immediate:!0}),(l,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass({"top-tabsView":!0,"top-tabsView-pageMod":n.pageMod,"top-tabsView-inPopup":e.unref(a).showMenuInPopup})},[e.createVNode(K,{isShortable:l.isShortable,isLoading:r.value,"onUpdate:isLoading":d[0]||(d[0]=p=>r.value=p)},{default:e.withCtx(()=>[e.renderSlot(l.$slots,"menu")]),_:3},8,["isShortable","isLoading"]),e.createElementVNode("div",{class:e.normalizeClass({"top-tabsView_contents":!0,"top-tabsView_contents-isLoading":r.value,"top-tabsView_contents-noScrollable":!e.unref(a).scrollable})},[r.value?(e.openBlock(),e.createBlock(m.TopLoadbar,{key:0})):e.createCommentVNode("",!0),(e.openBlock(),e.createBlock(e.KeepAlive,null,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(a).component),{ref_key:"componentRef",ref:u},null,512))],1024))],2)],2))}}),q={},A={class:"top-tabsView_menuDelimeter"};function F(o,n){return e.openBlock(),e.createElementBlock("div",A)}const U=m._export_sfc(q,[["render",F]]),W=e.defineComponent({__name:"menuTitle",props:{isSubtitle:{type:Boolean}},setup(o){const n=S();return(t,a)=>e.unref(n).showMenuInPopup?(e.openBlock(),e.createBlock(e.unref(_._sfc_main$1),{key:0,type:"title"},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3})):e.unref(n).isShort?(e.openBlock(),e.createBlock(U,{key:1})):(e.openBlock(),e.createElementBlock("div",{key:2,class:e.normalizeClass({"top-tabsView_menuTitle":!0,"top-tabsView_menuTitle-subtitle":t.isSubtitle})},[e.renderSlot(t.$slots,"default")],2))}});h.TopTabsView=j,h.TopTabsViewMenuItem=v,h.TopTabsViewMenuTitle=W,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})}));
+define(["require","exports","vue","../.chunks/forms-CUSCBQu3.amd","../utils/route.amd","../.chunks/store-YRW59xEF.amd","../.chunks/popupHint.vue_vue_type_style_index_0_lang-DtiT6NE4.amd","../utils/system.amd","../require/css.amd!../assets/tabsView.css"],(function(A,h,e,p,f,g,S,M){"use strict";if(typeof e>"u")var e=window.Vue;const k=(o,n)=>`top:${String(o)}:${n}`,y={loadLocalStorge:(o,n)=>{if(!n.$id)return;const t=k(o,n.$id);try{const a=JSON.parse(localStorage.getItem(t));typeof a==typeof n[o]&&(n[o]=a)}catch{console.warn(new Error(`В localStorage[${t}] не корректный json`))}},addSaverLocalStorge:(o,n)=>{if(!n.$id)return;const t=k(o,n.$id);e.watch(()=>n[o],()=>{localStorage.setItem(t,JSON.stringify(n[o]))},{immediate:!0})}},_=new Set;addEventListener("popstate",o=>{_.forEach(n=>n(o))});const V=Symbol(),$=(o,n)=>{const t=g.defineStore(V,()=>{const a=e.computed(()=>o.showMenuInPopup??p.Core.state.isMobile),i=e.computed(()=>o.pageMod),u=e.ref(!1),r=e.ref(void 0),l=e.ref(!0);return{showMenuInPopup:a,pageMod:i,isShort:u,activeItemName:n,component:r,scrollable:l}},o.idState);if(o.isShortable){const a="isShort";y.loadLocalStorge(a,t),y.addSaverLocalStorge(a,t)}if(t.$id){const a=i=>{n.value=f.getHash(t.$id)};_.add(a)}return t},w=()=>g.useStore(V),N={key:1,class:"top-ellipsis"},v=e.defineComponent({__name:"menuItem",props:{name:{},href:{},icon:{},disabled:{type:Boolean},component:{default:void 0},scrollable:{type:Boolean,default:!0}},setup(o){const n=o,t=w(),a=e.computed(()=>n.name&&t.$id?f.genHash(t.$id,n.name):n.href),i=e.computed(()=>t.showMenuInPopup?S._sfc_main$2:a?"a":"button"),u=r=>{!n.href&&a.value&&r.preventDefault(),n.name&&(t.activeItemName=n.name)};return(r,l)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(i.value),{target:"_self",class:e.normalizeClass({"top-tabsView_menuItem":!e.unref(t).showMenuInPopup,"top-active":o.name&&e.unref(t).activeItemName===o.name,"top-disabled":o.disabled,"top-spa-disabled":!0}),href:a.value,"data-top-icon":o.icon||void 0,disabled:o.disabled||void 0,onClick:u},{default:e.withCtx(()=>[e.unref(t).showMenuInPopup?e.renderSlot(r.$slots,"default",{key:0}):r.$slots.default&&!e.unref(t).isShort?(e.openBlock(),e.createElementBlock("span",N,[e.renderSlot(r.$slots,"default")])):e.createCommentVNode("",!0)]),_:3},8,["class","href","data-top-icon","disabled"]))}}),B=o=>o?.name==="AsyncComponentWrapper"&&!o?.__asyncResolved,C=async(o,n)=>{o?.name==="AsyncComponentWrapper"&&(o?.__asyncResolved||(o.__asyncLoader(),await M.sleepWhile(()=>n()&&B(o),200)))},L={class:"top-tabsView_menuOpener"},E=["data-top-icon"],P={class:"top-ellipsis"},T={class:"top-tabsView_menuList"},z={key:0,class:"top-tabsView_menuFooter"},R=e.defineComponent({__name:"menu",props:e.mergeModels({isShortable:{type:Boolean},isLoading:{type:Boolean}},{isLoading:{},isLoadingModifiers:{}}),emits:["update:isLoading"],setup(o){const n=e.useModel(o,"isLoading"),t=w(),a=e.useSlots(),i=new Map,u=()=>{if(!a.default)return;const c=a.default({}).find(s=>s.key==="_menu");c&&r(c.children)},r=c=>{c.forEach(s=>{if(s.type.__name&&s.type.__name!==v.__name)return;if(!s.type.__name&&typeof s.children=="object"){r(s.children);return}if(!s.props?.name||s.props?.disabled)return;const I={title:(s.children.default?.()[0].children).trim(),icon:s.props.icon,component:s.props.component?e.markRaw(s.props.component):v.props.component.default,scrollable:s.props.scrollable??v.props.scrollable.default};i.set(s.props.name,I)})},l=e.ref(null);let d=0;e.watch(()=>t.activeItemName,async()=>{const c=++d;if(i.size===0&&u(),i.size===0){t.activeItemName="";return}if(l.value=i.get(t.activeItemName)??null,!l.value&&t.$id){const s=f.getHash(t.$id);if(l.value=i.get(s)??null,l.value){t.activeItemName=s;return}}if(!l.value){t.activeItemName=i.keys().next().value;return}if(l.value.component===t.component){n.value=!1;return}t.$id&&f.setHash(t.$id,t.activeItemName,!1),n.value=!0,await C(l.value.component,()=>c===d),c===d&&(t.scrollable=l.value.scrollable,t.component=l.value.component,l.value&&!t.component&&console.warn(`Компонент вкладки ${t.activeItemName} не найден. Добавьте props.component для пункта меню ${t.activeItemName}.`))},{immediate:!0});const m=e.ref();let b;return e.onMounted(()=>{b=new ResizeObserver(()=>{m.value.parentElement.style.setProperty("--top-tabsView-contents-offset-top",m.value.offsetHeight+"px")}),b.observe(m.value)}),e.onUnmounted(()=>{b.disconnect()}),(c,s)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"elRef",ref:m,class:e.normalizeClass({"top-tabsView_menu":!0,"top-tabsView_menu-inPopup_0":!e.unref(t).showMenuInPopup,"top-tabsView_menu-inPopup_1":e.unref(t).showMenuInPopup,"top-tabsView_menu-short":e.unref(t).isShort&&!e.unref(t).showMenuInPopup})},[e.unref(t).showMenuInPopup?(e.openBlock(),e.createBlock(e.unref(S._sfc_main),{key:0},{opener:e.withCtx(()=>[e.createElementVNode("div",L,[l.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"top-tabsView_menuOpenerActiveItem","data-top-icon":l.value.icon},[e.createElementVNode("span",P,e.toDisplayString(l.value.title),1)],8,E)):e.createCommentVNode("",!0),s[1]||(s[1]=e.createElementVNode("div",{class:"top-tabsView_menuOpenerIcon","data-top-icon":""},null,-1))])]),contentList:e.withCtx(()=>[e.renderSlot(c.$slots,"default")]),_:3})):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createElementVNode("div",T,[e.renderSlot(c.$slots,"default")]),o.isShortable?(e.openBlock(),e.createElementBlock("div",z,[o.isShortable?(e.openBlock(),e.createBlock(v,{key:0,icon:e.unref(t).isShort?"":"",onClick:s[0]||(s[0]=I=>e.unref(t).isShort=!e.unref(t).isShort)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(t).isShort?"":"Свернуть"),1)]),_:1},8,["icon"])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],64))],2))}}),O=e.defineComponent({__name:"tabsView",props:e.mergeModels({modelValue:{},pageMod:{type:Boolean},showMenuInPopup:{type:Boolean,default:void 0},isShortable:{type:Boolean,default:!1},idState:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(o){const n=o,t=e.useModel(o,"modelValue"),a=$(n,t),i=Math.random();n.pageMod&&p.Core.state.documentClassModificators.set(i,"top-hasTabsViewPageMod"),e.onUnmounted(()=>{n.pageMod&&p.Core.state.documentClassModificators.delete(i),a.$id&&f.delHash(a.$id,a.activeItemName,!0)});const u=e.ref(),r=e.ref(!1);return e.watch([u,()=>a.component],()=>{r.value=B(a.component)},{immediate:!0}),(l,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass({"top-tabsView":!0,"top-tabsView-pageMod":n.pageMod,"top-tabsView-inPopup":e.unref(a).showMenuInPopup})},[e.createVNode(R,{isShortable:o.isShortable,isLoading:r.value,"onUpdate:isLoading":d[0]||(d[0]=m=>r.value=m)},{default:e.withCtx(()=>[e.renderSlot(l.$slots,"menu")]),_:3},8,["isShortable","isLoading"]),e.createElementVNode("div",{class:e.normalizeClass({"top-tabsView_contents":!0,"top-tabsView_contents-isLoading":r.value,"top-tabsView_contents-noScrollable":!e.unref(a).scrollable})},[r.value?(e.openBlock(),e.createBlock(p.TopLoadbar,{key:0})):e.createCommentVNode("",!0),(e.openBlock(),e.createBlock(e.KeepAlive,null,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(a).component),{ref_key:"componentRef",ref:u},null,512))],1024))],2)],2))}}),D={},H={class:"top-tabsView_menuDelimeter"};function K(o,n){return e.openBlock(),e.createElementBlock("div",H)}const j=p._export_sfc(D,[["render",K]]),x=e.defineComponent({__name:"menuTitle",props:{isSubtitle:{type:Boolean}},setup(o){const n=w();return(t,a)=>e.unref(n).showMenuInPopup?(e.openBlock(),e.createBlock(e.unref(S._sfc_main$2),{key:0,type:"title"},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3})):e.unref(n).isShort?(e.openBlock(),e.createBlock(j,{key:1})):(e.openBlock(),e.createElementBlock("div",{key:2,class:e.normalizeClass({"top-tabsView_menuTitle":!0,"top-tabsView_menuTitle-subtitle":o.isSubtitle})},[e.renderSlot(t.$slots,"default")],2))}});h.TopTabsView=O,h.TopTabsViewMenuItem=v,h.TopTabsViewMenuTitle=x,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})}));
 //# sourceMappingURL=tabsView.amd.js.map