npm - @genexus/genexus-ide-ui - Versions diffs - 1.1.73 → 1.1.74 - Mend

@genexus/genexus-ide-ui 1.1.73 → 1.1.74

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (22) hide show

package/dist/genexus-ide-ui/{p-2d989eb1.entry.js → p-345f7738.entry.js} RENAMED Viewed

@@ -1,12 +1,12 @@
-import { r as t, h as e, H as i, a as s } from "./p-9b9ccd0c.js";
+import { r as t, g as e, h as i, H as s, a as n } from "./p-9b9ccd0c.js";
-import { c as n } from "./p-c5196b3b.js";
+import { c as o } from "./p-c5196b3b.js";
-import { c as o, v as a } from "./p-b32b6b1f.js";
+import { c as a, v as r } from "./p-b32b6b1f.js";
-import { L as r } from "./p-311eedf3.js";
+import { L as c } from "./p-311eedf3.js";
-const c = ":host{display:grid;block-size:100%;grid-template-rows:1fr max-content}.field-group{grid-auto-rows:max-content}.main{overflow:auto}.section{display:contents}.tooltip{position:absolute}";
+const d = ":host{display:grid;block-size:100%;grid-template-rows:1fr max-content}.field-group{grid-auto-rows:max-content}.main{overflow:auto}.section{display:contents}.tooltip{position:absolute}";
 var l = undefined && undefined.__classPrivateFieldGet || function(t, e, i, s) {
   if (i === "a" && !s) throw new TypeError("Private accessor was defined without a getter");
@@ -14,38 +14,39 @@ var l = undefined && undefined.__classPrivateFieldGet || function(t, e, i, s) {
   return i === "m" ? s : i === "a" ? s.call(t) : s ? s.value : e.get(t);
 };
-var d = undefined && undefined.__classPrivateFieldSet || function(t, e, i, s, n) {
+var h = undefined && undefined.__classPrivateFieldSet || function(t, e, i, s, n) {
   if (s === "m") throw new TypeError("Private method is not writable");
   if (s === "a" && !n) throw new TypeError("Private accessor was defined without a setter");
   if (typeof e === "function" ? t !== e || !n : !e.has(t)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
   return s === "a" ? n.call(t, i) : n ? n.value = i : e.set(t, i), i;
 };
-var h, f, p, u, m, w, b;
+var u, f, p, m, w, b, v, g;
-const v = [ "resets/box-sizing", "utils/form", "utils/spacing", "utils/layout", "chameleon/scrollbar", "components/button", "components/edit", "components/tooltip" ];
+const y = [ "resets/box-sizing", "utils/form", "utils/spacing", "utils/layout", "chameleon/scrollbar", "components/button", "components/edit", "components/tooltip" ];
-const g = class {
-  constructor(i) {
-    t(this, i);
+const k = class {
+  constructor(s) {
+    t(this, s);
     /**
          * The component hard-coded strings translations.
          */
     // eslint-disable-next-line @stencil-community/own-props-must-be-private
-        h.set(this, void 0);
+        u.set(this, void 0);
     f.set(this, void 0);
-    p.set(this, (t => {
+    p.set(this, e(`./gx-ide-assets/name-picker/shortcuts.json`));
+    m.set(this, (t => {
       this.inputValue = t.detail;
-      o(this.validatableControls, "input-name");
+      a(this.validatableControls, "input-name");
     }));
-    u.set(this, (async () => {
+    w.set(this, (async () => {
       this.cancelCallback();
     }));
-    m.set(this, (async () => {
-      const t = await this.createCallback(this.inputValue);
-      this.validatableControls = a(t, this.validatableControls);
+    b.set(this, (async () => {
+      const t = await this.confirmCallback(this.inputValue);
+      this.validatableControls = r(t, this.validatableControls);
     }));
-    w.set(this, (() => {
+    v.set(this, (() => {
       // populate validatableControls with the controls that could have errors.
       const t = [ l(this, f, "f") ];
       t.forEach((t => {
@@ -60,73 +61,77 @@ const g = class {
     }));
     // TODO: evaluate if this should be a global helper function.
     // It is used on other dialogs as well.
-        b.set(this, (t => {
-      var i, s, o;
-      return ((s = (i = this.validatableControls) === null || i === void 0 ? void 0 : i.get(t === null || t === void 0 ? void 0 : t.id)) === null || s === void 0 ? void 0 : s.hasError) && ((o = this.validatableControls.get(t.id)) === null || o === void 0 ? void 0 : o.message) && e("ch-tooltip", {
+        g.set(this, (t => {
+      var e, s, n;
+      return ((s = (e = this.validatableControls) === null || e === void 0 ? void 0 : e.get(t === null || t === void 0 ? void 0 : t.id)) === null || s === void 0 ? void 0 : s.hasError) && ((n = this.validatableControls.get(t.id)) === null || n === void 0 ? void 0 : n.message) && i("ch-tooltip", {
         class: "tooltip",
         actionElement: t,
-        blockAlign: n.tooltipSettings.blockAlign,
-        inlineAlign: n.tooltipSettings.inlineAlign,
-        delay: n.tooltipSettings.delay
+        blockAlign: o.tooltipSettings.blockAlign,
+        inlineAlign: o.tooltipSettings.inlineAlign,
+        delay: o.tooltipSettings.delay
       }, this.validatableControls.get(t.id).message);
     }));
     this.inputValue = undefined;
     this.validatableControls = new Map;
     this.cancelCallback = undefined;
-    this.createCallback = undefined;
+    this.confirmCallback = undefined;
     this.defaultInputValue = undefined;
   }
   defaultInputValueChanged(t) {
     this.inputValue = t;
   }
   async componentWillLoad() {
-    d(this, h, await r.getComponentStrings(this.el), "f");
+    h(this, u, await c.getComponentStrings(this.el), "f");
     this.defaultInputValueChanged(this.defaultInputValue);
   }
   componentDidLoad() {
-    l(this, w, "f").call(this);
+    l(this, v, "f").call(this);
   }
   render() {
     const t = !this.inputValue || this.inputValue.length === 0;
-    return e(i, {
+    return i(s, {
       class: "widget"
-    }, e("ch-theme", {
-      model: v
-    }), e("section", {
+    }, i("ch-theme", {
+      model: y
+    }), i("ch-shortcuts", {
+      src: l(this, p, "f")
+    }), i("section", {
       class: "section"
-    }, e("div", {
+    }, i("div", {
       class: "main scrollable field-group spacing-body"
-    }, e("div", {
+    }, i("div", {
       class: "field field-block"
-    }, e("label", {
+    }, i("label", {
       class: "label",
       htmlFor: "input-name"
-    }, l(this, h, "f").labels.name), e("ch-edit", {
+    }, l(this, u, "f").labels.name), i("ch-edit", {
       type: "text",
       id: "input-name",
       class: "input",
-      placeholder: l(this, h, "f").placeHolders.name,
+      placeholder: l(this, u, "f").placeHolders.name,
       value: this.inputValue,
-      onInput: l(this, p, "f"),
-      ref: t => d(this, f, t, "f")
-    }), l(this, b, "f").call(this, l(this, f, "f")))), e("footer", {
+      onInput: l(this, m, "f"),
+      ref: t => h(this, f, t, "f")
+    }), l(this, g, "f").call(this, l(this, f, "f")))), i("footer", {
       class: "control-footer-with-border spacing-body"
-    }, e("div", {
+    }, i("div", {
       class: "buttons-spacer"
-    }, e("button", {
+    }, i("button", {
+      id: "cancel-button",
       class: "button-secondary",
-      onClick: l(this, u, "f")
-    }, l(this, h, "f").buttons.cancel), e("button", {
+      onClick: l(this, w, "f")
+    }, l(this, u, "f").buttons.cancel), i("button", {
+      id: "confirm-button",
       class: "button-primary",
-      onClick: l(this, m, "f"),
+      onClick: l(this, b, "f"),
       disabled: t
-    }, l(this, h, "f").buttons.confirm)))));
+    }, l(this, u, "f").buttons.confirm)))));
   }
   static get assetsDirs() {
     return [ "gx-ide-assets/name-picker" ];
   }
   get el() {
-    return s(this);
+    return n(this);
   }
   static get watchers() {
     return {
@@ -135,10 +140,10 @@ const g = class {
   }
 };
-h = new WeakMap, f = new WeakMap, p = new WeakMap, u = new WeakMap, m = new WeakMap,
-w = new WeakMap, b = new WeakMap;
+u = new WeakMap, f = new WeakMap, p = new WeakMap, m = new WeakMap, w = new WeakMap,
+b = new WeakMap, v = new WeakMap, g = new WeakMap;
-g.style = c;
+k.style = d;
-export { g as gx_ide_name_picker };
-//# sourceMappingURL=p-2d989eb1.entry.js.map
+export { k as gx_ide_name_picker };
+//# sourceMappingURL=p-345f7738.entry.js.map

package/dist/genexus-ide-ui/p-345f7738.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["namePickerCss","CSS_BUNDLES","GxIdeNamePicker","_GxIdeNamePicker_componentLocale","set","this","_GxIdeNamePicker_inputValueEl","_GxIdeNamePicker_shortcutsSrc","getAssetPath","_GxIdeNamePicker_handleInputValueChange","event","inputValue","detail","clearControlError","validatableControls","_GxIdeNamePicker_cancelClickHandler","async","cancelCallback","_GxIdeNamePicker_confirmClickHandler","formSubmitResult","confirmCallback","validateControls","_GxIdeNamePicker_initializeValidatableControls","__classPrivateFieldGet","forEach","validatableControl","id","reference","hasError","message","undefined","_GxIdeNamePicker_evaluateTooltipRender","controlReference","_b","_a","get","_c","h","class","actionElement","blockAlign","config","tooltipSettings","inlineAlign","delay","Map","defaultInputValueChanged","newDefaultInputValue","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","defaultInputValue","componentDidLoad","call","render","confirmButtonDisabled","length","Host","model","src","htmlFor","labels","name","type","placeholder","placeHolders","value","onInput","ref","onClick","buttons","cancel","disabled","confirm"],"sources":["src/components/name-picker/name-picker.scss?tag=gx-ide-name-picker&encapsulation=shadow","src/components/name-picker/name-picker.tsx"],"sourcesContent":[":host {\n display: grid;\n block-size: 100%;\n grid-template-rows: 1fr max-content;\n}\n\n.field-group {\n grid-auto-rows: max-content;\n}\n\n.main {\n overflow: auto;\n}\n\n.section {\n display: contents;\n}\n\n.tooltip {\n position: absolute;\n}\n","import {\n Component,\n Element,\n getAssetPath,\n h,\n Host,\n Prop,\n State,\n Watch\n} from \"@stencil/core\";\n\nimport { MercuryBundles } from \"@genexus/mercury\";\nimport { config } from \"../../common/config\";\nimport {\n clearControlError,\n ControlValidation,\n validateControls\n} from \"../../common/form-validation\";\nimport { Locale } from \"../../common/locale\";\nimport { FormSubmitResult } from \"../../components\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n \"resets/box-sizing\",\n \"utils/form\",\n \"utils/spacing\",\n \"utils/layout\",\n \"chameleon/scrollbar\",\n \"components/button\",\n \"components/edit\",\n \"components/tooltip\"\n];\n\n@Component({\n tag: \"gx-ide-name-picker\",\n styleUrl: \"name-picker.scss\",\n shadow: true,\n assetsDirs: [\"gx-ide-assets/name-picker\"]\n})\nexport class GxIdeNamePicker {\n /**\n * The component hard-coded strings translations.\n */\n // eslint-disable-next-line @stencil-community/own-props-must-be-private\n #componentLocale: any;\n\n #inputValueEl!: HTMLChEditElement;\n #shortcutsSrc = getAssetPath(`./gx-ide-assets/name-picker/shortcuts.json`);\n\n @Element() el: HTMLGxIdeNamePickerElement;\n\n /**\n * The input name\n */\n @State() inputValue: string;\n\n @State() validatableControls = new Map<string, ControlValidation>();\n\n /**\n * Callback that must be invoked when the 'Cancel' button is pressed.\n */\n @Prop() readonly cancelCallback: () => Promise<void>;\n\n /**\n * Callback that must be invoked when the 'Confirm' button is pressed.\n */\n @Prop() readonly confirmCallback: (\n inputValue: string\n ) => Promise<FormSubmitResult>;\n\n /**\n * This property is used to set the initial values of the input field when the component is loaded.\n */\n @Prop() readonly defaultInputValue: string;\n @Watch(\"defaultInputValue\")\n defaultInputValueChanged(newDefaultInputValue: string) {\n this.inputValue = newDefaultInputValue;\n }\n\n async componentWillLoad() {\n this.#componentLocale = await Locale.getComponentStrings(this.el);\n this.defaultInputValueChanged(this.defaultInputValue);\n }\n\n componentDidLoad() {\n this.#initializeValidatableControls();\n }\n\n #handleInputValueChange = (event: CustomEvent<string> | InputEvent) => {\n this.inputValue = event.detail as string;\n clearControlError(this.validatableControls, \"input-name\");\n };\n\n #cancelClickHandler = async () => {\n this.cancelCallback();\n };\n\n #confirmClickHandler = async () => {\n const formSubmitResult = await this.confirmCallback(this.inputValue);\n this.validatableControls = validateControls(\n formSubmitResult,\n this.validatableControls\n );\n };\n\n #initializeValidatableControls = () => {\n // populate validatableControls with the controls that could have errors.\n const validatableControls: HTMLElement[] = [this.#inputValueEl];\n validatableControls.forEach(validatableControl => {\n if (validatableControl.id) {\n this.validatableControls.set(validatableControl.id, {\n reference: validatableControl,\n hasError: false,\n message: undefined\n });\n }\n });\n };\n\n // TODO: evaluate if this should be a global helper function.\n // It is used on other dialogs as well.\n #evaluateTooltipRender = (\n controlReference: HTMLElement\n ): HTMLChTooltipElement =>\n this.validatableControls?.get(controlReference?.id)?.hasError &&\n this.validatableControls.get(controlReference.id)?.message && (\n <ch-tooltip\n class=\"tooltip\"\n actionElement={controlReference as unknown as HTMLButtonElement}\n blockAlign={config.tooltipSettings.blockAlign}\n inlineAlign={config.tooltipSettings.inlineAlign}\n delay={config.tooltipSettings.delay}\n >\n {this.validatableControls.get(controlReference.id).message}\n </ch-tooltip>\n );\n\n render() {\n const confirmButtonDisabled =\n !this.inputValue || this.inputValue.length === 0;\n\n return (\n <Host class=\"widget\">\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <ch-shortcuts src={this.#shortcutsSrc}></ch-shortcuts>\n <section class=\"section\">\n <div class=\"main scrollable field-group spacing-body\">\n <div class=\"field field-block\">\n <label class=\"label\" htmlFor=\"input-name\">\n {this.#componentLocale.labels.name}\n </label>\n <ch-edit\n type=\"text\"\n id=\"input-name\"\n class=\"input\"\n placeholder={this.#componentLocale.placeHolders.name}\n value={this.inputValue}\n onInput={this.#handleInputValueChange}\n ref={(el: HTMLChEditElement) =>\n (this.#inputValueEl = el as HTMLChEditElement)\n }\n ></ch-edit>\n {this.#evaluateTooltipRender(this.#inputValueEl)}\n </div>\n </div>\n\n <footer class=\"control-footer-with-border spacing-body\">\n <div class=\"buttons-spacer\">\n <button\n id=\"cancel-button\"\n class=\"button-secondary\"\n onClick={this.#cancelClickHandler}\n >\n {this.#componentLocale.buttons.cancel}\n </button>\n\n <button\n id=\"confirm-button\"\n class=\"button-primary\"\n onClick={this.#confirmClickHandler}\n disabled={confirmButtonDisabled}\n >\n {this.#componentLocale.buttons.confirm}\n </button>\n </div>\n </footer>\n </section>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/types/components/name-picker/name-picker.d.ts CHANGED Viewed

@@ -13,9 +13,9 @@ export declare class GxIdeNamePicker {
      */
     readonly cancelCallback: () => Promise<void>;
     /**
-     * Callback that must be invoked when the 'Create' button is pressed.
+     * Callback that must be invoked when the 'Confirm' button is pressed.
      */
-    readonly createCallback: (inputValue: string) => Promise<FormSubmitResult>;
+    readonly confirmCallback: (inputValue: string) => Promise<FormSubmitResult>;
     /**
      * This property is used to set the initial values of the input field when the component is loaded.
      */

package/dist/types/components.d.ts CHANGED Viewed

@@ -1477,9 +1477,9 @@ export namespace Components {
          */
         "cancelCallback": () => Promise<void>;
         /**
-          * Callback that must be invoked when the 'Create' button is pressed.
+          * Callback that must be invoked when the 'Confirm' button is pressed.
          */
-        "createCallback": (
+        "confirmCallback": (
     inputValue: string
   ) => Promise<FormSubmitResult1>;
         /**
@@ -5403,9 +5403,9 @@ declare namespace LocalJSX {
          */
         "cancelCallback"?: () => Promise<void>;
         /**
-          * Callback that must be invoked when the 'Create' button is pressed.
+          * Callback that must be invoked when the 'Confirm' button is pressed.
          */
-        "createCallback"?: (
+        "confirmCallback"?: (
     inputValue: string
   ) => Promise<FormSubmitResult1>;
         /**

package/package.json CHANGED Viewed

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

package/dist/genexus-ide-ui/p-2d989eb1.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["namePickerCss","CSS_BUNDLES","GxIdeNamePicker","_GxIdeNamePicker_componentLocale","set","this","_GxIdeNamePicker_inputValueEl","_GxIdeNamePicker_handleInputValueChange","event","inputValue","detail","clearControlError","validatableControls","_GxIdeNamePicker_cancelClickHandler","async","cancelCallback","_GxIdeNamePicker_confirmClickHandler","formSubmitResult","createCallback","validateControls","_GxIdeNamePicker_initializeValidatableControls","__classPrivateFieldGet","forEach","validatableControl","id","reference","hasError","message","undefined","_GxIdeNamePicker_evaluateTooltipRender","controlReference","_b","_a","get","_c","h","class","actionElement","blockAlign","config","tooltipSettings","inlineAlign","delay","Map","defaultInputValueChanged","newDefaultInputValue","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","defaultInputValue","componentDidLoad","call","render","confirmButtonDisabled","length","Host","model","htmlFor","labels","name","type","placeholder","placeHolders","value","onInput","ref","onClick","buttons","cancel","disabled","confirm"],"sources":["src/components/name-picker/name-picker.scss?tag=gx-ide-name-picker&encapsulation=shadow","src/components/name-picker/name-picker.tsx"],"sourcesContent":[":host {\n display: grid;\n block-size: 100%;\n grid-template-rows: 1fr max-content;\n}\n\n.field-group {\n grid-auto-rows: max-content;\n}\n\n.main {\n overflow: auto;\n}\n\n.section {\n display: contents;\n}\n\n.tooltip {\n position: absolute;\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from \"@stencil/core\";\n\nimport { MercuryBundles } from \"@genexus/mercury\";\nimport { config } from \"../../common/config\";\nimport {\n clearControlError,\n ControlValidation,\n validateControls\n} from \"../../common/form-validation\";\nimport { Locale } from \"../../common/locale\";\nimport { FormSubmitResult } from \"../../components\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n \"resets/box-sizing\",\n \"utils/form\",\n \"utils/spacing\",\n \"utils/layout\",\n \"chameleon/scrollbar\",\n \"components/button\",\n \"components/edit\",\n \"components/tooltip\"\n];\n\n@Component({\n tag: \"gx-ide-name-picker\",\n styleUrl: \"name-picker.scss\",\n shadow: true,\n assetsDirs: [\"gx-ide-assets/name-picker\"]\n})\nexport class GxIdeNamePicker {\n /**\n * The component hard-coded strings translations.\n */\n // eslint-disable-next-line @stencil-community/own-props-must-be-private\n #componentLocale: any;\n\n #inputValueEl!: HTMLChEditElement;\n\n @Element() el: HTMLGxIdeNamePickerElement;\n\n /**\n * The input name\n */\n @State() inputValue: string;\n\n @State() validatableControls = new Map<string, ControlValidation>();\n\n /**\n * Callback that must be invoked when the 'Cancel' button is pressed.\n */\n @Prop() readonly cancelCallback: () => Promise<void>;\n\n /**\n * Callback that must be invoked when the 'Create' button is pressed.\n */\n @Prop() readonly createCallback: (\n inputValue: string\n ) => Promise<FormSubmitResult>;\n\n /**\n * This property is used to set the initial values of the input field when the component is loaded.\n */\n @Prop() readonly defaultInputValue: string;\n @Watch(\"defaultInputValue\")\n defaultInputValueChanged(newDefaultInputValue: string) {\n this.inputValue = newDefaultInputValue;\n }\n\n async componentWillLoad() {\n this.#componentLocale = await Locale.getComponentStrings(this.el);\n this.defaultInputValueChanged(this.defaultInputValue);\n }\n\n componentDidLoad() {\n this.#initializeValidatableControls();\n }\n\n #handleInputValueChange = (event: CustomEvent<string> | InputEvent) => {\n this.inputValue = event.detail as string;\n clearControlError(this.validatableControls, \"input-name\");\n };\n\n #cancelClickHandler = async () => {\n this.cancelCallback();\n };\n\n #confirmClickHandler = async () => {\n const formSubmitResult = await this.createCallback(this.inputValue);\n this.validatableControls = validateControls(\n formSubmitResult,\n this.validatableControls\n );\n };\n\n #initializeValidatableControls = () => {\n // populate validatableControls with the controls that could have errors.\n const validatableControls: HTMLElement[] = [this.#inputValueEl];\n validatableControls.forEach(validatableControl => {\n if (validatableControl.id) {\n this.validatableControls.set(validatableControl.id, {\n reference: validatableControl,\n hasError: false,\n message: undefined\n });\n }\n });\n };\n\n // TODO: evaluate if this should be a global helper function.\n // It is used on other dialogs as well.\n #evaluateTooltipRender = (\n controlReference: HTMLElement\n ): HTMLChTooltipElement =>\n this.validatableControls?.get(controlReference?.id)?.hasError &&\n this.validatableControls.get(controlReference.id)?.message && (\n <ch-tooltip\n class=\"tooltip\"\n actionElement={controlReference as unknown as HTMLButtonElement}\n blockAlign={config.tooltipSettings.blockAlign}\n inlineAlign={config.tooltipSettings.inlineAlign}\n delay={config.tooltipSettings.delay}\n >\n {this.validatableControls.get(controlReference.id).message}\n </ch-tooltip>\n );\n\n render() {\n const confirmButtonDisabled =\n !this.inputValue || this.inputValue.length === 0;\n\n return (\n <Host class=\"widget\">\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <section class=\"section\">\n <div class=\"main scrollable field-group spacing-body\">\n <div class=\"field field-block\">\n <label class=\"label\" htmlFor=\"input-name\">\n {this.#componentLocale.labels.name}\n </label>\n <ch-edit\n type=\"text\"\n id=\"input-name\"\n class=\"input\"\n placeholder={this.#componentLocale.placeHolders.name}\n value={this.inputValue}\n onInput={this.#handleInputValueChange}\n ref={(el: HTMLChEditElement) =>\n (this.#inputValueEl = el as HTMLChEditElement)\n }\n ></ch-edit>\n {this.#evaluateTooltipRender(this.#inputValueEl)}\n </div>\n </div>\n\n <footer class=\"control-footer-with-border spacing-body\">\n <div class=\"buttons-spacer\">\n <button\n class=\"button-secondary\"\n onClick={this.#cancelClickHandler}\n >\n {this.#componentLocale.buttons.cancel}\n </button>\n\n <button\n class=\"button-primary\"\n onClick={this.#confirmClickHandler}\n disabled={confirmButtonDisabled}\n >\n {this.#componentLocale.buttons.confirm}\n </button>\n </div>\n </footer>\n </section>\n </Host>\n );\n }\n}\n"],"mappings":";;;;;;;;AAAA,MAAMA,IAAgB;;;;;;;;;;;;;;;;;ACYtB,MAAMC,IAA8B,EAClC,qBACA,cACA,iBACA,gBACA,uBACA,qBACA,mBACA;;MASWC,IAAe;;;;;;;QAK1BC,EAAAC,IAAAC,WAAA;IAEAC,EAAAF,IAAAC,WAAA;IAyCAE,EAAAH,IAAAC,OAA2BG;MACzBH,KAAKI,aAAaD,EAAME;MACxBC,EAAkBN,KAAKO,qBAAqB;AAAa;IAG3DC,EAAAT,IAAAC,OAAsBS;MACpBT,KAAKU;AAAgB;IAGvBC,EAAAZ,IAAAC,OAAuBS;MACrB,MAAMG,UAAyBZ,KAAKa,eAAeb,KAAKI;MACxDJ,KAAKO,sBAAsBO,EACzBF,GACAZ,KAAKO;AACN;IAGHQ,EAAAhB,IAAAC,OAAiC;;MAE/B,MAAMO,IAAqC,EAACS,EAAAhB,MAAIC,GAAA;MAChDM,EAAoBU,SAAQC;QAC1B,IAAIA,EAAmBC,IAAI;UACzBnB,KAAKO,oBAAoBR,IAAImB,EAAmBC,IAAI;YAClDC,WAAWF;YACXG,UAAU;YACVC,SAASC;;;;AAGb;;;QAKJC,EAAAzB,IAAAC,OACEyB;;MAEA,SAAAC,KAAAC,IAAA3B,KAAKO,yBAAmB,QAAAoB,WAAA,aAAAA,EAAEC,IAAIH,MAAgB,QAAhBA,WAAgB,aAAhBA,EAAkBN,SAAG,QAAAO,WAAA,aAAAA,EAAEL,eACrDQ,IAAA7B,KAAKO,oBAAoBqB,IAAIH,EAAiBN,SAAG,QAAAU,WAAA,aAAAA,EAAEP,YACjDQ,EAAA;QACEC,OAAM;QACNC,eAAeP;QACfQ,YAAYC,EAAOC,gBAAgBF;QACnCG,aAAaF,EAAOC,gBAAgBC;QACpCC,OAAOH,EAAOC,gBAAgBE;SAE7BrC,KAAKO,oBAAoBqB,IAAIH,EAAiBN,IAAIG;AAEtD;;+BA/E4B,IAAIgB;;;;;EAmBnC,wBAAAC,CAAyBC;IACvBxC,KAAKI,aAAaoC;;EAGpB,uBAAMC;IACJC,EAAA1C,MAAIF,SAA0B6C,EAAOC,oBAAoB5C,KAAK6C,KAAG;IACjE7C,KAAKuC,yBAAyBvC,KAAK8C;;EAGrC,gBAAAC;IACE/B,EAAAhB,MAAIe,GAAA,KAA+BiC,KAAnChD;;EAoDF,MAAAiD;IACE,MAAMC,KACHlD,KAAKI,cAAcJ,KAAKI,WAAW+C,WAAW;IAEjD,OACErB,EAACsB,GAAI;MAACrB,OAAM;OACVD,EAAA;MAAUuB,OAAOzD;QACjBkC,EAAA;MAASC,OAAM;OACbD,EAAA;MAAKC,OAAM;OACTD,EAAA;MAAKC,OAAM;OACTD,EAAA;MAAOC,OAAM;MAAQuB,SAAQ;OAC1BtC,EAAAhB,MAAIF,GAAA,KAAkByD,OAAOC,OAEhC1B,EAAA;MACE2B,MAAK;MACLtC,IAAG;MACHY,OAAM;MACN2B,aAAa1C,EAAAhB,MAAIF,GAAA,KAAkB6D,aAAaH;MAChDI,OAAO5D,KAAKI;MACZyD,SAAS7C,EAAAhB,MAAIE,GAAA;MACb4D,KAAMjB,KACHH,EAAA1C,MAAIC,GAAiB4C,GAAuB;QAGhD7B,EAAAhB,MAAIwB,GAAA,KAAuBwB,KAA3BhD,MAA4BgB,EAAAhB,MAAIC,GAAA,SAIrC6B,EAAA;MAAQC,OAAM;OACZD,EAAA;MAAKC,OAAM;OACTD,EAAA;MACEC,OAAM;MACNgC,SAAS/C,EAAAhB,MAAIQ,GAAA;OAEZQ,EAAAhB,MAAIF,GAAA,KAAkBkE,QAAQC,SAGjCnC,EAAA;MACEC,OAAM;MACNgC,SAAS/C,EAAAhB,MAAIW,GAAA;MACbuD,UAAUhB;OAETlC,EAAAhB,MAAIF,GAAA,KAAkBkE,QAAQG"}