1 | "use strict";
|
2 | Object.defineProperty(exports, "__esModule", { value: true });
|
3 | exports.styles = void 0;
|
4 | var style_utilities_1 = require("@fluentui/style-utilities");
|
5 | var GlobalClassNames = {
|
6 | root: 'ms-DatePicker',
|
7 | callout: 'ms-DatePicker-callout',
|
8 | withLabel: 'ms-DatePicker-event--with-label',
|
9 | withoutLabel: 'ms-DatePicker-event--without-label',
|
10 | disabled: 'msDatePickerDisabled ',
|
11 | };
|
12 | var TEXTFIELD_HEIGHT = 32;
|
13 | var styles = function (props) {
|
14 | var _a;
|
15 | var className = props.className, theme = props.theme, disabled = props.disabled, underlined = props.underlined, label = props.label, isDatePickerShown = props.isDatePickerShown;
|
16 | var palette = theme.palette, semanticColors = theme.semanticColors, fonts = theme.fonts;
|
17 | var classNames = style_utilities_1.getGlobalClassNames(GlobalClassNames, theme);
|
18 | var DatePickerIcon = {
|
19 | color: palette.neutralSecondary,
|
20 | fontSize: style_utilities_1.FontSizes.icon,
|
21 | lineHeight: '18px',
|
22 | pointerEvents: 'none',
|
23 | position: 'absolute',
|
24 | right: '4px',
|
25 | padding: '5px',
|
26 | };
|
27 | return {
|
28 | root: [classNames.root, theme.fonts.large, isDatePickerShown && 'is-open', style_utilities_1.normalize, className],
|
29 | textField: [
|
30 | {
|
31 | position: 'relative',
|
32 | selectors: {
|
33 | '& input[readonly]': {
|
34 | cursor: 'pointer',
|
35 | },
|
36 | input: {
|
37 | selectors: {
|
38 | '::-ms-clear': {
|
39 | display: 'none',
|
40 | },
|
41 | },
|
42 | },
|
43 | },
|
44 | },
|
45 | disabled && {
|
46 | selectors: {
|
47 | '& input[readonly]': {
|
48 | cursor: 'default',
|
49 | },
|
50 | },
|
51 | },
|
52 | ],
|
53 | callout: [classNames.callout],
|
54 | icon: [
|
55 | DatePickerIcon,
|
56 | label ? classNames.withLabel : classNames.withoutLabel,
|
57 | { paddingTop: '7px' },
|
58 | !disabled && [
|
59 | classNames.disabled,
|
60 | {
|
61 | pointerEvents: 'initial',
|
62 | cursor: 'pointer',
|
63 | },
|
64 | ],
|
65 | disabled && {
|
66 | color: semanticColors.disabledText,
|
67 | cursor: 'default',
|
68 | },
|
69 | ],
|
70 | statusMessage: [
|
71 | fonts.small,
|
72 | {
|
73 | color: semanticColors.errorText,
|
74 | marginTop: 5,
|
75 | },
|
76 | ],
|
77 | readOnlyTextField: [
|
78 | {
|
79 | cursor: 'pointer',
|
80 | height: TEXTFIELD_HEIGHT,
|
81 | lineHeight: TEXTFIELD_HEIGHT - 2,
|
82 | overflow: 'hidden',
|
83 | textOverflow: 'ellipsis',
|
84 | },
|
85 | underlined && {
|
86 | lineHeight: TEXTFIELD_HEIGHT + 2,
|
87 | },
|
88 | ],
|
89 | readOnlyPlaceholder: (_a = {
|
90 | color: semanticColors.inputPlaceholderText
|
91 | },
|
92 | _a[style_utilities_1.HighContrastSelector] = {
|
93 | color: 'GrayText',
|
94 | },
|
95 | _a),
|
96 | };
|
97 | };
|
98 | exports.styles = styles;
|
99 |
|
\ | No newline at end of file |