@progress/kendo-react-dateinputs 5.13.0-dev.202304180747 → 5.13.0-dev.202304200917

package/dist/es/dateinput/DateInput.d.ts

@@ -91,6 +91,10 @@ export interface DateInputProps<T extends DateInput = any> extends FormComponent
      * @default `solid`
      */
     fillMode?: null | 'solid' | 'flat' | 'outline';
+    /**
+     * Determines whether the DateInput is in its read-only state.
+     */
+    readonly?: boolean;
 }
 /** @hidden */
 export declare class DateInputWithoutContext extends React.Component<DateInputProps, {

package/dist/es/dateinput/DateInput.js

@@ -278,7 +278,7 @@ var DateInputWithoutContext = /** @class */ (function (_super) {
                     _b['k-required'] = _this.required,
                     _b['k-disabled'] = _this.props.disabled,
                     _b), _this.props.className), onFocus: onFocus, onBlur: onBlur },
-                React.createElement("input", { role: _this.props.ariaRole || 'textbox', tabIndex: _this.props.tabIndex, disabled: _this.props.disabled, title: _this.props.title !== undefined ? _this.props.title : currentText, type: "text", spellCheck: false, autoComplete: "off", autoCorrect: "off", className: "k-input-inner", id: inputId, "aria-label": _this.props.ariaLabel, "aria-labelledby": _this.props.ariaLabelledBy, "aria-describedby": _this.props.ariaDescribedBy, "aria-haspopup": _this.props.ariaHasPopup, "aria-disabled": _this.props.disabled, "aria-expanded": _this.props.ariaExpanded, "aria-controls": _this.props.ariaControls, onWheel: _this.wheel, onClick: _this.elementClick, onInput: _this.elementChange, onPaste: _this.handlePaste, onKeyDown: _this.elementKeyDown, onChange: noop, value: text, placeholder: placeholder, name: name, ref: function (input) { return _this._element = input; } }),
+                React.createElement("input", { role: _this.props.ariaRole || 'textbox', readOnly: _this.props.readonly, tabIndex: _this.props.tabIndex, disabled: _this.props.disabled, title: _this.props.title !== undefined ? _this.props.title : currentText, type: "text", spellCheck: false, autoComplete: "off", autoCorrect: "off", className: "k-input-inner", id: inputId, "aria-label": _this.props.ariaLabel, "aria-labelledby": _this.props.ariaLabelledBy, "aria-describedby": _this.props.ariaDescribedBy, "aria-haspopup": _this.props.ariaHasPopup, "aria-disabled": _this.props.disabled, "aria-expanded": _this.props.ariaExpanded, "aria-controls": _this.props.ariaControls, onWheel: _this.wheel, onClick: _this.elementClick, onInput: _this.elementChange, onPaste: _this.handlePaste, onKeyDown: _this.elementKeyDown, onChange: noop, value: text, placeholder: placeholder, name: name, ref: function (input) { return _this._element = input; } }),
                 _this.props.children,
                 _this.props.spinners && (React.createElement("span", { className: "k-input-spinner k-spin-button", onMouseDown: _this.spinnersMouseDown },
                     React.createElement(Button, { tabIndex: -1, type: "button", rounded: null, className: "k-spinner-increase", icon: 'caret-alt-up', svgIcon: caretAltUpIcon, "aria-label": localizationService.toLanguageString(increaseValue, messages[increaseValue]), title: localizationService.toLanguageString(increaseValue, messages[increaseValue]), onClick: _this.increasePart }),

package/dist/es/datepicker/DatePicker.js

@@ -107,6 +107,8 @@ var DatePickerWithoutContext = /** @class */ (function (_super) {
                 max: max,
                 weekNumber: weekNumber,
                 focusedDate: focusedDate,
+                className: _this.mobileMode ? 'k-calendar-lg' : '',
+                navigation: _this.mobileMode ? false : true,
                 onChange: _this.handleCalendarValueChange
             };
             if (_this.mobileMode) {
@@ -460,7 +462,7 @@ var DatePickerWithoutContext = /** @class */ (function (_super) {
         };
         var toggleButtonTitle = provideLocalizationService(this)
             .toLanguageString(toggleCalendar, messages[toggleCalendar]);
-        var datepicker = (React.createElement(AsyncFocusBlur, { onFocus: this.handleFocus, onBlur: this.handleBlur, onSyncBlur: this.props.onBlur, onSyncFocus: this.props.onFocus }, function (_a) {
+        var datepicker = (React.createElement(AsyncFocusBlur, { onFocus: this.handleFocus, onBlur: this.mobileMode ? undefined : this.handleBlur, onSyncBlur: this.props.onBlur, onSyncFocus: this.props.onFocus }, function (_a) {
             var _b;
             var onFocus = _a.onFocus, onBlur = _a.onBlur;
             return (React.createElement(React.Fragment, null,
@@ -471,8 +473,8 @@ var DatePickerWithoutContext = /** @class */ (function (_super) {
                         _b['k-invalid'] = !isValid,
                         _b['k-required'] = _this.required,
                         _b['k-disabled'] = _this.props.disabled,
-                        _b), className), onKeyDown: _this.handleKeyDown, style: { width: width }, onFocus: onFocus, onBlur: onBlur },
-                    React.createElement(_this.dateInputComp, __assign({ _ref: _this._dateInput, ariaRole: 'combobox', ariaExpanded: _this.show, ariaControls: _this._popupId }, dateInputProps)),
+                        _b), className), onKeyDown: _this.handleKeyDown, style: { width: width }, onFocus: onFocus, onBlur: onBlur, onClick: _this.mobileMode ? _this.handleIconClick : undefined },
+                    React.createElement(_this.dateInputComp, __assign({ _ref: _this._dateInput, ariaRole: 'combobox', readonly: _this.mobileMode, ariaExpanded: _this.show, ariaControls: _this._popupId }, dateInputProps)),
                     React.createElement(_this.toggleButtonComp, { type: "button", icon: "calendar", svgIcon: calendarIcon, title: toggleButtonTitle, className: "k-input-button", rounded: null, onClick: _this.handleIconClick, "aria-label": toggleButtonTitle, onMouseDown: _this.handleIconMouseDown }),
                     !renderAdaptive && _this.renderPopup()),
                 renderAdaptive && _this.renderAdaptivePopup()));

package/dist/es/daterangepicker/DateRangePicker.d.ts

@@ -122,9 +122,7 @@ export declare class DateRangePickerWithoutContext extends React.Component<DateR
             ariaRole: PropTypes.Requireable<string>;
             ariaHasPopup: PropTypes.Requireable<NonNullable<string | boolean | null | undefined>>;
             ariaExpanded: PropTypes.Requireable<NonNullable<boolean | null | undefined>>;
-            onChange: PropTypes.Requireable<(...args: any[]) => any>; /**
-             * Gets the wrapping element of the DateRangePicker.
-             */
+            onChange: PropTypes.Requireable<(...args: any[]) => any>;
             validationMessage: PropTypes.Requireable<string>;
             required: PropTypes.Requireable<boolean>;
             validate: PropTypes.Requireable<boolean>;

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-react-dateinputs',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1681802588,
+    publishDate: 1681980799,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
 };

package/dist/npm/dateinput/DateInput.d.ts

@@ -91,6 +91,10 @@ export interface DateInputProps<T extends DateInput = any> extends FormComponent
      * @default `solid`
      */
     fillMode?: null | 'solid' | 'flat' | 'outline';
+    /**
+     * Determines whether the DateInput is in its read-only state.
+     */
+    readonly?: boolean;
 }
 /** @hidden */
 export declare class DateInputWithoutContext extends React.Component<DateInputProps, {

package/dist/npm/dateinput/DateInput.js

@@ -281,7 +281,7 @@ var DateInputWithoutContext = /** @class */ (function (_super) {
                     _b['k-required'] = _this.required,
                     _b['k-disabled'] = _this.props.disabled,
                     _b), _this.props.className), onFocus: onFocus, onBlur: onBlur },
-                React.createElement("input", { role: _this.props.ariaRole || 'textbox', tabIndex: _this.props.tabIndex, disabled: _this.props.disabled, title: _this.props.title !== undefined ? _this.props.title : currentText, type: "text", spellCheck: false, autoComplete: "off", autoCorrect: "off", className: "k-input-inner", id: inputId, "aria-label": _this.props.ariaLabel, "aria-labelledby": _this.props.ariaLabelledBy, "aria-describedby": _this.props.ariaDescribedBy, "aria-haspopup": _this.props.ariaHasPopup, "aria-disabled": _this.props.disabled, "aria-expanded": _this.props.ariaExpanded, "aria-controls": _this.props.ariaControls, onWheel: _this.wheel, onClick: _this.elementClick, onInput: _this.elementChange, onPaste: _this.handlePaste, onKeyDown: _this.elementKeyDown, onChange: kendo_react_common_1.noop, value: text, placeholder: placeholder, name: name, ref: function (input) { return _this._element = input; } }),
+                React.createElement("input", { role: _this.props.ariaRole || 'textbox', readOnly: _this.props.readonly, tabIndex: _this.props.tabIndex, disabled: _this.props.disabled, title: _this.props.title !== undefined ? _this.props.title : currentText, type: "text", spellCheck: false, autoComplete: "off", autoCorrect: "off", className: "k-input-inner", id: inputId, "aria-label": _this.props.ariaLabel, "aria-labelledby": _this.props.ariaLabelledBy, "aria-describedby": _this.props.ariaDescribedBy, "aria-haspopup": _this.props.ariaHasPopup, "aria-disabled": _this.props.disabled, "aria-expanded": _this.props.ariaExpanded, "aria-controls": _this.props.ariaControls, onWheel: _this.wheel, onClick: _this.elementClick, onInput: _this.elementChange, onPaste: _this.handlePaste, onKeyDown: _this.elementKeyDown, onChange: kendo_react_common_1.noop, value: text, placeholder: placeholder, name: name, ref: function (input) { return _this._element = input; } }),
                 _this.props.children,
                 _this.props.spinners && (React.createElement("span", { className: "k-input-spinner k-spin-button", onMouseDown: _this.spinnersMouseDown },
                     React.createElement(kendo_react_buttons_1.Button, { tabIndex: -1, type: "button", rounded: null, className: "k-spinner-increase", icon: 'caret-alt-up', svgIcon: kendo_svg_icons_1.caretAltUpIcon, "aria-label": localizationService.toLanguageString(messages_1.increaseValue, messages_1.messages[messages_1.increaseValue]), title: localizationService.toLanguageString(messages_1.increaseValue, messages_1.messages[messages_1.increaseValue]), onClick: _this.increasePart }),

package/dist/npm/datepicker/DatePicker.js

@@ -110,6 +110,8 @@ var DatePickerWithoutContext = /** @class */ (function (_super) {
                 max: max,
                 weekNumber: weekNumber,
                 focusedDate: focusedDate,
+                className: _this.mobileMode ? 'k-calendar-lg' : '',
+                navigation: _this.mobileMode ? false : true,
                 onChange: _this.handleCalendarValueChange
             };
             if (_this.mobileMode) {
@@ -463,7 +465,7 @@ var DatePickerWithoutContext = /** @class */ (function (_super) {
         };
         var toggleButtonTitle = (0, kendo_react_intl_1.provideLocalizationService)(this)
             .toLanguageString(messages_1.toggleCalendar, messages_1.messages[messages_1.toggleCalendar]);
-        var datepicker = (React.createElement(kendo_react_common_1.AsyncFocusBlur, { onFocus: this.handleFocus, onBlur: this.handleBlur, onSyncBlur: this.props.onBlur, onSyncFocus: this.props.onFocus }, function (_a) {
+        var datepicker = (React.createElement(kendo_react_common_1.AsyncFocusBlur, { onFocus: this.handleFocus, onBlur: this.mobileMode ? undefined : this.handleBlur, onSyncBlur: this.props.onBlur, onSyncFocus: this.props.onFocus }, function (_a) {
             var _b;
             var onFocus = _a.onFocus, onBlur = _a.onBlur;
             return (React.createElement(React.Fragment, null,
@@ -474,8 +476,8 @@ var DatePickerWithoutContext = /** @class */ (function (_super) {
                         _b['k-invalid'] = !isValid,
                         _b['k-required'] = _this.required,
                         _b['k-disabled'] = _this.props.disabled,
-                        _b), className), onKeyDown: _this.handleKeyDown, style: { width: width }, onFocus: onFocus, onBlur: onBlur },
-                    React.createElement(_this.dateInputComp, __assign({ _ref: _this._dateInput, ariaRole: 'combobox', ariaExpanded: _this.show, ariaControls: _this._popupId }, dateInputProps)),
+                        _b), className), onKeyDown: _this.handleKeyDown, style: { width: width }, onFocus: onFocus, onBlur: onBlur, onClick: _this.mobileMode ? _this.handleIconClick : undefined },
+                    React.createElement(_this.dateInputComp, __assign({ _ref: _this._dateInput, ariaRole: 'combobox', readonly: _this.mobileMode, ariaExpanded: _this.show, ariaControls: _this._popupId }, dateInputProps)),
                     React.createElement(_this.toggleButtonComp, { type: "button", icon: "calendar", svgIcon: kendo_svg_icons_1.calendarIcon, title: toggleButtonTitle, className: "k-input-button", rounded: null, onClick: _this.handleIconClick, "aria-label": toggleButtonTitle, onMouseDown: _this.handleIconMouseDown }),
                     !renderAdaptive && _this.renderPopup()),
                 renderAdaptive && _this.renderAdaptivePopup()));

package/dist/npm/daterangepicker/DateRangePicker.d.ts

@@ -122,9 +122,7 @@ export declare class DateRangePickerWithoutContext extends React.Component<DateR
             ariaRole: PropTypes.Requireable<string>;
             ariaHasPopup: PropTypes.Requireable<NonNullable<string | boolean | null | undefined>>;
             ariaExpanded: PropTypes.Requireable<NonNullable<boolean | null | undefined>>;
-            onChange: PropTypes.Requireable<(...args: any[]) => any>; /**
-             * Gets the wrapping element of the DateRangePicker.
-             */
+            onChange: PropTypes.Requireable<(...args: any[]) => any>;
             validationMessage: PropTypes.Requireable<string>;
             required: PropTypes.Requireable<boolean>;
             validate: PropTypes.Requireable<boolean>;

package/dist/npm/package-metadata.js

@@ -8,7 +8,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-react-dateinputs',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1681802588,
+    publishDate: 1681980799,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
 };