npm - @topvisor/ui - Versions diffs - 1.0.42-popupPosition.0 → 1.1.0-addNativeDialog.10 - Mend

@topvisor/ui 1.0.42-popupPosition.0 → 1.1.0-addNativeDialog.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (473) hide show

package/tabsView/tabsView.amd.js CHANGED Viewed

@@ -1,2 +1,2 @@
-define(["require","exports","vue","../.chunks/forms-Gb7ujpmz.amd","../utils/route.amd","../.chunks/store-esTid5oI.amd","../popup/popup.amd","../utils/system.amd","../require/css.amd!../assets/tabsView.css"],function(X,h,e,m,f,_,S,L){"use strict";if(typeof e>"u")var e=window.Vue;const g=(o,n)=>`top:${String(o)}:${n}`,y={loadLocalStorge:(o,n)=>{if(!n.$id)return;const t=g(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=g(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(),C=(o,n)=>{const t=_.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";y.loadLocalStorge(a,t),y.addSaverLocalStorge(a,t)}if(t.$id){const a=i=>{n.value=f.getHash(t.$id)};k.add(a)}return t},w=()=>_.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=w(),a=e.computed(()=>n.name&&t.$id?f.genHash(t.$id,n.name):n.href),i=e.computed(()=>t.showMenuInPopup?S.TopPopupListItem: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),E=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"},R=["data-top-icon"],O={class:"top-ellipsis"},D={class:"top-tabsView_menuList"},H={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=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=>{var M,$,N,T;if(s.type.__name&&s.type.__name!==v.__name)return;if(!s.type.__name&&typeof s.children=="object"){r(s.children);return}if(!((M=s.props)!=null&&M.name)||($=s.props)!=null&&$.disabled)return;const I={title:((T=(N=s.children).default)==null?void 0:T.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,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 E(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 b;return e.onMounted(()=>{b=new ResizeObserver(()=>{p.value.parentElement.style.setProperty("--top-tabsView-contents-offset-top",p.value.offsetHeight+"px")}),b.observe(p.value)}),e.onUnmounted(()=>{b.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(S.TopPopup),{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",O,e.toDisplayString(l.value.title),1)],8,R)):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",D,[e.renderSlot(c.$slots,"default")]),c.isShortable?(e.openBlock(),e.createElementBlock("div",H,[c.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))}}),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=C(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$1,{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))}}),A={},q={class:"top-tabsView_menuDelimeter"};function F(o,n){return e.openBlock(),e.createElementBlock("div",q)}const U=m._export_sfc(A,[["render",F]]),W=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.TopPopupListItem),{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))}}),J=j,G=v,Q=W;h.TopTabsView=J,h.TopTabsViewMenuItem=G,h.TopTabsViewMenuTitle=Q,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})});
+define(["require","exports","vue","../.chunks/forms-DRhpgERJ.amd","../utils/route.amd","../.chunks/store-YRW59xEF.amd","../popup/popup.amd","../utils/system.amd","../require/css.amd!../assets/tabsView.css"],(function(X,h,e,m,f,_,S,L){"use strict";if(typeof e>"u")var e=window.Vue;const g=(o,n)=>`top:${String(o)}:${n}`,y={loadLocalStorge:(o,n)=>{if(!n.$id)return;const t=g(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=g(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(),C=(o,n)=>{const t=_.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";y.loadLocalStorge(a,t),y.addSaverLocalStorge(a,t)}if(t.$id){const a=i=>{n.value=f.getHash(t.$id)};k.add(a)}return t},w=()=>_.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=w(),a=e.computed(()=>n.name&&t.$id?f.genHash(t.$id,n.name):n.href),i=e.computed(()=>t.showMenuInPopup?S.TopPopupListItem: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),E=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"},R=["data-top-icon"],O={class:"top-ellipsis"},D={class:"top-tabsView_menuList"},H={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=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=>{var M,$,N,T;if(s.type.__name&&s.type.__name!==v.__name)return;if(!s.type.__name&&typeof s.children=="object"){r(s.children);return}if(!((M=s.props)!=null&&M.name)||($=s.props)!=null&&$.disabled)return;const I={title:((T=(N=s.children).default)==null?void 0:T.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,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 E(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 b;return e.onMounted(()=>{b=new ResizeObserver(()=>{p.value.parentElement.style.setProperty("--top-tabsView-contents-offset-top",p.value.offsetHeight+"px")}),b.observe(p.value)}),e.onUnmounted(()=>{b.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(S.TopPopup),{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",O,e.toDisplayString(l.value.title),1)],8,R)):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",D,[e.renderSlot(c.$slots,"default")]),c.isShortable?(e.openBlock(),e.createElementBlock("div",H,[c.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))}}),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=C(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$1,{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))}}),A={},q={class:"top-tabsView_menuDelimeter"};function F(o,n){return e.openBlock(),e.createElementBlock("div",q)}const U=m._export_sfc(A,[["render",F]]),W=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.TopPopupListItem),{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))}}),J=j,G=v,Q=W;h.TopTabsView=J,h.TopTabsViewMenuItem=G,h.TopTabsViewMenuTitle=Q,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})}));
 //# sourceMappingURL=tabsView.amd.js.map

package/tabsView/tabsView.amd.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tabsView.amd.js","sources":["../../src/core/utils/store/localStorage.ts","../../src/components/tabsView/tabsView/store.ts","../../src/components/tabsView/tabsView/menuItem.vue","../../src/components/tabsView/tabsView/utils.ts","../../src/components/tabsView/tabsView/menu.vue","../../src/components/tabsView/tabsView/tabsView.vue","../../src/components/tabsView/tabsView/menuDelimeter.vue","../../src/components/tabsView/tabsView/menuTitle.vue","../../src/components/tabsView/tabsView.ts"],"sourcesContent":["import { watch } from 'vue';\nimport type { Store } from './store';\n\n/*\n Сгенерировать имя для сохранения данных в localStorage\n * @param stateName - имя свойства состояния\n * @param stateKey - ключ состояния, разные компоненты могут использовать одинаковый ключ\n /\nconst genStorageKey = <T extends Store>(stateName: keyof T, stateKey: string): string => {\n\tconst stateNameString = String(stateName);\n\n\treturn `top:${stateNameString}:${stateKey}`;\n};\n\n/\n Загрузить состояние\n * @param stateName - имя свойства состояния\n * @param store\n /\nconst loadLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\n\t// если Store.key не знадан, значит сохранение состояния в компоненте отключено\n\tif (!store.$id) return;\n\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\n\n\ttry {\n\t\tconst localStorageValue: typeof store[keyof typeof store] = JSON.parse(localStorage.getItem(localStorageKey) as string);\n\n\t\tif (typeof localStorageValue === typeof store[stateName]) {\n\t\t\tstore[stateName] = localStorageValue;\n\t\t}\n\t} catch (e) {\n\t\tconsole.warn(new Error(`В localStorage[${localStorageKey}] не корректный json`));\n\t}\n};\n\n/\n Добавить автосохранение состояние при его изменении\n * @param stateName - имя свойства состояния\n * @param store\n /\nconst addSaverLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\n\t// если store.$id не знадан, значит сохранение состояния в компоненте отключено\n\tif (!store.$id) return;\n\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\n\n\twatch(() => store[stateName], () => {\n\t\tlocalStorage.setItem(localStorageKey, JSON.stringify(store[stateName]));\n\t}, { immediate: true });\n};\n\nexport default {\n\tloadLocalStorge,\n\taddSaverLocalStorge,\n};","import type { InjectionKey, ModelRef, UnwrapNestedRefs } from 'vue';\nimport { computed, ref } from 'vue';\nimport Core from '@/core/core/core';\nimport { defineStore, useStore, type Store as DefineStore } from '@/core/utils/store';\nimport StoreLocalStorage from '@/core/utils/store/localStorage';\nimport type { Props, Store } from './types';\nimport { getHash } from '@/core/utils/route';\n\nconst popstateCallbacks = new Set<(e: PopStateEvent) => void>();\n\naddEventListener('popstate', (e) => {\n\tpopstateCallbacks.forEach(popstateCallback => popstateCallback(e));\n});\n\nexport const injectionKey = Symbol() as InjectionKey<Store>;\n\n/\n Инициировать Store компонента\n /\nexport const defineTabsStore = (props: Props, model: ModelRef<string \| undefined>): UnwrapNestedRefs<Store> & DefineStore => {\n\tconst store = defineStore(injectionKey, () => {\n\t\tconst showMenuInPopup = computed(() => props.showMenuInPopup ?? Core.state.isMobile);\n\t\tconst pageMod = computed(() => props.pageMod);\n\t\tconst isShort = ref(false);\n\n\t\tconst component = ref(undefined);\n\t\tconst scrollable = ref(true);\n\n\t\treturn {\n\t\t\tshowMenuInPopup,\n\t\t\tpageMod,\n\t\t\tisShort,\n\t\t\tactiveItemName: model,\n\t\t\tcomponent,\n\t\t\tscrollable,\n\t\t};\n\t}, props.idState);\n\n\tif (props.isShortable) {\n\t\tconst stateName = 'isShort';\n\n\t\tStoreLocalStorage.loadLocalStorge(stateName, store);\n\t\tStoreLocalStorage.addSaverLocalStorge(stateName, store);\n\t}\n\n\tif (store.$id) {\n\t\tconst popstateCallback = (_e: PopStateEvent) => {\n\t\t\tmodel.value = getHash(store.$id!);\n\t\t};\n\n\t\tpopstateCallbacks.add(popstateCallback);\n\t}\n\n\treturn store;\n};\n\n/\n Получить Store компонента\n /\nexport const useTabsStore = () => useStore(injectionKey);\n","<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { genHash } from '@/core/utils/route';\nimport { TopPopupListItem } from '@/components/popup/popup';\nimport { useTabsStore } from './store';\nimport type { PropsMenuItem } from './types';\n\nconst props = withDefaults(defineProps<PropsMenuItem>(), {\n\tscrollable: true,\n\tcomponent: undefined,\n});\n\nconst store = useTabsStore();\n\nconst href = computed(() => {\n\t// это внутренняя хеш навигация, ссылка на вкладку\n\tif (props.name && store.$id) {\n\t\treturn genHash(store.$id, props.name);\n\t}\n\n\treturn props.href;\n});\n\nconst tagName = computed(() => {\n\tif (store.showMenuInPopup) {\n\t\treturn TopPopupListItem;\n\t}\n\n\treturn href ? 'a' : 'button';\n});\n\n/\n Клик по элементу меню\n /\nconst onClick = (e: MouseEvent) => {\n\t// это внутренняя хеш навигация, ссылка на вкладку\n\tif (!props.href && href.value) {\n\t\te.preventDefault();\n\t}\n\n\tif (props.name) {\n\t\tstore.activeItemName = props.name;\n\t}\n};\n</script>\n\n<template>\n\t<component\n\t\t:is=\"tagName\"\n\t\ttarget=\"_self\"\n\t\t:class=\"{\n\t\t\t['top-tabsView_menuItem']: !store.showMenuInPopup,\n\t\t\t['top-active']: name && store.activeItemName === name,\n\t\t\t['top-disabled']: disabled,\n\t\t\t['top-spa-disabled']: true,\n\t\t}\"\n\t\t:href=\"href\"\n\t\t:data-top-icon=\"icon \|\| undefined\"\n\t\t:disabled=\"disabled \|\| undefined\"\n\t\t@click=\"onClick\"\n\t>\n\t\t<slot name=\"default\" v-if=\"store.showMenuInPopup\"></slot>\n\n\t\t<span\n\t\t\tv-else-if=\"$slots.default && !store.isShort\"\n\t\t\tclass=\"top-ellipsis\"\n\t\t>\n\t\t\t<slot name=\"default\"></slot>\n\t\t</span>\n\t</component>\n</template>\n\n<style>\n.top-tabsView_menuItem {\n\t--top-icon-color: var(--color-text-2);\n\t--top-icon-width: calc(var(--top-icon-size));\n\n\tcursor: pointer;\n\tbox-sizing: border-box;\n\n\tborder: none;\n\tborder-radius: var(--top-radius-2);\n\tpadding: var(--top-padding-2);\n\tbackground: transparent;\n\theight: 40px;\n\n\tcolor: var(--color-text-1);\n\ttext-decoration: none;\n\twhite-space: nowrap;\n\n\tdisplay: flex;\n\tgap: var(--top-gap-2);\n\talign-items: center;\n\tjustify-content: flex-start;\n\ttransition: background var(--transition);\n}\n\n.top-tabsView_menuItem:hover {\n\t--top-icon-color: var(--color-text-1);\n\n\tbackground: var(--color-bg-shading-1);\n\ttext-decoration: none;\n}\n\n.top-tabsView_menuItem.top-active {\n\t--top-icon-color: inherit;\n\n\tbackground: var(--color-layout-front-1);\n\tcolor: inherit;\n}\n\n.top-tabsView_menuItem:disabled:not(option):not(optgroup):not(.top-forms-option),\n.top-tabsView_menuItem:disabled ~ .top-formsCaption,\n.top-tabsView_menuItem.top-disabled[data-top-icon]:before,\n.top-tabsView_menuItem.top-disabled[data-top-icon2]:after {\n\topacity: unset;\n\tfilter: unset;\n}\n\n.top-tabsView_menuItem.top-disabled {\n\t--top-icon-color: var(--color-text-4);\n\n\tcolor: var(--color-text-4);\n}\n</style>\n","// TODO: Эту функцию можно вынести в глобальный utils\n\nimport { sleepWhile } from '@/core/utils/system';\n\n/\n Проверка нахождения компонента в состояние загрузки\n * @param component\n /\nexport const checkComponentIsLoading = (component: any) => {\n\treturn component?.name === 'AsyncComponentWrapper' && !component?.__asyncResolved;\n};\n\n/\n Презагрузить компонент\n \n Некоторое время ожидает загрузку компонента, прежде чем завершит работу\n /\nexport const preResolveComponent = async (component: any, condition: Function) => {\n\tif (component?.name !== 'AsyncComponentWrapper') return;\n\tif (component?.__asyncResolved) return;\n\n\tcomponent.__asyncLoader();\n\n\tawait sleepWhile(() => {\n\t\treturn condition() && checkComponentIsLoading(component);\n\t}, 200);\n};\n","<script setup lang=\"ts\">\nimport type { Ref, VNode } from 'vue';\nimport { markRaw, onMounted, onUnmounted, ref, useSlots, watch } from 'vue';\nimport { TopPopup } from '../../popup/popup';\nimport { getHash, setHash } from '@/core/utils/route';\n\nimport type { MenuItem, PropsMenu, PropsMenuItem } from './types';\nimport { useTabsStore } from './store';\nimport TabsViewMenuItem from './menuItem.vue';\nimport { preResolveComponent } from './utils';\n\ndefineProps<PropsMenu>();\n\nconst isLoading = defineModel('isLoading');\n\nconst store = useTabsStore();\n\nconst slots = useSlots();\n\n// словарь используется для оптимизации получения нужного menuItem\nconst menuItemByName: Map<PropsMenuItem['name'], MenuItem> = new Map();\n\n// заполнить словарь с menuItem, по элементам в slot default\nconst setMenuItemByName = () => {\n\tif (!slots.default) return;\n\n\tconst component: any = slots.default({}).find(item => item.key === '_menu');\n\tif (!component) return;\n\n\tsetMenuItemByNameFromItems(component.children);\n};\n\n// заполнить словарь с menuItem, по элементам\nconst setMenuItemByNameFromItems = (menuItems: VNode[]) => {\n\tmenuItems.forEach((subComponent: any) => {\n\t\t// это не компонент элемента меню\n\t\tif (subComponent.type.__name && subComponent.type.__name !== TabsViewMenuItem.__name) return;\n\n\t\t// это не компонент, например template\n\t\tif (!subComponent.type.__name && typeof subComponent.children === 'object') {\n\t\t\tsetMenuItemByNameFromItems(subComponent.children);\n\n\t\t\treturn;\n\t\t}\n\n\t\tif (!subComponent.props?.name \|\| subComponent.props?.disabled) return;\n\n\t\tconst menuItem: MenuItem = {\n\t\t\ttitle: (subComponent.children.default?.()[0].children as string).trim(),\n\t\t\ticon: subComponent.props.icon,\n\t\t\tcomponent: subComponent.props.component ? markRaw(subComponent.props.component) : TabsViewMenuItem.props.component.default,\n\t\t\tscrollable: subComponent.props.scrollable ?? TabsViewMenuItem.props.scrollable.default,\n\t\t};\n\n\t\tmenuItemByName.set(subComponent.props.name, menuItem);\n\t});\n};\n\n/\n activeMenuItem нужен:\n * - для вывода текста активной вкладки в меню с popup\n * - для вывода компонента активной вкладки (store.component)\n * - для установки store.scrollable\n /\nconst activeMenuItem: Ref<MenuItem \| null> = ref(null);\n\n/\n Кол-во изменений активной вкладки\n /\nlet countChanged = 0;\n\n/\n Смена активной вкладки\n \n TODO: смена slot, например смена языка, требует повторного выполнения setMenuItemByName()\n /\nwatch(\n\t() => store.activeItemName,\n\tasync () => {\n\t\tconst numberChanged = ++countChanged; // порядковый номер текущего изменения\n\n\t\tif (menuItemByName.size === 0) {\n\t\t\tsetMenuItemByName();\n\t\t}\n\n\t\tif (menuItemByName.size === 0) {\n\t\t\tstore.activeItemName = '';\n\n\t\t\treturn;\n\t\t}\n\n\t\tactiveMenuItem.value = menuItemByName.get(store.activeItemName) ?? null;\n\n\t\t// элемент не найден, установить из хеша страницы\n\t\tif (!activeMenuItem.value && store.$id) {\n\t\t\tconst activeItemName = getHash(store.$id);\n\n\t\t\tactiveMenuItem.value = menuItemByName.get(activeItemName) ?? null;\n\n\t\t\tif (activeMenuItem.value) {\n\t\t\t\tstore.activeItemName = activeItemName;\n\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\n\t\t// элемент не найден, установить первый доступный\n\t\tif (!activeMenuItem.value) {\n\t\t\tstore.activeItemName = menuItemByName.keys().next().value!;\n\n\t\t\treturn;\n\t\t}\n\n\t\t// запрошена смена на уже активный элемент\n\t\tif (activeMenuItem.value.component === store.component) {\n\t\t\tisLoading.value = false;\n\n\t\t\treturn;\n\t\t}\n\n\t\tif (store.$id) setHash(store.$id, store.activeItemName, false);\n\n\t\t// флаг загрузки будет сброшен при инициализации компонента\n\t\tisLoading.value = true;\n\n\t\t/\n\t\t Презагрузить компонент\n\t\t \n\t\t Нужно для того, чтобы минимизировать скачки интерфейса при ожидании загрузки асинхронного компонента\n\t\t /\n\t\tawait preResolveComponent(activeMenuItem.value.component, () => numberChanged === countChanged);\n\n\t\t// влкадка была сменена еще раз во время sleepWhile\n\t\tif (numberChanged !== countChanged) {\n\t\t\treturn;\n\t\t}\n\n\t\tstore.scrollable = activeMenuItem.value.scrollable;\n\t\tstore.component = activeMenuItem.value.component;\n\n\t\tif (activeMenuItem.value && !store.component) {\n\t\t\tconsole.warn(`Компонент вкладки ${store.activeItemName} не найден. Добавьте props.component для пункта меню ${store.activeItemName}.`);\n\t\t}\n\t},\n\t{ immediate: true },\n);\n\nconst elRef = ref();\nlet resizeObserver: ResizeObserver;\n\nonMounted(() => {\n\tresizeObserver = new ResizeObserver(() => {\n\t\telRef.value.parentElement.style.setProperty('--top-tabsView-contents-offset-top', elRef.value.offsetHeight + 'px');\n\t});\n\n\tresizeObserver.observe(elRef.value);\n});\n\nonUnmounted(() => {\n\tresizeObserver.disconnect();\n});\n</script>\n\n<template>\n\t<div\n\t\tref=\"elRef\"\n\t\t:class=\"{\n\t\t\t'top-tabsView_menu': true,\n\t\t\t'top-tabsView_menu-inPopup_0': !store.showMenuInPopup,\n\t\t\t'top-tabsView_menu-inPopup_1': store.showMenuInPopup,\n\t\t\t'top-tabsView_menu-short': store.isShort && !store.showMenuInPopup,\n\t\t}\"\n\t>\n\t\t<!-- Спрятать меню под кнопку в popup -->\n\t\t<TopPopup v-if=\"store.showMenuInPopup\">\n\t\t\t<template #opener>\n\t\t\t\t<div class=\"top-tabsView_menuOpener\">\n\t\t\t\t\t<div\n\t\t\t\t\t\tv-if=\"activeMenuItem\"\n\t\t\t\t\t\tclass=\"top-tabsView_menuOpenerActiveItem\"\n\t\t\t\t\t\t:data-top-icon=\"activeMenuItem.icon\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"top-ellipsis\">\n\t\t\t\t\t\t\t{{ activeMenuItem.title }}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<div class=\"top-tabsView_menuOpenerIcon\" data-top-icon=\"\"></div>\n\t\t\t\t</div>\n\t\t\t</template>\n\n\t\t\t<template #contentList>\n\t\t\t\t<slot></slot>\n\t\t\t</template>\n\t\t</TopPopup>\n\n\t\t<!-- Отобразить меню на странице -->\n\t\t<template v-else>\n\t\t\t<div class=\"top-tabsView_menuList\">\n\t\t\t\t<slot></slot>\n\t\t\t</div>\n\n\t\t\t<div\n\t\t\t\tv-if=\"isShortable\"\n\t\t\t\tclass=\"top-tabsView_menuFooter\"\n\t\t\t>\n\t\t\t\t<TabsViewMenuItem\n\t\t\t\t\tv-if=\"isShortable\"\n\t\t\t\t\t:icon=\"store.isShort ? '' : ''\"\n\t\t\t\t\t@click=\"store.isShort = !store.isShort\"\n\t\t\t\t>\n\t\t\t\t\t{{ store.isShort ? '' : 'Свернуть' }} <!--TODO: translate-->\n\t\t\t\t</TabsViewMenuItem>\n\t\t\t</div>\n\t\t</template>\n\t</div>\n</template>\n\n<style>\n/ режим отображение табов в основной области документа /\n.top-tabsView-pageMod .top-tabsView_menu {\n\tbox-sizing: border-box;\n\tposition: sticky;\n\ttop: var(--top-tabsView-top);\n\tz-index: 10;\n}\n\n/ режим отображение табов в основной области документа без popup /\n.top-tabsView-pageMod .top-tabsView_menu-inPopup_0 {\n\theight: calc(var(--100vh) - var(--top-tabsView-top));\n}\n\n/ стантартный режим /\n.top-tabsView_menu-inPopup_0 {\n\tbox-sizing: border-box;\n\twidth: var(--top-tabsView-menu-width);\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\tflex-shrink: 0;\n}\n\n/ режим вывода в popup /\n.top-tabsView_menu-inPopup_1 {\n\tborder-bottom: 1px solid var(--color-line-2-opacity);\n}\n\n.top-tabsView_menu-short {\n\twidth: auto;\n}\n\n.top-tabsView_menu > .top-tabsView_menuOpener {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n}\n\n.top-tabsView_menu > .top-tabsView_menuOpener:hover {\n\tbackground: var(--color-layer-1);\n}\n\n.top-tabsView_menuOpenerIcon { display: flex; }\n\n.top-tabsView_menuOpenerActiveItem {\n\t--top-forms-padding: 0px;\n\n\tbox-sizing: border-box;\n\tpadding: var(--top-padding-2);\n\tmax-width: calc(100% - var(--top-forms-base-height));\n\twhite-space: nowrap;\n\tflex-grow: 1;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--top-padding-2);\n}\n\n.top-tabsView_menuList,\n.top-tabsView_menuFooter {\n\tpadding: var(--top-padding-2);\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--top-gap-2);\n}\n\n.top-tabsView_menuList {\n\toverflow-y: auto;\n}\n\n.top-tabsView_menu-short .top-tabsView_menuFooter > .top-tabsView_menuItem {\n\t--top-icon-width: 100%;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { defineModel, onUnmounted, ref, watch } from 'vue';\nimport Core from '@/core/core/core';\nimport { delHash } from '@/core/utils/route';\nimport type { Props } from './types';\nimport { defineTabsStore } from './store';\nimport TabsViewMenu from './menu.vue';\nimport TopLoadbar from '@/components/forms/loadbar/loadbar.vue';\nimport { checkComponentIsLoading } from './utils';\n\nconst props = withDefaults(defineProps<Props>(), {\n\tshowMenuInPopup: undefined,\n\tisShortable: false,\n});\n\nconst model = defineModel<string>();\n\nconst store = defineTabsStore(props, model);\n\nconst uid = Math.random();\n\nif (props.pageMod) Core.state.documentClassModificators.set(uid, 'top-hasTabsViewPageMod');\n\nonUnmounted(() => {\n\tif (props.pageMod) Core.state.documentClassModificators.delete(uid);\n\n\tif (store.$id) delHash(store.$id, store.activeItemName, true);\n});\n\nconst componentRef = ref();\nconst isLoading = ref(false);\n\nwatch([componentRef, () => store.component], () => {\n\tisLoading.value = checkComponentIsLoading(store.component);\n}, { immediate: true });\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabsView': true,\n\t\t\t'top-tabsView-pageMod': props.pageMod,\n\t\t\t'top-tabsView-inPopup': store.showMenuInPopup,\n\t\t}\"\n\t>\n\t\t<TabsViewMenu\n\t\t\t:isShortable=\"isShortable\"\n\t\t\tv-model:isLoading=\"isLoading\"\n\t\t>\n\t\t\t<!-- @slot Меню, ожидает передачу компонентов TabsViewMenuItem и TabsViewMenuTitle -->\n\t\t\t<slot name=\"menu\"></slot>\n\t\t</TabsViewMenu>\n\n\t\t<div\n\t\t\t:class=\"{\n\t\t\t\t'top-tabsView_contents': true,\n\t\t\t\t'top-tabsView_contents-isLoading': isLoading,\n\t\t\t\t'top-tabsView_contents-noScrollable': !store.scrollable,\n\t\t\t}\"\n\t\t>\n\t\t\t<TopLoadbar v-if=\"isLoading\"/>\n\n\t\t\t<keep-alive>\n\t\t\t\t<component\n\t\t\t\t\tref=\"componentRef\"\n\t\t\t\t\t:is=\"store.component\"\n\t\t\t\t/>\n\t\t\t</keep-alive>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n:root {\n\t--top-tabsView-top: 0px;\n\t--top-tabsView-menu-width: 220px;\n\t--top-tabsView-contents-offset-top: 0px;\n}\n\n.top-tabsView {\n\tbackground: var(--color-layout-middle);\n\twidth: 100%;\n\theight: 100%;\n\tdisplay: flex;\n\tflex-direction: row;\n}\n\n.top-tabsView_contents {\n\tborder-radius: var(--top-radius-4);\n\tbackground: var(--color-layout-front-1);\n\tpadding: var(--top-padding-4);\n\tflex-grow: 1;\n\toverflow: auto;\n\tposition: relative;\n}\n\n.top-tabsView_contents-isLoading {\n\tpointer-events: none;\n}\n\n.top-tabsView_contents-noScrollable {\n\twidth: calc(100% - var(--top-tabsView-menu-width));\n\tpadding: 0;\n\toverflow: visible;\n}\n\n/ top-tabsView-inPopup */\n.top-tabsView-inPopup {\n\tbackground: var(--color-layout-front-1);\n\tflex-direction: column;\n}\n\n.top-tabsView-inPopup > .top-tabsView_contents {\n\tborder-radius: 0;\n}\n\n.top-tabsView-inPopup > .top-tabsView_contents-noScrollable {\n\twidth: auto;\n}\n</style>\n","<script setup lang=\"ts\">\n\n</script>\n\n<template>\n\t<div class=\"top-tabsView_menuDelimeter\"></div>\n</template>\n\n<style>\n.top-tabsView_menuDelimeter {\n\tpadding: var(--top-padding-1) 0;\n\tdisplay: flex;\n}\n\n.top-tabsView_menuDelimeter:before {\n\tcontent: \"\";\n\theight: 2px;\n\tbackground: var(--color-line-2);\n\tflex-grow: 1;\n}\n\n.top-tabsView_menuDelimeter:first-child,\n.top-tabsView_menuDelimeter + .top-tabsView_menuDelimeter {\n\tdisplay: none;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { useTabsStore } from './store';\nimport type { PropsMenuTitle } from './types';\nimport TabsViewMenuDelimeter from './menuDelimeter.vue';\nimport { TopPopupListItem } from '../../popup/popup';\n\ndefineProps<PropsMenuTitle>();\n\nconst store = useTabsStore();\n</script>\n\n<template>\n\t<TopPopupListItem\n\t\tv-if=\"store.showMenuInPopup\"\n\t\ttype=\"title\"\n\t>\n\t\t<slot></slot>\n\t</TopPopupListItem>\n\n\t<TabsViewMenuDelimeter v-else-if=\"store.isShort\"/>\n\n\t<div\n\t\tv-else\n\t\t:class=\"{\n\t\t\t'top-tabsView_menuTitle': true,\n\t\t\t'top-tabsView_menuTitle-subtitle': isSubtitle,\n\t\t}\"\n\t>\n\t\t<slot></slot>\n\t</div>\n</template>\n\n<style>\n.top-tabsView_menuTitle {\n\tpadding: var(--top-padding-4) var(--top-padding-2) var(--top-padding-1);\n\tfont-weight: 600;\n\tcolor: var(--color-text-1);\n}\n\n.top-tabsView_menuTitle-subtitle {\n\tpadding-top: var(--top-padding-1);\n\tfont-size: 12px;\n\tfont-weight: 400;\n\tcolor: var(--color-text-2);\n}\n</style>\n","import type { ComponentCustomProps } from 'vue';\n\nimport TabsView from './tabsView/tabsView.vue';\nimport TabsViewMenuItem from './tabsView/menuItem.vue';\nimport TabsViewMenuTitle from './tabsView/menuTitle.vue';\n\nexport const TopTabsView = TabsView as typeof TabsView & ComponentCustomProps;\nexport const TopTabsViewMenuItem = TabsViewMenuItem as typeof TabsViewMenuItem & ComponentCustomProps;\nexport const TopTabsViewMenuTitle = TabsViewMenuTitle as typeof TabsViewMenuTitle & ComponentCustomProps;\n"],"names":["genStorageKey","stateName","stateKey","StoreLocalStorage","store","localStorageValue","localStorageKey","popstateCallbacks","e","defineTabsStore","props","model","store$1","injectionKey","showMenuInPopup","vue","forms","isShort","component","scrollable","pageMod","popstateCallback","_e","useTabsStore","href","tagName","popup_popup","onClick","checkComponentIsLoading","preResolveComponent","condition","slots","menuItemByName","setMenuItemByNameFromItems","menuItems","subComponent","_sfc_main$4","_a","_b","_d","_c","activeMenuItem","numberChanged","countChanged","setMenuItemByName","activeItemName","isLoading","utils_route","elRef","resizeObserver","uid","componentRef","_hoisted_1","TopTabsView","_sfc_main$2","TopTabsViewMenuItem","TopTabsViewMenuTitle","_sfc_main"],"mappings":"uRAQA,MAAAA,EAAA,CAAAC,EAAAC,WACC,OAAAD,CAAA,SA2CDE,EAAA,CAAe,gBAjCf,CAAAF,EAAAG,IAAA,CAEC,GAAA,CAAAA,EAAA,IAAA,0BAIA,GAAA,CACC,MAAAC,EAAA,KAAA,MAAA,aAAA,QAAAC,CAAA,CAAA,0BAGCF,EAAAH,CAAA,EAAAI,SAGD,QAAA,KAAA,IAAA,MAAA,kBAAAC,CAAA,sBAAA,CAAA,CAA+E,uBASjF,CAAAL,EAAAG,IAAA,CAEC,GAAA,CAAAA,EAAA,IAAA,gDAKC,aAAA,QAAAE,EAAA,KAAA,UAAAF,EAAAH,CAAA,CAAA,CAAA,CAAsE,EAAA,CAAA,UAAA,EAAA,CAAA,ICxCxEM,EAAA,IAAA,IAEA,iBAAA,WAAAC,GAAA,mBAEA,CAAA,mBAOaC,EAAA,CAAAC,EAAAC,IAAA,CACZ,MAAAC,EAAAR,EAAA,YAAAS,EAAA,IAAA,CACC,MAAAC,EAAAC,EAAA,SAAA,IAAAL,EAAA,iBAAAM,EAAA,KAAA,MAAA,QAAA,8BAEAC,EAAAF,EAAA,IAAA,EAAA,EAEAG,EAAAH,EAAA,IAAA,MAAA,EACAI,EAAAJ,EAAA,IAAA,EAAA,EAEA,MAAA,CAAO,gBAAAD,EACN,QAAAM,EACA,QAAAH,mBAEgB,UAAAC,eAGjB,EAAAR,EAAA,OAAA,EAGD,GAAAA,EAAA,YAAA,mBAGCP,EAAA,gBAAAF,EAAAW,CAAA,EACAT,EAAA,oBAAAF,EAAAW,CAAA,CAAsD,CAGvD,GAAAA,EAAA,IAAA,CACC,MAAAS,EAAAC,GAAA,2BAIAf,EAAA,IAAAc,CAAA,CAAsC,CAGvC,OAAAT,GAMYW,EAAA,IAAAnB,EAAA,SAAAS,CAAA,mNC/CbT,EAAAmB,EAAA,EAEAC,EAAAT,EAAA,SAAA,gDAMc,EAGdU,EAAAV,EAAA,SAAA,IACCX,EAAA,gBACCsB,EAAA,iBAGDF,EAAA,IAAA,QAAoB,EAMrBG,EAAAnB,GAAA,sCAMCE,EAAA,OACCN,EAAA,eAAAM,EAAA,upBCjCWkB,EAAAV,oFASAW,EAAA,MAAAX,EAAAY,IAAA,EACZZ,GAAA,YAAAA,EAAA,QAAA,0BACAA,GAAA,MAAAA,EAAA,2DAKCY,EAAA,GAAAF,EAAAV,CAAA,gYCTFd,EAAAmB,EAAA,EAEAQ,EAAAhB,EAAA,SAAA,EAGAiB,EAAA,IAAA,WAIC,GAAA,CAAAD,EAAA,QAAA,yDAKAE,EAAAf,EAAA,QAAA,GAIDe,EAAAC,GAAA,CACCA,EAAA,QAAAC,GAAA,aAEC,GAAAA,EAAA,KAAA,QAAAA,EAAA,KAAA,SAAAC,EAAA,OAAA,OAGA,GAAA,CAAAD,EAAA,KAAA,QAAA,OAAAA,EAAA,UAAA,SAAA,CACCF,EAAAE,EAAA,QAAA,QAEA,CAGD,GAAA,GAAAE,EAAAF,EAAA,QAAA,MAAAE,EAAA,QAAAC,EAAAH,EAAA,QAAA,MAAAG,EAAA,SAAA,gBAE2B,QAAAC,GAAAC,EAAAL,EAAA,UAAA,UAAA,YAAAI,EAAA,KAAAC,GAAA,GAAA,UAAA,KAAA,EAC4C,KAAAL,EAAA,MAAA,wFAE6C,WAAAA,EAAA,MAAA,YAAAC,EAAA,MAAA,WAAA,8BAIhE,CAAA,GAUtDK,EAAA1B,EAAA,IAAA,IAAA,UAYAA,EAAA,2BACa,SAAA,CAEX,MAAA2B,EAAA,EAAAC,EAMA,GAJAX,EAAA,OAAA,GACCY,EAAA,EAGDZ,EAAA,OAAA,EAAA,CACC5B,EAAA,eAAA,SAEA,IAGDqC,EAAA,MAAAT,EAAA,IAAA5B,EAAA,cAAA,GAAA,+CAQC,0BAAAqC,EAAA,MAAA,CACCrC,EAAA,eAAAyC,QAEA,CACD,CAID,GAAA,CAAAJ,EAAA,MAAA,CACCrC,EAAA,eAAA4B,EAAA,KAAA,EAAA,KAAA,EAAA,YAEA,qCAKAc,EAAA,MAAA,SAEA,CAGD1C,EAAA,KAAA2C,EAAA,QAAA3C,EAAA,IAAAA,EAAA,eAAA,EAAA,EAGA0C,EAAA,MAAA,GAOA,MAAAjB,EAAAY,EAAA,MAAA,UAAA,IAAAC,IAAAC,CAAA,EAGAD,IAAAC,yFAQC,QAAA,KAAA,qBAAAvC,EAAA,cAAA,wDAAAA,EAAA,cAAA,GAAA,oBAMH,MAAA4C,EAAAjC,EAAA,IAAA,EACA,IAAAkC,0BAGCA,EAAA,IAAA,eAAA,IAAA,CACCD,EAAA,MAAA,cAAA,MAAA,YAAA,qCAAAA,EAAA,MAAA,aAAA,IAAA,CAAiH,CAAA,EAGlHC,EAAA,QAAAD,EAAA,KAAA,CAAkC,CAAA,mCAIR,CAAA,6pDC5I3BE,EAAA,KAAA,OAAA,EAEAxC,EAAA,SAAAM,EAAA,KAAA,MAAA,0BAAA,IAAAkC,EAAA,wBAAA,qBAGCxC,EAAA,SAAAM,EAAA,KAAA,MAAA,0BAAA,OAAAkC,CAAA,EAEA9C,EAAA,KAAA2C,EAAA,QAAA3C,EAAA,IAAAA,EAAA,eAAA,EAAA,CAA4D,CAAA,EAG7D,MAAA+C,EAAApC,EAAA,IAAA,EACA+B,EAAA/B,EAAA,IAAA,EAAA,gEAG0D,EAAA,CAAA,UAAA,EAAA,CAAA,g1BC5BpDqC,EAAA,CAAA,MAAA,4BAAA,gMCGN,MAAAhD,EAAAmB,EAAA,ubCFO8B,EAAAC,EACAC,EAAAnB,EACAoB,EAAAC"}
1	+ {"version":3,"file":"tabsView.amd.js","sources":["../../src/core/utils/store/localStorage.ts","../../src/components/tabsView/tabsView/store.ts","../../src/components/tabsView/tabsView/menuItem.vue","../../src/components/tabsView/tabsView/utils.ts","../../src/components/tabsView/tabsView/menu.vue","../../src/components/tabsView/tabsView/tabsView.vue","../../src/components/tabsView/tabsView/menuDelimeter.vue","../../src/components/tabsView/tabsView/menuTitle.vue","../../src/components/tabsView/tabsView.ts"],"sourcesContent":["import { watch } from 'vue';\nimport type { Store } from './store';\n\n/*\n Сгенерировать имя для сохранения данных в localStorage\n * @param stateName - имя свойства состояния\n * @param stateKey - ключ состояния, разные компоненты могут использовать одинаковый ключ\n /\nconst genStorageKey = <T extends Store>(stateName: keyof T, stateKey: string): string => {\n\tconst stateNameString = String(stateName);\n\n\treturn `top:${stateNameString}:${stateKey}`;\n};\n\n/\n Загрузить состояние\n * @param stateName - имя свойства состояния\n * @param store\n /\nconst loadLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\n\t// если Store.key не знадан, значит сохранение состояния в компоненте отключено\n\tif (!store.$id) return;\n\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\n\n\ttry {\n\t\tconst localStorageValue: typeof store[keyof typeof store] = JSON.parse(localStorage.getItem(localStorageKey) as string);\n\n\t\tif (typeof localStorageValue === typeof store[stateName]) {\n\t\t\tstore[stateName] = localStorageValue;\n\t\t}\n\t} catch (e) {\n\t\tconsole.warn(new Error(`В localStorage[${localStorageKey}] не корректный json`));\n\t}\n};\n\n/\n Добавить автосохранение состояние при его изменении\n * @param stateName - имя свойства состояния\n * @param store\n /\nconst addSaverLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\n\t// если store.$id не знадан, значит сохранение состояния в компоненте отключено\n\tif (!store.$id) return;\n\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\n\n\twatch(() => store[stateName], () => {\n\t\tlocalStorage.setItem(localStorageKey, JSON.stringify(store[stateName]));\n\t}, { immediate: true });\n};\n\nexport default {\n\tloadLocalStorge,\n\taddSaverLocalStorge,\n};","import type { InjectionKey, ModelRef, UnwrapNestedRefs } from 'vue';\nimport { computed, ref } from 'vue';\nimport Core from '@/core/core/core';\nimport { defineStore, useStore, type Store as DefineStore } from '@/core/utils/store';\nimport StoreLocalStorage from '@/core/utils/store/localStorage';\nimport type { Props, Store } from './types';\nimport { getHash } from '@/core/utils/route';\n\nconst popstateCallbacks = new Set<(e: PopStateEvent) => void>();\n\naddEventListener('popstate', (e) => {\n\tpopstateCallbacks.forEach(popstateCallback => popstateCallback(e));\n});\n\nexport const injectionKey = Symbol() as InjectionKey<Store>;\n\n/\n Инициировать Store компонента\n /\nexport const defineTabsStore = (props: Props, model: ModelRef<string \| undefined>): UnwrapNestedRefs<Store> & DefineStore => {\n\tconst store = defineStore(injectionKey, () => {\n\t\tconst showMenuInPopup = computed(() => props.showMenuInPopup ?? Core.state.isMobile);\n\t\tconst pageMod = computed(() => props.pageMod);\n\t\tconst isShort = ref(false);\n\n\t\tconst component = ref(undefined);\n\t\tconst scrollable = ref(true);\n\n\t\treturn {\n\t\t\tshowMenuInPopup,\n\t\t\tpageMod,\n\t\t\tisShort,\n\t\t\tactiveItemName: model,\n\t\t\tcomponent,\n\t\t\tscrollable,\n\t\t};\n\t}, props.idState);\n\n\tif (props.isShortable) {\n\t\tconst stateName = 'isShort';\n\n\t\tStoreLocalStorage.loadLocalStorge(stateName, store);\n\t\tStoreLocalStorage.addSaverLocalStorge(stateName, store);\n\t}\n\n\tif (store.$id) {\n\t\tconst popstateCallback = (_e: PopStateEvent) => {\n\t\t\tmodel.value = getHash(store.$id!);\n\t\t};\n\n\t\tpopstateCallbacks.add(popstateCallback);\n\t}\n\n\treturn store;\n};\n\n/\n Получить Store компонента\n /\nexport const useTabsStore = () => useStore(injectionKey);\n","<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { genHash } from '@/core/utils/route';\nimport { TopPopupListItem } from '@/components/popup/popup';\nimport { useTabsStore } from './store';\nimport type { PropsMenuItem } from './types';\n\nconst props = withDefaults(defineProps<PropsMenuItem>(), {\n\tscrollable: true,\n\tcomponent: undefined,\n});\n\nconst store = useTabsStore();\n\nconst href = computed(() => {\n\t// это внутренняя хеш навигация, ссылка на вкладку\n\tif (props.name && store.$id) {\n\t\treturn genHash(store.$id, props.name);\n\t}\n\n\treturn props.href;\n});\n\nconst tagName = computed(() => {\n\tif (store.showMenuInPopup) {\n\t\treturn TopPopupListItem;\n\t}\n\n\treturn href ? 'a' : 'button';\n});\n\n/\n Клик по элементу меню\n /\nconst onClick = (e: MouseEvent) => {\n\t// это внутренняя хеш навигация, ссылка на вкладку\n\tif (!props.href && href.value) {\n\t\te.preventDefault();\n\t}\n\n\tif (props.name) {\n\t\tstore.activeItemName = props.name;\n\t}\n};\n</script>\n\n<template>\n\t<component\n\t\t:is=\"tagName\"\n\t\ttarget=\"_self\"\n\t\t:class=\"{\n\t\t\t['top-tabsView_menuItem']: !store.showMenuInPopup,\n\t\t\t['top-active']: name && store.activeItemName === name,\n\t\t\t['top-disabled']: disabled,\n\t\t\t['top-spa-disabled']: true,\n\t\t}\"\n\t\t:href=\"href\"\n\t\t:data-top-icon=\"icon \|\| undefined\"\n\t\t:disabled=\"disabled \|\| undefined\"\n\t\t@click=\"onClick\"\n\t>\n\t\t<slot name=\"default\" v-if=\"store.showMenuInPopup\"></slot>\n\n\t\t<span\n\t\t\tv-else-if=\"$slots.default && !store.isShort\"\n\t\t\tclass=\"top-ellipsis\"\n\t\t>\n\t\t\t<slot name=\"default\"></slot>\n\t\t</span>\n\t</component>\n</template>\n\n<style>\n.top-tabsView_menuItem {\n\t--top-icon-color: var(--color-text-2);\n\t--top-icon-width: calc(var(--top-icon-size));\n\n\tcursor: pointer;\n\tbox-sizing: border-box;\n\n\tborder: none;\n\tborder-radius: var(--top-radius-2);\n\tpadding: var(--top-padding-2);\n\tbackground: transparent;\n\theight: 40px;\n\n\tcolor: var(--color-text-1);\n\ttext-decoration: none;\n\twhite-space: nowrap;\n\n\tdisplay: flex;\n\tgap: var(--top-gap-2);\n\talign-items: center;\n\tjustify-content: flex-start;\n\ttransition: background var(--transition);\n}\n\n.top-tabsView_menuItem:hover {\n\t--top-icon-color: var(--color-text-1);\n\n\tbackground: var(--color-bg-shading-1);\n\ttext-decoration: none;\n}\n\n.top-tabsView_menuItem.top-active {\n\t--top-icon-color: inherit;\n\n\tbackground: var(--color-layout-front-1);\n\tcolor: inherit;\n}\n\n.top-tabsView_menuItem:disabled:not(option):not(optgroup):not(.top-forms-option),\n.top-tabsView_menuItem:disabled ~ .top-formsCaption,\n.top-tabsView_menuItem.top-disabled[data-top-icon]:before,\n.top-tabsView_menuItem.top-disabled[data-top-icon2]:after {\n\topacity: unset;\n\tfilter: unset;\n}\n\n.top-tabsView_menuItem.top-disabled {\n\t--top-icon-color: var(--color-text-4);\n\n\tcolor: var(--color-text-4);\n}\n</style>\n","// TODO: Эту функцию можно вынести в глобальный utils\n\nimport { sleepWhile } from '@/core/utils/system';\n\n/\n Проверка нахождения компонента в состояние загрузки\n * @param component\n /\nexport const checkComponentIsLoading = (component: any) => {\n\treturn component?.name === 'AsyncComponentWrapper' && !component?.__asyncResolved;\n};\n\n/\n Презагрузить компонент\n \n Некоторое время ожидает загрузку компонента, прежде чем завершит работу\n /\nexport const preResolveComponent = async (component: any, condition: Function) => {\n\tif (component?.name !== 'AsyncComponentWrapper') return;\n\tif (component?.__asyncResolved) return;\n\n\tcomponent.__asyncLoader();\n\n\tawait sleepWhile(() => {\n\t\treturn condition() && checkComponentIsLoading(component);\n\t}, 200);\n};\n","<script setup lang=\"ts\">\nimport type { Ref, VNode } from 'vue';\nimport { markRaw, onMounted, onUnmounted, ref, useSlots, watch } from 'vue';\nimport { TopPopup } from '../../popup/popup';\nimport { getHash, setHash } from '@/core/utils/route';\n\nimport type { MenuItem, PropsMenu, PropsMenuItem } from './types';\nimport { useTabsStore } from './store';\nimport TabsViewMenuItem from './menuItem.vue';\nimport { preResolveComponent } from './utils';\n\ndefineProps<PropsMenu>();\n\nconst isLoading = defineModel('isLoading');\n\nconst store = useTabsStore();\n\nconst slots = useSlots();\n\n// словарь используется для оптимизации получения нужного menuItem\nconst menuItemByName: Map<PropsMenuItem['name'], MenuItem> = new Map();\n\n// заполнить словарь с menuItem, по элементам в slot default\nconst setMenuItemByName = () => {\n\tif (!slots.default) return;\n\n\tconst component: any = slots.default({}).find(item => item.key === '_menu');\n\tif (!component) return;\n\n\tsetMenuItemByNameFromItems(component.children);\n};\n\n// заполнить словарь с menuItem, по элементам\nconst setMenuItemByNameFromItems = (menuItems: VNode[]) => {\n\tmenuItems.forEach((subComponent: any) => {\n\t\t// это не компонент элемента меню\n\t\tif (subComponent.type.__name && subComponent.type.__name !== TabsViewMenuItem.__name) return;\n\n\t\t// это не компонент, например template\n\t\tif (!subComponent.type.__name && typeof subComponent.children === 'object') {\n\t\t\tsetMenuItemByNameFromItems(subComponent.children);\n\n\t\t\treturn;\n\t\t}\n\n\t\tif (!subComponent.props?.name \|\| subComponent.props?.disabled) return;\n\n\t\tconst menuItem: MenuItem = {\n\t\t\ttitle: (subComponent.children.default?.()[0].children as string).trim(),\n\t\t\ticon: subComponent.props.icon,\n\t\t\tcomponent: subComponent.props.component ? markRaw(subComponent.props.component) : TabsViewMenuItem.props.component.default,\n\t\t\tscrollable: subComponent.props.scrollable ?? TabsViewMenuItem.props.scrollable.default,\n\t\t};\n\n\t\tmenuItemByName.set(subComponent.props.name, menuItem);\n\t});\n};\n\n/\n activeMenuItem нужен:\n * - для вывода текста активной вкладки в меню с popup\n * - для вывода компонента активной вкладки (store.component)\n * - для установки store.scrollable\n /\nconst activeMenuItem: Ref<MenuItem \| null> = ref(null);\n\n/\n Кол-во изменений активной вкладки\n /\nlet countChanged = 0;\n\n/\n Смена активной вкладки\n \n TODO: смена slot, например смена языка, требует повторного выполнения setMenuItemByName()\n /\nwatch(\n\t() => store.activeItemName,\n\tasync () => {\n\t\tconst numberChanged = ++countChanged; // порядковый номер текущего изменения\n\n\t\tif (menuItemByName.size === 0) {\n\t\t\tsetMenuItemByName();\n\t\t}\n\n\t\tif (menuItemByName.size === 0) {\n\t\t\tstore.activeItemName = '';\n\n\t\t\treturn;\n\t\t}\n\n\t\tactiveMenuItem.value = menuItemByName.get(store.activeItemName) ?? null;\n\n\t\t// элемент не найден, установить из хеша страницы\n\t\tif (!activeMenuItem.value && store.$id) {\n\t\t\tconst activeItemName = getHash(store.$id);\n\n\t\t\tactiveMenuItem.value = menuItemByName.get(activeItemName) ?? null;\n\n\t\t\tif (activeMenuItem.value) {\n\t\t\t\tstore.activeItemName = activeItemName;\n\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\n\t\t// элемент не найден, установить первый доступный\n\t\tif (!activeMenuItem.value) {\n\t\t\tstore.activeItemName = menuItemByName.keys().next().value!;\n\n\t\t\treturn;\n\t\t}\n\n\t\t// запрошена смена на уже активный элемент\n\t\tif (activeMenuItem.value.component === store.component) {\n\t\t\tisLoading.value = false;\n\n\t\t\treturn;\n\t\t}\n\n\t\tif (store.$id) setHash(store.$id, store.activeItemName, false);\n\n\t\t// флаг загрузки будет сброшен при инициализации компонента\n\t\tisLoading.value = true;\n\n\t\t/\n\t\t Презагрузить компонент\n\t\t \n\t\t Нужно для того, чтобы минимизировать скачки интерфейса при ожидании загрузки асинхронного компонента\n\t\t /\n\t\tawait preResolveComponent(activeMenuItem.value.component, () => numberChanged === countChanged);\n\n\t\t// влкадка была сменена еще раз во время sleepWhile\n\t\tif (numberChanged !== countChanged) {\n\t\t\treturn;\n\t\t}\n\n\t\tstore.scrollable = activeMenuItem.value.scrollable;\n\t\tstore.component = activeMenuItem.value.component;\n\n\t\tif (activeMenuItem.value && !store.component) {\n\t\t\tconsole.warn(`Компонент вкладки ${store.activeItemName} не найден. Добавьте props.component для пункта меню ${store.activeItemName}.`);\n\t\t}\n\t},\n\t{ immediate: true },\n);\n\nconst elRef = ref();\nlet resizeObserver: ResizeObserver;\n\nonMounted(() => {\n\tresizeObserver = new ResizeObserver(() => {\n\t\telRef.value.parentElement.style.setProperty('--top-tabsView-contents-offset-top', elRef.value.offsetHeight + 'px');\n\t});\n\n\tresizeObserver.observe(elRef.value);\n});\n\nonUnmounted(() => {\n\tresizeObserver.disconnect();\n});\n</script>\n\n<template>\n\t<div\n\t\tref=\"elRef\"\n\t\t:class=\"{\n\t\t\t'top-tabsView_menu': true,\n\t\t\t'top-tabsView_menu-inPopup_0': !store.showMenuInPopup,\n\t\t\t'top-tabsView_menu-inPopup_1': store.showMenuInPopup,\n\t\t\t'top-tabsView_menu-short': store.isShort && !store.showMenuInPopup,\n\t\t}\"\n\t>\n\t\t<!-- Спрятать меню под кнопку в popup -->\n\t\t<TopPopup v-if=\"store.showMenuInPopup\">\n\t\t\t<template #opener>\n\t\t\t\t<div class=\"top-tabsView_menuOpener\">\n\t\t\t\t\t<div\n\t\t\t\t\t\tv-if=\"activeMenuItem\"\n\t\t\t\t\t\tclass=\"top-tabsView_menuOpenerActiveItem\"\n\t\t\t\t\t\t:data-top-icon=\"activeMenuItem.icon\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"top-ellipsis\">\n\t\t\t\t\t\t\t{{ activeMenuItem.title }}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<div class=\"top-tabsView_menuOpenerIcon\" data-top-icon=\"\"></div>\n\t\t\t\t</div>\n\t\t\t</template>\n\n\t\t\t<template #contentList>\n\t\t\t\t<slot></slot>\n\t\t\t</template>\n\t\t</TopPopup>\n\n\t\t<!-- Отобразить меню на странице -->\n\t\t<template v-else>\n\t\t\t<div class=\"top-tabsView_menuList\">\n\t\t\t\t<slot></slot>\n\t\t\t</div>\n\n\t\t\t<div\n\t\t\t\tv-if=\"isShortable\"\n\t\t\t\tclass=\"top-tabsView_menuFooter\"\n\t\t\t>\n\t\t\t\t<TabsViewMenuItem\n\t\t\t\t\tv-if=\"isShortable\"\n\t\t\t\t\t:icon=\"store.isShort ? '' : ''\"\n\t\t\t\t\t@click=\"store.isShort = !store.isShort\"\n\t\t\t\t>\n\t\t\t\t\t{{ store.isShort ? '' : 'Свернуть' }} <!--TODO: translate-->\n\t\t\t\t</TabsViewMenuItem>\n\t\t\t</div>\n\t\t</template>\n\t</div>\n</template>\n\n<style>\n/ режим отображение табов в основной области документа /\n.top-tabsView-pageMod .top-tabsView_menu {\n\tbox-sizing: border-box;\n\tposition: sticky;\n\ttop: var(--top-tabsView-top);\n\tz-index: 10;\n}\n\n/ режим отображение табов в основной области документа без popup /\n.top-tabsView-pageMod .top-tabsView_menu-inPopup_0 {\n\theight: calc(var(--100vh) - var(--top-tabsView-top));\n}\n\n/ стантартный режим /\n.top-tabsView_menu-inPopup_0 {\n\tbox-sizing: border-box;\n\twidth: var(--top-tabsView-menu-width);\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\tflex-shrink: 0;\n}\n\n/ режим вывода в popup /\n.top-tabsView_menu-inPopup_1 {\n\tborder-bottom: 1px solid var(--color-line-2-opacity);\n}\n\n.top-tabsView_menu-short {\n\twidth: auto;\n}\n\n.top-tabsView_menu > .top-tabsView_menuOpener {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n}\n\n.top-tabsView_menu > .top-tabsView_menuOpener:hover {\n\tbackground: var(--color-layer-1);\n}\n\n.top-tabsView_menuOpenerIcon { display: flex; }\n\n.top-tabsView_menuOpenerActiveItem {\n\t--top-forms-padding: 0px;\n\n\tbox-sizing: border-box;\n\tpadding: var(--top-padding-2);\n\tmax-width: calc(100% - var(--top-forms-base-height));\n\twhite-space: nowrap;\n\tflex-grow: 1;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--top-padding-2);\n}\n\n.top-tabsView_menuList,\n.top-tabsView_menuFooter {\n\tpadding: var(--top-padding-2);\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--top-gap-2);\n}\n\n.top-tabsView_menuList {\n\toverflow-y: auto;\n}\n\n.top-tabsView_menu-short .top-tabsView_menuFooter > .top-tabsView_menuItem {\n\t--top-icon-width: 100%;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { defineModel, onUnmounted, ref, watch } from 'vue';\nimport Core from '@/core/core/core';\nimport { delHash } from '@/core/utils/route';\nimport type { Props } from './types';\nimport { defineTabsStore } from './store';\nimport TabsViewMenu from './menu.vue';\nimport TopLoadbar from '@/components/forms/loadbar/loadbar.vue';\nimport { checkComponentIsLoading } from './utils';\n\nconst props = withDefaults(defineProps<Props>(), {\n\tshowMenuInPopup: undefined,\n\tisShortable: false,\n});\n\nconst model = defineModel<string>();\n\nconst store = defineTabsStore(props, model);\n\nconst uid = Math.random();\n\nif (props.pageMod) Core.state.documentClassModificators.set(uid, 'top-hasTabsViewPageMod');\n\nonUnmounted(() => {\n\tif (props.pageMod) Core.state.documentClassModificators.delete(uid);\n\n\tif (store.$id) delHash(store.$id, store.activeItemName, true);\n});\n\nconst componentRef = ref();\nconst isLoading = ref(false);\n\nwatch([componentRef, () => store.component], () => {\n\tisLoading.value = checkComponentIsLoading(store.component);\n}, { immediate: true });\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabsView': true,\n\t\t\t'top-tabsView-pageMod': props.pageMod,\n\t\t\t'top-tabsView-inPopup': store.showMenuInPopup,\n\t\t}\"\n\t>\n\t\t<TabsViewMenu\n\t\t\t:isShortable=\"isShortable\"\n\t\t\tv-model:isLoading=\"isLoading\"\n\t\t>\n\t\t\t<!-- @slot Меню, ожидает передачу компонентов TabsViewMenuItem и TabsViewMenuTitle -->\n\t\t\t<slot name=\"menu\"></slot>\n\t\t</TabsViewMenu>\n\n\t\t<div\n\t\t\t:class=\"{\n\t\t\t\t'top-tabsView_contents': true,\n\t\t\t\t'top-tabsView_contents-isLoading': isLoading,\n\t\t\t\t'top-tabsView_contents-noScrollable': !store.scrollable,\n\t\t\t}\"\n\t\t>\n\t\t\t<TopLoadbar v-if=\"isLoading\"/>\n\n\t\t\t<keep-alive>\n\t\t\t\t<component\n\t\t\t\t\tref=\"componentRef\"\n\t\t\t\t\t:is=\"store.component\"\n\t\t\t\t/>\n\t\t\t</keep-alive>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n:root {\n\t--top-tabsView-top: 0px;\n\t--top-tabsView-menu-width: 220px;\n\t--top-tabsView-contents-offset-top: 0px;\n}\n\n.top-tabsView {\n\tbackground: var(--color-layout-middle);\n\twidth: 100%;\n\theight: 100%;\n\tdisplay: flex;\n\tflex-direction: row;\n}\n\n.top-tabsView_contents {\n\tborder-radius: var(--top-radius-4);\n\tbackground: var(--color-layout-front-1);\n\tpadding: var(--top-padding-4);\n\tflex-grow: 1;\n\toverflow: auto;\n\tposition: relative;\n}\n\n.top-tabsView_contents-isLoading {\n\tpointer-events: none;\n}\n\n.top-tabsView_contents-noScrollable {\n\twidth: calc(100% - var(--top-tabsView-menu-width));\n\tpadding: 0;\n\toverflow: visible;\n}\n\n/ top-tabsView-inPopup */\n.top-tabsView-inPopup {\n\tbackground: var(--color-layout-front-1);\n\tflex-direction: column;\n}\n\n.top-tabsView-inPopup > .top-tabsView_contents {\n\tborder-radius: 0;\n}\n\n.top-tabsView-inPopup > .top-tabsView_contents-noScrollable {\n\twidth: auto;\n}\n</style>\n","<script setup lang=\"ts\">\n\n</script>\n\n<template>\n\t<div class=\"top-tabsView_menuDelimeter\"></div>\n</template>\n\n<style>\n.top-tabsView_menuDelimeter {\n\tpadding: var(--top-padding-1) 0;\n\tdisplay: flex;\n}\n\n.top-tabsView_menuDelimeter:before {\n\tcontent: \"\";\n\theight: 2px;\n\tbackground: var(--color-line-2);\n\tflex-grow: 1;\n}\n\n.top-tabsView_menuDelimeter:first-child,\n.top-tabsView_menuDelimeter + .top-tabsView_menuDelimeter {\n\tdisplay: none;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { useTabsStore } from './store';\nimport type { PropsMenuTitle } from './types';\nimport TabsViewMenuDelimeter from './menuDelimeter.vue';\nimport { TopPopupListItem } from '../../popup/popup';\n\ndefineProps<PropsMenuTitle>();\n\nconst store = useTabsStore();\n</script>\n\n<template>\n\t<TopPopupListItem\n\t\tv-if=\"store.showMenuInPopup\"\n\t\ttype=\"title\"\n\t>\n\t\t<slot></slot>\n\t</TopPopupListItem>\n\n\t<TabsViewMenuDelimeter v-else-if=\"store.isShort\"/>\n\n\t<div\n\t\tv-else\n\t\t:class=\"{\n\t\t\t'top-tabsView_menuTitle': true,\n\t\t\t'top-tabsView_menuTitle-subtitle': isSubtitle,\n\t\t}\"\n\t>\n\t\t<slot></slot>\n\t</div>\n</template>\n\n<style>\n.top-tabsView_menuTitle {\n\tpadding: var(--top-padding-4) var(--top-padding-2) var(--top-padding-1);\n\tfont-weight: 600;\n\tcolor: var(--color-text-1);\n}\n\n.top-tabsView_menuTitle-subtitle {\n\tpadding-top: var(--top-padding-1);\n\tfont-size: 12px;\n\tfont-weight: 400;\n\tcolor: var(--color-text-2);\n}\n</style>\n","import type { ComponentCustomProps } from 'vue';\n\nimport TabsView from './tabsView/tabsView.vue';\nimport TabsViewMenuItem from './tabsView/menuItem.vue';\nimport TabsViewMenuTitle from './tabsView/menuTitle.vue';\n\nexport const TopTabsView = TabsView as typeof TabsView & ComponentCustomProps;\nexport const TopTabsViewMenuItem = TabsViewMenuItem as typeof TabsViewMenuItem & ComponentCustomProps;\nexport const TopTabsViewMenuTitle = TabsViewMenuTitle as typeof TabsViewMenuTitle & ComponentCustomProps;\n"],"names":["genStorageKey","stateName","stateKey","StoreLocalStorage","store","localStorageValue","localStorageKey","popstateCallbacks","e","defineTabsStore","props","model","store$1","injectionKey","showMenuInPopup","vue","forms","isShort","component","scrollable","pageMod","popstateCallback","_e","useTabsStore","href","tagName","popup_popup","onClick","_ctx","name","checkComponentIsLoading","preResolveComponent","condition","slots","menuItemByName","setMenuItemByNameFromItems","menuItems","subComponent","_sfc_main$4","_a","_b","_d","_c","activeMenuItem","numberChanged","countChanged","setMenuItemByName","activeItemName","isLoading","utils_route","elRef","resizeObserver","_hoisted_1$1","_hoisted_4","_cache","$event","uid","componentRef","isShortable","_hoisted_1","TopTabsView","_sfc_main$2","TopTabsViewMenuItem","TopTabsViewMenuTitle","_sfc_main"],"mappings":"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"}

package/tabsView/tabsView.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { Core as U } from "../core/app.js";
 import { watch as k, computed as I, ref as f, defineComponent as M, createBlock as m, openBlock as l, resolveDynamicComponent as O, normalizeClass as w, unref as i, withCtx as b, renderSlot as v, createElementBlock as d, createCommentVNode as y, mergeModels as z, useModel as D, useSlots as G, onMounted as Q, onUnmounted as H, createElementVNode as S, toDisplayString as R, Fragment as X, createTextVNode as Y, markRaw as Z, createVNode as x, KeepAlive as ee } from "vue";
-import { C as $, v as te, t as oe } from "../.chunks/forms-DOGPN_TR.es.js";
+import { C as $, v as te, t as oe } from "../.chunks/forms-t2AEUjqg.es.js";
 import { getHash as K, genHash as ae, setHash as se, delHash as ne } from "../utils/route.js";
 import { u as ie, d as re } from "../.chunks/store-CX_6ZXhO.es.js";
 import { TopPopupListItem as A, TopPopup as le } from "../popup/popup.js";

package/tabsView/tabsView.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tabsView.js","sources":["../../src/core/utils/store/localStorage.ts","../../src/components/tabsView/tabsView/store.ts","../../src/components/tabsView/tabsView/menuItem.vue","../../src/components/tabsView/tabsView/utils.ts","../../src/components/tabsView/tabsView/menu.vue","../../src/components/tabsView/tabsView/tabsView.vue","../../src/components/tabsView/tabsView/menuDelimeter.vue","../../src/components/tabsView/tabsView/menuTitle.vue","../../src/components/tabsView/tabsView.ts"],"sourcesContent":["import { watch } from 'vue';\nimport type { Store } from './store';\n\n/*\n Сгенерировать имя для сохранения данных в localStorage\n * @param stateName - имя свойства состояния\n * @param stateKey - ключ состояния, разные компоненты могут использовать одинаковый ключ\n /\nconst genStorageKey = <T extends Store>(stateName: keyof T, stateKey: string): string => {\n\tconst stateNameString = String(stateName);\n\n\treturn `top:${stateNameString}:${stateKey}`;\n};\n\n/\n Загрузить состояние\n * @param stateName - имя свойства состояния\n * @param store\n /\nconst loadLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\n\t// если Store.key не знадан, значит сохранение состояния в компоненте отключено\n\tif (!store.$id) return;\n\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\n\n\ttry {\n\t\tconst localStorageValue: typeof store[keyof typeof store] = JSON.parse(localStorage.getItem(localStorageKey) as string);\n\n\t\tif (typeof localStorageValue === typeof store[stateName]) {\n\t\t\tstore[stateName] = localStorageValue;\n\t\t}\n\t} catch (e) {\n\t\tconsole.warn(new Error(`В localStorage[${localStorageKey}] не корректный json`));\n\t}\n};\n\n/\n Добавить автосохранение состояние при его изменении\n * @param stateName - имя свойства состояния\n * @param store\n /\nconst addSaverLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\n\t// если store.$id не знадан, значит сохранение состояния в компоненте отключено\n\tif (!store.$id) return;\n\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\n\n\twatch(() => store[stateName], () => {\n\t\tlocalStorage.setItem(localStorageKey, JSON.stringify(store[stateName]));\n\t}, { immediate: true });\n};\n\nexport default {\n\tloadLocalStorge,\n\taddSaverLocalStorge,\n};","import type { InjectionKey, ModelRef, UnwrapNestedRefs } from 'vue';\nimport { computed, ref } from 'vue';\nimport Core from '@/core/core/core';\nimport { defineStore, useStore, type Store as DefineStore } from '@/core/utils/store';\nimport StoreLocalStorage from '@/core/utils/store/localStorage';\nimport type { Props, Store } from './types';\nimport { getHash } from '@/core/utils/route';\n\nconst popstateCallbacks = new Set<(e: PopStateEvent) => void>();\n\naddEventListener('popstate', (e) => {\n\tpopstateCallbacks.forEach(popstateCallback => popstateCallback(e));\n});\n\nexport const injectionKey = Symbol() as InjectionKey<Store>;\n\n/\n Инициировать Store компонента\n /\nexport const defineTabsStore = (props: Props, model: ModelRef<string \| undefined>): UnwrapNestedRefs<Store> & DefineStore => {\n\tconst store = defineStore(injectionKey, () => {\n\t\tconst showMenuInPopup = computed(() => props.showMenuInPopup ?? Core.state.isMobile);\n\t\tconst pageMod = computed(() => props.pageMod);\n\t\tconst isShort = ref(false);\n\n\t\tconst component = ref(undefined);\n\t\tconst scrollable = ref(true);\n\n\t\treturn {\n\t\t\tshowMenuInPopup,\n\t\t\tpageMod,\n\t\t\tisShort,\n\t\t\tactiveItemName: model,\n\t\t\tcomponent,\n\t\t\tscrollable,\n\t\t};\n\t}, props.idState);\n\n\tif (props.isShortable) {\n\t\tconst stateName = 'isShort';\n\n\t\tStoreLocalStorage.loadLocalStorge(stateName, store);\n\t\tStoreLocalStorage.addSaverLocalStorge(stateName, store);\n\t}\n\n\tif (store.$id) {\n\t\tconst popstateCallback = (_e: PopStateEvent) => {\n\t\t\tmodel.value = getHash(store.$id!);\n\t\t};\n\n\t\tpopstateCallbacks.add(popstateCallback);\n\t}\n\n\treturn store;\n};\n\n/\n Получить Store компонента\n /\nexport const useTabsStore = () => useStore(injectionKey);\n","<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { genHash } from '@/core/utils/route';\nimport { TopPopupListItem } from '@/components/popup/popup';\nimport { useTabsStore } from './store';\nimport type { PropsMenuItem } from './types';\n\nconst props = withDefaults(defineProps<PropsMenuItem>(), {\n\tscrollable: true,\n\tcomponent: undefined,\n});\n\nconst store = useTabsStore();\n\nconst href = computed(() => {\n\t// это внутренняя хеш навигация, ссылка на вкладку\n\tif (props.name && store.$id) {\n\t\treturn genHash(store.$id, props.name);\n\t}\n\n\treturn props.href;\n});\n\nconst tagName = computed(() => {\n\tif (store.showMenuInPopup) {\n\t\treturn TopPopupListItem;\n\t}\n\n\treturn href ? 'a' : 'button';\n});\n\n/\n Клик по элементу меню\n /\nconst onClick = (e: MouseEvent) => {\n\t// это внутренняя хеш навигация, ссылка на вкладку\n\tif (!props.href && href.value) {\n\t\te.preventDefault();\n\t}\n\n\tif (props.name) {\n\t\tstore.activeItemName = props.name;\n\t}\n};\n</script>\n\n<template>\n\t<component\n\t\t:is=\"tagName\"\n\t\ttarget=\"_self\"\n\t\t:class=\"{\n\t\t\t['top-tabsView_menuItem']: !store.showMenuInPopup,\n\t\t\t['top-active']: name && store.activeItemName === name,\n\t\t\t['top-disabled']: disabled,\n\t\t\t['top-spa-disabled']: true,\n\t\t}\"\n\t\t:href=\"href\"\n\t\t:data-top-icon=\"icon \|\| undefined\"\n\t\t:disabled=\"disabled \|\| undefined\"\n\t\t@click=\"onClick\"\n\t>\n\t\t<slot name=\"default\" v-if=\"store.showMenuInPopup\"></slot>\n\n\t\t<span\n\t\t\tv-else-if=\"$slots.default && !store.isShort\"\n\t\t\tclass=\"top-ellipsis\"\n\t\t>\n\t\t\t<slot name=\"default\"></slot>\n\t\t</span>\n\t</component>\n</template>\n\n<style>\n.top-tabsView_menuItem {\n\t--top-icon-color: var(--color-text-2);\n\t--top-icon-width: calc(var(--top-icon-size));\n\n\tcursor: pointer;\n\tbox-sizing: border-box;\n\n\tborder: none;\n\tborder-radius: var(--top-radius-2);\n\tpadding: var(--top-padding-2);\n\tbackground: transparent;\n\theight: 40px;\n\n\tcolor: var(--color-text-1);\n\ttext-decoration: none;\n\twhite-space: nowrap;\n\n\tdisplay: flex;\n\tgap: var(--top-gap-2);\n\talign-items: center;\n\tjustify-content: flex-start;\n\ttransition: background var(--transition);\n}\n\n.top-tabsView_menuItem:hover {\n\t--top-icon-color: var(--color-text-1);\n\n\tbackground: var(--color-bg-shading-1);\n\ttext-decoration: none;\n}\n\n.top-tabsView_menuItem.top-active {\n\t--top-icon-color: inherit;\n\n\tbackground: var(--color-layout-front-1);\n\tcolor: inherit;\n}\n\n.top-tabsView_menuItem:disabled:not(option):not(optgroup):not(.top-forms-option),\n.top-tabsView_menuItem:disabled ~ .top-formsCaption,\n.top-tabsView_menuItem.top-disabled[data-top-icon]:before,\n.top-tabsView_menuItem.top-disabled[data-top-icon2]:after {\n\topacity: unset;\n\tfilter: unset;\n}\n\n.top-tabsView_menuItem.top-disabled {\n\t--top-icon-color: var(--color-text-4);\n\n\tcolor: var(--color-text-4);\n}\n</style>\n","// TODO: Эту функцию можно вынести в глобальный utils\n\nimport { sleepWhile } from '@/core/utils/system';\n\n/\n Проверка нахождения компонента в состояние загрузки\n * @param component\n /\nexport const checkComponentIsLoading = (component: any) => {\n\treturn component?.name === 'AsyncComponentWrapper' && !component?.__asyncResolved;\n};\n\n/\n Презагрузить компонент\n \n Некоторое время ожидает загрузку компонента, прежде чем завершит работу\n /\nexport const preResolveComponent = async (component: any, condition: Function) => {\n\tif (component?.name !== 'AsyncComponentWrapper') return;\n\tif (component?.__asyncResolved) return;\n\n\tcomponent.__asyncLoader();\n\n\tawait sleepWhile(() => {\n\t\treturn condition() && checkComponentIsLoading(component);\n\t}, 200);\n};\n","<script setup lang=\"ts\">\nimport type { Ref, VNode } from 'vue';\nimport { markRaw, onMounted, onUnmounted, ref, useSlots, watch } from 'vue';\nimport { TopPopup } from '../../popup/popup';\nimport { getHash, setHash } from '@/core/utils/route';\n\nimport type { MenuItem, PropsMenu, PropsMenuItem } from './types';\nimport { useTabsStore } from './store';\nimport TabsViewMenuItem from './menuItem.vue';\nimport { preResolveComponent } from './utils';\n\ndefineProps<PropsMenu>();\n\nconst isLoading = defineModel('isLoading');\n\nconst store = useTabsStore();\n\nconst slots = useSlots();\n\n// словарь используется для оптимизации получения нужного menuItem\nconst menuItemByName: Map<PropsMenuItem['name'], MenuItem> = new Map();\n\n// заполнить словарь с menuItem, по элементам в slot default\nconst setMenuItemByName = () => {\n\tif (!slots.default) return;\n\n\tconst component: any = slots.default({}).find(item => item.key === '_menu');\n\tif (!component) return;\n\n\tsetMenuItemByNameFromItems(component.children);\n};\n\n// заполнить словарь с menuItem, по элементам\nconst setMenuItemByNameFromItems = (menuItems: VNode[]) => {\n\tmenuItems.forEach((subComponent: any) => {\n\t\t// это не компонент элемента меню\n\t\tif (subComponent.type.__name && subComponent.type.__name !== TabsViewMenuItem.__name) return;\n\n\t\t// это не компонент, например template\n\t\tif (!subComponent.type.__name && typeof subComponent.children === 'object') {\n\t\t\tsetMenuItemByNameFromItems(subComponent.children);\n\n\t\t\treturn;\n\t\t}\n\n\t\tif (!subComponent.props?.name \|\| subComponent.props?.disabled) return;\n\n\t\tconst menuItem: MenuItem = {\n\t\t\ttitle: (subComponent.children.default?.()[0].children as string).trim(),\n\t\t\ticon: subComponent.props.icon,\n\t\t\tcomponent: subComponent.props.component ? markRaw(subComponent.props.component) : TabsViewMenuItem.props.component.default,\n\t\t\tscrollable: subComponent.props.scrollable ?? TabsViewMenuItem.props.scrollable.default,\n\t\t};\n\n\t\tmenuItemByName.set(subComponent.props.name, menuItem);\n\t});\n};\n\n/\n activeMenuItem нужен:\n * - для вывода текста активной вкладки в меню с popup\n * - для вывода компонента активной вкладки (store.component)\n * - для установки store.scrollable\n /\nconst activeMenuItem: Ref<MenuItem \| null> = ref(null);\n\n/\n Кол-во изменений активной вкладки\n /\nlet countChanged = 0;\n\n/\n Смена активной вкладки\n \n TODO: смена slot, например смена языка, требует повторного выполнения setMenuItemByName()\n /\nwatch(\n\t() => store.activeItemName,\n\tasync () => {\n\t\tconst numberChanged = ++countChanged; // порядковый номер текущего изменения\n\n\t\tif (menuItemByName.size === 0) {\n\t\t\tsetMenuItemByName();\n\t\t}\n\n\t\tif (menuItemByName.size === 0) {\n\t\t\tstore.activeItemName = '';\n\n\t\t\treturn;\n\t\t}\n\n\t\tactiveMenuItem.value = menuItemByName.get(store.activeItemName) ?? null;\n\n\t\t// элемент не найден, установить из хеша страницы\n\t\tif (!activeMenuItem.value && store.$id) {\n\t\t\tconst activeItemName = getHash(store.$id);\n\n\t\t\tactiveMenuItem.value = menuItemByName.get(activeItemName) ?? null;\n\n\t\t\tif (activeMenuItem.value) {\n\t\t\t\tstore.activeItemName = activeItemName;\n\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\n\t\t// элемент не найден, установить первый доступный\n\t\tif (!activeMenuItem.value) {\n\t\t\tstore.activeItemName = menuItemByName.keys().next().value!;\n\n\t\t\treturn;\n\t\t}\n\n\t\t// запрошена смена на уже активный элемент\n\t\tif (activeMenuItem.value.component === store.component) {\n\t\t\tisLoading.value = false;\n\n\t\t\treturn;\n\t\t}\n\n\t\tif (store.$id) setHash(store.$id, store.activeItemName, false);\n\n\t\t// флаг загрузки будет сброшен при инициализации компонента\n\t\tisLoading.value = true;\n\n\t\t/\n\t\t Презагрузить компонент\n\t\t \n\t\t Нужно для того, чтобы минимизировать скачки интерфейса при ожидании загрузки асинхронного компонента\n\t\t /\n\t\tawait preResolveComponent(activeMenuItem.value.component, () => numberChanged === countChanged);\n\n\t\t// влкадка была сменена еще раз во время sleepWhile\n\t\tif (numberChanged !== countChanged) {\n\t\t\treturn;\n\t\t}\n\n\t\tstore.scrollable = activeMenuItem.value.scrollable;\n\t\tstore.component = activeMenuItem.value.component;\n\n\t\tif (activeMenuItem.value && !store.component) {\n\t\t\tconsole.warn(`Компонент вкладки ${store.activeItemName} не найден. Добавьте props.component для пункта меню ${store.activeItemName}.`);\n\t\t}\n\t},\n\t{ immediate: true },\n);\n\nconst elRef = ref();\nlet resizeObserver: ResizeObserver;\n\nonMounted(() => {\n\tresizeObserver = new ResizeObserver(() => {\n\t\telRef.value.parentElement.style.setProperty('--top-tabsView-contents-offset-top', elRef.value.offsetHeight + 'px');\n\t});\n\n\tresizeObserver.observe(elRef.value);\n});\n\nonUnmounted(() => {\n\tresizeObserver.disconnect();\n});\n</script>\n\n<template>\n\t<div\n\t\tref=\"elRef\"\n\t\t:class=\"{\n\t\t\t'top-tabsView_menu': true,\n\t\t\t'top-tabsView_menu-inPopup_0': !store.showMenuInPopup,\n\t\t\t'top-tabsView_menu-inPopup_1': store.showMenuInPopup,\n\t\t\t'top-tabsView_menu-short': store.isShort && !store.showMenuInPopup,\n\t\t}\"\n\t>\n\t\t<!-- Спрятать меню под кнопку в popup -->\n\t\t<TopPopup v-if=\"store.showMenuInPopup\">\n\t\t\t<template #opener>\n\t\t\t\t<div class=\"top-tabsView_menuOpener\">\n\t\t\t\t\t<div\n\t\t\t\t\t\tv-if=\"activeMenuItem\"\n\t\t\t\t\t\tclass=\"top-tabsView_menuOpenerActiveItem\"\n\t\t\t\t\t\t:data-top-icon=\"activeMenuItem.icon\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"top-ellipsis\">\n\t\t\t\t\t\t\t{{ activeMenuItem.title }}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<div class=\"top-tabsView_menuOpenerIcon\" data-top-icon=\"\"></div>\n\t\t\t\t</div>\n\t\t\t</template>\n\n\t\t\t<template #contentList>\n\t\t\t\t<slot></slot>\n\t\t\t</template>\n\t\t</TopPopup>\n\n\t\t<!-- Отобразить меню на странице -->\n\t\t<template v-else>\n\t\t\t<div class=\"top-tabsView_menuList\">\n\t\t\t\t<slot></slot>\n\t\t\t</div>\n\n\t\t\t<div\n\t\t\t\tv-if=\"isShortable\"\n\t\t\t\tclass=\"top-tabsView_menuFooter\"\n\t\t\t>\n\t\t\t\t<TabsViewMenuItem\n\t\t\t\t\tv-if=\"isShortable\"\n\t\t\t\t\t:icon=\"store.isShort ? '' : ''\"\n\t\t\t\t\t@click=\"store.isShort = !store.isShort\"\n\t\t\t\t>\n\t\t\t\t\t{{ store.isShort ? '' : 'Свернуть' }} <!--TODO: translate-->\n\t\t\t\t</TabsViewMenuItem>\n\t\t\t</div>\n\t\t</template>\n\t</div>\n</template>\n\n<style>\n/ режим отображение табов в основной области документа /\n.top-tabsView-pageMod .top-tabsView_menu {\n\tbox-sizing: border-box;\n\tposition: sticky;\n\ttop: var(--top-tabsView-top);\n\tz-index: 10;\n}\n\n/ режим отображение табов в основной области документа без popup /\n.top-tabsView-pageMod .top-tabsView_menu-inPopup_0 {\n\theight: calc(var(--100vh) - var(--top-tabsView-top));\n}\n\n/ стантартный режим /\n.top-tabsView_menu-inPopup_0 {\n\tbox-sizing: border-box;\n\twidth: var(--top-tabsView-menu-width);\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\tflex-shrink: 0;\n}\n\n/ режим вывода в popup /\n.top-tabsView_menu-inPopup_1 {\n\tborder-bottom: 1px solid var(--color-line-2-opacity);\n}\n\n.top-tabsView_menu-short {\n\twidth: auto;\n}\n\n.top-tabsView_menu > .top-tabsView_menuOpener {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n}\n\n.top-tabsView_menu > .top-tabsView_menuOpener:hover {\n\tbackground: var(--color-layer-1);\n}\n\n.top-tabsView_menuOpenerIcon { display: flex; }\n\n.top-tabsView_menuOpenerActiveItem {\n\t--top-forms-padding: 0px;\n\n\tbox-sizing: border-box;\n\tpadding: var(--top-padding-2);\n\tmax-width: calc(100% - var(--top-forms-base-height));\n\twhite-space: nowrap;\n\tflex-grow: 1;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--top-padding-2);\n}\n\n.top-tabsView_menuList,\n.top-tabsView_menuFooter {\n\tpadding: var(--top-padding-2);\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--top-gap-2);\n}\n\n.top-tabsView_menuList {\n\toverflow-y: auto;\n}\n\n.top-tabsView_menu-short .top-tabsView_menuFooter > .top-tabsView_menuItem {\n\t--top-icon-width: 100%;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { defineModel, onUnmounted, ref, watch } from 'vue';\nimport Core from '@/core/core/core';\nimport { delHash } from '@/core/utils/route';\nimport type { Props } from './types';\nimport { defineTabsStore } from './store';\nimport TabsViewMenu from './menu.vue';\nimport TopLoadbar from '@/components/forms/loadbar/loadbar.vue';\nimport { checkComponentIsLoading } from './utils';\n\nconst props = withDefaults(defineProps<Props>(), {\n\tshowMenuInPopup: undefined,\n\tisShortable: false,\n});\n\nconst model = defineModel<string>();\n\nconst store = defineTabsStore(props, model);\n\nconst uid = Math.random();\n\nif (props.pageMod) Core.state.documentClassModificators.set(uid, 'top-hasTabsViewPageMod');\n\nonUnmounted(() => {\n\tif (props.pageMod) Core.state.documentClassModificators.delete(uid);\n\n\tif (store.$id) delHash(store.$id, store.activeItemName, true);\n});\n\nconst componentRef = ref();\nconst isLoading = ref(false);\n\nwatch([componentRef, () => store.component], () => {\n\tisLoading.value = checkComponentIsLoading(store.component);\n}, { immediate: true });\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabsView': true,\n\t\t\t'top-tabsView-pageMod': props.pageMod,\n\t\t\t'top-tabsView-inPopup': store.showMenuInPopup,\n\t\t}\"\n\t>\n\t\t<TabsViewMenu\n\t\t\t:isShortable=\"isShortable\"\n\t\t\tv-model:isLoading=\"isLoading\"\n\t\t>\n\t\t\t<!-- @slot Меню, ожидает передачу компонентов TabsViewMenuItem и TabsViewMenuTitle -->\n\t\t\t<slot name=\"menu\"></slot>\n\t\t</TabsViewMenu>\n\n\t\t<div\n\t\t\t:class=\"{\n\t\t\t\t'top-tabsView_contents': true,\n\t\t\t\t'top-tabsView_contents-isLoading': isLoading,\n\t\t\t\t'top-tabsView_contents-noScrollable': !store.scrollable,\n\t\t\t}\"\n\t\t>\n\t\t\t<TopLoadbar v-if=\"isLoading\"/>\n\n\t\t\t<keep-alive>\n\t\t\t\t<component\n\t\t\t\t\tref=\"componentRef\"\n\t\t\t\t\t:is=\"store.component\"\n\t\t\t\t/>\n\t\t\t</keep-alive>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n:root {\n\t--top-tabsView-top: 0px;\n\t--top-tabsView-menu-width: 220px;\n\t--top-tabsView-contents-offset-top: 0px;\n}\n\n.top-tabsView {\n\tbackground: var(--color-layout-middle);\n\twidth: 100%;\n\theight: 100%;\n\tdisplay: flex;\n\tflex-direction: row;\n}\n\n.top-tabsView_contents {\n\tborder-radius: var(--top-radius-4);\n\tbackground: var(--color-layout-front-1);\n\tpadding: var(--top-padding-4);\n\tflex-grow: 1;\n\toverflow: auto;\n\tposition: relative;\n}\n\n.top-tabsView_contents-isLoading {\n\tpointer-events: none;\n}\n\n.top-tabsView_contents-noScrollable {\n\twidth: calc(100% - var(--top-tabsView-menu-width));\n\tpadding: 0;\n\toverflow: visible;\n}\n\n/ top-tabsView-inPopup */\n.top-tabsView-inPopup {\n\tbackground: var(--color-layout-front-1);\n\tflex-direction: column;\n}\n\n.top-tabsView-inPopup > .top-tabsView_contents {\n\tborder-radius: 0;\n}\n\n.top-tabsView-inPopup > .top-tabsView_contents-noScrollable {\n\twidth: auto;\n}\n</style>\n","<script setup lang=\"ts\">\n\n</script>\n\n<template>\n\t<div class=\"top-tabsView_menuDelimeter\"></div>\n</template>\n\n<style>\n.top-tabsView_menuDelimeter {\n\tpadding: var(--top-padding-1) 0;\n\tdisplay: flex;\n}\n\n.top-tabsView_menuDelimeter:before {\n\tcontent: \"\";\n\theight: 2px;\n\tbackground: var(--color-line-2);\n\tflex-grow: 1;\n}\n\n.top-tabsView_menuDelimeter:first-child,\n.top-tabsView_menuDelimeter + .top-tabsView_menuDelimeter {\n\tdisplay: none;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { useTabsStore } from './store';\nimport type { PropsMenuTitle } from './types';\nimport TabsViewMenuDelimeter from './menuDelimeter.vue';\nimport { TopPopupListItem } from '../../popup/popup';\n\ndefineProps<PropsMenuTitle>();\n\nconst store = useTabsStore();\n</script>\n\n<template>\n\t<TopPopupListItem\n\t\tv-if=\"store.showMenuInPopup\"\n\t\ttype=\"title\"\n\t>\n\t\t<slot></slot>\n\t</TopPopupListItem>\n\n\t<TabsViewMenuDelimeter v-else-if=\"store.isShort\"/>\n\n\t<div\n\t\tv-else\n\t\t:class=\"{\n\t\t\t'top-tabsView_menuTitle': true,\n\t\t\t'top-tabsView_menuTitle-subtitle': isSubtitle,\n\t\t}\"\n\t>\n\t\t<slot></slot>\n\t</div>\n</template>\n\n<style>\n.top-tabsView_menuTitle {\n\tpadding: var(--top-padding-4) var(--top-padding-2) var(--top-padding-1);\n\tfont-weight: 600;\n\tcolor: var(--color-text-1);\n}\n\n.top-tabsView_menuTitle-subtitle {\n\tpadding-top: var(--top-padding-1);\n\tfont-size: 12px;\n\tfont-weight: 400;\n\tcolor: var(--color-text-2);\n}\n</style>\n","import type { ComponentCustomProps } from 'vue';\n\nimport TabsView from './tabsView/tabsView.vue';\nimport TabsViewMenuItem from './tabsView/menuItem.vue';\nimport TabsViewMenuTitle from './tabsView/menuTitle.vue';\n\nexport const TopTabsView = TabsView as typeof TabsView & ComponentCustomProps;\nexport const TopTabsViewMenuItem = TabsViewMenuItem as typeof TabsViewMenuItem & ComponentCustomProps;\nexport const TopTabsViewMenuTitle = TabsViewMenuTitle as typeof TabsViewMenuTitle & ComponentCustomProps;\n"],"names":["genStorageKey","stateName","stateKey","loadLocalStorge","store","localStorageKey","localStorageValue","addSaverLocalStorge","watch","StoreLocalStorage","popstateCallbacks","e","popstateCallback","injectionKey","defineTabsStore","props","model","defineStore","showMenuInPopup","computed","Core","pageMod","isShort","ref","component","scrollable","_e","getHash","useTabsStore","useStore","__props","href","genHash","tagName","TopPopupListItem","onClick","checkComponentIsLoading","preResolveComponent","condition","sleepWhile","isLoading","useModel","slots","useSlots","menuItemByName","setMenuItemByName","item","setMenuItemByNameFromItems","menuItems","subComponent","_sfc_main$4","_a","_b","menuItem","_d","_c","markRaw","activeMenuItem","countChanged","numberChanged","activeItemName","setHash","elRef","resizeObserver","onMounted","onUnmounted","uid","delHash","componentRef","_hoisted_1","openBlock","createElementBlock","TopTabsView","_sfc_main$2","TopTabsViewMenuItem","TopTabsViewMenuTitle","_sfc_main"],"mappings":"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"}
1	+ {"version":3,"file":"tabsView.js","sources":["../../src/core/utils/store/localStorage.ts","../../src/components/tabsView/tabsView/store.ts","../../src/components/tabsView/tabsView/menuItem.vue","../../src/components/tabsView/tabsView/utils.ts","../../src/components/tabsView/tabsView/menu.vue","../../src/components/tabsView/tabsView/tabsView.vue","../../src/components/tabsView/tabsView/menuDelimeter.vue","../../src/components/tabsView/tabsView/menuTitle.vue","../../src/components/tabsView/tabsView.ts"],"sourcesContent":["import { watch } from 'vue';\nimport type { Store } from './store';\n\n/*\n Сгенерировать имя для сохранения данных в localStorage\n * @param stateName - имя свойства состояния\n * @param stateKey - ключ состояния, разные компоненты могут использовать одинаковый ключ\n /\nconst genStorageKey = <T extends Store>(stateName: keyof T, stateKey: string): string => {\n\tconst stateNameString = String(stateName);\n\n\treturn `top:${stateNameString}:${stateKey}`;\n};\n\n/\n Загрузить состояние\n * @param stateName - имя свойства состояния\n * @param store\n /\nconst loadLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\n\t// если Store.key не знадан, значит сохранение состояния в компоненте отключено\n\tif (!store.$id) return;\n\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\n\n\ttry {\n\t\tconst localStorageValue: typeof store[keyof typeof store] = JSON.parse(localStorage.getItem(localStorageKey) as string);\n\n\t\tif (typeof localStorageValue === typeof store[stateName]) {\n\t\t\tstore[stateName] = localStorageValue;\n\t\t}\n\t} catch (e) {\n\t\tconsole.warn(new Error(`В localStorage[${localStorageKey}] не корректный json`));\n\t}\n};\n\n/\n Добавить автосохранение состояние при его изменении\n * @param stateName - имя свойства состояния\n * @param store\n /\nconst addSaverLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\n\t// если store.$id не знадан, значит сохранение состояния в компоненте отключено\n\tif (!store.$id) return;\n\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\n\n\twatch(() => store[stateName], () => {\n\t\tlocalStorage.setItem(localStorageKey, JSON.stringify(store[stateName]));\n\t}, { immediate: true });\n};\n\nexport default {\n\tloadLocalStorge,\n\taddSaverLocalStorge,\n};","import type { InjectionKey, ModelRef, UnwrapNestedRefs } from 'vue';\nimport { computed, ref } from 'vue';\nimport Core from '@/core/core/core';\nimport { defineStore, useStore, type Store as DefineStore } from '@/core/utils/store';\nimport StoreLocalStorage from '@/core/utils/store/localStorage';\nimport type { Props, Store } from './types';\nimport { getHash } from '@/core/utils/route';\n\nconst popstateCallbacks = new Set<(e: PopStateEvent) => void>();\n\naddEventListener('popstate', (e) => {\n\tpopstateCallbacks.forEach(popstateCallback => popstateCallback(e));\n});\n\nexport const injectionKey = Symbol() as InjectionKey<Store>;\n\n/\n Инициировать Store компонента\n /\nexport const defineTabsStore = (props: Props, model: ModelRef<string \| undefined>): UnwrapNestedRefs<Store> & DefineStore => {\n\tconst store = defineStore(injectionKey, () => {\n\t\tconst showMenuInPopup = computed(() => props.showMenuInPopup ?? Core.state.isMobile);\n\t\tconst pageMod = computed(() => props.pageMod);\n\t\tconst isShort = ref(false);\n\n\t\tconst component = ref(undefined);\n\t\tconst scrollable = ref(true);\n\n\t\treturn {\n\t\t\tshowMenuInPopup,\n\t\t\tpageMod,\n\t\t\tisShort,\n\t\t\tactiveItemName: model,\n\t\t\tcomponent,\n\t\t\tscrollable,\n\t\t};\n\t}, props.idState);\n\n\tif (props.isShortable) {\n\t\tconst stateName = 'isShort';\n\n\t\tStoreLocalStorage.loadLocalStorge(stateName, store);\n\t\tStoreLocalStorage.addSaverLocalStorge(stateName, store);\n\t}\n\n\tif (store.$id) {\n\t\tconst popstateCallback = (_e: PopStateEvent) => {\n\t\t\tmodel.value = getHash(store.$id!);\n\t\t};\n\n\t\tpopstateCallbacks.add(popstateCallback);\n\t}\n\n\treturn store;\n};\n\n/\n Получить Store компонента\n /\nexport const useTabsStore = () => useStore(injectionKey);\n","<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { genHash } from '@/core/utils/route';\nimport { TopPopupListItem } from '@/components/popup/popup';\nimport { useTabsStore } from './store';\nimport type { PropsMenuItem } from './types';\n\nconst props = withDefaults(defineProps<PropsMenuItem>(), {\n\tscrollable: true,\n\tcomponent: undefined,\n});\n\nconst store = useTabsStore();\n\nconst href = computed(() => {\n\t// это внутренняя хеш навигация, ссылка на вкладку\n\tif (props.name && store.$id) {\n\t\treturn genHash(store.$id, props.name);\n\t}\n\n\treturn props.href;\n});\n\nconst tagName = computed(() => {\n\tif (store.showMenuInPopup) {\n\t\treturn TopPopupListItem;\n\t}\n\n\treturn href ? 'a' : 'button';\n});\n\n/\n Клик по элементу меню\n /\nconst onClick = (e: MouseEvent) => {\n\t// это внутренняя хеш навигация, ссылка на вкладку\n\tif (!props.href && href.value) {\n\t\te.preventDefault();\n\t}\n\n\tif (props.name) {\n\t\tstore.activeItemName = props.name;\n\t}\n};\n</script>\n\n<template>\n\t<component\n\t\t:is=\"tagName\"\n\t\ttarget=\"_self\"\n\t\t:class=\"{\n\t\t\t['top-tabsView_menuItem']: !store.showMenuInPopup,\n\t\t\t['top-active']: name && store.activeItemName === name,\n\t\t\t['top-disabled']: disabled,\n\t\t\t['top-spa-disabled']: true,\n\t\t}\"\n\t\t:href=\"href\"\n\t\t:data-top-icon=\"icon \|\| undefined\"\n\t\t:disabled=\"disabled \|\| undefined\"\n\t\t@click=\"onClick\"\n\t>\n\t\t<slot name=\"default\" v-if=\"store.showMenuInPopup\"></slot>\n\n\t\t<span\n\t\t\tv-else-if=\"$slots.default && !store.isShort\"\n\t\t\tclass=\"top-ellipsis\"\n\t\t>\n\t\t\t<slot name=\"default\"></slot>\n\t\t</span>\n\t</component>\n</template>\n\n<style>\n.top-tabsView_menuItem {\n\t--top-icon-color: var(--color-text-2);\n\t--top-icon-width: calc(var(--top-icon-size));\n\n\tcursor: pointer;\n\tbox-sizing: border-box;\n\n\tborder: none;\n\tborder-radius: var(--top-radius-2);\n\tpadding: var(--top-padding-2);\n\tbackground: transparent;\n\theight: 40px;\n\n\tcolor: var(--color-text-1);\n\ttext-decoration: none;\n\twhite-space: nowrap;\n\n\tdisplay: flex;\n\tgap: var(--top-gap-2);\n\talign-items: center;\n\tjustify-content: flex-start;\n\ttransition: background var(--transition);\n}\n\n.top-tabsView_menuItem:hover {\n\t--top-icon-color: var(--color-text-1);\n\n\tbackground: var(--color-bg-shading-1);\n\ttext-decoration: none;\n}\n\n.top-tabsView_menuItem.top-active {\n\t--top-icon-color: inherit;\n\n\tbackground: var(--color-layout-front-1);\n\tcolor: inherit;\n}\n\n.top-tabsView_menuItem:disabled:not(option):not(optgroup):not(.top-forms-option),\n.top-tabsView_menuItem:disabled ~ .top-formsCaption,\n.top-tabsView_menuItem.top-disabled[data-top-icon]:before,\n.top-tabsView_menuItem.top-disabled[data-top-icon2]:after {\n\topacity: unset;\n\tfilter: unset;\n}\n\n.top-tabsView_menuItem.top-disabled {\n\t--top-icon-color: var(--color-text-4);\n\n\tcolor: var(--color-text-4);\n}\n</style>\n","// TODO: Эту функцию можно вынести в глобальный utils\n\nimport { sleepWhile } from '@/core/utils/system';\n\n/\n Проверка нахождения компонента в состояние загрузки\n * @param component\n /\nexport const checkComponentIsLoading = (component: any) => {\n\treturn component?.name === 'AsyncComponentWrapper' && !component?.__asyncResolved;\n};\n\n/\n Презагрузить компонент\n \n Некоторое время ожидает загрузку компонента, прежде чем завершит работу\n /\nexport const preResolveComponent = async (component: any, condition: Function) => {\n\tif (component?.name !== 'AsyncComponentWrapper') return;\n\tif (component?.__asyncResolved) return;\n\n\tcomponent.__asyncLoader();\n\n\tawait sleepWhile(() => {\n\t\treturn condition() && checkComponentIsLoading(component);\n\t}, 200);\n};\n","<script setup lang=\"ts\">\nimport type { Ref, VNode } from 'vue';\nimport { markRaw, onMounted, onUnmounted, ref, useSlots, watch } from 'vue';\nimport { TopPopup } from '../../popup/popup';\nimport { getHash, setHash } from '@/core/utils/route';\n\nimport type { MenuItem, PropsMenu, PropsMenuItem } from './types';\nimport { useTabsStore } from './store';\nimport TabsViewMenuItem from './menuItem.vue';\nimport { preResolveComponent } from './utils';\n\ndefineProps<PropsMenu>();\n\nconst isLoading = defineModel('isLoading');\n\nconst store = useTabsStore();\n\nconst slots = useSlots();\n\n// словарь используется для оптимизации получения нужного menuItem\nconst menuItemByName: Map<PropsMenuItem['name'], MenuItem> = new Map();\n\n// заполнить словарь с menuItem, по элементам в slot default\nconst setMenuItemByName = () => {\n\tif (!slots.default) return;\n\n\tconst component: any = slots.default({}).find(item => item.key === '_menu');\n\tif (!component) return;\n\n\tsetMenuItemByNameFromItems(component.children);\n};\n\n// заполнить словарь с menuItem, по элементам\nconst setMenuItemByNameFromItems = (menuItems: VNode[]) => {\n\tmenuItems.forEach((subComponent: any) => {\n\t\t// это не компонент элемента меню\n\t\tif (subComponent.type.__name && subComponent.type.__name !== TabsViewMenuItem.__name) return;\n\n\t\t// это не компонент, например template\n\t\tif (!subComponent.type.__name && typeof subComponent.children === 'object') {\n\t\t\tsetMenuItemByNameFromItems(subComponent.children);\n\n\t\t\treturn;\n\t\t}\n\n\t\tif (!subComponent.props?.name \|\| subComponent.props?.disabled) return;\n\n\t\tconst menuItem: MenuItem = {\n\t\t\ttitle: (subComponent.children.default?.()[0].children as string).trim(),\n\t\t\ticon: subComponent.props.icon,\n\t\t\tcomponent: subComponent.props.component ? markRaw(subComponent.props.component) : TabsViewMenuItem.props.component.default,\n\t\t\tscrollable: subComponent.props.scrollable ?? TabsViewMenuItem.props.scrollable.default,\n\t\t};\n\n\t\tmenuItemByName.set(subComponent.props.name, menuItem);\n\t});\n};\n\n/\n activeMenuItem нужен:\n * - для вывода текста активной вкладки в меню с popup\n * - для вывода компонента активной вкладки (store.component)\n * - для установки store.scrollable\n /\nconst activeMenuItem: Ref<MenuItem \| null> = ref(null);\n\n/\n Кол-во изменений активной вкладки\n /\nlet countChanged = 0;\n\n/\n Смена активной вкладки\n \n TODO: смена slot, например смена языка, требует повторного выполнения setMenuItemByName()\n /\nwatch(\n\t() => store.activeItemName,\n\tasync () => {\n\t\tconst numberChanged = ++countChanged; // порядковый номер текущего изменения\n\n\t\tif (menuItemByName.size === 0) {\n\t\t\tsetMenuItemByName();\n\t\t}\n\n\t\tif (menuItemByName.size === 0) {\n\t\t\tstore.activeItemName = '';\n\n\t\t\treturn;\n\t\t}\n\n\t\tactiveMenuItem.value = menuItemByName.get(store.activeItemName) ?? null;\n\n\t\t// элемент не найден, установить из хеша страницы\n\t\tif (!activeMenuItem.value && store.$id) {\n\t\t\tconst activeItemName = getHash(store.$id);\n\n\t\t\tactiveMenuItem.value = menuItemByName.get(activeItemName) ?? null;\n\n\t\t\tif (activeMenuItem.value) {\n\t\t\t\tstore.activeItemName = activeItemName;\n\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\n\t\t// элемент не найден, установить первый доступный\n\t\tif (!activeMenuItem.value) {\n\t\t\tstore.activeItemName = menuItemByName.keys().next().value!;\n\n\t\t\treturn;\n\t\t}\n\n\t\t// запрошена смена на уже активный элемент\n\t\tif (activeMenuItem.value.component === store.component) {\n\t\t\tisLoading.value = false;\n\n\t\t\treturn;\n\t\t}\n\n\t\tif (store.$id) setHash(store.$id, store.activeItemName, false);\n\n\t\t// флаг загрузки будет сброшен при инициализации компонента\n\t\tisLoading.value = true;\n\n\t\t/\n\t\t Презагрузить компонент\n\t\t \n\t\t Нужно для того, чтобы минимизировать скачки интерфейса при ожидании загрузки асинхронного компонента\n\t\t /\n\t\tawait preResolveComponent(activeMenuItem.value.component, () => numberChanged === countChanged);\n\n\t\t// влкадка была сменена еще раз во время sleepWhile\n\t\tif (numberChanged !== countChanged) {\n\t\t\treturn;\n\t\t}\n\n\t\tstore.scrollable = activeMenuItem.value.scrollable;\n\t\tstore.component = activeMenuItem.value.component;\n\n\t\tif (activeMenuItem.value && !store.component) {\n\t\t\tconsole.warn(`Компонент вкладки ${store.activeItemName} не найден. Добавьте props.component для пункта меню ${store.activeItemName}.`);\n\t\t}\n\t},\n\t{ immediate: true },\n);\n\nconst elRef = ref();\nlet resizeObserver: ResizeObserver;\n\nonMounted(() => {\n\tresizeObserver = new ResizeObserver(() => {\n\t\telRef.value.parentElement.style.setProperty('--top-tabsView-contents-offset-top', elRef.value.offsetHeight + 'px');\n\t});\n\n\tresizeObserver.observe(elRef.value);\n});\n\nonUnmounted(() => {\n\tresizeObserver.disconnect();\n});\n</script>\n\n<template>\n\t<div\n\t\tref=\"elRef\"\n\t\t:class=\"{\n\t\t\t'top-tabsView_menu': true,\n\t\t\t'top-tabsView_menu-inPopup_0': !store.showMenuInPopup,\n\t\t\t'top-tabsView_menu-inPopup_1': store.showMenuInPopup,\n\t\t\t'top-tabsView_menu-short': store.isShort && !store.showMenuInPopup,\n\t\t}\"\n\t>\n\t\t<!-- Спрятать меню под кнопку в popup -->\n\t\t<TopPopup v-if=\"store.showMenuInPopup\">\n\t\t\t<template #opener>\n\t\t\t\t<div class=\"top-tabsView_menuOpener\">\n\t\t\t\t\t<div\n\t\t\t\t\t\tv-if=\"activeMenuItem\"\n\t\t\t\t\t\tclass=\"top-tabsView_menuOpenerActiveItem\"\n\t\t\t\t\t\t:data-top-icon=\"activeMenuItem.icon\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"top-ellipsis\">\n\t\t\t\t\t\t\t{{ activeMenuItem.title }}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<div class=\"top-tabsView_menuOpenerIcon\" data-top-icon=\"\"></div>\n\t\t\t\t</div>\n\t\t\t</template>\n\n\t\t\t<template #contentList>\n\t\t\t\t<slot></slot>\n\t\t\t</template>\n\t\t</TopPopup>\n\n\t\t<!-- Отобразить меню на странице -->\n\t\t<template v-else>\n\t\t\t<div class=\"top-tabsView_menuList\">\n\t\t\t\t<slot></slot>\n\t\t\t</div>\n\n\t\t\t<div\n\t\t\t\tv-if=\"isShortable\"\n\t\t\t\tclass=\"top-tabsView_menuFooter\"\n\t\t\t>\n\t\t\t\t<TabsViewMenuItem\n\t\t\t\t\tv-if=\"isShortable\"\n\t\t\t\t\t:icon=\"store.isShort ? '' : ''\"\n\t\t\t\t\t@click=\"store.isShort = !store.isShort\"\n\t\t\t\t>\n\t\t\t\t\t{{ store.isShort ? '' : 'Свернуть' }} <!--TODO: translate-->\n\t\t\t\t</TabsViewMenuItem>\n\t\t\t</div>\n\t\t</template>\n\t</div>\n</template>\n\n<style>\n/ режим отображение табов в основной области документа /\n.top-tabsView-pageMod .top-tabsView_menu {\n\tbox-sizing: border-box;\n\tposition: sticky;\n\ttop: var(--top-tabsView-top);\n\tz-index: 10;\n}\n\n/ режим отображение табов в основной области документа без popup /\n.top-tabsView-pageMod .top-tabsView_menu-inPopup_0 {\n\theight: calc(var(--100vh) - var(--top-tabsView-top));\n}\n\n/ стантартный режим /\n.top-tabsView_menu-inPopup_0 {\n\tbox-sizing: border-box;\n\twidth: var(--top-tabsView-menu-width);\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\tflex-shrink: 0;\n}\n\n/ режим вывода в popup /\n.top-tabsView_menu-inPopup_1 {\n\tborder-bottom: 1px solid var(--color-line-2-opacity);\n}\n\n.top-tabsView_menu-short {\n\twidth: auto;\n}\n\n.top-tabsView_menu > .top-tabsView_menuOpener {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n}\n\n.top-tabsView_menu > .top-tabsView_menuOpener:hover {\n\tbackground: var(--color-layer-1);\n}\n\n.top-tabsView_menuOpenerIcon { display: flex; }\n\n.top-tabsView_menuOpenerActiveItem {\n\t--top-forms-padding: 0px;\n\n\tbox-sizing: border-box;\n\tpadding: var(--top-padding-2);\n\tmax-width: calc(100% - var(--top-forms-base-height));\n\twhite-space: nowrap;\n\tflex-grow: 1;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--top-padding-2);\n}\n\n.top-tabsView_menuList,\n.top-tabsView_menuFooter {\n\tpadding: var(--top-padding-2);\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--top-gap-2);\n}\n\n.top-tabsView_menuList {\n\toverflow-y: auto;\n}\n\n.top-tabsView_menu-short .top-tabsView_menuFooter > .top-tabsView_menuItem {\n\t--top-icon-width: 100%;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { defineModel, onUnmounted, ref, watch } from 'vue';\nimport Core from '@/core/core/core';\nimport { delHash } from '@/core/utils/route';\nimport type { Props } from './types';\nimport { defineTabsStore } from './store';\nimport TabsViewMenu from './menu.vue';\nimport TopLoadbar from '@/components/forms/loadbar/loadbar.vue';\nimport { checkComponentIsLoading } from './utils';\n\nconst props = withDefaults(defineProps<Props>(), {\n\tshowMenuInPopup: undefined,\n\tisShortable: false,\n});\n\nconst model = defineModel<string>();\n\nconst store = defineTabsStore(props, model);\n\nconst uid = Math.random();\n\nif (props.pageMod) Core.state.documentClassModificators.set(uid, 'top-hasTabsViewPageMod');\n\nonUnmounted(() => {\n\tif (props.pageMod) Core.state.documentClassModificators.delete(uid);\n\n\tif (store.$id) delHash(store.$id, store.activeItemName, true);\n});\n\nconst componentRef = ref();\nconst isLoading = ref(false);\n\nwatch([componentRef, () => store.component], () => {\n\tisLoading.value = checkComponentIsLoading(store.component);\n}, { immediate: true });\n</script>\n\n<template>\n\t<div\n\t\t:class=\"{\n\t\t\t'top-tabsView': true,\n\t\t\t'top-tabsView-pageMod': props.pageMod,\n\t\t\t'top-tabsView-inPopup': store.showMenuInPopup,\n\t\t}\"\n\t>\n\t\t<TabsViewMenu\n\t\t\t:isShortable=\"isShortable\"\n\t\t\tv-model:isLoading=\"isLoading\"\n\t\t>\n\t\t\t<!-- @slot Меню, ожидает передачу компонентов TabsViewMenuItem и TabsViewMenuTitle -->\n\t\t\t<slot name=\"menu\"></slot>\n\t\t</TabsViewMenu>\n\n\t\t<div\n\t\t\t:class=\"{\n\t\t\t\t'top-tabsView_contents': true,\n\t\t\t\t'top-tabsView_contents-isLoading': isLoading,\n\t\t\t\t'top-tabsView_contents-noScrollable': !store.scrollable,\n\t\t\t}\"\n\t\t>\n\t\t\t<TopLoadbar v-if=\"isLoading\"/>\n\n\t\t\t<keep-alive>\n\t\t\t\t<component\n\t\t\t\t\tref=\"componentRef\"\n\t\t\t\t\t:is=\"store.component\"\n\t\t\t\t/>\n\t\t\t</keep-alive>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n:root {\n\t--top-tabsView-top: 0px;\n\t--top-tabsView-menu-width: 220px;\n\t--top-tabsView-contents-offset-top: 0px;\n}\n\n.top-tabsView {\n\tbackground: var(--color-layout-middle);\n\twidth: 100%;\n\theight: 100%;\n\tdisplay: flex;\n\tflex-direction: row;\n}\n\n.top-tabsView_contents {\n\tborder-radius: var(--top-radius-4);\n\tbackground: var(--color-layout-front-1);\n\tpadding: var(--top-padding-4);\n\tflex-grow: 1;\n\toverflow: auto;\n\tposition: relative;\n}\n\n.top-tabsView_contents-isLoading {\n\tpointer-events: none;\n}\n\n.top-tabsView_contents-noScrollable {\n\twidth: calc(100% - var(--top-tabsView-menu-width));\n\tpadding: 0;\n\toverflow: visible;\n}\n\n/ top-tabsView-inPopup */\n.top-tabsView-inPopup {\n\tbackground: var(--color-layout-front-1);\n\tflex-direction: column;\n}\n\n.top-tabsView-inPopup > .top-tabsView_contents {\n\tborder-radius: 0;\n}\n\n.top-tabsView-inPopup > .top-tabsView_contents-noScrollable {\n\twidth: auto;\n}\n</style>\n","<script setup lang=\"ts\">\n\n</script>\n\n<template>\n\t<div class=\"top-tabsView_menuDelimeter\"></div>\n</template>\n\n<style>\n.top-tabsView_menuDelimeter {\n\tpadding: var(--top-padding-1) 0;\n\tdisplay: flex;\n}\n\n.top-tabsView_menuDelimeter:before {\n\tcontent: \"\";\n\theight: 2px;\n\tbackground: var(--color-line-2);\n\tflex-grow: 1;\n}\n\n.top-tabsView_menuDelimeter:first-child,\n.top-tabsView_menuDelimeter + .top-tabsView_menuDelimeter {\n\tdisplay: none;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { useTabsStore } from './store';\nimport type { PropsMenuTitle } from './types';\nimport TabsViewMenuDelimeter from './menuDelimeter.vue';\nimport { TopPopupListItem } from '../../popup/popup';\n\ndefineProps<PropsMenuTitle>();\n\nconst store = useTabsStore();\n</script>\n\n<template>\n\t<TopPopupListItem\n\t\tv-if=\"store.showMenuInPopup\"\n\t\ttype=\"title\"\n\t>\n\t\t<slot></slot>\n\t</TopPopupListItem>\n\n\t<TabsViewMenuDelimeter v-else-if=\"store.isShort\"/>\n\n\t<div\n\t\tv-else\n\t\t:class=\"{\n\t\t\t'top-tabsView_menuTitle': true,\n\t\t\t'top-tabsView_menuTitle-subtitle': isSubtitle,\n\t\t}\"\n\t>\n\t\t<slot></slot>\n\t</div>\n</template>\n\n<style>\n.top-tabsView_menuTitle {\n\tpadding: var(--top-padding-4) var(--top-padding-2) var(--top-padding-1);\n\tfont-weight: 600;\n\tcolor: var(--color-text-1);\n}\n\n.top-tabsView_menuTitle-subtitle {\n\tpadding-top: var(--top-padding-1);\n\tfont-size: 12px;\n\tfont-weight: 400;\n\tcolor: var(--color-text-2);\n}\n</style>\n","import type { ComponentCustomProps } from 'vue';\n\nimport TabsView from './tabsView/tabsView.vue';\nimport TabsViewMenuItem from './tabsView/menuItem.vue';\nimport TabsViewMenuTitle from './tabsView/menuTitle.vue';\n\nexport const TopTabsView = TabsView as typeof TabsView & ComponentCustomProps;\nexport const TopTabsViewMenuItem = TabsViewMenuItem as typeof TabsViewMenuItem & ComponentCustomProps;\nexport const TopTabsViewMenuTitle = TabsViewMenuTitle as typeof TabsViewMenuTitle & ComponentCustomProps;\n"],"names":["genStorageKey","stateName","stateKey","loadLocalStorge","store","localStorageKey","localStorageValue","addSaverLocalStorge","watch","StoreLocalStorage","popstateCallbacks","e","popstateCallback","injectionKey","defineTabsStore","props","model","defineStore","showMenuInPopup","computed","Core","pageMod","isShort","ref","component","scrollable","_e","getHash","useTabsStore","useStore","__props","href","genHash","tagName","TopPopupListItem","onClick","openBlock","createBlock","resolveDynamicComponent","normalizeClass","unref","_ctx","name","disabled","renderSlot","createElementBlock","_hoisted_1$2","createCommentVNode","checkComponentIsLoading","preResolveComponent","condition","sleepWhile","isLoading","useModel","slots","useSlots","menuItemByName","setMenuItemByName","item","setMenuItemByNameFromItems","menuItems","subComponent","_sfc_main$4","_a","_b","menuItem","_d","_c","markRaw","activeMenuItem","countChanged","numberChanged","activeItemName","setHash","elRef","resizeObserver","onMounted","onUnmounted","withCtx","createElementVNode","_hoisted_1$1","_hoisted_2","_hoisted_4","_cache","$event","createTextVNode","toDisplayString","uid","delHash","componentRef","isShortable","_hoisted_1","isSubtitle","TopTabsView","_sfc_main$2","TopTabsViewMenuItem","TopTabsViewMenuTitle","_sfc_main"],"mappings":"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"}

package/types/api/additional.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export * from './api/additional'
2	+ export {}

package/types/api/api/additional.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export * from './utils/filters';

package/types/api/api/client/client.d.ts ADDED Viewed

@@ -0,0 +1,55 @@
+export declare class Client<paths extends Api.PathsAbstract, UseExt extends Api.Ext.UseExt> {
+    readonly options: Readonly<Api.ClientOptions>;
+    readonly useExt: UseExt;
+    readonly middlewares: Api.Middleware[];
+    abortControllers: Record<string, AbortController>;
+    constructor(clientOptions: Partial<Api.ClientOptions> | undefined, useExt: UseExt);
+    generateUUID(): string;
+    /**
+     * Зарегистрировать middleware
+     */
+    use(middleware: Api.Middleware): void;
+    /**
+     * Создать объект запроса
+     *
+     * После создания объекта он заполняется необходимыми данными и выполняет запросы к API с помощью APIRequest2.call();
+     *
+     * Опционально generic указывать нельзя, поэтому необходимо дублировать определение fetchStyle, [см.](https://github.com/Microsoft/TypeScript/issues/26242)
+     *
+     * @param path Путь метода API
+     * @param fieldsNarrow Список получаемых полей, для методов API с моделью. Если объект запроса переиспользуется, и список полей меняется, указывайте его непосредственно при вызове `api.call()`
+     */
+    gen<Path extends Api.Path<paths>, FieldsNarrow extends Api.ParamsFields<Api.ClientRequestContext<paths, Path, UseExt>>>(path: Path, fieldsNarrow?: FieldsNarrow): Api.ClientRequest<Api.ClientRequestContext<paths, Path, UseExt>, FieldsNarrow>;
+    /**
+     * Создать объект запроса, не описанного в OpenAPI
+     */
+    genAny<Params extends Record<string, any>, Result = any, FieldsNarrow extends Api.Ext.Schemas['Fields'] | undefined = undefined>(path: Api.PathAbstract, fieldsNarrow?: FieldsNarrow): Api.ClientRequestCustom<UseExt, Params, Result>;
+    /**
+     * Создать контекст выполнения запроса
+     */
+    genMiddlewareCtx(clientRequest: Api.ClientRequest<any, any, any>, data: Record<string, any>): Omit<Api.MiddlewareCallbackParams, 'request'>;
+    /**
+     * Обработчик middleware.onRequest
+     *
+     * @param request Запрос для обработки
+     * @param middlewareCtx Контекст выполнения запроса
+     * @return Новый экземпляр `Request` или `Response` при модификации запроса, или undefined
+     */
+    middlewareOnRequest(request: Request, middlewareCtx: Api.MiddlewareCallbackParams): Promise<Request | Response | undefined>;
+    /**
+     * Обработчик middleware.onResponse
+     *
+     * @param `error` Ошибка, переданная для обработки
+     * @param middlewareCtx
+     * @return Новый экземпляр `Response` при успешной обработке или выбрасывает ошибку
+     */
+    middlewareOnError(error: Error | unknown, middlewareCtx: Api.MiddlewareCallbackParams): Promise<Response | never>;
+    /**
+     * Обработчик middleware.onResponse
+     *
+     * @param response Ответ для обработки
+     * @param middlewareCtx Контекст выполнения запроса
+     * @return Новый экземпляр `Response` при модификации ответа, или undefined
+     */
+    middlewareOnResponse(response: Response, middlewareCtx: Api.MiddlewareCallbackParams): Promise<Response>;
+}

package/types/api/api/client/request-options.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export declare const createRequestOptions: (requestOptions?: Partial<Api.ClientRequestOptions>) => Api.ClientRequestOptions;

package/types/api/api/client/request.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import { Client } from './client';
2	+ export declare const createRequest: <RequestContext extends Api.ClientRequestContext<any, any, any>, FieldsNarrow extends Api.ParamsFields<RequestContext>>(client: Client<RequestContext["Paths"], RequestContext["UseExt"]>, path: RequestContext["Path"], fieldsNarrow?: FieldsNarrow) => Api.ClientRequest<RequestContext, FieldsNarrow>;

package/types/api/api/index.d.ts ADDED Viewed

@@ -0,0 +1,12 @@
+import { Client } from './client/client';
+import { postInWindow, dataToForm } from './utils/lazy';
+export * from './utils/field';
+export * from './utils/common';
+export declare const postInWindow: postInWindow;
+export declare const dataToForm: dataToForm;
+/**
+ * Создать API клиент
+ *
+ * @see Api.Ext.UseExt
+ */
+export declare const createClient: <paths extends Api.PathsAbstract, UseExt extends Api.Ext.UseExt>(clientOptions: Partial<Api.ClientOptions> | undefined, useExt: UseExt) => Client<paths, UseExt>;

package/types/api/api/tests/model.d.ts ADDED Viewed

File without changes

package/types/api/api/tests/test.d.ts ADDED Viewed

@@ -0,0 +1,16 @@
+type RequestContext = Api.ClientRequestContext<Api.TV.Paths, '/get/projects_2/projects/', true>;
+type RequestContext2 = Api.ClientRequestContext<Api.TV.Paths, '/edit/projects_2/projects/on/', true>;
+type RequestContext3 = Api.ClientRequestContext<Api.TV.Paths, '/get/projects_2/analytics/', true>;
+type RequestContext4 = Api.ClientRequestContext<Api.TV.Paths, '/edit/projects_2/analytics/', true>;
+type T = Api.Response<RequestContext, ['id']>;
+type T2 = Api.Response<RequestContext, ['name', 'id'], 'fetch'>;
+type T3 = Api.Response<RequestContext2>;
+type T4 = Api.Response<RequestContext2, ['name'], 'fetchColumn'>;
+type T5 = Api.Response<RequestContext3>;
+type T6 = Api.Response<RequestContext4>;
+declare const t: T;
+declare const t2: T2;
+declare const t3: T3;
+declare const t4: T4;
+declare const t5: T5;
+declare const t6: T6;

package/types/api/api/types/api.d.ts ADDED Viewed

@@ -0,0 +1,139 @@
+declare global {
+    /**
+     * Типы, используемые Api клиентом для работы со схемой расширения
+     *
+     * Работает только с POST запросами в формате json
+     *
+     * @see Api.Ext
+     */
+    namespace Api {
+        /**
+         * Параметры запроса метода API
+         *
+         * @template Path Путь метода API
+         */
+        type Params<RequestContext extends Api.ClientRequestContext<any, any, any>, FieldsNarrow extends Api.ParamsFields<RequestContext> | undefined = undefined, Model extends RequestContext['Model'] = RequestContext['Model'], ParamsOriginal extends Api.ParamsOriginal<RequestContext> = Api.ParamsOriginal<RequestContext>> = Omit<ParamsOriginal, 'fields' | 'filters' | 'orders' | 'fetch_style'> & Api.PickAndRetype<ParamsOriginal, 'fields', FieldsNarrow extends Api.Ext.Schemas['Fields'] ? Api.ArrowNarrow<Api.ParamsFields<RequestContext>, FieldsNarrow> : Api.ParamsFields<RequestContext>> & Api.PickAndRetype<ParamsOriginal, 'filters', [Model] extends [never] ? never : Api.Field.Filter<Model>[]> & Api.PickAndRetype<ParamsOriginal, 'orders', [Model] extends [never] ? never : Api.Field.Order<Model>[]>;
+        /**
+         * Получить параметр списка полей с учетом дженериков модели
+         *
+         * Если в схеме не указан конкретный тип `fields`, он будет заменен типом из модели
+         */
+        type ParamsFields<RequestContext extends Api.ClientRequestContext<any, any, any>, ParamsOriginalFields extends Api.ParamsOriginalFields<RequestContext> = Api.ParamsOriginalFields<RequestContext>> = [RequestContext['Model']] extends [never] ? ParamsOriginalFields : ParamsOriginalFields extends Api.Ext.Schemas['Fields'] ? Api.ModelFields<RequestContext['Model']> : ParamsOriginalFields;
+        /**
+         * Параметры запроса метода API, классический OpenAPI без дженериков
+         *
+         * @template Path Путь метода API
+         * @template T Интерфейс `paths` в схеме openAPI
+         *
+         * @see PathsAbstract
+         */
+        type ParamsOriginal<RequestContext extends Api.ClientRequestContext<any, any, any>> = RequestContext['Schema']['post'] extends {
+            requestBody: {
+                content: {
+                    'application/json': infer P extends object;
+                };
+            };
+        } ? P : object;
+        type ParamsOriginalByPath<Paths extends Api.PathsAbstract, Path extends Api.Path<Paths>> = Paths[Path]['post'] extends {
+            requestBody: {
+                content: {
+                    'application/json': infer P extends object;
+                };
+            };
+        } ? P : object;
+        /**
+         * Получить параметр списка полей без учета дженериков модели и преобразовать его в базовый тип `fields`
+         */
+        type ParamsOriginalFields<RequestContext extends Api.ClientRequestContext<any, any, any>> = Api.ParamsOriginal<RequestContext> extends {
+            fields?: infer Fields extends any[];
+        } ? unknown[] extends Fields ? Api.Ext.Schemas['Fields'] : Fields : never;
+        /**
+         * Тип ответа метода API с расширением дженериков для TV Open API
+         *
+         * Расширение классического `ResponseOriginal`
+         *
+         * @template RequestContext Контекст запроса
+         * @template Fields Имена полей для выборки, так как это массив, подстановка типа тут работать не будет, подстановка реализуется в js утилите
+         * @template FetchStyle Способ получения данных, влияет на тип получения результата, по умолчанию `null` - определяется автоматически
+         *
+         * @see Api.Ext.FetchStyle
+         * @see `ResponseOriginal`
+         */
+        type Response<RequestContext extends Api.ClientRequestContext<any, any, any>, Fields extends Api.ParamsFields<RequestContext> | undefined = undefined, FetchStyle extends RequestContext['ParamsFetchStyle'] | null = null, Result extends Api.Result<RequestContext, Fields, FetchStyle> = Api.Result<RequestContext, Fields, FetchStyle>> = Api.ResponseSuccess<Result, RequestContext['Oper']> | Api.ResponseError<Result>;
+        /**
+         * Тип ответа метода API с произвольной типизацией
+         *
+         * Для случаев, когда тип не описан в Open API
+         *
+         * Расширение классического `ResponseOriginal`
+         *
+         * @see ResponseOriginal
+         */
+        type ResponseCustom<Result = any> = Api.ResponseSuccess<Result, any> | Api.ResponseError<Result>;
+        /**
+         * Тип ответа метода API, классический OpenAPI без дженериков
+         *
+         * @template Path Путь метода API
+         * @template T Интерфейс `paths` в схеме openAPI
+         *
+         * @see PathsAbstract
+         */
+        type ResponseOriginal<RequestContext extends Api.ClientRequestContext<any, any, any>> = RequestContext['Schema']['post']['responses'][200]['content'] extends {
+            'application/json': infer R extends object;
+        } ? R : never;
+        /**
+         * Тип `result` в ответе метода API
+         *
+         * Для методов API без модели и fetchStyle
+         *
+         * @template Path Путь метода API
+         * @template T Интерфейс `paths` в схеме openAPI
+         *
+         * @see `ResponseOriginal`
+         * @see PathsAbstract
+         */
+        type ResponseOriginalResult<RequestContext extends Api.ClientRequestContext<any, any, any>> = Exclude<Api.ResponseOriginal<RequestContext>, Api.Ext.Schemas['ResponseError']> extends {
+            result?: infer R;
+        } ? R : never;
+        /**
+         * Результат в ответе метода API
+         *
+         * Не путайте с ответом API `Response`, который помимо результата содержит дополнительную информацию о выполнении метода
+         *
+         * @see Api.Response
+         */
+        type Result<RequestContext extends Api.ClientRequestContext<any, any, any>, Fields extends Api.ParamsFields<RequestContext> | undefined = undefined, FetchStyle extends RequestContext['ParamsFetchStyle'] | null = null, Model extends RequestContext['Model'] = RequestContext['Model'], ResponseOriginalResult extends Api.ResponseOriginalResult<RequestContext> = Api.ResponseOriginalResult<RequestContext>> = [Model] extends [never] ? ResponseOriginalResult : null extends FetchStyle ? RequestContext['Oper'] extends 'get' ? ResultModel<Fields, 'fetchAll', Model> : ResponseOriginalResult : ResultModel<Fields, NonNullable<FetchStyle>, Model>;
+        /**
+         * Результат в ответе метода API для модели
+         *
+         * @see Api.Result
+         */
+        type ResultModel<Fields extends Api.ModelFields<Model> | undefined, FetchStyle extends Api.Ext.Schemas['FetchStyle'], Model extends Api.Ext.Schemas['Model']> = Fields extends Api.ModelFields<Model> ? ResultByModelFetchStyle<Fields, Model>[FetchStyle] : never;
+        /**
+         * Преобразование модели в зависимости от `fetchStyle`
+         */
+        type ResultByModelFetchStyle<Fields extends Api.ModelFields<Model>, Model extends Api.Ext.Schemas['Model']> = {
+            fetchAll: ModelSelected<Fields, Model>[];
+            fetchAllNum: number[][];
+            fetchAllColumn: Fields[0] extends keyof Model ? Model[Fields[0]][] : never;
+            fetch: ModelSelected<Fields, Model>;
+            fetchColumn: Fields[0] extends keyof Model ? Model[Fields[0]] : never;
+            fetchGroup: Record<string, ModelSelected<Fields, Model>[]>;
+            fetchGroupColumn: Fields[0] extends keyof Model ? Record<string, Model[Fields[0]][]> : never;
+            fetchUnique: Record<string, ModelSelected<Fields, Model>>;
+            fetchUniqueNum: Fields extends [] ? never : Record<string, SelectedModelNum<Fields, Model>>;
+            fetchUniqueColumn: Fields[0] extends keyof Model ? Record<string, Model[Fields[0]]> : never;
+        };
+        /**
+         * Модель только с нужными полями
+         */
+        type ModelSelected<Fields extends Api.ModelFields<Model>, Model extends Api.Ext.Schemas['Model']> = Fields extends [] ? never : Omit<Model, Exclude<keyof Model, Fields[number]>>;
+        /**
+         * Модель только с нужными полями без имен
+         */
+        type SelectedModelNum<Fields extends Api.ModelFields<Model>, Model extends Api.Ext.Schemas['Model']> = Fields extends [] ? never : {
+            [K in keyof Fields]: Fields[K] extends keyof Model ? Model[Fields[K]] : never;
+        };
+    }
+}
+export {};