@ironsource/shared-ui 2.1.3-rc.1 → 2.1.3-rc.2

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 (67) hide show
  1. package/AppHeader.vue_vue_type_style_index_0_scoped_95908b8d_lang.css +1 -0
  2. package/CardPanel.vue_vue_type_style_index_0_scoped_7d0acb11_lang.css +1 -0
  3. package/CheckboxV4.vue_vue_type_style_index_0_scoped_d25514d1_lang.css +1 -0
  4. package/DataGrid.vue_vue_type_style_index_0_scoped_4baf9e57_lang.css +1 -0
  5. package/DataGridMenu.vue_vue_type_style_index_0_scoped_13f1ce76_lang.css +1 -0
  6. package/DataGridRowsCounter.vue_vue_type_style_index_0_scoped_06751538_lang.css +1 -0
  7. package/EditableV4.vue_vue_type_style_index_0_scoped_31bfb722_lang.css +1 -0
  8. package/EmptyStateV4.vue_vue_type_style_index_0_scoped_24001caa_lang.css +1 -0
  9. package/FieldLabel.vue_vue_type_style_index_0_scoped_5c2a70ad_lang.css +1 -0
  10. package/FormRow.vue_vue_type_style_index_0_scoped_39f48410_lang.css +1 -0
  11. package/InlineCopy.vue_vue_type_style_index_0_scoped_2a9e8782_lang.css +1 -0
  12. package/RadioButtonV4.vue_vue_type_style_index_0_scoped_cb3a12c6_lang.css +1 -0
  13. package/components/appHeader/AppHeader.vue.js +3 -3
  14. package/components/appHeader/AppHeader.vue2.js +41 -35
  15. package/components/checkbox/v4/CheckboxV4.vue.js +4 -4
  16. package/components/checkbox/v4/CheckboxV4.vue2.js +2 -2
  17. package/components/checkbox/v4/icons/UncheckedDisabledState.vue.js +11 -12
  18. package/components/checkbox/v4/icons/UncheckedState.vue.js +12 -11
  19. package/components/dropdown/common/Dropdown.common.js +93 -92
  20. package/components/emptyState/v4/EmptyStateV4.vue.d.ts +15 -0
  21. package/components/emptyState/v4/EmptyStateV4.vue.js +3 -3
  22. package/components/emptyState/v4/EmptyStateV4.vue2.js +41 -27
  23. package/components/emptyState/v4/index.d.ts +58 -1
  24. package/components/forms/CardPanel.vue.d.ts +20 -0
  25. package/components/forms/CardPanel.vue.js +2 -2
  26. package/components/forms/CardPanel.vue2.js +26 -14
  27. package/components/forms/FormRow.vue.js +4 -4
  28. package/components/forms/FormRow.vue2.js +1 -1
  29. package/components/forms/index.d.ts +77 -1
  30. package/components/inlineCopy/InlineCopy.vue.js +2 -2
  31. package/components/inlineCopy/InlineCopy.vue2.js +2 -2
  32. package/components/radioButton/v4/RadioButtonV4.vue.js +4 -4
  33. package/components/radioButton/v4/RadioButtonV4.vue2.js +1 -1
  34. package/components/shared/FieldLabel.vue.d.ts +5 -0
  35. package/components/shared/FieldLabel.vue.js +3 -3
  36. package/components/shared/FieldLabel.vue2.js +63 -46
  37. package/components/table/common/Table.common.d.ts +1 -0
  38. package/components/table/common/Table.common.js +64 -60
  39. package/components/table/common/TableContext.d.ts +1 -0
  40. package/components/table/v4/DataGrid.vue.js +4 -4
  41. package/components/table/v4/DataGrid.vue2.js +71 -69
  42. package/components/table/v4/DataGridMenu.vue.d.ts +5 -5
  43. package/components/table/v4/DataGridMenu.vue.js +4 -4
  44. package/components/table/v4/DataGridMenu.vue2.js +46 -47
  45. package/components/table/v4/DataGridRowsCounter.vue.d.ts +15 -0
  46. package/components/table/v4/DataGridRowsCounter.vue.js +3 -3
  47. package/components/table/v4/DataGridRowsCounter.vue2.js +22 -19
  48. package/components/table/v4/index.d.ts +32 -5
  49. package/components/table-cells/common/Editable.common.js +15 -15
  50. package/components/table-cells/v4/EditableV4.vue.d.ts +10 -0
  51. package/components/table-cells/v4/EditableV4.vue.js +3 -3
  52. package/components/table-cells/v4/EditableV4.vue2.js +31 -22
  53. package/components/table-cells/v4/index.d.ts +43 -1
  54. package/index.d.ts +266 -14
  55. package/package.json +1 -1
  56. package/AppHeader.vue_vue_type_style_index_0_scoped_209ecc03_lang.css +0 -1
  57. package/CardPanel.vue_vue_type_style_index_0_scoped_d2b5d12f_lang.css +0 -1
  58. package/CheckboxV4.vue_vue_type_style_index_0_scoped_ee3e6d82_lang.css +0 -1
  59. package/DataGrid.vue_vue_type_style_index_0_scoped_d5635f1b_lang.css +0 -1
  60. package/DataGridMenu.vue_vue_type_style_index_0_scoped_92d83650_lang.css +0 -1
  61. package/DataGridRowsCounter.vue_vue_type_style_index_0_scoped_9e366543_lang.css +0 -1
  62. package/EditableV4.vue_vue_type_style_index_0_scoped_df325b51_lang.css +0 -1
  63. package/EmptyStateV4.vue_vue_type_style_index_0_scoped_b8373c2d_lang.css +0 -1
  64. package/FieldLabel.vue_vue_type_style_index_0_scoped_526af548_lang.css +0 -1
  65. package/FormRow.vue_vue_type_style_index_0_scoped_017dc22e_lang.css +0 -1
  66. package/InlineCopy.vue_vue_type_style_index_0_scoped_2f0a0202_lang.css +0 -1
  67. package/RadioButtonV4.vue_vue_type_style_index_0_scoped_14be812e_lang.css +0 -1
@@ -1,24 +1,25 @@
1
- import { useToggle as Oe } from "../../../composables/useToggle.js";
2
- import { ref as n, computed as r, watch as b, useSlots as Ae, nextTick as D, toRaw as x, provide as Pe, onMounted as Se } from "vue";
3
- import { isObjectInArray as z } from "../../../utils/array.js";
4
- import { objectsEqual as Te } from "../../../utils/object.js";
5
- import { useClamp as we, useVirtualList as xe, onClickOutside as J } from "@vueuse/core";
6
- import { Mode as m, Type as k, DropdownContext as De } from "./DropdownContext.js";
7
- import { pxToRem as Ie } from "../../../utils/style.js";
8
- const Ve = (l, O, A) => {
9
- const Q = (e, t) => l.multi ? z(e, t) : x(e) === t;
1
+ import { useToggle as Ae } from "../../../composables/useToggle.js";
2
+ import { ref as n, computed as r, watch as b, useSlots as Pe, nextTick as D, toRaw as x, provide as Se, onMounted as Te } from "vue";
3
+ import { isObjectInArray as J } from "../../../utils/array.js";
4
+ import { objectsEqual as we } from "../../../utils/object.js";
5
+ import { useClamp as xe, useVirtualList as De, onClickOutside as Q } from "@vueuse/core";
6
+ import { Mode as m, Type as k, DropdownContext as Ie } from "./DropdownContext.js";
7
+ import { pxToRem as Me } from "../../../utils/style.js";
8
+ import { useEditableContext as Ce } from "../../table-cells/common/EditableContext.js";
9
+ const Ue = (l, O, A) => {
10
+ const W = (e, t) => l.multi ? J(e, t) : x(e) === t;
10
11
  let E;
11
12
  ((e) => {
12
13
  e[e.None = 0] = "None", e[e.Next = 1] = "Next", e[e.Previous = -1] = "Previous", e[e.NextPage = 10] = "NextPage", e[e.PrevPage = -10] = "PrevPage";
13
14
  })(E || (E = {}));
14
15
  const a = n(
15
16
  l.selected
16
- ), u = r({
17
+ ), I = Ce(), u = r({
17
18
  get() {
18
- return a.value;
19
+ return I?.value?.value ?? a.value;
19
20
  },
20
21
  set(e) {
21
- O("update:selected", e);
22
+ I.onChange?.(e), I.onClose?.(), O("update:selected", e);
22
23
  }
23
24
  });
24
25
  b(
@@ -27,50 +28,50 @@ const Ve = (l, O, A) => {
27
28
  a.value = l.selected;
28
29
  }
29
30
  );
30
- const W = Ae(), P = n(null), f = n(null), C = n(null), I = n(null), V = n(null), S = n(null), Y = n(), H = n(null), L = n(null), U = n(null), Z = 8, F = r(() => S.value ? S.value.getBoundingClientRect().height + Z + l.distance : 0), c = n([]), T = n(-1), w = n(""), M = n([]), B = () => S.value?.focus(), [v, ee, le] = Oe({
31
+ const Y = Pe(), P = n(null), d = n(null), V = n(null), M = n(null), H = n(null), S = n(null), Z = n(), L = n(null), U = n(null), B = n(null), F = 8, ee = r(() => S.value ? S.value.getBoundingClientRect().height + F + l.distance : 0), c = n([]), T = n(-1), w = n(""), C = n([]), p = () => S.value?.focus(), [v, le, te] = Ae({
31
32
  disabled: l.disabled,
32
33
  initialValue: l.defaultOpen
33
34
  });
34
35
  b(
35
36
  () => l.disabled,
36
37
  (e) => {
37
- e !== void 0 && le(e);
38
+ e !== void 0 && te(e);
38
39
  }
39
40
  );
40
41
  const q = (e) => {
41
- te.value = ee(e);
42
- }, te = r({
42
+ ae.value = le(e);
43
+ }, ae = r({
43
44
  get() {
44
45
  return l.isOpen;
45
46
  },
46
47
  set(e) {
47
48
  O("update:isOpen", e);
48
49
  }
49
- }), ae = r(() => s.value.length - 1), o = we(0, 0, ae), ue = r(() => u.value ? l.displayValue(u.value) : ""), ne = (e) => {
50
+ }), ue = r(() => s.value.length - 1), o = xe(0, 0, ue), ne = r(() => u.value ? l.displayValue(u.value) : ""), ie = (e) => {
50
51
  if (!e.value.length && !l.multiOptionsPlaceholderPrefix && !l.multiOptionsPlaceholderSuffix)
51
52
  return l.placeholder;
52
53
  const t = !l.multiOptionsPlaceholderPrefix && !l.multiOptionsPlaceholderSuffix ? `${e.value.length} selected` : `${l.multiOptionsPlaceholderPrefix ?? ""}${e.value.length ?? "0"}${l.multiOptionsPlaceholderSuffix ?? ""}`;
53
54
  return e.value.length == 1 && l.displayValue ? l.displayValue(e.value[0]) : t;
54
- }, ie = r(() => {
55
+ }, re = r(() => {
55
56
  if (!l.multi)
56
57
  return u.value ? l.displayValue(u.value) : l.placeholder;
57
58
  if (Array.isArray(a.value))
58
- return ne(a);
59
+ return ie(a);
59
60
  }), G = r(() => {
60
61
  if (Array.isArray(a.value))
61
62
  return a.value.length === s.value.length;
62
- }), re = r(() => !l.multi || !Array.isArray(a.value) ? !1 : a.value.length > 0 && a.value.length < s.value.length), N = (e) => {
63
+ }), oe = r(() => !l.multi || !Array.isArray(a.value) ? !1 : a.value.length > 0 && a.value.length < s.value.length), N = (e) => {
63
64
  w.value = e;
64
65
  }, s = r(() => l.onSearch ? l.options.filter(
65
66
  (e) => l.onSearch(e, w.value)
66
- ) : l.options), oe = r(() => c.value[0]?.hasSubtitle), K = r(() => i.mode === m.Multi), $ = r(
67
- () => oe.value ? A.MULTILINE_LIST_HEIGHT : A.LIST_HEIGHT
67
+ ) : l.options), se = r(() => c.value[0]?.hasSubtitle), K = r(() => i.mode === m.Multi), $ = r(
68
+ () => se.value ? A.MULTILINE_LIST_HEIGHT : A.LIST_HEIGHT
68
69
  ), {
69
- list: p,
70
- containerProps: X,
71
- wrapperProps: se,
70
+ list: X,
71
+ containerProps: j,
72
+ wrapperProps: ce,
72
73
  scrollTo: R
73
- } = xe(s, {
74
+ } = De(s, {
74
75
  itemHeight: $.value
75
76
  });
76
77
  b(
@@ -90,21 +91,21 @@ const Ve = (l, O, A) => {
90
91
  }));
91
92
  }
92
93
  );
93
- const d = (e, t = !1) => {
94
+ const f = (e, t = !1) => {
94
95
  l.disabled || (q(e), D(() => {
95
96
  v.value && O("opened"), v.value || O("closed"), P.value && t && P.value.focus();
96
97
  }));
97
98
  };
98
99
  b(v, (e) => {
99
100
  if (e) {
100
- K.value && Array.isArray(u.value) && (M.value = x(u.value).slice());
101
+ K.value && Array.isArray(u.value) && (C.value = x(u.value).slice());
101
102
  return;
102
103
  }
103
- B();
104
+ p();
104
105
  });
105
- const ce = () => {
106
- ve(), u.value = a.value;
107
- }, ve = () => {
106
+ const ve = () => {
107
+ de(), u.value = a.value;
108
+ }, de = () => {
108
109
  if (G.value) {
109
110
  a.value = [];
110
111
  return;
@@ -122,38 +123,38 @@ const Ve = (l, O, A) => {
122
123
  if (e = x(e), c.value[t]?.disabled)
123
124
  return;
124
125
  if (T.value = t, i.mode !== m.Multi) {
125
- l.keepOpen || d(!1), i.goToOption(
126
+ l.keepOpen || f(!1), i.goToOption(
126
127
  0
127
128
  /* None */
128
- ), u.value = e, N(""), B(), i.type === k.Search && f.value && (f.value.value = l.displayValue(e));
129
+ ), u.value = e, N(""), p(), i.type === k.Search && d.value && (d.value.value = l.displayValue(e));
129
130
  return;
130
131
  }
131
132
  if (!Array.isArray(a.value))
132
133
  return;
133
- f.value?.focus();
134
+ d.value?.focus();
134
135
  const g = x(a.value);
135
- if (z(g, e)) {
136
+ if (J(g, e)) {
136
137
  a.value = g.filter(
137
- (h) => !Te(h, e)
138
+ (h) => !we(h, e)
138
139
  );
139
140
  return;
140
141
  } else {
141
142
  a.value = [...g, e];
142
143
  return;
143
144
  }
144
- }, de = (e) => c.value[e]?.disabled, i = {
145
+ }, ge = (e) => c.value[e]?.disabled, i = {
145
146
  activeIndex: o,
146
147
  options: c,
147
148
  selectedOption: u,
148
- labelRef: V,
149
- activeOption: I,
149
+ labelRef: H,
150
+ activeOption: M,
150
151
  listRef: P,
151
152
  clearable: l.clearable,
152
- type: W.input ? k.Search : k.Dropdown,
153
+ type: Y.input ? k.Search : k.Dropdown,
153
154
  mode: l.multi ? m.Multi : m.Single,
154
155
  query: w,
155
- selectedValue: ue,
156
- toggle: d,
156
+ selectedValue: ne,
157
+ toggle: f,
157
158
  disabled: l.disabled,
158
159
  open: v,
159
160
  mandatory: l.mandatory,
@@ -161,7 +162,7 @@ const Ve = (l, O, A) => {
161
162
  placeholder: l.placeholder,
162
163
  select: _,
163
164
  clearSelection: () => {
164
- N(""), u.value = i.mode === m.Single ? null : [], f.value && (f.value.value = "");
165
+ N(""), u.value = i.mode === m.Single ? null : [], d.value && (d.value.value = "");
165
166
  },
166
167
  search: N,
167
168
  goToOption: async (e) => {
@@ -173,17 +174,17 @@ const Ve = (l, O, A) => {
173
174
  ).length, g = s.value.length - y;
174
175
  for (t > g && (t = g + 1); ; ) {
175
176
  if (!c.value[t]?.disabled) {
176
- I.value = s.value[t], o.value = t;
177
+ M.value = s.value[t], o.value = t;
177
178
  return;
178
179
  }
179
- if ((e === 1 || e === 10) && (t = t + 1), (e === -1 || e === -10) && (t = t + -1), !!de(o.value)) {
180
- I.value = s.value[t], o.value = t;
180
+ if ((e === 1 || e === 10) && (t = t + 1), (e === -1 || e === -10) && (t = t + -1), !!ge(o.value)) {
181
+ M.value = s.value[t], o.value = t;
181
182
  return;
182
183
  }
183
184
  }
184
185
  },
185
186
  registerInput: (e) => {
186
- f.value = e.value;
187
+ d.value = e.value;
187
188
  },
188
189
  registerOption: (e, t, y) => {
189
190
  c.value = [...c.value, { id: e, disabled: t, hasSubtitle: y }];
@@ -192,44 +193,44 @@ const Ve = (l, O, A) => {
192
193
  c.value = c.value.filter((t) => t.id !== e);
193
194
  }
194
195
  };
195
- Pe(De, i), J(
196
+ Se(Ie, i), Q(
196
197
  P,
197
198
  () => {
198
- v.value && j();
199
+ v.value && z();
199
200
  },
200
201
  {
201
202
  ignore: [
202
203
  S,
203
- H,
204
204
  L,
205
205
  U,
206
- f,
207
- X.ref
206
+ B,
207
+ d,
208
+ j.ref
208
209
  ]
209
210
  }
210
211
  );
211
- const ge = () => {
212
- f.value && (f.value.value = i.query.value = "");
212
+ const he = () => {
213
+ d.value && (d.value.value = i.query.value = "");
213
214
  };
214
- Se(async () => {
215
+ Te(async () => {
215
216
  l.autoFocus && (await D(), setTimeout(() => {
216
- C.value.focus();
217
+ V.value.focus();
217
218
  })), i.goToOption(0);
218
219
  });
219
- const he = () => {
220
- u.value = a.value, O("apply", u.value), d(!1), ge();
221
- }, j = () => {
222
- K.value && Array.isArray(M.value) && (u.value = x(M.value).slice()), w.value = "", d(!1);
223
- }, ye = (e) => {
220
+ const ye = () => {
221
+ u.value = a.value, O("apply", u.value), f(!1), he();
222
+ }, z = () => {
223
+ K.value && Array.isArray(C.value) && (u.value = x(C.value).slice()), w.value = "", f(!1);
224
+ }, be = (e) => {
224
225
  if (!l.disableKeyboardEvents)
225
226
  switch (e.key) {
226
227
  case "Space":
227
228
  case "Enter":
228
229
  case "ArrowUp":
229
230
  case "ArrowDown":
230
- d(!0), e.preventDefault();
231
+ f(!0), e.preventDefault();
231
232
  }
232
- }, be = (e) => {
233
+ }, me = (e) => {
233
234
  if (!l.disableKeyboardEvents)
234
235
  switch (e.key) {
235
236
  case "ArrowUp": {
@@ -247,7 +248,7 @@ const Ve = (l, O, A) => {
247
248
  break;
248
249
  }
249
250
  case "Escape": {
250
- d(!1), e.preventDefault();
251
+ f(!1), e.preventDefault();
251
252
  break;
252
253
  }
253
254
  case "PageUp": {
@@ -266,55 +267,55 @@ const Ve = (l, O, A) => {
266
267
  }
267
268
  case "Enter": {
268
269
  if (!v.value) {
269
- d(!0);
270
+ f(!0);
270
271
  return;
271
272
  }
272
- _(s.value[o.value], o.value), i.mode === m.Single && !l.keepOpen && d(!1), e.preventDefault();
273
+ _(s.value[o.value], o.value), i.mode === m.Single && !l.keepOpen && f(!1), e.preventDefault();
273
274
  break;
274
275
  }
275
276
  }
276
- }, me = r(() => {
277
- const e = p.value.length, t = l.multi && l.showSelectAll ? 1 : 0, y = e > A.MAX_NUMBER_OF_OPTIONS, g = e + t;
277
+ }, Oe = r(() => {
278
+ const e = X.value.length, t = l.multi && l.showSelectAll ? 1 : 0, y = e > A.MAX_NUMBER_OF_OPTIONS, g = e + t;
278
279
  let h = y ? A.MAX_NUMBER_OF_OPTIONS + 0.1 : g;
279
- return l.noResultsText && h === 0 && (h = h + 1), Ie(
280
+ return l.noResultsText && h === 0 && (h = h + 1), Me(
280
281
  h * $.value + A.PADDING_PX
281
282
  );
282
283
  });
283
284
  return {
284
- onKeydown: be,
285
- location: F,
285
+ onKeydown: me,
286
+ location: ee,
286
287
  open: v,
287
- toggleMenu: d,
288
- onButtonKeydown: ye,
289
- displayedValue: ie,
290
- labelRef: V,
288
+ toggleMenu: f,
289
+ onButtonKeydown: be,
290
+ displayedValue: re,
291
+ labelRef: H,
291
292
  query: w,
292
- containerProps: X,
293
- calculateTableHeight: me,
294
- wrapperProps: se,
293
+ containerProps: j,
294
+ calculateTableHeight: Oe,
295
+ wrapperProps: ce,
295
296
  filteredOptions: s,
296
297
  allSelected: G,
297
- isIndeterminate: re,
298
- onSelectAll: ce,
299
- virtualOptions: p,
300
- isSelected: Q,
298
+ isIndeterminate: oe,
299
+ onSelectAll: ve,
300
+ virtualOptions: X,
301
+ isSelected: W,
301
302
  selectedOption: u,
302
303
  onSelect: _,
303
304
  activeIndex: o,
304
- onCancel: j,
305
- onApply: he,
305
+ onCancel: z,
306
+ onApply: ye,
306
307
  scrollTo: R,
307
- onClickOutside: J,
308
+ onClickOutside: Q,
308
309
  listRef: P,
309
310
  buttonRef: S,
310
- apply: H,
311
- cancel: L,
312
- el: C,
313
- triggerRef: Y,
314
- clearAll: U,
311
+ apply: L,
312
+ cancel: U,
313
+ el: V,
314
+ triggerRef: Z,
315
+ clearAll: B,
315
316
  onClearAllSelections: fe
316
317
  };
317
318
  };
318
319
  export {
319
- Ve as dropdownCommon
320
+ Ue as dropdownCommon
320
321
  };
@@ -3,11 +3,17 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
3
3
  subtitle?: string;
4
4
  variant?: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
5
5
  buttonText?: string;
6
+ iconName?: string;
7
+ iconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
8
+ iconSize?: string;
6
9
  }>, {
7
10
  title: string;
8
11
  subtitle: any;
9
12
  buttonText: any;
10
13
  variant: string;
14
+ iconName: any;
15
+ iconType: string;
16
+ iconSize: string;
11
17
  }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
12
18
  click: () => void;
13
19
  }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
@@ -15,17 +21,26 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
15
21
  subtitle?: string;
16
22
  variant?: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
17
23
  buttonText?: string;
24
+ iconName?: string;
25
+ iconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
26
+ iconSize?: string;
18
27
  }>, {
19
28
  title: string;
20
29
  subtitle: any;
21
30
  buttonText: any;
22
31
  variant: string;
32
+ iconName: any;
33
+ iconType: string;
34
+ iconSize: string;
23
35
  }>>> & {
24
36
  onClick?: () => any;
25
37
  }, {
26
38
  title: string;
27
39
  variant: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
40
+ iconName: string;
41
+ iconSize: string;
28
42
  subtitle: string;
43
+ iconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
29
44
  buttonText: string;
30
45
  }>, {
31
46
  content?(_: {}): any;
@@ -1,7 +1,7 @@
1
1
  import t from "./EmptyStateV4.vue2.js";
2
2
  /* empty css */import o from "../../../_virtual/_plugin-vue_export-helper.js";
3
- // import "../../../EmptyStateV4.vue_vue_type_style_index_0_scoped_b8373c2d_lang.css"; //*');
4
- const s = /* @__PURE__ */ o(t, [["__scopeId", "data-v-b8373c2d"]]);
3
+ // import "../../../EmptyStateV4.vue_vue_type_style_index_0_scoped_24001caa_lang.css"; //*');
4
+ const p = /* @__PURE__ */ o(t, [["__scopeId", "data-v-24001caa"]]);
5
5
  export {
6
- s as default
6
+ p as default
7
7
  };
@@ -1,62 +1,76 @@
1
- import "../../../EmptyStateV4.vue_vue_type_style_index_0_scoped_b8373c2d_lang.css"; import f from "../../../_virtual/dynamic-import-helper.js";
2
- import { defineComponent as v, computed as b, defineAsyncComponent as y, openBlock as o, createElementBlock as k, createVNode as C, unref as n, createElementVNode as I, renderSlot as u, createBlock as i, withCtx as a, createTextVNode as r, toDisplayString as s, createCommentVNode as c } from "vue";
3
- import N from "../../button/v4/ButtonV4.vue.js";
1
+ import "../../../EmptyStateV4.vue_vue_type_style_index_0_scoped_24001caa_lang.css"; import v from "../../../_virtual/dynamic-import-helper.js";
2
+ import { defineComponent as y, computed as p, defineAsyncComponent as b, openBlock as e, createElementBlock as k, createBlock as n, unref as i, createCommentVNode as a, createElementVNode as N, renderSlot as u, withCtx as c, createTextVNode as l, toDisplayString as r } from "vue";
3
+ import I from "../../button/v4/ButtonV4.vue.js";
4
4
  import "../../button/v4/IconButtonV4.vue.js";
5
5
  import m from "../../typography/v4/Typography.vue.js";
6
- import { capitalizeFirstLetter as T, snakeCaseToCamelCase as V } from "../../../utils/string.js";
7
- const $ = { class: "empty-state" }, g = { class: "title-wrapper" }, A = /* @__PURE__ */ v({
6
+ import { capitalizeFirstLetter as C, snakeCaseToCamelCase as T } from "../../../utils/string.js";
7
+ import S from "../../icon/v4/IconV4.vue.js";
8
+ const g = { class: "empty-state" }, x = { class: "title-wrapper" }, A = /* @__PURE__ */ y({
8
9
  __name: "EmptyStateV4",
9
10
  props: {
10
11
  title: { default: "No data to display" },
11
12
  subtitle: { default: void 0 },
12
13
  variant: { default: "no-data" },
13
- buttonText: { default: void 0 }
14
+ buttonText: { default: void 0 },
15
+ iconName: { default: null },
16
+ iconType: { default: "regular" },
17
+ iconSize: { default: "48px" }
14
18
  },
15
19
  emits: ["click"],
16
20
  setup(t) {
17
- const d = t, p = b(() => {
18
- const e = T(V(d.variant));
19
- return y(() => f(/* @__PURE__ */ Object.assign({ "./icons/IconError.vue": () => import("./icons/IconError.vue.js"), "./icons/IconFiles.vue": () => import("./icons/IconFiles.vue.js"), "./icons/IconNoAccess.vue": () => import("./icons/IconNoAccess.vue.js"), "./icons/IconNoData.vue": () => import("./icons/IconNoData.vue.js"), "./icons/IconNoResults.vue": () => import("./icons/IconNoResults.vue.js"), "./icons/IconSettings.vue": () => import("./icons/IconSettings.vue.js") }), `./icons/Icon${e}.vue`));
21
+ const d = t, f = p(() => {
22
+ const o = C(T(d.variant));
23
+ return b(() => v(/* @__PURE__ */ Object.assign({ "./icons/IconError.vue": () => import("./icons/IconError.vue.js"), "./icons/IconFiles.vue": () => import("./icons/IconFiles.vue.js"), "./icons/IconNoAccess.vue": () => import("./icons/IconNoAccess.vue.js"), "./icons/IconNoData.vue": () => import("./icons/IconNoData.vue.js"), "./icons/IconNoResults.vue": () => import("./icons/IconNoResults.vue.js"), "./icons/IconSettings.vue": () => import("./icons/IconSettings.vue.js") }), `./icons/Icon${o}.vue`));
20
24
  });
21
- return (e, l) => (o(), k("div", $, [
22
- C(n(p), { class: "icon" }),
23
- I("div", g, [
24
- u(e.$slots, "content", {}, () => [
25
- t.title ? (o(), i(n(m), {
25
+ return (o, s) => (e(), k("div", g, [
26
+ t.variant && !t.iconName ? (e(), n(i(f), {
27
+ key: 0,
28
+ class: "empty-variant-icon"
29
+ })) : a("", !0),
30
+ t.iconName ? (e(), n(i(S), {
31
+ key: 1,
32
+ class: "custom-empty-icon",
33
+ name: t.iconName,
34
+ size: t.iconSize,
35
+ type: t.iconType
36
+ }, null, 8, ["name", "size", "type"])) : a("", !0),
37
+ N("div", x, [
38
+ u(o.$slots, "content", {}, () => [
39
+ t.title ? (e(), n(i(m), {
26
40
  key: 0,
27
41
  variant: "h4",
28
42
  class: "title"
29
43
  }, {
30
- default: a(() => [
31
- r(s(t.title), 1)
44
+ default: c(() => [
45
+ l(r(t.title), 1)
32
46
  ]),
33
47
  _: 1
34
- })) : c("", !0),
35
- t.subtitle ? (o(), i(n(m), {
48
+ })) : a("", !0),
49
+ t.subtitle ? (e(), n(i(m), {
36
50
  key: 1,
37
51
  variant: "body1",
38
52
  class: "subtitle"
39
53
  }, {
40
- default: a(() => [
41
- r(s(t.subtitle), 1)
54
+ default: c(() => [
55
+ l(r(t.subtitle), 1)
42
56
  ]),
43
57
  _: 1
44
- })) : c("", !0)
58
+ })) : a("", !0)
45
59
  ], !0)
46
60
  ]),
47
- u(e.$slots, "button", {}, () => [
48
- t.buttonText ? (o(), i(n(N), {
61
+ u(o.$slots, "button", {}, () => [
62
+ t.buttonText ? (e(), n(i(I), {
49
63
  key: 0,
50
64
  variant: "outlined",
51
65
  color: "default",
52
66
  class: "button",
53
- onClick: l[0] || (l[0] = (h) => e.$emit("click"))
67
+ onClick: s[0] || (s[0] = (z) => o.$emit("click"))
54
68
  }, {
55
- default: a(() => [
56
- r(s(t.buttonText), 1)
69
+ default: c(() => [
70
+ l(r(t.buttonText), 1)
57
71
  ]),
58
72
  _: 1
59
- })) : c("", !0)
73
+ })) : a("", !0)
60
74
  ], !0)
61
75
  ]));
62
76
  }
@@ -6,7 +6,10 @@ declare const EmptyStateTypes: () => ({
6
6
  $props: Partial<{
7
7
  title: string;
8
8
  variant: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
9
+ iconName: string;
10
+ iconSize: string;
9
11
  subtitle: string;
12
+ iconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
10
13
  buttonText: string;
11
14
  }> & Omit<Readonly<import("vue").ExtractPropTypes<{
12
15
  title: {
@@ -17,17 +20,29 @@ declare const EmptyStateTypes: () => ({
17
20
  type: import("vue").PropType<"error" | "no-access" | "no-results" | "no-data" | "files" | "settings">;
18
21
  default: string;
19
22
  };
23
+ iconName: {
24
+ type: import("vue").PropType<string>;
25
+ default: any;
26
+ };
27
+ iconSize: {
28
+ type: import("vue").PropType<string>;
29
+ default: string;
30
+ };
20
31
  subtitle: {
21
32
  type: import("vue").PropType<string>;
22
33
  default: any;
23
34
  };
35
+ iconType: {
36
+ type: import("vue").PropType<"fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test">;
37
+ default: string;
38
+ };
24
39
  buttonText: {
25
40
  type: import("vue").PropType<string>;
26
41
  default: any;
27
42
  };
28
43
  }>> & {
29
44
  onClick?: () => any;
30
- } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "title" | "variant" | "subtitle" | "buttonText">;
45
+ } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "title" | "variant" | "iconName" | "iconSize" | "subtitle" | "iconType" | "buttonText">;
31
46
  $attrs: {
32
47
  [x: string]: unknown;
33
48
  };
@@ -50,10 +65,22 @@ declare const EmptyStateTypes: () => ({
50
65
  type: import("vue").PropType<"error" | "no-access" | "no-results" | "no-data" | "files" | "settings">;
51
66
  default: string;
52
67
  };
68
+ iconName: {
69
+ type: import("vue").PropType<string>;
70
+ default: any;
71
+ };
72
+ iconSize: {
73
+ type: import("vue").PropType<string>;
74
+ default: string;
75
+ };
53
76
  subtitle: {
54
77
  type: import("vue").PropType<string>;
55
78
  default: any;
56
79
  };
80
+ iconType: {
81
+ type: import("vue").PropType<"fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test">;
82
+ default: string;
83
+ };
57
84
  buttonText: {
58
85
  type: import("vue").PropType<string>;
59
86
  default: any;
@@ -65,7 +92,10 @@ declare const EmptyStateTypes: () => ({
65
92
  }, string, {
66
93
  title: string;
67
94
  variant: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
95
+ iconName: string;
96
+ iconSize: string;
68
97
  subtitle: string;
98
+ iconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
69
99
  buttonText: string;
70
100
  }, {}, string> & {
71
101
  beforeCreate?: (() => void) | (() => void)[];
@@ -96,10 +126,22 @@ declare const EmptyStateTypes: () => ({
96
126
  type: import("vue").PropType<"error" | "no-access" | "no-results" | "no-data" | "files" | "settings">;
97
127
  default: string;
98
128
  };
129
+ iconName: {
130
+ type: import("vue").PropType<string>;
131
+ default: any;
132
+ };
133
+ iconSize: {
134
+ type: import("vue").PropType<string>;
135
+ default: string;
136
+ };
99
137
  subtitle: {
100
138
  type: import("vue").PropType<string>;
101
139
  default: any;
102
140
  };
141
+ iconType: {
142
+ type: import("vue").PropType<"fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test">;
143
+ default: string;
144
+ };
103
145
  buttonText: {
104
146
  type: import("vue").PropType<string>;
105
147
  default: any;
@@ -119,10 +161,22 @@ declare const EmptyStateTypes: () => ({
119
161
  type: import("vue").PropType<"error" | "no-access" | "no-results" | "no-data" | "files" | "settings">;
120
162
  default: string;
121
163
  };
164
+ iconName: {
165
+ type: import("vue").PropType<string>;
166
+ default: any;
167
+ };
168
+ iconSize: {
169
+ type: import("vue").PropType<string>;
170
+ default: string;
171
+ };
122
172
  subtitle: {
123
173
  type: import("vue").PropType<string>;
124
174
  default: any;
125
175
  };
176
+ iconType: {
177
+ type: import("vue").PropType<"fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test">;
178
+ default: string;
179
+ };
126
180
  buttonText: {
127
181
  type: import("vue").PropType<string>;
128
182
  default: any;
@@ -134,7 +188,10 @@ declare const EmptyStateTypes: () => ({
134
188
  }, string, {
135
189
  title: string;
136
190
  variant: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
191
+ iconName: string;
192
+ iconSize: string;
137
193
  subtitle: string;
194
+ iconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
138
195
  buttonText: string;
139
196
  }, {}, string> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
140
197
  $slots: {