@mobilon-dev/chotto 0.3.78 → 0.3.79

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

@@ -1,100 +1,98 @@
-import { computed as p, unref as A, ref as h, watch as g } from "vue";
-import { CHANNEL_TYPES as t } from "./useCommunicationChannels.js";
-const C = ["confirmed", "unconfirmed"];
-function S(n) {
-  return C.includes(n);
+import { computed as A, unref as a, ref as y, watch as g } from "vue";
+const T = ["confirmed", "unconfirmed"];
+function w(n) {
+  return T.includes(n);
 }
-function k(n) {
+function B(n) {
   const e = n == null ? void 0 : n.status;
-  return S(e) ? `status-${e}` : null;
+  return w(e) ? `status-${e}` : null;
 }
-function d(n) {
+function C(n) {
   return (n == null ? void 0 : n.status) === "confirmed";
 }
-function T(n) {
+function E(n) {
   return (n == null ? void 0 : n.status) === "unconfirmed";
 }
-function z(n) {
-  return T(n);
+function O(n) {
+  return E(n);
 }
-function s(n, e) {
-  return e || d(n);
+function d(n, e) {
+  return e || C(n);
 }
-function v(n, e) {
-  return s(n, e) ? e ? "selected-indicator" : "confirmed-indicator" : null;
+function U(n, e) {
+  return d(n, e) ? e ? "selected-indicator" : "confirmed-indicator" : null;
 }
-function c(n, e) {
+function l(n, e) {
   return !e || !(n != null && n.id) ? !1 : n.id === e;
 }
-function m(n, e) {
+function S(n, e) {
   return !(n != null && n.id) || !(e != null && e.length) ? !1 : e.includes(n.id);
 }
-function y(n, e) {
-  return c(n, e.confirmingAttributeId) || s(n, e.isSelected);
+function v(n, e) {
+  return l(n, e.confirmingAttributeId) || d(n, e.isSelected);
 }
-function B(n, e) {
-  return m(n, e.blockedAttributeIds) ? !c(n, e.confirmingAttributeId) && !s(n, e.isSelected) : !1;
+function F(n, e) {
+  return S(n, e.blockedAttributeIds) ? !l(n, e.confirmingAttributeId) && !d(n, e.isSelected) : !1;
 }
-function E(n, e) {
-  return c(n, e.confirmingAttributeId) ? "confirming" : m(n, e.blockedAttributeIds) ? "blocked" : y(n, e) ? e.isSelected ? "selected" : d(n) ? "confirmed" : null : null;
+function z(n, e) {
+  return l(n, e.confirmingAttributeId) ? "confirming" : S(n, e.blockedAttributeIds) ? "blocked" : v(n, e) ? e.isSelected ? "selected" : C(n) ? "confirmed" : null : null;
 }
-function N(n, e, u) {
-  const o = E(n, u);
-  return !o || !e ? "" : e[o] ?? "";
+function L(n, e, c) {
+  const s = z(n, c);
+  return !s || !e ? "" : e[s] ?? "";
 }
-function O({
+function _({
   contactAttributes: n,
-  frozenAttribute: e
+  panelChannelTypes: e,
+  frozenAttribute: c
 }) {
-  const u = p(() => A(n) ?? []), o = h(
-    Object.fromEntries(t.map((i) => [i, []]))
-  ), f = () => {
-    const i = Object.fromEntries(
-      t.map((r) => [r, []])
-    );
-    u.value.forEach((r) => {
+  const s = A(() => a(n) ?? []), f = A(() => a(e) ?? []), m = (o) => Object.fromEntries(o.map((i) => [i, []])), p = y(
+    m(f.value)
+  ), t = () => {
+    const o = f.value, i = m(o), u = new Set(o);
+    s.value.forEach((r) => {
       if (!(!r || !r.type)) {
         if (r.type === "telegram") {
-          i.telegram.push(r);
+          u.has("telegram") && i.telegram.push(r);
           return;
         }
         if (r.type === "max") {
-          i.max.push(r);
+          u.has("max") && i.max.push(r);
           return;
         }
         if (r.type === "phone") {
-          ["whatsapp", "sms", "phone"].forEach((l) => {
-            i[l].push(r);
+          ["whatsapp", "sms", "phone"].forEach((h) => {
+            u.has(h) && i[h].push(r);
           });
           return;
         }
-        i[r.type] && i[r.type].push(r);
+        u.has(r.type) && i[r.type] && i[r.type].push(r);
       }
-    }), o.value = i;
+    }), p.value = i;
   };
-  return g(u, f, { deep: !0, immediate: !0 }), {
-    organizedContactAttributes: o,
-    organizeContactAttributes: f,
-    isAttributeFrozen: (i) => {
-      const r = e.value;
-      return !i || !(r != null && r.id) ? !1 : i.id === r.id;
+  return g(s, t, { deep: !0, immediate: !0 }), g(f, t), {
+    organizedContactAttributes: p,
+    organizeContactAttributes: t,
+    isAttributeFrozen: (o) => {
+      const i = c.value;
+      return !o || !(i != null && i.id) ? !1 : o.id === i.id;
     }
   };
 }
 export {
-  C as CONTACT_ATTRIBUTE_STATUSES,
-  v as getAttributeCheckIndicatorClass,
-  E as getAttributeIndicatorTooltipKey,
-  N as getAttributeIndicatorTooltipText,
-  k as getAttributeStatusClass,
-  m as isAttributeBlocked,
-  d as isAttributeConfirmed,
-  c as isAttributeConfirming,
-  T as isAttributeUnconfirmed,
-  S as isContactAttributeStatus,
-  z as needsAttributeConfirmation,
-  s as shouldShowAttributeCheckmark,
-  y as shouldShowAttributeIndicator,
-  B as shouldShowBlockedIndicatorSlot,
-  O as useCommunicationAttributes
+  T as CONTACT_ATTRIBUTE_STATUSES,
+  U as getAttributeCheckIndicatorClass,
+  z as getAttributeIndicatorTooltipKey,
+  L as getAttributeIndicatorTooltipText,
+  B as getAttributeStatusClass,
+  S as isAttributeBlocked,
+  C as isAttributeConfirmed,
+  l as isAttributeConfirming,
+  E as isAttributeUnconfirmed,
+  w as isContactAttributeStatus,
+  O as needsAttributeConfirmation,
+  d as shouldShowAttributeCheckmark,
+  v as shouldShowAttributeIndicator,
+  F as shouldShowBlockedIndicatorSlot,
+  _ as useCommunicationAttributes
 };

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

@@ -1,71 +1,95 @@
-import { computed as m, unref as c } from "vue";
+import { computed as c, unref as i } from "vue";
 /* empty css                                            */
-import P from "../icons/CommunicationPanelPhoneIcon.vue.js";
-import S from "../icons/CommunicationPanelWhatsAppIcon.vue.js";
-import M from "../icons/CommunicationPanelTelegramIcon.vue.js";
-import T from "../icons/CommunicationPanelMaxIcon.vue.js";
-import b from "../icons/CommunicationPanelSMSIcon.vue.js";
-import d from "../icons/CommunicationPanelSubmenuPhoneIcon.vue.js";
-import v from "../icons/CommunicationPanelSubmenuWhatsAppIcon.vue.js";
-import x from "../icons/CommunicationPanelSubmenuTelegramIcon.vue.js";
-import w from "../icons/CommunicationPanelSubmenuMaxIcon.vue.js";
-import A from "../icons/CommunicationPanelSubmenuSMSIcon.vue.js";
-const F = ["whatsapp", "telegram", "max", "sms", "phone"], y = {
-  phone: P,
-  whatsapp: S,
-  telegram: M,
-  max: T,
-  sms: b
-}, E = {
-  phone: d,
-  whatsapp: v,
-  telegram: x,
-  max: w,
+import M from "../icons/CommunicationPanelPhoneIcon.vue.js";
+import b from "../icons/CommunicationPanelWhatsAppIcon.vue.js";
+import w from "../icons/CommunicationPanelTelegramIcon.vue.js";
+import x from "../icons/CommunicationPanelMaxIcon.vue.js";
+import A from "../icons/CommunicationPanelSMSIcon.vue.js";
+import y from "../icons/CommunicationPanelSubmenuPhoneIcon.vue.js";
+import E from "../icons/CommunicationPanelSubmenuWhatsAppIcon.vue.js";
+import F from "../icons/CommunicationPanelSubmenuTelegramIcon.vue.js";
+import L from "../icons/CommunicationPanelSubmenuMaxIcon.vue.js";
+import N from "../icons/CommunicationPanelSubmenuSMSIcon.vue.js";
+const I = ["whatsapp", "telegram", "max", "sms", "phone"], _ = ["max", "telegram", "whatsapp", "sms", "phone"];
+function g(a) {
+  return I.includes(a);
+}
+function D(a, r) {
+  const u = (a ?? _).filter(g), m = r === void 0 ? [...I] : r.filter(g), p = new Set(m), t = /* @__PURE__ */ new Set(), l = [];
+  for (const o of u)
+    p.has(o) && !t.has(o) && (t.add(o), l.push(o));
+  for (const o of m)
+    t.has(o) || (t.add(o), l.push(o));
+  return l;
+}
+const H = {
+  phone: M,
+  whatsapp: b,
+  telegram: w,
+  max: x,
   sms: A
-}, L = {
+}, R = {
+  phone: y,
+  whatsapp: E,
+  telegram: F,
+  max: L,
+  sms: N
+}, W = {
   phone: "Позвонить",
   whatsapp: "Выберите контакт и канал для отправки сообщения",
   telegram: "Выберите контакт и канал для отправки сообщения",
   max: "Выберите контакт и канал для отправки сообщения",
   sms: "Выберите контакт и канал для отправки сообщения"
 };
-function O({ channels: i, channelTooltips: u, selectedChannelType: s }) {
-  const t = m(() => c(i) ?? []), p = m(() => c(u) ?? {}), h = m(
-    () => F.map((n) => ({
+function Z({
+  channels: a,
+  channelTooltips: r,
+  channelOrder: u,
+  visibleChannelTypes: m,
+  selectedChannelType: p
+}) {
+  const t = c(() => i(a) ?? []), l = c(() => i(r) ?? {}), o = c(
+    () => D(i(u), i(m))
+  ), d = c(
+    () => o.value.map((n) => ({
       type: n,
-      component: y[n]
+      component: H[n]
     }))
-  ), C = (n) => {
-    const e = p.value[n];
-    return e || (L[n] ?? "");
-  }, o = (n) => {
+  ), S = (n) => {
+    const e = l.value[n];
+    return e || (W[n] ?? "");
+  }, s = (n) => {
     if (!n) return null;
     const [e] = n.split(".");
     return e.includes("waba") ? "whatsapp" : e.includes("telegrambot") ? "telegram" : e;
-  }, g = (n) => t.value.filter((e) => o(e.channelId) === n).length > 1, f = (n) => s.value === n, l = (n) => {
-    const e = t.value.filter((I) => o(I.channelId) === n);
+  }, P = (n) => t.value.filter((e) => s(e.channelId) === n).length > 1, T = (n) => p.value === n, C = (n) => {
+    const e = t.value.filter((v) => s(v.channelId) === n);
     return e.length === 1 ? e[0] : null;
-  }, a = (n) => E[n] ?? null, r = (n) => {
-    const e = o(n);
-    return e ? a(e) : null;
+  }, h = (n) => R[n] ?? null, f = (n) => {
+    const e = s(n);
+    return e ? h(e) : null;
   };
   return {
-    channelsTypes: h,
-    getTooltipText: C,
-    getChannelTypeFromId: o,
-    hasMultipleChannels: g,
-    isChannelActive: f,
-    getSingleChannelForType: l,
-    getMenuChannelIconComponent: a,
-    getMenuChannelIconComponentForChannelId: r,
+    panelChannelTypes: o,
+    channelsTypes: d,
+    getTooltipText: S,
+    getChannelTypeFromId: s,
+    hasMultipleChannels: P,
+    isChannelActive: T,
+    getSingleChannelForType: C,
+    getMenuChannelIconComponent: h,
+    getMenuChannelIconComponentForChannelId: f,
     getSingleMenuChannelIconComponent: (n) => {
-      const e = l(n);
-      return e ? r(e.channelId) : a(n);
+      const e = C(n);
+      return e ? f(e.channelId) : h(n);
     },
-    getAvailableChannels: (n) => t.value.filter((e) => o(e.channelId) === n)
+    getAvailableChannels: (n) => t.value.filter((e) => s(e.channelId) === n)
   };
 }
 export {
-  F as CHANNEL_TYPES,
-  O as useCommunicationChannels
+  I as CHANNEL_TYPES,
+  _ as DEFAULT_CHANNEL_ORDER,
+  g as isChannelType,
+  D as resolvePanelChannelTypes,
+  Z as useCommunicationChannels
 };

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

@@ -13,6 +13,8 @@ declare const _default: import("vue").DefineComponent<{}, {
     attributeTooltips: Record<string, any>;
     attributeIndicatorTooltips: Record<string, any>;
     showChannelIcons: boolean;
+    channelOrder?: unknown[] | undefined;
+    visibleChannelTypes?: unknown[] | undefined;
     $props: {
         readonly channels?: unknown[] | undefined;
         readonly messages?: unknown[] | undefined;
@@ -27,6 +29,8 @@ declare const _default: import("vue").DefineComponent<{}, {
         readonly attributeTooltips?: Record<string, any> | undefined;
         readonly attributeIndicatorTooltips?: Record<string, any> | undefined;
         readonly showChannelIcons?: boolean | undefined;
+        readonly channelOrder?: unknown[] | undefined;
+        readonly visibleChannelTypes?: unknown[] | undefined;
     };
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

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

@@ -1,4 +1,5 @@
 import { type Ref, type ComputedRef } from 'vue';
+import { type ChannelType } from './useCommunicationChannels';
 /** Допустимые статусы контактного атрибута */
 export declare const CONTACT_ATTRIBUTE_STATUSES: readonly ["confirmed", "unconfirmed"];
 export type ContactAttributeStatus = (typeof CONTACT_ATTRIBUTE_STATUSES)[number];
@@ -54,11 +55,12 @@ type MaybeRef<T> = T | Ref<T> | ComputedRef<T>;
 /**
  * Параметры composable для работы с контактными атрибутами.
  */
+type PanelChannelTypesRef = MaybeRef<readonly ChannelType[]>;
 interface UseCommunicationAttributesOptions {
     /** Реактивный список контактных атрибутов */
     contactAttributes: MaybeRef<ContactAttribute[]>;
-    /** Текущий активный тип канала */
-    activeChannelType: Ref<string | null>;
+    /** Типы каналов, отображаемые в панели */
+    panelChannelTypes: PanelChannelTypesRef;
     /** Текущий замороженный атрибут (подсвеченный) */
     frozenAttribute: Ref<{
         id?: string;
@@ -67,7 +69,7 @@ interface UseCommunicationAttributesOptions {
 /**
  * Формирует структуру организованных атрибутов.
  */
-export declare function useCommunicationAttributes({ contactAttributes, frozenAttribute, }: UseCommunicationAttributesOptions): {
+export declare function useCommunicationAttributes({ contactAttributes, panelChannelTypes, frozenAttribute, }: UseCommunicationAttributesOptions): {
     organizedContactAttributes: Ref<Record<string, ContactAttribute[]>, Record<string, ContactAttribute[]>>;
     organizeContactAttributes: () => void;
     isAttributeFrozen: (attribute: ContactAttribute | null | undefined) => boolean;

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

@@ -1,9 +1,17 @@
 import { type Component, type ComputedRef, type Ref } from 'vue';
 /**
- * Список поддерживаемых типов каналов в панели коммуникаций.
+ * Все поддерживаемые типы каналов в панели коммуникаций.
  */
 export declare const CHANNEL_TYPES: readonly ["whatsapp", "telegram", "max", "sms", "phone"];
 export type ChannelType = (typeof CHANNEL_TYPES)[number];
+/** Порядок кнопок каналов по умолчанию. */
+export declare const DEFAULT_CHANNEL_ORDER: readonly ChannelType[];
+export declare function isChannelType(value: string): value is ChannelType;
+/**
+ * Собирает итоговый список типов для панели: порядок из channelOrder, видимость из visibleChannelTypes.
+ * Типы из visibleChannelTypes, отсутствующие в channelOrder, добавляются в конце.
+ */
+export declare function resolvePanelChannelTypes(channelOrder: readonly string[] | undefined, visibleChannelTypes: readonly string[] | undefined): ChannelType[];
 /**
  * Базовое описание канала.
  */
@@ -16,15 +24,21 @@ type MaybeRef<T> = T | Ref<T> | ComputedRef<T>;
 type ChannelTooltips = Record<string, string>;
 type ChannelsRef = MaybeRef<Channel[]>;
 type ChannelTooltipsRef = MaybeRef<ChannelTooltips | undefined>;
+type ChannelTypesRef = MaybeRef<readonly string[] | undefined>;
 interface UseCommunicationChannelsOptions {
     /** Реактивный список каналов */
     channels: ChannelsRef;
     /** Реактивная карта пользовательских подсказок */
     channelTooltips?: ChannelTooltipsRef;
+    /** Порядок кнопок каналов в панели */
+    channelOrder?: ChannelTypesRef;
+    /** Типы каналов, которые нужно отображать (с бэка — доступные пользователю) */
+    visibleChannelTypes?: ChannelTypesRef;
     /** Текущий выбранный тип канала */
     selectedChannelType: Ref<string | null>;
 }
-export declare function useCommunicationChannels({ channels, channelTooltips, selectedChannelType }: UseCommunicationChannelsOptions): {
+export declare function useCommunicationChannels({ channels, channelTooltips, channelOrder, visibleChannelTypes, selectedChannelType, }: UseCommunicationChannelsOptions): {
+    panelChannelTypes: ComputedRef<("phone" | "whatsapp" | "telegram" | "sms" | "max")[]>;
     channelsTypes: ComputedRef<{
         type: "phone" | "whatsapp" | "telegram" | "sms" | "max";
         component: Component;

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

@@ -16,6 +16,8 @@ declare const meta: {
         attributeTooltips: Record<string, any>;
         attributeIndicatorTooltips: Record<string, any>;
         showChannelIcons: boolean;
+        channelOrder?: unknown[] | undefined;
+        visibleChannelTypes?: unknown[] | undefined;
         $props: {
             readonly channels?: unknown[] | undefined;
             readonly messages?: unknown[] | undefined;
@@ -30,6 +32,8 @@ declare const meta: {
             readonly attributeTooltips?: Record<string, any> | undefined;
             readonly attributeIndicatorTooltips?: Record<string, any> | undefined;
             readonly showChannelIcons?: boolean | undefined;
+            readonly channelOrder?: unknown[] | undefined;
+            readonly visibleChannelTypes?: unknown[] | undefined;
         };
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     args: {};
@@ -37,4 +41,8 @@ declare const meta: {
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
+/** Только телефон — без мессенджеров (нет доступных каналов связи). */
+export declare const PhoneOnly: Story;
+/** Доступны только WhatsApp и Telegram, свой порядок. */
+export declare const LimitedMessengers: Story;
 export declare const InteractiveWithFeed: Story;

package/package.json

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