@ptcwebops/ptcw-design 6.1.21 → 6.1.22

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 (82) hide show
  1. package/dist/cjs/blog-detail-content_2.cjs.entry.js +1 -1
  2. package/dist/cjs/blog-detail-layout.cjs.entry.js +1 -1
  3. package/dist/cjs/fl-tab-content_3.cjs.entry.js +8 -6
  4. package/dist/cjs/icon-asset.cjs.entry.js +1 -1
  5. package/dist/cjs/loader.cjs.js +1 -1
  6. package/dist/cjs/ptc-card-bottom_2.cjs.entry.js +1 -1
  7. package/dist/cjs/ptc-card_2.cjs.entry.js +1 -1
  8. package/dist/cjs/ptc-featured-list.cjs.entry.js +93 -7
  9. package/dist/cjs/ptc-filter-tag_2.cjs.entry.js +1 -1
  10. package/dist/cjs/ptc-form-checkbox_2.cjs.entry.js +76 -185
  11. package/dist/cjs/ptc-jumbotron.cjs.entry.js +1 -1
  12. package/dist/cjs/ptc-para_3.cjs.entry.js +1 -1
  13. package/dist/cjs/ptc-pricing-tabs.cjs.entry.js +1 -1
  14. package/dist/cjs/ptc-product-card.cjs.entry.js +1 -2
  15. package/dist/cjs/ptc-product-category.cjs.entry.js +1 -2
  16. package/dist/cjs/ptcw-design.cjs.js +1 -1
  17. package/dist/collection/components/icon-asset/icon-asset.css +2 -2
  18. package/dist/collection/components/organism-bundles/blog-detail-content/blog-detail-content.css +1 -1
  19. package/dist/collection/components/organism-bundles/blog-detail-layout/blog-detail-layout.css +1 -1
  20. package/dist/collection/components/ptc-card/ptc-card.css +1 -1
  21. package/dist/collection/components/ptc-card-wrapper/ptc-card-wrapper.js +1 -1
  22. package/dist/collection/components/ptc-featured-list/fl-tab-content/fl-tab-content.css +12 -0
  23. package/dist/collection/components/ptc-featured-list/fl-tab-content/fl-tab-content.js +1 -17
  24. package/dist/collection/components/ptc-featured-list/fl-tab-header/fl-tab-header.css +1 -1
  25. package/dist/collection/components/ptc-featured-list/fl-tab-header/fl-tab-header.js +4 -1
  26. package/dist/collection/components/ptc-featured-list/fl-tab-image/fl-tab-image.css +4 -0
  27. package/dist/collection/components/ptc-featured-list/ptc-featured-list.js +106 -8
  28. package/dist/collection/components/ptc-form-checkbox/ptc-form-checkbox.css +7 -7
  29. package/dist/collection/components/ptc-jumbotron/ptc-jumbotron.css +2 -2
  30. package/dist/collection/components/ptc-pagenation/ptc-pagenation.css +1 -1
  31. package/dist/collection/components/ptc-pricing-tabs/ptc-pricing-tabs.css +2 -2
  32. package/dist/collection/components/ptc-product-card/ptc-product-card.js +1 -19
  33. package/dist/collection/components/ptc-product-category/ptc-product-category.js +1 -19
  34. package/dist/collection/components/ptc-readmore/ptc-readmore.css +7 -0
  35. package/dist/collection/components/ptc-textfield/ptc-textfield.css +34 -51
  36. package/dist/custom-elements/index.js +192 -215
  37. package/dist/esm/blog-detail-content_2.entry.js +1 -1
  38. package/dist/esm/blog-detail-layout.entry.js +1 -1
  39. package/dist/esm/fl-tab-content_3.entry.js +8 -6
  40. package/dist/esm/icon-asset.entry.js +1 -1
  41. package/dist/esm/loader.js +1 -1
  42. package/dist/esm/ptc-card-bottom_2.entry.js +1 -1
  43. package/dist/esm/ptc-card_2.entry.js +1 -1
  44. package/dist/esm/ptc-featured-list.entry.js +93 -7
  45. package/dist/esm/ptc-filter-tag_2.entry.js +1 -1
  46. package/dist/esm/ptc-form-checkbox_2.entry.js +76 -185
  47. package/dist/esm/ptc-jumbotron.entry.js +1 -1
  48. package/dist/esm/ptc-para_3.entry.js +1 -1
  49. package/dist/esm/ptc-pricing-tabs.entry.js +1 -1
  50. package/dist/esm/ptc-product-card.entry.js +1 -2
  51. package/dist/esm/ptc-product-category.entry.js +1 -2
  52. package/dist/esm/ptcw-design.js +1 -1
  53. package/dist/ptcw-design/p-0b2c2c87.entry.js +1 -0
  54. package/dist/ptcw-design/p-15781e09.entry.js +1 -0
  55. package/dist/ptcw-design/{p-1ae7d46e.entry.js → p-20bfb063.entry.js} +1 -1
  56. package/dist/ptcw-design/p-287fbd96.entry.js +1 -0
  57. package/dist/ptcw-design/{p-1fbfa21d.entry.js → p-4fad31c1.entry.js} +1 -1
  58. package/dist/ptcw-design/p-58d5c97e.entry.js +1 -0
  59. package/dist/ptcw-design/{p-4aa47312.entry.js → p-84aba692.entry.js} +1 -1
  60. package/dist/ptcw-design/{p-999d1c9f.entry.js → p-8c466f5a.entry.js} +1 -1
  61. package/dist/ptcw-design/p-8ef5d5db.entry.js +68 -0
  62. package/dist/ptcw-design/{p-4c096997.entry.js → p-bf5c67ed.entry.js} +1 -1
  63. package/dist/ptcw-design/{p-c7f77978.entry.js → p-cae1202f.entry.js} +1 -1
  64. package/dist/ptcw-design/p-e16debcd.entry.js +1 -0
  65. package/dist/ptcw-design/{p-c44764c7.entry.js → p-ebd76c8e.entry.js} +1 -1
  66. package/dist/ptcw-design/{p-d5c19775.entry.js → p-fd11f2a8.entry.js} +1 -1
  67. package/dist/ptcw-design/ptcw-design.css +1 -1
  68. package/dist/ptcw-design/ptcw-design.esm.js +1 -1
  69. package/dist/types/components/ptc-featured-list/fl-tab-content/fl-tab-content.d.ts +0 -1
  70. package/dist/types/components/ptc-featured-list/fl-tab-header/fl-tab-header.d.ts +1 -0
  71. package/dist/types/components/ptc-featured-list/ptc-featured-list.d.ts +6 -2
  72. package/dist/types/components/ptc-product-card/ptc-product-card.d.ts +0 -5
  73. package/dist/types/components/ptc-product-category/ptc-product-category.d.ts +0 -1
  74. package/dist/types/components.d.ts +0 -12
  75. package/package.json +1 -1
  76. package/readme.md +1 -1
  77. package/dist/ptcw-design/p-1fc5187a.entry.js +0 -1
  78. package/dist/ptcw-design/p-86954980.entry.js +0 -68
  79. package/dist/ptcw-design/p-93b33ec0.entry.js +0 -1
  80. package/dist/ptcw-design/p-bd7971a9.entry.js +0 -1
  81. package/dist/ptcw-design/p-c87ae23f.entry.js +0 -1
  82. package/dist/ptcw-design/p-ee3178d5.entry.js +0 -1
@@ -6,38 +6,124 @@ const PtcFeaturedList = class {
6
6
  constructor(hostRef) {
7
7
  registerInstance(this, hostRef);
8
8
  this.isMobile = undefined;
9
- this.selectedTab = 'tab-01';
9
+ this.selectedTabGloble = 'tab-01';
10
10
  }
11
11
  handleResize() {
12
12
  this.isMobile = window.innerWidth < 992;
13
+ this.holdTabOnResize(this.selectedTabGloble);
13
14
  }
14
15
  componentWillLoad() {
15
16
  this.isMobile = window.innerWidth < 992;
16
17
  }
17
18
  handleflTabClicked(event) {
18
- this.selectedTab = event.detail.name;
19
- this.updateReadMoreInTabContents();
19
+ this.selectedTabGloble = event.detail.name;
20
+ this.selectTab(this.selectedTabGloble);
20
21
  }
21
- updateReadMoreInTabContents() {
22
+ handleflTabFocusHeader(event) {
23
+ var _a, _b;
24
+ const tabHeaders = (_b = (_a = this.hostElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('fl-tab-header');
25
+ const currentValueKey = event.detail.valueKey;
26
+ const tabDirection = event.detail.direction;
27
+ const ind = currentValueKey - 1 + tabDirection;
28
+ if (ind > -1 && ind < tabHeaders.length) {
29
+ let nextToFocus = tabHeaders[ind].querySelector('p.sc-fl-tab-header');
30
+ nextToFocus.focus();
31
+ }
32
+ }
33
+ handleflTabFocusContent(event) {
34
+ var _a, _b;
35
+ event.preventDefault();
36
+ const tabContent = (_b = (_a = this.hostElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector(`fl-tab-content[value-key="${event.detail.valueKey}"]`);
37
+ let focusable = tabContent.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
38
+ // console.log(tabContent, focusable);
39
+ let firstFocusable = focusable[0];
40
+ console.log(firstFocusable);
41
+ // let lastFocusable = focusable[focusable.length - 1];
42
+ firstFocusable.focus();
43
+ }
44
+ // @Listen('flTabFocusOut', { target: 'document' })
45
+ // handleflTabFocusOut(event: CustomEvent) {
46
+ // // console.log(event);
47
+ // event.preventDefault();
48
+ // const link = this.hostElement?.shadowRoot?.querySelector<HTMLAnchorElement>('.content-wrap fl-tab-content a');
49
+ // console.log(link)
50
+ // // link.focus();
51
+ // }
52
+ holdTabOnResize(name) {
22
53
  const contentBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-content`);
54
+ const headerBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-header`);
23
55
  contentBlocks.forEach(content => {
56
+ if (content.classList.contains("init-active")) {
57
+ content.classList.remove("init-active");
58
+ }
59
+ content.getAttribute('name-key') === name ? (content.setAttribute('selected', 'selected')) : (content.removeAttribute('selected'));
60
+ });
61
+ headerBlocks.forEach(header => {
62
+ if (header.classList.contains("init-active")) {
63
+ header.classList.remove("init-active");
64
+ if (header.querySelector('p')) {
65
+ header.querySelector('p').classList.remove('selected-p-init');
66
+ }
67
+ }
68
+ header.getAttribute('name-key') === name ? (header.setAttribute('selected', 'selected')) : (header.removeAttribute('selected'));
69
+ });
70
+ }
71
+ selectTab(name) {
72
+ const featuredImages = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-image`);
73
+ const contentBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-content`);
74
+ const headerBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-header`);
75
+ featuredImages.forEach(image => {
76
+ if (image.classList.contains("init-active")) {
77
+ image.classList.remove("init-active");
78
+ }
79
+ image.getAttribute('name-key') === name ? (image.setAttribute('selected', 'selected')) : (image.removeAttribute('selected'));
80
+ });
81
+ contentBlocks.forEach(content => {
82
+ this.updateActiveTab(name, content);
24
83
  // Added code to recall readmore for hidden tabs
25
- if (content.getAttribute('name-key') === this.selectedTab) {
84
+ if (content.getAttribute('name-key') === name) {
26
85
  const readMoreComp = content.querySelector('ptc-readmore');
27
86
  if (readMoreComp) {
28
87
  readMoreComp.updateReadmoreStatus();
29
88
  }
30
89
  }
31
90
  });
91
+ headerBlocks.forEach(header => {
92
+ this.updateActiveTab(name, header);
93
+ });
94
+ }
95
+ updateActiveTab(name, tabName) {
96
+ if (this.isMobile) {
97
+ if (tabName.getAttribute('name-key') === name) {
98
+ if (tabName.classList.contains("init-active")) {
99
+ tabName.removeAttribute('selected');
100
+ }
101
+ else {
102
+ tabName.getAttribute('selected') == 'selected' ? (tabName.removeAttribute('selected')) : (tabName.setAttribute('selected', 'selected'));
103
+ }
104
+ }
105
+ else {
106
+ tabName.removeAttribute('selected');
107
+ }
108
+ }
109
+ else {
110
+ tabName.getAttribute('name-key') === name ? (tabName.setAttribute('selected', 'selected')) : (tabName.removeAttribute('selected'));
111
+ }
112
+ if (tabName.classList.contains("init-active")) {
113
+ tabName.classList.remove("init-active");
114
+ if (tabName.querySelector('p')) {
115
+ tabName.querySelector('p').classList.remove('selected-p-init');
116
+ }
117
+ }
32
118
  }
33
119
  render() {
34
- return (h(Host, null, h("div", { class: "featured-image-wrap" }, h("fl-tab-image", { "name-key": "tab-01", selected: this.selectedTab === 'tab-01' }, h("ptc-img", { "image-type": "smart-bg", "image-alignment": "center", "img-url": "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway" })), h("fl-tab-image", { "name-key": "tab-02", selected: this.selectedTab === 'tab-02' }, h("ptc-background-video", { overlay: false, "play-button-title": "Play", "pause-button-title": "Pause", "video-src": "https://www.ptc.com/en/www.ptc.com//-/media/Videos/BRAND-FILM-CAR-SECTION-short-1mb.mp4", "poster-src": "https://www.ptc.com/-/media/Images/new-org/misc/W232501-LWX23-Hero-Banner-Video-FINAL-jebyrne-110922-screenshot.jpg" })), h("fl-tab-image", { "name-key": "tab-03", selected: this.selectedTab === 'tab-03' }, h("ptc-img", { "image-type": "smart-bg", "image-alignment": "center", "img-url": "https://www.ptc.com/-/media/Images/new-org/1366x542/CIMC-1366x542.jpg?h=542&w=1366&la=en&hash=56AE14F73CFB62C24276D08E556B0949" })), h("fl-tab-image", { "name-key": "tab-04", selected: this.selectedTab === 'tab-04' }, h("ptc-img", { "image-type": "smart-bg", "image-alignment": "center", "img-url": "https://www.ptc.com/-/media/Images/new-org/1366x542/ThingWorx_IIOT_CaterpillarCS_Img_1366x542.jpg?h=542&w=1366&la=en&hash=627ED00C1F58E3677A06F50C0F3009D6" }))), this.isMobile ? (
120
+ return (h(Host, null, h("div", { class: "featured-image-wrap" }, h("fl-tab-image", { "name-key": "tab-01", class: "init-active" }, h("ptc-img", { "image-type": "smart-bg", "image-alignment": "center", "img-url": "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway" })), h("fl-tab-image", { "name-key": "tab-02" }, h("ptc-background-video", { overlay: false, "play-button-title": "Play", "pause-button-title": "Pause", "video-src": "https://www.ptc.com/en/www.ptc.com//-/media/Videos/BRAND-FILM-CAR-SECTION-short-1mb.mp4", "poster-src": "https://www.ptc.com/-/media/Images/new-org/misc/W232501-LWX23-Hero-Banner-Video-FINAL-jebyrne-110922-screenshot.jpg" })), h("fl-tab-image", { "name-key": "tab-03" }, h("ptc-img", { "image-type": "smart-bg", "image-alignment": "center", "img-url": "https://www.ptc.com/-/media/Images/new-org/1366x542/CIMC-1366x542.jpg?h=542&w=1366&la=en&hash=56AE14F73CFB62C24276D08E556B0949" })), h("fl-tab-image", { "name-key": "tab-04" }, h("ptc-img", { "image-type": "smart-bg", "image-alignment": "center", "img-url": "https://www.ptc.com/-/media/Images/new-org/1366x542/ThingWorx_IIOT_CaterpillarCS_Img_1366x542.jpg?h=542&w=1366&la=en&hash=627ED00C1F58E3677A06F50C0F3009D6" }))), this.isMobile ? (
35
121
  // Code for mobile only
36
122
  h("div", { class: "mobile-wrapper" }, h("div", { class: 'acc-item' }, h("fl-tab-header", { "value-key": 1, "name-key": "tab-01", "tab-title": "Aerospace & Defense", class: "init-active" }, " "), h("fl-tab-content", { "value-key": 1, "name-key": "tab-01", class: "init-active" }, h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, h("ptc-readmore", { "visible-lines-custom": "7", "more-text": "Read More", "less-text": "Read Less", "read-more-position": "left", class: "inline" }, "Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization.")), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense"))), h("div", { class: 'acc-item' }, h("fl-tab-header", { "value-key": 2, "name-key": "tab-02", "tab-title": "Automotive" }), h("fl-tab-content", { "value-key": 2, "name-key": "tab-02" }, h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, "Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization."), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense"))), h("div", { class: 'acc-item' }, h("fl-tab-header", { "value-key": 3, "name-key": "tab-03", "tab-title": "Electronics & High-Tech" }), h("fl-tab-content", { "value-key": 3, "name-key": "tab-03" }, h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, h("ptc-readmore", { "visible-lines-custom": "7", "more-text": "Read More", "less-text": "Read Less", "read-more-position": "left", class: "inline" }, "Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization.")), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense"))), h("div", { class: 'acc-item' }, h("fl-tab-header", { "value-key": 4, "name-key": "tab-04", "tab-title": "Retail & Consumer Products" }), h("fl-tab-content", { "value-key": 4, "name-key": "tab-04" }, h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, "Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization."), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense")))))
37
123
  :
38
124
  (
39
125
  // Code for Desktop only
40
- h("div", { class: "non-mobile-wrapper" }, h("div", { class: "header-list-wrap" }, h("fl-tab-header", { "name-key": "tab-01", "tab-title": "Aerospace & Defense", selected: this.selectedTab === 'tab-01' }, " "), h("fl-tab-header", { "name-key": "tab-02", "tab-title": "Automotive", selected: this.selectedTab === 'tab-02' }), h("fl-tab-header", { "name-key": "tab-03", "tab-title": "Electronics & High-Tech", selected: this.selectedTab === 'tab-03' }), h("fl-tab-header", { "name-key": "tab-04", "tab-title": "Retail & Consumer Products", selected: this.selectedTab === 'tab-04' })), h("div", { class: "content-wrap" }, h("fl-tab-content", { "name-key": "tab-01", selected: this.selectedTab === 'tab-01', onbeforematch: () => this.selectedTab = 'tab-01' }, h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Aerospace & Defense"), h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, h("ptc-readmore", { "visible-lines-custom": "7", "more-text": "Read More", "less-text": "Read Less", "read-more-position": "left", class: "inline" }, "Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization.")), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense")), h("fl-tab-content", { "name-key": "tab-02", selected: this.selectedTab === 'tab-02', onbeforematch: () => this.selectedTab = 'tab-02' }, h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Automotive"), h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, "Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization."), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense")), h("fl-tab-content", { "name-key": "tab-03", selected: this.selectedTab === 'tab-03', onbeforematch: () => this.selectedTab = 'tab-03' }, h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Electronics & High-Tech"), h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, "Deliver the future of transportation and mobility and gain competitive advantage. Explore automotive solutions for OEMs and suppliers so your team can help drive the future of transportation."), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense")), h("fl-tab-content", { "name-key": "tab-04", selected: this.selectedTab === 'tab-04', onbeforematch: () => this.selectedTab = 'tab-04' }, h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Retail & Consumer Products"), h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, h("ptc-readmore", { "visible-lines-custom": "7", "more-text": "Read More", "less-text": "Read Less", "read-more-position": "left", class: "inline" }, "Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization.")), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense")))))));
126
+ h("div", { class: "non-mobile-wrapper" }, h("div", { class: "header-list-wrap" }, h("fl-tab-header", { "value-key": 1, "name-key": "tab-01", "tab-title": "Aerospace & Defense", class: "init-active" }, " "), h("fl-tab-header", { "value-key": 2, "name-key": "tab-02", "tab-title": "Automotive" }), h("fl-tab-header", { "value-key": 3, "name-key": "tab-03", "tab-title": "Electronics & High-Tech" }), h("fl-tab-header", { "value-key": 4, "name-key": "tab-04", "tab-title": "Retail & Consumer Products" })), h("div", { class: "content-wrap" }, h("fl-tab-content", { "value-key": 1, "name-key": "tab-01", class: "init-active" }, h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Aerospace & Defense"), h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, h("ptc-readmore", { "visible-lines-custom": "7", "more-text": "Read More", "less-text": "Read Less", "read-more-position": "left", class: "inline" }, "Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization.")), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense")), h("fl-tab-content", { "value-key": 2, "name-key": "tab-02" }, h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Automotive"), h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, "Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization."), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense")), h("fl-tab-content", { "value-key": 3, "name-key": "tab-03" }, h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Electronics & High-Tech"), h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, "Deliver the future of transportation and mobility and gain competitive advantage. Explore automotive solutions for OEMs and suppliers so your team can help drive the future of transportation."), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense")), h("fl-tab-content", { "value-key": 4, "name-key": "tab-04" }, h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Retail & Consumer Products"), h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, h("ptc-readmore", { "visible-lines-custom": "7", "more-text": "Read More", "less-text": "Read Less", "read-more-position": "left", class: "inline" }, "Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization. Adapt to ever-changing customer demands and increasing cost and competitive pressure. Explore digital solutions for driving engineering excellence, manufacturing efficiency, product innovation, and service optimization.")), h("a", { href: 'https://www.google.com', tabIndex: 0 }, "See More about Aerospace & Defense")))))));
41
127
  }
42
128
  get hostElement() { return getElement(this); }
43
129
  };
@@ -70,7 +70,7 @@ const PtcFilterTag = class {
70
70
  };
71
71
  PtcFilterTag.style = ptcFilterTagCss;
72
72
 
73
- const ptcPagenationCss = "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}.events-filter{padding:20px 32px 20px 0;text-align:center}@media (min-width: 992px){.events-filter{padding:10px 40px 10px 0px}}.events-filter .pagenation-arrow{width:40px;height:40px;margin:0 15px;vertical-align:middle}.standard-filter{font-size:var(--ptc-font-size-small);font-weight:var(--ptc-font-weight-semibold);text-align:center}.standard-filter .standard-filter-item{height:2.5rem;width:2.5rem;display:inline-flex;align-items:center;justify-content:center;margin-right:0.5rem;transition:background-color var(--ptc-ease-out) var(--ptc-transition-medium);background-color:transparent;border-radius:var(--ptc-border-radius-standard);color:var(--color-gray-10);text-decoration:none}.standard-filter .standard-filter-item:hover{background-color:var(--color-gray-02);text-decoration:none}.standard-filter .standard-filter-item:focus{text-decoration:none;border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}.standard-filter .standard-filter-item:active{background-color:var(--color-gray-05);text-decoration:none;transition:none}.standard-filter .standard-filter-item.active{transition:none;background-color:var(--color-gray-12);color:var(--color-white)}.standard-filter .standard-filter-item.active:hover{transition:background-color var(--ptc-ease-out) var(--ptc-transition-medium);background-color:var(--color-gray-12);cursor:default}.standard-filter .standard-filter-item[data-url=last]{margin-right:1.25rem}.standard-filter .next-button,.standard-filter .previous-button{font-size:var(--ptc-font-size-x-small);font-weight:normal;display:inline-flex;align-items:center;justify-content:center;width:1.125rem;height:1.125rem;border:1px solid var(--color-gray-10);border-radius:calc(var(--ptc-border-radius-standard) / 2);transition:background-color var(--ptc-ease-out) var(--ptc-transition-medium), fill var(--ptc-ease-out) var(--ptc-transition-medium), border-color var(--ptc-ease-out) var(--ptc-transition-medium)}.standard-filter .next-button:hover,.standard-filter .previous-button:hover{background-color:var(--color-gray-02);text-decoration:none}.standard-filter .next-button:active,.standard-filter .previous-button:active{transition:none;background-color:var(--color-gray-05);text-decoration:none}.standard-filter .next-button:focus,.standard-filter .previous-button:focus{text-decoration:none;border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}.standard-filter .next-button.disabled,.standard-filter .previous-button.disabled{cursor:default;border-color:var(--color-gray-04);color:var(--color-gray-04);fill:var(--color-gray-04)}.standard-filter .next-button.disabled:hover,.standard-filter .next-button.disabled:active,.standard-filter .previous-button.disabled:hover,.standard-filter .previous-button.disabled:active{background-color:transparent}.standard-filter .previous-button{margin-right:1.25rem}.standard-filter .previous-button icon-asset{transform:rotate(90deg);position:relative;right:2px}.standard-filter .next-button icon-asset{transform:rotate(-90deg);position:relative;left:1px}.standard-filter .standard-filter-dots{margin:0.125rem 0.5rem 0.125rem 0.125rem}@media (768px){.standard-filter .standard-filter-dots{margin:0.125rem 0.5rem 0.125rem 0.125rem}}.show-page{display:inline}.hide-page{display:none}.prev-text{display:none}.last-text{display:none}@media (min-width: 992px){.prev-text{display:inline}.last-text{display:inline}}.events-filter-item{font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-semibold);font-stretch:normal;font-style:var(--ptc-font-style-normal);line-height:var(--ptc-line-height-denser);letter-spacing:var(--ptc-letter-spacing-normal);text-align:left;padding:6px;color:var(--color-gray-10);text-decoration:none}.events-filter .active{font-family:var(--ptc-font-latin);border-bottom:2px solid var(--color-green-13);font-weight:var(--ptc-font-weight-semibold)}.events-filter-item:hover,.events-filter-item:focus{text-decoration:none;outline:0;color:var(--color-green-14)}span.events-filter-item:hover,span.events-filter-item:focus{text-decoration:none;outline:0;color:var(--color-gray-10)}span.events-filter-item.disabled{color:var(--color-white-01)}.events-filter .disabled{color:var(--color-white-01)}.events-filter-dots{padding:0rem;font-weight:var(--ptc-font-weight-extrabold);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-xx-small);font-stretch:normal;font-style:var(--ptc-font-style-normal);line-height:var(--ptc-line-height-denser);letter-spacing:var(--ptc-letter-spacing-normal);text-align:left;color:var(--color-gray-10);text-decoration:none}.events-disable-arrows{opacity:0.35}.events-enable-arrows{opacity:1}.events-small-dots{height:60px;margin-top:-25px}@media (min-width: 992px){.events-small-dots{height:80px;margin-top:-40px}}.last-page{transform:rotate(180deg)}";
73
+ const ptcPagenationCss = "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}.events-filter{padding:20px 32px 20px 0;text-align:center}@media (min-width: 992px){.events-filter{padding:10px 40px 10px 0px}}.events-filter .pagenation-arrow{width:40px;height:40px;margin:0 15px;vertical-align:middle}.standard-filter{font-size:var(--ptc-font-size-small);font-weight:var(--ptc-font-weight-semibold);text-align:center}.standard-filter .standard-filter-item{height:2.5rem;width:2.5rem;display:inline-flex;align-items:center;justify-content:center;margin-right:0.5rem;transition:background-color var(--ptc-ease-out) var(--ptc-transition-medium);background-color:transparent;border-radius:var(--ptc-border-radius-standard);color:var(--color-gray-10);text-decoration:none}.standard-filter .standard-filter-item:hover{background-color:var(--color-gray-02);text-decoration:none}.standard-filter .standard-filter-item:focus{text-decoration:none;border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}.standard-filter .standard-filter-item:active{background-color:var(--color-gray-05);text-decoration:none;transition:none}.standard-filter .standard-filter-item.active{transition:none;background-color:var(--color-gray-12);color:var(--color-white)}.standard-filter .standard-filter-item.active:hover{transition:background-color var(--ptc-ease-out) var(--ptc-transition-medium);background-color:var(--color-gray-12);cursor:default}.standard-filter .standard-filter-item[data-url=last]{margin-right:1.25rem}.standard-filter .next-button,.standard-filter .previous-button{font-size:var(--ptc-font-size-x-small);font-weight:normal;display:inline-flex;align-items:center;justify-content:center;width:1.125rem;height:1.125rem;border:1px solid var(--color-gray-10);border-radius:calc(var(--ptc-border-radius-standard)/2);transition:background-color var(--ptc-ease-out) var(--ptc-transition-medium), fill var(--ptc-ease-out) var(--ptc-transition-medium), border-color var(--ptc-ease-out) var(--ptc-transition-medium)}.standard-filter .next-button:hover,.standard-filter .previous-button:hover{background-color:var(--color-gray-02);text-decoration:none}.standard-filter .next-button:active,.standard-filter .previous-button:active{transition:none;background-color:var(--color-gray-05);text-decoration:none}.standard-filter .next-button:focus,.standard-filter .previous-button:focus{text-decoration:none;border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}.standard-filter .next-button.disabled,.standard-filter .previous-button.disabled{cursor:default;border-color:var(--color-gray-04);color:var(--color-gray-04);fill:var(--color-gray-04)}.standard-filter .next-button.disabled:hover,.standard-filter .next-button.disabled:active,.standard-filter .previous-button.disabled:hover,.standard-filter .previous-button.disabled:active{background-color:transparent}.standard-filter .previous-button{margin-right:1.25rem}.standard-filter .previous-button icon-asset{transform:rotate(90deg);position:relative;right:2px}.standard-filter .next-button icon-asset{transform:rotate(-90deg);position:relative;left:1px}.standard-filter .standard-filter-dots{margin:0.125rem 0.5rem 0.125rem 0.125rem}@media (768px){.standard-filter .standard-filter-dots{margin:0.125rem 0.5rem 0.125rem 0.125rem}}.show-page{display:inline}.hide-page{display:none}.prev-text{display:none}.last-text{display:none}@media (min-width: 992px){.prev-text{display:inline}.last-text{display:inline}}.events-filter-item{font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-semibold);font-stretch:normal;font-style:var(--ptc-font-style-normal);line-height:var(--ptc-line-height-denser);letter-spacing:var(--ptc-letter-spacing-normal);text-align:left;padding:6px;color:var(--color-gray-10);text-decoration:none}.events-filter .active{font-family:var(--ptc-font-latin);border-bottom:2px solid var(--color-green-13);font-weight:var(--ptc-font-weight-semibold)}.events-filter-item:hover,.events-filter-item:focus{text-decoration:none;outline:0;color:var(--color-green-14)}span.events-filter-item:hover,span.events-filter-item:focus{text-decoration:none;outline:0;color:var(--color-gray-10)}span.events-filter-item.disabled{color:var(--color-white-01)}.events-filter .disabled{color:var(--color-white-01)}.events-filter-dots{padding:0rem;font-weight:var(--ptc-font-weight-extrabold);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-xx-small);font-stretch:normal;font-style:var(--ptc-font-style-normal);line-height:var(--ptc-line-height-denser);letter-spacing:var(--ptc-letter-spacing-normal);text-align:left;color:var(--color-gray-10);text-decoration:none}.events-disable-arrows{opacity:0.35}.events-enable-arrows{opacity:1}.events-small-dots{height:60px;margin-top:-25px}@media (min-width: 992px){.events-small-dots{height:80px;margin-top:-40px}}.last-page{transform:rotate(180deg)}";
74
74
 
75
75
  const PtcPagenation = class {
76
76
  constructor(hostRef) {