@ironsource/shared-ui 2.1.12-test.53 → 2.1.12-test.54

package/components/chart/LegendSorting.vue.d.ts

@@ -2,19 +2,24 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     selected: unknown;
     options: unknown[];
     optionNameKey: string;
+    testId?: string;
 }>, {
     options: () => any[];
+    testId: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:selected": (option: unknown) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     selected: unknown;
     options: unknown[];
     optionNameKey: string;
+    testId?: string;
 }>, {
     options: () => any[];
+    testId: string;
 }>>> & {
     "onUpdate:selected"?: (option: unknown) => any;
 }, {
+    testId: string;
     options: unknown[];
 }>;
 export default _default;

package/components/chart/LegendSorting.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as l, openBlock as m, createElementBlock as s, createVNode as r, unref as n, isRef as d, withCtx as a, mergeProps as c } from "vue";
+import { defineComponent as l, openBlock as s, createElementBlock as m, createVNode as r, unref as n, isRef as d, withCtx as a, mergeProps as c } from "vue";
 import u from "../dropdown/v4/DropdownV4.vue.js";
 import "../dropdown/v4/DefaultDropdownTrigger.vue.js";
 import f from "../dropdown/v4/IconButtonDropdownTrigger.vue.js";
@@ -15,28 +15,30 @@ const y = { class: "legend-sorting" }, L = /* @__PURE__ */ l({
   props: {
     selected: null,
     options: { default: () => [] },
-    optionNameKey: null
+    optionNameKey: null,
+    testId: { default: "" }
   },
   emits: ["update:selected"],
-  setup(o, { emit: p }) {
-    const t = g(o, "selected", p);
-    return (v, i) => (m(), s("div", y, [
+  setup(e, { emit: p }) {
+    const o = g(e, "selected", p);
+    return (v, i) => (s(), m("div", y, [
       r(n(u), {
-        selected: n(t),
-        "onUpdate:selected": i[0] || (i[0] = (e) => d(t) ? t.value = e : null),
-        "display-value": (e) => e[o.optionNameKey],
-        options: o.options,
-        "option-name-key": o.optionNameKey,
-        placement: "bottom-end"
+        selected: n(o),
+        "onUpdate:selected": i[0] || (i[0] = (t) => d(o) ? o.value = t : null),
+        "display-value": (t) => t[e.optionNameKey],
+        options: e.options,
+        "option-name-key": e.optionNameKey,
+        placement: "bottom-end",
+        "test-id": e.testId
       }, {
-        "dropdown-trigger": a(({ buttonTriggerProps: e }) => [
-          r(n(f), c(e, {
+        "dropdown-trigger": a(({ buttonTriggerProps: t }) => [
+          r(n(f), c(t, {
             "icon-name": "funnel-simple",
             "icon-type": "regular"
           }), null, 16)
         ]),
         _: 1
-      }, 8, ["selected", "display-value", "options", "option-name-key"])
+      }, 8, ["selected", "display-value", "options", "option-name-key", "test-id"])
     ]));
   }
 });

package/components/chart/SettingsHeader.vue.d.ts

@@ -1,15 +1,23 @@
 import { ChartType } from './types';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     chartType: ChartType;
     hideLegend: boolean;
+    testId?: string;
+}>, {
+    testId: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:chartType": (type: ChartType) => void;
-}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     chartType: ChartType;
     hideLegend: boolean;
+    testId?: string;
+}>, {
+    testId: string;
 }>>> & {
     "onUpdate:chartType"?: (type: ChartType) => any;
-}, {}>, {
+}, {
+    testId: string;
+}>, {
     "before-chart-type"?(_: {}): any;
     metric?(_: {}): any;
     breakdowns?(_: {}): any;
@@ -24,6 +32,14 @@ type __VLS_TypePropsToRuntimeProps<T> = {
         required: true;
     };
 };
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;

package/components/chart/SettingsHeader.vue.js

@@ -1,7 +1,7 @@
 import e from "./SettingsHeader.vue2.js";
 /* empty css                     */import o from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../SettingsHeader.vue_vue_type_style_index_0_scoped_01f78cd7_lang.css"; //*');
-const c = /* @__PURE__ */ o(e, [["__scopeId", "data-v-01f78cd7"]]);
+// import "../../SettingsHeader.vue_vue_type_style_index_0_scoped_a869d327_lang.css"; //*');
+const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-a869d327"]]);
 export {
-  c as default
+  a as default
 };

package/components/chart/SettingsHeader.vue2.js

@@ -1,66 +1,73 @@
- import "../../SettingsHeader.vue_vue_type_style_index_0_scoped_01f78cd7_lang.css"; import { defineComponent as h, computed as g, openBlock as y, createElementBlock as f, createElementVNode as r, normalizeClass as l, renderSlot as i, createVNode as p, unref as t, isRef as v, withCtx as T, mergeProps as b } from "vue";
-import w from "../dropdown/v4/DropdownV4.vue.js";
+ import "../../SettingsHeader.vue_vue_type_style_index_0_scoped_a869d327_lang.css"; import { defineComponent as y, computed as T, openBlock as v, createElementBlock as I, mergeProps as m, unref as t, createElementVNode as s, normalizeClass as c, renderSlot as i, createVNode as u, isRef as b, withCtx as w } from "vue";
+import N from "../dropdown/v4/DropdownV4.vue.js";
 import "../dropdown/v4/DefaultDropdownTrigger.vue.js";
 import "../dropdown/v4/IconButtonDropdownTrigger.vue.js";
 import "../dropdown/v4/ChipDropdownTrigger.vue.js";
 import "../dropdown/v4/AppDropdownTrigger.vue.js";
-import k from "../dropdown/v4/ButtonDropdownTrigger.vue.js";
+import O from "../dropdown/v4/ButtonDropdownTrigger.vue.js";
 import "../dropdown/v4/ButtonFilterDropdownTrigger.vue.js";
 import "../dropdown/v4/TreeDropdown.vue.js";
 import "../dropdown/v4/OptionV4.vue.js";
 import "../dropdown/v4/ConditionalDropdown.vue.js";
-import { DROPDOWN_TYPE_OPTIONS as c } from "./consts.js";
-const B = { class: "settings-header-container" }, C = { class: "chart-type-selection" }, H = /* @__PURE__ */ h({
+import { DROPDOWN_TYPE_OPTIONS as f } from "./consts.js";
+import { useTestIdAttrs as k } from "../../utils/testIds.js";
+import { ChartSettingsHeaderTestIdModifiers as n } from "../../testids/index.js";
+const C = { class: "chart-type-selection" }, M = /* @__PURE__ */ y({
   __name: "SettingsHeader",
   props: {
     chartType: null,
-    hideLegend: { type: Boolean }
+    hideLegend: { type: Boolean },
+    testId: { default: "" }
   },
   emits: ["update:chartType"],
-  setup(s, { emit: m }) {
-    const u = s, o = g({
+  setup(r, { emit: h }) {
+    const a = r, o = T({
       get() {
-        return c.find(({ id: e }) => e === u.chartType);
+        return f.find(({ id: e }) => e === a.chartType);
       },
       set(e) {
-        m("update:chartType", e.id);
+        h("update:chartType", e.id);
       }
-    }), d = (e) => `Chart: ${e.name}`;
-    return (e, a) => (y(), f("div", B, [
-      r("div", {
-        class: l(["settings", { "settings-spacer": !s.hideLegend }])
+    }), l = (e) => `Chart: ${e.name}`, g = k(
+      a.testId,
+      n
+    );
+    return (e, p) => (v(), I("div", m({ class: "settings-header-container" }, t(g)[t(n).CONTAINER]), [
+      s("div", {
+        class: c(["settings", { "settings-spacer": !r.hideLegend }])
       }, [
         i(e.$slots, "before-chart-type", {}, void 0, !0),
-        r("div", C, [
-          p(t(w), {
+        s("div", C, [
+          u(t(N), {
             selected: t(o),
-            "onUpdate:selected": a[0] || (a[0] = (n) => v(o) ? o.value = n : null),
-            options: t(c),
+            "onUpdate:selected": p[0] || (p[0] = (d) => b(o) ? o.value = d : null),
+            options: t(f),
             "option-name-key": "name",
-            "display-value": d,
+            "display-value": l,
             placeholder: "Select chart type",
-            size: "small"
+            size: "small",
+            "test-id": `${r.testId}-${t(n).TYPE_DROPDOWN}`
           }, {
-            "dropdown-trigger": T(({ buttonTriggerProps: n }) => [
-              p(t(k), b(n, {
-                label: d(t(o))
+            "dropdown-trigger": w(({ buttonTriggerProps: d }) => [
+              u(t(O), m(d, {
+                label: l(t(o))
               }), null, 16, ["label"])
             ]),
             _: 1
-          }, 8, ["selected", "options"])
+          }, 8, ["selected", "options", "test-id"])
         ]),
-        r("div", null, [
+        s("div", null, [
           i(e.$slots, "metric", {}, void 0, !0)
         ])
       ], 2),
-      r("div", {
-        class: l(["breakdowns", { "breakdowns-border": !s.hideLegend }])
+      s("div", {
+        class: c(["breakdowns", { "breakdowns-border": !r.hideLegend }])
       }, [
         i(e.$slots, "breakdowns", {}, void 0, !0)
       ], 2)
-    ]));
+    ], 16));
   }
 });
 export {
-  H as default
+  M as default
 };

package/components/chart/index.d.ts

@@ -6,6 +6,7 @@ declare const ChartTypes: () => ({
         $data: {};
         $props: Partial<{
             header: string;
+            testId: string;
             loading: boolean;
             visibleIds: unknown[];
             minVisible: number;
@@ -53,6 +54,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
+            testId: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
             loading: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -234,7 +239,7 @@ declare const ChartTypes: () => ({
             "onUpdate:visibleIds"?: (visibleIds: unknown[]) => any;
             "onUpdate:sortSelected"?: (sortOption: unknown) => any;
             "onUpdate:chartType"?: (chartType: ChartType) => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "loading" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "sortSelected" | "sortOptions" | "sortOptionNameKey" | "chartType" | "hideLegend" | "xAxisFormat" | "xAxisDateInterval" | "totalsChart" | "parsing" | "yAxisFormat" | "valueSuffix" | "valuePrefix" | "trendTooltip" | "subheader" | "subheaderTooltip" | "trendValue" | "trendDirection" | "noteText" | "dataSets" | "tickCount" | "truncateTickLabels" | "keepSubheaderVisible" | "empty" | "noDataIcon" | "noDataTitle" | "noDataSubtitle" | "withAnimation" | "tooltipTotalType" | "tooltipTotalCalcFn" | "tooltipOrder" | "indicateIncompleteData" | "tooltipExcludeTotalItem" | "fullHeight" | "fullHeightBottomSpacing" | "withSettingsHeader" | "extraCharts" | "colorVariant">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "testId" | "loading" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "sortSelected" | "sortOptions" | "sortOptionNameKey" | "chartType" | "hideLegend" | "xAxisFormat" | "xAxisDateInterval" | "totalsChart" | "parsing" | "yAxisFormat" | "valueSuffix" | "valuePrefix" | "trendTooltip" | "subheader" | "subheaderTooltip" | "trendValue" | "trendDirection" | "noteText" | "dataSets" | "tickCount" | "truncateTickLabels" | "keepSubheaderVisible" | "empty" | "noDataIcon" | "noDataTitle" | "noDataSubtitle" | "withAnimation" | "tooltipTotalType" | "tooltipTotalCalcFn" | "tooltipOrder" | "indicateIncompleteData" | "tooltipExcludeTotalItem" | "fullHeight" | "fullHeightBottomSpacing" | "withSettingsHeader" | "extraCharts" | "colorVariant">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -253,6 +258,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
+            testId: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
             loading: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -440,6 +449,7 @@ declare const ChartTypes: () => ({
             "update:sortSelected": (sortOption: unknown) => void;
         }, string, {
             header: string;
+            testId: string;
             loading: boolean;
             visibleIds: unknown[];
             minVisible: number;
@@ -507,6 +517,10 @@ declare const ChartTypes: () => ({
             type: import("vue").PropType<string>;
             default: string;
         };
+        testId: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
         loading: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -697,6 +711,10 @@ declare const ChartTypes: () => ({
         type: import("vue").PropType<string>;
         default: string;
     };
+    testId: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
     loading: {
         type: import("vue").PropType<boolean>;
         default: boolean;
@@ -884,6 +902,7 @@ declare const ChartTypes: () => ({
     "update:sortSelected": (sortOption: unknown) => void;
 }, string, {
     header: string;
+    testId: string;
     loading: boolean;
     visibleIds: unknown[];
     minVisible: number;

package/components/columnConfigurator/ColumnConfigurator.types.d.ts

@@ -0,0 +1,12 @@
+import { SortableListItem } from '@/components/sortableList/SortableList.types';
+export type ColumnConfigSection = {
+    sectionId: string;
+    title: string;
+    isGrouped: boolean;
+    maxSelections?: number;
+    sectionOptions: SortableListItem[] | SectionOptionsGroup[];
+};
+export type SectionOptionsGroup = {
+    displayText: string;
+    options: SortableListItem[];
+};

package/components/columnConfigurator/ColumnConfigurator.vue.d.ts

@@ -0,0 +1,61 @@
+import { ColumnConfigSection } from '@/components/columnConfigurator/ColumnConfigurator.types';
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    columnsConfig: ColumnConfigSection[];
+    selection: (string | number)[];
+    childSelection: Record<string, string | number>;
+    alwaysVisibleCount?: number;
+    loading?: boolean;
+    testId?: string;
+}>, {
+    columnsConfig: () => any[];
+    selection: () => any[];
+    childSelection: () => {};
+    alwaysVisibleCount: number;
+    loading: boolean;
+    testId: string;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:selection": (value: unknown[]) => void;
+    "update:childSelection": (value: Record<string, string | number>) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    columnsConfig: ColumnConfigSection[];
+    selection: (string | number)[];
+    childSelection: Record<string, string | number>;
+    alwaysVisibleCount?: number;
+    loading?: boolean;
+    testId?: string;
+}>, {
+    columnsConfig: () => any[];
+    selection: () => any[];
+    childSelection: () => {};
+    alwaysVisibleCount: number;
+    loading: boolean;
+    testId: string;
+}>>> & {
+    "onUpdate:selection"?: (value: unknown[]) => any;
+    "onUpdate:childSelection"?: (value: Record<string, string | number>) => any;
+}, {
+    testId: string;
+    loading: boolean;
+    selection: (string | number)[];
+    alwaysVisibleCount: number;
+    columnsConfig: ColumnConfigSection[];
+    childSelection: Record<string, string | number>;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/components/columnConfigurator/ColumnConfigurator.vue.js

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

package/components/columnConfigurator/ColumnConfigurator.vue2.js

@@ -0,0 +1,113 @@
+ import "../../ColumnConfigurator.vue_vue_type_style_index_0_scoped_702ad52e_lang.css"; import { defineComponent as E, ref as g, computed as f, watch as I, openBlock as p, createElementBlock as v, mergeProps as O, unref as s, Fragment as w, renderList as T, createVNode as u, isRef as U, withCtx as h, createElementVNode as x } from "vue";
+import N from "./SectionHeaderText.vue.js";
+import R from "../sortableList/SortableSelectableList.vue.js";
+import k from "../columnPicker/RemoveButton.vue.js";
+import { mapOverObject as B, omitKeys as A } from "../../utils/object.js";
+import { findOptionInSection as P } from "./utils.js";
+import { useTestIdAttrs as V } from "../../utils/testIds.js";
+import { ColumnConfiguratorTestIdModifiers as c } from "../../testids/index.js";
+import L from "./SectionDropdown.vue.js";
+const M = { class: "section-header" }, Q = /* @__PURE__ */ E({
+  __name: "ColumnConfigurator",
+  props: {
+    columnsConfig: { default: () => [] },
+    selection: { default: () => [] },
+    childSelection: { default: () => ({}) },
+    alwaysVisibleCount: { default: 6 },
+    loading: { type: Boolean, default: !1 },
+    testId: { default: "" }
+  },
+  emits: ["update:selection", "update:childSelection"],
+  setup(n, { emit: m }) {
+    const i = n, r = g(null), d = f({
+      get: () => i.childSelection,
+      set: (t) => {
+        m("update:childSelection", t);
+      }
+    }), C = f(
+      () => B(a.value, (t) => t?.length ?? 0)
+    ), a = g({});
+    I(
+      [() => i.selection, () => i.columnsConfig],
+      () => {
+        a.value = i.columnsConfig.reduce((t, o) => (t[o.sectionId] = (i.selection ?? []).map((e) => P(o, e)).filter((e) => e), t), {});
+      },
+      {
+        immediate: !0
+      }
+    );
+    const S = (t, o) => {
+      const e = o;
+      a.value[t] = e, e.forEach((l) => {
+        l.children?.length > 0 && (d.value = {
+          ...d.value,
+          [l.id]: l.children[0].id
+        });
+      });
+    }, $ = f(
+      () => Object.values(a.value).reduce(
+        (t, o) => t.concat(o.map(({ id: e }) => e)),
+        []
+      )
+    );
+    I($, (t) => {
+      JSON.stringify(t) !== JSON.stringify(i.selection) && m("update:selection", t);
+    });
+    const b = (t) => {
+      m(
+        "update:selection",
+        i.selection.filter((o) => o !== t)
+      ), r.value === t && (r.value = null), d.value = A(d.value, [String(t)]);
+    }, y = V(
+      i.testId,
+      c
+    );
+    return (t, o) => (p(), v("div", O({ class: "column-configurator" }, s(y)[s(c).WRAPPER]), [
+      (p(!0), v(w, null, T(n.columnsConfig, (e) => (p(), v("div", {
+        key: e.sectionId,
+        class: "column-section"
+      }, [
+        u(R, {
+          items: a.value[e.sectionId],
+          "onUpdate:items": (l) => a.value[e.sectionId] = l,
+          "open-id": r.value,
+          "onUpdate:open-id": o[0] || (o[0] = (l) => r.value = l),
+          "selected-child-per-item": s(d),
+          "onUpdate:selected-child-per-item": o[1] || (o[1] = (l) => U(d) ? d.value = l : null),
+          "always-visible-count": n.alwaysVisibleCount,
+          "is-loading": n.loading,
+          variant: "compact",
+          "draggable-area": "full",
+          "loading-row-count": 3,
+          "test-id": `${n.testId}-${s(c).LIST}-${e.sectionId}`
+        }, {
+          header: h(() => [
+            x("div", M, [
+              u(N, {
+                "header-text": e.title,
+                "records-count": n.loading ? null : s(C)[e.sectionId],
+                "data-testid": `${n.testId}-${s(c).SECTION_HEADER}-${e.sectionId}`
+              }, null, 8, ["header-text", "records-count", "data-testid"]),
+              u(L, {
+                selected: a.value[e.sectionId],
+                section: e,
+                "test-id": n.testId,
+                "onUpdate:selected": (l) => S(e.sectionId, l)
+              }, null, 8, ["selected", "section", "test-id", "onUpdate:selected"])
+            ])
+          ]),
+          menu: h(({ item: l }) => [
+            u(k, {
+              "test-id": `${n.testId}-${s(c).REMOVE_BUTTON}-${l.id}`,
+              onClick: (j) => b(l.id)
+            }, null, 8, ["test-id", "onClick"])
+          ]),
+          _: 2
+        }, 1032, ["items", "onUpdate:items", "open-id", "selected-child-per-item", "always-visible-count", "is-loading", "test-id"])
+      ]))), 128))
+    ], 16));
+  }
+});
+export {
+  Q as default
+};

package/components/columnConfigurator/SectionDropdown.vue.d.ts

@@ -0,0 +1,39 @@
+import { ColumnConfigSection } from '@/components/columnConfigurator/ColumnConfigurator.types';
+import { SortableListItem } from '@/components/sortableList/SortableList.types';
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    selected: SortableListItem[];
+    section: ColumnConfigSection;
+    testId?: string;
+}>, {
+    testId: string;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:selected": (value: SortableListItem[]) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    selected: SortableListItem[];
+    section: ColumnConfigSection;
+    testId?: string;
+}>, {
+    testId: string;
+}>>> & {
+    "onUpdate:selected"?: (value: SortableListItem[]) => any;
+}, {
+    testId: string;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/components/columnConfigurator/SectionDropdown.vue.js

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

package/components/columnConfigurator/SectionDropdown.vue2.js

@@ -0,0 +1,57 @@
+ import "../../SectionDropdown.vue_vue_type_style_index_0_scoped_cfad60a8_lang.css"; import { defineComponent as c, openBlock as m, createBlock as a, unref as t, withCtx as p, createVNode as u, mergeProps as f } from "vue";
+import { DISPLAY_FIELD_NAME as n } from "./consts.js";
+import g from "../dropdown/v4/DropdownV4.vue.js";
+import "../dropdown/v4/DefaultDropdownTrigger.vue.js";
+import D from "../dropdown/v4/IconButtonDropdownTrigger.vue.js";
+import "../dropdown/v4/ChipDropdownTrigger.vue.js";
+import "../dropdown/v4/AppDropdownTrigger.vue.js";
+import "../dropdown/v4/ButtonDropdownTrigger.vue.js";
+import "../dropdown/v4/ButtonFilterDropdownTrigger.vue.js";
+import "../dropdown/v4/TreeDropdown.vue.js";
+import "../dropdown/v4/OptionV4.vue.js";
+import "../dropdown/v4/ConditionalDropdown.vue.js";
+import { ColumnConfiguratorTestIdModifiers as r } from "../../testids/index.js";
+import { matchString as I } from "../../utils/search.js";
+const v = /* @__PURE__ */ c({
+  __name: "SectionDropdown",
+  props: {
+    selected: null,
+    section: null,
+    testId: { default: "" }
+  },
+  emits: ["update:selected"],
+  setup(e, { emit: l }) {
+    const d = (s, i) => I(s[n], i);
+    return (s, i) => (m(), a(t(g), {
+      selected: e.selected,
+      class: "section-dropdown",
+      "display-value": (o) => o[t(n)],
+      options: e.section.sectionOptions,
+      "grouped-options": e.section.isGrouped,
+      "max-selections": e.section.maxSelections,
+      "option-name-key": t(n),
+      "comparing-key": "id",
+      multi: "",
+      "inline-search": "",
+      "show-select-all": !1,
+      "show-clear-all": !1,
+      "on-search": d,
+      placement: "bottom-end",
+      "test-id": `${e.testId}-${t(r).DROPDOWN}-${e.section.sectionId}`,
+      "onUpdate:selected": i[0] || (i[0] = (o) => l("update:selected", o))
+    }, {
+      "dropdown-trigger": p(({ buttonTriggerProps: o }) => [
+        u(t(D), f({
+          "icon-name": "plus",
+          "icon-type": "regular",
+          size: "extraSmall",
+          "test-id": `${e.testId}-${t(r).ADD_BUTTON}-${e.section.sectionId}`
+        }, o), null, 16, ["test-id"])
+      ]),
+      _: 1
+    }, 8, ["selected", "display-value", "options", "grouped-options", "max-selections", "option-name-key", "test-id"]));
+  }
+});
+export {
+  v as default
+};

package/components/columnConfigurator/SectionHeaderText.vue.d.ts

@@ -0,0 +1,34 @@
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    headerText: string;
+    recordsCount: number;
+}>, {
+    headerText: string;
+    recordsCount: any;
+}>, {}, 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<{
+    headerText: string;
+    recordsCount: number;
+}>, {
+    headerText: string;
+    recordsCount: any;
+}>>>, {
+    headerText: string;
+    recordsCount: number;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};