From 5b3d57ab267b351132da93b8ba591d002227b853 Mon Sep 17 00:00:00 2001 From: mmartinsky Date: Wed, 8 May 2019 23:42:29 -0400 Subject: [PATCH 1/2] update Dropdown to accept optionHeight prop --- dash_core_components/Dropdown.py | 7 +- .../dash_core_components.dev.js | 2716 +++++++++-------- .../dash_core_components.dev.js.map | 2 +- .../dash_core_components.min.js | 12 +- .../dash_core_components.min.js.map | 2 +- dash_core_components/metadata.json | 293 +- demo/Demo.react.js | 5 +- demo/index.js | 2 +- src/components/Dropdown.react.js | 6 + 9 files changed, 1535 insertions(+), 1510 deletions(-) diff --git a/dash_core_components/Dropdown.py b/dash_core_components/Dropdown.py index 527f62388..983afb41f 100644 --- a/dash_core_components/Dropdown.py +++ b/dash_core_components/Dropdown.py @@ -26,6 +26,7 @@ class Dropdown(Component): multiple values can be selected at once, and `value` is an array of items with values corresponding to those in the `options` prop. +- optionHeight (number; optional): height of each option. Can be increased when label lengths would wrap around - className (string; optional): className of the dropdown element - clearable (boolean; optional): Whether or not the dropdown is "clearable", that is, whether or not a small "x" appears on the right of the dropdown that removes @@ -41,12 +42,12 @@ class Dropdown(Component): - prop_name (string; optional): Holds which property is loading - component_name (string; optional): Holds the name of the component that is loading""" @_explicitize_args - def __init__(self, id=Component.UNDEFINED, options=Component.UNDEFINED, value=Component.UNDEFINED, className=Component.UNDEFINED, clearable=Component.UNDEFINED, disabled=Component.UNDEFINED, multi=Component.UNDEFINED, placeholder=Component.UNDEFINED, searchable=Component.UNDEFINED, style=Component.UNDEFINED, loading_state=Component.UNDEFINED, **kwargs): - self._prop_names = ['id', 'options', 'value', 'className', 'clearable', 'disabled', 'multi', 'placeholder', 'searchable', 'style', 'loading_state'] + def __init__(self, id=Component.UNDEFINED, options=Component.UNDEFINED, value=Component.UNDEFINED, optionHeight=Component.UNDEFINED, className=Component.UNDEFINED, clearable=Component.UNDEFINED, disabled=Component.UNDEFINED, multi=Component.UNDEFINED, placeholder=Component.UNDEFINED, searchable=Component.UNDEFINED, style=Component.UNDEFINED, loading_state=Component.UNDEFINED, **kwargs): + self._prop_names = ['id', 'options', 'value', 'optionHeight', 'className', 'clearable', 'disabled', 'multi', 'placeholder', 'searchable', 'style', 'loading_state'] self._type = 'Dropdown' self._namespace = 'dash_core_components' self._valid_wildcard_attributes = [] - self.available_properties = ['id', 'options', 'value', 'className', 'clearable', 'disabled', 'multi', 'placeholder', 'searchable', 'style', 'loading_state'] + self.available_properties = ['id', 'options', 'value', 'optionHeight', 'className', 'clearable', 'disabled', 'multi', 'placeholder', 'searchable', 'style', 'loading_state'] self.available_wildcard_properties = [] _explicit_args = kwargs.pop('_explicit_args') diff --git a/dash_core_components/dash_core_components.dev.js b/dash_core_components/dash_core_components.dev.js index 785941947..8a75146f7 100644 --- a/dash_core_components/dash_core_components.dev.js +++ b/dash_core_components/dash_core_components.dev.js @@ -12287,7 +12287,7 @@ exports = module.exports = __webpack_require__(/*! ../../../node_modules/css-loa // module -exports.push([module.i, ".dash-logout-btn {\n padding: 1rem;\n background-color: #119DFF;\n border: 1px solid #119DFF;\n color: #ffffff;\n outline: none;\n cursor: pointer;\n text-align: center;\n}\n\n.dash-logout-btn:hover, .dash-logout-btn:focus {\n background-color: #0d76bf;\n border: 1px solid #0d76bf;\n}\n\n.dash-logout-frame {\n display: block;\n padding: 0;\n margin: 0;\n}\n", ""]); +exports.push([module.i, ".dash-logout-btn {\r\n padding: 1rem;\r\n background-color: #119DFF;\r\n border: 1px solid #119DFF;\r\n color: #ffffff;\r\n outline: none;\r\n cursor: pointer;\r\n text-align: center;\r\n}\r\n\r\n.dash-logout-btn:hover, .dash-logout-btn:focus {\r\n background-color: #0d76bf;\r\n border: 1px solid #0d76bf;\r\n}\r\n\r\n.dash-logout-frame {\r\n display: block;\r\n padding: 0;\r\n margin: 0;\r\n}\r\n", ""]); // exports @@ -12306,7 +12306,7 @@ exports = module.exports = __webpack_require__(/*! ../../../node_modules/css-loa // module -exports.push([module.i, ".rc-slider {\n position: relative;\n height: 14px;\n padding: 5px 0;\n width: 100%;\n border-radius: 6px;\n box-sizing: border-box;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n.rc-slider * {\n box-sizing: border-box;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n.rc-slider-rail {\n position: absolute;\n width: 100%;\n background-color: #e9e9e9;\n height: 4px;\n}\n.rc-slider-track {\n position: absolute;\n left: 0;\n height: 4px;\n border-radius: 6px;\n background-color: #abe2fb;\n}\n.rc-slider-handle {\n position: absolute;\n margin-left: -7px;\n margin-top: -5px;\n width: 14px;\n height: 14px;\n cursor: pointer;\n border-radius: 50%;\n border: solid 2px #96dbfa;\n background-color: #fff;\n}\n.rc-slider-handle:hover {\n border-color: #57c5f7;\n}\n.rc-slider-handle-active:active {\n border-color: #57c5f7;\n box-shadow: 0 0 5px #57c5f7;\n}\n.rc-slider-mark {\n position: absolute;\n top: 18px;\n left: 0;\n width: 100%;\n font-size: 12px;\n}\n.rc-slider-mark-text {\n position: absolute;\n display: inline-block;\n vertical-align: middle;\n text-align: center;\n cursor: pointer;\n color: #999;\n}\n.rc-slider-mark-text-active {\n color: #666;\n}\n.rc-slider-step {\n position: absolute;\n width: 100%;\n height: 4px;\n background: transparent;\n}\n.rc-slider-dot {\n position: absolute;\n bottom: -2px;\n margin-left: -4px;\n width: 8px;\n height: 8px;\n border: 2px solid #e9e9e9;\n background-color: #fff;\n cursor: pointer;\n border-radius: 50%;\n vertical-align: middle;\n}\n.rc-slider-dot:first-child {\n margin-left: -4px;\n}\n.rc-slider-dot:last-child {\n margin-left: -4px;\n}\n.rc-slider-dot-active {\n border-color: #96dbfa;\n}\n.rc-slider-disabled {\n background-color: #e9e9e9;\n}\n.rc-slider-disabled .rc-slider-track {\n background-color: #ccc;\n}\n.rc-slider-disabled .rc-slider-handle,\n.rc-slider-disabled .rc-slider-dot {\n border-color: #ccc;\n background-color: #fff;\n cursor: not-allowed;\n}\n.rc-slider-disabled .rc-slider-mark-text,\n.rc-slider-disabled .rc-slider-dot {\n cursor: not-allowed !important;\n}\n.rc-slider-vertical {\n width: 14px;\n height: 100%;\n padding: 0 5px;\n}\n.rc-slider-vertical .rc-slider-rail {\n height: 100%;\n width: 4px;\n}\n.rc-slider-vertical .rc-slider-track {\n left: 5px;\n bottom: 0;\n width: 4px;\n}\n.rc-slider-vertical .rc-slider-handle {\n margin-left: -5px;\n margin-bottom: -7px;\n}\n.rc-slider-vertical .rc-slider-mark {\n top: 0;\n left: 18px;\n height: 100%;\n}\n.rc-slider-vertical .rc-slider-step {\n height: 100%;\n width: 4px;\n}\n.rc-slider-vertical .rc-slider-dot {\n left: 2px;\n margin-bottom: -4px;\n}\n.rc-slider-vertical .rc-slider-dot:first-child {\n margin-bottom: -4px;\n}\n.rc-slider-vertical .rc-slider-dot:last-child {\n margin-bottom: -4px;\n}\n.rc-slider-tooltip-zoom-down-enter,\n.rc-slider-tooltip-zoom-down-appear {\n -webkit-animation-duration: .3s;\n animation-duration: .3s;\n -webkit-animation-fill-mode: both;\n animation-fill-mode: both;\n display: block !important;\n -webkit-animation-play-state: paused;\n animation-play-state: paused;\n}\n.rc-slider-tooltip-zoom-down-leave {\n -webkit-animation-duration: .3s;\n animation-duration: .3s;\n -webkit-animation-fill-mode: both;\n animation-fill-mode: both;\n display: block !important;\n -webkit-animation-play-state: paused;\n animation-play-state: paused;\n}\n.rc-slider-tooltip-zoom-down-enter.rc-slider-tooltip-zoom-down-enter-active,\n.rc-slider-tooltip-zoom-down-appear.rc-slider-tooltip-zoom-down-appear-active {\n -webkit-animation-name: rcSliderTooltipZoomDownIn;\n animation-name: rcSliderTooltipZoomDownIn;\n -webkit-animation-play-state: running;\n animation-play-state: running;\n}\n.rc-slider-tooltip-zoom-down-leave.rc-slider-tooltip-zoom-down-leave-active {\n -webkit-animation-name: rcSliderTooltipZoomDownOut;\n animation-name: rcSliderTooltipZoomDownOut;\n -webkit-animation-play-state: running;\n animation-play-state: running;\n}\n.rc-slider-tooltip-zoom-down-enter,\n.rc-slider-tooltip-zoom-down-appear {\n -webkit-transform: scale(0, 0);\n transform: scale(0, 0);\n -webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);\n animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);\n}\n.rc-slider-tooltip-zoom-down-leave {\n -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);\n animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);\n}\n@-webkit-keyframes rcSliderTooltipZoomDownIn {\n 0% {\n opacity: 0;\n -webkit-transform-origin: 50% 100%;\n transform-origin: 50% 100%;\n -webkit-transform: scale(0, 0);\n transform: scale(0, 0);\n }\n 100% {\n -webkit-transform-origin: 50% 100%;\n transform-origin: 50% 100%;\n -webkit-transform: scale(1, 1);\n transform: scale(1, 1);\n }\n}\n@keyframes rcSliderTooltipZoomDownIn {\n 0% {\n opacity: 0;\n -webkit-transform-origin: 50% 100%;\n transform-origin: 50% 100%;\n -webkit-transform: scale(0, 0);\n transform: scale(0, 0);\n }\n 100% {\n -webkit-transform-origin: 50% 100%;\n transform-origin: 50% 100%;\n -webkit-transform: scale(1, 1);\n transform: scale(1, 1);\n }\n}\n@-webkit-keyframes rcSliderTooltipZoomDownOut {\n 0% {\n -webkit-transform-origin: 50% 100%;\n transform-origin: 50% 100%;\n -webkit-transform: scale(1, 1);\n transform: scale(1, 1);\n }\n 100% {\n opacity: 0;\n -webkit-transform-origin: 50% 100%;\n transform-origin: 50% 100%;\n -webkit-transform: scale(0, 0);\n transform: scale(0, 0);\n }\n}\n@keyframes rcSliderTooltipZoomDownOut {\n 0% {\n -webkit-transform-origin: 50% 100%;\n transform-origin: 50% 100%;\n -webkit-transform: scale(1, 1);\n transform: scale(1, 1);\n }\n 100% {\n opacity: 0;\n -webkit-transform-origin: 50% 100%;\n transform-origin: 50% 100%;\n -webkit-transform: scale(0, 0);\n transform: scale(0, 0);\n }\n}\n.rc-slider-tooltip {\n position: absolute;\n left: -9999px;\n top: -9999px;\n visibility: visible;\n box-sizing: border-box;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n.rc-slider-tooltip * {\n box-sizing: border-box;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n.rc-slider-tooltip-hidden {\n display: none;\n}\n.rc-slider-tooltip-placement-top {\n padding: 4px 0 8px 0;\n}\n.rc-slider-tooltip-inner {\n padding: 6px 2px;\n min-width: 24px;\n height: 24px;\n font-size: 12px;\n line-height: 1;\n color: #fff;\n text-align: center;\n text-decoration: none;\n background-color: #6c6c6c;\n border-radius: 6px;\n box-shadow: 0 0 4px #d9d9d9;\n}\n.rc-slider-tooltip-arrow {\n position: absolute;\n width: 0;\n height: 0;\n border-color: transparent;\n border-style: solid;\n}\n.rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow {\n bottom: 4px;\n left: 50%;\n margin-left: -4px;\n border-width: 4px 4px 0;\n border-top-color: #6c6c6c;\n}\n", ""]); +exports.push([module.i, ".rc-slider {\r\n position: relative;\r\n height: 14px;\r\n padding: 5px 0;\r\n width: 100%;\r\n border-radius: 6px;\r\n box-sizing: border-box;\r\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\r\n}\r\n.rc-slider * {\r\n box-sizing: border-box;\r\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\r\n}\r\n.rc-slider-rail {\r\n position: absolute;\r\n width: 100%;\r\n background-color: #e9e9e9;\r\n height: 4px;\r\n}\r\n.rc-slider-track {\r\n position: absolute;\r\n left: 0;\r\n height: 4px;\r\n border-radius: 6px;\r\n background-color: #abe2fb;\r\n}\r\n.rc-slider-handle {\r\n position: absolute;\r\n margin-left: -7px;\r\n margin-top: -5px;\r\n width: 14px;\r\n height: 14px;\r\n cursor: pointer;\r\n border-radius: 50%;\r\n border: solid 2px #96dbfa;\r\n background-color: #fff;\r\n}\r\n.rc-slider-handle:hover {\r\n border-color: #57c5f7;\r\n}\r\n.rc-slider-handle-active:active {\r\n border-color: #57c5f7;\r\n box-shadow: 0 0 5px #57c5f7;\r\n}\r\n.rc-slider-mark {\r\n position: absolute;\r\n top: 18px;\r\n left: 0;\r\n width: 100%;\r\n font-size: 12px;\r\n}\r\n.rc-slider-mark-text {\r\n position: absolute;\r\n display: inline-block;\r\n vertical-align: middle;\r\n text-align: center;\r\n cursor: pointer;\r\n color: #999;\r\n}\r\n.rc-slider-mark-text-active {\r\n color: #666;\r\n}\r\n.rc-slider-step {\r\n position: absolute;\r\n width: 100%;\r\n height: 4px;\r\n background: transparent;\r\n}\r\n.rc-slider-dot {\r\n position: absolute;\r\n bottom: -2px;\r\n margin-left: -4px;\r\n width: 8px;\r\n height: 8px;\r\n border: 2px solid #e9e9e9;\r\n background-color: #fff;\r\n cursor: pointer;\r\n border-radius: 50%;\r\n vertical-align: middle;\r\n}\r\n.rc-slider-dot:first-child {\r\n margin-left: -4px;\r\n}\r\n.rc-slider-dot:last-child {\r\n margin-left: -4px;\r\n}\r\n.rc-slider-dot-active {\r\n border-color: #96dbfa;\r\n}\r\n.rc-slider-disabled {\r\n background-color: #e9e9e9;\r\n}\r\n.rc-slider-disabled .rc-slider-track {\r\n background-color: #ccc;\r\n}\r\n.rc-slider-disabled .rc-slider-handle,\r\n.rc-slider-disabled .rc-slider-dot {\r\n border-color: #ccc;\r\n background-color: #fff;\r\n cursor: not-allowed;\r\n}\r\n.rc-slider-disabled .rc-slider-mark-text,\r\n.rc-slider-disabled .rc-slider-dot {\r\n cursor: not-allowed !important;\r\n}\r\n.rc-slider-vertical {\r\n width: 14px;\r\n height: 100%;\r\n padding: 0 5px;\r\n}\r\n.rc-slider-vertical .rc-slider-rail {\r\n height: 100%;\r\n width: 4px;\r\n}\r\n.rc-slider-vertical .rc-slider-track {\r\n left: 5px;\r\n bottom: 0;\r\n width: 4px;\r\n}\r\n.rc-slider-vertical .rc-slider-handle {\r\n margin-left: -5px;\r\n margin-bottom: -7px;\r\n}\r\n.rc-slider-vertical .rc-slider-mark {\r\n top: 0;\r\n left: 18px;\r\n height: 100%;\r\n}\r\n.rc-slider-vertical .rc-slider-step {\r\n height: 100%;\r\n width: 4px;\r\n}\r\n.rc-slider-vertical .rc-slider-dot {\r\n left: 2px;\r\n margin-bottom: -4px;\r\n}\r\n.rc-slider-vertical .rc-slider-dot:first-child {\r\n margin-bottom: -4px;\r\n}\r\n.rc-slider-vertical .rc-slider-dot:last-child {\r\n margin-bottom: -4px;\r\n}\r\n.rc-slider-tooltip-zoom-down-enter,\r\n.rc-slider-tooltip-zoom-down-appear {\r\n -webkit-animation-duration: .3s;\r\n animation-duration: .3s;\r\n -webkit-animation-fill-mode: both;\r\n animation-fill-mode: both;\r\n display: block !important;\r\n -webkit-animation-play-state: paused;\r\n animation-play-state: paused;\r\n}\r\n.rc-slider-tooltip-zoom-down-leave {\r\n -webkit-animation-duration: .3s;\r\n animation-duration: .3s;\r\n -webkit-animation-fill-mode: both;\r\n animation-fill-mode: both;\r\n display: block !important;\r\n -webkit-animation-play-state: paused;\r\n animation-play-state: paused;\r\n}\r\n.rc-slider-tooltip-zoom-down-enter.rc-slider-tooltip-zoom-down-enter-active,\r\n.rc-slider-tooltip-zoom-down-appear.rc-slider-tooltip-zoom-down-appear-active {\r\n -webkit-animation-name: rcSliderTooltipZoomDownIn;\r\n animation-name: rcSliderTooltipZoomDownIn;\r\n -webkit-animation-play-state: running;\r\n animation-play-state: running;\r\n}\r\n.rc-slider-tooltip-zoom-down-leave.rc-slider-tooltip-zoom-down-leave-active {\r\n -webkit-animation-name: rcSliderTooltipZoomDownOut;\r\n animation-name: rcSliderTooltipZoomDownOut;\r\n -webkit-animation-play-state: running;\r\n animation-play-state: running;\r\n}\r\n.rc-slider-tooltip-zoom-down-enter,\r\n.rc-slider-tooltip-zoom-down-appear {\r\n -webkit-transform: scale(0, 0);\r\n transform: scale(0, 0);\r\n -webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);\r\n animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);\r\n}\r\n.rc-slider-tooltip-zoom-down-leave {\r\n -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);\r\n animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);\r\n}\r\n@-webkit-keyframes rcSliderTooltipZoomDownIn {\r\n 0% {\r\n opacity: 0;\r\n -webkit-transform-origin: 50% 100%;\r\n transform-origin: 50% 100%;\r\n -webkit-transform: scale(0, 0);\r\n transform: scale(0, 0);\r\n }\r\n 100% {\r\n -webkit-transform-origin: 50% 100%;\r\n transform-origin: 50% 100%;\r\n -webkit-transform: scale(1, 1);\r\n transform: scale(1, 1);\r\n }\r\n}\r\n@keyframes rcSliderTooltipZoomDownIn {\r\n 0% {\r\n opacity: 0;\r\n -webkit-transform-origin: 50% 100%;\r\n transform-origin: 50% 100%;\r\n -webkit-transform: scale(0, 0);\r\n transform: scale(0, 0);\r\n }\r\n 100% {\r\n -webkit-transform-origin: 50% 100%;\r\n transform-origin: 50% 100%;\r\n -webkit-transform: scale(1, 1);\r\n transform: scale(1, 1);\r\n }\r\n}\r\n@-webkit-keyframes rcSliderTooltipZoomDownOut {\r\n 0% {\r\n -webkit-transform-origin: 50% 100%;\r\n transform-origin: 50% 100%;\r\n -webkit-transform: scale(1, 1);\r\n transform: scale(1, 1);\r\n }\r\n 100% {\r\n opacity: 0;\r\n -webkit-transform-origin: 50% 100%;\r\n transform-origin: 50% 100%;\r\n -webkit-transform: scale(0, 0);\r\n transform: scale(0, 0);\r\n }\r\n}\r\n@keyframes rcSliderTooltipZoomDownOut {\r\n 0% {\r\n -webkit-transform-origin: 50% 100%;\r\n transform-origin: 50% 100%;\r\n -webkit-transform: scale(1, 1);\r\n transform: scale(1, 1);\r\n }\r\n 100% {\r\n opacity: 0;\r\n -webkit-transform-origin: 50% 100%;\r\n transform-origin: 50% 100%;\r\n -webkit-transform: scale(0, 0);\r\n transform: scale(0, 0);\r\n }\r\n}\r\n.rc-slider-tooltip {\r\n position: absolute;\r\n left: -9999px;\r\n top: -9999px;\r\n visibility: visible;\r\n box-sizing: border-box;\r\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\r\n}\r\n.rc-slider-tooltip * {\r\n box-sizing: border-box;\r\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\r\n}\r\n.rc-slider-tooltip-hidden {\r\n display: none;\r\n}\r\n.rc-slider-tooltip-placement-top {\r\n padding: 4px 0 8px 0;\r\n}\r\n.rc-slider-tooltip-inner {\r\n padding: 6px 2px;\r\n min-width: 24px;\r\n height: 24px;\r\n font-size: 12px;\r\n line-height: 1;\r\n color: #fff;\r\n text-align: center;\r\n text-decoration: none;\r\n background-color: #6c6c6c;\r\n border-radius: 6px;\r\n box-shadow: 0 0 4px #d9d9d9;\r\n}\r\n.rc-slider-tooltip-arrow {\r\n position: absolute;\r\n width: 0;\r\n height: 0;\r\n border-color: transparent;\r\n border-style: solid;\r\n}\r\n.rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow {\r\n bottom: 4px;\r\n left: 50%;\r\n margin-left: -4px;\r\n border-width: 4px 4px 0;\r\n border-top-color: #6c6c6c;\r\n}\r\n", ""]); // exports @@ -12325,7 +12325,7 @@ exports = module.exports = __webpack_require__(/*! ../../../node_modules/css-loa // module -exports.push([module.i, ".DateInput_input {\n box-sizing: border-box;\n}", ""]); +exports.push([module.i, ".DateInput_input {\r\n box-sizing: border-box;\r\n}", ""]); // exports @@ -12363,7 +12363,7 @@ exports = module.exports = __webpack_require__(/*! ../../../node_modules/css-loa // module -exports.push([module.i, ".VirtualSelectGrid {\n z-index: 1;\n}\n\n.VirtualizedSelectOption {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n padding: 0 .5rem;\n}\n.VirtualizedSelectFocusedOption {\n background-color: rgba(0, 126, 255, 0.1);\n}\n.VirtualizedSelectDisabledOption {\n opacity: 0.5;\n}\n.VirtualizedSelectSelectedOption {\n font-weight: bold;\n}\n", ""]); +exports.push([module.i, ".VirtualSelectGrid {\r\n z-index: 1;\r\n}\r\n\r\n.VirtualizedSelectOption {\r\n display: -webkit-box;\r\n display: -ms-flexbox;\r\n display: flex;\r\n -webkit-box-align: center;\r\n -ms-flex-align: center;\r\n align-items: center;\r\n padding: 0 .5rem;\r\n}\r\n.VirtualizedSelectFocusedOption {\r\n background-color: rgba(0, 126, 255, 0.1);\r\n}\r\n.VirtualizedSelectDisabledOption {\r\n opacity: 0.5;\r\n}\r\n.VirtualizedSelectSelectedOption {\r\n font-weight: bold;\r\n}\r\n", ""]); // exports @@ -12382,7 +12382,7 @@ exports = module.exports = __webpack_require__(/*! ../../../node_modules/css-loa // module -exports.push([module.i, "/* Collection default theme */\n\n.ReactVirtualized__Collection {\n}\n\n.ReactVirtualized__Collection__innerScrollContainer {\n}\n\n/* Grid default theme */\n\n.ReactVirtualized__Grid {\n}\n\n.ReactVirtualized__Grid__innerScrollContainer {\n}\n\n/* Table default theme */\n\n.ReactVirtualized__Table {\n}\n\n.ReactVirtualized__Table__Grid {\n}\n\n.ReactVirtualized__Table__headerRow {\n font-weight: 700;\n text-transform: uppercase;\n display: -webkit-flex;\n display: -moz-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-flex-direction: row;\n -moz-box-orient: horizontal;\n -moz-box-direction: normal;\n -ms-flex-direction: row;\n flex-direction: row;\n -webkit-align-items: center;\n -moz-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n}\n.ReactVirtualized__Table__row {\n display: -webkit-flex;\n display: -moz-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-flex-direction: row;\n -moz-box-orient: horizontal;\n -moz-box-direction: normal;\n -ms-flex-direction: row;\n flex-direction: row;\n -webkit-align-items: center;\n -moz-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n}\n\n.ReactVirtualized__Table__headerTruncatedText {\n display: inline-block;\n max-width: 100%;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n.ReactVirtualized__Table__headerColumn,\n.ReactVirtualized__Table__rowColumn {\n margin-right: 10px;\n min-width: 0px;\n}\n.ReactVirtualized__Table__rowColumn {\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.ReactVirtualized__Table__headerColumn:first-of-type,\n.ReactVirtualized__Table__rowColumn:first-of-type {\n margin-left: 10px;\n}\n.ReactVirtualized__Table__sortableHeaderColumn {\n cursor: pointer;\n}\n\n.ReactVirtualized__Table__sortableHeaderIconContainer {\n display: -webkit-flex;\n display: -moz-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-align-items: center;\n -moz-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n}\n.ReactVirtualized__Table__sortableHeaderIcon {\n -webkit-flex: 0 0 24px;\n -moz-box-flex: 0;\n -ms-flex: 0 0 24px;\n flex: 0 0 24px;\n height: 1em;\n width: 1em;\n fill: currentColor;\n}\n\n/* List default theme */\n\n.ReactVirtualized__List {\n}\n", ""]); +exports.push([module.i, "/* Collection default theme */\r\n\r\n.ReactVirtualized__Collection {\r\n}\r\n\r\n.ReactVirtualized__Collection__innerScrollContainer {\r\n}\r\n\r\n/* Grid default theme */\r\n\r\n.ReactVirtualized__Grid {\r\n}\r\n\r\n.ReactVirtualized__Grid__innerScrollContainer {\r\n}\r\n\r\n/* Table default theme */\r\n\r\n.ReactVirtualized__Table {\r\n}\r\n\r\n.ReactVirtualized__Table__Grid {\r\n}\r\n\r\n.ReactVirtualized__Table__headerRow {\r\n font-weight: 700;\r\n text-transform: uppercase;\r\n display: -webkit-flex;\r\n display: -moz-box;\r\n display: -ms-flexbox;\r\n display: flex;\r\n -webkit-flex-direction: row;\r\n -moz-box-orient: horizontal;\r\n -moz-box-direction: normal;\r\n -ms-flex-direction: row;\r\n flex-direction: row;\r\n -webkit-align-items: center;\r\n -moz-box-align: center;\r\n -ms-flex-align: center;\r\n align-items: center;\r\n}\r\n.ReactVirtualized__Table__row {\r\n display: -webkit-flex;\r\n display: -moz-box;\r\n display: -ms-flexbox;\r\n display: flex;\r\n -webkit-flex-direction: row;\r\n -moz-box-orient: horizontal;\r\n -moz-box-direction: normal;\r\n -ms-flex-direction: row;\r\n flex-direction: row;\r\n -webkit-align-items: center;\r\n -moz-box-align: center;\r\n -ms-flex-align: center;\r\n align-items: center;\r\n}\r\n\r\n.ReactVirtualized__Table__headerTruncatedText {\r\n display: inline-block;\r\n max-width: 100%;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n}\r\n\r\n.ReactVirtualized__Table__headerColumn,\r\n.ReactVirtualized__Table__rowColumn {\r\n margin-right: 10px;\r\n min-width: 0px;\r\n}\r\n.ReactVirtualized__Table__rowColumn {\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n}\r\n\r\n.ReactVirtualized__Table__headerColumn:first-of-type,\r\n.ReactVirtualized__Table__rowColumn:first-of-type {\r\n margin-left: 10px;\r\n}\r\n.ReactVirtualized__Table__sortableHeaderColumn {\r\n cursor: pointer;\r\n}\r\n\r\n.ReactVirtualized__Table__sortableHeaderIconContainer {\r\n display: -webkit-flex;\r\n display: -moz-box;\r\n display: -ms-flexbox;\r\n display: flex;\r\n -webkit-align-items: center;\r\n -moz-box-align: center;\r\n -ms-flex-align: center;\r\n align-items: center;\r\n}\r\n.ReactVirtualized__Table__sortableHeaderIcon {\r\n -webkit-flex: 0 0 24px;\r\n -moz-box-flex: 0;\r\n -ms-flex: 0 0 24px;\r\n flex: 0 0 24px;\r\n height: 1em;\r\n width: 1em;\r\n fill: currentColor;\r\n}\r\n\r\n/* List default theme */\r\n\r\n.ReactVirtualized__List {\r\n}\r\n", ""]); // exports @@ -122822,11 +122822,11 @@ function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || func -/** - * Checklist is a component that encapsulates several checkboxes. - * The values and labels of the checklist is specified in the `options` - * property and the checked items are specified with the `values` property. - * Each checkbox is rendered as an input with a surrounding label. +/** + * Checklist is a component that encapsulates several checkboxes. + * The values and labels of the checklist is specified in the `options` + * property and the checked items are specified with the `values` property. + * Each checkbox is rendered as an input with a surrounding label. */ var Checklist = @@ -122894,93 +122894,93 @@ function (_Component) { Checklist.propTypes = { - /** - * The ID of this component, used to identify dash components - * in callbacks. The ID needs to be unique across all of the - * components in an app. + /** + * The ID of this component, used to identify dash components + * in callbacks. The ID needs to be unique across all of the + * components in an app. */ id: prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.string, - /** - * An array of options + /** + * An array of options */ options: prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.exact({ - /** - * The checkbox's label + /** + * The checkbox's label */ label: prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.string, prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.number]).isRequired, - /** - * The value of the checkbox. This value - * corresponds to the items specified in the - * `values` property. + /** + * The value of the checkbox. This value + * corresponds to the items specified in the + * `values` property. */ value: prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.string, prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.number]).isRequired, - /** - * If true, this checkbox is disabled and can't be clicked on. + /** + * If true, this checkbox is disabled and can't be clicked on. */ disabled: prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.bool })), - /** - * The currently selected value + /** + * The currently selected value */ values: prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.string, prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.number])), - /** - * The class of the container (div) + /** + * The class of the container (div) */ className: prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.string, - /** - * The style of the container (div) + /** + * The style of the container (div) */ style: prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.object, - /** - * The style of the checkbox element + /** + * The style of the checkbox element */ inputStyle: prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.object, - /** - * The class of the checkbox element + /** + * The class of the checkbox element */ inputClassName: prop_types__WEBPACK_IMPORTED_MODULE_0___default.a.string, - /** - * The style of the