devextreme
Version:
JavaScript/TypeScript Component Suite for Responsive Web Development
158 lines (156 loc) • 5.28 kB
JavaScript
/**
* DevExtreme (cjs/__internal/ui/date_box/m_date_box.strategy.date_view.js)
* Version: 26.1.3
* Build date: Wed Jun 10 2026
*
* Copyright (c) 2012 - 2026 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _message = _interopRequireDefault(require("../../../common/core/localization/message"));
var _renderer = _interopRequireDefault(require("../../../core/renderer"));
var _support = require("../../../core/utils/support");
var _window = require("../../../core/utils/window");
var _m_global_format_config = require("../../core/m_global_format_config");
var _date_utils = _interopRequireDefault(require("./date_utils"));
var _date_view = _interopRequireDefault(require("./date_view"));
var _m_date_box = _interopRequireDefault(require("./m_date_box.strategy"));
function _interopRequireDefault(e) {
return e && e.__esModule ? e : {
default: e
}
}
const window = (0, _window.getWindow)();
class DateViewStrategy extends _m_date_box.default {
constructor(dateBox) {
super(dateBox);
this.NAME = "DateView"
}
getWidget() {
return this._widget
}
getDefaultOptions() {
return Object.assign({}, super.getDefaultOptions(), {
openOnFieldClick: true,
applyButtonText: _message.default.format("OK"),
dropDownOptions: {
showTitle: true
}
})
}
getDisplayFormat(displayFormat) {
const {
type: type = "date"
} = this.dateBox.option();
const globalFormat = "date" === type || "datetime" === type ? (0, _m_global_format_config.getGlobalFormatByDataType)(type) : void 0;
return displayFormat || globalFormat || _date_utils.default.FORMATS_MAP[type]
}
popupConfig(config) {
return {
toolbarItems: this.dateBox._popupToolbarItemsConfig(),
onInitialized: config.onInitialized,
defaultOptionsRules: [{
device: {
platform: "android"
},
options: {
width: 333,
height: 331
}
}, {
device(device) {
const {
platform: platform
} = device;
return "generic" === platform || "ios" === platform
},
options: {
width: "auto",
height: "auto"
}
}, {
device(device) {
const {
platform: platform
} = device;
const {
phone: phone
} = device;
return "generic" === platform && Boolean(phone)
},
options: {
width: 333,
maxWidth: "100%",
maxHeight: "100%",
height: "auto",
position: {
collision: "flipfit flip"
}
}
}, {
device: {
platform: "ios",
phone: true
},
options: {
width: "100%",
position: {
my: "bottom",
at: "bottom",
of: window
}
}
}]
}
}
_renderWidget() {
const {
mode: mode,
readOnly: readOnly
} = this.dateBox.option();
if ((0, _support.inputType)(mode) && this.dateBox._isNativeType() || readOnly) {
if (this._widget) {
this._widget.$element().remove();
this._widget = null
}
return
}
const $popupContent = this._getPopupContent();
if (this._widget) {
this._widget.option(this._getWidgetOptions())
} else {
const element = (0, _renderer.default)("<div>").appendTo($popupContent);
this._widget = this._createWidget(element)
}
this._widget.$element().appendTo(this._getWidgetContainer())
}
_getWidgetName() {
return _date_view.default
}
renderOpenedState() {
super.renderOpenedState();
const widget = this.getWidget();
if (widget) {
widget.option("value", widget._getCurrentDate())
}
}
_getWidgetOptions() {
const {
type: type = "date"
} = this.dateBox.option();
return {
value: this.dateBoxValue() ?? new Date,
type: type,
minDate: this.dateBox.getDateOption("min") ?? new Date(1900, 0, 1),
maxDate: this.dateBox.getDateOption("max") ?? new Date(Date.now() + 50 * _date_utils.default.ONE_YEAR),
onDisposing: () => {
this._widget = null
}
}
}
}
var _default = exports.default = DateViewStrategy;