From 04a9547612b46c7ae391705a48a79bba93282448 Mon Sep 17 00:00:00 2001 From: "dave.snider@gmail.com" Date: Tue, 6 Aug 2019 17:50:46 -0700 Subject: [PATCH] Remove unused KUI code (#42748) * Remove unused KUI code * delete a bunch of dead code * feedback * linting --- packages/kbn-ui-framework/dist/kui_dark.css | 431 ------------------ packages/kbn-ui-framework/dist/kui_light.css | 431 ------------------ .../doc_site/src/services/routes/routes.js | 266 +++++------ .../src/views/expression/expression.js | 220 --------- .../views/expression/expression_example.js | 59 --- .../doc_site/src/views/menu/menu.js | 43 -- .../doc_site/src/views/menu/menu_contained.js | 43 -- .../doc_site/src/views/menu/menu_example.js | 73 --- .../views/menu_button/menu_button_basic.html | 9 - .../views/menu_button/menu_button_danger.html | 9 - .../menu_button/menu_button_elements.html | 17 - .../views/menu_button/menu_button_example.js | 119 ----- .../views/menu_button/menu_button_group.html | 19 - .../menu_button/menu_button_primary.html | 9 - .../menu_button/menu_button_with_icon.html | 17 - .../doc_site/src/views/modal/confirm_modal.js | 82 ---- .../doc_site/src/views/modal/modal.js | 102 ----- .../doc_site/src/views/modal/modal_example.js | 81 ---- .../src/views/panel_simple/panel_simple.js | 56 --- .../panel_simple/panel_simple_example.js | 64 --- .../doc_site/src/views/popover/popover.js | 68 --- .../views/popover/popover_anchor_position.js | 98 ---- .../views/popover/popover_body_class_name.js | 67 --- .../src/views/popover/popover_example.js | 160 ------- .../views/popover/popover_panel_class_name.js | 68 --- .../src/views/popover/popover_with_title.js | 79 ---- .../doc_site/src/views/popover/trap_focus.js | 96 ---- .../views/table/table_with_menu_buttons.js | 81 +--- .../views/toggle_button/toggle_button.html | 4 - .../src/views/toggle_button/toggle_button.js | 17 - .../toggle_button/toggle_button_disabled.html | 4 - .../toggle_button/toggle_button_example.js | 86 ---- .../src/views/toggle_button/toggle_panel.html | 21 - .../src/views/toggle_button/toggle_panel.js | 24 - .../__snapshots__/expression.test.js.snap | 17 - .../expression_button.test.js.snap | 57 --- .../components/expression/_expression.scss | 27 -- .../src/components/expression/_index.scss | 3 - .../src/components/expression/expression.js | 44 -- .../components/expression/expression.test.js | 51 --- .../expression/expression_button.js | 58 --- .../expression/expression_button.test.js | 93 ---- .../src/components/expression/index.js | 21 - .../kbn-ui-framework/src/components/index.js | 71 +-- .../src/components/index.scss | 47 +- .../menu/__snapshots__/menu.test.js.snap | 19 - .../menu/__snapshots__/menu_item.test.js.snap | 11 - .../src/components/menu/_index.scss | 1 - .../src/components/menu/_menu.scss | 26 -- .../src/components/menu/index.js | 21 - .../src/components/menu/menu.js | 48 -- .../src/components/menu/menu.test.js | 36 -- .../src/components/menu/menu_item.js | 43 -- .../src/components/menu/menu_item.test.js | 31 -- .../src/components/menu_button/_index.scss | 20 - .../components/menu_button/_menu_button.scss | 118 ----- .../menu_button/_menu_button_group.scss | 11 - .../__snapshots__/confirm_modal.test.js.snap | 64 --- .../modal/__snapshots__/modal.test.js.snap | 14 - .../__snapshots__/modal_body.test.js.snap | 11 - .../__snapshots__/modal_footer.test.js.snap | 11 - .../__snapshots__/modal_header.test.js.snap | 11 - .../modal_header_title.test.js.snap | 11 - .../__snapshots__/modal_overlay.test.js.snap | 11 - .../src/components/modal/_index.scss | 11 - .../src/components/modal/_modal.scss | 63 --- .../src/components/modal/_modal_overlay.scss | 13 - .../src/components/modal/confirm_modal.js | 120 ----- .../components/modal/confirm_modal.test.js | 145 ------ .../src/components/modal/index.js | 30 -- .../src/components/modal/modal.js | 74 --- .../src/components/modal/modal.test.js | 39 -- .../src/components/modal/modal_body.js | 36 -- .../src/components/modal/modal_body.test.js | 31 -- .../src/components/modal/modal_footer.js | 36 -- .../src/components/modal/modal_footer.test.js | 31 -- .../src/components/modal/modal_header.js | 36 -- .../src/components/modal/modal_header.test.js | 31 -- .../components/modal/modal_header_title.js | 36 -- .../modal/modal_header_title.test.js | 31 -- .../src/components/modal/modal_overlay.js | 36 -- .../components/modal/modal_overlay.test.js | 31 -- .../outside_click_detector.test.js.snap | 3 - .../outside_click_detector/index.js | 22 - .../outside_click_detector.js | 68 --- .../outside_click_detector.test.js | 36 -- .../__snapshots__/panel_simple.test.js.snap | 9 - .../src/components/panel_simple/_index.scss | 1 - .../panel_simple/_panel_simple.scss | 27 -- .../src/components/panel_simple/index.js | 23 - .../components/panel_simple/panel_simple.js | 78 ---- .../panel_simple/panel_simple.test.js | 35 -- .../__snapshots__/popover.test.js.snap | 125 ----- .../__snapshots__/popover_title.test.js.snap | 9 - .../src/components/popover/_index.scss | 3 - .../src/components/popover/_mixins.scss | 6 - .../src/components/popover/_popover.scss | 96 ---- .../components/popover/_popover_title.scss | 3 - .../src/components/popover/index.js | 21 - .../src/components/popover/popover.js | 218 --------- .../src/components/popover/popover.test.js | 218 --------- .../src/components/popover/popover_title.js | 40 -- .../components/popover/popover_title.test.js | 35 -- .../src/components/toggle_button/_index.scss | 2 - .../toggle_button/_toggle_button.scss | 40 -- .../toggle_button/_toggle_panel.scss | 13 - 106 files changed, 149 insertions(+), 5842 deletions(-) delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/expression/expression.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/expression/expression_example.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/menu/menu.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/menu/menu_contained.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/menu/menu_example.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_basic.html delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_danger.html delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_elements.html delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_example.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_group.html delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_primary.html delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_with_icon.html delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/modal/confirm_modal.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/modal/modal.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/modal/modal_example.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/panel_simple/panel_simple.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/panel_simple/panel_simple_example.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/popover/popover.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/popover/popover_anchor_position.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/popover/popover_body_class_name.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/popover/popover_example.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/popover/popover_panel_class_name.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/popover/popover_with_title.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/popover/trap_focus.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button.html delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button_disabled.html delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button_example.js delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_panel.html delete mode 100644 packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_panel.js delete mode 100644 packages/kbn-ui-framework/src/components/expression/__snapshots__/expression.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/expression/__snapshots__/expression_button.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/expression/_expression.scss delete mode 100644 packages/kbn-ui-framework/src/components/expression/_index.scss delete mode 100644 packages/kbn-ui-framework/src/components/expression/expression.js delete mode 100644 packages/kbn-ui-framework/src/components/expression/expression.test.js delete mode 100644 packages/kbn-ui-framework/src/components/expression/expression_button.js delete mode 100644 packages/kbn-ui-framework/src/components/expression/expression_button.test.js delete mode 100644 packages/kbn-ui-framework/src/components/expression/index.js delete mode 100644 packages/kbn-ui-framework/src/components/menu/__snapshots__/menu.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/menu/__snapshots__/menu_item.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/menu/_index.scss delete mode 100644 packages/kbn-ui-framework/src/components/menu/_menu.scss delete mode 100644 packages/kbn-ui-framework/src/components/menu/index.js delete mode 100644 packages/kbn-ui-framework/src/components/menu/menu.js delete mode 100644 packages/kbn-ui-framework/src/components/menu/menu.test.js delete mode 100644 packages/kbn-ui-framework/src/components/menu/menu_item.js delete mode 100644 packages/kbn-ui-framework/src/components/menu/menu_item.test.js delete mode 100644 packages/kbn-ui-framework/src/components/menu_button/_index.scss delete mode 100644 packages/kbn-ui-framework/src/components/menu_button/_menu_button.scss delete mode 100644 packages/kbn-ui-framework/src/components/menu_button/_menu_button_group.scss delete mode 100644 packages/kbn-ui-framework/src/components/modal/__snapshots__/confirm_modal.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/modal/__snapshots__/modal.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_body.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_footer.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_header.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_header_title.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_overlay.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/modal/_index.scss delete mode 100644 packages/kbn-ui-framework/src/components/modal/_modal.scss delete mode 100644 packages/kbn-ui-framework/src/components/modal/_modal_overlay.scss delete mode 100644 packages/kbn-ui-framework/src/components/modal/confirm_modal.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/confirm_modal.test.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/index.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal.test.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal_body.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal_body.test.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal_footer.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal_footer.test.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal_header.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal_header.test.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal_header_title.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal_header_title.test.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal_overlay.js delete mode 100644 packages/kbn-ui-framework/src/components/modal/modal_overlay.test.js delete mode 100644 packages/kbn-ui-framework/src/components/outside_click_detector/__snapshots__/outside_click_detector.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/outside_click_detector/index.js delete mode 100644 packages/kbn-ui-framework/src/components/outside_click_detector/outside_click_detector.js delete mode 100644 packages/kbn-ui-framework/src/components/outside_click_detector/outside_click_detector.test.js delete mode 100644 packages/kbn-ui-framework/src/components/panel_simple/__snapshots__/panel_simple.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/panel_simple/_index.scss delete mode 100644 packages/kbn-ui-framework/src/components/panel_simple/_panel_simple.scss delete mode 100644 packages/kbn-ui-framework/src/components/panel_simple/index.js delete mode 100644 packages/kbn-ui-framework/src/components/panel_simple/panel_simple.js delete mode 100644 packages/kbn-ui-framework/src/components/panel_simple/panel_simple.test.js delete mode 100644 packages/kbn-ui-framework/src/components/popover/__snapshots__/popover.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/popover/__snapshots__/popover_title.test.js.snap delete mode 100644 packages/kbn-ui-framework/src/components/popover/_index.scss delete mode 100644 packages/kbn-ui-framework/src/components/popover/_mixins.scss delete mode 100644 packages/kbn-ui-framework/src/components/popover/_popover.scss delete mode 100644 packages/kbn-ui-framework/src/components/popover/_popover_title.scss delete mode 100644 packages/kbn-ui-framework/src/components/popover/index.js delete mode 100644 packages/kbn-ui-framework/src/components/popover/popover.js delete mode 100644 packages/kbn-ui-framework/src/components/popover/popover.test.js delete mode 100644 packages/kbn-ui-framework/src/components/popover/popover_title.js delete mode 100644 packages/kbn-ui-framework/src/components/popover/popover_title.test.js delete mode 100644 packages/kbn-ui-framework/src/components/toggle_button/_index.scss delete mode 100644 packages/kbn-ui-framework/src/components/toggle_button/_toggle_button.scss delete mode 100644 packages/kbn-ui-framework/src/components/toggle_button/_toggle_panel.scss diff --git a/packages/kbn-ui-framework/dist/kui_dark.css b/packages/kbn-ui-framework/dist/kui_dark.css index 7a962b510fc0..dcbd65fbca52 100644 --- a/packages/kbn-ui-framework/dist/kui_dark.css +++ b/packages/kbn-ui-framework/dist/kui_dark.css @@ -492,29 +492,6 @@ main { .kuiCollapseButton:hover { opacity: 1; } -.kuiExpression { - padding: 20px; - white-space: nowrap; } - -.kuiExpressionButton { - background-color: transparent; - padding: 5px 0px; - border: none; - border-bottom: dotted 2px #343741; - font-size: 16px; - cursor: pointer; } - -.kuiExpressionButton__description { - color: #7DE2D1; - text-transform: uppercase; } - -.kuiExpressionButton__value { - color: #DFE5EF; - text-transform: lowercase; } - -.kuiExpressionButton-isActive { - border-bottom: solid 2px #7DE2D1; } - /** * 1. Set inline-block so this wrapper shrinks to fit the input. */ @@ -1635,262 +1612,6 @@ main { padding: 0; display: none; } -/** - * 1. Allow class to be applied to `ul` and `ol` elements - */ -.kuiMenu { - padding-left: 0; - /* 1 */ } - -.kuiMenu--contained { - border: 1px solid #343741; } - .kuiMenu--contained .kuiMenuItem { - padding: 6px 10px; } - -/** - * 1. Allow class to be applied to `li` elements - */ -.kuiMenuItem { - list-style: none; - /* 1 */ - padding: 6px 0; } - .kuiMenuItem + .kuiMenuItem { - border-top: 1px solid #343741; } - -/** - * 1. Setting to inline-block guarantees the same height when applied to both - * button elements and anchor tags. - * 2. Disable for Angular. - * 3. Make the button just tall enough to fit inside an Option Layout. - */ -.kuiMenuButton { - display: inline-block; - /* 1 */ - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - cursor: pointer; - padding: 2px 10px; - /* 3 */ - font-size: 12px; - font-weight: 400; - line-height: 1.5; - text-decoration: none; - border: none; - border-radius: 4px; } - .kuiMenuButton:disabled { - cursor: default; - pointer-events: none; - /* 2 */ } - .kuiMenuButton:active:enabled { - -webkit-transform: translateY(1px); - transform: translateY(1px); } - .kuiMenuButton:focus { - z-index: 1; - /* 1 */ - outline: none !important; - /* 2 */ - -webkit-box-shadow: 0 0 0 1px #1D1E24, 0 0 0 2px #1BA9F5; - box-shadow: 0 0 0 1px #1D1E24, 0 0 0 2px #1BA9F5; - /* 3 */ } - -.kuiMenuButton--iconText .kuiMenuButton__icon:first-child { - margin-right: 4px; } - -.kuiMenuButton--iconText .kuiMenuButton__icon:last-child { - margin-left: 4px; } - -/** - * 1. Override Bootstrap. - * 2. Safari won't respect :enabled:hover/active on links. - */ -.kuiMenuButton--basic { - color: #DFE5EF; - background-color: #1D1E24; } - .kuiMenuButton--basic:focus { - color: #DFE5EF !important; - /* 1 */ } - .kuiMenuButton--basic:hover, .kuiMenuButton--basic:active { - /* 2 */ - color: #DFE5EF !important; - /* 1 */ - background-color: #25262E; } - .kuiMenuButton--basic:disabled { - color: #535966; - cursor: not-allowed; } - -/** - * 1. Override Bootstrap. - * 2. Safari won't respect :enabled:hover/active on links. - */ -.kuiMenuButton--primary { - color: #FFF; - background-color: #1BA9F5; } - .kuiMenuButton--primary:focus { - color: #FFF !important; - /* 1 */ } - .kuiMenuButton--primary:hover, .kuiMenuButton--primary:active { - /* 2 */ - color: #FFF !important; - /* 1 */ - background-color: #098dd4; } - .kuiMenuButton--primary:disabled { - background-color: #535966; - cursor: not-allowed; } - -/** - * 1. Override Bootstrap. - * 2. Safari won't respect :enabled:hover/active on links. - */ -.kuiMenuButton--danger { - color: #FFF; - background-color: #F66; } - .kuiMenuButton--danger:hover, .kuiMenuButton--danger:active { - /* 2 */ - color: #FFF !important; - /* 1 */ - background-color: #ff3333; } - .kuiMenuButton--danger:disabled { - color: #FFF; - background-color: #535966; - cursor: not-allowed; } - .kuiMenuButton--danger:focus { - z-index: 1; - /* 1 */ - outline: none !important; - /* 2 */ - -webkit-box-shadow: 0 0 0 1px #1D1E24, 0 0 0 2px #F66; - box-shadow: 0 0 0 1px #1D1E24, 0 0 0 2px #F66; - /* 3 */ } - -.kuiMenuButtonGroup { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; } - .kuiMenuButtonGroup .kuiMenuButton + .kuiMenuButton { - margin-left: 4px; } - -.kuiMenuButtonGroup--alignRight { - -webkit-box-pack: end; - -webkit-justify-content: flex-end; - -ms-flex-pack: end; - justify-content: flex-end; } - -.kuiModalOverlay { - position: fixed; - z-index: 1000; - top: 0; - left: 0; - right: 0; - bottom: 0; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -webkit-align-items: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-bottom: 10vh; - background: rgba(52, 55, 65, 0.8); } - -.kuiModal { - -webkit-box-shadow: 0 12px 24px 0 rgba(0, 0, 0, 0.1), 0 6px 12px 0 rgba(0, 0, 0, 0.1), 0 4px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.1); - box-shadow: 0 12px 24px 0 rgba(0, 0, 0, 0.1), 0 6px 12px 0 rgba(0, 0, 0, 0.1), 0 4px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.1); - line-height: 1.5; - background-color: #1D1E24; - border: 1px solid #343741; - border-radius: 4px; - z-index: 1001; - -webkit-animation: kuiModal 350ms cubic-bezier(0.34, 1.61, 0.7, 1); - animation: kuiModal 350ms cubic-bezier(0.34, 1.61, 0.7, 1); } - -.kuiModal--confirmation { - width: 450px; - min-width: auto; } - -.kuiModalHeader { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: justify; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; - -webkit-box-align: center; - -webkit-align-items: center; - -ms-flex-align: center; - align-items: center; - padding: 10px; - padding-left: 20px; - border-bottom: 1px solid #343741; } - -.kuiModalHeader__title { - font-size: 20px; } - -.kuiModalHeaderCloseButton { - display: inline-block; - /* 1 */ - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - cursor: pointer; - padding: 2px 5px; - border: 1px solid transparent; - color: #98A2B3; - background-color: transparent; - line-height: 1; - /* 2 */ - font-size: 20px; } - .kuiModalHeaderCloseButton:hover { - color: #DFE5EF; } - -.kuiModalBody { - padding: 20px; } - -.kuiModalBodyText { - font-size: 14px; } - -.kuiModalFooter { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: end; - -webkit-justify-content: flex-end; - -ms-flex-pack: end; - justify-content: flex-end; - padding: 20px; - padding-top: 10px; } - .kuiModalFooter > * + * { - margin-left: 5px; } - -@-webkit-keyframes kuiModal { - 0% { - opacity: 0; - -webkit-transform: translateY(32px); - transform: translateY(32px); } - 100% { - opacity: 1; - -webkit-transform: translateY(0); - transform: translateY(0); } } - -@keyframes kuiModal { - 0% { - opacity: 0; - -webkit-transform: translateY(32px); - transform: translateY(32px); } - 100% { - opacity: 1; - -webkit-transform: translateY(0); - transform: translateY(0); } } - /** * 1. Put 10px of space between each child. */ @@ -2090,107 +1811,6 @@ main { .kuiPanelBody { padding: 10px; } -.kuiPanelSimple { - -webkit-box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.3), 0 1px 5px -2px rgba(0, 0, 0, 0.3); - box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.3), 0 1px 5px -2px rgba(0, 0, 0, 0.3); - background-color: #1D1E24; - border: 1px solid #343741; - border-radius: 4px; - -webkit-box-flex: 1; - -webkit-flex-grow: 1; - -ms-flex-positive: 1; - flex-grow: 1; } - .kuiPanelSimple.kuiPanelSimple--paddingSmall { - padding: 8px; } - .kuiPanelSimple.kuiPanelSimple--paddingMedium { - padding: 16px; } - .kuiPanelSimple.kuiPanelSimple--paddingLarge { - padding: 24px; } - .kuiPanelSimple.kuiPanelSimple--shadow { - -webkit-box-shadow: 0 16px 16px -8px rgba(0, 0, 0, 0.1); - box-shadow: 0 16px 16px -8px rgba(0, 0, 0, 0.1); } - .kuiPanelSimple.kuiPanelSimple--flexGrowZero { - -webkit-box-flex: 0; - -webkit-flex-grow: 0; - -ms-flex-positive: 0; - flex-grow: 0; } - -.kuiPopover { - display: inline-block; - position: relative; } - .kuiPopover.kuiPopover-isOpen .kuiPopover__panel { - opacity: 1; - visibility: visible; - margin-top: 8px; - pointer-events: auto; } - -.kuiPopover__panel { - position: absolute; - z-index: 2000; - top: 100%; - left: 50%; - -webkit-transform: translateX(-50%) translateY(8px) translateZ(0); - transform: translateX(-50%) translateY(8px) translateZ(0); - -webkit-backface-visibility: hidden; - backface-visibility: hidden; - -webkit-transition: opacity cubic-bezier(0.34, 1.61, 0.7, 1) 350ms, visibility cubic-bezier(0.34, 1.61, 0.7, 1) 350ms, margin-top cubic-bezier(0.34, 1.61, 0.7, 1) 350ms; - transition: opacity cubic-bezier(0.34, 1.61, 0.7, 1) 350ms, visibility cubic-bezier(0.34, 1.61, 0.7, 1) 350ms, margin-top cubic-bezier(0.34, 1.61, 0.7, 1) 350ms; - -webkit-transform-origin: center top; - transform-origin: center top; - opacity: 0; - visibility: hidden; - pointer-events: none; - margin-top: 24px; } - .kuiPopover__panel:before { - position: absolute; - content: ""; - top: -16px; - height: 0; - width: 0; - left: 50%; - margin-left: -16px; - border-left: 16px solid transparent; - border-right: 16px solid transparent; - border-bottom: 16px solid #343741; } - .kuiPopover__panel:after { - position: absolute; - content: ""; - top: -15px; - right: 0; - height: 0; - left: 50%; - margin-left: -16px; - width: 0; - border-left: 16px solid transparent; - border-right: 16px solid transparent; - border-bottom: 16px solid #1D1E24; } - -.kuiPopover--withTitle .kuiPopover__panel:after { - border-bottom-color: #25262E; } - -.kuiPopover--anchorLeft .kuiPopover__panel { - left: 0; - -webkit-transform: translateX(0%) translateY(8px) translateZ(0); - transform: translateX(0%) translateY(8px) translateZ(0); } - .kuiPopover--anchorLeft .kuiPopover__panel:before, .kuiPopover--anchorLeft .kuiPopover__panel:after { - right: auto; - left: 16px; - margin: 0; } - -.kuiPopover--anchorRight .kuiPopover__panel { - left: 100%; - -webkit-transform: translateX(-100%) translateY(8px) translateZ(0); - transform: translateX(-100%) translateY(8px) translateZ(0); } - .kuiPopover--anchorRight .kuiPopover__panel:before, .kuiPopover--anchorRight .kuiPopover__panel:after { - right: 16px; - left: auto; } - -.kuiPopoverTitle { - background-color: #25262E; - border-bottom: 1px solid #343741; - padding: 12px; - font-size: 16px; } - .kuiEmptyTablePrompt { display: -webkit-box; display: -webkit-flex; @@ -2497,57 +2117,6 @@ main { background-color: transparent; border-bottom-color: transparent; } -/** - * 1. Allow container to determine font-size and line-height. - * 2. Override inherited Bootstrap styles. - */ -.kuiToggleButton { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - cursor: pointer; - background-color: transparent; - border: none; - padding: 0; - font-size: inherit; - /* 1 */ - line-height: inherit; - /* 1 */ - color: #DFE5EF; } - .kuiToggleButton:focus { - color: #DFE5EF; } - .kuiToggleButton:active { - color: #1BA9F5 !important; - /* 2 */ } - .kuiToggleButton:hover:not(:disabled) { - color: #098dd4 !important; - /* 2 */ - text-decoration: underline; } - .kuiToggleButton:disabled { - cursor: not-allowed; - opacity: .5; } - -/** - * 1. Make icon a consistent width so the text doesn't get pushed around as the icon changes - * between "expand" and "collapse". Use ems to be relative to inherited font-size. - */ -.kuiToggleButton__icon { - width: 0.8em; - /* 1 */ } - -.kuiTogglePanelHeader { - padding-bottom: 4px; - margin-bottom: 15px; - border-bottom: 1px solid #343741; - /** - * 1. Allow the user to click anywhere on the header, not just on the button text. - */ } - .kuiTogglePanelHeader .kuiToggleButton { - width: 100%; - /* 1 */ - text-align: left; - /* 1 */ } - .kuiToolBar { display: -webkit-box; display: -webkit-flex; diff --git a/packages/kbn-ui-framework/dist/kui_light.css b/packages/kbn-ui-framework/dist/kui_light.css index 8668bac99b64..3e82873d53aa 100644 --- a/packages/kbn-ui-framework/dist/kui_light.css +++ b/packages/kbn-ui-framework/dist/kui_light.css @@ -492,29 +492,6 @@ main { .kuiCollapseButton:hover { opacity: 1; } -.kuiExpression { - padding: 20px; - white-space: nowrap; } - -.kuiExpressionButton { - background-color: transparent; - padding: 5px 0px; - border: none; - border-bottom: dotted 2px #D3DAE6; - font-size: 16px; - cursor: pointer; } - -.kuiExpressionButton__description { - color: #017D73; - text-transform: uppercase; } - -.kuiExpressionButton__value { - color: #343741; - text-transform: lowercase; } - -.kuiExpressionButton-isActive { - border-bottom: solid 2px #017D73; } - /** * 1. Set inline-block so this wrapper shrinks to fit the input. */ @@ -1635,262 +1612,6 @@ main { padding: 0; display: none; } -/** - * 1. Allow class to be applied to `ul` and `ol` elements - */ -.kuiMenu { - padding-left: 0; - /* 1 */ } - -.kuiMenu--contained { - border: 1px solid #D3DAE6; } - .kuiMenu--contained .kuiMenuItem { - padding: 6px 10px; } - -/** - * 1. Allow class to be applied to `li` elements - */ -.kuiMenuItem { - list-style: none; - /* 1 */ - padding: 6px 0; } - .kuiMenuItem + .kuiMenuItem { - border-top: 1px solid #D3DAE6; } - -/** - * 1. Setting to inline-block guarantees the same height when applied to both - * button elements and anchor tags. - * 2. Disable for Angular. - * 3. Make the button just tall enough to fit inside an Option Layout. - */ -.kuiMenuButton { - display: inline-block; - /* 1 */ - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - cursor: pointer; - padding: 2px 10px; - /* 3 */ - font-size: 12px; - font-weight: 400; - line-height: 1.5; - text-decoration: none; - border: none; - border-radius: 4px; } - .kuiMenuButton:disabled { - cursor: default; - pointer-events: none; - /* 2 */ } - .kuiMenuButton:active:enabled { - -webkit-transform: translateY(1px); - transform: translateY(1px); } - .kuiMenuButton:focus { - z-index: 1; - /* 1 */ - outline: none !important; - /* 2 */ - -webkit-box-shadow: 0 0 0 1px #FFF, 0 0 0 2px #006BB4; - box-shadow: 0 0 0 1px #FFF, 0 0 0 2px #006BB4; - /* 3 */ } - -.kuiMenuButton--iconText .kuiMenuButton__icon:first-child { - margin-right: 4px; } - -.kuiMenuButton--iconText .kuiMenuButton__icon:last-child { - margin-left: 4px; } - -/** - * 1. Override Bootstrap. - * 2. Safari won't respect :enabled:hover/active on links. - */ -.kuiMenuButton--basic { - color: #343741; - background-color: #FFF; } - .kuiMenuButton--basic:focus { - color: #343741 !important; - /* 1 */ } - .kuiMenuButton--basic:hover, .kuiMenuButton--basic:active { - /* 2 */ - color: #343741 !important; - /* 1 */ - background-color: #F5F7FA; } - .kuiMenuButton--basic:disabled { - color: #98A2B3; - cursor: not-allowed; } - -/** - * 1. Override Bootstrap. - * 2. Safari won't respect :enabled:hover/active on links. - */ -.kuiMenuButton--primary { - color: #FFF; - background-color: #006BB4; } - .kuiMenuButton--primary:focus { - color: #FFF !important; - /* 1 */ } - .kuiMenuButton--primary:hover, .kuiMenuButton--primary:active { - /* 2 */ - color: #FFF !important; - /* 1 */ - background-color: #004d81; } - .kuiMenuButton--primary:disabled { - background-color: #98A2B3; - cursor: not-allowed; } - -/** - * 1. Override Bootstrap. - * 2. Safari won't respect :enabled:hover/active on links. - */ -.kuiMenuButton--danger { - color: #FFF; - background-color: #BD271E; } - .kuiMenuButton--danger:hover, .kuiMenuButton--danger:active { - /* 2 */ - color: #FFF !important; - /* 1 */ - background-color: #911e17; } - .kuiMenuButton--danger:disabled { - color: #FFF; - background-color: #98A2B3; - cursor: not-allowed; } - .kuiMenuButton--danger:focus { - z-index: 1; - /* 1 */ - outline: none !important; - /* 2 */ - -webkit-box-shadow: 0 0 0 1px #FFF, 0 0 0 2px #BD271E; - box-shadow: 0 0 0 1px #FFF, 0 0 0 2px #BD271E; - /* 3 */ } - -.kuiMenuButtonGroup { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; } - .kuiMenuButtonGroup .kuiMenuButton + .kuiMenuButton { - margin-left: 4px; } - -.kuiMenuButtonGroup--alignRight { - -webkit-box-pack: end; - -webkit-justify-content: flex-end; - -ms-flex-pack: end; - justify-content: flex-end; } - -.kuiModalOverlay { - position: fixed; - z-index: 1000; - top: 0; - left: 0; - right: 0; - bottom: 0; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -webkit-align-items: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-bottom: 10vh; - background: rgba(255, 255, 255, 0.8); } - -.kuiModal { - -webkit-box-shadow: 0 12px 24px 0 rgba(65, 78, 101, 0.1), 0 6px 12px 0 rgba(65, 78, 101, 0.1), 0 4px 4px 0 rgba(65, 78, 101, 0.1), 0 2px 2px 0 rgba(65, 78, 101, 0.1); - box-shadow: 0 12px 24px 0 rgba(65, 78, 101, 0.1), 0 6px 12px 0 rgba(65, 78, 101, 0.1), 0 4px 4px 0 rgba(65, 78, 101, 0.1), 0 2px 2px 0 rgba(65, 78, 101, 0.1); - line-height: 1.5; - background-color: #FFF; - border: 1px solid #D3DAE6; - border-radius: 4px; - z-index: 1001; - -webkit-animation: kuiModal 350ms cubic-bezier(0.34, 1.61, 0.7, 1); - animation: kuiModal 350ms cubic-bezier(0.34, 1.61, 0.7, 1); } - -.kuiModal--confirmation { - width: 450px; - min-width: auto; } - -.kuiModalHeader { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: justify; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; - -webkit-box-align: center; - -webkit-align-items: center; - -ms-flex-align: center; - align-items: center; - padding: 10px; - padding-left: 20px; - border-bottom: 1px solid #D3DAE6; } - -.kuiModalHeader__title { - font-size: 20px; } - -.kuiModalHeaderCloseButton { - display: inline-block; - /* 1 */ - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - cursor: pointer; - padding: 2px 5px; - border: 1px solid transparent; - color: #69707D; - background-color: transparent; - line-height: 1; - /* 2 */ - font-size: 20px; } - .kuiModalHeaderCloseButton:hover { - color: #343741; } - -.kuiModalBody { - padding: 20px; } - -.kuiModalBodyText { - font-size: 14px; } - -.kuiModalFooter { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: end; - -webkit-justify-content: flex-end; - -ms-flex-pack: end; - justify-content: flex-end; - padding: 20px; - padding-top: 10px; } - .kuiModalFooter > * + * { - margin-left: 5px; } - -@-webkit-keyframes kuiModal { - 0% { - opacity: 0; - -webkit-transform: translateY(32px); - transform: translateY(32px); } - 100% { - opacity: 1; - -webkit-transform: translateY(0); - transform: translateY(0); } } - -@keyframes kuiModal { - 0% { - opacity: 0; - -webkit-transform: translateY(32px); - transform: translateY(32px); } - 100% { - opacity: 1; - -webkit-transform: translateY(0); - transform: translateY(0); } } - /** * 1. Put 10px of space between each child. */ @@ -2090,107 +1811,6 @@ main { .kuiPanelBody { padding: 10px; } -.kuiPanelSimple { - -webkit-box-shadow: 0 2px 2px -1px rgba(152, 162, 179, 0.3), 0 1px 5px -2px rgba(152, 162, 179, 0.3); - box-shadow: 0 2px 2px -1px rgba(152, 162, 179, 0.3), 0 1px 5px -2px rgba(152, 162, 179, 0.3); - background-color: #FFF; - border: 1px solid #D3DAE6; - border-radius: 4px; - -webkit-box-flex: 1; - -webkit-flex-grow: 1; - -ms-flex-positive: 1; - flex-grow: 1; } - .kuiPanelSimple.kuiPanelSimple--paddingSmall { - padding: 8px; } - .kuiPanelSimple.kuiPanelSimple--paddingMedium { - padding: 16px; } - .kuiPanelSimple.kuiPanelSimple--paddingLarge { - padding: 24px; } - .kuiPanelSimple.kuiPanelSimple--shadow { - -webkit-box-shadow: 0 16px 16px -8px rgba(0, 0, 0, 0.1); - box-shadow: 0 16px 16px -8px rgba(0, 0, 0, 0.1); } - .kuiPanelSimple.kuiPanelSimple--flexGrowZero { - -webkit-box-flex: 0; - -webkit-flex-grow: 0; - -ms-flex-positive: 0; - flex-grow: 0; } - -.kuiPopover { - display: inline-block; - position: relative; } - .kuiPopover.kuiPopover-isOpen .kuiPopover__panel { - opacity: 1; - visibility: visible; - margin-top: 8px; - pointer-events: auto; } - -.kuiPopover__panel { - position: absolute; - z-index: 2000; - top: 100%; - left: 50%; - -webkit-transform: translateX(-50%) translateY(8px) translateZ(0); - transform: translateX(-50%) translateY(8px) translateZ(0); - -webkit-backface-visibility: hidden; - backface-visibility: hidden; - -webkit-transition: opacity cubic-bezier(0.34, 1.61, 0.7, 1) 350ms, visibility cubic-bezier(0.34, 1.61, 0.7, 1) 350ms, margin-top cubic-bezier(0.34, 1.61, 0.7, 1) 350ms; - transition: opacity cubic-bezier(0.34, 1.61, 0.7, 1) 350ms, visibility cubic-bezier(0.34, 1.61, 0.7, 1) 350ms, margin-top cubic-bezier(0.34, 1.61, 0.7, 1) 350ms; - -webkit-transform-origin: center top; - transform-origin: center top; - opacity: 0; - visibility: hidden; - pointer-events: none; - margin-top: 24px; } - .kuiPopover__panel:before { - position: absolute; - content: ""; - top: -16px; - height: 0; - width: 0; - left: 50%; - margin-left: -16px; - border-left: 16px solid transparent; - border-right: 16px solid transparent; - border-bottom: 16px solid #D3DAE6; } - .kuiPopover__panel:after { - position: absolute; - content: ""; - top: -15px; - right: 0; - height: 0; - left: 50%; - margin-left: -16px; - width: 0; - border-left: 16px solid transparent; - border-right: 16px solid transparent; - border-bottom: 16px solid #FFF; } - -.kuiPopover--withTitle .kuiPopover__panel:after { - border-bottom-color: #F5F7FA; } - -.kuiPopover--anchorLeft .kuiPopover__panel { - left: 0; - -webkit-transform: translateX(0%) translateY(8px) translateZ(0); - transform: translateX(0%) translateY(8px) translateZ(0); } - .kuiPopover--anchorLeft .kuiPopover__panel:before, .kuiPopover--anchorLeft .kuiPopover__panel:after { - right: auto; - left: 16px; - margin: 0; } - -.kuiPopover--anchorRight .kuiPopover__panel { - left: 100%; - -webkit-transform: translateX(-100%) translateY(8px) translateZ(0); - transform: translateX(-100%) translateY(8px) translateZ(0); } - .kuiPopover--anchorRight .kuiPopover__panel:before, .kuiPopover--anchorRight .kuiPopover__panel:after { - right: 16px; - left: auto; } - -.kuiPopoverTitle { - background-color: #F5F7FA; - border-bottom: 1px solid #D3DAE6; - padding: 12px; - font-size: 16px; } - .kuiEmptyTablePrompt { display: -webkit-box; display: -webkit-flex; @@ -2497,57 +2117,6 @@ main { background-color: transparent; border-bottom-color: transparent; } -/** - * 1. Allow container to determine font-size and line-height. - * 2. Override inherited Bootstrap styles. - */ -.kuiToggleButton { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - cursor: pointer; - background-color: transparent; - border: none; - padding: 0; - font-size: inherit; - /* 1 */ - line-height: inherit; - /* 1 */ - color: #343741; } - .kuiToggleButton:focus { - color: #343741; } - .kuiToggleButton:active { - color: #006BB4 !important; - /* 2 */ } - .kuiToggleButton:hover:not(:disabled) { - color: #004d81 !important; - /* 2 */ - text-decoration: underline; } - .kuiToggleButton:disabled { - cursor: not-allowed; - opacity: .5; } - -/** - * 1. Make icon a consistent width so the text doesn't get pushed around as the icon changes - * between "expand" and "collapse". Use ems to be relative to inherited font-size. - */ -.kuiToggleButton__icon { - width: 0.8em; - /* 1 */ } - -.kuiTogglePanelHeader { - padding-bottom: 4px; - margin-bottom: 15px; - border-bottom: 1px solid #D3DAE6; - /** - * 1. Allow the user to click anywhere on the header, not just on the button text. - */ } - .kuiTogglePanelHeader .kuiToggleButton { - width: 100%; - /* 1 */ - text-align: left; - /* 1 */ } - .kuiToolBar { display: -webkit-box; display: -webkit-flex; diff --git a/packages/kbn-ui-framework/doc_site/src/services/routes/routes.js b/packages/kbn-ui-framework/doc_site/src/services/routes/routes.js index e7cd43d35e2b..32912d5eb9c8 100644 --- a/packages/kbn-ui-framework/doc_site/src/services/routes/routes.js +++ b/packages/kbn-ui-framework/doc_site/src/services/routes/routes.js @@ -19,184 +19,136 @@ import Slugify from '../string/slugify'; -import BarExample - from '../../views/bar/bar_example'; +import BarExample from '../../views/bar/bar_example'; -import ButtonExample - from '../../views/button/button_example'; +import ButtonExample from '../../views/button/button_example'; -import CollapseButtonExample - from '../../views/collapse_button/collapse_button_example'; +import CollapseButtonExample from '../../views/collapse_button/collapse_button_example'; -import ExpressionExample - from '../../views/expression/expression_example'; -import FormExample - from '../../views/form/form_example'; +import FormExample from '../../views/form/form_example'; -import FormLayoutExample - from '../../views/form_layout/form_layout_example'; +import FormLayoutExample from '../../views/form_layout/form_layout_example'; -import IconExample - from '../../views/icon/icon_example'; +import IconExample from '../../views/icon/icon_example'; -import InfoPanelExample - from '../../views/info_panel/info_panel_example'; +import InfoPanelExample from '../../views/info_panel/info_panel_example'; -import LinkExample - from '../../views/link/link_example'; +import LinkExample from '../../views/link/link_example'; -import LocalNavExample - from '../../views/local_nav/local_nav_example'; +import LocalNavExample from '../../views/local_nav/local_nav_example'; -import MenuExample - from '../../views/menu/menu_example'; +import PagerExample from '../../views/pager/pager_example'; -import MenuButtonExample - from '../../views/menu_button/menu_button_example'; +import PanelExample from '../../views/panel/panel_example'; -import ModalExample - from '../../views/modal/modal_example'; +import EmptyTablePromptExample from '../../views/empty_table_prompt/empty_table_prompt_example'; -import PagerExample - from '../../views/pager/pager_example'; +import StatusTextExample from '../../views/status_text/status_text_example'; -import PanelExample - from '../../views/panel/panel_example'; +import TableExample from '../../views/table/table_example'; -import PanelSimpleExample - from '../../views/panel_simple/panel_simple_example'; +import TabsExample from '../../views/tabs/tabs_example'; -import PopoverExample - from '../../views/popover/popover_example'; +import ToolBarExample from '../../views/tool_bar/tool_bar_example'; -import EmptyTablePromptExample - from '../../views/empty_table_prompt/empty_table_prompt_example'; +import TypographyExample from '../../views/typography/typography_example'; -import StatusTextExample - from '../../views/status_text/status_text_example'; +import VerticalRhythmExample from '../../views/vertical_rhythm/vertical_rhythm_example'; -import TableExample - from '../../views/table/table_example'; - -import TabsExample - from '../../views/tabs/tabs_example'; - -import ToggleButtonExample - from '../../views/toggle_button/toggle_button_example'; - -import ToolBarExample - from '../../views/tool_bar/tool_bar_example'; - -import TypographyExample - from '../../views/typography/typography_example'; - -import VerticalRhythmExample - from '../../views/vertical_rhythm/vertical_rhythm_example'; - -import ViewSandbox - from '../../views/view/view_sandbox'; +import ViewSandbox from '../../views/view/view_sandbox'; // Component route names should match the component name exactly. -const components = [{ - name: 'Bar', - component: BarExample, - hasReact: true, -}, { - name: 'Button', - component: ButtonExample, - hasReact: true, -}, { - name: 'CollapseButton', - component: CollapseButtonExample, - hasReact: true, -}, { - name: 'CollapseButton', - component: CollapseButtonExample, - hasReact: true, -}, { - name: 'EmptyTablePrompt', - component: EmptyTablePromptExample, - hasReact: true, -}, { - name: 'Expression', - component: ExpressionExample, - hasReact: true, -}, { - name: 'Form', - component: FormExample, -}, { - name: 'FormLayout', - component: FormLayoutExample, - hasReact: true, -}, { - name: 'Icon', - component: IconExample, -}, { - name: 'InfoPanel', - component: InfoPanelExample, -}, { - name: 'Link', - component: LinkExample, -}, { - name: 'LocalNav', - component: LocalNavExample, - hasReact: true, -}, { - name: 'Menu', - component: MenuExample, - hasReact: true, -}, { - name: 'MenuButton', - component: MenuButtonExample, -}, { - name: 'Modal', - component: ModalExample, - hasReact: true, -}, { - name: 'Pager', - component: PagerExample, - hasReact: true, -}, { - name: 'Panel', - component: PanelExample, -}, { - name: 'PanelSimple', - component: PanelSimpleExample, - hasReact: true, -}, { - name: 'Popover', - component: PopoverExample, - hasReact: true, -}, { - name: 'StatusText', - component: StatusTextExample, -}, { - name: 'Table', - component: TableExample, - hasReact: true, -}, { - name: 'Tabs', - component: TabsExample, - hasReact: true, -}, { - name: 'ToggleButton', - component: ToggleButtonExample, -}, { - name: 'ToolBar', - component: ToolBarExample, - hasReact: true, -}, { - name: 'Typography', - component: TypographyExample, -}, { - name: 'VerticalRhythm', - component: VerticalRhythmExample, -}]; +const components = [ + { + name: 'Bar', + component: BarExample, + hasReact: true, + }, + { + name: 'Button', + component: ButtonExample, + hasReact: true, + }, + { + name: 'CollapseButton', + component: CollapseButtonExample, + hasReact: true, + }, + { + name: 'EmptyTablePrompt', + component: EmptyTablePromptExample, + hasReact: true, + }, + { + name: 'Form', + component: FormExample, + }, + { + name: 'FormLayout', + component: FormLayoutExample, + hasReact: true, + }, + { + name: 'Icon', + component: IconExample, + }, + { + name: 'InfoPanel', + component: InfoPanelExample, + }, + { + name: 'Link', + component: LinkExample, + }, + { + name: 'LocalNav', + component: LocalNavExample, + hasReact: true, + }, + { + name: 'Pager', + component: PagerExample, + hasReact: true, + }, + { + name: 'Panel', + component: PanelExample, + }, + { + name: 'StatusText', + component: StatusTextExample, + }, + { + name: 'Table', + component: TableExample, + hasReact: true, + }, + { + name: 'Tabs', + component: TabsExample, + hasReact: true, + }, + { + name: 'ToolBar', + component: ToolBarExample, + hasReact: true, + }, + { + name: 'Typography', + component: TypographyExample, + }, + { + name: 'VerticalRhythm', + component: VerticalRhythmExample, + }, +]; -const sandboxes = [{ - name: 'View', - component: ViewSandbox, -}]; +const sandboxes = [ + { + name: 'View', + component: ViewSandbox, + }, +]; const allRoutes = components.concat(sandboxes); diff --git a/packages/kbn-ui-framework/doc_site/src/views/expression/expression.js b/packages/kbn-ui-framework/doc_site/src/views/expression/expression.js deleted file mode 100644 index 754b083c72cd..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/expression/expression.js +++ /dev/null @@ -1,220 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import PropTypes from 'prop-types'; -import { - KuiExpression, - KuiExpressionButton, - KuiFieldGroup, - KuiFieldGroupSection, - KuiPopover, - KuiPopoverTitle, -} from '../../../../components'; - - -class KuiExpressionItemExample extends React.Component { - constructor(props) { - super(props); - - this.state = { - example1: { - isOpen: false, - value: 'count()' - }, - example2: { - object: 'A', - value: '100', - description: 'Is above' - }, - }; - } - - openExample1 = () => { - this.setState({ - example1: { - ...this.state.example1, - isOpen: true, - }, - example2: { - ...this.state.example2, - isOpen: false, - }, - }); - }; - - closeExample1 = () => { - this.setState({ - example1: { - ...this.state.example1, - isOpen: false, - }, - }); - }; - - openExample2 = () => { - this.setState({ - example1: { - ...this.state.example1, - isOpen: false, - }, - example2: { - ...this.state.example2, - isOpen: true, - }, - }); - }; - - closeExample2 = () => { - this.setState({ - example2: { - ...this.state.example2, - isOpen: false, - }, - }); - }; - - changeExample1 = (event) => { - this.setState({ example1: { ...this.state.example1, value: event.target.value } }); - } - - changeExample2Object = (event) => { - this.setState({ example2: { ...this.state.example2, object: event.target.value } }); - } - - changeExample2Value = (event) => { - this.setState({ example2: { ...this.state.example2, value: event.target.value } }); - } - - changeExample2Description = (event) => { - this.setState({ example2: { ...this.state.example2, description: event.target.value } }); - } - - render() { - // Rise the popovers above GuidePageSideNav - const popoverStyle = { zIndex: '200' }; - - return ( - - - - )} - isOpen={this.state.example1.isOpen} - closePopover={this.closeExample1} - panelPaddingSize="none" - withTitle - > - {this.getPopover1(popoverStyle)} - - - - - - )} - isOpen={this.state.example2.isOpen} - closePopover={this.closeExample2} - panelPaddingSize="none" - withTitle - anchorPosition="left" - > - {this.getPopover2(popoverStyle)} - - - - ); - } - - getPopover1(popoverStyle) { - return ( -
- When - - - -
- ); - } - - getPopover2(popoverStyle) { - return ( -
- {this.state.example2.description} - - - - - - - -
- ); - } -} - -KuiExpressionItemExample.propTypes = { - defaultActiveButton: PropTypes.string.isRequired -}; - -export default KuiExpressionItemExample; diff --git a/packages/kbn-ui-framework/doc_site/src/views/expression/expression_example.js b/packages/kbn-ui-framework/doc_site/src/views/expression/expression_example.js deleted file mode 100644 index c85c8305d685..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/expression/expression_example.js +++ /dev/null @@ -1,59 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -/* eslint-disable import/no-duplicates */ - -import React from 'react'; -import { renderToHtml } from '../../services'; - -import { - GuideDemo, - GuidePage, - GuideSection, - GuideSectionTypes, - GuideText, -} from '../../components'; - -import Expression from './expression'; -import expressionSource from '!!raw-loader!./expression'; -const expressionHtml = renderToHtml(Expression, { defaultActiveButton: 'example2' }); - -export default props => ( - - - - ExpressionButtons allow you to compress a complicated form into a small space. - - - - - - - - -); diff --git a/packages/kbn-ui-framework/doc_site/src/views/menu/menu.js b/packages/kbn-ui-framework/doc_site/src/views/menu/menu.js deleted file mode 100644 index ca9b6ccc1925..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/menu/menu.js +++ /dev/null @@ -1,43 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; - -import { - KuiMenu, - KuiMenuItem, -} from '../../../../components'; - -export default () => ( -
- - -

Item A

- - - -

Item B

- - - -

Item C

- - -
-); diff --git a/packages/kbn-ui-framework/doc_site/src/views/menu/menu_contained.js b/packages/kbn-ui-framework/doc_site/src/views/menu/menu_contained.js deleted file mode 100644 index 0ab679613942..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/menu/menu_contained.js +++ /dev/null @@ -1,43 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; - -import { - KuiMenu, - KuiMenuItem, -} from '../../../../components'; - -export default () => ( -
- - -

Item A

- - - -

Item B

- - - -

Item C

- - -
-); diff --git a/packages/kbn-ui-framework/doc_site/src/views/menu/menu_example.js b/packages/kbn-ui-framework/doc_site/src/views/menu/menu_example.js deleted file mode 100644 index 8e31432a1ccc..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/menu/menu_example.js +++ /dev/null @@ -1,73 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -/* eslint-disable import/no-duplicates */ - -import React from 'react'; - -import { renderToHtml } from '../../services'; - -import { - GuideDemo, - GuidePage, - GuideSection, - GuideSectionTypes, -} from '../../components'; - -import Menu from './menu'; -import menuSource from '!!raw-loader!./menu'; -const menuHtml = renderToHtml(Menu); - -import MenuContained from './menu_contained'; -import menuContainedSource from '!!raw-loader!./menu_contained'; -const menuContainedHtml = renderToHtml(MenuContained); - -export default props => ( - - - - - - - - - - - - - -); diff --git a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_basic.html b/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_basic.html deleted file mode 100644 index 580701220dfe..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_basic.html +++ /dev/null @@ -1,9 +0,0 @@ - - -
- - diff --git a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_danger.html b/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_danger.html deleted file mode 100644 index 07463ba68ef5..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_danger.html +++ /dev/null @@ -1,9 +0,0 @@ - - -
- - diff --git a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_elements.html b/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_elements.html deleted file mode 100644 index b8090e21c299..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_elements.html +++ /dev/null @@ -1,17 +0,0 @@ - - -  - - - -  - - - Anchor element - diff --git a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_example.js b/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_example.js deleted file mode 100644 index 6677a7b29e52..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_example.js +++ /dev/null @@ -1,119 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; - -import { - GuideDemo, - GuidePage, - GuideSection, - GuideSectionTypes, - GuideText, -} from '../../components'; - -import basicHtml from './menu_button_basic.html'; -import primaryHtml from './menu_button_primary.html'; -import dangerHtml from './menu_button_danger.html'; -import withIconHtml from './menu_button_with_icon.html'; -import groupHtml from './menu_button_group.html'; -import elementsHtml from './menu_button_elements.html'; - -export default props => ( - - - - - - - - - - - - - - - - You can use a MenuButton with an Icon, with or without text. - - - - - - - - - - - - You can create a MenuButton using a button element, link, or input[type=“submit”]. - - - - - -); diff --git a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_group.html b/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_group.html deleted file mode 100644 index 05d959d730dc..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_group.html +++ /dev/null @@ -1,19 +0,0 @@ -
- - - -
- -
- -
- -
diff --git a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_primary.html b/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_primary.html deleted file mode 100644 index 67bed3fcbf81..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_primary.html +++ /dev/null @@ -1,9 +0,0 @@ - - -
- - diff --git a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_with_icon.html b/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_with_icon.html deleted file mode 100644 index 9ef05dca41a1..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/menu_button/menu_button_with_icon.html +++ /dev/null @@ -1,17 +0,0 @@ - - -
- - - -
- - diff --git a/packages/kbn-ui-framework/doc_site/src/views/modal/confirm_modal.js b/packages/kbn-ui-framework/doc_site/src/views/modal/confirm_modal.js deleted file mode 100644 index 8ef7e88fe149..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/modal/confirm_modal.js +++ /dev/null @@ -1,82 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React, { - Component, -} from 'react'; - -import { - KuiButton, - KuiConfirmModal, - KuiModalOverlay, - KUI_MODAL_CONFIRM_BUTTON, -} from '../../../../components'; - -export class ConfirmModalExample extends Component { - constructor(props) { - super(props); - - this.state = { - isModalVisible: false, - }; - - this.closeModal = this.closeModal.bind(this); - this.showModal = this.showModal.bind(this); - } - - closeModal() { - this.setState({ isModalVisible: false }); - } - - showModal() { - this.setState({ isModalVisible: true }); - } - - render() { - let modal; - - if (this.state.isModalVisible) { - modal = ( - - -

You’re about to do something.

-

Are you sure you want to do this?

- - - ); - } - - return ( -
- - Show ConfirmModal - - - {modal} -
- ); - } -} diff --git a/packages/kbn-ui-framework/doc_site/src/views/modal/modal.js b/packages/kbn-ui-framework/doc_site/src/views/modal/modal.js deleted file mode 100644 index 52fd031ccf42..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/modal/modal.js +++ /dev/null @@ -1,102 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React, { - Component, -} from 'react'; - -import { - KuiButton, - KuiModal, - KuiModalBody, - KuiModalFooter, - KuiModalHeader, - KuiModalHeaderTitle, - KuiModalOverlay, -} from '../../../../components'; - -export class ModalExample extends Component { - constructor(props) { - super(props); - - this.state = { - isModalVisible: false, - }; - } - - closeModal = () => { - this.setState({ isModalVisible: false }); - }; - - showModal = () => { - this.setState({ isModalVisible: true }); - }; - - render() { - let modal; - - if (this.state.isModalVisible) { - modal = ( - - - - - Modal - - - - -

- You can put anything you want in here! -

- - - - - Cancel - - - - Save - - - - - ); - } - return ( -
- - Show Modal - - - {modal} -
- ); - } -} diff --git a/packages/kbn-ui-framework/doc_site/src/views/modal/modal_example.js b/packages/kbn-ui-framework/doc_site/src/views/modal/modal_example.js deleted file mode 100644 index b21ee91ddb19..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/modal/modal_example.js +++ /dev/null @@ -1,81 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -/* eslint-disable import/no-duplicates */ - -import React from 'react'; - -import { renderToHtml } from '../../services'; - -import { - GuideCode, - GuideDemo, - GuidePage, - GuideSection, - GuideSectionTypes, - GuideText, -} from '../../components'; - -import { ModalExample } from './modal'; -import modalSource from '!!raw-loader!./modal'; // eslint-disable-line import/default -const modalHtml = renderToHtml(ModalExample); - -import { ConfirmModalExample } from './confirm_modal'; -import confirmModalSource from '!!raw-loader!./confirm_modal'; // eslint-disable-line import/default -const confirmModalHtml = renderToHtml(ConfirmModalExample); - -export default props => ( - - - - - Use a KuiModal to temporarily escape the current UX and create - another UX within it. - - - - - - - - - - - - - -); diff --git a/packages/kbn-ui-framework/doc_site/src/views/panel_simple/panel_simple.js b/packages/kbn-ui-framework/doc_site/src/views/panel_simple/panel_simple.js deleted file mode 100644 index 376e60335833..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/panel_simple/panel_simple.js +++ /dev/null @@ -1,56 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; - -import { - KuiPanelSimple, -} from '../../../../components'; - -export default () => ( -
- - sizePadding="none" - - -
- - - sizePadding="s" - - -
- - - sizePadding="m" - - -
- - - sizePadding="l" - - -
- - - sizePadding="l", hasShadow - -
-); diff --git a/packages/kbn-ui-framework/doc_site/src/views/panel_simple/panel_simple_example.js b/packages/kbn-ui-framework/doc_site/src/views/panel_simple/panel_simple_example.js deleted file mode 100644 index 3f7ffa2eec08..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/panel_simple/panel_simple_example.js +++ /dev/null @@ -1,64 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -/* eslint-disable import/no-duplicates */ - -import React from 'react'; - -import { Link } from 'react-router'; - -import { renderToHtml } from '../../services'; - -import { - GuideCode, - GuideDemo, - GuidePage, - GuideSection, - GuideSectionTypes, - GuideText, -} from '../../components'; - -import PanelSimple from './panel_simple'; -import panelSimpleSource from '!!raw-loader!./panel_simple'; -const panelSimpleHtml = renderToHtml(PanelSimple); - -export default props => ( - - - - PanelSimple is a simple wrapper component to add - depth to a contained layout. It it commonly used as a base for - other larger components like Popover. - - - - - - - -); diff --git a/packages/kbn-ui-framework/doc_site/src/views/popover/popover.js b/packages/kbn-ui-framework/doc_site/src/views/popover/popover.js deleted file mode 100644 index 59e47ef348b7..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/popover/popover.js +++ /dev/null @@ -1,68 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React, { - Component, -} from 'react'; - -import { - KuiPopover, - KuiButton, -} from '../../../../components'; - -export default class extends Component { - constructor(props) { - super(props); - - this.state = { - isPopoverOpen: false, - }; - } - - onButtonClick() { - this.setState({ - isPopoverOpen: !this.state.isPopoverOpen, - }); - } - - closePopover() { - this.setState({ - isPopoverOpen: false, - }); - } - - render() { - const button = ( - - Show popover - - ); - - return ( - -
Popover content that’s wider than the default width
- - ); - } -} diff --git a/packages/kbn-ui-framework/doc_site/src/views/popover/popover_anchor_position.js b/packages/kbn-ui-framework/doc_site/src/views/popover/popover_anchor_position.js deleted file mode 100644 index 54e0f97542ac..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/popover/popover_anchor_position.js +++ /dev/null @@ -1,98 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React, { - Component, -} from 'react'; - -import { - KuiPopover, - KuiButton, -} from '../../../../components'; - -export default class extends Component { - constructor(props) { - super(props); - - this.state = { - isPopoverOpen1: false, - isPopoverOpen2: false, - }; - } - - onButtonClick1() { - this.setState({ - isPopoverOpen1: !this.state.isPopoverOpen1, - }); - } - - closePopover1() { - this.setState({ - isPopoverOpen1: false, - }); - } - - onButtonClick2() { - this.setState({ - isPopoverOpen2: !this.state.isPopoverOpen2, - }); - } - - closePopover2() { - this.setState({ - isPopoverOpen2: false, - }); - } - - render() { - return ( -
- - Popover anchored to the right. - - )} - isOpen={this.state.isPopoverOpen1} - closePopover={this.closePopover1.bind(this)} - anchorPosition="right" - > - Popover content - - -   - - - Popover anchored to the left. - - )} - isOpen={this.state.isPopoverOpen2} - closePopover={this.closePopover2.bind(this)} - anchorPosition="left" - > - Popover content - -
- ); - } -} diff --git a/packages/kbn-ui-framework/doc_site/src/views/popover/popover_body_class_name.js b/packages/kbn-ui-framework/doc_site/src/views/popover/popover_body_class_name.js deleted file mode 100644 index e347c5a32118..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/popover/popover_body_class_name.js +++ /dev/null @@ -1,67 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React, { - Component, -} from 'react'; - -import { - KuiPopover, - KuiButton -} from '../../../../components'; - -export default class extends Component { - constructor(props) { - super(props); - - this.state = { - isPopoverOpen: false, - }; - } - - onButtonClick() { - this.setState({ - isPopoverOpen: !this.state.isPopoverOpen, - }); - } - - closePopover() { - this.setState({ - isPopoverOpen: false, - }); - } - - render() { - return ( - - Custom class - - )} - isOpen={this.state.isPopoverOpen} - closePopover={this.closePopover.bind(this)} - bodyClassName="yourClassNameHere" - > - It’s hard to tell but there’s a custom class on this element - - ); - } -} diff --git a/packages/kbn-ui-framework/doc_site/src/views/popover/popover_example.js b/packages/kbn-ui-framework/doc_site/src/views/popover/popover_example.js deleted file mode 100644 index 90317ad5c56c..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/popover/popover_example.js +++ /dev/null @@ -1,160 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -/* eslint-disable import/no-duplicates */ - -import React from 'react'; - -import { renderToHtml } from '../../services'; - -import { - GuideCode, - GuideDemo, - GuidePage, - GuideSection, - GuideSectionTypes, - GuideText, -} from '../../components'; - -import Popover from './popover'; -import popoverSource from '!!raw-loader!./popover'; -const popoverHtml = renderToHtml(Popover); - -import TrapFocus from './trap_focus'; -import trapFocusSource from '!!raw-loader!./trap_focus'; -const trapFocusHtml = renderToHtml(TrapFocus); - -import PopoverAnchorPosition from './popover_anchor_position'; -import popoverAnchorPositionSource from '!!raw-loader!./popover_anchor_position'; -const popoverAnchorPositionHtml = renderToHtml(PopoverAnchorPosition); - -import PopoverPanelClassName from './popover_panel_class_name'; -import popoverPanelClassNameSource from '!!raw-loader!./popover_panel_class_name'; -const popoverPanelClassNameHtml = renderToHtml(PopoverPanelClassName); - -import PopoverWithTitle from './popover_with_title'; -import popoverWithTitleSource from '!!raw-loader!./popover_with_title'; -const popoverWithTitleHtml = renderToHtml(PopoverWithTitle); - -export default props => ( - - - - Use the Popover component to hide controls or options behind a clickable element. - - - - - - - - - - If the Popover should be responsible for trapping the focus within itself (as opposed - to a child component), then you should set ownFocus. - - - - - - - - - - Popovers often have need for titling. This can be applied through - a prop or used separately as its own component - KuiPopoverTitle nested somewhere in the child - prop. - - - - - - - - - - The alignment and arrow on your popover can be set with - the anchorPosition prop. - - - - - - - - - - Use the panelPaddingSize prop to adjust the padding - on the panel within the panel. Use the panelClassName - prop to pass a custom class to the panel. - inside a popover. - - - - - - - -); diff --git a/packages/kbn-ui-framework/doc_site/src/views/popover/popover_panel_class_name.js b/packages/kbn-ui-framework/doc_site/src/views/popover/popover_panel_class_name.js deleted file mode 100644 index c3b98fc6ca3d..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/popover/popover_panel_class_name.js +++ /dev/null @@ -1,68 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React, { - Component, -} from 'react'; - -import { - KuiPopover, - KuiButton, -} from '../../../../components'; - -export default class extends Component { - constructor(props) { - super(props); - - this.state = { - isPopoverOpen: false, - }; - } - - onButtonClick() { - this.setState({ - isPopoverOpen: !this.state.isPopoverOpen, - }); - } - - closePopover() { - this.setState({ - isPopoverOpen: false, - }); - } - - render() { - return ( - - Turn padding off and apply a custom class - - )} - isOpen={this.state.isPopoverOpen} - closePopover={this.closePopover.bind(this)} - panelClassName="yourClassNameHere" - panelPaddingSize="none" - > - This should have no padding, and if you inspect, also a custom class. - - ); - } -} diff --git a/packages/kbn-ui-framework/doc_site/src/views/popover/popover_with_title.js b/packages/kbn-ui-framework/doc_site/src/views/popover/popover_with_title.js deleted file mode 100644 index ff25a54e1d60..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/popover/popover_with_title.js +++ /dev/null @@ -1,79 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React, { - Component, -} from 'react'; - -import { - KuiPopover, - KuiPopoverTitle, - KuiButton, -} from '../../../../components'; - -export default class extends Component { - constructor(props) { - super(props); - - this.state = { - isPopoverOpen: false, - }; - } - - onButtonClick() { - this.setState({ - isPopoverOpen: !this.state.isPopoverOpen, - }); - } - - closePopover() { - this.setState({ - isPopoverOpen: false, - }); - } - - render() { - const button = ( - - Show popover with Title - - ); - - return ( - -
- Hello, I’m a popover title -

- Popover content that’s wider than the default width -

-
- - ); - } -} diff --git a/packages/kbn-ui-framework/doc_site/src/views/popover/trap_focus.js b/packages/kbn-ui-framework/doc_site/src/views/popover/trap_focus.js deleted file mode 100644 index b034da504f3d..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/popover/trap_focus.js +++ /dev/null @@ -1,96 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React, { - Component, -} from 'react'; - -import { - KuiButton, - KuiFieldGroup, - KuiFieldGroupSection, - KuiPopover, -} from '../../../../components'; - -export default class extends Component { - constructor(props) { - super(props); - - this.state = { - isPopoverOpen: false, - }; - } - - onButtonClick() { - this.setState({ - isPopoverOpen: !this.state.isPopoverOpen, - }); - } - - closePopover() { - this.setState({ - isPopoverOpen: false, - }); - } - - render() { - const button = ( - - Show popover - - ); - - return ( - -
-
- - -
-
- -
- - - - - - -
- -
- Save -
-
- - ); - } -} diff --git a/packages/kbn-ui-framework/doc_site/src/views/table/table_with_menu_buttons.js b/packages/kbn-ui-framework/doc_site/src/views/table/table_with_menu_buttons.js index 4b1b06387686..49b4952de63a 100644 --- a/packages/kbn-ui-framework/doc_site/src/views/table/table_with_menu_buttons.js +++ b/packages/kbn-ui-framework/doc_site/src/views/table/table_with_menu_buttons.js @@ -28,86 +28,29 @@ import { KuiTableBody, } from '../../../../components'; -import { - RIGHT_ALIGNMENT -} from '../../../../src/services'; - export function TableWithMenuButtons() { return ( - - Reminder - - - A - - - B - - - C - - - Actions - + Reminder + A + B + C - - Core temperature critical - - - A - - - B - - - C - - -
- - - -
- + Core temperature critical + A + B + C - - Time for your snack - - - A - - - B - - - C - - -
- - - -
- + Time for your snack + A + B + C diff --git a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button.html b/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button.html deleted file mode 100644 index 33ae80390fe3..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button.html +++ /dev/null @@ -1,4 +0,0 @@ - diff --git a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button.js b/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button.js deleted file mode 100644 index 90fec3871cdc..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button.js +++ /dev/null @@ -1,17 +0,0 @@ -/* eslint-disable */ - -let isButtonCollapsed = true; -const $toggleButton = $('[data-id="toggleButton"]'); -const $toggleButtonIcon = $('[data-id="toggleButtonIcon"]'); - -$toggleButton.on('click', () => { - isButtonCollapsed = !isButtonCollapsed; - - if (isButtonCollapsed) { - $toggleButtonIcon.addClass('fa-caret-right'); - $toggleButtonIcon.removeClass('fa-caret-down'); - } else { - $toggleButtonIcon.removeClass('fa-caret-right'); - $toggleButtonIcon.addClass('fa-caret-down'); - } -}); diff --git a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button_disabled.html b/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button_disabled.html deleted file mode 100644 index 0b3790f5084e..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button_disabled.html +++ /dev/null @@ -1,4 +0,0 @@ - diff --git a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button_example.js b/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button_example.js deleted file mode 100644 index 6fd3a816e4fc..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_button_example.js +++ /dev/null @@ -1,86 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; - -import { - GuideDemo, - GuidePage, - GuideSection, - GuideSectionTypes, - GuideText, -} from '../../components'; - -import { - Link, -} from 'react-router'; - -import toggleButtonHtml from './toggle_button.html'; -import toggleButtonJs from 'raw-loader!./toggle_button.js'; -import toggleButtonDisabledHtml from './toggle_button_disabled.html'; -import togglePanelHtml from './toggle_panel.html'; -import togglePanelJs from 'raw-loader!./toggle_panel.js'; - -export default props => ( - - - - You can use this button to reveal and hide content. For a complete example - on how to make an collapsable panel proper accessible, read - the CollapseButton documentation. - - - - - - - - - - - - - -); diff --git a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_panel.html b/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_panel.html deleted file mode 100644 index 561a307d4c99..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_panel.html +++ /dev/null @@ -1,21 +0,0 @@ -
-
- -
- -
-

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis egestas dictum enim non lobortis. Curabitur vel viverra metus. Ut non dignissim neque. Nulla metus lorem, maximus et vehicula vel, pharetra vitae sem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Etiam mi risus, varius in elit a, scelerisque blandit dolor. Donec ut leo mi. Duis ac tincidunt urna. Sed finibus eros odio, vitae euismod turpis ullamcorper pulvinar. Sed in ipsum at magna euismod tristique. Donec eget orci blandit, convallis odio sed, hendrerit dui. Aenean augue nibh, hendrerit sit amet aliquet et, efficitur sit amet nulla. Vivamus placerat pulvinar ipsum, dignissim sodales libero pulvinar sit amet. Maecenas pellentesque neque at quam varius aliquam. Ut at pretium augue, a pellentesque neque.

-
-
diff --git a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_panel.js b/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_panel.js deleted file mode 100644 index 897662a814cf..000000000000 --- a/packages/kbn-ui-framework/doc_site/src/views/toggle_button/toggle_panel.js +++ /dev/null @@ -1,24 +0,0 @@ -/* eslint-disable */ - -let isButtonCollapsed = true; -const $togglePanelButton = $('[data-id="togglePanelButton"]'); -const $togglePanelButtonIcon = $('[data-id="togglePanelButtonIcon"]'); -const $togglePanelContent = $('[data-id="togglePanelContent"]'); - -$togglePanelButton.on('click', () => { - isButtonCollapsed = !isButtonCollapsed; - - $togglePanelButton.attr('aria-expanded', !isButtonCollapsed); - - if (isButtonCollapsed) { - $togglePanelButtonIcon.addClass('fa-caret-right'); - $togglePanelButtonIcon.removeClass('fa-caret-down'); - $togglePanelContent.hide(); - } else { - $togglePanelButtonIcon.removeClass('fa-caret-right'); - $togglePanelButtonIcon.addClass('fa-caret-down'); - $togglePanelContent.show(); - } -}); - -$togglePanelContent.hide(); diff --git a/packages/kbn-ui-framework/src/components/expression/__snapshots__/expression.test.js.snap b/packages/kbn-ui-framework/src/components/expression/__snapshots__/expression.test.js.snap deleted file mode 100644 index 6d83f6aad8da..000000000000 --- a/packages/kbn-ui-framework/src/components/expression/__snapshots__/expression.test.js.snap +++ /dev/null @@ -1,17 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`KuiExpression Props children is rendered 1`] = ` -
- some expression -
-`; - -exports[`KuiExpression renders 1`] = ` -
-`; diff --git a/packages/kbn-ui-framework/src/components/expression/__snapshots__/expression_button.test.js.snap b/packages/kbn-ui-framework/src/components/expression/__snapshots__/expression_button.test.js.snap deleted file mode 100644 index c3bbae52bd65..000000000000 --- a/packages/kbn-ui-framework/src/components/expression/__snapshots__/expression_button.test.js.snap +++ /dev/null @@ -1,57 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`KuiExpressionButton Props isActive false renders inactive 1`] = ` - -`; - -exports[`KuiExpressionButton Props isActive true renders active 1`] = ` - -`; - -exports[`KuiExpressionButton renders 1`] = ` - -`; diff --git a/packages/kbn-ui-framework/src/components/expression/_expression.scss b/packages/kbn-ui-framework/src/components/expression/_expression.scss deleted file mode 100644 index bb01f5fa8359..000000000000 --- a/packages/kbn-ui-framework/src/components/expression/_expression.scss +++ /dev/null @@ -1,27 +0,0 @@ -.kuiExpression { - padding: 20px; - white-space: nowrap; -} - -.kuiExpressionButton { - background-color: transparent; - padding: 5px 0px; - border: none; - border-bottom: dotted 2px $kuiBorderColor; - font-size: $kuiFontSize; - cursor: pointer; -} - -.kuiExpressionButton__description { - color: $expressionColorHighlight; - text-transform: uppercase; -} - -.kuiExpressionButton__value { - color: $kuiTextColor; - text-transform: lowercase; -} - -.kuiExpressionButton-isActive { - border-bottom: solid 2px $expressionColorHighlight; -} diff --git a/packages/kbn-ui-framework/src/components/expression/_index.scss b/packages/kbn-ui-framework/src/components/expression/_index.scss deleted file mode 100644 index 7d806e314a27..000000000000 --- a/packages/kbn-ui-framework/src/components/expression/_index.scss +++ /dev/null @@ -1,3 +0,0 @@ -$expressionColorHighlight: $euiColorSecondary; - -@import "expression"; diff --git a/packages/kbn-ui-framework/src/components/expression/expression.js b/packages/kbn-ui-framework/src/components/expression/expression.js deleted file mode 100644 index 4464a1b742ba..000000000000 --- a/packages/kbn-ui-framework/src/components/expression/expression.js +++ /dev/null @@ -1,44 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import PropTypes from 'prop-types'; -import classNames from 'classnames'; - -export const KuiExpression = ({ - children, - className, - ...rest -}) => { - const classes = classNames('kuiExpression', className); - - return ( -
- {children} -
- ); -}; - -KuiExpression.propTypes = { - children: PropTypes.node, - className: PropTypes.string -}; diff --git a/packages/kbn-ui-framework/src/components/expression/expression.test.js b/packages/kbn-ui-framework/src/components/expression/expression.test.js deleted file mode 100644 index 5043dff09aa3..000000000000 --- a/packages/kbn-ui-framework/src/components/expression/expression.test.js +++ /dev/null @@ -1,51 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; - -import { - KuiExpression, -} from './expression'; - -describe('KuiExpression', () => { - test('renders', () => { - const component = ( - - ); - - expect(render(component)).toMatchSnapshot(); - }); - - describe('Props', () => { - describe('children', () => { - test('is rendered', () => { - const component = render( - - some expression - - ); - - expect(component) - .toMatchSnapshot(); - }); - }); - }); -}); diff --git a/packages/kbn-ui-framework/src/components/expression/expression_button.js b/packages/kbn-ui-framework/src/components/expression/expression_button.js deleted file mode 100644 index fd63469c1eff..000000000000 --- a/packages/kbn-ui-framework/src/components/expression/expression_button.js +++ /dev/null @@ -1,58 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import PropTypes from 'prop-types'; -import classNames from 'classnames'; - -export const KuiExpressionButton = ({ - className, - description, - buttonValue, - isActive, - onClick, - ...rest -}) => { - const classes = classNames('kuiExpressionButton', className, { - 'kuiExpressionButton-isActive': isActive - }); - - return ( - - ); -}; - -KuiExpressionButton.propTypes = { - className: PropTypes.string, - description: PropTypes.string.isRequired, - buttonValue: PropTypes.string.isRequired, - isActive: PropTypes.bool.isRequired, - onClick: PropTypes.func.isRequired, -}; - -KuiExpressionButton.defaultProps = { - isActive: false, -}; diff --git a/packages/kbn-ui-framework/src/components/expression/expression_button.test.js b/packages/kbn-ui-framework/src/components/expression/expression_button.test.js deleted file mode 100644 index 69149b947662..000000000000 --- a/packages/kbn-ui-framework/src/components/expression/expression_button.test.js +++ /dev/null @@ -1,93 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render, shallow } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; -import sinon from 'sinon'; - -import { - KuiExpressionButton, -} from './expression_button'; - -describe('KuiExpressionButton', () => { - test('renders', () => { - const component = ( - {}} - {...requiredProps} - /> - ); - - expect(render(component)).toMatchSnapshot(); - }); - - describe('Props', () => { - describe('isActive', () => { - test('true renders active', () => { - const component = ( - {}} - /> - ); - - expect(render(component)).toMatchSnapshot(); - }); - - test('false renders inactive', () => { - const component = ( - {}} - /> - ); - - expect(render(component)).toMatchSnapshot(); - }); - }); - - describe('onClick', () => { - test('is called when the button is clicked', () => { - const onClickHandler = sinon.spy(); - - const button = shallow( - - ); - - button.simulate('click'); - - sinon.assert.calledOnce(onClickHandler); - }); - }); - }); -}); diff --git a/packages/kbn-ui-framework/src/components/expression/index.js b/packages/kbn-ui-framework/src/components/expression/index.js deleted file mode 100644 index 387e42553a62..000000000000 --- a/packages/kbn-ui-framework/src/components/expression/index.js +++ /dev/null @@ -1,21 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -export { KuiExpression } from './expression'; -export { KuiExpressionButton } from './expression_button'; diff --git a/packages/kbn-ui-framework/src/components/index.js b/packages/kbn-ui-framework/src/components/index.js index d1a94257abc9..7bc0f4aaf2cf 100644 --- a/packages/kbn-ui-framework/src/components/index.js +++ b/packages/kbn-ui-framework/src/components/index.js @@ -17,22 +17,11 @@ * under the License. */ -export { - KuiBar, - KuiBarSection, -} from './bar'; +export { KuiBar, KuiBarSection } from './bar'; -export { - KuiButton, - KuiButtonGroup, - KuiButtonIcon, - KuiLinkButton, - KuiSubmitButton, -} from './button'; +export { KuiButton, KuiButtonGroup, KuiButtonIcon, KuiLinkButton, KuiSubmitButton } from './button'; -export { - KuiCollapseButton, -} from './collapse_button'; +export { KuiCollapseButton } from './collapse_button'; export { KuiEmptyTablePrompt, @@ -40,15 +29,7 @@ export { KuiEmptyTablePromptPanel, } from './empty_table_prompt'; -export { - KuiExpression, - KuiExpressionButton, -} from './expression'; - -export { - KuiFieldGroup, - KuiFieldGroupSection, -} from './form_layout'; +export { KuiFieldGroup, KuiFieldGroupSection } from './form_layout'; export { KuiLabel, @@ -68,45 +49,9 @@ export { KuiLocalTitle, } from './local_nav'; -export { - KuiMenu, - KuiMenuItem, -} from './menu'; +export { KuiPager, KuiPagerButtonGroup } from './pager'; -export { - KUI_MODAL_CANCEL_BUTTON, - KUI_MODAL_CONFIRM_BUTTON, - KuiConfirmModal, - KuiModal, - KuiModalBody, - KuiModalFooter, - KuiModalHeader, - KuiModalHeaderTitle, - KuiModalOverlay, -} from './modal'; - -export { - KuiOutsideClickDetector, -} from './outside_click_detector'; - -export { - KuiPager, - KuiPagerButtonGroup, -} from './pager'; - -export { - KuiPanelSimple, -} from './panel_simple'; - -export { - KuiPopover, - KuiPopoverTitle, -} from './popover'; - -export { - KuiTabs, - KuiTab -} from './tabs'; +export { KuiTabs, KuiTab } from './tabs'; export { KuiTable, @@ -123,7 +68,7 @@ export { KuiListingTableCreateButton, KuiListingTableDeleteButton, KuiListingTableNoMatchesPrompt, - KuiListingTableLoadingPrompt + KuiListingTableLoadingPrompt, } from './table'; export { @@ -132,5 +77,5 @@ export { KuiToolBarFooter, KuiToolBarSection, KuiToolBarFooterSection, - KuiToolBarText + KuiToolBarText, } from './tool_bar'; diff --git a/packages/kbn-ui-framework/src/components/index.scss b/packages/kbn-ui-framework/src/components/index.scss index 084e7045a393..5e12ef30c8c9 100644 --- a/packages/kbn-ui-framework/src/components/index.scss +++ b/packages/kbn-ui-framework/src/components/index.scss @@ -12,30 +12,23 @@ // When possible, if making changes to those legacy components, please think about // instead adding them to this library and deprecating that dependency. -@import "bar/index"; -@import "button/index"; -@import "collapse_button/index"; -@import "expression/index"; -@import "form/index"; -@import "form_layout/index"; -@import "icon/index"; -@import "info_panel/index"; -@import "link/index"; -@import "local_nav/index"; -@import "menu/index"; -@import "menu_button/index"; -@import "modal/index"; -@import "pager/index"; -@import "panel/index"; -@import "panel_simple/index"; -@import "popover/index"; -@import "empty_table_prompt/index"; -@import "status_text/index"; -@import "table/index"; -@import "table_info/index"; -@import "tabs/index"; -@import "toggle_button/index"; -@import "tool_bar/index"; -@import "typography/index"; -@import "vertical_rhythm/index"; -@import "view/index"; +@import 'bar/index'; +@import 'button/index'; +@import 'collapse_button/index'; +@import 'form/index'; +@import 'form_layout/index'; +@import 'icon/index'; +@import 'info_panel/index'; +@import 'link/index'; +@import 'local_nav/index'; +@import 'pager/index'; +@import 'panel/index'; +@import 'empty_table_prompt/index'; +@import 'status_text/index'; +@import 'table/index'; +@import 'table_info/index'; +@import 'tabs/index'; +@import 'tool_bar/index'; +@import 'typography/index'; +@import 'vertical_rhythm/index'; +@import 'view/index'; diff --git a/packages/kbn-ui-framework/src/components/menu/__snapshots__/menu.test.js.snap b/packages/kbn-ui-framework/src/components/menu/__snapshots__/menu.test.js.snap deleted file mode 100644 index d33aa9635e93..000000000000 --- a/packages/kbn-ui-framework/src/components/menu/__snapshots__/menu.test.js.snap +++ /dev/null @@ -1,19 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`contained prop 1`] = ` -
    - children -
-`; - -exports[`renders KuiMenu 1`] = ` -
    - children -
-`; diff --git a/packages/kbn-ui-framework/src/components/menu/__snapshots__/menu_item.test.js.snap b/packages/kbn-ui-framework/src/components/menu/__snapshots__/menu_item.test.js.snap deleted file mode 100644 index a7e54006a6dc..000000000000 --- a/packages/kbn-ui-framework/src/components/menu/__snapshots__/menu_item.test.js.snap +++ /dev/null @@ -1,11 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`renders KuiMenuItem 1`] = ` -
  • - children -
    • -`; diff --git a/packages/kbn-ui-framework/src/components/menu/_index.scss b/packages/kbn-ui-framework/src/components/menu/_index.scss deleted file mode 100644 index 1884d62ee83b..000000000000 --- a/packages/kbn-ui-framework/src/components/menu/_index.scss +++ /dev/null @@ -1 +0,0 @@ -@import "menu"; diff --git a/packages/kbn-ui-framework/src/components/menu/_menu.scss b/packages/kbn-ui-framework/src/components/menu/_menu.scss deleted file mode 100644 index 812a216153a2..000000000000 --- a/packages/kbn-ui-framework/src/components/menu/_menu.scss +++ /dev/null @@ -1,26 +0,0 @@ -/** - * 1. Allow class to be applied to `ul` and `ol` elements - */ -.kuiMenu { - padding-left: 0; /* 1 */ -} - -.kuiMenu--contained { - border: $kuiBorderThin; - - .kuiMenuItem { - padding: 6px 10px; - } -} - -/** - * 1. Allow class to be applied to `li` elements - */ -.kuiMenuItem { - list-style: none; /* 1 */ - padding: 6px 0; - - & + & { - border-top: $kuiBorderThin; - } -} diff --git a/packages/kbn-ui-framework/src/components/menu/index.js b/packages/kbn-ui-framework/src/components/menu/index.js deleted file mode 100644 index 54a6e4e1d82d..000000000000 --- a/packages/kbn-ui-framework/src/components/menu/index.js +++ /dev/null @@ -1,21 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -export { KuiMenu } from './menu'; -export { KuiMenuItem } from './menu_item'; diff --git a/packages/kbn-ui-framework/src/components/menu/menu.js b/packages/kbn-ui-framework/src/components/menu/menu.js deleted file mode 100644 index e0707293cca6..000000000000 --- a/packages/kbn-ui-framework/src/components/menu/menu.js +++ /dev/null @@ -1,48 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import PropTypes from 'prop-types'; -import React from 'react'; -import classNames from 'classnames'; - -export const KuiMenu = ({ - contained, - className, - children, - ...rest -}) => { - const classes = classNames('kuiMenu', className, { - 'kuiMenu--contained': contained - }); - - return ( -
      - {children} -
    - ); -}; - -KuiMenu.propTypes = { - contained: PropTypes.bool, - className: PropTypes.string, - children: PropTypes.node -}; diff --git a/packages/kbn-ui-framework/src/components/menu/menu.test.js b/packages/kbn-ui-framework/src/components/menu/menu.test.js deleted file mode 100644 index 1ea1e5044faa..000000000000 --- a/packages/kbn-ui-framework/src/components/menu/menu.test.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; - -import { - KuiMenu, -} from './menu'; - -test('renders KuiMenu', () => { - const component = children; - expect(render(component)).toMatchSnapshot(); -}); - -test('contained prop', () => { - const component = children; - expect(render(component)).toMatchSnapshot(); -}); diff --git a/packages/kbn-ui-framework/src/components/menu/menu_item.js b/packages/kbn-ui-framework/src/components/menu/menu_item.js deleted file mode 100644 index b81d2053f75b..000000000000 --- a/packages/kbn-ui-framework/src/components/menu/menu_item.js +++ /dev/null @@ -1,43 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import PropTypes from 'prop-types'; -import React from 'react'; - -import classNames from 'classnames'; - -export const KuiMenuItem = ({ - className, - children, - ...rest -}) => { - return ( -
  • - {children} -
    • - ); -}; - -KuiMenuItem.propTypes = { - className: PropTypes.string, - children: PropTypes.node -}; diff --git a/packages/kbn-ui-framework/src/components/menu/menu_item.test.js b/packages/kbn-ui-framework/src/components/menu/menu_item.test.js deleted file mode 100644 index e06c11077784..000000000000 --- a/packages/kbn-ui-framework/src/components/menu/menu_item.test.js +++ /dev/null @@ -1,31 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; - -import { - KuiMenuItem, -} from './menu_item'; - -test('renders KuiMenuItem', () => { - const component = children; - expect(render(component)).toMatchSnapshot(); -}); diff --git a/packages/kbn-ui-framework/src/components/menu_button/_index.scss b/packages/kbn-ui-framework/src/components/menu_button/_index.scss deleted file mode 100644 index 1548f7e600be..000000000000 --- a/packages/kbn-ui-framework/src/components/menu_button/_index.scss +++ /dev/null @@ -1,20 +0,0 @@ -$menuButtonFontSize: 12px; - -$menuButtonBasicTextColor: $euiTextColor; -$menuButtonBasicBackgroundColor: $euiColorEmptyShade; -$menuButtonBasicHoverBackgroundColor: $euiColorLightestShade; -$menuButtonBasicDisabledTextColor: $euiColorMediumShade; -$menuButtonPrimaryTextColor: $euiColorGhost; -$menuButtonPrimaryBackgroundColor: $euiColorPrimary; -$menuButtonPrimaryHoverBackgroundColor: darken($euiColorPrimary, 10%); -$menuButtonPrimaryDisabledBackgroundColor: $euiColorMediumShade; - -$menuButtonDangerTextColor: $euiColorGhost; -$menuButtonDangerBackgroundColor: $euiColorDanger; -$menuButtonDangerHoverTextColor: $euiColorGhost; -$menuButtonDangerHoverBackgroundColor: darken($euiColorDanger, 10%); -$menuButtonDangerDisabledBackgroundColor: $euiColorMediumShade; -$menuButtonDangerHoverDisabledTextColor: $euiColorGhost; - -@import "menu_button"; -@import "menu_button_group"; diff --git a/packages/kbn-ui-framework/src/components/menu_button/_menu_button.scss b/packages/kbn-ui-framework/src/components/menu_button/_menu_button.scss deleted file mode 100644 index 2b9a8048746e..000000000000 --- a/packages/kbn-ui-framework/src/components/menu_button/_menu_button.scss +++ /dev/null @@ -1,118 +0,0 @@ -/** - * 1. Setting to inline-block guarantees the same height when applied to both - * button elements and anchor tags. - * 2. Disable for Angular. - * 3. Make the button just tall enough to fit inside an Option Layout. - */ -.kuiMenuButton { - display: inline-block; /* 1 */ - appearance: none; - cursor: pointer; - padding: 2px 10px; /* 3 */ - font-size: $menuButtonFontSize; - font-weight: $kuiFontWeightRegular; - line-height: $kuiLineHeight; - text-decoration: none; - border: none; - border-radius: $kuiBorderRadius; - - &:disabled { - cursor: default; - pointer-events: none; /* 2 */ - } - - &:active:enabled { - transform: translateY(1px); - } - - &:focus { - @include focus; - } -} - -.kuiMenuButton--iconText { - .kuiMenuButton__icon { - &:first-child { - margin-right: 4px; - } - - &:last-child { - margin-left: 4px; - } - } -} - -/** - * 1. Override Bootstrap. - * 2. Safari won't respect :enabled:hover/active on links. - */ -.kuiMenuButton--basic { - color: $menuButtonBasicTextColor; - background-color: $menuButtonBasicBackgroundColor; - - // Goes before hover, so that hover can override it. - &:focus { - color: $menuButtonBasicTextColor !important; /* 1 */ - } - - &:hover, /* 2 */ - &:active { /* 2 */ - color: $menuButtonBasicTextColor !important; /* 1 */ - background-color: $menuButtonBasicHoverBackgroundColor; - } - - &:disabled { - color: $menuButtonBasicDisabledTextColor; - cursor: not-allowed; - } -} - -/** - * 1. Override Bootstrap. - * 2. Safari won't respect :enabled:hover/active on links. - */ -.kuiMenuButton--primary { - color: $menuButtonPrimaryTextColor; - background-color: $menuButtonPrimaryBackgroundColor; - - // Goes before hover, so that hover can override it. - &:focus { - color: $menuButtonPrimaryTextColor !important; /* 1 */ - } - - &:hover, /* 2 */ - &:active { /* 2 */ - color: $menuButtonPrimaryTextColor !important; /* 1 */ - background-color: $menuButtonPrimaryHoverBackgroundColor; - } - - &:disabled { - background-color: $menuButtonPrimaryDisabledBackgroundColor; - cursor: not-allowed; - } -} - -/** - * 1. Override Bootstrap. - * 2. Safari won't respect :enabled:hover/active on links. - */ -.kuiMenuButton--danger { - color: $menuButtonDangerTextColor; - background-color: $menuButtonDangerBackgroundColor; - - &:hover, /* 2 */ - &:active { /* 2 */ - color: $menuButtonDangerHoverTextColor !important; /* 1 */ - background-color: $menuButtonDangerHoverBackgroundColor; - } - - &:disabled { - color: $menuButtonDangerHoverDisabledTextColor; - background-color: $menuButtonDangerDisabledBackgroundColor; - cursor: not-allowed; - } - - &:focus { - @include focus($kuiFocusDangerColor); - } -} diff --git a/packages/kbn-ui-framework/src/components/menu_button/_menu_button_group.scss b/packages/kbn-ui-framework/src/components/menu_button/_menu_button_group.scss deleted file mode 100644 index e8a53967e8b3..000000000000 --- a/packages/kbn-ui-framework/src/components/menu_button/_menu_button_group.scss +++ /dev/null @@ -1,11 +0,0 @@ -.kuiMenuButtonGroup { - display: flex; - - .kuiMenuButton + .kuiMenuButton { - margin-left: 4px; - } -} - -.kuiMenuButtonGroup--alignRight { - justify-content: flex-end; -} diff --git a/packages/kbn-ui-framework/src/components/modal/__snapshots__/confirm_modal.test.js.snap b/packages/kbn-ui-framework/src/components/modal/__snapshots__/confirm_modal.test.js.snap deleted file mode 100644 index b42842a6959c..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/__snapshots__/confirm_modal.test.js.snap +++ /dev/null @@ -1,64 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`renders KuiConfirmModal 1`] = ` -
    -
    -
    -
    - A confirmation modal -
    -
    -
    -
    -

    - This is a confirmation modal example -

    -
    -
    -
    - - -
    -
    -
    -`; diff --git a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal.test.js.snap b/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal.test.js.snap deleted file mode 100644 index f2c725e3b38e..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal.test.js.snap +++ /dev/null @@ -1,14 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`renders KuiModal 1`] = ` -
    -
    - children -
    -
    -`; diff --git a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_body.test.js.snap b/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_body.test.js.snap deleted file mode 100644 index b0ddad312d8b..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_body.test.js.snap +++ /dev/null @@ -1,11 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`renders KuiModalBody 1`] = ` -
    - children -
    -`; diff --git a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_footer.test.js.snap b/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_footer.test.js.snap deleted file mode 100644 index c4aaebfe7577..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_footer.test.js.snap +++ /dev/null @@ -1,11 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`renders KuiModalFooter 1`] = ` -
    - children -
    -`; diff --git a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_header.test.js.snap b/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_header.test.js.snap deleted file mode 100644 index 61fa239e7232..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_header.test.js.snap +++ /dev/null @@ -1,11 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`renders KuiModalHeader 1`] = ` -
    - children -
    -`; diff --git a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_header_title.test.js.snap b/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_header_title.test.js.snap deleted file mode 100644 index 938e82898578..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_header_title.test.js.snap +++ /dev/null @@ -1,11 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`renders KuiModalHeaderTitle 1`] = ` -
    - children -
    -`; diff --git a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_overlay.test.js.snap b/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_overlay.test.js.snap deleted file mode 100644 index 536461942dd3..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/__snapshots__/modal_overlay.test.js.snap +++ /dev/null @@ -1,11 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`renders KuiModalOverlay 1`] = ` -
    - children -
    -`; diff --git a/packages/kbn-ui-framework/src/components/modal/_index.scss b/packages/kbn-ui-framework/src/components/modal/_index.scss deleted file mode 100644 index fc6f1747b507..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/_index.scss +++ /dev/null @@ -1,11 +0,0 @@ -$modalPadding: 10px; -$modalBorderColor: $euiBorderColor; -$modalBackgroundColor: $euiColorEmptyShade; -$kuiModalDepth: 1000; -$modalOverlayBackground: $euiColorEmptyShade; -@if (lightness($euiTextColor) > 50) { - $modalOverlayBackground: $euiColorLightShade; -} - -@import "modal_overlay"; -@import "modal"; diff --git a/packages/kbn-ui-framework/src/components/modal/_modal.scss b/packages/kbn-ui-framework/src/components/modal/_modal.scss deleted file mode 100644 index 0564db699837..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/_modal.scss +++ /dev/null @@ -1,63 +0,0 @@ -.kuiModal { - @include euiBottomShadow; - - line-height: $kuiLineHeight; - background-color: $modalBackgroundColor; - border: 1px solid $modalBorderColor; - border-radius: $kuiBorderRadius; - z-index: $kuiModalDepth + 1; - animation: kuiModal $kuiAnimSpeedSlow $kuiAnimSlightBounce; -} - -.kuiModal--confirmation { - width: 450px; - min-width: auto; -} - -.kuiModalHeader { - display: flex; - justify-content: space-between; - align-items: center; - padding: $modalPadding; - padding-left: $modalPadding * 2; - border-bottom: $kuiBorderThin; -} - - .kuiModalHeader__title { - font-size: $kuiTitleFontSize; - } - -.kuiModalHeaderCloseButton { - @include microButton; - font-size: $kuiTitleFontSize; -} - -.kuiModalBody { - padding: $modalPadding * 2; -} - -.kuiModalBodyText { - font-size: 14px; -} - -.kuiModalFooter { - display: flex; - justify-content: flex-end; - padding: $modalPadding * 2; - padding-top: $modalPadding; - - > * + * { - margin-left: 5px; - } -} - -@keyframes kuiModal { - 0% { - opacity: 0; - transform: translateY($kuiSizeXL); - } - 100% { - opacity: 1; - transform: translateY(0); - } -} diff --git a/packages/kbn-ui-framework/src/components/modal/_modal_overlay.scss b/packages/kbn-ui-framework/src/components/modal/_modal_overlay.scss deleted file mode 100644 index 6af8154e85c7..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/_modal_overlay.scss +++ /dev/null @@ -1,13 +0,0 @@ -.kuiModalOverlay { - position: fixed; - z-index: $kuiModalDepth; - top: 0; - left: 0; - right: 0; - bottom: 0; - display: flex; - align-items: center; - justify-content: center; - padding-bottom: 10vh; - background: transparentize($modalOverlayBackground, .2); -} diff --git a/packages/kbn-ui-framework/src/components/modal/confirm_modal.js b/packages/kbn-ui-framework/src/components/modal/confirm_modal.js deleted file mode 100644 index f6578231cec8..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/confirm_modal.js +++ /dev/null @@ -1,120 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import PropTypes from 'prop-types'; -import classnames from 'classnames'; - -import { KuiModal } from './modal'; -import { KuiModalFooter } from './modal_footer'; -import { KuiModalHeader } from './modal_header'; -import { KuiModalHeaderTitle } from './modal_header_title'; -import { KuiModalBody } from './modal_body'; -import { - KuiButton, -} from '../../components/'; - -export const CONFIRM_BUTTON = 'confirm'; -export const CANCEL_BUTTON = 'cancel'; - -const CONFIRM_MODAL_BUTTONS = [ - CONFIRM_BUTTON, - CANCEL_BUTTON, -]; - -export function KuiConfirmModal({ - children, - title, - onCancel, - onConfirm, - cancelButtonText, - confirmButtonText, - className, - defaultFocusedButton, - ...rest -}) { - const classes = classnames('kuiModal--confirmation', className); - - let modalTitle; - - if (title) { - modalTitle = ( - - - {title} - - - ); - } - - let message; - - if (typeof children === 'string') { - message =

    {children}

    ; - } else { - message = children; - } - - return ( - - {modalTitle} - - -
    - {message} -
    -     - - - - {cancelButtonText} - - - - {confirmButtonText} - - -     - ); -} - -KuiConfirmModal.propTypes = { - children: PropTypes.node, - title: PropTypes.string, - cancelButtonText: PropTypes.string, - confirmButtonText: PropTypes.string, - onCancel: PropTypes.func.isRequired, - onConfirm: PropTypes.func, - className: PropTypes.string, - defaultFocusedButton: PropTypes.oneOf(CONFIRM_MODAL_BUTTONS) -}; diff --git a/packages/kbn-ui-framework/src/components/modal/confirm_modal.test.js b/packages/kbn-ui-framework/src/components/modal/confirm_modal.test.js deleted file mode 100644 index c2713bebffd9..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/confirm_modal.test.js +++ /dev/null @@ -1,145 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import sinon from 'sinon'; -import { mount, render } from 'enzyme'; - -import { findTestSubject, requiredProps } from '../../test'; -import { keyCodes } from '../../services'; - -import { - CANCEL_BUTTON, CONFIRM_BUTTON, KuiConfirmModal, -} from './confirm_modal'; - -let onConfirm; -let onCancel; - -beforeEach(() => { - onConfirm = sinon.spy(); - onCancel = sinon.spy(); -}); - -test('renders KuiConfirmModal', () => { - const component = render( - {}} - onConfirm={onConfirm} - cancelButtonText="Cancel Button Text" - confirmButtonText="Confirm Button Text" - {...requiredProps} - > - This is a confirmation modal example - - ); - expect(component).toMatchSnapshot(); -}); - -test('onConfirm', () => { - const component = mount( - - ); - - findTestSubject(component, 'confirmModalConfirmButton').simulate('click'); - sinon.assert.calledOnce(onConfirm); - sinon.assert.notCalled(onCancel); -}); - -describe('onCancel', () => { - test('triggered by click', () => { - const component = mount( - - ); - - findTestSubject(component, 'confirmModalCancelButton').simulate('click'); - sinon.assert.notCalled(onConfirm); - sinon.assert.calledOnce(onCancel); - }); - - test('triggered by esc key', () => { - const component = mount( - - ); - - findTestSubject(component, 'modal').simulate('keydown', { keyCode: keyCodes.ESCAPE }); - sinon.assert.notCalled(onConfirm); - sinon.assert.calledOnce(onCancel); - }); -}); - -describe('defaultFocusedButton', () => { - test('is cancel', () => { - const component = mount( - - ); - - const button = findTestSubject(component, 'confirmModalCancelButton').getDOMNode(); - expect(document.activeElement).toEqual(button); - }); - - test('is confirm', () => { - const component = mount( - - ); - - const button = findTestSubject(component, 'confirmModalConfirmButton').getDOMNode(); - expect(document.activeElement).toEqual(button); - }); - - test('when not given gives focus to the modal', () => { - const component = mount( - - ); - expect(document.activeElement).toEqual(component.getDOMNode().firstChild); - }); -}); diff --git a/packages/kbn-ui-framework/src/components/modal/index.js b/packages/kbn-ui-framework/src/components/modal/index.js deleted file mode 100644 index 7ce9e7e38606..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/index.js +++ /dev/null @@ -1,30 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -export { - KuiConfirmModal, - CONFIRM_BUTTON as KUI_MODAL_CONFIRM_BUTTON, - CANCEL_BUTTON as KUI_MODAL_CANCEL_BUTTON, -} from './confirm_modal'; -export { KuiModal } from './modal'; -export { KuiModalFooter } from './modal_footer'; -export { KuiModalHeader } from './modal_header'; -export { KuiModalOverlay } from './modal_overlay'; -export { KuiModalBody } from './modal_body'; -export { KuiModalHeaderTitle } from './modal_header_title'; diff --git a/packages/kbn-ui-framework/src/components/modal/modal.js b/packages/kbn-ui-framework/src/components/modal/modal.js deleted file mode 100644 index 0aa5d9ca5049..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal.js +++ /dev/null @@ -1,74 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React, { - Component, -} from 'react'; -import classnames from 'classnames'; -import PropTypes from 'prop-types'; -import FocusTrap from 'focus-trap-react'; - -import { keyCodes } from '../../services'; - -export class KuiModal extends Component { - onKeyDown = event => { - if (event.keyCode === keyCodes.ESCAPE) { - this.props.onClose(); - } - }; - - render() { - const { - className, - children, - onClose, // eslint-disable-line no-unused-vars - ...rest - } = this.props; - - const classes = classnames('kuiModal', className); - - return ( - this.modal, - }} - > - { - // Create a child div instead of applying these props directly to FocusTrap, or else - // fallbackFocus won't work. - } -
    { this.modal = node; }} - className={classes} - onKeyDown={this.onKeyDown} - tabIndex={0} - {...rest} - > - {children} -
    -     - ); - } -} - -KuiModal.propTypes = { - className: PropTypes.string, - children: PropTypes.node, - onClose: PropTypes.func.isRequired, -}; diff --git a/packages/kbn-ui-framework/src/components/modal/modal.test.js b/packages/kbn-ui-framework/src/components/modal/modal.test.js deleted file mode 100644 index 0700079f5905..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal.test.js +++ /dev/null @@ -1,39 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; - -import { - KuiModal, -} from './modal'; - -test('renders KuiModal', () => { - const component = ( - {}} - {...requiredProps} - > - children - - ); - - expect(render(component)).toMatchSnapshot(); -}); diff --git a/packages/kbn-ui-framework/src/components/modal/modal_body.js b/packages/kbn-ui-framework/src/components/modal/modal_body.js deleted file mode 100644 index 36bef25ae9b1..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal_body.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import classnames from 'classnames'; -import PropTypes from 'prop-types'; - -export function KuiModalBody({ className, children, ...rest }) { - const classes = classnames('kuiModalBody', className); - return ( -
    - { children } -
    - ); -} - -KuiModalBody.propTypes = { - className: PropTypes.string, - children: PropTypes.node -}; diff --git a/packages/kbn-ui-framework/src/components/modal/modal_body.test.js b/packages/kbn-ui-framework/src/components/modal/modal_body.test.js deleted file mode 100644 index b2a70839a12a..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal_body.test.js +++ /dev/null @@ -1,31 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; - -import { - KuiModalBody, -} from './modal_body'; - -test('renders KuiModalBody', () => { - const component = children; - expect(render(component)).toMatchSnapshot(); -}); diff --git a/packages/kbn-ui-framework/src/components/modal/modal_footer.js b/packages/kbn-ui-framework/src/components/modal/modal_footer.js deleted file mode 100644 index 1ded35b7046e..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal_footer.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import classnames from 'classnames'; -import PropTypes from 'prop-types'; - -export function KuiModalFooter({ className, children, ...rest }) { - const classes = classnames('kuiModalFooter', className); - return ( -
    - { children } -
    - ); -} - -KuiModalFooter.propTypes = { - className: PropTypes.string, - children: PropTypes.node -}; diff --git a/packages/kbn-ui-framework/src/components/modal/modal_footer.test.js b/packages/kbn-ui-framework/src/components/modal/modal_footer.test.js deleted file mode 100644 index e8404292ce1e..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal_footer.test.js +++ /dev/null @@ -1,31 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; - -import { - KuiModalFooter, -} from './modal_footer'; - -test('renders KuiModalFooter', () => { - const component = children; - expect(render(component)).toMatchSnapshot(); -}); diff --git a/packages/kbn-ui-framework/src/components/modal/modal_header.js b/packages/kbn-ui-framework/src/components/modal/modal_header.js deleted file mode 100644 index 9165e0c0a5b1..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal_header.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import classnames from 'classnames'; -import PropTypes from 'prop-types'; - -export function KuiModalHeader({ className, children, ...rest }) { - const classes = classnames('kuiModalHeader', className); - return ( -
    - { children } -
    - ); -} - -KuiModalHeader.propTypes = { - className: PropTypes.string, - children: PropTypes.node -}; diff --git a/packages/kbn-ui-framework/src/components/modal/modal_header.test.js b/packages/kbn-ui-framework/src/components/modal/modal_header.test.js deleted file mode 100644 index 10a51a1da4a8..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal_header.test.js +++ /dev/null @@ -1,31 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; - -import { - KuiModalHeader, -} from './modal_header'; - -test('renders KuiModalHeader', () => { - const component = children; - expect(render(component)).toMatchSnapshot(); -}); diff --git a/packages/kbn-ui-framework/src/components/modal/modal_header_title.js b/packages/kbn-ui-framework/src/components/modal/modal_header_title.js deleted file mode 100644 index 47d1960e02ae..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal_header_title.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import classnames from 'classnames'; -import PropTypes from 'prop-types'; - -export function KuiModalHeaderTitle({ className, children, ...rest }) { - const classes = classnames('kuiModalHeader__title', className); - return ( -
    - { children } -
    - ); -} - -KuiModalHeaderTitle.propTypes = { - className: PropTypes.string, - children: PropTypes.node -}; diff --git a/packages/kbn-ui-framework/src/components/modal/modal_header_title.test.js b/packages/kbn-ui-framework/src/components/modal/modal_header_title.test.js deleted file mode 100644 index 5ca29edfa972..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal_header_title.test.js +++ /dev/null @@ -1,31 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; - -import { - KuiModalHeaderTitle, -} from './modal_header_title'; - -test('renders KuiModalHeaderTitle', () => { - const component = children; - expect(render(component)).toMatchSnapshot(); -}); diff --git a/packages/kbn-ui-framework/src/components/modal/modal_overlay.js b/packages/kbn-ui-framework/src/components/modal/modal_overlay.js deleted file mode 100644 index 4d9ed64b8ead..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal_overlay.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import classnames from 'classnames'; -import PropTypes from 'prop-types'; - -export function KuiModalOverlay({ className, ...rest }) { - const classes = classnames('kuiModalOverlay', className); - return ( -
    - ); -} - -KuiModalOverlay.propTypes = { - className: PropTypes.string, -}; diff --git a/packages/kbn-ui-framework/src/components/modal/modal_overlay.test.js b/packages/kbn-ui-framework/src/components/modal/modal_overlay.test.js deleted file mode 100644 index 75c3feee14e3..000000000000 --- a/packages/kbn-ui-framework/src/components/modal/modal_overlay.test.js +++ /dev/null @@ -1,31 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; - -import { - KuiModalOverlay, -} from './modal_overlay'; - -test('renders KuiModalOverlay', () => { - const component = children; - expect(render(component)).toMatchSnapshot(); -}); diff --git a/packages/kbn-ui-framework/src/components/outside_click_detector/__snapshots__/outside_click_detector.test.js.snap b/packages/kbn-ui-framework/src/components/outside_click_detector/__snapshots__/outside_click_detector.test.js.snap deleted file mode 100644 index 6345a66dd3ab..000000000000 --- a/packages/kbn-ui-framework/src/components/outside_click_detector/__snapshots__/outside_click_detector.test.js.snap +++ /dev/null @@ -1,3 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`KuiOutsideClickDetector is rendered 1`] = `
    `; diff --git a/packages/kbn-ui-framework/src/components/outside_click_detector/index.js b/packages/kbn-ui-framework/src/components/outside_click_detector/index.js deleted file mode 100644 index 52e22b67af17..000000000000 --- a/packages/kbn-ui-framework/src/components/outside_click_detector/index.js +++ /dev/null @@ -1,22 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -export { - KuiOutsideClickDetector, -} from './outside_click_detector'; diff --git a/packages/kbn-ui-framework/src/components/outside_click_detector/outside_click_detector.js b/packages/kbn-ui-framework/src/components/outside_click_detector/outside_click_detector.js deleted file mode 100644 index 0d107c249467..000000000000 --- a/packages/kbn-ui-framework/src/components/outside_click_detector/outside_click_detector.js +++ /dev/null @@ -1,68 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import { - Children, - cloneElement, - Component, -} from 'react'; -import PropTypes from 'prop-types'; - -export class KuiOutsideClickDetector extends Component { - static propTypes = { - children: PropTypes.node.isRequired, - onOutsideClick: PropTypes.func.isRequired, - }; - - onClickOutside = event => { - if (!this.wrapperRef) { - return; - } - - if (this.wrapperRef === event.target) { - return; - } - - if (this.wrapperRef.contains(event.target)) { - return; - } - - this.props.onOutsideClick(); - }; - - componentDidMount() { - document.addEventListener('mousedown', this.onClickOutside); - } - - componentWillUnmount() { - document.removeEventListener('mousedown', this.onClickOutside); - } - - render() { - const props = { - ...this.props.children.props, - ref: node => { - this.wrapperRef = node; - }, - }; - - const child = Children.only(this.props.children); - return cloneElement(child, props); - } -} diff --git a/packages/kbn-ui-framework/src/components/outside_click_detector/outside_click_detector.test.js b/packages/kbn-ui-framework/src/components/outside_click_detector/outside_click_detector.test.js deleted file mode 100644 index 5d872531f07b..000000000000 --- a/packages/kbn-ui-framework/src/components/outside_click_detector/outside_click_detector.test.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; - -import { KuiOutsideClickDetector } from './outside_click_detector'; - -describe('KuiOutsideClickDetector', () => { - test('is rendered', () => { - const component = render( - {}}> -
    - - ); - - expect(component) - .toMatchSnapshot(); - }); -}); diff --git a/packages/kbn-ui-framework/src/components/panel_simple/__snapshots__/panel_simple.test.js.snap b/packages/kbn-ui-framework/src/components/panel_simple/__snapshots__/panel_simple.test.js.snap deleted file mode 100644 index f826cf618273..000000000000 --- a/packages/kbn-ui-framework/src/components/panel_simple/__snapshots__/panel_simple.test.js.snap +++ /dev/null @@ -1,9 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`KuiPanelSimple is rendered 1`] = ` -
    -`; diff --git a/packages/kbn-ui-framework/src/components/panel_simple/_index.scss b/packages/kbn-ui-framework/src/components/panel_simple/_index.scss deleted file mode 100644 index 31e793246dfe..000000000000 --- a/packages/kbn-ui-framework/src/components/panel_simple/_index.scss +++ /dev/null @@ -1 +0,0 @@ -@import 'panel_simple'; diff --git a/packages/kbn-ui-framework/src/components/panel_simple/_panel_simple.scss b/packages/kbn-ui-framework/src/components/panel_simple/_panel_simple.scss deleted file mode 100644 index debc03f0cfac..000000000000 --- a/packages/kbn-ui-framework/src/components/panel_simple/_panel_simple.scss +++ /dev/null @@ -1,27 +0,0 @@ -.kuiPanelSimple { - @include euiBottomShadowSmall; - background-color: $euiColorEmptyShade; - border: $euiBorderThin; - border-radius: $euiBorderRadius; - flex-grow: 1; - - &.kuiPanelSimple--paddingSmall { - padding: $kuiSizeS; - } - - &.kuiPanelSimple--paddingMedium { - padding: $kuiSize; - } - - &.kuiPanelSimple--paddingLarge { - padding: $kuiSizeL; - } - - &.kuiPanelSimple--shadow { - @include kuiBottomShadow; - } - - &.kuiPanelSimple--flexGrowZero { - flex-grow: 0; - } -} diff --git a/packages/kbn-ui-framework/src/components/panel_simple/index.js b/packages/kbn-ui-framework/src/components/panel_simple/index.js deleted file mode 100644 index c9375a948883..000000000000 --- a/packages/kbn-ui-framework/src/components/panel_simple/index.js +++ /dev/null @@ -1,23 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -export { - KuiPanelSimple, - SIZES, -} from './panel_simple'; diff --git a/packages/kbn-ui-framework/src/components/panel_simple/panel_simple.js b/packages/kbn-ui-framework/src/components/panel_simple/panel_simple.js deleted file mode 100644 index 8e902201ced0..000000000000 --- a/packages/kbn-ui-framework/src/components/panel_simple/panel_simple.js +++ /dev/null @@ -1,78 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import PropTypes from 'prop-types'; -import classNames from 'classnames'; - -const paddingSizeToClassNameMap = { - 'none': null, - 's': 'kuiPanelSimple--paddingSmall', - 'm': 'kuiPanelSimple--paddingMedium', - 'l': 'kuiPanelSimple--paddingLarge', -}; - -export const SIZES = Object.keys(paddingSizeToClassNameMap); - -export const KuiPanelSimple = ({ - children, - className, - paddingSize, - hasShadow, - grow, - panelRef, - ...rest -}) => { - - const classes = classNames( - 'kuiPanelSimple', - paddingSizeToClassNameMap[paddingSize], - { - 'kuiPanelSimple--shadow': hasShadow, - 'kuiPanelSimple--flexGrowZero': !grow, - }, - className - ); - - return ( -
    - {children} -
    - ); - -}; - -KuiPanelSimple.propTypes = { - children: PropTypes.node, - className: PropTypes.string, - hasShadow: PropTypes.bool, - paddingSize: PropTypes.oneOf(SIZES), - grow: PropTypes.bool, - panelRef: PropTypes.func, -}; - -KuiPanelSimple.defaultProps = { - paddingSize: 'm', - hasShadow: false, - grow: true, -}; diff --git a/packages/kbn-ui-framework/src/components/panel_simple/panel_simple.test.js b/packages/kbn-ui-framework/src/components/panel_simple/panel_simple.test.js deleted file mode 100644 index 977011207a16..000000000000 --- a/packages/kbn-ui-framework/src/components/panel_simple/panel_simple.test.js +++ /dev/null @@ -1,35 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; - -import { KuiPanelSimple } from './panel_simple'; - -describe('KuiPanelSimple', () => { - test('is rendered', () => { - const component = render( - - ); - - expect(component) - .toMatchSnapshot(); - }); -}); diff --git a/packages/kbn-ui-framework/src/components/popover/__snapshots__/popover.test.js.snap b/packages/kbn-ui-framework/src/components/popover/__snapshots__/popover.test.js.snap deleted file mode 100644 index a409fcd28b80..000000000000 --- a/packages/kbn-ui-framework/src/components/popover/__snapshots__/popover.test.js.snap +++ /dev/null @@ -1,125 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`KuiPopover children is rendered 1`] = ` -
    -
    -`; - -exports[`KuiPopover is rendered 1`] = ` -
    -
    -`; - -exports[`KuiPopover props anchorPosition defaults to center 1`] = ` -
    -
    -`; - -exports[`KuiPopover props anchorPosition left is rendered 1`] = ` -
    -
    -`; - -exports[`KuiPopover props anchorPosition right is rendered 1`] = ` -
    -
    -`; - -exports[`KuiPopover props isOpen defaults to false 1`] = ` -
    -
    -`; - -exports[`KuiPopover props isOpen renders true 1`] = ` -
    -
    -`; diff --git a/packages/kbn-ui-framework/src/components/popover/__snapshots__/popover_title.test.js.snap b/packages/kbn-ui-framework/src/components/popover/__snapshots__/popover_title.test.js.snap deleted file mode 100644 index adb2c559e5f9..000000000000 --- a/packages/kbn-ui-framework/src/components/popover/__snapshots__/popover_title.test.js.snap +++ /dev/null @@ -1,9 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`KuiPopoverTitle is rendered 1`] = ` -
    -`; diff --git a/packages/kbn-ui-framework/src/components/popover/_index.scss b/packages/kbn-ui-framework/src/components/popover/_index.scss deleted file mode 100644 index e6b242e72507..000000000000 --- a/packages/kbn-ui-framework/src/components/popover/_index.scss +++ /dev/null @@ -1,3 +0,0 @@ -@import 'mixins'; -@import 'popover'; -@import 'popover_title'; diff --git a/packages/kbn-ui-framework/src/components/popover/_mixins.scss b/packages/kbn-ui-framework/src/components/popover/_mixins.scss deleted file mode 100644 index c1abba14151b..000000000000 --- a/packages/kbn-ui-framework/src/components/popover/_mixins.scss +++ /dev/null @@ -1,6 +0,0 @@ -@mixin kuiPopoverTitle { - background-color: $kuiColorLightestShade; - border-bottom: $kuiBorderThin; - padding: $kuiSizeM; - font-size: $kuiFontSize; -} diff --git a/packages/kbn-ui-framework/src/components/popover/_popover.scss b/packages/kbn-ui-framework/src/components/popover/_popover.scss deleted file mode 100644 index 2783fbe91027..000000000000 --- a/packages/kbn-ui-framework/src/components/popover/_popover.scss +++ /dev/null @@ -1,96 +0,0 @@ -// Pop menu is an animated popover relatively positioned to a button / action. -// By default it positions in the middle, but can be anchored left and right. - -.kuiPopover { - display: inline-block; - position: relative; - - // Open state happens on the wrapper and applies to the panel. - &.kuiPopover-isOpen { - .kuiPopover__panel { - opacity: 1; - visibility: visible; - margin-top: $kuiSizeS; - pointer-events: auto; - } - } -} - - // Animation happens on the panel. - .kuiPopover__panel { - position: absolute; - z-index: $kuiZContentMenu; - top: 100%; - left: 50%; - transform: translateX(-50%) translateY($kuiSizeS) translateZ(0); - backface-visibility: hidden; - transition: - opacity $kuiAnimSlightBounce $kuiAnimSpeedSlow, - visibility $kuiAnimSlightBounce $kuiAnimSpeedSlow, - margin-top $kuiAnimSlightBounce $kuiAnimSpeedSlow; - transform-origin: center top; - opacity: 0; - visibility: hidden; - pointer-events: none; - margin-top: $kuiSizeL; - - // This fakes a border on the arrow. - &:before { - position: absolute; - content: ""; - top: -$kuiSize; - height: 0; - width: 0; - left: 50%; - margin-left: -$kuiSize; - border-left: $kuiSize solid transparent; - border-right: $kuiSize solid transparent; - border-bottom: $kuiSize solid $kuiBorderColor; - } - - // This part of the arrow matches the panel. - &:after { - position: absolute; - content: ""; - top: -$kuiSize + 1; - right: 0; - height: 0; - left: 50%; - margin-left: -$kuiSize; - width: 0; - border-left: $kuiSize solid transparent; - border-right: $kuiSize solid transparent; - border-bottom: $kuiSize solid $euiColorEmptyShade; - } - } - -.kuiPopover--withTitle .kuiPopover__panel:after { - border-bottom-color: $kuiColorLightestShade; -} - -// Positions the menu and arrow to the left of the parent. -.kuiPopover--anchorLeft { - .kuiPopover__panel { - left: 0; - transform: translateX(0%) translateY($kuiSizeS) translateZ(0); - - &:before, &:after { - right: auto; - left: $kuiSize; - margin: 0; - } - } -} - -// Positions the menu and arrow to the right of the parent. -.kuiPopover--anchorRight { - .kuiPopover__panel { - left: 100%; - transform: translateX(-100%) translateY($kuiSizeS) translateZ(0); - - &:before, &:after { - right: $kuiSize; - left: auto; - } - } -} diff --git a/packages/kbn-ui-framework/src/components/popover/_popover_title.scss b/packages/kbn-ui-framework/src/components/popover/_popover_title.scss deleted file mode 100644 index a5a60f1dfbff..000000000000 --- a/packages/kbn-ui-framework/src/components/popover/_popover_title.scss +++ /dev/null @@ -1,3 +0,0 @@ -.kuiPopoverTitle { - @include kuiPopoverTitle; -} diff --git a/packages/kbn-ui-framework/src/components/popover/index.js b/packages/kbn-ui-framework/src/components/popover/index.js deleted file mode 100644 index 397993ed3b9f..000000000000 --- a/packages/kbn-ui-framework/src/components/popover/index.js +++ /dev/null @@ -1,21 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -export { KuiPopover, } from './popover'; -export { KuiPopoverTitle } from './popover_title'; diff --git a/packages/kbn-ui-framework/src/components/popover/popover.js b/packages/kbn-ui-framework/src/components/popover/popover.js deleted file mode 100644 index 46360ee869d4..000000000000 --- a/packages/kbn-ui-framework/src/components/popover/popover.js +++ /dev/null @@ -1,218 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React, { - Component, -} from 'react'; -import PropTypes from 'prop-types'; -import classNames from 'classnames'; -import FocusTrap from 'focus-trap-react'; -import tabbable from 'tabbable'; - -import { cascadingMenuKeyCodes } from '../../services'; - -import { KuiOutsideClickDetector } from '../outside_click_detector'; - -import { KuiPanelSimple, SIZES } from '../../components/panel_simple'; - -const anchorPositionToClassNameMap = { - 'center': '', - 'left': 'kuiPopover--anchorLeft', - 'right': 'kuiPopover--anchorRight', -}; - -export const ANCHOR_POSITIONS = Object.keys(anchorPositionToClassNameMap); - -export class KuiPopover extends Component { - constructor(props) { - super(props); - - this.closingTransitionTimeout = undefined; - - this.state = { - isClosing: false, - isOpening: false, - }; - } - - onKeyDown = e => { - if (e.keyCode === cascadingMenuKeyCodes.ESCAPE) { - this.props.closePopover(); - } - }; - - updateFocus() { - // Wait for the DOM to update. - window.requestAnimationFrame(() => { - if (!this.panel) { - return; - } - - // If we've already focused on something inside the panel, everything's fine. - if (this.panel.contains(document.activeElement)) { - return; - } - - // Otherwise let's focus the first tabbable item and expedite input from the user. - const tabbableItems = tabbable(this.panel); - if (tabbableItems.length) { - tabbableItems[0].focus(); - } - }); - } - - componentDidMount() { - this.updateFocus(); - } - - componentWillReceiveProps(nextProps) { - // The popover is being opened. - if (!this.props.isOpen && nextProps.isOpen) { - clearTimeout(this.closingTransitionTimeout); - // We need to set this state a beat after the render takes place, so that the CSS - // transition can take effect. - window.requestAnimationFrame(() => { - this.setState({ - isOpening: true, - }); - }); - } - - // The popover is being closed. - if (this.props.isOpen && !nextProps.isOpen) { - // If the user has just closed the popover, queue up the removal of the content after the - // transition is complete. - this.setState({ - isClosing: true, - isOpening: false, - }); - - this.closingTransitionTimeout = setTimeout(() => { - this.setState({ - isClosing: false, - }); - }, 250); - } - } - - componentDidUpdate() { - this.updateFocus(); - } - - componentWillUnmount() { - clearTimeout(this.closingTransitionTimeout); - } - - panelRef = node => { - if (this.props.ownFocus) { - this.panel = node; - } - }; - - render() { - const { - anchorPosition, - button, - isOpen, - ownFocus, - withTitle, - children, - className, - closePopover, - panelClassName, - panelPaddingSize, - ...rest - } = this.props; - - const classes = classNames( - 'kuiPopover', - anchorPositionToClassNameMap[anchorPosition], - className, - { - 'kuiPopover-isOpen': this.state.isOpening, - 'kuiPopover--withTitle': withTitle, - }, - ); - - const panelClasses = classNames('kuiPopover__panel', panelClassName); - - let panel; - - if (isOpen || this.state.isClosing) { - let tabIndex; - let initialFocus; - - if (ownFocus) { - tabIndex = '0'; - initialFocus = () => this.panel; - } - - panel = ( - - - {children} - - - ); - } - - return ( - -
    - {button} - {panel} -
    -     - ); - } -} - -KuiPopover.propTypes = { - isOpen: PropTypes.bool, - ownFocus: PropTypes.bool, - withTitle: PropTypes.bool, - closePopover: PropTypes.func.isRequired, - button: PropTypes.node.isRequired, - children: PropTypes.node, - anchorPosition: PropTypes.oneOf(ANCHOR_POSITIONS), - panelClassName: PropTypes.string, - panelPaddingSize: PropTypes.oneOf(SIZES), -}; - -KuiPopover.defaultProps = { - isOpen: false, - ownFocus: false, - anchorPosition: 'center', - panelPaddingSize: 'm', -}; diff --git a/packages/kbn-ui-framework/src/components/popover/popover.test.js b/packages/kbn-ui-framework/src/components/popover/popover.test.js deleted file mode 100644 index 683fdaf0525c..000000000000 --- a/packages/kbn-ui-framework/src/components/popover/popover.test.js +++ /dev/null @@ -1,218 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render, mount } from 'enzyme'; -import sinon from 'sinon'; -import { requiredProps } from '../../test/required_props'; - -import { KuiPopover } from './popover'; - -import { keyCodes } from '../../services'; - -describe('KuiPopover', () => { - test('is rendered', () => { - const component = render( - } - closePopover={() => {}} - {...requiredProps} - /> - ); - - expect(component) - .toMatchSnapshot(); - }); - - test('children is rendered', () => { - const component = render( - } - closePopover={() => {}} - > - Children - - ); - - expect(component) - .toMatchSnapshot(); - }); - - describe('props', () => { - describe('withTitle', () => { - test('is rendered', () => { - const component = render( - } - closePopover={() => {}} - /> - ); - - expect(component) - .toMatchSnapshot(); - }); - }); - - describe('closePopover', () => { - it('is called when ESC key is hit', () => { - const closePopoverHandler = sinon.stub(); - - const component = mount( - } - closePopover={closePopoverHandler} - /> - ); - - component.simulate('keydown', { keyCode: keyCodes.ESCAPE }); - sinon.assert.calledOnce(closePopoverHandler); - }); - }); - - describe('anchorPosition', () => { - test('defaults to center', () => { - const component = render( - } - closePopover={() => {}} - /> - ); - - expect(component) - .toMatchSnapshot(); - }); - - test('left is rendered', () => { - const component = render( - } - closePopover={() => {}} - anchorPosition="left" - /> - ); - - expect(component) - .toMatchSnapshot(); - }); - - test('right is rendered', () => { - const component = render( - } - closePopover={() => {}} - anchorPosition="right" - /> - ); - - expect(component) - .toMatchSnapshot(); - }); - }); - - describe('isOpen', () => { - test('defaults to false', () => { - const component = render( - } - closePopover={() => {}} - /> - ); - - expect(component) - .toMatchSnapshot(); - }); - - test('renders true', () => { - const component = render( - } - closePopover={() => {}} - isOpen - /> - ); - - expect(component) - .toMatchSnapshot(); - }); - }); - - describe('ownFocus', () => { - test('defaults to false', () => { - const component = render( - } - closePopover={() => {}} - /> - ); - - expect(component) - .toMatchSnapshot(); - }); - - test('renders true', () => { - const component = render( - } - closePopover={() => {}} - /> - ); - - expect(component) - .toMatchSnapshot(); - }); - }); - - describe('panelClassName', () => { - test('is rendered', () => { - const component = render( - } - closePopover={() => {}} - panelClassName="test" - isOpen - /> - ); - - expect(component) - .toMatchSnapshot(); - }); - }); - - describe('panelPaddingSize', () => { - test('is rendered', () => { - const component = render( - } - closePopover={() => {}} - panelPaddingSize="s" - isOpen - /> - ); - - expect(component) - .toMatchSnapshot(); - }); - }); - }); -}); diff --git a/packages/kbn-ui-framework/src/components/popover/popover_title.js b/packages/kbn-ui-framework/src/components/popover/popover_title.js deleted file mode 100644 index 88aae95d400c..000000000000 --- a/packages/kbn-ui-framework/src/components/popover/popover_title.js +++ /dev/null @@ -1,40 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import PropTypes from 'prop-types'; -import classNames from 'classnames'; - -export const KuiPopoverTitle = ({ children, className, ...rest }) => { - const classes = classNames('kuiPopoverTitle', className); - - return ( -
    - {children} -
    - ); -}; - -KuiPopoverTitle.propTypes = { - children: PropTypes.node, - className: PropTypes.string, -}; diff --git a/packages/kbn-ui-framework/src/components/popover/popover_title.test.js b/packages/kbn-ui-framework/src/components/popover/popover_title.test.js deleted file mode 100644 index 308afcfa97ca..000000000000 --- a/packages/kbn-ui-framework/src/components/popover/popover_title.test.js +++ /dev/null @@ -1,35 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { render } from 'enzyme'; -import { requiredProps } from '../../test/required_props'; - -import { KuiPopoverTitle } from './popover_title'; - -describe('KuiPopoverTitle', () => { - test('is rendered', () => { - const component = render( - - ); - - expect(component) - .toMatchSnapshot(); - }); -}); diff --git a/packages/kbn-ui-framework/src/components/toggle_button/_index.scss b/packages/kbn-ui-framework/src/components/toggle_button/_index.scss deleted file mode 100644 index 80ad91ff370f..000000000000 --- a/packages/kbn-ui-framework/src/components/toggle_button/_index.scss +++ /dev/null @@ -1,2 +0,0 @@ -@import "toggle_button"; -@import "toggle_panel"; diff --git a/packages/kbn-ui-framework/src/components/toggle_button/_toggle_button.scss b/packages/kbn-ui-framework/src/components/toggle_button/_toggle_button.scss deleted file mode 100644 index 81e4198f7978..000000000000 --- a/packages/kbn-ui-framework/src/components/toggle_button/_toggle_button.scss +++ /dev/null @@ -1,40 +0,0 @@ -/** - * 1. Allow container to determine font-size and line-height. - * 2. Override inherited Bootstrap styles. - */ -.kuiToggleButton { - appearance: none; - cursor: pointer; - background-color: transparent; - border: none; - padding: 0; - font-size: inherit; /* 1 */ - line-height: inherit; /* 1 */ - color: $kuiFontColor; - - &:focus { - color: $kuiFontColor; - } - - &:active { - color: $kuiLinkColor !important; /* 2 */ - } - - &:hover:not(:disabled) { - color: $kuiLinkHoverColor !important; /* 2 */ - text-decoration: underline; - } - - &:disabled { - cursor: not-allowed; - opacity: .5; - } -} - - /** - * 1. Make icon a consistent width so the text doesn't get pushed around as the icon changes - * between "expand" and "collapse". Use ems to be relative to inherited font-size. - */ - .kuiToggleButton__icon { - width: 0.8em; /* 1 */ - } diff --git a/packages/kbn-ui-framework/src/components/toggle_button/_toggle_panel.scss b/packages/kbn-ui-framework/src/components/toggle_button/_toggle_panel.scss deleted file mode 100644 index afa779b37481..000000000000 --- a/packages/kbn-ui-framework/src/components/toggle_button/_toggle_panel.scss +++ /dev/null @@ -1,13 +0,0 @@ -.kuiTogglePanelHeader { - padding-bottom: 4px; - margin-bottom: 15px; - border-bottom: $kuiBorderThin; - - /** - * 1. Allow the user to click anywhere on the header, not just on the button text. - */ - .kuiToggleButton { - width: 100%; /* 1 */ - text-align: left; /* 1 */ - } -}