@elastic/eui 87.1.0 → 88.0.0

package/dist/eui_theme_dark.css

@@ -6217,131 +6217,6 @@ The following files still use the Sass version:
   resize: none;
 }
 
-/**
- * 1. If this class is applied to a button, we need to override the Chrome default font.
- * 2. If it has a BetaBadge, make sure only the first letter shows
- */
-.euiKeyPadMenuItem {
-  font-family: "Inter UI", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  font-weight: 400;
-  letter-spacing: normal;
-  -webkit-text-size-adjust: 100%;
-  -ms-text-size-adjust: 100%;
-  -webkit-font-kerning: normal;
-          font-kerning: normal;
-  /* 1 */
-  display: block;
-  padding: 4px;
-  height: 96px;
-  width: 96px;
-  border: 1px solid #343741;
-  border-color: transparent;
-  border-radius: 6px;
-  color: #DFE5EF;
-}
-@media screen and (prefers-reduced-motion: no-preference) {
-  .euiKeyPadMenuItem {
-    transition: background-color 150ms ease-in, border-color 150ms ease-in, box-shadow 150ms ease-in;
-  }
-}
-.euiKeyPadMenuItem:not(.euiKeyPadMenuItem-isDisabled):hover, .euiKeyPadMenuItem:not(.euiKeyPadMenuItem-isDisabled):focus, .euiKeyPadMenuItem:not(.euiKeyPadMenuItem-isDisabled):focus-within {
-  cursor: pointer;
-  text-decoration: underline;
-  box-shadow: 0 0.8px 0.8px rgba(0, 0, 0, 0.1), 0 2.3px 2px rgba(0, 0, 0, 0.075);
-  border-color: #343741;
-}
-@media screen and (prefers-reduced-motion: no-preference) {
-  .euiKeyPadMenuItem:not(.euiKeyPadMenuItem-isDisabled):hover .euiKeyPadMenuItem__icon, .euiKeyPadMenuItem:not(.euiKeyPadMenuItem-isDisabled):focus .euiKeyPadMenuItem__icon, .euiKeyPadMenuItem:not(.euiKeyPadMenuItem-isDisabled):focus-within .euiKeyPadMenuItem__icon {
-    -webkit-transform: translateY(0);
-            transform: translateY(0);
-  }
-}
-.euiKeyPadMenuItem:not(.euiKeyPadMenuItem-isDisabled):focus {
-  cursor: pointer;
-  text-decoration: underline;
-  background-color: rgba(54, 162, 239, 0.2);
-}
-.euiKeyPadMenuItem.euiKeyPadMenuItem-isDisabled {
-  cursor: not-allowed;
-  text-decoration: none;
-  color: #515761;
-}
-.euiKeyPadMenuItem.euiKeyPadMenuItem-isDisabled .euiKeyPadMenuItem__icon {
-  -webkit-filter: grayscale(100%);
-          filter: grayscale(100%);
-}
-.euiKeyPadMenuItem.euiKeyPadMenuItem-isDisabled .euiKeyPadMenuItem__icon svg * {
-  fill: #515761;
-}
-.euiKeyPadMenuItem.euiKeyPadMenuItem-isSelected:not(.euiKeyPadMenuItem-isDisabled) {
-  box-shadow: 0 0.8px 0.8px rgba(0, 0, 0, 0.1), 0 2.3px 2px rgba(0, 0, 0, 0.075);
-  color: #DFE5EF;
-}
-.euiKeyPadMenuItem.euiKeyPadMenuItem-isSelected {
-  border-color: #343741;
-}
-.euiKeyPadMenuItem:not(:hover):not(:focus):not(:focus-within):not(.euiKeyPadMenuItem-isSelected) .euiKeyPadMenuItem__checkableInput, .euiKeyPadMenuItem.euiKeyPadMenuItem-isDisabled:not(.euiKeyPadMenuItem-isSelected) .euiKeyPadMenuItem__checkableInput {
-  position: absolute;
-  top: auto;
-  left: -10000px;
-  width: 1px;
-  height: 1px;
-  clip: rect(0 0 0 0);
-  -webkit-clip-path: inset(50%);
-          clip-path: inset(50%);
-  overflow: hidden;
-  margin: -1px;
-}
-
-.euiKeyPadMenuItem__inner {
-  width: 100%;
-  height: 100%;
-  display: -webkit-flex;
-  display: flex;
-  -webkit-flex-direction: column;
-          flex-direction: column;
-  -webkit-align-items: center;
-          align-items: center;
-  -webkit-justify-content: center;
-          justify-content: center;
-  position: relative;
-}
-.euiKeyPadMenuItem__inner .euiKeyPadMenuItem__checkableInput {
-  -webkit-transform: scale(0.75);
-          transform: scale(0.75);
-  -webkit-transform-origin: top right;
-          transform-origin: top right;
-}
-.euiKeyPadMenuItem__inner .euiKeyPadMenuItem__checkableInput,
-.euiKeyPadMenuItem__inner .euiKeyPadMenuItem__betaBadge {
-  position: absolute;
-  top: 4px;
-  right: 4px;
-  z-index: 3;
-}
-
-.euiKeyPadMenuItem__icon {
-  transition: -webkit-transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);
-  transition: transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);
-  transition: transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1), -webkit-transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);
-  margin-bottom: 12px;
-  -webkit-transform: translateY(2px);
-          transform: translateY(2px);
-}
-
-.euiKeyPadMenuItem__label {
-  font-size: 12px;
-  font-weight: 500;
-  line-height: 16px;
-  text-align: center;
-}
-
-.euiKeyPadMenuItem--checkable.euiKeyPadMenuItem-isSelected:not(.euiKeyPadMenuItem-isDisabled), .euiKeyPadMenuItem--checkable.euiKeyPadMenuItem-isSelected:not(.euiKeyPadMenuItem-isDisabled):hover, .euiKeyPadMenuItem--checkable.euiKeyPadMenuItem-isSelected:not(.euiKeyPadMenuItem-isDisabled):focus, .euiKeyPadMenuItem--checkable.euiKeyPadMenuItem-isSelected:not(.euiKeyPadMenuItem-isDisabled):focus-within {
-  background-color: rgba(54, 162, 239, 0.2);
-  color: #36A2EF;
-  border-color: #36A2EF;
-}
-
 .euiMarkdownEditor {
   display: -webkit-flex;
   display: flex;
@@ -7269,240 +7144,6 @@ The following files still use the Sass version:
   margin-left: 16px;
 }
 
-.euiResizableButton {
-  position: relative;
-  -webkit-flex-shrink: 0;
-          flex-shrink: 0;
-  z-index: 1;
-}
-.euiResizableButton::before, .euiResizableButton::after {
-  content: "";
-  display: block;
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  background-color: #D4DAE5;
-  transition: width 150ms ease, height 150ms ease, background-color 150ms ease, -webkit-transform 150ms ease;
-  transition: width 150ms ease, height 150ms ease, transform 150ms ease, background-color 150ms ease;
-  transition: width 150ms ease, height 150ms ease, transform 150ms ease, background-color 150ms ease, -webkit-transform 150ms ease;
-}
-.euiResizableButton.euiResizableButton--horizontal {
-  cursor: col-resize;
-  width: 16px;
-  margin-left: -8px;
-  margin-right: -8px;
-}
-.euiResizableButton.euiResizableButton--horizontal::before, .euiResizableButton.euiResizableButton--horizontal::after {
-  width: 1px;
-  height: 12px;
-}
-.euiResizableButton.euiResizableButton--horizontal::before {
-  -webkit-transform: translate(-2px, -50%);
-          transform: translate(-2px, -50%);
-}
-.euiResizableButton.euiResizableButton--horizontal::after {
-  -webkit-transform: translate(1px, -50%);
-          transform: translate(1px, -50%);
-}
-.euiResizableButton.euiResizableButton--vertical {
-  cursor: row-resize;
-  height: 16px;
-  margin-top: -8px;
-  margin-bottom: -8px;
-}
-.euiResizableButton.euiResizableButton--vertical::before, .euiResizableButton.euiResizableButton--vertical::after {
-  width: 12px;
-  height: 1px;
-}
-.euiResizableButton.euiResizableButton--vertical::before {
-  -webkit-transform: translate(-50%, -2px);
-          transform: translate(-50%, -2px);
-}
-.euiResizableButton.euiResizableButton--vertical::after {
-  -webkit-transform: translate(-50%, 1px);
-          transform: translate(-50%, 1px);
-}
-.euiResizableButton:hover:not(:disabled)::before, .euiResizableButton:hover:not(:disabled)::after {
-  background-color: #535966;
-  transition-delay: 150ms;
-}
-.euiResizableButton:focus:not(:disabled) {
-  background-color: rgba(54, 162, 239, 0.1);
-}
-.euiResizableButton:focus:not(:disabled)::before, .euiResizableButton:focus:not(:disabled)::after {
-  background-color: #36A2EF;
-  transition: width 150ms ease, height 150ms ease, -webkit-transform 150ms ease;
-  transition: width 150ms ease, height 150ms ease, transform 150ms ease;
-  transition: width 150ms ease, height 150ms ease, transform 150ms ease, -webkit-transform 150ms ease;
-  transition-delay: 75ms;
-}
-.euiResizableButton:hover:not(:disabled).euiResizableButton--horizontal::before, .euiResizableButton:hover:not(:disabled).euiResizableButton--horizontal::after, .euiResizableButton:focus:not(:disabled).euiResizableButton--horizontal::before, .euiResizableButton:focus:not(:disabled).euiResizableButton--horizontal::after {
-  height: 100%;
-}
-.euiResizableButton:hover:not(:disabled).euiResizableButton--horizontal::before, .euiResizableButton:focus:not(:disabled).euiResizableButton--horizontal::before {
-  -webkit-transform: translate(-1px, -50%);
-          transform: translate(-1px, -50%);
-}
-.euiResizableButton:hover:not(:disabled).euiResizableButton--horizontal::after, .euiResizableButton:focus:not(:disabled).euiResizableButton--horizontal::after {
-  -webkit-transform: translate(0, -50%);
-          transform: translate(0, -50%);
-}
-.euiResizableButton:hover:not(:disabled).euiResizableButton--vertical::before, .euiResizableButton:hover:not(:disabled).euiResizableButton--vertical::after, .euiResizableButton:focus:not(:disabled).euiResizableButton--vertical::before, .euiResizableButton:focus:not(:disabled).euiResizableButton--vertical::after {
-  width: 100%;
-}
-.euiResizableButton:hover:not(:disabled).euiResizableButton--vertical::before, .euiResizableButton:focus:not(:disabled).euiResizableButton--vertical::before {
-  -webkit-transform: translate(-50%, -1px);
-          transform: translate(-50%, -1px);
-}
-.euiResizableButton:hover:not(:disabled).euiResizableButton--vertical::after, .euiResizableButton:focus:not(:disabled).euiResizableButton--vertical::after {
-  -webkit-transform: translate(-50%, 0);
-          transform: translate(-50%, 0);
-}
-.euiResizableButton:disabled {
-  display: none !important;
-}
-
-/**
- * 1. The default position of the button should always be `middle`, so
- *    those position styles aren't restricted to a class
- * 2. When collpsed, the button itself is the full collapsed area and we use
- *    flex to align the icon within
- */
-.euiResizableToggleButton {
-  box-shadow: 0 0.8px 0.8px rgba(0, 0, 0, 0.1), 0 2.3px 2px rgba(0, 0, 0, 0.075);
-  position: absolute;
-  z-index: 2;
-  -webkit-animation: none !important;
-          animation: none !important;
-  transition-property: background, box-shadow;
-  background: #1D1E24;
-}
-.euiResizableToggleButton:focus {
-  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);
-}
-.euiResizableToggleButton-isCollapsed {
-  box-shadow: none;
-  background: transparent;
-  border-radius: 0;
-}
-.euiResizableToggleButton:not(:focus):not(:active):not(.euiResizableToggleButton-isVisible):not(.euiResizableToggleButton-isCollapsed) {
-  position: absolute;
-  top: auto;
-  left: -10000px;
-  width: 1px;
-  height: 1px;
-  clip: rect(0 0 0 0);
-  -webkit-clip-path: inset(50%);
-          clip-path: inset(50%);
-  overflow: hidden;
-  margin: -1px;
-}
-
-.euiResizableToggleButton--horizontal.euiResizableToggleButton.euiResizableToggleButton--after {
-  right: 0;
-  top: 50%; /* 1 */
-  -webkit-transform: translate(50%, -50%);
-          transform: translate(50%, -50%); /* 1 */
-}
-.euiResizableToggleButton--horizontal.euiResizableToggleButton.euiResizableToggleButton--after.euiResizableToggleButton--top {
-  top: 0;
-  -webkit-transform: translate(50%, 16px);
-          transform: translate(50%, 16px);
-}
-.euiResizableToggleButton--horizontal.euiResizableToggleButton.euiResizableToggleButton--after.euiResizableToggleButton--bottom {
-  top: auto;
-  bottom: 0;
-  -webkit-transform: translate(50%, -16px);
-          transform: translate(50%, -16px);
-}
-.euiResizableToggleButton--horizontal.euiResizableToggleButton.euiResizableToggleButton--before {
-  left: 0;
-  top: 50%; /* 1 */
-  -webkit-transform: translate(-50%, -50%);
-          transform: translate(-50%, -50%); /* 1 */
-}
-.euiResizableToggleButton--horizontal.euiResizableToggleButton.euiResizableToggleButton--before.euiResizableToggleButton--top {
-  top: 0;
-  -webkit-transform: translate(-50%, 16px);
-          transform: translate(-50%, 16px);
-}
-.euiResizableToggleButton--horizontal.euiResizableToggleButton.euiResizableToggleButton--before.euiResizableToggleButton--bottom {
-  top: auto;
-  bottom: 0;
-  -webkit-transform: translate(-50%, -16px);
-          transform: translate(-50%, -16px);
-}
-.euiResizableToggleButton--horizontal.euiResizableToggleButton.euiResizableToggleButton-isCollapsed {
-  top: 0 !important;
-  bottom: 0 !important;
-  -webkit-transform: none !important;
-          transform: none !important;
-  height: 100%;
-}
-.euiResizableToggleButton--horizontal.euiResizableToggleButton.euiResizableToggleButton-isCollapsed.euiResizableToggleButton--top {
-  padding-top: 16px;
-  -webkit-align-items: flex-start;
-          align-items: flex-start; /* 2 */
-}
-.euiResizableToggleButton--horizontal.euiResizableToggleButton.euiResizableToggleButton-isCollapsed.euiResizableToggleButton--bottom {
-  padding-bottom: 16px;
-  -webkit-align-items: flex-end;
-          align-items: flex-end; /* 2 */
-}
-
-.euiResizableToggleButton--vertical.euiResizableToggleButton.euiResizableToggleButton--after {
-  top: 100%;
-  left: 50%; /* 1 */
-  -webkit-transform: translate(-50%, -50%);
-          transform: translate(-50%, -50%); /* 1 */
-}
-.euiResizableToggleButton--vertical.euiResizableToggleButton.euiResizableToggleButton--after.euiResizableToggleButton--left {
-  left: 0;
-  -webkit-transform: translate(16px, -50%);
-          transform: translate(16px, -50%);
-}
-.euiResizableToggleButton--vertical.euiResizableToggleButton.euiResizableToggleButton--after.euiResizableToggleButton--right {
-  left: auto;
-  right: 0;
-  -webkit-transform: translate(-16px, -50%);
-          transform: translate(-16px, -50%);
-}
-.euiResizableToggleButton--vertical.euiResizableToggleButton.euiResizableToggleButton--before {
-  bottom: 100%;
-  left: 50%; /* 1 */
-  -webkit-transform: translate(-50%, 50%);
-          transform: translate(-50%, 50%); /* 1 */
-}
-.euiResizableToggleButton--vertical.euiResizableToggleButton.euiResizableToggleButton--before.euiResizableToggleButton--left {
-  left: 0;
-  -webkit-transform: translate(16px, 50%);
-          transform: translate(16px, 50%);
-}
-.euiResizableToggleButton--vertical.euiResizableToggleButton.euiResizableToggleButton--before.euiResizableToggleButton--right {
-  left: auto;
-  right: 0;
-  -webkit-transform: translate(-16px, 50%);
-          transform: translate(-16px, 50%);
-}
-.euiResizableToggleButton--vertical.euiResizableToggleButton.euiResizableToggleButton-isCollapsed {
-  top: 0 !important;
-  bottom: 0 !important;
-  left: 0 !important;
-  -webkit-transform: none !important;
-          transform: none !important;
-  width: 100%;
-}
-.euiResizableToggleButton--vertical.euiResizableToggleButton.euiResizableToggleButton-isCollapsed.euiResizableToggleButton--left {
-  padding-left: 16px;
-  -webkit-justify-content: flex-start;
-          justify-content: flex-start; /* 2 */
-}
-.euiResizableToggleButton--vertical.euiResizableToggleButton.euiResizableToggleButton-isCollapsed.euiResizableToggleButton--right {
-  padding-right: 16px;
-  -webkit-justify-content: flex-end;
-          justify-content: flex-end; /* 2 */
-}
-
 .euiSideNav__mobileToggle {
   height: auto;
   border-bottom: 1px solid #343741;
@@ -9485,35 +9126,6 @@ button.euiSuggestItem:hover .euiSuggestItem__label, button.euiSuggestItem:focus
   outline: none;
 }
 
-.euiKeyPadMenuItem {
-  border: none !important;
-  box-shadow: none;
-}
-.euiKeyPadMenuItem:not(.euiKeyPadMenuItem-isDisabled):hover, .euiKeyPadMenuItem:not(.euiKeyPadMenuItem-isDisabled):focus:hover, .euiKeyPadMenuItem:not(.euiKeyPadMenuItem-isDisabled):focus-within {
-  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);
-}
-.euiKeyPadMenuItem:not(.euiKeyPadMenuItem-isDisabled):focus {
-  box-shadow: none;
-}
-.euiKeyPadMenuItem.euiKeyPadMenuItem-isSelected:not(.euiKeyPadMenuItem-isDisabled) {
-  box-shadow: none;
-}
-.euiKeyPadMenuItem.euiKeyPadMenuItem-isSelected:not(.euiKeyPadMenuItem-isDisabled):hover {
-  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);
-}
-.euiKeyPadMenuItem.euiKeyPadMenuItem-isSelected:not(.euiKeyPadMenuItem-isDisabled), .euiKeyPadMenuItem.euiKeyPadMenuItem-isSelected:not(.euiKeyPadMenuItem-isDisabled):hover, .euiKeyPadMenuItem.euiKeyPadMenuItem-isSelected:not(.euiKeyPadMenuItem-isDisabled):focus, .euiKeyPadMenuItem.euiKeyPadMenuItem-isSelected:not(.euiKeyPadMenuItem-isDisabled):focus-within {
-  background-color: rgba(54, 162, 239, 0.2);
-  color: #40a7f0;
-}
-.euiKeyPadMenuItem.euiKeyPadMenuItem-isSelected.euiKeyPadMenuItem-isDisabled {
-  background-color: rgba(81, 87, 97, 0.2);
-  color: #5a5f69;
-}
-
-.euiKeyPadMenuItem__label {
-  font-weight: 600;
-}
-
 .euiMarkdownEditorToolbar {
   border-radius: 6px 6px 0 0;
 }