solid-ui 2.4.14-46ae8b5d → 2.4.14-alpha

package/lib/tabs.js

@@ -1,118 +1,52 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TabWidgetElement = void 0;
-exports.tabWidget = tabWidget;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
-var _wrapNativeSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/wrapNativeSuper"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _widgets = require("./widgets");
-
-var _utils = require("./utils");
-
-var _logic = require("./logic");
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.tabWidget = exports.TabWidgetElement = void 0;
+var widgets_1 = require("./widgets");
+var utils_1 = require("./utils");
+var logic_1 = require("./logic");
 /**
  * @ignore
  */
-var ContainerElement = /*#__PURE__*/function (_HTMLElement) {
-  (0, _inherits2["default"])(ContainerElement, _HTMLElement);
-
-  var _super = _createSuper(ContainerElement);
-
-  function ContainerElement() {
-    var _this;
-
-    (0, _classCallCheck2["default"])(this, ContainerElement);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
+var ContainerElement = /** @class */ (function (_super) {
+    __extends(ContainerElement, _super);
+    function ContainerElement() {
+        return _super !== null && _super.apply(this, arguments) || this;
     }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "asSettings", void 0);
-    return _this;
-  }
-
-  return (0, _createClass2["default"])(ContainerElement);
-}( /*#__PURE__*/(0, _wrapNativeSuper2["default"])(HTMLElement));
-
-var TabWidgetElement = /*#__PURE__*/function (_HTMLElement2) {
-  (0, _inherits2["default"])(TabWidgetElement, _HTMLElement2);
-
-  var _super2 = _createSuper(TabWidgetElement);
-
-  function TabWidgetElement() {
-    var _this2;
-
-    (0, _classCallCheck2["default"])(this, TabWidgetElement);
-
-    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-      args[_key2] = arguments[_key2];
+    return ContainerElement;
+}(HTMLElement));
+var TabWidgetElement = /** @class */ (function (_super) {
+    __extends(TabWidgetElement, _super);
+    function TabWidgetElement() {
+        return _super !== null && _super.apply(this, arguments) || this;
     }
-
-    _this2 = _super2.call.apply(_super2, [this].concat(args));
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this2), "bodyContainer", void 0);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this2), "refresh", void 0);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this2), "tabContainer", void 0);
-    return _this2;
-  }
-
-  return (0, _createClass2["default"])(TabWidgetElement);
-}( /*#__PURE__*/(0, _wrapNativeSuper2["default"])(HTMLElement));
+    return TabWidgetElement;
+}(HTMLElement));
+exports.TabWidgetElement = TabWidgetElement;
 /**
  * @ignore
  */
-
-
-exports.TabWidgetElement = TabWidgetElement;
-
-var TabElement = /*#__PURE__*/function (_HTMLElement3) {
-  (0, _inherits2["default"])(TabElement, _HTMLElement3);
-
-  var _super3 = _createSuper(TabElement);
-
-  function TabElement() {
-    var _this3;
-
-    (0, _classCallCheck2["default"])(this, TabElement);
-
-    for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
-      args[_key3] = arguments[_key3];
+var TabElement = /** @class */ (function (_super) {
+    __extends(TabElement, _super);
+    function TabElement() {
+        return _super !== null && _super.apply(this, arguments) || this;
     }
-
-    _this3 = _super3.call.apply(_super3, [this].concat(args));
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this3), "bodyTR", void 0);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this3), "subject", void 0);
-    return _this3;
-  }
-
-  return (0, _createClass2["default"])(TabElement);
-}( /*#__PURE__*/(0, _wrapNativeSuper2["default"])(HTMLElement));
+    return TabElement;
+}(HTMLElement));
 /**
  * Use this widget to generate tabs from triples set in the global store.
  *
@@ -238,266 +172,225 @@ var TabElement = /*#__PURE__*/function (_HTMLElement3) {
  *
  * @param options
  */
-
-
 function tabWidget(options) {
-  var subject = options.subject;
-  var dom = options.dom || document;
-  var orientation = parseInt(options.orientation || '0');
-  var backgroundColor = options.backgroundColor || '#ddddcc';
-  var flipped = orientation & 2;
-  var vertical = orientation & 1;
-  var onClose = options.onClose;
-
-  var _getColors = getColors(backgroundColor),
-      _getColors2 = (0, _slicedToArray2["default"])(_getColors, 2),
-      selectedColor = _getColors2[0],
-      color = _getColors2[1];
-
-  var bodyMainStyle = "flex: 2; width: auto; height: 100%; border: 0.1em; border-style: solid; border-color: ".concat(selectedColor, "; padding: 1em;");
-  var rootElement = dom.createElement('div'); // 20200117a
-
-  rootElement.setAttribute('style', 'display: flex; height: 100%; width: 100%; flex-direction: ' + (vertical ? 'row' : 'column') + (flipped ? '-reverse;' : ';'));
-  var navElement = rootElement.appendChild(dom.createElement('nav'));
-  navElement.setAttribute('style', 'margin: 0;');
-  var mainElement = rootElement.appendChild(dom.createElement('main'));
-  mainElement.setAttribute('style', 'margin: 0; width:100%; height: 100%;'); // override tabbedtab.css
-
-  var tabContainer = navElement.appendChild(dom.createElement('ul'));
-  tabContainer.setAttribute('style', "\n    list-style-type: none;\n    display: flex;\n    height: 100%;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    flex-direction: ".concat(vertical ? 'column' : 'row', "\n  "));
-  var tabElement = 'li';
-  var bodyContainer = mainElement;
-  rootElement.tabContainer = tabContainer;
-  rootElement.bodyContainer = bodyContainer;
-  var corners = ['0.2em', '0.2em', '0', '0']; // top left, TR, BR, BL
-
-  var cornersPrepped = corners.concat(corners).slice(orientation, orientation + 4);
-  var cornersStyle = "border-radius: ".concat(cornersPrepped.join(' '), ";");
-  var margins = ['0.3em', '0.3em', '0', '0.3em']; // top, right, bottom, left
-
-  var marginsPrepped = margins.concat(margins).slice(orientation, orientation + 4);
-  var marginsStyle = "margin: ".concat(marginsPrepped.join(' '), ";");
-  var paddingStyle = "padding: ".concat(marginsPrepped.join(' '), ";");
-  var tabStyle = cornersStyle + "padding: 0.7em; max-width: 20em; color: ".concat(color, ";");
-  var unselectedStyle = "".concat(tabStyle + marginsStyle, "opacity: 50%; background-color: ").concat(backgroundColor, ";");
-  var selectedStyle = "".concat(tabStyle + marginsStyle, "background-color: ").concat(selectedColor, ";");
-  var shownStyle = 'height: 100%; width: 100%;';
-  var hiddenStyle = shownStyle + 'display: none;';
-  rootElement.refresh = orderedSync;
-  orderedSync();
-
-  if (!options.startEmpty && tabContainer.children.length && options.selectedTab) {
-    var selectedTab = Array.from(tabContainer.children).map(function (tab) {
-      return tab.firstChild;
-    }).find(function (tab) {
-      return tab.dataset.name === options.selectedTab;
-    });
-    var tab = selectedTab || tabContainer.children[0].firstChild;
-    tab.click();
-  } else if (!options.startEmpty) {
-    tabContainer.children[0].firstChild.click(); // Open first tab
-  }
-
-  return rootElement;
-
-  function addCancelButton(tabContainer) {
-    if (tabContainer.dataset.onCloseSet) {
-      // @@ TODO: this is only here to make the browser tests work
-      // Discussion at https://github.com/solid/solid-ui/pull/110#issuecomment-527080663
-      var existingCancelButton = tabContainer.querySelector('.unstyled');
-      tabContainer.removeChild(existingCancelButton);
-    }
-
-    var extraTab = dom.createElement(tabElement);
-    extraTab.classList.add('unstyled');
-    var tabCancelButton = (0, _widgets.cancelButton)(dom, onClose);
-    tabCancelButton.setAttribute('style', tabCancelButton.getAttribute('style') + paddingStyle);
-    extraTab.appendChild(tabCancelButton);
-    tabContainer.appendChild(extraTab);
-    tabContainer.dataset.onCloseSet = 'true';
-  }
-
-  function getItems() {
-    if (options.items) return options.items;
-
-    if (options.ordered !== false) {
-      // options.ordered defaults to true
-      return _logic.store.the(subject, options.predicate).elements;
-    } else {
-      return _logic.store.each(subject, options.predicate);
-    }
-  }
-
-  function makeNewSlot(item) {
-    var ele = dom.createElement(tabElement);
-    ele.subject = item;
-    var div = ele.appendChild(dom.createElement('div'));
-    div.setAttribute('style', unselectedStyle);
-    div.addEventListener('click', function (e) {
-      if (!e.metaKey) {
-        resetTabStyle();
-        resetBodyStyle();
-      }
-
-      div.setAttribute('style', selectedStyle);
-      if (!ele.bodyTR) return;
-      ele.bodyTR.setAttribute('style', shownStyle);
-      var bodyMain = getOrCreateContainerElement(ele);
-
-      if (options.renderTabSettings && e.altKey && ele.subject && bodyMain.asSettings !== true) {
-        bodyMain.innerHTML = 'loading settings ...' + item;
-        options.renderTabSettings(bodyMain, ele.subject);
-        bodyMain.asSettings = true;
-      } else if (options.renderMain && ele.subject && bodyMain.asSettings !== false) {
-        bodyMain.innerHTML = 'loading item ...' + item;
-        options.renderMain(bodyMain, ele.subject);
-        bodyMain.asSettings = false;
-      }
-    });
-
-    if (options.renderTab) {
-      options.renderTab(div, item);
-    } else {
-      div.textContent = (0, _utils.label)(item);
+    var subject = options.subject;
+    var dom = options.dom || document;
+    var orientation = parseInt(options.orientation || '0');
+    var backgroundColor = options.backgroundColor || '#ddddcc';
+    var flipped = orientation & 2;
+    var vertical = orientation & 1;
+    var onClose = options.onClose;
+    var _a = getColors(backgroundColor), selectedColor = _a[0], color = _a[1];
+    var bodyMainStyle = "flex: 2; width: auto; height: 100%; border: 0.1em; border-style: solid; border-color: ".concat(selectedColor, "; padding: 1em;");
+    var rootElement = dom.createElement('div'); // 20200117a
+    rootElement.setAttribute('style', 'display: flex; height: 100%; width: 100%; flex-direction: ' +
+        (vertical ? 'row' : 'column') + (flipped ? '-reverse;' : ';'));
+    var navElement = rootElement.appendChild(dom.createElement('nav'));
+    navElement.setAttribute('style', 'margin: 0;');
+    var mainElement = rootElement.appendChild(dom.createElement('main'));
+    mainElement.setAttribute('style', 'margin: 0; width:100%; height: 100%;'); // override tabbedtab.css
+    var tabContainer = navElement.appendChild(dom.createElement('ul'));
+    tabContainer.setAttribute('style', "\n    list-style-type: none;\n    display: flex;\n    height: 100%;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    flex-direction: ".concat((vertical ? 'column' : 'row'), "\n  "));
+    var tabElement = 'li';
+    var bodyContainer = mainElement;
+    rootElement.tabContainer = tabContainer;
+    rootElement.bodyContainer = bodyContainer;
+    var corners = ['0.2em', '0.2em', '0', '0']; // top left, TR, BR, BL
+    var cornersPrepped = corners.concat(corners).slice(orientation, orientation + 4);
+    var cornersStyle = "border-radius: ".concat(cornersPrepped.join(' '), ";");
+    var margins = ['0.3em', '0.3em', '0', '0.3em']; // top, right, bottom, left
+    var marginsPrepped = margins.concat(margins).slice(orientation, orientation + 4);
+    var marginsStyle = "margin: ".concat(marginsPrepped.join(' '), ";");
+    var paddingStyle = "padding: ".concat(marginsPrepped.join(' '), ";");
+    var tabStyle = cornersStyle + "padding: 0.7em; max-width: 20em; color: ".concat(color, ";");
+    var unselectedStyle = "".concat(tabStyle + marginsStyle, "opacity: 50%; background-color: ").concat(backgroundColor, ";");
+    var selectedStyle = "".concat(tabStyle + marginsStyle, "background-color: ").concat(selectedColor, ";");
+    var shownStyle = 'height: 100%; width: 100%;';
+    var hiddenStyle = shownStyle + 'display: none;';
+    rootElement.refresh = orderedSync;
+    orderedSync();
+    if (!options.startEmpty && tabContainer.children.length && options.selectedTab) {
+        var selectedTab = Array.from(tabContainer.children)
+            .map(function (tab) { return tab.firstChild; })
+            .find(function (tab) { return tab.dataset.name === options.selectedTab; });
+        var tab = selectedTab || tabContainer.children[0].firstChild;
+        tab.click();
     }
-
-    return ele;
-
-    function getOrCreateContainerElement(ele) {
-      var _ele$bodyTR;
-
-      var bodyMain = (_ele$bodyTR = ele.bodyTR) === null || _ele$bodyTR === void 0 ? void 0 : _ele$bodyTR.children[0];
-      if (bodyMain) return bodyMain;
-      var newBodyMain = ele.bodyTR.appendChild(dom.createElement('main'));
-      newBodyMain.setAttribute('style', bodyMainStyle);
-      return newBodyMain;
+    else if (!options.startEmpty) {
+        tabContainer.children[0].firstChild.click(); // Open first tab
     }
-  } // @@ Use common one from utils?
-
-
-  function orderedSync() {
-    var items = getItems();
-    var slot, i, j, left, right;
-    var differ = false; // Find how many match at each end
-
-    for (left = 0; left < tabContainer.children.length; left++) {
-      slot = tabContainer.children[left];
-
-      if (left >= items.length || slot.subject && !slot.subject.sameTerm(items[left])) {
-        differ = true;
-        break;
-      }
+    return rootElement;
+    function addCancelButton(tabContainer) {
+        if (tabContainer.dataset.onCloseSet) {
+            // @@ TODO: this is only here to make the browser tests work
+            // Discussion at https://github.com/solid/solid-ui/pull/110#issuecomment-527080663
+            var existingCancelButton = tabContainer.querySelector('.unstyled');
+            tabContainer.removeChild(existingCancelButton);
+        }
+        var extraTab = dom.createElement(tabElement);
+        extraTab.classList.add('unstyled');
+        var tabCancelButton = (0, widgets_1.cancelButton)(dom, onClose);
+        tabCancelButton.setAttribute('style', tabCancelButton.getAttribute('style') + paddingStyle);
+        extraTab.appendChild(tabCancelButton);
+        tabContainer.appendChild(extraTab);
+        tabContainer.dataset.onCloseSet = 'true';
     }
-
-    if (!differ && items.length === tabContainer.children.length) {
-      return; // The two just match in order: a case to optimize for
+    function getItems() {
+        if (options.items)
+            return options.items;
+        if (options.ordered !== false) {
+            // options.ordered defaults to true
+            return logic_1.store.the(subject, options.predicate).elements;
+        }
+        else {
+            return logic_1.store.each(subject, options.predicate);
+        }
     }
-
-    for (right = tabContainer.children.length - 1; right >= 0; right--) {
-      slot = tabContainer.children[right];
-      j = right - tabContainer.children.length + items.length;
-
-      if (slot.subject && !slot.subject.sameTerm(items[j])) {
-        break;
-      }
-    } // The elements left ... right in tabContainer.children do not match
-
-
-    var insertables = items.slice(left, right - tabContainer.children.length + items.length + 1);
-
-    while (right >= left) {
-      // remove extra
-      tabContainer.removeChild(tabContainer.children[left]);
-      bodyContainer.removeChild(bodyContainer.children[left]);
-      right -= 1;
+    function makeNewSlot(item) {
+        var ele = dom.createElement(tabElement);
+        ele.subject = item;
+        var div = ele.appendChild(dom.createElement('div'));
+        div.setAttribute('style', unselectedStyle);
+        div.addEventListener('click', function (e) {
+            if (!e.metaKey) {
+                resetTabStyle();
+                resetBodyStyle();
+            }
+            div.setAttribute('style', selectedStyle);
+            if (!ele.bodyTR)
+                return;
+            ele.bodyTR.setAttribute('style', shownStyle);
+            var bodyMain = getOrCreateContainerElement(ele);
+            if (options.renderTabSettings && e.altKey && ele.subject && bodyMain.asSettings !== true) {
+                bodyMain.innerHTML = 'loading settings ...' + item;
+                options.renderTabSettings(bodyMain, ele.subject);
+                bodyMain.asSettings = true;
+            }
+            else if (options.renderMain && ele.subject && bodyMain.asSettings !== false) {
+                bodyMain.innerHTML = 'loading item ...' + item;
+                options.renderMain(bodyMain, ele.subject);
+                bodyMain.asSettings = false;
+            }
+        });
+        if (options.renderTab) {
+            options.renderTab(div, item);
+        }
+        else {
+            div.textContent = (0, utils_1.label)(item);
+        }
+        return ele;
+        function getOrCreateContainerElement(ele) {
+            var _a;
+            var bodyMain = (_a = ele.bodyTR) === null || _a === void 0 ? void 0 : _a.children[0];
+            if (bodyMain)
+                return bodyMain;
+            var newBodyMain = ele.bodyTR.appendChild(dom.createElement('main'));
+            newBodyMain.setAttribute('style', bodyMainStyle);
+            return newBodyMain;
+        }
     }
-
-    for (i = 0; i < insertables.length; i++) {
-      var newSlot = makeNewSlot(insertables[i]);
-      var newBodyDiv = dom.createElement('div');
-      newSlot.bodyTR = newBodyDiv;
-
-      if (left === tabContainer.children.length) {
-        // None left of original on right
-        tabContainer.appendChild(newSlot);
-        bodyContainer.appendChild(newBodyDiv);
-      } else {
-        tabContainer.insertBefore(newSlot, tabContainer.children[left + i]);
-        bodyContainer.insertBefore(newBodyDiv, bodyContainer.children[left + i]);
-      }
+    // @@ Use common one from utils?
+    function orderedSync() {
+        var items = getItems();
+        var slot, i, j, left, right;
+        var differ = false;
+        // Find how many match at each end
+        for (left = 0; left < tabContainer.children.length; left++) {
+            slot = tabContainer.children[left];
+            if (left >= items.length ||
+                (slot.subject && !slot.subject.sameTerm(items[left]))) {
+                differ = true;
+                break;
+            }
+        }
+        if (!differ && items.length === tabContainer.children.length) {
+            return; // The two just match in order: a case to optimize for
+        }
+        for (right = tabContainer.children.length - 1; right >= 0; right--) {
+            slot = tabContainer.children[right];
+            j = right - tabContainer.children.length + items.length;
+            if (slot.subject && !slot.subject.sameTerm(items[j])) {
+                break;
+            }
+        }
+        // The elements left ... right in tabContainer.children do not match
+        var insertables = items.slice(left, right - tabContainer.children.length + items.length + 1);
+        while (right >= left) {
+            // remove extra
+            tabContainer.removeChild(tabContainer.children[left]);
+            bodyContainer.removeChild(bodyContainer.children[left]);
+            right -= 1;
+        }
+        for (i = 0; i < insertables.length; i++) {
+            var newSlot = makeNewSlot(insertables[i]);
+            var newBodyDiv = dom.createElement('div');
+            newSlot.bodyTR = newBodyDiv;
+            if (left === tabContainer.children.length) {
+                // None left of original on right
+                tabContainer.appendChild(newSlot);
+                bodyContainer.appendChild(newBodyDiv);
+            }
+            else {
+                tabContainer.insertBefore(newSlot, tabContainer.children[left + i]);
+                bodyContainer.insertBefore(newBodyDiv, bodyContainer.children[left + i]);
+            }
+        }
+        if (onClose) {
+            addCancelButton(tabContainer);
+        }
     }
-
-    if (onClose) {
-      addCancelButton(tabContainer);
+    function resetTabStyle() {
+        for (var i = 0; i < tabContainer.children.length; i++) {
+            var tab = tabContainer.children[i];
+            if (tab.classList.contains('unstyled')) {
+                continue;
+            }
+            if (tab.children[0]) {
+                tab.children[0].setAttribute('style', unselectedStyle);
+            }
+        }
     }
-  }
-
-  function resetTabStyle() {
-    for (var i = 0; i < tabContainer.children.length; i++) {
-      var _tab = tabContainer.children[i];
-
-      if (_tab.classList.contains('unstyled')) {
-        continue;
-      }
-
-      if (_tab.children[0]) {
-        _tab.children[0].setAttribute('style', unselectedStyle);
-      }
+    function resetBodyStyle() {
+        for (var i = 0; i < bodyContainer.children.length; i++) {
+            bodyContainer.children[i].setAttribute('style', hiddenStyle);
+        }
     }
-  }
-
-  function resetBodyStyle() {
-    for (var i = 0; i < bodyContainer.children.length; i++) {
-      bodyContainer.children[i].setAttribute('style', hiddenStyle);
-    }
-  }
 }
+exports.tabWidget = tabWidget;
 /**
  * @internal
  */
-
-
 function getColors(backgroundColor) {
-  return isLight(backgroundColor) ? [colorBlend(backgroundColor, '#ffffff', 0.3), '#000000'] : [colorBlend(backgroundColor, '#000000', 0.3), '#ffffff'];
+    return isLight(backgroundColor)
+        ? [colorBlend(backgroundColor, '#ffffff', 0.3), '#000000']
+        : [colorBlend(backgroundColor, '#000000', 0.3), '#ffffff'];
 }
 /**
  * @internal
  */
-
-
 function colorBlend(a, b, mix) {
-  var ca, cb, res;
-  var str = '#';
-  var hex = '0123456789abcdef';
-
-  for (var i = 0; i < 3; i++) {
-    ca = parseInt(a.slice(i * 2 + 1, i * 2 + 3), 16);
-    cb = parseInt(b.slice(i * 2 + 1, i * 2 + 3), 16);
-    res = ca * (1.0 - mix) + cb * mix; // @@@ rounding
-
-    var res2 = parseInt(('' + res).split('.')[0]); // @@ ugh
-
-    var h = parseInt(('' + res2 / 16).split('.')[0]); // @@ ugh
-
-    var l = parseInt(('' + res2 % 16).split('.')[0]); // @@ ugh
-
-    str += hex[h] + hex[l];
-  }
-
-  return str;
+    var ca, cb, res;
+    var str = '#';
+    var hex = '0123456789abcdef';
+    for (var i = 0; i < 3; i++) {
+        ca = parseInt(a.slice(i * 2 + 1, i * 2 + 3), 16);
+        cb = parseInt(b.slice(i * 2 + 1, i * 2 + 3), 16);
+        res = ca * (1.0 - mix) + cb * mix; // @@@ rounding
+        var res2 = parseInt(('' + res).split('.')[0]); // @@ ugh
+        var h = parseInt(('' + res2 / 16).split('.')[0]); // @@ ugh
+        var l = parseInt(('' + (res2 % 16)).split('.')[0]); // @@ ugh
+        str += hex[h] + hex[l];
+    }
+    return str;
 }
 /**
  * @internal
  */
-
-
 function isLight(x) {
-  var total = 0;
-
-  for (var i = 0; i < 3; i++) {
-    total += parseInt(x.slice(i * 2 + 1, i * 2 + 3), 16);
-  }
-
-  return total > 128 * 3;
+    var total = 0;
+    for (var i = 0; i < 3; i++) {
+        total += parseInt(x.slice(i * 2 + 1, i * 2 + 3), 16);
+    }
+    return total > 128 * 3;
 }
 //# sourceMappingURL=tabs.js.map