@webitel/ui-sdk 26.8.106 → 26.8.108

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 (29) hide show
  1. package/dist/{components-CRmvV0ze.js → components-BwnHoOxc.js} +3 -3
  2. package/dist/ui-sdk.css +1 -1
  3. package/dist/ui-sdk.js +1 -1
  4. package/dist/ui-sdk.umd.cjs +381 -381
  5. package/dist/{wt-chat-emoji-DUYgD7x0.js → wt-chat-emoji-YWk_As-i.js} +1 -1
  6. package/dist/{wt-display-chip-items-Dm6I2JFC.js → wt-display-chip-items-CM7ukRbx.js} +1 -1
  7. package/dist/{wt-send-message-popup-afA26_0Q.js → wt-send-message-popup-DpWs6kDO.js} +1 -1
  8. package/dist/{wt-tree-table-DMK0J0Jx.js → wt-tree-table-B24eT18h.js} +75 -58
  9. package/dist/{wt-type-extension-value-input-CEX06xVC.js → wt-type-extension-value-input-B2GxgFE7.js} +1 -1
  10. package/dist/{wt-vidstack-player-1Z1fEhkA.js → wt-vidstack-player-CfRt7lLu.js} +1 -1
  11. package/package.json +7 -2
  12. package/src/components/wt-tree-table-row/__tests__/WtTreeTableRow.spec.js +4 -3
  13. package/src/components/wt-tree-table-row/wt-tree-table-row.vue +45 -2
  14. package/src/locale/en/en.js +3 -5
  15. package/src/locale/es/es.js +3 -5
  16. package/src/locale/kz/kz.js +3 -5
  17. package/src/locale/pl/pl.js +3 -5
  18. package/src/locale/ro/ro.js +3 -5
  19. package/src/locale/ru/ru.js +3 -5
  20. package/src/locale/uk/uk.js +3 -5
  21. package/src/locale/uz/uz.js +3 -5
  22. package/src/locale/vi/vi.js +3 -5
  23. package/src/modules/AgentStatusSelect/components/_internals/wt-cc-activity-type-popup.vue +3 -0
  24. package/src/modules/AgentStatusSelect/components/wt-cc-agent-status-select.vue +15 -2
  25. package/src/modules/AgentStatusSelect/composables/useCCenterModeSwitcher.ts +2 -1
  26. package/src/modules/AgentStatusSelect/index.ts +1 -0
  27. package/types/.tsbuildinfo +1 -1
  28. package/types/modules/AgentStatusSelect/composables/useCCenterModeSwitcher.d.ts +1 -1
  29. package/types/modules/AgentStatusSelect/index.d.ts +1 -0
@@ -1,4 +1,4 @@
1
- import "./components-CRmvV0ze.js";
1
+ import "./components-BwnHoOxc.js";
2
2
  import { t as e } from "./_plugin-vue_export-helper-B3ysoDQm.js";
3
3
  import { c as t } from "./enums-BDtfwdQu.js";
4
4
  import { t as n } from "./wt-button-C-BRwWdy.js";
@@ -1,4 +1,4 @@
1
- import { C as e, i as t } from "./components-CRmvV0ze.js";
1
+ import { C as e, i as t } from "./components-BwnHoOxc.js";
2
2
  import { t as n } from "./_plugin-vue_export-helper-B3ysoDQm.js";
3
3
  import { t as r } from "./utils-DaacyMAw.js";
4
4
  import { Fragment as i, computed as a, createCommentVNode as o, createElementBlock as s, createTextVNode as c, createVNode as l, defineComponent as u, openBlock as d, renderList as f, renderSlot as p, toDisplayString as m, unref as h, withCtx as g } from "vue";
@@ -1,4 +1,4 @@
1
- import { n as e } from "./components-CRmvV0ze.js";
1
+ import { n as e } from "./components-BwnHoOxc.js";
2
2
  import "./convertDuration-heRoQzks.js";
3
3
  import { n as t, r as n } from "./clients-Dm3JLACL.js";
4
4
  import { t as r } from "./vue-i18n-B88GcHzn.js";
@@ -3,15 +3,15 @@ import { n as t } from "./sortQueryAdapters-CyYXvnDN.js";
3
3
  import { t as n } from "./wt-checkbox-BBdi-1oS.js";
4
4
  import { t as r } from "./wt-icon-btn-BFRfANYh.js";
5
5
  import { t as i } from "./useWtTable-CUpN0LZ5.js";
6
- import { Fragment as a, computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createSlots as d, createTextVNode as f, createVNode as p, defineComponent as m, normalizeClass as h, normalizeStyle as g, onMounted as _, openBlock as v, ref as y, renderList as b, renderSlot as x, resolveComponent as S, toDisplayString as C, toRef as w, unref as T, withCtx as E, withModifiers as D } from "vue";
6
+ import { Fragment as a, computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createSlots as d, createTextVNode as f, createVNode as p, defineComponent as m, nextTick as h, normalizeClass as g, normalizeStyle as _, onMounted as v, openBlock as y, ref as b, renderList as x, renderSlot as S, resolveComponent as C, toDisplayString as w, toRef as T, unref as E, withCtx as D, withModifiers as O } from "vue";
7
7
  //#region src/components/wt-tree-table-row/wt-tree-table-row.vue?vue&type=script&setup=true&lang.ts
8
- var O = { class: "wt-tree-table-row" }, k = { class: "wt-tree-table-td__content" }, A = {
8
+ var k = { class: "wt-tree-table-row" }, A = { class: "wt-tree-table-td__content" }, j = {
9
9
  key: 0,
10
10
  class: "wt-tree-table-td__icon-wrapper"
11
- }, j = {
11
+ }, M = {
12
12
  key: 0,
13
13
  class: "wt-tree-table-td__actions typo-body-1"
14
- }, M = { class: "wt-tree-table-td__content" }, N = /*#__PURE__*/ e(/* @__PURE__ */ m({
14
+ }, N = { class: "wt-tree-table-td__content" }, P = ["colspan"], F = /*#__PURE__*/ e(/* @__PURE__ */ m({
15
15
  __name: "wt-tree-table-row",
16
16
  props: {
17
17
  data: {},
@@ -32,74 +32,86 @@ var O = { class: "wt-tree-table-row" }, k = { class: "wt-tree-table-td__content"
32
32
  },
33
33
  emits: ["update:selected", "expanded-collapse"],
34
34
  setup(e, { emit: t }) {
35
- let i = e, p = t, m = y(!0), h = o(() => i.nestingLevel), w = o(() => i.nestingLevel + 1), T = o(() => i.selectedElements.includes(i.data)), D = () => {
35
+ let i = e, p = t, m = b(!0), g = b(null), T = o(() => i.nestingLevel), E = o(() => i.nestingLevel + 1), O = o(() => (i.dataHeaders?.length || 0) + +!!i.gridActions), F = o(() => i.selectedElements.includes(i.data)), I = () => {
36
+ h(() => {
37
+ let e = g.value, t = e?.closest(".wt-tree-table");
38
+ if (!e || !t) return;
39
+ let n = e.getBoundingClientRect().bottom - t.getBoundingClientRect().bottom;
40
+ n > 0 && t.scrollBy({
41
+ top: n,
42
+ behavior: "smooth"
43
+ });
44
+ });
45
+ }, L = () => {
46
+ m.value = !m.value, m.value || I();
47
+ }, R = () => {
36
48
  m.value = !1, p("expanded-collapse");
37
- }, N = (e, t = 0) => {
49
+ }, z = (e, t = 0) => {
38
50
  if (e[i.searchedProp] && t) return !0;
39
51
  if (Array.isArray(e[i.childrenProp])) {
40
- for (let n of e[i.childrenProp]) if (N(n, t + 1)) return !0;
52
+ for (let n of e[i.childrenProp]) if (z(n, t + 1)) return !0;
41
53
  }
42
54
  return !1;
43
55
  };
44
- return _(() => {
45
- i.searchedProp && N(i.data) && D();
56
+ return v(() => {
57
+ i.searchedProp && z(i.data) && R();
46
58
  }), (t, i) => {
47
- let o = S("wt-tree-table-row", !0);
48
- return v(), l(a, null, [u("tr", O, [(v(!0), l(a, null, b(e.dataHeaders, (o, d) => (v(), l("td", {
59
+ let o = C("wt-tree-table-row", !0);
60
+ return y(), l(a, null, [u("tr", k, [(y(!0), l(a, null, x(e.dataHeaders, (o, d) => (y(), l("td", {
49
61
  key: o.value,
50
- style: g(o.width ? `min-width:${o.width}` : ""),
62
+ style: _(o.width ? `min-width:${o.width}` : ""),
51
63
  class: "wt-tree-table-td typo-body-1"
52
- }, [u("div", k, [d ? c("", !0) : (v(), l("div", A, [
53
- (v(!0), l(a, null, b(h.value, (e) => (v(), l("div", {
64
+ }, [u("div", A, [d ? c("", !0) : (y(), l("div", j, [
65
+ (y(!0), l(a, null, x(T.value, (e) => (y(), l("div", {
54
66
  key: e,
55
67
  class: "wt-tree-table-row__tree-space"
56
68
  }))), 128)),
57
- e.selectable ? (v(), s(n, {
69
+ e.selectable ? (y(), s(n, {
58
70
  key: 0,
59
- selected: T.value,
71
+ selected: F.value,
60
72
  "onUpdate:selected": i[0] ||= (n) => t.$emit("update:selected", {
61
73
  data: e.data,
62
74
  select: n
63
75
  })
64
76
  }, null, 8, ["selected"])) : c("", !0),
65
- e.data[e.childrenProp] ? (v(), s(r, {
77
+ e.data[e.childrenProp] ? (y(), s(r, {
66
78
  key: 1,
67
79
  icon: m.value ? "tree-expand" : "tree-collapse",
68
- onClick: i[1] ||= (e) => m.value = !m.value
80
+ onClick: L
69
81
  }, null, 8, ["icon"])) : c("", !0)
70
- ])), x(t.$slots, o.value, {
82
+ ])), S(t.$slots, o.value, {
71
83
  index: e.rowPosition,
72
84
  item: e.data
73
- }, () => [f(C(e.data[o.value]), 1)], !0)])], 4))), 128)), e.gridActions ? (v(), l("td", j, [u("div", M, [x(t.$slots, "actions", {
85
+ }, () => [f(w(e.data[o.value]), 1)], !0)])], 4))), 128)), e.gridActions ? (y(), l("td", M, [u("div", N, [S(t.$slots, "actions", {
74
86
  index: e.rowPosition,
75
87
  item: e.data
76
- }, void 0, !0)])])) : c("", !0)]), m.value ? c("", !0) : (v(!0), l(a, { key: 0 }, b(e.data[e.childrenProp], (n, r) => (v(), s(o, {
88
+ }, void 0, !0)])])) : c("", !0)]), m.value ? c("", !0) : (y(), l(a, { key: 0 }, [(y(!0), l(a, null, x(e.data[e.childrenProp], (n, r) => (y(), s(o, {
77
89
  key: r,
78
90
  "children-prop": e.childrenProp,
79
91
  data: n,
80
92
  "data-headers": e.dataHeaders,
81
- "nesting-level": w.value,
93
+ "nesting-level": E.value,
82
94
  "row-position": e.rowPosition,
83
95
  "searched-prop": e.searchedProp,
84
96
  selectable: e.selectable,
85
97
  "selected-elements": e.selectedElements,
86
- onExpandedCollapse: D,
87
- "onUpdate:selected": i[2] ||= (e) => t.$emit("update:selected", {
98
+ onExpandedCollapse: R,
99
+ "onUpdate:selected": i[1] ||= (e) => t.$emit("update:selected", {
88
100
  data: e.data,
89
101
  select: e.select
90
102
  })
91
103
  }, d({
92
- actions: E(({ item: n }) => [x(t.$slots, "actions", {
104
+ actions: D(({ item: n }) => [S(t.$slots, "actions", {
93
105
  index: e.rowPosition,
94
106
  item: n
95
107
  }, void 0, !0)]),
96
108
  _: 2
97
- }, [b(e.dataHeaders, (n) => ({
109
+ }, [x(e.dataHeaders, (n) => ({
98
110
  name: n.value,
99
- fn: E(({ item: r }) => [x(t.$slots, n.value, {
111
+ fn: D(({ item: r }) => [S(t.$slots, n.value, {
100
112
  index: e.rowPosition,
101
113
  item: r
102
- }, () => [u("div", null, C(r[n.value]), 1)], !0)])
114
+ }, () => [u("div", null, w(r[n.value]), 1)], !0)])
103
115
  }))]), 1032, [
104
116
  "children-prop",
105
117
  "data",
@@ -109,13 +121,18 @@ var O = { class: "wt-tree-table-row" }, k = { class: "wt-tree-table-td__content"
109
121
  "searched-prop",
110
122
  "selectable",
111
123
  "selected-elements"
112
- ]))), 128))], 64);
124
+ ]))), 128)), u("tr", {
125
+ ref_key: "childrenEndRef",
126
+ ref: g,
127
+ "aria-hidden": "true",
128
+ class: "wt-tree-table-row__children-end"
129
+ }, [u("td", { colspan: O.value }, null, 8, P)], 512)], 64))], 64);
113
130
  };
114
131
  }
115
- }), [["__scopeId", "data-v-12c9ea16"]]), P = { class: "wt-tree-table wt-scrollbar" }, F = { class: "wt-tree-table-wrapper" }, I = { class: "wt-tree-table-head" }, L = { class: "wt-tree-table-tr wt-tree-table-tr-head" }, R = ["onClick"], z = { class: "wt-tree-table-th__text" }, B = {
132
+ }), [["__scopeId", "data-v-8b7680a3"]]), I = { class: "wt-tree-table wt-scrollbar" }, L = { class: "wt-tree-table-wrapper" }, R = { class: "wt-tree-table-head" }, z = { class: "wt-tree-table-tr wt-tree-table-tr-head" }, B = ["onClick"], V = { class: "wt-tree-table-th__text" }, H = {
116
133
  key: 0,
117
134
  class: "wt-tree-table-th__actions"
118
- }, V = { class: "wt-tree-table-th__content" }, H = { class: "wt-tree-table-body" }, U = /*#__PURE__*/ e(/* @__PURE__ */ m({
135
+ }, U = { class: "wt-tree-table-th__content" }, W = { class: "wt-tree-table-body" }, G = /*#__PURE__*/ e(/* @__PURE__ */ m({
119
136
  __name: "wt-tree-table",
120
137
  props: {
121
138
  headers: {},
@@ -138,62 +155,62 @@ var O = { class: "wt-tree-table-row" }, k = { class: "wt-tree-table-td__content"
138
155
  },
139
156
  emits: ["sort", "update:selected"],
140
157
  setup(e, { emit: r }) {
141
- let m = e, _ = r, y = (e) => e[m.childrenProp] && Array.isArray(e[m.childrenProp]), O = (e) => {
158
+ let m = e, h = r, v = (e) => e[m.childrenProp] && Array.isArray(e[m.childrenProp]), b = (e) => {
142
159
  let t = [], n = (e) => {
143
160
  if (e._isSelected) return [e];
144
- y(e) && e[m.childrenProp].forEach(n);
161
+ v(e) && e[m.childrenProp].forEach(n);
145
162
  };
146
163
  return e.forEach(n), t;
147
164
  }, k = (e) => {
148
165
  let t = [], n = (e) => {
149
- t.push(e), y(e) && e[m.childrenProp].forEach(n);
166
+ t.push(e), v(e) && e[m.childrenProp].forEach(n);
150
167
  };
151
168
  return e.forEach(n), t;
152
- }, A = o(() => m.selected || O(m.data)), j = o(() => A.value.length === k(m.data).length && k(m.data).length > 0), { tableHeaders: M } = i({ headers: w(m, "headers") }), U = ({ sort: e }) => m.sortable && e !== void 0, W = (e) => {
153
- if (!U(e)) return;
169
+ }, A = o(() => m.selected || b(m.data)), j = o(() => A.value.length === k(m.data).length && k(m.data).length > 0), { tableHeaders: M } = i({ headers: T(m, "headers") }), N = ({ sort: e }) => m.sortable && e !== void 0, P = (e) => {
170
+ if (!N(e)) return;
154
171
  let n = t(e.sort);
155
- _("sort", e, n);
172
+ h("sort", e, n);
156
173
  }, G = (e, t) => {
157
174
  e.forEach((e) => {
158
- e._isSelected = t, y(e) && G(e[m.childrenProp], t);
175
+ e._isSelected = t, v(e) && G(e[m.childrenProp], t);
159
176
  });
160
177
  }, K = () => {
161
- m.selected ? _("update:selected", j.value ? [] : [...k(m.data)]) : j.value ? G(m.data, !1) : G(m.data, !0);
178
+ m.selected ? h("update:selected", j.value ? [] : [...k(m.data)]) : j.value ? G(m.data, !1) : G(m.data, !0);
162
179
  }, q = (e, t) => {
163
- m.selected ? t ? _("update:selected", [...A.value, e]) : _("update:selected", A.value.filter((t) => t !== e)) : e._isSelected = !e._isSelected;
180
+ m.selected ? t ? h("update:selected", [...A.value, e]) : h("update:selected", A.value.filter((t) => t !== e)) : e._isSelected = !e._isSelected;
164
181
  };
165
182
  return (t, r) => {
166
- let i = S("wt-icon");
167
- return v(), l("div", P, [u("table", F, [u("thead", I, [u("tr", L, [(v(!0), l(a, null, b(T(M), (t, a) => (v(), l("th", {
183
+ let i = C("wt-icon");
184
+ return y(), l("div", I, [u("table", L, [u("thead", R, [u("tr", z, [(y(!0), l(a, null, x(E(M), (t, a) => (y(), l("th", {
168
185
  key: String(a) + t?.sort,
169
- class: h([[{ "wt-tree-table-th--sortable": U(t) }, `wt-tree-table-th--sort-${t.sort}`], "wt-tree-table-th typo-body-1-bold"]),
170
- style: g(t.width ? `min-width:${t.width}` : ""),
171
- onClick: (e) => W(t)
172
- }, [u("div", { class: h(["wt-tree-table-th__content", { "wt-tree-table-th__content--selectable": a === 0 && e.selectable }]) }, [
173
- a === 0 && e.selectable ? (v(), l("div", {
186
+ class: g([[{ "wt-tree-table-th--sortable": N(t) }, `wt-tree-table-th--sort-${t.sort}`], "wt-tree-table-th typo-body-1-bold"]),
187
+ style: _(t.width ? `min-width:${t.width}` : ""),
188
+ onClick: (e) => P(t)
189
+ }, [u("div", { class: g(["wt-tree-table-th__content", { "wt-tree-table-th__content--selectable": a === 0 && e.selectable }]) }, [
190
+ a === 0 && e.selectable ? (y(), l("div", {
174
191
  key: 0,
175
- onClick: r[0] ||= D(() => {}, ["stop"])
192
+ onClick: r[0] ||= O(() => {}, ["stop"])
176
193
  }, [p(n, {
177
194
  selected: j.value,
178
195
  "onUpdate:selected": K
179
196
  }, null, 8, ["selected"])])) : c("", !0),
180
- u("div", z, C(t.text), 1),
181
- e.sortable ? (v(), s(i, {
197
+ u("div", V, w(t.text), 1),
198
+ e.sortable ? (y(), s(i, {
182
199
  key: 1,
183
200
  class: "wt-tree-table-th-sort-arrow wt-tree-table-th-sort-arrow--asc",
184
201
  icon: "sort-arrow-up",
185
202
  size: "sm"
186
203
  })) : c("", !0),
187
- e.sortable ? (v(), s(i, {
204
+ e.sortable ? (y(), s(i, {
188
205
  key: 2,
189
206
  class: "wt-tree-table-th-sort-arrow wt-tree-table-th-sort-arrow--desc",
190
207
  icon: "sort-arrow-down",
191
208
  size: "sm"
192
209
  })) : c("", !0)
193
- ], 2)], 14, R))), 128)), e.gridActions ? (v(), l("th", B, [u("div", V, [x(t.$slots, "actions-header", {}, void 0, !0)])])) : c("", !0)])]), u("tbody", H, [(v(!0), l(a, null, b(e.data, (n, i) => (v(), s(N, {
210
+ ], 2)], 14, B))), 128)), e.gridActions ? (y(), l("th", H, [u("div", U, [S(t.$slots, "actions-header", {}, void 0, !0)])])) : c("", !0)])]), u("tbody", W, [(y(!0), l(a, null, x(e.data, (n, i) => (y(), s(F, {
194
211
  key: i,
195
212
  "row-position": i,
196
- "data-headers": T(M),
213
+ "data-headers": E(M),
197
214
  data: n,
198
215
  selectable: e.selectable,
199
216
  "children-prop": e.childrenProp,
@@ -201,14 +218,14 @@ var O = { class: "wt-tree-table-row" }, k = { class: "wt-tree-table-td__content"
201
218
  "searched-prop": e.searchedProp,
202
219
  "onUpdate:selected": r[1] ||= (e) => q(e.data, e.select)
203
220
  }, d({
204
- actions: E(({ item: e }) => [x(t.$slots, "actions", { item: e }, void 0, !0)]),
221
+ actions: D(({ item: e }) => [S(t.$slots, "actions", { item: e }, void 0, !0)]),
205
222
  _: 2
206
- }, [b(T(M), (e) => ({
223
+ }, [x(E(M), (e) => ({
207
224
  name: e.value,
208
- fn: E(({ item: n }) => [x(t.$slots, e.value, {
225
+ fn: D(({ item: n }) => [S(t.$slots, e.value, {
209
226
  index: i,
210
227
  item: n
211
- }, () => [f(C(n[e.value]), 1)], !0)])
228
+ }, () => [f(w(n[e.value]), 1)], !0)])
212
229
  }))]), 1032, [
213
230
  "row-position",
214
231
  "data-headers",
@@ -222,4 +239,4 @@ var O = { class: "wt-tree-table-row" }, k = { class: "wt-tree-table-td__content"
222
239
  }
223
240
  }), [["__scopeId", "data-v-cb717c3e"]]);
224
241
  //#endregion
225
- export { U as default };
242
+ export { G as default };
@@ -1,4 +1,4 @@
1
- import { a as e, o as t, r as n, s as r } from "./components-CRmvV0ze.js";
1
+ import { a as e, o as t, r as n, s as r } from "./components-BwnHoOxc.js";
2
2
  import { t as i } from "./clients-Dm3JLACL.js";
3
3
  import { t as a } from "./enums-BDtfwdQu.js";
4
4
  import { t as o } from "./vue-i18n-B88GcHzn.js";
@@ -1,4 +1,4 @@
1
- import { w as e } from "./components-CRmvV0ze.js";
1
+ import { w as e } from "./components-BwnHoOxc.js";
2
2
  import "./convertDuration-heRoQzks.js";
3
3
  import { t } from "./_plugin-vue_export-helper-B3ysoDQm.js";
4
4
  import { c as n } from "./enums-BDtfwdQu.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webitel/ui-sdk",
3
- "version": "26.8.106",
3
+ "version": "26.8.108",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "dev": "npm run docs:dev",
@@ -25,7 +25,8 @@
25
25
  "prepare": "husky || true",
26
26
  "test:unit:ci": "npm run test:coverage",
27
27
  "typecheck": "vue-tsc --noEmit -p ./tsconfig.typecheck.json",
28
- "typecheck:ci": "vue-tsc --noEmit -p ./tsconfig.typecheck.json"
28
+ "typecheck:ci": "vue-tsc --noEmit -p ./tsconfig.typecheck.json",
29
+ "design-tokens:generate": "npm run design-tokens:generate --workspace=@webitel/styleguide"
29
30
  },
30
31
  "workspaces": [
31
32
  "./packages/api-services",
@@ -337,6 +338,10 @@
337
338
  "types": "./types/modules*",
338
339
  "import": "./src/modules*"
339
340
  },
341
+ "./modules/AgentStatusSelect": {
342
+ "types": "./types/modules/AgentStatusSelect/index.d.ts",
343
+ "import": "./src/modules/AgentStatusSelect/index.ts"
344
+ },
340
345
  "./modules/AppConfig": {
341
346
  "types": "./types/modules/AppConfig/index.d.ts",
342
347
  "import": "./src/modules/AppConfig/index.ts"
@@ -108,12 +108,13 @@ describe('WtTreeTableRow', () => {
108
108
  name: 'wt-icon-btn',
109
109
  });
110
110
  expect(toggle.exists()).toBe(true);
111
- expect(wrapper.findAll('tr').length).toBe(1);
111
+ expect(wrapper.findAll('.wt-tree-table-row').length).toBe(1);
112
112
 
113
113
  await toggle.trigger('click');
114
114
 
115
- expect(wrapper.findAll('tr').length).toBe(2);
116
- expect(wrapper.findAll('tr')[1].text()).toContain('Charlie');
115
+ const rows = wrapper.findAll('.wt-tree-table-row');
116
+ expect(rows.length).toBe(2);
117
+ expect(rows[1].text()).toContain('Charlie');
117
118
  });
118
119
 
119
120
  it('does not render a selection checkbox unless selectable', () => {
@@ -29,7 +29,7 @@
29
29
  <wt-icon-btn
30
30
  v-if="data[childrenProp]"
31
31
  :icon="collapsed ? 'tree-expand' : 'tree-collapse'"
32
- @click="collapsed = !collapsed"
32
+ @click="toggleCollapse"
33
33
  />
34
34
  </div>
35
35
  <slot
@@ -97,11 +97,19 @@
97
97
  />
98
98
  </template>
99
99
  </wt-tree-table-row>
100
+
101
+ <tr
102
+ ref="childrenEndRef"
103
+ aria-hidden="true"
104
+ class="wt-tree-table-row__children-end"
105
+ >
106
+ <td :colspan="columnCount"></td>
107
+ </tr>
100
108
  </template>
101
109
  </template>
102
110
 
103
111
  <script lang="ts" setup>
104
- import { computed, onMounted, ref } from 'vue';
112
+ import { computed, nextTick, onMounted, ref } from 'vue';
105
113
 
106
114
  import WtCheckbox from '../wt-checkbox/wt-checkbox.vue';
107
115
  import WtIconBtn from '../wt-icon-btn/wt-icon-btn.vue';
@@ -153,17 +161,46 @@ const emit = defineEmits([
153
161
  defineSlots<Record<string, (props: Record<string, any>) => unknown>>();
154
162
 
155
163
  const collapsed = ref(true);
164
+ const childrenEndRef = ref<HTMLTableRowElement | null>(null);
156
165
  const lineCount = computed(() => {
157
166
  return props.nestingLevel;
158
167
  });
159
168
  const childLevel = computed(() => {
160
169
  return props.nestingLevel + 1;
161
170
  });
171
+ const columnCount = computed(() => {
172
+ return (props.dataHeaders?.length || 0) + (props.gridActions ? 1 : 0);
173
+ });
162
174
 
163
175
  const isSelectedRow = computed(() => {
164
176
  return props.selectedElements.includes(props.data);
165
177
  });
166
178
 
179
+ const scrollRevealedChildrenIntoView = () => {
180
+ nextTick(() => {
181
+ const anchor = childrenEndRef.value;
182
+ const scrollContainer = anchor?.closest<HTMLElement>('.wt-tree-table');
183
+ if (!anchor || !scrollContainer) return;
184
+
185
+ const overflowBelow =
186
+ anchor.getBoundingClientRect().bottom -
187
+ scrollContainer.getBoundingClientRect().bottom;
188
+
189
+ if (overflowBelow > 0) {
190
+ scrollContainer.scrollBy({
191
+ top: overflowBelow,
192
+ behavior: 'smooth',
193
+ });
194
+ }
195
+ });
196
+ };
197
+
198
+ const toggleCollapse = () => {
199
+ collapsed.value = !collapsed.value;
200
+
201
+ if (!collapsed.value) scrollRevealedChildrenIntoView();
202
+ };
203
+
167
204
  const openCollapse = () => {
168
205
  collapsed.value = false;
169
206
  emit('expanded-collapse');
@@ -229,4 +266,10 @@ onMounted(() => {
229
266
  width: var(--icon-md-size);
230
267
  height: var(--icon-md-size);
231
268
  }
269
+
270
+ .wt-tree-table-row__children-end > td {
271
+ height: 0;
272
+ padding: 0;
273
+ border: none;
274
+ }
232
275
  </style>
@@ -1,7 +1,5 @@
1
- import {
2
- EngineRoutingSchemaType,
3
- WebitelMediaExporterExportStatus,
4
- } from '@webitel/api-services/gen/models';
1
+ import { EngineRoutingSchemaType } from '@webitel/api-services/gen/models/engineRoutingSchemaType';
2
+ import { WebitelMediaExporterExportStatus } from '@webitel/api-services/gen/models/webitelMediaExporterExportStatus';
5
3
  import deepmerge from 'deepmerge';
6
4
  import {
7
5
  AgentStatus,
@@ -23,7 +21,7 @@ import {
23
21
  WtApplication,
24
22
  } from '../../enums';
25
23
  import { AccessMode } from '../../modules/ObjectPermissions/enums/AccessMode.enum';
26
- import { snakeToCamel } from '../../scripts';
24
+ import { snakeToCamel } from '../../scripts/caseConverters';
27
25
  import { SortSymbols } from '../../scripts/sortQueryAdapters.js';
28
26
  import notTranslatable from './notTranslatable.en';
29
27
 
@@ -1,7 +1,5 @@
1
- import {
2
- EngineRoutingSchemaType,
3
- WebitelMediaExporterExportStatus,
4
- } from '@webitel/api-services/gen/models';
1
+ import { EngineRoutingSchemaType } from '@webitel/api-services/gen/models/engineRoutingSchemaType';
2
+ import { WebitelMediaExporterExportStatus } from '@webitel/api-services/gen/models/webitelMediaExporterExportStatus';
5
3
  import {
6
4
  AgentStatus,
7
5
  CallDirection,
@@ -22,7 +20,7 @@ import {
22
20
  WtApplication,
23
21
  } from '../../enums';
24
22
  import { AccessMode } from '../../modules/ObjectPermissions/enums/AccessMode.enum';
25
- import { snakeToCamel } from '../../scripts';
23
+ import { snakeToCamel } from '../../scripts/caseConverters';
26
24
  import { SortSymbols } from '../../scripts/sortQueryAdapters.js';
27
25
 
28
26
  export default {
@@ -1,7 +1,5 @@
1
- import {
2
- EngineRoutingSchemaType,
3
- WebitelMediaExporterExportStatus,
4
- } from '@webitel/api-services/gen/models';
1
+ import { EngineRoutingSchemaType } from '@webitel/api-services/gen/models/engineRoutingSchemaType';
2
+ import { WebitelMediaExporterExportStatus } from '@webitel/api-services/gen/models/webitelMediaExporterExportStatus';
5
3
  import {
6
4
  AgentStatus,
7
5
  CallDirection,
@@ -22,7 +20,7 @@ import {
22
20
  WtApplication,
23
21
  } from '../../enums';
24
22
  import { AccessMode } from '../../modules/ObjectPermissions/enums/AccessMode.enum';
25
- import { snakeToCamel } from '../../scripts';
23
+ import { snakeToCamel } from '../../scripts/caseConverters';
26
24
  import { SortSymbols } from '../../scripts/sortQueryAdapters.js';
27
25
 
28
26
  export default {
@@ -1,7 +1,5 @@
1
- import {
2
- EngineRoutingSchemaType,
3
- WebitelMediaExporterExportStatus,
4
- } from '@webitel/api-services/gen/models';
1
+ import { EngineRoutingSchemaType } from '@webitel/api-services/gen/models/engineRoutingSchemaType';
2
+ import { WebitelMediaExporterExportStatus } from '@webitel/api-services/gen/models/webitelMediaExporterExportStatus';
5
3
  import {
6
4
  AgentStatus,
7
5
  CallDirection,
@@ -22,7 +20,7 @@ import {
22
20
  WtApplication,
23
21
  } from '../../enums';
24
22
  import { AccessMode } from '../../modules/ObjectPermissions/enums/AccessMode.enum';
25
- import { snakeToCamel } from '../../scripts';
23
+ import { snakeToCamel } from '../../scripts/caseConverters';
26
24
  import { SortSymbols } from '../../scripts/sortQueryAdapters.js';
27
25
 
28
26
  export default {
@@ -1,7 +1,5 @@
1
- import {
2
- EngineRoutingSchemaType,
3
- WebitelMediaExporterExportStatus,
4
- } from '@webitel/api-services/gen/models';
1
+ import { EngineRoutingSchemaType } from '@webitel/api-services/gen/models/engineRoutingSchemaType';
2
+ import { WebitelMediaExporterExportStatus } from '@webitel/api-services/gen/models/webitelMediaExporterExportStatus';
5
3
  import {
6
4
  AgentStatus,
7
5
  CallDirection,
@@ -22,7 +20,7 @@ import {
22
20
  WtApplication,
23
21
  } from '../../enums';
24
22
  import { AccessMode } from '../../modules/ObjectPermissions/enums/AccessMode.enum';
25
- import { snakeToCamel } from '../../scripts';
23
+ import { snakeToCamel } from '../../scripts/caseConverters';
26
24
  import { SortSymbols } from '../../scripts/sortQueryAdapters.js';
27
25
 
28
26
  export default {
@@ -1,7 +1,5 @@
1
- import {
2
- EngineRoutingSchemaType,
3
- WebitelMediaExporterExportStatus,
4
- } from '@webitel/api-services/gen/models';
1
+ import { EngineRoutingSchemaType } from '@webitel/api-services/gen/models/engineRoutingSchemaType';
2
+ import { WebitelMediaExporterExportStatus } from '@webitel/api-services/gen/models/webitelMediaExporterExportStatus';
5
3
  import {
6
4
  AgentStatus,
7
5
  CallDirection,
@@ -22,7 +20,7 @@ import {
22
20
  WtApplication,
23
21
  } from '../../enums';
24
22
  import { AccessMode } from '../../modules/ObjectPermissions/enums/AccessMode.enum';
25
- import { snakeToCamel } from '../../scripts';
23
+ import { snakeToCamel } from '../../scripts/caseConverters';
26
24
  import { SortSymbols } from '../../scripts/sortQueryAdapters.js';
27
25
 
28
26
  export default {
@@ -1,7 +1,5 @@
1
- import {
2
- EngineRoutingSchemaType,
3
- WebitelMediaExporterExportStatus,
4
- } from '@webitel/api-services/gen/models';
1
+ import { EngineRoutingSchemaType } from '@webitel/api-services/gen/models/engineRoutingSchemaType';
2
+ import { WebitelMediaExporterExportStatus } from '@webitel/api-services/gen/models/webitelMediaExporterExportStatus';
5
3
  import {
6
4
  AgentStatus,
7
5
  CallDirection,
@@ -22,7 +20,7 @@ import {
22
20
  WtApplication,
23
21
  } from '../../enums';
24
22
  import { AccessMode } from '../../modules/ObjectPermissions/enums/AccessMode.enum';
25
- import { snakeToCamel } from '../../scripts';
23
+ import { snakeToCamel } from '../../scripts/caseConverters';
26
24
  import { SortSymbols } from '../../scripts/sortQueryAdapters.js';
27
25
 
28
26
  export default {
@@ -1,7 +1,5 @@
1
- import {
2
- EngineRoutingSchemaType,
3
- WebitelMediaExporterExportStatus,
4
- } from '@webitel/api-services/gen/models';
1
+ import { EngineRoutingSchemaType } from '@webitel/api-services/gen/models/engineRoutingSchemaType';
2
+ import { WebitelMediaExporterExportStatus } from '@webitel/api-services/gen/models/webitelMediaExporterExportStatus';
5
3
  import {
6
4
  AgentStatus,
7
5
  CallDirection,
@@ -22,7 +20,7 @@ import {
22
20
  WtApplication,
23
21
  } from '../../enums';
24
22
  import { AccessMode } from '../../modules/ObjectPermissions/enums/AccessMode.enum';
25
- import { snakeToCamel } from '../../scripts';
23
+ import { snakeToCamel } from '../../scripts/caseConverters';
26
24
  import { SortSymbols } from '../../scripts/sortQueryAdapters.js';
27
25
 
28
26
  export default {
@@ -1,7 +1,5 @@
1
- import {
2
- EngineRoutingSchemaType,
3
- WebitelMediaExporterExportStatus,
4
- } from '@webitel/api-services/gen/models';
1
+ import { EngineRoutingSchemaType } from '@webitel/api-services/gen/models/engineRoutingSchemaType';
2
+ import { WebitelMediaExporterExportStatus } from '@webitel/api-services/gen/models/webitelMediaExporterExportStatus';
5
3
  import {
6
4
  AgentStatus,
7
5
  CallDirection,
@@ -22,7 +20,7 @@ import {
22
20
  WtApplication,
23
21
  } from '../../enums';
24
22
  import { AccessMode } from '../../modules/ObjectPermissions/enums/AccessMode.enum';
25
- import { snakeToCamel } from '../../scripts';
23
+ import { snakeToCamel } from '../../scripts/caseConverters';
26
24
  import { SortSymbols } from '../../scripts/sortQueryAdapters.js';
27
25
 
28
26
  export default {
@@ -62,6 +62,9 @@ function close() {
62
62
  }
63
63
 
64
64
  function setActivityType() {
65
+ // the Ok button is disabled without a selection; this narrows the type
66
+ if (!selected.value) return;
67
+
65
68
  emit('change', selected.value);
66
69
  close();
67
70
  }