@ptcwebops/ptcw-design 1.4.9 → 1.5.0

package/dist/collection/components/organism-bundles/bundle-example/bundle-example.js

@@ -1,58 +1,58 @@
-import { Host, h } from '@stencil/core';
-export class BundleExample {
-  constructor() {
-    this.isLoading = true;
-    this.picWidth = undefined;
-    this.picHeight = undefined;
-  }
-  handleWindowResize() {
-    this.updatePictureSize();
-  }
-  // Replace it with search logic
-  componentDidLoad() {
-    setTimeout(() => {
-      this.isLoading = false;
-    }, 3000);
-    this.updatePictureSize();
-  }
-  render() {
-    return (h(Host, null, h("div", { class: "is-grid has-col-2 has-col-2-sm has-col-3-md has-col-4-lg has-col-5-xl has-col-gap-md has-row-gap-md" }, h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))), h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))), h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))), h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))), h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))), h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))))));
-  }
-  updatePictureSize() {
-    const pictureComponents = this.el.shadowRoot.querySelectorAll('ptc-picture');
-    for (let i = 0; i < pictureComponents.length; i++) {
-      const pictureComponent = pictureComponents[i];
-      pictureComponent.isFullWidth = true;
-      pictureComponent.styles = ':host{padding-bottom: 56.25%;overflow: hidden;margin:0;padding-top:56.25%;position: relative;} :host img{position:absolute;width:100%;height:100%;object-fit:cover;top:50%;left:50%;transform:translate(-50%,-50%);}';
-    }
-  }
-  static get is() { return "bundle-example"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["bundle-example.css"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["bundle-example.css"]
-    };
-  }
-  static get states() {
-    return {
-      "isLoading": {},
-      "picWidth": {},
-      "picHeight": {}
-    };
-  }
-  static get elementRef() { return "el"; }
-  static get listeners() {
-    return [{
-        "name": "resize",
-        "method": "handleWindowResize",
-        "target": "window",
-        "capture": false,
-        "passive": true
-      }];
-  }
-}
+import { Host, h } from '@stencil/core';
+export class BundleExample {
+  constructor() {
+    this.isLoading = true;
+    this.picWidth = undefined;
+    this.picHeight = undefined;
+  }
+  handleWindowResize() {
+    this.updatePictureSize();
+  }
+  // Replace it with search logic
+  componentDidLoad() {
+    setTimeout(() => {
+      this.isLoading = false;
+    }, 3000);
+    this.updatePictureSize();
+  }
+  render() {
+    return (h(Host, null, h("div", { class: "is-grid has-col-2 has-col-2-sm has-col-3-md has-col-4-lg has-col-5-xl has-col-gap-md has-row-gap-md" }, h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))), h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))), h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))), h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))), h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))), h("div", { class: "is-col-1" }, h("ptc-card-wrapper", { "card-type": "card-video", class: "is-col-4", "card-link": "https://www.ptc.com", "link-title": "ptc", "is-loading": this.isLoading }, h("ptc-card-content", { "card-type": "card-video", "is-loading": this.isLoading }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, h("ptc-picture", { alt: "image-test", "border-radius": "radius-large", src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" }))), h("ptc-card-bottom", { "card-type": "card-video" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-19", "para-color": "white", "para-margin": "margin-top-3" }, h("ptc-skeleton", { "is-loading": this.isLoading, animated: true }, "3 Reasons Why Engineering and Manufacturing are Disjointed"), h("ptc-skeleton", { "is-loading": this.isLoading, animated: true, width: "80%", "top-margin": "var(--ptc-element-spacing-01)" }))))))));
+  }
+  updatePictureSize() {
+    const pictureComponents = this.el.shadowRoot.querySelectorAll('ptc-picture');
+    for (let i = 0; i < pictureComponents.length; i++) {
+      const pictureComponent = pictureComponents[i];
+      pictureComponent.isFullWidth = true;
+      pictureComponent.styles = ':host{padding-bottom: 56.25%;overflow: hidden;margin:0;padding-top:56.25%;position: relative;} :host img{position:absolute;width:100%;height:100%;object-fit:cover;top:50%;left:50%;transform:translate(-50%,-50%);}';
+    }
+  }
+  static get is() { return "bundle-example"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["bundle-example.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["bundle-example.css"]
+    };
+  }
+  static get states() {
+    return {
+      "isLoading": {},
+      "picWidth": {},
+      "picHeight": {}
+    };
+  }
+  static get elementRef() { return "el"; }
+  static get listeners() {
+    return [{
+        "name": "resize",
+        "method": "handleWindowResize",
+        "target": "window",
+        "capture": false,
+        "passive": true
+      }];
+  }
+}

package/dist/collection/components/organism-bundles/bundle-jumbotron-example/bundle-jumbotron-example.css

@@ -1,3 +1,3 @@
-:host {
-  display: block;
-}
+:host {
+  display: block;
+}

package/dist/collection/components/organism-bundles/bundle-jumbotron-example/bundle-jumbotron-example.js

@@ -1,88 +1,88 @@
-import { Host, h } from '@stencil/core';
-export class BundleJumbotronExample {
-  constructor() {
-    this.jumbotron = 'light';
-    this.isIframe = false;
-  }
-  render() {
-    let $pngSrc;
-    let $gifSrc;
-    let $bgVideoSrc;
-    let $bgSrc;
-    let $popupVideo;
-    //replace dummy data
-    if (this.jumbotron === 'light' || this.jumbotron === 'dark') {
-      $bgSrc = "https://images.unsplash.com/photo-1675285972028-45dc2add07be?crop=entropy&cs=tinysrgb&fm=jpg&ixid=MnwzMjM4NDZ8MHwxfHJhbmRvbXx8fHx8fHx8fDE2Nzc3ODk2NTE&ixlib=rb-4.0.3&q=80";
-    }
-    else if (this.jumbotron === 'dark-video' || this.jumbotron === 'light-video') {
-      //$bgVideoSrc = "https://www.ptc.com/-/media/Videos/wind-turbine.mp4";
-      // if is iframe use src from iframe
-      $bgVideoSrc = "https://player.vimeo.com/video/749261406?h=5e6a60ffc5&muted=1&autoplay=1&loop=1&transparent=0&background=1&app_id=122963%22&controls=0";
-    }
-    else if (this.jumbotron === 'png') {
-      $pngSrc = "https://images.unsplash.com/photo-1676883343977-5f8ecc36856c?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=MnwzMjM4NDZ8MHwxfHJhbmRvbXx8fHx8fHx8fDE2NzgyMjcxNDU&ixlib=rb-4.0.3&q=80&w=400";
-    }
-    else if (this.jumbotron === 'gif') {
-      $gifSrc = "https://media.giphy.com/media/TDQkojbHj3wTS/giphy.gif";
-    }
-    //Optional: set $popupVideo
-    //$popupVideo = "https://www.youtube.com/embed/w0mJCtK9sDY";
-    return (h(Host, null, h("ptc-jumbotron", Object.assign({ "jumbotron-type": this.jumbotron }, (!!$pngSrc && { pngSrc: $pngSrc }), (!!$gifSrc && { gifSrc: $gifSrc }), (!!$bgVideoSrc && { bgVideoSrc: $bgVideoSrc }), (!!$bgSrc && { bgSrc: $bgSrc }), (!!$popupVideo && { popupVideo: $popupVideo }), { "main-title": "Sed ut perspiciatis unde omnis iste natus" //bind main title data (multi-line)
-      ,
-      "sub-title": "totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo." // bind sub title data (multi-line)
-      ,
-      "is-iframe": this.isIframe }), h("ptc-breadcrumb", Object.assign({ slot: "breadcrumb" }, (this.jumbotron === 'dark' || this.jumbotron == 'dark-video' ? { color: 'white' } : { color: 'primary-gray' }), (this.jumbotron === 'text' ? { position: 'center' } : {})), h("list-item", Object.assign({ "list-type": "breadcrumb", "link-href": "https://www.ptc.com/contact-us" }, (this.jumbotron === 'dark' || this.jumbotron == 'dark-video' ? { color: 'light-gray' } : { color: 'primary-gray' })), "PLM Video Hub"), h("list-item", Object.assign({ "list-type": "breadcrumb" }, (this.jumbotron === 'dark' || this.jumbotron == 'dark-video' ? { color: 'light-gray' } : { color: 'primary-gray' })), "Current Page")), h("ptc-button", { slot: "j-cta", type: "link", color: "ptc-primary", "link-href": "https://www.ptc.com", target: "_blank" }, "Lorem ipsum dolor sit amet"), h("ptc-button", { slot: "j-cta", type: "link", color: "ptc-secondary", "link-href": "https://www.ptc.com", target: "_blank" }, "Lorem ipsum"))));
-  }
-  static get is() { return "bundle-jumbotron-example"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["bundle-jumbotron-example.css"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["bundle-jumbotron-example.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "jumbotron": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "jumbotron",
-        "reflect": false,
-        "defaultValue": "'light'"
-      },
-      "isIframe": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "is-iframe",
-        "reflect": false,
-        "defaultValue": "false"
-      }
-    };
-  }
-}
+import { Host, h } from '@stencil/core';
+export class BundleJumbotronExample {
+  constructor() {
+    this.jumbotron = 'light';
+    this.isIframe = false;
+  }
+  render() {
+    let $pngSrc;
+    let $gifSrc;
+    let $bgVideoSrc;
+    let $bgSrc;
+    let $popupVideo;
+    //replace dummy data
+    if (this.jumbotron === 'light' || this.jumbotron === 'dark') {
+      $bgSrc = "https://images.unsplash.com/photo-1675285972028-45dc2add07be?crop=entropy&cs=tinysrgb&fm=jpg&ixid=MnwzMjM4NDZ8MHwxfHJhbmRvbXx8fHx8fHx8fDE2Nzc3ODk2NTE&ixlib=rb-4.0.3&q=80";
+    }
+    else if (this.jumbotron === 'dark-video' || this.jumbotron === 'light-video') {
+      //$bgVideoSrc = "https://www.ptc.com/-/media/Videos/wind-turbine.mp4";
+      // if is iframe use src from iframe
+      $bgVideoSrc = "https://player.vimeo.com/video/749261406?h=5e6a60ffc5&muted=1&autoplay=1&loop=1&transparent=0&background=1&app_id=122963%22&controls=0";
+    }
+    else if (this.jumbotron === 'png') {
+      $pngSrc = "https://images.unsplash.com/photo-1676883343977-5f8ecc36856c?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=MnwzMjM4NDZ8MHwxfHJhbmRvbXx8fHx8fHx8fDE2NzgyMjcxNDU&ixlib=rb-4.0.3&q=80&w=400";
+    }
+    else if (this.jumbotron === 'gif') {
+      $gifSrc = "https://media.giphy.com/media/TDQkojbHj3wTS/giphy.gif";
+    }
+    //Optional: set $popupVideo
+    //$popupVideo = "https://www.youtube.com/embed/w0mJCtK9sDY";
+    return (h(Host, null, h("ptc-jumbotron", Object.assign({ "jumbotron-type": this.jumbotron }, (!!$pngSrc && { pngSrc: $pngSrc }), (!!$gifSrc && { gifSrc: $gifSrc }), (!!$bgVideoSrc && { bgVideoSrc: $bgVideoSrc }), (!!$bgSrc && { bgSrc: $bgSrc }), (!!$popupVideo && { popupVideo: $popupVideo }), { "main-title": "Sed ut perspiciatis unde omnis iste natus" //bind main title data (multi-line)
+      ,
+      "sub-title": "totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo." // bind sub title data (multi-line)
+      ,
+      "is-iframe": this.isIframe }), h("ptc-breadcrumb", Object.assign({ slot: "breadcrumb" }, (this.jumbotron === 'dark' || this.jumbotron == 'dark-video' ? { color: 'white' } : { color: 'primary-gray' }), (this.jumbotron === 'text' ? { position: 'center' } : {})), h("list-item", Object.assign({ "list-type": "breadcrumb", "link-href": "https://www.ptc.com/contact-us" }, (this.jumbotron === 'dark' || this.jumbotron == 'dark-video' ? { color: 'light-gray' } : { color: 'primary-gray' })), "PLM Video Hub"), h("list-item", Object.assign({ "list-type": "breadcrumb" }, (this.jumbotron === 'dark' || this.jumbotron == 'dark-video' ? { color: 'light-gray' } : { color: 'primary-gray' })), "Current Page")), h("ptc-button", { slot: "j-cta", type: "link", color: "ptc-primary", "link-href": "https://www.ptc.com", target: "_blank" }, "Lorem ipsum dolor sit amet"), h("ptc-button", { slot: "j-cta", type: "link", color: "ptc-secondary", "link-href": "https://www.ptc.com", target: "_blank" }, "Lorem ipsum"))));
+  }
+  static get is() { return "bundle-jumbotron-example"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["bundle-jumbotron-example.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["bundle-jumbotron-example.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "jumbotron": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "jumbotron",
+        "reflect": false,
+        "defaultValue": "'light'"
+      },
+      "isIframe": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "is-iframe",
+        "reflect": false,
+        "defaultValue": "false"
+      }
+    };
+  }
+}

package/dist/collection/components/organism-bundles/sequential-bundle/sequential-bundle.js

@@ -1,116 +1,116 @@
-import { h, Host } from '@stencil/core';
-import Swiper from 'swiper';
-import 'swiper/swiper-bundle.css';
-export class SequentialBundle {
-  constructor() {
-    this.isMobile = undefined;
-  }
-  handleResize() {
-    this.isMobile = window.innerWidth < 1200;
-  }
-  componentWillLoad() {
-    this.isMobile = window.innerWidth < 1200;
-  }
-  componentDidLoad() {
-    this.initSlider();
-  }
-  render() {
-    return (h(Host, null, this.isMobile ? (h("div", { class: "swiper-container", ref: el => this.swiperContainerRef = el }, h("div", { class: "swiper-wrapper" }, h("div", { class: "swiper-slide" }, h("ptc-dynamic-card", { "card-type": "sequential", "card-screen": "mobile", "card-title": "iWarranty Business Update Webinar", "card-img-src": "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data", "card-img-alt": "image-test" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-margin": "margin-flush", "para-color": "white", "para-line-h": "line-height-p" }, "The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!"), h("ptc-spacer", { breakpoint: "x-small", size: "xx-large" }), h("ptc-spacer", { breakpoint: "small", size: "x-large" }), h("ptc-button", { type: "link", color: "ptc-secondary", "link-href": "https://www.ptc.com", target: "_blank" }, "Learn More"))), h("div", { class: "swiper-slide" }, h("ptc-dynamic-card", { "card-type": "sequential", "card-screen": "mobile", "card-title": "iWarranty Business Update Webinar", "card-img-src": "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data", "card-img-alt": "image-test" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-margin": "margin-flush", "para-color": "white", "para-line-h": "line-height-p" }, "The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!"), h("ptc-spacer", { breakpoint: "x-small", size: "xx-large" }), h("ptc-spacer", { breakpoint: "small", size: "x-large" }), h("ptc-button", { type: "link", color: "ptc-secondary", "link-href": "https://www.ptc.com", target: "_blank" }, "Learn More"))), h("div", { class: "swiper-slide" }, h("ptc-dynamic-card", { "card-type": "sequential", "card-screen": "mobile", "card-title": "iWarranty Business Update Webinar", "card-img-src": "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data", "card-img-alt": "image-test" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-margin": "margin-flush", "para-color": "white", "para-line-h": "line-height-p" }, "The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!"), h("ptc-spacer", { breakpoint: "x-small", size: "xx-large" }), h("ptc-spacer", { breakpoint: "small", size: "x-large" }), h("ptc-button", { type: "link", color: "ptc-secondary", "link-href": "https://www.ptc.com", target: "_blank" }, "Learn More")))), h("div", { class: "swiper-pagination" }))) : (h("div", null, "test")
-    // <div class="accordion-container desktop-container">
-    //   <div class="accordion">
-    //     <div class="accordion-item">
-    //       <ptc-dynamic-card
-    //         card-type="sequential"
-    //         card-screen="desktop"
-    //         is-expanded="true"
-    //         card-title="iWarranty Business Update Webinar"
-    //         card-img-src="https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data"
-    //         card-img-alt="image-test"
-    //       >
-    //         <ptc-para font-size="x-small" font-weight="w-4" para-margin="margin-flush" para-color="white" para-line-h="line-height-p">
-    //           The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!
-    //         </ptc-para>
-    //         <ptc-spacer breakpoint="x-small" size="xx-large"></ptc-spacer>
-    //         <ptc-spacer breakpoint="small" size="x-large"></ptc-spacer>
-    //         <ptc-button type="link" color="ptc-secondary" link-href="https://www.ptc.com" target="_blank">
-    //           Learn More
-    //         </ptc-button>
-    //       </ptc-dynamic-card>
-    //       <ptc-dynamic-card
-    //         card-type="sequential"
-    //         card-screen="desktop"
-    //         is-expanded="false"
-    //         card-title="iWarranty Business Update Webinar"
-    //         card-img-src="https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data"
-    //         card-img-alt="image-test"
-    //       >
-    //         <ptc-para font-size="x-small" font-weight="w-4" para-margin="margin-flush" para-color="white" para-line-h="line-height-p">
-    //           The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!
-    //         </ptc-para>
-    //         <ptc-spacer breakpoint="x-small" size="xx-large"></ptc-spacer>
-    //         <ptc-spacer breakpoint="small" size="x-large"></ptc-spacer>
-    //         <ptc-button type="link" color="ptc-secondary" link-href="https://www.ptc.com" target="_blank">
-    //           Learn More
-    //         </ptc-button>
-    //       </ptc-dynamic-card>
-    //       <ptc-dynamic-card
-    //         card-type="sequential"
-    //         card-screen="desktop"
-    //         is-expanded="false"
-    //         card-title="iWarranty Business Update Webinar"
-    //         card-img-src="https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data"
-    //         card-img-alt="image-test"
-    //       >
-    //         <ptc-para font-size="x-small" font-weight="w-4" para-margin="margin-flush" para-color="white" para-line-h="line-height-p">
-    //           The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!
-    //         </ptc-para>
-    //         <ptc-spacer breakpoint="x-small" size="xx-large"></ptc-spacer>
-    //         <ptc-spacer breakpoint="small" size="x-large"></ptc-spacer>
-    //         <ptc-button type="link" color="ptc-secondary" link-href="https://www.ptc.com" target="_blank">
-    //           Learn More
-    //         </ptc-button>
-    //       </ptc-dynamic-card>
-    //     </div>
-    //   </div>
-    // </div>
-    )));
-  }
-  initSlider() {
-    if (this.isMobile) {
-      if (this.swiperContainerRef) {
-        this.mySwiper = new Swiper(this.swiperContainerRef, {
-          // Customize options here
-          loop: true,
-          slidesPerView: 1,
-        });
-        console.log("running swiper");
-      }
-    }
-  }
-  static get is() { return "sequential-bundle"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["sequential-bundle.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["sequential-bundle.css"]
-    };
-  }
-  static get states() {
-    return {
-      "isMobile": {}
-    };
-  }
-  static get listeners() {
-    return [{
-        "name": "resize",
-        "method": "handleResize",
-        "target": "window",
-        "capture": false,
-        "passive": true
-      }];
-  }
-}
+import { h, Host } from '@stencil/core';
+import Swiper from 'swiper';
+import 'swiper/swiper-bundle.css';
+export class SequentialBundle {
+  constructor() {
+    this.isMobile = undefined;
+  }
+  handleResize() {
+    this.isMobile = window.innerWidth < 1200;
+  }
+  componentWillLoad() {
+    this.isMobile = window.innerWidth < 1200;
+  }
+  componentDidLoad() {
+    this.initSlider();
+  }
+  render() {
+    return (h(Host, null, this.isMobile ? (h("div", { class: "swiper-container", ref: el => this.swiperContainerRef = el }, h("div", { class: "swiper-wrapper" }, h("div", { class: "swiper-slide" }, h("ptc-dynamic-card", { "card-type": "sequential", "card-screen": "mobile", "card-title": "iWarranty Business Update Webinar", "card-img-src": "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data", "card-img-alt": "image-test" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-margin": "margin-flush", "para-color": "white", "para-line-h": "line-height-p" }, "The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!"), h("ptc-spacer", { breakpoint: "x-small", size: "xx-large" }), h("ptc-spacer", { breakpoint: "small", size: "x-large" }), h("ptc-button", { type: "link", color: "ptc-secondary", "link-href": "https://www.ptc.com", target: "_blank" }, "Learn More"))), h("div", { class: "swiper-slide" }, h("ptc-dynamic-card", { "card-type": "sequential", "card-screen": "mobile", "card-title": "iWarranty Business Update Webinar", "card-img-src": "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data", "card-img-alt": "image-test" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-margin": "margin-flush", "para-color": "white", "para-line-h": "line-height-p" }, "The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!"), h("ptc-spacer", { breakpoint: "x-small", size: "xx-large" }), h("ptc-spacer", { breakpoint: "small", size: "x-large" }), h("ptc-button", { type: "link", color: "ptc-secondary", "link-href": "https://www.ptc.com", target: "_blank" }, "Learn More"))), h("div", { class: "swiper-slide" }, h("ptc-dynamic-card", { "card-type": "sequential", "card-screen": "mobile", "card-title": "iWarranty Business Update Webinar", "card-img-src": "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data", "card-img-alt": "image-test" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-margin": "margin-flush", "para-color": "white", "para-line-h": "line-height-p" }, "The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!"), h("ptc-spacer", { breakpoint: "x-small", size: "xx-large" }), h("ptc-spacer", { breakpoint: "small", size: "x-large" }), h("ptc-button", { type: "link", color: "ptc-secondary", "link-href": "https://www.ptc.com", target: "_blank" }, "Learn More")))), h("div", { class: "swiper-pagination" }))) : (h("div", null, "test")
+    // <div class="accordion-container desktop-container">
+    //   <div class="accordion">
+    //     <div class="accordion-item">
+    //       <ptc-dynamic-card
+    //         card-type="sequential"
+    //         card-screen="desktop"
+    //         is-expanded="true"
+    //         card-title="iWarranty Business Update Webinar"
+    //         card-img-src="https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data"
+    //         card-img-alt="image-test"
+    //       >
+    //         <ptc-para font-size="x-small" font-weight="w-4" para-margin="margin-flush" para-color="white" para-line-h="line-height-p">
+    //           The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!
+    //         </ptc-para>
+    //         <ptc-spacer breakpoint="x-small" size="xx-large"></ptc-spacer>
+    //         <ptc-spacer breakpoint="small" size="x-large"></ptc-spacer>
+    //         <ptc-button type="link" color="ptc-secondary" link-href="https://www.ptc.com" target="_blank">
+    //           Learn More
+    //         </ptc-button>
+    //       </ptc-dynamic-card>
+    //       <ptc-dynamic-card
+    //         card-type="sequential"
+    //         card-screen="desktop"
+    //         is-expanded="false"
+    //         card-title="iWarranty Business Update Webinar"
+    //         card-img-src="https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data"
+    //         card-img-alt="image-test"
+    //       >
+    //         <ptc-para font-size="x-small" font-weight="w-4" para-margin="margin-flush" para-color="white" para-line-h="line-height-p">
+    //           The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!
+    //         </ptc-para>
+    //         <ptc-spacer breakpoint="x-small" size="xx-large"></ptc-spacer>
+    //         <ptc-spacer breakpoint="small" size="x-large"></ptc-spacer>
+    //         <ptc-button type="link" color="ptc-secondary" link-href="https://www.ptc.com" target="_blank">
+    //           Learn More
+    //         </ptc-button>
+    //       </ptc-dynamic-card>
+    //       <ptc-dynamic-card
+    //         card-type="sequential"
+    //         card-screen="desktop"
+    //         is-expanded="false"
+    //         card-title="iWarranty Business Update Webinar"
+    //         card-img-src="https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data"
+    //         card-img-alt="image-test"
+    //       >
+    //         <ptc-para font-size="x-small" font-weight="w-4" para-margin="margin-flush" para-color="white" para-line-h="line-height-p">
+    //           The Leading Warranty & Contract Management System just got even better... iWarranty v5.3 now available!
+    //         </ptc-para>
+    //         <ptc-spacer breakpoint="x-small" size="xx-large"></ptc-spacer>
+    //         <ptc-spacer breakpoint="small" size="x-large"></ptc-spacer>
+    //         <ptc-button type="link" color="ptc-secondary" link-href="https://www.ptc.com" target="_blank">
+    //           Learn More
+    //         </ptc-button>
+    //       </ptc-dynamic-card>
+    //     </div>
+    //   </div>
+    // </div>
+    )));
+  }
+  initSlider() {
+    if (this.isMobile) {
+      if (this.swiperContainerRef) {
+        this.mySwiper = new Swiper(this.swiperContainerRef, {
+          // Customize options here
+          loop: true,
+          slidesPerView: 1,
+        });
+        console.log("running swiper");
+      }
+    }
+  }
+  static get is() { return "sequential-bundle"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["sequential-bundle.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["sequential-bundle.css"]
+    };
+  }
+  static get states() {
+    return {
+      "isMobile": {}
+    };
+  }
+  static get listeners() {
+    return [{
+        "name": "resize",
+        "method": "handleResize",
+        "target": "window",
+        "capture": false,
+        "passive": true
+      }];
+  }
+}