@justifi/webcomponents 5.7.6-rc-21 → 5.7.7

package/dist/collection/components/insurance/season-interruption/season-interruption-insurance-core.js

@@ -0,0 +1,447 @@
+import { h } from "@stencil/core";
+import { addAttribute, formatCurrency, processHTML, removeAttribute } from "../../../utils/utils";
+import { insuranceValues, insuranceErrors, validateInsuranceValues } from "../insurance-state";
+import { StyledHost, Header2 } from "../../../ui-components";
+import { text, textDanger } from "../../../styles/parts";
+import SeasonInterruptionInsuranceLoading from "./season-interruption-insurance-loading";
+export class SeasonInterruptionInsuranceCore {
+    constructor() {
+        this.isLoading = true;
+    }
+    async validate() {
+        return validateInsuranceValues();
+    }
+    processHTMLContent(html) {
+        return processHTML(html, [
+            (html) => removeAttribute(html, 'style'),
+            (html) => addAttribute(html, 'a', 'part', text),
+            (html) => addAttribute(html, 'p', 'part', text),
+        ]);
+    }
+    componentWillLoad() {
+        if (this.getQuote) {
+            this.fetchData();
+        }
+    }
+    ;
+    fetchData() {
+        this.isLoading = true;
+        this.getQuote({
+            payload: {
+                checkout_id: this.checkoutId,
+                policy_type: "season_interruption",
+                primary_identity: {
+                    state: this.primaryIdentityState,
+                    email: this.primaryIdentityEmailAddress,
+                    first_name: this.primaryIdentityFirstName,
+                    last_name: this.primaryIdentityLastName,
+                    postal_code: this.primaryIdentityPostalCode,
+                    country: this.primaryIdentityCountry
+                },
+                policy_attributes: {
+                    insurable_amount: this.policyAttributesInsurableAmount,
+                    start_date: this.policyAttributesStartDate,
+                    end_date: this.policyAttributesEndDate,
+                    covered_identity: {
+                        first_name: this.coveredIdentityFirstName,
+                        last_name: this.coveredIdentityLastName
+                    }
+                }
+            },
+            onSuccess: ({ quote }) => {
+                this.quote = quote;
+                this.quote.product.description = this.processHTMLContent(this.quote.product.description);
+                this.quote.product.legal_disclaimer = this.processHTMLContent(this.quote.product.legal_disclaimer);
+                insuranceValues[quote.policy_type] = quote.accepted;
+                this.isLoading = false;
+            },
+            onError: ({ error, code, severity }) => {
+                this.isLoading = false;
+                this.errorEvent.emit({
+                    errorCode: code,
+                    message: error,
+                    severity,
+                });
+            }
+        });
+    }
+    ;
+    onChangeHandler(_name, value) {
+        this.accepted = value;
+        insuranceErrors[this.quote.policy_type] = false;
+        this.toggleCoverage({
+            quoteId: this.quote.id,
+            payload: { accepted: this.accepted },
+            onSuccess: () => {
+                this.insuranceUpdated.emit();
+                insuranceValues[this.quote.policy_type] = this.accepted;
+            },
+            onError: ({ error, code, severity }) => {
+                this.errorEvent.emit({
+                    errorCode: code,
+                    message: error,
+                    severity,
+                });
+            }
+        });
+    }
+    get error() {
+        var _a;
+        return insuranceErrors[(_a = this.quote) === null || _a === void 0 ? void 0 : _a.policy_type];
+    }
+    render() {
+        var _a, _b, _c, _d;
+        if (this.isLoading)
+            return (h(StyledHost, null, h(SeasonInterruptionInsuranceLoading, null)));
+        return (h(StyledHost, null, h("div", null, h(Header2, { text: (_a = this.quote) === null || _a === void 0 ? void 0 : _a.product.title, class: "fs-5 fw-bold pb-3" }), h("small", { part: text, innerHTML: (_b = this.quote) === null || _b === void 0 ? void 0 : _b.product.description }), h("form-control-radio", { label: `Accept coverage for ${formatCurrency((_c = this.quote) === null || _c === void 0 ? void 0 : _c.total_cents)}`, name: "opt-in", value: 'true', checked: this.accepted === 'true', inputHandler: this.onChangeHandler.bind(this),
+            // don't wanna show error message, but need to show the red border
+            errorText: this.error ? ' ' : undefined }), h("form-control-radio", { label: "Decline coverage", name: "opt-in", value: 'false', checked: this.accepted === 'false', inputHandler: this.onChangeHandler.bind(this), errorText: this.error ? ' ' : undefined }), h("div", { class: "invalid-feedback", style: { display: this.error ? 'block' : 'none' }, part: textDanger }, "Please select an option"), h("small", { part: text, innerHTML: (_d = this.quote) === null || _d === void 0 ? void 0 : _d.product.legal_disclaimer }))));
+    }
+    static get is() { return "justifi-season-interruption-insurance-core"; }
+    static get properties() {
+        return {
+            "checkoutId": {
+                "type": "string",
+                "attribute": "checkout-id",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "getQuote": {
+                "type": "unknown",
+                "attribute": "get-quote",
+                "mutable": false,
+                "complexType": {
+                    "original": "Function",
+                    "resolved": "Function",
+                    "references": {
+                        "Function": {
+                            "location": "global",
+                            "id": "global::Function"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "toggleCoverage": {
+                "type": "unknown",
+                "attribute": "toggle-coverage",
+                "mutable": false,
+                "complexType": {
+                    "original": "Function",
+                    "resolved": "Function",
+                    "references": {
+                        "Function": {
+                            "location": "global",
+                            "id": "global::Function"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "primaryIdentityFirstName": {
+                "type": "string",
+                "attribute": "primary-identity-first-name",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "primaryIdentityLastName": {
+                "type": "string",
+                "attribute": "primary-identity-last-name",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "primaryIdentityState": {
+                "type": "string",
+                "attribute": "primary-identity-state",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "primaryIdentityPostalCode": {
+                "type": "string",
+                "attribute": "primary-identity-postal-code",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "primaryIdentityCountry": {
+                "type": "string",
+                "attribute": "primary-identity-country",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "primaryIdentityEmailAddress": {
+                "type": "string",
+                "attribute": "primary-identity-email-address",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "policyAttributesInsurableAmount": {
+                "type": "number",
+                "attribute": "policy-attributes-insurable-amount",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "policyAttributesStartDate": {
+                "type": "string",
+                "attribute": "policy-attributes-start-date",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "policyAttributesEndDate": {
+                "type": "string",
+                "attribute": "policy-attributes-end-date",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "coveredIdentityFirstName": {
+                "type": "string",
+                "attribute": "covered-identity-first-name",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "coveredIdentityLastName": {
+                "type": "string",
+                "attribute": "covered-identity-last-name",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            }
+        };
+    }
+    static get states() {
+        return {
+            "quote": {},
+            "isLoading": {},
+            "accepted": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "insuranceUpdated",
+                "name": "insurance-updated",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "errorEvent",
+                "name": "error-event",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "ComponentErrorEvent",
+                    "resolved": "ComponentErrorEvent",
+                    "references": {
+                        "ComponentErrorEvent": {
+                            "location": "import",
+                            "path": "../../../api/ComponentEvents",
+                            "id": "src/api/ComponentEvents.ts::ComponentErrorEvent"
+                        }
+                    }
+                }
+            }];
+    }
+    static get methods() {
+        return {
+            "validate": {
+                "complexType": {
+                    "signature": "() => Promise<{ isValid: boolean; }>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<{ isValid: boolean; }>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            }
+        };
+    }
+}
+;

package/dist/collection/components/insurance/season-interruption/season-interruption-insurance.js

@@ -4,41 +4,21 @@ import { makeGetQuote, makeToggleCoverage } from "../../../actions/insurance/ins
 import { ComponentErrorCodes, ComponentErrorSeverity } from "../../../api/ComponentError";
 import JustifiAnalytics from "../../../api/Analytics";
 import { checkPkgVersion } from "../../../utils/check-pkg-version";
-import { checkoutStore } from "../../../store/checkout.store";
-import { addAttribute, formatCurrency, processHTML, removeAttribute } from "../../../utils/utils";
-import { insuranceValues, insuranceErrors, validateInsuranceValues } from "../insurance-state";
-import { StyledHost, Header2 } from "../../../ui-components";
-import { text, textDanger } from "../../../styles/parts";
-import SeasonInterruptionInsuranceLoading from "./season-interruption-insurance-loading";
 export class SeasonInterruptionInsurance {
-    constructor() {
-        this.isLoading = true;
-    }
     async validate() {
-        return validateInsuranceValues();
-    }
-    processHTMLContent(html) {
-        return processHTML(html, [
-            (html) => removeAttribute(html, 'style'),
-            (html) => addAttribute(html, 'a', 'part', text),
-            (html) => addAttribute(html, 'p', 'part', text),
-        ]);
+        return this.seasonInterruptionCoreRef.validate();
     }
     componentWillLoad() {
         checkPkgVersion();
         this.analytics = new JustifiAnalytics(this);
         this.initializeServiceMethods();
-        if (this.getQuote) {
-            this.fetchData();
-        }
     }
     disconnectedCallback() {
         var _a;
         (_a = this.analytics) === null || _a === void 0 ? void 0 : _a.cleanup();
     }
     initializeServiceMethods() {
-        const authToken = this.authToken || checkoutStore.authToken;
-        if (!authToken) {
+        if (!this.authToken) {
             this.errorEvent.emit({
                 errorCode: ComponentErrorCodes.MISSING_PROPS,
                 message: 'Missing authToken',
@@ -46,82 +26,17 @@ export class SeasonInterruptionInsurance {
             });
             return;
         }
-        const service = new InsuranceService();
-        const config = { authToken, service };
-        this.getQuote = makeGetQuote(config);
-        this.toggleCoverage = makeToggleCoverage(config);
-    }
-    fetchData() {
-        this.isLoading = true;
-        this.getQuote({
-            payload: {
-                checkout_id: this.checkoutId || checkoutStore.checkoutId,
-                policy_type: "season_interruption",
-                primary_identity: {
-                    state: this.primaryIdentityState,
-                    email: this.primaryIdentityEmailAddress,
-                    first_name: this.primaryIdentityFirstName,
-                    last_name: this.primaryIdentityLastName,
-                    postal_code: this.primaryIdentityPostalCode,
-                    country: this.primaryIdentityCountry
-                },
-                policy_attributes: {
-                    insurable_amount: this.policyAttributesInsurableAmount,
-                    start_date: this.policyAttributesStartDate,
-                    end_date: this.policyAttributesEndDate,
-                    covered_identity: {
-                        first_name: this.coveredIdentityFirstName,
-                        last_name: this.coveredIdentityLastName
-                    }
-                }
-            },
-            onSuccess: ({ quote }) => {
-                this.quote = quote;
-                this.quote.product.description = this.processHTMLContent(this.quote.product.description);
-                this.quote.product.legal_disclaimer = this.processHTMLContent(this.quote.product.legal_disclaimer);
-                insuranceValues[quote.policy_type] = quote.accepted;
-                this.isLoading = false;
-            },
-            onError: ({ error, code, severity }) => {
-                this.isLoading = false;
-                this.errorEvent.emit({
-                    errorCode: code,
-                    message: error,
-                    severity,
-                });
-            }
+        this.getQuote = makeGetQuote({
+            authToken: this.authToken,
+            service: new InsuranceService(),
         });
-    }
-    onChangeHandler(_name, value) {
-        this.accepted = value;
-        insuranceErrors[this.quote.policy_type] = false;
-        this.toggleCoverage({
-            quoteId: this.quote.id,
-            payload: { accepted: this.accepted },
-            onSuccess: () => {
-                this.insuranceUpdated.emit();
-                insuranceValues[this.quote.policy_type] = this.accepted;
-            },
-            onError: ({ error, code, severity }) => {
-                this.errorEvent.emit({
-                    errorCode: code,
-                    message: error,
-                    severity,
-                });
-            }
+        this.toggleCoverage = makeToggleCoverage({
+            authToken: this.authToken,
+            service: new InsuranceService(),
         });
     }
-    get error() {
-        var _a;
-        return insuranceErrors[(_a = this.quote) === null || _a === void 0 ? void 0 : _a.policy_type];
-    }
     render() {
-        var _a, _b, _c, _d;
-        if (this.isLoading)
-            return (h(StyledHost, null, h(SeasonInterruptionInsuranceLoading, null)));
-        return (h(StyledHost, null, h("div", null, h(Header2, { text: (_a = this.quote) === null || _a === void 0 ? void 0 : _a.product.title, class: "fs-5 fw-bold pb-3" }), h("small", { part: text, innerHTML: (_b = this.quote) === null || _b === void 0 ? void 0 : _b.product.description }), h("form-control-radio", { label: `Accept coverage for ${formatCurrency((_c = this.quote) === null || _c === void 0 ? void 0 : _c.total_cents)}`, name: "opt-in", value: 'true', checked: this.accepted === 'true', inputHandler: this.onChangeHandler.bind(this),
-            // don't wanna show error message, but need to show the red border
-            errorText: this.error ? ' ' : undefined }), h("form-control-radio", { label: "Decline coverage", name: "opt-in", value: 'false', checked: this.accepted === 'false', inputHandler: this.onChangeHandler.bind(this), errorText: this.error ? ' ' : undefined }), h("div", { class: "invalid-feedback", style: { display: this.error ? 'block' : 'none' }, part: textDanger }, "Please select an option"), h("small", { part: text, innerHTML: (_d = this.quote) === null || _d === void 0 ? void 0 : _d.product.legal_disclaimer }))));
+        return (h("justifi-season-interruption-insurance-core", { key: 'aac3dc07107f64d56f6cddf44b54df4a34d11715', ref: (el) => (this.seasonInterruptionCoreRef = el), "checkout-id": this.checkoutId, getQuote: this.getQuote, toggleCoverage: this.toggleCoverage, "primary-identity-first-name": this.primaryIdentityFirstName, "primary-identity-last-name": this.primaryIdentityLastName, "primary-identity-state": this.primaryIdentityState, "primary-identity-postal-code": this.primaryIdentityPostalCode, "primary-identity-country": this.primaryIdentityCountry, "primary-identity-email-address": this.primaryIdentityEmailAddress, "policy-attributes-insurable-amount": this.policyAttributesInsurableAmount, "policy-attributes-start-date": this.policyAttributesStartDate, "policy-attributes-end-date": this.policyAttributesEndDate, "covered-identity-first-name": this.coveredIdentityFirstName, "covered-identity-last-name": this.coveredIdentityLastName }));
     }
     static get is() { return "justifi-season-interruption-insurance"; }
     static get encapsulation() { return "shadow"; }
@@ -137,7 +52,7 @@ export class SeasonInterruptionInsurance {
                     "references": {}
                 },
                 "required": false,
-                "optional": true,
+                "optional": false,
                 "docs": {
                     "tags": [],
                     "text": ""
@@ -156,7 +71,7 @@ export class SeasonInterruptionInsurance {
                     "references": {}
                 },
                 "required": false,
-                "optional": true,
+                "optional": false,
                 "docs": {
                     "tags": [],
                     "text": ""
@@ -380,28 +295,11 @@ export class SeasonInterruptionInsurance {
         return {
             "getQuote": {},
             "toggleCoverage": {},
-            "quote": {},
-            "isLoading": {},
-            "accepted": {}
+            "quote": {}
         };
     }
     static get events() {
         return [{
-                "method": "insuranceUpdated",
-                "name": "insurance-updated",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "any",
-                    "resolved": "any",
-                    "references": {}
-                }
-            }, {
                 "method": "errorEvent",
                 "name": "error-event",
                 "bubbles": true,

package/dist/collection/components/order-terminals/order-terminals.js

@@ -126,7 +126,7 @@ export class OrderTerminals {
         return (h("div", { class: "mt-3" }, h("div", { class: "text-end" }, "Order limit: ", this.orderLimit), h("div", { class: "d-flex justify-content-end mt-3" }, h("button", { class: "btn btn-primary submit-btn", onClick: this.submitOrder.bind(this), disabled: this.order.totalQuantity === 0 || this.submitting, part: buttonPrimary }, this.submitting ? 'Submitting...' : this.submitButtonText))));
     }
     render() {
-        return (h(StyledHost, { key: '5171ddb7b807bf4084f0f831002803a4ece698f3' }, h("div", { key: '529adf4549be8b2723fca357be3f541403dfc8a3', part: text }, this.renderLoading(), this.renderBusinessDetails(), this.renderTerminals(), this.renderOrderSection())));
+        return (h(StyledHost, { key: '80b0b2a922c06952333adf7c8190b0c2b59f6fd4' }, h("div", { key: '43b5b4d155e53e55b71483d31203dc6dacec1ae4', part: text }, this.renderLoading(), this.renderBusinessDetails(), this.renderTerminals(), this.renderOrderSection())));
     }
     static get is() { return "justifi-order-terminals"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/order-terminals/terminal-quantity-selector/terminal-quantity-selector.js

@@ -18,7 +18,7 @@ export class TerminalQuantitySelector {
         };
     }
     render() {
-        return (h("div", { key: 'de2e01cebd222ad371a15df4aade26d3e118ddee', class: "rounded shadow-sm card p-2", part: card }, h("div", { key: '8e69419c2b7cd0917dd27d42edef08e2d06d79fb', class: "d-flex gap-3" }, h("div", { key: 'c9f83f6f3857e3ec38134194e8ce9d5e9c614992', class: "d-flex align-items-center" }, h("img", { key: '576be452c664824354355b8ed02777dd63d2cddb', src: this.imageUrl, alt: this.modelName, height: 75, width: 75, part: image })), h("div", { key: '0c978b052b05d5b6384a0a13411b339c0522dfd3', class: "d-flex flex-column flex-grow-1 gap-3 p-4 justify-content-center" }, h("div", { key: '40c72c35a8a8418c4d873dbbd6f4ca089142bc14', class: "row" }, h("div", { key: '5fd4f0be8b88e49ad6f332b39d8bf5061ed7ebc3', class: "col-6 d-flex gap-2" }, this.modelName, h("form-control-tooltip", { key: '5d30721f60481bb7994578aefbe2b58055134044', helpText: this.description })), h("div", { key: 'e78454dc8e9fc81f65d01bafc4877d254db08508', class: "col-6 d-flex justify-content-end align-items-center" }, h("button", { key: 'e2f601209f58ce5b87aa546888da3077e1dc3aed', class: "p-0 minus btn", onClick: this.removeUnit, part: buttonLink }, "-"), h("div", { key: '32f9805571ec676ebfcf664029579d50e5e500ca', class: "w-25 text-center" }, this.selectedQuantity), h("button", { key: 'c7ac123ecc6fcaa06a0beaa5f36ed842beba928c', class: "p-0 plus btn", onClick: this.addUnit, part: buttonLink }, "+")))))));
+        return (h("div", { key: '347cc119dae6013a0110551d37349839d5a8c60f', class: "rounded shadow-sm card p-2", part: card }, h("div", { key: '965e0282bfe78cabec08d6af980489c07d1c1087', class: "d-flex gap-3" }, h("div", { key: '868d31537eac74b7f5201739cf7527bc2e4c7130', class: "d-flex align-items-center" }, h("img", { key: 'f3c9ca6d9cc12e42f9ed1f469fde8ec507d03fff', src: this.imageUrl, alt: this.modelName, height: 75, width: 75, part: image })), h("div", { key: '474461af6bbb24f5d0433698b8761e2bfa76d0f3', class: "d-flex flex-column flex-grow-1 gap-3 p-4 justify-content-center" }, h("div", { key: '157c8422a4087b274bb8b3c0861ea3daa7d8d700', class: "row" }, h("div", { key: 'cfda71e7a75b716bfaa635dd0218c163f1b2aa22', class: "col-6 d-flex gap-2" }, this.modelName, h("form-control-tooltip", { key: '5e8193abfa9bbd3f27ad396871faa64700413bb5', helpText: this.description })), h("div", { key: '47a47124bf3ce63264efdc96d74dcd7849a32c96', class: "col-6 d-flex justify-content-end align-items-center" }, h("button", { key: '252798ab53ef9b68184be2d95c6b12d7e8b5e976', class: "p-0 minus btn", onClick: this.removeUnit, part: buttonLink }, "-"), h("div", { key: '0ec025653e8d4fad3cc435af716af0771fb2f8ca', class: "w-25 text-center" }, this.selectedQuantity), h("button", { key: '01f895f944b4caf85e46d90756b54fc162f0f1b0', class: "p-0 plus btn", onClick: this.addUnit, part: buttonLink }, "+")))))));
     }
     static get is() { return "terminal-quantity-selector"; }
     static get properties() {