@ironsource/shared-ui 2.1.12-test.99 → 2.2.0-rc.0

package/components/sortableList/SortableItem.vue.d.ts

@@ -1,59 +1,74 @@
 import { SortableListItem } from '@/components/sortableList/SortableList.types';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     item: SortableListItem;
     index?: number;
     isOpen?: boolean;
     isSelected?: boolean;
+    isDisabled?: boolean;
     selectedChildId?: string | number;
     searchQuery?: string;
-    childListMaxHeight: string;
+    childListMaxHeight?: string;
     searchHandler?: (item: SortableListItem, searchQuery: string) => boolean;
     displayValue: (item: SortableListItem) => string;
+    variant?: "default" | "compact";
+    draggableArea?: "handle" | "full";
 }>, {
     text: string;
     isOpen: boolean;
     isSelected: boolean;
+    isDisabled: boolean;
     selectedChildId: any;
     searchQuery: any;
     index: any;
     childListMaxHeight: string;
     searchHandler: any;
-}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    variant: string;
+    draggableArea: string;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     toggle: (value: boolean) => void;
     select: () => void;
     selectChild: (childItem: SortableListItem) => void;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     item: SortableListItem;
     index?: number;
     isOpen?: boolean;
     isSelected?: boolean;
+    isDisabled?: boolean;
     selectedChildId?: string | number;
     searchQuery?: string;
-    childListMaxHeight: string;
+    childListMaxHeight?: string;
     searchHandler?: (item: SortableListItem, searchQuery: string) => boolean;
     displayValue: (item: SortableListItem) => string;
+    variant?: "default" | "compact";
+    draggableArea?: "handle" | "full";
 }>, {
     text: string;
     isOpen: boolean;
     isSelected: boolean;
+    isDisabled: boolean;
     selectedChildId: any;
     searchQuery: any;
     index: any;
     childListMaxHeight: string;
     searchHandler: any;
-}>>> & Readonly<{
+    variant: string;
+    draggableArea: string;
+}>>> & {
     onSelect?: () => any;
     onToggle?: (value: boolean) => any;
     onSelectChild?: (childItem: SortableListItem) => any;
-}>, {
+}, {
+    variant: "default" | "compact";
     isOpen: boolean;
     index: number;
     isSelected: boolean;
     searchQuery: string;
+    isDisabled: boolean;
     selectedChildId: string | number;
     childListMaxHeight: string;
     searchHandler: (item: SortableListItem, searchQuery: string) => boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
+    draggableArea: "handle" | "full";
+}>, {
     menu?(_: {}): any;
 }>;
 export default _default;

package/components/sortableList/SortableItem.vue.js

@@ -0,0 +1,7 @@
+import e from "./SortableItem.vue2.js";
+/* empty css                   */import o from "../../_virtual/_plugin-vue_export-helper.js";
+// import "../../SortableItem.vue_vue_type_style_index_0_scoped_c72be7ed_lang.css"; //*');
+const c = /* @__PURE__ */ o(e, [["__scopeId", "data-v-c72be7ed"]]);
+export {
+  c as default
+};

package/components/sortableList/SortableItem.vue2.js

@@ -0,0 +1,172 @@
+ import "../../SortableItem.vue_vue_type_style_index_0_scoped_c72be7ed_lang.css"; import { defineComponent as P, useCssVars as A, useSlots as E, computed as h, watch as $, ref as I, openBlock as l, createElementBlock as o, normalizeClass as d, unref as e, withModifiers as y, createElementVNode as c, createVNode as b, createBlock as n, withCtx as S, createTextVNode as V, toDisplayString as F, createCommentVNode as u, renderSlot as R, mergeProps as H, normalizeProps as j, Fragment as q, renderList as G } from "vue";
+import L from "../typography/v4/Typography.vue.js";
+import f from "../icon/v4/IconV4.vue.js";
+import w from "../icon/v4/IconFlag.vue.js";
+import J from "./SortableItemLabel.vue.js";
+import { useVirtualList as K } from "@vueuse/core";
+import { matchString as U } from "../../utils/search.js";
+import { useHoverEffect as W } from "./composables/useHoverEffect.js";
+const X = { class: "item__prefix" }, Y = ["onClick"], Z = ["onClick"], re = /* @__PURE__ */ P({
+  __name: "SortableItem",
+  props: {
+    item: null,
+    index: { default: null },
+    isOpen: { type: Boolean, default: !1 },
+    isSelected: { type: Boolean, default: !1 },
+    isDisabled: { type: Boolean, default: !1 },
+    selectedChildId: { default: null },
+    searchQuery: { default: null },
+    childListMaxHeight: { default: "530px" },
+    searchHandler: { type: Function, default: null },
+    displayValue: null,
+    variant: { default: "default" },
+    draggableArea: { default: "handle" }
+  },
+  emits: ["toggle", "select", "selectChild"],
+  setup(t, { emit: g }) {
+    const s = t;
+    A((r) => ({
+      "6b8d7a5c": t.childListMaxHeight
+    }));
+    const M = E(), z = () => {
+      g("toggle", !s.isOpen);
+    }, k = h(() => (s.item.children || []).filter(
+      (a) => s.searchHandler ? s.searchHandler(a, s.searchQuery) : U(a.displayText, s.searchQuery)
+    )), v = h(() => k.value.length > 0), m = h(() => s.draggableArea === "full"), B = (r) => r.id === s.selectedChildId, {
+      list: Q,
+      containerProps: T,
+      wrapperProps: D,
+      scrollTo: N
+    } = K(k, {
+      itemHeight: 34
+    });
+    $(
+      () => s.searchQuery,
+      () => N(0)
+    );
+    const p = I(null), { handleMouseout: x, handleMouseover: C } = W(
+      p,
+      "sortable-item--hovered"
+    );
+    return (r, a) => (l(), o("div", {
+      ref_key: "itemRef",
+      ref: p,
+      class: d(["sortable-item", {
+        "sortable-item--fully-draggable": e(m),
+        "sortable-item--selected": t.isSelected,
+        "sortable-item--compact": t.variant === "compact",
+        "sortable-item--disabled": t.item.isDisabled
+      }]),
+      onMouseover: a[1] || (a[1] = //@ts-ignore
+      (...i) => e(C) && e(C)(...i)),
+      onMouseout: a[2] || (a[2] = //@ts-ignore
+      (...i) => e(x) && e(x)(...i)),
+      onClick: a[3] || (a[3] = y((i) => g("select"), ["stop"]))
+    }, [
+      c("div", {
+        class: d(["item", {
+          "item--fully-draggable": e(m),
+          "drag-allowed": !t.item.isLocked && !t.searchQuery,
+          "item--selected": t.isSelected && !t.selectedChildId
+        }])
+      }, [
+        c("div", {
+          class: d(["draggable-handle", {
+            "handle-area": e(m),
+            "draggable-handle--disabled": t.item.isDisabled
+          }])
+        }, [
+          b(e(f), {
+            name: "dots-six-vertical",
+            size: "20px",
+            type: "bold"
+          })
+        ], 2),
+        c("div", X, [
+          t.item.isLocked ? (l(), n(e(f), {
+            key: 1,
+            class: "locked-icon",
+            name: "lock",
+            size: "16px"
+          })) : (l(), n(e(L), {
+            key: 0,
+            class: "order-num",
+            variant: "subtitle2"
+          }, {
+            default: S(() => [
+              V(F(t.index + 1) + ". ", 1)
+            ]),
+            _: 1
+          }))
+        ]),
+        e(v) && !t.searchQuery ? (l(), o("div", {
+          key: 0,
+          class: "expand-icon",
+          onClick: y(z, ["stop"])
+        }, [
+          t.isOpen ? (l(), n(e(f), {
+            key: 0,
+            name: "caret-down",
+            size: "16px"
+          })) : (l(), n(e(f), {
+            key: 1,
+            name: "caret-right",
+            size: "16px"
+          }))
+        ], 8, Y)) : u("", !0),
+        c("div", {
+          class: d(["item__text", { "handle-area": e(m) }])
+        }, [
+          t.item.countryFlag ? (l(), n(e(w), {
+            key: 0,
+            class: "country-flag",
+            "country-code": t.item.countryFlag
+          }, null, 8, ["country-code"])) : u("", !0),
+          b(J, {
+            "display-value": t.displayValue,
+            item: t.item
+          }, null, 8, ["display-value", "item"])
+        ], 2),
+        e(M)?.menu ? (l(), o("div", {
+          key: 1,
+          class: "item__menu",
+          onClick: a[0] || (a[0] = y(() => {
+          }, ["stop"]))
+        }, [
+          R(r.$slots, "menu", {}, void 0, !0)
+        ])) : u("", !0)
+      ], 2),
+      c("div", H(e(T), { class: "child-list" }), [
+        e(v) && t.isOpen ? (l(), o("ul", j(H({ key: 0 }, e(D))), [
+          (l(!0), o(q, null, G(e(Q), ({ data: i, index: O }) => (l(), o("li", {
+            key: O,
+            class: d({ selected: B(i) }),
+            onClick: y((_) => g("selectChild", i), ["stop"])
+          }, [
+            i.countryFlag ? (l(), n(e(w), {
+              key: 0,
+              class: "country-flag",
+              "country-code": i.countryFlag
+            }, null, 8, ["country-code"])) : u("", !0),
+            b(e(L), {
+              class: "country-title",
+              variant: "body2",
+              "tooltip-placement": "top",
+              "tooltip-text": t.displayValue(i),
+              "is-truncated": "",
+              "with-tooltip": ""
+            }, {
+              default: S(() => [
+                V(F(t.displayValue(i)), 1)
+              ]),
+              _: 2
+            }, 1032, ["tooltip-text"])
+          ], 10, Z))), 128))
+        ], 16)) : u("", !0)
+      ], 16)
+    ], 34));
+  }
+});
+export {
+  re as default
+};

package/components/sortableList/SortableItemLabel.vue.d.ts

@@ -1,11 +1,11 @@
 import { SortableListItem } from '@/components/sortableList/SortableList.types';
-declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     item: SortableListItem;
     displayValue: (item: SortableListItem) => string;
-}>, {}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+}>, {}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     item: SortableListItem;
     displayValue: (item: SortableListItem) => string;
-}>, {}>>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}>, {}>>>, {}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {

package/components/sortableList/SortableItemLabel.vue.js

@@ -0,0 +1,7 @@
+import e from "./SortableItemLabel.vue2.js";
+/* empty css                        */import o from "../../_virtual/_plugin-vue_export-helper.js";
+// import "../../SortableItemLabel.vue_vue_type_style_index_0_scoped_a534c7af_lang.css"; //*');
+const s = /* @__PURE__ */ o(e, [["__scopeId", "data-v-a534c7af"]]);
+export {
+  s as default
+};

package/components/sortableList/SortableItemLabel.vue2.js

@@ -0,0 +1,60 @@
+ import "../../SortableItemLabel.vue_vue_type_style_index_0_scoped_a534c7af_lang.css"; import { defineComponent as m, openBlock as a, createBlock as u, unref as l, withCtx as t, createElementVNode as p, createElementBlock as d, Fragment as f, renderList as h, createVNode as i, createTextVNode as o, toDisplayString as r, normalizeClass as x } from "vue";
+import s from "../typography/v4/Typography.vue.js";
+import b from "../tooltip/v4/TooltipV4.vue.js";
+const y = { class: "tooltip-content" }, k = /* @__PURE__ */ m({
+  __name: "SortableItemLabel",
+  props: {
+    item: null,
+    displayValue: null
+  },
+  setup(e) {
+    return (_, v) => (a(), u(l(b), {
+      class: "item-label",
+      placement: "right",
+      disabled: !e.item.helpText
+    }, {
+      tooltip: t(() => [
+        p("div", y, [
+          (a(!0), d(f, null, h(e.item.helpText, (n, c) => (a(), d("div", {
+            key: c,
+            class: "help"
+          }, [
+            i(l(s), {
+              class: "help__title",
+              variant: "h5"
+            }, {
+              default: t(() => [
+                o(r(n.title), 1)
+              ]),
+              _: 2
+            }, 1024),
+            i(l(s), {
+              class: "help__text",
+              variant: "body2"
+            }, {
+              default: t(() => [
+                o(r(n.text), 1)
+              ]),
+              _: 2
+            }, 1024)
+          ]))), 128))
+        ])
+      ]),
+      default: t(() => [
+        i(l(s), {
+          variant: "body2",
+          class: x(["item-text", { "item-text--disabled": e.item.isDisabled }])
+        }, {
+          default: t(() => [
+            o(r(e.displayValue(e.item)), 1)
+          ]),
+          _: 1
+        }, 8, ["class"])
+      ]),
+      _: 1
+    }, 8, ["disabled"]));
+  }
+});
+export {
+  k as default
+};

package/components/sortableList/SortableList.types.d.ts

@@ -1,3 +1,5 @@
+import { Ref } from 'vue';
+import { UseVirtualListItem } from '@vueuse/core';
 export type SortableListItem = {
     id: number | string;
     displayText: string;
@@ -8,4 +10,20 @@ export type SortableListItem = {
         title: string;
         text: string;
     }[];
+    isDisabled?: boolean;
+};
+export type VirtualListResult = {
+    list: Ref<UseVirtualListItem<SortableListItem>[]>;
+    scrollTo: (index: number) => void;
+    containerProps: {
+        ref: Ref<HTMLElement>;
+        onScroll: () => void;
+    };
+    wrapperProps: Ref<{
+        style: {
+            width: string;
+            height: string;
+            marginTop: string;
+        };
+    }>;
 };

package/components/sortableList/SortableList.vue.d.ts

@@ -1,10 +1,12 @@
 import { SortableListItem } from '@/components/sortableList/SortableList.types';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     items: SortableListItem[];
     displayValue: (item: SortableListItem) => string;
     openId?: string | number;
     selectedId?: string | number;
     selectedChildId?: string | number;
+    variant?: "default" | "compact";
+    draggableArea?: "handle" | "full";
     search?: string;
     showSearch?: boolean;
     searchPlaceholder?: string;
@@ -22,6 +24,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     openId: any;
     selectedId: any;
     selectedChildId: any;
+    variant: string;
+    draggableArea: string;
     search: any;
     showSearch: boolean;
     searchPlaceholder: string;
@@ -33,7 +37,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     isSticky: boolean;
     zIndexBase: number;
     testId: string;
-}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     sortableItemDragged: (event: {
         id: string;
         newIndex: number;
@@ -44,12 +48,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     "update:selectedChildId": (id: string | number) => void;
     "update:search": (query: string) => void;
     clearSearch: () => void;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     items: SortableListItem[];
     displayValue: (item: SortableListItem) => string;
     openId?: string | number;
     selectedId?: string | number;
     selectedChildId?: string | number;
+    variant?: "default" | "compact";
+    draggableArea?: "handle" | "full";
     search?: string;
     showSearch?: boolean;
     searchPlaceholder?: string;
@@ -67,6 +73,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     openId: any;
     selectedId: any;
     selectedChildId: any;
+    variant: string;
+    draggableArea: string;
     search: any;
     showSearch: boolean;
     searchPlaceholder: string;
@@ -78,7 +86,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     isSticky: boolean;
     zIndexBase: number;
     testId: string;
-}>>> & Readonly<{
+}>>> & {
+    onClearSearch?: () => any;
     onSortableItemDragged?: (event: {
         id: string;
         newIndex: number;
@@ -88,10 +97,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     "onUpdate:selectedId"?: (id: string | number) => any;
     "onUpdate:selectedChildId"?: (id: string | number) => any;
     "onUpdate:search"?: (query: string) => any;
-    onClearSearch?: () => any;
-}>, {
+}, {
     search: string;
     testId: string;
+    variant: "default" | "compact";
     isLoading: boolean;
     displayValue: (item: SortableListItem) => string;
     searchPlaceholder: string;
@@ -99,14 +108,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     selectedChildId: string | number;
     childListMaxHeight: string;
     searchHandler: (item: SortableListItem, searchQuery: string) => boolean;
+    draggableArea: "handle" | "full";
+    loadingRowCount: number;
     openId: string | number;
+    zIndexBase: number;
     selectedId: string | number;
     showSearch: boolean;
-    loadingRowCount: number;
     emptyStateTitle: string;
     isSticky: boolean;
-    zIndexBase: number;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
+}>, {
     header?(_: {}): any;
     menu?(_: {
         item: SortableListItem;

package/components/sortableList/SortableList.vue.js

@@ -0,0 +1,7 @@
+import e from "./SortableList.vue2.js";
+/* empty css                   */import o from "../../_virtual/_plugin-vue_export-helper.js";
+// import "../../SortableList.vue_vue_type_style_index_0_scoped_9aec4e9b_lang.css"; //*');
+const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-9aec4e9b"]]);
+export {
+  a as default
+};

package/components/sortableList/SortableList.vue2.js

@@ -0,0 +1,177 @@
+ import "../../SortableList.vue_vue_type_style_index_0_scoped_9aec4e9b_lang.css"; import { defineComponent as M, useCssVars as P, useSlots as z, computed as g, openBlock as s, createElementBlock as u, mergeProps as T, unref as t, normalizeClass as U, renderSlot as f, createCommentVNode as c, createBlock as S, isRef as x, withCtx as p, Fragment as D, renderList as H, createSlots as R, createVNode as w, createTextVNode as K, toDisplayString as Q } from "vue";
+import { VueDraggable as j } from "vue-draggable-plus";
+import $ from "./SortableItem.vue.js";
+import J from "./LoaderBars.vue.js";
+import W from "../search/v4/SearchV4.vue.js";
+import X from "../typography/v4/Typography.vue.js";
+import { useVModel as Y } from "@vueuse/core";
+import { matchString as N } from "../../utils/search.js";
+import { useTestIdAttrs as Z } from "../../utils/testIds.js";
+import { SortableListTestIdModifiers as I } from "../../testids/index.js";
+import { useDraggableHelpers as _ } from "./composables/useDraggableHelpers.js";
+import { DRAGGABLE_HANDLE_SELECTOR as ee, DRAGGABLE_AREA_SELECTOR as le } from "./consts.js";
+const te = {
+  key: 1,
+  class: "sortable-list-container"
+}, ae = {
+  key: 3,
+  class: "empty-state-title"
+}, me = /* @__PURE__ */ M({
+  __name: "SortableList",
+  props: {
+    items: { default: () => [] },
+    displayValue: { type: Function, default: (a) => a.displayText || a.toString() },
+    openId: { default: null },
+    selectedId: { default: null },
+    selectedChildId: { default: null },
+    variant: { default: "default" },
+    draggableArea: { default: "handle" },
+    search: { default: null },
+    showSearch: { type: Boolean, default: !1 },
+    searchPlaceholder: { default: "Search" },
+    searchHandler: { type: Function, default: null },
+    isLoading: { type: Boolean, default: !1 },
+    loadingRowCount: { default: 3 },
+    emptyStateTitle: { default: "No results" },
+    childListMaxHeight: { default: "530px" },
+    isSticky: { type: Boolean, default: !0 },
+    zIndexBase: { default: 100 },
+    testId: { default: "" }
+  },
+  emits: ["sortableItemDragged", "update:items", "update:openId", "update:selectedId", "update:selectedChildId", "update:search", "clearSearch"],
+  setup(a, { emit: n }) {
+    const r = a;
+    P((l) => ({
+      "0d58eb02": a.zIndexBase
+    }));
+    const y = z(), i = Y(r, "search", n), b = g(() => !!i.value?.trim()), C = g(() => b.value ? r.items.filter((l) => {
+      const d = l.children || [], e = i.value;
+      return r.searchHandler ? r.searchHandler(l, e) : N(l.displayText, e) || // match parent item
+      d.some((o) => N(o.displayText, e));
+    }) : r.items), h = g({
+      get() {
+        return C.value.filter((l) => !l.isLocked);
+      },
+      set(l) {
+        n("update:items", [...l, ...k.value]);
+      }
+    }), k = g(
+      () => C.value.filter((l) => l.isLocked)
+    ), G = g(
+      () => r.draggableArea === "handle" ? ee : le
+    ), { onDragStart: O, onDragEnd: q, draggingInProgress: F } = _(n), A = (l) => (b.value || l.id === r.openId) && !F.value, E = (l, d) => {
+      d ? n("update:openId", l.id) : n("update:openId", null);
+    }, m = (l) => l.id === r.selectedId, V = (l) => {
+      n("update:selectedId", l.id), n("update:selectedChildId", null);
+    }, B = (l, d) => {
+      n("update:selectedChildId", l.id), n("update:selectedId", d.id), n("update:openId", d.id);
+    }, L = Z(r.testId, I);
+    return (l, d) => (s(), u("div", T({ class: "sortable-list-and-header-container" }, t(L)[t(I).CONTAINER]), [
+      t(y).header || a.showSearch ? (s(), u("div", {
+        key: 0,
+        class: U(["header-container", { sticky: a.isSticky }])
+      }, [
+        t(y).header ? f(l.$slots, "header", { key: 0 }, void 0, !0) : c("", !0),
+        a.showSearch ? (s(), S(t(W), {
+          key: 1,
+          modelValue: t(i),
+          "onUpdate:modelValue": d[0] || (d[0] = (e) => x(i) ? i.value = e : null),
+          placeholder: a.searchPlaceholder,
+          "test-id": a.testId,
+          onOnClear: d[1] || (d[1] = (e) => n("clearSearch"))
+        }, null, 8, ["modelValue", "placeholder", "test-id"])) : c("", !0)
+      ], 2)) : c("", !0),
+      a.isLoading ? f(l.$slots, "loader", { key: 2 }, () => [
+        w(J, {
+          "loading-row-count": a.loadingRowCount,
+          variant: a.variant
+        }, null, 8, ["loading-row-count", "variant"])
+      ], !0) : (s(), u("div", te, [
+        t(h).length ? (s(), S(t(j), T({
+          key: 0,
+          modelValue: t(h),
+          "onUpdate:modelValue": d[2] || (d[2] = (e) => x(h) ? h.value = e : null),
+          class: "sortable-list",
+          filter: ".expand-icon",
+          animation: 150,
+          handle: t(G),
+          disabled: t(b)
+        }, t(L)[t(I).DRAGGABLE_LIST], {
+          onStart: t(O),
+          onEnd: t(q)
+        }), {
+          default: p(() => [
+            (s(!0), u(D, null, H(t(h), (e, o) => (s(), S($, {
+              key: e.id,
+              "data-id": e.id,
+              item: e,
+              index: o,
+              "is-open": A(e),
+              "is-selected": m(e),
+              "is-disabled": !!e.isDisabled,
+              "selected-child-id": m(e) ? a.selectedChildId : null,
+              "display-value": a.displayValue,
+              "search-query": t(i),
+              "search-handler": a.searchHandler,
+              variant: a.variant,
+              "draggable-area": a.draggableArea,
+              onToggle: (v) => E(e, v),
+              onSelect: (v) => V(e),
+              onSelectChild: (v) => B(v, e)
+            }, R({ _: 2 }, [
+              t(y).menu ? {
+                name: "menu",
+                fn: p(() => [
+                  f(l.$slots, "menu", { item: e }, void 0, !0)
+                ]),
+                key: "0"
+              } : void 0
+            ]), 1032, ["data-id", "item", "index", "is-open", "is-selected", "is-disabled", "selected-child-id", "display-value", "search-query", "search-handler", "variant", "draggable-area", "onToggle", "onSelect", "onSelectChild"]))), 128))
+          ]),
+          _: 3
+        }, 16, ["modelValue", "handle", "disabled", "onStart", "onEnd"])) : c("", !0),
+        t(k).length ? (s(), u("div", T({
+          key: 1,
+          class: "locked-list"
+        }, t(L)[t(I).LOCKED_LIST]), [
+          (s(!0), u(D, null, H(t(k), (e) => (s(), S($, {
+            key: e.id,
+            item: e,
+            "is-open": A(e),
+            "is-selected": m(e),
+            "selected-child-id": m(e) ? a.selectedChildId : null,
+            "display-value": a.displayValue,
+            "search-query": t(i),
+            "on-search": a.searchHandler,
+            "child-list-max-height": a.childListMaxHeight,
+            variant: a.variant,
+            onToggle: (o) => E(e, o),
+            onSelect: (o) => V(e),
+            onSelectChild: (o) => B(o, e)
+          }, R({ _: 2 }, [
+            t(y).menu ? {
+              name: "menu",
+              fn: p(() => [
+                f(l.$slots, "menu", { item: e }, void 0, !0)
+              ]),
+              key: "0"
+            } : void 0
+          ]), 1032, ["item", "is-open", "is-selected", "selected-child-id", "display-value", "search-query", "on-search", "child-list-max-height", "variant", "onToggle", "onSelect", "onSelectChild"]))), 128))
+        ], 16)) : c("", !0)
+      ])),
+      !t(C).length && !a.isLoading ? (s(), u("div", ae, [
+        f(l.$slots, "empty-state", {}, () => [
+          w(t(X), { variant: "body2" }, {
+            default: p(() => [
+              K(Q(a.emptyStateTitle), 1)
+            ]),
+            _: 1
+          })
+        ], !0)
+      ])) : c("", !0)
+    ], 16));
+  }
+});
+export {
+  me as default
+};