@ptcwebops/ptcw-design 3.6.2 → 3.6.4

package/dist/collection/components/ptc-dropdown/ptc-dropdown.js

@@ -1,162 +1,162 @@
-import { h } from '@stencil/core';
-export class PtcDropdown {
-  constructor() {
-    this.handleClick = (item) => {
-      this.listItems.forEach((item) => item.selected = undefined);
-      item.selected = true;
-      this.selectedItem = item;
-      this.toggle = !this.toggle;
-      this.clickedItem.emit(item);
-    };
-    this.toggleList = () => {
-      this.toggle = !this.toggle;
-    };
-    this.theme = 'sort';
-    this.label = undefined;
-    this.listItems = undefined;
-    this.toggle = false;
-    this.selectedItem = undefined;
-  }
-  offClick(e) {
-    if (e && !this.host.contains(e.target) && this.toggle) {
-      this.toggle = false;
-    }
-  }
-  componentWillLoad() {
-    let items = this.host.querySelectorAll('item');
-    if (!this.listItems) {
-      this.listItems = [];
-    }
-    items.forEach(item => {
-      if (item && item.getAttribute('label')) {
-        let listItem = {
-          element: item,
-          label: item.getAttribute('label'),
-          value: item.getAttribute('value'),
-          selected: item.hasAttribute('selected')
-        };
-        this.listItems.push(listItem);
-        if (item.hasAttribute('selected')) {
-          this.selectedItem = listItem;
-        }
-      }
-    });
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    return (h("div", { class: classMap }, h("header", { class: "dropdown__header", onClick: this.toggleList }, h("label", null, h("b", null, this.label), " ", this.selectedItem ? this.selectedItem.label : "Select Option"), h("icon-asset", { type: "solid", size: "x-small", name: "chevron-down" })), this.toggle &&
-      h("ul", { tabIndex: -1, class: "dropdown__list", onBlur: () => { this.toggle = false; } }, this.listItems.map((item) => {
-        let cssClass = "dropdown__item";
-        if (item.selected) {
-          cssClass += " selected";
-        }
-        return (h("li", { class: cssClass, onClick: () => this.handleClick(item) }, item.label));
-      }))));
-  }
-  getCssClassMap() {
-    return {
-      ['ptc-dropdown']: true,
-      [this.theme]: true
-    };
-  }
-  static get is() { return "ptc-dropdown"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["ptc-dropdown.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["ptc-dropdown.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "theme": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'sort' | 'support'",
-          "resolved": "\"sort\" | \"support\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Theme"
-        },
-        "attribute": "theme",
-        "reflect": false,
-        "defaultValue": "'sort'"
-      },
-      "label": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "label",
-        "reflect": false
-      },
-      "listItems": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "any[]",
-          "resolved": "any[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        }
-      }
-    };
-  }
-  static get states() {
-    return {
-      "toggle": {},
-      "selectedItem": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "clickedItem",
-        "name": "clickedItem",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        }
-      }];
-  }
-  static get elementRef() { return "host"; }
-  static get listeners() {
-    return [{
-        "name": "click",
-        "method": "offClick",
-        "target": "document",
-        "capture": false,
-        "passive": false
-      }];
-  }
-}
+import { h } from '@stencil/core';
+export class PtcDropdown {
+  constructor() {
+    this.handleClick = (item) => {
+      this.listItems.forEach((item) => item.selected = undefined);
+      item.selected = true;
+      this.selectedItem = item;
+      this.toggle = !this.toggle;
+      this.clickedItem.emit(item);
+    };
+    this.toggleList = () => {
+      this.toggle = !this.toggle;
+    };
+    this.theme = 'sort';
+    this.label = undefined;
+    this.listItems = undefined;
+    this.toggle = false;
+    this.selectedItem = undefined;
+  }
+  offClick(e) {
+    if (e && !this.host.contains(e.target) && this.toggle) {
+      this.toggle = false;
+    }
+  }
+  componentWillLoad() {
+    let items = this.host.querySelectorAll('item');
+    if (!this.listItems) {
+      this.listItems = [];
+    }
+    items.forEach(item => {
+      if (item && item.getAttribute('label')) {
+        let listItem = {
+          element: item,
+          label: item.getAttribute('label'),
+          value: item.getAttribute('value'),
+          selected: item.hasAttribute('selected')
+        };
+        this.listItems.push(listItem);
+        if (item.hasAttribute('selected')) {
+          this.selectedItem = listItem;
+        }
+      }
+    });
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    return (h("div", { class: classMap }, h("header", { class: "dropdown__header", onClick: this.toggleList }, h("label", null, h("b", null, this.label), " ", this.selectedItem ? this.selectedItem.label : "Select Option"), h("icon-asset", { type: "solid", size: "x-small", name: "chevron-down" })), this.toggle &&
+      h("ul", { tabIndex: -1, class: "dropdown__list", onBlur: () => { this.toggle = false; } }, this.listItems.map((item) => {
+        let cssClass = "dropdown__item";
+        if (item.selected) {
+          cssClass += " selected";
+        }
+        return (h("li", { class: cssClass, onClick: () => this.handleClick(item) }, item.label));
+      }))));
+  }
+  getCssClassMap() {
+    return {
+      ['ptc-dropdown']: true,
+      [this.theme]: true
+    };
+  }
+  static get is() { return "ptc-dropdown"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["ptc-dropdown.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["ptc-dropdown.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "theme": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'sort' | 'support'",
+          "resolved": "\"sort\" | \"support\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Theme"
+        },
+        "attribute": "theme",
+        "reflect": false,
+        "defaultValue": "'sort'"
+      },
+      "label": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "label",
+        "reflect": false
+      },
+      "listItems": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "any[]",
+          "resolved": "any[]",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        }
+      }
+    };
+  }
+  static get states() {
+    return {
+      "toggle": {},
+      "selectedItem": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "clickedItem",
+        "name": "clickedItem",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
+  static get elementRef() { return "host"; }
+  static get listeners() {
+    return [{
+        "name": "click",
+        "method": "offClick",
+        "target": "document",
+        "capture": false,
+        "passive": false
+      }];
+  }
+}

package/dist/collection/components/ptc-dynamic-card/media/nav-active-dotslick.svg

@@ -1,16 +1,16 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #18723b;
-      }
-
-      .cls-2 {
-        fill: #f3f3f3;
-      }
-    </style>
-  </defs>
-  <circle id="Ellipse_1_copy_2" data-name="Ellipse 1 copy 2" class="cls-1" cx="10" cy="10" r="10"/>
-  <circle id="Ellipse_1_copy" data-name="Ellipse 1 copy" class="cls-2" cx="10" cy="10" r="7.781"/>
-  <circle class="cls-1" cx="10" cy="10" r="5"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #18723b;
+      }
+
+      .cls-2 {
+        fill: #f3f3f3;
+      }
+    </style>
+  </defs>
+  <circle id="Ellipse_1_copy_2" data-name="Ellipse 1 copy 2" class="cls-1" cx="10" cy="10" r="10"/>
+  <circle id="Ellipse_1_copy" data-name="Ellipse 1 copy" class="cls-2" cx="10" cy="10" r="7.781"/>
+  <circle class="cls-1" cx="10" cy="10" r="5"/>
 </svg>

package/dist/collection/components/ptc-dynamic-card/ptc-dynamic-card.css

@@ -13,6 +13,38 @@ li {
   -moz-hyphens: manual;
   -ms-hyphens: manual;
 }
+@supports (hyphenate-limit-chars: 12 3 3) {
+  h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+ul,
+li {
+    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;
+  }
+}
 
 :host {
   display: block;
@@ -113,8 +145,6 @@ li {
   letter-spacing: var(--ptc-letter-spacing-normal);
   padding-left: var(--ptc-element-spacing-03);
   padding-right: var(--ptc-element-spacing-03);
-  word-break: break-word;
-  hyphens: auto;
 }
 @media only screen and (min-width: 1440px) {
   :host(.sequential) .card-dt-closed .card-title h2 {