@ptcwebops/ptcw-design 6.4.36-beta → 6.5.0-upgrade

package/dist/collection/components/jumbotron-sub-menu/jumbotron-sub-menu.css

@@ -1,232 +0,0 @@
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-ul,
-li,
-ptc-subnav,
-ptc-tab-list,
-ptc-link,
-ptc-square-card,
-.hyphenate-text,
-ptc-footer {
-  word-break: break-word;
-  hyphens: manual;
-  -webkit-hyphens: manual;
-  -moz-hyphens: manual;
-  -ms-hyphens: manual;
-}
-@supports (hyphenate-limit-chars: 12 3 3) {
-  h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-ul,
-li,
-ptc-subnav,
-ptc-tab-list,
-ptc-link,
-ptc-square-card,
-.hyphenate-text,
-ptc-footer {
-    hyphens: auto;
-    -webkit-hyphenate-limit-before: 3;
-    /* For Safari */
-    -webkit-hyphenate-limit-after: 3;
-    /* For Safari */
-    hyphenate-limit-chars: 12 3 3;
-    hyphenate-limit-lines: 2;
-    hyphenate-limit-last: always;
-    hyphenate-limit-zone: 6%;
-    -webkit-hyphens: auto;
-    -webkit-hyphenate-limit-before: 3;
-    -webkit-hyphenate-limit-after: 3;
-    -webkit-hyphenate-limit-chars: 12 3 3;
-    -webkit-hyphenate-limit-lines: 2;
-    -moz-hyphens: auto;
-    -moz-hyphenate-limit-chars: 12 3 3;
-    -moz-hyphenate-limit-lines: 2;
-    -ms-hyphens: auto;
-    -ms-hyphenate-limit-chars: 12 3 3;
-    -ms-hyphenate-limit-lines: 2;
-  }
-}
-
-.menu {
-  display: block;
-  background-color: transparent;
-  color: black;
-  position: relative;
-}
-
-.menu-list {
-  list-style: none;
-  margin: 0;
-  padding: var(--ptc-element-spacing-03) 0;
-  display: none;
-  flex-direction: column;
-  background-color: white;
-  width: 250px;
-  position: absolute;
-  top: 40px;
-  left: 0;
-  margin-top: var(--ptc-element-spacing-04);
-  box-shadow: var(--ptc-shadow-x-small);
-  border-radius: var(--ptc-border-radius-standard);
-  z-index: 10;
-}
-.menu-list.open {
-  display: flex;
-}
-.menu-list li {
-  margin: 0;
-}
-.menu-list .active button {
-  font-weight: var(--ptc-font-weight-bold);
-}
-.menu-list .active button::after {
-  opacity: 1;
-}
-.menu-list button {
-  color: var(--color-gray-10);
-  font-size: var(--ptc-font-size-x-small);
-  font-weight: var(--ptc-font-weight-medium);
-  text-decoration: none;
-  border: 2px solid transparent;
-  background: none;
-  cursor: pointer;
-  line-height: var(--ptc-line-height-p);
-  position: relative;
-  text-align: left;
-  width: 100%;
-  padding: var(--ptc-element-spacing-03) var(--ptc-element-spacing-06);
-  font-family: var(--ptc-font-latin);
-}
-.menu-list button::after {
-  content: "";
-  display: block;
-  width: 2px;
-  height: calc(100% - 24px);
-  background: var(--color-green-07);
-  transition: opacity var(--ptc-transition-medium) var(--ptc-ease-inout);
-  opacity: 0;
-  position: absolute;
-  top: 12px;
-  left: 10px;
-}
-.menu-list button:hover::after, .menu-list button:focus::after {
-  opacity: 1;
-}
-.menu-list button:focus-visible {
-  border-radius: var(--ptc-border-radius-standard);
-  border: 2px solid white;
-  outline: 5px solid var(--keyboard-nav-outline);
-}
-.menu-list button:focus-visible::after {
-  opacity: 0;
-}
-
-.mobile-menu-icon {
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-  font-size: var(--ptc-font-size-x-small);
-  text-align: left;
-  padding: 8px 0px;
-  background-color: var(--color-white);
-  border-bottom: 2px solid var(--color-white);
-  justify-content: flex-end;
-  width: -moz-fit-content;
-  width: fit-content;
-  background-color: transparent;
-}
-.mobile-menu-icon:focus-visible {
-  border-radius: var(--ptc-border-radius-standard);
-  border: 2px solid white;
-  outline: 5px solid var(--keyboard-nav-outline);
-}
-
-.mobile-menu-text {
-  color: var(--color-white);
-  text-align: left;
-  font-family: var(--ptc-font-latin);
-  font-size: var(--ptc-font-size-x-small);
-  font-weight: var(--ptc-font-weight-bold);
-  margin-right: var(--ptc-element-spacing-03);
-}
-
-@media (min-width: 992px) {
-  .menu {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    background-color: transparent;
-    padding: 0px;
-    color: white;
-    position: relative;
-    font-family: var(--ptc-font-latin);
-    left: 0;
-    top: 0px;
-  }
-
-  .menu-list {
-    display: flex;
-    flex-direction: row;
-    justify-content: center;
-    gap: 32px;
-    background-color: transparent;
-    width: auto;
-    position: relative;
-    top: auto;
-    right: auto;
-    box-shadow: none;
-    border-radius: 0;
-    margin-top: 0px;
-    padding-top: 0px;
-    padding-bottom: 0px;
-  }
-  .menu-list button {
-    text-align: center;
-    width: auto;
-    padding: 0px;
-    font-size: 16px;
-    color: white;
-    font-family: var(--ptc-font-latin);
-  }
-  .menu-list button::after {
-    position: relative;
-    width: 100%;
-    height: 1px;
-    transform-origin: bottom;
-    bottom: auto;
-    top: calc(100% + 8px);
-    background: var(--color-white);
-    left: 0;
-    transform: scaleY(0);
-    transition: all var(--ptc-transition-medium) var(--ptc-ease-in);
-  }
-  .menu-list button:hover::after, .menu-list button:active::after {
-    transform: scaleY(1);
-    font-weight: var(--ptc-font-weight-bold);
-  }
-  .menu-list button:focus-visible {
-    border-radius: var(--ptc-border-radius-standard);
-    border: 2px solid white;
-    outline: 5px solid var(--keyboard-nav-outline);
-  }
-  .menu-list li.active button::after {
-    height: 2px;
-    transform: scaleY(1);
-    font-weight: var(--ptc-font-weight-bold);
-  }
-
-  .mobile-menu-icon {
-    display: none;
-  }
-}

package/dist/collection/components/jumbotron-sub-menu/jumbotron-sub-menu.js

@@ -1,65 +0,0 @@
-import { h, } from "@stencil/core";
-export class JumbotronSubMenu {
-  constructor() {
-    this.isClickable = true;
-    this.isOpen = false;
-    this.activeItem = 0;
-  }
-  toggleMenu() {
-    this.isOpen = !this.isOpen;
-  }
-  selectItem(index) {
-    if (this.isClickable) {
-      this.isClickable = false;
-      this.activeItem = index;
-      this.isOpen = false;
-      this.itemSelected.emit(index); // Emit the custom event
-      setTimeout(() => {
-        this.isClickable = true;
-      }, 500);
-    }
-  }
-  render() {
-    const upArrow = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "15", height: "11", viewBox: "0 0 15 11", fill: "none" }, h("path", { d: "M13 8.5L7.34315 2.71178L1.68629 8.5", stroke: "white", "stroke-width": "3", "stroke-linecap": "round" })));
-    const downArrow = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "15", height: "11", viewBox: "0 0 15 11", fill: "none" }, h("path", { d: "M13 2.5L7.34315 8.28822L1.68629 2.5", stroke: "white", "stroke-width": "3", "stroke-linecap": "round" })));
-    const menuItems = Array.from(this.el.querySelectorAll('[slot^="menu-item"]'));
-    return (h("nav", { class: "menu" }, h("div", { class: "mobile-menu-icon", onClick: () => this.toggleMenu(), onKeyPress: () => this.toggleMenu(), tabindex: "0" }, h("span", { class: "mobile-menu-text" }, menuItems[this.activeItem].textContent), h("span", null, this.isOpen ? upArrow : downArrow)), h("ul", { class: `menu-list ${this.isOpen ? "open" : ""}` }, menuItems.map((item, index) => (h("li", { key: index, id: `hp-tab-${index}`, class: this.activeItem === index ? "active" : "" }, h("button", { onClick: () => this.selectItem(index) }, item.textContent)))))));
-  }
-  static get is() { return "jumbotron-sub-menu"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["jumbotron-sub-menu.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["jumbotron-sub-menu.css"]
-    };
-  }
-  static get states() {
-    return {
-      "isOpen": {},
-      "activeItem": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "itemSelected",
-        "name": "itemSelected",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        }
-      }];
-  }
-  static get elementRef() { return "el"; }
-}

package/dist/collection/components/jumbotron-sub-mune/jumbotron-sub-mune.css

@@ -1,154 +0,0 @@
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-ul,
-li,
-ptc-subnav,
-ptc-tab-list,
-ptc-link,
-ptc-square-card,
-.hyphenate-text,
-ptc-footer {
-  word-break: break-word;
-  hyphens: manual;
-  -webkit-hyphens: manual;
-  -moz-hyphens: manual;
-  -ms-hyphens: manual;
-}
-@supports (hyphenate-limit-chars: 12 3 3) {
-  h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-ul,
-li,
-ptc-subnav,
-ptc-tab-list,
-ptc-link,
-ptc-square-card,
-.hyphenate-text,
-ptc-footer {
-    hyphens: auto;
-    -webkit-hyphenate-limit-before: 3;
-    /* For Safari */
-    -webkit-hyphenate-limit-after: 3;
-    /* For Safari */
-    hyphenate-limit-chars: 12 3 3;
-    hyphenate-limit-lines: 2;
-    hyphenate-limit-last: always;
-    hyphenate-limit-zone: 6%;
-    -webkit-hyphens: auto;
-    -webkit-hyphenate-limit-before: 3;
-    -webkit-hyphenate-limit-after: 3;
-    -webkit-hyphenate-limit-chars: 12 3 3;
-    -webkit-hyphenate-limit-lines: 2;
-    -moz-hyphens: auto;
-    -moz-hyphenate-limit-chars: 12 3 3;
-    -moz-hyphenate-limit-lines: 2;
-    -ms-hyphens: auto;
-    -ms-hyphenate-limit-chars: 12 3 3;
-    -ms-hyphenate-limit-lines: 2;
-  }
-}
-
-.menu {
-  display: none;
-  background-color: transparent;
-  color: white;
-  position: relative;
-}
-@media only screen and (min-width: 992px) {
-  .menu {
-    display: block;
-  }
-}
-
-.menu-list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: row;
-  justify-content: flex-start;
-  gap: 32px;
-}
-
-.menu-list li {
-  margin: 0;
-}
-
-.menu-list a,
-.menu-list button {
-  color: white;
-  text-decoration: none;
-  border: none;
-  background: none;
-  cursor: pointer;
-  position: relative;
-}
-
-.menu-list a {
-  white-space: nowrap;
-}
-
-.menu-list a::after,
-.menu-list button::after {
-  content: "";
-  display: block;
-  width: 100%;
-  height: 2px;
-  background: white;
-  transition: transform 0.3s ease;
-  transform: scaleY(0);
-  transform-origin: bottom;
-}
-
-.menu-list a:hover::after,
-.menu-list a:focus::after,
-.menu-list button:hover::after,
-.menu-list button:focus::after {
-  transform: scaleX(1);
-  transform-origin: left;
-}
-
-.mobile-menu-icon {
-  display: none;
-  cursor: pointer;
-  font-size: 24px;
-  text-align: center;
-  position: absolute;
-  top: 0;
-  right: 0;
-}
-
-@media (max-width: 768px) {
-  .menu-list {
-    display: none;
-    flex-direction: column;
-    background-color: transparent;
-    width: 100%;
-    position: absolute;
-    top: 40px;
-    /* adjust according to your needs */
-    right: 0;
-  }
-
-  .menu-list.open {
-    display: flex;
-  }
-
-  .mobile-menu-icon {
-    display: block;
-  }
-
-  .menu-list li {
-    margin: 10px 0;
-  }
-}

package/dist/collection/components/jumbotron-sub-mune/jumbotron-sub-mune.js

@@ -1,83 +0,0 @@
-import { h } from "@stencil/core";
-export class JumbotronSubMune {
-  constructor() {
-    this.items = undefined;
-    this.isOpen = false;
-    this.activeItem = "";
-  }
-  getItems() {
-    try {
-      if (!this.items)
-        return [];
-      return JSON.parse(this.items);
-    }
-    catch (e) {
-      console.error("Invalid Json format for items prop", e);
-      return [];
-    }
-  }
-  componentWillLoad() {
-    var _a;
-    // if (this.items.length > 0) {
-    // 	this.activeItem = this.items[0];
-    // }
-    const parsed = this.getItems();
-    if (parsed.length > 0) {
-      this.activeItem = ((_a = parsed[0]) === null || _a === void 0 ? void 0 : _a.text) || "";
-    }
-  }
-  toggleMenu() {
-    this.isOpen = !this.isOpen;
-  }
-  selectItem(item) {
-    this.activeItem = item;
-    this.isOpen = false;
-  }
-  render() {
-    const menuItems = this.getItems();
-    const upArrow = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "15", height: "11", viewBox: "0 0 15 11", fill: "none" }, h("path", { d: "M13 8.5L7.34315 2.71178L1.68629 8.5", stroke: "white", "stroke-width": "3", "stroke-linecap": "round" })));
-    const downArrow = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "15", height: "11", viewBox: "0 0 15 11", fill: "none" }, h("path", { d: "M13 2.5L7.34315 8.28822L1.68629 2.5", stroke: "white", "stroke-width": "3", "stroke-linecap": "round" })));
-    return (h("nav", { class: "menu" }, h("div", { class: "mobile-menu-icon", onClick: () => this.toggleMenu() }, this.activeItem, h("span", null, this.isOpen ? upArrow : downArrow)), h("ul", { class: `menu-list ${this.isOpen ? "open" : ""}` }, menuItems.map((item) => (h("li", null, item.isButton ? (h("button", { onClick: () => {
-        this.selectItem(item);
-      } }, item.text)) : (h("a", { href: item.link }, item.text))))))));
-  }
-  static get is() { return "jumbotron-sub-mune"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["jumbotron-sub-mune.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["jumbotron-sub-mune.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "items": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "items",
-        "reflect": false
-      }
-    };
-  }
-  static get states() {
-    return {
-      "isOpen": {},
-      "activeItem": {}
-    };
-  }
-}