@progress/kendo-react-layout 9.5.0 → 10.0.0-develop.2

package/splitter/Splitter.mjs

@@ -5,51 +5,51 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as S from "react";
+import * as u from "react";
 import { SplitterPane as T } from "./SplitterPane.mjs";
-import { SplitterBar as b } from "./SplitterBar.mjs";
-import { validatePackage as B, classNames as N } from "@progress/kendo-react-common";
-import { packageMetadata as R } from "../package-metadata.mjs";
-import { splitBarLabel as O, messages as w } from "./messages/index.mjs";
-import { provideLocalizationService as _ } from "@progress/kendo-react-intl";
-const k = {
+import { SplitterBar as w } from "./SplitterBar.mjs";
+import { validatePackage as b, classNames as k, WatermarkOverlay as B } from "@progress/kendo-react-common";
+import { packageMetadata as N } from "../package-metadata.mjs";
+import { splitBarLabel as O, messages as R } from "./messages/index.mjs";
+import { provideLocalizationService as L } from "@progress/kendo-react-intl";
+const _ = {
   collapsible: !1,
   collapsed: !1,
   resizable: !0,
   scrollable: !0
-}, K = 150, D = class D extends S.Component {
+}, K = 150, D = class D extends u.Component {
   /**
    * @hidden
    */
-  constructor(s) {
-    super(s), this._container = null, this.validatePanes = (t) => {
+  constructor(n) {
+    super(n), this.showLicenseWatermark = !1, this._container = null, this.validatePanes = (t) => {
       if (!t.filter((i) => i.size === void 0).length)
         throw new Error("The Splitter should have at least one pane without a set size.");
     }, this.mapPaneOptions = (t, e) => {
       const i = this.orientation, { dragIndex: r, isDragging: a } = this.state, l = [];
-      for (let n = 0; n < e.length; n++) {
+      for (let s = 0; s < e.length; s++) {
         let o = !1;
-        const p = e[n];
-        S.isValidElement(p) && (o = p.type.displayName === "Splitter");
+        const p = e[s];
+        u.isValidElement(p) && (o = p.type.displayName === "Splitter");
         let h = !1;
-        a && r !== void 0 && (h = r === n || r + 1 === n), l.push({
-          ...k,
+        a && r !== void 0 && (h = r === s || r + 1 === s), l.push({
+          ..._,
           orientation: i,
           containsSplitter: o,
           overlay: h,
-          ...(t || [])[n]
+          ...(t || [])[s]
         });
       }
       return l;
     }, this.mapSplitterPanes = (t, e) => {
-      const i = _(this).toLanguageString(O, w[O]);
+      const i = L(this).toLanguageString(O, R[O]);
       return t.map((r, a) => {
         let l;
-        const n = a * 2, o = n + 1;
+        const s = a * 2, o = s + 1;
         if (a + 1 < t.length) {
           const h = t[a + 1];
-          l = /* @__PURE__ */ S.createElement(
-            b,
+          l = /* @__PURE__ */ u.createElement(
+            w,
             {
               key: o,
               index: a,
@@ -64,16 +64,16 @@ const k = {
             }
           );
         }
-        return [/* @__PURE__ */ S.createElement(T, { key: n, ...r }, e[a]), l];
+        return [/* @__PURE__ */ u.createElement(T, { key: s, ...r }, e[a]), l];
       });
     }, this.onBarToggle = (t, e) => {
       const r = this.panesOptions(this.panesContent).map((a, l) => {
-        const n = this.getPaneProps(a);
+        const s = this.getPaneProps(a);
         return l === t ? {
-          ...n,
+          ...s,
           collapsed: !a.collapsed
         } : {
-          ...n
+          ...s
         };
       });
       this.props.onChange && this.props.onChange({
@@ -82,7 +82,7 @@ const k = {
         nativeEvent: e
       });
     }, this.onBarDragResize = (t, e, i, r, a) => {
-      const l = (/* @__PURE__ */ new Date()).getTime(), { pageX: n, pageY: o } = t, { prevElement: p, nextElement: h } = this.surroudingPanes(e);
+      const l = (/* @__PURE__ */ new Date()).getTime(), { pageX: s, pageY: o } = t, { prevElement: p, nextElement: h } = this.surroudingPanes(e);
       if (!p || !h)
         return;
       if (r) {
@@ -90,27 +90,27 @@ const k = {
           isDragging: !0,
           dragIndex: i,
           startTime: l,
-          originalX: n,
+          originalX: s,
           originalY: o,
           originalPrevSize: this.elementSize(p),
           originalNextSize: this.elementSize(h)
         });
         return;
       }
-      const { originalPrevSize: d, originalNextSize: g, startTime: P, originalX: f, originalY: u } = this.state;
-      if (!r && l - P < K) {
+      const { originalPrevSize: d, originalNextSize: c, startTime: v, originalX: f, originalY: S } = this.state;
+      if (!r && l - v < K) {
         a && this.resetDragState();
         return;
       }
-      let c;
-      this.orientation === "vertical" ? c = o - u : this.isRtl ? c = f - n : c = n - f, this.resize(i, i + 1, d, g, c, a, t), a && this.resetDragState();
+      let g;
+      this.orientation === "vertical" ? g = o - S : this.isRtl ? g = f - s : g = s - f, this.resize(i, i + 1, d, c, g, a, t), a && this.resetDragState();
     }, this.onBarKeyboardResize = (t, e, i, r) => {
-      const { prevElement: a, nextElement: l } = this.surroudingPanes(t), n = this.elementSize(a), o = this.elementSize(l);
-      this.resize(e, e + 1, n, o, i, !0, r);
+      const { prevElement: a, nextElement: l } = this.surroudingPanes(t), s = this.elementSize(a), o = this.elementSize(l);
+      this.resize(e, e + 1, s, o, i, !0, r);
     }, this.containerSize = () => this._container ? this.elementSize(this._container, !0) : 0, this.panesOptions = (t) => this.mapPaneOptions(this.panes, t), this.elementSize = (t, e) => {
       const i = e ? "client" : "offset";
       return this.orientation === "vertical" ? t[`${i}Height`] : t[`${i}Width`];
-    }, this.clamp = (t, e, i) => Math.min(e, Math.max(t, i)), this.fixedSize = (t) => t && t.length > 0, B(R), this.state = {
+    }, this.clamp = (t, e, i) => Math.min(e, Math.max(t, i)), this.fixedSize = (t) => t && t.length > 0, this.showLicenseWatermark = !b(N, { component: "Splitter" }), this.state = {
       isDragging: !1,
       dragIndex: void 0,
       startTime: 0,
@@ -118,7 +118,7 @@ const k = {
       originalY: 0,
       originalPrevSize: 0,
       originalNextSize: 0,
-      panes: s.defaultPanes || []
+      panes: n.defaultPanes || []
     };
   }
   get isControlledState() {
@@ -134,19 +134,19 @@ const k = {
     return this._container && getComputedStyle(this._container).direction === "rtl" || !1;
   }
   get panesContent() {
-    return S.Children.toArray(this.props.children).filter((s) => s);
+    return u.Children.toArray(this.props.children).filter((n) => n);
   }
   /**
    * @hidden
    */
   render() {
-    const s = this.panesContent, t = this.panesOptions(s), e = N(
+    const n = this.panesContent, t = this.panesOptions(n), e = k(
       "k-splitter",
       "k-splitter-flex",
       `k-splitter-${this.orientation}`,
       this.props.className
     );
-    return this.validatePanes(t), /* @__PURE__ */ S.createElement(
+    return this.validatePanes(t), /* @__PURE__ */ u.createElement(
       "div",
       {
         id: this.props.id,
@@ -154,21 +154,22 @@ const k = {
         ref: (i) => this._container = i,
         className: e
       },
-      this.mapSplitterPanes(t, s)
+      this.mapSplitterPanes(t, n),
+      this.showLicenseWatermark && /* @__PURE__ */ u.createElement(B, null)
     );
   }
-  surroudingPanes(s) {
+  surroudingPanes(n) {
     return {
-      prevElement: s.previousElementSibling,
-      nextElement: s.nextElementSibling
+      prevElement: n.previousElementSibling,
+      nextElement: n.nextElementSibling
     };
   }
-  isPercent(s) {
-    return /%$/.test(s);
+  isPercent(n) {
+    return /%$/.test(n);
   }
-  toPixels(s, t) {
-    let e = parseInt(s, 10);
-    return this.isPercent(s) && (e = t * e / 100), e;
+  toPixels(n, t) {
+    let e = parseInt(n, 10);
+    return this.isPercent(n) && (e = t * e / 100), e;
   }
   resetDragState() {
     this.setState({
@@ -181,29 +182,29 @@ const k = {
       originalNextSize: 0
     });
   }
-  resize(s, t, e, i, r, a, l) {
-    const n = this.panesOptions(this.panesContent), o = n[s], p = n[t], h = e + i, d = this.containerSize(), g = (m) => this.toPixels(m, d), P = {
-      index: s,
+  resize(n, t, e, i, r, a, l) {
+    const s = this.panesOptions(this.panesContent), o = s[n], p = s[t], h = e + i, d = this.containerSize(), c = (m) => this.toPixels(m, d), v = {
+      index: n,
       initialSize: e,
-      min: g(o.min) || h - g(p.max) || 0,
-      max: g(o.max) || h - g(p.min) || h
+      min: c(o.min) || h - c(p.max) || 0,
+      max: c(o.max) || h - c(p.min) || h
     }, f = {
       index: t,
       initialSize: i,
-      min: g(p.min) || h - g(o.max) || 0,
-      max: g(p.max) || h - g(o.min) || h
-    }, u = (m, v) => {
-      const z = n[m.index], E = this.clamp(m.min, m.max, m.initialSize + v);
+      min: c(p.min) || h - c(o.max) || 0,
+      max: c(p.max) || h - c(o.min) || h
+    }, S = (m, P) => {
+      const z = s[m.index], E = this.clamp(m.min, m.max, m.initialSize + P);
       return this.isPercent(z.size || "") ? 100 * E / d + "%" : E + "px";
     };
-    let c, x;
-    this.fixedSize(o.size) && this.fixedSize(p.size) ? (c = u(P, r), x = u(f, -r)) : p.collapsible || this.fixedSize(p.size) ? x = u(f, -r) : c = u(P, r);
-    const C = n.map((m, v) => {
+    let g, x;
+    this.fixedSize(o.size) && this.fixedSize(p.size) ? (g = S(v, r), x = S(f, -r)) : p.collapsible || this.fixedSize(p.size) ? x = S(f, -r) : g = S(v, r);
+    const C = s.map((m, P) => {
       const z = this.getPaneProps(m);
-      return v === s ? {
+      return P === n ? {
         ...z,
-        size: c
-      } : v === t ? {
+        size: g
+      } : P === t ? {
         ...z,
         size: x
       } : {
@@ -218,8 +219,8 @@ const k = {
       nativeEvent: l
     }), this.panesDuringOnChange = void 0;
   }
-  getPaneProps(s) {
-    const { orientation: t, overlay: e, containsSplitter: i, ...r } = s;
+  getPaneProps(n) {
+    const { orientation: t, overlay: e, containsSplitter: i, ...r } = n;
     return r;
   }
 };

package/stacklayout/StackLayout.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const j=require("react"),n=require("prop-types"),O=require("../package-metadata.js"),u=require("@progress/kendo-react-common");function z(t){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const c in t)if(c!=="default"){const s=Object.getOwnPropertyDescriptor(t,c);Object.defineProperty(r,c,s.get?s:{enumerable:!0,get:()=>t[c]})}}return r.default=t,Object.freeze(r)}const i=z(j),d=i.forwardRef((t,r)=>{u.validatePackage(O.packageMetadata);const c=i.useRef(null),s=i.useCallback(()=>({element:c.current}),[]);i.useImperativeHandle(r,s);const{className:m,style:y,id:f,children:k}=t,h=u.useId(),l=i.useMemo(()=>t.orientation||g.orientation,[t.orientation]),e=l==="horizontal",a=i.useMemo(()=>t.align&&t.align.horizontal?t.align.horizontal:g.hAlign,[t.align]),o=i.useMemo(()=>t.align&&t.align.vertical?t.align.vertical:g.vAlign,[t.align]),b=i.useMemo(()=>u.classNames("k-stack-layout",{"k-hstack":l==="horizontal","k-vstack":l==="vertical","k-justify-content-start":e&&a==="start"||!e&&o==="top","k-justify-content-center":e&&a==="center"||!e&&o==="middle","k-justify-content-end":e&&a==="end"||!e&&o==="bottom","k-justify-content-stretch":e&&a==="stretch"||!e&&o==="stretch","k-align-items-start":!e&&a==="start"||e&&o==="top","k-align-items-center":!e&&a==="center"||e&&o==="middle","k-align-items-end":!e&&a==="end"||e&&o==="bottom","k-align-items-stretch":!e&&a==="stretch"||e&&o==="stretch"},m),[l,e,a,o,m]),v={gap:`${typeof t.gap=="number"?t.gap+"px":t.gap}`,...y};return i.createElement("div",{ref:c,className:b,style:v,id:f||h},k)}),g={orientation:"horizontal",hAlign:"stretch",vAlign:"stretch"};d.propTypes={className:n.string,style:n.object,children:n.any,id:n.string,orientation:n.oneOf(["horizontal","vertical"]),gap:n.oneOfType([n.string,n.number]),align:n.shape({vertical:n.oneOf(["top","middle","bottom","stretch"]),horizontal:n.oneOf(["start","center","end","stretch"])})};d.displayName="KendoReactStackLayout";exports.StackLayout=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const j=require("react"),n=require("prop-types"),m=require("@progress/kendo-react-common");function O(t){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const c in t)if(c!=="default"){const l=Object.getOwnPropertyDescriptor(t,c);Object.defineProperty(s,c,l.get?l:{enumerable:!0,get:()=>t[c]})}}return s.default=t,Object.freeze(s)}const i=O(j),g=i.forwardRef((t,s)=>{const c=i.useRef(null),l=i.useCallback(()=>({element:c.current}),[]);i.useImperativeHandle(s,l);const{className:d,style:y,id:f,children:h}=t,k=m.useId(),r=i.useMemo(()=>t.orientation||u.orientation,[t.orientation]),e=r==="horizontal",a=i.useMemo(()=>t.align&&t.align.horizontal?t.align.horizontal:u.hAlign,[t.align]),o=i.useMemo(()=>t.align&&t.align.vertical?t.align.vertical:u.vAlign,[t.align]),b=i.useMemo(()=>m.classNames("k-stack-layout",{"k-hstack":r==="horizontal","k-vstack":r==="vertical","k-justify-content-start":e&&a==="start"||!e&&o==="top","k-justify-content-center":e&&a==="center"||!e&&o==="middle","k-justify-content-end":e&&a==="end"||!e&&o==="bottom","k-justify-content-stretch":e&&a==="stretch"||!e&&o==="stretch","k-align-items-start":!e&&a==="start"||e&&o==="top","k-align-items-center":!e&&a==="center"||e&&o==="middle","k-align-items-end":!e&&a==="end"||e&&o==="bottom","k-align-items-stretch":!e&&a==="stretch"||e&&o==="stretch"},d),[r,e,a,o,d]),v={gap:`${typeof t.gap=="number"?t.gap+"px":t.gap}`,...y};return i.createElement("div",{ref:c,className:b,style:v,id:f||k},h)}),u={orientation:"horizontal",hAlign:"stretch",vAlign:"stretch"};g.propTypes={className:n.string,style:n.object,children:n.any,id:n.string,orientation:n.oneOf(["horizontal","vertical"]),gap:n.oneOfType([n.string,n.number]),align:n.shape({vertical:n.oneOf(["top","middle","bottom","stretch"]),horizontal:n.oneOf(["start","center","end","stretch"])})};g.displayName="KendoReactStackLayout";exports.StackLayout=g;

package/stacklayout/StackLayout.mjs

@@ -7,10 +7,8 @@
  */
 import * as o from "react";
 import n from "prop-types";
-import { packageMetadata as z } from "../package-metadata.mjs";
-import { validatePackage as b, useId as A, classNames as j } from "@progress/kendo-react-common";
+import { useId as z, classNames as b } from "@progress/kendo-react-common";
 const m = o.forwardRef((e, g) => {
-  b(z);
   const c = o.useRef(null), d = o.useCallback(
     () => ({
       element: c.current
@@ -18,14 +16,14 @@ const m = o.forwardRef((e, g) => {
     []
   );
   o.useImperativeHandle(g, d);
-  const { className: r, style: h, id: u, children: k } = e, y = A(), s = o.useMemo(() => e.orientation || l.orientation, [e.orientation]), t = s === "horizontal", a = o.useMemo(
+  const { className: r, style: h, id: u, children: y } = e, k = z(), s = o.useMemo(() => e.orientation || l.orientation, [e.orientation]), t = s === "horizontal", a = o.useMemo(
     () => e.align && e.align.horizontal ? e.align.horizontal : l.hAlign,
     [e.align]
   ), i = o.useMemo(
     () => e.align && e.align.vertical ? e.align.vertical : l.vAlign,
     [e.align]
   ), f = o.useMemo(
-    () => j(
+    () => b(
       "k-stack-layout",
       {
         "k-hstack": s === "horizontal",
@@ -46,7 +44,7 @@ const m = o.forwardRef((e, g) => {
     gap: `${typeof e.gap == "number" ? e.gap + "px" : e.gap}`,
     ...h
   };
-  return /* @__PURE__ */ o.createElement("div", { ref: c, className: f, style: v, id: u || y }, k);
+  return /* @__PURE__ */ o.createElement("div", { ref: c, className: f, style: v, id: u || k }, y);
 }), l = {
   orientation: "horizontal",
   hAlign: "stretch",

package/stepper/Stepper.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const te=require("react"),o=require("prop-types"),ne=require("./context/StepperContext.js"),d=require("@progress/kendo-react-common"),se=require("./Step.js"),oe=require("@progress/kendo-react-progressbars"),z=require("./contants.js"),re=require("../package-metadata.js"),ae=require("@progress/kendo-react-intl"),O=require("./messages/index.js");function ie(m){const k=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(m){for(const p in m)if(p!=="default"){const h=Object.getOwnPropertyDescriptor(m,p);Object.defineProperty(k,p,h.get?h:{enumerable:!0,get:()=>m[p]})}}return k.default=m,Object.freeze(k)}const e=ie(te),T=e.forwardRef((m,k)=>{d.validatePackage(re.packageMetadata);const{animationDuration:p,children:h,className:D,disabled:g,errorIcon:V,errorSVGIcon:j,item:P,items:b,linear:y,mode:_,orientation:S,selectOnFocus:E,style:w,successIcon:K,successSVGIcon:G,value:i=0,onChange:C,onFocus:N}=m,B=ae.useLocalization().toLanguageString(O.progBarAriaLabel,O.messages[O.progBarAriaLabel]),v=e.useRef(null),M=e.useCallback(()=>{v.current&&d.focusFirstFocusableChild(v.current)},[]),x=e.useCallback(()=>({element:v.current,focus:M}),[M]);e.useImperativeHandle(k,x);const[H,u]=e.useState(i),f=b?b.length:0,s=S==="vertical",R=d.useDir(v,m.dir),U=typeof p=="number"?p:p!==!1?z.DEFAULT_ANIMATION_DURATION:z.NO_ANIMATION;e.useEffect(()=>{u(i)},[i]);const q=e.useCallback((a,r)=>{const t=r===i-1,n=r===i,c=r===i+1;i!==r&&C&&!g&&(!y||t||n||c)&&(d.dispatchEvent(C,a,x(),{value:r}),u(r))},[i,y,C,g,u]),J=e.useCallback(a=>{const r=a.value,t=a.syntheticEvent;q(t,r)},[q]),Q=e.useCallback(a=>{N&&!g&&d.dispatchEvent(N,a.syntheticEvent,x(),void 0)},[N,g]),I=e.useMemo(()=>{const a=R==="rtl",r=b.length-1;return new d.Navigation({root:v,selectors:["ol.k-step-list li.k-step a.k-step-link"],tabIndex:0,keyboardEvents:{keydown:{Tab:(t,n,c)=>{c.preventDefault();const l=n.elements.indexOf(t),L=n.previous(t).children[0],A=n.next(t).children[0];c.shiftKey?!a&&l>0?(n.focusPrevious(t),u(l-1),E&&L.click()):a&&l<r&&(n.focusNext(t),u(l+1),E&&A.click()):!a&&l<r?(n.focusNext(t),u(l+1),E&&A.click()):a&&l>0&&(n.focusPrevious(t),u(l-1),E&&L.click())},Home:(t,n,c)=>{c.preventDefault(),n.focusElement(n.first,t),u(0)},End:(t,n,c)=>{c.preventDefault(),n.focusElement(n.last,t),u(r)},Space:(t,n,c)=>{c.preventDefault(),t.children[0].click()},Enter:(t,n,c)=>{c.preventDefault(),t.children[0].click()}}}})},[R,b.length,u,E]);e.useEffect(()=>(I.initializeRovingTab(i),()=>I.removeFocusListener()),[]);const W=e.useCallback(I.triggerKeyboardEvent.bind(I),[]),X=e.useMemo(()=>d.classNames("k-stepper",{"k-stepper-linear":y},D),[y,D]),Y=e.useMemo(()=>({display:"grid",gridTemplateColumns:s?void 0:"repeat("+f*2+", 1fr)",gridTemplateRows:s?"repeat("+f+", 1fr)":void 0,...w}),[s,f,w]),Z=e.useMemo(()=>d.classNames("k-step-list",{"k-step-list-horizontal":!s,"k-step-list-vertical":s}),[s]),$=e.useMemo(()=>({gridColumnStart:s?void 0:1,gridColumnEnd:s?void 0:-1,gridRowStart:s?1:void 0,gridRowEnd:s?-1:void 0}),[s]),ee=e.useMemo(()=>({gridColumnStart:s?void 0:2,gridColumnEnd:s?void 0:f*2,gridRowStart:s?1:void 0,gridRowEnd:s?f:void 0,top:s?17:void 0}),[s,f]),F=b&&b.map((a,r)=>{const t={index:r,disabled:g||a.disabled,focused:r===H,current:r===i,...a},n=P||se.Step;return e.createElement(n,{key:r,...t})});return e.createElement(ne.StepperContext.Provider,{value:{animationDuration:p,isVertical:s,item:P,linear:y,mode:_,numOfSteps:f,value:i,successIcon:K,successSVGIcon:G,errorIcon:V,errorSVGIcon:j,onChange:J,onFocus:Q}},e.createElement("nav",{className:X,style:Y,dir:R,role:"navigation",ref:v,onKeyDown:W},e.createElement("ol",{className:Z,style:$},F||h),e.createElement(oe.ProgressBar,{style:ee,labelPlacement:"start",animation:{duration:U},ariaLabel:B,"aria-hidden":!0,max:f-1,labelVisible:!1,orientation:S,reverse:S==="vertical",value:i,disabled:g,tabIndex:-1})))});T.propTypes={animationDuration:o.oneOfType([o.bool,o.number]),children:o.any,className:o.string,dir:o.string,disabled:o.bool,errorIcon:o.string,errorSVGIcon:d.svgIconPropType,item:o.any,items:o.any,linear:o.bool,mode:o.oneOf(["steps","labels"]),orientation:o.oneOf(["horizontal","vertical"]),style:o.object,successIcon:o.string,successSVGIcon:d.svgIconPropType,value:o.number.isRequired,onChange:o.func,onFocus:o.func};T.displayName="KendoStepper";exports.Stepper=T;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const te=require("react"),o=require("prop-types"),ne=require("./context/StepperContext.js"),p=require("@progress/kendo-react-common"),se=require("./Step.js"),oe=require("@progress/kendo-react-progressbars"),z=require("./contants.js"),re=require("@progress/kendo-react-intl"),O=require("./messages/index.js");function ie(m){const k=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(m){for(const d in m)if(d!=="default"){const h=Object.getOwnPropertyDescriptor(m,d);Object.defineProperty(k,d,h.get?h:{enumerable:!0,get:()=>m[d]})}}return k.default=m,Object.freeze(k)}const e=ie(te),T=e.forwardRef((m,k)=>{const{animationDuration:d,children:h,className:D,disabled:g,errorIcon:V,errorSVGIcon:j,item:w,items:b,linear:y,mode:_,orientation:S,selectOnFocus:E,style:P,successIcon:K,successSVGIcon:G,value:c=0,onChange:C,onFocus:N}=m,B=re.useLocalization().toLanguageString(O.progBarAriaLabel,O.messages[O.progBarAriaLabel]),v=e.useRef(null),q=e.useCallback(()=>{v.current&&p.focusFirstFocusableChild(v.current)},[]),x=e.useCallback(()=>({element:v.current,focus:q}),[q]);e.useImperativeHandle(k,x);const[H,u]=e.useState(c),f=b?b.length:0,s=S==="vertical",R=p.useDir(v,m.dir),U=typeof d=="number"?d:d!==!1?z.DEFAULT_ANIMATION_DURATION:z.NO_ANIMATION;e.useEffect(()=>{u(c)},[c]);const F=e.useCallback((i,r)=>{const t=r===c-1,n=r===c,a=r===c+1;c!==r&&C&&!g&&(!y||t||n||a)&&(p.dispatchEvent(C,i,x(),{value:r}),u(r))},[c,y,C,g,u]),J=e.useCallback(i=>{const r=i.value,t=i.syntheticEvent;F(t,r)},[F]),Q=e.useCallback(i=>{N&&!g&&p.dispatchEvent(N,i.syntheticEvent,x(),void 0)},[N,g]),I=e.useMemo(()=>{const i=R==="rtl",r=b.length-1;return new p.Navigation({root:v,selectors:["ol.k-step-list li.k-step a.k-step-link"],tabIndex:0,keyboardEvents:{keydown:{Tab:(t,n,a)=>{a.preventDefault();const l=n.elements.indexOf(t),M=n.previous(t).children[0],A=n.next(t).children[0];a.shiftKey?!i&&l>0?(n.focusPrevious(t),u(l-1),E&&M.click()):i&&l<r&&(n.focusNext(t),u(l+1),E&&A.click()):!i&&l<r?(n.focusNext(t),u(l+1),E&&A.click()):i&&l>0&&(n.focusPrevious(t),u(l-1),E&&M.click())},Home:(t,n,a)=>{a.preventDefault(),n.focusElement(n.first,t),u(0)},End:(t,n,a)=>{a.preventDefault(),n.focusElement(n.last,t),u(r)},Space:(t,n,a)=>{a.preventDefault(),t.children[0].click()},Enter:(t,n,a)=>{a.preventDefault(),t.children[0].click()}}}})},[R,b.length,u,E]);e.useEffect(()=>(I.initializeRovingTab(c),()=>I.removeFocusListener()),[]);const W=e.useCallback(I.triggerKeyboardEvent.bind(I),[]),X=e.useMemo(()=>p.classNames("k-stepper",{"k-stepper-linear":y},D),[y,D]),Y=e.useMemo(()=>({display:"grid",gridTemplateColumns:s?void 0:"repeat("+f*2+", 1fr)",gridTemplateRows:s?"repeat("+f+", 1fr)":void 0,...P}),[s,f,P]),Z=e.useMemo(()=>p.classNames("k-step-list",{"k-step-list-horizontal":!s,"k-step-list-vertical":s}),[s]),$=e.useMemo(()=>({gridColumnStart:s?void 0:1,gridColumnEnd:s?void 0:-1,gridRowStart:s?1:void 0,gridRowEnd:s?-1:void 0}),[s]),ee=e.useMemo(()=>({gridColumnStart:s?void 0:2,gridColumnEnd:s?void 0:f*2,gridRowStart:s?1:void 0,gridRowEnd:s?f:void 0,top:s?17:void 0}),[s,f]),L=b&&b.map((i,r)=>{const t={index:r,disabled:g||i.disabled,focused:r===H,current:r===c,...i},n=w||se.Step;return e.createElement(n,{key:r,...t})});return e.createElement(ne.StepperContext.Provider,{value:{animationDuration:d,isVertical:s,item:w,linear:y,mode:_,numOfSteps:f,value:c,successIcon:K,successSVGIcon:G,errorIcon:V,errorSVGIcon:j,onChange:J,onFocus:Q}},e.createElement("nav",{className:X,style:Y,dir:R,role:"navigation",ref:v,onKeyDown:W},e.createElement("ol",{className:Z,style:$},L||h),e.createElement(oe.ProgressBar,{style:ee,labelPlacement:"start",animation:{duration:U},ariaLabel:B,"aria-hidden":!0,max:f-1,labelVisible:!1,orientation:S,reverse:S==="vertical",value:c,disabled:g,tabIndex:-1})))});T.propTypes={animationDuration:o.oneOfType([o.bool,o.number]),children:o.any,className:o.string,dir:o.string,disabled:o.bool,errorIcon:o.string,errorSVGIcon:p.svgIconPropType,item:o.any,items:o.any,linear:o.bool,mode:o.oneOf(["steps","labels"]),orientation:o.oneOf(["horizontal","vertical"]),style:o.object,successIcon:o.string,successSVGIcon:p.svgIconPropType,value:o.number.isRequired,onChange:o.func,onFocus:o.func};T.displayName="KendoStepper";exports.Stepper=T;

package/stepper/Stepper.mjs

@@ -8,15 +8,13 @@
 import * as e from "react";
 import n from "prop-types";
 import { StepperContext as oe } from "./context/StepperContext.mjs";
-import { validatePackage as se, focusFirstFocusableChild as ne, useDir as re, dispatchEvent as L, Navigation as ie, classNames as M, svgIconPropType as P } from "@progress/kendo-react-common";
-import { Step as ae } from "./Step.mjs";
+import { focusFirstFocusableChild as se, useDir as ne, dispatchEvent as L, Navigation as re, classNames as A, svgIconPropType as M } from "@progress/kendo-react-common";
+import { Step as ie } from "./Step.mjs";
 import { ProgressBar as le } from "@progress/kendo-react-progressbars";
-import { DEFAULT_ANIMATION_DURATION as ce, NO_ANIMATION as ue } from "./contants.mjs";
-import { packageMetadata as de } from "../package-metadata.mjs";
-import { useLocalization as me } from "@progress/kendo-react-intl";
-import { progBarAriaLabel as A, messages as pe } from "./messages/index.mjs";
+import { DEFAULT_ANIMATION_DURATION as ae, NO_ANIMATION as ce } from "./contants.mjs";
+import { useLocalization as ue } from "@progress/kendo-react-intl";
+import { progBarAriaLabel as P, messages as de } from "./messages/index.mjs";
 const V = e.forwardRef((S, z) => {
-  se(de);
   const {
     animationDuration: b,
     children: K,
@@ -33,11 +31,11 @@ const V = e.forwardRef((S, z) => {
     style: R,
     successIcon: B,
     successSVGIcon: U,
-    value: a = 0,
+    value: l = 0,
     onChange: y,
     onFocus: h
-  } = S, j = me().toLanguageString(A, pe[A]), f = e.useRef(null), w = e.useCallback(() => {
-    f.current && ne(f.current);
+  } = S, j = ue().toLanguageString(P, de[P]), f = e.useRef(null), w = e.useCallback(() => {
+    f.current && se(f.current);
   }, []), I = e.useCallback(
     () => ({
       element: f.current,
@@ -46,18 +44,18 @@ const V = e.forwardRef((S, z) => {
     [w]
   );
   e.useImperativeHandle(z, I);
-  const [q, u] = e.useState(a), d = p ? p.length : 0, s = E === "vertical", C = re(f, S.dir), J = typeof b == "number" ? b : b !== !1 ? ce : ue;
+  const [q, u] = e.useState(l), d = p ? p.length : 0, s = E === "vertical", C = ne(f, S.dir), J = typeof b == "number" ? b : b !== !1 ? ae : ce;
   e.useEffect(() => {
-    u(a);
-  }, [a]);
+    u(l);
+  }, [l]);
   const D = e.useCallback(
     (i, r) => {
-      const t = r === a - 1, o = r === a, l = r === a + 1;
-      a !== r && y && !m && (!g || t || o || l) && (L(y, i, I(), {
+      const t = r === l - 1, o = r === l, a = r === l + 1;
+      l !== r && y && !m && (!g || t || o || a) && (L(y, i, I(), {
         value: r
       }), u(r));
     },
-    [a, g, y, m, u]
+    [l, g, y, m, u]
   ), Q = e.useCallback(
     (i) => {
       const r = i.value, t = i.syntheticEvent;
@@ -76,36 +74,36 @@ const V = e.forwardRef((S, z) => {
     [h, m]
   ), k = e.useMemo(() => {
     const i = C === "rtl", r = p.length - 1;
-    return new ie({
+    return new re({
       root: f,
       selectors: ["ol.k-step-list li.k-step a.k-step-link"],
       tabIndex: 0,
       keyboardEvents: {
         keydown: {
-          Tab: (t, o, l) => {
-            l.preventDefault();
+          Tab: (t, o, a) => {
+            a.preventDefault();
             const c = o.elements.indexOf(t), F = o.previous(t).children[0], O = o.next(t).children[0];
-            l.shiftKey ? !i && c > 0 ? (o.focusPrevious(t), u(c - 1), v && F.click()) : i && c < r && (o.focusNext(t), u(c + 1), v && O.click()) : !i && c < r ? (o.focusNext(t), u(c + 1), v && O.click()) : i && c > 0 && (o.focusPrevious(t), u(c - 1), v && F.click());
+            a.shiftKey ? !i && c > 0 ? (o.focusPrevious(t), u(c - 1), v && F.click()) : i && c < r && (o.focusNext(t), u(c + 1), v && O.click()) : !i && c < r ? (o.focusNext(t), u(c + 1), v && O.click()) : i && c > 0 && (o.focusPrevious(t), u(c - 1), v && F.click());
           },
-          Home: (t, o, l) => {
-            l.preventDefault(), o.focusElement(o.first, t), u(0);
+          Home: (t, o, a) => {
+            a.preventDefault(), o.focusElement(o.first, t), u(0);
           },
-          End: (t, o, l) => {
-            l.preventDefault(), o.focusElement(o.last, t), u(r);
+          End: (t, o, a) => {
+            a.preventDefault(), o.focusElement(o.last, t), u(r);
           },
-          Space: (t, o, l) => {
-            l.preventDefault(), t.children[0].click();
+          Space: (t, o, a) => {
+            a.preventDefault(), t.children[0].click();
           },
-          Enter: (t, o, l) => {
-            l.preventDefault(), t.children[0].click();
+          Enter: (t, o, a) => {
+            a.preventDefault(), t.children[0].click();
           }
         }
       }
     });
   }, [C, p.length, u, v]);
-  e.useEffect(() => (k.initializeRovingTab(a), () => k.removeFocusListener()), []);
+  e.useEffect(() => (k.initializeRovingTab(l), () => k.removeFocusListener()), []);
   const X = e.useCallback(k.triggerKeyboardEvent.bind(k), []), Y = e.useMemo(
-    () => M(
+    () => A(
       "k-stepper",
       {
         "k-stepper-linear": g
@@ -122,7 +120,7 @@ const V = e.forwardRef((S, z) => {
     }),
     [s, d, R]
   ), $ = e.useMemo(
-    () => M("k-step-list", {
+    () => A("k-step-list", {
       "k-step-list-horizontal": !s,
       "k-step-list-vertical": s
     }),
@@ -149,9 +147,9 @@ const V = e.forwardRef((S, z) => {
       index: r,
       disabled: m || i.disabled,
       focused: r === q,
-      current: r === a,
+      current: r === l,
       ...i
-    }, o = N || ae;
+    }, o = N || ie;
     return /* @__PURE__ */ e.createElement(o, { key: r, ...t });
   });
   return /* @__PURE__ */ e.createElement(
@@ -164,7 +162,7 @@ const V = e.forwardRef((S, z) => {
         linear: g,
         mode: _,
         numOfSteps: d,
-        value: a,
+        value: l,
         successIcon: B,
         successSVGIcon: U,
         errorIcon: G,
@@ -196,7 +194,7 @@ const V = e.forwardRef((S, z) => {
           labelVisible: !1,
           orientation: E,
           reverse: E === "vertical",
-          value: a,
+          value: l,
           disabled: m,
           tabIndex: -1
         }
@@ -211,7 +209,7 @@ V.propTypes = {
   dir: n.string,
   disabled: n.bool,
   errorIcon: n.string,
-  errorSVGIcon: P,
+  errorSVGIcon: M,
   item: n.any,
   items: n.any,
   linear: n.bool,
@@ -219,7 +217,7 @@ V.propTypes = {
   orientation: n.oneOf(["horizontal", "vertical"]),
   style: n.object,
   successIcon: n.string,
-  successSVGIcon: P,
+  successSVGIcon: M,
   value: n.number.isRequired,
   onChange: n.func,
   onFocus: n.func

package/tabstrip/TabStrip.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react"),l=require("prop-types"),S=require("./TabStripNavigation.js"),k=require("./TabStripContent.js"),p=require("@progress/kendo-react-common"),g=require("../package-metadata.js");function P(u){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const s in u)if(s!=="default"){const o=Object.getOwnPropertyDescriptor(u,s);Object.defineProperty(r,s,o.get?o:{enumerable:!0,get:()=>u[s]})}}return r.default=u,Object.freeze(r)}const c=P(y),b=class b extends c.Component{constructor(r){super(r),this.tabStripRef=c.createRef(),this.itemsNavRef=c.createRef(),this.showLicenseWatermark=!1,this.onScroll=()=>{const s=this.horizontalScroll(),o=this.itemsNavRef.current;if(!o)return;const e=o.scrollLeft,t=o.clientWidth,i=o.scrollWidth,n=o.scrollTop,a=o.scrollHeight,h=o.clientHeight;let d=null;const v=s?i>t:a>h,m=this.props.dir==="rtl";v?s?e+t===i||(m&&t-e)===i?d="end":e===0||m&&-e===0?d="start":e>0&&e+t<i||-e>0&&t-e<i?d="middle":d=null:a-(n+h)===0?d="bottom":n===0?d="top":n>0&&a-(n+h)>0?d="middle":d=null:d=null,this.setState({containerScrollPosition:d})},this.handleResize=()=>{this.onScroll()},this.onSelect=s=>{this.props.selected!==s&&this.props.onSelect&&this.props.onSelect({selected:s})},this.onKeyDown=s=>{this.navigation&&this.navigation.triggerKeyboardEvent(s)},this.onKeyboardSelect=s=>{const o=this.children();o&&o[s].props.disabled||this.onSelect(s)},this.renderContent=s=>{const{selected:o,children:e,tabContentStyle:t}=s,i=c.Children.count(e);return o<i&&o>-1?c.createElement(k.TabStripContent,{index:o,...s,style:t}):null},p.validatePackage(g.packageMetadata),this.showLicenseWatermark=p.shouldShowValidationUI(g.packageMetadata),this.state={containerScrollPosition:null},this.itemsNavRef=c.createRef()}get contentPanelId(){return this.props.id+"-content-panel-id"}get navItemId(){return this.props.id+"-nav-item-id"}componentDidMount(){var o;const r=this.tabStripRef.current,s=r&&getComputedStyle(r).direction==="rtl"||!1;r&&(this.navigation=new p.Navigation({tabIndex:0,root:this.tabStripRef,rovingTabIndex:!0,focusClass:"k-focus",selectors:[".k-tabstrip .k-tabstrip-item"],keyboardEvents:{keydown:{ArrowLeft:(e,t,i)=>{i.preventDefault();const n=t.elements.indexOf(e),a=n!==0?n-1:t.elements.length-1,h=n!==t.elements.length-1?n+1:0;s?(t.focusNext(e),this.onKeyboardSelect(h)):(t.focusPrevious(e),this.onKeyboardSelect(a))},ArrowRight:(e,t,i)=>{i.preventDefault();const n=t.elements.indexOf(e),a=n!==0?n-1:t.elements.length-1,h=n!==t.elements.length-1?n+1:0;s?(t.focusPrevious(e),this.onKeyboardSelect(a)):(t.focusNext(e),this.onKeyboardSelect(h))},ArrowDown:(e,t,i)=>{i.preventDefault();const n=t.elements.indexOf(e),a=n!==t.elements.length-1?n+1:0;t.focusNext(e),this.onKeyboardSelect(a)},ArrowUp:(e,t,i)=>{i.preventDefault();const n=t.elements.indexOf(e),a=n!==0?n-1:t.elements.length-1;t.focusPrevious(e),this.onKeyboardSelect(a)},Home:(e,t,i)=>{i.preventDefault(),t.focusElement(t.first,e),this.onKeyboardSelect(0)},End:(e,t,i)=>{i.preventDefault(),t.focusElement(t.last,e),this.onKeyboardSelect(t.elements.length-1)}}}}),(o=this.navigation)==null||o.initializeRovingTab(this.props.selected),this.onScroll(),this.resizeObserver=new ResizeObserver(()=>this.onScroll()),this.tabStripRef.current&&this.resizeObserver.observe(this.tabStripRef.current))}componentWillUnmount(){var r;(r=this.navigation)==null||r.removeFocusListener(),this.resizeObserver&&this.resizeObserver.disconnect()}horizontalScroll(){return/top|bottom/.test(this.props.tabPosition||"top")}render(){const r={itemsNavRef:this.itemsNavRef,...this.props,children:this.children(),contentPanelId:this.contentPanelId,renderAllContent:this.props.renderAllContent,navItemId:this.navItemId,onKeyDown:this.onKeyDown,onSelect:this.onSelect,onScroll:this.onScroll,containerScrollPosition:this.state.containerScrollPosition,scrollButtons:this.props.scrollButtons==="hidden"||this.state.containerScrollPosition===null&&this.props.scrollButtons==="auto"?"hidden":"visible"},{scrollable:s,scrollButtons:o,size:e,tabPosition:t,tabIndex:i}=r,n=t==="bottom",a=p.classNames("k-tabstrip k-pos-relative",{[`k-tabstrip-${p.kendoThemeMaps.sizeMap[e]||e}`]:e,"k-tabstrip-left":t==="left","k-tabstrip-right":t==="right","k-tabstrip-bottom":t==="bottom","k-tabstrip-top":t==="top","k-tabstrip-scrollable":s,"k-tabstrip-scrollable-start k-tabstrip-scrollable-end":s&&o==="visible","k-tabstrip-scrollable-start":s&&(o==="auto"||!o)&&(this.state.containerScrollPosition==="end"||this.state.containerScrollPosition==="middle"),"k-tabstrip-scrollable-end":s&&o==="auto"&&(this.state.containerScrollPosition==="start"||this.state.containerScrollPosition==="middle")},this.props.className);return c.createElement("div",{id:this.props.id,ref:this.tabStripRef,dir:this.props.dir,className:a,style:this.props.style,onScroll:this.onScroll,onResize:this.handleResize},!n&&c.createElement(S.TabStripNavigation,{...r,tabIndex:i}),this.renderContent(r),n&&c.createElement(S.TabStripNavigation,{...r,tabIndex:i}),this.showLicenseWatermark&&c.createElement(p.WatermarkOverlay,null))}children(){return c.Children.toArray(this.props.children).filter(r=>r)}};b.propTypes={id:l.string,animation:l.bool,children:l.node,onSelect:l.func,selected:l.number,style:l.object,tabContentStyle:l.object,tabPosition:l.string,tabAlignment:l.string,tabIndex:l.number,className:l.string,dir:l.string,renderAllContent:l.bool,size:l.oneOf(["small","medium","large",null]),scrollButtons:l.oneOf(["auto","visible","hidden"]),scrollButtonsPosition:l.oneOf(["split","start","end","around","before","after"])},b.defaultProps={animation:!0,tabPosition:"top",tabAlignment:"start",keepTabsMounted:!1,buttonScrollSpeed:100,mouseScrollSpeed:10,scrollButtons:"auto",scrollButtonsPosition:"split",size:"medium",renderAllContent:!1};let f=b;exports.TabStrip=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("react"),l=require("prop-types"),S=require("./TabStripNavigation.js"),y=require("./TabStripContent.js"),b=require("@progress/kendo-react-common");function P(p){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(p){for(const s in p)if(s!=="default"){const o=Object.getOwnPropertyDescriptor(p,s);Object.defineProperty(r,s,o.get?o:{enumerable:!0,get:()=>p[s]})}}return r.default=p,Object.freeze(r)}const d=P(v),u=class u extends d.Component{constructor(r){super(r),this.tabStripRef=d.createRef(),this.itemsNavRef=d.createRef(),this.onScroll=()=>{const s=this.horizontalScroll(),o=this.itemsNavRef.current;if(!o)return;const e=o.scrollLeft,t=o.clientWidth,i=o.scrollWidth,n=o.scrollTop,c=o.scrollHeight,h=o.clientHeight;let a=null;const g=s?i>t:c>h,m=this.props.dir==="rtl";g?s?e+t===i||(m&&t-e)===i?a="end":e===0||m&&-e===0?a="start":e>0&&e+t<i||-e>0&&t-e<i?a="middle":a=null:c-(n+h)===0?a="bottom":n===0?a="top":n>0&&c-(n+h)>0?a="middle":a=null:a=null,this.setState({containerScrollPosition:a})},this.handleResize=()=>{this.onScroll()},this.onSelect=s=>{this.props.selected!==s&&this.props.onSelect&&this.props.onSelect({selected:s})},this.onKeyDown=s=>{this.navigation&&this.navigation.triggerKeyboardEvent(s)},this.onKeyboardSelect=s=>{const o=this.children();o&&o[s].props.disabled||this.onSelect(s)},this.renderContent=s=>{const{selected:o,children:e,tabContentStyle:t}=s,i=d.Children.count(e);return o<i&&o>-1?d.createElement(y.TabStripContent,{index:o,...s,style:t}):null},this.state={containerScrollPosition:null},this.itemsNavRef=d.createRef()}get contentPanelId(){return this.props.id+"-content-panel-id"}get navItemId(){return this.props.id+"-nav-item-id"}componentDidMount(){var o;const r=this.tabStripRef.current,s=r&&getComputedStyle(r).direction==="rtl"||!1;r&&(this.navigation=new b.Navigation({tabIndex:0,root:this.tabStripRef,rovingTabIndex:!0,focusClass:"k-focus",selectors:[".k-tabstrip .k-tabstrip-item"],keyboardEvents:{keydown:{ArrowLeft:(e,t,i)=>{i.preventDefault();const n=t.elements.indexOf(e),c=n!==0?n-1:t.elements.length-1,h=n!==t.elements.length-1?n+1:0;s?(t.focusNext(e),this.onKeyboardSelect(h)):(t.focusPrevious(e),this.onKeyboardSelect(c))},ArrowRight:(e,t,i)=>{i.preventDefault();const n=t.elements.indexOf(e),c=n!==0?n-1:t.elements.length-1,h=n!==t.elements.length-1?n+1:0;s?(t.focusPrevious(e),this.onKeyboardSelect(c)):(t.focusNext(e),this.onKeyboardSelect(h))},ArrowDown:(e,t,i)=>{i.preventDefault();const n=t.elements.indexOf(e),c=n!==t.elements.length-1?n+1:0;t.focusNext(e),this.onKeyboardSelect(c)},ArrowUp:(e,t,i)=>{i.preventDefault();const n=t.elements.indexOf(e),c=n!==0?n-1:t.elements.length-1;t.focusPrevious(e),this.onKeyboardSelect(c)},Home:(e,t,i)=>{i.preventDefault(),t.focusElement(t.first,e),this.onKeyboardSelect(0)},End:(e,t,i)=>{i.preventDefault(),t.focusElement(t.last,e),this.onKeyboardSelect(t.elements.length-1)}}}}),(o=this.navigation)==null||o.initializeRovingTab(this.props.selected),this.onScroll(),this.resizeObserver=window.ResizeObserver&&new ResizeObserver(()=>this.onScroll()),this.tabStripRef.current&&this.resizeObserver&&this.resizeObserver.observe(this.tabStripRef.current))}componentWillUnmount(){var r;(r=this.navigation)==null||r.removeFocusListener(),this.resizeObserver&&this.resizeObserver.disconnect()}horizontalScroll(){return/top|bottom/.test(this.props.tabPosition||"top")}render(){const r={itemsNavRef:this.itemsNavRef,...this.props,children:this.children(),contentPanelId:this.contentPanelId,renderAllContent:this.props.renderAllContent,navItemId:this.navItemId,onKeyDown:this.onKeyDown,onSelect:this.onSelect,onScroll:this.onScroll,containerScrollPosition:this.state.containerScrollPosition,scrollButtons:this.props.scrollButtons==="hidden"||this.state.containerScrollPosition===null&&this.props.scrollButtons==="auto"?"hidden":"visible"},{scrollable:s,scrollButtons:o,size:e,tabPosition:t,tabIndex:i}=r,n=t==="bottom",c=b.classNames("k-tabstrip k-pos-relative",{[`k-tabstrip-${b.kendoThemeMaps.sizeMap[e]||e}`]:e,"k-tabstrip-left":t==="left","k-tabstrip-right":t==="right","k-tabstrip-bottom":t==="bottom","k-tabstrip-top":t==="top","k-tabstrip-scrollable":s,"k-tabstrip-scrollable-start k-tabstrip-scrollable-end":s&&o==="visible","k-tabstrip-scrollable-start":s&&(o==="auto"||!o)&&(this.state.containerScrollPosition==="end"||this.state.containerScrollPosition==="middle"),"k-tabstrip-scrollable-end":s&&o==="auto"&&(this.state.containerScrollPosition==="start"||this.state.containerScrollPosition==="middle")},this.props.className);return d.createElement("div",{id:this.props.id,ref:this.tabStripRef,dir:this.props.dir,className:c,style:this.props.style,onScroll:this.onScroll,onResize:this.handleResize},!n&&d.createElement(S.TabStripNavigation,{...r,tabIndex:i}),this.renderContent(r),n&&d.createElement(S.TabStripNavigation,{...r,tabIndex:i}))}children(){return d.Children.toArray(this.props.children).filter(r=>r)}};u.propTypes={id:l.string,animation:l.bool,children:l.node,onSelect:l.func,selected:l.number,style:l.object,tabContentStyle:l.object,tabPosition:l.string,tabAlignment:l.string,tabIndex:l.number,className:l.string,dir:l.string,renderAllContent:l.bool,size:l.oneOf(["small","medium","large",null]),scrollButtons:l.oneOf(["auto","visible","hidden"]),scrollButtonsPosition:l.oneOf(["split","start","end","around","before","after"])},u.defaultProps={animation:!0,tabPosition:"top",tabAlignment:"start",keepTabsMounted:!1,buttonScrollSpeed:100,mouseScrollSpeed:10,scrollButtons:"auto",scrollButtonsPosition:"split",size:"medium",renderAllContent:!1};let f=u;exports.TabStrip=f;