@genexus/genexus-ide-ui 0.0.20 → 0.0.22

package/dist/collection/components/list-selector/list-selector-item/list-selector-item.css

@@ -0,0 +1,51 @@
+/*Gemini*/
+/*Gx Ide*/
+*,
+::after,
+::before {
+  box-sizing: border-box;
+}
+
+gx-ide-list-selector-item {
+  display: block;
+  max-width: 100%;
+  display: flex;
+}
+
+gx-ide-list-selector-item:not(:last-child) {
+  border-block-end: 1px solid var(--gx-ide-container-border-color);
+}
+
+/*selectable*/
+gx-ide-list-selector-item[selectable]:not([selectable=false]):hover label {
+  cursor: pointer;
+  background-color: var(--gxg-background-color-item-hover);
+}
+
+/*ellipsis*/
+gx-ide-list-selector-item[ellipsis]:not([ellipsis=false]) label {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+input {
+  width: 0;
+  height: 0;
+  opacity: 0;
+  margin: 0;
+}
+input:focus + label {
+  outline: var(--border-width-md) solid var(--color-primary-active);
+  outline-offset: -2px;
+}
+input:checked + label {
+  background-color: var(--gxg-background-color-item-selected);
+}
+
+label {
+  flex-shrink: 0;
+  display: block;
+  padding: var(--spacing-comp-01);
+  width: 100%;
+}

package/dist/collection/components/list-selector/list-selector-item/list-selector-item.js

@@ -0,0 +1,182 @@
+import { Host, h } from "@stencil/core";
+export class GxIdeListSelectorItem {
+  constructor() {
+    // 6.COMPONENT LIFECYCLE METHODS //
+    // 7.LISTENERS //
+    // 8.PUBLIC METHODS API //
+    // 9.LOCAL METHODS //
+    /**
+     * Evaluates if is selectable, considering the parent list-selector 'selectable' property value, only if it is undefined on this item
+     */
+    this.evaluateSelectable = () => {
+      if (this.selectable === undefined && this.parentIsListSelector) {
+        this.selectable = this.parentList.selectable;
+      }
+    };
+    /**
+     * Evaluates if text should truncate with ellipsis, considering the parent list-selector 'ellipsis' property value, only if it is undefined on this item
+     */
+    this.evaluateEllipsis = () => {
+      if (this.ellipsis === undefined && this.parentIsListSelector) {
+        this.ellipsis = this.parentList.ellipsis;
+      }
+    };
+    /**
+     * Evaluates if this item should be initially checked, only if the parent list-selector listValue equals this item value.
+     */
+    this.evaluateChecked = () => {
+      if (this.checked === undefined &&
+        this.parentIsListSelector &&
+        this.parentList.value !== undefined &&
+        this.parentList.value === this.itemValue) {
+        this.checked = true;
+      }
+    };
+    /**
+     * Checks if this item parentElement is a gx-ide-list-selector, and assigns a reference
+     */
+    this.evaluateParentIsListSelector = () => {
+      const parentList = this.el.parentElement;
+      this.parentIsListSelector = (parentList === null || parentList === void 0 ? void 0 : parentList.nodeName) === "GX-IDE-LIST-SELECTOR";
+      this.parentIsListSelector && (this.parentList = parentList);
+    };
+    /**
+     * Gets the listName required value, that is needed for the list selection to properly work
+     */
+    this.assignName = () => {
+      this.parentIsListSelector &&
+        this.parentList.listName &&
+        (this.name = this.parentList.listName);
+    };
+    this.onChangeHandler = () => {
+      if (this.selectable) {
+        this.itemSelected.emit({
+          itemId: this.itemId,
+          itemValue: this.itemValue
+        });
+      }
+    };
+    this.itemId = undefined;
+    this.itemValue = undefined;
+    this.selectable = undefined;
+    this.ellipsis = undefined;
+  }
+  // 5.EVENTS (EMIT) //
+  componentWillLoad() {
+    this.evaluateParentIsListSelector();
+    this.evaluateSelectable();
+    this.evaluateEllipsis();
+    this.evaluateChecked();
+    this.assignName();
+  }
+  // 10.RENDER() FUNCTION //
+  render() {
+    return (h(Host, { role: "listitem" }, h("input", { type: "radio", id: this.itemId, name: this.name, value: this.itemValue, checked: this.checked, onChange: this.onChangeHandler, disabled: !this.selectable }), h("label", { htmlFor: this.itemId }, this.itemValue)));
+  }
+  static get is() { return "gx-ide-list-selector-item"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["list-selector-item.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["list-selector-item.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "itemId": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": true,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The item id"
+        },
+        "attribute": "item-id",
+        "reflect": false
+      },
+      "itemValue": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": true,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The item value, that act as a label as well"
+        },
+        "attribute": "item-value",
+        "reflect": false
+      },
+      "selectable": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "It allows to select the item by clicking on it. It will emit the item-id"
+        },
+        "attribute": "selectable",
+        "reflect": true
+      },
+      "ellipsis": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The presence of this property will force the item text to not-wrap, and have ellipsis"
+        },
+        "attribute": "ellipsis",
+        "reflect": true
+      }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "itemSelected",
+        "name": "itemSelected",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emits the item data"
+        },
+        "complexType": {
+          "original": "ItemData",
+          "resolved": "{ itemId: string; itemValue: string; }",
+          "references": {
+            "ItemData": {
+              "location": "local"
+            }
+          }
+        }
+      }];
+  }
+  static get elementRef() { return "el"; }
+}

package/dist/collection/components/list-selector/list-selector.css

@@ -0,0 +1,65 @@
+/*Gemini*/
+/*Gx Ide*/
+*,
+::after,
+::before {
+  box-sizing: border-box;
+}
+
+:host {
+  display: flex;
+  flex-direction: column;
+  max-height: 100%;
+}
+
+gxg-title {
+  display: block;
+  margin-block-end: var(--gxg-label-margin-vertical);
+}
+
+.list {
+  background-color: unset;
+  border: none;
+  color: inherit;
+  font: inherit;
+  margin: 0;
+  padding: 0;
+  outline: 0;
+  /*courtesy of chameleon-controls-library*/
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+  color: var(--gx-ide-component-text-color);
+  background-color: var(--gx-ide-component-background-color);
+  font-size: var(--gx-ide-component-text-size);
+  font-weight: var(--font-weight-regular);
+  /* Track */
+  /* Handle */
+  /* Handle on hover */
+  display: block;
+  background-color: var(--color-background);
+  max-height: 100%;
+  overflow-y: auto;
+  border: 1px solid var(--gx-ide-container-border-color);
+}
+.list::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+.list::-webkit-scrollbar-track {
+  background-color: var(--gray-02);
+  border-radius: 10px;
+}
+.list::-webkit-scrollbar-thumb {
+  background: var(--gray-05);
+  border-radius: 10px;
+}
+.list::-webkit-scrollbar-thumb:hover {
+  background: var(--gray-04);
+  cursor: pointer;
+}
+.list .gxg-scroll {
+  display: block;
+  overflow-y: auto;
+  padding-inline-end: 2px;
+}

package/dist/collection/components/list-selector/list-selector.js

@@ -0,0 +1,174 @@
+/* STENCIL IMPORTS */
+import { Host, h } from "@stencil/core";
+export class GxIdeListSelector {
+  constructor() {
+    // 8.PUBLIC METHODS API //
+    // 9.LOCAL METHODS //
+    this.getItemByValue = (newValue) => {
+      const allListItems = Array.from(this.el.querySelectorAll("gx-ide-list-selector-item"));
+      return allListItems.find(item => {
+        return item.itemValue === newValue;
+      });
+    };
+    this.listTitle = undefined;
+    this.ordered = false;
+    this.selectable = true;
+    this.ellipsis = true;
+    this.value = undefined;
+    this.listName = undefined;
+  }
+  valueHandler(newValue) {
+    const foundItem = this.getItemByValue(newValue);
+    if (foundItem) {
+      const input = foundItem.querySelector("input");
+      input.checked = true;
+    }
+  }
+  // 5.EVENTS (EMIT) //
+  // 6.COMPONENT LIFECYCLE METHODS //
+  // 7.LISTENERS //
+  itemSelectedHandler(event) {
+    this.value = event.detail.itemValue;
+  }
+  // 10.RENDER() FUNCTION //
+  render() {
+    return (h(Host, null, this.listTitle ? (h("gxg-title", { type: "title-04" }, this.listTitle)) : null, this.ordered ? (h("ol", { class: "list" }, h("slot", null))) : (h("ul", { class: "list" }, h("slot", null)))));
+  }
+  static get is() { return "gx-ide-list-selector"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["list-selector.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["list-selector.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "listTitle": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The list title (optional)"
+        },
+        "attribute": "list-title",
+        "reflect": false
+      },
+      "ordered": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "false",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "It determines if the list is ordered, or unordered"
+        },
+        "attribute": "ordered",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "selectable": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "true",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "It allows to select a single item, by clicking on it. It will emit the item-id of the clicked item"
+        },
+        "attribute": "selectable",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "ellipsis": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "true",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The presence of this property will force all the items to not-wrap, and have ellipsis"
+        },
+        "attribute": "ellipsis",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "value": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The value of the initial or current checked list-item"
+        },
+        "attribute": "value",
+        "reflect": false
+      },
+      "listName": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": true,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The name of this list. This is a required attribute for the list to work."
+        },
+        "attribute": "list-name",
+        "reflect": false
+      }
+    };
+  }
+  static get elementRef() { return "el"; }
+  static get watchers() {
+    return [{
+        "propName": "value",
+        "methodName": "valueHandler"
+      }];
+  }
+  static get listeners() {
+    return [{
+        "name": "itemSelected",
+        "method": "itemSelectedHandler",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }];
+  }
+}

package/dist/collection/components/new-environment/new-environment.css

@@ -1,3 +1,5 @@
+/*Gemini*/
+/*Gx Ide*/
 /* Helper Classes */
 .gxi-hidden {
   display: none !important;
@@ -83,7 +85,7 @@
 .gx-ide-main .gxg-scroll {
   display: block;
   overflow-y: auto;
-  padding-right: 2px;
+  padding-inline-end: 2px;
 }
 
 .gx-ide-overflow {
@@ -111,9 +113,11 @@
 .gx-ide-overflow .gxg-scroll {
   display: block;
   overflow-y: auto;
-  padding-right: 2px;
+  padding-inline-end: 2px;
 }
 
+/*Gemini*/
+/*Gx Ide*/
 :host {
   display: block;
   border: 1px solid var(--gxg-border-color--regular);

package/dist/collection/components/new-kb/new-kb.css

@@ -1,3 +1,5 @@
+/*Gemini*/
+/*Gx Ide*/
 /* Helper Classes */
 .gxi-hidden {
   display: none !important;
@@ -83,7 +85,7 @@
 .gx-ide-main .gxg-scroll {
   display: block;
   overflow-y: auto;
-  padding-right: 2px;
+  padding-inline-end: 2px;
 }
 
 .gx-ide-overflow {
@@ -111,9 +113,11 @@
 .gx-ide-overflow .gxg-scroll {
   display: block;
   overflow-y: auto;
-  padding-right: 2px;
+  padding-inline-end: 2px;
 }
 
+/*Gemini*/
+/*Gx Ide*/
 :host {
   display: block;
   border: 1px solid var(--gxg-border-color--regular);

package/dist/collection/components/references/references.css

@@ -1,3 +1,5 @@
+/*Gemini*/
+/*Gx Ide*/
 /* Helper Classes */
 .gxi-hidden {
   display: none !important;
@@ -83,7 +85,7 @@
 .gx-ide-main .gxg-scroll {
   display: block;
   overflow-y: auto;
-  padding-right: 2px;
+  padding-inline-end: 2px;
 }
 
 .gx-ide-overflow {
@@ -111,9 +113,11 @@
 .gx-ide-overflow .gxg-scroll {
   display: block;
   overflow-y: auto;
-  padding-right: 2px;
+  padding-inline-end: 2px;
 }
 
+/*Gemini*/
+/*Gx Ide*/
 :host {
   display: block;
 }

package/dist/collection/components/team-dev-commit/gx-ide-assets/team-dev-commit/langs/team-dev-commit.lang.en.json

@@ -0,0 +1,22 @@
+{
+  "componentName": "Team Dev Commit",
+  "topMenu": {
+    "commentLabel": "Comment:",
+    "commentPlaceholder": "Fixed responsive navigation menu bug on mobile devices.",
+    "recentCommentsButton": "Recent Comments"
+  },
+  "filtersMenu": {
+    "patternLabel": "Pattern:",
+    "changesetLabel": "Changeset:",
+    "typeLabel": "Type:",
+    "folderLabel": "Folder:",
+    "categoryLabel": "Category:"
+  },
+  "tabs": {
+    "pendingCommits": "Pending Commits",
+    "ignoredObjects": "Ignored Objects"
+  },
+  "footer": {
+    "commitButton": "Commit"
+  }
+}

package/dist/collection/components/team-dev-commit/gx-ide-assets/team-dev-commit/langs/team-dev-commit.lang.ja.json

@@ -0,0 +1,3 @@
+{
+  "presentation": "「こんにちは、私の名前は {0} です。オレゴンに住んでいます。」"
+}

package/dist/collection/components/team-dev-commit/gx-ide-assets/team-dev-commit/langs/team-dev-commit.lang.zh.json

@@ -0,0 +1,3 @@
+{
+  "presentation": "你好，我的名字是 {0}，我住在俄勒冈州。"
+}