@genexus/genexus-ide-ui 1.1.35 → 1.1.37

package/dist/genexus-ide-ui/{p-56c0c556.entry.js → p-48e87e4f.entry.js}

@@ -2,11 +2,13 @@ import { r as t, c as e, h as i, H as s, a } from "./p-97107ecc.js";
 
 import { g as n } from "./p-401bfc97.js";
 
-import { L as r } from "./p-311eedf3.js";
+import { L as o } from "./p-311eedf3.js";
 
-/* objects in file metadata*/ const o = "object";
+const r = 30;
 
-const c = "category";
+/* objects in file metadata*/ const c = "object";
+
+const l = "category";
 
 const h = "status";
 
@@ -22,7 +24,7 @@ const convertImportCategoryItemToTreeItem = (t, e) => {
       expanded: true,
       leaf: true,
       startImgSrc: t,
-      metadata: o
+      metadata: c
     });
   }));
   return i;
@@ -37,11 +39,12 @@ const convertImportCategoryDataToTreeView = t => {
     const i = {
       id: t.id,
       caption: `${t.name} (${t.items.length})`,
-      expanded: true,
+      expanded: t.items.length <= r,
+      lazy: t.items.length > r,
       leaf: false,
       startImgSrc: t.icon,
-      metadata: c,
-      items: convertImportCategoryItemToTreeItem(t.icon, t.items)
+      metadata: l,
+      items: t.items.length <= r ? convertImportCategoryItemToTreeItem(t.icon, t.items) : []
     };
     e.push(i);
   }));
@@ -89,77 +92,77 @@ const addImportItemResultDataItem = (t, e, i, s) => {
   const a = [ ...s ];
   // Use the resultItem.id to find the corresponding category in the categoryMap
     const n = i.get(t.id);
-  const r = e.get(n);
-  const o = a.findIndex((t => t.id === n));
-  if (o === -1) {
+  const o = e.get(n);
+  const r = a.findIndex((t => t.id === n));
+  if (r === -1) {
     // category does not exists yet.
     const e = {
       id: n,
-      caption: `${r.name} (1)`,
-      startImgSrc: `${r.icon}`,
+      caption: `${o.name} (1)`,
+      startImgSrc: `${o.icon}`,
       expanded: true,
-      items: [ createImportResultItem(r, t) ]
+      items: [ createImportResultItem(o, t) ]
     };
     a.push(e);
     return a;
   }
   // else category already exists. Just insert the result item in the category.
-    const c = createImportResultItem(r, t);
-  a[o].items = [ ...a[o].items, c ];
+    const c = createImportResultItem(o, t);
+  a[r].items = [ ...a[r].items, c ];
   // update category caption length
-    const h = a[o].items.length;
-  a[o].caption = `${r.name} (${h})`;
+    const l = a[r].items.length;
+  a[r].caption = `${o.name} (${l})`;
   return a;
 };
 
-const l = ':host{display:grid;block-size:100%;grid-template:"header header" max-content "objects-in-file import-status" 1fr "footer footer" max-content;grid-template-columns:1fr 1fr}.section{display:contents}.header{grid-template-columns:1fr max-content;grid-area:header}.objects-in-file__section{grid-area:objects-in-file}.objects-in-file__main{border-inline-end:var(--section-common-border);grid-template-rows:1fr max-content}.objects-in-file__footer{display:grid}.import-status__section{grid-area:import-status}.import-status__main{grid-template-rows:1fr max-content}.import-status__footer{display:flex}.import-clear-status-btn{margin-inline-start:auto}.objects-in-file__section,.import-status__section{display:grid;grid-template-rows:max-content 1fr}.control-header__objects-in-file,.control-header__import-status{padding-block-start:var(--mer-spacing--md)}.objects-in-file__main,.import-status__main{grid-auto-rows:max-content;padding-block:var(--content-block-spacing);overflow:auto}.footer{display:flex;grid-area:footer;border-block-start:var(--section-common-border)}.text-align-center{text-align:center}.tree-view::part(item__action tree-view-item--status){grid-template:"first-img left-img text right-img"/max-content max-content 1fr max-content}.tree-view::part(item__action tree-view-item--status)::before{grid-area:first-img;content:"";width:var(--mer-spacing--xs);height:var(--mer-spacing--xs);border-radius:50%;background-color:var(--gray-03);margin-inline-end:var(--mer-spacing--xxs)}.tree-view::part(item__action tree-view-item--success):before{background-image:none;background-color:var(--color-success-dark)}.tree-view::part(item__action tree-view-item--warning):before{background-image:none;background-color:var(--color-warning-dark)}.tree-view::part(item__action tree-view-item--error):before{background-image:none;background-color:var(--color-error-dark)}';
+const d = ':host{display:grid;block-size:100%;grid-template:"header header" max-content "objects-in-file import-status" 1fr "footer footer" max-content;grid-template-columns:1fr 1fr}.section{display:contents}.header{grid-template-columns:1fr max-content;grid-area:header}.objects-in-file__section{grid-area:objects-in-file}.objects-in-file__main{border-inline-end:var(--section-common-border);grid-template-rows:1fr max-content}.objects-in-file__footer{display:grid}.import-status__section{grid-area:import-status}.import-status__main{grid-template-rows:1fr max-content}.import-status__footer{display:flex}.import-clear-status-btn{margin-inline-start:auto}.objects-in-file__section,.import-status__section{display:grid;grid-template-rows:max-content 1fr}.control-header__objects-in-file,.control-header__import-status{padding-block-start:var(--mer-spacing--md)}.objects-in-file__main,.import-status__main{grid-auto-rows:max-content;padding-block:var(--content-block-spacing);overflow:auto}.footer{display:flex;grid-area:footer;border-block-start:var(--section-common-border)}.text-align-center{text-align:center}.tree-view::part(item__action tree-view-item--status){grid-template:"first-img left-img text right-img"/max-content max-content 1fr max-content}.tree-view::part(item__action tree-view-item--status)::before{grid-area:first-img;content:"";width:var(--mer-spacing--xs);height:var(--mer-spacing--xs);border-radius:50%;background-color:var(--gray-03);margin-inline-end:var(--mer-spacing--xxs)}.tree-view::part(item__action tree-view-item--success):before{background-image:none;background-color:var(--color-success-dark)}.tree-view::part(item__action tree-view-item--warning):before{background-image:none;background-color:var(--color-warning-dark)}.tree-view::part(item__action tree-view-item--error):before{background-image:none;background-color:var(--color-error-dark)}.tree-view-import::part(item){content-visibility:auto;contain-intrinsic-size:auto 22px}';
 
-var d = undefined && undefined.__classPrivateFieldGet || function(t, e, i, s) {
+var f = undefined && undefined.__classPrivateFieldGet || function(t, e, i, s) {
   if (i === "a" && !s) throw new TypeError("Private accessor was defined without a getter");
   if (typeof e === "function" ? t !== e || !s : !e.has(t)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
   return i === "m" ? s : i === "a" ? s.call(t) : s ? s.value : e.get(t);
 };
 
-var f = undefined && undefined.__classPrivateFieldSet || function(t, e, i, s, a) {
+var m = undefined && undefined.__classPrivateFieldSet || function(t, e, i, s, a) {
   if (s === "m") throw new TypeError("Private method is not writable");
   if (s === "a" && !a) throw new TypeError("Private accessor was defined without a setter");
   if (typeof e === "function" ? t !== e || !a : !e.has(t)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
   return s === "a" ? a.call(t, i) : a ? a.value = i : e.set(t, i), i;
 };
 
-var m, p, u, b, g, w, k, y, v, _, x, M, W, j, C, T, S, I, $, E, D, F, L, H, O, R;
+var p, u, b, g, w, k, v, y, _, x, M, W, C, j, T, S, I, $, E, D, L, z, F, H, O, R, A, N;
 
-const z = [ "resets/box-sizing", "components/button", "components/checkbox", "components/edit", "components/icon", "components/tree-view", "utils/form", "utils/layout", "utils/typography", "utils/spacing" ];
+const P = [ "resets/box-sizing", "components/button", "components/checkbox", "components/edit", "components/icon", "components/tree-view", "utils/form", "utils/layout", "utils/typography", "utils/spacing" ];
 
-const A = n({
+const J = n({
   category: "gemini-tools",
   name: "notice",
   colorType: "on-elevation"
 });
 
-const N = n({
+const V = n({
   category: "gemini-tools",
   name: "file",
   colorType: "primary"
 });
 
-const P = n({
+const U = n({
   category: "gemini-tools",
   name: "settings",
   colorType: "primary"
 });
 
-const J = n({
+const X = n({
   category: "menus",
   name: "delete",
   colorType: "primary"
 });
 
-const V = "allChecked";
+const Y = "allChecked";
 
-const U = "allUnchecked";
+const q = "allUnchecked";
 
-const X = class {
+const B = class {
   constructor(i) {
     t(this, i);
     this.componentDidLoadEvent = e(this, "componentDidLoadEvent", 7);
@@ -168,115 +171,147 @@ const X = class {
          * The component hard-coded strings translations.
          */
     // eslint-disable-next-line @stencil-community/own-props-must-be-private
-        m.set(this, void 0);
-    p.set(this, []);
-    u.set(this, void 0);
+        p.set(this, void 0);
+    u.set(this, []);
     b.set(this, void 0);
     g.set(this, void 0);
-    w.set(this, new Set);
+    w.set(this, void 0);
     k.set(this, new Set);
+    v.set(this, new Set);
     y.set(this, new Set);
     // #categoryItemMap maps a category id, with the name and icon.
     // required for the "import status" tree.
-        v.set(this, new Map);
-    _.set(this, new Map);
-    x.set(this, (() => {
+        _.set(this, new Map);
+    x.set(this, new Map);
+    M.set(this, void 0);
+    W.set(this, (() => {
       this.cancelCallback();
     }));
-    M.set(this, (() => {
+    C.set(this, (() => {
       this.importTreeState = [];
       this.statusInfo.error.number = 0;
       this.statusInfo.warning.number = 0;
       this.statusInfo.success.number = 0;
     }));
-    W.set(this, (() => {
+    j.set(this, (() => {
       var t;
       this.noImport = !!(((t = this.importTreeState) === null || t === void 0 ? void 0 : t.length) === 0 || !this.importTreeState);
     }));
-    j.set(this, (() => {
+    T.set(this, (() => {
       this.someStatusVisible = this.statusInfo.error.display || this.statusInfo.warning.display || this.statusInfo.success.display;
     }));
-    C.set(this, (async () => {
-      /* first clear imported objects (this clears errors/warnings/success counts as well)*/
-      d(this, M, "f").call(this);
+    S.set(this, (async () => {
+      var t;
+      /* first clear imported objects (this clears errors/warnings/success counts as well)*/      f(this, C, "f").call(this);
       /* then do the import*/      this.importingIsInProcess = true;
-      this.importCallback(this.checkedObjectsIds).then((() => {
+      /*
+              Process checked objects manually, considering lazy loading.
+              Example:
+              1. The "Attributes" category is lazy-loaded and marked as checked.
+              2. The user runs the import without expanding the node.
+              3. No attribute objects appear as checked, since lazy load was not triggered.
+              4. Still, all attribute objects must be included, because the category itself is checked.
+        
+              This avoids forcing users to expand nodes just to select objects.
+              Large categories are not expanded by default to improve performance, which is crucial
+              for very large imports (1000+ objects).
+            */      const e = [];
+      for (let i of f(this, w, "f").model) {
+        if (((t = i.items) === null || t === void 0 ? void 0 : t.length) > 0) {
+          for (let t of i.items) {
+            if (t.checked) e.push(t.id);
+          }
+        } else if (i.lazy && i.checked) {
+          const t = f(this, M, "f").find((t => t.id == i.id));
+          for (let i of t.items) {
+            e.push(i.id);
+          }
+        }
+      }
+      this.importCallback(e).then((() => {
         this.importingIsInProcess = false;
       }));
     }));
-    T.set(this, (async t => {
-      const e = await this.loadCallback(t);
-      d(this, v, "f").clear();
-      d(this, _, "f").clear();
-      e.forEach((t => {
-        d(this, v, "f").set(t.id, {
+    I.set(this, (async t => {
+      m(this, M, await this.loadCallback(t), "f");
+      f(this, _, "f").clear();
+      f(this, x, "f").clear();
+      f(this, M, "f").forEach((t => {
+        f(this, _, "f").set(t.id, {
           name: t.name,
           icon: t.icon
         });
         t.items.forEach((e => {
-          d(this, _, "f").set(e.id, t.id);
+          f(this, x, "f").set(e.id, t.id);
         }));
       }));
-      const i = convertImportCategoryDataToTreeView(e);
-      this.objectsTreeModel = i;
+      const e = convertImportCategoryDataToTreeView(f(this, M, "f"));
+      this.objectsTreeModel = e;
+    }));
+    $.set(this, (async t => {
+      const e = f(this, M, "f").find((e => e.id === t));
+      return e && e.items.length > 0 ? convertImportCategoryItemToTreeItem(e.icon, e.items) : [];
     }));
-    S.set(this, (t => {
+    E.set(this, (t => {
       const e = t.detail;
       const i = [];
       const s = [];
       e.forEach((t => {
         if (t.item.checked) {
           i.push(t.item.id);
-        }
-        if (t.item.checked && t.item.metadata === o) {
-          s.push(t.item.id);
+          if (t.item.lazy && !t.item.items) s.push(t.item.id);
         }
       }));
-      this.checkedObjectsIds = s;
+      for (let t of s) {
+        const e = f(this, M, "f").find((e => e.id === t));
+        if (e) {
+          for (let t of e.items) {}
+        }
+      }
       // Evaluate "Select All / Unselect All" checkbox state
             if (e.size === i.length) {
-        this.selectAllCheckboxValue = V;
+        this.selectAllCheckboxValue = Y;
         this.selectAllCheckboxIndeterminate = false;
       } else if (i.length === 0) {
-        this.selectAllCheckboxValue = U;
+        this.selectAllCheckboxValue = q;
         this.selectAllCheckboxIndeterminate = false;
       } else {
         this.selectAllCheckboxIndeterminate = true;
       }
     }));
-    I.set(this, (t => {
-      if (t.detail.metadata === o) {
+    D.set(this, (t => {
+      if (t.detail.metadata === c) {
         this.objectContextMenuCallback("imported", {
-          selection: d(this, p, "f"),
+          selection: f(this, u, "f"),
           clientX: t.detail.contextmenuEvent.screenX,
           clientY: t.detail.contextmenuEvent.screenY
         });
       }
     }));
-    $.set(this, (t => {
-      f(this, p, t.detail.map((t => t.item.id)), "f");
+    L.set(this, (t => {
+      m(this, u, t.detail.map((t => t.item.id)), "f");
     }));
-    E.set(this, (() => {
+    z.set(this, (() => {
       if (this.optionsCallback) {
         this.optionsCallback();
         // returns boolean
             }
     }));
-    D.set(this, (() => {
+    F.set(this, (() => {
       this.selectedFile = null;
-      d(this, b, "f").value = null;
+      f(this, g, "f").value = null;
     }));
-    F.set(this, (() => {
-      d(this, b, "f").click();
+    H.set(this, (() => {
+      f(this, g, "f").click();
     }));
-    L.set(this, (t => {
+    O.set(this, (t => {
       var e;
       const i = t.target;
       if (((e = i.files) === null || e === void 0 ? void 0 : e.length) > 0) {
         this.selectedFile = i.files[0];
       }
     }));
-    H.set(this, (t => {
+    R.set(this, (t => {
       const e = t.detail;
       const i = [];
       const s = e.findIndex((t => t.itemId === "errors"));
@@ -291,12 +326,12 @@ const X = class {
       if (n !== -1) {
         i.push("success");
       }
-      let r = `"${h}":""`;
+      let o = `"${h}":""`;
       if (i.length) {
         const t = i.join("|");
-        r = `"${h}":"(${t})"`;
+        o = `"${h}":"(${t})"`;
       }
-      this.importedTreeFilterRegExp = new RegExp(r, "i");
+      this.importedTreeFilterRegExp = new RegExp(o, "i");
       // Update statusInfo for the status-buttons
             this.statusInfo = {
         error: {
@@ -312,36 +347,35 @@ const X = class {
           number: this.statusInfo.success.number
         }
       };
-      d(this, j, "f").call(this);
+      f(this, T, "f").call(this);
     }));
-    O.set(this, (t => {
-      if (d(this, g, "f")) {
-        const e = t.detail === V;
-        d(this, g, "f").updateAllItemsProperties({
+    A.set(this, (t => {
+      if (f(this, w, "f")) {
+        const e = t.detail === Y;
+        f(this, w, "f").updateAllItemsProperties({
           checked: e
         });
       }
     }));
-    R.set(this, (() => {
-      d(this, y, "f").clear();
-      d(this, k, "f").clear();
-      d(this, w, "f").clear();
+    N.set(this, (() => {
+      f(this, y, "f").clear();
+      f(this, v, "f").clear();
+      f(this, k, "f").clear();
       this.importTreeState.forEach((t => {
         const e = t.items;
         e.forEach((t => {
           if (t.metadata === "error") {
-            d(this, y, "f").add(t.id);
+            f(this, y, "f").add(t.id);
           }
           if (t.metadata === "warning") {
-            d(this, k, "f").add(t.id);
+            f(this, v, "f").add(t.id);
           }
           if (t.metadata === "success") {
-            d(this, w, "f").add(t.id);
+            f(this, k, "f").add(t.id);
           }
         }));
       }));
     }));
-    this.checkedObjectsIds = [];
     this.selectAllCheckboxValue = undefined;
     this.selectAllCheckboxIndeterminate = false;
     this.importStatusMessage = undefined;
@@ -380,11 +414,11 @@ const X = class {
     // this.#filterImportedHandler();
   }
   watchImportTreeStateHandler() {
-    d(this, W, "f").call(this);
+    f(this, j, "f").call(this);
     if (this.noImport) {
-      this.importStatusMessage = d(this, m, "f").main.importStatus.noImportedFiles;
+      this.importStatusMessage = f(this, p, "f").main.importStatus.noImportedFiles;
     } else {
-      this.importStatusMessage = d(this, m, "f").main.importStatus.importedButHidden;
+      this.importStatusMessage = f(this, p, "f").main.importStatus.importedButHidden;
     }
   }
   watchObjectsTreeModelHandler(t) {
@@ -392,34 +426,34 @@ const X = class {
   }
   selectedFileChanged(t) {
     if (t) {
-      d(this, T, "f").call(this, t);
+      f(this, I, "f").call(this, t);
     }
   }
   componentDidLoad() {
-    d(this, u, "f").focus();
+    f(this, b, "f").focus();
   }
   componentDidRender() {}
   async componentWillLoad() {
-    f(this, m, await r.getComponentStrings(this.el), "f");
+    m(this, p, await o.getComponentStrings(this.el), "f");
     this.componentDidLoadEvent.emit(true);
     // this.#evaluateObjects();
-        d(this, W, "f").call(this);
-    this.importStatusMessage = d(this, m, "f").main.importStatus.noImportedFiles;
-    d(this, j, "f").call(this);
+        f(this, j, "f").call(this);
+    this.importStatusMessage = f(this, p, "f").main.importStatus.noImportedFiles;
+    f(this, T, "f").call(this);
   }
   /**
      * Add the result of importing an item
      */  async addResultItem(t) {
-    this.importTreeState = addImportItemResultDataItem(t, d(this, v, "f"), d(this, _, "f"), this.importTreeState);
+    this.importTreeState = addImportItemResultDataItem(t, f(this, _, "f"), f(this, x, "f"), this.importTreeState);
     this.statusInfo[t.status].number++;
-    d(this, R, "f").call(this);
+    f(this, N, "f").call(this);
   }
   render() {
     var t, e;
     return i(s, {
       class: "widget"
     }, i("ch-theme", {
-      model: z
+      model: P
     }), i("section", {
       class: "section"
     }, i("header", {
@@ -432,7 +466,7 @@ const X = class {
     }, i("label", {
       class: "label",
       htmlFor: "file-name"
-    }, d(this, m, "f").header.fileNameLabel), i("ch-edit", {
+    }, f(this, p, "f").header.fileNameLabel), i("ch-edit", {
       autoFocus: true,
       id: "file-name",
       class: "input",
@@ -440,74 +474,75 @@ const X = class {
       type: "text",
       readonly: true,
       value: (t = this.selectedFile) === null || t === void 0 ? void 0 : t.name,
-      placeholder: d(this, m, "f").header.fileNamePlaceholder,
-      startImgSrc: N,
-      ref: t => f(this, u, t, "f")
+      placeholder: f(this, p, "f").header.fileNamePlaceholder,
+      startImgSrc: V,
+      ref: t => m(this, b, t, "f")
     }), i("input", {
       hidden: true,
       type: "file",
       accept: ".xpz, .xml",
-      onChange: d(this, L, "f"),
-      ref: t => f(this, b, t, "f")
+      onChange: f(this, O, "f"),
+      ref: t => m(this, g, t, "f")
     })), i("div", {
       class: "buttons-spacer"
     }, i("button", {
-      "aria-label": d(this, m, "f").header.removeFileSelection,
-      title: d(this, m, "f").header.removeFileSelection,
+      "aria-label": f(this, p, "f").header.removeFileSelection,
+      title: f(this, p, "f").header.removeFileSelection,
       id: "reset-all-button",
       class: "button-tertiary button-icon-only",
       part: "reset-all-button",
-      onClick: d(this, D, "f")
+      onClick: f(this, F, "f")
     }, i("ch-image", {
       class: "icon-md",
-      src: J
+      src: X
     })), i("button", {
       // select file
       id: "select-file-load-button",
       class: "button-primary",
       part: "select-file-load-button",
-      onClick: d(this, F, "f"),
+      onClick: f(this, H, "f"),
       disabled: this.importingIsInProcess
-    }, d(this, m, "f").header.selectFileButton))), i("section", {
+    }, f(this, p, "f").header.selectFileButton))), i("section", {
       // objects in file
       class: "objects-in-file__section"
     }, i("h2", {
       class: "control-header control-header-with-border control-header__objects-in-file subtitle-regular-xs\t text-align-center spacing-body-inline"
-    }, d(this, m, "f").main.objectsInFile.title), i("div", {
+    }, f(this, p, "f").main.objectsInFile.title), i("div", {
       class: "field-group objects-in-file__main"
     }, !this.noObjects ? i("ch-tree-view-render", {
       // objects in file tree
       showLines: "last",
-      class: "tree-view",
+      class: "tree-view tree-view-import",
       model: this.objectsTreeModel,
       dragDisabled: true,
       dropDisabled: true,
       toggleCheckboxes: true,
       checkbox: true,
       checked: true,
-      onCheckedItemsChange: d(this, S, "f"),
-      onSelectedItemsChange: d(this, $, "f"),
-      onItemContextmenu: d(this, I, "f"),
-      ref: t => f(this, g, t, "f")
+      lazyLoadTreeItemsCallback: f(this, $, "f"),
+      onCheckedItemsChange: f(this, E, "f"),
+      onSelectedItemsChange: f(this, L, "f"),
+      onItemContextmenu: f(this, D, "f"),
+      ref: t => m(this, w, t, "f")
     }) : i("gx-ide-empty-state", {
       isAnimated: false,
-      stateTitle: d(this, m, "f").main.objectsInFile.noObjects,
+      stateTitle: f(this, p, "f").main.objectsInFile.noObjects,
       key: "no-objects-empty-state"
     }, i("button", {
       // begin by selecting a file
       class: "button-secondary",
-      onClick: d(this, F, "f")
-    }, d(this, m, "f").main.objectsInFile.selectFile)), i("footer", {
+      onClick: f(this, H, "f")
+    }, f(this, p, "f").main.objectsInFile.selectFile)), i("footer", {
       class: "field-group objects-in-file__footer spacing-body-inline"
     }, i("ch-checkbox", {
       // select all / unselect all checkbox
       id: "select-all-checkbox",
       class: "checkbox create-data-in-kb",
-      checkedValue: V,
-      unCheckedValue: U,
-      caption: d(this, m, "f").main.objectsInFile.selectUnselect,
+      checkedValue: Y,
+      unCheckedValue: q,
+      caption: f(this, p, "f").main.objectsInFile.selectUnselect,
       value: this.selectAllCheckboxValue,
-      onInput: d(this, O, "f"),
+      onInput: f(this, A, "f"),
       disabled: this.importingIsInProcess || this.objectsTreeModel.length === 0,
       part: "select-all-checkbox"
     }), i("div", {
@@ -516,37 +551,37 @@ const X = class {
       // import objects button
       id: "import-btn",
       class: "button-primary ",
-      onClick: d(this, C, "f"),
+      onClick: f(this, S, "f"),
       disabled: ((e = this.objectsTreeModel) === null || e === void 0 ? void 0 : e.length) === 0 || this.importingIsInProcess
-    }, d(this, m, "f").main.objectsInFile.importButton), i("button", {
+    }, f(this, p, "f").main.objectsInFile.importButton), i("button", {
       // cancel-import button
       id: "cancel-import-btn",
       class: "button-secondary ",
-      onClick: d(this, x, "f"),
+      onClick: f(this, W, "f"),
       disabled: !this.importingIsInProcess,
       part: "cancel-import-button"
-    }, d(this, m, "f").main.objectsInFile.cancelButton), i("button", {
+    }, f(this, p, "f").main.objectsInFile.cancelButton), i("button", {
       // settings/options button
       id: "select-kb-btn",
       class: "button-tertiary button-icon-only",
       part: "select-kb-btn",
-      onClick: d(this, E, "f")
+      onClick: f(this, z, "f")
     }, i("ch-image", {
       class: "icon-md",
-      src: P
+      src: U
     })))))), i("section", {
       // import status
       class: "import-status__section"
     }, i("h2", {
       class: "control-header control-header-with-border control-header__import-status subtitle-regular-xs\t text-align-center spacing-body-inline"
-    }, d(this, m, "f").main.importStatus.title), i("div", {
+    }, f(this, p, "f").main.importStatus.title), i("div", {
       class: "field-group import-status__main"
     }, !this.noImport && this.someStatusVisible ? i("ch-tree-view-render", {
       // import status tree
       model: this.importTreeState,
       toggleCheckboxes: true,
       showLines: "last",
-      class: "tree-view",
+      class: "tree-view tree-view-import",
       filter: this.importedTreeFilterRegExp,
       filterType: "metadata",
       filterOptions: {
@@ -555,7 +590,7 @@ const X = class {
       }
     }) : i("gx-ide-empty-state", {
       isAnimated: false,
-      stateIconSrc: A,
+      stateIconSrc: J,
       stateTitle: this.importStatusMessage,
       key: "no-objects-empty-state"
     }), i("footer", {
@@ -563,10 +598,10 @@ const X = class {
     }, i("button", {
       // clear status button
       class: "button-secondary import-clear-status-btn",
-      onClick: d(this, M, "f"),
+      onClick: f(this, C, "f"),
       disabled: this.noImport || this.importingIsInProcess,
       part: "clear-status-btn"
-    }, d(this, m, "f").main.importStatus.clearButton)))), i("footer", {
+    }, f(this, p, "f").main.importStatus.clearButton)))), i("footer", {
       // footer
       class: "footer"
     }, i("gx-ide-status-buttons", {
@@ -576,7 +611,7 @@ const X = class {
       hideMessage: true,
       compact: true,
       minimal: this.statusMinimal,
-      onSelectionChanged: d(this, H, "f")
+      onSelectionChanged: f(this, R, "f")
     }))));
   }
   static get assetsDirs() {
@@ -594,14 +629,14 @@ const X = class {
   }
 };
 
-m = new WeakMap, p = new WeakMap, u = new WeakMap, b = new WeakMap, g = new WeakMap, 
-w = new WeakMap, k = new WeakMap, y = new WeakMap, v = new WeakMap, _ = new WeakMap, 
-x = new WeakMap, M = new WeakMap, W = new WeakMap, j = new WeakMap, C = new WeakMap, 
-T = new WeakMap, S = new WeakMap, I = new WeakMap, $ = new WeakMap, E = new WeakMap, 
-D = new WeakMap, F = new WeakMap, L = new WeakMap, H = new WeakMap, O = new WeakMap, 
-R = new WeakMap;
+p = new WeakMap, u = new WeakMap, b = new WeakMap, g = new WeakMap, w = new WeakMap, 
+k = new WeakMap, v = new WeakMap, y = new WeakMap, _ = new WeakMap, x = new WeakMap, 
+M = new WeakMap, W = new WeakMap, C = new WeakMap, j = new WeakMap, T = new WeakMap, 
+S = new WeakMap, I = new WeakMap, $ = new WeakMap, E = new WeakMap, D = new WeakMap, 
+L = new WeakMap, z = new WeakMap, F = new WeakMap, H = new WeakMap, O = new WeakMap, 
+R = new WeakMap, A = new WeakMap, N = new WeakMap;
 
-X.style = l;
+B.style = d;
 
-export { X as gx_ide_kb_manager_import };
-//# sourceMappingURL=p-56c0c556.entry.js.map
+export { B as gx_ide_kb_manager_import };
+//# sourceMappingURL=p-48e87e4f.entry.js.map