kepler.gl.geoiq
Version:
kepler.gl is a webgl based application to visualize large scale location data in the browser
777 lines (745 loc) • 125 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.panelHeaderIcon = exports.panelHeaderHeight = exports.panelBoxShadow = exports.panelBorderRadius = exports.panelBorderLT = exports.panelBorderColor = exports.panelBorder = exports.panelBackgroundLT = exports.panelBackgroundHover = exports.panelBackground = exports.panelActiveBgLT = exports.panelActiveBg = exports.notificationPanelWidth = exports.notificationPanelItemWidth = exports.notificationPanelItemHeight = exports.notificationColors = exports.negativeBtnColor = exports.negativeBtnBgdHover = exports.negativeBtnBgd = exports.negativeBtnActColor = exports.negativeBtnActBgd = exports.modalTitleZ = exports.modalTitleFontSizeSmaller = exports.modalTitleFontSize = exports.modalTitleColor = exports.modalScrollBar = exports.modalPortableLateralPadding = exports.modalPadding = exports.modalOverlayBgd = exports.modalOverLayZ = exports.modalLateralPadding = exports.modalImagePlaceHolder = exports.modalFooterZ = exports.modalFooterBgd = exports.modalDialogColor = exports.modalDialogBgd = exports.modalContentZ = exports.modalButtonZ = exports.mapPanelHeaderBackgroundColor = exports.mapPanelBackgroundColor = exports.linkBtnColor = exports.linkBtnBgd = exports.linkBtnActColor = exports.linkBtnActBgdHover = exports.linkBtnActBgd = exports.lineHeight = exports.labelHoverColor = exports.labelColorLT = exports.labelColor = exports.inputPlaceholderFontWeight = exports.inputPlaceholderColor = exports.inputPaddingTiny = exports.inputPaddingSmall = exports.inputPadding = exports.inputFontWeight = exports.inputFontSizeSmall = exports.inputFontSize = exports.inputColor = exports.inputBoxHeightTiny = exports.inputBoxHeightSmall = exports.inputBoxHeight = exports.inputBorderRadius = exports.inputBorderHoverColor = exports.inputBorderColor = exports.inputBorderActiveColor = exports.inputBgdHover = exports.inputBgdActive = exports.inputBgd = exports.histogramFillOutRange = exports.histogramFillInRange = exports.fontWeight = exports.fontSize = exports.fontFamily = exports.errorColor = exports.dropdownWrapperZ = exports.dropdownListShadow = exports.dropdownListHighlightBg = exports.dropdownListBorderTop = exports.dropdownListBgd = exports.checkboxWidth = exports.checkboxMargin = exports.checkboxHeight = exports.checkboxBoxBgdChecked = exports.checkboxBoxBgd = exports.checkboxBorderRadius = exports.checkboxBorderColorLT = exports.checkboxBorderColor = exports.breakPoints = exports.boxSizing = exports.boxShadow = exports.bottomPanelGap = exports.bottomInnerPdVert = exports.bottomInnerPdSide = exports.borderRadius = exports.borderColorLight = exports.borderColor = exports.activeColorHover = exports.activeColor = exports.actionPanelWidth = exports.actionPanelHeight = void 0;
exports.transitionSlow = exports.transitionFast = exports.transition = exports.tooltipColor = exports.tooltipBg = exports.titleTextColor = exports.titleColorLT = exports.themeLT = exports.theme = exports.textTruncate = exports.textColorLT = exports.textColorHlLT = exports.textColorHl = exports.textColor = exports.switchWidth = exports.switchTrackBorderRadius = exports.switchTrackBgdActive = exports.switchTrackBgd = exports.switchLabelMargin = exports.switchHeight = exports.switchBtnWidth = exports.switchBtnHeight = exports.switchBtnBoxShadow = exports.switchBtnBorderRadius = exports.switchBtnBgdActive = exports.switchBtnBgd = exports.subtextColorLT = exports.subtextColorActive = exports.subtextColor = exports.sliderMarginTopIsRange = exports.sliderMarginTop = exports.sliderInputWidth = exports.sliderInputHeight = exports.sliderHandleWidth = exports.sliderHandleShadow = exports.sliderHandleHoverColor = exports.sliderHandleHeight = exports.sliderHandleColor = exports.sliderBarRadius = exports.sliderBarHoverColor = exports.sliderBarHeight = exports.sliderBarColor = exports.sliderBarBgd = exports.sidePanelScrollBarWidth = exports.sidePanelScrollBarHeight = exports.sidePanelInnerPadding = exports.sidePanelHeaderBg = exports.sidePanelBg = exports.sideBarCloseBtnColor = exports.sideBarCloseBtnBgdHover = exports.sideBarCloseBtnBgd = exports.selectFontWeightBold = exports.selectFontWeight = exports.selectFontSize = exports.selectColorPlaceHolder = exports.selectColorLT = exports.selectColor = exports.selectBorderRadius = exports.selectBorderColorLT = exports.selectBorderColor = exports.selectBorder = exports.selectBackgroundLT = exports.selectBackgroundHoverLT = exports.selectBackgroundHover = exports.selectBackground = exports.selectActiveBorderColor = exports.secondarySwitchTrackBgd = exports.secondarySwitchBtnBgd = exports.secondaryInputColor = exports.secondaryInputBorderColor = exports.secondaryInputBorderActiveColor = exports.secondaryInputBgdHover = exports.secondaryInputBgdActive = exports.secondaryInputBgd = exports.secondaryBtnColor = exports.secondaryBtnBgdHover = exports.secondaryBtnBgd = exports.secondaryBtnActColor = exports.secondaryBtnActBgd = exports.rangeBrushBgd = exports.primaryBtnRadius = exports.primaryBtnColor = exports.primaryBtnBgdHover = exports.primaryBtnBgd = exports.primaryBtnActColor = exports.primaryBtnActBgd = exports.panelHeaderIconActive = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
var _styledComponents = require("styled-components");
var _defaultSettings = require("../constants/default-settings");
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24;
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var transition = exports.transition = 'all .4s ease';
var transitionFast = exports.transitionFast = 'all .2s ease';
var transitionSlow = exports.transitionSlow = 'all .8s ease';
var boxShadow = exports.boxShadow = '0 1px 2px 0 rgba(0,0,0,0.10)';
var boxSizing = exports.boxSizing = 'border-box';
var borderRadius = exports.borderRadius = '1px';
var borderColor = exports.borderColor = '#3A414C';
var borderColorLight = exports.borderColorLight = '#F1F1F1'; // TEXT
var fontFamily = exports.fontFamily = "\"Montserrat\", \"Roboto\", sans-serif";
var fontWeight = exports.fontWeight = 400;
var fontSize = exports.fontSize = '0.875em';
var lineHeight = exports.lineHeight = 1.71429;
var labelColor = exports.labelColor = '#96A3AE';
var labelHoverColor = exports.labelHoverColor = '#C6C6C6';
var labelColorLT = exports.labelColorLT = '#96A3AE';
var textColor = exports.textColor = '#162842';
var textColorLT = exports.textColorLT = '#3A414C';
var titleColorLT = exports.titleColorLT = '#29323C';
var subtextColor = exports.subtextColor = '#96A3AE';
var subtextColorLT = exports.subtextColorLT = '#494C52';
var subtextColorActive = exports.subtextColorActive = '#F63754';
var titleTextColor = exports.titleTextColor = '#f63654';
var textColorHl = exports.textColorHl = '#F63754';
var textColorHlLT = exports.textColorHlLT = '#6c7687';
var activeColor = exports.activeColor = '#1FBAD6';
var activeColorHover = exports.activeColorHover = '#108188';
var errorColor = exports.errorColor = '#F9042C'; // Button
var primaryBtnBgd = exports.primaryBtnBgd = '#E63946';
var primaryBtnActBgd = exports.primaryBtnActBgd = '#EC6974';
var primaryBtnColor = exports.primaryBtnColor = '#FFFFFF';
var primaryBtnActColor = exports.primaryBtnActColor = '#FFFFFF';
var primaryBtnBgdHover = exports.primaryBtnBgdHover = '#EC6974';
var primaryBtnRadius = exports.primaryBtnRadius = '4px';
var secondaryBtnBgd = exports.secondaryBtnBgd = '#457B9D';
var secondaryBtnActBgd = exports.secondaryBtnActBgd = '#6A9EBE';
var secondaryBtnColor = exports.secondaryBtnColor = '#FFFFFF';
var secondaryBtnActColor = exports.secondaryBtnActColor = '#FFFFFF';
var secondaryBtnBgdHover = exports.secondaryBtnBgdHover = '#6A9EBE';
var linkBtnBgd = exports.linkBtnBgd = 'transparent';
var linkBtnActBgd = exports.linkBtnActBgd = linkBtnBgd;
var linkBtnColor = exports.linkBtnColor = '#494C52';
var linkBtnActColor = exports.linkBtnActColor = textColorHlLT;
var linkBtnActBgdHover = exports.linkBtnActBgdHover = linkBtnBgd;
var negativeBtnBgd = exports.negativeBtnBgd = errorColor;
var negativeBtnActBgd = exports.negativeBtnActBgd = '#FF193E';
var negativeBtnBgdHover = exports.negativeBtnBgdHover = '#FF193E';
var negativeBtnColor = exports.negativeBtnColor = '#FFFFFF';
var negativeBtnActColor = exports.negativeBtnActColor = '#FFFFFF'; // Input
var inputBoxHeight = exports.inputBoxHeight = '34px';
var inputBoxHeightSmall = exports.inputBoxHeightSmall = '24px';
var inputBoxHeightTiny = exports.inputBoxHeightTiny = '18px';
var inputPadding = exports.inputPadding = '4px 10px';
var inputPaddingSmall = exports.inputPaddingSmall = '4px 6px';
var inputPaddingTiny = exports.inputPaddingTiny = '2px 4px';
var inputFontSize = exports.inputFontSize = '11px';
var inputFontSizeSmall = exports.inputFontSizeSmall = '10px';
var inputFontWeight = exports.inputFontWeight = 500;
var inputBgd = exports.inputBgd = '#f7f7f7';
var inputBgdHover = exports.inputBgdHover = '#ffffff';
var inputBgdActive = exports.inputBgdActive = '#ffffff';
var inputBorderColor = exports.inputBorderColor = '#29323C';
var inputBorderHoverColor = exports.inputBorderHoverColor = '#D4D4D2';
var inputBorderActiveColor = exports.inputBorderActiveColor = '#D3D8E0';
var inputColor = exports.inputColor = '#494C52';
var inputBorderRadius = exports.inputBorderRadius = '1px';
var inputPlaceholderColor = exports.inputPlaceholderColor = '#494C52';
var inputPlaceholderFontWeight = exports.inputPlaceholderFontWeight = 400;
var secondaryInputBgd = exports.secondaryInputBgd = '#f7f7F7';
var secondaryInputBgdHover = exports.secondaryInputBgdHover = '#ffffff';
var secondaryInputBgdActive = exports.secondaryInputBgdActive = '#f7f7F7';
var secondaryInputColor = exports.secondaryInputColor = '#A0A7B4';
var secondaryInputBorderColor = exports.secondaryInputBorderColor = '#242730';
var secondaryInputBorderActiveColor = exports.secondaryInputBorderActiveColor = '#D3D8E0'; // Select
var selectColor = exports.selectColor = inputColor;
var selectColorLT = exports.selectColorLT = titleColorLT;
var selectActiveBorderColor = exports.selectActiveBorderColor = '#D3D8E0';
var selectFontSize = exports.selectFontSize = '11px';
var selectFontWeight = exports.selectFontWeight = '400';
var selectFontWeightBold = exports.selectFontWeightBold = '500';
var selectColorPlaceHolder = exports.selectColorPlaceHolder = '#494C52';
var selectBackground = exports.selectBackground = inputBgd;
var selectBackgroundHover = exports.selectBackgroundHover = inputBgdHover;
var selectBackgroundLT = exports.selectBackgroundLT = '#4E4F4F';
var selectBackgroundHoverLT = exports.selectBackgroundHoverLT = '#F8F8F9';
var selectBorderColor = exports.selectBorderColor = '#D3D8E0';
var selectBorderColorLT = exports.selectBorderColorLT = '#D3D8E0';
var selectBorderRadius = exports.selectBorderRadius = '1px';
var selectBorder = exports.selectBorder = 0;
var dropdownListHighlightBg = exports.dropdownListHighlightBg = '#f0f0f0';
var dropdownListShadow = exports.dropdownListShadow = '0 6px 12px 0 rgba(0,0,0,0.16)';
var dropdownListBgd = exports.dropdownListBgd = '#ffffff';
var dropdownListBorderTop = exports.dropdownListBorderTop = '#242730';
var dropdownWrapperZ = exports.dropdownWrapperZ = 100; // Switch
var switchWidth = exports.switchWidth = 24;
var switchHeight = exports.switchHeight = 12;
var switchLabelMargin = exports.switchLabelMargin = 12;
var switchTrackBgd = exports.switchTrackBgd = '#D4D4D2';
var switchTrackBgdActive = exports.switchTrackBgdActive = activeColor;
var switchTrackBorderRadius = exports.switchTrackBorderRadius = '1px';
var switchBtnBgd = exports.switchBtnBgd = '#6A7485';
var switchBtnBgdActive = exports.switchBtnBgdActive = '#D3D8E0';
var switchBtnBoxShadow = exports.switchBtnBoxShadow = '0 2px 4px 0 rgba(0,0,0,0.40)';
var switchBtnBorderRadius = exports.switchBtnBorderRadius = '1px';
var switchBtnWidth = exports.switchBtnWidth = '12px';
var switchBtnHeight = exports.switchBtnHeight = '12px';
var secondarySwitchTrackBgd = exports.secondarySwitchTrackBgd = '#D4D4D2';
var secondarySwitchBtnBgd = exports.secondarySwitchBtnBgd = '#D3D8E0'; // Checkbox
var checkboxWidth = exports.checkboxWidth = 16;
var checkboxHeight = exports.checkboxHeight = 16;
var checkboxMargin = exports.checkboxMargin = 12;
var checkboxBorderColor = exports.checkboxBorderColor = selectBorderColor;
var checkboxBorderRadius = exports.checkboxBorderRadius = '2px';
var checkboxBorderColorLT = exports.checkboxBorderColorLT = selectBorderColorLT;
var checkboxBoxBgd = exports.checkboxBoxBgd = 'white';
var checkboxBoxBgdChecked = exports.checkboxBoxBgdChecked = primaryBtnBgd; // Side Panel
var sidePanelHeaderBg = exports.sidePanelHeaderBg = '#f7f7F7';
var sidePanelInnerPadding = exports.sidePanelInnerPadding = 16;
var sidePanelBg = exports.sidePanelBg = '#ffffff';
var sidePanelScrollBarWidth = exports.sidePanelScrollBarWidth = 10;
var sidePanelScrollBarHeight = exports.sidePanelScrollBarHeight = 10;
var sideBarCloseBtnBgd = exports.sideBarCloseBtnBgd = secondaryBtnBgd;
var sideBarCloseBtnColor = exports.sideBarCloseBtnColor = '#FFFFFF';
var sideBarCloseBtnBgdHover = exports.sideBarCloseBtnBgdHover = '#6A9EBE';
var panelBackground = exports.panelBackground = '#f7f7F7';
var panelBackgroundHover = exports.panelBackgroundHover = '#f7f7F7';
var panelActiveBg = exports.panelActiveBg = '#f7f7F7';
var panelActiveBgLT = exports.panelActiveBgLT = '#6A7485';
var panelHeaderIcon = exports.panelHeaderIcon = '#6A7485';
var panelHeaderIconActive = exports.panelHeaderIconActive = '#494C52';
var panelHeaderHeight = exports.panelHeaderHeight = 48;
var panelBoxShadow = exports.panelBoxShadow = '0 6px 12px 0 rgba(0,0,0,0.16)';
var panelBorderRadius = exports.panelBorderRadius = '2px';
var panelBackgroundLT = exports.panelBackgroundLT = '#f8f8f9';
var panelBorderColor = exports.panelBorderColor = '#3A414C';
var panelBorder = exports.panelBorder = "1px solid ".concat(borderColor);
var panelBorderLT = exports.panelBorderLT = "1px solid ".concat(borderColorLight);
var mapPanelBackgroundColor = exports.mapPanelBackgroundColor = '#ffffff';
var mapPanelHeaderBackgroundColor = exports.mapPanelHeaderBackgroundColor = '#f7f7f7';
var tooltipBg = exports.tooltipBg = '#457B9D';
var tooltipColor = exports.tooltipColor = '#ffffff'; // Bottom Panel
var bottomInnerPdSide = exports.bottomInnerPdSide = 32;
var bottomInnerPdVert = exports.bottomInnerPdVert = 6;
var bottomPanelGap = exports.bottomPanelGap = 20; // Modal
var modalTitleColor = exports.modalTitleColor = '#3A414C';
var modalTitleFontSize = exports.modalTitleFontSize = '24px';
var modalTitleFontSizeSmaller = exports.modalTitleFontSizeSmaller = '18px';
var modalFooterBgd = exports.modalFooterBgd = '#F8F8F9';
var modalImagePlaceHolder = exports.modalImagePlaceHolder = '#DDDFE3';
var modalPadding = exports.modalPadding = '10px 0';
var modalLateralPadding = exports.modalLateralPadding = '72px';
var modalPortableLateralPadding = exports.modalPortableLateralPadding = '36px';
var modalOverLayZ = exports.modalOverLayZ = 1000;
var modalOverlayBgd = exports.modalOverlayBgd = 'rgba(0, 0, 0, 0.5)';
var modalContentZ = exports.modalContentZ = 10002;
var modalFooterZ = exports.modalFooterZ = 10001;
var modalTitleZ = exports.modalTitleZ = 10003;
var modalButtonZ = exports.modalButtonZ = 10005; // Modal Dialog (Dark)
var modalDialogBgd = exports.modalDialogBgd = '#3A414C';
var modalDialogColor = exports.modalDialogColor = textColorHl; // Slider
var sliderBarColor = exports.sliderBarColor = '#6A7485';
var sliderBarBgd = exports.sliderBarBgd = '#D4D4D2';
var sliderBarHoverColor = exports.sliderBarHoverColor = '#D3D8E0';
var sliderBarRadius = exports.sliderBarRadius = '1px';
var sliderBarHeight = exports.sliderBarHeight = 4;
var sliderHandleHeight = exports.sliderHandleHeight = 12;
var sliderHandleWidth = exports.sliderHandleWidth = 12;
var sliderHandleColor = exports.sliderHandleColor = '#D3D8E0';
var sliderHandleHoverColor = exports.sliderHandleHoverColor = '#FFFFFF';
var sliderHandleShadow = exports.sliderHandleShadow = '0 2px 4px 0 rgba(0,0,0,0.40)';
var sliderInputHeight = exports.sliderInputHeight = 24;
var sliderInputWidth = exports.sliderInputWidth = 56;
var sliderMarginTopIsRange = exports.sliderMarginTopIsRange = 0;
var sliderMarginTop = exports.sliderMarginTop = 12; // Plot
var rangeBrushBgd = exports.rangeBrushBgd = '#3A414C';
var histogramFillInRange = exports.histogramFillInRange = activeColor;
var histogramFillOutRange = exports.histogramFillOutRange = sliderBarColor; // Notification
var notificationColors = exports.notificationColors = {
info: '#276ef1',
error: '#f25138',
success: '#47b275',
warning: '#ffc043'
};
var notificationPanelWidth = exports.notificationPanelWidth = 240;
var notificationPanelItemWidth = exports.notificationPanelItemWidth = notificationPanelWidth - 60;
var notificationPanelItemHeight = exports.notificationPanelItemHeight = 60; // Datagrid
var columnWidth = 200;
var cellHeaderHeight = 72;
var cellHeight = 24;
var cellPaddingSide = 18;
var extendCellHeight = 2 * cellHeight;
var extendColumnWidth = 2 * columnWidth;
var gridDefaultWidth = 800;
var gridDefaultHeight = 600;
var gridPaddingSide = 24; // Floating Time display
var timeDisplayBorderRadius = 32;
var timeDisplayHeight = 64;
var timeDisplayMinWidth = 176;
var timeDisplayOpacity = 0.8;
var timeDisplayPadding = '0 24px'; // Action Panel
var actionPanelWidth = exports.actionPanelWidth = 110;
var actionPanelHeight = exports.actionPanelHeight = 32;
var textTruncate = exports.textTruncate = {
maxWidth: '100%',
overflow: 'hidden',
textOverflow: 'ellipsis',
whiteSpace: 'nowrap',
wordWrap: 'normal'
}; // This breakpoints are used for responsive design
var breakPoints = exports.breakPoints = {
palm: 588,
desk: 768
}; // theme is passed to kepler.gl when it's mounted,
// it is used by styled-components to pass along to
// all child components
var input = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n align-items: center;\n background-color: ", ";\n border: 1px solid\n ", ";\n border-radius: 2px;\n caret-color: ", ";\n color: ", ";\n display: flex;\n font-size: ", ";\n font-weight: ", ";\n height: ", ";\n justify-content: space-between;\n outline: none;\n overflow: hidden;\n padding: ", ";\n text-overflow: ellipsis;\n transition: ", ";\n white-space: nowrap;\n width: 100%;\n word-wrap: normal;\n pointer-events: ", ";\n opacity: ", ";\n\n :hover {\n cursor: ", ";\n background-color: ", ";\n border-color: ", ";\n }\n\n :active,\n :focus,\n &.focus,\n &.active {\n background-color: ", ";\n border-color: ", ";\n }\n\n ::placeholder {\n color: ", ";\n font-weight: ", ";\n }\n\n /* Disable Arrows on Number Inputs */\n ::-webkit-inner-spin-button,\n ::-webkit-outer-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n"])), function (props) {
return props.theme.inputBgd;
}, function (props) {
return props.active ? props.theme.inputBorderActiveColor : props.error ? props.theme.errorColor : props.theme.inputBgd;
}, function (props) {
return props.theme.inputBorderActiveColor;
}, function (props) {
return props.theme.inputColor;
}, function (props) {
return ['small', 'tiny'].includes(props.size) ? props.theme.inputFontSizeSmall : props.theme.inputFontSize;
}, function (props) {
return props.theme.inputFontWeight;
}, function (props) {
return props.size === 'small' ? props.theme.inputBoxHeightSmall : props.size === 'tiny' ? props.theme.inputBoxHeightTiny : props.theme.inputBoxHeight;
}, function (props) {
return props.size === 'small' ? props.theme.inputPaddingSmall : props.size === 'tiny' ? props.theme.inputPaddingTiny : props.theme.inputPadding;
}, function (props) {
return props.theme.transition;
}, function (props) {
return props.disabled ? 'none' : 'all';
}, function (props) {
return props.disabled ? 0.5 : 1;
}, function (props) {
return props.type === 'number' ? 'text' : 'pointer';
}, function (props) {
return props.active ? props.theme.inputBgdActive : props.theme.inputBgdHover;
}, function (props) {
return props.active ? props.theme.inputBorderActiveColor : props.theme.inputBorderHoverColor;
}, function (props) {
return props.theme.inputBgdActive;
}, function (props) {
return props.theme.inputBorderActiveColor;
}, function (props) {
return props.theme.inputPlaceholderColor;
}, function (props) {
return props.theme.inputPlaceholderFontWeight;
});
var inputLT = (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n ", "\n\n background-color: ", ";\n border: 1px solid\n ", ";\n color: ", ";\n caret-color: ", ";\n\n ::-webkit-input-placeholder {\n color: ", ";\n font-weight: 400;\n }\n\n :active,\n :focus,\n &.focus,\n &.active {\n background-color: ", ";\n border-color: ", ";\n }\n\n :hover {\n background-color: ", ";\n cursor: ", ";\n border-color: ", ";\n }\n"])), input, function (props) {
return props.theme.selectBackgroundLT;
}, function (props) {
return props.active ? props.theme.selectActiveBorderColor : props.error ? props.theme.errorColor : props.theme.selectBorderColorLT;
}, function (props) {
return props.theme.selectColorLT;
}, function (props) {
return props.theme.selectColorLT;
}, function (props) {
return props.theme.subtextColorLT;
}, function (props) {
return props.theme.selectBackgroundLT;
}, function (props) {
return props.theme.textColorLT;
}, function (props) {
return props.theme.selectBackgroundLT;
}, function (props) {
return ['number', 'text'].includes(props.type) ? 'text' : 'pointer';
}, function (props) {
return props.active ? props.theme.textColorLT : props.theme.subtextColor;
});
var secondaryInput = (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n ", "\n color: ", ";\n background-color: ", ";\n border: 1px solid\n ", ";\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n border-color: ", ";\n }\n\n :active,\n &.active {\n background-color: ", ";\n border-color: ", ";\n }\n"])), function (props) {
return props.theme.input;
}, function (props) {
return props.theme.secondaryInputColor;
}, function (props) {
return props.theme.secondaryInputBgd;
}, function (props) {
return props.error ? props.theme.errorColor : props.theme.secondaryInputBorderColor;
}, function (props) {
return props.theme.secondaryInputBgdHover;
}, function (props) {
return props.theme.secondaryInputBgdHover;
}, function (props) {
return props.theme.secondaryInputBgdActive;
}, function (props) {
return props.theme.secondaryInputBorderActiveColor;
});
var chickletedInputContainer = (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n cursor: pointer;\n flex-wrap: wrap;\n height: auto;\n justify-content: start;\n margin-bottom: 2px;\n padding: 0px 7px 0px 4px;\n white-space: normal;\n\n .chickleted-input__placeholder {\n line-height: 24px;\n margin: 4px;\n }\n"])));
var chickletedInput = (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n ", "\n ", "\n"])), function (props) {
return props.theme.input;
}, function (props) {
return props.theme.chickletedInputContainer;
});
var secondaryChickletedInput = (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n ", "\n ", "\n"])), function (props) {
return props.theme.secondaryInput;
}, function (props) {
return props.theme.chickletedInputContainer;
});
var inlineInput = (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["\n ", " color: ", ";\n font-size: 13px;\n letter-spacing: 0.43px;\n line-height: 18px;\n height: 24px;\n font-weight: 400;\n padding-left: 4px;\n margin-left: -4px;\n background-color: transparent;\n border: 1px solid transparent;\n\n :hover {\n height: 24px;\n cursor: text;\n background-color: transparent;\n border: 1px solid ", ";\n }\n\n :active,\n .active,\n :focus {\n background-color: transparent;\n border: 1px solid ", ";\n }\n"])), function (props) {
return props.theme.input;
}, function (props) {
return props.theme.textColor;
}, function (props) {
return props.theme.labelColor;
}, function (props) {
return props.theme.inputBorderActiveColor;
});
var switchTrack = (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["\n background: ", ";\n position: absolute;\n top: 0;\n left: ", "px;\n content: '';\n display: block;\n width: ", "px;\n height: ", "px;\n border-radius: ", ";\n"])), function (props) {
return props.checked ? props.theme.switchTrackBgdActive : props.theme.switchTrackBgd;
}, function (props) {
return -props.theme.switchLabelMargin;
}, function (props) {
return props.theme.switchWidth;
}, function (props) {
return props.theme.switchHeight;
}, function (props) {
return props.theme.switchTrackBorderRadius;
});
var switchButton = (0, _styledComponents.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["\n transition: ", ";\n position: absolute;\n top: 0;\n left: ", "px;\n content: '';\n display: block;\n height: ", ";\n width: ", ";\n background: ", ";\n box-shadow: ", ";\n"])), function (props) {
return props.theme.transition;
}, function (props) {
return (props.checked ? props.theme.switchWidth / 2 : -1) - props.theme.switchLabelMargin;
}, function (props) {
return props.theme.switchBtnHeight;
}, function (props) {
return props.theme.switchBtnWidth;
}, function (props) {
return props.checked ? props.theme.switchBtnBgdActive : props.theme.switchBtnBgd;
}, function (props) {
return props.theme.switchBtnBoxShadow;
});
var inputSwitch = (0, _styledComponents.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["\n user-select: none;\n cursor: pointer;\n line-height: 0;\n font-weight: 500;\n font-size: 12px;\n color: ", ";\n position: relative;\n display: inline-block;\n padding-top: ", "px;\n padding-right: 0;\n padding-bottom: 0;\n padding-left: ", "px;\n\n :before {\n ", ";\n }\n\n :after {\n ", ";\n }\n"])), function (props) {
return props.theme.labelColor;
}, function (props) {
return props.theme.switchHeight / 2;
}, function (props) {
return props.theme.switchWidth;
}, function (props) {
return props.theme.switchTrack;
}, function (props) {
return props.theme.switchButton;
}); // This is a light version checkbox
var checkboxBox = (0, _styledComponents.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n width: ", "px;\n height: ", "px;\n background: ", ";\n border: 1px solid\n ", ";\n border-radius: 2px;\n content: '';\n"])), function (props) {
return props.theme.checkboxWidth;
}, function (props) {
return props.theme.checkboxHeight;
}, function (props) {
return props.checked ? props.theme.checkboxBoxBgdChecked : props.theme.checkboxBoxBgd;
}, function (props) {
return props.checked ? props.theme.checkboxBoxBgdChecked : props.theme.checkboxBorderColor;
});
var checkboxCheck = (0, _styledComponents.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["\n width: 10px;\n height: 5px;\n border-bottom: 2px solid #f63854;\n border-left: 2px solid #f63854;\n top: 4px;\n left: 3px;\n transform: rotate(-45deg);\n display: block;\n position: absolute;\n opacity: ", ";\n content: '';\n"])), function (props) {
return props.checked ? 1 : 0;
});
var inputCheckbox = (0, _styledComponents.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["\n display: inline-block;\n position: relative;\n padding-left: 32px;\n margin-bottom: 24px;\n line-height: 20px;\n vertical-align: middle;\n cursor: pointer;\n font-size: 12px;\n color: ", ";\n margin-left: -", "px;\n\n :before {\n ", ";\n }\n\n :after {\n ", ";\n }\n"])), function (props) {
return props.theme.labelColor;
}, function (props) {
return props.theme.switchLabelMargin;
}, function (props) {
return props.theme.checkboxBox;
}, function (props) {
return props.theme.checkboxCheck;
});
var secondarySwitch = (0, _styledComponents.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["\n ", "\n :before {\n ", " background: ", ";\n }\n\n :after {\n ", "\n background: ", ";\n }\n"])), function (props) {
return props.theme.inputSwitch;
}, function (props) {
return props.theme.switchTrack;
}, function (props) {
return props.checked ? props.theme.switchTrackBgdActive : props.theme.secondarySwitchTrackBgd;
}, function (props) {
return props.theme.switchButton;
}, function (props) {
return props.checked ? props.theme.switchBtnBgdActive : props.theme.secondarySwitchBtnBgd;
});
var dropdownScrollBar = (0, _styledComponents.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["\n ::-webkit-scrollbar {\n height: 10px;\n width: 10px;\n }\n\n ::-webkit-scrollbar-corner {\n background: ", ";\n }\n\n ::-webkit-scrollbar-track {\n background: ", ";\n }\n\n ::-webkit-scrollbar-thumb {\n border-radius: 10px;\n background: ", ";\n border: 3px solid ", ";\n };\n\n :vertical:hover {\n background: ", ";\n cursor: pointer;\n }\n}"])), function (props) {
return props.theme.dropdownListBgd;
}, function (props) {
return props.theme.dropdownListBgd;
}, function (props) {
return props.theme.labelColor;
}, function (props) {
return props.theme.dropdownListBgd;
}, function (props) {
return props.theme.textColorHl;
});
var dropdownListAnchor = (0, _styledComponents.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n padding-left: 3px;\n"])), function (props) {
return props.theme.selectColor;
});
var dropdownListItem = (0, _styledComponents.css)(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["\n font-size: 11px;\n padding: 3px 9px;\n font-weight: 500;\n color: #6a7485;\n &.hover,\n &:hover {\n cursor: pointer;\n background-color: ", ";\n\n .list__item__anchor {\n color: ", ";\n }\n }\n"])), function (props) {
return props.theme.dropdownListHighlightBg;
}, function (props) {
return props.theme.textColorHl;
}); // ${props => props.theme.textColorHl}
var dropdownListHeader = (0, _styledComponents.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2["default"])(["\n font-size: 11px;\n padding: 5px 9px;\n color: ", ";\n"])), function (props) {
return props.theme.labelColor;
});
var dropdownListSection = (0, _styledComponents.css)(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2["default"])(["\n padding: 0 0 4px 0;\n margin-bottom: 4px;\n border-bottom: 1px solid ", ";\n"])), function (props) {
return props.theme.labelColor;
});
var dropdownList = (0, _styledComponents.css)(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2["default"])(["\n overflow-y: auto;\n max-height: 280px;\n box-shadow: ", ";\n border-radius: 2px;\n\n .list__section {\n ", ";\n }\n .list__header {\n ", ";\n }\n\n .list__item {\n ", ";\n }\n\n .list__item__anchor {\n ", ";\n }\n\n ", ";\n"])), function (props) {
return props.theme.dropdownListShadow;
}, function (props) {
return props.theme.dropdownListSection;
}, function (props) {
return props.theme.dropdownListHeader;
}, function (props) {
return props.theme.dropdownListItem;
}, function (props) {
return props.theme.dropdownListAnchor;
}, function (props) {
return props.theme.dropdownScrollBar;
});
var sidePanelScrollBar = (0, _styledComponents.css)(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteral2["default"])(["\n ::-webkit-scrollbar {\n height: ", "px;\n width: ", "px;\n }\n\n ::-webkit-scrollbar-corner {\n background: ", ";\n }\n\n ::-webkit-scrollbar-track {\n background: ", ";\n }\n\n ::-webkit-scrollbar-thumb {\n border-radius: 10px;\n background: ", ";\n border: 3px solid ", ";\n\n :hover {\n background: ", ";\n cursor: pointer;\n }\n };\n}"])), function (props) {
return props.theme.sidePanelScrollBarHeight;
}, function (props) {
return props.theme.sidePanelScrollBarWidth;
}, function (props) {
return props.theme.sidePanelBg;
}, function (props) {
return props.theme.sidePanelBg;
}, function (props) {
return props.theme.panelBackgroundHover;
}, function (props) {
return props.theme.sidePanelBg;
}, function (props) {
return props.theme.labelColor;
});
var panelDropdownScrollBar = (0, _styledComponents.css)(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteral2["default"])(["\n ::-webkit-scrollbar {\n height: 10px;\n width: 10px;\n }\n\n ::-webkit-scrollbar-corner {\n background: ", ";\n }\n\n ::-webkit-scrollbar-track {\n background: ", ";\n }\n\n ::-webkit-scrollbar-thumb {\n border-radius: 10px;\n background: ", ";\n border: 3px solid ", ";\n :hover {\n background: ", ";\n cursor: pointer;\n }\n }\n"])), function (props) {
return props.theme.panelBackground;
}, function (props) {
return props.theme.panelBackground;
}, function (props) {
return props.theme.panelBackgroundHover;
}, function (props) {
return props.theme.panelBackground;
}, function (props) {
return props.theme.labelColor;
});
var scrollBar = (0, _styledComponents.css)(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteral2["default"])(["\n ::-webkit-scrollbar {\n height: 10px;\n width: 10px;\n }\n\n ::-webkit-scrollbar-corner {\n background: ", ";\n }\n\n ::-webkit-scrollbar-track {\n background: ", ";\n }\n\n ::-webkit-scrollbar-thumb {\n border-radius: 10px;\n background: ", ";\n border: 3px solid ", "\n\n :vertical:hover {\n background: ", ";\n cursor: pointer;\n }\n\n :horizontal:hover {\n background: ", ";\n cursor: pointer;\n }\n }\n}"])), function (props) {
return props.theme.panelBackground;
}, function (props) {
return props.theme.panelBackground;
}, function (props) {
return props.theme.labelColor;
}, function (props) {
return props.theme.panelBackground;
}, function (props) {
return props.theme.textColorHl;
}, function (props) {
return props.theme.textColorHl;
});
var modalScrollBar = exports.modalScrollBar = (0, _styledComponents.css)(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteral2["default"])(["\n ::-webkit-scrollbar {\n width: 14px;\n height: 16px;\n }\n\n ::-webkit-scrollbar-track {\n background: white;\n }\n ::-webkit-scrollbar-track:horizontal {\n background: ", ";\n }\n ::-webkit-scrollbar-thumb {\n background: ", ";\n border: 4px solid white;\n }\n\n ::-webkit-scrollbar-corner {\n background: ", ";\n }\n\n ::-webkit-scrollbar-thumb:hover {\n background: #969da9;\n }\n\n ::-webkit-scrollbar-thumb:vertical {\n border-radius: 7px;\n }\n\n ::-webkit-scrollbar-thumb:horizontal {\n border-radius: 9px;\n border: 4px solid ", ";\n }\n"])), function (props) {
return props.theme.textColorHl;
}, function (props) {
return props.theme.labelColorLT;
}, function (props) {
return props.theme.textColorHl;
}, function (props) {
return props.theme.textColorHl;
});
var theme = exports.theme = _objectSpread(_objectSpread({}, _defaultSettings.DIMENSIONS), {}, {
// templates
input: input,
inputLT: inputLT,
inlineInput: inlineInput,
chickletedInput: chickletedInput,
chickletedInputContainer: chickletedInputContainer,
secondaryChickletedInput: secondaryChickletedInput,
secondaryInput: secondaryInput,
dropdownScrollBar: dropdownScrollBar,
dropdownList: dropdownList,
dropdownListItem: dropdownListItem,
dropdownListAnchor: dropdownListAnchor,
dropdownListHeader: dropdownListHeader,
dropdownListSection: dropdownListSection,
dropdownListShadow: dropdownListShadow,
dropdownWrapperZ: dropdownWrapperZ,
modalScrollBar: modalScrollBar,
scrollBar: scrollBar,
sidePanelScrollBar: sidePanelScrollBar,
inputSwitch: inputSwitch,
secondarySwitch: secondarySwitch,
switchTrack: switchTrack,
switchButton: switchButton,
inputCheckbox: inputCheckbox,
checkboxBox: checkboxBox,
checkboxCheck: checkboxCheck,
// Transitions
transition: transition,
transitionFast: transitionFast,
transitionSlow: transitionSlow,
// styles
activeColor: activeColor,
activeColorHover: activeColorHover,
borderRadius: borderRadius,
boxShadow: boxShadow,
errorColor: errorColor,
dropdownListHighlightBg: dropdownListHighlightBg,
dropdownListBgd: dropdownListBgd,
dropdownListBorderTop: dropdownListBorderTop,
labelColor: labelColor,
labelColorLT: labelColorLT,
labelHoverColor: labelHoverColor,
mapPanelBackgroundColor: mapPanelBackgroundColor,
mapPanelHeaderBackgroundColor: mapPanelHeaderBackgroundColor,
// Select
selectActiveBorderColor: selectActiveBorderColor,
selectBackground: selectBackground,
selectBackgroundLT: selectBackgroundLT,
selectBackgroundHover: selectBackgroundHover,
selectBackgroundHoverLT: selectBackgroundHoverLT,
selectBorder: selectBorder,
selectBorderColor: selectBorderColor,
selectBorderRadius: selectBorderRadius,
selectBorderColorLT: selectBorderColorLT,
selectColor: selectColor,
selectColorPlaceHolder: selectColorPlaceHolder,
selectFontSize: selectFontSize,
selectFontWeight: selectFontWeight,
selectColorLT: selectColorLT,
selectFontWeightBold: selectFontWeightBold,
// Input
inputBgd: inputBgd,
inputBgdHover: inputBgdHover,
inputBgdActive: inputBgdActive,
inputBoxHeight: inputBoxHeight,
inputBoxHeightSmall: inputBoxHeightSmall,
inputBoxHeightTiny: inputBoxHeightTiny,
inputBorderColor: inputBorderColor,
inputBorderActiveColor: inputBorderActiveColor,
inputBorderHoverColor: inputBorderHoverColor,
inputBorderRadius: inputBorderRadius,
inputColor: inputColor,
inputPadding: inputPadding,
inputPaddingSmall: inputPaddingSmall,
inputPaddingTiny: inputPaddingTiny,
inputFontSize: inputFontSize,
inputFontSizeSmall: inputFontSizeSmall,
inputFontWeight: inputFontWeight,
inputPlaceholderColor: inputPlaceholderColor,
inputPlaceholderFontWeight: inputPlaceholderFontWeight,
secondaryInputBgd: secondaryInputBgd,
secondaryInputBgdHover: secondaryInputBgdHover,
secondaryInputBgdActive: secondaryInputBgdActive,
secondaryInputColor: secondaryInputColor,
secondaryInputBorderColor: secondaryInputBorderColor,
secondaryInputBorderActiveColor: secondaryInputBorderActiveColor,
// Switch
switchWidth: switchWidth,
switchHeight: switchHeight,
switchTrackBgd: switchTrackBgd,
switchTrackBgdActive: switchTrackBgdActive,
switchTrackBorderRadius: switchTrackBorderRadius,
switchBtnBgd: switchBtnBgd,
switchBtnBgdActive: switchBtnBgdActive,
switchBtnBoxShadow: switchBtnBoxShadow,
switchBtnBorderRadius: switchBtnBorderRadius,
switchBtnWidth: switchBtnWidth,
switchBtnHeight: switchBtnHeight,
switchLabelMargin: switchLabelMargin,
secondarySwitchTrackBgd: secondarySwitchTrackBgd,
secondarySwitchBtnBgd: secondarySwitchBtnBgd,
// Checkbox
checkboxWidth: checkboxWidth,
checkboxHeight: checkboxHeight,
checkboxMargin: checkboxMargin,
checkboxBorderColor: checkboxBorderColor,
checkboxBorderRadius: checkboxBorderRadius,
checkboxBorderColorLT: checkboxBorderColorLT,
checkboxBoxBgd: checkboxBoxBgd,
checkboxBoxBgdChecked: checkboxBoxBgdChecked,
// Button
primaryBtnBgd: primaryBtnBgd,
primaryBtnActBgd: primaryBtnActBgd,
primaryBtnColor: primaryBtnColor,
primaryBtnActColor: primaryBtnActColor,
primaryBtnBgdHover: primaryBtnBgdHover,
primaryBtnRadius: primaryBtnRadius,
secondaryBtnBgd: secondaryBtnBgd,
secondaryBtnActBgd: secondaryBtnActBgd,
secondaryBtnBgdHover: secondaryBtnBgdHover,
secondaryBtnColor: secondaryBtnColor,
secondaryBtnActColor: secondaryBtnActColor,
negativeBtnBgd: negativeBtnBgd,
negativeBtnActBgd: negativeBtnActBgd,
negativeBtnBgdHover: negativeBtnBgdHover,
negativeBtnColor: negativeBtnColor,
negativeBtnActColor: negativeBtnActColor,
linkBtnBgd: linkBtnBgd,
linkBtnActBgd: linkBtnActBgd,
linkBtnColor: linkBtnColor,
linkBtnActColor: linkBtnActColor,
linkBtnActBgdHover: linkBtnActBgdHover,
// Modal
modalTitleColor: modalTitleColor,
modalTitleFontSize: modalTitleFontSize,
modalTitleFontSizeSmaller: modalTitleFontSizeSmaller,
modalFooterBgd: modalFooterBgd,
modalImagePlaceHolder: modalImagePlaceHolder,
modalPadding: modalPadding,
modalDialogBgd: modalDialogBgd,
modalDialogColor: modalDialogColor,
modalLateralPadding: modalLateralPadding,
modalPortableLateralPadding: modalPortableLateralPadding,
modalOverLayZ: modalOverLayZ,
modalOverlayBgd: modalOverlayBgd,
modalContentZ: modalContentZ,
modalFooterZ: modalFooterZ,
modalTitleZ: modalTitleZ,
modalButtonZ: modalButtonZ,
// Side Panel
sidePanelBg: sidePanelBg,
sidePanelInnerPadding: sidePanelInnerPadding,
sideBarCloseBtnBgd: sideBarCloseBtnBgd,
sideBarCloseBtnColor: sideBarCloseBtnColor,
sideBarCloseBtnBgdHover: sideBarCloseBtnBgdHover,
sidePanelHeaderBg: sidePanelHeaderBg,
sidePanelScrollBarWidth: sidePanelScrollBarWidth,
sidePanelScrollBarHeight: sidePanelScrollBarHeight,
// Side Panel Panel
panelActiveBg: panelActiveBg,
panelBackground: panelBackground,
panelBackgroundHover: panelBackgroundHover,
panelBackgroundLT: panelBackgroundLT,
panelBoxShadow: panelBoxShadow,
panelBorderRadius: panelBorderRadius,
panelBorder: panelBorder,
panelBorderColor: panelBorderColor,
panelBorderLT: panelBorderLT,
panelHeaderIcon: panelHeaderIcon,
panelHeaderIconActive: panelHeaderIconActive,
panelHeaderHeight: panelHeaderHeight,
panelDropdownScrollBar: panelDropdownScrollBar,
// Text
fontFamily: fontFamily,
fontWeight: fontWeight,
fontSize: fontSize,
lineHeight: lineHeight,
textColor: textColor,
textColorLT: textColorLT,
textColorHl: textColorHl,
titleTextColor: titleTextColor,
subtextColor: subtextColor,
subtextColorLT: subtextColorLT,
subtextColorActive: subtextColorActive,
textTruncate: textTruncate,
titleColorLT: titleColorLT,
tooltipBg: tooltipBg,
tooltipColor: tooltipColor,
// Bottom Panel
bottomInnerPdSide: bottomInnerPdSide,
bottomInnerPdVert: bottomInnerPdVert,
bottomPanelGap: bottomPanelGap,
// Slider
sliderBarColor: sliderBarColor,
sliderBarBgd: sliderBarBgd,
sliderBarHoverColor: sliderBarHoverColor,
sliderBarRadius: sliderBarRadius,
sliderBarHeight: sliderBarHeight,
sliderHandleHeight: sliderHandleHeight,
sliderHandleWidth: sliderHandleWidth,
sliderHandleColor: sliderHandleColor,
sliderHandleHoverColor: sliderHandleHoverColor,
sliderHandleShadow: sliderHandleShadow,
sliderInputHeight: sliderInputHeight,
sliderInputWidth: sliderInputWidth,
sliderMarginTopIsRange: sliderMarginTopIsRange,
sliderMarginTop: sliderMarginTop,
// Plot
rangeBrushBgd: rangeBrushBgd,
histogramFillInRange: histogramFillInRange,
histogramFillOutRange: histogramFillOutRange,
// Notifications
notificationColors: notificationColors,
notificationPanelWidth: notificationPanelWidth,
notificationPanelItemWidth: notificationPanelItemWidth,
notificationPanelItemHeight: notificationPanelItemHeight,
// datagrid
columnWidth: columnWidth,
extendColumnWidth: extendColumnWidth,
cellHeaderHeight: cellHeaderHeight,
cellHeight: cellHeight,
cellPaddingSide: cellPaddingSide,
extendCellHeight: extendCellHeight,
gridDefaultWidth: gridDefaultWidth,
gridDefaultHeight: gridDefaultHeight,
gridPaddingSide: gridPaddingSide,
// time display
timeDisplayBorderRadius: timeDisplayBorderRadius,
timeDisplayHeight: timeDisplayHeight,
timeDisplayMinWidth: timeDisplayMinWidth,
timeDisplayOpacity: timeDisplayOpacity,
timeDisplayPadding: timeDisplayPadding,
// Action Panel
actionPanelWidth: actionPanelWidth,
actionPanelHeight: actionPanelHeight,
// Breakpoints
breakPoints: breakPoints
});
var themeLT = exports.themeLT = _objectSpread(_objectSpread({}, theme), {}, {
// template
input: inputLT,
textColor: textColorLT,
sidePanelBg: '#ffffff',
titleTextColor: '#000000',
sidePanelHeaderBg: '#f7f7F7',
subtextColorActive: '#F63754',
tooltipBg: '#E0324D',
tooltipColor: '#ffffff',
dropdownListBgd: '#ffffff',
textColorHl: '#F63754',
inputBgd: '#f7f7f7',
inputBgdHover: '#ffffff',
inputBgdActive: '#ffffff',
dropdownListHighlightBg: '#f0f0f0',
panelBackground: '#f7f7F7',
panelBackgroundHover: '#f7f7F7',
panelBorderColor: '#D3D8E0',
secondaryInputBgd: '#f7f7F7',
secondaryInputBgdActive: '#f7f7F7',
secondaryInputBgdHover: '#ffffff',
panelActiveBg: '#f7f7F7',
mapPanelBackgroundColor: '#ffffff',
mapPanelHeaderBackgroundColor: '#f7f7F7',
sliderBarBgd: '#D3D8E0',
secondarySwitchBtnBgd: '#D3D8E0',
switchTrackBgd: '#D3D8E0'
});
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9zdHlsZXMvYmFzZS5qcyJdLCJuYW1lcyI6WyJ0cmFuc2l0aW9uIiwidHJhbnNpdGlvbkZhc3QiLCJ0cmFuc2l0aW9uU2xvdyIsImJveFNoYWRvdyIsImJveFNpemluZyIsImJvcmRlclJhZGl1cyIsImJvcmRlckNvbG9yIiwiYm9yZGVyQ29sb3JMaWdodCIsImZvbnRGYW1pbHkiLCJmb250V2VpZ2h0IiwiZm9udFNpemUiLCJsaW5lSGVpZ2h0IiwibGFiZWxDb2xvciIsImxhYmVsSG92ZXJDb2xvciIsImxhYmVsQ29sb3JMVCIsInRleHRDb2xvciIsInRleHRDb2xvckxUIiwidGl0bGVDb2xvckxUIiwic3VidGV4dENvbG9yIiwic3VidGV4dENvbG9yTFQiLCJzdWJ0ZXh0Q29sb3JBY3RpdmUiLCJ0aXRsZVRleHRDb2xvciIsInRleHRDb2xvckhsIiwidGV4dENvbG9ySGxMVCIsImFjdGl2ZUNvbG9yIiwiYWN0aXZlQ29sb3JIb3ZlciIsImVycm9yQ29sb3IiLCJwcmltYXJ5QnRuQmdkIiwicHJpbWFyeUJ0bkFjdEJnZCIsInByaW1hcnlCdG5Db2xvciIsInByaW1hcnlCdG5BY3RDb2xvciIsInByaW1hcnlCdG5CZ2RIb3ZlciIsInByaW1hcnlCdG5SYWRpdXMiLCJzZWNvbmRhcnlCdG5CZ2QiLCJzZWNvbmRhcnlCdG5BY3RCZ2QiLCJzZWNvbmRhcnlCdG5Db2xvciIsInNlY29uZGFyeUJ0bkFjdENvbG9yIiwic2Vjb25kYXJ5QnRuQmdkSG92ZXIiLCJsaW5rQnRuQmdkIiwibGlua0J0bkFjdEJnZCIsImxpbmtCdG5Db2xvciIsImxpbmtCdG5BY3RDb2xvciIsImxpbmtCdG5BY3RCZ2RIb3ZlciIsIm5lZ2F0aXZlQnRuQmdkIiwibmVnYXRpdmVCdG5BY3RCZ2QiLCJuZWdhdGl2ZUJ0bkJnZEhvdmVyIiwibmVnYXRpdmVCdG5Db2xvciIsIm5lZ2F0aXZlQnRuQWN0Q29sb3IiLCJpbnB1dEJveEhlaWdodCIsImlucHV0Qm94SGVpZ2h0U21hbGwiLCJpbnB1dEJveEhlaWdodFRpbnkiLCJpbnB1dFBhZGRpbmciLCJpbnB1dFBhZGRpbmdTbWFsbCIsImlucHV0UGFkZGluZ1RpbnkiLCJpbnB1dEZvbnRTaXplIiwiaW5wdXRGb250U2l6ZVNtYWxsIiwiaW5wdXRGb250V2VpZ2h0IiwiaW5wdXRCZ2QiLCJpbnB1dEJnZEhvdmVyIiwiaW5wdXRCZ2RBY3RpdmUiLCJpbnB1dEJvcmRlckNvbG9yIiwiaW5wdXRCb3JkZXJIb3ZlckNvbG9yIiwiaW5wdXRCb3JkZXJBY3RpdmVDb2xvciIsImlucHV0Q29sb3IiLCJpbnB1dEJvcmRlclJhZGl1cyIsImlucHV0UGxhY2Vob2xkZXJDb2xvciIsImlucHV0UGxhY2Vob2xkZXJGb250V2VpZ2h0Iiwic2Vjb25kYXJ5SW5wdXRCZ2QiLCJzZWNvbmRhcnlJbnB1dEJnZEhvdmVyIiwic2Vjb25kYXJ5SW5wdXRCZ2RBY3RpdmUiLCJzZWNvbmRhcnlJbnB1dENvbG9yIiwic2Vjb25kYXJ5SW5wdXRCb3JkZXJDb2xvciIsInNlY29uZGFyeUlucHV0Qm9yZGVyQWN0aXZlQ29sb3IiLCJzZWxlY3RDb2xvciIsInNlbGVjdENvbG9yTFQiLCJzZWxlY3RBY3RpdmVCb3JkZXJDb2xvciIsInNlbGVjdEZvbnRTaXplIiwic2VsZWN0Rm9udFdlaWdodCIsInNlbGVjdEZvbnRXZWlnaHRCb2xkIiwic2VsZWN0Q29sb3JQbGFjZUhvbGRlciIsInNlbGVjdEJhY2tncm91bmQiLCJzZWxlY3RCYWNrZ3JvdW5kSG92ZXIiLCJzZWxlY3RCYWNrZ3JvdW5kTFQiLCJzZWxlY3RCYWNrZ3JvdW5kSG92ZXJMVCIsInNlbGVjdEJvcmRlckNvbG9yIiwic2VsZWN0Qm9yZGVyQ29sb3JMVCIsInNlbGVjdEJvcmRlclJhZGl1cyIsInNlbGVjdEJvcmRlciIsImRyb3Bkb3duTGlzdEhpZ2hsaWdodEJnIiwiZHJvcGRvd25MaXN0U2hhZG93IiwiZHJvcGRvd25MaXN0QmdkIiwiZHJvcGRvd25MaXN0Qm9yZGVyVG9wIiwiZHJvcGRvd25XcmFwcGVyWiIsInN3aXRjaFdpZHRoIiwic3dpdGNoSGVpZ2h0Iiwic3dpdGNoTGFiZWxNYXJnaW4iLCJzd2l0Y2hUcmFja0JnZCIsInN3aXRjaFRyYWNrQmdkQWN0aXZlIiwic3dpdGNoVHJhY2tCb3JkZXJSYWRpdXMiLCJzd2l0Y2hCdG5CZ2QiLCJzd2l0Y2hCdG5CZ2RBY3RpdmUiLCJzd2l0Y2hCdG5Cb3hTaGFkb3ciLCJzd2l0Y2hCdG5Cb3JkZXJSYWRpdXMiLCJzd2l0Y2hCdG5XaWR0aCIsInN3aXRjaEJ0bkhlaWdodCIsInNlY29uZGFyeVN3aXRjaFRyYWNrQmdkIiwic2Vjb25kYXJ5U3dpdGNoQnRuQmdkIiwiY2hlY2tib3hXaWR0aCIsImNoZWNrYm94SGVpZ2h0IiwiY2hlY2tib3hNYXJnaW4iLCJjaGVja2JveEJvcmRlckNvbG9yIiwiY2hlY2tib3hCb3JkZXJSYWRpdXMiLCJjaGVja2JveEJvcmRlckNvbG9yTFQiLCJjaGVja2JveEJveEJnZCIsImNoZWNrYm94Qm94QmdkQ2hlY2tlZCIsInNpZGVQYW5lbEhlYWRlckJnIiwic2lkZVBhbmVsSW5uZXJQYWRkaW5nIiwic2lkZVBhbmVsQmciLCJzaWRlUGFuZWxTY3JvbGxCYXJXaWR0aCIsInNpZGVQYW5lbFNjcm9sbEJhckhlaWdodCIsInNpZGVCYXJDbG9zZUJ0bkJnZCIsInNpZGVCYXJDbG9zZUJ0bkNvbG9yIiwic2lkZUJhckNsb3NlQnRuQmdkSG92