@progress/kendo-react-layout 13.4.0-develop.5 → 14.0.0-develop.1

package/tabstrip/TabStripNavigationItem.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 k=require("react"),e=require("prop-types"),R=require("@progress/kendo-react-common");function g(i){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const t in i)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(i,t);Object.defineProperty(n,t,s.get?s:{enumerable:!0,get:()=>i[t]})}}return n.default=i,Object.freeze(n)}const o=g(k),l=class l extends o.Component{constructor(){super(...arguments),this.itemRef=null,this.focus=()=>{this.itemRef&&this.itemRef.focus()},this.blur=()=>{this.itemRef&&this.itemRef.blur()},this.onClick=()=>{this.props.onSelect&&this.props.onSelect(this.props.index),this.itemRef&&(this.itemRef.tabIndex=0,this.itemRef.focus())}}render(){const{id:n,active:t,disabled:s,title:d="Untitled",index:c,renderAllContent:f,first:p,last:u}=this.props,a=f?`${this.props.contentPanelId}-${c.toString()}`:this.props.contentPanelId,m={id:`${n}-${c.toString()}`,"aria-selected":t,"aria-controls":t?a:void 0,"aria-disabled":s,role:"tab",onClick:s?void 0:this.onClick},b=R.classNames("k-tabstrip-item",{"k-disabled":s,"k-active":t,"k-first":p,"k-last":u});return o.createElement("li",{...m,className:b,ref:h=>{this.itemRef=h},onBlur:this.blur,"aria-controls":a},o.createElement("span",{className:"k-link"},d))}};l.propTypes={active:e.bool,disabled:e.bool,index:e.number,onSelect:e.func,title:e.oneOfType([e.string,e.element]),first:e.bool,last:e.bool};let r=l;exports.TabStripNavigationItem=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),t=require("prop-types"),O=require("@progress/kendo-react-common");function P(n){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const r in n)if(r!=="default"){const a=Object.getOwnPropertyDescriptor(n,r);Object.defineProperty(i,r,a.get?a:{enumerable:!0,get:()=>n[r]})}}return i.default=n,Object.freeze(i)}const e=P(T),f=e.forwardRef((n,i)=>{const{id:r,active:a,disabled:l,title:C="Untitled",index:o,renderAllContent:p,first:k,last:g,contentPanelId:d,onSelect:u}=n,s=e.useRef(null),v=e.useCallback(()=>{var c;(c=s.current)==null||c.focus()},[]),b=e.useCallback(()=>{var c;(c=s.current)==null||c.blur()},[]),S=e.useCallback(()=>({focus:v,blur:b}),[v,b]);e.useImperativeHandle(i,S);const y=e.useCallback(()=>{u==null||u(o),s.current&&(s.current.tabIndex=0,s.current.focus())},[u,o]),m=e.useMemo(()=>p?`${d}-${o.toString()}`:d,[p,d,o]),I=e.useMemo(()=>O.classNames("k-tabstrip-item",{"k-disabled":l,"k-active":a,"k-first":k,"k-last":g}),[l,a,k,g]),N=e.useMemo(()=>({id:`${r}-${o.toString()}`,"aria-selected":a,"aria-controls":a?m:void 0,"aria-disabled":l,role:"tab",onClick:l?void 0:y}),[r,o,a,m,l,y]);return e.createElement("li",{...N,className:I,ref:s,onBlur:b,"aria-controls":m},e.createElement("span",{className:"k-link"},C))});f.propTypes={active:t.bool,disabled:t.bool,index:t.number,onSelect:t.func,title:t.oneOfType([t.string,t.element]),first:t.bool,last:t.bool};f.displayName="TabStripNavigationItem";exports.TabStripNavigationItem=f;

package/tabstrip/TabStripNavigationItem.mjs

@@ -5,52 +5,62 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as i from "react";
+import * as e from "react";
 import t from "prop-types";
-import { classNames as b } from "@progress/kendo-react-common";
-const o = class o extends i.Component {
-  constructor() {
-    super(...arguments), this.itemRef = null, this.focus = () => {
-      this.itemRef && this.itemRef.focus();
-    }, this.blur = () => {
-      this.itemRef && this.itemRef.blur();
-    }, this.onClick = () => {
-      this.props.onSelect && this.props.onSelect(this.props.index), this.itemRef && (this.itemRef.tabIndex = 0, this.itemRef.focus());
-    };
-  }
-  /**
-   * @hidden
-   */
-  render() {
-    const { id: a, active: e, disabled: s, title: c = "Untitled", index: n, renderAllContent: p, first: f, last: d } = this.props, r = p ? `${this.props.contentPanelId}-${n.toString()}` : this.props.contentPanelId, m = {
-      id: `${a}-${n.toString()}`,
-      "aria-selected": e,
-      "aria-controls": e ? r : void 0,
-      "aria-disabled": s,
+import { classNames as y } from "@progress/kendo-react-common";
+const v = e.forwardRef((C, I) => {
+  const {
+    id: d,
+    active: o,
+    disabled: r,
+    title: g = "Untitled",
+    index: a,
+    renderAllContent: u,
+    first: b,
+    last: p,
+    contentPanelId: n,
+    onSelect: i
+  } = C, s = e.useRef(null), f = e.useCallback(() => {
+    var l;
+    (l = s.current) == null || l.focus();
+  }, []), c = e.useCallback(() => {
+    var l;
+    (l = s.current) == null || l.blur();
+  }, []), N = e.useCallback(
+    () => ({
+      focus: f,
+      blur: c
+    }),
+    [f, c]
+  );
+  e.useImperativeHandle(I, N);
+  const k = e.useCallback(() => {
+    i == null || i(a), s.current && (s.current.tabIndex = 0, s.current.focus());
+  }, [i, a]), m = e.useMemo(
+    () => u ? `${n}-${a.toString()}` : n,
+    [u, n, a]
+  ), T = e.useMemo(
+    () => y("k-tabstrip-item", {
+      "k-disabled": r,
+      "k-active": o,
+      "k-first": b,
+      "k-last": p
+    }),
+    [r, o, b, p]
+  ), x = e.useMemo(
+    () => ({
+      id: `${d}-${a.toString()}`,
+      "aria-selected": o,
+      "aria-controls": o ? m : void 0,
+      "aria-disabled": r,
       role: "tab",
-      onClick: s ? void 0 : this.onClick
-    }, h = b("k-tabstrip-item", {
-      "k-disabled": s,
-      "k-active": e,
-      "k-first": f,
-      "k-last": d
-    });
-    return /* @__PURE__ */ i.createElement(
-      "li",
-      {
-        ...m,
-        className: h,
-        ref: (u) => {
-          this.itemRef = u;
-        },
-        onBlur: this.blur,
-        "aria-controls": r
-      },
-      /* @__PURE__ */ i.createElement("span", { className: "k-link" }, c)
-    );
-  }
-};
-o.propTypes = {
+      onClick: r ? void 0 : k
+    }),
+    [d, a, o, m, r, k]
+  );
+  return /* @__PURE__ */ e.createElement("li", { ...x, className: T, ref: s, onBlur: c, "aria-controls": m }, /* @__PURE__ */ e.createElement("span", { className: "k-link" }, g));
+});
+v.propTypes = {
   active: t.bool,
   disabled: t.bool,
   index: t.number,
@@ -59,7 +69,7 @@ o.propTypes = {
   first: t.bool,
   last: t.bool
 };
-let l = o;
+v.displayName = "TabStripNavigationItem";
 export {
-  l as TabStripNavigationItem
+  v as TabStripNavigationItem
 };

package/tabstrip/TabStripTab.d.ts

@@ -5,7 +5,6 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { default as PropTypes } from 'prop-types';
 import * as React from 'react';
 /**
  * Represents the props of the TabStrip tabs.
@@ -33,18 +32,4 @@ export interface TabStripTabProps {
 /**
  * Represents the TabStripTab component.
  */
-export declare class TabStripTab extends React.Component<TabStripTabProps, {}> {
-    /**
-     * @hidden
-     */
-    static propTypes: {
-        disabled: PropTypes.Requireable<boolean>;
-        contentClassName: PropTypes.Requireable<string>;
-        children: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
-        title: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
-    };
-    /**
-     * @hidden
-     */
-    render(): null;
-}
+export declare const TabStripTab: React.FC<TabStripTabProps>;

package/tabstrip/TabStripTab.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 l=require("react"),e=require("prop-types");function i(t){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(r,n,s.get?s:{enumerable:!0,get:()=>t[n]})}}return r.default=t,Object.freeze(r)}const a=i(l),c=class c extends a.Component{render(){return null}};c.propTypes={disabled:e.bool,contentClassName:e.string,children:e.oneOfType([e.element,e.node]),title:e.oneOfType([e.string,e.element,e.node])};let o=c;exports.TabStripTab=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("prop-types"),t=()=>null;t.propTypes={disabled:e.bool,contentClassName:e.string,children:e.oneOfType([e.element,e.node]),title:e.oneOfType([e.string,e.element,e.node])};t.displayName="TabStripTab";exports.TabStripTab=t;

package/tabstrip/TabStripTab.mjs

@@ -5,23 +5,15 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as t from "react";
 import e from "prop-types";
-const n = class n extends t.Component {
-  /**
-   * @hidden
-   */
-  render() {
-    return null;
-  }
-};
+const n = () => null;
 n.propTypes = {
   disabled: e.bool,
   contentClassName: e.string,
   children: e.oneOfType([e.element, e.node]),
   title: e.oneOfType([e.string, e.element, e.node])
 };
-let o = n;
+n.displayName = "TabStripTab";
 export {
-  o as TabStripTab
+  n as TabStripTab
 };