@ptcwebops/ptcw-design 6.4.27-beta → 6.4.28-beta

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (157) hide show
  1. package/dist/cjs/event-podcast-slider-example.cjs.entry.js +1 -1
  2. package/dist/cjs/featured-events-slider-example.cjs.entry.js +1 -1
  3. package/dist/cjs/homepage-jumbotron.cjs.entry.js +1 -1
  4. package/dist/cjs/icon-asset_17.cjs.entry.js +1660 -0
  5. package/dist/cjs/loader.cjs.js +1 -1
  6. package/dist/cjs/ptc-case-studies-slider.cjs.entry.js +1 -1
  7. package/dist/cjs/ptc-icon-card-slider-example.cjs.entry.js +1 -1
  8. package/dist/cjs/ptc-icon-component.cjs.entry.js +1 -1
  9. package/dist/cjs/ptc-search-field.cjs.entry.js +95 -0
  10. package/dist/cjs/ptc-subnav-v2.cjs.entry.js +2 -1
  11. package/dist/cjs/ptcw-design.cjs.js +1 -1
  12. package/dist/cjs/storefront-enhanced-product-list-alt-example.cjs.entry.js +1 -1
  13. package/dist/cjs/storefront-enhanced-product-list-example.cjs.entry.js +1 -1
  14. package/dist/collection/components/organism-bundles/event-podcast-slider-example/event-podcast-slider-example.css +16 -11
  15. package/dist/collection/components/organism-bundles/featured-events-slider-example/featured-events-slider-example.css +16 -11
  16. package/dist/collection/components/organism-bundles/homepage-jumbotron/homepage-jumbotron.css +16 -11
  17. package/dist/collection/components/organism-bundles/ptc-icon-card-slider-example/ptc-icon-card-slider-example.css +16 -11
  18. package/dist/collection/components/organism-bundles/storefront-enhanced-product-list-example/storefront-enhanced-product-list-example.css +16 -11
  19. package/dist/collection/components/ptc-case-studies-slider/ptc-case-studies-slider.css +16 -11
  20. package/dist/collection/components/ptc-icon-component/ptc-icon-component.css +16 -11
  21. package/dist/collection/components/ptc-product-card/ptc-product-card.css +14 -0
  22. package/dist/collection/components/ptc-seo-title/ptc-seo-title.js +3 -3
  23. package/dist/collection/components/ptc-subnav-v2/ptc-subnav-v2.js +2 -1
  24. package/dist/custom-elements/index.js +9 -8
  25. package/dist/esm/blog-detail-content_2.entry.js +1 -1
  26. package/dist/esm/blog-detail-layout.entry.js +1 -1
  27. package/dist/esm/blogs-search-section.entry.js +1 -1
  28. package/dist/esm/event-podcast-slider-example.entry.js +1 -1
  29. package/dist/esm/featured-events-slider-example.entry.js +1 -1
  30. package/dist/esm/homepage-jumbotron.entry.js +2 -2
  31. package/dist/esm/homepage-toggled-content.entry.js +1 -1
  32. package/dist/esm/icon-asset_17.entry.js +1640 -0
  33. package/dist/esm/innovator-toggle-container.entry.js +1 -1
  34. package/dist/esm/{interfaces-4caedd26.js → interfaces-7c0243be.js} +1 -1
  35. package/dist/esm/loader.js +1 -1
  36. package/dist/esm/most-popular-news.entry.js +1 -1
  37. package/dist/esm/my-component.entry.js +1 -1
  38. package/dist/esm/ptc-accordion-item.entry.js +1 -1
  39. package/dist/esm/ptc-background-video.entry.js +1 -1
  40. package/dist/esm/ptc-case-studies-slider.entry.js +1 -1
  41. package/dist/esm/ptc-collapse-list.entry.js +1 -1
  42. package/dist/esm/ptc-form-checkbox_4.entry.js +1 -1
  43. package/dist/esm/ptc-homepage-image-feature.entry.js +1 -1
  44. package/dist/esm/ptc-homepage-video-background.entry.js +1 -1
  45. package/dist/esm/ptc-icon-card-slider-example.entry.js +1 -1
  46. package/dist/esm/ptc-icon-card.entry.js +1 -1
  47. package/dist/esm/ptc-icon-component.entry.js +1 -1
  48. package/dist/esm/ptc-img.entry.js +1 -1
  49. package/dist/esm/ptc-link.entry.js +1 -1
  50. package/dist/esm/ptc-media-card.entry.js +1 -1
  51. package/dist/esm/ptc-pricing-packaging-table.entry.js +1 -1
  52. package/dist/esm/ptc-pricing-tabs.entry.js +1 -1
  53. package/dist/esm/ptc-search-field.entry.js +91 -0
  54. package/dist/esm/ptc-social-icons-footer.entry.js +1 -1
  55. package/dist/esm/ptc-subnav-v2.entry.js +2 -1
  56. package/dist/esm/ptcw-design.js +1 -1
  57. package/dist/esm/storefront-enhanced-product-list-alt-example.entry.js +1 -1
  58. package/dist/esm/storefront-enhanced-product-list-example.entry.js +1 -1
  59. package/dist/esm/{utils-bdd0cc16.js → utils-a64ba942.js} +1 -1
  60. package/dist/ptcw-design/p-045c468a.entry.js +1 -0
  61. package/dist/ptcw-design/{p-2efd18d8.entry.js → p-0824f503.entry.js} +1 -1
  62. package/dist/ptcw-design/{p-cf41ac32.entry.js → p-1b1fd60d.entry.js} +1 -1
  63. package/dist/ptcw-design/{p-c7e948b2.js → p-22cf00e7.js} +1 -1
  64. package/dist/ptcw-design/{p-a318a793.entry.js → p-2fa5814b.entry.js} +1 -1
  65. package/dist/ptcw-design/{p-b154bbdb.entry.js → p-3596ce5a.entry.js} +1 -1
  66. package/dist/ptcw-design/p-4e8c1ba6.entry.js +1 -0
  67. package/dist/ptcw-design/p-5aed43be.entry.js +1 -0
  68. package/dist/ptcw-design/p-63da8f22.entry.js +1 -0
  69. package/dist/ptcw-design/{p-2f7b6437.entry.js → p-681d26ef.entry.js} +1 -1
  70. package/dist/ptcw-design/{p-9df3c31f.entry.js → p-7398874a.entry.js} +1 -1
  71. package/dist/ptcw-design/{p-7777753a.entry.js → p-7524411a.entry.js} +1 -1
  72. package/dist/ptcw-design/{p-850e6e8c.entry.js → p-83632220.entry.js} +1 -1
  73. package/dist/ptcw-design/{p-87215e3a.entry.js → p-87a9a028.entry.js} +1 -1
  74. package/dist/ptcw-design/{p-3fbcfe0f.entry.js → p-8e24e586.entry.js} +1 -1
  75. package/dist/ptcw-design/p-8ffdd794.entry.js +1 -0
  76. package/dist/ptcw-design/{p-a81833cd.entry.js → p-9461c4eb.entry.js} +1 -1
  77. package/dist/ptcw-design/{p-804dac0c.entry.js → p-a31f22a1.entry.js} +1 -1
  78. package/dist/ptcw-design/{p-d3c11c68.entry.js → p-b9966f20.entry.js} +1 -1
  79. package/dist/ptcw-design/{p-75c8fceb.entry.js → p-bdb2e42c.entry.js} +1 -1
  80. package/dist/ptcw-design/p-ca63a0c9.entry.js +1 -0
  81. package/dist/ptcw-design/p-da4b7e23.entry.js +1 -0
  82. package/dist/ptcw-design/{p-83dabf2e.entry.js → p-e2da8109.entry.js} +1 -1
  83. package/dist/ptcw-design/p-e50a5a46.entry.js +1 -0
  84. package/dist/ptcw-design/p-e69a0445.entry.js +1 -0
  85. package/dist/ptcw-design/p-e9f834fa.entry.js +1 -0
  86. package/dist/ptcw-design/p-eabf87be.entry.js +1 -0
  87. package/dist/ptcw-design/{p-562a3e36.entry.js → p-ed49544c.entry.js} +1 -1
  88. package/dist/ptcw-design/{p-e65cbdb9.entry.js → p-edaf241d.entry.js} +1 -1
  89. package/dist/ptcw-design/{p-711bcdad.js → p-ee1183b2.js} +1 -1
  90. package/dist/ptcw-design/p-efd6ee3b.entry.js +1 -0
  91. package/dist/ptcw-design/{p-5b00a563.entry.js → p-fa045097.entry.js} +1 -1
  92. package/dist/ptcw-design/{p-b2fcbbd8.entry.js → p-fb0f4459.entry.js} +1 -1
  93. package/dist/ptcw-design/ptcw-design.esm.js +1 -1
  94. package/dist/types/components.d.ts +62 -62
  95. package/package.json +101 -101
  96. package/readme.md +23 -23
  97. package/dist/cjs/icon-asset_2.cjs.entry.js +0 -154
  98. package/dist/cjs/list-item.cjs.entry.js +0 -52
  99. package/dist/cjs/ptc-back-to-top.cjs.entry.js +0 -100
  100. package/dist/cjs/ptc-breadcrumb.cjs.entry.js +0 -63
  101. package/dist/cjs/ptc-button.cjs.entry.js +0 -117
  102. package/dist/cjs/ptc-para.cjs.entry.js +0 -139
  103. package/dist/cjs/ptc-picture.cjs.entry.js +0 -185
  104. package/dist/cjs/ptc-product-card.cjs.entry.js +0 -61
  105. package/dist/cjs/ptc-product-category.cjs.entry.js +0 -20
  106. package/dist/cjs/ptc-product-dropdown.cjs.entry.js +0 -80
  107. package/dist/cjs/ptc-product-highlight-card.cjs.entry.js +0 -28
  108. package/dist/cjs/ptc-product-list.cjs.entry.js +0 -172
  109. package/dist/cjs/ptc-product-sidebar.cjs.entry.js +0 -178
  110. package/dist/cjs/ptc-readmore.cjs.entry.js +0 -186
  111. package/dist/cjs/ptc-spacer.cjs.entry.js +0 -38
  112. package/dist/cjs/ptc-title.cjs.entry.js +0 -161
  113. package/dist/cjs/ptc-tooltip.cjs.entry.js +0 -113
  114. package/dist/esm/icon-asset_2.entry.js +0 -149
  115. package/dist/esm/list-item.entry.js +0 -48
  116. package/dist/esm/ptc-back-to-top.entry.js +0 -96
  117. package/dist/esm/ptc-breadcrumb.entry.js +0 -59
  118. package/dist/esm/ptc-button.entry.js +0 -113
  119. package/dist/esm/ptc-para.entry.js +0 -135
  120. package/dist/esm/ptc-picture.entry.js +0 -181
  121. package/dist/esm/ptc-product-card.entry.js +0 -57
  122. package/dist/esm/ptc-product-category.entry.js +0 -16
  123. package/dist/esm/ptc-product-dropdown.entry.js +0 -76
  124. package/dist/esm/ptc-product-highlight-card.entry.js +0 -24
  125. package/dist/esm/ptc-product-list.entry.js +0 -168
  126. package/dist/esm/ptc-product-sidebar.entry.js +0 -174
  127. package/dist/esm/ptc-readmore.entry.js +0 -182
  128. package/dist/esm/ptc-spacer.entry.js +0 -34
  129. package/dist/esm/ptc-title.entry.js +0 -157
  130. package/dist/esm/ptc-tooltip.entry.js +0 -109
  131. package/dist/ptcw-design/p-03a1e1a5.entry.js +0 -1
  132. package/dist/ptcw-design/p-068b64a1.entry.js +0 -1
  133. package/dist/ptcw-design/p-183ba1ca.entry.js +0 -1
  134. package/dist/ptcw-design/p-1acd3617.entry.js +0 -1
  135. package/dist/ptcw-design/p-1b3394a7.entry.js +0 -1
  136. package/dist/ptcw-design/p-2e288e60.entry.js +0 -1
  137. package/dist/ptcw-design/p-2f82de8f.entry.js +0 -1
  138. package/dist/ptcw-design/p-36d6e662.entry.js +0 -1
  139. package/dist/ptcw-design/p-3ed57ccf.entry.js +0 -1
  140. package/dist/ptcw-design/p-4313edfb.entry.js +0 -1
  141. package/dist/ptcw-design/p-47aa1583.entry.js +0 -1
  142. package/dist/ptcw-design/p-561a622f.entry.js +0 -1
  143. package/dist/ptcw-design/p-674c828e.entry.js +0 -1
  144. package/dist/ptcw-design/p-709cc1f0.entry.js +0 -1
  145. package/dist/ptcw-design/p-7226670f.entry.js +0 -1
  146. package/dist/ptcw-design/p-73293d32.entry.js +0 -1
  147. package/dist/ptcw-design/p-89da867f.entry.js +0 -1
  148. package/dist/ptcw-design/p-8efaac1b.entry.js +0 -1
  149. package/dist/ptcw-design/p-a3ef1660.entry.js +0 -1
  150. package/dist/ptcw-design/p-b07df607.entry.js +0 -1
  151. package/dist/ptcw-design/p-b227c7f7.entry.js +0 -1
  152. package/dist/ptcw-design/p-c9762c88.entry.js +0 -1
  153. package/dist/ptcw-design/p-ce8480e3.entry.js +0 -1
  154. package/dist/ptcw-design/p-d428ba40.entry.js +0 -1
  155. package/dist/ptcw-design/p-e00c5964.entry.js +0 -1
  156. package/dist/ptcw-design/p-e1373325.entry.js +0 -1
  157. package/dist/ptcw-design/p-ec22d0b8.entry.js +0 -1
@@ -1,186 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-63ddc79c.js');
6
-
7
- const ptcReadmoreCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block}.box input{opacity:0;position:absolute;pointer-events:none}.box .read-more-text{display:-webkit-box;-webkit-box-orient:vertical;margin:0;overflow:hidden;word-wrap:break-word}.box .line1{-webkit-line-clamp:1}.box .line2{-webkit-line-clamp:2}.box .line3{-webkit-line-clamp:3}.box .line4{-webkit-line-clamp:4}.box .line5{-webkit-line-clamp:5}.box .line10{-webkit-line-clamp:10}.box input~label{display:block;position:relative;cursor:pointer;right:0;margin-top:var(--ptc-element-spacing-02);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);line-height:var(--ptc-line-height-densest);text-decoration-line:underline;color:var(--color-hyperlink);text-align:right;margin-right:var(--ptc-element-spacing-07)}.box input~label.left{text-align:left}.box input~label.right{text-align:right}.box input~label.center{text-align:center;margin-right:0}.box label:focus-visible{outline:none}.box label:focus-visible span{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}.box .z-auto{z-index:auto}.box .z-1{z-index:1}.box .z-2{z-index:2}.box .z-3{z-index:3}.box .z-999{z-index:999}.box input:checked+.read-more-text{-webkit-line-clamp:unset !important}.box .read-more-text:not(.truncated)~label{display:none}.box .show-less-cta{display:block !important}:host .box.add-icon .read-more-cta-label span{display:inline-block;position:relative;padding-right:var(--ptc-element-spacing-03)}:host .box.add-icon .read-more-cta-label span::after{content:\"\";background-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 10 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%2300890B' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E\");width:10px;height:7px;background-size:cover;position:absolute;right:-5px;bottom:7px}:host .box.add-icon .read-more-cta-label.show-less-cta span::after{transform:rotate(180deg)}:host .box.blue .read-more-cta-label{color:var(--color-hyperlink)}:host .box.gray .read-more-cta-label{color:var(--color-gray-10)}:host .box.green .read-more-cta-label{color:var(--color-green-07)}:host .box.initial .read-more-cta-label{color:initial}:host .box.small .read-more-cta-label{font-size:var(--ptc-font-size-x-small);line-height:var(--ptc-line-height-densest)}:host .box.medium .read-more-cta-label{font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-p)}:host .box.large .read-more-cta-label{font-size:var(--ptc-font-size-large);line-height:var(--ptc-line-height-p)}:host .box.large.add-icon .read-more-cta-label span{padding-right:var(--ptc-element-spacing-04)}:host .box.large.add-icon .read-more-cta-label span::after{width:15px;height:10px}";
8
-
9
- const PtcReadmore = class {
10
- constructor(hostRef) {
11
- index.registerInstance(this, hostRef);
12
- this.readmoreToggle = index.createEvent(this, "readmoreToggle", 7);
13
- /**
14
- * Handle keyboard interactions
15
- */
16
- this.handleKeyDown = (event) => {
17
- if (event.key !== "Enter")
18
- return;
19
- const checkBoxEl = this.el.shadowRoot.querySelector("#expanded");
20
- const cta = this.el.shadowRoot.querySelector(".read-more-cta-label");
21
- if (!checkBoxEl || !cta)
22
- return;
23
- checkBoxEl.checked = !checkBoxEl.checked;
24
- const isExpanded = checkBoxEl.checked;
25
- cta.innerHTML = `<span>${isExpanded ? this.lessText || "" : this.moreText || ""}</span>`;
26
- cta.classList.toggle("show-less-cta", isExpanded);
27
- if (isExpanded) {
28
- // Focus on the first element with tabindex="-1" within 'ptc-readmore'
29
- const firstTabIndexMinusOne = this.el.querySelector('[tabindex="-1"]');
30
- firstTabIndexMinusOne === null || firstTabIndexMinusOne === void 0 ? void 0 : firstTabIndexMinusOne.focus();
31
- }
32
- else {
33
- cta.focus();
34
- const readMoreText = this.el.shadowRoot.querySelector(".read-more-text");
35
- readMoreText === null || readMoreText === void 0 ? void 0 : readMoreText.classList.add("truncated");
36
- }
37
- this.setTabIndex();
38
- // if lessText content is not present then add tabindex=-1 to the more/less label
39
- if (cta.textContent == "") {
40
- cta.setAttribute("tabindex", "-1");
41
- }
42
- };
43
- this.moreText = "read more";
44
- this.lessText = undefined;
45
- this.readMorePosition = "right";
46
- this.display = "inline";
47
- this.visibleLines = "line2";
48
- this.visibleLinesCustom = undefined;
49
- this.zIndex = "z-auto";
50
- this.checked = false;
51
- this.size = "small";
52
- this.isIcon = false;
53
- this.color = "blue";
54
- this.isContentSlotted = false;
55
- }
56
- async updateReadmoreStatus() {
57
- setTimeout(() => {
58
- this.addBtnTruncated();
59
- }, 100);
60
- }
61
- addBtnTruncated() {
62
- const appRoot = this.el.shadowRoot;
63
- const ps = appRoot.querySelectorAll(".read-more-text");
64
- ps.forEach((p) => {
65
- // if (this.visibleCharacters){
66
- // const truncatedText = p.textContent.slice(0, this.visibleCharacters);
67
- // p.textContent = truncatedText;
68
- // }
69
- p.classList[p.scrollHeight > p.clientHeight ? "add" : "remove"]("truncated");
70
- });
71
- }
72
- // Created this function to initialize the truncate function on specific elements like tabs
73
- enableAddTruncatedClass(element) {
74
- const allTabHeaders = document.querySelectorAll(element);
75
- for (const element of Array.from(allTabHeaders)) {
76
- let tabHeader = element;
77
- if (tabHeader) {
78
- tabHeader.addEventListener("click", () => {
79
- setTimeout(() => {
80
- this.addBtnTruncated();
81
- }, 100);
82
- });
83
- }
84
- }
85
- }
86
- componentDidLoad() {
87
- this.addBtnTruncated();
88
- document.addEventListener("readystatechange", () => {
89
- if (document.readyState === "complete") {
90
- this.addBtnTruncated();
91
- }
92
- });
93
- this.enableAddTruncatedClass("tab-header");
94
- this.enableAddTruncatedClass("ptc-ellipsis-dropdown");
95
- this.enableAddTruncatedClass("ptc-product-card");
96
- // added code for tabnavigation
97
- setTimeout(() => {
98
- this.setTabIndex();
99
- }, 400);
100
- }
101
- setTabIndex() {
102
- var _a, _b, _c;
103
- //debugger
104
- let links;
105
- if (!this.isContentSlotted) {
106
- links = (_a = this.el) === null || _a === void 0 ? void 0 : _a.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
107
- }
108
- else {
109
- let slot = (_b = this.el) === null || _b === void 0 ? void 0 : _b.querySelector("slot").assignedNodes();
110
- links =
111
- slot[0] instanceof HTMLElement
112
- ? slot[0].querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')
113
- : null;
114
- }
115
- let bottom = 999999;
116
- let rects = (_c = this.el.shadowRoot
117
- .querySelector(".read-more-text")) === null || _c === void 0 ? void 0 : _c.getClientRects();
118
- if (rects && rects.length > 0) {
119
- bottom = rects[0].bottom;
120
- }
121
- if (links) {
122
- links.forEach((link) => {
123
- let linkRects = link.getClientRects();
124
- if (linkRects && linkRects.length > 0) {
125
- if (linkRects[0].top < bottom) {
126
- link.setAttribute("tabindex", "0");
127
- }
128
- else {
129
- link.setAttribute("tabindex", "-1");
130
- }
131
- }
132
- });
133
- }
134
- }
135
- // click event handler
136
- handleClick(event) {
137
- var _a;
138
- let links = (_a = this.el) === null || _a === void 0 ? void 0 : _a.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
139
- this.addBtnTruncated();
140
- // check if the input box is checked
141
- this.checked = event.target.checked;
142
- // Getting cta element
143
- const cta = this.el.shadowRoot.querySelector(".read-more-cta-label");
144
- // Updating the cta text
145
- this.checked
146
- ? (cta.innerHTML = `<span> ${this.lessText ? this.lessText : ""} </span>`)
147
- : (cta.innerHTML = `<span> ${this.moreText ? this.moreText : ""}</span>`);
148
- this.checked
149
- ? cta.classList.add("show-less-cta")
150
- : cta.classList.remove("show-less-cta");
151
- // Emit the state change event
152
- this.readmoreToggle.emit({
153
- event: event,
154
- sender: this.el,
155
- isExpanded: this.checked,
156
- });
157
- if (links) {
158
- if (this.checked) {
159
- links.forEach((link) => {
160
- link.setAttribute("tabindex", "0");
161
- });
162
- }
163
- else {
164
- this.setTabIndex();
165
- }
166
- }
167
- }
168
- render() {
169
- const classMap = this.getCssClassMap();
170
- return (index.h(index.Host, { class: this.display }, index.h("div", { class: classMap }, index.h("input", { type: "checkbox", id: "expanded", onClick: (e) => this.handleClick(e), tabIndex: -1 }), !!this.visibleLines || !!this.visibleLinesCustom ? (index.h("p", { class: `read-more-text ${this.visibleLines}`, style: {
171
- WebkitLineClamp: `${this.visibleLinesCustom}`,
172
- } }, index.h("slot", null))) : null, index.h("label", { onKeyDown: this.handleKeyDown, htmlFor: "expanded", role: "button", class: `${this.zIndex + " " + this.readMorePosition} read-more-cta-label mf-listen`, tabIndex: 0 }, index.h("span", null, this.moreText)))));
173
- }
174
- getCssClassMap() {
175
- return {
176
- ["box"]: true,
177
- [this.color]: true,
178
- [this.size]: true,
179
- ["add-icon"]: this.isIcon,
180
- };
181
- }
182
- get el() { return index.getElement(this); }
183
- };
184
- PtcReadmore.style = ptcReadmoreCss;
185
-
186
- exports.ptc_readmore = PtcReadmore;
@@ -1,38 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-63ddc79c.js');
6
-
7
- const ptcSpacerCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:block;width:12px;min-width:12px;height:12px}@media (min-width: 36em){:host{width:16px;min-width:16px;height:16px}}:host(.ptc-spacer-horizontal){display:inline-block;height:100% !important}:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px}}:host(.ptc-spacer-horizontal.x-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-small){width:8px;min-width:8px}}:host(.ptc-spacer-horizontal.small){width:8px;min-width:8px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.small){width:12px;min-width:12px}}:host(.ptc-spacer-horizontal.medium){height:100%}:host(.ptc-spacer-horizontal.large){width:16px;min-width:16px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.large){width:20px;min-width:20px}}:host(.ptc-spacer-horizontal.x-large){width:20px;min-width:20px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-large){width:28px;min-width:28px}}:host(.ptc-spacer-horizontal.xx-large){width:28px;min-width:28px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-large){width:36px;min-width:36px}}:host(.ptc-spacer-horizontal.xxx-large){width:36px;min-width:36px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxx-large){width:48px;min-width:48px}}:host(.ptc-spacer-horizontal.xxxx-large){width:48px;min-width:48px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxxx-large){width:72px;min-width:72px}}:host(.ptc-spacer-vertical.xx-small){width:100%;height:4px;min-height:4px}:host(.ptc-spacer-vertical.x-small){width:100%;height:4px;min-height:4px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-small){height:8px;min-height:8px}}:host(.ptc-spacer-vertical.small){width:100%;height:8px;min-height:8px}@media (min-width: 36em){:host(.ptc-spacer-vertical.small){height:12px;min-height:12px}}:host(.ptc-spacer-vertical.medium){width:100%}:host(.ptc-spacer-vertical.large){width:100%;height:16px;min-height:16px}@media (min-width: 36em){:host(.ptc-spacer-vertical.large){height:20px;min-height:20px}}:host(.ptc-spacer-vertical.x-large){width:100%;height:20px;min-height:20px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-large){height:28px;min-height:28px}}:host(.ptc-spacer-vertical.xx-large){width:100%;height:28px;min-height:28px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xx-large){height:36px;min-height:36px}}:host(.ptc-spacer-vertical.xxx-large){width:100%;height:36px;min-height:36px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxx-large){height:48px;min-height:48px}}:host(.ptc-spacer-vertical.xxxx-large){width:100%;height:48px;min-height:48px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxxx-large){height:72px;min-height:72px}}:host(.ptc-spacer-vertical.space-144){width:100%;height:144px;min-height:144px}:host(.ptc-spacer-vertical.space-120){width:100%;height:120px;min-height:120px}:host(.ptc-spacer-vertical.space-128){width:100%;height:128px;min-height:128px}:host(.ptc-spacer-xx-small){display:none}@media (max-width: 22.5em){:host(.ptc-spacer-xx-small){display:block}}:host(.ptc-spacer-x-small){display:none}@media (max-width: 35.99em){:host(.ptc-spacer-x-small){display:block}}:host(.ptc-spacer-small){display:none}@media (min-width: 36em){:host(.ptc-spacer-small){display:block}}:host(.ptc-spacer-medium){display:none}@media (min-width: 48em){:host(.ptc-spacer-medium){display:block}}:host(.ptc-spacer-large){display:none}@media (min-width: 62em){:host(.ptc-spacer-large){display:block}}:host(.ptc-spacer-x-large){display:none}@media (min-width: 64.0625em){:host(.ptc-spacer-x-large){display:block}}:host(.ptc-spacer-xx-large){display:none}@media (min-width: 75em){:host(.ptc-spacer-xx-large){display:block}}:host(.ptc-spacer-xxx-large){display:none}@media (min-width: 90em){:host(.ptc-spacer-xxx-large){display:block}}";
8
-
9
- const PtcSpacer = class {
10
- constructor(hostRef) {
11
- index.registerInstance(this, hostRef);
12
- this.breakpoint = "";
13
- this.size = "medium";
14
- this.direction = "vertical";
15
- }
16
- render() {
17
- const classMap = this.getCssClassMap();
18
- return index.h(index.Host, { class: classMap });
19
- }
20
- getCssClassMap() {
21
- return {
22
- [this.size]: true,
23
- ["ptc-spacer-horizontal"]: this.direction === "horizontal",
24
- ["ptc-spacer-vertical"]: this.direction === "vertical",
25
- ["ptc-spacer-xx-small"]: this.breakpoint === "xx-small",
26
- ["ptc-spacer-x-small"]: this.breakpoint === "x-small",
27
- ["ptc-spacer-small"]: this.breakpoint === "small",
28
- ["ptc-spacer-medium"]: this.breakpoint === "medium",
29
- ["ptc-spacer-large"]: this.breakpoint === "large",
30
- ["ptc-spacer-x-large"]: this.breakpoint === "x-large",
31
- ["ptc-spacer-xx-large"]: this.breakpoint === "xx-large",
32
- ["ptc-spacer-xxx-large"]: this.breakpoint === "xxx-large",
33
- };
34
- }
35
- };
36
- PtcSpacer.style = ptcSpacerCss;
37
-
38
- exports.ptc_spacer = PtcSpacer;
@@ -1,161 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-63ddc79c.js');
6
- const utils = require('./utils-0ff09a53.js');
7
-
8
- const ptcTitleCss = "h1.sc-ptc-title,h2.sc-ptc-title,h3.sc-ptc-title,h4.sc-ptc-title,h5.sc-ptc-title,h6.sc-ptc-title,p.sc-ptc-title,ul.sc-ptc-title,li.sc-ptc-title,ptc-subnav.sc-ptc-title,ptc-tab-list.sc-ptc-title,ptc-link.sc-ptc-title,ptc-square-card.sc-ptc-title,.hyphenate-text.sc-ptc-title,ptc-footer.sc-ptc-title{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1.sc-ptc-title,h2.sc-ptc-title,h3.sc-ptc-title,h4.sc-ptc-title,h5.sc-ptc-title,h6.sc-ptc-title,p.sc-ptc-title,ul.sc-ptc-title,li.sc-ptc-title,ptc-subnav.sc-ptc-title,ptc-tab-list.sc-ptc-title,ptc-link.sc-ptc-title,ptc-square-card.sc-ptc-title,.hyphenate-text.sc-ptc-title,ptc-footer.sc-ptc-title{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}div.center.sc-ptc-title{text-align:center}div.center.dotted.sc-ptc-title h1.sc-ptc-title::before,div.center.dotted.sc-ptc-title h2.sc-ptc-title::before,div.center.dotted.sc-ptc-title h3.sc-ptc-title::before,div.center.dotted.sc-ptc-title h4.sc-ptc-title::before,div.center.dotted.sc-ptc-title h5.sc-ptc-title::before,div.center.dotted.sc-ptc-title h6.sc-ptc-title::before{left:50%;transform:translateX(-50%)}div.left.sc-ptc-title{text-align:left;width:100%}div.left.dotted.sc-ptc-title h1.sc-ptc-title::before,div.left.dotted.sc-ptc-title h2.sc-ptc-title::before,div.left.dotted.sc-ptc-title h3.sc-ptc-title::before,div.left.dotted.sc-ptc-title h4.sc-ptc-title::before,div.left.dotted.sc-ptc-title h5.sc-ptc-title::before,div.left.dotted.sc-ptc-title h6.sc-ptc-title::before{left:0%}div.right.sc-ptc-title{text-align:right}div.right.dotted.sc-ptc-title h1.sc-ptc-title::before,div.right.dotted.sc-ptc-title h2.sc-ptc-title::before,div.right.dotted.sc-ptc-title h3.sc-ptc-title::before,div.right.dotted.sc-ptc-title h4.sc-ptc-title::before,div.right.dotted.sc-ptc-title h5.sc-ptc-title::before,div.right.dotted.sc-ptc-title h6.sc-ptc-title::before{right:0%}div.inherit.sc-ptc-title{text-align:inherit}div.dotted.sc-ptc-title h1.sc-ptc-title::before,div.dotted.sc-ptc-title h2.sc-ptc-title::before,div.dotted.sc-ptc-title h3.sc-ptc-title::before,div.dotted.sc-ptc-title h4.sc-ptc-title::before,div.dotted.sc-ptc-title h5.sc-ptc-title::before,div.dotted.sc-ptc-title h6.sc-ptc-title::before{content:\"\";position:absolute;top:-6px;width:30%;display:block;border-top:3px dashed var(--color-green-07)}div.solid.sc-ptc-title h1.sc-ptc-title,div.solid.sc-ptc-title h2.sc-ptc-title,div.solid.sc-ptc-title h3.sc-ptc-title,div.solid.sc-ptc-title h4.sc-ptc-title,div.solid.sc-ptc-title h5.sc-ptc-title,div.solid.sc-ptc-title h6.sc-ptc-title{padding-top:12px}div.solid.sc-ptc-title h1.sc-ptc-title::before,div.solid.sc-ptc-title h2.sc-ptc-title::before,div.solid.sc-ptc-title h3.sc-ptc-title::before,div.solid.sc-ptc-title h4.sc-ptc-title::before,div.solid.sc-ptc-title h5.sc-ptc-title::before,div.solid.sc-ptc-title h6.sc-ptc-title::before{content:\"\";position:absolute;width:100%;height:0.7px;background-color:var(--color-gray-03);opacity:0.9;left:0px;top:0}div.solid.sc-ptc-title h1.sc-ptc-title::after,div.solid.sc-ptc-title h2.sc-ptc-title::after,div.solid.sc-ptc-title h3.sc-ptc-title::after,div.solid.sc-ptc-title h4.sc-ptc-title::after,div.solid.sc-ptc-title h5.sc-ptc-title::after,div.solid.sc-ptc-title h6.sc-ptc-title::after{content:\"\";position:absolute;width:56px;height:2px;background-color:var(--color-green-07);top:-2px;left:0px}div.is-standard.sc-ptc-title h1.sc-ptc-title,div.is-standard.sc-ptc-title h2.sc-ptc-title,div.is-standard.sc-ptc-title h3.sc-ptc-title,div.is-standard.sc-ptc-title h4.sc-ptc-title,div.is-standard.sc-ptc-title h5.sc-ptc-title,div.is-standard.sc-ptc-title h6.sc-ptc-title{display:inline-block;position:relative}div.is-standard.sc-ptc-title h1.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-extrabold);letter-spacing:0px;color:var(--color-gray-10)}@media only screen and (min-width: 768px){div.is-standard.sc-ptc-title h1.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.is-standard.sc-ptc-title h2.sc-ptc-title{font-size:var(--ptc-font-size-x-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-extrabold);color:var(--color-gray-10)}@media only screen and (min-width: 768px){div.is-standard.sc-ptc-title h2.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}}div.is-plm-hub.sc-ptc-title h1.sc-ptc-title,div.is-plm-hub.sc-ptc-title h2.sc-ptc-title,div.is-plm-hub.sc-ptc-title h3.sc-ptc-title,div.is-plm-hub.sc-ptc-title h4.sc-ptc-title,div.is-plm-hub.sc-ptc-title h5.sc-ptc-title,div.is-plm-hub.sc-ptc-title h6.sc-ptc-title{display:inline-block;position:relative;margin-block-start:0em;margin-block-end:0em;margin-inline-start:0px;margin-inline-end:0px;color:var(--color-white) !important}div.margin-flush.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-flush.sc-ptc-title h1.sc-ptc-title,div.margin-flush.sc-ptc-title h2.sc-ptc-title,div.margin-flush.sc-ptc-title h3.sc-ptc-title,div.margin-flush.sc-ptc-title h4.sc-ptc-title,div.margin-flush.sc-ptc-title h5.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-top-2.sc-ptc-title{margin-top:var(--ptc-element-spacing-02);margin-bottom:0}div.margin-top-3.sc-ptc-title{margin-top:var(--ptc-element-spacing-03);margin-bottom:0}div.margin-top-4.sc-ptc-title{margin-top:var(--ptc-element-spacing-04);margin-bottom:0}div.margin-top-5.sc-ptc-title{margin-top:var(--ptc-element-spacing-05);margin-bottom:0}div.margin-top-6.sc-ptc-title{margin-top:var(--ptc-element-spacing-06);margin-bottom:0}div.margin-bottom-2.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-02);margin-top:0}div.margin-bottom-3.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-03);margin-top:0}div.margin-bottom-4.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-04);margin-top:0}div.margin-bottom-5.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-05);margin-top:0}div.margin-bottom-6.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-06);margin-top:0}div.margin-2.sc-ptc-title{margin-top:var(--ptc-element-spacing-02);margin-bottom:var(--ptc-element-spacing-02)}div.margin-3.sc-ptc-title{margin-top:var(--ptc-element-spacing-03);margin-bottom:var(--ptc-element-spacing-03)}div.margin-4.sc-ptc-title{margin-top:var(--ptc-element-spacing-04);margin-bottom:var(--ptc-element-spacing-04)}div.margin-5.sc-ptc-title{margin-top:var(--ptc-element-spacing-05);margin-bottom:var(--ptc-element-spacing-05)}div.margin-5.sc-ptc-title h4.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-6.sc-ptc-title{margin-top:var(--ptc-element-spacing-06);margin-bottom:var(--ptc-element-spacing-06)}div.margin-9.sc-ptc-title{margin-top:var(--ptc-element-spacing-09);margin-bottom:var(--ptc-element-spacing-09)}div.green.sc-ptc-title h1.sc-ptc-title,div.green.sc-ptc-title h2.sc-ptc-title,div.green.sc-ptc-title h3.sc-ptc-title,div.green.sc-ptc-title h4.sc-ptc-title,div.green.sc-ptc-title h5.sc-ptc-title,div.green.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-green-07)}div.blue.sc-ptc-title h1.sc-ptc-title,div.blue.sc-ptc-title h2.sc-ptc-title,div.blue.sc-ptc-title h3.sc-ptc-title,div.blue.sc-ptc-title h4.sc-ptc-title,div.blue.sc-ptc-title h5.sc-ptc-title,div.blue.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-blue-07)}div.red.sc-ptc-title h1.sc-ptc-title,div.red.sc-ptc-title h2.sc-ptc-title,div.red.sc-ptc-title h3.sc-ptc-title,div.red.sc-ptc-title h4.sc-ptc-title,div.red.sc-ptc-title h5.sc-ptc-title,div.red.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-red-07)}div.orange.sc-ptc-title h1.sc-ptc-title,div.orange.sc-ptc-title h2.sc-ptc-title,div.orange.sc-ptc-title h3.sc-ptc-title,div.orange.sc-ptc-title h4.sc-ptc-title,div.orange.sc-ptc-title h5.sc-ptc-title,div.orange.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-orange-07)}div.slate-grey.sc-ptc-title h1.sc-ptc-title,div.slate-grey.sc-ptc-title h2.sc-ptc-title,div.slate-grey.sc-ptc-title h3.sc-ptc-title,div.slate-grey.sc-ptc-title h4.sc-ptc-title,div.slate-grey.sc-ptc-title h5.sc-ptc-title,div.slate-grey.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-gray-07)}div.w-3.sc-ptc-title h1.sc-ptc-title,div.w-3.sc-ptc-title h2.sc-ptc-title,div.w-3.sc-ptc-title h3.sc-ptc-title,div.w-3.sc-ptc-title h4.sc-ptc-title,div.w-3.sc-ptc-title h5.sc-ptc-title,div.w-3.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-thin)}div.w-4.sc-ptc-title h1.sc-ptc-title,div.w-4.sc-ptc-title h2.sc-ptc-title,div.w-4.sc-ptc-title h3.sc-ptc-title,div.w-4.sc-ptc-title h4.sc-ptc-title,div.w-4.sc-ptc-title h5.sc-ptc-title,div.w-4.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-regular)}div.w-5.sc-ptc-title h1.sc-ptc-title,div.w-5.sc-ptc-title h2.sc-ptc-title,div.w-5.sc-ptc-title h3.sc-ptc-title,div.w-5.sc-ptc-title h4.sc-ptc-title,div.w-5.sc-ptc-title h5.sc-ptc-title,div.w-5.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-medium)}div.w-6.sc-ptc-title h1.sc-ptc-title,div.w-6.sc-ptc-title h2.sc-ptc-title,div.w-6.sc-ptc-title h3.sc-ptc-title,div.w-6.sc-ptc-title h4.sc-ptc-title,div.w-6.sc-ptc-title h5.sc-ptc-title,div.w-6.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-semibold)}div.w-7.sc-ptc-title h1.sc-ptc-title,div.w-7.sc-ptc-title h2.sc-ptc-title,div.w-7.sc-ptc-title h3.sc-ptc-title,div.w-7.sc-ptc-title h4.sc-ptc-title,div.w-7.sc-ptc-title h5.sc-ptc-title,div.w-7.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-bold)}div.w-8.sc-ptc-title h1.sc-ptc-title,div.w-8.sc-ptc-title h2.sc-ptc-title,div.w-8.sc-ptc-title h3.sc-ptc-title,div.w-8.sc-ptc-title h4.sc-ptc-title,div.w-8.sc-ptc-title h5.sc-ptc-title,div.w-8.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-extrabold)}div.w-9.sc-ptc-title h1.sc-ptc-title,div.w-9.sc-ptc-title h2.sc-ptc-title,div.w-9.sc-ptc-title h3.sc-ptc-title,div.w-9.sc-ptc-title h4.sc-ptc-title,div.w-9.sc-ptc-title h5.sc-ptc-title,div.w-9.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-black)}div.xx-small.sc-ptc-title h1.sc-ptc-title,div.xx-small.sc-ptc-title h2.sc-ptc-title,div.xx-small.sc-ptc-title h3.sc-ptc-title,div.xx-small.sc-ptc-title h4.sc-ptc-title,div.xx-small.sc-ptc-title h5.sc-ptc-title,div.xx-small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xx-small)}div.x-small.sc-ptc-title h1.sc-ptc-title,div.x-small.sc-ptc-title h2.sc-ptc-title,div.x-small.sc-ptc-title h3.sc-ptc-title,div.x-small.sc-ptc-title h4.sc-ptc-title,div.x-small.sc-ptc-title h5.sc-ptc-title,div.x-small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-x-small)}div.small.sc-ptc-title h1.sc-ptc-title,div.small.sc-ptc-title h2.sc-ptc-title,div.small.sc-ptc-title h3.sc-ptc-title,div.small.sc-ptc-title h4.sc-ptc-title,div.small.sc-ptc-title h5.sc-ptc-title,div.small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-small)}div.medium.sc-ptc-title h1.sc-ptc-title,div.medium.sc-ptc-title h2.sc-ptc-title,div.medium.sc-ptc-title h3.sc-ptc-title,div.medium.sc-ptc-title h4.sc-ptc-title,div.medium.sc-ptc-title h5.sc-ptc-title,div.medium.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-medium)}div.large.sc-ptc-title h1.sc-ptc-title,div.large.sc-ptc-title h2.sc-ptc-title,div.large.sc-ptc-title h3.sc-ptc-title,div.large.sc-ptc-title h4.sc-ptc-title,div.large.sc-ptc-title h5.sc-ptc-title,div.large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-large)}div.large.sc-ptc-title h3.sc-ptc-title{font-size:var(--ptc-font-size-medium)}@media only screen and (min-width: 768px){div.large.sc-ptc-title h3.sc-ptc-title{font-size:var(--ptc-font-size-large)}}div.x-large.sc-ptc-title h1.sc-ptc-title,div.x-large.sc-ptc-title h2.sc-ptc-title,div.x-large.sc-ptc-title h3.sc-ptc-title,div.x-large.sc-ptc-title h4.sc-ptc-title,div.x-large.sc-ptc-title h5.sc-ptc-title,div.x-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-x-large)}div.xx-large.sc-ptc-title h1.sc-ptc-title,div.xx-large.sc-ptc-title h2.sc-ptc-title,div.xx-large.sc-ptc-title h3.sc-ptc-title,div.xx-large.sc-ptc-title h4.sc-ptc-title{font-size:var(--ptc-font-size-x-large)}@media only screen and (min-width: 768px){div.xx-large.sc-ptc-title h1.sc-ptc-title,div.xx-large.sc-ptc-title h2.sc-ptc-title,div.xx-large.sc-ptc-title h3.sc-ptc-title,div.xx-large.sc-ptc-title h4.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}}div.xxx-large.sc-ptc-title h1.sc-ptc-title,div.xxx-large.sc-ptc-title h2.sc-ptc-title,div.xxx-large.sc-ptc-title h3.sc-ptc-title,div.xxx-large.sc-ptc-title h4.sc-ptc-title,div.xxx-large.sc-ptc-title h5.sc-ptc-title,div.xxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}@media only screen and (min-width: 768px){div.xxx-large.sc-ptc-title h1.sc-ptc-title,div.xxx-large.sc-ptc-title h2.sc-ptc-title,div.xxx-large.sc-ptc-title h3.sc-ptc-title,div.xxx-large.sc-ptc-title h4.sc-ptc-title,div.xxx-large.sc-ptc-title h5.sc-ptc-title,div.xxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}}div.xxxx-large.sc-ptc-title h1.sc-ptc-title,div.xxxx-large.sc-ptc-title h2.sc-ptc-title,div.xxxx-large.sc-ptc-title h3.sc-ptc-title,div.xxxx-large.sc-ptc-title h4.sc-ptc-title,div.xxxx-large.sc-ptc-title h5.sc-ptc-title,div.xxxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}@media only screen and (min-width: 768px){div.xxxx-large.sc-ptc-title h1.sc-ptc-title,div.xxxx-large.sc-ptc-title h2.sc-ptc-title,div.xxxx-large.sc-ptc-title h3.sc-ptc-title,div.xxxx-large.sc-ptc-title h4.sc-ptc-title,div.xxxx-large.sc-ptc-title h5.sc-ptc-title,div.xxxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.xx-large-allbp.sc-ptc-title h1.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h2.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h3.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h4.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h5.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}div.xxxx-large-allbp.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}div.xxxx-large-desktop.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}@media only screen and (min-width: 992px){div.xxxx-large-desktop.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.xxxx-large-store.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}@media only screen and (min-width: 992px){div.xxxx-large-store.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.densest.sc-ptc-title h1.sc-ptc-title,div.densest.sc-ptc-title h2.sc-ptc-title,div.densest.sc-ptc-title h3.sc-ptc-title,div.densest.sc-ptc-title h4.sc-ptc-title,div.densest.sc-ptc-title h5.sc-ptc-title,div.densest.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-densest)}div.denser.sc-ptc-title h1.sc-ptc-title,div.denser.sc-ptc-title h2.sc-ptc-title,div.denser.sc-ptc-title h3.sc-ptc-title,div.denser.sc-ptc-title h4.sc-ptc-title,div.denser.sc-ptc-title h5.sc-ptc-title,div.denser.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-denser)}div.dense.sc-ptc-title h1.sc-ptc-title,div.dense.sc-ptc-title h2.sc-ptc-title,div.dense.sc-ptc-title h3.sc-ptc-title,div.dense.sc-ptc-title h4.sc-ptc-title,div.dense.sc-ptc-title h5.sc-ptc-title,div.dense.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-dense)}div.normal.sc-ptc-title h1.sc-ptc-title,div.normal.sc-ptc-title h2.sc-ptc-title,div.normal.sc-ptc-title h3.sc-ptc-title,div.normal.sc-ptc-title h4.sc-ptc-title,div.normal.sc-ptc-title h5.sc-ptc-title,div.normal.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-normal)}div.loose.sc-ptc-title h1.sc-ptc-title,div.loose.sc-ptc-title h2.sc-ptc-title,div.loose.sc-ptc-title h3.sc-ptc-title,div.loose.sc-ptc-title h4.sc-ptc-title,div.loose.sc-ptc-title h5.sc-ptc-title,div.loose.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-loose)}div.looser.sc-ptc-title h1.sc-ptc-title,div.looser.sc-ptc-title h2.sc-ptc-title,div.looser.sc-ptc-title h3.sc-ptc-title,div.looser.sc-ptc-title h4.sc-ptc-title,div.looser.sc-ptc-title h5.sc-ptc-title,div.looser.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-looser)}div.paragraph.sc-ptc-title h1.sc-ptc-title,div.paragraph.sc-ptc-title h2.sc-ptc-title,div.paragraph.sc-ptc-title h3.sc-ptc-title,div.paragraph.sc-ptc-title h4.sc-ptc-title,div.paragraph.sc-ptc-title h5.sc-ptc-title,div.paragraph.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-paragraph)}div.black.sc-ptc-title h1.sc-ptc-title,div.black.sc-ptc-title h2.sc-ptc-title,div.black.sc-ptc-title h3.sc-ptc-title,div.black.sc-ptc-title h4.sc-ptc-title,div.black.sc-ptc-title h5.sc-ptc-title,div.black.sc-ptc-title h6.sc-ptc-title{color:var(--color-black)}div.white.sc-ptc-title h1.sc-ptc-title,div.white.sc-ptc-title h2.sc-ptc-title,div.white.sc-ptc-title h3.sc-ptc-title,div.white.sc-ptc-title h4.sc-ptc-title,div.white.sc-ptc-title h5.sc-ptc-title,div.white.sc-ptc-title h6.sc-ptc-title{color:var(--color-white)}div.gray-1.sc-ptc-title h1.sc-ptc-title,div.gray-1.sc-ptc-title h2.sc-ptc-title,div.gray-1.sc-ptc-title h3.sc-ptc-title,div.gray-1.sc-ptc-title h4.sc-ptc-title,div.gray-1.sc-ptc-title h5.sc-ptc-title,div.gray-1.sc-ptc-title h6.sc-ptc-title{color:var(--color-gray-01)}div.gray.sc-ptc-title h1.sc-ptc-title,div.gray.sc-ptc-title h2.sc-ptc-title,div.gray.sc-ptc-title h3.sc-ptc-title,div.gray.sc-ptc-title h4.sc-ptc-title,div.gray.sc-ptc-title h5.sc-ptc-title,div.gray.sc-ptc-title h6.sc-ptc-title{color:var(--color-gray-10)}div.gray-darker.sc-ptc-title h1.sc-ptc-title,div.gray-darker.sc-ptc-title h2.sc-ptc-title,div.gray-darker.sc-ptc-title h3.sc-ptc-title,div.gray-darker.sc-ptc-title h4.sc-ptc-title,div.gray-darker.sc-ptc-title h5.sc-ptc-title,div.gray-darker.sc-ptc-title h6.sc-ptc-title{color:var(--color-gray-11)}div.ellipsis-boxing.sc-ptc-title h1.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h2.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h3.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h4.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h5.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h6.sc-ptc-title{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;overflow-wrap:break-word;padding-bottom:0}div.block.sc-ptc-title h1.sc-ptc-title,div.block.sc-ptc-title h2.sc-ptc-title,div.block.sc-ptc-title h3.sc-ptc-title,div.block.sc-ptc-title h4.sc-ptc-title,div.block.sc-ptc-title h5.sc-ptc-title,div.block.sc-ptc-title h6.sc-ptc-title{display:block}.line-clamp-title.sc-ptc-title{display:-webkit-box !important;-webkit-box-orient:vertical;overflow:hidden}.sc-ptc-title-h{display:block}.sc-ptc-title-h div.sc-ptc-title{position:relative}";
9
-
10
- const PtcTitle = class {
11
- constructor(hostRef) {
12
- index.registerInstance(this, hostRef);
13
- this.isPlmHub = false;
14
- this.type = "h2";
15
- this.textAlign = undefined;
16
- this.upperline = "dotted";
17
- this.titleShadow = undefined;
18
- this.titleColor = "gray";
19
- this.titleMargin = undefined;
20
- this.titleWeight = undefined;
21
- this.titleSize = undefined;
22
- this.titleHeight = "densest";
23
- this.styles = undefined;
24
- this.ellipsisLineCutoff = undefined;
25
- this.titleDisplay = "inline-block";
26
- this.seoCompatibilityMode = false;
27
- this.tooltipZIndex = "auto";
28
- this.tooltipPosition = "bottom";
29
- this.tooltipTheme = "standard";
30
- this.enableTooltip = false;
31
- this.maxChars = undefined;
32
- this.maxLines = undefined;
33
- this.hideTooltipOnMobile = false;
34
- this.ismob = undefined;
35
- this.tooltipWidth = "default";
36
- }
37
- // Tooltip Properties ends
38
- componentDidLoad() {
39
- if (this.hideTooltipOnMobile) {
40
- this.el.classList.add("hide-tooltip-on-mobile");
41
- }
42
- this.el.addEventListener("mouseenter", () => this.toggleTitleTooltip(true));
43
- this.el.addEventListener("mouseleave", () => this.toggleTitleTooltip(false));
44
- }
45
- render() {
46
- if (this.seoCompatibilityMode) {
47
- return this.seoCompRender();
48
- }
49
- else {
50
- return this.standardRender();
51
- }
52
- }
53
- getSortedText(content) {
54
- if (!this.enableTooltip)
55
- return;
56
- const trimmedContent = content.trim();
57
- const shouldTruncate = trimmedContent.length > this.maxChars && !this.maxLines;
58
- return shouldTruncate
59
- ? trimmedContent.slice(0, this.maxChars) + "..."
60
- : trimmedContent;
61
- }
62
- toggleTitleTooltip(show) {
63
- var _a;
64
- const tooltipClass = "tooltip-box";
65
- const existingTooltip = this.el.querySelector(`.${tooltipClass}`);
66
- const text = this.el.querySelectorAll(".line-clamp-title");
67
- let maxLinesShowCheck = false;
68
- if (text) {
69
- text.forEach((t) => {
70
- maxLinesShowCheck = t.scrollHeight > t.clientHeight;
71
- });
72
- }
73
- const ifCharExceeds = this.tooltipText &&
74
- this.tooltipText.length > this.maxChars &&
75
- !this.maxLines;
76
- const ifLinesExceeds = this.maxLines && maxLinesShowCheck;
77
- if (show && this.enableTooltip) {
78
- if ((!existingTooltip && ifCharExceeds) ||
79
- (!existingTooltip && ifLinesExceeds)) {
80
- const tooltipMarkup = document.createElement("div");
81
- tooltipMarkup.className = tooltipClass;
82
- tooltipMarkup.innerText = this.tooltipText;
83
- tooltipMarkup.style.zIndex = String(this.tooltipZIndex); // Ensures zIndex is a string
84
- tooltipMarkup.classList.add(this.tooltipPosition, this.tooltipTheme, this.tooltipWidth);
85
- if (this.hideTooltipOnMobile) {
86
- tooltipMarkup.classList.add("hide-tooltip-mobile");
87
- }
88
- (_a = this.el.querySelector("div")) === null || _a === void 0 ? void 0 : _a.appendChild(tooltipMarkup);
89
- }
90
- }
91
- else {
92
- existingTooltip === null || existingTooltip === void 0 ? void 0 : existingTooltip.remove();
93
- }
94
- }
95
- seoCompRender() {
96
- const classMap = this.getCssClassMap();
97
- const cutOff = this.getLineCuttoff();
98
- const [TagType, firstChild] = utils.getSeoTagType(this.el, this.type);
99
- let html = firstChild && firstChild.innerHTML;
100
- // added for tooltip
101
- this.tooltipText = html.trim();
102
- let eleText = firstChild && firstChild.innerText;
103
- html = this.enableTooltip ? this.getSortedText(eleText) : html;
104
- if (this.el == firstChild) {
105
- this.el.innerHTML = "";
106
- }
107
- return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h("div", { class: classMap }, index.h(TagType, { innerHTML: html, style: cutOff, class: this.maxLines && this.maxLines > 0
108
- ? "line-clamp-title"
109
- : "" }))));
110
- }
111
- standardRender() {
112
- const classMap = this.getCssClassMap();
113
- const cutOff = this.getLineCuttoff();
114
- let TagType;
115
- switch (this.type) {
116
- case "h1":
117
- TagType = "h1";
118
- break;
119
- case "h3":
120
- TagType = "h3";
121
- break;
122
- case "h4":
123
- TagType = "h4";
124
- break;
125
- case "h5":
126
- TagType = "h5";
127
- break;
128
- case "h6":
129
- TagType = "h6";
130
- break;
131
- default:
132
- TagType = "h2";
133
- }
134
- return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h("div", { class: classMap }, index.h(TagType, { style: cutOff }, index.h("slot", null)))));
135
- }
136
- getCssClassMap() {
137
- return {
138
- [this.textAlign]: !!this.textAlign ? true : false,
139
- [this.upperline]: true,
140
- [this.isPlmHub ? "is-plm-hub" : "is-standard"]: true,
141
- [this.titleMargin]: !!this.titleMargin ? true : false,
142
- [this.titleShadow]: !!this.titleShadow ? true : false,
143
- [this.titleWeight]: !!this.titleWeight ? true : false,
144
- [this.titleSize]: !!this.titleSize ? true : false,
145
- [this.titleHeight]: !!this.titleHeight ? true : false,
146
- [this.titleColor]: !!this.titleColor ? true : false,
147
- ["ellipsis-boxing"]: this.ellipsisLineCutoff && this.ellipsisLineCutoff > 0,
148
- [this.titleDisplay]: !!this.titleDisplay ? true : false,
149
- };
150
- }
151
- getLineCuttoff() {
152
- const lineClamp = this.ellipsisLineCutoff > 0
153
- ? this.ellipsisLineCutoff
154
- : this.maxLines;
155
- return lineClamp > 0 ? { "-webkit-line-clamp": `${lineClamp}` } : {};
156
- }
157
- get el() { return index.getElement(this); }
158
- };
159
- PtcTitle.style = ptcTitleCss;
160
-
161
- exports.ptc_title = PtcTitle;
@@ -1,113 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-63ddc79c.js');
6
-
7
- const ptcTooltipCss = "h1.sc-ptc-tooltip,h2.sc-ptc-tooltip,h3.sc-ptc-tooltip,h4.sc-ptc-tooltip,h5.sc-ptc-tooltip,h6.sc-ptc-tooltip,p.sc-ptc-tooltip,ul.sc-ptc-tooltip,li.sc-ptc-tooltip,ptc-subnav.sc-ptc-tooltip,ptc-tab-list.sc-ptc-tooltip,ptc-link.sc-ptc-tooltip,ptc-square-card.sc-ptc-tooltip,.hyphenate-text.sc-ptc-tooltip,ptc-footer.sc-ptc-tooltip{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1.sc-ptc-tooltip,h2.sc-ptc-tooltip,h3.sc-ptc-tooltip,h4.sc-ptc-tooltip,h5.sc-ptc-tooltip,h6.sc-ptc-tooltip,p.sc-ptc-tooltip,ul.sc-ptc-tooltip,li.sc-ptc-tooltip,ptc-subnav.sc-ptc-tooltip,ptc-tab-list.sc-ptc-tooltip,ptc-link.sc-ptc-tooltip,ptc-square-card.sc-ptc-tooltip,.hyphenate-text.sc-ptc-tooltip,ptc-footer.sc-ptc-tooltip{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.sc-ptc-tooltip-h{position:relative}.inline.sc-ptc-tooltip-h{display:inline}.inline.sc-ptc-tooltip-h .text-content.sc-ptc-tooltip{display:inline}.block.sc-ptc-tooltip-h{display:block}.text-ellipsis.sc-ptc-tooltip{position:relative;display:inline}.text-ellipsis.sc-ptc-tooltip:not(.truncated){z-index:auto !important}.z-auto.sc-ptc-tooltip{z-index:auto}.z-1.sc-ptc-tooltip{z-index:1}.z-2.sc-ptc-tooltip{z-index:2}.z-3.sc-ptc-tooltip{z-index:3}.z-999.sc-ptc-tooltip{z-index:999}.tooltip.sc-ptc-tooltip{position:absolute;padding:8px;color:var(--color-white);font-size:var(--ptc-font-size-xxx-small);font-weight:var(--ptc-font-weight-semibold);background:var(--color-gray-09);box-shadow:0px 2px 4px rgba(0, 0, 0, 0.3);border:none;border-radius:2px;width:auto;height:auto;visibility:hidden;text-align:left;text-shadow:none;white-space:normal}.tooltip.sc-ptc-tooltip span.sc-ptc-tooltip{word-break:initial}@media only screen and (min-width: 480px){.tooltip.sc-ptc-tooltip{width:273px}}.tooltip.danger.sc-ptc-tooltip{color:var(--color-red-07);font-family:var(--ptc-font-latin);font-weight:var(--ptc-font-weight-semibold);font-size:var(--ptc-font-size-xx-small);line-height:var(--ptc-line-height-p);border:2px solid var(--color-red-07);border-radius:var(--ptc-border-radius-standard);background-color:var(--color-white);padding:var(--ptc-element-spacing-06)}.tooltip.danger.sc-ptc-tooltip a.sc-ptc-tooltip{color:var(--color-hyperlink)}.tooltip.bottom.sc-ptc-tooltip{bottom:-12px;transform:translateY(100%)}.tooltip.bottom.sc-ptc-tooltip::after{top:1px;left:50%;transform:translate(-50%, -100%);border:8px solid transparent;border-bottom:8px solid var(--color-gray-09)}.tooltip.left.sc-ptc-tooltip{bottom:-12px;transform:translate(-80%, 100%)}.tooltip.left.sc-ptc-tooltip::after{top:1px;right:8px;transform:translateY(-100%);border:8px solid transparent;border-bottom:8px solid var(--color-gray-09)}.tooltip.right.sc-ptc-tooltip{bottom:-12px;transform:translateY(100%);right:0px}@-moz-document url-prefix(){.tooltip.right{right:unset !important;bottom:unset !important;transform:translate(60%, 8px) !important}@media screen and (min-width: 992px){.tooltip.right{transform:translate(100%, 8px) !important}}}.tooltip.right.sc-ptc-tooltip::after{top:1px;left:8px;transform:translateY(-100%);border:8px solid transparent;border-bottom:8px solid var(--color-gray-09)}.tooltip.top.sc-ptc-tooltip{top:-8px;transform:translateY(-100%)}.tooltip.top.sc-ptc-tooltip::after{left:50%;bottom:1px;transform:translate(-50%, 100%);border:8px solid transparent;border-top:8px solid var(--color-gray-09)}.tooltip.bottom-right.sc-ptc-tooltip{bottom:-12px;transform:translate(-60%, 100%)}.tooltip.bottom-right.sc-ptc-tooltip::after{top:1px;left:75%;transform:translate(-50%, -100%);border:8px solid transparent;border-bottom:8px solid var(--color-gray-09)}.tooltip.danger.sc-ptc-tooltip::after{top:0;border-bottom:8px solid var(--color-red-07)}.tooltip.side-left.sc-ptc-tooltip{bottom:12px;transform:translateX(-112%)}@media only screen and (min-width: 768px){.tooltip.side-left.sc-ptc-tooltip{bottom:4px}}.tooltip.side-left.sc-ptc-tooltip::after{top:50%;right:-15px;transform:translateY(-50%);border:8px solid transparent;border-left:8px solid var(--color-gray-09)}.truncated.sc-ptc-tooltip{cursor:help}.truncated.sc-ptc-tooltip:hover+.tooltip.sc-ptc-tooltip{visibility:visible;z-index:9999}.wrapper-content.sc-ptc-tooltip{display:inline-block;position:relative}.wrapper-content.sc-ptc-tooltip .tooltip.sc-ptc-tooltip{width:auto;min-width:72px;max-width:273px}.wrapper-content.sc-ptc-tooltip .slot-content.sc-ptc-tooltip:hover+.tooltip.sc-ptc-tooltip{visibility:visible;z-index:9999}.tooltip.sc-ptc-tooltip::after{content:\"\";position:absolute}.ellipsis-by-line-boxing.sc-ptc-tooltip{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;overflow-wrap:break-word;padding-bottom:0}.full-width.sc-ptc-tooltip-h .tooltip.sc-ptc-tooltip{width:100%}@media only screen and (min-width: 480px){.full-width.sc-ptc-tooltip-h .tooltip.sc-ptc-tooltip{width:100%}}.no-overflow.sc-ptc-tooltip-h .tooltip.sc-ptc-tooltip{display:none !important}.no-overflow.sc-ptc-tooltip-h .truncated.sc-ptc-tooltip.sc-ptc-tooltip{cursor:pointer}";
8
-
9
- const PtcTooltip = class {
10
- constructor(hostRef) {
11
- index.registerInstance(this, hostRef);
12
- this.textDisplay = "inline";
13
- this.maxLength = 45;
14
- this.textLines = undefined;
15
- this.description = "This is a tooltip text placeholder";
16
- this.zIndex = "z-auto";
17
- this.position = "bottom";
18
- this.styles = undefined;
19
- this.mode = "text-only";
20
- this.theme = "standard";
21
- this.width = "default";
22
- this.hideOnMobile = false;
23
- this.isSmallScreen = undefined;
24
- this.noOverflow = false;
25
- }
26
- addTruncatedClass() {
27
- const appRoot = this.el;
28
- const text = appRoot.querySelectorAll(".ellipsis-by-line-boxing");
29
- text.forEach((t) => {
30
- t.classList[t.scrollHeight > t.clientHeight ? "add" : "remove"]("truncated");
31
- });
32
- }
33
- windowResize() {
34
- this.verifiyScreenSize();
35
- }
36
- verifiyScreenSize() {
37
- this.isSmallScreen = window.innerWidth < 768;
38
- }
39
- // Created this function to initialize the truncate function on specific elements like tabs
40
- enableAddTruncatedClass(element) {
41
- const allTabHeaders = document.querySelectorAll(element);
42
- for (const element of Array.from(allTabHeaders)) {
43
- let tabHeader = element;
44
- if (tabHeader) {
45
- tabHeader.addEventListener("click", () => {
46
- setTimeout(() => {
47
- this.addTruncatedClass();
48
- }, 100);
49
- });
50
- }
51
- }
52
- }
53
- componentWillLoad() {
54
- this.verifiyScreenSize();
55
- }
56
- componentDidLoad() {
57
- //this.addTruncatedClass();
58
- setTimeout(() => {
59
- this.addTruncatedClass();
60
- }, 1000);
61
- this.enableAddTruncatedClass("tab-header");
62
- this.enableAddTruncatedClass("ptc-ellipsis-dropdown");
63
- this.enableAddTruncatedClass("ptc-product-card");
64
- document.addEventListener("readystatechange", () => {
65
- if (document.readyState === "complete") {
66
- this.addTruncatedClass();
67
- }
68
- });
69
- }
70
- render() {
71
- if (this.mode == "wrapper") {
72
- return (index.h(index.Host, { class: this.textDisplay }, this.styles && index.h("style", null, this.styles), index.h("div", { class: "wrapper-content" }, index.h("div", { class: "slot-content" }, index.h("slot", null)), index.h("div", { class: `tooltip ${this.position} ${this.theme}` }, index.h("slot", { name: "description" }), this.description && (index.h("span", { innerHTML: this.description }))))));
73
- }
74
- else {
75
- const classMap = this.getCssClassMap();
76
- const cutOff = this.getLineCuttoff();
77
- let truncatedText = this.description.substring(0, this.maxLength);
78
- if (this.description.length > this.maxLength) {
79
- //const lastSpace = truncatedText.lastIndexOf(' ');
80
- //truncatedText = truncatedText.substring(0, lastSpace);
81
- truncatedText += "... ";
82
- }
83
- return (index.h(index.Host, { class: {
84
- [this.textDisplay]: true,
85
- [this.width]: true,
86
- "no-overflow": this.noOverflow,
87
- } }, this.styles && index.h("style", null, this.styles), this.hideOnMobile && this.isSmallScreen ? (index.h("div", null, this.description)) : (index.h("div", { class: "text-content" }, this.textLines > 0 && !!this.textLines ? (index.h("div", { class: "ellipsis-by-line-boxing", style: cutOff, innerHTML: this.description })) : (index.h("div", { class: classMap }, truncatedText)), index.h("div", { class: `tooltip ${this.position} ${this.theme}`, innerHTML: this.description })))));
88
- }
89
- }
90
- getCssClassMap() {
91
- return {
92
- // ['ellipsis-by-line-boxing']: this.textLines && this.textLines > 0,
93
- ["text-ellipsis"]: true,
94
- [this.zIndex]: this.description.length > this.maxLength ? true : false,
95
- ["truncated"]: this.description.length > this.maxLength && !this.textLines
96
- ? true
97
- : false,
98
- };
99
- }
100
- getLineCuttoff() {
101
- let result;
102
- if (this.textLines && this.textLines > 0) {
103
- result = {
104
- ["-webkit-line-clamp"]: `${this.textLines}`,
105
- };
106
- }
107
- return result;
108
- }
109
- get el() { return index.getElement(this); }
110
- };
111
- PtcTooltip.style = ptcTooltipCss;
112
-
113
- exports.ptc_tooltip = PtcTooltip;