@elastic/eui 70.0.0 → 70.2.0

package/test-env/components/tabs/tabs.styles.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.euiTabsStyles = void 0;
+
+var _react = require("@emotion/react");
+
+var _global_styling = require("../../global_styling");
+
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+var euiTabsStyles = function euiTabsStyles(euiThemeContext) {
+  var euiTheme = euiThemeContext.euiTheme;
+  return {
+    euiTabs: /*#__PURE__*/(0, _react.css)("display:flex;", (0, _global_styling.logicalCSS)('max-width', '100%'), ";", (0, _global_styling.logicalCSSWithFallback)('overflow-x', 'auto'), ";", (0, _global_styling.logicalCSSWithFallback)('overflow-y', 'hidden'), ";position:relative;flex-shrink:0;;label:euiTabs;"),
+    bottomBorder: /*#__PURE__*/(0, _react.css)("box-shadow:inset 0 -", euiTheme.border.width.thin, " 0 ", euiTheme.border.color, ";;label:bottomBorder;"),
+    // sizes
+    s: /*#__PURE__*/(0, _react.css)("gap:", euiTheme.size.m, ";;label:s;"),
+    m: /*#__PURE__*/(0, _react.css)("gap:", euiTheme.size.base, ";;label:m;"),
+    l: /*#__PURE__*/(0, _react.css)("gap:", euiTheme.size.l, ";;label:l;"),
+    xl: /*#__PURE__*/(0, _react.css)("gap:", euiTheme.size.xl, ";;label:xl;")
+  };
+};
+
+exports.euiTabsStyles = euiTabsStyles;

package/test-env/services/string/to_initials.js

@@ -32,7 +32,7 @@ exports.MAX_INITIALS = MAX_INITIALS;
 
 function toInitials(name, initialsLength, initials) {
   // Calculate the number of initials to show, maxing out at MAX_INITIALS
-  var calculatedInitialsLength = initials ? initials.split(' ').length : name.split(' ').length;
+  var calculatedInitialsLength = initials ? initials.split('').length : name.split(' ').length;
   calculatedInitialsLength = calculatedInitialsLength > MAX_INITIALS ? MAX_INITIALS : calculatedInitialsLength; // Check if initialsLength was passed and set to calculated, unless greater than MAX_INITIALS
 
   if (initialsLength) {

package/src/components/tabs/_index.scss

@@ -1 +0,0 @@
-@import 'tabs';

package/src/components/tabs/_tabs.scss

@@ -1,110 +0,0 @@
-.euiTabs {
-  @include euiScrollBar;
-  display: flex;
-  max-width: 100%;
-  overflow-x: auto;
-  overflow-y: hidden; // don't scroll vertically when scrolling horizontally
-  position: relative;
-  flex-shrink: 0; // don't ever let this shrink in height if direct descendent of flex
-
-  &--bottomBorder {
-    box-shadow: inset 0 ($euiBorderWidthThin * -1) 0 $euiBorderColor;
-  }
-
-  // Changing height of scrollbar so it sits flush with border
-  // sass-lint:disable no-vendor-prefixes
-  &::-webkit-scrollbar {
-    height: 2px;
-  }
-}
-
-.euiTab {
-  color: $euiTextColor;
-  padding: $euiSizeM $euiSize;
-  cursor: pointer;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-
-  .euiTab__content {
-    @include euiTextTruncate;
-    @include euiFontSize;
-    color: $euiTextColor;
-    line-height: $euiLineHeight;
-    display: block;
-  }
-
-  &:not(.euiTab-isDisabled):hover .euiTab__content,
-  &:not(.euiTab-isDisabled):focus .euiTab__content {
-    text-decoration: underline;
-  }
-
-  &:focus {
-    background-color: $euiFocusBackgroundColor;
-    outline-offset: -$euiFocusRingSize;
-  }
-
-  &.euiTab-isSelected {
-    box-shadow: inset 0 ($euiBorderWidthThick * -1) 0 $euiColorPrimaryText;
-
-    &,
-    .euiTab__content {
-      color: $euiColorPrimaryText !important; // sass-lint:disable-line no-important
-    }
-  }
-
-  &.euiTab-isDisabled {
-    &,
-    .euiTab__content {
-      color: $euiColorDisabledText !important; // sass-lint:disable-line no-important
-    }
-
-    &:hover {
-      cursor: not-allowed;
-    }
-
-    &.euiTab-isSelected {
-      box-shadow: inset 0 ($euiBorderWidthThick * -1) 0 $euiColorDisabledText;
-    }
-  }
-
-  // Sizes
-
-  .euiTabs--small & {
-    padding: $euiSizeS;
-
-    .euiTab__content {
-      @include euiFontSizeS;
-    }
-  }
-
-  .euiTabs--large & {
-    padding: $euiSizeM $euiSize;
-  }
-
-  .euiTabs--xlarge & {
-    padding: $euiSizeS $euiSizeL;
-    line-height: $euiSize * 4.5;
-    height: $euiSize * 4.5;
-
-    .euiTab__content {
-      @include euiFontSizeL;
-    }
-  }
-
-  // Expand Tabs Group Modifier
-
-  .euiTabs--expand & {
-    flex-basis: 0%;
-    flex-grow: 1;
-    justify-content: center;
-  }
-}
-
-.euiTab__prepend {
-  margin-right: $euiSizeS;
-}
-
-.euiTab__append {
-  margin-left: $euiSizeS;
-}

package/src/themes/amsterdam/overrides/_tabs.scss

@@ -1,80 +0,0 @@
-// Fixed heights ensure proper alignment with pixel grid
-
-// MEDIUM
-.euiTab,
-.euiTabs--condensed .euiTab {
-  padding: 0 $euiSizeXS;
-
-  .euiTab__content {
-    @include euiTitle('xxs');
-    line-height: $euiSizeXXL;
-  }
-
-  & + .euiTab {
-    margin-left: $euiSize;
-  }
-
-  &:focus {
-    background-color: transparent;
-  }
-}
-
-.euiTabs,
-.euiTabs--condensed.euiTabs {
-  // SMALL
-  &--small .euiTab {
-    padding: 0 $euiSizeXS;
-
-    .euiTab__content {
-      @include euiTitle('xxxs');
-      line-height: $euiSizeXL;
-    }
-
-    & + .euiTab {
-      margin-left: $euiSizeM;
-    }
-  }
-
-  // LARGE
-  &--large .euiTab {
-    padding: 0 $euiSizeXS;
-
-    .euiTab__content {
-      @include euiTitle('xs');
-      line-height: $euiSizeXXL + $euiSizeS;
-    }
-
-    & + .euiTab {
-      margin-left: $euiSizeL;
-    }
-  }
-
-  // X-LARGE
-  &--xlarge .euiTab {
-    padding: 0 $euiSizeXS;
-
-    .euiTab__content {
-      @include fontSize($euiSize + $euiSizeXS);
-      line-height: $euiSizeXXL + $euiSizeS;
-    }
-
-    & + .euiTab {
-      margin-left: $euiSizeXL;
-    }
-  }
-
-  // SELECTED
-  .euiTab-isSelected {
-    color: $euiColorPrimaryText;
-
-    &:hover,
-    &:focus {
-      text-decoration: underline;
-      cursor: pointer;
-    }
-
-    &:focus-visible {
-      box-shadow: none;
-    }
-  }
-}