@topvisor/ui 0.9.35-1 → 0.9.35-3

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 (60) hide show
  1. package/.chunks/{datepicker-BG0u8UXv.amd.js → datepicker-D1RJVUmI.amd.js} +3 -3
  2. package/.chunks/datepicker-D1RJVUmI.amd.js.map +1 -0
  3. package/.chunks/{datepicker-Dmeojg66.es.js → datepicker-DKaHSwKg.es.js} +23 -24
  4. package/.chunks/{datepicker-Dmeojg66.es.js.map → datepicker-DKaHSwKg.es.js.map} +1 -1
  5. package/.chunks/{forms-CPEVHoks.es.js → forms-BUjy1eoH.es.js} +463 -388
  6. package/.chunks/forms-BUjy1eoH.es.js.map +1 -0
  7. package/.chunks/forms-CWbjHcxY.amd.js +3 -0
  8. package/.chunks/forms-CWbjHcxY.amd.js.map +1 -0
  9. package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-Dlm9Et7q.es.js → listItem.vue_vue_type_script_setup_true_lang-BPuQu2Hx.es.js} +20 -20
  10. package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-Dlm9Et7q.es.js.map → listItem.vue_vue_type_script_setup_true_lang-BPuQu2Hx.es.js.map} +1 -1
  11. package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-CkZHzNZU.amd.js → listItem.vue_vue_type_script_setup_true_lang-Cm2JuYsV.amd.js} +2 -2
  12. package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-CkZHzNZU.amd.js.map → listItem.vue_vue_type_script_setup_true_lang-Cm2JuYsV.amd.js.map} +1 -1
  13. package/.chunks/{menu-SmyeSNWQ.amd.js → menu--HRyUhPR.amd.js} +2 -2
  14. package/.chunks/{menu-SmyeSNWQ.amd.js.map → menu--HRyUhPR.amd.js.map} +1 -1
  15. package/.chunks/{menu-CiQMMrnp.es.js → menu-BGWVC7jB.es.js} +34 -34
  16. package/.chunks/{menu-CiQMMrnp.es.js.map → menu-BGWVC7jB.es.js.map} +1 -1
  17. package/.chunks/{popup-Bv_sxmoj.es.js → popup-B73zkYFU.es.js} +20 -21
  18. package/.chunks/popup-B73zkYFU.es.js.map +1 -0
  19. package/.chunks/popup-BBaZf1uk.amd.js +441 -0
  20. package/.chunks/popup-BBaZf1uk.amd.js.map +1 -0
  21. package/core/app.amd.js +1 -1
  22. package/core/app.js +1 -1
  23. package/core/core/core.d.ts +40 -0
  24. package/core/core.amd.js +1 -1
  25. package/core/core.js +1 -1
  26. package/forms/forms.amd.js +1 -1
  27. package/forms/forms.js +1 -1
  28. package/formsExt/formsExt.amd.js +1 -1
  29. package/formsExt/formsExt.js +58 -58
  30. package/package.json +1 -1
  31. package/popup/popup.amd.js +1 -1
  32. package/popup/popup.js +17 -17
  33. package/popup/worker.amd.js +1 -1
  34. package/popup/worker.js +2 -2
  35. package/project/project.amd.js +1 -1
  36. package/project/project.js +19 -19
  37. package/require/css.amd.js +4 -4
  38. package/tabs/tabs.amd.js +1 -1
  39. package/tabs/tabs.js +13 -13
  40. package/tabsView/tabsView.amd.js +1 -1
  41. package/tabsView/tabsView.js +44 -44
  42. package/utils/date.amd.js +1 -1
  43. package/utils/date.js +1 -1
  44. package/utils/device.amd.js +1 -1
  45. package/utils/device.js +1 -1
  46. package/utils/price.amd.js +1 -1
  47. package/utils/price.js +1 -1
  48. package/.chunks/datepicker-BG0u8UXv.amd.js.map +0 -1
  49. package/.chunks/forms-CPEVHoks.es.js.map +0 -1
  50. package/.chunks/forms-oowSA2rF.amd.js +0 -3
  51. package/.chunks/forms-oowSA2rF.amd.js.map +0 -1
  52. package/.chunks/popup-Bv_sxmoj.es.js.map +0 -1
  53. package/.chunks/popup-ClvUyl7S.amd.js +0 -441
  54. package/.chunks/popup-ClvUyl7S.amd.js.map +0 -1
  55. package/core/utils/css.d.ts +0 -43
  56. package/utils/css.amd.js +0 -2
  57. package/utils/css.amd.js.map +0 -1
  58. package/utils/css.d.ts +0 -1
  59. package/utils/css.js +0 -45
  60. package/utils/css.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"listItem.vue_vue_type_script_setup_true_lang-Dlm9Et7q.es.js","sources":["../../src/components/popup/popup/opener.vue","../../src/components/popup/popup/popup.vue","../../src/components/popup/popup/listItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { onUpdated } from 'vue';\r\nimport type { OpenerProps } from './popup';\r\n\r\nconst props = withDefaults(defineProps<OpenerProps>(), {\r\n\tpos: '3',\r\n\tnotch: true,\r\n\tposBy: 'fixed',\r\n});\r\n\r\nconst id = props.id || Math.random() + '';\r\n\r\nlet elOpener: Element;\r\n\r\n/**\r\n * Необычная функция для проброски props внтурь элемента слота\r\n *\r\n * @param el - вспомогательрный элемент для доступа к элементам слота\r\n */\r\nfunction render(el: any) {\r\n\tsetTimeout(() => {\r\n\t\telOpener = el.nextElementSibling;\r\n\r\n\t\tif (elOpener) {\r\n\t\t\trenderOpener(elOpener);\r\n\t\t}\r\n\t});\r\n}\r\n\r\nonUpdated(() => {\r\n\tif (elOpener) {\r\n\t\trenderOpener(elOpener);\r\n\t}\r\n});\r\n\r\nfunction renderOpener(elOpener: any) {\r\n\telOpener.dataset.topPopup = 'vue-' + id;\r\n\telOpener.dataset.topPopupId = id;\r\n\telOpener.dataset.topPopupP = props.pos;\r\n\telOpener.dataset.topPopupPosBy = props.posBy;\r\n\telOpener.dataset.topPopupNotch = props.notch ? 'true' : '';\r\n\telOpener.dataset.topPopupOpenByHover = props.openByHover ? 'true' : '';\r\n}\r\n</script>\r\n\r\n<template>\r\n\t<template :ref=\"render\"></template>\r\n\r\n\t<!-- @slot элемент для открытия Popup -->\r\n\t<slot></slot>\r\n</template>\r\n\r\n<!-- Использует общий deprecated класс .btn -->\r\n<style>\r\nh3[data-top-popup],\r\ndiv[data-top-popup],\r\ni[data-top-popup]:not(.btn),\r\nb[data-top-popup]:not(.btn) {\r\n\tcursor: pointer;\r\n\tuser-select: none;\r\n\tfont-style: normal;\r\n\ttext-decoration: none;\r\n\tdisplay: inline-flex;\r\n\talign-items: center;\r\n}\r\n\r\n[data-top-popup][data-top-popup-disabled] {\r\n\tpointer-events: none;\r\n\tcursor: auto !important;\r\n}\r\n\r\ni[contenteditable] {\r\n\tcursor: text !important;\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nimport type { Ref } from 'vue';\r\nimport { onUnmounted, ref, toRef } from 'vue';\r\nimport Core from '@/core/core/core';\r\nimport type { Emits, Props } from './popup';\r\nimport Opener from './opener.vue';\r\nimport Worker from '@/components/popup/lib/worker';\r\nimport type PopupClass from '@/components/popup/lib/popup';\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\tid: '',\r\n\tpos: '3',\r\n\tnotch: true,\r\n\tposBy: 'fixed',\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst expose = {\r\n\tpopup: undefined as PopupClass | undefined,\r\n};\r\ndefineExpose(expose);\r\n\r\nconst id = props.id || Math.random() + '';\r\nconst elPopupRef: Ref<null | Element> = ref(null);\r\n\r\n// см. lib/popup\r\nconst onOpen = async (popup: PopupClass) => {\r\n\tif (popup.elPopupInner) {\r\n\t\tpopup.elPopupInner.innerText = '';\r\n\r\n\t\telPopupRef.value = popup.elPopupInner;\r\n\t}\r\n\r\n\tvueConnector.opened = true;\r\n\tvueConnector.popup = popup;\r\n\r\n\texpose.popup = popup;\r\n\r\n\temit('open');\r\n};\r\n\r\n// см. lib/popup\r\nconst onClose = (_popup: PopupClass) => {\r\n\telPopupRef.value = null;\r\n\r\n\tvueConnector.opened = false;\r\n\tvueConnector.popup = undefined;\r\n\r\n\temit('close');\r\n};\r\n\r\nconst vueConnector = {\r\n\tonOpen,\r\n\tonClose,\r\n\tclassRef: toRef(props, 'class'),\r\n\topened: false,\r\n\tpopup: undefined as PopupClass | undefined,\r\n\ttransitionDurationRef: toRef(props, 'transitionDuration'),\r\n};\r\n\r\nWorker.regVueComponent(id, vueConnector);\r\n\r\nonUnmounted(() => {\r\n\tWorker.unregVueComponent(id);\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<Opener\r\n\t\tv-if=\"$slots.opener\"\r\n\t\t:id=\"id\"\r\n\t\t:pos=\"pos\"\r\n\t\t:posBy=\"posBy\"\r\n\t\t:notch=\"notch\"\r\n\t\t:openByHover=\"openByHover\"\r\n\t>\r\n\t\t<!-- @slot элемент для открытия Popup -->\r\n\t\t<slot name=\"opener\"></slot>\r\n\t</Opener>\r\n\r\n\t<!-- Это шаблон для компонента Popup, сам Popup генерируется в js и может находиться где угодно -->\r\n\t<!-- elPopupRef будет установлен только после открытия и будет сброшен сразу после закрытия Popup -->\r\n\t<teleport\r\n\t\tv-if=\"elPopupRef\"\r\n\t\t:to=\"elPopupRef\"\r\n\t>\r\n\t\t<div v-if=\"$slots.header || Core.state.isMobile\" class=\"top-popup_header\">\r\n\t\t\t<span\r\n\t\t\t\tv-if=\"Core.state.isMobile\"\r\n\t\t\t\tclass=\"top-as-a closer\"\r\n\t\t\t>\r\n\t\t\t\t{{ $i18n.Common.Close }}\r\n\t\t\t</span>\r\n\r\n\t\t\t<!-- @slot Шапка -->\r\n\t\t\t<slot name=\"header\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<div v-if=\"$slots.widget\" class=\"top-popup_widget\">\r\n\t\t\t<!-- @slot Виджет -->\r\n\t\t\t<slot name=\"widget\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<div v-if=\"$slots.content\" class=\"top-popup_content\">\r\n\t\t\t<!-- @slot Контент в свободной форме -->\r\n\t\t\t<slot name=\"content\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<ul\r\n\t\t\tv-if=\"$slots.contentList\"\r\n\t\t\tclass=\"top-popup_content\"\r\n\t\t\t@scroll=\"$emit('scrollContentList', $event)\"\r\n\t\t>\r\n\t\t\t<!-- @slot Контент в виде списка, для вставки элементов списка используйте компонент popup/listItem -->\r\n\t\t\t<slot name=\"contentList\"></slot>\r\n\t\t</ul>\r\n\r\n\t\t<div v-if=\"$slots.footer\" class=\"top-popup_footer\">\r\n\t\t\t<!-- @slot Футер -->\r\n\t\t\t<slot name=\"footer\"></slot>\r\n\t\t</div>\r\n\t</teleport>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ListItemProps } from './popup';\r\n\r\ndefineOptions({\r\n\tinheritAttrs: false,\r\n});\r\n\r\nconst props = withDefaults(defineProps<ListItemProps>(), {\r\n\ttype: 'button',\r\n\tcloseByClick: true,\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<li\r\n\t\t:class=\"{\r\n\t\t'top-popup_liNoSelectable': props.type !== 'button'\r\n\t}\"\r\n\t>\r\n\t\t<component\r\n\t\t\t:is=\"$attrs.href ? 'a' : 'div'\"\r\n\t\t\t:class=\"{\r\n\t\t\t\t'top-popup_listItem': true,\r\n\t\t\t\t'top-popup_listItem-button': props.type === 'button', // оформления кнопки\r\n\t\t\t\t'a': props.type === 'button', // оформления кнопки, deprecated\r\n\t\t\t\t'top-popup_listItem-title': props.type === 'title',\r\n\t\t\t\t'top-popup_listItem-delimiter': props.type === 'delimiter',\r\n\t\t\t\t'top-popup-noCloser': !closeByClick\r\n\t\t\t}\"\r\n\t\t\t:=$attrs\r\n\t\t>\r\n\t\t\t<slot></slot>\r\n\t\t</component>\r\n\t</li>\r\n</template>\r\n"],"names":["props","__props","id","elOpener","render","el","renderOpener","onUpdated","elOpener2","emit","__emit","expose","__expose","elPopupRef","ref","vueConnector","popup","_popup","toRef","Worker","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;AAIA,UAAAA,IAAAC,GAMAC,IAAAF,EAAA,MAAA,KAAA,OAAA,IAAA;AAEA,QAAAG;AAOA,aAAAC,EAAAC,GAAA;AACC,iBAAA,MAAA;AACC,QAAAF,IAAAE,EAAA,oBAEAF,KACCG,EAAAH,CAAA;AAAA,MACD,CAAA;AAAA,IACA;AAGF,IAAAI,EAAA,MAAA;AACC,MAAAJ,KACCG,EAAAH,CAAA;AAAA,IACD,CAAA;AAGD,aAAAG,EAAAE,GAAA;AACC,MAAAA,EAAA,QAAA,WAAA,SAAAN,GACAM,EAAA,QAAA,aAAAN,GACAM,EAAA,QAAA,YAAAR,EAAA,KACAQ,EAAA,QAAA,gBAAAR,EAAA,OACAQ,EAAA,QAAA,gBAAAR,EAAA,QAAA,SAAA,IACAQ,EAAA,QAAA,sBAAAR,EAAA,cAAA,SAAA;AAAA,IAAoE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChCrE,UAAAA,IAAAC,GAOAQ,IAAAC,GAEAC,IAAA;AAAA,MAAe,OAAA;AAAA,IACP;AAER,IAAAC,EAAAD,CAAA;AAEA,UAAAT,IAAAF,EAAA,MAAA,KAAA,OAAA,IAAA,IACAa,IAAAC,EAAA,IAAA,GA4BAC,IAAA;AAAA,MAAqB,QAzBrB,OAAAC,MAAA;AACC,QAAAA,EAAA,iBACCA,EAAA,aAAA,YAAA,IAEAH,EAAA,QAAAG,EAAA,eAGDD,EAAA,SAAA,IACAA,EAAA,QAAAC,GAEAL,EAAA,QAAAK,GAEAP,EAAA,MAAA;AAAA,MAAW;AAAA,MAcX,SAVD,CAAAQ,MAAA;AACC,QAAAJ,EAAA,QAAA,MAEAE,EAAA,SAAA,IACAA,EAAA,QAAA,QAEAN,EAAA,OAAA;AAAA,MAAY;AAAA,MAKZ,UAAAS,EAAAlB,GAAA,OAAA;AAAA,MAC8B,QAAA;AAAA,MACtB,OAAA;AAAA,MACD,uBAAAkB,EAAAlB,GAAA,oBAAA;AAAA,IACiD;AAGzD,WAAAmB,EAAA,gBAAAjB,GAAAa,CAAA,GAEAK,EAAA,MAAA;AACC,MAAAD,EAAA,kBAAAjB,CAAA;AAAA,IAA2B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzD5B,UAAAF,IAAAC;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"listItem.vue_vue_type_script_setup_true_lang-BPuQu2Hx.es.js","sources":["../../src/components/popup/popup/opener.vue","../../src/components/popup/popup/popup.vue","../../src/components/popup/popup/listItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { onUpdated } from 'vue';\r\nimport type { OpenerProps } from './popup';\r\n\r\nconst props = withDefaults(defineProps<OpenerProps>(), {\r\n\tpos: '3',\r\n\tnotch: true,\r\n\tposBy: 'fixed',\r\n});\r\n\r\nconst id = props.id || Math.random() + '';\r\n\r\nlet elOpener: Element;\r\n\r\n/**\r\n * Необычная функция для проброски props внтурь элемента слота\r\n *\r\n * @param el - вспомогательрный элемент для доступа к элементам слота\r\n */\r\nfunction render(el: any) {\r\n\tsetTimeout(() => {\r\n\t\telOpener = el.nextElementSibling;\r\n\r\n\t\tif (elOpener) {\r\n\t\t\trenderOpener(elOpener);\r\n\t\t}\r\n\t});\r\n}\r\n\r\nonUpdated(() => {\r\n\tif (elOpener) {\r\n\t\trenderOpener(elOpener);\r\n\t}\r\n});\r\n\r\nfunction renderOpener(elOpener: any) {\r\n\telOpener.dataset.topPopup = 'vue-' + id;\r\n\telOpener.dataset.topPopupId = id;\r\n\telOpener.dataset.topPopupP = props.pos;\r\n\telOpener.dataset.topPopupPosBy = props.posBy;\r\n\telOpener.dataset.topPopupNotch = props.notch ? 'true' : '';\r\n\telOpener.dataset.topPopupOpenByHover = props.openByHover ? 'true' : '';\r\n}\r\n</script>\r\n\r\n<template>\r\n\t<template :ref=\"render\"></template>\r\n\r\n\t<!-- @slot элемент для открытия Popup -->\r\n\t<slot></slot>\r\n</template>\r\n\r\n<!-- Использует общий deprecated класс .btn -->\r\n<style>\r\nh3[data-top-popup],\r\ndiv[data-top-popup],\r\ni[data-top-popup]:not(.btn),\r\nb[data-top-popup]:not(.btn) {\r\n\tcursor: pointer;\r\n\tuser-select: none;\r\n\tfont-style: normal;\r\n\ttext-decoration: none;\r\n\tdisplay: inline-flex;\r\n\talign-items: center;\r\n}\r\n\r\n[data-top-popup][data-top-popup-disabled] {\r\n\tpointer-events: none;\r\n\tcursor: auto !important;\r\n}\r\n\r\ni[contenteditable] {\r\n\tcursor: text !important;\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nimport type { Ref } from 'vue';\r\nimport { onUnmounted, ref, toRef } from 'vue';\r\nimport Core from '@/core/core/core';\r\nimport type { Emits, Props } from './popup';\r\nimport Opener from './opener.vue';\r\nimport Worker from '@/components/popup/lib/worker';\r\nimport type PopupClass from '@/components/popup/lib/popup';\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\tid: '',\r\n\tpos: '3',\r\n\tnotch: true,\r\n\tposBy: 'fixed',\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst expose = {\r\n\tpopup: undefined as PopupClass | undefined,\r\n};\r\ndefineExpose(expose);\r\n\r\nconst id = props.id || Math.random() + '';\r\nconst elPopupRef: Ref<null | Element> = ref(null);\r\n\r\n// см. lib/popup\r\nconst onOpen = async (popup: PopupClass) => {\r\n\tif (popup.elPopupInner) {\r\n\t\tpopup.elPopupInner.innerText = '';\r\n\r\n\t\telPopupRef.value = popup.elPopupInner;\r\n\t}\r\n\r\n\tvueConnector.opened = true;\r\n\tvueConnector.popup = popup;\r\n\r\n\texpose.popup = popup;\r\n\r\n\temit('open');\r\n};\r\n\r\n// см. lib/popup\r\nconst onClose = (_popup: PopupClass) => {\r\n\telPopupRef.value = null;\r\n\r\n\tvueConnector.opened = false;\r\n\tvueConnector.popup = undefined;\r\n\r\n\temit('close');\r\n};\r\n\r\nconst vueConnector = {\r\n\tonOpen,\r\n\tonClose,\r\n\tclassRef: toRef(props, 'class'),\r\n\topened: false,\r\n\tpopup: undefined as PopupClass | undefined,\r\n\ttransitionDurationRef: toRef(props, 'transitionDuration'),\r\n};\r\n\r\nWorker.regVueComponent(id, vueConnector);\r\n\r\nonUnmounted(() => {\r\n\tWorker.unregVueComponent(id);\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<Opener\r\n\t\tv-if=\"$slots.opener\"\r\n\t\t:id=\"id\"\r\n\t\t:pos=\"pos\"\r\n\t\t:posBy=\"posBy\"\r\n\t\t:notch=\"notch\"\r\n\t\t:openByHover=\"openByHover\"\r\n\t>\r\n\t\t<!-- @slot элемент для открытия Popup -->\r\n\t\t<slot name=\"opener\"></slot>\r\n\t</Opener>\r\n\r\n\t<!-- Это шаблон для компонента Popup, сам Popup генерируется в js и может находиться где угодно -->\r\n\t<!-- elPopupRef будет установлен только после открытия и будет сброшен сразу после закрытия Popup -->\r\n\t<teleport\r\n\t\tv-if=\"elPopupRef\"\r\n\t\t:to=\"elPopupRef\"\r\n\t>\r\n\t\t<div v-if=\"$slots.header || Core.state.isMobile\" class=\"top-popup_header\">\r\n\t\t\t<span\r\n\t\t\t\tv-if=\"Core.state.isMobile\"\r\n\t\t\t\tclass=\"top-as-a closer\"\r\n\t\t\t>\r\n\t\t\t\t{{ $i18n.Common.Close }}\r\n\t\t\t</span>\r\n\r\n\t\t\t<!-- @slot Шапка -->\r\n\t\t\t<slot name=\"header\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<div v-if=\"$slots.widget\" class=\"top-popup_widget\">\r\n\t\t\t<!-- @slot Виджет -->\r\n\t\t\t<slot name=\"widget\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<div v-if=\"$slots.content\" class=\"top-popup_content\">\r\n\t\t\t<!-- @slot Контент в свободной форме -->\r\n\t\t\t<slot name=\"content\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<ul\r\n\t\t\tv-if=\"$slots.contentList\"\r\n\t\t\tclass=\"top-popup_content\"\r\n\t\t\t@scroll=\"$emit('scrollContentList', $event)\"\r\n\t\t>\r\n\t\t\t<!-- @slot Контент в виде списка, для вставки элементов списка используйте компонент popup/listItem -->\r\n\t\t\t<slot name=\"contentList\"></slot>\r\n\t\t</ul>\r\n\r\n\t\t<div v-if=\"$slots.footer\" class=\"top-popup_footer\">\r\n\t\t\t<!-- @slot Футер -->\r\n\t\t\t<slot name=\"footer\"></slot>\r\n\t\t</div>\r\n\t</teleport>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ListItemProps } from './popup';\r\n\r\ndefineOptions({\r\n\tinheritAttrs: false,\r\n});\r\n\r\nconst props = withDefaults(defineProps<ListItemProps>(), {\r\n\ttype: 'button',\r\n\tcloseByClick: true,\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<li\r\n\t\t:class=\"{\r\n\t\t'top-popup_liNoSelectable': props.type !== 'button'\r\n\t}\"\r\n\t>\r\n\t\t<component\r\n\t\t\t:is=\"$attrs.href ? 'a' : 'div'\"\r\n\t\t\t:class=\"{\r\n\t\t\t\t'top-popup_listItem': true,\r\n\t\t\t\t'top-popup_listItem-button': props.type === 'button', // оформления кнопки\r\n\t\t\t\t'a': props.type === 'button', // оформления кнопки, deprecated\r\n\t\t\t\t'top-popup_listItem-title': props.type === 'title',\r\n\t\t\t\t'top-popup_listItem-delimiter': props.type === 'delimiter',\r\n\t\t\t\t'top-popup-noCloser': !closeByClick\r\n\t\t\t}\"\r\n\t\t\t:=$attrs\r\n\t\t>\r\n\t\t\t<slot></slot>\r\n\t\t</component>\r\n\t</li>\r\n</template>\r\n"],"names":["props","__props","id","elOpener","render","el","renderOpener","onUpdated","elOpener2","emit","__emit","expose","__expose","elPopupRef","ref","vueConnector","popup","_popup","toRef","Worker","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;AAIA,UAAAA,IAAAC,GAMAC,IAAAF,EAAA,MAAA,KAAA,OAAA,IAAA;AAEA,QAAAG;AAOA,aAAAC,EAAAC,GAAA;AACC,iBAAA,MAAA;AACC,QAAAF,IAAAE,EAAA,oBAEAF,KACCG,EAAAH,CAAA;AAAA,MACD,CAAA;AAAA,IACA;AAGF,IAAAI,EAAA,MAAA;AACC,MAAAJ,KACCG,EAAAH,CAAA;AAAA,IACD,CAAA;AAGD,aAAAG,EAAAE,GAAA;AACC,MAAAA,EAAA,QAAA,WAAA,SAAAN,GACAM,EAAA,QAAA,aAAAN,GACAM,EAAA,QAAA,YAAAR,EAAA,KACAQ,EAAA,QAAA,gBAAAR,EAAA,OACAQ,EAAA,QAAA,gBAAAR,EAAA,QAAA,SAAA,IACAQ,EAAA,QAAA,sBAAAR,EAAA,cAAA,SAAA;AAAA,IAAoE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChCrE,UAAAA,IAAAC,GAOAQ,IAAAC,GAEAC,IAAA;AAAA,MAAe,OAAA;AAAA,IACP;AAER,IAAAC,EAAAD,CAAA;AAEA,UAAAT,IAAAF,EAAA,MAAA,KAAA,OAAA,IAAA,IACAa,IAAAC,EAAA,IAAA,GA4BAC,IAAA;AAAA,MAAqB,QAzBrB,OAAAC,MAAA;AACC,QAAAA,EAAA,iBACCA,EAAA,aAAA,YAAA,IAEAH,EAAA,QAAAG,EAAA,eAGDD,EAAA,SAAA,IACAA,EAAA,QAAAC,GAEAL,EAAA,QAAAK,GAEAP,EAAA,MAAA;AAAA,MAAW;AAAA,MAcX,SAVD,CAAAQ,MAAA;AACC,QAAAJ,EAAA,QAAA,MAEAE,EAAA,SAAA,IACAA,EAAA,QAAA,QAEAN,EAAA,OAAA;AAAA,MAAY;AAAA,MAKZ,UAAAS,EAAAlB,GAAA,OAAA;AAAA,MAC8B,QAAA;AAAA,MACtB,OAAA;AAAA,MACD,uBAAAkB,EAAAlB,GAAA,oBAAA;AAAA,IACiD;AAGzD,WAAAmB,EAAA,gBAAAjB,GAAAa,CAAA,GAEAK,EAAA,MAAA;AACC,MAAAD,EAAA,kBAAAjB,CAAA;AAAA,IAA2B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzD5B,UAAAF,IAAAC;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,2 +1,2 @@
1
- define(["require","exports","vue","./forms-oowSA2rF.amd","../popup/worker.amd","../require/css.amd!../assets/listItem.css"],function(S,c,e,d,m){"use strict";if(typeof e>"u")var e=window.Vue;const f=e.defineComponent({__name:"opener",props:{id:{},pos:{default:"3"},notch:{type:Boolean,default:!0},openByHover:{type:Boolean},posBy:{default:"fixed"}},setup(l){const n=l,s=n.id||Math.random()+"";let p;function i(t){setTimeout(()=>{p=t.nextElementSibling,p&&r(p)})}e.onUpdated(()=>{p&&r(p)});function r(t){t.dataset.topPopup="vue-"+s,t.dataset.topPopupId=s,t.dataset.topPopupP=n.pos,t.dataset.topPopupPosBy=n.posBy,t.dataset.topPopupNotch=n.notch?"true":"",t.dataset.topPopupOpenByHover=n.openByHover?"true":""}return(t,a)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("template",{ref:i}),e.renderSlot(t.$slots,"default")],64))}}),y={key:0,class:"top-popup_header"},k={key:0,class:"top-as-a closer"},C={key:1,class:"top-popup_widget"},v={key:2,class:"top-popup_content"},h={key:4,class:"top-popup_footer"},$=e.defineComponent({__name:"popup",props:{id:{default:""},class:{},transitionDuration:{},pos:{default:"3"},notch:{type:Boolean,default:!0},openByHover:{type:Boolean},posBy:{default:"fixed"}},emits:["open","close","scrollContentList"],setup(l,{expose:n,emit:s}){const p=l,i=s,r={popup:void 0};n(r);const t=p.id||Math.random()+"",a=e.ref(null),u={onOpen:async o=>{o.elPopupInner&&(o.elPopupInner.innerText="",a.value=o.elPopupInner),u.opened=!0,u.popup=o,r.popup=o,i("open")},onClose:o=>{a.value=null,u.opened=!1,u.popup=void 0,i("close")},classRef:e.toRef(p,"class"),opened:!1,popup:void 0,transitionDurationRef:e.toRef(p,"transitionDuration")};return m.TopPopupWorker.regVueComponent(t,u),e.onUnmounted(()=>{m.TopPopupWorker.unregVueComponent(t)}),(o,B)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[o.$slots.opener?(e.openBlock(),e.createBlock(f,{key:0,id:e.unref(t),pos:o.pos,posBy:o.posBy,notch:o.notch,openByHover:o.openByHover},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"opener")]),_:3},8,["id","pos","posBy","notch","openByHover"])):e.createCommentVNode("",!0),a.value?(e.openBlock(),e.createBlock(e.Teleport,{key:1,to:a.value},[o.$slots.header||e.unref(d.Core).state.isMobile?(e.openBlock(),e.createElementBlock("div",y,[e.unref(d.Core).state.isMobile?(e.openBlock(),e.createElementBlock("span",k,e.toDisplayString(o.$i18n.Common.Close),1)):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"header")])):e.createCommentVNode("",!0),o.$slots.widget?(e.openBlock(),e.createElementBlock("div",C,[e.renderSlot(o.$slots,"widget")])):e.createCommentVNode("",!0),o.$slots.content?(e.openBlock(),e.createElementBlock("div",v,[e.renderSlot(o.$slots,"content")])):e.createCommentVNode("",!0),o.$slots.contentList?(e.openBlock(),e.createElementBlock("ul",{key:3,class:"top-popup_content",onScroll:B[0]||(B[0]=P=>o.$emit("scrollContentList",P))},[e.renderSlot(o.$slots,"contentList")],32)):e.createCommentVNode("",!0),o.$slots.footer?(e.openBlock(),e.createElementBlock("div",h,[e.renderSlot(o.$slots,"footer")])):e.createCommentVNode("",!0)],8,["to"])):e.createCommentVNode("",!0)],64))}}),_=e.defineComponent({inheritAttrs:!1,__name:"listItem",props:{type:{default:"button"},closeByClick:{type:Boolean,default:!0}},setup(l){const n=l;return(s,p)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass({"top-popup_liNoSelectable":n.type!=="button"})},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(s.$attrs.href?"a":"div"),e.mergeProps({class:{"top-popup_listItem":!0,"top-popup_listItem-button":n.type==="button",a:n.type==="button","top-popup_listItem-title":n.type==="title","top-popup_listItem-delimiter":n.type==="delimiter","top-popup-noCloser":!s.closeByClick}},s.$attrs),{default:e.withCtx(()=>[e.renderSlot(s.$slots,"default")]),_:3},16,["class"]))],2))}});c._sfc_main=$,c._sfc_main$1=_,c._sfc_main$2=f});
2
- //# sourceMappingURL=listItem.vue_vue_type_script_setup_true_lang-CkZHzNZU.amd.js.map
1
+ define(["require","exports","vue","./forms-CWbjHcxY.amd","../popup/worker.amd","../require/css.amd!../assets/listItem.css"],function(S,c,e,d,m){"use strict";if(typeof e>"u")var e=window.Vue;const f=e.defineComponent({__name:"opener",props:{id:{},pos:{default:"3"},notch:{type:Boolean,default:!0},openByHover:{type:Boolean},posBy:{default:"fixed"}},setup(l){const n=l,s=n.id||Math.random()+"";let p;function i(t){setTimeout(()=>{p=t.nextElementSibling,p&&r(p)})}e.onUpdated(()=>{p&&r(p)});function r(t){t.dataset.topPopup="vue-"+s,t.dataset.topPopupId=s,t.dataset.topPopupP=n.pos,t.dataset.topPopupPosBy=n.posBy,t.dataset.topPopupNotch=n.notch?"true":"",t.dataset.topPopupOpenByHover=n.openByHover?"true":""}return(t,a)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("template",{ref:i}),e.renderSlot(t.$slots,"default")],64))}}),y={key:0,class:"top-popup_header"},k={key:0,class:"top-as-a closer"},C={key:1,class:"top-popup_widget"},v={key:2,class:"top-popup_content"},h={key:4,class:"top-popup_footer"},$=e.defineComponent({__name:"popup",props:{id:{default:""},class:{},transitionDuration:{},pos:{default:"3"},notch:{type:Boolean,default:!0},openByHover:{type:Boolean},posBy:{default:"fixed"}},emits:["open","close","scrollContentList"],setup(l,{expose:n,emit:s}){const p=l,i=s,r={popup:void 0};n(r);const t=p.id||Math.random()+"",a=e.ref(null),u={onOpen:async o=>{o.elPopupInner&&(o.elPopupInner.innerText="",a.value=o.elPopupInner),u.opened=!0,u.popup=o,r.popup=o,i("open")},onClose:o=>{a.value=null,u.opened=!1,u.popup=void 0,i("close")},classRef:e.toRef(p,"class"),opened:!1,popup:void 0,transitionDurationRef:e.toRef(p,"transitionDuration")};return m.TopPopupWorker.regVueComponent(t,u),e.onUnmounted(()=>{m.TopPopupWorker.unregVueComponent(t)}),(o,B)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[o.$slots.opener?(e.openBlock(),e.createBlock(f,{key:0,id:e.unref(t),pos:o.pos,posBy:o.posBy,notch:o.notch,openByHover:o.openByHover},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"opener")]),_:3},8,["id","pos","posBy","notch","openByHover"])):e.createCommentVNode("",!0),a.value?(e.openBlock(),e.createBlock(e.Teleport,{key:1,to:a.value},[o.$slots.header||e.unref(d.Core).state.isMobile?(e.openBlock(),e.createElementBlock("div",y,[e.unref(d.Core).state.isMobile?(e.openBlock(),e.createElementBlock("span",k,e.toDisplayString(o.$i18n.Common.Close),1)):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"header")])):e.createCommentVNode("",!0),o.$slots.widget?(e.openBlock(),e.createElementBlock("div",C,[e.renderSlot(o.$slots,"widget")])):e.createCommentVNode("",!0),o.$slots.content?(e.openBlock(),e.createElementBlock("div",v,[e.renderSlot(o.$slots,"content")])):e.createCommentVNode("",!0),o.$slots.contentList?(e.openBlock(),e.createElementBlock("ul",{key:3,class:"top-popup_content",onScroll:B[0]||(B[0]=P=>o.$emit("scrollContentList",P))},[e.renderSlot(o.$slots,"contentList")],32)):e.createCommentVNode("",!0),o.$slots.footer?(e.openBlock(),e.createElementBlock("div",h,[e.renderSlot(o.$slots,"footer")])):e.createCommentVNode("",!0)],8,["to"])):e.createCommentVNode("",!0)],64))}}),_=e.defineComponent({inheritAttrs:!1,__name:"listItem",props:{type:{default:"button"},closeByClick:{type:Boolean,default:!0}},setup(l){const n=l;return(s,p)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass({"top-popup_liNoSelectable":n.type!=="button"})},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(s.$attrs.href?"a":"div"),e.mergeProps({class:{"top-popup_listItem":!0,"top-popup_listItem-button":n.type==="button",a:n.type==="button","top-popup_listItem-title":n.type==="title","top-popup_listItem-delimiter":n.type==="delimiter","top-popup-noCloser":!s.closeByClick}},s.$attrs),{default:e.withCtx(()=>[e.renderSlot(s.$slots,"default")]),_:3},16,["class"]))],2))}});c._sfc_main=$,c._sfc_main$1=_,c._sfc_main$2=f});
2
+ //# sourceMappingURL=listItem.vue_vue_type_script_setup_true_lang-Cm2JuYsV.amd.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"listItem.vue_vue_type_script_setup_true_lang-CkZHzNZU.amd.js","sources":["../../src/components/popup/popup/opener.vue","../../src/components/popup/popup/popup.vue","../../src/components/popup/popup/listItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { onUpdated } from 'vue';\r\nimport type { OpenerProps } from './popup';\r\n\r\nconst props = withDefaults(defineProps<OpenerProps>(), {\r\n\tpos: '3',\r\n\tnotch: true,\r\n\tposBy: 'fixed',\r\n});\r\n\r\nconst id = props.id || Math.random() + '';\r\n\r\nlet elOpener: Element;\r\n\r\n/**\r\n * Необычная функция для проброски props внтурь элемента слота\r\n *\r\n * @param el - вспомогательрный элемент для доступа к элементам слота\r\n */\r\nfunction render(el: any) {\r\n\tsetTimeout(() => {\r\n\t\telOpener = el.nextElementSibling;\r\n\r\n\t\tif (elOpener) {\r\n\t\t\trenderOpener(elOpener);\r\n\t\t}\r\n\t});\r\n}\r\n\r\nonUpdated(() => {\r\n\tif (elOpener) {\r\n\t\trenderOpener(elOpener);\r\n\t}\r\n});\r\n\r\nfunction renderOpener(elOpener: any) {\r\n\telOpener.dataset.topPopup = 'vue-' + id;\r\n\telOpener.dataset.topPopupId = id;\r\n\telOpener.dataset.topPopupP = props.pos;\r\n\telOpener.dataset.topPopupPosBy = props.posBy;\r\n\telOpener.dataset.topPopupNotch = props.notch ? 'true' : '';\r\n\telOpener.dataset.topPopupOpenByHover = props.openByHover ? 'true' : '';\r\n}\r\n</script>\r\n\r\n<template>\r\n\t<template :ref=\"render\"></template>\r\n\r\n\t<!-- @slot элемент для открытия Popup -->\r\n\t<slot></slot>\r\n</template>\r\n\r\n<!-- Использует общий deprecated класс .btn -->\r\n<style>\r\nh3[data-top-popup],\r\ndiv[data-top-popup],\r\ni[data-top-popup]:not(.btn),\r\nb[data-top-popup]:not(.btn) {\r\n\tcursor: pointer;\r\n\tuser-select: none;\r\n\tfont-style: normal;\r\n\ttext-decoration: none;\r\n\tdisplay: inline-flex;\r\n\talign-items: center;\r\n}\r\n\r\n[data-top-popup][data-top-popup-disabled] {\r\n\tpointer-events: none;\r\n\tcursor: auto !important;\r\n}\r\n\r\ni[contenteditable] {\r\n\tcursor: text !important;\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nimport type { Ref } from 'vue';\r\nimport { onUnmounted, ref, toRef } from 'vue';\r\nimport Core from '@/core/core/core';\r\nimport type { Emits, Props } from './popup';\r\nimport Opener from './opener.vue';\r\nimport Worker from '@/components/popup/lib/worker';\r\nimport type PopupClass from '@/components/popup/lib/popup';\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\tid: '',\r\n\tpos: '3',\r\n\tnotch: true,\r\n\tposBy: 'fixed',\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst expose = {\r\n\tpopup: undefined as PopupClass | undefined,\r\n};\r\ndefineExpose(expose);\r\n\r\nconst id = props.id || Math.random() + '';\r\nconst elPopupRef: Ref<null | Element> = ref(null);\r\n\r\n// см. lib/popup\r\nconst onOpen = async (popup: PopupClass) => {\r\n\tif (popup.elPopupInner) {\r\n\t\tpopup.elPopupInner.innerText = '';\r\n\r\n\t\telPopupRef.value = popup.elPopupInner;\r\n\t}\r\n\r\n\tvueConnector.opened = true;\r\n\tvueConnector.popup = popup;\r\n\r\n\texpose.popup = popup;\r\n\r\n\temit('open');\r\n};\r\n\r\n// см. lib/popup\r\nconst onClose = (_popup: PopupClass) => {\r\n\telPopupRef.value = null;\r\n\r\n\tvueConnector.opened = false;\r\n\tvueConnector.popup = undefined;\r\n\r\n\temit('close');\r\n};\r\n\r\nconst vueConnector = {\r\n\tonOpen,\r\n\tonClose,\r\n\tclassRef: toRef(props, 'class'),\r\n\topened: false,\r\n\tpopup: undefined as PopupClass | undefined,\r\n\ttransitionDurationRef: toRef(props, 'transitionDuration'),\r\n};\r\n\r\nWorker.regVueComponent(id, vueConnector);\r\n\r\nonUnmounted(() => {\r\n\tWorker.unregVueComponent(id);\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<Opener\r\n\t\tv-if=\"$slots.opener\"\r\n\t\t:id=\"id\"\r\n\t\t:pos=\"pos\"\r\n\t\t:posBy=\"posBy\"\r\n\t\t:notch=\"notch\"\r\n\t\t:openByHover=\"openByHover\"\r\n\t>\r\n\t\t<!-- @slot элемент для открытия Popup -->\r\n\t\t<slot name=\"opener\"></slot>\r\n\t</Opener>\r\n\r\n\t<!-- Это шаблон для компонента Popup, сам Popup генерируется в js и может находиться где угодно -->\r\n\t<!-- elPopupRef будет установлен только после открытия и будет сброшен сразу после закрытия Popup -->\r\n\t<teleport\r\n\t\tv-if=\"elPopupRef\"\r\n\t\t:to=\"elPopupRef\"\r\n\t>\r\n\t\t<div v-if=\"$slots.header || Core.state.isMobile\" class=\"top-popup_header\">\r\n\t\t\t<span\r\n\t\t\t\tv-if=\"Core.state.isMobile\"\r\n\t\t\t\tclass=\"top-as-a closer\"\r\n\t\t\t>\r\n\t\t\t\t{{ $i18n.Common.Close }}\r\n\t\t\t</span>\r\n\r\n\t\t\t<!-- @slot Шапка -->\r\n\t\t\t<slot name=\"header\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<div v-if=\"$slots.widget\" class=\"top-popup_widget\">\r\n\t\t\t<!-- @slot Виджет -->\r\n\t\t\t<slot name=\"widget\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<div v-if=\"$slots.content\" class=\"top-popup_content\">\r\n\t\t\t<!-- @slot Контент в свободной форме -->\r\n\t\t\t<slot name=\"content\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<ul\r\n\t\t\tv-if=\"$slots.contentList\"\r\n\t\t\tclass=\"top-popup_content\"\r\n\t\t\t@scroll=\"$emit('scrollContentList', $event)\"\r\n\t\t>\r\n\t\t\t<!-- @slot Контент в виде списка, для вставки элементов списка используйте компонент popup/listItem -->\r\n\t\t\t<slot name=\"contentList\"></slot>\r\n\t\t</ul>\r\n\r\n\t\t<div v-if=\"$slots.footer\" class=\"top-popup_footer\">\r\n\t\t\t<!-- @slot Футер -->\r\n\t\t\t<slot name=\"footer\"></slot>\r\n\t\t</div>\r\n\t</teleport>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ListItemProps } from './popup';\r\n\r\ndefineOptions({\r\n\tinheritAttrs: false,\r\n});\r\n\r\nconst props = withDefaults(defineProps<ListItemProps>(), {\r\n\ttype: 'button',\r\n\tcloseByClick: true,\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<li\r\n\t\t:class=\"{\r\n\t\t'top-popup_liNoSelectable': props.type !== 'button'\r\n\t}\"\r\n\t>\r\n\t\t<component\r\n\t\t\t:is=\"$attrs.href ? 'a' : 'div'\"\r\n\t\t\t:class=\"{\r\n\t\t\t\t'top-popup_listItem': true,\r\n\t\t\t\t'top-popup_listItem-button': props.type === 'button', // оформления кнопки\r\n\t\t\t\t'a': props.type === 'button', // оформления кнопки, deprecated\r\n\t\t\t\t'top-popup_listItem-title': props.type === 'title',\r\n\t\t\t\t'top-popup_listItem-delimiter': props.type === 'delimiter',\r\n\t\t\t\t'top-popup-noCloser': !closeByClick\r\n\t\t\t}\"\r\n\t\t\t:=$attrs\r\n\t\t>\r\n\t\t\t<slot></slot>\r\n\t\t</component>\r\n\t</li>\r\n</template>\r\n"],"names":["props","__props","id","render","el","elOpener","renderOpener","elOpener2","emit","__emit","__expose","expose","elPopupRef","vue","popup","vueConnector","_popup","popup_worker"],"mappings":"qWAIA,MAAAA,EAAAC,EAMAC,EAAAF,EAAA,IAAA,KAAA,OAAA,EAAA,SASA,SAAAG,EAAAC,EAAA,iBAEEC,EAAAD,EAAA,sBAGCE,EAAAD,CAAA,CACD,CAAA,sBAMAC,EAAAD,CAAA,CACD,CAAA,EAGD,SAAAC,EAAAC,EAAA,6BAECA,EAAA,QAAA,WAAAL,4DAGAK,EAAA,QAAA,cAAAP,EAAA,MAAA,OAAA,GACAO,EAAA,QAAA,oBAAAP,EAAA,YAAA,OAAA,6kBChCD,MAAAA,EAAAC,EAOAO,EAAAC,iBAGQ,EAERC,EAAAC,CAAA,EAEA,MAAAT,EAAAF,EAAA,IAAA,KAAA,OAAA,EAAA,GACAY,EAAAC,EAAA,IAAA,IAAA,KA4BqB,OAzBrB,MAAAC,GAAA,CACCA,EAAA,eACCA,EAAA,aAAA,UAAA,GAEAF,EAAA,MAAAE,EAAA,cAGDC,EAAA,OAAA,GACAA,EAAA,MAAAD,EAEAH,EAAA,MAAAG,EAEAN,EAAA,MAAA,CAAW,EAcX,QAVDQ,GAAA,CACCJ,EAAA,MAAA,KAEAG,EAAA,OAAA,GACAA,EAAA,MAAA,OAEAP,EAAA,OAAA,CAAY,EAKZ,SAAAK,EAAA,MAAAb,EAAA,OAAA,yBAGO,sBAAAa,EAAA,MAAAb,EAAA,oBAAA,CACiD,kEAMxDiB,EAAA,eAAA,kBAAAf,CAAA,CAA2B,CAAA,+8CCzD5B,MAAAF,EAAAC"}
1
+ {"version":3,"file":"listItem.vue_vue_type_script_setup_true_lang-Cm2JuYsV.amd.js","sources":["../../src/components/popup/popup/opener.vue","../../src/components/popup/popup/popup.vue","../../src/components/popup/popup/listItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { onUpdated } from 'vue';\r\nimport type { OpenerProps } from './popup';\r\n\r\nconst props = withDefaults(defineProps<OpenerProps>(), {\r\n\tpos: '3',\r\n\tnotch: true,\r\n\tposBy: 'fixed',\r\n});\r\n\r\nconst id = props.id || Math.random() + '';\r\n\r\nlet elOpener: Element;\r\n\r\n/**\r\n * Необычная функция для проброски props внтурь элемента слота\r\n *\r\n * @param el - вспомогательрный элемент для доступа к элементам слота\r\n */\r\nfunction render(el: any) {\r\n\tsetTimeout(() => {\r\n\t\telOpener = el.nextElementSibling;\r\n\r\n\t\tif (elOpener) {\r\n\t\t\trenderOpener(elOpener);\r\n\t\t}\r\n\t});\r\n}\r\n\r\nonUpdated(() => {\r\n\tif (elOpener) {\r\n\t\trenderOpener(elOpener);\r\n\t}\r\n});\r\n\r\nfunction renderOpener(elOpener: any) {\r\n\telOpener.dataset.topPopup = 'vue-' + id;\r\n\telOpener.dataset.topPopupId = id;\r\n\telOpener.dataset.topPopupP = props.pos;\r\n\telOpener.dataset.topPopupPosBy = props.posBy;\r\n\telOpener.dataset.topPopupNotch = props.notch ? 'true' : '';\r\n\telOpener.dataset.topPopupOpenByHover = props.openByHover ? 'true' : '';\r\n}\r\n</script>\r\n\r\n<template>\r\n\t<template :ref=\"render\"></template>\r\n\r\n\t<!-- @slot элемент для открытия Popup -->\r\n\t<slot></slot>\r\n</template>\r\n\r\n<!-- Использует общий deprecated класс .btn -->\r\n<style>\r\nh3[data-top-popup],\r\ndiv[data-top-popup],\r\ni[data-top-popup]:not(.btn),\r\nb[data-top-popup]:not(.btn) {\r\n\tcursor: pointer;\r\n\tuser-select: none;\r\n\tfont-style: normal;\r\n\ttext-decoration: none;\r\n\tdisplay: inline-flex;\r\n\talign-items: center;\r\n}\r\n\r\n[data-top-popup][data-top-popup-disabled] {\r\n\tpointer-events: none;\r\n\tcursor: auto !important;\r\n}\r\n\r\ni[contenteditable] {\r\n\tcursor: text !important;\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nimport type { Ref } from 'vue';\r\nimport { onUnmounted, ref, toRef } from 'vue';\r\nimport Core from '@/core/core/core';\r\nimport type { Emits, Props } from './popup';\r\nimport Opener from './opener.vue';\r\nimport Worker from '@/components/popup/lib/worker';\r\nimport type PopupClass from '@/components/popup/lib/popup';\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\tid: '',\r\n\tpos: '3',\r\n\tnotch: true,\r\n\tposBy: 'fixed',\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst expose = {\r\n\tpopup: undefined as PopupClass | undefined,\r\n};\r\ndefineExpose(expose);\r\n\r\nconst id = props.id || Math.random() + '';\r\nconst elPopupRef: Ref<null | Element> = ref(null);\r\n\r\n// см. lib/popup\r\nconst onOpen = async (popup: PopupClass) => {\r\n\tif (popup.elPopupInner) {\r\n\t\tpopup.elPopupInner.innerText = '';\r\n\r\n\t\telPopupRef.value = popup.elPopupInner;\r\n\t}\r\n\r\n\tvueConnector.opened = true;\r\n\tvueConnector.popup = popup;\r\n\r\n\texpose.popup = popup;\r\n\r\n\temit('open');\r\n};\r\n\r\n// см. lib/popup\r\nconst onClose = (_popup: PopupClass) => {\r\n\telPopupRef.value = null;\r\n\r\n\tvueConnector.opened = false;\r\n\tvueConnector.popup = undefined;\r\n\r\n\temit('close');\r\n};\r\n\r\nconst vueConnector = {\r\n\tonOpen,\r\n\tonClose,\r\n\tclassRef: toRef(props, 'class'),\r\n\topened: false,\r\n\tpopup: undefined as PopupClass | undefined,\r\n\ttransitionDurationRef: toRef(props, 'transitionDuration'),\r\n};\r\n\r\nWorker.regVueComponent(id, vueConnector);\r\n\r\nonUnmounted(() => {\r\n\tWorker.unregVueComponent(id);\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<Opener\r\n\t\tv-if=\"$slots.opener\"\r\n\t\t:id=\"id\"\r\n\t\t:pos=\"pos\"\r\n\t\t:posBy=\"posBy\"\r\n\t\t:notch=\"notch\"\r\n\t\t:openByHover=\"openByHover\"\r\n\t>\r\n\t\t<!-- @slot элемент для открытия Popup -->\r\n\t\t<slot name=\"opener\"></slot>\r\n\t</Opener>\r\n\r\n\t<!-- Это шаблон для компонента Popup, сам Popup генерируется в js и может находиться где угодно -->\r\n\t<!-- elPopupRef будет установлен только после открытия и будет сброшен сразу после закрытия Popup -->\r\n\t<teleport\r\n\t\tv-if=\"elPopupRef\"\r\n\t\t:to=\"elPopupRef\"\r\n\t>\r\n\t\t<div v-if=\"$slots.header || Core.state.isMobile\" class=\"top-popup_header\">\r\n\t\t\t<span\r\n\t\t\t\tv-if=\"Core.state.isMobile\"\r\n\t\t\t\tclass=\"top-as-a closer\"\r\n\t\t\t>\r\n\t\t\t\t{{ $i18n.Common.Close }}\r\n\t\t\t</span>\r\n\r\n\t\t\t<!-- @slot Шапка -->\r\n\t\t\t<slot name=\"header\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<div v-if=\"$slots.widget\" class=\"top-popup_widget\">\r\n\t\t\t<!-- @slot Виджет -->\r\n\t\t\t<slot name=\"widget\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<div v-if=\"$slots.content\" class=\"top-popup_content\">\r\n\t\t\t<!-- @slot Контент в свободной форме -->\r\n\t\t\t<slot name=\"content\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<ul\r\n\t\t\tv-if=\"$slots.contentList\"\r\n\t\t\tclass=\"top-popup_content\"\r\n\t\t\t@scroll=\"$emit('scrollContentList', $event)\"\r\n\t\t>\r\n\t\t\t<!-- @slot Контент в виде списка, для вставки элементов списка используйте компонент popup/listItem -->\r\n\t\t\t<slot name=\"contentList\"></slot>\r\n\t\t</ul>\r\n\r\n\t\t<div v-if=\"$slots.footer\" class=\"top-popup_footer\">\r\n\t\t\t<!-- @slot Футер -->\r\n\t\t\t<slot name=\"footer\"></slot>\r\n\t\t</div>\r\n\t</teleport>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ListItemProps } from './popup';\r\n\r\ndefineOptions({\r\n\tinheritAttrs: false,\r\n});\r\n\r\nconst props = withDefaults(defineProps<ListItemProps>(), {\r\n\ttype: 'button',\r\n\tcloseByClick: true,\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<li\r\n\t\t:class=\"{\r\n\t\t'top-popup_liNoSelectable': props.type !== 'button'\r\n\t}\"\r\n\t>\r\n\t\t<component\r\n\t\t\t:is=\"$attrs.href ? 'a' : 'div'\"\r\n\t\t\t:class=\"{\r\n\t\t\t\t'top-popup_listItem': true,\r\n\t\t\t\t'top-popup_listItem-button': props.type === 'button', // оформления кнопки\r\n\t\t\t\t'a': props.type === 'button', // оформления кнопки, deprecated\r\n\t\t\t\t'top-popup_listItem-title': props.type === 'title',\r\n\t\t\t\t'top-popup_listItem-delimiter': props.type === 'delimiter',\r\n\t\t\t\t'top-popup-noCloser': !closeByClick\r\n\t\t\t}\"\r\n\t\t\t:=$attrs\r\n\t\t>\r\n\t\t\t<slot></slot>\r\n\t\t</component>\r\n\t</li>\r\n</template>\r\n"],"names":["props","__props","id","render","el","elOpener","renderOpener","elOpener2","emit","__emit","__expose","expose","elPopupRef","vue","popup","vueConnector","_popup","popup_worker"],"mappings":"qWAIA,MAAAA,EAAAC,EAMAC,EAAAF,EAAA,IAAA,KAAA,OAAA,EAAA,SASA,SAAAG,EAAAC,EAAA,iBAEEC,EAAAD,EAAA,sBAGCE,EAAAD,CAAA,CACD,CAAA,sBAMAC,EAAAD,CAAA,CACD,CAAA,EAGD,SAAAC,EAAAC,EAAA,6BAECA,EAAA,QAAA,WAAAL,4DAGAK,EAAA,QAAA,cAAAP,EAAA,MAAA,OAAA,GACAO,EAAA,QAAA,oBAAAP,EAAA,YAAA,OAAA,6kBChCD,MAAAA,EAAAC,EAOAO,EAAAC,iBAGQ,EAERC,EAAAC,CAAA,EAEA,MAAAT,EAAAF,EAAA,IAAA,KAAA,OAAA,EAAA,GACAY,EAAAC,EAAA,IAAA,IAAA,KA4BqB,OAzBrB,MAAAC,GAAA,CACCA,EAAA,eACCA,EAAA,aAAA,UAAA,GAEAF,EAAA,MAAAE,EAAA,cAGDC,EAAA,OAAA,GACAA,EAAA,MAAAD,EAEAH,EAAA,MAAAG,EAEAN,EAAA,MAAA,CAAW,EAcX,QAVDQ,GAAA,CACCJ,EAAA,MAAA,KAEAG,EAAA,OAAA,GACAA,EAAA,MAAA,OAEAP,EAAA,OAAA,CAAY,EAKZ,SAAAK,EAAA,MAAAb,EAAA,OAAA,yBAGO,sBAAAa,EAAA,MAAAb,EAAA,oBAAA,CACiD,kEAMxDiB,EAAA,eAAA,kBAAAf,CAAA,CAA2B,CAAA,+8CCzD5B,MAAAF,EAAAC"}
@@ -1,2 +1,2 @@
1
- define(["require","exports","vue","./forms-oowSA2rF.amd","../require/css.amd!../assets/menu.css"],function(L,m,e,u){"use strict";if(typeof e>"u")var e=window.Vue;const y={key:0,class:"top-menu_selectAll"},g=e.defineComponent({__name:"menu",props:e.mergeModels({modelValue:{},items:{},isMultiple:{type:Boolean},canBeEmptyMultiple:{type:Boolean},styling:{default:"default"},selectAllItem:{}},{modelValue:{required:!0},modelModifiers:{}}),emits:["update:modelValue"],setup(f){const s=f,o=e.useModel(f,"modelValue"),a=e.ref();!s.isMultiple&&!(typeof o.value=="string"||o.value instanceof String)&&console.warn('Type check failed for prop "modelValue". Expected String: '+typeof o.value),s.isMultiple&&!Array.isArray(o.value)&&console.warn('Type check failed for prop "modelValue". Expected Array: '+typeof o.value),s.isMultiple&&!s.canBeEmptyMultiple&&Array.isArray(o.value)&&!o.value.length&&(o.value=[s.items[0].href??s.items[0].value]);const M=t=>Array.isArray(o.value)?o.value.includes(t.value):t.value===o.value,k=(t,n=!1)=>{if(Array.isArray(o.value)){let l=o.value.slice();if(n){l.length||(l=s.items.map(c=>c.value));const r=l.indexOf(t.value);r===-1?l.push(t.value):l.splice(r,1)}else l.length===1&&l[0]===t.value?l=[]:l=[t.value];!s.canBeEmptyMultiple&&!l.length&&(l=[t.value]),o.value=l;return}o.value=t.value},B=t=>{if(a.value.scrollWidth<=a.value.offsetWidth||t.shiftKey||Math.abs(t.deltaY)<50)return;t.preventDefault();const n=t.deltaY>0?30:-30;a.value.scrollLeft=a.value.scrollLeft+n},p=(t=!0)=>{var v,d;const n=a.value.querySelector(".top-active");if(!n)return;const l=24,r=n.offsetLeft-a.value.offsetLeft-l,c=n.offsetLeft-a.value.offsetLeft+n.clientWidth+l,V=a.value.scrollLeft,w=a.value.clientWidth+a.value.scrollLeft;let i;r<V&&(i=r),c>w&&(i=c-a.value.clientWidth),i!==void 0&&(u.isSafari()?(d=(v=u.Core).$)==null||d.call(v,a.value).animate({scrollLeft:i},t?200:0):a.value.scrollTo({left:i,behavior:t?"smooth":"auto"}))},_=()=>{if(Array.isArray(o.value)){if(o.value.length===s.items.length){o.value=[s.items[0].href??s.items[0].value];return}o.value=s.items.map(t=>t.href??t.value)}};return e.onMounted(()=>p(!1)),e.onUpdated(()=>p(!0)),(t,n)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"el",ref:a,class:e.normalizeClass({"top-menu":!0,["top-style_"+t.styling]:!0,"top-unwrap-x":t.styling==="default"}),onWheel:B},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.items,l=>(e.openBlock(),e.createBlock(u.TopButton,e.mergeProps({ref_for:!0},l,{class:"top-menu_item",color:"theme",styling:"",onClick:r=>k(l,r.ctrlKey),isActive:M(l)}),e.createSlots({_:2},[l.content?{name:"default",fn:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(l.content),1)]),key:"0"}:void 0]),1040,["onClick","isActive"]))),256)),Array.isArray(o.value)&&t.selectAllItem?(e.openBlock(),e.createElementBlock("div",y,[e.createVNode(u.TopButton,e.mergeProps(t.selectAllItem,{class:"top-menu_item",color:"theme",styling:"",onClick:n[0]||(n[0]=l=>_()),isActive:o.value.length===t.items.length}),e.createSlots({_:2},[t.selectAllItem.content?{name:"default",fn:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.selectAllItem.content),1)]),key:"0"}:void 0]),1040,["isActive"])])):e.createCommentVNode("",!0)],34))}}),h={$style:{"top-menu":"top-menu","top-menu_item":"top-menu_item","top-menu_selectAll":"top-menu_selectAll","top-style_default":"top-style_default","top-active":"top-active","top-style_bar":"top-style_bar","top-unwrap-x":"top-unwrap-x"}},A=u._export_sfc(g,[["__cssModules",h]]);m.Menu=A});
2
- //# sourceMappingURL=menu-SmyeSNWQ.amd.js.map
1
+ define(["require","exports","vue","./forms-CWbjHcxY.amd","../require/css.amd!../assets/menu.css"],function(L,m,e,u){"use strict";if(typeof e>"u")var e=window.Vue;const y={key:0,class:"top-menu_selectAll"},g=e.defineComponent({__name:"menu",props:e.mergeModels({modelValue:{},items:{},isMultiple:{type:Boolean},canBeEmptyMultiple:{type:Boolean},styling:{default:"default"},selectAllItem:{}},{modelValue:{required:!0},modelModifiers:{}}),emits:["update:modelValue"],setup(f){const s=f,o=e.useModel(f,"modelValue"),a=e.ref();!s.isMultiple&&!(typeof o.value=="string"||o.value instanceof String)&&console.warn('Type check failed for prop "modelValue". Expected String: '+typeof o.value),s.isMultiple&&!Array.isArray(o.value)&&console.warn('Type check failed for prop "modelValue". Expected Array: '+typeof o.value),s.isMultiple&&!s.canBeEmptyMultiple&&Array.isArray(o.value)&&!o.value.length&&(o.value=[s.items[0].href??s.items[0].value]);const M=t=>Array.isArray(o.value)?o.value.includes(t.value):t.value===o.value,k=(t,n=!1)=>{if(Array.isArray(o.value)){let l=o.value.slice();if(n){l.length||(l=s.items.map(c=>c.value));const r=l.indexOf(t.value);r===-1?l.push(t.value):l.splice(r,1)}else l.length===1&&l[0]===t.value?l=[]:l=[t.value];!s.canBeEmptyMultiple&&!l.length&&(l=[t.value]),o.value=l;return}o.value=t.value},B=t=>{if(a.value.scrollWidth<=a.value.offsetWidth||t.shiftKey||Math.abs(t.deltaY)<50)return;t.preventDefault();const n=t.deltaY>0?30:-30;a.value.scrollLeft=a.value.scrollLeft+n},p=(t=!0)=>{var v,d;const n=a.value.querySelector(".top-active");if(!n)return;const l=24,r=n.offsetLeft-a.value.offsetLeft-l,c=n.offsetLeft-a.value.offsetLeft+n.clientWidth+l,V=a.value.scrollLeft,w=a.value.clientWidth+a.value.scrollLeft;let i;r<V&&(i=r),c>w&&(i=c-a.value.clientWidth),i!==void 0&&(u.isSafari()?(d=(v=u.Core).$)==null||d.call(v,a.value).animate({scrollLeft:i},t?200:0):a.value.scrollTo({left:i,behavior:t?"smooth":"auto"}))},_=()=>{if(Array.isArray(o.value)){if(o.value.length===s.items.length){o.value=[s.items[0].href??s.items[0].value];return}o.value=s.items.map(t=>t.href??t.value)}};return e.onMounted(()=>p(!1)),e.onUpdated(()=>p(!0)),(t,n)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"el",ref:a,class:e.normalizeClass({"top-menu":!0,["top-style_"+t.styling]:!0,"top-unwrap-x":t.styling==="default"}),onWheel:B},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.items,l=>(e.openBlock(),e.createBlock(u.TopButton,e.mergeProps({ref_for:!0},l,{class:"top-menu_item",color:"theme",styling:"",onClick:r=>k(l,r.ctrlKey),isActive:M(l)}),e.createSlots({_:2},[l.content?{name:"default",fn:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(l.content),1)]),key:"0"}:void 0]),1040,["onClick","isActive"]))),256)),Array.isArray(o.value)&&t.selectAllItem?(e.openBlock(),e.createElementBlock("div",y,[e.createVNode(u.TopButton,e.mergeProps(t.selectAllItem,{class:"top-menu_item",color:"theme",styling:"",onClick:n[0]||(n[0]=l=>_()),isActive:o.value.length===t.items.length}),e.createSlots({_:2},[t.selectAllItem.content?{name:"default",fn:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.selectAllItem.content),1)]),key:"0"}:void 0]),1040,["isActive"])])):e.createCommentVNode("",!0)],34))}}),h={$style:{"top-menu":"top-menu","top-menu_item":"top-menu_item","top-menu_selectAll":"top-menu_selectAll","top-style_default":"top-style_default","top-active":"top-active","top-style_bar":"top-style_bar","top-unwrap-x":"top-unwrap-x"}},A=u._export_sfc(g,[["__cssModules",h]]);m.Menu=A});
2
+ //# sourceMappingURL=menu--HRyUhPR.amd.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"menu-SmyeSNWQ.amd.js","sources":["../../src/components/formsExt/menu/menu.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { onMounted, onUpdated, ref } from 'vue';\r\nimport type { Item, Props } from './menu';\r\nimport Core from '@/core/core/core';\r\nimport { isSafari } from '@/core/utils/device';\r\nimport TopButton from '@/components/forms/button/button.vue';\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\tstyling: 'default',\r\n});\r\n\r\nconst model = defineModel({\r\n\trequired: true,\r\n});\r\n\r\nconst el = ref();\r\n\r\n// валидация типа modelValue без возможности выбора нескольких значений (ожидается строка)\r\nif (!props.isMultiple && !(typeof (model.value) === 'string' || model.value instanceof String)) {\r\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected String: ' + typeof (model.value));\r\n}\r\n\r\n// валидация типа modelValue с возможностью выбора нескольких значений (ожидается массив)\r\nif (props.isMultiple && !Array.isArray(model.value)) {\r\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected Array: ' + typeof (model.value));\r\n}\r\n\r\n// для множественного выбора без пустого множества\r\n// если ничего не выбрано, присваиваем 1-ое значение\r\nif (props.isMultiple && !props.canBeEmptyMultiple && Array.isArray(model.value) && !model.value.length) {\r\n\tmodel.value = [props.items[0].href ?? props.items[0].value];\r\n}\r\n\r\nconst itemIsActive = (item: Item) => {\r\n\tif (!Array.isArray(model.value)) {\r\n\t\treturn item.value === model.value;\r\n\t}\r\n\r\n\treturn model.value.includes(item.value);\r\n};\r\n\r\n/**\r\n * Выбрать элемент\r\n * @param item\r\n * @param toggle - добавить или исключить элемент, для isMultiple\r\n */\r\nconst select = (item: Item, toggle = false) => {\r\n\tif (Array.isArray(model.value)) {\r\n\t\tlet modelNew = model.value.slice();\r\n\r\n\t\tif (toggle) {\r\n\t\t\tif (!modelNew.length) modelNew = props.items.map(item => item.value);\r\n\r\n\t\t\tconst index = modelNew.indexOf(item.value);\r\n\t\t\tif (index === -1) {\r\n\t\t\t\tmodelNew.push(item.value);\r\n\t\t\t} else {\r\n\t\t\t\tmodelNew.splice(index, 1);\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\tif (modelNew.length === 1 && modelNew[0] === item.value) {\r\n\t\t\t\tmodelNew = [];\r\n\t\t\t} else {\r\n\t\t\t\tmodelNew = [item.value];\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tif (!props.canBeEmptyMultiple && !modelNew.length) modelNew = [item.value];\r\n\r\n\t\tmodel.value = modelNew;\r\n\r\n\t\treturn;\r\n\t}\r\n\r\n\tmodel.value = item.value;\r\n};\r\n\r\n// вертикальный скролл в горизонтальный скролл\r\nconst onWheel = (event: WheelEvent) => {\r\n\tif (el.value.scrollWidth <= el.value.offsetWidth) return;\r\n\tif (event.shiftKey) return;\r\n\tif (Math.abs(event.deltaY) < 50) return; // устройство с высокой точностью, например тачпад\r\n\r\n\tevent.preventDefault();\r\n\r\n\tconst delta = event.deltaY > 0 ? 30 : -30;\r\n\tel.value.scrollLeft = el.value.scrollLeft + delta;\r\n};\r\n\r\n/**\r\n * Замена стандартному scrollIntoView, который меняет скролл документа\r\n *\r\n * Выравнивание по ближнему краю элемента\r\n *\r\n * Выравнивается таким образом, чтобы был виден соседний элемент\r\n */\r\nconst scrollIntoView = (isSmooth = true) => {\r\n\tconst elBtn = el.value.querySelector('.top-active');\r\n\tif (!elBtn) return;\r\n\r\n\tconst gap = 24;\r\n\r\n\t// левая и правая координаты элемента\r\n\tconst leftMargin = elBtn.offsetLeft - el.value.offsetLeft - gap;\r\n\tconst rightMargin = elBtn.offsetLeft - el.value.offsetLeft + elBtn.clientWidth + gap;\r\n\r\n\t// левая и правая границы видимой части меню\r\n\tconst leftMarginParent = el.value.scrollLeft;\r\n\tconst rightMarginParent = el.value.clientWidth + el.value.scrollLeft;\r\n\r\n\tlet scrollLeft: number | undefined = undefined;\r\n\r\n\t// левую границу элемента к левой границе меню\r\n\tif (leftMargin < leftMarginParent) scrollLeft = leftMargin;\r\n\r\n\t// правую границу элемента к правой границе меню\r\n\tif (rightMargin > rightMarginParent) scrollLeft = rightMargin - el.value.clientWidth;\r\n\r\n\tif (scrollLeft !== undefined) {\r\n\t\tif (isSafari()) {\r\n\t\t\tCore.$?.(el.value).animate({ scrollLeft: scrollLeft }, isSmooth ? 200 : 0);\r\n\t\t} else {\r\n\t\t\tel.value.scrollTo({ left: scrollLeft, behavior: isSmooth ? 'smooth' : 'auto' });\r\n\t\t}\r\n\t}\r\n};\r\n\r\n/**\r\n * Выбрать все элементы в меню\r\n */\r\nconst selectAll = () => {\r\n\tif (!Array.isArray(model.value)) return;\r\n\r\n\tif (model.value.length === props.items.length) {\r\n\t\tmodel.value = [props.items[0].href ?? props.items[0].value];\r\n\t\treturn;\r\n\t}\r\n\r\n\tmodel.value = props.items.map(item => item.href ?? item.value);\r\n};\r\n\r\nonMounted(() => scrollIntoView(false));\r\nonUpdated(() => scrollIntoView(true));\r\n\r\n</script>\r\n\r\n<template>\r\n\t<div\r\n\t\tref=\"el\"\r\n\t\t:class=\"{\r\n\t\t\t'top-menu': true,\r\n\t\t\t['top-style_' + styling]: true,\r\n\t\t\t['top-unwrap-x']: styling === 'default',\r\n\t\t}\"\r\n\t\t@wheel=\"onWheel\"\r\n\t>\r\n\t\t<TopButton\r\n\t\t\tv-for=\"item in items\"\r\n\t\t\t:=\"item\"\r\n\t\t\tclass=\"top-menu_item\"\r\n\t\t\tcolor=\"theme\"\r\n\t\t\tstyling=\"\"\r\n\t\t\t@click=\"select(item, $event.ctrlKey)\"\r\n\t\t\t:isActive=\"itemIsActive(item)\"\r\n\t\t>\r\n\t\t\t<template #default v-if=\"item.content\">\r\n\t\t\t\t{{ item.content }}\r\n\t\t\t</template>\r\n\t\t</TopButton>\r\n\r\n\t\t<div\r\n\t\t\tv-if=\"Array.isArray(model) && selectAllItem\"\r\n\t\t\tclass=\"top-menu_selectAll\"\r\n\t\t>\r\n\t\t\t<TopButton\r\n\t\t\t\t:=\"selectAllItem\"\r\n\t\t\t\tclass=\"top-menu_item\"\r\n\t\t\t\tcolor=\"theme\"\r\n\t\t\t\tstyling=\"\"\r\n\t\t\t\t@click=\"selectAll()\"\r\n\t\t\t\t:isActive=\"model.length === items.length\"\r\n\t\t\t>\r\n\t\t\t\t<template #default v-if=\"selectAllItem.content\">\r\n\t\t\t\t\t{{ selectAllItem.content }}\r\n\t\t\t\t</template>\r\n\t\t\t</TopButton>\r\n\t\t</div>\r\n\t</div>\r\n</template>\r\n\r\n<style module>\r\n.top-menu {\r\n\t--scroll-thumb-color: var(--color-line-1);\r\n\t--scroll-thumb-color-hover: var(--color-line-2);\r\n\t--scroll-thumb-color-active: var(--color-line-3);\r\n\r\n\tmax-width: 100%;\r\n\tdisplay: flex;\r\n\talign-items: flex-start;\r\n\tgap: var(--top-gap-2);\r\n\toverflow-x: auto;\r\n\tscrollbar-width: none; /* firefox */\r\n\r\n\t/* предотвратить натинвые события браузера (назад / вперед) */\r\n\toverscroll-behavior-x: contain;\r\n}\r\n\r\n.top-menu::-webkit-scrollbar { display: none; }\r\n\r\n.top-menu .top-menu_item {\r\n\t--top-button-color: var(--color-text-2);\r\n\r\n\toutline-offset: -2px !important;\r\n\tmin-width: 0;\r\n\tmargin: 0;\r\n\tflex-shrink: 0;\r\n}\r\n\r\n.top-menu .top-menu_item[data-top-icon] {\r\n\t--top-icon-color: var(--color-text-2);\r\n}\r\n\r\n.top-menu_selectAll {\r\n\tposition: sticky;\r\n\tright: 0;\r\n\tbackground: var(--content-background-color);\r\n\tborder-left: 1px solid var(--color-line-1-opacity);\r\n\tpadding-left: var(--top-padding-1);\r\n\tbox-shadow: var(--content-background-color) var(--top-padding-2) 0px;\r\n}\r\n\r\n/* style default */\r\n.top-menu.top-style_default .top-menu_item {\r\n\t--top-forms-radius: 0;\r\n\t--top-forms-border-color: transparent;\r\n\t--top-forms-border-width: 2px;\r\n\r\n\tfilter: none;\r\n\tbox-shadow: none;\r\n\tborder: none;\r\n\tborder-bottom: var(--top-forms-border-width) solid var(--top-forms-border-color);\r\n\tbackground: none;\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_item:hover {\r\n\t--top-icon-color: var(--color-text-1);\r\n\t--top-button-color: var(--color-text-1);\r\n\t--top-forms-border-color: var(--color-line-2-opacity);\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_item:active,\r\n.top-menu.top-style_default .top-menu_item.top-active {\r\n\t--top-icon-color: var(--color-icon-primary-2);\r\n\t--top-button-color: var(--color-text-1);\r\n\t--top-forms-border-color: var(--color-line-primary-1);\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_selectAll {\r\n\tpadding-left: var(--top-padding-2);\r\n}\r\n\r\n/* style bar */\r\n.top-menu.top-style_bar {\r\n\tborder-radius: var(--top-radius-3);\r\n\tborder: 1px solid var(--color-line-2-opacity);\r\n\tpadding: var(--top-padding-1);\r\n\tgap: 3px;\r\n}\r\n.top-menu.top-style_bar .top-menu_item {\r\n\t--top-button-background-color-hover: var(--color-layer-secondary-1);\r\n\t--top-button-background-color-active: var(--color-layer-secondary-2);\r\n\t--top-button-background-color-selected: var(--color-layer-primary-1);\r\n\r\n\tposition: relative;\r\n}\r\n\r\n.top-menu.top-style_bar .top-menu_item:hover {\r\n\t--top-icon-color: var(--color-icon-1);\r\n\t--top-button-color: var(--color-text-1);\r\n}\r\n\r\n.top-menu.top-style_bar .top-menu_item.top-active {\r\n\t--top-icon-color: var(--color-icon-primary-2);\r\n\t--top-button-color: var(--color-text-primary-1);\r\n}\r\n\r\n/* разделители кнопок в баре */\r\n.top-menu.top-style_bar .top-menu_item:not(:first-child):not(.top-active):not(:hover):after {\r\n\tcontent: \"\";\r\n\tbackground: var(--color-line-1-opacity);\r\n\twidth: 1px;\r\n\theight: 60%;\r\n\tdisplay: block;\r\n\tposition: absolute;\r\n\tleft: -2px;\r\n}\r\n.top-menu.top-style_bar .top-menu_item.top-active + .top-menu_item:after,\r\n.top-menu.top-style_bar .top-menu_item:hover + .top-menu_item:after {\r\n\tcontent: none !important;\r\n}\r\n\r\n/** TODO: .top-unwrap-x надо вынести глобально в UI или добавить в стили для storybook */\r\n.top-menu.top-unwrap-x {\r\n\tpadding-right: var(--top-unwrap-x);\r\n\tpadding-left: var(--top-unwrap-x);\r\n\tmargin-right: calc(0px - var(--top-unwrap-x));\r\n\tmargin-left: calc(0px - var(--top-unwrap-x));\r\n}\r\n</style>\r\n"],"names":["props","__props","el","vue","model","itemIsActive","item","index","modelNew","onWheel","event","delta","scrollIntoView","isSmooth","elBtn","gap","leftMargin","rightMargin","rightMarginParent","scrollLeft"],"mappings":"ydAOA,MAAAA,EAAAC,+BAQAC,EAAAC,EAAA,IAAA,mKAQAH,EAAA,YAAA,CAAA,MAAA,QAAAI,EAAA,KAAA,wNAUA,MAAAC,EAAAC,2MAqBGC,IAAA,gCAIA,MAEAC,EAAA,SAAA,GAAAA,EAAA,CAAA,IAAAF,EAAA,WAGCE,EAAA,CAAAF,EAAA,KAAA,EAIF,CAAAN,EAAA,oBAAA,CAAAQ,EAAA,SAAAA,EAAA,CAAAF,EAAA,KAAA,GAEAF,EAAA,MAAAI,EAEA,OAGDJ,EAAA,MAAAE,EAAA,KAAmB,EAIpBG,EAAAC,GAAA,CAGC,GAFAR,EAAA,MAAA,aAAAA,EAAA,MAAA,aACAQ,EAAA,UACA,KAAA,IAAAA,EAAA,MAAA,EAAA,GAAA,OAEAA,EAAA,eAAA,EAEA,MAAAC,EAAAD,EAAA,OAAA,EAAA,GAAA,IACAR,EAAA,MAAA,WAAAA,EAAA,MAAA,WAAAS,CAA4C,EAU7CC,EAAA,CAAAC,EAAA,KAAA,sDAEC,GAAA,CAAAC,EAAA,OAEA,MAAAC,EAAA,GAGAC,EAAAF,EAAA,WAAAZ,EAAA,MAAA,WAAAa,EACAE,EAAAH,EAAA,WAAAZ,EAAA,MAAA,WAAAY,EAAA,YAAAC,uBAIAG,EAAAhB,EAAA,MAAA,YAAAA,EAAA,MAAA,WAEA,IAAAiB,aAMAF,EAAAC,IAAAC,EAAAF,EAAAf,EAAA,MAAA,aAEAiB,IAAA,sJAMA,mCASA,IAAAf,EAAA,MAAA,SAAAJ,EAAA,MAAA,OAAA,6CAEC,+CAG4D"}
1
+ {"version":3,"file":"menu--HRyUhPR.amd.js","sources":["../../src/components/formsExt/menu/menu.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { onMounted, onUpdated, ref } from 'vue';\r\nimport type { Item, Props } from './menu';\r\nimport Core from '@/core/core/core';\r\nimport { isSafari } from '@/core/utils/device';\r\nimport TopButton from '@/components/forms/button/button.vue';\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\tstyling: 'default',\r\n});\r\n\r\nconst model = defineModel({\r\n\trequired: true,\r\n});\r\n\r\nconst el = ref();\r\n\r\n// валидация типа modelValue без возможности выбора нескольких значений (ожидается строка)\r\nif (!props.isMultiple && !(typeof (model.value) === 'string' || model.value instanceof String)) {\r\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected String: ' + typeof (model.value));\r\n}\r\n\r\n// валидация типа modelValue с возможностью выбора нескольких значений (ожидается массив)\r\nif (props.isMultiple && !Array.isArray(model.value)) {\r\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected Array: ' + typeof (model.value));\r\n}\r\n\r\n// для множественного выбора без пустого множества\r\n// если ничего не выбрано, присваиваем 1-ое значение\r\nif (props.isMultiple && !props.canBeEmptyMultiple && Array.isArray(model.value) && !model.value.length) {\r\n\tmodel.value = [props.items[0].href ?? props.items[0].value];\r\n}\r\n\r\nconst itemIsActive = (item: Item) => {\r\n\tif (!Array.isArray(model.value)) {\r\n\t\treturn item.value === model.value;\r\n\t}\r\n\r\n\treturn model.value.includes(item.value);\r\n};\r\n\r\n/**\r\n * Выбрать элемент\r\n * @param item\r\n * @param toggle - добавить или исключить элемент, для isMultiple\r\n */\r\nconst select = (item: Item, toggle = false) => {\r\n\tif (Array.isArray(model.value)) {\r\n\t\tlet modelNew = model.value.slice();\r\n\r\n\t\tif (toggle) {\r\n\t\t\tif (!modelNew.length) modelNew = props.items.map(item => item.value);\r\n\r\n\t\t\tconst index = modelNew.indexOf(item.value);\r\n\t\t\tif (index === -1) {\r\n\t\t\t\tmodelNew.push(item.value);\r\n\t\t\t} else {\r\n\t\t\t\tmodelNew.splice(index, 1);\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\tif (modelNew.length === 1 && modelNew[0] === item.value) {\r\n\t\t\t\tmodelNew = [];\r\n\t\t\t} else {\r\n\t\t\t\tmodelNew = [item.value];\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tif (!props.canBeEmptyMultiple && !modelNew.length) modelNew = [item.value];\r\n\r\n\t\tmodel.value = modelNew;\r\n\r\n\t\treturn;\r\n\t}\r\n\r\n\tmodel.value = item.value;\r\n};\r\n\r\n// вертикальный скролл в горизонтальный скролл\r\nconst onWheel = (event: WheelEvent) => {\r\n\tif (el.value.scrollWidth <= el.value.offsetWidth) return;\r\n\tif (event.shiftKey) return;\r\n\tif (Math.abs(event.deltaY) < 50) return; // устройство с высокой точностью, например тачпад\r\n\r\n\tevent.preventDefault();\r\n\r\n\tconst delta = event.deltaY > 0 ? 30 : -30;\r\n\tel.value.scrollLeft = el.value.scrollLeft + delta;\r\n};\r\n\r\n/**\r\n * Замена стандартному scrollIntoView, который меняет скролл документа\r\n *\r\n * Выравнивание по ближнему краю элемента\r\n *\r\n * Выравнивается таким образом, чтобы был виден соседний элемент\r\n */\r\nconst scrollIntoView = (isSmooth = true) => {\r\n\tconst elBtn = el.value.querySelector('.top-active');\r\n\tif (!elBtn) return;\r\n\r\n\tconst gap = 24;\r\n\r\n\t// левая и правая координаты элемента\r\n\tconst leftMargin = elBtn.offsetLeft - el.value.offsetLeft - gap;\r\n\tconst rightMargin = elBtn.offsetLeft - el.value.offsetLeft + elBtn.clientWidth + gap;\r\n\r\n\t// левая и правая границы видимой части меню\r\n\tconst leftMarginParent = el.value.scrollLeft;\r\n\tconst rightMarginParent = el.value.clientWidth + el.value.scrollLeft;\r\n\r\n\tlet scrollLeft: number | undefined = undefined;\r\n\r\n\t// левую границу элемента к левой границе меню\r\n\tif (leftMargin < leftMarginParent) scrollLeft = leftMargin;\r\n\r\n\t// правую границу элемента к правой границе меню\r\n\tif (rightMargin > rightMarginParent) scrollLeft = rightMargin - el.value.clientWidth;\r\n\r\n\tif (scrollLeft !== undefined) {\r\n\t\tif (isSafari()) {\r\n\t\t\tCore.$?.(el.value).animate({ scrollLeft: scrollLeft }, isSmooth ? 200 : 0);\r\n\t\t} else {\r\n\t\t\tel.value.scrollTo({ left: scrollLeft, behavior: isSmooth ? 'smooth' : 'auto' });\r\n\t\t}\r\n\t}\r\n};\r\n\r\n/**\r\n * Выбрать все элементы в меню\r\n */\r\nconst selectAll = () => {\r\n\tif (!Array.isArray(model.value)) return;\r\n\r\n\tif (model.value.length === props.items.length) {\r\n\t\tmodel.value = [props.items[0].href ?? props.items[0].value];\r\n\t\treturn;\r\n\t}\r\n\r\n\tmodel.value = props.items.map(item => item.href ?? item.value);\r\n};\r\n\r\nonMounted(() => scrollIntoView(false));\r\nonUpdated(() => scrollIntoView(true));\r\n\r\n</script>\r\n\r\n<template>\r\n\t<div\r\n\t\tref=\"el\"\r\n\t\t:class=\"{\r\n\t\t\t'top-menu': true,\r\n\t\t\t['top-style_' + styling]: true,\r\n\t\t\t['top-unwrap-x']: styling === 'default',\r\n\t\t}\"\r\n\t\t@wheel=\"onWheel\"\r\n\t>\r\n\t\t<TopButton\r\n\t\t\tv-for=\"item in items\"\r\n\t\t\t:=\"item\"\r\n\t\t\tclass=\"top-menu_item\"\r\n\t\t\tcolor=\"theme\"\r\n\t\t\tstyling=\"\"\r\n\t\t\t@click=\"select(item, $event.ctrlKey)\"\r\n\t\t\t:isActive=\"itemIsActive(item)\"\r\n\t\t>\r\n\t\t\t<template #default v-if=\"item.content\">\r\n\t\t\t\t{{ item.content }}\r\n\t\t\t</template>\r\n\t\t</TopButton>\r\n\r\n\t\t<div\r\n\t\t\tv-if=\"Array.isArray(model) && selectAllItem\"\r\n\t\t\tclass=\"top-menu_selectAll\"\r\n\t\t>\r\n\t\t\t<TopButton\r\n\t\t\t\t:=\"selectAllItem\"\r\n\t\t\t\tclass=\"top-menu_item\"\r\n\t\t\t\tcolor=\"theme\"\r\n\t\t\t\tstyling=\"\"\r\n\t\t\t\t@click=\"selectAll()\"\r\n\t\t\t\t:isActive=\"model.length === items.length\"\r\n\t\t\t>\r\n\t\t\t\t<template #default v-if=\"selectAllItem.content\">\r\n\t\t\t\t\t{{ selectAllItem.content }}\r\n\t\t\t\t</template>\r\n\t\t\t</TopButton>\r\n\t\t</div>\r\n\t</div>\r\n</template>\r\n\r\n<style module>\r\n.top-menu {\r\n\t--scroll-thumb-color: var(--color-line-1);\r\n\t--scroll-thumb-color-hover: var(--color-line-2);\r\n\t--scroll-thumb-color-active: var(--color-line-3);\r\n\r\n\tmax-width: 100%;\r\n\tdisplay: flex;\r\n\talign-items: flex-start;\r\n\tgap: var(--top-gap-2);\r\n\toverflow-x: auto;\r\n\tscrollbar-width: none; /* firefox */\r\n\r\n\t/* предотвратить натинвые события браузера (назад / вперед) */\r\n\toverscroll-behavior-x: contain;\r\n}\r\n\r\n.top-menu::-webkit-scrollbar { display: none; }\r\n\r\n.top-menu .top-menu_item {\r\n\t--top-button-color: var(--color-text-2);\r\n\r\n\toutline-offset: -2px !important;\r\n\tmin-width: 0;\r\n\tmargin: 0;\r\n\tflex-shrink: 0;\r\n}\r\n\r\n.top-menu .top-menu_item[data-top-icon] {\r\n\t--top-icon-color: var(--color-text-2);\r\n}\r\n\r\n.top-menu_selectAll {\r\n\tposition: sticky;\r\n\tright: 0;\r\n\tbackground: var(--content-background-color);\r\n\tborder-left: 1px solid var(--color-line-1-opacity);\r\n\tpadding-left: var(--top-padding-1);\r\n\tbox-shadow: var(--content-background-color) var(--top-padding-2) 0px;\r\n}\r\n\r\n/* style default */\r\n.top-menu.top-style_default .top-menu_item {\r\n\t--top-forms-radius: 0;\r\n\t--top-forms-border-color: transparent;\r\n\t--top-forms-border-width: 2px;\r\n\r\n\tfilter: none;\r\n\tbox-shadow: none;\r\n\tborder: none;\r\n\tborder-bottom: var(--top-forms-border-width) solid var(--top-forms-border-color);\r\n\tbackground: none;\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_item:hover {\r\n\t--top-icon-color: var(--color-text-1);\r\n\t--top-button-color: var(--color-text-1);\r\n\t--top-forms-border-color: var(--color-line-2-opacity);\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_item:active,\r\n.top-menu.top-style_default .top-menu_item.top-active {\r\n\t--top-icon-color: var(--color-icon-primary-2);\r\n\t--top-button-color: var(--color-text-1);\r\n\t--top-forms-border-color: var(--color-line-primary-1);\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_selectAll {\r\n\tpadding-left: var(--top-padding-2);\r\n}\r\n\r\n/* style bar */\r\n.top-menu.top-style_bar {\r\n\tborder-radius: var(--top-radius-3);\r\n\tborder: 1px solid var(--color-line-2-opacity);\r\n\tpadding: var(--top-padding-1);\r\n\tgap: 3px;\r\n}\r\n.top-menu.top-style_bar .top-menu_item {\r\n\t--top-button-background-color-hover: var(--color-layer-secondary-1);\r\n\t--top-button-background-color-active: var(--color-layer-secondary-2);\r\n\t--top-button-background-color-selected: var(--color-layer-primary-1);\r\n\r\n\tposition: relative;\r\n}\r\n\r\n.top-menu.top-style_bar .top-menu_item:hover {\r\n\t--top-icon-color: var(--color-icon-1);\r\n\t--top-button-color: var(--color-text-1);\r\n}\r\n\r\n.top-menu.top-style_bar .top-menu_item.top-active {\r\n\t--top-icon-color: var(--color-icon-primary-2);\r\n\t--top-button-color: var(--color-text-primary-1);\r\n}\r\n\r\n/* разделители кнопок в баре */\r\n.top-menu.top-style_bar .top-menu_item:not(:first-child):not(.top-active):not(:hover):after {\r\n\tcontent: \"\";\r\n\tbackground: var(--color-line-1-opacity);\r\n\twidth: 1px;\r\n\theight: 60%;\r\n\tdisplay: block;\r\n\tposition: absolute;\r\n\tleft: -2px;\r\n}\r\n.top-menu.top-style_bar .top-menu_item.top-active + .top-menu_item:after,\r\n.top-menu.top-style_bar .top-menu_item:hover + .top-menu_item:after {\r\n\tcontent: none !important;\r\n}\r\n\r\n/** TODO: .top-unwrap-x надо вынести глобально в UI или добавить в стили для storybook */\r\n.top-menu.top-unwrap-x {\r\n\tpadding-right: var(--top-unwrap-x);\r\n\tpadding-left: var(--top-unwrap-x);\r\n\tmargin-right: calc(0px - var(--top-unwrap-x));\r\n\tmargin-left: calc(0px - var(--top-unwrap-x));\r\n}\r\n</style>\r\n"],"names":["props","__props","el","vue","model","itemIsActive","item","index","modelNew","onWheel","event","delta","scrollIntoView","isSmooth","elBtn","gap","leftMargin","rightMargin","rightMarginParent","scrollLeft"],"mappings":"ydAOA,MAAAA,EAAAC,+BAQAC,EAAAC,EAAA,IAAA,mKAQAH,EAAA,YAAA,CAAA,MAAA,QAAAI,EAAA,KAAA,wNAUA,MAAAC,EAAAC,2MAqBGC,IAAA,gCAIA,MAEAC,EAAA,SAAA,GAAAA,EAAA,CAAA,IAAAF,EAAA,WAGCE,EAAA,CAAAF,EAAA,KAAA,EAIF,CAAAN,EAAA,oBAAA,CAAAQ,EAAA,SAAAA,EAAA,CAAAF,EAAA,KAAA,GAEAF,EAAA,MAAAI,EAEA,OAGDJ,EAAA,MAAAE,EAAA,KAAmB,EAIpBG,EAAAC,GAAA,CAGC,GAFAR,EAAA,MAAA,aAAAA,EAAA,MAAA,aACAQ,EAAA,UACA,KAAA,IAAAA,EAAA,MAAA,EAAA,GAAA,OAEAA,EAAA,eAAA,EAEA,MAAAC,EAAAD,EAAA,OAAA,EAAA,GAAA,IACAR,EAAA,MAAA,WAAAA,EAAA,MAAA,WAAAS,CAA4C,EAU7CC,EAAA,CAAAC,EAAA,KAAA,sDAEC,GAAA,CAAAC,EAAA,OAEA,MAAAC,EAAA,GAGAC,EAAAF,EAAA,WAAAZ,EAAA,MAAA,WAAAa,EACAE,EAAAH,EAAA,WAAAZ,EAAA,MAAA,WAAAY,EAAA,YAAAC,uBAIAG,EAAAhB,EAAA,MAAA,YAAAA,EAAA,MAAA,WAEA,IAAAiB,aAMAF,EAAAC,IAAAC,EAAAF,EAAAf,EAAA,MAAA,aAEAiB,IAAA,sJAMA,mCASA,IAAAf,EAAA,MAAA,SAAAJ,EAAA,MAAA,OAAA,6CAEC,+CAG4D"}
@@ -1,14 +1,14 @@
1
- import { insertToPage as w } from "../utils/css.js";
2
- import { defineComponent as T, mergeModels as S, useModel as E, ref as W, onMounted as N, onUpdated as P, openBlock as c, createElementBlock as f, normalizeClass as b, Fragment as x, renderList as $, createBlock as q, mergeProps as d, createSlots as y, withCtx as g, createTextVNode as h, toDisplayString as A, createVNode as D, createCommentVNode as K } from "vue";
3
- import { T as M, i as U, C as Y, _ as z } from "./forms-CPEVHoks.es.js";
4
- const I = ["../assets/menu.css"].map((i) => import.meta.resolve(i));
5
- w(I, !0);
6
- const F = {
1
+ import S from "../core/core.js";
2
+ import { defineComponent as I, mergeModels as T, useModel as E, ref as W, onMounted as N, onUpdated as b, openBlock as c, createElementBlock as f, normalizeClass as x, Fragment as P, renderList as $, createBlock as q, mergeProps as d, createSlots as y, withCtx as g, createTextVNode as h, toDisplayString as A, createVNode as D, createCommentVNode as K } from "vue";
3
+ import { T as M, i as Y, C as z, _ as F } from "./forms-BUjy1eoH.es.js";
4
+ const w = ["../assets/menu.css"].map((u) => import.meta.resolve(u));
5
+ S.insertCSSLinkToPage(w, !0);
6
+ const O = {
7
7
  key: 0,
8
8
  class: "top-menu_selectAll"
9
- }, O = /* @__PURE__ */ T({
9
+ }, U = /* @__PURE__ */ I({
10
10
  __name: "menu",
11
- props: /* @__PURE__ */ S({
11
+ props: /* @__PURE__ */ T({
12
12
  modelValue: {},
13
13
  items: {},
14
14
  isMultiple: { type: Boolean },
@@ -22,54 +22,54 @@ const F = {
22
22
  modelModifiers: {}
23
23
  }),
24
24
  emits: ["update:modelValue"],
25
- setup(i) {
26
- const s = i, l = E(i, "modelValue"), a = W();
27
- !s.isMultiple && !(typeof l.value == "string" || l.value instanceof String) && console.warn('Type check failed for prop "modelValue". Expected String: ' + typeof l.value), s.isMultiple && !Array.isArray(l.value) && console.warn('Type check failed for prop "modelValue". Expected Array: ' + typeof l.value), s.isMultiple && !s.canBeEmptyMultiple && Array.isArray(l.value) && !l.value.length && (l.value = [s.items[0].href ?? s.items[0].value]);
28
- const _ = (e) => Array.isArray(l.value) ? l.value.includes(e.value) : e.value === l.value, k = (e, o = !1) => {
25
+ setup(u) {
26
+ const o = u, l = E(u, "modelValue"), a = W();
27
+ !o.isMultiple && !(typeof l.value == "string" || l.value instanceof String) && console.warn('Type check failed for prop "modelValue". Expected String: ' + typeof l.value), o.isMultiple && !Array.isArray(l.value) && console.warn('Type check failed for prop "modelValue". Expected Array: ' + typeof l.value), o.isMultiple && !o.canBeEmptyMultiple && Array.isArray(l.value) && !l.value.length && (l.value = [o.items[0].href ?? o.items[0].value]);
28
+ const _ = (e) => Array.isArray(l.value) ? l.value.includes(e.value) : e.value === l.value, k = (e, s = !1) => {
29
29
  if (Array.isArray(l.value)) {
30
30
  let t = l.value.slice();
31
- if (o) {
32
- t.length || (t = s.items.map((u) => u.value));
31
+ if (s) {
32
+ t.length || (t = o.items.map((i) => i.value));
33
33
  const r = t.indexOf(e.value);
34
34
  r === -1 ? t.push(e.value) : t.splice(r, 1);
35
35
  } else
36
36
  t.length === 1 && t[0] === e.value ? t = [] : t = [e.value];
37
- !s.canBeEmptyMultiple && !t.length && (t = [e.value]), l.value = t;
37
+ !o.canBeEmptyMultiple && !t.length && (t = [e.value]), l.value = t;
38
38
  return;
39
39
  }
40
40
  l.value = e.value;
41
- }, B = (e) => {
41
+ }, C = (e) => {
42
42
  if (a.value.scrollWidth <= a.value.offsetWidth || e.shiftKey || Math.abs(e.deltaY) < 50) return;
43
43
  e.preventDefault();
44
- const o = e.deltaY > 0 ? 30 : -30;
45
- a.value.scrollLeft = a.value.scrollLeft + o;
44
+ const s = e.deltaY > 0 ? 30 : -30;
45
+ a.value.scrollLeft = a.value.scrollLeft + s;
46
46
  }, p = (e = !0) => {
47
47
  var m, v;
48
- const o = a.value.querySelector(".top-active");
49
- if (!o) return;
50
- const t = 24, r = o.offsetLeft - a.value.offsetLeft - t, u = o.offsetLeft - a.value.offsetLeft + o.clientWidth + t, L = a.value.scrollLeft, V = a.value.clientWidth + a.value.scrollLeft;
48
+ const s = a.value.querySelector(".top-active");
49
+ if (!s) return;
50
+ const t = 24, r = s.offsetLeft - a.value.offsetLeft - t, i = s.offsetLeft - a.value.offsetLeft + s.clientWidth + t, B = a.value.scrollLeft, V = a.value.clientWidth + a.value.scrollLeft;
51
51
  let n;
52
- r < L && (n = r), u > V && (n = u - a.value.clientWidth), n !== void 0 && (U() ? (v = (m = Y).$) == null || v.call(m, a.value).animate({ scrollLeft: n }, e ? 200 : 0) : a.value.scrollTo({ left: n, behavior: e ? "smooth" : "auto" }));
53
- }, C = () => {
52
+ r < B && (n = r), i > V && (n = i - a.value.clientWidth), n !== void 0 && (Y() ? (v = (m = z).$) == null || v.call(m, a.value).animate({ scrollLeft: n }, e ? 200 : 0) : a.value.scrollTo({ left: n, behavior: e ? "smooth" : "auto" }));
53
+ }, L = () => {
54
54
  if (Array.isArray(l.value)) {
55
- if (l.value.length === s.items.length) {
56
- l.value = [s.items[0].href ?? s.items[0].value];
55
+ if (l.value.length === o.items.length) {
56
+ l.value = [o.items[0].href ?? o.items[0].value];
57
57
  return;
58
58
  }
59
- l.value = s.items.map((e) => e.href ?? e.value);
59
+ l.value = o.items.map((e) => e.href ?? e.value);
60
60
  }
61
61
  };
62
- return N(() => p(!1)), P(() => p(!0)), (e, o) => (c(), f("div", {
62
+ return N(() => p(!1)), b(() => p(!0)), (e, s) => (c(), f("div", {
63
63
  ref_key: "el",
64
64
  ref: a,
65
- class: b({
65
+ class: x({
66
66
  "top-menu": !0,
67
67
  ["top-style_" + e.styling]: !0,
68
68
  "top-unwrap-x": e.styling === "default"
69
69
  }),
70
- onWheel: B
70
+ onWheel: C
71
71
  }, [
72
- (c(!0), f(x, null, $(e.items, (t) => (c(), q(M, d({ ref_for: !0 }, t, {
72
+ (c(!0), f(P, null, $(e.items, (t) => (c(), q(M, d({ ref_for: !0 }, t, {
73
73
  class: "top-menu_item",
74
74
  color: "theme",
75
75
  styling: "",
@@ -84,12 +84,12 @@ const F = {
84
84
  key: "0"
85
85
  } : void 0
86
86
  ]), 1040, ["onClick", "isActive"]))), 256)),
87
- Array.isArray(l.value) && e.selectAllItem ? (c(), f("div", F, [
87
+ Array.isArray(l.value) && e.selectAllItem ? (c(), f("div", O, [
88
88
  D(M, d(e.selectAllItem, {
89
89
  class: "top-menu_item",
90
90
  color: "theme",
91
91
  styling: "",
92
- onClick: o[0] || (o[0] = (t) => C()),
92
+ onClick: s[0] || (s[0] = (t) => L()),
93
93
  isActive: l.value.length === e.items.length
94
94
  }), y({ _: 2 }, [
95
95
  e.selectAllItem.content ? {
@@ -113,8 +113,8 @@ const F = {
113
113
  "top-unwrap-x": "top-unwrap-x"
114
114
  }, G = {
115
115
  $style: j
116
- }, R = /* @__PURE__ */ z(O, [["__cssModules", G]]);
116
+ }, R = /* @__PURE__ */ F(U, [["__cssModules", G]]);
117
117
  export {
118
118
  R as M
119
119
  };
120
- //# sourceMappingURL=menu-CiQMMrnp.es.js.map
120
+ //# sourceMappingURL=menu-BGWVC7jB.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"menu-CiQMMrnp.es.js","sources":["../../src/components/formsExt/menu/menu.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { onMounted, onUpdated, ref } from 'vue';\r\nimport type { Item, Props } from './menu';\r\nimport Core from '@/core/core/core';\r\nimport { isSafari } from '@/core/utils/device';\r\nimport TopButton from '@/components/forms/button/button.vue';\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\tstyling: 'default',\r\n});\r\n\r\nconst model = defineModel({\r\n\trequired: true,\r\n});\r\n\r\nconst el = ref();\r\n\r\n// валидация типа modelValue без возможности выбора нескольких значений (ожидается строка)\r\nif (!props.isMultiple && !(typeof (model.value) === 'string' || model.value instanceof String)) {\r\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected String: ' + typeof (model.value));\r\n}\r\n\r\n// валидация типа modelValue с возможностью выбора нескольких значений (ожидается массив)\r\nif (props.isMultiple && !Array.isArray(model.value)) {\r\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected Array: ' + typeof (model.value));\r\n}\r\n\r\n// для множественного выбора без пустого множества\r\n// если ничего не выбрано, присваиваем 1-ое значение\r\nif (props.isMultiple && !props.canBeEmptyMultiple && Array.isArray(model.value) && !model.value.length) {\r\n\tmodel.value = [props.items[0].href ?? props.items[0].value];\r\n}\r\n\r\nconst itemIsActive = (item: Item) => {\r\n\tif (!Array.isArray(model.value)) {\r\n\t\treturn item.value === model.value;\r\n\t}\r\n\r\n\treturn model.value.includes(item.value);\r\n};\r\n\r\n/**\r\n * Выбрать элемент\r\n * @param item\r\n * @param toggle - добавить или исключить элемент, для isMultiple\r\n */\r\nconst select = (item: Item, toggle = false) => {\r\n\tif (Array.isArray(model.value)) {\r\n\t\tlet modelNew = model.value.slice();\r\n\r\n\t\tif (toggle) {\r\n\t\t\tif (!modelNew.length) modelNew = props.items.map(item => item.value);\r\n\r\n\t\t\tconst index = modelNew.indexOf(item.value);\r\n\t\t\tif (index === -1) {\r\n\t\t\t\tmodelNew.push(item.value);\r\n\t\t\t} else {\r\n\t\t\t\tmodelNew.splice(index, 1);\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\tif (modelNew.length === 1 && modelNew[0] === item.value) {\r\n\t\t\t\tmodelNew = [];\r\n\t\t\t} else {\r\n\t\t\t\tmodelNew = [item.value];\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tif (!props.canBeEmptyMultiple && !modelNew.length) modelNew = [item.value];\r\n\r\n\t\tmodel.value = modelNew;\r\n\r\n\t\treturn;\r\n\t}\r\n\r\n\tmodel.value = item.value;\r\n};\r\n\r\n// вертикальный скролл в горизонтальный скролл\r\nconst onWheel = (event: WheelEvent) => {\r\n\tif (el.value.scrollWidth <= el.value.offsetWidth) return;\r\n\tif (event.shiftKey) return;\r\n\tif (Math.abs(event.deltaY) < 50) return; // устройство с высокой точностью, например тачпад\r\n\r\n\tevent.preventDefault();\r\n\r\n\tconst delta = event.deltaY > 0 ? 30 : -30;\r\n\tel.value.scrollLeft = el.value.scrollLeft + delta;\r\n};\r\n\r\n/**\r\n * Замена стандартному scrollIntoView, который меняет скролл документа\r\n *\r\n * Выравнивание по ближнему краю элемента\r\n *\r\n * Выравнивается таким образом, чтобы был виден соседний элемент\r\n */\r\nconst scrollIntoView = (isSmooth = true) => {\r\n\tconst elBtn = el.value.querySelector('.top-active');\r\n\tif (!elBtn) return;\r\n\r\n\tconst gap = 24;\r\n\r\n\t// левая и правая координаты элемента\r\n\tconst leftMargin = elBtn.offsetLeft - el.value.offsetLeft - gap;\r\n\tconst rightMargin = elBtn.offsetLeft - el.value.offsetLeft + elBtn.clientWidth + gap;\r\n\r\n\t// левая и правая границы видимой части меню\r\n\tconst leftMarginParent = el.value.scrollLeft;\r\n\tconst rightMarginParent = el.value.clientWidth + el.value.scrollLeft;\r\n\r\n\tlet scrollLeft: number | undefined = undefined;\r\n\r\n\t// левую границу элемента к левой границе меню\r\n\tif (leftMargin < leftMarginParent) scrollLeft = leftMargin;\r\n\r\n\t// правую границу элемента к правой границе меню\r\n\tif (rightMargin > rightMarginParent) scrollLeft = rightMargin - el.value.clientWidth;\r\n\r\n\tif (scrollLeft !== undefined) {\r\n\t\tif (isSafari()) {\r\n\t\t\tCore.$?.(el.value).animate({ scrollLeft: scrollLeft }, isSmooth ? 200 : 0);\r\n\t\t} else {\r\n\t\t\tel.value.scrollTo({ left: scrollLeft, behavior: isSmooth ? 'smooth' : 'auto' });\r\n\t\t}\r\n\t}\r\n};\r\n\r\n/**\r\n * Выбрать все элементы в меню\r\n */\r\nconst selectAll = () => {\r\n\tif (!Array.isArray(model.value)) return;\r\n\r\n\tif (model.value.length === props.items.length) {\r\n\t\tmodel.value = [props.items[0].href ?? props.items[0].value];\r\n\t\treturn;\r\n\t}\r\n\r\n\tmodel.value = props.items.map(item => item.href ?? item.value);\r\n};\r\n\r\nonMounted(() => scrollIntoView(false));\r\nonUpdated(() => scrollIntoView(true));\r\n\r\n</script>\r\n\r\n<template>\r\n\t<div\r\n\t\tref=\"el\"\r\n\t\t:class=\"{\r\n\t\t\t'top-menu': true,\r\n\t\t\t['top-style_' + styling]: true,\r\n\t\t\t['top-unwrap-x']: styling === 'default',\r\n\t\t}\"\r\n\t\t@wheel=\"onWheel\"\r\n\t>\r\n\t\t<TopButton\r\n\t\t\tv-for=\"item in items\"\r\n\t\t\t:=\"item\"\r\n\t\t\tclass=\"top-menu_item\"\r\n\t\t\tcolor=\"theme\"\r\n\t\t\tstyling=\"\"\r\n\t\t\t@click=\"select(item, $event.ctrlKey)\"\r\n\t\t\t:isActive=\"itemIsActive(item)\"\r\n\t\t>\r\n\t\t\t<template #default v-if=\"item.content\">\r\n\t\t\t\t{{ item.content }}\r\n\t\t\t</template>\r\n\t\t</TopButton>\r\n\r\n\t\t<div\r\n\t\t\tv-if=\"Array.isArray(model) && selectAllItem\"\r\n\t\t\tclass=\"top-menu_selectAll\"\r\n\t\t>\r\n\t\t\t<TopButton\r\n\t\t\t\t:=\"selectAllItem\"\r\n\t\t\t\tclass=\"top-menu_item\"\r\n\t\t\t\tcolor=\"theme\"\r\n\t\t\t\tstyling=\"\"\r\n\t\t\t\t@click=\"selectAll()\"\r\n\t\t\t\t:isActive=\"model.length === items.length\"\r\n\t\t\t>\r\n\t\t\t\t<template #default v-if=\"selectAllItem.content\">\r\n\t\t\t\t\t{{ selectAllItem.content }}\r\n\t\t\t\t</template>\r\n\t\t\t</TopButton>\r\n\t\t</div>\r\n\t</div>\r\n</template>\r\n\r\n<style module>\r\n.top-menu {\r\n\t--scroll-thumb-color: var(--color-line-1);\r\n\t--scroll-thumb-color-hover: var(--color-line-2);\r\n\t--scroll-thumb-color-active: var(--color-line-3);\r\n\r\n\tmax-width: 100%;\r\n\tdisplay: flex;\r\n\talign-items: flex-start;\r\n\tgap: var(--top-gap-2);\r\n\toverflow-x: auto;\r\n\tscrollbar-width: none; /* firefox */\r\n\r\n\t/* предотвратить натинвые события браузера (назад / вперед) */\r\n\toverscroll-behavior-x: contain;\r\n}\r\n\r\n.top-menu::-webkit-scrollbar { display: none; }\r\n\r\n.top-menu .top-menu_item {\r\n\t--top-button-color: var(--color-text-2);\r\n\r\n\toutline-offset: -2px !important;\r\n\tmin-width: 0;\r\n\tmargin: 0;\r\n\tflex-shrink: 0;\r\n}\r\n\r\n.top-menu .top-menu_item[data-top-icon] {\r\n\t--top-icon-color: var(--color-text-2);\r\n}\r\n\r\n.top-menu_selectAll {\r\n\tposition: sticky;\r\n\tright: 0;\r\n\tbackground: var(--content-background-color);\r\n\tborder-left: 1px solid var(--color-line-1-opacity);\r\n\tpadding-left: var(--top-padding-1);\r\n\tbox-shadow: var(--content-background-color) var(--top-padding-2) 0px;\r\n}\r\n\r\n/* style default */\r\n.top-menu.top-style_default .top-menu_item {\r\n\t--top-forms-radius: 0;\r\n\t--top-forms-border-color: transparent;\r\n\t--top-forms-border-width: 2px;\r\n\r\n\tfilter: none;\r\n\tbox-shadow: none;\r\n\tborder: none;\r\n\tborder-bottom: var(--top-forms-border-width) solid var(--top-forms-border-color);\r\n\tbackground: none;\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_item:hover {\r\n\t--top-icon-color: var(--color-text-1);\r\n\t--top-button-color: var(--color-text-1);\r\n\t--top-forms-border-color: var(--color-line-2-opacity);\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_item:active,\r\n.top-menu.top-style_default .top-menu_item.top-active {\r\n\t--top-icon-color: var(--color-icon-primary-2);\r\n\t--top-button-color: var(--color-text-1);\r\n\t--top-forms-border-color: var(--color-line-primary-1);\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_selectAll {\r\n\tpadding-left: var(--top-padding-2);\r\n}\r\n\r\n/* style bar */\r\n.top-menu.top-style_bar {\r\n\tborder-radius: var(--top-radius-3);\r\n\tborder: 1px solid var(--color-line-2-opacity);\r\n\tpadding: var(--top-padding-1);\r\n\tgap: 3px;\r\n}\r\n.top-menu.top-style_bar .top-menu_item {\r\n\t--top-button-background-color-hover: var(--color-layer-secondary-1);\r\n\t--top-button-background-color-active: var(--color-layer-secondary-2);\r\n\t--top-button-background-color-selected: var(--color-layer-primary-1);\r\n\r\n\tposition: relative;\r\n}\r\n\r\n.top-menu.top-style_bar .top-menu_item:hover {\r\n\t--top-icon-color: var(--color-icon-1);\r\n\t--top-button-color: var(--color-text-1);\r\n}\r\n\r\n.top-menu.top-style_bar .top-menu_item.top-active {\r\n\t--top-icon-color: var(--color-icon-primary-2);\r\n\t--top-button-color: var(--color-text-primary-1);\r\n}\r\n\r\n/* разделители кнопок в баре */\r\n.top-menu.top-style_bar .top-menu_item:not(:first-child):not(.top-active):not(:hover):after {\r\n\tcontent: \"\";\r\n\tbackground: var(--color-line-1-opacity);\r\n\twidth: 1px;\r\n\theight: 60%;\r\n\tdisplay: block;\r\n\tposition: absolute;\r\n\tleft: -2px;\r\n}\r\n.top-menu.top-style_bar .top-menu_item.top-active + .top-menu_item:after,\r\n.top-menu.top-style_bar .top-menu_item:hover + .top-menu_item:after {\r\n\tcontent: none !important;\r\n}\r\n\r\n/** TODO: .top-unwrap-x надо вынести глобально в UI или добавить в стили для storybook */\r\n.top-menu.top-unwrap-x {\r\n\tpadding-right: var(--top-unwrap-x);\r\n\tpadding-left: var(--top-unwrap-x);\r\n\tmargin-right: calc(0px - var(--top-unwrap-x));\r\n\tmargin-left: calc(0px - var(--top-unwrap-x));\r\n}\r\n</style>\r\n"],"names":["props","__props","model","useModel","el","ref","itemIsActive","item","select","toggle","modelNew","item2","index","onWheel","event","delta","scrollIntoView","isSmooth","elBtn","gap","leftMargin","rightMargin","leftMarginParent","rightMarginParent","scrollLeft","isSafari","_b","_a","Core","selectAll","onMounted","onUpdated"],"mappings":"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"}
1
+ {"version":3,"file":"menu-BGWVC7jB.es.js","sources":["../../src/components/formsExt/menu/menu.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { onMounted, onUpdated, ref } from 'vue';\r\nimport type { Item, Props } from './menu';\r\nimport Core from '@/core/core/core';\r\nimport { isSafari } from '@/core/utils/device';\r\nimport TopButton from '@/components/forms/button/button.vue';\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\tstyling: 'default',\r\n});\r\n\r\nconst model = defineModel({\r\n\trequired: true,\r\n});\r\n\r\nconst el = ref();\r\n\r\n// валидация типа modelValue без возможности выбора нескольких значений (ожидается строка)\r\nif (!props.isMultiple && !(typeof (model.value) === 'string' || model.value instanceof String)) {\r\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected String: ' + typeof (model.value));\r\n}\r\n\r\n// валидация типа modelValue с возможностью выбора нескольких значений (ожидается массив)\r\nif (props.isMultiple && !Array.isArray(model.value)) {\r\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected Array: ' + typeof (model.value));\r\n}\r\n\r\n// для множественного выбора без пустого множества\r\n// если ничего не выбрано, присваиваем 1-ое значение\r\nif (props.isMultiple && !props.canBeEmptyMultiple && Array.isArray(model.value) && !model.value.length) {\r\n\tmodel.value = [props.items[0].href ?? props.items[0].value];\r\n}\r\n\r\nconst itemIsActive = (item: Item) => {\r\n\tif (!Array.isArray(model.value)) {\r\n\t\treturn item.value === model.value;\r\n\t}\r\n\r\n\treturn model.value.includes(item.value);\r\n};\r\n\r\n/**\r\n * Выбрать элемент\r\n * @param item\r\n * @param toggle - добавить или исключить элемент, для isMultiple\r\n */\r\nconst select = (item: Item, toggle = false) => {\r\n\tif (Array.isArray(model.value)) {\r\n\t\tlet modelNew = model.value.slice();\r\n\r\n\t\tif (toggle) {\r\n\t\t\tif (!modelNew.length) modelNew = props.items.map(item => item.value);\r\n\r\n\t\t\tconst index = modelNew.indexOf(item.value);\r\n\t\t\tif (index === -1) {\r\n\t\t\t\tmodelNew.push(item.value);\r\n\t\t\t} else {\r\n\t\t\t\tmodelNew.splice(index, 1);\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\tif (modelNew.length === 1 && modelNew[0] === item.value) {\r\n\t\t\t\tmodelNew = [];\r\n\t\t\t} else {\r\n\t\t\t\tmodelNew = [item.value];\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tif (!props.canBeEmptyMultiple && !modelNew.length) modelNew = [item.value];\r\n\r\n\t\tmodel.value = modelNew;\r\n\r\n\t\treturn;\r\n\t}\r\n\r\n\tmodel.value = item.value;\r\n};\r\n\r\n// вертикальный скролл в горизонтальный скролл\r\nconst onWheel = (event: WheelEvent) => {\r\n\tif (el.value.scrollWidth <= el.value.offsetWidth) return;\r\n\tif (event.shiftKey) return;\r\n\tif (Math.abs(event.deltaY) < 50) return; // устройство с высокой точностью, например тачпад\r\n\r\n\tevent.preventDefault();\r\n\r\n\tconst delta = event.deltaY > 0 ? 30 : -30;\r\n\tel.value.scrollLeft = el.value.scrollLeft + delta;\r\n};\r\n\r\n/**\r\n * Замена стандартному scrollIntoView, который меняет скролл документа\r\n *\r\n * Выравнивание по ближнему краю элемента\r\n *\r\n * Выравнивается таким образом, чтобы был виден соседний элемент\r\n */\r\nconst scrollIntoView = (isSmooth = true) => {\r\n\tconst elBtn = el.value.querySelector('.top-active');\r\n\tif (!elBtn) return;\r\n\r\n\tconst gap = 24;\r\n\r\n\t// левая и правая координаты элемента\r\n\tconst leftMargin = elBtn.offsetLeft - el.value.offsetLeft - gap;\r\n\tconst rightMargin = elBtn.offsetLeft - el.value.offsetLeft + elBtn.clientWidth + gap;\r\n\r\n\t// левая и правая границы видимой части меню\r\n\tconst leftMarginParent = el.value.scrollLeft;\r\n\tconst rightMarginParent = el.value.clientWidth + el.value.scrollLeft;\r\n\r\n\tlet scrollLeft: number | undefined = undefined;\r\n\r\n\t// левую границу элемента к левой границе меню\r\n\tif (leftMargin < leftMarginParent) scrollLeft = leftMargin;\r\n\r\n\t// правую границу элемента к правой границе меню\r\n\tif (rightMargin > rightMarginParent) scrollLeft = rightMargin - el.value.clientWidth;\r\n\r\n\tif (scrollLeft !== undefined) {\r\n\t\tif (isSafari()) {\r\n\t\t\tCore.$?.(el.value).animate({ scrollLeft: scrollLeft }, isSmooth ? 200 : 0);\r\n\t\t} else {\r\n\t\t\tel.value.scrollTo({ left: scrollLeft, behavior: isSmooth ? 'smooth' : 'auto' });\r\n\t\t}\r\n\t}\r\n};\r\n\r\n/**\r\n * Выбрать все элементы в меню\r\n */\r\nconst selectAll = () => {\r\n\tif (!Array.isArray(model.value)) return;\r\n\r\n\tif (model.value.length === props.items.length) {\r\n\t\tmodel.value = [props.items[0].href ?? props.items[0].value];\r\n\t\treturn;\r\n\t}\r\n\r\n\tmodel.value = props.items.map(item => item.href ?? item.value);\r\n};\r\n\r\nonMounted(() => scrollIntoView(false));\r\nonUpdated(() => scrollIntoView(true));\r\n\r\n</script>\r\n\r\n<template>\r\n\t<div\r\n\t\tref=\"el\"\r\n\t\t:class=\"{\r\n\t\t\t'top-menu': true,\r\n\t\t\t['top-style_' + styling]: true,\r\n\t\t\t['top-unwrap-x']: styling === 'default',\r\n\t\t}\"\r\n\t\t@wheel=\"onWheel\"\r\n\t>\r\n\t\t<TopButton\r\n\t\t\tv-for=\"item in items\"\r\n\t\t\t:=\"item\"\r\n\t\t\tclass=\"top-menu_item\"\r\n\t\t\tcolor=\"theme\"\r\n\t\t\tstyling=\"\"\r\n\t\t\t@click=\"select(item, $event.ctrlKey)\"\r\n\t\t\t:isActive=\"itemIsActive(item)\"\r\n\t\t>\r\n\t\t\t<template #default v-if=\"item.content\">\r\n\t\t\t\t{{ item.content }}\r\n\t\t\t</template>\r\n\t\t</TopButton>\r\n\r\n\t\t<div\r\n\t\t\tv-if=\"Array.isArray(model) && selectAllItem\"\r\n\t\t\tclass=\"top-menu_selectAll\"\r\n\t\t>\r\n\t\t\t<TopButton\r\n\t\t\t\t:=\"selectAllItem\"\r\n\t\t\t\tclass=\"top-menu_item\"\r\n\t\t\t\tcolor=\"theme\"\r\n\t\t\t\tstyling=\"\"\r\n\t\t\t\t@click=\"selectAll()\"\r\n\t\t\t\t:isActive=\"model.length === items.length\"\r\n\t\t\t>\r\n\t\t\t\t<template #default v-if=\"selectAllItem.content\">\r\n\t\t\t\t\t{{ selectAllItem.content }}\r\n\t\t\t\t</template>\r\n\t\t\t</TopButton>\r\n\t\t</div>\r\n\t</div>\r\n</template>\r\n\r\n<style module>\r\n.top-menu {\r\n\t--scroll-thumb-color: var(--color-line-1);\r\n\t--scroll-thumb-color-hover: var(--color-line-2);\r\n\t--scroll-thumb-color-active: var(--color-line-3);\r\n\r\n\tmax-width: 100%;\r\n\tdisplay: flex;\r\n\talign-items: flex-start;\r\n\tgap: var(--top-gap-2);\r\n\toverflow-x: auto;\r\n\tscrollbar-width: none; /* firefox */\r\n\r\n\t/* предотвратить натинвые события браузера (назад / вперед) */\r\n\toverscroll-behavior-x: contain;\r\n}\r\n\r\n.top-menu::-webkit-scrollbar { display: none; }\r\n\r\n.top-menu .top-menu_item {\r\n\t--top-button-color: var(--color-text-2);\r\n\r\n\toutline-offset: -2px !important;\r\n\tmin-width: 0;\r\n\tmargin: 0;\r\n\tflex-shrink: 0;\r\n}\r\n\r\n.top-menu .top-menu_item[data-top-icon] {\r\n\t--top-icon-color: var(--color-text-2);\r\n}\r\n\r\n.top-menu_selectAll {\r\n\tposition: sticky;\r\n\tright: 0;\r\n\tbackground: var(--content-background-color);\r\n\tborder-left: 1px solid var(--color-line-1-opacity);\r\n\tpadding-left: var(--top-padding-1);\r\n\tbox-shadow: var(--content-background-color) var(--top-padding-2) 0px;\r\n}\r\n\r\n/* style default */\r\n.top-menu.top-style_default .top-menu_item {\r\n\t--top-forms-radius: 0;\r\n\t--top-forms-border-color: transparent;\r\n\t--top-forms-border-width: 2px;\r\n\r\n\tfilter: none;\r\n\tbox-shadow: none;\r\n\tborder: none;\r\n\tborder-bottom: var(--top-forms-border-width) solid var(--top-forms-border-color);\r\n\tbackground: none;\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_item:hover {\r\n\t--top-icon-color: var(--color-text-1);\r\n\t--top-button-color: var(--color-text-1);\r\n\t--top-forms-border-color: var(--color-line-2-opacity);\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_item:active,\r\n.top-menu.top-style_default .top-menu_item.top-active {\r\n\t--top-icon-color: var(--color-icon-primary-2);\r\n\t--top-button-color: var(--color-text-1);\r\n\t--top-forms-border-color: var(--color-line-primary-1);\r\n}\r\n\r\n.top-menu.top-style_default .top-menu_selectAll {\r\n\tpadding-left: var(--top-padding-2);\r\n}\r\n\r\n/* style bar */\r\n.top-menu.top-style_bar {\r\n\tborder-radius: var(--top-radius-3);\r\n\tborder: 1px solid var(--color-line-2-opacity);\r\n\tpadding: var(--top-padding-1);\r\n\tgap: 3px;\r\n}\r\n.top-menu.top-style_bar .top-menu_item {\r\n\t--top-button-background-color-hover: var(--color-layer-secondary-1);\r\n\t--top-button-background-color-active: var(--color-layer-secondary-2);\r\n\t--top-button-background-color-selected: var(--color-layer-primary-1);\r\n\r\n\tposition: relative;\r\n}\r\n\r\n.top-menu.top-style_bar .top-menu_item:hover {\r\n\t--top-icon-color: var(--color-icon-1);\r\n\t--top-button-color: var(--color-text-1);\r\n}\r\n\r\n.top-menu.top-style_bar .top-menu_item.top-active {\r\n\t--top-icon-color: var(--color-icon-primary-2);\r\n\t--top-button-color: var(--color-text-primary-1);\r\n}\r\n\r\n/* разделители кнопок в баре */\r\n.top-menu.top-style_bar .top-menu_item:not(:first-child):not(.top-active):not(:hover):after {\r\n\tcontent: \"\";\r\n\tbackground: var(--color-line-1-opacity);\r\n\twidth: 1px;\r\n\theight: 60%;\r\n\tdisplay: block;\r\n\tposition: absolute;\r\n\tleft: -2px;\r\n}\r\n.top-menu.top-style_bar .top-menu_item.top-active + .top-menu_item:after,\r\n.top-menu.top-style_bar .top-menu_item:hover + .top-menu_item:after {\r\n\tcontent: none !important;\r\n}\r\n\r\n/** TODO: .top-unwrap-x надо вынести глобально в UI или добавить в стили для storybook */\r\n.top-menu.top-unwrap-x {\r\n\tpadding-right: var(--top-unwrap-x);\r\n\tpadding-left: var(--top-unwrap-x);\r\n\tmargin-right: calc(0px - var(--top-unwrap-x));\r\n\tmargin-left: calc(0px - var(--top-unwrap-x));\r\n}\r\n</style>\r\n"],"names":["props","__props","model","useModel","el","ref","itemIsActive","item","select","toggle","modelNew","item2","index","onWheel","event","delta","scrollIntoView","isSmooth","elBtn","gap","leftMargin","rightMargin","leftMarginParent","rightMarginParent","scrollLeft","isSafari","_b","_a","Core","selectAll","onMounted","onUpdated"],"mappings":"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"}
@@ -1,9 +1,8 @@
1
- import { C as f } from "./forms-CPEVHoks.es.js";
1
+ import { C as f } from "./forms-BUjy1eoH.es.js";
2
2
  import r from "../utils/dom.js";
3
3
  import { TopPopupWorker as s } from "../popup/worker.js";
4
- import { a as w } from "./i18n-qpB8zyhD.es.js";
5
- import { insertToPageAsInine as v } from "../utils/css.js";
6
- class b {
4
+ import { a as P } from "./i18n-qpB8zyhD.es.js";
5
+ class v {
7
6
  static componentName = "Top";
8
7
  componentName;
9
8
  // имя класса компонента
@@ -23,7 +22,7 @@ class b {
23
22
  init(t, p, o) {
24
23
  if (!p)
25
24
  throw t + ": el is undefined";
26
- const e = b.getComponent(p, t);
25
+ const e = v.getComponent(p, t);
27
26
  if (e)
28
27
  return e.reInit(o), e;
29
28
  this.componentName = t, this.className = "top" + t[0].toUpperCase() + t.substring(1), this.uid = this.componentName + (Math.random() + "").replace(".", ""), this._setComponent(p), this.el = p, this.el.classList.add(this.className), this.options = Object.assign(this.options, o), this.mount();
@@ -84,7 +83,7 @@ class b {
84
83
  }
85
84
  }
86
85
  }
87
- class y {
86
+ class w {
88
87
  static init() {
89
88
  document.addEventListener("click", this.onclick), document.addEventListener("keydown", this.onkeydown);
90
89
  }
@@ -173,7 +172,7 @@ class y {
173
172
  }
174
173
  }
175
174
  }
176
- const _ = `:root {\r
175
+ const y = `:root {\r
177
176
  --top-popup-z-index: 200000;\r
178
177
  --top-popup-transition-delay: 100ms;\r
179
178
  \r
@@ -511,7 +510,7 @@ ul.top-popup_content i.a > [class*=icon] {\r
511
510
  \r
512
511
  .top-popup_footer [class*=btn]:first-child { margin-left: 0; }\r
513
512
  \r
514
- .top-popup_footer .btn.full_width { margin: 0; flex-grow: 1; }`, L = `:root {\r
513
+ .top-popup_footer .btn.full_width { margin: 0; flex-grow: 1; }`, _ = `:root {\r
515
514
  --top-popup-list-padding: 0px;\r
516
515
  \r
517
516
  --top-popup-listItem-radius: 0px;\r
@@ -584,7 +583,7 @@ ul.top-popup_content .top-popup_listItem-title {\r
584
583
  /* listDelimiter */\r
585
584
  ul.top-popup_content .top-popup_listItem-delimiter { background: var(--color-line-1-opacity); height: 4px; margin: 0; }\r
586
585
  ul.top-popup_content li:first-child > .top-popup_listItem-delimiter { border-top: 1px solid var(--top-popup-border-color); }\r
587
- `, E = `html:not(.with_dialog) { margin-right: 0 !important; }\r
586
+ `, L = `html:not(.with_dialog) { margin-right: 0 !important; }\r
588
587
  \r
589
588
  .top-popup { min-width: 250px; max-width: calc(100vw - var(--top-popup-left) - 16px); max-height: calc(var(--top-popup-bottom) + var(--top-popup-height)); }\r
590
589
  .top-popup-wrapper.invert-x > .top-popup { max-width: calc(100vw - var(--top-popup-right) - 16px); }\r
@@ -613,10 +612,10 @@ ul.top-popup_content li:hover > * > i.top-popup_listMore,\r
613
612
  ul.top-popup_content li > *.top-active > i.top-popup_listMore,\r
614
613
  ul.top-popup_content li > * > i.top-popup_listMore.top-active { visibility: visible; }\r
615
614
  `;
616
- v(_);
617
- v(L, "m");
618
- v(E, "pc");
619
- class P extends b {
615
+ f.insertStyleToPage(y);
616
+ f.insertStyleToPage(_, "m");
617
+ f.insertStyleToPage(L, "pc");
618
+ class x extends v {
620
619
  static componentName = "Popup";
621
620
  // элемент, вызвавший открытие Popup
622
621
  elActiveByDefault;
@@ -669,7 +668,7 @@ class P extends b {
669
668
  events = {};
670
669
  // el - элемент, открывающий меню
671
670
  constructor(t, p) {
672
- return super(), this.init(P.componentName, t, p);
671
+ return super(), this.init(x.componentName, t, p);
673
672
  }
674
673
  async mount() {
675
674
  var e, i;
@@ -710,7 +709,7 @@ class P extends b {
710
709
  this.options.notch && (this.elPopup.classList.add("with_notch"), this.elPopup.insertAdjacentHTML("beforeend", '<i class="notch notch-border"></i><i class="notch"></i>')), await this.vueOpen(), this.elPopupHeader = this.elPopupInner.querySelector(".top-popup_header"), this.elPopupWidget = this.elPopupInner.querySelector(".top-popup_widget"), this.elPopupBody = this.elPopupInner.querySelector(".top-popup_content"), this.elPopupFooter = this.elPopupInner.querySelector(".top-popup_footer");
711
710
  const p = !!this.elPopup.querySelector('[data-widget="search"]');
712
711
  if (this.options.isFullScreen && !p) {
713
- const n = w();
712
+ const n = P();
714
713
  !this.elPopupHeader && n.Common.Close && (this.elPopupHeader = r.genEl("i", { class: "top-popup_header" }), this.elPopupInner.prepend(this.elPopupHeader), this.elPopupHeader.prepend(r.genEl("i", { class: "a closer" }, n.Common.Close)), this.elPopupHeader.append(r.genEl("i", { class: "top-popup_headerButton" })));
715
714
  }
716
715
  r.storage(this.elPopup, "Popup", this), this.options.frontSelector && (this.elFront = document.querySelector(this.options.frontSelector)), this.elFront || (this.elFront = this.el.closest(".top-popup-front")), this.elFront || (this.elFront = document.body), this.elPopup instanceof HTMLElement && (this.elPopup.style.width = this.el.offsetWidth + "px", this.elPopup.style.height = this.el.offsetHeight + "px", this.elPopup.style.top = this.el.offsetTop + "px", this.elPopup.style.right = parseInt(this.el.style.right || "0") + "px", this.elPopup.style.bottom = parseInt(this.el.style.bottom || "0") + "px"), (i = this.el.parentElement) == null || i.insertBefore(this.elPopup, this.el), this.elPopup.classList.remove("template"), this.options.invertX && this.elPopup.classList.add("invert-x");
@@ -776,7 +775,7 @@ class P extends b {
776
775
  }
777
776
  // контроль за положением Popup, чтобы оно не вылезало за пределы документа
778
777
  recalcPosition() {
779
- var m, x;
778
+ var m, b;
780
779
  if (!(this.elPopup instanceof HTMLElement)) return;
781
780
  let t = this.options.p, p;
782
781
  if (this.el instanceof HTMLElement)
@@ -798,7 +797,7 @@ class P extends b {
798
797
  this.elPopup.style.setProperty("--top-popup-height", this.elPopup.offsetHeight + "px"), this.elPopup.style.setProperty("--top-popup-right-bounding", o.right + "px"), this.elPopup.style.setProperty("--top-popup-bottom-bounding", o.bottom + "px"), this.elPopup.style.setProperty("--top-popup-top", o.top + "px"), this.elPopup.style.setProperty("--top-popup-left", o.left + "px"), this.elPopupInner instanceof HTMLElement && (this.elPopupInner.style.maxWidth = "unset", this.elPopupInner.style.maxHeight = "unset");
799
798
  let e = !1, i = !1, n = !1, u = !1, l = o.left > window.innerWidth / 2, d = o.top > window.innerHeight / 2;
800
799
  t === 4 && (l = !l), t === 1 && (d = !d);
801
- const h = (x = this.elPopupInner) == null ? void 0 : x.getBoundingClientRect();
800
+ const h = (b = this.elPopupInner) == null ? void 0 : b.getBoundingClientRect();
802
801
  let a, c;
803
802
  if (h) {
804
803
  a = window.innerWidth - h.right, c = window.innerHeight - h.bottom;
@@ -838,9 +837,9 @@ class P extends b {
838
837
  if (this.el instanceof HTMLElement) return s.vueConnectors.get(this.el.dataset.topPopupId);
839
838
  }
840
839
  }
841
- y.init();
840
+ w.init();
842
841
  export {
843
- P as Popup,
844
- P as default
842
+ x as Popup,
843
+ x as default
845
844
  };
846
- //# sourceMappingURL=popup-Bv_sxmoj.es.js.map
845
+ //# sourceMappingURL=popup-B73zkYFU.es.js.map