@mobilon-dev/chotto 0.3.85 → 0.3.86

package/dist/components/2_blocks/CommunicationPanel/composables/useCommunicationActions.js

@@ -1,6 +1,6 @@
 import { needsAttributeConfirmation as m } from "./useCommunicationAttributes.js";
-import { resolveRecentChannelSelection as J } from "./useCommunicationRecentSelection.js";
-function Y({
+import { resolveRecentChannelSelection as K } from "./useCommunicationRecentSelection.js";
+function Z({
   activeChannelType: l,
   channels: v,
   selectedChannel: i,
@@ -9,7 +9,8 @@ function Y({
   confirmingAttributeId: q,
   isAttributeBlocked: u,
   closeMenu: a,
-  hasMultipleChannels: A,
+  pinMenuOpen: A,
+  hasMultipleChannels: G,
   getSingleChannelForType: x,
   getAvailableChannels: C,
   isChannelEmpty: d,
@@ -20,13 +21,13 @@ function Y({
   panelPendingSelection: f
 }) {
   const b = (n, e, r) => {
-    u(n) || (q.value = n.id, t("confirm-attribute", {
+    u(n) || (A(), q.value = n.id, t("confirm-attribute", {
       attributeId: n.id,
       channelId: e,
       channelType: r,
       attribute: n
     }));
-  }, G = (n, e, r) => {
+  }, H = (n, e, r) => {
     if (m(n)) {
       b(n, e, r);
       return;
@@ -60,34 +61,36 @@ function Y({
           h(n);
           return;
         }
-        if (!A(e)) {
+        if (!G(e)) {
           const r = x(e);
-          r && G(n, r.channelId, e);
+          r && H(n, r.channelId, e);
         }
       }
     },
     selectSingleChannel: j,
     selectChannel: (n) => {
       const e = z.value, r = l.value;
-      if (!e || !r || u(e)) {
+      if (!e || !r) {
         a();
         return;
       }
-      if (m(e)) {
-        b(e, n, r);
-        return;
+      if (!u(e)) {
+        if (m(e)) {
+          b(e, n, r);
+          return;
+        }
+        t("select-attribute-channel", {
+          attributeId: e.id,
+          channelId: n
+        }), s.value = r, i.value = v.value.find((c) => c.channelId === n) ?? {}, d(n) && I.value ? R() : S(), a();
       }
-      t("select-attribute-channel", {
-        attributeId: e.id,
-        channelId: n
-      }), s.value = r, i.value = v.value.find((c) => c.channelId === n) ?? {}, d(n) && I.value ? R() : S(), a();
     },
     availableChannels: () => {
       const n = l.value;
       return n ? C(n) : [];
     },
     applyRecentChannelButtonSelection: (n, e, r) => {
-      const c = J(
+      const c = K(
         n,
         e,
         r,
@@ -104,7 +107,7 @@ function Y({
       }), t("select-attribute-channel", {
         attributeId: P.id,
         channelId: o
-      }), s.value = n, i.value = v.value.find((H) => H.channelId === o) ?? {}, d(o) && I.value ? R() : S(), !0);
+      }), s.value = n, i.value = v.value.find((J) => J.channelId === o) ?? {}, d(o) && I.value ? R() : S(), !0);
     },
     clearPanelPendingSelection: () => {
       f && (f.value = null);
@@ -112,5 +115,5 @@ function Y({
   };
 }
 export {
-  Y as useCommunicationActions
+  Z as useCommunicationActions
 };

package/dist/components/2_blocks/CommunicationPanel/composables/useCommunicationMenu.js

@@ -1,45 +1,50 @@
-import { ref as l, nextTick as f } from "vue";
-function M({
-  panelRef: v,
-  selectedChannelType: d,
-  frozenAttribute: c
+import { ref as n, nextTick as p } from "vue";
+function w({
+  panelRef: d,
+  selectedChannelType: h,
+  frozenAttribute: r
 }) {
-  const n = l(null), h = l(null), u = l(!1), a = l(!1), s = l(!1), t = () => {
-    u.value = !1, n.value = null, c.value = null, a.value = !1;
-  }, C = () => {
-    s.value = !0, f(() => {
-      f(() => {
-        s.value = !1;
+  const u = n(null), C = n(null), a = n(!1), s = n(!1), t = n(!1), l = n(!1), i = () => {
+    l.value = !1, a.value = !1, u.value = null, r.value = null, s.value = !1;
+  }, m = () => {
+    l.value = !0;
+  }, c = () => {
+    t.value = !0, p(() => {
+      p(() => {
+        t.value = !1;
       });
     });
-  }, i = (e) => {
-    n.value = e, u.value = !0, a.value = !1, c.value = null, C();
+  }, f = (e) => {
+    l.value = !1, u.value = e, a.value = !0, s.value = !1, r.value = null, c();
   };
   return {
-    activeChannelType: n,
-    hoveredChannel: h,
-    showMenu: u,
-    showSubMenu: a,
+    activeChannelType: u,
+    hoveredChannel: C,
+    showMenu: a,
+    showSubMenu: s,
+    retainOpenUntilDismiss: l,
     handleChannelClick: (e) => {
-      if (d.value === e && n.value === e) {
-        t();
+      if (h.value === e && u.value === e) {
+        i();
         return;
       }
-      i(e);
+      f(e);
     },
-    openMenu: i,
-    closeMenu: t,
+    openMenu: f,
+    closeMenu: i,
+    pinMenuOpen: m,
+    armOutsideClickSuppression: c,
     handleClickOutside: (e) => {
-      if (s.value)
+      if (t.value || l.value)
         return;
-      const o = v.value;
+      const o = d.value;
       if (!o)
         return;
-      const r = typeof e.composedPath == "function" ? e.composedPath() : [];
-      Array.isArray(r) && r.includes(o) || o.contains(e.target) || t();
+      const v = typeof e.composedPath == "function" ? e.composedPath() : [];
+      Array.isArray(v) && v.includes(o) || o.contains(e.target) || i();
     }
   };
 }
 export {
-  M as useCommunicationMenu
+  w as useCommunicationMenu
 };

package/dist/components/2_blocks/CommunicationPanel/composables/useCommunicationSubMenu.js

@@ -1,58 +1,67 @@
-import { ref as C } from "vue";
-function N({
-  activeChannelType: g,
-  showSubMenu: n,
-  frozenAttribute: o,
-  hoveredAttribute: b,
-  hasMultipleChannels: h,
-  isAttributeBlocked: M
+import { ref as E } from "vue";
+function O({
+  activeChannelType: S,
+  showSubMenu: u,
+  frozenAttribute: n,
+  hoveredAttribute: c,
+  confirmingAttributeId: v,
+  retainOpenUntilDismiss: i,
+  hasMultipleChannels: b,
+  isAttributeBlocked: f
 }) {
-  const t = C(0);
+  const l = E(0), y = () => i.value || !!v.value || f(c.value ?? n.value);
   return {
-    subMenuTop: t,
-    handleAttributeMouseEnter: (e, l) => {
-      const u = g.value;
-      return !u || !h(u) || M(e) ? null : (b.value = e, n.value = !0, o.value = e, l);
+    subMenuTop: l,
+    handleAttributeMouseEnter: (e, o) => {
+      const t = S.value;
+      if (!t || !b(t))
+        return null;
+      if (i.value || v.value) {
+        const a = n.value ?? c.value;
+        if (u.value || a && a.id !== e.id)
+          return null;
+      }
+      return c.value = e, u.value = !0, n.value = e, o;
     },
     handleAttributeMouseLeave: () => {
-      n.value || (o.value = null);
+      u.value || (n.value = null);
     },
     keepSubMenuOpen: () => {
-      n.value = !0;
+      u.value = !0;
     },
     closeSubMenu: () => {
-      n.value = !1, o.value = null;
+      y() || (u.value = !1, n.value = null);
     },
-    alignSubMenuWithTarget: (e, l) => {
-      var u, r, s;
-      if (!l) {
-        t.value = 0;
+    alignSubMenuWithTarget: (e, o) => {
+      var t, a, d;
+      if (!o) {
+        l.value = 0;
         return;
       }
       try {
-        const i = (u = e.value) == null ? void 0 : u.querySelector(".attributes-menu"), a = (r = e.value) == null ? void 0 : r.querySelector(".sub-menu-header"), v = (s = e.value) == null ? void 0 : s.querySelector(".sub-menu");
-        if (!i) {
-          t.value = 0;
+        const p = (t = e.value) == null ? void 0 : t.querySelector(".attributes-menu"), s = (a = e.value) == null ? void 0 : a.querySelector(".sub-menu-header"), m = (d = e.value) == null ? void 0 : d.querySelector(".sub-menu");
+        if (!p) {
+          l.value = 0;
           return;
         }
-        const S = i.getBoundingClientRect(), y = l.getBoundingClientRect();
-        let m = 0;
-        if (a) {
-          const c = a.getBoundingClientRect(), f = getComputedStyle(a), p = parseFloat(f.marginBottom || "0");
-          m = c.height + (Number.isNaN(p) ? 0 : p);
+        const B = p.getBoundingClientRect(), C = o.getBoundingClientRect();
+        let g = 0;
+        if (s) {
+          const r = s.getBoundingClientRect(), T = getComputedStyle(s), h = parseFloat(T.marginBottom || "0");
+          g = r.height + (Number.isNaN(h) ? 0 : h);
         }
-        let d = 0;
-        if (v) {
-          const c = getComputedStyle(v);
-          d = parseFloat(c.paddingTop || "0") || 0;
+        let M = 0;
+        if (m) {
+          const r = getComputedStyle(m);
+          M = parseFloat(r.paddingTop || "0") || 0;
         }
-        t.value = y.top - S.top - m - d - 2;
+        l.value = C.top - B.top - g - M - 2;
       } catch {
-        t.value = 0;
+        l.value = 0;
       }
     }
   };
 }
 export {
-  N as useCommunicationSubMenu
+  O as useCommunicationSubMenu
 };

package/dist/types/components/2_blocks/CommunicationPanel/CommunicationPanel.vue.d.ts

@@ -1,4 +1,6 @@
 declare const _default: import("vue").DefineComponent<{}, {
+    /** Снять pin и закрыть оба меню (вызывать с host при ОК на splash). */
+    closeMenu: () => void;
     $emit: (event: "select-attribute-channel" | "confirm-attribute" | "phone-call" | "reset-blocked-attributes", ...args: any[]) => void;
     channels: unknown[];
     messages: unknown[];

package/dist/types/components/2_blocks/CommunicationPanel/composables/useCommunicationActions.d.ts

@@ -32,6 +32,8 @@ interface UseCommunicationActionsOptions {
     confirmingAttributeId: Ref<string | null>;
     isAttributeBlocked: (attribute: ContactAttribute | null | undefined) => boolean;
     closeMenu: () => void;
+    /** Закрепить меню до closeMenu (клик снаружи) — на время confirm-attribute. */
+    pinMenuOpen: () => void;
     hasMultipleChannels: (channelType: string) => boolean;
     getSingleChannelForType: (channelType: string) => Channel | null;
     getAvailableChannels: (channelType: string) => Channel[];
@@ -50,7 +52,7 @@ interface UseCommunicationActionsOptions {
 /**
  * Инкапсулирует действия панели: звонок, выбор каналов, выбор атрибутов.
  */
-export declare function useCommunicationActions({ activeChannelType, channels, selectedChannel, selectedChannelType, hoveredAttribute, confirmingAttributeId, isAttributeBlocked, closeMenu, hasMultipleChannels, getSingleChannelForType, getAvailableChannels, isChannelEmpty, isNewDialog, showDefaultChannelTooltipWithTimer, clearDefaultChannelTooltip, emit, panelPendingSelection, }: UseCommunicationActionsOptions): {
+export declare function useCommunicationActions({ activeChannelType, channels, selectedChannel, selectedChannelType, hoveredAttribute, confirmingAttributeId, isAttributeBlocked, closeMenu, pinMenuOpen, hasMultipleChannels, getSingleChannelForType, getAvailableChannels, isChannelEmpty, isNewDialog, showDefaultChannelTooltipWithTimer, clearDefaultChannelTooltip, emit, panelPendingSelection, }: UseCommunicationActionsOptions): {
     handlePhoneCall: (attribute: ContactAttribute | null | undefined) => void;
     handleAttributeClick: (attribute: ContactAttribute) => void;
     selectSingleChannel: (attribute: ContactAttribute, channelId: string) => void;

package/dist/types/components/2_blocks/CommunicationPanel/composables/useCommunicationMenu.d.ts

@@ -18,9 +18,12 @@ export declare function useCommunicationMenu({ panelRef, selectedChannelType, fr
     hoveredChannel: Ref<string | null, string | null>;
     showMenu: Ref<boolean, boolean>;
     showSubMenu: Ref<boolean, boolean>;
+    retainOpenUntilDismiss: Ref<boolean, boolean>;
     handleChannelClick: (channelType: string) => void;
     openMenu: (channelType: string) => void;
     closeMenu: () => void;
+    pinMenuOpen: () => void;
+    armOutsideClickSuppression: () => void;
     handleClickOutside: (event: Event) => void;
 };
 export {};

package/dist/types/components/2_blocks/CommunicationPanel/composables/useCommunicationSubMenu.d.ts

@@ -1,17 +1,19 @@
-import { type Ref } from 'vue';
+import { type ComputedRef, type Ref } from 'vue';
 import type { ContactAttribute } from './useCommunicationAttributes';
 interface UseCommunicationSubMenuOptions {
     activeChannelType: Ref<string | null>;
     showSubMenu: Ref<boolean>;
     frozenAttribute: Ref<ContactAttribute | null>;
     hoveredAttribute: Ref<ContactAttribute | null>;
+    confirmingAttributeId: Ref<string | null> | ComputedRef<string | null>;
+    retainOpenUntilDismiss: Ref<boolean>;
     hasMultipleChannels: (channelType: string) => boolean;
     isAttributeBlocked: (attribute: ContactAttribute | null | undefined) => boolean;
 }
 /**
  * Управляет состоянием подменю выбора канала и hover-состояниями атрибутов.
  */
-export declare function useCommunicationSubMenu({ activeChannelType, showSubMenu, frozenAttribute, hoveredAttribute, hasMultipleChannels, isAttributeBlocked, }: UseCommunicationSubMenuOptions): {
+export declare function useCommunicationSubMenu({ activeChannelType, showSubMenu, frozenAttribute, hoveredAttribute, confirmingAttributeId, retainOpenUntilDismiss, hasMultipleChannels, isAttributeBlocked, }: UseCommunicationSubMenuOptions): {
     subMenuTop: Ref<number, number>;
     handleAttributeMouseEnter: (attribute: ContactAttribute, eventTarget: EventTarget | null) => EventTarget | null;
     handleAttributeMouseLeave: () => void;

package/dist/types/components/2_blocks/CommunicationPanel/stories/CommunicationPanel.stories.d.ts

@@ -2,6 +2,7 @@ import type { StoryObj } from '@storybook/vue3-vite';
 declare const meta: {
     title: string;
     component: import("vue").DefineComponent<{}, {
+        closeMenu: () => void;
         $emit: (event: "select-attribute-channel" | "confirm-attribute" | "phone-call" | "reset-blocked-attributes", ...args: any[]) => void;
         channels: unknown[];
         messages: unknown[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mobilon-dev/chotto",
-  "version": "0.3.85",
+  "version": "0.3.86",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",