@rabbitio/ui-kit 1.0.0-beta.9 → 1.0.0-beta.91

package/coverage/sorter.js

@@ -0,0 +1,196 @@
+/* eslint-disable */
+var addSorting = (function() {
+    'use strict';
+    var cols,
+        currentSort = {
+            index: 0,
+            desc: false
+        };
+
+    // returns the summary table element
+    function getTable() {
+        return document.querySelector('.coverage-summary');
+    }
+    // returns the thead element of the summary table
+    function getTableHeader() {
+        return getTable().querySelector('thead tr');
+    }
+    // returns the tbody element of the summary table
+    function getTableBody() {
+        return getTable().querySelector('tbody');
+    }
+    // returns the th element for nth column
+    function getNthColumn(n) {
+        return getTableHeader().querySelectorAll('th')[n];
+    }
+
+    function onFilterInput() {
+        const searchValue = document.getElementById('fileSearch').value;
+        const rows = document.getElementsByTagName('tbody')[0].children;
+        for (let i = 0; i < rows.length; i++) {
+            const row = rows[i];
+            if (
+                row.textContent
+                    .toLowerCase()
+                    .includes(searchValue.toLowerCase())
+            ) {
+                row.style.display = '';
+            } else {
+                row.style.display = 'none';
+            }
+        }
+    }
+
+    // loads the search box
+    function addSearchBox() {
+        var template = document.getElementById('filterTemplate');
+        var templateClone = template.content.cloneNode(true);
+        templateClone.getElementById('fileSearch').oninput = onFilterInput;
+        template.parentElement.appendChild(templateClone);
+    }
+
+    // loads all columns
+    function loadColumns() {
+        var colNodes = getTableHeader().querySelectorAll('th'),
+            colNode,
+            cols = [],
+            col,
+            i;
+
+        for (i = 0; i < colNodes.length; i += 1) {
+            colNode = colNodes[i];
+            col = {
+                key: colNode.getAttribute('data-col'),
+                sortable: !colNode.getAttribute('data-nosort'),
+                type: colNode.getAttribute('data-type') || 'string'
+            };
+            cols.push(col);
+            if (col.sortable) {
+                col.defaultDescSort = col.type === 'number';
+                colNode.innerHTML =
+                    colNode.innerHTML + '<span class="sorter"></span>';
+            }
+        }
+        return cols;
+    }
+    // attaches a data attribute to every tr element with an object
+    // of data values keyed by column name
+    function loadRowData(tableRow) {
+        var tableCols = tableRow.querySelectorAll('td'),
+            colNode,
+            col,
+            data = {},
+            i,
+            val;
+        for (i = 0; i < tableCols.length; i += 1) {
+            colNode = tableCols[i];
+            col = cols[i];
+            val = colNode.getAttribute('data-value');
+            if (col.type === 'number') {
+                val = Number(val);
+            }
+            data[col.key] = val;
+        }
+        return data;
+    }
+    // loads all row data
+    function loadData() {
+        var rows = getTableBody().querySelectorAll('tr'),
+            i;
+
+        for (i = 0; i < rows.length; i += 1) {
+            rows[i].data = loadRowData(rows[i]);
+        }
+    }
+    // sorts the table using the data for the ith column
+    function sortByIndex(index, desc) {
+        var key = cols[index].key,
+            sorter = function(a, b) {
+                a = a.data[key];
+                b = b.data[key];
+                return a < b ? -1 : a > b ? 1 : 0;
+            },
+            finalSorter = sorter,
+            tableBody = document.querySelector('.coverage-summary tbody'),
+            rowNodes = tableBody.querySelectorAll('tr'),
+            rows = [],
+            i;
+
+        if (desc) {
+            finalSorter = function(a, b) {
+                return -1 * sorter(a, b);
+            };
+        }
+
+        for (i = 0; i < rowNodes.length; i += 1) {
+            rows.push(rowNodes[i]);
+            tableBody.removeChild(rowNodes[i]);
+        }
+
+        rows.sort(finalSorter);
+
+        for (i = 0; i < rows.length; i += 1) {
+            tableBody.appendChild(rows[i]);
+        }
+    }
+    // removes sort indicators for current column being sorted
+    function removeSortIndicators() {
+        var col = getNthColumn(currentSort.index),
+            cls = col.className;
+
+        cls = cls.replace(/ sorted$/, '').replace(/ sorted-desc$/, '');
+        col.className = cls;
+    }
+    // adds sort indicators for current column being sorted
+    function addSortIndicators() {
+        getNthColumn(currentSort.index).className += currentSort.desc
+            ? ' sorted-desc'
+            : ' sorted';
+    }
+    // adds event listeners for all sorter widgets
+    function enableUI() {
+        var i,
+            el,
+            ithSorter = function ithSorter(i) {
+                var col = cols[i];
+
+                return function() {
+                    var desc = col.defaultDescSort;
+
+                    if (currentSort.index === i) {
+                        desc = !currentSort.desc;
+                    }
+                    sortByIndex(i, desc);
+                    removeSortIndicators();
+                    currentSort.index = i;
+                    currentSort.desc = desc;
+                    addSortIndicators();
+                };
+            };
+        for (i = 0; i < cols.length; i += 1) {
+            if (cols[i].sortable) {
+                // add the click event handler on the th so users
+                // dont have to click on those tiny arrows
+                el = getNthColumn(i).querySelector('.sorter').parentElement;
+                if (el.addEventListener) {
+                    el.addEventListener('click', ithSorter(i));
+                } else {
+                    el.attachEvent('onclick', ithSorter(i));
+                }
+            }
+        }
+    }
+    // adds sorting functionality to the UI
+    return function() {
+        if (!getTable()) {
+            return;
+        }
+        cols = loadColumns();
+        loadData();
+        addSearchBox();
+        addSortIndicators();
+        enableUI();
+    };
+})();
+
+window.addEventListener('load', addSorting);

package/dist/global.css

@@ -0,0 +1,197 @@
+.container {
+  padding: 50px;
+}
+@media (max-width: 575.98px) {
+  .container {
+    padding: 20px;
+  }
+}
+
+.container {
+  max-width: 1260px;
+  margin: 0 auto;
+}
+
+.background-shine {
+  position: absolute;
+  left: -165px;
+  top: -300px;
+  z-index: -1;
+}
+@media (max-width: 575.98px) {
+  .background-shine {
+    left: -165px;
+    top: -103px;
+    width: 648px;
+  }
+}
+
+.path {
+  width: 100%;
+  height: 1px;
+  background: rgba(255, 255, 255, 0.2);
+}
+
+.line {
+  width: 100%;
+  height: 1px;
+  border-bottom: 0.5px solid #e0e2eb;
+}
+
+.skeleton {
+  background: #f1f5f7;
+  animation: skeleton-animate 1s 1s infinite ease-in-out;
+}
+
+.skeleton-dark {
+  background: #d3d5d9;
+  animation: skeleton-dark-animate 1s 1s infinite ease-in-out;
+}
+
+.skeleton-transparent {
+  background: rgba(255, 255, 255, 0.2);
+  animation: skeleton-transparent-animate 1s 1s infinite ease-in-out;
+}
+
+.semi-transparent {
+  opacity: 0.5;
+}
+
+@keyframes skeleton-animate {
+  0% {
+    background: #eaeaea;
+  }
+  50% {
+    background: #f1f5f7;
+  }
+  100% {
+    background: #eaeaea;
+  }
+}
+@keyframes skeleton-dark-animate {
+  0% {
+    background: #d3d5d9;
+  }
+  50% {
+    background: #e9eaec;
+  }
+  100% {
+    background: #d3d5d9;
+  }
+}
+@keyframes skeleton-transparent-animate {
+  0% {
+    background: rgba(255, 255, 255, 0.2);
+  }
+  50% {
+    background: rgba(255, 255, 255, 0.1);
+  }
+  100% {
+    background: rgba(255, 255, 255, 0.2);
+  }
+}
+a {
+  text-decoration: none;
+}
+
+td {
+  padding: 0;
+}
+
+/* Chrome, Safari, Edge, Opera */
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+/* Firefox */
+input[type=number] {
+  -moz-appearance: textfield;
+}
+
+textarea {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+* {
+  outline: none !important;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+html {
+  background-color: #232d42;
+}
+
+body {
+  margin: 0;
+  width: 100%;
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+
+h1 {
+  font-size: 40px;
+  line-height: 50px;
+  letter-spacing: 0.5px;
+  font-weight: 900;
+  margin: 0;
+  color: #232d42;
+}
+
+h2 {
+  font-size: 35px;
+  line-height: 45px;
+  letter-spacing: 0.5px;
+  font-weight: 900;
+  margin: 0;
+  color: #232d42;
+}
+
+h3 {
+  font-size: 30px;
+  line-height: 40px;
+  letter-spacing: 0.5px;
+  font-weight: 900;
+  margin: 0;
+  color: #232d42;
+}
+
+h4 {
+  font-size: 25px;
+  line-height: 35px;
+  letter-spacing: 0.5px;
+  margin: 0;
+  color: #232d42;
+}
+
+h5 {
+  font-size: 20px;
+  line-height: 30px;
+  letter-spacing: 0.5px;
+  margin: 0;
+  font-weight: 400;
+  color: #232d42;
+}
+
+h6 {
+  font-size: 16px;
+  line-height: 26px;
+  letter-spacing: 0.5px;
+  margin: 0;
+  font-weight: 400;
+  color: #232d42;
+}
+
+p {
+  font-size: 14px;
+  line-height: 24px;
+  letter-spacing: 0.5px;
+  margin: 0;
+  color: #232d42;
+}
+
+/*# sourceMappingURL=global.css.map */

package/dist/global.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../src/ui-kit/assets/styles/_placeholder.scss","../src/ui-kit/assets/styles/global.scss","../src/ui-kit/assets/styles/_mixins.scss","../src/ui-kit/assets/styles/_variables.scss"],"names":[],"mappings":"AAGA;EACI;;AAEA;EAHJ;IAIQ;;;;ACMR;EACI;EACA;;;AAIJ;EACI;EACA;EACA;EACA;;AAEA;EANJ;IAOQ;IACA;IACA;;;;AAIR;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;;;AAGJ;EACI;IACI;;EAEJ;IACI;;EAEJ;IACI;;;AAIR;EACI;IACI;;EAEJ;IACI;;EAEJ;IACI;;;AAIR;EACI;IACI;;EAEJ;IACI;;EAEJ;IACI;;;AAMR;EACI;;;AAGJ;EACI;;;AAGJ;AACA;AAAA;EAEI;EACA;;;AAGJ;AACA;EACI;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EC3IQ;EACA;EACA,gBCqCQ;EDpCR,aC6BK;ED5BL;EACA;;;AD0IR;ECvIQ;EACA;EACA,gBC6BQ;ED5BR,aCqBK;EDpBL;EACA;;;ADsIR;ECnIQ;EACA;EACA,gBCqBQ;EDpBR,aCaK;EDZL;EACA;;;ADkIR;EC/HQ;EACA;EACA,gBCaQ;EDZR;EACA;;;AD+HR;EC5HQ;EACA;EACA,gBCMQ;EDLR;EACA,aCCC;EDAD;;;AD2HR;ECxHQ;EACA;EACA,gBCFQ;EDGR;EACA,aCPC;EDQD;;;ADuHR;ECpHQ;EACA;EACA,gBCVQ;EDWR;EACA","file":"global.css"}