diff --git a/CHANGELOG.md b/CHANGELOG.md index bb8a1989ff11..f1e29d4e6c7f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,10 @@ ## [`master`](https://github.com/elastic/eui/tree/master) - Added `onBlur` prop to `EuiComboBox` ([#1400](https://github.com/elastic/eui/pull/1400)) + +## [`6.1.0`](https://github.com/elastic/eui/tree/v6.1.0) + +- Added `EuiListGroup` and `EuiListGroupItem` components ([#1377](https://github.com/elastic/eui/pull/1377)) - Convert the other of the services to TypeScript ([#1392](https://github.com/elastic/eui/pull/1392)) - Changed single selection to select existing option in the list ([#1391](https://github.com/elastic/eui/pull/1391)) - Added `showUpdateButton` prop to `EuiSuperDatePicker` ([#1399](https://github.com/elastic/eui/pull/1399)) @@ -20,6 +24,7 @@ - Altered a few icons and added more: `crossInACircleFilled`, `editorRedo`, `editorUndo`, `grabHorizontal`, `minusInCircleFilled`, `plusInCircleFilled`, `sortable`, `starEmptySpace`, `starFilledSpace`, `starFilled`, `starMinusEmpty`, `starMinusFilled`, `starPlusEmpty`, `pinFilled` ([#1374](https://github.com/elastic/eui/pull/1374)) - Exclude `custom_typings` from `eui.d.ts` ([#1395](https://github.com/elastic/eui/pull/1395)) + **Bug fixes** - Only style anchor tags in `EuiText` that have no class attribute ([#1373](https://github.com/elastic/eui/pull/1373)) diff --git a/docs/bundle.js b/docs/bundle.js index 91607cb6da43..1bd78100c0a6 100644 --- a/docs/bundle.js +++ b/docs/bundle.js @@ -45322,7 +45322,7 @@ exports = module.exports = __webpack_require__(/*! ../../node_modules/css-loader // module -exports.push([module.i, "@-webkit-keyframes euiAnimFadeIn {\n 0% {\n opacity: 0; }\n 100% {\n opacity: 1; } }\n\n@keyframes euiAnimFadeIn {\n 0% {\n opacity: 0; }\n 100% {\n opacity: 1; } }\n\n@-webkit-keyframes euiGrow {\n 0% {\n opacity: 0; }\n 1% {\n opacity: 0;\n -webkit-transform: scale(0);\n transform: scale(0); }\n 100% {\n opacity: 1;\n -webkit-transform: scale(1);\n transform: scale(1); } }\n\n@keyframes euiGrow {\n 0% {\n opacity: 0; }\n 1% {\n opacity: 0;\n -webkit-transform: scale(0);\n transform: scale(0); }\n 100% {\n opacity: 1;\n -webkit-transform: scale(1);\n transform: scale(1); } }\n\n@-webkit-keyframes focusRingAnimate {\n 0% {\n -webkit-box-shadow: 0 0 0 6px rgba(77, 161, 192, 0);\n box-shadow: 0 0 0 6px rgba(77, 161, 192, 0); }\n 100% {\n -webkit-box-shadow: 0 0 0 2px rgba(77, 161, 192, 0.3);\n box-shadow: 0 0 0 2px rgba(77, 161, 192, 0.3); } }\n\n@keyframes focusRingAnimate {\n 0% {\n -webkit-box-shadow: 0 0 0 6px rgba(77, 161, 192, 0);\n box-shadow: 0 0 0 6px rgba(77, 161, 192, 0); }\n 100% {\n -webkit-box-shadow: 0 0 0 2px rgba(77, 161, 192, 0.3);\n box-shadow: 0 0 0 2px rgba(77, 161, 192, 0.3); } }\n\n@-webkit-keyframes focusRingAnimateLarge {\n 0% {\n -webkit-box-shadow: 0 0 0 10px rgba(77, 161, 192, 0);\n box-shadow: 0 0 0 10px rgba(77, 161, 192, 0); }\n 100% {\n -webkit-box-shadow: 0 0 0 4px rgba(77, 161, 192, 0.3);\n box-shadow: 0 0 0 4px rgba(77, 161, 192, 0.3); } }\n\n@keyframes focusRingAnimateLarge {\n 0% {\n -webkit-box-shadow: 0 0 0 10px rgba(77, 161, 192, 0);\n box-shadow: 0 0 0 10px rgba(77, 161, 192, 0); }\n 100% {\n -webkit-box-shadow: 0 0 0 4px rgba(77, 161, 192, 0.3);\n box-shadow: 0 0 0 4px rgba(77, 161, 192, 0.3); } }\n\n.eui-alignBaseline {\n vertical-align: baseline !important; }\n\n.eui-alignBottom {\n vertical-align: bottom !important; }\n\n.eui-alignMiddle {\n vertical-align: middle !important; }\n\n.eui-alignTop {\n vertical-align: top !important; }\n\n.eui-displayBlock {\n display: block !important; }\n\n.eui-displayInline {\n display: inline !important; }\n\n.eui-displayInlineBlock {\n display: inline-block !important; }\n\n.eui-textCenter {\n text-align: center !important; }\n\n.eui-textLeft {\n text-align: left !important; }\n\n.eui-textRight {\n text-align: right !important; }\n\n.eui-textNoWrap {\n white-space: nowrap !important; }\n\n.eui-textInheritColor {\n color: inherit !important; }\n\n.eui-textBreakWord {\n word-break: break-all !important;\n word-break: break-word !important; }\n\n.eui-textBreakAll {\n word-break: break-all !important; }\n\n.eui-textBreakNormal {\n word-break: normal !important; }\n\n.eui-textOverflowWrap {\n overflow-wrap: break-word !important; }\n @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {\n .eui-textOverflowWrap {\n word-break: break-all !important; } }\n\n.eui-textTruncate {\n max-width: 100%;\n /* 1 */\n overflow: hidden !important;\n text-overflow: ellipsis !important;\n white-space: nowrap !important;\n word-wrap: normal !important;\n /* 2 */ }\n\n/**\n * Responsive\n *\n * 3. Be sure to hide/show the element initially\n */\n[class*='eui-hideFor'] {\n display: inline !important;\n /* 3 */ }\n\n[class*='eui-showFor'] {\n display: none !important;\n /* 3 */ }\n\n@media only screen and (max-width: 574px) {\n .eui-hideFor--xs {\n display: none !important; } }\n\n@media only screen and (max-width: 574px) {\n .eui-showFor--xs {\n display: inline !important; } }\n\n@media only screen and (min-width: 575px) and (max-width: 767px) {\n .eui-hideFor--s {\n display: none !important; } }\n\n@media only screen and (min-width: 575px) and (max-width: 767px) {\n .eui-showFor--s {\n display: inline !important; } }\n\n@media only screen and (min-width: 768px) and (max-width: 991px) {\n .eui-hideFor--m {\n display: none !important; } }\n\n@media only screen and (min-width: 768px) and (max-width: 991px) {\n .eui-showFor--m {\n display: inline !important; } }\n\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\n .eui-hideFor--l {\n display: none !important; } }\n\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\n .eui-showFor--l {\n display: inline !important; } }\n\n@media only screen and (min-width: 1200px) {\n .eui-hideFor--xl {\n display: none !important; } }\n\n@media only screen and (min-width: 1200px) {\n .eui-showFor--xl {\n display: inline !important; } }\n\n/**\n * IE doesn't properly wrap groups if it is within a flex-item of a flex-group.\n * Adding the following styles to the flex-item that contains the wrapping group, will fix IE.\n * https://github.com/philipwalton/flexbugs/issues/104\n */\n.euiIEFlexWrapFix {\n -webkit-box-flex: 1;\n -ms-flex-positive: 1;\n flex-grow: 1;\n -ms-flex-negative: 1;\n flex-shrink: 1;\n -ms-flex-preferred-size: 0%;\n flex-basis: 0%; }\n\n/**\n * Adapted from Eric Meyer's reset (http://meyerweb.com/eric/tools/css/reset/, v2.0 | 20110126).\n *\n */\n*, *:before, *:after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n\n/**\n * 1. Inheriting the font will allow some browser defaults to take effect, e.g. Chrome applies\n * `font: 11px system-ui` to the button element. We can't hardcode the font-family here because\n * that will disrupt components which rely upon a different inherited font-family, e.g. code\n * blocks.\n */\nhtml, body, div, span, applet, object, iframe,\nh1, h2, h3, h4, h5, h6, p, blockquote, pre,\na, abbr, acronym, address, big, cite, code,\ndel, dfn, em, img, ins, kbd, q, s, samp,\nsmall, strike, strong, sub, sup, tt, var,\nb, u, i, center,\ndl, dt, dd, ol, ul, li,\nfieldset, form, label, legend,\ntable, caption, tbody, tfoot, thead, tr, th, td,\narticle, aside, canvas, details, embed,\nfigure, figcaption, footer, header, hgroup,\nmenu, nav, output, ruby, section, summary,\ntime, mark, audio, video {\n margin: 0;\n padding: 0;\n border: none;\n font: inherit;\n /* 1 */\n font-family: inherit;\n /* 1 */\n vertical-align: baseline; }\n\ninput, textarea, select, button {\n font-family: inherit;\n /* 1 */ }\n\nem {\n font-style: italic; }\n\nstrong {\n font-weight: 700; }\n\n/* HTML5 display-role reset for older browsers */\narticle, aside, details, figcaption, figure,\nfooter, header, hgroup, menu, nav, section {\n display: block; }\n\nhtml {\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n font-weight: 400;\n font-size: 16px;\n color: #DDD;\n height: 100%;\n background-color: #242424; }\n\nbody {\n line-height: 1; }\n\n*:focus {\n outline: none; }\n\na {\n text-decoration: none;\n color: #4DA1C0; }\n a:hover {\n text-decoration: none; }\n a:focus {\n text-decoration: none;\n outline: none; }\n\na:hover, button, [role='button'] {\n cursor: pointer; }\n\ninput {\n margin: 0;\n padding: 0; }\n\nbutton {\n background: none;\n border: none;\n padding: 0;\n margin: 0;\n outline: none;\n font-size: 16px;\n font-size: inherit;\n color: inherit;\n border-radius: 0; }\n button:hover {\n cursor: pointer; }\n\nol, ul {\n list-style: none; }\n\nblockquote, q {\n quotes: none; }\n\nblockquote:before, blockquote:after,\nq:before, q:after {\n content: '';\n content: none; }\n\ntable {\n border-collapse: collapse;\n border-spacing: 0; }\n\nhr {\n margin: 0; }\n\nhtml {\n scrollbar-width: thin;\n scrollbar-color: rgba(138, 138, 138, 0.5) transparent; }\n\n.euiScreenReaderOnly {\n position: absolute;\n left: -10000px;\n top: auto;\n width: 1px;\n height: 1px;\n overflow: hidden; }\n\n.euiAccordion__button {\n text-align: left;\n width: 100%; }\n .euiAccordion__button:hover {\n text-decoration: underline;\n cursor: pointer; }\n .euiAccordion__button:focus .euiAccordion__iconWrapper {\n -webkit-animation: 350ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal forwards focusRingAnimate;\n animation: 350ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal forwards focusRingAnimate;\n color: #4DA1C0;\n border-radius: 4px; }\n\n.euiAccordion__childWrapper {\n visibility: hidden;\n height: 0;\n opacity: 0;\n overflow-y: hidden;\n -webkit-transform: translatez(0);\n transform: translatez(0);\n -webkit-transition: height 250ms cubic-bezier(0.694, 0.0482, 0.335, 1), opacity 250ms cubic-bezier(0.694, 0.0482, 0.335, 1);\n transition: height 250ms cubic-bezier(0.694, 0.0482, 0.335, 1), opacity 250ms cubic-bezier(0.694, 0.0482, 0.335, 1); }\n\n.euiAccordion__padding--xs {\n padding: 4px; }\n\n.euiAccordion__padding--s {\n padding: 8px; }\n\n.euiAccordion__padding--m {\n padding: 16px; }\n\n.euiAccordion__padding--l {\n padding: 24px; }\n\n.euiAccordion__padding--xl {\n padding: 32px; }\n\n.euiAccordion.euiAccordion-isOpen .euiAccordion__childWrapper {\n visibility: visible;\n opacity: 1;\n height: auto; }\n\n.euiAccordionForm__extraAction {\n opacity: 0;\n -webkit-transition: opacity 250ms cubic-bezier(0.694, 0.0482, 0.335, 1);\n transition: opacity 250ms cubic-bezier(0.694, 0.0482, 0.335, 1); }\n .euiAccordionForm__extraAction:focus {\n opacity: 1; }\n\n.euiAccordionForm__title {\n display: inline-block; }\n\n.euiAccordionForm__button {\n padding: 16px 16px 16px 0; }\n .euiAccordionForm__button:hover {\n text-decoration: none; }\n .euiAccordionForm__button:hover .euiAccordionForm__title {\n text-decoration: underline; }\n\n.euiAccordionForm {\n border-top: 1px solid #333;\n border-bottom: 1px solid #333; }\n .euiAccordionForm + .euiAccordionForm {\n border-top: none; }\n .euiAccordionForm:hover .euiAccordionForm__extraAction {\n opacity: 1;\n visibility: visible; }\n\n.euiAvatar {\n display: inline-block;\n background-size: cover;\n text-align: center;\n vertical-align: middle;\n overflow-x: hidden;\n font-weight: 400; }\n\n.euiAvatar--user {\n position: relative;\n border-radius: 50%; }\n .euiAvatar--user:after {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n content: '';\n pointer-events: none;\n border: 1px solid rgba(245, 245, 245, 0.05); }\n\n.euiAvatar--space {\n position: relative;\n border-radius: 4px; }\n .euiAvatar--space:after {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border-radius: 4px;\n content: '';\n pointer-events: none;\n border: 1px solid rgba(245, 245, 245, 0.05); }\n\n.euiAvatar--s {\n width: 24px;\n height: 24px;\n line-height: 24px;\n font-size: 10.8px; }\n\n.euiAvatar--m {\n width: 32px;\n height: 32px;\n line-height: 32px;\n font-size: 14.4px; }\n\n.euiAvatar--l {\n width: 40px;\n height: 40px;\n line-height: 40px;\n font-size: 19.2px; }\n\n.euiAvatar--xl {\n width: 64px;\n height: 64px;\n line-height: 64px;\n font-size: 25.6px; }\n\n/**\n * 1. Accounts for the border\n */\n.euiBadge {\n font-size: 12px;\n font-weight: 600;\n line-height: 18px;\n /* 1 */\n display: inline-block;\n text-decoration: none;\n -webkit-box-sizing: content-box;\n box-sizing: content-box;\n border-radius: 2px;\n border: solid 1px transparent;\n padding: 0 8px;\n background-color: transparent;\n white-space: nowrap;\n vertical-align: middle;\n text-align: center;\n overflow: hidden; }\n .euiBadge + .euiBadge {\n margin-left: 4px; }\n .euiBadge .euiBadge__content {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n overflow: hidden; }\n .euiBadge .euiBadge__text {\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-box-flex: 1;\n -ms-flex: 1 1 auto;\n flex: 1 1 auto; }\n .euiBadge:focus {\n -webkit-animation: 350ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal forwards focusRingAnimate;\n animation: 350ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal forwards focusRingAnimate; }\n .euiBadge .euiBadge__icon {\n -webkit-box-flex: 0;\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n margin-right: 4px; }\n .euiBadge .euiBadge__icon:focus {\n background-color: rgba(255, 255, 255, 0.8);\n color: #000;\n border-radius: 2px; }\n .euiBadge.euiBadge--iconRight .euiBadge__content {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: reverse;\n -ms-flex-direction: row-reverse;\n flex-direction: row-reverse; }\n .euiBadge.euiBadge--iconRight .euiBadge__content .euiBadge__icon {\n margin-left: 4px;\n margin-right: 0; }\n\n.euiBadge--default {\n background-color: #333;\n color: #FFF; }\n\n.euiBadge--primary {\n background-color: #cbd7db;\n color: #000; }\n\n.euiBadge--secondary {\n background-color: #70dad1;\n color: #000; }\n\n.euiBadge--warning {\n background-color: #c6b3ac;\n color: #000; }\n\n.euiBadge--danger {\n background-color: #edebeb;\n color: #000; }\n\n.euiBadge--accent {\n background-color: #edc6d9;\n color: #000; }\n\n.euiBadge--hollow {\n background-color: #222;\n border-color: #333;\n color: #DDD; }\n\n/**\n * 1. Extend beta badges to at least 40% of the container's width\n * 2. Fix for IE to ensure badges are visible outside of a