@tet/tet-components 1.3.146-testing → 1.3.147-testing
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.
- package/dist/cjs/index-f559cb2e.js +24 -36
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{tet-notification.cjs.entry.js → tet-accordion_2.cjs.entry.js} +131 -0
- package/dist/cjs/tet-address-offers-filters-products_2.cjs.entry.js +1 -1
- package/dist/cjs/{tet-autocomplete_2.cjs.entry.js → tet-autocomplete.cjs.entry.js} +0 -65
- package/dist/cjs/tet-b2b-check-out-form_5.cjs.entry.js +647 -0
- package/dist/cjs/tet-b2b-configurator.cjs.entry.js +536 -0
- package/dist/cjs/tet-b2b-service-calculator.cjs.entry.js +1 -1
- package/dist/cjs/tet-border-radius.cjs.entry.js +1 -1
- package/dist/cjs/tet-business-lines.cjs.entry.js +1 -1
- package/dist/cjs/tet-colors.cjs.entry.js +4 -4
- package/dist/cjs/tet-compare-card-v2.cjs.entry.js +1 -1
- package/dist/cjs/tet-components.cjs.js +1 -1
- package/dist/cjs/tet-font-weight.cjs.entry.js +1 -1
- package/dist/cjs/tet-fonts.cjs.entry.js +1 -1
- package/dist/cjs/tet-grid.cjs.entry.js +1 -1
- package/dist/cjs/tet-layout.cjs.entry.js +1 -1
- package/dist/cjs/tet-link.cjs.entry.js +1 -1
- package/dist/cjs/tet-spacing.cjs.entry.js +1 -1
- package/dist/cjs/tet-spinner.cjs.entry.js +71 -0
- package/dist/cjs/tet-text-list.cjs.entry.js +1 -1
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/advanced/cards/tet-b2b-compare-card/test/tet-b2b-compare-card.spec.js +0 -1
- package/dist/collection/components/advanced/cards/tet-b2b-compare-card/tet-b2b-compare-card.js +8 -8
- package/dist/collection/components/advanced/cards/tet-business-summary-card/tet-business-summary-card.css +7 -0
- package/dist/collection/components/advanced/cards/tet-business-summary-card/tet-business-summary-card.js +31 -7
- package/dist/collection/components/advanced/cards/tet-compare-card/tet-compare-card.css +1 -0
- package/dist/collection/components/advanced/cards/tet-compare-card-v2/tet-compare-card-v2.css +1 -0
- package/dist/collection/components/advanced/forms/tet-b2b-check-out-form/tet-b2b-check-out-form.css +0 -2
- package/dist/collection/components/advanced/forms/tet-b2b-check-out-form/tet-b2b-check-out-form.js +24 -4
- package/dist/collection/components/simple/lists/tet-text-list/tet-text-list.css +1 -0
- package/dist/collection/components/simple/menu/tet-business-navigation/tet-business-navigation.css +15 -5
- package/dist/collection/components/simple/structural/tet-accordion/tet-accordion.css +4 -2
- package/dist/collection/components/simple/structural/tet-accordion/tet-accordion.js +27 -5
- package/dist/collection/components/views/tet-b2b-configurator/b2b-configurator.store.js +47 -0
- package/dist/collection/components/views/tet-b2b-configurator/partials/tet-b2b-configurator-cart/test/tet-b2b-configurator-cart.spec.js +10 -1
- package/dist/collection/components/views/tet-b2b-configurator/partials/tet-b2b-configurator-cart/tet-b2b-configurator-cart.css +54 -9
- package/dist/collection/components/views/tet-b2b-configurator/partials/tet-b2b-configurator-cart/tet-b2b-configurator-cart.js +106 -8
- package/dist/collection/components/views/tet-b2b-configurator/tet-b2b-configurator.css +472 -0
- package/dist/collection/components/views/tet-b2b-configurator/tet-b2b-configurator.js +612 -0
- package/dist/collection/components/views/tet-b2b-service-calculator/tet-b2b-service-calculator.js +1 -1
- package/dist/collection/components/views/tet-business-lines/tet-business-lines.js +1 -1
- package/dist/collection/docs/styling/border-radius/tet-border-radius.js +1 -1
- package/dist/collection/docs/styling/colors/tet-colors.js +4 -4
- package/dist/collection/docs/styling/font-weight/tet-font-weight.js +1 -1
- package/dist/collection/docs/styling/fonts/tet-fonts.js +1 -1
- package/dist/collection/docs/styling/layout/tet-layout.js +1 -1
- package/dist/collection/docs/styling/link/tet-link.js +1 -1
- package/dist/collection/docs/styling/spacing/tet-spacing.js +1 -1
- package/dist/collection/docs/styling/tet-grid/tet-grid.js +1 -1
- package/dist/collection/services/utils/minimum-duration-time.js +14 -0
- package/dist/components/index.js +2 -0
- package/dist/components/{p-08cb8e8b.js → p-401be6d8.js} +8 -6
- package/dist/components/{p-b3266df2.js → p-42c3311c.js} +1 -1
- package/dist/components/{p-c15aec6f.js → p-4a4c9b2c.js} +1 -1
- package/dist/{esm/tet-business-navigation.entry.js → components/p-5541195e.js} +35 -8
- package/dist/components/{p-e735af9c.js → p-8dd212bd.js} +1 -1
- package/dist/{esm/tet-b2b-compare-card.entry.js → components/p-922171da.js} +68 -20
- package/dist/{esm/tet-b2b-check-out-form.entry.js → components/p-b74f5470.js} +69 -16
- package/dist/components/p-cbf2c238.js +227 -0
- package/dist/components/{p-18778346.js → p-e72ea31d.js} +1 -1
- package/dist/{esm/tet-business-summary-card.entry.js → components/p-f68a8deb.js} +66 -14
- package/dist/components/tet-accordion.js +1 -1
- package/dist/components/tet-address-offers-view.js +2 -2
- package/dist/components/tet-address-offers.js +1 -1
- package/dist/components/tet-b2b-check-out-form.js +1 -207
- package/dist/components/tet-b2b-compare-card.js +1 -206
- package/dist/components/tet-b2b-configurator-cart.js +1 -167
- package/dist/components/tet-b2b-configurator.d.ts +11 -0
- package/dist/components/tet-b2b-configurator.js +661 -0
- package/dist/components/tet-b2b-service-calculator.js +1 -1
- package/dist/components/tet-border-radius.js +1 -1
- package/dist/components/tet-business-compare-card.js +1 -1
- package/dist/components/tet-business-lines.js +1 -1
- package/dist/components/tet-business-navigation.js +1 -103
- package/dist/components/tet-business-summary-card.js +1 -116
- package/dist/components/tet-colors.js +4 -4
- package/dist/components/tet-compare-card-v2.js +1 -1
- package/dist/components/tet-compare-card.js +1 -1
- package/dist/components/tet-compare-cards-tab.js +2 -2
- package/dist/components/tet-compare-cards.js +1 -1
- package/dist/components/tet-font-weight.js +1 -1
- package/dist/components/tet-fonts.js +1 -1
- package/dist/components/tet-grid.js +1 -1
- package/dist/components/tet-layout.js +1 -1
- package/dist/components/tet-link.js +1 -1
- package/dist/components/tet-spacing.js +1 -1
- package/dist/components/tet-text-list.js +1 -1
- package/dist/esm/index-7f1e2a22.js +24 -36
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{tet-notification.entry.js → tet-accordion_2.entry.js} +132 -2
- package/dist/esm/tet-address-offers-filters-products_2.entry.js +1 -1
- package/dist/esm/{tet-autocomplete_2.entry.js → tet-autocomplete.entry.js} +1 -65
- package/dist/esm/tet-b2b-check-out-form_5.entry.js +639 -0
- package/dist/esm/tet-b2b-configurator.entry.js +532 -0
- package/dist/esm/tet-b2b-service-calculator.entry.js +1 -1
- package/dist/esm/tet-border-radius.entry.js +1 -1
- package/dist/esm/tet-business-lines.entry.js +1 -1
- package/dist/esm/tet-colors.entry.js +4 -4
- package/dist/esm/tet-compare-card-v2.entry.js +1 -1
- package/dist/esm/tet-components.js +1 -1
- package/dist/esm/tet-font-weight.entry.js +1 -1
- package/dist/esm/tet-fonts.entry.js +1 -1
- package/dist/esm/tet-grid.entry.js +1 -1
- package/dist/esm/tet-layout.entry.js +1 -1
- package/dist/esm/tet-link.entry.js +1 -1
- package/dist/esm/tet-spacing.entry.js +1 -1
- package/dist/esm/tet-spinner.entry.js +67 -0
- package/dist/esm/tet-text-list.entry.js +1 -1
- package/dist/tet-components/{p-0121cef5.entry.js → p-067c2f1b.entry.js} +1 -1
- package/dist/tet-components/{p-bb6387c6.entry.js → p-0738afc0.entry.js} +1 -1
- package/dist/tet-components/{p-f476f61c.entry.js → p-07aee8d0.entry.js} +1 -1
- package/dist/tet-components/p-0d818b7e.entry.js +1 -0
- package/dist/tet-components/{p-56460d2d.entry.js → p-4c9e742f.entry.js} +1 -1
- package/dist/tet-components/{p-9c274191.entry.js → p-4e0a24ba.entry.js} +1 -1
- package/dist/tet-components/p-4ea127f4.entry.js +1 -0
- package/dist/tet-components/{p-9bfcf2cc.entry.js → p-62eb4fe0.entry.js} +1 -1
- package/dist/tet-components/{p-38c3b247.entry.js → p-662d9457.entry.js} +1 -1
- package/dist/tet-components/{p-1ddb9e3c.entry.js → p-677b8bf7.entry.js} +1 -1
- package/dist/tet-components/{p-7f00f463.entry.js → p-6a4a979c.entry.js} +1 -1
- package/dist/tet-components/p-6d2c4b16.entry.js +1 -0
- package/dist/tet-components/{p-6782340f.entry.js → p-9513c8f6.entry.js} +1 -1
- package/dist/tet-components/p-af917a8f.entry.js +1 -0
- package/dist/tet-components/{p-597e234a.entry.js → p-dcb66405.entry.js} +1 -1
- package/dist/tet-components/{p-4838a00a.entry.js → p-e311eb7d.entry.js} +1 -1
- package/dist/tet-components/p-ed67bd52.entry.js +1 -0
- package/dist/tet-components/{p-bd8a0449.entry.js → p-eed6163a.entry.js} +1 -1
- package/dist/tet-components/tet-components.css +1 -1
- package/dist/tet-components/tet-components.esm.js +1 -1
- package/dist/types/components/advanced/cards/tet-business-summary-card/tet-business-summary-card.d.ts +4 -2
- package/dist/types/components/advanced/forms/tet-b2b-check-out-form/tet-b2b-check-out-form.d.ts +2 -1
- package/dist/types/components/simple/structural/tet-accordion/tet-accordion.d.ts +5 -0
- package/dist/types/components/views/tet-b2b-configurator/b2b-configurator.store.d.ts +22 -0
- package/dist/types/components.d.ts +100 -4
- package/dist/types/services/api/interfaces/property.interface.d.ts +2 -2
- package/dist/types/services/api/services/b2b-configurator/b2b-configurator.d.ts +4 -4
- package/dist/types/services/utils/minimum-duration-time.d.ts +9 -0
- package/package.json +1 -1
- package/dist/cjs/tet-accordion.cjs.entry.js +0 -136
- package/dist/cjs/tet-b2b-check-out-form.cjs.entry.js +0 -164
- package/dist/cjs/tet-b2b-compare-card.cjs.entry.js +0 -164
- package/dist/cjs/tet-b2b-configurator-cart.cjs.entry.js +0 -129
- package/dist/cjs/tet-business-navigation.cjs.entry.js +0 -82
- package/dist/cjs/tet-business-summary-card.cjs.entry.js +0 -77
- package/dist/esm/tet-accordion.entry.js +0 -132
- package/dist/esm/tet-b2b-configurator-cart.entry.js +0 -125
- package/dist/tet-components/p-05fc6443.entry.js +0 -1
- package/dist/tet-components/p-319c29e9.entry.js +0 -1
- package/dist/tet-components/p-47618056.entry.js +0 -1
- package/dist/tet-components/p-4eb386f5.entry.js +0 -1
- package/dist/tet-components/p-62419a1f.entry.js +0 -1
- package/dist/tet-components/p-a9499bbb.entry.js +0 -1
- package/dist/tet-components/p-d0d39e88.entry.js +0 -1
- package/dist/tet-components/p-ff5dba0e.entry.js +0 -1
- package/dist/types/components/views/tet-b2b-configurator/partials/tet-b2b-configurator-cart/tet-b2b-configurator-cart.d.ts +0 -67
|
@@ -0,0 +1,639 @@
|
|
|
1
|
+
import { r as registerInstance, c as createEvent, f as forceUpdate, h, H as Host, g as getElement } from './index-7f1e2a22.js';
|
|
2
|
+
import { p as processTranslations, t as translate } from './translations-eff34607.js';
|
|
3
|
+
import { R as RequiredValidator, P as PhoneNumberValidator } from './phone-99c2f297.js';
|
|
4
|
+
import { a as a11yBtnClick } from './a11y-9b4d9fd4.js';
|
|
5
|
+
import './typecheck-31fd6c02.js';
|
|
6
|
+
import './http-codes-7faa9f6e.js';
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* The email validator class.
|
|
10
|
+
*/
|
|
11
|
+
class EMailAddressValidator {
|
|
12
|
+
/**
|
|
13
|
+
* Constructor.
|
|
14
|
+
*
|
|
15
|
+
* @param errorMessage
|
|
16
|
+
*/
|
|
17
|
+
constructor(errorMessage) {
|
|
18
|
+
this.errorMessage = errorMessage;
|
|
19
|
+
/**
|
|
20
|
+
* The regex for the email validation.
|
|
21
|
+
*/
|
|
22
|
+
this.emailAddressRegex = '^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\\.[A-Za-z]{2,}$';
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Returns validation error message.
|
|
26
|
+
*/
|
|
27
|
+
getErrorMessage() {
|
|
28
|
+
return this.errorMessage;
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* Validation logic.
|
|
32
|
+
*
|
|
33
|
+
* @param value
|
|
34
|
+
*/
|
|
35
|
+
validate(value) {
|
|
36
|
+
const validateValue = value === null || value === void 0 ? void 0 : value.trim();
|
|
37
|
+
// A generic email address must meet pattern with @ and dot.
|
|
38
|
+
return RegExp(this.emailAddressRegex).test(validateValue);
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
const tetB2bCheckOutFormCss = "@font-face{font-family:Avenir Next;src:url(assets/fonts/8e7462a9501f48c43c58f870188b3fb2.eot?#iefix);src:url(assets/fonts/8e7462a9501f48c43c58f870188b3fb2.eot?#iefix) format(\"eot\"),url(assets/fonts/3c3e10968ffc97c2a52c5830f9886d1f.woff2) format(\"woff2\"),url(assets/fonts/660fbf858d30d7685fa4b166080f5980.woff) format(\"woff\"),url(assets/fonts/2b7748589092fd1a10b806abdfb562ff.ttf) format(\"truetype\");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/d5e25ad69d0ea31f3b8f66d634ca40fe.eot?#iefix);src:url(assets/fonts/d5e25ad69d0ea31f3b8f66d634ca40fe.eot?#iefix) format(\"eot\"),url(assets/fonts/aad36ecead30948bb30fe0ef818b749c.woff2) format(\"woff2\"),url(assets/fonts/c437d7752feaf3f056bbf8613e898d3a.woff) format(\"woff\"),url(assets/fonts/b8df4d02ef5de13a813917a85bc4a9c4.ttf) format(\"truetype\");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/046190c9a2f724b925df848737b03819.eot?#iefix);src:url(assets/fonts/046190c9a2f724b925df848737b03819.eot?#iefix) format(\"eot\"),url(assets/fonts/4d52f8276a74ea8efbad833ed790367c.woff2) format(\"woff2\"),url(assets/fonts/a067695dd1b87e927f4056c040d84669.woff) format(\"woff\"),url(assets/fonts/510a664af9771b72d4ce5e637109ca3c.ttf) format(\"truetype\");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/0715de188f56c99aa615905f7e06292e.eot?#iefix);src:url(assets/fonts/0715de188f56c99aa615905f7e06292e.eot?#iefix) format(\"eot\"),url(assets/fonts/63f5acc71d9852468683a4bfe824a28f.woff2) format(\"woff2\"),url(assets/fonts/ed94c737da267752ce0abd79bb003ff6.woff) format(\"woff\"),url(assets/fonts/6302f55a6dc6b12365177dc89b7d63cf.ttf) format(\"truetype\");font-weight:500;font-style:italic;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/3f76abc23eef0596c499840db84213bb.eot?#iefix);src:url(assets/fonts/3f76abc23eef0596c499840db84213bb.eot?#iefix) format(\"eot\"),url(assets/fonts/1fe7da97fe9dbe1349aca9b54b5fdf69.woff2) format(\"woff2\"),url(assets/fonts/dacc6a84278e221422902af99579ada5.woff) format(\"woff\"),url(assets/fonts/e530c573663a3a07243d303fbf7db508.ttf) format(\"truetype\");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/75f8489ba53f19968feaa3e2eb78c569.eot?#iefix);src:url(assets/fonts/75f8489ba53f19968feaa3e2eb78c569.eot?#iefix) format(\"eot\"),url(assets/fonts/93ec0034623fc696601ab99aba652d4c.woff2) format(\"woff2\"),url(assets/fonts/d73c8eb1c13abe1237366aa3ee829a59.woff) format(\"woff\"),url(assets/fonts/7b6dcef99f3f4b23346e23925ec8678f.ttf) format(\"truetype\");font-weight:600;font-style:italic;font-display:swap}.tet-icon{font-family:Tet Icons;font-weight:400;font-style:normal;font-size:24px;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}@font-face{font-family:Tet Icons;src:url(assets/fonts/d2ce51cdcd0b9707af186f8d50023d23.eot);src:url(assets/fonts/d2ce51cdcd0b9707af186f8d50023d23.eot?#iefix) format(\"embedded-opentype\"),url(assets/fonts/25f10ef322a1220b2e9e11db38b73892.woff2) format(\"woff2\"),url(assets/fonts/fed75ac1edcf1c25cdd8612d2c365f9a.woff) format(\"woff\"),url(assets/fonts/df7fbe67cabb13cb837172a73c46378a.ttf) format(\"truetype\"),url(assets/fonts/5486d8c87e2abc6c13ed952a6cc96658.svg#tet-icons) format(\"svg\");font-weight:400;font-style:normal}.tet-icon:before{content:\"\\E84E\"}.tet-icon--sm{font-size:1.125rem}.tet-icon--md{font-size:1.5rem}.tet-icon--lg{font-size:2.25rem}.tet-icon--xl{font-size:3rem}.tet-icon--xxl{font-size:4rem}.tet-icon--0{font-size:0}.tet-icon--1{font-size:.0625rem}.tet-icon--2{font-size:.125rem}.tet-icon--3{font-size:.1875rem}.tet-icon--4{font-size:.25rem}.tet-icon--5{font-size:.3125rem}.tet-icon--6{font-size:.375rem}.tet-icon--7{font-size:.4375rem}.tet-icon--8{font-size:.5rem}.tet-icon--9{font-size:.5625rem}.tet-icon--10{font-size:.625rem}.tet-icon--11{font-size:.6875rem}.tet-icon--12{font-size:.75rem}.tet-icon--13{font-size:.8125rem}.tet-icon--14{font-size:.875rem}.tet-icon--15{font-size:.9375rem}.tet-icon--16{font-size:1rem}.tet-icon--17{font-size:1.0625rem}.tet-icon--18{font-size:1.125rem}.tet-icon--19{font-size:1.1875rem}.tet-icon--20{font-size:1.25rem}.tet-icon--21{font-size:1.3125rem}.tet-icon--22{font-size:1.375rem}.tet-icon--23{font-size:1.4375rem}.tet-icon--24{font-size:1.5rem}.tet-icon--25{font-size:1.5625rem}.tet-icon--26{font-size:1.625rem}.tet-icon--27{font-size:1.6875rem}.tet-icon--28{font-size:1.75rem}.tet-icon--29{font-size:1.8125rem}.tet-icon--30{font-size:1.875rem}.tet-icon--31{font-size:1.9375rem}.tet-icon--32{font-size:2rem}.tet-icon--33{font-size:2.0625rem}.tet-icon--34{font-size:2.125rem}.tet-icon--35{font-size:2.1875rem}.tet-icon--36{font-size:2.25rem}.tet-icon--37{font-size:2.3125rem}.tet-icon--38{font-size:2.375rem}.tet-icon--39{font-size:2.4375rem}.tet-icon--40{font-size:2.5rem}.tet-icon--41{font-size:2.5625rem}.tet-icon--42{font-size:2.625rem}.tet-icon--43{font-size:2.6875rem}.tet-icon--44{font-size:2.75rem}.tet-icon--45{font-size:2.8125rem}.tet-icon--46{font-size:2.875rem}.tet-icon--47{font-size:2.9375rem}.tet-icon--48{font-size:3rem}.tet-icon--49{font-size:3.0625rem}.tet-icon--50{font-size:3.125rem}.tet-icon--51{font-size:3.1875rem}.tet-icon--52{font-size:3.25rem}.tet-icon--53{font-size:3.3125rem}.tet-icon--54{font-size:3.375rem}.tet-icon--55{font-size:3.4375rem}.tet-icon--56{font-size:3.5rem}.tet-icon--57{font-size:3.5625rem}.tet-icon--58{font-size:3.625rem}.tet-icon--59{font-size:3.6875rem}.tet-icon--60{font-size:3.75rem}.tet-icon--61{font-size:3.8125rem}.tet-icon--62{font-size:3.875rem}.tet-icon--63{font-size:3.9375rem}.tet-icon--64{font-size:4rem}.tet-icon--65{font-size:4.0625rem}.tet-icon--66{font-size:4.125rem}.tet-icon--67{font-size:4.1875rem}.tet-icon--68{font-size:4.25rem}.tet-icon--69{font-size:4.3125rem}.tet-icon--70{font-size:4.375rem}.tet-icon--71{font-size:4.4375rem}.tet-icon--72{font-size:4.5rem}.tet-icon--73{font-size:4.5625rem}.tet-icon--74{font-size:4.625rem}.tet-icon--75{font-size:4.6875rem}.tet-icon--76{font-size:4.75rem}.tet-icon--77{font-size:4.8125rem}.tet-icon--78{font-size:4.875rem}.tet-icon--79{font-size:4.9375rem}.tet-icon--80{font-size:5rem}.tet-icon--81{font-size:5.0625rem}.tet-icon--82{font-size:5.125rem}.tet-icon--83{font-size:5.1875rem}.tet-icon--84{font-size:5.25rem}.tet-icon--85{font-size:5.3125rem}.tet-icon--86{font-size:5.375rem}.tet-icon--87{font-size:5.4375rem}.tet-icon--88{font-size:5.5rem}.tet-icon--89{font-size:5.5625rem}.tet-icon--90{font-size:5.625rem}.tet-icon--91{font-size:5.6875rem}.tet-icon--92{font-size:5.75rem}.tet-icon--93{font-size:5.8125rem}.tet-icon--94{font-size:5.875rem}.tet-icon--95{font-size:5.9375rem}.tet-icon--96{font-size:6rem}.tet-icon--97{font-size:6.0625rem}.tet-icon--98{font-size:6.125rem}.tet-icon--99{font-size:6.1875rem}.tet-icon--100{font-size:6.25rem}.tet-icon--101{font-size:6.3125rem}.tet-icon__add:before{content:\"\\E800\"}.tet-icon__alert-circled:before{content:\"\\E801\"}.tet-icon__alert:before{content:\"\\E802\"}.tet-icon__bank:before{content:\"\\E803\"}.tet-icon__box:before{content:\"\\E804\"}.tet-icon__download:before{content:\"\\E805\"}.tet-icon__burger:before{content:\"\\E806\"}.tet-icon__cancel:before{content:\"\\E807\"}.tet-icon__printer:before{content:\"\\E808\"}.tet-icon__cart-add:before{content:\"\\E809\"}.tet-icon__cart-remove:before{content:\"\\E80A\"}.tet-icon__cart:before{content:\"\\E80B\"}.tet-icon__chat:before{content:\"\\E80C\"}.tet-icon__arrow-up:before{content:\"\\E80D\"}.tet-icon__calendar:before{content:\"\\E80E\"}.tet-icon__help-circled:before{content:\"\\E80F\"}.tet-icon__edit:before{content:\"\\E810\"}.tet-icon__external-link:before{content:\"\\E811\"}.tet-icon__gift:before{content:\"\\E812\"}.tet-icon__person:before{content:\"\\E813\"}.tet-icon__heart:before{content:\"\\E814\"}.tet-icon__language:before{content:\"\\E815\"}.tet-icon__help:before{content:\"\\E816\"}.tet-icon__home-1:before{content:\"\\E817\"}.tet-icon__location:before{content:\"\\E818\"}.tet-icon__home-3:before{content:\"\\E819\"}.tet-icon__chart-even:before{content:\"\\E81A\"}.tet-icon__info-2:before{content:\"\\E81B\"}.tet-icon__key:before{content:\"\\E81C\"}.tet-icon__info:before{content:\"\\E81D\"}.tet-icon__lock-opened:before{content:\"\\E81E\"}.tet-icon__lock-outlined:before{content:\"\\E81F\"}.tet-icon__lock:before{content:\"\\E820\"}.tet-icon__laptop-filled:before{content:\"\\E821\"}.tet-icon__mail:before{content:\"\\E822\"}.tet-icon__options:before{content:\"\\E823\"}.tet-icon__chart-uneven:before{content:\"\\E824\"}.tet-icon__mail-2:before{content:\"\\E825\"}.tet-icon__remove:before{content:\"\\E826\"}.tet-icon__mobile-filled:before{content:\"\\E827\"}.tet-icon__ilu-calendar-check:before{content:\"\\E828\"}.tet-icon__settings-outlined:before{content:\"\\E829\"}.tet-icon__tablet:before{content:\"\\E82A\"}.tet-icon__thumb-up:before{content:\"\\E82B\"}.tet-icon__ilu-purchase:before{content:\"\\E82C\"}.tet-icon__chart-even-outlined:before{content:\"\\E82D\"}.tet-icon__movie:before{content:\"\\E82E\"}.tet-icon__percent:before{content:\"\\E82F\"}.tet-icon__ilu-change-whenever:before{content:\"\\E830\"}.tet-icon__truck:before{content:\"\\E831\"}.tet-icon__zero:before{content:\"\\E832\"}.tet-icon__attach:before{content:\"\\E833\"}.tet-icon__cloud-done:before{content:\"\\E834\"}.tet-icon__cloud-download:before{content:\"\\E835\"}.tet-icon__cloud-upload:before{content:\"\\E836\"}.tet-icon__cloud:before{content:\"\\E837\"}.tet-icon__folder:before{content:\"\\E838\"}.tet-icon__remote:before{content:\"\\E839\"}.tet-icon__router:before{content:\"\\E83A\"}.tet-icon__shield-filled:before{content:\"\\E83B\"}.tet-icon__shield:before{content:\"\\E83C\"}.tet-icon__ilu-devices:before{content:\"\\E83D\"}.tet-icon__ilu-get-points:before{content:\"\\E83E\"}.tet-icon__tv:before{content:\"\\E83F\"}.tet-icon__ilu-internet:before{content:\"\\E840\"}.tet-icon__wifi-outlined:before{content:\"\\E841\"}.tet-icon__wifi:before{content:\"\\E842\"}.tet-icon__description-outlined:before{content:\"\\E843\"}.tet-icon__laptop:before{content:\"\\E844\"}.tet-icon__chart-uneven-outlined:before{content:\"\\E845\"}.tet-icon__meter:before{content:\"\\E846\"}.tet-icon__mobile:before{content:\"\\E847\"}.tet-icon__phone:before{content:\"\\E848\"}.tet-icon__plug-filled:before{content:\"\\E849\"}.tet-icon__plug:before{content:\"\\E84A\"}.tet-icon__print:before{content:\"\\E84B\"}.tet-icon__camera:before{content:\"\\E84C\"}.tet-icon__clock:before{content:\"\\E84D\"}.tet-icon__placeholder:before{content:\"\\E84E\"}.tet-icon__tv-filled:before{content:\"\\E84F\"}.tet-icon__arrow-down:before{content:\"\\E850\"}.tet-icon__arrow-left:before{content:\"\\E851\"}.tet-icon__arrow-right:before{content:\"\\E852\"}.tet-icon__description:before{content:\"\\E853\"}.tet-icon__login:before{content:\"\\E854\"}.tet-icon__check:before{content:\"\\E855\"}.tet-icon__chevron-down:before{content:\"\\E856\"}.tet-icon__chevron-left:before{content:\"\\E857\"}.tet-icon__chevron-right:before{content:\"\\E858\"}.tet-icon__chevron-up:before{content:\"\\E859\"}.tet-icon__close-circled:before{content:\"\\E85A\"}.tet-icon__close:before{content:\"\\E85B\"}.tet-icon__more-horizontal:before{content:\"\\E85C\"}.tet-icon__more-vertical:before{content:\"\\E85D\"}.tet-icon__refresh:before{content:\"\\E85E\"}.tet-icon__facebook:before{content:\"\\E85F\"}.tet-icon__instagram:before{content:\"\\E860\"}.tet-icon__linkedin:before{content:\"\\E861\"}.tet-icon__people:before{content:\"\\E862\"}.tet-icon__logout:before{content:\"\\E863\"}.tet-icon__share:before{content:\"\\E864\"}.tet-icon__twitter:before{content:\"\\E865\"}.tet-icon__cancel-filled:before{content:\"\\E866\"}.tet-icon__done:before{content:\"\\E867\"}.tet-icon__star-filled:before{content:\"\\E868\"}.tet-icon__star:before{content:\"\\E869\"}.tet-icon__clipboard:before{content:\"\\E86A\"}.tet-icon__ilu-calendar:before{content:\"\\E86B\"}.tet-icon__check-circled:before{content:\"\\E86C\"}.tet-icon__ilu-choose-channels:before{content:\"\\E86D\"}.tet-icon__search:before{content:\"\\E86E\"}.tet-icon__warning:before{content:\"\\E86F\"}.tet-icon__ilu-clock-1:before{content:\"\\E870\"}.tet-icon__ilu-fold:before{content:\"\\E871\"}.tet-icon__ilu-letter:before{content:\"\\E872\"}.tet-icon__ilu-pay:before{content:\"\\E873\"}.tet-icon__ilu-meter:before{content:\"\\E874\"}.tet-icon__ilu-sign:before{content:\"\\E875\"}.tet-icon__smart-watch-filled:before{content:\"\\E876\"}.tet-icon__washing-machine-filled:before{content:\"\\E877\"}.tet-icon__bullet:before{content:\"\\E878\"}.tet-icon__sound:before{content:\"\\E879\"}.tet-icon__dropdown:before{content:\"\\E87A\"}.tet-icon__mask-pass:before{content:\"\\E87B\"}.tet-icon__select:before{content:\"\\E87C\"}.tet-icon__text-area-sizing:before{content:\"\\E87D\"}.tet-icon__unmask-pass:before{content:\"\\E87E\"}.tet-icon__bullet-small:before{content:\"\\E882\"}.tet-icon__electric-bolt:before{content:\"\\E880\"}.tet-icon__sun:before{content:\"\\E881\"}:host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:\"\\e86e\"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:\"\\e85a\"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:\"\\e85b\"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:\"\\e86c\"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:\"\\e855\"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:\"\\e859\"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:\"\\e856\"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:\"\\e86a\"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:\"\\e81d\"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:\"\\e867\"}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{display:flex;align-items:center}.modal-form-card{border-radius:1rem;height:fit-content;box-shadow:var(--b2b-check-out-form-border-shadow);display:flex;flex-direction:column;border:none;--dialog-header-padding:1rem 1.125rem 0.5rem 1.5rem;--dialog-body-padding:0.5rem 1.5rem 2rem;--dialog-width:53rem;--dialog-title-font-size:1.5rem}@media screen and (max-width: 46.25rem){.modal-form-card{--dialog-body-padding:0.5rem 1rem 1.5rem}}.modal-form-card-content{display:flex;flex-direction:column;height:fit-content}.modal-form-card-content.light{--b2b-check-out-form-text-color:var(--tc-text-primary);--b2b-check-out-form-input-border-color:var(--tc-border-secondary);--b2b-check-out-form-accordion-border-color:var(--tc-border-quaternary);--b2b-check-out-form-border-shadow:var(--tc-elevation-six);--b2b-check-out-form-footer-border-color:var(--tc-border-quaternary);--b2b-check-out-form-accordion-background-color:var(--tc-layer-secondary);--b2b-check-out-form-icon-background-color:var(--tc-layer-inverse-primary);--b2b-check-out-form-icon-color:var(--tc-layer-primary)}.modal-form-card-content.dark{--b2b-check-out-form-text-color:var(--tc-text-primary-dark);--b2b-check-out-form-input-border-color:var(--tc-border-secondary-dark);--b2b-check-out-form-accordion-border-color:var(--tc-border-quaternary-dark);--b2b-check-out-form-border-shadow:var(--tc-elevation-six-dark);--b2b-check-out-form-footer-border-color:var(--tc-border-quaternary-dark);--b2b-check-out-form-accordion-background-color:var(--tc-layer-secondary-dark);--b2b-check-out-form-icon-background-color:var(--tc-layer-inverse-primary-dark);--b2b-check-out-form-icon-color:var(--tc-layer-primary-dark)}.modal-form-card-content-header{display:flex;flex-direction:column;justify-content:center;align-items:center;padding-bottom:1.5rem}.modal-form-card-content-header__title{font:600 1.5rem/1.75rem \"Gilroy\", \"Gilroy, Arial, sans-serif\";padding-top:1rem}.modal-form-card-content-header__description{font:400 1rem/1.5rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.modal-form-card-content-accordion-wrapper{border:1px solid var(--b2b-check-out-form-accordion-border-color);border-radius:1rem}.modal-form-card-content-checkbox{--tet-link-color:var(--b2b-check-out-form-text-color)}.modal-form-card-footer{display:flex;align-items:center;justify-content:flex-end;gap:1rem;border-top:1px solid var(--b2b-check-out-form-footer-border-color)}@media screen and (max-width: 46.25rem){.modal-form-card-footer{justify-content:space-between;gap:0;width:100%}}.modal-form-card-form{display:flex;flex-direction:column;gap:1.5rem;padding-top:2rem}@media screen and (max-width: 46.25rem){.modal-form-card-form{gap:1rem;padding-top:1.5rem}}.modal-form-card-input__row{display:flex;flex-direction:row;gap:1.5rem;width:100%}@media screen and (max-width: 46.25rem){.modal-form-card-input__row{gap:1rem;flex-direction:column}}.modal-form-card__input{width:100%;--input-border-radius:0.625rem;--input-border-color:var(--b2b-check-out-form-input-border-color);--accordion-background-color:var(--b2b-check-out-form-input-border-color)}.modal-form-card .cart-header{display:flex;flex-direction:row;justify-content:space-between}.modal-form-card .icon-wrapper{display:flex;border-radius:50%;background-color:var(--b2b-check-out-form-icon-background-color)}.modal-form-card .icon{--icon-color:var(--b2b-check-out-form-icon-color)}";
|
|
43
|
+
const TetB2bCheckOutFormStyle0 = tetB2bCheckOutFormCss;
|
|
44
|
+
|
|
45
|
+
const TetAvailabilityContactForm = class {
|
|
46
|
+
constructor(hostRef) {
|
|
47
|
+
registerInstance(this, hostRef);
|
|
48
|
+
this.submitCheckOutForm = createEvent(this, "submit-check-out-form", 7);
|
|
49
|
+
this.language = 'lv';
|
|
50
|
+
this.theme = undefined;
|
|
51
|
+
}
|
|
52
|
+
/**
|
|
53
|
+
* The watch to update translations.
|
|
54
|
+
* @param language
|
|
55
|
+
*/
|
|
56
|
+
onLanguageChange(language) {
|
|
57
|
+
processTranslations('tet-components', language).then(() => forceUpdate(this));
|
|
58
|
+
}
|
|
59
|
+
/** Method to open check out form */
|
|
60
|
+
async open() {
|
|
61
|
+
await this.dialogElement.open();
|
|
62
|
+
}
|
|
63
|
+
/** Method to close check out form */
|
|
64
|
+
async close() {
|
|
65
|
+
await this.dialogElement.close();
|
|
66
|
+
}
|
|
67
|
+
/**
|
|
68
|
+
* Lifecycle method.
|
|
69
|
+
*/
|
|
70
|
+
async componentWillLoad() {
|
|
71
|
+
await processTranslations('tet-components', this.language);
|
|
72
|
+
forceUpdate(this);
|
|
73
|
+
}
|
|
74
|
+
/**
|
|
75
|
+
* Get validators for each input form and set error messages.
|
|
76
|
+
*/
|
|
77
|
+
getValidators(label, isPhoneNr) {
|
|
78
|
+
const cleanLabel = label.trim().toLowerCase().replace(',', ' un');
|
|
79
|
+
let errorText = '';
|
|
80
|
+
switch (cleanLabel.charAt(cleanLabel.length - 1)) {
|
|
81
|
+
case 's':
|
|
82
|
+
{
|
|
83
|
+
isPhoneNr ? (errorText = cleanLabel.replace('is', 'i')) : (errorText = cleanLabel.replace(/[s]\b/g, 'u'));
|
|
84
|
+
}
|
|
85
|
+
break;
|
|
86
|
+
case 'e':
|
|
87
|
+
{
|
|
88
|
+
errorText = cleanLabel.replace(/[e]\b/g, 'i');
|
|
89
|
+
}
|
|
90
|
+
break;
|
|
91
|
+
default:
|
|
92
|
+
errorText = cleanLabel;
|
|
93
|
+
}
|
|
94
|
+
const errorMessage = `${translate('components-b2b-check-out-form-validation-error')} ${this.language === 'lv' ? errorText : cleanLabel}`;
|
|
95
|
+
let validators = [new RequiredValidator(errorMessage)];
|
|
96
|
+
if (cleanLabel === 'e-pasts') {
|
|
97
|
+
validators = [
|
|
98
|
+
new RequiredValidator(errorMessage),
|
|
99
|
+
new EMailAddressValidator('components-b2b-check-out-form-email-validation-error')
|
|
100
|
+
];
|
|
101
|
+
}
|
|
102
|
+
if (isPhoneNr) {
|
|
103
|
+
validators = [
|
|
104
|
+
new RequiredValidator(errorMessage),
|
|
105
|
+
new PhoneNumberValidator('components-validation-incorrect-phone')
|
|
106
|
+
];
|
|
107
|
+
}
|
|
108
|
+
return validators;
|
|
109
|
+
}
|
|
110
|
+
/**
|
|
111
|
+
* Render Input 'tet-input' element.
|
|
112
|
+
* @param {string} id
|
|
113
|
+
* @param {string} label
|
|
114
|
+
* @param {string} placeholder
|
|
115
|
+
* @param {boolean} isPhoneNr
|
|
116
|
+
* @returns {HTMLTetInputElement}
|
|
117
|
+
* @private
|
|
118
|
+
*/
|
|
119
|
+
renderInput(id, label, placeholder, isPhoneNr) {
|
|
120
|
+
return (h("tet-input", Object.assign({ id: id, class: "modal-form-card__input", theme: this.theme, label: `${label} *`, placeholder: placeholder || label }, (isPhoneNr && { isPhoneNumber: true }), { validators: this.getValidators(label, isPhoneNr) })));
|
|
121
|
+
}
|
|
122
|
+
/** Validates all input fields and returns whether all of them are valid or not. */
|
|
123
|
+
async validateInputFields() {
|
|
124
|
+
const inputElements = Array.from(this.checkOutForm.getElementsByTagName('tet-input'));
|
|
125
|
+
const errorPromise = Object.values(inputElements).map(async (value) => value.validateInput());
|
|
126
|
+
const errors = (await Promise.all(errorPromise)).filter((data) => data && data.length > 0);
|
|
127
|
+
const checkBoxElement = Array.from(this.checkOutForm.getElementsByTagName('tet-checkbox'))[0];
|
|
128
|
+
checkBoxElement.setError(!checkBoxElement.checked);
|
|
129
|
+
const checkBoxError = !checkBoxElement.checked;
|
|
130
|
+
return errors.length === 0 && !checkBoxError;
|
|
131
|
+
}
|
|
132
|
+
/**
|
|
133
|
+
* Check validation and emit values on form submit
|
|
134
|
+
* @returns {Promise<void>}
|
|
135
|
+
* @private
|
|
136
|
+
*/
|
|
137
|
+
async handleSubmit() {
|
|
138
|
+
const inputFieldsValid = await this.validateInputFields();
|
|
139
|
+
if (!inputFieldsValid) {
|
|
140
|
+
return;
|
|
141
|
+
}
|
|
142
|
+
const inputElements = Array.from(this.checkOutForm.getElementsByTagName('tet-input'));
|
|
143
|
+
let emitValue = {};
|
|
144
|
+
inputElements.forEach((item) => {
|
|
145
|
+
const value = item.querySelector('input').value;
|
|
146
|
+
emitValue = Object.assign(Object.assign({}, emitValue), { [item.id]: value });
|
|
147
|
+
});
|
|
148
|
+
this.submitCheckOutForm.emit(emitValue);
|
|
149
|
+
}
|
|
150
|
+
render() {
|
|
151
|
+
const { theme } = this;
|
|
152
|
+
return (h("tet-dialog", { key: 'afc8685139afa64194e3d2cb25b18d84ff3ad67a', class: "modal-form-card", headerTitle: translate('components-b2b-check-out-form-header'), theme: theme, closeOnOverlayClick: false, footerDisplay: "right", ref: (el) => {
|
|
153
|
+
this.dialogElement = el;
|
|
154
|
+
} }, h("div", { key: 'eff2cd2ed86e20aef326bc30d38895bb277bd5e6', class: { 'modal-form-card-content': true, [`${theme}`]: true } }, h("div", { key: 'f5c323d4ad25b2b69fa63397b01e774f73c5f7e3', class: "modal-form-card-content-header" }, h("div", { key: '70a9baeec70a1ec1412765678fe82973c6728616', class: "icon-wrapper" }, h("tet-icon", { key: 'ba3c5485e259fc0fe399e462cef72aae4ae4b3ea', class: "icon", name: "tc-company-1" })), h("span", { key: '1be3f61365e4619725aa3c2673a2ac724c69dff5', class: "modal-form-card-content-header__title" }, translate('components-b2b-check-out-form-title')), h("span", { key: '689ad9e4124e6974f60f9502fca4f1976f54fa7d', class: "modal-form-card-content-header__description" }, translate('components-b2b-check-out-form-description'))), h("div", { key: 'bc9acd6b8d3ed737e772c33f261f66b533cef3a0', class: "modal-form-card-content-accordion-wrapper" }, h("slot", { key: '2512b5fdc525049a96e1f8de62408248df261c9f', name: 'cart' })), h("form", { key: '42c51bb0f454b6510f1dba1e82aef3ea1535b4c2', id: "checkOutForm", class: "modal-form-card-form", ref: (ref) => (this.checkOutForm = ref) }, h("div", { key: '4cfcdf10b7e5eba5af9b753373c146f94418944b', class: "modal-form-card-input__row" }, this.renderInput('companyRegNr', translate('components-b2b-check-out-form-company-registration-number-input-label'), '40000000001'), this.renderInput('companyName', translate('components-b2b-check-out-form-company-name-input-label'))), this.renderInput('address', translate('components-b2b-check-out-form-address-input-label'), translate('components-b2b-check-out-form-address-input-placeholder')), this.renderInput('nameSurname', translate('components-b2b-check-out-form-name-input-label')), h("div", { key: '60788e463001f8f8721b1e72e286808857a20ea8', class: "modal-form-card-input__row" }, this.renderInput('email', translate('components-b2b-check-out-form-email-input-label'), 'contact@company.com'), this.renderInput('phoneNr', translate('components-b2b-check-out-form-phone-number-input-label'), '123456789', true)), h("tet-checkbox", { key: 'c1d00090ed1e971e91b957467fd543678b3074d8', class: "modal-form-card-content-checkbox", label: translate('components-check-out-form-privacy-policy'), theme: theme }))), h("div", { key: '42dce382d71a25e5588b5b0c3caab5d6f9087c03', slot: "footer", class: "modal-form-card-footer" }, h("tet-button", { key: '93f57658be0b1b0a034cb5fb7321954babe72fbb', type: "secondary", size: "medium", theme: theme, onClick: () => {
|
|
155
|
+
this.dialogElement.close();
|
|
156
|
+
} }, translate('components-b2b-check-out-form-close-button-label')), h("tet-button", { key: '6a09fbae279bfcc1b5aa9417bd7497e16ff25358', type: "primary", size: "medium", theme: theme, onClick: () => this.handleSubmit() }, translate('components-b2b-check-out-form-submit-button-label')))));
|
|
157
|
+
}
|
|
158
|
+
static get watchers() { return {
|
|
159
|
+
"language": ["onLanguageChange"]
|
|
160
|
+
}; }
|
|
161
|
+
};
|
|
162
|
+
TetAvailabilityContactForm.style = TetB2bCheckOutFormStyle0;
|
|
163
|
+
|
|
164
|
+
const tetB2bCompareCardCss = "@font-face{font-family:Avenir Next;src:url(assets/fonts/8e7462a9501f48c43c58f870188b3fb2.eot?#iefix);src:url(assets/fonts/8e7462a9501f48c43c58f870188b3fb2.eot?#iefix) format(\"eot\"),url(assets/fonts/3c3e10968ffc97c2a52c5830f9886d1f.woff2) format(\"woff2\"),url(assets/fonts/660fbf858d30d7685fa4b166080f5980.woff) format(\"woff\"),url(assets/fonts/2b7748589092fd1a10b806abdfb562ff.ttf) format(\"truetype\");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/d5e25ad69d0ea31f3b8f66d634ca40fe.eot?#iefix);src:url(assets/fonts/d5e25ad69d0ea31f3b8f66d634ca40fe.eot?#iefix) format(\"eot\"),url(assets/fonts/aad36ecead30948bb30fe0ef818b749c.woff2) format(\"woff2\"),url(assets/fonts/c437d7752feaf3f056bbf8613e898d3a.woff) format(\"woff\"),url(assets/fonts/b8df4d02ef5de13a813917a85bc4a9c4.ttf) format(\"truetype\");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/046190c9a2f724b925df848737b03819.eot?#iefix);src:url(assets/fonts/046190c9a2f724b925df848737b03819.eot?#iefix) format(\"eot\"),url(assets/fonts/4d52f8276a74ea8efbad833ed790367c.woff2) format(\"woff2\"),url(assets/fonts/a067695dd1b87e927f4056c040d84669.woff) format(\"woff\"),url(assets/fonts/510a664af9771b72d4ce5e637109ca3c.ttf) format(\"truetype\");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/0715de188f56c99aa615905f7e06292e.eot?#iefix);src:url(assets/fonts/0715de188f56c99aa615905f7e06292e.eot?#iefix) format(\"eot\"),url(assets/fonts/63f5acc71d9852468683a4bfe824a28f.woff2) format(\"woff2\"),url(assets/fonts/ed94c737da267752ce0abd79bb003ff6.woff) format(\"woff\"),url(assets/fonts/6302f55a6dc6b12365177dc89b7d63cf.ttf) format(\"truetype\");font-weight:500;font-style:italic;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/3f76abc23eef0596c499840db84213bb.eot?#iefix);src:url(assets/fonts/3f76abc23eef0596c499840db84213bb.eot?#iefix) format(\"eot\"),url(assets/fonts/1fe7da97fe9dbe1349aca9b54b5fdf69.woff2) format(\"woff2\"),url(assets/fonts/dacc6a84278e221422902af99579ada5.woff) format(\"woff\"),url(assets/fonts/e530c573663a3a07243d303fbf7db508.ttf) format(\"truetype\");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/75f8489ba53f19968feaa3e2eb78c569.eot?#iefix);src:url(assets/fonts/75f8489ba53f19968feaa3e2eb78c569.eot?#iefix) format(\"eot\"),url(assets/fonts/93ec0034623fc696601ab99aba652d4c.woff2) format(\"woff2\"),url(assets/fonts/d73c8eb1c13abe1237366aa3ee829a59.woff) format(\"woff\"),url(assets/fonts/7b6dcef99f3f4b23346e23925ec8678f.ttf) format(\"truetype\");font-weight:600;font-style:italic;font-display:swap}.tet-icon{font-family:Tet Icons;font-weight:400;font-style:normal;font-size:24px;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}@font-face{font-family:Tet Icons;src:url(assets/fonts/d2ce51cdcd0b9707af186f8d50023d23.eot);src:url(assets/fonts/d2ce51cdcd0b9707af186f8d50023d23.eot?#iefix) format(\"embedded-opentype\"),url(assets/fonts/25f10ef322a1220b2e9e11db38b73892.woff2) format(\"woff2\"),url(assets/fonts/fed75ac1edcf1c25cdd8612d2c365f9a.woff) format(\"woff\"),url(assets/fonts/df7fbe67cabb13cb837172a73c46378a.ttf) format(\"truetype\"),url(assets/fonts/5486d8c87e2abc6c13ed952a6cc96658.svg#tet-icons) format(\"svg\");font-weight:400;font-style:normal}.tet-icon:before{content:\"\\E84E\"}.tet-icon--sm{font-size:1.125rem}.tet-icon--md{font-size:1.5rem}.tet-icon--lg{font-size:2.25rem}.tet-icon--xl{font-size:3rem}.tet-icon--xxl{font-size:4rem}.tet-icon--0{font-size:0}.tet-icon--1{font-size:.0625rem}.tet-icon--2{font-size:.125rem}.tet-icon--3{font-size:.1875rem}.tet-icon--4{font-size:.25rem}.tet-icon--5{font-size:.3125rem}.tet-icon--6{font-size:.375rem}.tet-icon--7{font-size:.4375rem}.tet-icon--8{font-size:.5rem}.tet-icon--9{font-size:.5625rem}.tet-icon--10{font-size:.625rem}.tet-icon--11{font-size:.6875rem}.tet-icon--12{font-size:.75rem}.tet-icon--13{font-size:.8125rem}.tet-icon--14{font-size:.875rem}.tet-icon--15{font-size:.9375rem}.tet-icon--16{font-size:1rem}.tet-icon--17{font-size:1.0625rem}.tet-icon--18{font-size:1.125rem}.tet-icon--19{font-size:1.1875rem}.tet-icon--20{font-size:1.25rem}.tet-icon--21{font-size:1.3125rem}.tet-icon--22{font-size:1.375rem}.tet-icon--23{font-size:1.4375rem}.tet-icon--24{font-size:1.5rem}.tet-icon--25{font-size:1.5625rem}.tet-icon--26{font-size:1.625rem}.tet-icon--27{font-size:1.6875rem}.tet-icon--28{font-size:1.75rem}.tet-icon--29{font-size:1.8125rem}.tet-icon--30{font-size:1.875rem}.tet-icon--31{font-size:1.9375rem}.tet-icon--32{font-size:2rem}.tet-icon--33{font-size:2.0625rem}.tet-icon--34{font-size:2.125rem}.tet-icon--35{font-size:2.1875rem}.tet-icon--36{font-size:2.25rem}.tet-icon--37{font-size:2.3125rem}.tet-icon--38{font-size:2.375rem}.tet-icon--39{font-size:2.4375rem}.tet-icon--40{font-size:2.5rem}.tet-icon--41{font-size:2.5625rem}.tet-icon--42{font-size:2.625rem}.tet-icon--43{font-size:2.6875rem}.tet-icon--44{font-size:2.75rem}.tet-icon--45{font-size:2.8125rem}.tet-icon--46{font-size:2.875rem}.tet-icon--47{font-size:2.9375rem}.tet-icon--48{font-size:3rem}.tet-icon--49{font-size:3.0625rem}.tet-icon--50{font-size:3.125rem}.tet-icon--51{font-size:3.1875rem}.tet-icon--52{font-size:3.25rem}.tet-icon--53{font-size:3.3125rem}.tet-icon--54{font-size:3.375rem}.tet-icon--55{font-size:3.4375rem}.tet-icon--56{font-size:3.5rem}.tet-icon--57{font-size:3.5625rem}.tet-icon--58{font-size:3.625rem}.tet-icon--59{font-size:3.6875rem}.tet-icon--60{font-size:3.75rem}.tet-icon--61{font-size:3.8125rem}.tet-icon--62{font-size:3.875rem}.tet-icon--63{font-size:3.9375rem}.tet-icon--64{font-size:4rem}.tet-icon--65{font-size:4.0625rem}.tet-icon--66{font-size:4.125rem}.tet-icon--67{font-size:4.1875rem}.tet-icon--68{font-size:4.25rem}.tet-icon--69{font-size:4.3125rem}.tet-icon--70{font-size:4.375rem}.tet-icon--71{font-size:4.4375rem}.tet-icon--72{font-size:4.5rem}.tet-icon--73{font-size:4.5625rem}.tet-icon--74{font-size:4.625rem}.tet-icon--75{font-size:4.6875rem}.tet-icon--76{font-size:4.75rem}.tet-icon--77{font-size:4.8125rem}.tet-icon--78{font-size:4.875rem}.tet-icon--79{font-size:4.9375rem}.tet-icon--80{font-size:5rem}.tet-icon--81{font-size:5.0625rem}.tet-icon--82{font-size:5.125rem}.tet-icon--83{font-size:5.1875rem}.tet-icon--84{font-size:5.25rem}.tet-icon--85{font-size:5.3125rem}.tet-icon--86{font-size:5.375rem}.tet-icon--87{font-size:5.4375rem}.tet-icon--88{font-size:5.5rem}.tet-icon--89{font-size:5.5625rem}.tet-icon--90{font-size:5.625rem}.tet-icon--91{font-size:5.6875rem}.tet-icon--92{font-size:5.75rem}.tet-icon--93{font-size:5.8125rem}.tet-icon--94{font-size:5.875rem}.tet-icon--95{font-size:5.9375rem}.tet-icon--96{font-size:6rem}.tet-icon--97{font-size:6.0625rem}.tet-icon--98{font-size:6.125rem}.tet-icon--99{font-size:6.1875rem}.tet-icon--100{font-size:6.25rem}.tet-icon--101{font-size:6.3125rem}.tet-icon__add:before{content:\"\\E800\"}.tet-icon__alert-circled:before{content:\"\\E801\"}.tet-icon__alert:before{content:\"\\E802\"}.tet-icon__bank:before{content:\"\\E803\"}.tet-icon__box:before{content:\"\\E804\"}.tet-icon__download:before{content:\"\\E805\"}.tet-icon__burger:before{content:\"\\E806\"}.tet-icon__cancel:before{content:\"\\E807\"}.tet-icon__printer:before{content:\"\\E808\"}.tet-icon__cart-add:before{content:\"\\E809\"}.tet-icon__cart-remove:before{content:\"\\E80A\"}.tet-icon__cart:before{content:\"\\E80B\"}.tet-icon__chat:before{content:\"\\E80C\"}.tet-icon__arrow-up:before{content:\"\\E80D\"}.tet-icon__calendar:before{content:\"\\E80E\"}.tet-icon__help-circled:before{content:\"\\E80F\"}.tet-icon__edit:before{content:\"\\E810\"}.tet-icon__external-link:before{content:\"\\E811\"}.tet-icon__gift:before{content:\"\\E812\"}.tet-icon__person:before{content:\"\\E813\"}.tet-icon__heart:before{content:\"\\E814\"}.tet-icon__language:before{content:\"\\E815\"}.tet-icon__help:before{content:\"\\E816\"}.tet-icon__home-1:before{content:\"\\E817\"}.tet-icon__location:before{content:\"\\E818\"}.tet-icon__home-3:before{content:\"\\E819\"}.tet-icon__chart-even:before{content:\"\\E81A\"}.tet-icon__info-2:before{content:\"\\E81B\"}.tet-icon__key:before{content:\"\\E81C\"}.tet-icon__info:before{content:\"\\E81D\"}.tet-icon__lock-opened:before{content:\"\\E81E\"}.tet-icon__lock-outlined:before{content:\"\\E81F\"}.tet-icon__lock:before{content:\"\\E820\"}.tet-icon__laptop-filled:before{content:\"\\E821\"}.tet-icon__mail:before{content:\"\\E822\"}.tet-icon__options:before{content:\"\\E823\"}.tet-icon__chart-uneven:before{content:\"\\E824\"}.tet-icon__mail-2:before{content:\"\\E825\"}.tet-icon__remove:before{content:\"\\E826\"}.tet-icon__mobile-filled:before{content:\"\\E827\"}.tet-icon__ilu-calendar-check:before{content:\"\\E828\"}.tet-icon__settings-outlined:before{content:\"\\E829\"}.tet-icon__tablet:before{content:\"\\E82A\"}.tet-icon__thumb-up:before{content:\"\\E82B\"}.tet-icon__ilu-purchase:before{content:\"\\E82C\"}.tet-icon__chart-even-outlined:before{content:\"\\E82D\"}.tet-icon__movie:before{content:\"\\E82E\"}.tet-icon__percent:before{content:\"\\E82F\"}.tet-icon__ilu-change-whenever:before{content:\"\\E830\"}.tet-icon__truck:before{content:\"\\E831\"}.tet-icon__zero:before{content:\"\\E832\"}.tet-icon__attach:before{content:\"\\E833\"}.tet-icon__cloud-done:before{content:\"\\E834\"}.tet-icon__cloud-download:before{content:\"\\E835\"}.tet-icon__cloud-upload:before{content:\"\\E836\"}.tet-icon__cloud:before{content:\"\\E837\"}.tet-icon__folder:before{content:\"\\E838\"}.tet-icon__remote:before{content:\"\\E839\"}.tet-icon__router:before{content:\"\\E83A\"}.tet-icon__shield-filled:before{content:\"\\E83B\"}.tet-icon__shield:before{content:\"\\E83C\"}.tet-icon__ilu-devices:before{content:\"\\E83D\"}.tet-icon__ilu-get-points:before{content:\"\\E83E\"}.tet-icon__tv:before{content:\"\\E83F\"}.tet-icon__ilu-internet:before{content:\"\\E840\"}.tet-icon__wifi-outlined:before{content:\"\\E841\"}.tet-icon__wifi:before{content:\"\\E842\"}.tet-icon__description-outlined:before{content:\"\\E843\"}.tet-icon__laptop:before{content:\"\\E844\"}.tet-icon__chart-uneven-outlined:before{content:\"\\E845\"}.tet-icon__meter:before{content:\"\\E846\"}.tet-icon__mobile:before{content:\"\\E847\"}.tet-icon__phone:before{content:\"\\E848\"}.tet-icon__plug-filled:before{content:\"\\E849\"}.tet-icon__plug:before{content:\"\\E84A\"}.tet-icon__print:before{content:\"\\E84B\"}.tet-icon__camera:before{content:\"\\E84C\"}.tet-icon__clock:before{content:\"\\E84D\"}.tet-icon__placeholder:before{content:\"\\E84E\"}.tet-icon__tv-filled:before{content:\"\\E84F\"}.tet-icon__arrow-down:before{content:\"\\E850\"}.tet-icon__arrow-left:before{content:\"\\E851\"}.tet-icon__arrow-right:before{content:\"\\E852\"}.tet-icon__description:before{content:\"\\E853\"}.tet-icon__login:before{content:\"\\E854\"}.tet-icon__check:before{content:\"\\E855\"}.tet-icon__chevron-down:before{content:\"\\E856\"}.tet-icon__chevron-left:before{content:\"\\E857\"}.tet-icon__chevron-right:before{content:\"\\E858\"}.tet-icon__chevron-up:before{content:\"\\E859\"}.tet-icon__close-circled:before{content:\"\\E85A\"}.tet-icon__close:before{content:\"\\E85B\"}.tet-icon__more-horizontal:before{content:\"\\E85C\"}.tet-icon__more-vertical:before{content:\"\\E85D\"}.tet-icon__refresh:before{content:\"\\E85E\"}.tet-icon__facebook:before{content:\"\\E85F\"}.tet-icon__instagram:before{content:\"\\E860\"}.tet-icon__linkedin:before{content:\"\\E861\"}.tet-icon__people:before{content:\"\\E862\"}.tet-icon__logout:before{content:\"\\E863\"}.tet-icon__share:before{content:\"\\E864\"}.tet-icon__twitter:before{content:\"\\E865\"}.tet-icon__cancel-filled:before{content:\"\\E866\"}.tet-icon__done:before{content:\"\\E867\"}.tet-icon__star-filled:before{content:\"\\E868\"}.tet-icon__star:before{content:\"\\E869\"}.tet-icon__clipboard:before{content:\"\\E86A\"}.tet-icon__ilu-calendar:before{content:\"\\E86B\"}.tet-icon__check-circled:before{content:\"\\E86C\"}.tet-icon__ilu-choose-channels:before{content:\"\\E86D\"}.tet-icon__search:before{content:\"\\E86E\"}.tet-icon__warning:before{content:\"\\E86F\"}.tet-icon__ilu-clock-1:before{content:\"\\E870\"}.tet-icon__ilu-fold:before{content:\"\\E871\"}.tet-icon__ilu-letter:before{content:\"\\E872\"}.tet-icon__ilu-pay:before{content:\"\\E873\"}.tet-icon__ilu-meter:before{content:\"\\E874\"}.tet-icon__ilu-sign:before{content:\"\\E875\"}.tet-icon__smart-watch-filled:before{content:\"\\E876\"}.tet-icon__washing-machine-filled:before{content:\"\\E877\"}.tet-icon__bullet:before{content:\"\\E878\"}.tet-icon__sound:before{content:\"\\E879\"}.tet-icon__dropdown:before{content:\"\\E87A\"}.tet-icon__mask-pass:before{content:\"\\E87B\"}.tet-icon__select:before{content:\"\\E87C\"}.tet-icon__text-area-sizing:before{content:\"\\E87D\"}.tet-icon__unmask-pass:before{content:\"\\E87E\"}.tet-icon__bullet-small:before{content:\"\\E882\"}.tet-icon__electric-bolt:before{content:\"\\E880\"}.tet-icon__sun:before{content:\"\\E881\"}:host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:\"\\e86e\"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:\"\\e85a\"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:\"\\e85b\"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:\"\\e86c\"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:\"\\e855\"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:\"\\e859\"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:\"\\e856\"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:\"\\e86a\"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:\"\\e81d\"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:\"\\e867\"}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:root{--tet-link-color:var(--tc-text-primary);--tet-link-color-hover:var(--tc-text-secondary);--tet-link-color-active:var(--tc-text-tertiary);--tet-link-color-focus:var(--tc-blue-40);--tet-link-color-disabled:var(--tc-button-text-inverse-disabled);--tet-link-secondary-color:var(--tc-text-secondary);--tet-link-secondary-color-hover:var(--tc-text-primary)}.tet-link,.tet-link__arrow{text-decoration:underline;color:var(--tet-link-color);position:relative;line-height:1.5rem;cursor:pointer}.tet-link.dark,.tet-link__arrow.dark{--tet-link-color:var(--tc-text-primary-dark);--tet-link-color-hover:var(--tc-text-secondary-dark);--tet-link-color-active:var(--tc-text-tertiary-dark);--tet-link-color-focus:var(--tc-blue-40-dark);--tet-link-color-disabled:var(--tc-button-text-inverse-disabled-dark);--tet-link-secondary-color:var(--tc-text-secondary-dark);--tet-link-secondary-color-hover:var(--tc-text-primary-dark)}.tet-link.tet-link--secondary,.tet-link__arrow.tet-link--secondary{--tet-link-color:var(--tet-link-secondary-color);--tet-link-color-hover:var(--tet-link-secondary-color-hover)}.tet-link tet-icon,.tet-link__arrow tet-icon{--icon-color:var(--tet-link-color)}.tet-link:hover,.tet-link__arrow:hover{color:var(--tet-link-color-hover)}.tet-link:hover tet-icon,.tet-link__arrow:hover tet-icon{--icon-color:var(--tet-link-color-hover)}.tet-link:active,.tet-link__arrow:active{color:var(--tet-link-color-active)}.tet-link:active tet-icon,.tet-link__arrow:active tet-icon{--icon-color:var(--tet-link-color-active)}.tet-link:focus-visible,.tet-link__arrow:focus-visible{outline:0.125rem solid var(--tc-blue-40);outline-offset:0.125rem;transition:outline 0s;outline-color:var(--tet-link-color-focus);border-radius:0.125rem}.tet-link.disabled,.tet-link__arrow.disabled{color:var(--tet-link-color-disabled);pointer-events:none;cursor:auto}.tet-link.disabled tet-icon,.tet-link__arrow.disabled tet-icon{--icon-color:var(--tet-link-color-disabled)}.tet-link.disabled:focus-visible,.tet-link__arrow.disabled:focus-visible{outline:none}.tet-link tet-icon,.tet-link__arrow tet-icon{padding-left:0.25rem;padding-right:0.25rem;--icon-container-display:inline-block}.tet-link__arrow{padding-right:1.5rem}.tet-link__arrow::after{content:\"-->\";position:absolute;white-space:nowrap;display:inline-block;text-decoration:none;padding-left:0.25rem;letter-spacing:initial;transition:all 0.15s ease-in}.tet-link__arrow:hover::after{padding-left:0.375rem}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{display:block;--b2b-card-background-color:var(--tc-layer-primary);--b2b-card-text-color:var(--tc-text-primary);--b2b-card-details-background-color:var(--tc-layer-secondary);--b2b-card-details-old-price-text-color:var(--tc-text-secondary);--b2b-card-border-color:var(--tc-border-quaternary);--b2b-card-border-slim-color:var(--tc-border-tertiary);--b2b-card-selected-border-color:var(--tc-border-primary);--b2b-card-box-shadow:var(--tc-elevation-one);--b2b-card-selected-box-shadow:var(--tc-elevation-two);--b2b-card-badge-color:var(--tc-yellow-40)}.dark{--b2b-card-background-color:var(--tc-layer-primary-dark);--b2b-card-text-color:var(--tc-text-primary-dark);--b2b-card-details-background-color:var(--tc-layer-secondary-dark);--b2b-card-details-old-price-text-color:var(--tc-text-secondary-dark);--b2b-card-border-color:var(--tc-border-quaternary-dark);--b2b-card-border-slim-color:var(--tc-border-tertiary-dark);--b2b-card-selected-border-color:var(--tc-border-primary-dark);--b2b-card-box-shadow:var(--tc-elevation-one-dark);--b2b-card-selected-box-shadow:var(--tc-elevation-two-dark);--b2b-card-badge-color:var(--tc-yellow-40-dark)}.divider{border-top:0;border-bottom:0.0625rem solid var(--b2b-card-border-color)}.divider--slim{border-bottom:0.03125rem solid var(--b2b-card-border-slim-color)}.sr-only{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}.card{box-sizing:border-box;overflow:hidden;color:var(--b2b-card-text-color);background-color:var(--b2b-card-background-color);border:0.0625rem solid var(--b2b-card-border-color);border-radius:1rem;box-shadow:var(--b2b-card-box-shadow)}.card__wrapper{position:relative;margin-top:0.5rem}.card__badge{position:absolute;top:0;left:50%;transform:translateY(-50%) translateX(-50%);color:var(--b2b-card-text-color);background-color:var(--b2b-card-badge-color);padding:0.375rem 1.25rem;box-shadow:var(--b2b-card-selected-box-shadow);border-radius:6.25rem;width:fit-content;font:600 0.75rem/1rem \"Inter\", \"Gilroy, Arial, sans-serif\";white-space:nowrap}.card__badge--is-tablet{left:1.5rem;transform:translateY(-50%) translateX(0)}.card:focus-visible{outline:0.125rem solid var(--tc-blue-40);outline-offset:0.125rem;transition:outline 0s}.card.dark:focus-visible{outline:0.125rem solid var(--tc-blue-40);outline:0.125rem solid var(--tc-blue-40-dark);outline-offset:0.125rem;transition:outline 0s}.card--selected{border-width:0.125rem;border-color:var(--b2b-card-selected-border-color);box-shadow:var(--b2b-card-selected-box-shadow)}.offer{padding:1rem;cursor:pointer}.offer--is-tablet{padding:1.5rem}.offer__header{margin-bottom:0.75rem}.offer__top-info{display:flex;flex-direction:column}.offer__top-info--is-tablet{flex-direction:row;justify-content:space-between}.offer__title{font:500 1.125rem/1.75rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.offer__title--is-tablet{font:500 1.25rem/1.5rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.offer__price{font:500 1rem/1.5rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.offer__price--is-tablet{font:500 1.25rem/1.5rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.offer__price-suffix{font:500 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.offer__price-suffix--is-tablet{font:600 1rem/1.5rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.offer__subtitle{font:400 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.offer__subtitle--is-tablet{font:500 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.offer__benefits{display:block;margin-top:0.75rem;--text-list-gap:0.25rem;--text-list-padding-left:1rem;--text-list-icon-size:1rem;--text-list-icon-line-height:1.25rem}.offer__benefits::part(list-element){font:400 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.offer__contract-link{font:400 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\";margin-top:0.5rem}.details{background-color:var(--b2b-card-details-background-color);padding:1rem}.details--is-tablet{padding:1rem 1.5rem 1.5rem 1.5rem}.details__price-block{font:500 1rem/1.5rem \"Inter\", \"Gilroy, Arial, sans-serif\";display:flex;justify-content:space-between;margin:0.75rem 0}.details__price-block--is-tablet{margin-bottom:1rem}.details__total{display:flex;flex-direction:column;align-items:flex-end}.details__total--current{white-space:nowrap}.details__total--original{font:400 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\";color:var(--b2b-card-details-old-price-text-color);text-decoration-line:line-through;white-space:nowrap}.details__actions{margin-top:0.75rem;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.details__actions--is-tablet{margin-top:1rem;flex-direction:row;align-items:flex-end}.details__quantity-control{display:flex;flex-direction:column;gap:0.25rem}.details__quantity-label{font:500 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\";text-align:center}.details__quantity-counter{--stepper-input-control-background-color:var(--tc-background-primary);display:block;margin-bottom:1rem}.details__quantity-counter--is-tablet{margin-bottom:0}.details__submit-button{--button-padding-medium:0.625rem 1rem}";
|
|
165
|
+
const TetB2bCompareCardStyle0 = tetB2bCompareCardCss;
|
|
166
|
+
|
|
167
|
+
/** Custom breakpoint for component, requested by designers to be different than usual 360, 768, 1440 */
|
|
168
|
+
const CUSTOM_BREAKPOINT = 422;
|
|
169
|
+
const TetB2bCompareCard = class {
|
|
170
|
+
constructor(hostRef) {
|
|
171
|
+
registerInstance(this, hostRef);
|
|
172
|
+
this.countChange = createEvent(this, "countChange", 7);
|
|
173
|
+
this.selectedChange = createEvent(this, "selectedChange", 7);
|
|
174
|
+
/** @private The suffix for the price displayed - "€/mēn."). */
|
|
175
|
+
this.priceSuffix = '€/mēn.';
|
|
176
|
+
/**
|
|
177
|
+
* @private Initializes localCount based on options.counterOptions.defaultValue or defaults to 1.
|
|
178
|
+
*/
|
|
179
|
+
this.initCount = () => {
|
|
180
|
+
var _a, _b, _c;
|
|
181
|
+
this.localCount = (_c = (_a = this.count) !== null && _a !== void 0 ? _a : (_b = this.options.counterOptions) === null || _b === void 0 ? void 0 : _b.defaultValue) !== null && _c !== void 0 ? _c : 1;
|
|
182
|
+
};
|
|
183
|
+
/**
|
|
184
|
+
* @private Updates localCount and emits the countChange event.
|
|
185
|
+
* @param newCount - The new count value to be emitted.
|
|
186
|
+
*/
|
|
187
|
+
this.updateCountAndEmit = (newCount) => {
|
|
188
|
+
if (typeof newCount === 'number') {
|
|
189
|
+
this.localCount = newCount;
|
|
190
|
+
}
|
|
191
|
+
this.countChange.emit({ cardId: this.options.id, count: newCount });
|
|
192
|
+
};
|
|
193
|
+
/**
|
|
194
|
+
* @private Handles the card click event, setting localIsSelected to true and emitting selectedChange.
|
|
195
|
+
*/
|
|
196
|
+
this.handleSelect = (e) => {
|
|
197
|
+
const isLinkOrDescendant = e.target.closest('a');
|
|
198
|
+
if (isLinkOrDescendant) {
|
|
199
|
+
return;
|
|
200
|
+
}
|
|
201
|
+
if (!this.localIsSelected) {
|
|
202
|
+
this.localIsSelected = true;
|
|
203
|
+
this.selectedChange.emit(true);
|
|
204
|
+
}
|
|
205
|
+
};
|
|
206
|
+
/**
|
|
207
|
+
* @private Handles the value change event from the nested tet-stepper-input component.
|
|
208
|
+
* @param detail - The event containing the new quantity value.
|
|
209
|
+
*/
|
|
210
|
+
this.handleCounterValueChange = ({ detail }) => {
|
|
211
|
+
if (this.added) {
|
|
212
|
+
this.updateCountAndEmit(detail);
|
|
213
|
+
}
|
|
214
|
+
else {
|
|
215
|
+
this.localCount = detail;
|
|
216
|
+
}
|
|
217
|
+
};
|
|
218
|
+
/**
|
|
219
|
+
* @private Handles the "Add to Basket" action, stops event propagation, and emits the new count.
|
|
220
|
+
* @param e - The DOM event.
|
|
221
|
+
*/
|
|
222
|
+
this.handleAdd = (e) => {
|
|
223
|
+
e.stopPropagation();
|
|
224
|
+
this.updateCountAndEmit(this.localCount);
|
|
225
|
+
};
|
|
226
|
+
/**
|
|
227
|
+
* @private Handles the "Remove from Basket" action, stops event propagation, and emits a null count.
|
|
228
|
+
* @param e - The DOM event.
|
|
229
|
+
*/
|
|
230
|
+
this.handleRemove = (e) => {
|
|
231
|
+
e.stopPropagation();
|
|
232
|
+
this.updateCountAndEmit(null);
|
|
233
|
+
};
|
|
234
|
+
this.localCount = 0;
|
|
235
|
+
this.localIsSelected = false;
|
|
236
|
+
this.isTablet = false;
|
|
237
|
+
this.theme = 'light';
|
|
238
|
+
this.options = undefined;
|
|
239
|
+
this.count = undefined;
|
|
240
|
+
this.isSelected = false;
|
|
241
|
+
}
|
|
242
|
+
/**
|
|
243
|
+
* @private Signals whether the item is currently considered "added" to the cart.
|
|
244
|
+
* Derived from the external 'count' prop being a defined number.
|
|
245
|
+
*/
|
|
246
|
+
get added() {
|
|
247
|
+
return this.count !== null && this.count !== undefined;
|
|
248
|
+
}
|
|
249
|
+
/**
|
|
250
|
+
* @watch syncCount
|
|
251
|
+
* Synchronizes the internal count state with the external 'count' property.
|
|
252
|
+
*/
|
|
253
|
+
syncCount(newCount) {
|
|
254
|
+
if (typeof newCount !== 'number') {
|
|
255
|
+
this.initCount();
|
|
256
|
+
}
|
|
257
|
+
else if (this.localCount !== newCount) {
|
|
258
|
+
this.localCount = newCount;
|
|
259
|
+
}
|
|
260
|
+
}
|
|
261
|
+
/**
|
|
262
|
+
* @watch syncSelected
|
|
263
|
+
* Synchronizes the internal selection state with the external 'isSelected' property.
|
|
264
|
+
*/
|
|
265
|
+
syncSelected(newSelected) {
|
|
266
|
+
if (this.localIsSelected !== newSelected) {
|
|
267
|
+
this.localIsSelected = newSelected;
|
|
268
|
+
}
|
|
269
|
+
}
|
|
270
|
+
componentWillLoad() {
|
|
271
|
+
this.initCount();
|
|
272
|
+
processTranslations('tet-components', 'lv').then(() => forceUpdate(this));
|
|
273
|
+
}
|
|
274
|
+
componentDidLoad() {
|
|
275
|
+
this.resizeObserver = new ResizeObserver((entries) => {
|
|
276
|
+
for (let entry of entries) {
|
|
277
|
+
this.isTablet = entry.contentRect.width > CUSTOM_BREAKPOINT;
|
|
278
|
+
}
|
|
279
|
+
});
|
|
280
|
+
this.resizeObserver.observe(this.hostElement);
|
|
281
|
+
}
|
|
282
|
+
disconnectedCallback() {
|
|
283
|
+
if (this.resizeObserver) {
|
|
284
|
+
this.resizeObserver.unobserve(this.hostElement);
|
|
285
|
+
this.resizeObserver.disconnect();
|
|
286
|
+
}
|
|
287
|
+
}
|
|
288
|
+
render() {
|
|
289
|
+
const { localIsSelected, localCount, options, priceSuffix } = this;
|
|
290
|
+
const { title, subtitle, isBestChoice, price, discountPrice, benefits, contract } = options;
|
|
291
|
+
const currentPrice = discountPrice !== null && discountPrice !== void 0 ? discountPrice : price;
|
|
292
|
+
const currentTotal = (localCount * currentPrice).toFixed(2);
|
|
293
|
+
const oldTotal = (localCount * price).toFixed(2);
|
|
294
|
+
const detailsId = `details-${options.id}`;
|
|
295
|
+
const titleId = `title-${options.id}`;
|
|
296
|
+
return (h(Host, { key: 'fb55819189417025a6ff7b17d927e82c0884bdab' }, h("div", { key: '01f724dcd984957286c3f4bbcd648c5a6cf5ac2d', class: { card__wrapper: isBestChoice } }, isBestChoice && (h("div", { key: 'bbfe753f9cda625a3722f92037dcfed2f71d69fd', class: { 'card__badge': true, 'card__badge--is-tablet': this.isTablet } }, translate('components-b2b-configurator-best-choice'))), h("div", Object.assign({ key: 'aa3ccc968da6e0c1c4d02dc707fa1fbb812f900a', class: { 'card': true, [`${this.theme}`]: true, 'card--selected': !!this.count || localIsSelected }, onClick: this.handleSelect, onKeyDown: a11yBtnClick, tabindex: 0, role: "button", "aria-expanded": localIsSelected }, (localIsSelected ? { 'aria-controls': detailsId } : {}), { "aria-labelledby": titleId }), h("section", { key: '7476d69d4f4420e2e7b7cefcdcf6bebac2f25a4b', class: { 'offer': true, 'offer--is-tablet': this.isTablet } }, h("div", { key: '5f87e22fad55417f0e24146452ee8f32c97c0bc7', class: "offer__header" }, h("div", { key: 'e43787318e1614bc0e77e3a0ef2623a9cf719763', class: { 'offer__top-info': true, 'offer__top-info--is-tablet': this.isTablet } }, h("h3", { key: '4e2b8e30f85bc06d7a6d5b3e4daec545371b78d2', id: titleId, class: { 'offer__title': true, 'offer__title--is-tablet': this.isTablet } }, title), h("p", { key: '5e0c24d0241c18265d8da5749e898593129a4704', class: { 'offer__price': true, 'offer__price--is-tablet': this.isTablet } }, currentPrice.toFixed(2), h("span", { key: '15bc9de1a1901e014f5a12a85459b73f563074e5', class: { 'offer__price-suffix': true, 'offer__price-suffix--is-tablet': this.isTablet } }, ' ', priceSuffix))), h("p", { key: '1041721fb0184c6aaaaed79b4342cd5cbf4e0017', class: { 'offer__subtitle': true, 'offer__subtitle--is-tablet': this.isTablet } }, subtitle)), h("hr", { key: '06f9409be9d38b1ad78fcc53955b7d2442bca705', class: "divider divider--slim" }), h("tet-text-list", { key: '62e1134e4c2b81b9fe7fa63ee9e1b8361bc02bba', class: "offer__benefits", withIcon: true, listIcon: "tc-check", theme: this.theme }, benefits.map((benefit) => (h("span", null, benefit)))), contract && (h("div", { key: '198033d65a045b5f86a7cf19af61c561878e75c4', class: "offer__contract-link" }, h("a", { key: 'fdadb062000c966fb74448598a64168e74f9ef3c', class: { 'tet-link': true, [`${this.theme}`]: true }, href: contract, target: "_blank", rel: "noopener noreferrer" }, translate('components-b2b-configurator-contract-link-label'), h("span", { key: '4fe62cfffacffb72ae643c178467d68377ede1e8', class: "sr-only" }, translate('components-a11y-open-link-in-new-window')))))), localIsSelected && [
|
|
297
|
+
h("hr", { key: 'a64e7735051ebaf4d71615424c27efa9e1522d09', class: "divider" }),
|
|
298
|
+
h("section", { key: 'bd9b08db0cedb3b7db817a2e47f22e0f9db2cefd', id: detailsId, role: "region", "aria-labelledby": titleId, class: { 'details': true, 'details--is-tablet': this.isTablet } }, h("div", { key: '071fbab6effb78d29ff61085bf186a56cc8c36d8', class: { 'details__price-block': true, 'details__price-block--is-tablet': this.isTablet } }, h("span", { key: 'fa3ad81e00ee95f40e5b4911c4e6ad5cd9f3018d' }, translate('components-b2b-configurator-monthly-payment')), h("div", { key: 'a4df44748dfb186c8856a86a6c7f94717cd4ca8f', class: "details__total", "aria-live": "polite" }, h("span", { key: '708ba62b224b9bb6ea8b9694d2323d62b4eb1c88', class: "details__total--current" }, currentTotal, " ", priceSuffix), discountPrice != null && discountPrice < price && (h("span", { key: '96eff36c03696428121d24dc15425abf2df4bd63', class: "details__total--original" }, oldTotal, " ", priceSuffix)))), h("hr", { key: 'dbaa718231ffe98e0d682d80d6219c5e9766c69c', class: "divider" }), h("div", { key: 'e0f6274142eda6333e2f4d73bc27a163c60da851', class: { 'details__actions': true, 'details__actions--is-tablet': this.isTablet } }, h("div", { key: '352a4b8dfd2e9e21bc8cbe715cae8ed323000517', class: "details__quantity-control" }, options.counterOptions && [
|
|
299
|
+
h("span", { key: 'd76ffb6018acad5bb3ad809a578bb0a7870e0eb9', id: `qty-label-${options.id}`, class: "details__quantity-label" }, translate(options.counterOptions.label)),
|
|
300
|
+
h("tet-stepper-input", { key: '8cd79acb5ccae250696a99322b4889d0859ec990', class: {
|
|
301
|
+
'details__quantity-counter': true,
|
|
302
|
+
'details__quantity-counter--is-tablet': this.isTablet
|
|
303
|
+
}, onInputValueChanged: this.handleCounterValueChange, value: localCount, min: options.counterOptions.minValue, max: options.counterOptions.maxValue, step: 1, theme: this.theme, accessibilityLabel: translate(options.counterOptions.label), "aria-labelledby": `qty-label-${options.id}` })
|
|
304
|
+
]), h("tet-button", { key: 'b489683309f7d85209216d267a086d05e3e89832', class: "details__submit-button", onClick: this.added ? this.handleRemove : this.handleAdd, size: "medium", type: this.added ? 'secondary' : 'primary', theme: this.theme, iconName: this.added ? 'tc-trash' : 'tc-cart-outline', iconPosition: "left" }, this.added
|
|
305
|
+
? translate('components-b2b-configurator-remove-from-basket')
|
|
306
|
+
: translate('components-b2b-configurator-add-to-basket'))))
|
|
307
|
+
]))));
|
|
308
|
+
}
|
|
309
|
+
get hostElement() { return getElement(this); }
|
|
310
|
+
static get watchers() { return {
|
|
311
|
+
"count": ["syncCount"],
|
|
312
|
+
"isSelected": ["syncSelected"]
|
|
313
|
+
}; }
|
|
314
|
+
};
|
|
315
|
+
TetB2bCompareCard.style = TetB2bCompareCardStyle0;
|
|
316
|
+
|
|
317
|
+
const tetB2bConfiguratorCartCss = "@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{display:block}.light{--b2b-cart-text-color:var(--tc-text-primary);--b2b-cart-text-color-secondary:var(--tc-text-secondary);--b2b-cart-background-color:var(--tc-layer-primary);--b2b-cart-box-shadow:var(--tc-elevation-one);--b2b-cart-border-color:var(--tc-border-quaternary);--b2b-cart-block-color:var(--tc-layer-secondary);--b2b-cart-block-details-color:var(--tc-layer-tertiary);--b2b-cart-summary-accent-color:var(--tc-yellow-20);--elevation-six-layer-1-color:rgba(12, 12, 14, 0.06);--b2b-cart-sticky-box-shadow:0 0 4px 0 rgba(12, 12, 14, 0.04), 0 -10px 15px 0 rgba(12, 12, 14, 0.12)}.light.checkout{--b2b-cart-background-color:var(--tc-layer-secondary);--b2b-cart-block-color:var(--tc-layer-tertiary);--b2b-cart-block-details-color:var(--tc-layer-quaternary);--b2b-cart-box-shadow:none}.dark{--b2b-cart-text-color:var(--tc-text-primary-dark);--b2b-cart-text-color-secondary:var(--tc-text-secondary-dark);--b2b-cart-background-color:var(--tc-layer-primary-dark);--b2b-cart-box-shadow:var(--tc-elevation-one-dark);--b2b-cart-border-color:var(--tc-border-quaternary-dark);--b2b-cart-block-color:var(--tc-layer-secondary-dark);--b2b-cart-block-details-color:var(--tc-layer-tertiary-dark);--b2b-cart-summary-accent-color:var(--tc-grey-20-dark);--elevation-six-layer-1-color:rgba(12, 12, 14, 0.20);--b2b-cart-sticky-box-shadow:0 0 4px 0 rgba(12, 12, 14, 0.2), 0 -10px 15px 0 rgba(12, 12, 14, 0.33)}.dark.checkout{--b2b-cart-background-color:var(--tc-layer-secondary-dark);--b2b-cart-block-color:var(--tc-layer-tertiary-dark);--b2b-cart-block-details-color:var(--tc-layer-quaternary-dark);--b2b-cart-box-shadow:none}.cart{color:var(--b2b-cart-text-color);display:flex;flex:auto;flex-direction:column;height:fit-content;border-radius:1rem;background:var(--b2b-cart-background-color);box-shadow:var(--b2b-cart-box-shadow)}.cart--sticky{--b2b-cart-box-shadow:var(--b2b-cart-sticky-box-shadow);border-radius:1rem 1rem 0 0}.cart__accordion{--accordion-border-radius:1rem 1rem 0 0;--accordion-header-padding:1rem 1.5rem;--accordion-header-mobile-padding:1rem;--accordion-header-font:600 1rem/1.5rem Inter, Gilroy, Arial, sans-serif}@media screen and (min-width: 48rem){.cart__accordion--closed{--accordion-header-padding:1rem 1.5rem 0.5rem 1.5rem}}@media screen and (min-width: 64rem){.cart__accordion--edit{--accordion-header-display:none}}.cart__accordion--checkout{--accordion-header-padding:1rem}@media screen and (min-width: 48rem){.cart__accordion--checkout{--accordion-header-padding:1rem 1.5rem}}@media screen and (min-width: 64rem){.cart__accordion--checkout{--accordion-header-padding:1.5rem}}.cart__accordion--rounded{--accordion-border-radius:1rem}.cart__accordion--empty{--accordion-border-radius:1rem}.cart__title--edit{display:none}@media screen and (min-width: 64rem){.cart__title--edit{display:block;padding:1.5rem 1.5rem 1rem 1.5rem;border-bottom:0.0625rem solid var(--b2b-cart-border-color);align-self:stretch;font:600 1.125rem/1.75rem \"Inter\", \"Gilroy, Arial, sans-serif\"}}.cart__title--checkout{display:none}.cart__content{display:flex;flex-direction:column;gap:1rem;padding:1rem 1.5rem;border-color:var(--b2b-cart-border-color);border-top-style:solid;border-top-width:0.0625rem}.block{--accordion-border-radius:0.5rem;--accordion-background-color:var(--b2b-cart-block-color);--accordion-header-padding:1rem 1rem 0.75rem 1rem;--accordion-header-mobile-padding:1rem 1rem 0.75rem 1rem;--accordion-header-font:600 0.875rem/1.25rem Inter, Gilroy, Arial, sans-serif}.block__wrapper{border-radius:0.5rem;border:0.0625rem solid var(--b2b-cart-border-color);background-color:var(--b2b-cart-block-color)}@media screen and (min-width: 48rem){.block{--accordion-header-padding:1rem;--accordion-header-mobile-padding:1rem;--accordion-header-font:600 1rem/1.5rem Inter, Gilroy, Arial, sans-serif}}.block__header{display:flex;flex-direction:column;flex:auto;gap:0.5rem}.block__header-row{display:flex;justify-content:space-between}.block__header-amount{text-align:end}.block__header-details{font:500 0.75rem/1rem \"Inter\", \"Gilroy, Arial, sans-serif\";background:var(--b2b-cart-block-details-color);padding:0.25rem 0.5rem;border-radius:1.375rem}.block__header-indicator{display:flex;gap:0.25rem;align-items:center;font:400 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\"}@media screen and (min-width: 48rem){.block__header-indicator{font:400 1rem/1.5rem \"Inter\", \"Gilroy, Arial, sans-serif\"}}.block__header-icon{--icon-size:1.25rem;--icon-container-display:flex}.empty-cart{display:flex;flex-direction:column;align-items:center}.empty-cart__icon{margin-bottom:0.5rem;--icon-size:3rem}.empty-cart__title{font:500 1rem/1.5rem \"Inter\", \"Gilroy, Arial, sans-serif\";text-align:center}.empty-cart__description{color:var(--b2b-cart-text-color-secondary);font:400 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.summary{display:flex;flex-direction:column;padding:1rem 1rem 1.5rem;border-color:var(--b2b-cart-border-color);border-top-style:solid;border-top-width:0.0625rem}@media screen and (min-width: 48rem){.summary{padding:1rem 1.5rem 1.5rem}}@media screen and (min-width: 64rem){.summary{box-shadow:0 -6px 12px 0 var(--elevation-six-layer-1-color)}}@media screen and (min-width: 48rem){.summary--closed{padding:0 1.5rem 1rem 1.5rem;border:none;box-shadow:none}}.summary__notification{margin-bottom:1rem}.summary__savings{padding:0.5rem;margin-bottom:1rem;display:flex;justify-content:space-between;gap:0.5rem;border-radius:0.5rem;background-color:var(--b2b-cart-summary-accent-color);font:500 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.summary__savings-amount{text-align:end}.summary__monthly-payment{margin-bottom:1rem;display:flex;justify-content:space-between;gap:0.5rem;font:500 1.125rem/1.75rem \"Inter\", \"Gilroy, Arial, sans-serif\"}@media screen and (min-width: 48rem){.summary__monthly-payment{margin-bottom:1.5rem}}@media screen and (min-width: 64rem){.summary__monthly-payment{margin-bottom:1rem;font:500 1.25rem/1.5rem \"Gilroy\", \"Gilroy, Arial, sans-serif\"}}.summary__monthly-payment:last-child{margin-bottom:0}.summary__monthly-price{display:flex;flex-direction:column;align-items:flex-end;white-space:nowrap}.summary__monthly-price-disclosure{color:var(--b2b-cart-text-color-secondary);font:400 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\"}";
|
|
318
|
+
const TetB2bConfiguratorCartStyle0 = tetB2bConfiguratorCartCss;
|
|
319
|
+
|
|
320
|
+
const TetB2bConfiguratorCart = class {
|
|
321
|
+
constructor(hostRef) {
|
|
322
|
+
registerInstance(this, hostRef);
|
|
323
|
+
/** @private The suffix for the price displayed - "€/mēn."). */
|
|
324
|
+
this.priceSuffix = '€/mēn.';
|
|
325
|
+
this.addStickyClassConditionally = () => {
|
|
326
|
+
if (this.context === 'checkout') {
|
|
327
|
+
return;
|
|
328
|
+
}
|
|
329
|
+
const rect = this.hostElement.getBoundingClientRect();
|
|
330
|
+
const { bottom, top } = rect;
|
|
331
|
+
const isTopVisible = top < window.innerHeight && top;
|
|
332
|
+
const isBottomVisible = bottom < window.innerHeight && bottom;
|
|
333
|
+
if (isTopVisible && !isBottomVisible && !this.isDesktopResolution) {
|
|
334
|
+
this.cartEl.classList.add('cart--sticky');
|
|
335
|
+
}
|
|
336
|
+
else {
|
|
337
|
+
this.cartEl.classList.remove('cart--sticky');
|
|
338
|
+
}
|
|
339
|
+
};
|
|
340
|
+
/**
|
|
341
|
+
* Updates `primarySlotFilled` or `secondarySlotFilled` based on assigned slot elements.
|
|
342
|
+
* @param e The slotchange event.
|
|
343
|
+
*/
|
|
344
|
+
this.handleSlotChanged = (e) => {
|
|
345
|
+
const slot = e.target;
|
|
346
|
+
const slotName = slot.name;
|
|
347
|
+
if (slotName === 'primary') {
|
|
348
|
+
this.primarySlotFilled = slot.assignedElements().length !== 0;
|
|
349
|
+
}
|
|
350
|
+
else {
|
|
351
|
+
this.secondarySlotFilled = slot.assignedElements().length !== 0;
|
|
352
|
+
}
|
|
353
|
+
};
|
|
354
|
+
/**
|
|
355
|
+
* Handler for all accordion open state changes.
|
|
356
|
+
* Uses element reference checking to correctly distinguish between nested components (lower events bubble up).
|
|
357
|
+
* @param e The CustomEvent containing the new open state.
|
|
358
|
+
*/
|
|
359
|
+
this.handleAccordionChanged = (e) => {
|
|
360
|
+
const targetEl = e.target;
|
|
361
|
+
const isOpen = e.detail;
|
|
362
|
+
if (targetEl === this.accordionEl) {
|
|
363
|
+
this.isAccordionOpen = e.detail;
|
|
364
|
+
return;
|
|
365
|
+
}
|
|
366
|
+
if (targetEl === this.primaryBlockEl) {
|
|
367
|
+
this.isPrimaryBlockOpen = isOpen;
|
|
368
|
+
return;
|
|
369
|
+
}
|
|
370
|
+
if (targetEl === this.secondaryBlockEl) {
|
|
371
|
+
this.isSecondaryBlockOpen = isOpen;
|
|
372
|
+
return;
|
|
373
|
+
}
|
|
374
|
+
};
|
|
375
|
+
/** Renders the empty cart content placeholder. */
|
|
376
|
+
this.renderEmptyContent = () => {
|
|
377
|
+
return (h("div", { class: "empty-cart" }, h("tet-icon", { class: "empty-cart__icon", name: "tc-empty", theme: this.theme }), h("div", { class: "empty-cart__title" }, translate('components-b2b-cart-empty-title')), h("div", { class: "empty-cart__description" }, translate('components-b2b-cart-empty-description'))));
|
|
378
|
+
};
|
|
379
|
+
/** Renders the two inner service accordions based on slot content. */
|
|
380
|
+
this.renderContent = () => {
|
|
381
|
+
const blocks = [
|
|
382
|
+
{ name: translate('components-b2b-cart-primary-service-title'), type: 'primary' },
|
|
383
|
+
{ name: translate('components-b2b-cart-secondary-service-title'), type: 'secondary' }
|
|
384
|
+
];
|
|
385
|
+
const content = blocks.map((block) => {
|
|
386
|
+
const isPrimary = block.type === 'primary';
|
|
387
|
+
const blockOpen = isPrimary ? this.isPrimaryBlockOpen : this.isSecondaryBlockOpen;
|
|
388
|
+
const slotFilled = isPrimary ? this.primarySlotFilled : this.secondarySlotFilled;
|
|
389
|
+
const amount = isPrimary ? this.data.primaryAmount : this.data.secondaryAmount;
|
|
390
|
+
const count = isPrimary ? this.data.primaryCount : this.data.secondaryCount;
|
|
391
|
+
const countValue = count % 10 === 1 && count !== 11
|
|
392
|
+
? translate('components-b2b-cart-service-singular')
|
|
393
|
+
: translate('components-b2b-cart-service-plural');
|
|
394
|
+
const refCallback = (el) => {
|
|
395
|
+
if (block.type === 'primary') {
|
|
396
|
+
this.primaryBlockEl = el;
|
|
397
|
+
}
|
|
398
|
+
else {
|
|
399
|
+
this.secondaryBlockEl = el;
|
|
400
|
+
}
|
|
401
|
+
};
|
|
402
|
+
return (h("div", { hidden: !slotFilled, class: "block__wrapper" }, h("tet-accordion", { ref: refCallback, key: block.type, class: "block", isOpen: blockOpen, header: block.name, theme: this.theme, transparentBackground: true }, h("div", { slot: "header", class: "block__header" }, h("div", { class: "block__header-row" }, block.name, " ", h("span", { class: "block__header-amount" }, `${amount} ${this.priceSuffix}`)), h("div", { class: "block__header-row" }, h("div", { class: "block__header-details" }, `${count} ${countValue}`), h("div", { class: "block__header-indicator" }, blockOpen ? translate('components-b2b-cart-accordion-less') : translate('components-b2b-cart-accordion-more'), h("tet-icon", { class: "block__header-icon", name: `chevron-${blockOpen ? 'up' : 'down'}`, theme: this.theme })))), h("slot", { onSlotchange: this.handleSlotChanged, name: block.type }))));
|
|
403
|
+
});
|
|
404
|
+
return content;
|
|
405
|
+
};
|
|
406
|
+
/** Renders the cart summary, including notifications and financial details. */
|
|
407
|
+
this.renderSummary = () => {
|
|
408
|
+
const { summarySavings, summaryAmount, hasPrimaryNotification, hasSecondaryNotification } = this.data;
|
|
409
|
+
return (h("div", { class: { 'summary': true, 'summary--closed': !this.isAccordionOpen } }, hasPrimaryNotification && (h("tet-notification", { class: "summary__notification", type: "warning", headerTitle: translate('components-b2b-cart-primary-notification-title'), content: translate('components-b2b-cart-primary-notification-description'), allowClose: false, theme: this.theme, icon: null })), hasSecondaryNotification && (h("tet-notification", { class: "summary__notification", type: "neutral", headerTitle: translate('components-b2b-cart-secondary-notification-title'), content: translate('components-b2b-cart-secondary-notification-description'), allowClose: false, theme: this.theme })), this.isAccordionOpen && (h("div", { class: "summary__savings" }, translate('components-b2b-cart-savings-title'), h("span", { class: "summary__savings-amount" }, " ", `${summarySavings} ${this.priceSuffix}`))), h("div", { class: "summary__monthly-payment" }, translate('components-b2b-cart-monthly-payment-title'), h("div", { class: "summary__monthly-price" }, `${summaryAmount} ${this.priceSuffix}`, h("span", { class: "summary__monthly-price-disclosure" }, ' ', translate('components-b2b-cart-monthly-payment-disclosure'), ' '))), this.isAccordionOpen && h("slot", { name: "cta" })));
|
|
410
|
+
};
|
|
411
|
+
this.theme = 'light';
|
|
412
|
+
this.data = undefined;
|
|
413
|
+
this.isCartEmpty = true;
|
|
414
|
+
this.context = 'edit';
|
|
415
|
+
this.isDesktopResolution = true;
|
|
416
|
+
this.isAccordionOpen = this.isDesktopResolution && this.context === 'edit';
|
|
417
|
+
this.isPrimaryBlockOpen = this.isDesktopResolution;
|
|
418
|
+
this.isSecondaryBlockOpen = this.isDesktopResolution;
|
|
419
|
+
this.primarySlotFilled = false;
|
|
420
|
+
this.secondarySlotFilled = false;
|
|
421
|
+
}
|
|
422
|
+
/**
|
|
423
|
+
* Imperatively opens the main accordion when transitioning to desktop in 'edit' context.
|
|
424
|
+
* Adds/removes sticky class on `isDesktopResolution` prop change
|
|
425
|
+
* @param isDesktop The new resolution state.
|
|
426
|
+
*/
|
|
427
|
+
openAccordionOnResolutionChange(isDesktop) {
|
|
428
|
+
if (isDesktop && this.accordionEl && this.context === 'edit') {
|
|
429
|
+
this.accordionEl.open();
|
|
430
|
+
}
|
|
431
|
+
this.addStickyClassConditionally();
|
|
432
|
+
}
|
|
433
|
+
/**
|
|
434
|
+
* Adds/removes sticky class on `isCartEmpty` prop change
|
|
435
|
+
*/
|
|
436
|
+
checkStickyClassOnCartEmptyChange() {
|
|
437
|
+
this.addStickyClassConditionally();
|
|
438
|
+
}
|
|
439
|
+
componentWillLoad() {
|
|
440
|
+
processTranslations('tet-components', 'lv').then(() => forceUpdate(this));
|
|
441
|
+
}
|
|
442
|
+
/**
|
|
443
|
+
* Initiates observer to check when cart sticks to bottom
|
|
444
|
+
*/
|
|
445
|
+
async componentDidLoad() {
|
|
446
|
+
this.cartObserver = new IntersectionObserver(this.addStickyClassConditionally, {
|
|
447
|
+
rootMargin: `0px 0px 0px 0px`,
|
|
448
|
+
root: document,
|
|
449
|
+
threshold: 1
|
|
450
|
+
});
|
|
451
|
+
this.cartObserver.observe(this.hostElement);
|
|
452
|
+
}
|
|
453
|
+
/** Clean up listeners/observers */
|
|
454
|
+
disconnectedCallback() {
|
|
455
|
+
if (this.cartObserver) {
|
|
456
|
+
this.cartObserver.disconnect();
|
|
457
|
+
}
|
|
458
|
+
}
|
|
459
|
+
/**
|
|
460
|
+
* Changes block accordion state to open|close
|
|
461
|
+
* @param category
|
|
462
|
+
* @param state
|
|
463
|
+
*/
|
|
464
|
+
async changeBlockState(category, state) {
|
|
465
|
+
if (category === 'primary' && this.primaryBlockEl) {
|
|
466
|
+
state == 'open' ? this.primaryBlockEl.open() : this.primaryBlockEl.close();
|
|
467
|
+
}
|
|
468
|
+
else if (category === 'secondary' && this.secondaryBlockEl) {
|
|
469
|
+
state == 'open' ? this.secondaryBlockEl.open() : this.secondaryBlockEl.close();
|
|
470
|
+
}
|
|
471
|
+
}
|
|
472
|
+
render() {
|
|
473
|
+
const cartTitle = translate('components-b2b-cart-title');
|
|
474
|
+
const isEditMode = this.context === 'edit';
|
|
475
|
+
const isCheckoutMode = this.context === 'checkout';
|
|
476
|
+
const showSummary = !this.isCartEmpty && (isEditMode || (isCheckoutMode && this.isAccordionOpen));
|
|
477
|
+
return (h(Host, { key: 'a333bbd252bd1a19b305719b1a3492e8784f9dfa' }, h("div", { key: '590c1d0f2cb7b087157d9c2b6062ad8b6cfec802', ref: (el) => (this.cartEl = el), class: { cart: true, [`${this.theme}`]: true, [`${this.context}`]: true } }, h("tet-accordion", { key: 'b05385da27e63518ace873ebcfb33b30ca2a68d4', ref: (el) => (this.accordionEl = el), class: {
|
|
478
|
+
'cart__accordion': true,
|
|
479
|
+
[`cart__accordion--${this.context}`]: true,
|
|
480
|
+
'cart__accordion--rounded': this.isCartEmpty || (isCheckoutMode && !this.isAccordionOpen),
|
|
481
|
+
'cart__accordion--closed': !this.isAccordionOpen
|
|
482
|
+
}, isOpen: this.isAccordionOpen, onOpenChanged: this.handleAccordionChanged, header: cartTitle, theme: this.theme, transparentBackground: true, indicatorDirection: this.isDesktopResolution || isCheckoutMode ? 'down' : 'up' }, h("div", { key: 'a11c1ad7cd5b45f66af099d63378a50015733861', class: `cart__title--${this.context}` }, cartTitle), h("div", { key: '1155f8d5386e55e82e1c46e4179266c6f7e28c3e', class: "cart__content" }, this.isCartEmpty ? this.renderEmptyContent() : [this.renderContent()])), showSummary && this.renderSummary())));
|
|
483
|
+
}
|
|
484
|
+
get hostElement() { return getElement(this); }
|
|
485
|
+
static get watchers() { return {
|
|
486
|
+
"isDesktopResolution": ["openAccordionOnResolutionChange"],
|
|
487
|
+
"isCartEmpty": ["checkStickyClassOnCartEmptyChange"]
|
|
488
|
+
}; }
|
|
489
|
+
};
|
|
490
|
+
TetB2bConfiguratorCart.style = TetB2bConfiguratorCartStyle0;
|
|
491
|
+
|
|
492
|
+
const tetBusinessNavigationCss = "@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{display:flex}.business-navigation{display:flex;flex-direction:column;max-width:20.5rem;width:100%}@media screen and (max-width: 63.9375rem){.business-navigation{flex-direction:row;gap:0.5rem;max-width:100%;overflow-x:scroll;-webkit-overflow-scrolling:touch;scrollbar-width:none;user-select:none}}.business-navigation.light{--tet-business-navigation-item-background-color:var(--tc-layer-primary);--tet-business-navigation-item-mobile-screen-background-color:var(--tc-layer-secondary);--tet-business-navigation-item-hover-background-color:var(--tc-menu-item-hover);--tet-business-navigation-item-active-background-color:var(--tc-menu-item-pressed);--tet-business-navigation-item-selected-background-color:var(--tc-layer-inverse-primary);--tet-business-navigation-item-selected-item-color:var(--tc-text-inverse-primary);--tet-business-navigation-item-selected-icon-color:var(--tc-layer-primary);--tet-business-navigation-label-color:var(--tc-text-primary)}.business-navigation.light .business-navigation-item:focus-visible{outline:0.125rem solid var(--tc-blue-40);outline-offset:-0.125rem;transition:outline 0s}.business-navigation.dark{--tet-business-navigation-item-background-color:var(--tc-layer-primary-dark);--tet-business-navigation-item-mobile-screen-background-color:var(--tc-layer-secondary-dark);--tet-business-navigation-item-hover-background-color:var(--tc-menu-item-hover-dark);--tet-business-navigation-item-active-background-color:var(--tc-menu-item-pressed-dark);--tet-business-navigation-item-selected-background-color:var(--tc-layer-inverse-primary-dark);--tet-business-navigation-item-selected-item-color:var(--tc-text-inverse-primary-dark);--tet-business-navigation-item-selected-icon-color:var(--tc-layer-primary-dark);--tet-business-navigation-label-color:var(--tc-text-primary-dark)}.business-navigation.dark .business-navigation-item:focus-visible{outline:0.125rem solid var(--tc-blue-40);outline:0.125rem solid var(--tc-blue-40-dark);outline-offset:-0.125rem;transition:outline 0s}.business-navigation-item{display:flex;flex-direction:row;padding:1rem;align-items:flex-start;gap:0.75rem;align-self:stretch;border:none;border-radius:0.5rem;background-color:var(--tet-business-navigation-item-background-color);cursor:pointer}@media screen and (max-width: 63.9375rem){.business-navigation-item:first-child{margin-left:1.5rem}}@media screen and (max-width: 63.9375rem){.business-navigation-item:last-child{margin-right:1.5rem}}@media screen and (max-width: 63.9375rem){.business-navigation-item{display:inline-flex;padding:0.375rem 0.75rem;min-width:max-content;align-items:center;gap:0.75rem;background-color:var(--tet-business-navigation-item-mobile-screen-background-color)}}.business-navigation-item:hover{background-color:var(--tet-business-navigation-item-hover-background-color)}.business-navigation-item:active{background-color:var(--tet-business-navigation-item-active-background-color)}.business-navigation-item__icon{--icon-size:1.5rem;--icon-color:var(--tet-business-navigation-label-color)}@media screen and (max-width: 63.9375rem){.business-navigation-item__icon{--icon-size:1.25rem}}.business-navigation-item__title{font:500 1rem/1.5rem \"Inter\", \"Gilroy, Arial, sans-serif\";text-align:start;color:var(--tet-business-navigation-label-color)}.business-navigation-item.selected{background-color:var(--tet-business-navigation-item-selected-background-color)}.business-navigation-item.selected .business-navigation-item__title{color:var(--tet-business-navigation-item-selected-item-color)}.business-navigation-item.selected .business-navigation-item__icon{--icon-color:var(--tet-business-navigation-item-selected-icon-color)}";
|
|
493
|
+
const TetBusinessNavigationStyle0 = tetBusinessNavigationCss;
|
|
494
|
+
|
|
495
|
+
const TetBusinessNavigation = class {
|
|
496
|
+
constructor(hostRef) {
|
|
497
|
+
registerInstance(this, hostRef);
|
|
498
|
+
this.menuClickEvent = createEvent(this, "menu-click-event", 7);
|
|
499
|
+
/**
|
|
500
|
+
* Initialises the mouse drag.
|
|
501
|
+
* @param {MouseEvent} event Current mouse event.
|
|
502
|
+
*/
|
|
503
|
+
this.onContainerMouseDown = (event) => {
|
|
504
|
+
this.isPointerDown = true;
|
|
505
|
+
this.positions = {
|
|
506
|
+
scrollLeft: this.navigationContainer.scrollLeft,
|
|
507
|
+
mouseX: event.clientX
|
|
508
|
+
};
|
|
509
|
+
this.navigationContainer.addEventListener('mousemove', this.onContainerMouseMove);
|
|
510
|
+
this.navigationContainer.addEventListener('mouseup', this.onContainerMouseUp);
|
|
511
|
+
this.navigationContainer.addEventListener('mouseleave', this.onContainerMouseUp);
|
|
512
|
+
};
|
|
513
|
+
/**
|
|
514
|
+
* Scrolls the `navigationContainer` on mouse drag.
|
|
515
|
+
* @param {MouseEvent} e Current mouse event.
|
|
516
|
+
*/
|
|
517
|
+
this.onContainerMouseMove = (e) => {
|
|
518
|
+
e.preventDefault();
|
|
519
|
+
const mouseButton = e.buttons;
|
|
520
|
+
this.isPointerDown = mouseButton === 1;
|
|
521
|
+
if (!this.isPointerDown) {
|
|
522
|
+
this.onContainerMouseUp();
|
|
523
|
+
return;
|
|
524
|
+
}
|
|
525
|
+
const deltaX = e.clientX - this.positions.mouseX;
|
|
526
|
+
this.navigationContainer.scrollTo(this.positions.scrollLeft - deltaX, 0);
|
|
527
|
+
};
|
|
528
|
+
/**
|
|
529
|
+
* Removes mouse drag events.
|
|
530
|
+
*/
|
|
531
|
+
this.onContainerMouseUp = () => {
|
|
532
|
+
this.isPointerDown = false;
|
|
533
|
+
this.navigationContainer.removeEventListener('mousemove', this.onContainerMouseMove);
|
|
534
|
+
this.navigationContainer.removeEventListener('mouseup', this.onContainerMouseUp);
|
|
535
|
+
this.navigationContainer.removeEventListener('mouseleave', this.onContainerMouseUp);
|
|
536
|
+
};
|
|
537
|
+
/** Render menu item */
|
|
538
|
+
this.renderMenuItem = (menuItem) => {
|
|
539
|
+
const { id, icon, name } = menuItem;
|
|
540
|
+
return (h("button", { key: id, class: { 'business-navigation-item': true, 'selected': this.selectedItemId === id }, onClick: () => this.selectMenuItem(id) }, icon && h("tet-icon", { class: "business-navigation-item__icon", name: icon }), h("span", { class: "business-navigation-item__title" }, name)));
|
|
541
|
+
};
|
|
542
|
+
this.menuItems = undefined;
|
|
543
|
+
this.theme = 'light';
|
|
544
|
+
this.selectedItemId = undefined;
|
|
545
|
+
this.positions = { scrollLeft: 0, mouseX: 0 };
|
|
546
|
+
}
|
|
547
|
+
/** Method to run on menu item selection */
|
|
548
|
+
async selectMenuItem(id) {
|
|
549
|
+
this.selectedItemId = id;
|
|
550
|
+
this.menuClickEvent.emit({ id });
|
|
551
|
+
}
|
|
552
|
+
componentWillLoad() {
|
|
553
|
+
var _a;
|
|
554
|
+
if (!this.menuItems || this.menuItems.length === 0) {
|
|
555
|
+
return;
|
|
556
|
+
}
|
|
557
|
+
this.selectedItemId = ((_a = this.menuItems.find((item) => item.selected === true)) === null || _a === void 0 ? void 0 : _a.id) || this.menuItems[0].id;
|
|
558
|
+
}
|
|
559
|
+
/** Render Functional Component*/
|
|
560
|
+
render() {
|
|
561
|
+
const { menuItems, theme } = this;
|
|
562
|
+
return (h("div", { key: '5b448df37d5a11aba72e7239def7adc97b090af9', class: { 'business-navigation': true, [`${theme}`]: true }, role: "group", onMouseDown: this.onContainerMouseDown, ref: (ref) => (this.navigationContainer = ref) }, menuItems && menuItems.map(this.renderMenuItem)));
|
|
563
|
+
}
|
|
564
|
+
};
|
|
565
|
+
TetBusinessNavigation.style = TetBusinessNavigationStyle0;
|
|
566
|
+
|
|
567
|
+
const tetBusinessSummaryCardCss = "@font-face{font-family:Avenir Next;src:url(assets/fonts/8e7462a9501f48c43c58f870188b3fb2.eot?#iefix);src:url(assets/fonts/8e7462a9501f48c43c58f870188b3fb2.eot?#iefix) format(\"eot\"),url(assets/fonts/3c3e10968ffc97c2a52c5830f9886d1f.woff2) format(\"woff2\"),url(assets/fonts/660fbf858d30d7685fa4b166080f5980.woff) format(\"woff\"),url(assets/fonts/2b7748589092fd1a10b806abdfb562ff.ttf) format(\"truetype\");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/d5e25ad69d0ea31f3b8f66d634ca40fe.eot?#iefix);src:url(assets/fonts/d5e25ad69d0ea31f3b8f66d634ca40fe.eot?#iefix) format(\"eot\"),url(assets/fonts/aad36ecead30948bb30fe0ef818b749c.woff2) format(\"woff2\"),url(assets/fonts/c437d7752feaf3f056bbf8613e898d3a.woff) format(\"woff\"),url(assets/fonts/b8df4d02ef5de13a813917a85bc4a9c4.ttf) format(\"truetype\");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/046190c9a2f724b925df848737b03819.eot?#iefix);src:url(assets/fonts/046190c9a2f724b925df848737b03819.eot?#iefix) format(\"eot\"),url(assets/fonts/4d52f8276a74ea8efbad833ed790367c.woff2) format(\"woff2\"),url(assets/fonts/a067695dd1b87e927f4056c040d84669.woff) format(\"woff\"),url(assets/fonts/510a664af9771b72d4ce5e637109ca3c.ttf) format(\"truetype\");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/0715de188f56c99aa615905f7e06292e.eot?#iefix);src:url(assets/fonts/0715de188f56c99aa615905f7e06292e.eot?#iefix) format(\"eot\"),url(assets/fonts/63f5acc71d9852468683a4bfe824a28f.woff2) format(\"woff2\"),url(assets/fonts/ed94c737da267752ce0abd79bb003ff6.woff) format(\"woff\"),url(assets/fonts/6302f55a6dc6b12365177dc89b7d63cf.ttf) format(\"truetype\");font-weight:500;font-style:italic;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/3f76abc23eef0596c499840db84213bb.eot?#iefix);src:url(assets/fonts/3f76abc23eef0596c499840db84213bb.eot?#iefix) format(\"eot\"),url(assets/fonts/1fe7da97fe9dbe1349aca9b54b5fdf69.woff2) format(\"woff2\"),url(assets/fonts/dacc6a84278e221422902af99579ada5.woff) format(\"woff\"),url(assets/fonts/e530c573663a3a07243d303fbf7db508.ttf) format(\"truetype\");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/75f8489ba53f19968feaa3e2eb78c569.eot?#iefix);src:url(assets/fonts/75f8489ba53f19968feaa3e2eb78c569.eot?#iefix) format(\"eot\"),url(assets/fonts/93ec0034623fc696601ab99aba652d4c.woff2) format(\"woff2\"),url(assets/fonts/d73c8eb1c13abe1237366aa3ee829a59.woff) format(\"woff\"),url(assets/fonts/7b6dcef99f3f4b23346e23925ec8678f.ttf) format(\"truetype\");font-weight:600;font-style:italic;font-display:swap}.tet-icon{font-family:Tet Icons;font-weight:400;font-style:normal;font-size:24px;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}@font-face{font-family:Tet Icons;src:url(assets/fonts/d2ce51cdcd0b9707af186f8d50023d23.eot);src:url(assets/fonts/d2ce51cdcd0b9707af186f8d50023d23.eot?#iefix) format(\"embedded-opentype\"),url(assets/fonts/25f10ef322a1220b2e9e11db38b73892.woff2) format(\"woff2\"),url(assets/fonts/fed75ac1edcf1c25cdd8612d2c365f9a.woff) format(\"woff\"),url(assets/fonts/df7fbe67cabb13cb837172a73c46378a.ttf) format(\"truetype\"),url(assets/fonts/5486d8c87e2abc6c13ed952a6cc96658.svg#tet-icons) format(\"svg\");font-weight:400;font-style:normal}.tet-icon:before{content:\"\\E84E\"}.tet-icon--sm{font-size:1.125rem}.tet-icon--md{font-size:1.5rem}.tet-icon--lg{font-size:2.25rem}.tet-icon--xl{font-size:3rem}.tet-icon--xxl{font-size:4rem}.tet-icon--0{font-size:0}.tet-icon--1{font-size:.0625rem}.tet-icon--2{font-size:.125rem}.tet-icon--3{font-size:.1875rem}.tet-icon--4{font-size:.25rem}.tet-icon--5{font-size:.3125rem}.tet-icon--6{font-size:.375rem}.tet-icon--7{font-size:.4375rem}.tet-icon--8{font-size:.5rem}.tet-icon--9{font-size:.5625rem}.tet-icon--10{font-size:.625rem}.tet-icon--11{font-size:.6875rem}.tet-icon--12{font-size:.75rem}.tet-icon--13{font-size:.8125rem}.tet-icon--14{font-size:.875rem}.tet-icon--15{font-size:.9375rem}.tet-icon--16{font-size:1rem}.tet-icon--17{font-size:1.0625rem}.tet-icon--18{font-size:1.125rem}.tet-icon--19{font-size:1.1875rem}.tet-icon--20{font-size:1.25rem}.tet-icon--21{font-size:1.3125rem}.tet-icon--22{font-size:1.375rem}.tet-icon--23{font-size:1.4375rem}.tet-icon--24{font-size:1.5rem}.tet-icon--25{font-size:1.5625rem}.tet-icon--26{font-size:1.625rem}.tet-icon--27{font-size:1.6875rem}.tet-icon--28{font-size:1.75rem}.tet-icon--29{font-size:1.8125rem}.tet-icon--30{font-size:1.875rem}.tet-icon--31{font-size:1.9375rem}.tet-icon--32{font-size:2rem}.tet-icon--33{font-size:2.0625rem}.tet-icon--34{font-size:2.125rem}.tet-icon--35{font-size:2.1875rem}.tet-icon--36{font-size:2.25rem}.tet-icon--37{font-size:2.3125rem}.tet-icon--38{font-size:2.375rem}.tet-icon--39{font-size:2.4375rem}.tet-icon--40{font-size:2.5rem}.tet-icon--41{font-size:2.5625rem}.tet-icon--42{font-size:2.625rem}.tet-icon--43{font-size:2.6875rem}.tet-icon--44{font-size:2.75rem}.tet-icon--45{font-size:2.8125rem}.tet-icon--46{font-size:2.875rem}.tet-icon--47{font-size:2.9375rem}.tet-icon--48{font-size:3rem}.tet-icon--49{font-size:3.0625rem}.tet-icon--50{font-size:3.125rem}.tet-icon--51{font-size:3.1875rem}.tet-icon--52{font-size:3.25rem}.tet-icon--53{font-size:3.3125rem}.tet-icon--54{font-size:3.375rem}.tet-icon--55{font-size:3.4375rem}.tet-icon--56{font-size:3.5rem}.tet-icon--57{font-size:3.5625rem}.tet-icon--58{font-size:3.625rem}.tet-icon--59{font-size:3.6875rem}.tet-icon--60{font-size:3.75rem}.tet-icon--61{font-size:3.8125rem}.tet-icon--62{font-size:3.875rem}.tet-icon--63{font-size:3.9375rem}.tet-icon--64{font-size:4rem}.tet-icon--65{font-size:4.0625rem}.tet-icon--66{font-size:4.125rem}.tet-icon--67{font-size:4.1875rem}.tet-icon--68{font-size:4.25rem}.tet-icon--69{font-size:4.3125rem}.tet-icon--70{font-size:4.375rem}.tet-icon--71{font-size:4.4375rem}.tet-icon--72{font-size:4.5rem}.tet-icon--73{font-size:4.5625rem}.tet-icon--74{font-size:4.625rem}.tet-icon--75{font-size:4.6875rem}.tet-icon--76{font-size:4.75rem}.tet-icon--77{font-size:4.8125rem}.tet-icon--78{font-size:4.875rem}.tet-icon--79{font-size:4.9375rem}.tet-icon--80{font-size:5rem}.tet-icon--81{font-size:5.0625rem}.tet-icon--82{font-size:5.125rem}.tet-icon--83{font-size:5.1875rem}.tet-icon--84{font-size:5.25rem}.tet-icon--85{font-size:5.3125rem}.tet-icon--86{font-size:5.375rem}.tet-icon--87{font-size:5.4375rem}.tet-icon--88{font-size:5.5rem}.tet-icon--89{font-size:5.5625rem}.tet-icon--90{font-size:5.625rem}.tet-icon--91{font-size:5.6875rem}.tet-icon--92{font-size:5.75rem}.tet-icon--93{font-size:5.8125rem}.tet-icon--94{font-size:5.875rem}.tet-icon--95{font-size:5.9375rem}.tet-icon--96{font-size:6rem}.tet-icon--97{font-size:6.0625rem}.tet-icon--98{font-size:6.125rem}.tet-icon--99{font-size:6.1875rem}.tet-icon--100{font-size:6.25rem}.tet-icon--101{font-size:6.3125rem}.tet-icon__add:before{content:\"\\E800\"}.tet-icon__alert-circled:before{content:\"\\E801\"}.tet-icon__alert:before{content:\"\\E802\"}.tet-icon__bank:before{content:\"\\E803\"}.tet-icon__box:before{content:\"\\E804\"}.tet-icon__download:before{content:\"\\E805\"}.tet-icon__burger:before{content:\"\\E806\"}.tet-icon__cancel:before{content:\"\\E807\"}.tet-icon__printer:before{content:\"\\E808\"}.tet-icon__cart-add:before{content:\"\\E809\"}.tet-icon__cart-remove:before{content:\"\\E80A\"}.tet-icon__cart:before{content:\"\\E80B\"}.tet-icon__chat:before{content:\"\\E80C\"}.tet-icon__arrow-up:before{content:\"\\E80D\"}.tet-icon__calendar:before{content:\"\\E80E\"}.tet-icon__help-circled:before{content:\"\\E80F\"}.tet-icon__edit:before{content:\"\\E810\"}.tet-icon__external-link:before{content:\"\\E811\"}.tet-icon__gift:before{content:\"\\E812\"}.tet-icon__person:before{content:\"\\E813\"}.tet-icon__heart:before{content:\"\\E814\"}.tet-icon__language:before{content:\"\\E815\"}.tet-icon__help:before{content:\"\\E816\"}.tet-icon__home-1:before{content:\"\\E817\"}.tet-icon__location:before{content:\"\\E818\"}.tet-icon__home-3:before{content:\"\\E819\"}.tet-icon__chart-even:before{content:\"\\E81A\"}.tet-icon__info-2:before{content:\"\\E81B\"}.tet-icon__key:before{content:\"\\E81C\"}.tet-icon__info:before{content:\"\\E81D\"}.tet-icon__lock-opened:before{content:\"\\E81E\"}.tet-icon__lock-outlined:before{content:\"\\E81F\"}.tet-icon__lock:before{content:\"\\E820\"}.tet-icon__laptop-filled:before{content:\"\\E821\"}.tet-icon__mail:before{content:\"\\E822\"}.tet-icon__options:before{content:\"\\E823\"}.tet-icon__chart-uneven:before{content:\"\\E824\"}.tet-icon__mail-2:before{content:\"\\E825\"}.tet-icon__remove:before{content:\"\\E826\"}.tet-icon__mobile-filled:before{content:\"\\E827\"}.tet-icon__ilu-calendar-check:before{content:\"\\E828\"}.tet-icon__settings-outlined:before{content:\"\\E829\"}.tet-icon__tablet:before{content:\"\\E82A\"}.tet-icon__thumb-up:before{content:\"\\E82B\"}.tet-icon__ilu-purchase:before{content:\"\\E82C\"}.tet-icon__chart-even-outlined:before{content:\"\\E82D\"}.tet-icon__movie:before{content:\"\\E82E\"}.tet-icon__percent:before{content:\"\\E82F\"}.tet-icon__ilu-change-whenever:before{content:\"\\E830\"}.tet-icon__truck:before{content:\"\\E831\"}.tet-icon__zero:before{content:\"\\E832\"}.tet-icon__attach:before{content:\"\\E833\"}.tet-icon__cloud-done:before{content:\"\\E834\"}.tet-icon__cloud-download:before{content:\"\\E835\"}.tet-icon__cloud-upload:before{content:\"\\E836\"}.tet-icon__cloud:before{content:\"\\E837\"}.tet-icon__folder:before{content:\"\\E838\"}.tet-icon__remote:before{content:\"\\E839\"}.tet-icon__router:before{content:\"\\E83A\"}.tet-icon__shield-filled:before{content:\"\\E83B\"}.tet-icon__shield:before{content:\"\\E83C\"}.tet-icon__ilu-devices:before{content:\"\\E83D\"}.tet-icon__ilu-get-points:before{content:\"\\E83E\"}.tet-icon__tv:before{content:\"\\E83F\"}.tet-icon__ilu-internet:before{content:\"\\E840\"}.tet-icon__wifi-outlined:before{content:\"\\E841\"}.tet-icon__wifi:before{content:\"\\E842\"}.tet-icon__description-outlined:before{content:\"\\E843\"}.tet-icon__laptop:before{content:\"\\E844\"}.tet-icon__chart-uneven-outlined:before{content:\"\\E845\"}.tet-icon__meter:before{content:\"\\E846\"}.tet-icon__mobile:before{content:\"\\E847\"}.tet-icon__phone:before{content:\"\\E848\"}.tet-icon__plug-filled:before{content:\"\\E849\"}.tet-icon__plug:before{content:\"\\E84A\"}.tet-icon__print:before{content:\"\\E84B\"}.tet-icon__camera:before{content:\"\\E84C\"}.tet-icon__clock:before{content:\"\\E84D\"}.tet-icon__placeholder:before{content:\"\\E84E\"}.tet-icon__tv-filled:before{content:\"\\E84F\"}.tet-icon__arrow-down:before{content:\"\\E850\"}.tet-icon__arrow-left:before{content:\"\\E851\"}.tet-icon__arrow-right:before{content:\"\\E852\"}.tet-icon__description:before{content:\"\\E853\"}.tet-icon__login:before{content:\"\\E854\"}.tet-icon__check:before{content:\"\\E855\"}.tet-icon__chevron-down:before{content:\"\\E856\"}.tet-icon__chevron-left:before{content:\"\\E857\"}.tet-icon__chevron-right:before{content:\"\\E858\"}.tet-icon__chevron-up:before{content:\"\\E859\"}.tet-icon__close-circled:before{content:\"\\E85A\"}.tet-icon__close:before{content:\"\\E85B\"}.tet-icon__more-horizontal:before{content:\"\\E85C\"}.tet-icon__more-vertical:before{content:\"\\E85D\"}.tet-icon__refresh:before{content:\"\\E85E\"}.tet-icon__facebook:before{content:\"\\E85F\"}.tet-icon__instagram:before{content:\"\\E860\"}.tet-icon__linkedin:before{content:\"\\E861\"}.tet-icon__people:before{content:\"\\E862\"}.tet-icon__logout:before{content:\"\\E863\"}.tet-icon__share:before{content:\"\\E864\"}.tet-icon__twitter:before{content:\"\\E865\"}.tet-icon__cancel-filled:before{content:\"\\E866\"}.tet-icon__done:before{content:\"\\E867\"}.tet-icon__star-filled:before{content:\"\\E868\"}.tet-icon__star:before{content:\"\\E869\"}.tet-icon__clipboard:before{content:\"\\E86A\"}.tet-icon__ilu-calendar:before{content:\"\\E86B\"}.tet-icon__check-circled:before{content:\"\\E86C\"}.tet-icon__ilu-choose-channels:before{content:\"\\E86D\"}.tet-icon__search:before{content:\"\\E86E\"}.tet-icon__warning:before{content:\"\\E86F\"}.tet-icon__ilu-clock-1:before{content:\"\\E870\"}.tet-icon__ilu-fold:before{content:\"\\E871\"}.tet-icon__ilu-letter:before{content:\"\\E872\"}.tet-icon__ilu-pay:before{content:\"\\E873\"}.tet-icon__ilu-meter:before{content:\"\\E874\"}.tet-icon__ilu-sign:before{content:\"\\E875\"}.tet-icon__smart-watch-filled:before{content:\"\\E876\"}.tet-icon__washing-machine-filled:before{content:\"\\E877\"}.tet-icon__bullet:before{content:\"\\E878\"}.tet-icon__sound:before{content:\"\\E879\"}.tet-icon__dropdown:before{content:\"\\E87A\"}.tet-icon__mask-pass:before{content:\"\\E87B\"}.tet-icon__select:before{content:\"\\E87C\"}.tet-icon__text-area-sizing:before{content:\"\\E87D\"}.tet-icon__unmask-pass:before{content:\"\\E87E\"}.tet-icon__bullet-small:before{content:\"\\E882\"}.tet-icon__electric-bolt:before{content:\"\\E880\"}.tet-icon__sun:before{content:\"\\E881\"}:host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:\"\\e86e\"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:\"\\e85a\"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:\"\\e85b\"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:\"\\e86c\"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:\"\\e855\"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:\"\\e859\"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:\"\\e856\"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:\"\\e86a\"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:\"\\e81d\"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:\"\\e867\"}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{--tet-business-summary-card-icon-button-size:2.75rem;display:flex}.business-summary-card{display:flex;flex-direction:column;padding:1rem 1rem 0 1rem;background-color:var(--tet-business-summary-card-background-color);border:0.03125rem solid var(--tet-business-summary-card-border-color);border-radius:0.375rem;width:100%;justify-content:space-between;color:var(--tet-business-summary-card-text-color);box-shadow:var(--tet-business-summary-card-border-shadow)}.business-summary-card.theme-light{--tet-business-summary-card-text-color:var(--tc-text-primary);--tet-business-summary-card-contract-text-color:var(--tc-text-secondary);--tet-business-summary-card-border-color:var(--tc-border-quaternary);--tet-business-summary-card-border-shadow:var(--tc-elevation-one);--tet-business-summary-card-icon-button-background:var(--tc-layer-secondary);--tet-business-summary-card-hover-icon-button-background:var(--tc-layer-tertiary);--tet-business-summary-card-active-icon-button-background:var(--tc-layer-quaternary);--tet-business-summary-card-background-color:var(--tc-layer-primary);--tet-business-summary-card-icon-color:var(--tc-icon-primary);--tet-business-summary-card-hover-delete-icon-color:var(--tc-red-40);--tet-business-summary-card-hover-edit-icon-color:var(--tc-blue-40)}.business-summary-card.theme-light .icon-button:focus-visible{outline:0.125rem solid var(--tc-blue-40);outline-offset:0.125rem;transition:outline 0s}.business-summary-card.theme-light .delete span.icon-container.light.primary{--icon-color:var(--tc-red-40)}.business-summary-card.theme-dark{--tet-business-summary-card-text-color:var(--tc-text-primary-dark);--tet-business-summary-card-contract-text-color:var(--tc-text-secondary-dark);--tet-business-summary-card-border-color:var(--tc-border-quaternary-dark);--tet-business-summary-card-border-shadow:var(--tc-elevation-one-dark);--tet-business-summary-card-icon-button-background:var(--tc-layer-secondary-dark);--tet-business-summary-card-hover-icon-button-background:var(--tc-layer-tertiary-dark);--tet-business-summary-card-active-icon-button-background:var(--tc-layer-quaternary-dark);--tet-business-summary-card-background-color:var(--tc-layer-primary-dark);--tet-business-summary-card-icon-color:var(--tc-icon-primary-dark);--tet-business-summary-card-hover-delete-icon-color:var(--tc-red-40-dark);--tet-business-summary-card-hover-edit-icon-color:var(--tc-blue-40-dark)}.business-summary-card.theme-dark .icon-button:focus-visible{outline:0.125rem solid var(--tc-blue-40);outline:0.125rem solid var(--tc-blue-40-dark);outline-offset:0.125rem;transition:outline 0s}.business-summary-card-content{display:flex;flex-direction:row;justify-content:space-between;padding-bottom:1rem}@media only screen and (max-width: 22.5rem){.business-summary-card-content{flex-direction:column}}.business-summary-card-content__left{display:flex;flex-direction:column;align-items:flex-start}.business-summary-card-content__right{display:flex;flex-direction:column;align-items:flex-end}@media only screen and (max-width: 22.5rem){.business-summary-card-content__right{align-items:flex-start;flex-direction:row;justify-content:flex-start}}.business-summary-card-content__right:has(.button-wrapper){justify-content:flex-end}@media only screen and (max-width: 22.5rem){.business-summary-card-content__right:has(.button-wrapper){justify-content:center}}.business-summary-card-content:has(.content-wrapper){padding-bottom:0}.business-summary-card__stepper{--stepper-value-color:var(--tet-business-summary-card-text-color);--stepper-input-control-background-color:var(--tet-business-summary-card-background-color)}.stepper-wrapper{display:flex;flex-direction:column;align-items:baseline;gap:0.125rem;align-self:stretch}@media only screen and (max-width: 22.5rem){.stepper-wrapper{align-items:center;padding-bottom:1rem}}.stepper-label{font:500 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\";padding:0 0.25rem 0.25rem 0.25rem}@media screen and (min-width: 64rem){.stepper-label{display:none}}.content-wrapper{display:flex;flex-direction:column}.content-wrapper .title{font:500 1rem/1.5rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.content-wrapper .description{font:400 0.875rem/1.25rem \"Inter\", \"Gilroy, Arial, sans-serif\"}.content-wrapper .description.price{align-self:end;text-decoration-line:line-through}@media only screen and (max-width: 22.5rem){.content-wrapper:has(.description.price){flex-direction:row;align-items:center;padding-top:0.25rem;gap:0.5rem}}.contract-term{font:500 0.75rem/1rem \"Inter\", \"Gilroy, Arial, sans-serif\";color:var(--tet-business-summary-card-contract-text-color)}.button-wrapper{display:flex;flex-direction:row;align-items:flex-end;gap:0.5rem}@media only screen and (max-width: 22.5rem){.button-wrapper{align-self:center}}.icon-button{display:flex;width:var(--tet-business-summary-card-icon-button-size);height:var(--tet-business-summary-card-icon-button-size);padding:0.625rem;justify-content:center;align-items:center;border-radius:2.5rem;border:none;background:var(--tet-business-summary-card-icon-button-background);cursor:pointer}.icon-button .edit,.icon-button .delete{--icon-color:var(--tet-business-summary-card-icon-color)}.icon-button:hover .edit,.icon-button:active .edit{--icon-color:var(--tet-business-summary-card-hover-edit-icon-color)}.icon-button:hover .delete,.icon-button:active .delete{--icon-color:var(--tet-business-summary-card-hover-delete-icon-color)}.icon-button:hover{background:var(--tet-business-summary-card-hover-icon-button-background)}.icon-button:active,.icon-button:focus:not(:focus-visible){background:var(--tet-business-summary-card-active-icon-button-background)}";
|
|
568
|
+
const TetBusinessSummaryCardStyle0 = tetBusinessSummaryCardCss;
|
|
569
|
+
|
|
570
|
+
const TetBusinessSummaryCardComponent = class {
|
|
571
|
+
constructor(hostRef) {
|
|
572
|
+
registerInstance(this, hostRef);
|
|
573
|
+
this.editButtonClick = createEvent(this, "editButtonClick", 7);
|
|
574
|
+
this.deleteButtonClick = createEvent(this, "deleteButtonClick", 7);
|
|
575
|
+
this.amountChange = createEvent(this, "amountChange", 7);
|
|
576
|
+
/** Function to render stepper label if provided */
|
|
577
|
+
this.renderLabel = (withValue) => {
|
|
578
|
+
const { stepperLabel, value } = this;
|
|
579
|
+
if (!stepperLabel) {
|
|
580
|
+
return;
|
|
581
|
+
}
|
|
582
|
+
if (withValue) {
|
|
583
|
+
return (h("span", { class: "contract-term" }, stepperLabel, ": ", value));
|
|
584
|
+
}
|
|
585
|
+
else {
|
|
586
|
+
return h("span", { class: "stepper-label" }, stepperLabel);
|
|
587
|
+
}
|
|
588
|
+
};
|
|
589
|
+
/** Render stepper if necessary */
|
|
590
|
+
this.renderStepper = () => {
|
|
591
|
+
const { withStepper, theme, value, minValue, maxValue } = this;
|
|
592
|
+
if (!withStepper) {
|
|
593
|
+
return;
|
|
594
|
+
}
|
|
595
|
+
return (h("div", { class: "stepper-wrapper" }, this.renderLabel(false), h("tet-stepper-input", { class: "business-summary-card__stepper", theme: theme, value: value, step: 1, min: minValue, max: maxValue, onInputValueChanged: (e) => {
|
|
596
|
+
this.value = e.detail;
|
|
597
|
+
this.amountChange.emit(e.detail);
|
|
598
|
+
} })));
|
|
599
|
+
};
|
|
600
|
+
/** Render Edit or Delete Icon Button */
|
|
601
|
+
this.renderIconButton = (type) => {
|
|
602
|
+
const buttonType = type === 'tc-edit-box' ? 'edit' : 'delete';
|
|
603
|
+
const buttonClickEvent = (e) => {
|
|
604
|
+
type === 'tc-edit-box' ? this.editButtonClick.emit(e) : this.deleteButtonClick.emit(e);
|
|
605
|
+
};
|
|
606
|
+
return (h("button", { class: "icon-button", onClick: (e) => buttonClickEvent(e), onKeyDown: a11yBtnClick }, h("tet-icon", { class: buttonType, name: type, focusable: false })));
|
|
607
|
+
};
|
|
608
|
+
this.productName = undefined;
|
|
609
|
+
this.price = undefined;
|
|
610
|
+
this.productDescription = undefined;
|
|
611
|
+
this.discountPrice = undefined;
|
|
612
|
+
this.currency = undefined;
|
|
613
|
+
this.contractTerm = undefined;
|
|
614
|
+
this.theme = 'light';
|
|
615
|
+
this.withStepper = false;
|
|
616
|
+
this.value = undefined;
|
|
617
|
+
this.minValue = undefined;
|
|
618
|
+
this.maxValue = undefined;
|
|
619
|
+
this.stepperLabel = undefined;
|
|
620
|
+
this.context = 'edit';
|
|
621
|
+
this.language = 'lv';
|
|
622
|
+
}
|
|
623
|
+
async componentWillLoad() {
|
|
624
|
+
processTranslations('tet-components', this.language).then(() => forceUpdate(this));
|
|
625
|
+
}
|
|
626
|
+
/** Return functional Component */
|
|
627
|
+
render() {
|
|
628
|
+
const { productName, price, productDescription, discountPrice, currency, contractTerm, theme } = this;
|
|
629
|
+
const termWithUnit = !contractTerm
|
|
630
|
+
? translate('components-term-month-indefinite')
|
|
631
|
+
: translate(`components-term-month-${contractTerm % 10 === 1 && contractTerm !== 11 ? 'single' : 'plural'}`, {
|
|
632
|
+
term: contractTerm
|
|
633
|
+
});
|
|
634
|
+
return (h("div", { key: 'c25cd7e9a6eed0575af9f283f21c830b47ce7b57', class: { 'business-summary-card': true, [`theme-${theme}`]: true } }, h("div", { key: '84c17b2a4c7b7e7840d3815f5da5292a9692a49a', class: "business-summary-card-content" }, h("div", { key: '4d34ada146d7d347ee2db00e2b7d6e332205648e', class: "business-summary-card-content__left" }, h("div", { key: '17629a70af7e6751433a012860bff790c5f1e4ff', class: "content-wrapper" }, h("span", { key: 'c1408450f109a9f4f289389966af717f01d1aa59', class: "title" }, productName), h("span", { key: '4b160e0f59d16c4572eb0a71ae72d6d1f425530c', class: "description" }, productDescription))), h("div", { key: '9cee63b30c134afebbb3867b3a890db0844b24cf', class: "business-summary-card-content__right" }, h("div", { key: 'e17c4fa7fa6ddd93078d979a5d640400c696dbfa', class: "content-wrapper" }, h("span", { key: '078d0399a8823d004e2bf0d208510b9e4fe58cf2', class: "title" }, `${(discountPrice || price).toFixed(2)} ${currency}`), !!discountPrice && (h("span", { key: '5fc63b4bfc65a7889bf7507c92859c92ebc84040', class: { description: true, price: !!discountPrice } }, `${price.toFixed(2)} ${currency}`))))), h("div", { key: 'ad03d094cdbe03aecf29ade0cd91622aaa443011', class: "business-summary-card-content" }, h("span", { key: 'c49611607496937724dab73e8d2545559d5b102b', class: "contract-term" }, translate('components-offers-contract-terms-label'), ": ", termWithUnit), this.context === 'checkout' && this.renderLabel(true)), this.context === 'edit' && h("div", { key: 'd7c3805517997241b883fcd664d2241d547e2404', class: "business-summary-card-content" }, h("div", { key: '10fa4c0dc453e1d9bf19203792cc5e1e0e0470cb', class: "business-summary-card-content__left" }, this.renderStepper()), h("div", { key: '43f737f7999def37d6c868d0bd276ba2a34fc9f9', class: "business-summary-card-content__right" }, h("div", { key: 'b6dd8432822b3c74b4a3a3c2b7558f4d723c89da', class: "button-wrapper" }, this.renderIconButton('tc-edit-box'), this.renderIconButton('tc-trash-can'))))));
|
|
635
|
+
}
|
|
636
|
+
};
|
|
637
|
+
TetBusinessSummaryCardComponent.style = TetBusinessSummaryCardStyle0;
|
|
638
|
+
|
|
639
|
+
export { TetAvailabilityContactForm as tet_b2b_check_out_form, TetB2bCompareCard as tet_b2b_compare_card, TetB2bConfiguratorCart as tet_b2b_configurator_cart, TetBusinessNavigation as tet_business_navigation, TetBusinessSummaryCardComponent as tet_business_summary_card };
|