UNPKG

plcc-table

Version:

Plcc table element for PatternFly Elements

600 lines (515 loc) 34.8 kB
(function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('../../@patternfly/pfelement/dist/pfelement.umd'), require('../../@patternfly/pfe-progress-indicator/dist/pfe-progress-indicator.umd'), require('../../@patternfly/pfe-datetime/dist/pfe-datetime.umd')) : typeof define === 'function' && define.amd ? define(['../../@patternfly/pfelement/dist/pfelement.umd', '../../@patternfly/pfe-progress-indicator/dist/pfe-progress-indicator.umd', '../../@patternfly/pfe-datetime/dist/pfe-datetime.umd'], factory) : (global.PlccTable = factory(global.PFElement)); }(this, (function (PFElement) { 'use strict'; PFElement = PFElement && PFElement.hasOwnProperty('default') ? PFElement['default'] : PFElement; var classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }; var createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } }; var inherits = function (subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }; var possibleConstructorReturn = function (self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }; /*! * PatternFly Elements: PlccTable 0.0.14 * @license * Copyright 2020 Red Hat, Inc. * * Permission is hereby granted, free of charge, to any person obtaining a copy * of this software and associated documentation files (the "Software"), to deal * in the Software without restriction, including without limitation the rights * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell * copies of the Software, and to permit persons to whom the Software is * furnished to do so, subject to the following conditions: * * The above copyright notice and this permission notice shall be included in * all copies or substantial portions of the Software. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE * SOFTWARE. * */ var PlccTable = function (_PFElement) { inherits(PlccTable, _PFElement); createClass(PlccTable, [{ key: "html", get: function get$$1() { return "<style>.product-lifecycle-info__table thead,.sr-only{position:absolute;overflow:hidden;clip:rect(0,0,0,0);height:1px;width:1px;margin:-1px;padding:0;border:0}:host{display:block}:host([hidden]){display:none}:host([loading]) article{display:none}article{display:block;font-size:16px;line-height:1.5;color:#151515}#loading{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;min-height:100px}#loading.loading{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.u-no-break{white-space:nowrap}*{-webkit-box-sizing:border-box;box-sizing:border-box}.icon-close{position:relative;width:1.5em;height:1.5em;margin:0;padding:0;border:0;font-size:2rem;background:0 0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.icon-close__inner1{position:absolute;top:50%;left:50%;width:0;height:0;font-size:4rem;-webkit-transform:translate(-50%,-50%) scale(.125);transform:translate(-50%,-50%) scale(.125)}.icon-close__inner1:after,.icon-close__inner1:before{content:\"\";position:absolute;top:0;left:0;display:block;width:.3em;height:2em;background:#000}.icon-close:focus .icon-close__inner1:after,.icon-close:focus .icon-close__inner1:before,.icon-close:hover .icon-close__inner1:after,.icon-close:hover .icon-close__inner1:before{background:#06c}.icon-close__inner1:before{-webkit-transform:translate(-50%,-50%) rotate(-45deg);transform:translate(-50%,-50%) rotate(-45deg)}.icon-close__inner1:after{-webkit-transform:translate(-50%,-50%) rotate(45deg);transform:translate(-50%,-50%) rotate(45deg)}article{font-size:1rem;line-height:1.5;color:#151515}.product-lifecycle__wrapper{position:relative}.product-lifecycle__wrapper--listing{border:1px solid #d2d2d2}.product-lifecycle__header{padding:1.125rem}@media (min-width:650px){.product-lifecycle__header{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:baseline;-webkit-align-items:baseline;-ms-flex-align:baseline;align-items:baseline;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:1rem}}.product-lifecycle__header--more-info{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}@media (min-width:1080px){.product-lifecycle__header--more-info{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row}}.product-lifecycle__header--more-info>*{margin-bottom:.5em}@media (min-width:1080px){.product-lifecycle__header--more-info>*{margin-right:1.5rem}}.product-lifecycle__header--more-info>:last-child{margin-right:0}.product-lifecycle-info__product-name{font-size:1.25em;font-weight:400;width:100%}.product-lifecycle__header--less-info .product-lifecycle-info__product-name{margin-right:auto;width:auto}.product-lifecycle-info__detailed-info{margin-right:auto}.product-lifecycle__header--more-info .product-lifecycle-info__detailed-info{margin-bottom:1em}[type=checkbox]{margin-right:.25em}.product-lifecycle__close{position:absolute;top:0;right:0;cursor:pointer}table{min-width:100%;border:0}@media (min-width:650px){table{position:relative;margin-left:0;margin-right:0}}.product-lifecycle-info__table-headers{position:-webkit-sticky;position:sticky;top:0;z-index:999;display:none;background:#fff}@media (min-width:1000px){.product-lifecycle-info__table-headers{display:table}}.product-lifecycle-info__table{border-top:0}caption,td,th{padding:1.125rem;border:0;text-align:left}caption *,td *,th *{margin:0;padding:0}th{font-weight:700;vertical-align:bottom}@media (min-width:1000px){td:nth-last-child(2):first-child~td,td:nth-last-child(2):first-child~th,th:nth-last-child(2):first-child~td,th:nth-last-child(2):first-child~th{width:50%}}@media (min-width:1000px){td:nth-last-child(3):first-child~td,td:nth-last-child(3):first-child~th,th:nth-last-child(3):first-child~td,th:nth-last-child(3):first-child~th{width:33.33333%}}@media (min-width:1000px){td:nth-last-child(4):first-child~td,td:nth-last-child(4):first-child~th,th:nth-last-child(4):first-child~td,th:nth-last-child(4):first-child~th{width:25%}}@media (min-width:1000px){td:nth-last-child(5):first-child~td,td:nth-last-child(5):first-child~th,th:nth-last-child(5):first-child~td,th:nth-last-child(5):first-child~th{width:20%}}@media (min-width:1000px){td:nth-last-child(6):first-child~td,td:nth-last-child(6):first-child~th,th:nth-last-child(6):first-child~td,th:nth-last-child(6):first-child~th{width:16.66667%}}@media (min-width:1000px){td:nth-last-child(7):first-child~td,td:nth-last-child(7):first-child~th,th:nth-last-child(7):first-child~td,th:nth-last-child(7):first-child~th{width:14.28571%}}@media (min-width:1000px){td:nth-last-child(8):first-child~td,td:nth-last-child(8):first-child~th,th:nth-last-child(8):first-child~td,th:nth-last-child(8):first-child~th{width:12.5%}}@media (min-width:1000px){td:nth-last-child(9):first-child~td,td:nth-last-child(9):first-child~th,th:nth-last-child(9):first-child~td,th:nth-last-child(9):first-child~th{width:11.11111%}}th{margin-top:1rem;border-top:4px solid #d2d2d2;border-bottom:1px solid #d2d2d2}tbody tr:first-child th{border-top:0;margin-top:0}@media (min-width:1000px){th{margin-top:0;border-top:0}}th[scope=row]{font-weight:inherit}td{padding:.5rem 1.125rem;border:0}@media (min-width:1000px){td{border-bottom:1px solid #d2d2d2}}@media (min-width:1000px){td,th{padding:1rem}}caption{padding:16px 24px;border-bottom:3px solid #d2d2d2}.responsive-table--row-strategy thead{display:none}@media (min-width:1000px){.responsive-table--row-strategy thead{display:table-header-group}}.responsive-table--row-strategy td,.responsive-table--row-strategy th{display:block}@media (min-width:1000px){.responsive-table--row-strategy td,.responsive-table--row-strategy th{display:table-cell}}.responsive-table--row-strategy td:before,.responsive-table--row-strategy th:before{content:attr(data-label) \": \";font-weight:700}@media (min-width:1000px){.responsive-table--row-strategy td:before,.responsive-table--row-strategy th:before{content:none}}.responsive-table--column-strategy{display:none}@media (min-width:1000px){.responsive-table--column-strategy{display:table}}@media (min-width:1000px){.responsive-table__wrapper--column-strategy .responsive-table__mobile-alternative{display:none}}.responsive-table__wrapper--scroll-strategy{overflow-x:auto}@media (min-width:1000px){.responsive-table__wrapper--scroll-strategy{overflow:hidden}}:host([pfe-c-style=compact]) .lifecycle-table__product-name,:host([pfe-c-style=compact]) table{font-size:.875rem;line-height:1.5}:host([pfe-c-style=compact]) .product-lifecycle-info__table-headers{border:0}:host([pfe-c-style=compact]) caption,:host([pfe-c-style=compact]) td,:host([pfe-c-style=compact]) th{padding:.57143em}:host([pfe-c-style=compact]) caption:first-child,:host([pfe-c-style=compact]) td:first-child,:host([pfe-c-style=compact]) th:first-child{padding-left:1.14286em}:host([pfe-c-style=compact]) caption:last-child,:host([pfe-c-style=compact]) td:last-child,:host([pfe-c-style=compact]) th:last-child{padding-right:1.14286em}:host([pfe-c-style=compact]) th{border-top-width:2px;padding-top:.85714em}:host([pfe-c-style=compact]) caption{padding-top:1.14286em;border-bottom-width:1px}\n/*# sourceMappingURL=plcc-table.min.css.map */\n</style><div id=\"loading\" hidden>\n <pfe-progress-indicator></pfe-progress-indicator>\n</div>\n<article class=\"product-lifecycle__wrapper\" id=\"product-lifecycle__wrapper--listing\">\n <button class=\"product-lifecycle__close icon-close application\" id=\"close-btn\" aria-label=\"Closes Red Hat OpenStack Platform Table\" hidden>\n <div class=\"icon-close__inner1\"></div>\n </button>\n <h2 class=\"product-lifecycle-info__product-name sr-only\"></h2>\n\n <table border=\"0\" cellspacing=\"0\" cellpadding=\"0\" class=\"product-lifecycle-info__table-headers\" aria-hidden>\n <thead>\n <tr class=\"product-phases\"></tr>\n </thead>\n </table>\n\n <table id=\"product-lifecycle-full-support\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" class=\"product-lifecycle-info__table product-lifecycle-info__table--supported responsive-table responsive-table--row-strategy\">\n <caption>\n <h3 class=\"lifecycle-table__product-name\">\n Full support <span class=\"sr-only\"></span>\n </h3>\n </caption>\n <thead>\n <tr class=\"product-phases\"></tr>\n </thead>\n <tbody></tbody>\n </table>\n\n <table id=\"product-lifecycle-maintenance-support\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" class=\"product-lifecycle-info__table product-lifecycle-info__table--purgatory responsive-table responsive-table--row-strategy\">\n <caption>\n <h3 class=\"lifecycle-table__product-name\">\n Maintenance support <span class=\"sr-only\"></span>\n </h3>\n </caption>\n <thead>\n <tr class=\"product-phases\"></tr>\n </thead>\n <tbody></tbody>\n </table>\n\n <table id=\"product-lifecycle-extended-support\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" class=\"product-lifecycle-info__table product-lifecycle-info__table--purgatory responsive-table responsive-table--row-strategy\">\n <caption>\n <h3 class=\"lifecycle-table__product-name\">\n Extended support <span class=\"sr-only\"></span>\n </h3>\n </caption>\n <thead>\n <tr class=\"product-phases\"></tr>\n </thead>\n <tbody></tbody>\n </table>\n <table id=\"product-lifecycle-end-of-maintenance\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" class=\"product-lifecycle-info__table product-lifecycle-info__table--unsupported responsive-table responsive-table--row-strategy \">\n <caption>\n <h3 class=\"lifecycle-table__product-name\">\n End of maintenance <span class=\"sr-only\"></span>\n </h3>\n </caption>\n <thead>\n <tr class=\"product-phases\"></tr>\n </thead>\n <tbody></tbody>\n </table>\n\n <table id=\"product-lifecycle-end-of-life\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" class=\"product-lifecycle-info__table product-lifecycle-info__table--unsupported responsive-table responsive-table--row-strategy \">\n <caption>\n <h3 class=\"lifecycle-table__product-name\">\n End of life <span class=\"sr-only\"></span>\n </h3>\n </caption>\n <thead>\n <tr class=\"product-phases\"></tr>\n </thead>\n <tbody></tbody>\n </table>\n <table id=\"product-lifecycle-uncategorized\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" class=\"product-lifecycle-info__table product-lifecycle-info__table--uncatagorized responsive-table responsive-table--row-strategy \">\n <caption>\n <h3 class=\"lifecycle-table__product-name\">\n Uncategorized <span class=\"sr-only\"></span>\n </h3>\n </caption>\n <thead>\n <tr class=\"product-phases\"></tr>\n </thead>\n <tbody></tbody>\n </table>\n</article>"; } }, { key: "schemaUrl", get: function get$$1() { return "plcc-table.json"; } }, { key: "templateUrl", get: function get$$1() { return "plcc-table.html"; } }, { key: "styleUrl", get: function get$$1() { return "plcc-table.scss"; } }, { key: "productName", get: function get$$1() { return this.getAttribute("product-name"); } // get type() { // return this.getAttribute("type"); // } }, { key: "hideEOL", get: function get$$1() { return this.getAttribute("hide-eol"); } }, { key: "loading", get: function get$$1() { return this.hasAttribute("loading"); }, set: function set$$1(val) { if (val) { this._loadingIndicator.removeAttribute("hidden"); this._loadingIndicator.classList.add("loading"); this.setAttribute("loading", true); } else { this._loadingIndicator.setAttribute("hidden", true); this._loadingIndicator.classList.remove("loading"); this.removeAttribute("loading"); } } }, { key: "tableData", get: function get$$1() { return this._data; }, set: function set$$1(data) { if (!data) { return; } this.loading = true; this._data = data; var displayHeaders = this._getDisplayHeaders(this._data); var headers = this._getHeaders(this._data); this._construct(this._data, displayHeaders, headers); this.loading = false; } }], [{ key: "version", get: function get$$1() { return "0.0.14"; } }, { key: "properties", get: function get$$1() { return {}; } }, { key: "slots", get: function get$$1() { return { "default": { "title": "Default slot", "type": "array", "namedSlot": false, "items": { "oneOf": [{ "$ref": "raw" }] } } }; } }, { key: "tag", get: function get$$1() { return "plcc-table"; } }, { key: "events", get: function get$$1() { return { close: this.tag + ":close" }; } }, { key: "observedAttributes", get: function get$$1() { return ["product-name", "hide-eol"]; } // Declare the type of this component }, { key: "PfeType", get: function get$$1() { return PFElement.PfeTypes.Component; } }]); function PlccTable() { classCallCheck(this, PlccTable); // this._handleToggle = this._handleToggle.bind(this); var _this = possibleConstructorReturn(this, (PlccTable.__proto__ || Object.getPrototypeOf(PlccTable)).call(this, PlccTable, { type: PlccTable.PfeType })); _this._handleBtnClick = _this._handleBtnClick.bind(_this); _this._data = null; _this._fullSupport = false; _this._maintenanceSupport = false; _this._extendedSupport = false; _this._uncategorized = false; _this._endOfMaintenance = false; _this._endOfLife = false; _this._plccApplication = false; _this._article = _this.shadowRoot.querySelector("article"); _this._header = _this.shadowRoot.querySelector("header"); _this._links = _this.shadowRoot.querySelectorAll("a"); _this._appMarkup = _this.shadowRoot.querySelectorAll(".application"); _this._fullSupportTable = _this.shadowRoot.querySelector("#product-lifecycle-full-support"); _this._maintenanceSupportTable = _this.shadowRoot.querySelector("#product-lifecycle-maintenance-support"); _this._extendedSupportTable = _this.shadowRoot.querySelector("#product-lifecycle-extended-support"); _this._endOfMaintenanceTable = _this.shadowRoot.querySelector("#product-lifecycle-end-of-maintenance"); _this._endOfLifeTable = _this.shadowRoot.querySelector("#product-lifecycle-end-of-life"); _this._uncategorizedTable = _this.shadowRoot.querySelector('#product-lifecycle-uncategorized'); _this._fullSupportBody = _this.shadowRoot.querySelector("#product-lifecycle-full-support tbody"); _this._maintenanceSupportBody = _this.shadowRoot.querySelector("#product-lifecycle-maintenance-support tbody"); _this._extendedSupportBody = _this.shadowRoot.querySelector("#product-lifecycle-extended-support tbody"); _this._endOfMaintenanceBody = _this.shadowRoot.querySelector("#product-lifecycle-end-of-maintenance tbody"); _this._endOfLifeBody = _this.shadowRoot.querySelector("#product-lifecycle-end-of-life tbody"); _this._uncategorizedBody = _this.shadowRoot.querySelector("#product-lifecycle-uncategorized tbody"); _this._caption = _this.shadowRoot.querySelector("caption"); _this._phaseRow = _this.shadowRoot.querySelectorAll(".product-phases"); _this._versionToggleRow = _this.shadowRoot.querySelectorAll("version-toggle-row"); _this._versionToggle = _this.shadowRoot.querySelector("#unsupported-versions"); _this._closeBtn = _this.shadowRoot.querySelector("#close-btn"); _this._loadingIndicator = _this.shadowRoot.querySelector("#loading"); // this._versionToggle.addEventListener("change", this._handleToggle); // this._closeBtn.addEventListener("click", this._handleBtnClick); _this.loading = false; return _this; } createClass(PlccTable, [{ key: "disconnectedCallback", value: function disconnectedCallback() { // this._versionToggle.removeEventListener("change", this._handleToggle); this._closeBtn.removeEventListener("click", this._handleBtnClick); } }, { key: "attributeChangedCallback", value: function attributeChangedCallback(attr, oldValue, newValue) { var _this2 = this; get(PlccTable.prototype.__proto__ || Object.getPrototypeOf(PlccTable.prototype), "attributeChangedCallback", this).call(this, attr, oldValue, newValue); if (attr === "product-name") { this._requestProduct(newValue).then(function (data) { _this2.tableData = data; }).catch(function (err) { console.error(err); }); } if (attr === "hide-eol") { this._handleHideEOL(this.hasAttribute("hide-eol")); } // if (attr === "type") { // if (this.type === "app") { // this._plccApplication = true; // this._article.classList.add("product-lifecycle__wrapper--listing"); // // this._header.classList.replace( // // "product-lifecycle__header--less-info", // // "product-lifecycle__header--more-info" // // ); // this._appMarkup.forEach(item => item.removeAttribute("hidden")); // } else { // this._article.classList.remove("product-lifecycle__wrapper--listing"); // // this._header.classList.replace( // // "product-lifecycle__header--more-info", // // "product-lifecycle__header--less-info" // // ); // this._appMarkup.forEach(item => item.setAttribute("hidden", true)); // } // } } // }, { key: "_requestProduct", value: function _requestProduct(product) { var _this3 = this; this.loading = true; var promise = new Promise(function (resolve, reject) { var xhr = new XMLHttpRequest(); xhr.open("GET", "https://access.redhat.com/product-life-cycles/api/v1/products?name=" + product); xhr.responseType = "json"; xhr.onload = function () { if (xhr.status >= 400) { reject(xhr.response); } else { resolve(xhr.response); } _this3.loading = false; }; xhr.onerror = function (err) { reject(err, "Something went wrong."); _this3.loading = false; }; xhr.send(); }); return promise; } //get products phases for table headers }, { key: "_getDisplayHeaders", value: function _getDisplayHeaders(data) { var displayHeaders = []; data.data[0].all_phases.forEach(function (item) { displayHeaders.push(item.display_name); }); return displayHeaders; } }, { key: "_getHeaders", value: function _getHeaders(data) { var headers = []; data.data[0].all_phases.forEach(function (item) { headers.push(item.name); }); return headers; } //construct table headers and rows based on data and append to html }, { key: "_construct", value: function _construct(data, displayHeaders, headers) { var _this4 = this; var allFullSupportRows = ""; var allMaintenanceSupportRows = ""; var allExtendedSupportRows = ""; var allEndOfLifeRows = ""; var allEndOfMaintenanceRows = ""; var allUncategorizedRows = ""; var allHeaders = '<th scope="col">Version</th>'; var versions = data.data[0].versions; var showMinor = data.data[0].show_last_minor_release; //set product name this.shadowRoot.querySelector(".product-lifecycle-info__product-name").innerText = data.data[0].name; this.shadowRoot.querySelectorAll(".sr-only").forEach(function (item) { return item.innerText = "" + data.data[0].name; }); //create table headers displayHeaders.forEach(function (item) { var theader = "<th scope=\"col\">" + item + "</th>"; allHeaders += theader; }); //check if minor version column should display if (showMinor) { allHeaders += '<th scope="col">Last minor release</th>'; } versions.forEach(function (item, index) { var fullSupportRow = ""; var maintenanceSupportRow = ""; var extendedSupportRow = ""; var endOfLifeRow = ""; var endOfMaintenanceRow = ""; var uncategorizedRow = ""; //if version is tagged latest, create row for full support if (item.type === "Full Support") { _this4._fullSupport = true; fullSupportRow = "\n <tr>\n <th scope=\"row\" data-label=\"Version\">" + item.name + "</th>\n " + item.phases.map(function (phase) { if (headers.includes(phase.name)) { return "<td data-label=\"" + phase.name + "\">" + _this4._parseDate(phase.date, phase.date_format) + "</td>"; } else { return "<td data-label=\"" + phase.name + "\">N/A</td>"; } }).join("") + "\n " + (showMinor ? item.last_minor_release !== null ? '<td data-label="Last minor release">' + item.last_minor_release + "</td>" : '<td data-label="Last minor release">N/A</td>' : "") + "\n </tr>\n "; } //if version is tagged supported, create row for maintenance support if (item.type === "Maintenance Support") { _this4._maintenanceSupport = true; maintenanceSupportRow = "\n <tr>\n <th scope=\"row\" data-label=\"Version\">" + item.name + "</th>\n " + item.phases.map(function (phase) { if (headers.includes(phase.name)) { return "<td data-label=\"" + phase.name + "\">" + _this4._parseDate(phase.date, phase.date_format) + "</td>"; } else { return "<td data-label=\"" + phase.name + "\">N/A</td>"; } }).join("") + "\n " + (showMinor ? item.last_minor_release !== null ? '<td data-label="Last minor release">' + item.last_minor_release + "</td>" : '<td data-label="Last minor release">N/A</td>' : "") + "\n </tr>\n "; } //if version is tagged extended support, create row for extended support if (item.type === "Extended Support") { _this4._extendedSupport = true; extendedSupportRow = "\n <tr>\n <th scope=\"row\" data-label=\"Version\">" + item.name + "</th>\n " + item.phases.map(function (phase) { if (headers.includes(phase.name)) { return "<td data-label=\"" + phase.name + "\">" + _this4._parseDate(phase.date, phase.date_format) + "</td>"; } else { return "<td data-label=\"" + phase.name + "\">N/A</td>"; } }).join("") + "\n " + (showMinor ? item.last_minor_release !== null ? '<td data-label="Last minor release">' + item.last_minor_release + "</td>" : '<td data-label="Last minor release">N/A</td>' : "") + "\n </tr>\n "; } if (item.type === "End of Maintenance") { _this4._endOfMaintenance = true; endOfMaintenanceRow = "\n <tr>\n <th scope=\"row\" data-label=\"Version\">" + item.name + "</th>\n " + item.phases.map(function (phase) { if (headers.includes(phase.name)) { return "<td data-label=\"" + phase.name + "\">" + _this4._parseDate(phase.date, phase.date_format) + "</td>"; } else { return "<td data-label=\"" + phase.name + "\">N/A</td>"; } }).join("") + "\n " + (showMinor ? item.last_minor_release !== null ? '<td data-label="Last minor release">' + item.last_minor_release + "</td>" : '<td data-label="Last minor release">N/A</td>' : "") + "\n </tr>\n "; } //if version is tagged old, create row for end of life if (item.type === "End of life") { _this4._endOfLife = true; endOfLifeRow = "\n <tr>\n <th scope=\"row\" data-label=\"Version\">" + item.name + "</th>\n " + item.phases.map(function (phase) { if (headers.includes(phase.name)) { return "<td data-label=\"" + phase.name + "\">" + _this4._parseDate(phase.date, phase.date_format) + "</td>"; } else { return "<td data-label=\"" + phase.name + "\">N/A</td>"; } }).join("") + "\n " + (showMinor ? item.last_minor_release !== null ? '<td data-label="Last minor release">' + item.last_minor_release + "</td>" : '<td data-label="Last minor release">N/A</td>' : "") + "\n </tr>\n "; } //if version is tagged latest, create row for full support if (item.type === "" || item.type === null) { _this4._uncategorized = true; uncategorizedRow = "\n <tr>\n <th scope=\"row\" data-label=\"Version\">" + item.name + "</th>\n " + item.phases.map(function (phase) { if (headers.includes(phase.name)) { return "<td data-label=\"" + phase.name + "\">" + _this4._parseDate(phase.date, phase.date_format) + "</td>"; } else { return "<td data-label=\"" + phase.name + "\">N/A</td>"; } }).join("") + "\n " + (showMinor ? item.last_minor_release !== null ? '<td data-label="Last minor release">' + item.last_minor_release + "</td>" : '<td data-label="Last minor release">N/A</td>' : "") + "\n </tr>\n "; } allFullSupportRows += fullSupportRow; allMaintenanceSupportRows += maintenanceSupportRow; allExtendedSupportRows += extendedSupportRow; allEndOfLifeRows += endOfLifeRow; allEndOfMaintenanceRows += endOfMaintenanceRow; allUncategorizedRows += uncategorizedRow; }); if (!this._fullSupport) { this._fullSupportTable.setAttribute("hidden", true); } else { this._fullSupportTable.removeAttribute("hidden"); } if (!this._maintenanceSupport) { this._maintenanceSupportTable.setAttribute("hidden", true); } else { this._maintenanceSupportTable.removeAttribute("hidden"); } if (!this._extendedSupport) { this._extendedSupportTable.setAttribute("hidden", true); } else { this._extendedSupportTable.removeAttribute("hidden"); } if (!this._endOfMaintenance) { this._endOfMaintenanceTable.setAttribute("hidden", true); } else { this._endOfMaintenanceTable.removeAttribute("hidden"); } //if there are 0 of type "old" hide the end of life table //if they exist but were in app, hide the table by default (toggle with checkbox) if (!this._endOfLife) { this._endOfLifeTable.setAttribute("hidden", true); // this.shadowRoot.querySelector(".u-no-break").setAttribute("hidden", true); } else if (this._endOfLife && this._plccApplication) { this._endOfLifeTable.setAttribute("hidden", true); } if (!this._uncategorized) { this._uncategorizedTable.setAttribute("hidden", true); } else { this._uncategorizedTable.removeAttribute("hidden"); } //append headers to all <thead>s this._phaseRow.forEach(function (item) { item.innerHTML = allHeaders; }); //append rows to all <tbody>s this._fullSupportBody.innerHTML = allFullSupportRows; this._maintenanceSupportBody.innerHTML = allMaintenanceSupportRows; this._extendedSupportBody.innerHTML = allExtendedSupportRows; this._endOfLifeBody.innerHTML = allEndOfLifeRows; this._endOfMaintenanceBody.innerHTML = allEndOfMaintenanceRows; this._uncategorizedBody.innerHTML = allUncategorizedRows; } //check for valid date }, { key: "_parseDate", value: function _parseDate(date, format) { if (format === 'string') { return date; } else { return "<pfe-datetime datetime=" + date + " day=\"numeric\" month=\"long\" year=\"numeric\" time-zone=\"UTC\"></pfe-datetime>"; } } //handle checkbox event // _handleToggle(event) { // if (!event.target.checked) { // this._endOfLifeTable.setAttribute("hidden", true); // } else { // this._endOfLifeTable.removeAttribute("hidden"); // } // } //handle toggle attr }, { key: "_handleHideEOL", value: function _handleHideEOL(val) { if (val) { this._endOfLifeTable.setAttribute("hidden", true); } else { this._endOfLifeTable.removeAttribute("hidden"); } } //emit close button event }, { key: "_handleBtnClick", value: function _handleBtnClick(event) { this.emitEvent(PlccTable.events.close); } }]); return PlccTable; }(PFElement); PFElement.create(PlccTable); return PlccTable; }))); //# sourceMappingURL=plcc-table.umd.js.map