@ironsource/shared-ui 2.1.7-test.3 → 2.1.7-test.5

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 (90) hide show
  1. package/DataGrid.vue_vue_type_style_index_0_scoped_5273976b_lang.css +1 -0
  2. package/DataGridRowsCounter.vue_vue_type_style_index_0_scoped_ef699ec5_lang.css +1 -0
  3. package/DropdownV4.vue_vue_type_style_index_0_scoped_938772ee_lang.css +1 -0
  4. package/EditableV4.vue_vue_type_style_index_0_scoped_e0c047b4_lang.css +1 -0
  5. package/IncludeExclude.vue_vue_type_style_index_0_scoped_cc2adbf5_lang.css +1 -0
  6. package/IncludeExcludeDragDrop.vue_vue_type_style_index_0_scoped_bd6145ce_lang.css +1 -0
  7. package/MultipleDataGrid.vue_vue_type_style_index_0_scoped_82ba0e12_lang.css +1 -0
  8. package/OptionV4.vue_vue_type_style_index_0_scoped_b6a06f00_lang.css +1 -0
  9. package/Popover.vue_vue_type_style_index_0_scoped_c607b770_lang.css +1 -0
  10. package/PopoverV4.vue_vue_type_style_index_0_scoped_c54cd089_lang.css +1 -0
  11. package/PopoverV4.vue_vue_type_style_index_1_lang.css +1 -0
  12. package/SortableList.vue_vue_type_style_index_0_scoped_e9cd63b8_lang.css +1 -0
  13. package/TabsV4.vue_vue_type_style_index_0_scoped_f9433b11_lang.css +1 -0
  14. package/TextField.vue_vue_type_style_index_0_scoped_4d9bf5b2_lang.css +1 -0
  15. package/ThemeWrapper.vue_vue_type_style_index_0_scoped_66bd448a_lang.css +1 -0
  16. package/components/ThemeWrapper/ThemeWrapper.vue.js +2 -2
  17. package/components/ThemeWrapper/ThemeWrapper.vue2.js +5 -5
  18. package/components/dropdown/v4/DropdownV4.vue.d.ts +10 -0
  19. package/components/dropdown/v4/DropdownV4.vue.js +3 -3
  20. package/components/dropdown/v4/DropdownV4.vue2.js +151 -147
  21. package/components/dropdown/v4/OptionV4.vue.d.ts +10 -0
  22. package/components/dropdown/v4/OptionV4.vue.js +2 -2
  23. package/components/dropdown/v4/OptionV4.vue2.js +70 -53
  24. package/components/dropdown/v4/dropdownStoryArgs.d.ts +14 -0
  25. package/components/dropdown/v4/index.d.ts +78 -2
  26. package/components/includeExclude/IncludeExclude.vue.js +4 -4
  27. package/components/includeExclude/IncludeExclude.vue2.js +2 -2
  28. package/components/includeExclude/IncludeExcludeDragDrop.vue.js +4 -4
  29. package/components/includeExclude/IncludeExcludeDragDrop.vue2.js +2 -2
  30. package/components/input/v4/TextField.vue.js +3 -3
  31. package/components/input/v4/TextField.vue2.js +1 -1
  32. package/components/popover/common/Popover.common.d.ts +6 -0
  33. package/components/popover/common/Popover.common.js +17 -0
  34. package/components/popover/v3/Popover.vue.js +8 -0
  35. package/components/popover/{Popover.vue2.js → v3/Popover.vue2.js} +1 -1
  36. package/components/popover/v4/PopoverV4.vue.d.ts +73 -0
  37. package/components/popover/v4/PopoverV4.vue.js +7 -0
  38. package/components/popover/v4/PopoverV4.vue2.js +54 -0
  39. package/components/popover/v4/index.d.ts +209 -0
  40. package/components/popover/v4/index.js +6 -0
  41. package/components/sortableList/SortableList.vue.d.ts +25 -0
  42. package/components/sortableList/SortableList.vue.js +4 -4
  43. package/components/sortableList/SortableList.vue2.js +129 -89
  44. package/components/sortableList/index.d.ts +88 -2
  45. package/components/table/common/Table.common.js +71 -68
  46. package/components/table/v3/Table.vue.d.ts +2 -2
  47. package/components/table/v3/index.d.ts +39 -39
  48. package/components/table/v4/DataGrid.vue.d.ts +12 -2
  49. package/components/table/v4/DataGrid.vue.js +4 -4
  50. package/components/table/v4/DataGrid.vue2.js +103 -100
  51. package/components/table/v4/DataGridRowsCounter.vue.d.ts +5 -0
  52. package/components/table/v4/DataGridRowsCounter.vue.js +3 -3
  53. package/components/table/v4/DataGridRowsCounter.vue2.js +30 -22
  54. package/components/table/v4/MultipleDataGrid.vue.d.ts +16 -3
  55. package/components/table/v4/MultipleDataGrid.vue.js +4 -4
  56. package/components/table/v4/MultipleDataGrid.vue2.js +114 -66
  57. package/components/table/v4/index.d.ts +135 -75
  58. package/components/table/v4/storyUtils.d.ts +4 -0
  59. package/components/table-cells/common/Editable.common.js +37 -26
  60. package/components/table-cells/common/EditableContext.d.ts +1 -0
  61. package/components/table-cells/v4/EditableV4.vue.d.ts +5 -0
  62. package/components/table-cells/v4/EditableV4.vue.js +5 -5
  63. package/components/table-cells/v4/EditableV4.vue2.js +18 -17
  64. package/components/table-cells/v4/index.d.ts +20 -1
  65. package/components/tabs/v4/TabsV4.vue.js +4 -4
  66. package/components/tabs/v4/TabsV4.vue2.js +37 -40
  67. package/index.d.ts +1134 -239
  68. package/index.js +70 -70
  69. package/package.json +7 -3
  70. package/testids/index.d.ts +5 -0
  71. package/testids/index.js +24 -23
  72. package/utils/formatNumbers.d.ts +4 -0
  73. package/utils/formatNumbers.js +11 -0
  74. package/DataGrid.vue_vue_type_style_index_0_scoped_63aaf3be_lang.css +0 -1
  75. package/DataGridRowsCounter.vue_vue_type_style_index_0_scoped_06751538_lang.css +0 -1
  76. package/DropdownV4.vue_vue_type_style_index_0_scoped_7af4f288_lang.css +0 -1
  77. package/EditableV4.vue_vue_type_style_index_0_scoped_31bfb722_lang.css +0 -1
  78. package/IncludeExclude.vue_vue_type_style_index_0_scoped_fb054d88_lang.css +0 -1
  79. package/IncludeExcludeDragDrop.vue_vue_type_style_index_0_scoped_5764fd61_lang.css +0 -1
  80. package/MultipleDataGrid.vue_vue_type_style_index_0_scoped_260b9cdc_lang.css +0 -1
  81. package/OptionV4.vue_vue_type_style_index_0_scoped_9db0f796_lang.css +0 -1
  82. package/Popover.vue_vue_type_style_index_0_scoped_25eb53db_lang.css +0 -1
  83. package/SortableList.vue_vue_type_style_index_0_scoped_21842d59_lang.css +0 -1
  84. package/TabsV4.vue_vue_type_style_index_0_scoped_bab40cfe_lang.css +0 -1
  85. package/TextField.vue_vue_type_style_index_0_scoped_eb472aa3_lang.css +0 -1
  86. package/ThemeWrapper.vue_vue_type_style_index_0_scoped_b62ee695_lang.css +0 -1
  87. package/components/popover/Popover.vue.js +0 -8
  88. /package/components/popover/{Popover.vue.d.ts → v3/Popover.vue.d.ts} +0 -0
  89. /package/components/popover/{index.d.ts → v3/index.d.ts} +0 -0
  90. /package/components/popover/{index.js → v3/index.js} +0 -0
@@ -0,0 +1,54 @@
1
+ import "../../../PopoverV4.vue_vue_type_style_index_0_scoped_c54cd089_lang.css"; import { defineComponent as u, openBlock as d, createBlock as m, unref as t, withCtx as i, createElementBlock as f, renderSlot as n, createCommentVNode as g, createElementVNode as c } from "vue";
2
+ import { Dropdown as k } from "floating-vue";
3
+ import { popoverCommon as v } from "../common/Popover.common.js";
4
+ const w = /* @__PURE__ */ u({
5
+ __name: "PopoverV4",
6
+ props: {
7
+ autoHide: { type: Boolean, default: !1 },
8
+ trigger: { default: "click" },
9
+ disabled: { type: Boolean, default: !1 },
10
+ placement: { default: "bottom-start" },
11
+ distance: { default: 0 },
12
+ skidding: { default: 0 },
13
+ testId: { default: "" },
14
+ popperClass: { default: "" }
15
+ },
16
+ setup(e) {
17
+ const { popup: p, open: o, toggle: l, triggerRef: s } = v();
18
+ return (r, a) => (d(), m(t(k), {
19
+ theme: "custom-popover",
20
+ placement: e.placement,
21
+ shown: !!t(o),
22
+ triggers: e.trigger === "managed" ? [] : [e.trigger],
23
+ "auto-hide": e.autoHide,
24
+ distance: e.distance,
25
+ skidding: e.skidding,
26
+ "data-testid": e.testId,
27
+ "popper-class": [e.popperClass, "v4-popover__popper light-theme-v4"]
28
+ }, {
29
+ popper: i(() => [
30
+ t(o) ? (d(), f("div", {
31
+ key: 0,
32
+ ref_key: "popup",
33
+ ref: p,
34
+ class: "menu-popup"
35
+ }, [
36
+ n(r.$slots, "content", {}, void 0, !0)
37
+ ], 512)) : g("", !0)
38
+ ]),
39
+ default: i(() => [
40
+ c("div", {
41
+ ref_key: "triggerRef",
42
+ ref: s,
43
+ onClick: a[0] || (a[0] = (h) => t(l)(!t(o)))
44
+ }, [
45
+ n(r.$slots, "trigger", {}, void 0, !0)
46
+ ], 512)
47
+ ]),
48
+ _: 3
49
+ }, 8, ["placement", "shown", "triggers", "auto-hide", "distance", "skidding", "data-testid", "popper-class"]));
50
+ }
51
+ });
52
+ export {
53
+ w as default
54
+ };
@@ -0,0 +1,209 @@
1
+ import Popover from './PopoverV4.vue';
2
+ declare const PopoverTypes: () => ({
3
+ new (...args: any[]): {
4
+ $: import("vue").ComponentInternalInstance;
5
+ $data: {};
6
+ $props: Partial<{
7
+ disabled: boolean;
8
+ testId: string;
9
+ placement: import("floating-vue").Placement;
10
+ distance: number;
11
+ popperClass: string;
12
+ autoHide: boolean;
13
+ skidding: number;
14
+ trigger: "touch" | "click" | "focus" | "hover" | "managed";
15
+ }> & Omit<Readonly<import("vue").ExtractPropTypes<{
16
+ disabled: {
17
+ type: import("vue").PropType<boolean>;
18
+ default: boolean;
19
+ };
20
+ testId: {
21
+ type: import("vue").PropType<string>;
22
+ default: string;
23
+ };
24
+ placement: {
25
+ type: import("vue").PropType<import("floating-vue").Placement>;
26
+ default: string;
27
+ };
28
+ distance: {
29
+ type: import("vue").PropType<number>;
30
+ default: number;
31
+ };
32
+ popperClass: {
33
+ type: import("vue").PropType<string>;
34
+ default: string;
35
+ };
36
+ autoHide: {
37
+ type: import("vue").PropType<boolean>;
38
+ default: boolean;
39
+ };
40
+ skidding: {
41
+ type: import("vue").PropType<number>;
42
+ default: number;
43
+ };
44
+ trigger: {
45
+ type: import("vue").PropType<"touch" | "click" | "focus" | "hover" | "managed">;
46
+ default: string;
47
+ };
48
+ }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "disabled" | "testId" | "placement" | "distance" | "popperClass" | "autoHide" | "skidding" | "trigger">;
49
+ $attrs: {
50
+ [x: string]: unknown;
51
+ };
52
+ $refs: {
53
+ [x: string]: unknown;
54
+ };
55
+ $slots: Readonly<{
56
+ [name: string]: import("vue").Slot;
57
+ }>;
58
+ $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>;
59
+ $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>;
60
+ $emit: (event: string, ...args: any[]) => void;
61
+ $el: any;
62
+ $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
63
+ disabled: {
64
+ type: import("vue").PropType<boolean>;
65
+ default: boolean;
66
+ };
67
+ testId: {
68
+ type: import("vue").PropType<string>;
69
+ default: string;
70
+ };
71
+ placement: {
72
+ type: import("vue").PropType<import("floating-vue").Placement>;
73
+ default: string;
74
+ };
75
+ distance: {
76
+ type: import("vue").PropType<number>;
77
+ default: number;
78
+ };
79
+ popperClass: {
80
+ type: import("vue").PropType<string>;
81
+ default: string;
82
+ };
83
+ autoHide: {
84
+ type: import("vue").PropType<boolean>;
85
+ default: boolean;
86
+ };
87
+ skidding: {
88
+ type: import("vue").PropType<number>;
89
+ default: number;
90
+ };
91
+ trigger: {
92
+ type: import("vue").PropType<"touch" | "click" | "focus" | "hover" | "managed">;
93
+ default: string;
94
+ };
95
+ }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
96
+ disabled: boolean;
97
+ testId: string;
98
+ placement: import("floating-vue").Placement;
99
+ distance: number;
100
+ popperClass: string;
101
+ autoHide: boolean;
102
+ skidding: number;
103
+ trigger: "touch" | "click" | "focus" | "hover" | "managed";
104
+ }, {}, string> & {
105
+ beforeCreate?: (() => void) | (() => void)[];
106
+ created?: (() => void) | (() => void)[];
107
+ beforeMount?: (() => void) | (() => void)[];
108
+ mounted?: (() => void) | (() => void)[];
109
+ beforeUpdate?: (() => void) | (() => void)[];
110
+ updated?: (() => void) | (() => void)[];
111
+ activated?: (() => void) | (() => void)[];
112
+ deactivated?: (() => void) | (() => void)[];
113
+ beforeDestroy?: (() => void) | (() => void)[];
114
+ beforeUnmount?: (() => void) | (() => void)[];
115
+ destroyed?: (() => void) | (() => void)[];
116
+ unmounted?: (() => void) | (() => void)[];
117
+ renderTracked?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
118
+ renderTriggered?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
119
+ errorCaptured?: ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>, info: string) => boolean | void)[];
120
+ };
121
+ $forceUpdate: () => void;
122
+ $nextTick: typeof import("vue").nextTick;
123
+ $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: import("vue").WatchOptions<boolean>): import("vue").WatchStopHandle;
124
+ } & Readonly<import("vue").ExtractPropTypes<{
125
+ disabled: {
126
+ type: import("vue").PropType<boolean>;
127
+ default: boolean;
128
+ };
129
+ testId: {
130
+ type: import("vue").PropType<string>;
131
+ default: string;
132
+ };
133
+ placement: {
134
+ type: import("vue").PropType<import("floating-vue").Placement>;
135
+ default: string;
136
+ };
137
+ distance: {
138
+ type: import("vue").PropType<number>;
139
+ default: number;
140
+ };
141
+ popperClass: {
142
+ type: import("vue").PropType<string>;
143
+ default: string;
144
+ };
145
+ autoHide: {
146
+ type: import("vue").PropType<boolean>;
147
+ default: boolean;
148
+ };
149
+ skidding: {
150
+ type: import("vue").PropType<number>;
151
+ default: number;
152
+ };
153
+ trigger: {
154
+ type: import("vue").PropType<"touch" | "click" | "focus" | "hover" | "managed">;
155
+ default: string;
156
+ };
157
+ }>> & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {};
158
+ __isFragment?: never;
159
+ __isTeleport?: never;
160
+ __isSuspense?: never;
161
+ } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
162
+ disabled: {
163
+ type: import("vue").PropType<boolean>;
164
+ default: boolean;
165
+ };
166
+ testId: {
167
+ type: import("vue").PropType<string>;
168
+ default: string;
169
+ };
170
+ placement: {
171
+ type: import("vue").PropType<import("floating-vue").Placement>;
172
+ default: string;
173
+ };
174
+ distance: {
175
+ type: import("vue").PropType<number>;
176
+ default: number;
177
+ };
178
+ popperClass: {
179
+ type: import("vue").PropType<string>;
180
+ default: string;
181
+ };
182
+ autoHide: {
183
+ type: import("vue").PropType<boolean>;
184
+ default: boolean;
185
+ };
186
+ skidding: {
187
+ type: import("vue").PropType<number>;
188
+ default: number;
189
+ };
190
+ trigger: {
191
+ type: import("vue").PropType<"touch" | "click" | "focus" | "hover" | "managed">;
192
+ default: string;
193
+ };
194
+ }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
195
+ disabled: boolean;
196
+ testId: string;
197
+ placement: import("floating-vue").Placement;
198
+ distance: number;
199
+ popperClass: string;
200
+ autoHide: boolean;
201
+ skidding: number;
202
+ trigger: "touch" | "click" | "focus" | "hover" | "managed";
203
+ }, {}, string> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
204
+ $slots: {
205
+ trigger?(_: {}): any;
206
+ content?(_: {}): any;
207
+ };
208
+ }))[];
209
+ export { Popover, PopoverTypes };
@@ -0,0 +1,6 @@
1
+ import o from "./PopoverV4.vue.js";
2
+ const r = () => [o];
3
+ export {
4
+ o as Popover,
5
+ r as PopoverTypes
6
+ };
@@ -9,6 +9,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
9
9
  showSearch?: boolean;
10
10
  searchPlaceholder?: string;
11
11
  searchHandler?: (item: SortableListItem, searchQuery: string) => boolean;
12
+ isLoading?: boolean;
13
+ loadingRowCount?: number;
14
+ emptyStateTitle?: string;
12
15
  testId?: string;
13
16
  }>, {
14
17
  items: () => any[];
@@ -20,8 +23,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
20
23
  showSearch: boolean;
21
24
  searchPlaceholder: string;
22
25
  searchHandler: any;
26
+ isLoading: boolean;
27
+ loadingRowCount: number;
28
+ emptyStateTitle: string;
23
29
  testId: string;
24
30
  }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
31
+ sortableItemDragged: (event: {
32
+ id: string;
33
+ newIndex: number;
34
+ }) => void;
25
35
  "update:items": (items: SortableListItem[]) => void;
26
36
  "update:openId": (id: string | number) => void;
27
37
  "update:selectedId": (id: string | number) => void;
@@ -38,6 +48,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
38
48
  showSearch?: boolean;
39
49
  searchPlaceholder?: string;
40
50
  searchHandler?: (item: SortableListItem, searchQuery: string) => boolean;
51
+ isLoading?: boolean;
52
+ loadingRowCount?: number;
53
+ emptyStateTitle?: string;
41
54
  testId?: string;
42
55
  }>, {
43
56
  items: () => any[];
@@ -49,8 +62,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
49
62
  showSearch: boolean;
50
63
  searchPlaceholder: string;
51
64
  searchHandler: any;
65
+ isLoading: boolean;
66
+ loadingRowCount: number;
67
+ emptyStateTitle: string;
52
68
  testId: string;
53
69
  }>>> & {
70
+ onSortableItemDragged?: (event: {
71
+ id: string;
72
+ newIndex: number;
73
+ }) => any;
54
74
  "onUpdate:items"?: (items: SortableListItem[]) => any;
55
75
  "onUpdate:openId"?: (id: string | number) => any;
56
76
  "onUpdate:selectedId"?: (id: string | number) => any;
@@ -60,6 +80,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
60
80
  }, {
61
81
  search: string;
62
82
  testId: string;
83
+ isLoading: boolean;
63
84
  displayValue: (item: SortableListItem) => string;
64
85
  searchPlaceholder: string;
65
86
  items: SortableListItem[];
@@ -68,10 +89,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
68
89
  openId: string | number;
69
90
  selectedId: string | number;
70
91
  showSearch: boolean;
92
+ loadingRowCount: number;
93
+ emptyStateTitle: string;
71
94
  }>, {
72
95
  menu?(_: {
73
96
  item: SortableListItem;
74
97
  }): any;
98
+ loader?(_: {}): any;
99
+ "empty-state"?(_: {}): any;
75
100
  }>;
76
101
  export default _default;
77
102
  type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
@@ -1,7 +1,7 @@
1
1
  import o from "./SortableList.vue2.js";
2
- /* empty css */import t from "../../_virtual/_plugin-vue_export-helper.js";
3
- // import "../../SortableList.vue_vue_type_style_index_0_scoped_21842d59_lang.css"; //*');
4
- const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-21842d59"]]);
2
+ /* empty css */import e from "../../_virtual/_plugin-vue_export-helper.js";
3
+ // import "../../SortableList.vue_vue_type_style_index_0_scoped_e9cd63b8_lang.css"; //*');
4
+ const c = /* @__PURE__ */ e(o, [["__scopeId", "data-v-e9cd63b8"]]);
5
5
  export {
6
- p as default
6
+ c as default
7
7
  };
@@ -1,13 +1,21 @@
1
- import "../../SortableList.vue_vue_type_style_index_0_scoped_21842d59_lang.css"; import { defineComponent as $, computed as p, ref as F, openBlock as c, createElementBlock as m, mergeProps as v, unref as t, createBlock as y, isRef as E, createCommentVNode as P, createVNode as w, withCtx as C, Fragment as x, renderList as B, renderSlot as D, createElementVNode as G } from "vue";
2
- import { VueDraggable as U } from "vue-draggable-plus";
3
- import R from "./SortableItem.vue.js";
4
- import M from "../search/v4/SearchV4.vue.js";
5
- import { useVModel as K } from "@vueuse/core";
6
- import { matchString as q } from "../../utils/search.js";
7
- import { useTestIdAttrs as Q } from "../../utils/testIds.js";
8
- import { SortableListTestIdModifiers as f } from "../../testids/index.js";
9
- import { DRAG_CURSOR_CSS_CLASS as H } from "./consts.js";
10
- const le = /* @__PURE__ */ $({
1
+ import "../../SortableList.vue_vue_type_style_index_0_scoped_e9cd63b8_lang.css"; import { defineComponent as F, computed as f, ref as P, openBlock as s, createElementBlock as i, mergeProps as T, unref as l, createBlock as g, isRef as N, createCommentVNode as y, withCtx as m, Fragment as V, renderList as D, renderSlot as S, createElementVNode as G, createVNode as $, createTextVNode as U, toDisplayString as M } from "vue";
2
+ import { VueDraggable as K } from "vue-draggable-plus";
3
+ import w from "./SortableItem.vue.js";
4
+ import Q from "../search/v4/SearchV4.vue.js";
5
+ import j from "../typography/v4/Typography.vue.js";
6
+ import z from "../skeleton/v4/SkeletonV4.vue.js";
7
+ import { useVModel as J } from "@vueuse/core";
8
+ import { matchString as x } from "../../utils/search.js";
9
+ import { useTestIdAttrs as W } from "../../utils/testIds.js";
10
+ import { SortableListTestIdModifiers as I } from "../../testids/index.js";
11
+ import { DRAG_CURSOR_CSS_CLASS as q } from "./consts.js";
12
+ const X = {
13
+ key: 1,
14
+ class: "sortable-list-container"
15
+ }, Y = { class: "loader-bars" }, Z = {
16
+ key: 3,
17
+ class: "empty-state-title"
18
+ }, ue = /* @__PURE__ */ F({
11
19
  __name: "SortableList",
12
20
  props: {
13
21
  items: { default: () => [] },
@@ -19,102 +27,134 @@ const le = /* @__PURE__ */ $({
19
27
  showSearch: { type: Boolean, default: !1 },
20
28
  searchPlaceholder: { default: "Search" },
21
29
  searchHandler: { type: Function, default: null },
30
+ isLoading: { type: Boolean, default: !1 },
31
+ loadingRowCount: { default: 3 },
32
+ emptyStateTitle: { default: "No results" },
22
33
  testId: { default: "" }
23
34
  },
24
- emits: ["update:items", "update:openId", "update:selectedId", "update:selectedChildId", "update:search", "clearSearch"],
25
- setup(d, { emit: s }) {
26
- const r = d, o = K(r, "search", s), S = p(() => !!o.value?.trim()), L = p(() => S.value ? r.items.filter((l) => {
27
- const a = l.children || [], e = o.value;
28
- return r.searchHandler ? r.searchHandler(l, e) : q(l.displayText, e) || // match parent item
29
- a.some((n) => q(n.displayText, e));
30
- }) : r.items), u = p({
35
+ emits: ["sortableItemDragged", "update:items", "update:openId", "update:selectedId", "update:selectedChildId", "update:search", "clearSearch"],
36
+ setup(d, { emit: o }) {
37
+ const n = d, u = J(n, "search", o), v = f(() => !!u.value?.trim()), C = f(() => v.value ? n.items.filter((t) => {
38
+ const a = t.children || [], e = u.value;
39
+ return n.searchHandler ? n.searchHandler(t, e) : x(t.displayText, e) || // match parent item
40
+ a.some((r) => x(r.displayText, e));
41
+ }) : n.items), h = f({
31
42
  get() {
32
- return L.value.filter((l) => !l.isLocked);
43
+ return C.value.filter((t) => !t.isLocked);
33
44
  },
34
- set(l) {
35
- s("update:items", [...l, ...V.value]);
45
+ set(t) {
46
+ o("update:items", [...t, ...b.value]);
36
47
  }
37
- }), V = p(
38
- () => L.value.filter((l) => l.isLocked)
39
- ), I = F(!1), N = (l) => {
40
- I.value = !0, setTimeout(() => l.target.classList.add(H), 50);
41
- }, O = (l) => {
42
- I.value = !1, l.target.classList.remove(H);
43
- }, T = (l) => (S.value || l.id === r.openId) && !I.value, b = (l, a) => {
44
- a ? s("update:openId", l.id) : s("update:openId", null);
45
- }, i = (l) => l.id === r.selectedId, k = (l) => {
46
- s("update:selectedId", l.id), s("update:selectedChildId", null);
47
- }, A = (l, a) => {
48
- s("update:selectedChildId", l.id), s("update:selectedId", a.id), s("update:openId", a.id);
49
- }, g = Q(r.testId, f);
50
- return (l, a) => (c(), m("div", v({ class: "sortable-list-container" }, t(g)[t(f).CONTAINER]), [
51
- d.showSearch ? (c(), y(t(M), {
48
+ }), b = f(
49
+ () => C.value.filter((t) => t.isLocked)
50
+ ), k = P(!1), H = (t) => {
51
+ k.value = !0, setTimeout(() => t.target.classList.add(q), 50);
52
+ }, O = (t) => {
53
+ const { target: a, item: e, newIndex: r } = t;
54
+ k.value = !1, a.classList.remove(q);
55
+ const c = e.attributes["data-id"]?.value;
56
+ o("sortableItemDragged", { id: c, newIndex: r });
57
+ }, R = (t) => (v.value || t.id === n.openId) && !k.value, A = (t, a) => {
58
+ a ? o("update:openId", t.id) : o("update:openId", null);
59
+ }, p = (t) => t.id === n.selectedId, B = (t) => {
60
+ o("update:selectedId", t.id), o("update:selectedChildId", null);
61
+ }, E = (t, a) => {
62
+ o("update:selectedChildId", t.id), o("update:selectedId", a.id), o("update:openId", a.id);
63
+ }, L = W(n.testId, I);
64
+ return (t, a) => (s(), i("div", T({ class: "sortable-list-and-search-container" }, l(L)[l(I).CONTAINER]), [
65
+ d.showSearch ? (s(), g(l(Q), {
52
66
  key: 0,
53
- modelValue: t(o),
54
- "onUpdate:modelValue": a[0] || (a[0] = (e) => E(o) ? o.value = e : null),
67
+ modelValue: l(u),
68
+ "onUpdate:modelValue": a[0] || (a[0] = (e) => N(u) ? u.value = e : null),
55
69
  class: "list-search",
56
70
  placeholder: d.searchPlaceholder,
57
71
  "test-id": d.testId,
58
- onOnClear: a[1] || (a[1] = (e) => s("clearSearch"))
59
- }, null, 8, ["modelValue", "placeholder", "test-id"])) : P("", !0),
60
- w(t(U), v({
61
- modelValue: t(u),
62
- "onUpdate:modelValue": a[2] || (a[2] = (e) => E(u) ? u.value = e : null),
63
- class: "sortable-list",
64
- filter: ".expand-icon",
65
- animation: 150,
66
- handle: ".draggable-handle",
67
- disabled: t(S)
68
- }, t(g)[t(f).DRAGGABLE_LIST], {
69
- onStart: N,
70
- onEnd: O
71
- }), {
72
- default: C(() => [
73
- (c(!0), m(x, null, B(t(u), (e, n) => (c(), y(R, {
72
+ onOnClear: a[1] || (a[1] = (e) => o("clearSearch"))
73
+ }, null, 8, ["modelValue", "placeholder", "test-id"])) : y("", !0),
74
+ d.isLoading ? S(t.$slots, "loader", { key: 2 }, () => [
75
+ G("div", Y, [
76
+ (s(!0), i(V, null, D(d.loadingRowCount, (e) => (s(), i("div", { key: e }, [
77
+ $(l(z), {
78
+ round: "",
79
+ class: "loader-bar"
80
+ })
81
+ ]))), 128))
82
+ ])
83
+ ], !0) : (s(), i("div", X, [
84
+ l(h).length ? (s(), g(l(K), T({
85
+ key: 0,
86
+ modelValue: l(h),
87
+ "onUpdate:modelValue": a[2] || (a[2] = (e) => N(h) ? h.value = e : null),
88
+ class: "sortable-list",
89
+ filter: ".expand-icon",
90
+ animation: 150,
91
+ handle: ".draggable-handle",
92
+ disabled: l(v)
93
+ }, l(L)[l(I).DRAGGABLE_LIST], {
94
+ onStart: H,
95
+ onEnd: O
96
+ }), {
97
+ default: m(() => [
98
+ (s(!0), i(V, null, D(l(h), (e, r) => (s(), g(w, {
99
+ key: e.id,
100
+ "data-id": e.id,
101
+ item: e,
102
+ index: r,
103
+ "is-open": R(e),
104
+ "is-selected": p(e),
105
+ "selected-child-id": p(e) ? d.selectedChildId : null,
106
+ "display-value": d.displayValue,
107
+ "search-query": l(u),
108
+ "search-handler": d.searchHandler,
109
+ onToggle: (c) => A(e, c),
110
+ onSelect: (c) => B(e),
111
+ onSelectChild: (c) => E(c, e)
112
+ }, {
113
+ menu: m(() => [
114
+ S(t.$slots, "menu", { item: e }, void 0, !0)
115
+ ]),
116
+ _: 2
117
+ }, 1032, ["data-id", "item", "index", "is-open", "is-selected", "selected-child-id", "display-value", "search-query", "search-handler", "onToggle", "onSelect", "onSelectChild"]))), 128))
118
+ ]),
119
+ _: 3
120
+ }, 16, ["modelValue", "disabled"])) : y("", !0),
121
+ l(b).length ? (s(), i("div", T({
122
+ key: 1,
123
+ class: "locked-list"
124
+ }, l(L)[l(I).LOCKED_LIST]), [
125
+ (s(!0), i(V, null, D(l(b), (e) => (s(), g(w, {
74
126
  key: e.id,
75
127
  item: e,
76
- index: n,
77
- "is-open": T(e),
78
- "is-selected": i(e),
79
- "selected-child-id": i(e) ? d.selectedChildId : null,
128
+ "is-open": R(e),
129
+ "is-selected": p(e),
130
+ "selected-child-id": p(e) ? d.selectedChildId : null,
80
131
  "display-value": d.displayValue,
81
- "search-query": t(o),
82
- "search-handler": d.searchHandler,
83
- onToggle: (h) => b(e, h),
84
- onSelect: (h) => k(e),
85
- onSelectChild: (h) => A(h, e)
132
+ "search-query": l(u),
133
+ "on-search": d.searchHandler,
134
+ onToggle: (r) => A(e, r),
135
+ onSelect: (r) => B(e),
136
+ onSelectChild: (r) => E(r, e)
86
137
  }, {
87
- menu: C(() => [
88
- D(l.$slots, "menu", { item: e }, void 0, !0)
138
+ menu: m(() => [
139
+ S(t.$slots, "menu", { item: e }, void 0, !0)
89
140
  ]),
90
141
  _: 2
91
- }, 1032, ["item", "index", "is-open", "is-selected", "selected-child-id", "display-value", "search-query", "search-handler", "onToggle", "onSelect", "onSelectChild"]))), 128))
92
- ]),
93
- _: 3
94
- }, 16, ["modelValue", "disabled"]),
95
- G("div", v({ class: "locked-list" }, t(g)[t(f).LOCKED_LIST]), [
96
- (c(!0), m(x, null, B(t(V), (e) => (c(), y(R, {
97
- key: e.id,
98
- item: e,
99
- "is-open": T(e),
100
- "is-selected": i(e),
101
- "selected-child-id": i(e) ? d.selectedChildId : null,
102
- "display-value": d.displayValue,
103
- "search-query": t(o),
104
- "on-search": d.searchHandler,
105
- onToggle: (n) => b(e, n),
106
- onSelect: (n) => k(e),
107
- onSelectChild: (n) => A(n, e)
108
- }, {
109
- menu: C(() => [
110
- D(l.$slots, "menu", { item: e }, void 0, !0)
111
- ]),
112
- _: 2
113
- }, 1032, ["item", "is-open", "is-selected", "selected-child-id", "display-value", "search-query", "on-search", "onToggle", "onSelect", "onSelectChild"]))), 128))
114
- ], 16)
142
+ }, 1032, ["item", "is-open", "is-selected", "selected-child-id", "display-value", "search-query", "on-search", "onToggle", "onSelect", "onSelectChild"]))), 128))
143
+ ], 16)) : y("", !0)
144
+ ])),
145
+ !l(C).length && !d.isLoading ? (s(), i("div", Z, [
146
+ S(t.$slots, "empty-state", {}, () => [
147
+ $(l(j), { variant: "body2" }, {
148
+ default: m(() => [
149
+ U(M(d.emptyStateTitle), 1)
150
+ ]),
151
+ _: 1
152
+ })
153
+ ], !0)
154
+ ])) : y("", !0)
115
155
  ], 16));
116
156
  }
117
157
  });
118
158
  export {
119
- le as default
159
+ ue as default
120
160
  };