@geezee/react-ui
Version:
Modern and minimalist React UI library.
98 lines (91 loc) • 62.9 kB
JavaScript
import _JSXStyle from "styled-jsx/style";
import * as React from 'react';
import { addColorAlpha } from '../utils/color';
import { getSizes, getColors } from '../input/styles';
import { normalSizes, inputVariants, inputColors } from '../utils/prop-types';
var animationDuration = '0.2s'; // TODO Unify animation
// picker animation lalala~
export var animationStyle = /*#__PURE__*/React.createElement(_JSXStyle, {
id: "1570830828"
}, "@-webkit-keyframes cfxSlideUpIn{0%{-webkit-transform:scaleY(0.8);-ms-transform:scaleY(0.8);transform:scaleY(0.8);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:0;}100%{-webkit-transform:scaleY(1);-ms-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:1;}}@keyframes cfxSlideUpIn{0%{-webkit-transform:scaleY(0.8);-ms-transform:scaleY(0.8);transform:scaleY(0.8);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:0;}100%{-webkit-transform:scaleY(1);-ms-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:1;}}@-webkit-keyframes cfxSlideUpOut{0%{-webkit-transform:scaleY(1);-ms-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:1;}100%{-webkit-transform:scaleY(0.8);-ms-transform:scaleY(0.8);transform:scaleY(0.8);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:0;}}@keyframes cfxSlideUpOut{0%{-webkit-transform:scaleY(1);-ms-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:1;}100%{-webkit-transform:scaleY(0.8);-ms-transform:scaleY(0.8);transform:scaleY(0.8);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:0;}}@-webkit-keyframes cfxSlideDownIn{0%{-webkit-transform:scaleY(0.8);-ms-transform:scaleY(0.8);transform:scaleY(0.8);-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%;opacity:0;}100%{-webkit-transform:scaleY(1);-ms-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%;opacity:1;}}@keyframes cfxSlideDownIn{0%{-webkit-transform:scaleY(0.8);-ms-transform:scaleY(0.8);transform:scaleY(0.8);-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%;opacity:0;}100%{-webkit-transform:scaleY(1);-ms-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%;opacity:1;}}@-webkit-keyframes cfxSlideDownOut{0%{-webkit-transform:scaleY(1);-ms-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%;opacity:1;}100%{-webkit-transform:scaleY(0.8);-ms-transform:scaleY(0.8);transform:scaleY(0.8);-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%;opacity:0;}}@keyframes cfxSlideDownOut{0%{-webkit-transform:scaleY(1);-ms-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%;opacity:1;}100%{-webkit-transform:scaleY(0.8);-ms-transform:scaleY(0.8);transform:scaleY(0.8);-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%;opacity:0;}}@-webkit-keyframes cfxSlideLeftIn{0%{-webkit-transform:scaleX(0.8);-ms-transform:scaleX(0.8);transform:scaleX(0.8);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:0;}100%{-webkit-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:1;}}@keyframes cfxSlideLeftIn{0%{-webkit-transform:scaleX(0.8);-ms-transform:scaleX(0.8);transform:scaleX(0.8);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:0;}100%{-webkit-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:1;}}@-webkit-keyframes cfxSlideLeftOut{0%{-webkit-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:1;}100%{-webkit-transform:scaleX(0.8);-ms-transform:scaleX(0.8);transform:scaleX(0.8);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:0;}}@keyframes cfxSlideLeftOut{0%{-webkit-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:1;}100%{-webkit-transform:scaleX(0.8);-ms-transform:scaleX(0.8);transform:scaleX(0.8);-webkit-transform-origin:0% 0%;-ms-transform-origin:0% 0%;transform-origin:0% 0%;opacity:0;}}@-webkit-keyframes cfxSlideRightIn{0%{-webkit-transform:scaleX(0.8);-ms-transform:scaleX(0.8);transform:scaleX(0.8);-webkit-transform-origin:100% 0%;-ms-transform-origin:100% 0%;transform-origin:100% 0%;opacity:0;}100%{-webkit-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:100% 0%;-ms-transform-origin:100% 0%;transform-origin:100% 0%;opacity:1;}}@keyframes cfxSlideRightIn{0%{-webkit-transform:scaleX(0.8);-ms-transform:scaleX(0.8);transform:scaleX(0.8);-webkit-transform-origin:100% 0%;-ms-transform-origin:100% 0%;transform-origin:100% 0%;opacity:0;}100%{-webkit-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:100% 0%;-ms-transform-origin:100% 0%;transform-origin:100% 0%;opacity:1;}}@-webkit-keyframes cfxSlideRightOut{0%{-webkit-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:100% 0%;-ms-transform-origin:100% 0%;transform-origin:100% 0%;opacity:1;}100%{-webkit-transform:scaleX(0.8);-ms-transform:scaleX(0.8);transform:scaleX(0.8);-webkit-transform-origin:100% 0%;-ms-transform-origin:100% 0%;transform-origin:100% 0%;opacity:0;}}@keyframes cfxSlideRightOut{0%{-webkit-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:100% 0%;-ms-transform-origin:100% 0%;transform-origin:100% 0%;opacity:1;}100%{-webkit-transform:scaleX(0.8);-ms-transform:scaleX(0.8);transform:scaleX(0.8);-webkit-transform-origin:100% 0%;-ms-transform-origin:100% 0%;transform-origin:100% 0%;opacity:0;}}.slide-up-enter,.slide-up-appear{-webkit-animation-duration:".concat(animationDuration, ";animation-duration:").concat(animationDuration, ";-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-play-state:paused;animation-play-state:paused;}.slide-up-leave{-webkit-animation-duration:").concat(animationDuration, ";animation-duration:").concat(animationDuration, ";-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-play-state:paused;animation-play-state:paused;}.slide-up-enter.slide-up-enter-active,.slide-up-appear.slide-up-appear-active{-webkit-animation-name:cfxSlideUpIn;animation-name:cfxSlideUpIn;-webkit-animation-play-state:running;animation-play-state:running;}.slide-up-leave.slide-up-leave-active{-webkit-animation-name:cfxSlideUpOut;animation-name:cfxSlideUpOut;-webkit-animation-play-state:running;animation-play-state:running;pointer-events:none;}.slide-up-enter,.slide-up-appear{opacity:0;-webkit-animation-timing-function:cubic-bezier(0.23,1,0.32,1);animation-timing-function:cubic-bezier(0.23,1,0.32,1);}.slide-up-leave{-webkit-animation-timing-function:cubic-bezier(0.755,0.05,0.855,0.06);animation-timing-function:cubic-bezier(0.755,0.05,0.855,0.06);}.slide-down-enter,.slide-down-appear{-webkit-animation-duration:").concat(animationDuration, ";animation-duration:").concat(animationDuration, ";-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-play-state:paused;animation-play-state:paused;}.slide-down-leave{-webkit-animation-duration:").concat(animationDuration, ";animation-duration:").concat(animationDuration, ";-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-play-state:paused;animation-play-state:paused;}.slide-down-enter.slide-down-enter-active,.slide-down-appear.slide-down-appear-active{-webkit-animation-name:cfxSlideDownIn;animation-name:cfxSlideDownIn;-webkit-animation-play-state:running;animation-play-state:running;}.slide-down-leave.slide-down-leave-active{-webkit-animation-name:cfxSlideDownOut;animation-name:cfxSlideDownOut;-webkit-animation-play-state:running;animation-play-state:running;pointer-events:none;}.slide-down-enter,.slide-down-appear{opacity:0;-webkit-animation-timing-function:cubic-bezier(0.23,1,0.32,1);animation-timing-function:cubic-bezier(0.23,1,0.32,1);}.slide-down-leave{-webkit-animation-timing-function:cubic-bezier(0.755,0.05,0.855,0.06);animation-timing-function:cubic-bezier(0.755,0.05,0.855,0.06);}.slide-left-enter,.slide-left-appear{-webkit-animation-duration:").concat(animationDuration, ";animation-duration:").concat(animationDuration, ";-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-play-state:paused;animation-play-state:paused;}.slide-left-leave{-webkit-animation-duration:").concat(animationDuration, ";animation-duration:").concat(animationDuration, ";-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-play-state:paused;animation-play-state:paused;}.slide-left-enter.slide-left-enter-active,.slide-left-appear.slide-left-appear-active{-webkit-animation-name:cfxSlideLeftIn;animation-name:cfxSlideLeftIn;-webkit-animation-play-state:running;animation-play-state:running;}.slide-left-leave.slide-left-leave-active{-webkit-animation-name:cfxSlideLeftOut;animation-name:cfxSlideLeftOut;-webkit-animation-play-state:running;animation-play-state:running;pointer-events:none;}.slide-left-enter,.slide-left-appear{opacity:0;-webkit-animation-timing-function:cubic-bezier(0.23,1,0.32,1);animation-timing-function:cubic-bezier(0.23,1,0.32,1);}.slide-left-leave{-webkit-animation-timing-function:cubic-bezier(0.755,0.05,0.855,0.06);animation-timing-function:cubic-bezier(0.755,0.05,0.855,0.06);}.slide-right-enter,.slide-right-appear{-webkit-animation-duration:").concat(animationDuration, ";animation-duration:").concat(animationDuration, ";-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-play-state:paused;animation-play-state:paused;}.slide-right-leave{-webkit-animation-duration:").concat(animationDuration, ";animation-duration:").concat(animationDuration, ";-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-play-state:paused;animation-play-state:paused;}.slide-right-enter.slide-right-enter-active,.slide-right-appear.slide-right-appear-active{-webkit-animation-name:cfxSlideRightIn;animation-name:cfxSlideRightIn;-webkit-animation-play-state:running;animation-play-state:running;}.slide-right-leave.slide-right-leave-active{-webkit-animation-name:cfxSlideRightOut;animation-name:cfxSlideRightOut;-webkit-animation-play-state:running;animation-play-state:running;pointer-events:none;}.slide-right-enter,.slide-right-appear{opacity:0;-webkit-animation-timing-function:cubic-bezier(0.23,1,0.32,1);animation-timing-function:cubic-bezier(0.23,1,0.32,1);}.slide-right-leave{-webkit-animation-timing-function:cubic-bezier(0.755,0.05,0.855,0.06);animation-timing-function:cubic-bezier(0.755,0.05,0.855,0.06);}")); // sync with input size styles
export var generateSizeStyles = function generateSizeStyles(prefix, theme) {
var styles = [];
normalSizes.forEach(function (size) {
var _getSizes = getSizes(size),
heightRatio = _getSizes.heightRatio,
fontSize = _getSizes.fontSize,
margin = _getSizes.margin;
styles.push( /*#__PURE__*/React.createElement("div", {
key: "date-picker-style-".concat(size),
className: _JSXStyle.dynamic([["242120155", [prefix, size, prefix, heightRatio, theme.layout.gap, heightRatio, theme.layout.gap, prefix, size, prefix, margin, fontSize, heightRatio, theme.layout.gap]]])
}, /*#__PURE__*/React.createElement(_JSXStyle, {
id: "242120155",
dynamic: [prefix, size, prefix, heightRatio, theme.layout.gap, heightRatio, theme.layout.gap, prefix, size, prefix, margin, fontSize, heightRatio, theme.layout.gap]
}, ".".concat(prefix, "-picker-size-").concat(size, " .").concat(prefix, "-picker-input{height:calc(").concat(heightRatio, " * ").concat(theme.layout.gap, " - 2px);line-height:calc(").concat(heightRatio, " * ").concat(theme.layout.gap, " - 3px);}.").concat(prefix, "-picker-size-").concat(size, " .").concat(prefix, "-picker-input>input{margin:").concat(margin, ";font-size:").concat(fontSize, ";line-height:calc(").concat(heightRatio, " * ").concat(theme.layout.gap, " - 4px);}"))));
});
return styles;
}; // sync with input variant styles
export var generateVariantStyles = function generateVariantStyles(prefix, theme) {
var styles = [];
inputColors.forEach(function (color) {
inputVariants.forEach(function (variant) {
var _getColors = getColors(theme, color, variant === 'solid'),
textColor = _getColors.color,
hoverColor = _getColors.hoverColor,
border = _getColors.border,
hoverBorderColor = _getColors.hoverBorderColor,
backgroundColor = _getColors.backgroundColor,
hoverBackgroundColor = _getColors.hoverBackgroundColor;
styles.push( /*#__PURE__*/React.createElement("div", {
key: "date-picker-style-".concat(color, "-").concat(variant),
className: _JSXStyle.dynamic([["3956777767", [prefix, prefix, variant, prefix, color, textColor, backgroundColor, border, prefix, prefix, variant, prefix, color, prefix, addColorAlpha(textColor, 0.3), backgroundColor, prefix, prefix, variant, prefix, color, prefix, textColor, hoverBackgroundColor, prefix, prefix, variant, prefix, color, prefix, addColorAlpha(textColor, 0.3), prefix, prefix, variant, prefix, color, prefix, textColor, prefix, prefix, variant, prefix, color, prefix, prefix, variant, prefix, color, hoverBorderColor, hoverBackgroundColor, prefix, prefix, variant, prefix, color, prefix, prefix, prefix, variant, prefix, color, prefix, prefix, prefix, variant, prefix, color, prefix, prefix, prefix, variant, prefix, color, prefix, hoverColor, prefix, prefix, variant, prefix, color, prefix, prefix, textColor, prefix, prefix, variant, prefix, color, prefix, prefix, prefix, variant, prefix, color, prefix, variant === 'solid' ? "background-color: ".concat(hoverBackgroundColor) : '']]])
}, /*#__PURE__*/React.createElement(_JSXStyle, {
id: "3956777767",
dynamic: [prefix, prefix, variant, prefix, color, textColor, backgroundColor, border, prefix, prefix, variant, prefix, color, prefix, addColorAlpha(textColor, 0.3), backgroundColor, prefix, prefix, variant, prefix, color, prefix, textColor, hoverBackgroundColor, prefix, prefix, variant, prefix, color, prefix, addColorAlpha(textColor, 0.3), prefix, prefix, variant, prefix, color, prefix, textColor, prefix, prefix, variant, prefix, color, prefix, prefix, variant, prefix, color, hoverBorderColor, hoverBackgroundColor, prefix, prefix, variant, prefix, color, prefix, prefix, prefix, variant, prefix, color, prefix, prefix, prefix, variant, prefix, color, prefix, prefix, prefix, variant, prefix, color, prefix, hoverColor, prefix, prefix, variant, prefix, color, prefix, prefix, textColor, prefix, prefix, variant, prefix, color, prefix, prefix, prefix, variant, prefix, color, prefix, variant === 'solid' ? "background-color: ".concat(hoverBackgroundColor) : '']
}, ".".concat(prefix, "-picker.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, "{color:").concat(textColor, ";background-color:").concat(backgroundColor, ";border:").concat(border, ";}.").concat(prefix, "-picker.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, " .").concat(prefix, "-picker-clear{color:").concat(addColorAlpha(textColor, 0.3), ";background-color:").concat(backgroundColor, ";}.").concat(prefix, "-picker.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, " .").concat(prefix, "-picker-clear:hover{color:").concat(textColor, ";background-color:").concat(hoverBackgroundColor, ";}.").concat(prefix, "-picker.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, " .").concat(prefix, "-picker-clear .clear-icon{color:").concat(addColorAlpha(textColor, 0.3), " !important;}.").concat(prefix, "-picker.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, " .").concat(prefix, "-picker-clear:hover .clear-icon{color:").concat(textColor, " !important;}.").concat(prefix, "-picker.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, ":hover,.").concat(prefix, "-picker-focused.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, "{border-color:").concat(hoverBorderColor, ";background-color:").concat(hoverBackgroundColor, ";}.").concat(prefix, "-picker.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, ":hover .").concat(prefix, "-picker-input>input,.").concat(prefix, "-picker-focused.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, " .").concat(prefix, "-picker-input>input,.").concat(prefix, "-picker.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, ":hover .").concat(prefix, "-picker-suffix,.").concat(prefix, "-picker-focused.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, " .").concat(prefix, "-picker-suffix{color:").concat(hoverColor, ";}.").concat(prefix, "-picker-focused.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, " .").concat(prefix, "-picker-input:not(.").concat(prefix, "-picker-input-active)>input{color:").concat(textColor, ";}.").concat(prefix, "-picker.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, ":hover .").concat(prefix, "-picker-clear,.").concat(prefix, "-picker-focused.").concat(prefix, "-picker-variant-").concat(variant, ".").concat(prefix, "-picker-color-").concat(color, " .").concat(prefix, "-picker-clear{").concat(variant === 'solid' ? "background-color: ".concat(hoverBackgroundColor) : '', ";}"))));
});
});
return styles;
}; // picker style
export var generatePickerGlobalStyle = function generatePickerGlobalStyle(theme, props) {
var _props$prefixCls = props.prefixCls,
prefix = _props$prefixCls === void 0 ? 'cfx' : _props$prefixCls;
var palette = theme.palette; // TODO Dark theme
// TODO Cross Browser Compatibility
// TODO Optimize the styles:
// Although a lot of style adjustments have been made, extreme cases are not ruled out.
// Maybe need adjust the pseudo-element (::before or ::after) styles, it sucks.
// TODO extract variables if necessary
var pattern = {
color: {
bg: palette.cNeutral8,
bgLight: palette.cTheme0,
bgScroll: palette.cNeutral0,
bgHover: palette.cTheme0,
bgDisabled: palette.cNeutral0,
border: palette.cTheme5,
borderDark: palette.cNeutral5,
base: palette.cTheme5,
hover: palette.cTheme5,
active: palette.cTheme5,
placeholder: palette.cNeutral5,
heading: palette.cNeutral7,
disabled: palette.cNeutral4,
text: palette.cNeutral7,
containerShadow: theme.expressiveness.D3
},
size: {
cell: '32px',
cellRadius: '32px',
panelRadius: theme.expressiveness.R4,
icon: '7px',
fontHeader: '1.2rem'
},
other: {
transitionDuration: '0.2s'
}
};
return /*#__PURE__*/React.createElement(React.Fragment, null, animationStyle, /*#__PURE__*/React.createElement(_JSXStyle, {
id: "4220952006",
dynamic: [prefix, pattern.color.bg, prefix, pattern.color.base, prefix, prefix, prefix, prefix, prefix, prefix, prefix, (parseInt(pattern.size.cell, 10) + 20) * 7 + 3 * 6 + 'px', prefix, pattern.color.heading, prefix, prefix, pattern.color.text, pattern.size.fontHeader, pattern.other.transitionDuration, prefix, prefix, pattern.color.hover, prefix, pattern.size.fontHeader, prefix, pattern.size.fontHeader, prefix, prefix, pattern.color.base, prefix, prefix, prefix, prefix, pattern.size.icon, pattern.size.icon, prefix, prefix, prefix, prefix, pattern.size.icon, pattern.size.icon, prefix, prefix, pattern.size.icon, pattern.size.icon, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.size.cell, prefix, pattern.color.text, prefix, pattern.color.disabled, prefix, pattern.color.text, prefix, prefix, pattern.size.cell, prefix, prefix, pattern.size.cell, pattern.size.cell, pattern.size.cell, pattern.size.cellRadius, pattern.other.transitionDuration, pattern.other.transitionDuration, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.bgHover, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.base, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.bg, pattern.color.base, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.size.cell, pattern.color.border, pattern.color.border, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.size.cell, pattern.color.border, pattern.color.border, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.bgLight, prefix, prefix, prefix, prefix, prefix, pattern.size.cellRadius, prefix, prefix, prefix, prefix, prefix, pattern.size.cellRadius, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.border, pattern.size.cellRadius, pattern.size.cellRadius, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.border, pattern.size.cellRadius, pattern.size.cellRadius, prefix, prefix, prefix, pattern.color.disabled, prefix, pattern.color.bg, prefix, prefix, prefix, pattern.color.disabled, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.bgDisabled, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.text, prefix, pattern.color.hover, prefix, pattern.color.text, prefix, pattern.color.base, prefix, pattern.color.base, prefix, prefix, pattern.color.disabled, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.border, pattern.size.cellRadius, pattern.size.cellRadius, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.border, pattern.size.cellRadius, pattern.size.cellRadius, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.border, pattern.size.cellRadius, pattern.size.cellRadius, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.border, pattern.size.cellRadius, pattern.size.cellRadius, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.other.transitionDuration, prefix, pattern.size.cellRadius, pattern.size.cellRadius, prefix, pattern.size.cellRadius, pattern.size.cellRadius, prefix, pattern.color.bgHover, prefix, prefix, pattern.color.base, prefix, prefix, pattern.color.base, prefix, prefix, prefix, prefix, addColorAlpha(pattern.color.bg, 0.5), prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.bg, prefix, prefix, prefix, prefix, pattern.color.bg, prefix, prefix, prefix, prefix, (parseInt(pattern.size.cell, 10) + 20) * 7 + 'px', prefix, prefix, parseInt(pattern.size.cell, 10) + 20 + 'px', prefix, prefix, prefix, pattern.color.border, prefix, prefix, prefix, prefix, pattern.other.transitionDuration, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.bgScroll, prefix, palette.cNeutral4, prefix, prefix, prefix, prefix, palette.cNeutral3, prefix, palette.cNeutral3, prefix, addColorAlpha(pattern.color.bgLight, 0.2), prefix, prefix, prefix, prefix, prefix, pattern.color.text, pattern.other.transitionDuration, prefix, prefix, prefix, pattern.color.bgHover, prefix, prefix, prefix, pattern.color.bgLight, prefix, prefix, prefix, pattern.color.disabled, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, theme.expressiveness.R2, prefix, prefix, prefix, prefix, pattern.color.hover, prefix, prefix, prefix, prefix, pattern.other.transitionDuration, prefix, prefix, prefix, prefix, pattern.color.placeholder, prefix, prefix, prefix, pattern.color.hover, prefix, prefix, pattern.color.hover, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.other.transitionDuration, prefix, prefix, prefix, prefix, prefix, pattern.color.placeholder, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.disabled, prefix, prefix, prefix, prefix, prefix, prefix, palette.cNeutral2, pattern.color.bg, prefix, prefix, prefix, prefix, prefix, prefix, palette.cNeutral3, prefix, pattern.color.disabled, prefix, prefix, palette.cNeutral2, pattern.other.transitionDuration, pattern.other.transitionDuration, prefix, prefix, prefix, prefix, pattern.color.disabled, prefix, prefix, pattern.color.hover, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.base, pattern.other.transitionDuration, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.text, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.base, pattern.color.border, prefix, prefix, pattern.color.bgLight, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.bg, pattern.color.border, pattern.size.panelRadius, pattern.color.containerShadow, pattern.other.transitionDuration, prefix, prefix, prefix, prefix, prefix, prefix, pattern.color.border]
}, ".".concat(prefix, "-picker-panel{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;text-align:center;background:").concat(pattern.color.bg, ";outline:none;}.").concat(prefix, "-picker-panel-focused{border-color:").concat(pattern.color.base, ";}.").concat(prefix, "-picker-decade-panel,.").concat(prefix, "-picker-year-panel,.").concat(prefix, "-picker-quarter-panel,.").concat(prefix, "-picker-month-panel,.").concat(prefix, "-picker-week-panel,.").concat(prefix, "-picker-date-panel,.").concat(prefix, "-picker-time-panel{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;width:").concat((parseInt(pattern.size.cell, 10) + 20) * 7 + 3 * 6 + 'px', ";}.").concat(prefix, "-picker-header{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:0 16px;color:").concat(pattern.color.heading, ";}.").concat(prefix, "-picker-header>*{-webkit-flex:none;-ms-flex:none;flex:none;}.").concat(prefix, "-picker-header button{padding:0;color:").concat(pattern.color.text, ";font-size:").concat(pattern.size.fontHeader, ";line-height:40px;background:0 0;border:0;cursor:pointer;}.").concat(prefix, "-picker-header>button{min-width:1.6em;}.").concat(prefix, "-picker-header>button:hover{color:").concat(pattern.color.hover, ";}.").concat(prefix, "-picker-header-view{-webkit-flex:auto;-ms-flex:auto;flex:auto;font-weight:700;line-height:40px;font-size:").concat(pattern.size.fontHeader, ";}.").concat(prefix, "-picker-header-view button{color:inherit;font-weight:inherit;font-size:").concat(pattern.size.fontHeader, ";}.").concat(prefix, "-picker-header-view button:not(:first-child){margin-left:8px;}.").concat(prefix, "-picker-header-view button:hover{color:").concat(pattern.color.base, ";}.").concat(prefix, "-picker-prev-icon,.").concat(prefix, "-picker-next-icon,.").concat(prefix, "-picker-super-prev-icon,.").concat(prefix, "-picker-super-next-icon{position:relative;display:inline-block;width:").concat(pattern.size.icon, ";height:").concat(pattern.size.icon, ";}.").concat(prefix, "-picker-prev-icon::before,.").concat(prefix, "-picker-next-icon::before,.").concat(prefix, "-picker-super-prev-icon::before,.").concat(prefix, "-picker-super-next-icon::before{position:absolute;top:0;left:0;display:inline-block;width:").concat(pattern.size.icon, ";height:").concat(pattern.size.icon, ";border:0 solid currentColor;border-width:1.5px 0 0 1.5px;content:'';}.").concat(prefix, "-picker-super-prev-icon::after,.").concat(prefix, "-picker-super-next-icon::after{position:absolute;top:4px;left:4px;display:inline-block;width:").concat(pattern.size.icon, ";height:").concat(pattern.size.icon, ";border:0 solid currentColor;border-width:1.5px 0 0 1.5px;content:'';}.").concat(prefix, "-picker-prev-icon,.").concat(prefix, "-picker-super-prev-icon{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);}.").concat(prefix, "-picker-next-icon,.").concat(prefix, "-picker-super-next-icon{-webkit-transform:rotate(135deg);-ms-transform:rotate(135deg);transform:rotate(135deg);}.").concat(prefix, "-picker-content{width:100%;table-layout:fixed;border-collapse:collapse;}.").concat(prefix, "-picker-content th,.").concat(prefix, "-picker-content td{position:relative;min-width:").concat(pattern.size.cell, ";font-weight:500;}.").concat(prefix, "-picker-content th{height:30px;color:").concat(pattern.color.text, ";line-height:30px;font-weight:500;}.").concat(prefix, "-picker-cell{padding:2px 2px;color:").concat(pattern.color.disabled, ";cursor:pointer;}.").concat(prefix, "-picker-cell-in-view{color:").concat(pattern.color.text, ";}.").concat(prefix, "-picker-cell-disabled{cursor:not-allowed;}.").concat(prefix, "-picker-cell::before{position:absolute;top:50%;right:0;left:0;z-index:1;height:").concat(pattern.size.cell, ";-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);content:'';}.").concat(prefix, "-picker-cell .").concat(prefix, "-picker-cell-inner{position:relative;z-index:2;display:inline-block;min-width:").concat(pattern.size.cell, ";height:").concat(pattern.size.cell, ";line-height:").concat(pattern.size.cell, ";border-radius:").concat(pattern.size.cellRadius, ";-webkit-transition:background ").concat(pattern.other.transitionDuration, ";transition:background ").concat(pattern.other.transitionDuration, ";-webkit-transition:border ").concat(pattern.other.transitionDuration, ";transition:border ").concat(pattern.other.transitionDuration, ";}.").concat(prefix, "-picker-cell:hover:not(.").concat(prefix, "-picker-cell-in-view) .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-cell:hover:not(.").concat(prefix, "-picker-cell-selected):not(.").concat(prefix, "-picker-cell-range-start):not(.").concat(prefix, "-picker-cell-range-end):not(.").concat(prefix, "-picker-cell-range-hover-start):not(.").concat(prefix, "-picker-cell-range-hover-end) .").concat(prefix, "-picker-cell-inner{background:").concat(pattern.color.bgHover, ";}.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-today .").concat(prefix, "-picker-cell-inner::before{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;border-radius:50%;content:'';}.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-today .").concat(prefix, "-picker-cell-inner{border:1px solid ").concat(pattern.color.base, ";}.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-in-range{position:relative;}.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-selected .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-start .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-end .").concat(prefix, "-picker-cell-inner{color:").concat(pattern.color.bg, ";background:").concat(pattern.color.base, ";}.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-start::before{left:50%;}.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-end::before{right:50%;left:2px;}.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-end.").concat(prefix, "-picker-cell-range-start::before{display:none;}.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover-start:not(.").concat(prefix, "-picker-cell-in-range):not(.").concat(prefix, "-picker-cell-range-start):not(.").concat(prefix, "-picker-cell-range-end)::after,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover-end:not(.").concat(prefix, "-picker-cell-in-range):not(.").concat(prefix, "-picker-cell-range-start):not(.").concat(prefix, "-picker-cell-range-end)::after,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover-start.").concat(prefix, "-picker-cell-range-start-single::after,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover-end.").concat(prefix, "-picker-cell-range-end-single::after,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover:not(.").concat(prefix, "-picker-cell-in-range)::after,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-in-range::after,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-start.").concat(prefix, "-picker-cell-range-hover-start::before,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-start.").concat(prefix, "-picker-cell-selected::before,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-start:not(.").concat(prefix, "-picker-cell-range-start-single)::before,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-end.").concat(prefix, "-picker-cell-range-hover-end::before,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-end.").concat(prefix, "-picker-cell-selected::before,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-end:not(.").concat(prefix, "-picker-cell-range-end-single)::before{position:absolute;top:50%;z-index:3;height:").concat(pattern.size.cell, ";border-top:1px dashed ").concat(pattern.color.border, ";border-bottom:1px dashed ").concat(pattern.color.border, ";-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);content:'';}tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-start:last-child::before,tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-end:first-child::before{display:none;}tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-end:last-child::after,tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-start:first-child::after{display:none;}.").concat(prefix, "-picker-year-panel tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-start:last-child::after,.").concat(prefix, "-picker-year-panel tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-end:first-child::after{position:absolute;top:50%;z-index:3;height:").concat(pattern.size.cell, ";border-top:1px dashed ").concat(pattern.color.border, ";border-bottom:1px dashed ").concat(pattern.color.border, ";-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);content:'';}.").concat(prefix, "-picker-year-panel tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-start:last-child::after{right:50%;}.").concat(prefix, "-picker-year-panel tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-end:first-child::after{left:50%;}.").concat(prefix, "-picker-cell-range-hover-start::after,.").concat(prefix, "-picker-cell-range-hover-end::after,.").concat(prefix, "-picker-cell-range-hover::after,.").concat(prefix, "-picker-cell-in-range::after{right:0;left:2px;}.").concat(prefix, "-picker-date-panel .").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-in-range.").concat(prefix, "-picker-cell-range-hover-start .").concat(prefix, "-picker-cell-inner::after,.").concat(prefix, "-picker-date-panel .").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-in-range.").concat(prefix, "-picker-cell-range-hover-end .").concat(prefix, "-picker-cell-inner::after{position:absolute;top:0;bottom:0;z-index:-1;background:").concat(pattern.color.bgLight, ";content:'';}.").concat(prefix, "-picker-date-panel .").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-in-range.").concat(prefix, "-picker-cell-range-hover-start .").concat(prefix, "-picker-cell-inner::after{right:0;left:0;z-index:-2;border-radius:").concat(pattern.size.cellRadius, ";}.").concat(prefix, "-picker-date-panel .").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-in-range.").concat(prefix, "-picker-cell-range-hover-end .").concat(prefix, "-picker-cell-inner::after{right:0;left:0;z-index:-2;border-radius:").concat(pattern.size.cellRadius, ";}.").concat(prefix, "-picker-cell-range-hover.").concat(prefix, "-picker-cell-range-start::after{right:50%;}.").concat(prefix, "-picker-cell-range-hover.").concat(prefix, "-picker-cell-range-end::after{left:50%;}tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover:first-child::after,tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover-end:first-child::after,tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-in-range:first-child::after,tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-edge-start:not(.").concat(prefix, "-picker-cell-range-hover-edge-end-near-range):not(.").concat(prefix, "-picker-cell-range-hover-end):not(.").concat(prefix, "-picker-cell-range-hover)::after,tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-end:first-child::after,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover-edge-start:not(.").concat(prefix, "-picker-cell-range-hover-edge-start-near-range)::after,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover-start::after{left:10px;border-left:1px dashed ").concat(pattern.color.border, ";border-top-left-radius:").concat(pattern.size.cellRadius, ";border-bottom-left-radius:").concat(pattern.size.cellRadius, ";}tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover:last-child::after,tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover-start:last-child::after,tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-in-range:last-child::after,tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-edge-end:not(.").concat(prefix, "-picker-cell-range-hover-edge-end-near-range):not(.").concat(prefix, "-picker-cell-range-hover-start):not(.").concat(prefix, "-picker-cell-range-hover)::after,tr>.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-start:last-child::after,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover-edge-end:not(.").concat(prefix, "-picker-cell-range-hover-edge-end-near-range)::after,.").concat(prefix, "-picker-cell-in-view.").concat(prefix, "-picker-cell-range-hover-end::after{right:10px;border-right:1px dashed ").concat(pattern.color.border, ";border-top-right-radius:").concat(pattern.size.cellRadius, ";border-bottom-right-radius:").concat(pattern.size.cellRadius, ";}.").concat(prefix, "-picker-cell-disabled{pointer-events:none;cursor:not-allowed;}.").concat(prefix, "-picker-cell-disabled .").concat(prefix, "-picker-cell-inner{color:").concat(pattern.color.disabled, ";background:0 0;}.").concat(prefix, "-picker-cell-disabled::before{background:").concat(pattern.color.bg, ";}.").concat(prefix, "-picker-cell-disabled.").concat(prefix, "-picker-cell-today .").concat(prefix, "-picker-cell-inner::before{border-color:").concat(pattern.color.disabled, ";}.").concat(prefix, "-picker-decade-panel .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-year-panel .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-quarter-panel .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-month-panel .").concat(prefix, "-picker-cell-inner{padding:0 8px;}.").concat(prefix, "-picker-decade-panel .").concat(prefix, "-picker-cell-disabled .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-year-panel .").concat(prefix, "-picker-cell-disabled .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-quarter-panel .").concat(prefix, "-picker-cell-disabled .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-month-panel .").concat(prefix, "-picker-cell-disabled .").concat(prefix, "-picker-cell-inner{background:").concat(pattern.color.bgDisabled, ";}.").concat(prefix, "-picker-quarter-panel .").concat(prefix, "-picker-content{height:56px;}.").concat(prefix, "-picker-footer{width:-webkit-min-content;width:-moz-min-content;width:min-content;min-width:100%;line-height:38px;text-align:center;}.").concat(prefix, "-picker-footer-extra{padding:0 12px;line-height:38px;text-align:left;}.").concat(prefix, "-picker-now{text-align:left;}.").concat(prefix, "-picker-now::before{display:none;}.").concat(prefix, "-picker-now-btn{color:").concat(pattern.color.text, ";}.").concat(prefix, "-picker-now-btn:hover{color:").concat(pattern.color.hover, ";}.").concat(prefix, "-picker-today-btn{color:").concat(pattern.color.text, ";}.").concat(prefix, "-picker-today-btn:hover{color:").concat(pattern.color.base, ";}.").concat(prefix, "-picker-today-btn:active{color:").concat(pattern.color.base, ";}.").concat(prefix, "-picker-today-btn.").concat(prefix, "-picker-today-btn-disabled{color:").concat(pattern.color.disabled, ";cursor:not-allowed;}.").concat(prefix, "-picker-decade-panel .").concat(prefix, "-picker-cell-inner{padding:0 4px;}.").concat(prefix, "-picker-decade-panel .").concat(prefix, "-picker-cell::before{display:none;}.").concat(prefix, "-picker-year-panel .").concat(prefix, "-picker-body,.").concat(prefix, "-picker-quarter-panel .").concat(prefix, "-picker-body,.").concat(prefix, "-picker-month-panel .").concat(prefix, "-picker-body{padding:0 10px;}.").concat(prefix, "-picker-year-panel .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-quarter-panel .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-month-panel .").concat(prefix, "-picker-cell-inner{width:100px;}.").concat(prefix, "-picker-year-panel .").concat(prefix, "-picker-cell-range-hover-start::after,.").concat(prefix, "-picker-quarter-panel .").concat(prefix, "-picker-cell-range-hover-start::after,.").concat(prefix, "-picker-month-panel .").concat(prefix, "-picker-cell-range-hover-start::after{left:10px;border-left:1px dashed ").concat(pattern.color.border, ";border-radius:").concat(pattern.size.cellRadius, " 0 0 ").concat(pattern.size.cellRadius, ";}.").concat(prefix, "-picker-panel-rtl .").concat(prefix, "-picker-year-panel .").concat(prefix, "-picker-cell-range-hover-start::after,.").concat(prefix, "-picker-panel-rtl .").concat(prefix, "-picker-quarter-panel .").concat(prefix, "-picker-cell-range-hover-start::after,.").concat(prefix, "-picker-panel-rtl .").concat(prefix, "-picker-month-panel .").concat(prefix, "-picker-cell-range-hover-start::after{right:10px;border-right:1px dashed ").concat(pattern.color.border, ";border-radius:0 ").concat(pattern.size.cellRadius, " ").concat(pattern.size.cellRadius, " 0;}.").concat(prefix, "-picker-year-panel .").concat(prefix, "-picker-cell-range-hover-end::after,.").concat(prefix, "-picker-quarter-panel .").concat(prefix, "-picker-cell-range-hover-end::after,.").concat(prefix, "-picker-month-panel .").concat(prefix, "-picker-cell-range-hover-end::after{right:10px;border-right:1px dashed ").concat(pattern.color.border, ";border-radius:0 ").concat(pattern.size.cellRadius, " ").concat(pattern.size.cellRadius, " 0;}.").concat(prefix, "-picker-panel-rtl .").concat(prefix, "-picker-year-panel .").concat(prefix, "-picker-cell-range-hover-end::after,.").concat(prefix, "-picker-panel-rtl .").concat(prefix, "-picker-quarter-panel .").concat(prefix, "-picker-cell-range-hover-end::after,.").concat(prefix, "-picker-panel-rtl .").concat(prefix, "-picker-month-panel .").concat(prefix, "-picker-cell-range-hover-end::after{left:10px;border-left:1px dashed ").concat(pattern.color.border, ";border-radius:").concat(pattern.size.cellRadius, " 0 0 ").concat(pattern.size.cellRadius, ";}.").concat(prefix, "-picker-week-panel .").concat(prefix, "-picker-body{padding:8px 10px;}.").concat(prefix, "-picker-week-panel .").concat(prefix, "-picker-cell:hover .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-week-panel .").concat(prefix, "-picker-cell-selected .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-week-panel .").concat(prefix, "-picker-cell .").concat(prefix, "-picker-cell-inner{background:0 0 !important;}.").concat(prefix, "-picker-week-panel-row td{-webkit-transition:background ").concat(pattern.other.transitionDuration, ";transition:background ").concat(pattern.other.transitionDuration, ";}.").concat(prefix, "-picker-week-panel-row td:first-child{border-radius:").concat(pattern.size.cellRadius, " 0 0 ").concat(pattern.size.cellRadius, ";}.").concat(prefix, "-picker-week-panel-row td:last-child{border-radius:0 ").concat(pattern.size.cellRadius, " ").concat(pattern.size.cellRadius, " 0;}.").concat(prefix, "-picker-week-panel-row:hover td{background:").concat(pattern.color.bgHover, ";}.").concat(prefix, "-picker-week-panel-row-selected td,.").concat(prefix, "-picker-week-panel-row-selected:hover td{background:").concat(pattern.color.base, ";}.").concat(prefix, "-picker-week-panel-row-selected td,.").concat(prefix, "-picker-week-panel-row-selected:hover td{background:").concat(pattern.color.base, ";}.").concat(prefix, "-picker-week-panel-row-selected td.").concat(prefix, "-picker-cell-week,.").concat(prefix, "-picker-week-panel-row-selected:hover td.").concat(prefix, "-picker-cell-week{color:").concat(addColorAlpha(pattern.color.bg, 0.5), ";}.").concat(prefix, "-picker-week-panel-row-selected td.").concat(prefix, "-picker-cell-today .").concat(prefix, "-picker-cell-inner::before,.").concat(prefix, "-picker-week-panel-row-selected:hover td.").concat(prefix, "-picker-cell-today .").concat(prefix, "-picker-cell-inner::before{border-color:").concat(pattern.color.bg, ";}.").concat(prefix, "-picker-week-panel-row-selected td .").concat(prefix, "-picker-cell-inner,.").concat(prefix, "-picker-week-panel-row-selected:hover td .").concat(prefix, "-picker-cell-inner{color:").concat(pattern.color.bg, ";}.").concat(prefix, "-picker-date-panel .").concat(prefix, "-picker-body{padding:8px 8px;}.").concat(prefix, "-picker-date-panel .").concat(prefix, "-picker-content{width:").concat((parseInt(pattern.size.cell, 10) + 20) * 7 + 'px', ";}.").concat(prefix, "-picker-date-panel .").concat(prefix, "-picker-content th{width:").concat(parseInt(pattern.size.cell, 10) + 20 + 'px', ";}.").concat(prefix, "-picker-datetime-panel{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}.").concat(prefix, "-picker-datetime-panel .").concat(prefix, "-picker-time-panel{border-left:1px solid ").concat(pattern.color.border, ";}.").concat(prefix, "-picker-datetime-panel .").concat(prefix, "-picker-date-panel,.").concat(prefix, "-picker-datetime-panel .").concat(prefix, "-picker-time-panel{-webkit-transition:opacity ").concat(pattern.other.transitionDuration, ";transition:opacity ").concat(pattern.other.transitionDuration, ";}.").concat(prefix, "-picker-datetime-panel-active .").concat(prefix, "-picker-date-panel,.").concat(prefix, "-picker-datetime-panel-active .").concat(prefix, "-picker-time-panel{opacity:0.3;}.").concat(prefix, "-picker-datetime-panel-active .").concat(prefix, "-picker-date-panel-active,.").concat(prefix, "-picker-datetime-panel-active .").concat(prefix, "-picker-time-panel-active{opacity:1;}.").concat(prefix, "-picker-time-panel{width:auto;min-width:auto;}.").concat(prefix, "-picker-time-panel .").concat(prefix, "-picker-content{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:auto;-ms-flex:auto;flex:auto;height:224px;}.").concat(prefix, "-picker-time-panel-column{-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto;width:56px;margin:0