@ptcwebops/ptcw-design 0.0.15 → 0.1.0

package/dist/collection/components/ptc-nav-item/ptc-nav-item.js

@@ -1,252 +0,0 @@
-import { Component, Host, h, Element, Prop, Listen, Watch, Event } from '@stencil/core';
-export class PtcNavItem {
-  constructor() {
-    /**
-     * Link URL
-     */
-    this.url = undefined;
-    /**
-     * Nav Description
-     */
-    this.label = '';
-    /**
-     * If the current nav item is expanded
-     */
-    this.ariaExpanded = false;
-    /**
-     * Depth of the current nav item
-     */
-    this.depth = 0;
-    /**
-     * If the current nav item has children nav items
-     */
-    this.hasChildren = false;
-    /**
-     * If the parent nav item of the current one is expanded
-     */
-    this.parentExpanded = false;
-    /**
-     * Nav Item Type
-     */
-    this.navType = undefined;
-  }
-  /**
-   * Watch
-   */
-  expandedHandler(newValue) {
-    const children = Array.prototype.slice.call(this.el.children);
-    children.forEach(child => {
-      child.parentExpanded = newValue;
-    });
-    this.menuItemToggled.emit({ expanded: this.ariaExpanded });
-  }
-  /**
-   * Event Listener
-   */
-  handleClick(e) {
-    if (this.hasChildren) {
-      e.preventDefault();
-      this.ariaExpanded = !this.ariaExpanded;
-    }
-  }
-  handleResize(ev) {
-    console.log('the body was scrolled', ev);
-  }
-  /**
-   * Lifecycle method
-   */
-  componentWillRender() {
-    this.hasChildren = !!this.el.hasChildNodes();
-    let parentMenu = this.el.closest('ptc-nav-item');
-    let nextParentMenu;
-    this.depth = 0;
-    while (parentMenu) {
-      nextParentMenu = parentMenu.parentElement.closest('ptc-nav-item');
-      if (nextParentMenu === parentMenu) {
-        break;
-      }
-      else {
-        parentMenu = nextParentMenu;
-        this.depth = this.depth + 1;
-      }
-    }
-  }
-  render() {
-    //const leftIndent = this.depth > 1 ? 25 * this.depth + 'px' : '25px';
-    return (h(Host, { role: "none" },
-      h("a", { role: "menuitem", href: this.url, tabIndex: this.parentExpanded || this.depth === 1 ? 0 : -1, "aria-depth": this.depth, "aria-haspopup": this.hasChildren.toString(), "aria-expanded": this.hasChildren ? this.ariaExpanded.toString() : this.ariaExpanded, onClick: e => this.handleClick(e), class: this.navType },
-        h("span", null, this.label)),
-      this.hasChildren && (h("div", { class: "ptc-nav-children", role: "menu", part: this.navType, "aria-label": this.label },
-        h("slot", null)))));
-  }
-  static get is() { return "ptc-nav-item"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["ptc-nav-item.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["ptc-nav-item.css"]
-  }; }
-  static get properties() { return {
-    "url": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Link URL"
-      },
-      "attribute": "url",
-      "reflect": false,
-      "defaultValue": "undefined"
-    },
-    "label": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Nav Description"
-      },
-      "attribute": "label",
-      "reflect": false,
-      "defaultValue": "''"
-    },
-    "ariaExpanded": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "If the current nav item is expanded"
-      },
-      "attribute": "aria-expanded",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "depth": {
-      "type": "number",
-      "mutable": true,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Depth of the current nav item"
-      },
-      "attribute": "depth",
-      "reflect": true,
-      "defaultValue": "0"
-    },
-    "hasChildren": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "If the current nav item has children nav items"
-      },
-      "attribute": "has-children",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "parentExpanded": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "If the parent nav item of the current one is expanded"
-      },
-      "attribute": "parent-expanded",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "navType": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'primary-nav' | 'secondary-nav' | 'primary-footer' | 'secondary-footer' | 'language-nav'",
-        "resolved": "\"language-nav\" | \"primary-footer\" | \"primary-nav\" | \"secondary-footer\" | \"secondary-nav\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Nav Item Type"
-      },
-      "attribute": "nav-type",
-      "reflect": false,
-      "defaultValue": "undefined"
-    }
-  }; }
-  static get events() { return [{
-      "method": "menuItemToggled",
-      "name": "menuItemToggled",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Menu Toggle Event"
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
-  static get elementRef() { return "el"; }
-  static get watchers() { return [{
-      "propName": "ariaExpanded",
-      "methodName": "expandedHandler"
-    }]; }
-  static get listeners() { return [{
-      "name": "handleClick",
-      "method": "handleClick",
-      "target": undefined,
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "resize",
-      "method": "handleResize",
-      "target": "window",
-      "capture": false,
-      "passive": true
-    }]; }
-}

package/dist/collection/components/ptc-overlay/ptc-overlay.css

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

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

@@ -1,14 +0,0 @@
-import { Component, Host, h } from '@stencil/core';
-export class PtcOverlay {
-  render() {
-    return (h(Host, null,
-      h("slot", null)));
-  }
-  static get is() { return "ptc-overlay"; }
-  static get originalStyleUrls() { return {
-    "$": ["ptc-overlay.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["ptc-overlay.css"]
-  }; }
-}

package/dist/collection/components/ptc-para/ptc-para.css

@@ -1,57 +0,0 @@
-p.default {
-  text-shadow: 0 3px 6px var(--color-white);
-  line-height: var(--ptc-line-height-dense);
-  color: var(--color-primary-grey);
-}
-p.xx-small {
-  font-size: var(--ptc-font-size-xx-small);
-}
-p.x-small {
-  font-size: var(--ptc-font-size-x-small);
-}
-p.small {
-  font-size: var(--ptc-font-size-small);
-}
-p.medium {
-  font-size: var(--ptc-font-size-medium);
-}
-p.large {
-  font-size: var(--ptc-font-size-large);
-}
-p.x-large {
-  font-size: var(--ptc-font-size-x-large);
-}
-p.xx-large {
-  font-size: var(--ptc-font-size-xx-large);
-}
-p.xxx-large {
-  font-size: var(--ptc-font-size-xxx-large);
-}
-p.xxxx-large {
-  font-size: var(--ptc-font-size-xxxx-large);
-}
-p.w-3 {
-  font-weight: var(--ptc-font-weight-thin);
-}
-p.w-4 {
-  font-weight: var(--ptc-font-weight-regular);
-}
-p.w-5 {
-  font-weight: var(--ptc-font-weight-medium);
-}
-p.w-6 {
-  font-weight: var(--ptc-font-weight-semibold);
-}
-p.w-7 {
-  font-weight: var(--ptc-font-weight-bold);
-}
-p.w-8 {
-  font-weight: var(--ptc-font-weight-extrabold);
-}
-p.w-9 {
-  font-weight: var(--ptc-font-weight-black);
-}
-p.margin-flush {
-  margin-top: 0;
-  margin-bottom: 0;
-}

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

@@ -1,111 +0,0 @@
-import { Component, h, Prop } from '@stencil/core';
-export class PtcPara {
-  constructor() {
-    /**
-     * Paragraph font size
-     **/
-    this.fontSize = "medium";
-    /**
-     * Paragraph font weight
-     **/
-    this.fontWeight = 'w-4';
-    /**
-     * Paragraph Style
-     **/
-    this.paraStyle = 'default';
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    return (h("p", { class: classMap, part: "part-para" },
-      h("slot", null)));
-  }
-  getCssClassMap() {
-    return {
-      [this.fontSize]: true,
-      [this.fontWeight]: true,
-      [this.paraStyle]: true,
-      [this.paraMargin]: true,
-    };
-  }
-  static get is() { return "ptc-para"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["ptc-para.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["ptc-para.css"]
-  }; }
-  static get properties() { return {
-    "fontSize": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'xx-small' | 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xx-large' | 'xxx-large' | 'xxxx-large'",
-        "resolved": "\"large\" | \"medium\" | \"small\" | \"x-large\" | \"x-small\" | \"xx-large\" | \"xx-small\" | \"xxx-large\" | \"xxxx-large\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Paragraph font size"
-      },
-      "attribute": "font-size",
-      "reflect": false,
-      "defaultValue": "\"medium\""
-    },
-    "fontWeight": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'w-3' | 'w-4' | 'w-5' | 'w-6' | 'w-7' | 'w-8' | 'w-9'",
-        "resolved": "\"w-3\" | \"w-4\" | \"w-5\" | \"w-6\" | \"w-7\" | \"w-8\" | \"w-9\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Paragraph font weight"
-      },
-      "attribute": "font-weight",
-      "reflect": false,
-      "defaultValue": "'w-4'"
-    },
-    "paraStyle": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'default' | 'intro' | 'small'",
-        "resolved": "\"default\" | \"intro\" | \"small\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Paragraph Style"
-      },
-      "attribute": "para-style",
-      "reflect": false,
-      "defaultValue": "'default'"
-    },
-    "paraMargin": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'margin-flush'",
-        "resolved": "\"margin-flush\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Paragraph Margin"
-      },
-      "attribute": "para-margin",
-      "reflect": false
-    }
-  }; }
-}

package/dist/collection/components/ptc-picture/ptc-picture.css

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

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

@@ -1,44 +0,0 @@
-import { Component, Prop, Host, h } from '@stencil/core';
-export class PtcPicture {
-  constructor() {
-    this.lazy = 'lazy';
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    return (h(Host, { class: classMap },
-      h("picture", null,
-        h("slot", null))));
-  }
-  getCssClassMap() {
-    return {
-      [this.lazy]: true,
-    };
-  }
-  static get is() { return "ptc-picture"; }
-  static get originalStyleUrls() { return {
-    "$": ["ptc-picture.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["ptc-picture.css"]
-  }; }
-  static get properties() { return {
-    "lazy": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'lazy' | 'eager'",
-        "resolved": "\"eager\" | \"lazy\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "lazy",
-      "reflect": false,
-      "defaultValue": "'lazy'"
-    }
-  }; }
-}