@progress/kendo-react-dateinputs 15.1.1-develop.3 → 15.2.0-develop.2

package/timepicker/TimeSelector.mjs

@@ -5,24 +5,24 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as a from "react";
+import * as s from "react";
 import t from "prop-types";
-import { cloneDate as h } from "@progress/kendo-date-math";
-import { Keys as u, classNames as m, uTimePicker as x, uTime as g, getActiveElement as A } from "@progress/kendo-react-common";
-import { provideIntlService as K, provideLocalizationService as M, registerForIntl as R, registerForLocalization as F } from "@progress/kendo-react-intl";
+import { cloneDate as u } from "@progress/kendo-date-math";
+import { Keys as h, classNames as m, uTimePicker as x, uTime as f, getActiveElement as A } from "@progress/kendo-react-common";
+import { provideIntlService as K, provideLocalizationService as M, registerForIntl as F, registerForLocalization as R } from "@progress/kendo-react-intl";
 import { timePickerCancel as y, messages as B, timePickerSet as D } from "../messages/index.mjs";
 import { MIDNIGHT_DATE as L, MAX_TIME as j, MIN_TIME as z } from "../utils.mjs";
-import { getNow as w, valueMerger as V, generateGetters as G } from "./utils.mjs";
+import { getNow as g, valueMerger as V, generateGetters as G } from "./utils.mjs";
 import { TimePart as H } from "./TimePart.mjs";
 import { Button as O } from "@progress/kendo-react-buttons";
-const r = class r extends a.Component {
+const r = class r extends s.Component {
   constructor(i) {
     super(i), this._element = null, this._cancelButton = null, this._acceptButton = null, this.timePart = null, this.focusActiveList = () => {
       this.timePart && this.timePart.focus({ preventScroll: !0 });
     }, this.handleKeyDown = (e) => {
       const { keyCode: n } = e;
       switch (n) {
-        case u.enter:
+        case h.enter:
           this.hasActiveButton() || this.handleAccept(e);
           return;
         default:
@@ -30,14 +30,14 @@ const r = class r extends a.Component {
       }
     }, this.revertToNowButton = (e) => {
       const { keyCode: n, shiftKey: o } = e;
-      !o && n === u.tab && (e.preventDefault(), this.props.nowButton !== !1 ? this.timePart && this.timePart.focus({ preventScroll: !0 }, !0) : this.timePart && this.timePart.focus({ preventScroll: !0 }));
+      !o && n === h.tab && (e.preventDefault(), this.props.nowButton !== !1 ? this.timePart && this.timePart.focus({ preventScroll: !0 }, !0) : this.timePart && this.timePart.focus({ preventScroll: !0 }));
     }, this.handleNowKeyDown = (e) => {
       var c;
       const { keyCode: n, shiftKey: o } = e;
-      o && n === u.tab ? (e.preventDefault(), this._acceptButton && ((c = this._acceptButton.element) == null || c.focus({ preventScroll: !0 }))) : n === u.enter && (e.stopPropagation(), this.handleNowClick(e));
+      o && n === h.tab ? (e.preventDefault(), this._acceptButton && ((c = this._acceptButton.element) == null || c.focus({ preventScroll: !0 }))) : n === h.enter && (e.stopPropagation(), this.handleNowClick(e));
     }, this.handleAccept = (e) => {
       const n = this.mergeValue(
-        h(this.value || w()),
+        u(this.value || g()),
         this.timePart ? this.timePart.value : this.current
       );
       this.setState({ value: n }), this.valueDuringOnChange = n;
@@ -53,7 +53,7 @@ const r = class r extends a.Component {
       const { onReject: n } = this.props;
       n && n.call(void 0, e);
     }, this.handleNowClick = (e) => {
-      const n = this.mergeValue(h(this.value || w()), w());
+      const n = this.mergeValue(u(this.value || g()), g());
       this.setState({
         current: n,
         value: n
@@ -84,13 +84,13 @@ const r = class r extends a.Component {
   }
   get value() {
     const i = this.valueDuringOnChange !== void 0 ? this.valueDuringOnChange : this.props.value !== void 0 ? this.props.value : this.state.value;
-    return i !== null ? h(i) : null;
+    return i !== null ? u(i) : null;
   }
   get intl() {
     return K(this);
   }
   get current() {
-    return this.state.current !== null ? h(this.state.current) : null;
+    return this.state.current !== null ? u(this.state.current) : null;
   }
   /**
    * @hidden
@@ -110,36 +110,38 @@ const r = class r extends a.Component {
       className: c,
       smoothScroll: P,
       min: N,
-      max: k,
-      boundRange: T,
+      max: T,
+      boundRange: k,
       nowButton: E,
       steps: S,
       show: _,
-      mobileMode: b,
+      mobileMode: v,
       unstyled: l
-    } = this.props, I = l && l.uTimePicker, d = l && l.uTime, C = M(this), f = C.toLanguageString(y, B[y]), v = C.toLanguageString(D, B[D]);
-    return /* @__PURE__ */ a.createElement(
+    } = this.props, I = l && l.uTimePicker, d = l && l.uTime, w = M(this), C = w.toLanguageString(y, B[y]), b = w.toLanguageString(D, B[D]);
+    return /* @__PURE__ */ s.createElement(s.Fragment, null, /* @__PURE__ */ s.createElement(
       "div",
       {
-        ref: (s) => {
-          this._element = s;
+        ref: (a) => {
+          this._element = a;
         },
         tabIndex: n ? void 0 : o || 0,
         className: m(
           x.timeSelector({
             c: I,
-            mobileMode: b,
+            mobileMode: v,
             disabled: n
           }),
           c
         ),
+        role: "group",
+        "aria-label": "Time selector",
         onKeyDown: this.handleKeyDown
       },
-      /* @__PURE__ */ a.createElement(
+      /* @__PURE__ */ s.createElement(
         H,
         {
-          ref: (s) => {
-            this.timePart = s;
+          ref: (a) => {
+            this.timePart = a;
           },
           value: this.current,
           onChange: this.handleChange,
@@ -147,47 +149,44 @@ const r = class r extends a.Component {
           format: i,
           smoothScroll: P,
           min: N,
-          max: k,
-          boundRange: T,
+          max: T,
+          boundRange: k,
           disabled: n,
           nowButton: E,
           steps: S,
           show: _,
-          mobileMode: b,
+          mobileMode: v,
           onNowKeyDown: this.handleNowKeyDown,
           unstyled: l
         }
-      ),
-      this.props.footer && /* @__PURE__ */ a.createElement("div", { className: m(g.footer({ c: d })) }, e && /* @__PURE__ */ a.createElement(
-        O,
-        {
-          type: "button",
-          ref: (s) => {
-            this._cancelButton = s;
-          },
-          className: m(g.cancel({ c: d })),
-          onClick: this.handleReject,
-          title: f,
-          "aria-label": f
+      )
+    ), this.props.footer && /* @__PURE__ */ s.createElement("div", { className: m(f.footer({ c: d })) }, e && /* @__PURE__ */ s.createElement(
+      O,
+      {
+        type: "button",
+        ref: (a) => {
+          this._cancelButton = a;
         },
-        f
-      ), /* @__PURE__ */ a.createElement(
-        O,
-        {
-          type: "button",
-          ref: (s) => {
-            this._acceptButton = s;
-          },
-          className: m(g.accept({ c: d })),
-          themeColor: "primary",
-          onClick: this.handleAccept,
-          onKeyDown: this.revertToNowButton,
-          title: v,
-          "aria-label": v
+        className: m(f.cancel({ c: d })),
+        onClick: this.handleReject,
+        title: C
+      },
+      C
+    ), /* @__PURE__ */ s.createElement(
+      O,
+      {
+        type: "button",
+        ref: (a) => {
+          this._acceptButton = a;
         },
-        v
-      ))
-    );
+        className: m(f.accept({ c: d })),
+        themeColor: "primary",
+        onClick: this.handleAccept,
+        onKeyDown: this.revertToNowButton,
+        title: b
+      },
+      b
+    )));
   }
   nextTick(i) {
     clearTimeout(this.nextTickId), this.nextTickId = window.setTimeout(() => i());
@@ -246,8 +245,8 @@ r.propTypes = {
   footer: !0
 };
 let p = r;
-R(p);
 F(p);
+R(p);
 export {
   p as TimeSelector
 };

package/timepicker/models/TimePickerSettings.d.ts

@@ -65,6 +65,13 @@ export interface TimePickerSettings {
      * This property is related to accessibility.
      */
     ariaLabelledBy?: string;
+    /**
+     * The accessible label of the component.
+     *
+     * @remarks
+     * This property is related to accessibility.
+     */
+    ariaLabel?: string;
     /**
      * Specifies the greatest valid time ([see example](https://www.telerik.com/kendo-react-ui/components/dateinputs/timepicker/time-ranges)).
      */