solid-ui 2.4.14-alpha → 2.4.14-bbf45639-aade069c

package/lib/tabs.js

@@ -1,52 +1,118 @@
 "use strict";
-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");
+
+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; } }
+
 /**
  * @ignore
  */
-var ContainerElement = /** @class */ (function (_super) {
-    __extends(ContainerElement, _super);
-    function ContainerElement() {
-        return _super !== null && _super.apply(this, arguments) || this;
+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];
     }
-    return ContainerElement;
-}(HTMLElement));
-var TabWidgetElement = /** @class */ (function (_super) {
-    __extends(TabWidgetElement, _super);
-    function TabWidgetElement() {
-        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 TabWidgetElement;
-}(HTMLElement));
-exports.TabWidgetElement = TabWidgetElement;
+
+    _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));
 /**
  * @ignore
  */
-var TabElement = /** @class */ (function (_super) {
-    __extends(TabElement, _super);
-    function TabElement() {
-        return _super !== null && _super.apply(this, arguments) || this;
+
+
+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];
     }
-    return TabElement;
-}(HTMLElement));
+
+    _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));
 /**
  * Use this widget to generate tabs from triples set in the global store.
  *
@@ -172,225 +238,266 @@ var TabElement = /** @class */ (function (_super) {
  *
  * @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 _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();
+  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);
     }
-    else if (!options.startEmpty) {
-        tabContainer.children[0].firstChild.click(); // Open first tab
+
+    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;
     }
-    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';
+  } // @@ 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;
+      }
     }
-    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);
-        }
+
+    if (!differ && items.length === tabContainer.children.length) {
+      return; // The two just match in order: a case to optimize for
     }
-    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 (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;
     }
-    // @@ 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);
-        }
+
+    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]);
+      }
     }
-    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);
-            }
-        }
+
+    if (onClose) {
+      addCancelButton(tabContainer);
     }
-    function resetBodyStyle() {
-        for (var i = 0; i < bodyContainer.children.length; i++) {
-            bodyContainer.children[i].setAttribute('style', hiddenStyle);
-        }
+  }
+
+  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);
+    }
+  }
 }
-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