@ptcwebops/ptcw-design 3.1.8 → 3.2.1

package/dist/cjs/ptc-embedded-quiz.cjs.entry.js

@@ -6,95 +6,95 @@ const index = require('./index-cd9a1b1a.js');
 
 const ptcEmbeddedQuizCss = ":host{display:block}:host .quiz-slide-container{position:relative;width:100%;border:1px solid var(--color-gray-12);background-color:white;z-index:1}:host .quiz-slide-container .quiz-slide-text-container{max-width:calc(24 * var(--ptc-element-spacing-07))}:host .quiz-slide-background{position:absolute;top:0;left:0;width:100%;height:100%;background:url(\"https://www.ptc.com/-/media/Development/Embedded-Vuforia-Quiz/vuforia-background-guide-01.svg\");background-size:cover;background-position:center;opacity:0.2;z-index:-1}:host .quiz-slide-initial{padding:var(--ptc-element-spacing-08);display:flex;justify-content:center}:host .quiz-slide-initial #initial-quiz-p{padding:0 0 calc(var(--ptc-element-spacing-08) + var(--ptc-element-spacing-04)) 0}:host .quiz-slide-result .cta-container{display:flex;flex-direction:column;align-items:center}:host .quiz-slide-result .cta-container ptc-button{flex:1 0 100%;margin:0 0 var(--ptc-element-spacing-05) 0}:host .right-button-container{display:flex;justify-content:right}:host .right-button-container .restart-quiz-button{display:flex;margin:var(--ptc-element-spacing-06) var(--ptc-element-spacing-06) 0 0;transition:var(--ptc-transition-slow)}:host .right-button-container .restart-quiz-button #restart-arrow{display:flex;align-items:center}:host .right-button-container .restart-quiz-button #restart-arrow svg{z-index:2;margin-right:var(--ptc-element-spacing-03)}:host .right-button-container .restart-quiz-button:hover{cursor:pointer}:host .right-button-container .restart-quiz-button:hover #restart-arrow svg{transform:rotate(270deg)}:host .right-button-container .restart-quiz-button:hover ptc-para{opacity:0.7}:host .center-button-container{display:flex;justify-content:center}:host .previous-slide-button{display:flex;align-items:center;margin:0 0 var(--ptc-element-spacing-06) 0;transition:var(--ptc-transition-slow)}:host .previous-slide-button icon-asset{z-index:2;display:flex;align-items:center;margin-right:var(--ptc-element-spacing-03)}:host .previous-slide-button:hover{cursor:pointer}:host .previous-slide-button:hover icon-asset svg{transform:translateX(-8px)}:host .previous-slide-button:hover ptc-para{opacity:0.7}:host .quiz-slide-dual-layout .image-container{padding-top:var(--ptc-element-spacing-06);display:flex;justify-content:center;height:calc(4 * var(--ptc-element-spacing-08));width:100%}:host .quiz-slide-dual-layout .image-container img{height:100%;width:100%}:host .quiz-slide-dual-layout .content-container{margin:var(--ptc-element-spacing-06) var(--ptc-element-spacing-08) var(--ptc-element-spacing-08) var(--ptc-element-spacing-08)}:host .quiz-slide-dual-layout .content-container .options-container{margin-top:var(--ptc-element-spacing-06);padding-left:var(--ptc-element-spacing-05);display:flex;flex-wrap:wrap;z-index:2}:host .quiz-slide-dual-layout .content-container .options-container .radio-input{flex:1 0 100%;margin-bottom:var(--ptc-element-spacing-06);display:flex;align-items:start;display:flex;align-items:flex-start}:host .quiz-slide-dual-layout .content-container .options-container .radio-input .radio{width:16px;height:16px;border-radius:var(--ptc-border-radius-circle);border:var(--color-gray-10) solid 1px;z-index:2;padding:3px;box-sizing:border-box;flex-shrink:0;margin-top:var(--ptc-element-spacing-01);background-color:white}:host .quiz-slide-dual-layout .content-container .options-container .radio-input .radio.clicked{border:var(--color-blue-08) solid 1px;background:var(--color-blue-08);background-clip:content-box, padding-box}:host .quiz-slide-dual-layout .content-container .options-container .radio-input ptc-para{padding:0 var(--ptc-element-spacing-02) 0 var(--ptc-element-spacing-03)}:host .quiz-slide-dual-layout .content-container .options-container .radio-input:hover{cursor:pointer}:host .quiz-slide-dual-layout .content-container .options-container .radio-input:hover .radio{box-shadow:var(--ptc-shadow-x-small)}@media only screen and (min-width: 768px){:host .quiz-slide-container{min-height:calc(10 * var(--ptc-element-spacing-08));position:relative}:host .quiz-slide-initial #initial-quiz-p{padding:0 0 calc(var(--ptc-element-spacing-08) + var(--ptc-element-spacing-04)) 0}:host .quiz-slide-dual-layout{margin:0 var(--ptc-element-spacing-06) 0 var(--ptc-element-spacing-06)}:host .quiz-slide-dual-layout .image-container{height:calc(9 * var(--ptc-element-spacing-06));width:100%}:host .quiz-slide-dual-layout .image-container img{height:100%;width:auto}:host .quiz-slide-dual-layout .content-container{margin:var(--ptc-element-spacing-06) var(--ptc-element-spacing-06) var(--ptc-element-spacing-08) var(--ptc-element-spacing-06)}:host .quiz-slide-dual-layout .content-container .options-container .radio-input{flex:1 0 48%}}@media only screen and (min-width: 992px){:host .quiz-slide-initial #initial-quiz-p{padding:0 0 calc(var(--ptc-element-spacing-08) + var(--ptc-element-spacing-04)) 0}:host .quiz-slide-dual-layout .image-container{height:calc(8 * var(--ptc-element-spacing-07));width:auto}}@media only screen and (min-width: 1200px){:host .quiz-slide-initial #initial-quiz-p{padding:0 0 calc(var(--ptc-element-spacing-01) + var(--ptc-element-spacing-06)) 0}:host .quiz-slide-result .cta-container{flex-direction:row}:host .quiz-slide-result .cta-container ptc-button{flex:none;margin:0 var(--ptc-element-spacing-05) 0 0}:host .quiz-slide-dual-layout{display:flex;margin-bottom:var(--ptc-element-spacing-08)}:host .quiz-slide-dual-layout .image-container{flex-shrink:0;display:flex;align-items:center;height:calc(7 * var(--ptc-element-spacing-07));width:calc(15 * var(--ptc-element-spacing-07))}:host .quiz-slide-dual-layout .image-container img{height:100%;max-height:calc(7 * var(--ptc-element-spacing-07));max-width:calc(15 * var(--ptc-element-spacing-07))}:host .quiz-slide-dual-layout .content-container .options-container{padding-left:0}:host .quiz-slide-dual-layout .content-container .options-container .radio-input:nth-of-type(odd){margin-right:4%}}@media only screen and (min-width: 1440px){:host .quiz-slide-initial #initial-quiz-p{padding:0 0 var(--ptc-element-spacing-07) 0}}";
 
-const PtcEmbeddedQuiz = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.optionClick = index.createEvent(this, "optionClick", 7);
-    this.getQuizEndpoint = undefined;
-    this.quiz = null;
-    this.slide = null;
-    this.traversal = [];
-  }
-  handleStartButtonClick() {
-    this.slide = this.slide["next"];
-    this.traversal.push("next");
-  }
-  handleRestartButtonClick() {
-    this.slide = this.quiz;
-    this.traversal = [];
-  }
-  handlePreviousButtonClick() {
-    let previousSlide = this.quiz;
-    for (let step of this.traversal.slice(0, this.traversal.length - 3)) {
-      previousSlide = previousSlide[step];
-    }
-    this.slide = previousSlide;
-    this.traversal = this.traversal.slice(0, this.traversal.length - 3);
-  }
-  handleQuestionOptionClick(dataModelId) {
-    let selectedOptionRadio = this.el.shadowRoot.getElementById(`radio-${dataModelId}`);
-    selectedOptionRadio.classList.add("clicked");
-    setTimeout(() => {
-      let [option, optionInd] = [null, null];
-      let currentSlideOptions = this.slide["options"];
-      for (let ind in currentSlideOptions) {
-        if (currentSlideOptions[ind]["data-model-id"] === dataModelId) {
-          option = currentSlideOptions[ind];
-          optionInd = ind;
-          break;
-        }
-      }
-      this.optionClick.emit(option);
-      if (option["next"] != null) {
-        this.traversal = [...this.traversal, "options", optionInd, "next"];
-        let nextImage = new Image();
-        nextImage.src = option["next"]["image"];
-        nextImage.onload = () => {
-          this.slide = option["next"];
-          selectedOptionRadio.classList.remove("clicked");
-        };
-      }
-    }, 200);
-  }
-  componentWillLoad() {
-    fetch(this.getQuizEndpoint)
-      .then((response) => response.json())
-      .then((responseJSON) => {
-      this.quiz = responseJSON;
-      this.slide = this.quiz;
-    })
-      .catch((err) => console.log("Quiz retireval error: ", err));
-  }
-  render() {
-    const QuizSlideRestartButton = () => {
-      return index.h("div", { class: "right-button-container" }, index.h("div", { class: "restart-quiz-button", onClick: () => this.handleRestartButtonClick() }, index.h("icon-asset", { id: "restart-arrow", type: "ptc", size: "small", name: "quiz-arrow-restart" }), index.h("ptc-para", { "ellipsis-line-cutoff": "0", "font-size": "small", "font-weight": "w-4", "para-align": "left", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush", "para-style": "", "para-z-index": "z-1", styles: "" }, "Restart")));
-    };
-    const QuizSlidePreviousButton = props => {
-      return index.h("div", { class: "center-button-container" }, index.h("div", { class: `previous-slide-button ${props.invisible ? "invisible" : ""}`, onClick: () => this.handlePreviousButtonClick() }, index.h("icon-asset", { id: "left-arrow", type: "ptc", size: "medium", name: "quiz-arrow-left", onClick: () => { } }), index.h("ptc-para", { "ellipsis-line-cutoff": "0", "font-size": "small", "font-weight": "w-4", "para-align": "left", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush", "para-style": "", "para-z-index": "z-1", styles: "" }, "Previous")));
-    };
-    const QuizInitialSlide = () => {
-      return (index.h("div", { class: "quiz-slide-initial" }, index.h("div", { class: "quiz-slide-content" }, index.h("div", { id: "initial-quiz-h2", class: "quiz-slide-text-container" }, index.h("ptc-title", { type: "h2", "text-align": "center", "title-size": "xx-large", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-shadow": "", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-8", "is-plm-hub": "false" }, this.slide["h2"])), index.h("ptc-spacer", { size: 'medium', breakpoint: 'small' }), index.h("ptc-spacer", { size: 'large', breakpoint: 'x-small' }), index.h("div", { id: "initial-quiz-h3", class: "quiz-slide-text-container" }, index.h("ptc-title", { type: "h3", "text-align": "center", "title-size": "large", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-shadow": "", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-7", "is-plm-hub": "false" }, this.slide["h3"])), index.h("ptc-spacer", { size: 'x-large', breakpoint: 'small' }), index.h("ptc-spacer", { size: 'xx-large', breakpoint: 'x-small' }), index.h("div", { id: "initial-quiz-p", class: "quiz-slide-text-container" }, index.h("ptc-para", { "ellipsis-line-cutoff": "0", "font-size": "x-small", "font-weight": "w-4", "para-align": "center", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush", "para-style": "", "para-z-index": "z-1", styles: "" }, this.slide["p"])), index.h("div", { class: "center-button-container" }, index.h("div", { id: "quiz-start-button", onClick: () => this.handleStartButtonClick() }, index.h("ptc-button", { type: "link", color: "ptc-tertiary", "link-href": "", target: "_blank" }, "Start"))))));
-    };
-    const QuizQuestionSlide = () => {
-      return (index.h("div", { class: "quiz-slide-question" }, index.h("div", { class: "quiz-slide-content" }, index.h("div", { class: "quiz-slide-dual-layout" }, index.h("div", { class: "image-container" }, index.h("img", { alt: "", src: this.slide['image'] })), index.h("div", { class: "content-container" }, index.h("ptc-title", { type: "h4", "text-align": "left", "title-size": "medium", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-shadow": "", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-7", "is-plm-hub": "false" }, this.slide["question"]), index.h("div", { class: "options-container" }, this.slide["options"].map(option => {
-        return index.h("div", { class: "radio-input", onClick: () => this.handleQuestionOptionClick(option["data-model-id"]) }, index.h("span", { id: `radio-${option["data-model-id"]}`, class: "radio" }), index.h("ptc-para", { "ellipsis-line-cutoff": "0", "font-size": "x-small", "font-weight": "w-4", "para-align": "left", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush", "para-style": "", "para-z-index": "z-1", styles: "" }, option["data-value"]));
-      })))))));
-    };
-    const QuizResultSlide = () => {
-      return (index.h("div", { class: "quiz-slide-result" }, index.h("div", { class: "quiz-slide-content" }, index.h("div", { class: "quiz-slide-dual-layout" }, index.h("div", { class: "image-container" }, index.h("img", { alt: "", src: this.slide["image"] })), index.h("div", { class: "content-container" }, index.h("ptc-title", { type: "h4", "text-align": "left", "title-size": "medium", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-shadow": "", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-7", "is-plm-hub": "false" }, this.slide["title"]), index.h("ptc-spacer", { size: 'large', breakpoint: 'small' }), index.h("ptc-spacer", { size: 'x-large', breakpoint: 'x-small' }), index.h("ptc-para", { "ellipsis-line-cutoff": "0", "font-size": "x-small", "font-weight": "w-4", "para-align": "left", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-bottom-6", "para-style": "", "para-z-index": "z-1", styles: "" }, this.slide["description"]), index.h("div", { class: "cta-container" }, this.slide["cta-quaternary"] && index.h("ptc-button", { type: "link", color: "ptc-quaternary", "link-href": this.slide["cta-quaternary"]["href"], target: "_blank" }, this.slide["cta-quaternary"]["text"]), this.slide["cta-tertiary"] && index.h("ptc-button", { type: "link", color: "ptc-tertiary", "link-href": this.slide["cta-tertiary"]["href"], target: "_blank" }, this.slide["cta-tertiary"]["text"])))))));
-    };
-    const getQuizSlide = () => {
-      switch (this.slide["slide-type"]) {
-        case "initial": return index.h(QuizInitialSlide, null);
-        case "question": return index.h(index.Fragment, null, index.h(QuizSlideRestartButton, null), index.h(QuizQuestionSlide, null), (this.traversal.length > 1) ? index.h(QuizSlidePreviousButton, null) : null);
-        case "result": return index.h(index.Fragment, null, index.h(QuizSlideRestartButton, null), index.h(QuizResultSlide, null), index.h(QuizSlidePreviousButton, null));
-        default: return null;
-      }
-    };
-    return (index.h(index.Host, null, this.quiz && index.h("div", { class: "quiz-slide-container" }, index.h("div", { class: "quiz-slide-background" }), getQuizSlide())));
-  }
-  get el() { return index.getElement(this); }
-};
+const PtcEmbeddedQuiz = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.optionClick = index.createEvent(this, "optionClick", 7);
+    this.getQuizEndpoint = undefined;
+    this.quiz = null;
+    this.slide = null;
+    this.traversal = [];
+  }
+  handleStartButtonClick() {
+    this.slide = this.slide["next"];
+    this.traversal.push("next");
+  }
+  handleRestartButtonClick() {
+    this.slide = this.quiz;
+    this.traversal = [];
+  }
+  handlePreviousButtonClick() {
+    let previousSlide = this.quiz;
+    for (let step of this.traversal.slice(0, this.traversal.length - 3)) {
+      previousSlide = previousSlide[step];
+    }
+    this.slide = previousSlide;
+    this.traversal = this.traversal.slice(0, this.traversal.length - 3);
+  }
+  handleQuestionOptionClick(dataModelId) {
+    let selectedOptionRadio = this.el.shadowRoot.getElementById(`radio-${dataModelId}`);
+    selectedOptionRadio.classList.add("clicked");
+    setTimeout(() => {
+      let [option, optionInd] = [null, null];
+      let currentSlideOptions = this.slide["options"];
+      for (let ind in currentSlideOptions) {
+        if (currentSlideOptions[ind]["data-model-id"] === dataModelId) {
+          option = currentSlideOptions[ind];
+          optionInd = ind;
+          break;
+        }
+      }
+      this.optionClick.emit(option);
+      if (option["next"] != null) {
+        this.traversal = [...this.traversal, "options", optionInd, "next"];
+        let nextImage = new Image();
+        nextImage.src = option["next"]["image"];
+        nextImage.onload = () => {
+          this.slide = option["next"];
+          selectedOptionRadio.classList.remove("clicked");
+        };
+      }
+    }, 200);
+  }
+  componentWillLoad() {
+    fetch(this.getQuizEndpoint)
+      .then((response) => response.json())
+      .then((responseJSON) => {
+      this.quiz = responseJSON;
+      this.slide = this.quiz;
+    })
+      .catch((err) => console.log("Quiz retireval error: ", err));
+  }
+  render() {
+    const QuizSlideRestartButton = () => {
+      return index.h("div", { class: "right-button-container" }, index.h("div", { class: "restart-quiz-button", onClick: () => this.handleRestartButtonClick() }, index.h("icon-asset", { id: "restart-arrow", type: "ptc", size: "small", name: "quiz-arrow-restart" }), index.h("ptc-para", { "ellipsis-line-cutoff": "0", "font-size": "small", "font-weight": "w-4", "para-align": "left", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush", "para-style": "", "para-z-index": "z-1", styles: "" }, "Restart")));
+    };
+    const QuizSlidePreviousButton = props => {
+      return index.h("div", { class: "center-button-container" }, index.h("div", { class: `previous-slide-button ${props.invisible ? "invisible" : ""}`, onClick: () => this.handlePreviousButtonClick() }, index.h("icon-asset", { id: "left-arrow", type: "ptc", size: "medium", name: "quiz-arrow-left", onClick: () => { } }), index.h("ptc-para", { "ellipsis-line-cutoff": "0", "font-size": "small", "font-weight": "w-4", "para-align": "left", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush", "para-style": "", "para-z-index": "z-1", styles: "" }, "Previous")));
+    };
+    const QuizInitialSlide = () => {
+      return (index.h("div", { class: "quiz-slide-initial" }, index.h("div", { class: "quiz-slide-content" }, index.h("div", { id: "initial-quiz-h2", class: "quiz-slide-text-container" }, index.h("ptc-title", { type: "h2", "text-align": "center", "title-size": "xx-large", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-shadow": "", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-8", "is-plm-hub": "false" }, this.slide["h2"])), index.h("ptc-spacer", { size: 'medium', breakpoint: 'small' }), index.h("ptc-spacer", { size: 'large', breakpoint: 'x-small' }), index.h("div", { id: "initial-quiz-h3", class: "quiz-slide-text-container" }, index.h("ptc-title", { type: "h3", "text-align": "center", "title-size": "large", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-shadow": "", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-7", "is-plm-hub": "false" }, this.slide["h3"])), index.h("ptc-spacer", { size: 'x-large', breakpoint: 'small' }), index.h("ptc-spacer", { size: 'xx-large', breakpoint: 'x-small' }), index.h("div", { id: "initial-quiz-p", class: "quiz-slide-text-container" }, index.h("ptc-para", { "ellipsis-line-cutoff": "0", "font-size": "x-small", "font-weight": "w-4", "para-align": "center", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush", "para-style": "", "para-z-index": "z-1", styles: "" }, this.slide["p"])), index.h("div", { class: "center-button-container" }, index.h("div", { id: "quiz-start-button", onClick: () => this.handleStartButtonClick() }, index.h("ptc-button", { type: "link", color: "ptc-tertiary", "link-href": "", target: "_blank" }, "Start"))))));
+    };
+    const QuizQuestionSlide = () => {
+      return (index.h("div", { class: "quiz-slide-question" }, index.h("div", { class: "quiz-slide-content" }, index.h("div", { class: "quiz-slide-dual-layout" }, index.h("div", { class: "image-container" }, index.h("img", { alt: "", src: this.slide['image'] })), index.h("div", { class: "content-container" }, index.h("ptc-title", { type: "h4", "text-align": "left", "title-size": "medium", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-shadow": "", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-7", "is-plm-hub": "false" }, this.slide["question"]), index.h("div", { class: "options-container" }, this.slide["options"].map(option => {
+        return index.h("div", { class: "radio-input", onClick: () => this.handleQuestionOptionClick(option["data-model-id"]) }, index.h("span", { id: `radio-${option["data-model-id"]}`, class: "radio" }), index.h("ptc-para", { "ellipsis-line-cutoff": "0", "font-size": "x-small", "font-weight": "w-4", "para-align": "left", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush", "para-style": "", "para-z-index": "z-1", styles: "" }, option["data-value"]));
+      })))))));
+    };
+    const QuizResultSlide = () => {
+      return (index.h("div", { class: "quiz-slide-result" }, index.h("div", { class: "quiz-slide-content" }, index.h("div", { class: "quiz-slide-dual-layout" }, index.h("div", { class: "image-container" }, index.h("img", { alt: "", src: this.slide["image"] })), index.h("div", { class: "content-container" }, index.h("ptc-title", { type: "h4", "text-align": "left", "title-size": "medium", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-shadow": "", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-7", "is-plm-hub": "false" }, this.slide["title"]), index.h("ptc-spacer", { size: 'large', breakpoint: 'small' }), index.h("ptc-spacer", { size: 'x-large', breakpoint: 'x-small' }), index.h("ptc-para", { "ellipsis-line-cutoff": "0", "font-size": "x-small", "font-weight": "w-4", "para-align": "left", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-bottom-6", "para-style": "", "para-z-index": "z-1", styles: "" }, this.slide["description"]), index.h("div", { class: "cta-container" }, this.slide["cta-quaternary"] && index.h("ptc-button", { type: "link", color: "ptc-quaternary", "link-href": this.slide["cta-quaternary"]["href"], target: "_blank" }, this.slide["cta-quaternary"]["text"]), this.slide["cta-tertiary"] && index.h("ptc-button", { type: "link", color: "ptc-tertiary", "link-href": this.slide["cta-tertiary"]["href"], target: "_blank" }, this.slide["cta-tertiary"]["text"])))))));
+    };
+    const getQuizSlide = () => {
+      switch (this.slide["slide-type"]) {
+        case "initial": return index.h(QuizInitialSlide, null);
+        case "question": return index.h(index.Fragment, null, index.h(QuizSlideRestartButton, null), index.h(QuizQuestionSlide, null), (this.traversal.length > 1) ? index.h(QuizSlidePreviousButton, null) : null);
+        case "result": return index.h(index.Fragment, null, index.h(QuizSlideRestartButton, null), index.h(QuizResultSlide, null), index.h(QuizSlidePreviousButton, null));
+        default: return null;
+      }
+    };
+    return (index.h(index.Host, null, this.quiz && index.h("div", { class: "quiz-slide-container" }, index.h("div", { class: "quiz-slide-background" }), getQuizSlide())));
+  }
+  get el() { return index.getElement(this); }
+};
 PtcEmbeddedQuiz.style = ptcEmbeddedQuizCss;
 
 exports.ptc_embedded_quiz = PtcEmbeddedQuiz;

package/dist/cjs/ptc-featured-list.cjs.entry.js

@@ -6,101 +6,101 @@ const index = require('./index-cd9a1b1a.js');
 
 const ptcFeaturedListCss = "a{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);text-decoration-line:underline;color:var(--color-blue-07);transition:color var(--ptc-transition-medium) var(--ptc-ease-out);font-weight:var(--ptc-font-weight-bold)}a:visited{color:var(--color-blue-10)}a:active,a:visited:active{color:var(--color-blue-09)}a:hover,a:visited:hover{color:var(--color-blue-08)}a.disabled{color:var(--color-gray-04) !important;cursor:not-allowed}.light-links a:not(.hero-footer-form-wrapper a),.light-links a.light-link,.background-grey-10 a:not(.hero-footer-form-wrapper a),.background-grey-10 a.light-link,.background-plm-grey a:not(.hero-footer-form-wrapper a),.background-plm-grey a.light-link{color:var(--color-blue-04)}.light-links a:not(.hero-footer-form-wrapper a):visited,.light-links a.light-link:visited,.background-grey-10 a:not(.hero-footer-form-wrapper a):visited,.background-grey-10 a.light-link:visited,.background-plm-grey a:not(.hero-footer-form-wrapper a):visited,.background-plm-grey a.light-link:visited{color:var(--color-blue-06)}.light-links a:not(.hero-footer-form-wrapper a):active,.light-links a:not(.hero-footer-form-wrapper a):visited:active,.light-links a.light-link:active,.light-links a.light-link:visited:active,.background-grey-10 a:not(.hero-footer-form-wrapper a):active,.background-grey-10 a:not(.hero-footer-form-wrapper a):visited:active,.background-grey-10 a.light-link:active,.background-grey-10 a.light-link:visited:active,.background-plm-grey a:not(.hero-footer-form-wrapper a):active,.background-plm-grey a:not(.hero-footer-form-wrapper a):visited:active,.background-plm-grey a.light-link:active,.background-plm-grey a.light-link:visited:active{color:var(--color-blue-07)}.light-links a:not(.hero-footer-form-wrapper a):hover,.light-links a:not(.hero-footer-form-wrapper a):visited:hover,.light-links a.light-link:hover,.light-links a.light-link:visited:hover,.background-grey-10 a:not(.hero-footer-form-wrapper a):hover,.background-grey-10 a:not(.hero-footer-form-wrapper a):visited:hover,.background-grey-10 a.light-link:hover,.background-grey-10 a.light-link:visited:hover,.background-plm-grey a:not(.hero-footer-form-wrapper a):hover,.background-plm-grey a:not(.hero-footer-form-wrapper a):visited:hover,.background-plm-grey a.light-link:hover,.background-plm-grey a.light-link:visited:hover{color:var(--color-blue-05)}.light-links a:not(.hero-footer-form-wrapper a).disabled,.light-links a.light-link.disabled,.background-grey-10 a:not(.hero-footer-form-wrapper a).disabled,.background-grey-10 a.light-link.disabled,.background-plm-grey a:not(.hero-footer-form-wrapper a).disabled,.background-plm-grey a.light-link.disabled{color:var(--color-gray-04) !important;cursor:not-allowed}.ptc-link{color:var(--color-gray-10);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.ptc-link:hover{color:var(--color-green-06)}.ptc-link:visited{color:var(--color-gray-10)}.ptc-link:active,.ptc-link:visited:active{color:var(--color-green-06)}.ptc-link:hover,.ptc-link:visited:hover{color:var(--color-green-06)}.ptc-link-dark{color:var(--color-white);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.ptc-link-dark:hover{color:var(--color-green-06)}.ptc-link-dark:visited{color:var(--color-white)}.ptc-link-dark:active,.ptc-link-dark:visited:active{color:var(--color-green-06)}.ptc-link-dark:hover,.ptc-link-dark:visited:hover{color:var(--color-green-06)}:host{display:block;box-sizing:border-box}:host ptc-background-video{height:240px}@media only screen and (min-width: 480px){:host ptc-background-video{height:320px}}@media only screen and (min-width: 768px){:host ptc-background-video{height:450px}}@media only screen and (min-width: 992px){:host ptc-background-video{height:500px}}:host .fl-header{cursor:pointer}:host .non-mobile-wrapper{box-sizing:border-box}@media only screen and (min-width: 992px){:host .non-mobile-wrapper{margin:-40px auto 0 auto;display:flex;align-items:center;width:100%;background:var(--color-white);box-shadow:var(--ptc-shadow-small);padding:24px 32px;z-index:1;position:relative;min-height:350px}}@media only screen and (min-width: 1200px){:host .non-mobile-wrapper{max-width:1136px}}@media (min-width: 1300px){:host .non-mobile-wrapper{margin:-75px auto 0 auto}}@media only screen and (min-width: 1440px){:host .non-mobile-wrapper{max-width:1200px}}@media only screen and (min-width: 992px){:host .non-mobile-wrapper .header-list-wrap{padding-right:16px;margin-right:64px;min-width:270px;max-width:270px;box-sizing:border-box;display:flex;flex-direction:column;align-items:baseline}:host .non-mobile-wrapper .header-list-wrap::after{content:\"\";width:1px;height:calc(100% - 48px);background-color:var(--color-gray-05);position:absolute;left:297px;top:24px;bottom:24px}}@media only screen and (min-width: 992px){:host .non-mobile-wrapper .content-wrap{padding-right:72px}}:host .non-mobile-wrapper .fl-header{margin:0;padding:12px 0;width:100%}:host .mobile-wrapper .acc-item{border-bottom:1px solid var(--color-gray-03);padding:14px 30px}:host .mobile-wrapper .acc-item fl-tab-header{padding-left:34px;position:relative}:host .mobile-wrapper .acc-item fl-tab-header::before{content:\"\";display:inline-block;width:16px;height:16px;background-image:url('data:image/svg+xml,<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g clip-path=\"url(%23clip0_91_790)\"><path d=\"M15.9001 6.29998H9.7001V0.0999756H6.3001V6.29998H0.100098V9.69998H6.3001V15.9H9.7001V9.69998H15.9001V6.29998Z\" fill=\"%23006E09\"/></g><defs><clipPath id=\"clip0_91_790\"><rect width=\"16\" height=\"16\" fill=\"white\"/></clipPath></defs></svg>');vertical-align:middle;position:absolute;left:0;top:4.5px}:host .mobile-wrapper .acc-item fl-tab-header.selected::before,:host .mobile-wrapper .acc-item fl-tab-header.init-active::before{background-image:url('data:image/svg+xml,<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g clip-path=\"url(%23clip0_113_741)\"><path d=\"M0 7.05566V10.8637H13.913V7.05566H0Z\" fill=\"%23323B42\"/></g><defs><clipPath id=\"clip0_113_741\"><rect width=\"13.913\" height=\"17.92\" fill=\"white\"/></clipPath></defs></svg>')}:host .mobile-wrapper .acc-item fl-tab-content{padding-left:34px;padding-bottom:18px}";
 
-const PtcFeaturedList = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.isMobile = undefined;
-    this.selectedTabGloble = 'tab-01';
-  }
-  handleResize() {
-    this.isMobile = window.innerWidth < 992;
-    this.holdTabOnResize(this.selectedTabGloble);
-  }
-  componentWillLoad() {
-    this.isMobile = window.innerWidth < 992;
-  }
-  handleflTabClicked(event) {
-    this.selectedTabGloble = event.detail.name;
-    this.selectTab(this.selectedTabGloble);
-  }
-  holdTabOnResize(name) {
-    const contentBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-content`);
-    const headerBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-header`);
-    contentBlocks.forEach(content => {
-      if (content.classList.contains("init-active")) {
-        content.classList.remove("init-active");
-      }
-      content.getAttribute('name-key') === name ? (content.setAttribute('selected', 'selected')) : (content.removeAttribute('selected'));
-    });
-    headerBlocks.forEach(header => {
-      if (header.classList.contains("init-active")) {
-        header.classList.remove("init-active");
-        if (header.querySelector('p')) {
-          header.querySelector('p').classList.remove('selected-p-init');
-        }
-      }
-      header.getAttribute('name-key') === name ? (header.setAttribute('selected', 'selected')) : (header.removeAttribute('selected'));
-    });
-  }
-  selectTab(name) {
-    const featuredImages = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-image`);
-    const contentBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-content`);
-    const headerBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-header`);
-    featuredImages.forEach(image => {
-      if (image.classList.contains("init-active")) {
-        image.classList.remove("init-active");
-      }
-      image.getAttribute('name-key') === name ? (image.setAttribute('selected', 'selected')) : (image.removeAttribute('selected'));
-    });
-    contentBlocks.forEach(content => {
-      this.updateActiveTab(name, content);
-      //  Added code to recall readmore for hidden tabs
-      if (content.getAttribute('name-key') === name) {
-        const readMoreComp = content.querySelector('ptc-readmore');
-        if (readMoreComp) {
-          readMoreComp.updateReadmoreStatus();
-        }
-      }
-    });
-    headerBlocks.forEach(header => {
-      this.updateActiveTab(name, header);
-    });
-  }
-  updateActiveTab(name, tabName) {
-    if (this.isMobile) {
-      if (tabName.getAttribute('name-key') === name) {
-        if (tabName.classList.contains("init-active")) {
-          tabName.removeAttribute('selected');
-        }
-        else {
-          tabName.getAttribute('selected') == 'selected' ? (tabName.removeAttribute('selected')) : (tabName.setAttribute('selected', 'selected'));
-        }
-      }
-      else {
-        tabName.removeAttribute('selected');
-      }
-    }
-    else {
-      tabName.getAttribute('name-key') === name ? (tabName.setAttribute('selected', 'selected')) : (tabName.removeAttribute('selected'));
-    }
-    if (tabName.classList.contains("init-active")) {
-      tabName.classList.remove("init-active");
-      if (tabName.querySelector('p')) {
-        tabName.querySelector('p').classList.remove('selected-p-init');
-      }
-    }
-  }
-  render() {
-    return (index.h(index.Host, null, index.h("div", { class: "featured-image-wrap" }, index.h("fl-tab-image", { "name-key": "tab-01", class: "init-active" }, index.h("ptc-img", { "image-type": "smart-bg", "image-alignment": "center", "img-url": "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway" })), index.h("fl-tab-image", { "name-key": "tab-02" }, index.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" })), index.h("fl-tab-image", { "name-key": "tab-03" }, index.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" })), index.h("fl-tab-image", { "name-key": "tab-04" }, index.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 ? (
-    // Code for mobile only
-    index.h("div", { class: "mobile-wrapper" }, index.h("div", { class: 'acc-item' }, index.h("fl-tab-header", { "name-key": "tab-01", "tab-title": "Aerospace & Defense", class: "init-active" }, " "), index.h("fl-tab-content", { "name-key": "tab-01", class: "init-active" }, index.h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, index.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.")), index.h("a", { href: '#' }, "See More about Aerospace & Defense"))), index.h("div", { class: 'acc-item' }, index.h("fl-tab-header", { "name-key": "tab-02", "tab-title": "Automotive" }), index.h("fl-tab-content", { "name-key": "tab-02" }, index.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."), index.h("a", { href: '#' }, "See More about Aerospace & Defense"))), index.h("div", { class: 'acc-item' }, index.h("fl-tab-header", { "name-key": "tab-03", "tab-title": "Electronics & High-Tech" }), index.h("fl-tab-content", { "name-key": "tab-03" }, index.h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, index.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.")), index.h("a", { href: '#' }, "See More about Aerospace & Defense"))), index.h("div", { class: 'acc-item' }, index.h("fl-tab-header", { "name-key": "tab-04", "tab-title": "Retail & Consumer Products" }), index.h("fl-tab-content", { "name-key": "tab-04" }, index.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."), index.h("a", { href: '#' }, "See More about Aerospace & Defense")))))
-      :
-        (
-        // Code for Desktop only
-        index.h("div", { class: "non-mobile-wrapper" }, index.h("div", { class: "header-list-wrap" }, index.h("fl-tab-header", { "name-key": "tab-01", "tab-title": "Aerospace & Defense", class: "init-active" }, " "), index.h("fl-tab-header", { "name-key": "tab-02", "tab-title": "Automotive" }), index.h("fl-tab-header", { "name-key": "tab-03", "tab-title": "Electronics & High-Tech" }), index.h("fl-tab-header", { "name-key": "tab-04", "tab-title": "Retail & Consumer Products" })), index.h("div", { class: "content-wrap" }, index.h("fl-tab-content", { "name-key": "tab-01", class: "init-active" }, index.h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Aerospace & Defense"), index.h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, index.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.")), index.h("a", { href: '#' }, "See More about Aerospace & Defense")), index.h("fl-tab-content", { "name-key": "tab-02" }, index.h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Automotive"), index.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."), index.h("a", { href: '#' }, "See More about Aerospace & Defense")), index.h("fl-tab-content", { "name-key": "tab-03" }, index.h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Electronics & High-Tech"), index.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."), index.h("a", { href: '#' }, "See More about Aerospace & Defense")), index.h("fl-tab-content", { "name-key": "tab-04" }, index.h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Retail & Consumer Products"), index.h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, index.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.")), index.h("a", { href: '#' }, "See More about Aerospace & Defense")))))));
-  }
-  get hostElement() { return index.getElement(this); }
-};
+const PtcFeaturedList = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.isMobile = undefined;
+    this.selectedTabGloble = 'tab-01';
+  }
+  handleResize() {
+    this.isMobile = window.innerWidth < 992;
+    this.holdTabOnResize(this.selectedTabGloble);
+  }
+  componentWillLoad() {
+    this.isMobile = window.innerWidth < 992;
+  }
+  handleflTabClicked(event) {
+    this.selectedTabGloble = event.detail.name;
+    this.selectTab(this.selectedTabGloble);
+  }
+  holdTabOnResize(name) {
+    const contentBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-content`);
+    const headerBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-header`);
+    contentBlocks.forEach(content => {
+      if (content.classList.contains("init-active")) {
+        content.classList.remove("init-active");
+      }
+      content.getAttribute('name-key') === name ? (content.setAttribute('selected', 'selected')) : (content.removeAttribute('selected'));
+    });
+    headerBlocks.forEach(header => {
+      if (header.classList.contains("init-active")) {
+        header.classList.remove("init-active");
+        if (header.querySelector('p')) {
+          header.querySelector('p').classList.remove('selected-p-init');
+        }
+      }
+      header.getAttribute('name-key') === name ? (header.setAttribute('selected', 'selected')) : (header.removeAttribute('selected'));
+    });
+  }
+  selectTab(name) {
+    const featuredImages = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-image`);
+    const contentBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-content`);
+    const headerBlocks = this.hostElement.shadowRoot.querySelectorAll(`fl-tab-header`);
+    featuredImages.forEach(image => {
+      if (image.classList.contains("init-active")) {
+        image.classList.remove("init-active");
+      }
+      image.getAttribute('name-key') === name ? (image.setAttribute('selected', 'selected')) : (image.removeAttribute('selected'));
+    });
+    contentBlocks.forEach(content => {
+      this.updateActiveTab(name, content);
+      //  Added code to recall readmore for hidden tabs
+      if (content.getAttribute('name-key') === name) {
+        const readMoreComp = content.querySelector('ptc-readmore');
+        if (readMoreComp) {
+          readMoreComp.updateReadmoreStatus();
+        }
+      }
+    });
+    headerBlocks.forEach(header => {
+      this.updateActiveTab(name, header);
+    });
+  }
+  updateActiveTab(name, tabName) {
+    if (this.isMobile) {
+      if (tabName.getAttribute('name-key') === name) {
+        if (tabName.classList.contains("init-active")) {
+          tabName.removeAttribute('selected');
+        }
+        else {
+          tabName.getAttribute('selected') == 'selected' ? (tabName.removeAttribute('selected')) : (tabName.setAttribute('selected', 'selected'));
+        }
+      }
+      else {
+        tabName.removeAttribute('selected');
+      }
+    }
+    else {
+      tabName.getAttribute('name-key') === name ? (tabName.setAttribute('selected', 'selected')) : (tabName.removeAttribute('selected'));
+    }
+    if (tabName.classList.contains("init-active")) {
+      tabName.classList.remove("init-active");
+      if (tabName.querySelector('p')) {
+        tabName.querySelector('p').classList.remove('selected-p-init');
+      }
+    }
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("div", { class: "featured-image-wrap" }, index.h("fl-tab-image", { "name-key": "tab-01", class: "init-active" }, index.h("ptc-img", { "image-type": "smart-bg", "image-alignment": "center", "img-url": "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway" })), index.h("fl-tab-image", { "name-key": "tab-02" }, index.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" })), index.h("fl-tab-image", { "name-key": "tab-03" }, index.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" })), index.h("fl-tab-image", { "name-key": "tab-04" }, index.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 ? (
+    // Code for mobile only
+    index.h("div", { class: "mobile-wrapper" }, index.h("div", { class: 'acc-item' }, index.h("fl-tab-header", { "name-key": "tab-01", "tab-title": "Aerospace & Defense", class: "init-active" }, " "), index.h("fl-tab-content", { "name-key": "tab-01", class: "init-active" }, index.h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, index.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.")), index.h("a", { href: '#' }, "See More about Aerospace & Defense"))), index.h("div", { class: 'acc-item' }, index.h("fl-tab-header", { "name-key": "tab-02", "tab-title": "Automotive" }), index.h("fl-tab-content", { "name-key": "tab-02" }, index.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."), index.h("a", { href: '#' }, "See More about Aerospace & Defense"))), index.h("div", { class: 'acc-item' }, index.h("fl-tab-header", { "name-key": "tab-03", "tab-title": "Electronics & High-Tech" }), index.h("fl-tab-content", { "name-key": "tab-03" }, index.h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, index.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.")), index.h("a", { href: '#' }, "See More about Aerospace & Defense"))), index.h("div", { class: 'acc-item' }, index.h("fl-tab-header", { "name-key": "tab-04", "tab-title": "Retail & Consumer Products" }), index.h("fl-tab-content", { "name-key": "tab-04" }, index.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."), index.h("a", { href: '#' }, "See More about Aerospace & Defense")))))
+      :
+        (
+        // Code for Desktop only
+        index.h("div", { class: "non-mobile-wrapper" }, index.h("div", { class: "header-list-wrap" }, index.h("fl-tab-header", { "name-key": "tab-01", "tab-title": "Aerospace & Defense", class: "init-active" }, " "), index.h("fl-tab-header", { "name-key": "tab-02", "tab-title": "Automotive" }), index.h("fl-tab-header", { "name-key": "tab-03", "tab-title": "Electronics & High-Tech" }), index.h("fl-tab-header", { "name-key": "tab-04", "tab-title": "Retail & Consumer Products" })), index.h("div", { class: "content-wrap" }, index.h("fl-tab-content", { "name-key": "tab-01", class: "init-active" }, index.h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Aerospace & Defense"), index.h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, index.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.")), index.h("a", { href: '#' }, "See More about Aerospace & Defense")), index.h("fl-tab-content", { "name-key": "tab-02" }, index.h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Automotive"), index.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."), index.h("a", { href: '#' }, "See More about Aerospace & Defense")), index.h("fl-tab-content", { "name-key": "tab-03" }, index.h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Electronics & High-Tech"), index.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."), index.h("a", { href: '#' }, "See More about Aerospace & Defense")), index.h("fl-tab-content", { "name-key": "tab-04" }, index.h("ptc-title", { type: 'h3', "title-size": 'large', upperline: "no-upperline", "title-margin": 'margin-flush' }, "Retail & Consumer Products"), index.h("ptc-para", { "para-line-h": 'line-height-p', "font-size": "small", "para-margin": "margin-3" }, index.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.")), index.h("a", { href: '#' }, "See More about Aerospace & Defense")))))));
+  }
+  get hostElement() { return index.getElement(this); }
+};
 PtcFeaturedList.style = ptcFeaturedListCss;
 
 exports.ptc_featured_list = PtcFeaturedList;