117 lines
4.3 KiB
JavaScript
117 lines
4.3 KiB
JavaScript
|
|
import { style } from '@primeuix/styles/datepicker';
|
||
|
|
import BaseStyle from '@primevue/core/base/style';
|
||
|
|
|
||
|
|
var inlineStyles = {
|
||
|
|
root: function root(_ref) {
|
||
|
|
var props = _ref.props;
|
||
|
|
return {
|
||
|
|
position: props.appendTo === 'self' || props.showClear ? 'relative' : undefined
|
||
|
|
};
|
||
|
|
}
|
||
|
|
};
|
||
|
|
var classes = {
|
||
|
|
root: function root(_ref2) {
|
||
|
|
var instance = _ref2.instance,
|
||
|
|
state = _ref2.state;
|
||
|
|
return ['p-datepicker p-component p-inputwrapper', {
|
||
|
|
'p-invalid': instance.$invalid,
|
||
|
|
'p-inputwrapper-filled': instance.$filled,
|
||
|
|
'p-inputwrapper-focus': state.focused || state.overlayVisible,
|
||
|
|
'p-focus': state.focused || state.overlayVisible,
|
||
|
|
'p-datepicker-fluid': instance.$fluid
|
||
|
|
}];
|
||
|
|
},
|
||
|
|
pcInputText: 'p-datepicker-input',
|
||
|
|
clearIcon: 'p-datepicker-clear-icon',
|
||
|
|
dropdown: 'p-datepicker-dropdown',
|
||
|
|
inputIconContainer: 'p-datepicker-input-icon-container',
|
||
|
|
inputIcon: 'p-datepicker-input-icon',
|
||
|
|
panel: function panel(_ref3) {
|
||
|
|
var props = _ref3.props;
|
||
|
|
return ['p-datepicker-panel p-component', {
|
||
|
|
'p-datepicker-panel-inline': props.inline,
|
||
|
|
'p-disabled': props.disabled,
|
||
|
|
'p-datepicker-timeonly': props.timeOnly
|
||
|
|
}];
|
||
|
|
},
|
||
|
|
calendarContainer: 'p-datepicker-calendar-container',
|
||
|
|
calendar: 'p-datepicker-calendar',
|
||
|
|
header: 'p-datepicker-header',
|
||
|
|
pcPrevButton: 'p-datepicker-prev-button',
|
||
|
|
title: 'p-datepicker-title',
|
||
|
|
selectMonth: 'p-datepicker-select-month',
|
||
|
|
selectYear: 'p-datepicker-select-year',
|
||
|
|
decade: 'p-datepicker-decade',
|
||
|
|
pcNextButton: 'p-datepicker-next-button',
|
||
|
|
dayView: 'p-datepicker-day-view',
|
||
|
|
weekHeader: 'p-datepicker-weekheader p-disabled',
|
||
|
|
weekNumber: 'p-datepicker-weeknumber',
|
||
|
|
weekLabelContainer: 'p-datepicker-weeklabel-container p-disabled',
|
||
|
|
weekDayCell: 'p-datepicker-weekday-cell',
|
||
|
|
weekDay: 'p-datepicker-weekday',
|
||
|
|
dayCell: function dayCell(_ref4) {
|
||
|
|
var date = _ref4.date;
|
||
|
|
return ['p-datepicker-day-cell', {
|
||
|
|
'p-datepicker-other-month': date.otherMonth,
|
||
|
|
'p-datepicker-today': date.today
|
||
|
|
}];
|
||
|
|
},
|
||
|
|
day: function day(_ref5) {
|
||
|
|
var instance = _ref5.instance,
|
||
|
|
props = _ref5.props,
|
||
|
|
state = _ref5.state,
|
||
|
|
date = _ref5.date;
|
||
|
|
var selectedDayClass = '';
|
||
|
|
if (instance.isRangeSelection() && instance.isSelected(date) && date.selectable) {
|
||
|
|
var start = typeof state.rawValue[0] === 'string' ? instance.parseValue(state.rawValue[0])[0] : state.rawValue[0];
|
||
|
|
var end = typeof state.rawValue[1] === 'string' ? instance.parseValue(state.rawValue[1])[0] : state.rawValue[1];
|
||
|
|
selectedDayClass = instance.isDateEquals(start, date) || instance.isDateEquals(end, date) ? 'p-datepicker-day-selected' : 'p-datepicker-day-selected-range';
|
||
|
|
}
|
||
|
|
return ['p-datepicker-day', {
|
||
|
|
'p-datepicker-day-selected': !instance.isRangeSelection() && instance.isSelected(date) && date.selectable,
|
||
|
|
'p-disabled': props.disabled || !date.selectable
|
||
|
|
}, selectedDayClass];
|
||
|
|
},
|
||
|
|
monthView: 'p-datepicker-month-view',
|
||
|
|
month: function month(_ref6) {
|
||
|
|
var instance = _ref6.instance,
|
||
|
|
props = _ref6.props,
|
||
|
|
_month = _ref6.month,
|
||
|
|
index = _ref6.index;
|
||
|
|
return ['p-datepicker-month', {
|
||
|
|
'p-datepicker-month-selected': instance.isMonthSelected(index),
|
||
|
|
'p-disabled': props.disabled || !_month.selectable
|
||
|
|
}];
|
||
|
|
},
|
||
|
|
yearView: 'p-datepicker-year-view',
|
||
|
|
year: function year(_ref7) {
|
||
|
|
var instance = _ref7.instance,
|
||
|
|
props = _ref7.props,
|
||
|
|
_year = _ref7.year;
|
||
|
|
return ['p-datepicker-year', {
|
||
|
|
'p-datepicker-year-selected': instance.isYearSelected(_year.value),
|
||
|
|
'p-disabled': props.disabled || !_year.selectable
|
||
|
|
}];
|
||
|
|
},
|
||
|
|
timePicker: 'p-datepicker-time-picker',
|
||
|
|
hourPicker: 'p-datepicker-hour-picker',
|
||
|
|
pcIncrementButton: 'p-datepicker-increment-button',
|
||
|
|
pcDecrementButton: 'p-datepicker-decrement-button',
|
||
|
|
separator: 'p-datepicker-separator',
|
||
|
|
minutePicker: 'p-datepicker-minute-picker',
|
||
|
|
secondPicker: 'p-datepicker-second-picker',
|
||
|
|
ampmPicker: 'p-datepicker-ampm-picker',
|
||
|
|
buttonbar: 'p-datepicker-buttonbar',
|
||
|
|
pcTodayButton: 'p-datepicker-today-button',
|
||
|
|
pcClearButton: 'p-datepicker-clear-button'
|
||
|
|
};
|
||
|
|
var DatePickerStyle = BaseStyle.extend({
|
||
|
|
name: 'datepicker',
|
||
|
|
style: style,
|
||
|
|
classes: classes,
|
||
|
|
inlineStyles: inlineStyles
|
||
|
|
});
|
||
|
|
|
||
|
|
export { DatePickerStyle as default };
|
||
|
|
//# sourceMappingURL=index.mjs.map
|