@genexus/genexus-ide-ui 3.2.20 → 3.2.21

package/dist/genexus-ide-ui/p-9cf62f0a.entry.js

@@ -0,0 +1,292 @@
+import { r as e, g as t, h as i, H as s, a as o } from "./p-9b9ccd0c.js";
+
+import { g as a } from "./p-d42e842b.js";
+
+import "./p-6534555e.js";
+
+import "lit";
+
+import "lit/directives/when.js";
+
+import "lit/directives/if-defined.js";
+
+import { L as n } from "./p-311eedf3.js";
+
+import { c as r } from "./p-c5196b3b.js";
+
+const c = "button.button-secondary{border-color:var(--color-border-neutral-default)}:host{display:grid;block-size:100%;overflow:hidden;grid-template-rows:max-content 1fr max-content;background-color:var(--color-accent-surface-elevation-1);color:var(--color-text-neutral-default)}.section{display:contents}.hero{display:flex;align-items:flex-start;gap:var(--spacing-gap-xl);padding-block:var(--spacing-padding-l);padding-inline:var(--spacing-padding-l);border-block-end:var(--size-1) solid var(--color-border-surface-on-elevation-1)}.hero__text{flex:1;min-inline-size:0}.hero__description{margin-block:var(--spacing-gap-xs) 0;margin-inline:0;color:var(--color-text-neutral-neutral)}.hero__badge{flex:none;display:grid;place-items:center;pointer-events:none;inline-size:44px;block-size:44px;border-radius:var(--border-radius-m);background-color:var(--color-accent-item-hover);color:var(--color-icon-primary-default)}.main{overflow:auto;display:flex;flex-direction:column;gap:var(--spacing-gap-xxl);padding-block:var(--spacing-padding-l);padding-inline:var(--spacing-padding-l)}.field-section{display:flex;flex-direction:column;gap:var(--spacing-gap-l)}.field-section+.field-section{padding-block-start:var(--spacing-padding-xl);border-block-start:var(--size-1) solid var(--color-border-surface-on-elevation-1)}.field-section__head{display:flex;align-items:baseline;gap:var(--spacing-gap-m)}.field-section__title{font-family:var(--font-family-body);font-weight:var(--font-style-semi-bold);font-size:var(--font-size-caption-m);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-text-neutral-neutral)}.fields{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:var(--spacing-gap-l)}.field--full{grid-column:1/-1}.field--checkbox{display:flex;flex-direction:column;gap:var(--spacing-gap-xs)}.field--checkbox .field__row{display:flex;align-items:center;gap:var(--spacing-gap-xs)}.field--checkbox .label{margin:0;cursor:pointer}.field--checkbox .field__hint{margin:0;margin-inline-start:calc(var(--spacing-gap-m) + var(--spacing-gap-m));color:var(--color-text-neutral-disabled);text-wrap:pretty}.footer{padding-block:var(--spacing-padding-m);padding-inline:var(--spacing-padding-l)}";
+
+var l = undefined && undefined.__classPrivateFieldGet || function(e, t, i, s) {
+  if (i === "a" && !s) throw new TypeError("Private accessor was defined without a getter");
+  if (typeof t === "function" ? e !== t || !s : !t.has(e)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+  return i === "m" ? s : i === "a" ? s.call(e) : s ? s.value : t.get(e);
+};
+
+var d = undefined && undefined.__classPrivateFieldSet || function(e, t, i, s, o) {
+  if (s === "m") throw new TypeError("Private method is not writable");
+  if (s === "a" && !o) throw new TypeError("Private accessor was defined without a setter");
+  if (typeof t === "function" ? e !== t || !o : !t.has(e)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+  return s === "a" ? o.call(e, i) : o ? o.value = i : t.set(e, i), i;
+};
+
+var p, h, u, f, b, g, v, m, x, w, y, k, _, W;
+
+const M = [ "resets/box-sizing", "components/button", "components/combo-box", "components/edit", "components/icon", "utils/form", "utils/layout", "utils/typography", "utils/spacing", "chameleon/scrollbar" ];
+
+const j = a({
+  category: "system",
+  name: "database",
+  colorType: "primary"
+});
+
+/**
+ * Name of the property that toggles integrated security. Its presence in
+ * `properties` is what drives the rendering of the Authentication section.
+ */ const z = "TRUSTED_CONNECTION";
+
+const C = "USER_ID";
+
+const E = "USER_PASSWORD";
+
+/** Category that groups the authentication-related fields. */ const T = "authentication";
+
+const I = class {
+  constructor(s) {
+    e(this, s);
+    // eslint-disable-next-line @stencil-community/own-props-must-be-private
+        p.set(this, void 0);
+    h.set(this, void 0);
+    u.set(this, t(`./gx-ide-assets/db-properties-configurator/shortcuts.json`));
+    f.set(this, (e => {
+      var t;
+      return (t = e.value) !== null && t !== void 0 ? t : "";
+    }));
+    b.set(this, (() => {
+      var e;
+      return ((e = this.properties) !== null && e !== void 0 ? e : []).some((e => e.missing && l(this, f, "f").call(this, e).trim() === ""));
+    }));
+    g.set(this, (e => {
+      var t;
+      return ((t = e.standardValues) !== null && t !== void 0 ? t : []).map((e => ({
+        value: e,
+        caption: e
+      })));
+    }));
+    v.set(this, (e => {
+      var t;
+      return e.name === z || e.name === C || e.name === E || ((t = e.category) === null || t === void 0 ? void 0 : t.toLowerCase()) === T;
+    }));
+    /** Whether the host sent the TRUSTED_CONNECTION property. Only then is the
+         * Authentication section rendered. */    m.set(this, (() => {
+      var e;
+      return ((e = this.properties) !== null && e !== void 0 ? e : []).some((e => e.name === z));
+    }));
+    x.set(this, (e => t => {
+      var i, s;
+      const o = t.detail;
+      const a = typeof o === "string" ? o : (s = (i = t.target) === null || i === void 0 ? void 0 : i.value) !== null && s !== void 0 ? s : "";
+      this.propertyChangeCallback(e, a);
+    }));
+    w.set(this, (() => {
+      var e;
+      (e = this.cancelCallback) === null || e === void 0 ? void 0 : e.call(this);
+    }));
+    y.set(this, (() => {
+      var e;
+      if (l(this, b, "f").call(this)) {
+        return;
+      }
+      (e = this.confirmCallback) === null || e === void 0 ? void 0 : e.call(this);
+    }));
+    // #region Renders
+        k.set(this, (e => {
+      const t = `field-${e.name}`;
+      const s = l(this, f, "f").call(this, e);
+      switch (e.control) {
+       case "password":
+        return i("ch-edit", {
+          id: t,
+          class: "input",
+          type: "password",
+          showPasswordButton: true,
+          debounce: r.inputDebounce,
+          value: s,
+          onInput: l(this, x, "f").call(this, e.name)
+        });
+
+       case "combo":
+        return i("ch-combo-box-render", {
+          id: t,
+          class: "combo-box",
+          value: s,
+          model: l(this, g, "f").call(this, e),
+          onInput: l(this, x, "f").call(this, e.name),
+          onChange: l(this, x, "f").call(this, e.name)
+        });
+
+       case "checkbox":
+        return i("ch-checkbox", {
+          id: t,
+          class: "checkbox",
+          value: s,
+          checkedValue: "Yes",
+          unCheckedValue: "No",
+          onInput: l(this, x, "f").call(this, e.name)
+        });
+
+       case "combo-editable":
+        return i("ch-combo-box-render", {
+          id: t,
+          class: "combo-box",
+          suggest: true,
+          suggestDebounce: r.inputDebounce,
+          value: s,
+          model: l(this, g, "f").call(this, e),
+          onInput: l(this, x, "f").call(this, e.name),
+          onChange: l(this, x, "f").call(this, e.name),
+          part: `combo-box combo-box--editable combo-box--${e.name}`
+        });
+
+       case "custom":
+       case "readonly":
+        return i("ch-edit", {
+          id: t,
+          class: "input",
+          readonly: true,
+          value: s,
+          part: `input input--${e.control} input--${e.name}`
+        });
+
+        // "text"
+               default:
+        return i("ch-edit", {
+          id: t,
+          class: "input",
+          debounce: r.inputDebounce,
+          value: s,
+          onInput: l(this, x, "f").call(this, e.name),
+          part: `input input--text input--${e.name}`
+        });
+      }
+    }));
+    _.set(this, (e => {
+      const t = `field-${e.name}`;
+      const s = e.control === "readonly" || e.control === "custom";
+      const o = e.control === "checkbox";
+      if (o) {
+        return i("div", {
+          class: "field field--checkbox field--full",
+          key: e.name
+        }, i("div", {
+          class: "field__row"
+        }, l(this, k, "f").call(this, e), i("label", {
+          class: "label",
+          htmlFor: t
+        }, e.label)), e.description && i("p", {
+          class: "field__hint body-regular-s"
+        }, e.description));
+      }
+      return i("div", {
+        class: "field field-block",
+        key: e.name
+      }, i("label", {
+        class: {
+          label: true,
+          "label--disabled": s
+        },
+        htmlFor: t
+      }, e.label), l(this, k, "f").call(this, e));
+    }));
+    W.set(this, ((e, t) => i("section", {
+      class: "field-section"
+    }, i("div", {
+      class: "field-section__head"
+    }, i("span", {
+      class: "field-section__title"
+    }, e)), i("div", {
+      class: "fields"
+    }, t.map(l(this, _, "f"))))));
+    this.properties = [];
+    this.cancelCallback = undefined;
+    this.confirmCallback = undefined;
+    this.propertyChangeCallback = undefined;
+  }
+  async componentWillLoad() {
+    d(this, p, await n.getComponentStrings(this.el), "f");
+  }
+  /**
+     * Suspends or reactivates the shortcuts.
+     */  async suspendShortcuts(e) {
+    l(this, h, "f").suspend = e;
+  }
+  // #endregion Renders
+  render() {
+    var e;
+    const t = l(this, p, "f").header.description;
+    const o = l(this, p, "f").sections;
+    const a = (e = this.properties) !== null && e !== void 0 ? e : [];
+    const n = l(this, m, "f").call(this);
+    // The Authentication section is only rendered when TRUSTED_CONNECTION is
+    // present; otherwise every field stays in the always-present Connection
+    // section so nothing is dropped.
+        const r = n ? a.filter(l(this, v, "f")) : [];
+    const c = n ? a.filter((e => !l(this, v, "f").call(this, e))) : a;
+    return i(s, {
+      class: "widget"
+    }, i("ch-theme", {
+      model: M
+    }), i("ch-shortcuts", {
+      src: l(this, u, "f"),
+      ref: e => d(this, h, e, "f")
+    }), i("section", {
+      class: "section"
+    }, i("div", {
+      class: "hero"
+    }, i("div", {
+      class: "hero__badge",
+      "aria-hidden": "true"
+    }, i("ch-image", {
+      class: "icon-xl",
+      src: j,
+      type: "mask"
+    })), i("div", {
+      class: "hero__text"
+    }, t && i("p", {
+      class: "hero__description body-regular-s"
+    }, t))), i("div", {
+      class: "main scrollable"
+    }, c.length > 0 && l(this, W, "f").call(this, o.connection, c), n && r.length > 0 && l(this, W, "f").call(this, o.authentication, r)), i("footer", {
+      class: "dialog-footer-with-border footer"
+    }, i("div", {
+      class: "buttons-spacer"
+    }, i("button", {
+      class: "button-secondary",
+      id: "button-cancel",
+      type: "button",
+      onClick: l(this, w, "f"),
+      part: "button-cancel"
+    }, l(this, p, "f").footer.btnCancel), i("button", {
+      class: "button-primary",
+      id: "button-confirm",
+      type: "button",
+      disabled: l(this, b, "f").call(this),
+      onClick: l(this, y, "f"),
+      part: "button-confirm"
+    }, l(this, p, "f").footer.btnConfirm)))));
+  }
+  static get assetsDirs() {
+    return [ "gx-ide-assets/db-properties-configurator" ];
+  }
+  get el() {
+    return o(this);
+  }
+};
+
+p = new WeakMap, h = new WeakMap, u = new WeakMap, f = new WeakMap, b = new WeakMap, 
+g = new WeakMap, v = new WeakMap, m = new WeakMap, x = new WeakMap, w = new WeakMap, 
+y = new WeakMap, k = new WeakMap, _ = new WeakMap, W = new WeakMap;
+
+I.style = c;
+
+export { I as gx_ide_db_properties_configurator };
+//# sourceMappingURL=p-9cf62f0a.entry.js.map

package/dist/genexus-ide-ui/p-9cf62f0a.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["dbPropertiesConfiguratorCss","CSS_BUNDLES","DATABASE_ICON","getIconPath","category","name","colorType","TRUSTED_CONNECTION","USER_ID","USER_PASSWORD","AUTH_CATEGORY","GxIdeDbPropertiesConfigurator","_GxIdeDbPropertiesConfigurator_componentLocale","set","this","_GxIdeDbPropertiesConfigurator_chShortcutsEl","_GxIdeDbPropertiesConfigurator_shortcutsSrc","getAssetPath","_GxIdeDbPropertiesConfigurator_getValue","field","_a","value","_GxIdeDbPropertiesConfigurator_hasPendingRequired","properties","some","missing","__classPrivateFieldGet","call","trim","_GxIdeDbPropertiesConfigurator_buildComboModel","standardValues","map","caption","_GxIdeDbPropertiesConfigurator_isAuthField","toLowerCase","_GxIdeDbPropertiesConfigurator_hasTrustedConnection","_GxIdeDbPropertiesConfigurator_valueChangeHandler","event","detail","_b","target","propertyChangeCallback","_GxIdeDbPropertiesConfigurator_cancelButtonClickedHandler","cancelCallback","_GxIdeDbPropertiesConfigurator_confirmButtonClickedHandler","confirmCallback","_GxIdeDbPropertiesConfigurator_renderControl","fieldId","control","h","id","class","type","showPasswordButton","debounce","config","inputDebounce","onInput","model","onChange","checkedValue","unCheckedValue","suggest","suggestDebounce","part","readonly","_GxIdeDbPropertiesConfigurator_renderField","isReadonly","isCheckbox","key","htmlFor","label","description","_GxIdeDbPropertiesConfigurator_renderSection","title","fields","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","suspendShortcuts","suspend","render","header","sections","allFields","hasAuthSection","authFields","filter","connectionFields","Host","src","ref","length","connection","authentication","onClick","footer","btnCancel","disabled","btnConfirm"],"sources":["src/components/db-properties-configurator/db-properties-configurator.scss?tag=gx-ide-db-properties-configurator&encapsulation=shadow","src/components/db-properties-configurator/db-properties-configurator.tsx"],"sourcesContent":["@import \"../../global/temporary-mercury-overrides/_button.scss\";\n\n// The component reproduces the Mercury \"Set required properties\" connection\n// dialog. Real Mercury classes (.dialog-header-with-border, .field-group-\n// justified-end, .label, .input, .combo-box, .button-*, typography) come from\n// the loaded bundles; the rules below only add the scaffolding Mercury does\n// not define (hero banner, badge, close button, field help) using DS tokens.\n\n:host {\n  display: grid;\n  block-size: 100%;\n  overflow: hidden;\n  grid-template-rows: max-content 1fr max-content;\n  background-color: var(--color-accent-surface-elevation-1);\n  color: var(--color-text-neutral-default);\n}\n\n.section {\n  // section is just for semantics; the host owns the grid.\n  display: contents;\n}\n\n// #region Hero\n.hero {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--spacing-gap-xl);\n  padding-block: var(--spacing-padding-l);\n  padding-inline: var(--spacing-padding-l);\n  border-block-end: var(--size-1) solid\n    var(--color-border-surface-on-elevation-1);\n}\n\n.hero__text {\n  flex: 1;\n  min-inline-size: 0;\n}\n\n.hero__description {\n  margin-block: var(--spacing-gap-xs) 0;\n  margin-inline: 0;\n  color: var(--color-text-neutral-neutral);\n}\n\n.hero__badge {\n  flex: none;\n  display: grid;\n  place-items: center;\n  // Decorative badge: neutralize ch-image's hover/active/focus state swap\n  // (driven by the [data-ch-image] attribute it adds to this parent), which\n  // otherwise makes the icon flicker and read as clickable.\n  pointer-events: none;\n  inline-size: 44px;\n  block-size: 44px;\n  border-radius: var(--border-radius-m);\n  background-color: var(--color-accent-item-hover);\n  color: var(--color-icon-primary-default);\n}\n// #endregion Hero\n\n// #region Body\n.main {\n  overflow: auto;\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-gap-xxl);\n  padding-block: var(--spacing-padding-l);\n  padding-inline: var(--spacing-padding-l);\n}\n\n// Field section: a quiet uppercase header + its field grid. Sections after\n// the first get a divider so the body reads as structured groups.\n.field-section {\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-gap-l);\n}\n\n.field-section + .field-section {\n  padding-block-start: var(--spacing-padding-xl);\n  border-block-start: var(--size-1) solid\n    var(--color-border-surface-on-elevation-1);\n}\n\n.field-section__head {\n  display: flex;\n  align-items: baseline;\n  gap: var(--spacing-gap-m);\n}\n\n.field-section__title {\n  font-family: var(--font-family-body);\n  font-weight: var(--font-style-semi-bold);\n  font-size: var(--font-size-caption-m);\n  letter-spacing: 0.06em;\n  text-transform: uppercase;\n  color: var(--color-text-neutral-neutral);\n}\n\n// Two-column field grid. Each field occupies one column; checkbox fields\n// (and any other field marked as full-width) span the entire row, forcing\n// the following fields to wrap onto the next row.\n.fields {\n  display: grid;\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n  gap: var(--spacing-gap-l);\n}\n\n.field--full {\n  grid-column: 1 / -1;\n}\n\n// Inline checkbox field: control + label on the same row, optional help text\n// flows below aligned with the label.\n.field--checkbox {\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-gap-xs);\n}\n\n.field--checkbox .field__row {\n  display: flex;\n  align-items: center;\n  gap: var(--spacing-gap-xs);\n}\n\n.field--checkbox .label {\n  margin: 0;\n  cursor: pointer;\n}\n\n// Help text below a checkbox, indented to align with the label past the box.\n.field--checkbox .field__hint {\n  margin: 0;\n  margin-inline-start: calc(var(--spacing-gap-m) + var(--spacing-gap-m));\n  color: var(--color-text-neutral-disabled);\n  text-wrap: pretty;\n}\n// #endregion Body\n\n// #region Footer\n.footer {\n  padding-block: var(--spacing-padding-m);\n  padding-inline: var(--spacing-padding-l);\n}\n// #endregion Footer\n","import {\n  Component,\n  Host,\n  Prop,\n  Element,\n  Method,\n  getAssetPath,\n  h\n} from \"@stencil/core\";\n\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\nimport { ComboBoxModel } from \"@genexus/chameleon-controls-library\";\n\nimport { Locale } from \"../../common/locale\";\nimport { config } from \"../../common/config\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/button\",\n  \"components/combo-box\",\n  \"components/edit\",\n  \"components/icon\",\n  \"utils/form\",\n  \"utils/layout\",\n  \"utils/typography\",\n  \"utils/spacing\",\n  \"chameleon/scrollbar\"\n];\n\nconst DATABASE_ICON = getIconPath({\n  category: \"system\",\n  name: \"database\",\n  colorType: \"primary\"\n});\n\n/**\n * Name of the property that toggles integrated security. Its presence in\n * `properties` is what drives the rendering of the Authentication section.\n */\nconst TRUSTED_CONNECTION = \"TRUSTED_CONNECTION\";\nconst USER_ID = \"USER_ID\";\nconst USER_PASSWORD = \"USER_PASSWORD\";\n\n/** Category that groups the authentication-related fields. */\nconst AUTH_CATEGORY = \"authentication\";\n\n@Component({\n  tag: \"gx-ide-db-properties-configurator\",\n  styleUrl: \"db-properties-configurator.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/db-properties-configurator\"]\n})\nexport class GxIdeDbPropertiesConfigurator {\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #componentLocale: any;\n\n  #chShortcutsEl: HTMLChShortcutsElement;\n  #shortcutsSrc = getAssetPath(\n    `./gx-ide-assets/db-properties-configurator/shortcuts.json`\n  );\n\n  @Element() el: HTMLGxIdeDbPropertiesConfiguratorElement;\n\n  /**\n   * The list of properties to configure. Acts as the single source of truth:\n   * the dialog reads each value from `DSPropertyField.value` and notifies the\n   * host of every edit through `propertyChangeCallback`.\n   */\n  @Prop() readonly properties: DSPropertyField[] = [];\n\n  /**\n   * Callback invoked when the user cancels the configuration.\n   */\n  @Prop() readonly cancelCallback!: CancelCallback;\n\n  /**\n   * Callback invoked when the user confirms the configuration.\n   */\n  @Prop() readonly confirmCallback!: ConfirmCallback;\n\n  /**\n   * Callback invoked on every input change. Receives the name of the\n   * property that changed and its new value. The host is expected to apply\n   * the change and push an updated `properties` array back to the component.\n   */\n  @Prop() readonly propertyChangeCallback!: PropertyChangeCallback;\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  /**\n   * Suspends or reactivates the shortcuts.\n   */\n  @Method()\n  async suspendShortcuts(suspendShortcuts: boolean) {\n    this.#chShortcutsEl.suspend = suspendShortcuts;\n  }\n\n  #getValue = (field: DSPropertyField): string => field.value ?? \"\";\n\n  #hasPendingRequired = (): boolean =>\n    (this.properties ?? []).some(\n      field => field.missing && this.#getValue(field).trim() === \"\"\n    );\n\n  #buildComboModel = (field: DSPropertyField): ComboBoxModel =>\n    (field.standardValues ?? []).map(value => ({ value, caption: value }));\n\n  #isAuthField = (field: DSPropertyField): boolean =>\n    field.name === TRUSTED_CONNECTION ||\n    field.name === USER_ID ||\n    field.name === USER_PASSWORD ||\n    field.category?.toLowerCase() === AUTH_CATEGORY;\n\n  /** Whether the host sent the TRUSTED_CONNECTION property. Only then is the\n   * Authentication section rendered. */\n  #hasTrustedConnection = (): boolean =>\n    (this.properties ?? []).some(field => field.name === TRUSTED_CONNECTION);\n\n  #valueChangeHandler =\n    (name: string) => (event: CustomEvent<string> | InputEvent) => {\n      const detail = (event as CustomEvent<string>).detail;\n      const value =\n        typeof detail === \"string\"\n          ? detail\n          : ((event.target as HTMLChEditElement)?.value ?? \"\");\n      this.propertyChangeCallback(name, value);\n    };\n\n  #cancelButtonClickedHandler = () => {\n    this.cancelCallback?.();\n  };\n\n  #confirmButtonClickedHandler = () => {\n    if (this.#hasPendingRequired()) {\n      return;\n    }\n    this.confirmCallback?.();\n  };\n\n  // #region Renders\n\n  #renderControl = (field: DSPropertyField) => {\n    const fieldId = `field-${field.name}`;\n    const value = this.#getValue(field);\n\n    switch (field.control) {\n      case \"password\":\n        return (\n          <ch-edit\n            id={fieldId}\n            class=\"input\"\n            type=\"password\"\n            showPasswordButton\n            debounce={config.inputDebounce}\n            value={value}\n            onInput={this.#valueChangeHandler(field.name)}\n          ></ch-edit>\n        );\n\n      case \"combo\":\n        return (\n          <ch-combo-box-render\n            id={fieldId}\n            class=\"combo-box\"\n            value={value}\n            model={this.#buildComboModel(field)}\n            onInput={this.#valueChangeHandler(field.name)}\n            onChange={this.#valueChangeHandler(field.name)}\n          ></ch-combo-box-render>\n        );\n\n      case \"checkbox\":\n        return (\n          <ch-checkbox\n            id={fieldId}\n            class=\"checkbox\"\n            value={value}\n            checkedValue=\"Yes\"\n            unCheckedValue=\"No\"\n            onInput={this.#valueChangeHandler(field.name)}\n          ></ch-checkbox>\n        );\n\n      case \"combo-editable\":\n        return (\n          <ch-combo-box-render\n            id={fieldId}\n            class=\"combo-box\"\n            suggest\n            suggestDebounce={config.inputDebounce}\n            value={value}\n            model={this.#buildComboModel(field)}\n            onInput={this.#valueChangeHandler(field.name)}\n            onChange={this.#valueChangeHandler(field.name)}\n            part={`combo-box combo-box--editable combo-box--${field.name}`}\n          ></ch-combo-box-render>\n        );\n\n      case \"custom\":\n      case \"readonly\":\n        return (\n          <ch-edit\n            id={fieldId}\n            class=\"input\"\n            readonly\n            value={value}\n            part={`input input--${field.control} input--${field.name}`}\n          ></ch-edit>\n        );\n\n      // \"text\"\n      default:\n        return (\n          <ch-edit\n            id={fieldId}\n            class=\"input\"\n            debounce={config.inputDebounce}\n            value={value}\n            onInput={this.#valueChangeHandler(field.name)}\n            part={`input input--text input--${field.name}`}\n          ></ch-edit>\n        );\n    }\n  };\n\n  #renderField = (field: DSPropertyField) => {\n    const fieldId = `field-${field.name}`;\n    const isReadonly =\n      field.control === \"readonly\" || field.control === \"custom\";\n    const isCheckbox = field.control === \"checkbox\";\n\n    if (isCheckbox) {\n      return (\n        <div class=\"field field--checkbox field--full\" key={field.name}>\n          <div class=\"field__row\">\n            {this.#renderControl(field)}\n            <label class=\"label\" htmlFor={fieldId}>\n              {field.label}\n            </label>\n          </div>\n          {field.description && (\n            <p class=\"field__hint body-regular-s\">{field.description}</p>\n          )}\n        </div>\n      );\n    }\n\n    return (\n      <div class=\"field field-block\" key={field.name}>\n        <label\n          class={{ \"label\": true, \"label--disabled\": isReadonly }}\n          htmlFor={fieldId}\n        >\n          {field.label}\n        </label>\n\n        {this.#renderControl(field)}\n      </div>\n    );\n  };\n\n  #renderSection = (title: string, fields: DSPropertyField[]) => (\n    <section class=\"field-section\">\n      <div class=\"field-section__head\">\n        <span class=\"field-section__title\">{title}</span>\n      </div>\n      <div class=\"fields\">{fields.map(this.#renderField)}</div>\n    </section>\n  );\n\n  // #endregion Renders\n\n  render() {\n    const description = this.#componentLocale.header.description;\n    const sections = this.#componentLocale.sections;\n\n    const allFields = this.properties ?? [];\n    const hasAuthSection = this.#hasTrustedConnection();\n\n    // The Authentication section is only rendered when TRUSTED_CONNECTION is\n    // present; otherwise every field stays in the always-present Connection\n    // section so nothing is dropped.\n    const authFields = hasAuthSection\n      ? allFields.filter(this.#isAuthField)\n      : [];\n    const connectionFields = hasAuthSection\n      ? allFields.filter(field => !this.#isAuthField(field))\n      : allFields;\n\n    return (\n      <Host class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <ch-shortcuts\n          src={this.#shortcutsSrc}\n          ref={(el: HTMLChShortcutsElement) =>\n            (this.#chShortcutsEl = el as HTMLChShortcutsElement)\n          }\n        ></ch-shortcuts>\n        <section class=\"section\">\n          <div class=\"hero\">\n            <div class=\"hero__badge\" aria-hidden=\"true\">\n              <ch-image\n                class=\"icon-xl\"\n                src={DATABASE_ICON}\n                type=\"mask\"\n              ></ch-image>\n            </div>\n            <div class=\"hero__text\">\n              {description && (\n                <p class=\"hero__description body-regular-s\">{description}</p>\n              )}\n            </div>\n          </div>\n\n          <div class=\"main scrollable\">\n            {connectionFields.length > 0 &&\n              this.#renderSection(sections.connection, connectionFields)}\n\n            {hasAuthSection &&\n              authFields.length > 0 &&\n              this.#renderSection(sections.authentication, authFields)}\n          </div>\n\n          <footer class=\"dialog-footer-with-border footer\">\n            <div class=\"buttons-spacer\">\n              <button\n                class=\"button-secondary\"\n                id=\"button-cancel\"\n                type=\"button\"\n                onClick={this.#cancelButtonClickedHandler}\n                part=\"button-cancel\"\n              >\n                {this.#componentLocale.footer.btnCancel}\n              </button>\n              <button\n                class=\"button-primary\"\n                id=\"button-confirm\"\n                type=\"button\"\n                disabled={this.#hasPendingRequired()}\n                onClick={this.#confirmButtonClickedHandler}\n                part=\"button-confirm\"\n              >\n                {this.#componentLocale.footer.btnConfirm}\n              </button>\n            </div>\n          </footer>\n        </section>\n      </Host>\n    );\n  }\n}\n\nexport type DSControlKind =\n  | \"checkbox\"\n  | \"text\"\n  | \"password\"\n  | \"combo\"\n  | \"combo-editable\"\n  | \"custom\"\n  | \"readonly\";\n\nexport interface DSPropertyField {\n  /** `PropertyData.name` — key used to set the property value. */\n  name: string;\n  /** `definition.displayName`. */\n  label: string;\n  /** `definition.description` (rendered below the control). */\n  description?: string;\n  /** `definition.category` (optional grouping). */\n  category?: string;\n\n  /** Control resolved by the host. */\n  control: DSControlKind;\n\n  /** `PropertyData.value` (masked when password). */\n  value: string;\n  /** `required && isDefault` (host detection). */\n  missing: boolean;\n\n  // combos:\n  /** `PropertyData.standardValues`. */\n  standardValues?: string[];\n  /** `PropertyData.isStandardValuesExclusive`. */\n  exclusive?: boolean;\n}\n\nexport type CancelCallback = () => void | Promise<void>;\n\nexport type ConfirmCallback = () => void | Promise<void>;\n\nexport type PropertyChangeCallback = (\n  name: string,\n  value: string\n) => void | Promise<void>;\n"],"mappings":"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"}

package/dist/types/components/db-properties-configurator/db-properties-configurator.d.ts

@@ -22,6 +22,10 @@ export declare class GxIdeDbPropertiesConfigurator {
      */
     readonly propertyChangeCallback: PropertyChangeCallback;
     componentWillLoad(): Promise<void>;
+    /**
+     * Suspends or reactivates the shortcuts.
+     */
+    suspendShortcuts(suspendShortcuts: boolean): Promise<void>;
     render(): any;
 }
 export type DSControlKind = "checkbox" | "text" | "password" | "combo" | "combo-editable" | "custom" | "readonly";

package/dist/types/components.d.ts

@@ -890,6 +890,10 @@ export namespace Components {
           * Callback invoked on every input change. Receives the name of the property that changed and its new value. The host is expected to apply the change and push an updated `properties` array back to the component.
          */
         "propertyChangeCallback": PropertyChangeCallback;
+        /**
+          * Suspends or reactivates the shortcuts.
+         */
+        "suspendShortcuts": (suspendShortcuts: boolean) => Promise<void>;
     }
     interface GxIdeDeploymentTool {
         /**

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genexus/genexus-ide-ui",
   "license": "Apache-2.0",
-  "version": "3.2.20",
+  "version": "3.2.21",
   "description": "GeneXus IDE UI components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",

package/dist/genexus-ide-ui/p-e759cfdb.entry.js

@@ -1,281 +0,0 @@
-import { r as e, h as t, H as i, a as o } from "./p-9b9ccd0c.js";
-
-import { g as a } from "./p-d42e842b.js";
-
-import "./p-6534555e.js";
-
-import "lit";
-
-import "lit/directives/when.js";
-
-import "lit/directives/if-defined.js";
-
-import { L as s } from "./p-311eedf3.js";
-
-import { c as n } from "./p-c5196b3b.js";
-
-const r = "button.button-secondary{border-color:var(--color-border-neutral-default)}:host{display:grid;block-size:100%;overflow:hidden;grid-template-rows:max-content 1fr max-content;background-color:var(--color-accent-surface-elevation-1);color:var(--color-text-neutral-default)}.section{display:contents}.hero{display:flex;align-items:flex-start;gap:var(--spacing-gap-xl);padding-block:var(--spacing-padding-l);padding-inline:var(--spacing-padding-l);border-block-end:var(--size-1) solid var(--color-border-surface-on-elevation-1)}.hero__text{flex:1;min-inline-size:0}.hero__title{margin:0;color:var(--color-text-neutral-default)}.hero__description{margin-block:var(--spacing-gap-xs) 0;margin-inline:0;color:var(--color-text-neutral-disabled);text-wrap:pretty}.hero__badge{flex:none;display:grid;place-items:center;inline-size:44px;block-size:44px;border-radius:var(--border-radius-m);background-color:var(--color-accent-item-hover);color:var(--color-icon-primary-default)}.main{overflow:auto;display:flex;flex-direction:column;gap:var(--spacing-gap-xxl);padding-block:var(--spacing-padding-l);padding-inline:var(--spacing-padding-l)}.field-section{display:flex;flex-direction:column;gap:var(--spacing-gap-l)}.field-section+.field-section{padding-block-start:var(--spacing-padding-xl);border-block-start:var(--size-1) solid var(--color-border-surface-on-elevation-1)}.field-section__head{display:flex;align-items:baseline;gap:var(--spacing-gap-m)}.field-section__title{font-family:var(--font-family-body);font-weight:var(--font-style-semi-bold);font-size:var(--font-size-caption-m);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-text-neutral-neutral)}.fields{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:var(--spacing-gap-l)}.field--full{grid-column:1/-1}.field--checkbox{display:flex;flex-direction:column;gap:var(--spacing-gap-xs)}.field--checkbox .field__row{display:flex;align-items:center;gap:var(--spacing-gap-xs)}.field--checkbox .label{margin:0;cursor:pointer}.field--checkbox .field__hint{margin:0;margin-inline-start:calc(var(--spacing-gap-m) + var(--spacing-gap-m));color:var(--color-text-neutral-disabled);text-wrap:pretty}.footer{padding-block:var(--spacing-padding-m);padding-inline:var(--spacing-padding-l)}";
-
-var l = undefined && undefined.__classPrivateFieldGet || function(e, t, i, o) {
-  if (i === "a" && !o) throw new TypeError("Private accessor was defined without a getter");
-  if (typeof t === "function" ? e !== t || !o : !t.has(e)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-  return i === "m" ? o : i === "a" ? o.call(e) : o ? o.value : t.get(e);
-};
-
-var c = undefined && undefined.__classPrivateFieldSet || function(e, t, i, o, a) {
-  if (o === "m") throw new TypeError("Private method is not writable");
-  if (o === "a" && !a) throw new TypeError("Private accessor was defined without a setter");
-  if (typeof t === "function" ? e !== t || !a : !t.has(e)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
-  return o === "a" ? a.call(e, i) : a ? a.value = i : t.set(e, i), i;
-};
-
-var d, p, h, u, f, b, g, v, m, x, w, y;
-
-const k = [ "resets/box-sizing", "components/button", "components/combo-box", "components/edit", "components/icon", "utils/form", "utils/layout", "utils/typography", "utils/spacing", "chameleon/scrollbar" ];
-
-const _ = a({
-  category: "system",
-  name: "database",
-  colorType: "primary"
-});
-
-/**
- * Name of the property that toggles integrated security. Its presence in
- * `properties` is what drives the rendering of the Authentication section.
- */ const W = "TRUSTED_CONNECTION";
-
-const M = "USER_ID";
-
-const j = "USER_PASSWORD";
-
-/** Category that groups the authentication-related fields. */ const z = "authentication";
-
-const C = class {
-  constructor(i) {
-    e(this, i);
-    // eslint-disable-next-line @stencil-community/own-props-must-be-private
-        d.set(this, void 0);
-    p.set(this, (e => {
-      var t;
-      return (t = e.value) !== null && t !== void 0 ? t : "";
-    }));
-    h.set(this, (() => {
-      var e;
-      return ((e = this.properties) !== null && e !== void 0 ? e : []).some((e => e.missing && l(this, p, "f").call(this, e).trim() === ""));
-    }));
-    u.set(this, (e => {
-      var t;
-      return ((t = e.standardValues) !== null && t !== void 0 ? t : []).map((e => ({
-        value: e,
-        caption: e
-      })));
-    }));
-    f.set(this, (e => {
-      var t;
-      return e.name === W || e.name === M || e.name === j || ((t = e.category) === null || t === void 0 ? void 0 : t.toLowerCase()) === z;
-    }));
-    /** Whether the host sent the TRUSTED_CONNECTION property. Only then is the
-         * Authentication section rendered. */    b.set(this, (() => {
-      var e;
-      return ((e = this.properties) !== null && e !== void 0 ? e : []).some((e => e.name === W));
-    }));
-    g.set(this, (e => t => {
-      var i, o;
-      const a = t.detail;
-      const s = typeof a === "string" ? a : (o = (i = t.target) === null || i === void 0 ? void 0 : i.value) !== null && o !== void 0 ? o : "";
-      this.propertyChangeCallback(e, s);
-    }));
-    v.set(this, (() => {
-      var e;
-      (e = this.cancelCallback) === null || e === void 0 ? void 0 : e.call(this);
-    }));
-    m.set(this, (() => {
-      var e;
-      (e = this.confirmCallback) === null || e === void 0 ? void 0 : e.call(this);
-    }));
-    // #region Renders
-        x.set(this, (e => {
-      const i = `field-${e.name}`;
-      const o = l(this, p, "f").call(this, e);
-      switch (e.control) {
-       case "password":
-        return t("ch-edit", {
-          id: i,
-          class: "input",
-          type: "password",
-          showPasswordButton: true,
-          debounce: n.inputDebounce,
-          value: o,
-          onInput: l(this, g, "f").call(this, e.name)
-        });
-
-       case "combo":
-        return t("ch-combo-box-render", {
-          id: i,
-          class: "combo-box",
-          value: o,
-          model: l(this, u, "f").call(this, e),
-          onInput: l(this, g, "f").call(this, e.name),
-          onChange: l(this, g, "f").call(this, e.name)
-        });
-
-       case "checkbox":
-        return t("ch-checkbox", {
-          id: i,
-          class: "checkbox",
-          value: o,
-          checkedValue: "Yes",
-          unCheckedValue: "No",
-          onInput: l(this, g, "f").call(this, e.name)
-        });
-
-       case "combo-editable":
-        return t("ch-combo-box-render", {
-          id: i,
-          class: "combo-box",
-          suggest: true,
-          suggestDebounce: n.inputDebounce,
-          value: o,
-          model: l(this, u, "f").call(this, e),
-          onInput: l(this, g, "f").call(this, e.name),
-          onChange: l(this, g, "f").call(this, e.name),
-          part: `combo-box combo-box--editable combo-box--${e.name}`
-        });
-
-       case "custom":
-       case "readonly":
-        return t("ch-edit", {
-          id: i,
-          class: "input",
-          readonly: true,
-          value: o,
-          part: `input input--${e.control} input--${e.name}`
-        });
-
-        // "text"
-               default:
-        return t("ch-edit", {
-          id: i,
-          class: "input",
-          debounce: n.inputDebounce,
-          value: o,
-          onInput: l(this, g, "f").call(this, e.name),
-          part: `input input--text input--${e.name}`
-        });
-      }
-    }));
-    w.set(this, (e => {
-      const i = `field-${e.name}`;
-      const o = e.control === "readonly" || e.control === "custom";
-      const a = e.control === "checkbox";
-      if (a) {
-        return t("div", {
-          class: "field field--checkbox field--full",
-          key: e.name
-        }, t("div", {
-          class: "field__row"
-        }, l(this, x, "f").call(this, e), t("label", {
-          class: "label",
-          htmlFor: i
-        }, e.label)), e.description && t("p", {
-          class: "field__hint body-regular-s"
-        }, e.description));
-      }
-      return t("div", {
-        class: "field field-block",
-        key: e.name
-      }, t("label", {
-        class: {
-          label: true,
-          "label--disabled": o
-        },
-        htmlFor: i
-      }, e.label), l(this, x, "f").call(this, e));
-    }));
-    y.set(this, ((e, i) => t("section", {
-      class: "field-section"
-    }, t("div", {
-      class: "field-section__head"
-    }, t("span", {
-      class: "field-section__title"
-    }, e)), t("div", {
-      class: "fields"
-    }, i.map(l(this, w, "f"))))));
-    this.properties = [];
-    this.cancelCallback = undefined;
-    this.confirmCallback = undefined;
-    this.propertyChangeCallback = undefined;
-  }
-  async componentWillLoad() {
-    c(this, d, await s.getComponentStrings(this.el), "f");
-  }
-  // #endregion Renders
-  render() {
-    var e;
-    const o = l(this, d, "f").header.title;
-    const a = l(this, d, "f").header.description;
-    const s = l(this, d, "f").sections;
-    const n = (e = this.properties) !== null && e !== void 0 ? e : [];
-    const r = l(this, b, "f").call(this);
-    // The Authentication section is only rendered when TRUSTED_CONNECTION is
-    // present; otherwise every field stays in the always-present Connection
-    // section so nothing is dropped.
-        const c = r ? n.filter(l(this, f, "f")) : [];
-    const p = r ? n.filter((e => !l(this, f, "f").call(this, e))) : n;
-    return t(i, {
-      class: "widget"
-    }, t("ch-theme", {
-      model: k
-    }), t("section", {
-      class: "section"
-    }, t("div", {
-      class: "hero"
-    }, t("div", {
-      class: "hero__text"
-    }, t("h1", {
-      class: "hero__title subtitle-semi-bold-l"
-    }, o), a && t("p", {
-      class: "hero__description body-regular-s"
-    }, a)), t("div", {
-      class: "hero__badge",
-      "aria-hidden": "true"
-    }, t("ch-image", {
-      class: "icon-xl",
-      src: _
-    }))), t("div", {
-      class: "main scrollable"
-    }, p.length > 0 && l(this, y, "f").call(this, s.connection, p), r && c.length > 0 && l(this, y, "f").call(this, s.authentication, c)), t("footer", {
-      class: "dialog-footer-with-border footer"
-    }, t("div", {
-      class: "buttons-spacer"
-    }, t("button", {
-      class: "button-secondary",
-      id: "button-cancel",
-      type: "button",
-      onClick: l(this, v, "f"),
-      part: "button-cancel"
-    }, l(this, d, "f").footer.btnCancel), t("button", {
-      class: "button-primary",
-      id: "button-confirm",
-      type: "button",
-      disabled: l(this, h, "f").call(this),
-      onClick: l(this, m, "f"),
-      part: "button-confirm"
-    }, l(this, d, "f").footer.btnConfirm)))));
-  }
-  static get assetsDirs() {
-    return [ "gx-ide-assets/db-properties-configurator" ];
-  }
-  get el() {
-    return o(this);
-  }
-};
-
-d = new WeakMap, p = new WeakMap, h = new WeakMap, u = new WeakMap, f = new WeakMap, 
-b = new WeakMap, g = new WeakMap, v = new WeakMap, m = new WeakMap, x = new WeakMap, 
-w = new WeakMap, y = new WeakMap;
-
-C.style = r;
-
-export { C as gx_ide_db_properties_configurator };
-//# sourceMappingURL=p-e759cfdb.entry.js.map