@progress/kendo-react-layout 9.0.0-develop.8 → 9.0.0

package/actionsheet/ActionSheet.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const N=require("react"),m=require("prop-types"),C=require("@progress/kendo-react-animation"),b=require("@progress/kendo-react-common"),x=require("../package-metadata.js"),E=require("./ActionSheetItem.js"),S=require("./ActionSheetHeader.js"),D=require("./ActionSheetFooter.js"),I=require("./ActionSheetContent.js");function O(h){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const t in h)if(t!=="default"){const e=Object.getOwnPropertyDescriptor(h,t);Object.defineProperty(n,t,e.get?e:{enumerable:!0,get:()=>h[t]})}}return n.default=h,Object.freeze(n)}const i=O(N),d=class d extends i.Component{constructor(n){super(n),this.actionSheetRef=i.createRef(),this.actionSheetTitleClass="k-actionsheet-title",this.ariaLabeledBy=this.actionSheetTitleClass,this.animationDuration=300,this.bottomPosition={bottom:"0",width:"100%"},this.handleKeyDown=t=>{this.props.navigatable&&this.navigation.triggerKeyboardEvent(t)},this.onTab=(t,e,s)=>{s.preventDefault(),s.shiftKey?e.focusPrevious(t):e.focusNext(t)},this.handleOverlayClick=t=>{this.props.onOverlayClick&&this.props.onOverlayClick.call(void 0,t),this.props.onClose&&this.props.onClose.call(void 0,t),this.props.animation||this.hideActionSheet()},this.handleItemClick=t=>{this.props.onItemClick&&this.props.onItemClick.call(void 0,t),this.props.onItemSelect&&this.props.onItemSelect.call(void 0,t),this.props.animation||this.hideActionSheet()},this.onEnter=(t,e,s)=>{if(t.ariaDisabled)return;const c=t.className&&t.className.indexOf?t.className.indexOf("k-actionsheet-item")!==-1:!1,l=e.elements.filter(a=>a.className.indexOf("k-actionsheet-item")!==-1);if(c&&this.props.onItemClick){s.preventDefault();const a=this.props.items[l.indexOf(t)];this.props.onItemClick.call(void 0,{syntheticEvent:s,item:a,title:a&&a.title})}if(c&&this.props.onItemSelect){s.preventDefault();const a=this.props.items[l.indexOf(t)];this.props.onItemSelect.call(void 0,{syntheticEvent:s,item:a,title:a&&a.title})}this.props.animation||this.hideActionSheet()},this.onEscape=(t,e,s)=>{this.props.onOverlayClick&&(s.preventDefault(),this.props.onOverlayClick.call(void 0,s)),this.props.onClose&&(s.preventDefault(),this.props.onClose.call(void 0,s)),this.props.animation||this.hideActionSheet()},this.hideActionSheet=()=>{this.setState({show:!1})},this.children=t=>{const e={};return i.Children.forEach(t,s=>{s&&(e[s.type.displayName]=s)}),e},this.state={show:!1,slide:!1},b.validatePackage(x.packageMetadata)}componentDidMount(){this.props.expand&&!this.state.show&&this.setState({show:!0})}componentDidUpdate(n,t){const e=this.actionSheetRef.current;if(this.props.expand&&!this.state.show&&this.setState({show:!0}),this.props.expand&&this.state.show&&!this.state.slide&&this.setState({slide:!0}),!this.props.expand&&this.state.show&&this.state.slide&&this.setState({slide:!1}),t!==this.state&&this.state.slide&&e&&!this.props.className&&(e.style.setProperty("--kendo-actionsheet-height","auto"),e.style.setProperty("--kendo-actionsheet-max-height","none")),e&&this.props.navigatable){const c=[".k-actionsheet-item",...[".k-actionsheet-footer",".k-actionsheet-content",".k-actionsheet-titlebar"].map(l=>b.FOCUSABLE_ELEMENTS.concat(this.props.navigatableElements).map(a=>`${l} ${a}`)).flat()];this.navigation=new b.Navigation({tabIndex:this.props.tabIndex||0,root:this.actionSheetRef,rovingTabIndex:!1,selectors:c,keyboardEvents:{keydown:{Tab:this.onTab,Enter:this.onEnter,Escape:this.onEscape}}}),this.navigation.focusElement(this.navigation.first,null)}}render(){const{title:n,subTitle:t,animationStyles:e,animation:s,expand:c,tabIndex:l,items:a}=this.props,r=a==null?void 0:a.filter(o=>!o.group||o.group==="top"),u=a==null?void 0:a.filter(o=>o.group==="bottom"),g=r&&r.length>0&&u&&u.length>0,f=this.children(this.props.children),y=this.props.animationDuration||this.animationDuration,v=this.state.slide&&i.createElement("div",{className:b.classNames("k-actionsheet",this.props.className,{"k-actionsheet-bottom":!this.props.className}),role:"dialog","aria-modal":"true","aria-hidden":!1,"aria-labelledby":this.ariaLabeledBy,ref:this.actionSheetRef,onKeyDown:this.handleKeyDown},f[S.headerDisplayName]&&!n&&!t&&f[S.headerDisplayName],(n||t)&&i.createElement("div",{className:"k-actionsheet-titlebar k-text-center"},i.createElement("div",{className:"k-actionsheet-titlebar-group k-hbox"},i.createElement("div",{className:this.actionSheetTitleClass,id:this.ariaLabeledBy},n&&i.createElement("div",null,n),t&&i.createElement("div",{className:"k-actionsheet-subtitle"},t)))),f[I.contentDisplayName]||i.createElement("div",{className:"k-actionsheet-content"},i.createElement("div",{className:"k-list-ul",role:"group"},r&&r.map((o,p)=>i.createElement(E.ActionSheetItem,{...o,id:p,key:p,item:o,tabIndex:l||0,onClick:this.handleItemClick}))),g&&i.createElement("hr",{className:"k-hr"}),i.createElement("div",{className:"k-list-ul",role:"group"},u&&u.map((o,p)=>i.createElement(E.ActionSheetItem,{...o,id:p+((r==null?void 0:r.length)||0),key:p,item:o,tabIndex:l||0,onClick:this.handleItemClick})))),f[D.footerDisplayName]);return i.createElement(i.Fragment,null,c||this.state.show?i.createElement("div",{className:"k-actionsheet-container"},i.createElement("div",{className:"k-overlay",onClick:this.handleOverlayClick}),s?i.createElement(C.Animation,{transitionName:this.state.slide?"slide-up":"slide-down",onExited:this.hideActionSheet,transitionEnterDuration:y,transitionExitDuration:y,animationEnteringStyle:e||this.bottomPosition,animationEnteredStyle:e||this.bottomPosition,animationExitingStyle:e||this.bottomPosition,exit:!0,enter:!0,appear:!1},v):v):null)}};d.displayName="KendoReactActionSheet",d.propTypes={items:m.array,subTitle:m.string,title:m.string,navigatable:m.bool,navigatableElements:m.array},d.defaultProps={navigatable:!0,navigatableElements:[]};let k=d;exports.ActionSheet=k;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const U=require("react"),f=require("prop-types"),G=require("@progress/kendo-react-animation"),v=require("@progress/kendo-react-common"),J=require("../package-metadata.js"),q=require("./ActionSheetItem.js"),_=require("./ActionSheetHeader.js"),Q=require("./ActionSheetFooter.js"),V=require("./ActionSheetContent.js");function W(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const s in e)if(s!=="default"){const m=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(r,s,m.get?m:{enumerable:!0,get:()=>e[s]})}}return r.default=e,Object.freeze(r)}const n=W(U),x=n.forwardRef((e,r)=>{var A,P;v.validatePackage(J.packageMetadata);const{navigatableElements:s=N.navigatableElements,navigatable:m=N.navigatable}=e,j=(t,i,a)=>{a.preventDefault(),a.shiftKey?i.focusPrevious(t):i.focusNext(t)},K=(t,i,a)=>{if(t.ariaDisabled)return;const y=t.className&&t.className.indexOf?t.className.indexOf("k-actionsheet-item")!==-1:!1,E=i.elements.filter(c=>c.className.indexOf("k-actionsheet-item")!==-1);if(y&&e.onItemClick){a.preventDefault();const c=e.items[E.indexOf(t)];e.onItemClick.call(void 0,{syntheticEvent:a,item:c,title:c&&c.title})}if(y&&e.onItemSelect){a.preventDefault();const c=e.items[E.indexOf(t)];e.onItemSelect.call(void 0,{syntheticEvent:a,item:c,title:c&&c.title})}e.animation||u()},M=(t,i,a)=>{e.onOverlayClick&&(a.preventDefault(),e.onOverlayClick.call(void 0,a)),e.onClose&&(a.preventDefault(),e.onClose.call(void 0,a)),e.animation||u()},u=()=>{d({show:!1})},H=t=>{m&&h.current.triggerKeyboardEvent(t)},F=t=>{e.onOverlayClick&&e.onOverlayClick.call(void 0,t),e.onClose&&e.onClose.call(void 0,t),e.animation||u()},C=t=>{e.onItemClick&&e.onItemClick.call(void 0,t),e.onItemSelect&&e.onItemSelect.call(void 0,t),e.animation||u()},L=t=>{const i={};return n.Children.forEach(t,a=>{a&&(i[a.type.displayName]=a)}),i},I=n.useRef(null),S=n.useRef(null);n.useImperativeHandle(I,()=>({props:e})),n.useImperativeHandle(r,()=>I.current);const h=n.useRef(),B=n.useRef(e.animationDuration||300),g=n.useRef({bottom:"0",width:"100%"}),D=n.useRef(),[l,$]=n.useState({show:!1,slide:!1}),d=t=>{$(i=>({...i,...t}))};n.useEffect(()=>{e.expand&&!l.show&&d({show:!0})},[]),n.useEffect(()=>{const t=S.current;if(e.expand&&!l.show&&d({show:!0}),e.expand&&l.show&&!l.slide&&d({slide:!0}),!e.expand&&l.show&&l.slide&&d({slide:!1}),D!==l&&l.slide&&t&&!e.className&&(t.style.setProperty("--kendo-actionsheet-height","auto"),t.style.setProperty("--kendo-actionsheet-max-height","none")),t&&m){const a=[".k-actionsheet-item",...[".k-actionsheet-footer",".k-actionsheet-content",".k-actionsheet-titlebar"].map(y=>v.FOCUSABLE_ELEMENTS.concat(s).map(E=>`${y} ${E}`)).flat()];h.current=new v.Navigation({tabIndex:e.tabIndex||0,root:S,rovingTabIndex:!1,selectors:a,keyboardEvents:{keydown:{Tab:j,Enter:K,Escape:M}}}),h.current.focusElement(h.current.first,null)}D.current={...l}});const R="k-actionsheet-title",w=R,o=(A=e.items)==null?void 0:A.filter(t=>!t.group||t.group==="top"),b=(P=e.items)==null?void 0:P.filter(t=>t.group==="bottom"),z=o&&o.length>0&&b&&b.length>0,k=L(e.children),O=e.animationDuration||B.current,T=l.slide&&n.createElement("div",{className:v.classNames("k-actionsheet",e.className,{"k-actionsheet-bottom":!e.className}),role:"dialog","aria-modal":"true","aria-hidden":!1,"aria-labelledby":w,ref:S,onKeyDown:H},k[_.headerDisplayName]&&!e.title&&!e.subTitle&&k[_.headerDisplayName],(e.title||e.subTitle)&&n.createElement("div",{className:"k-actionsheet-titlebar k-text-center"},n.createElement("div",{className:"k-actionsheet-titlebar-group k-hbox"},n.createElement("div",{className:R,id:w},e.title&&n.createElement("div",null,e.title),e.subTitle&&n.createElement("div",{className:"k-actionsheet-subtitle"},e.subTitle)))),k[V.contentDisplayName]||n.createElement("div",{className:"k-actionsheet-content"},n.createElement("div",{className:"k-list-ul",role:"group"},o&&o.map((t,i)=>n.createElement(q.ActionSheetItem,{...t,id:i,key:i,item:t,tabIndex:e.tabIndex||0,onClick:C}))),z&&n.createElement("hr",{className:"k-hr"}),n.createElement("div",{className:"k-list-ul",role:"group"},b&&b.map((t,i)=>n.createElement(q.ActionSheetItem,{...t,id:i+((o==null?void 0:o.length)||0),key:i,item:t,tabIndex:e.tabIndex||0,onClick:C})))),k[Q.footerDisplayName]);return n.createElement(n.Fragment,null,e.expand||l.show?n.createElement("div",{className:"k-actionsheet-container"},n.createElement("div",{className:"k-overlay",onClick:F}),e.animation?n.createElement(G.Animation,{transitionName:l.slide?"slide-up":"slide-down",onExited:u,transitionEnterDuration:O,transitionExitDuration:O,animationEnteringStyle:e.animationStyles||g.current,animationEnteredStyle:e.animationStyles||g.current,animationExitingStyle:e.animationStyles||g.current,exit:!0,enter:!0,appear:!1},T):T):null)}),N={navigatable:!0,navigatableElements:[]};x.propTypes={items:f.array,subTitle:f.string,title:f.string,navigatable:f.bool,navigatableElements:f.array};x.displayName="KendoReactActionSheet";exports.ActionSheet=x;exports.actionSheetDefaultProps=N;

package/actionsheet/ActionSheet.mjs

@@ -6,166 +6,168 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as e from "react";
-import p from "prop-types";
-import { Animation as g } from "@progress/kendo-react-animation";
-import { validatePackage as N, FOCUSABLE_ELEMENTS as S, Navigation as C, classNames as x } from "@progress/kendo-react-common";
-import { packageMetadata as D } from "../package-metadata.mjs";
-import { ActionSheetItem as E } from "./ActionSheetItem.mjs";
-import { headerDisplayName as v } from "./ActionSheetHeader.mjs";
-import { footerDisplayName as I } from "./ActionSheetFooter.mjs";
-import { contentDisplayName as w } from "./ActionSheetContent.mjs";
-const m = class m extends e.Component {
-  /** @hidden */
-  constructor(n) {
-    super(n), this.actionSheetRef = e.createRef(), this.actionSheetTitleClass = "k-actionsheet-title", this.ariaLabeledBy = this.actionSheetTitleClass, this.animationDuration = 300, this.bottomPosition = { bottom: "0", width: "100%" }, this.handleKeyDown = (t) => {
-      this.props.navigatable && this.navigation.triggerKeyboardEvent(t);
-    }, this.onTab = (t, a, i) => {
-      i.preventDefault(), i.shiftKey ? a.focusPrevious(t) : a.focusNext(t);
-    }, this.handleOverlayClick = (t) => {
-      this.props.onOverlayClick && this.props.onOverlayClick.call(void 0, t), this.props.onClose && this.props.onClose.call(void 0, t), this.props.animation || this.hideActionSheet();
-    }, this.handleItemClick = (t) => {
-      this.props.onItemClick && this.props.onItemClick.call(void 0, t), this.props.onItemSelect && this.props.onItemSelect.call(void 0, t), this.props.animation || this.hideActionSheet();
-    }, this.onEnter = (t, a, i) => {
-      if (t.ariaDisabled)
-        return;
-      const h = t.className && t.className.indexOf ? t.className.indexOf("k-actionsheet-item") !== -1 : !1, l = a.elements.filter((s) => s.className.indexOf("k-actionsheet-item") !== -1);
-      if (h && this.props.onItemClick) {
-        i.preventDefault();
-        const s = this.props.items[l.indexOf(t)];
-        this.props.onItemClick.call(void 0, {
-          syntheticEvent: i,
-          item: s,
-          title: s && s.title
-        });
-      }
-      if (h && this.props.onItemSelect) {
-        i.preventDefault();
-        const s = this.props.items[l.indexOf(t)];
-        this.props.onItemSelect.call(void 0, {
-          syntheticEvent: i,
-          item: s,
-          title: s && s.title
-        });
-      }
-      this.props.animation || this.hideActionSheet();
-    }, this.onEscape = (t, a, i) => {
-      this.props.onOverlayClick && (i.preventDefault(), this.props.onOverlayClick.call(void 0, i)), this.props.onClose && (i.preventDefault(), this.props.onClose.call(void 0, i)), this.props.animation || this.hideActionSheet();
-    }, this.hideActionSheet = () => {
-      this.setState({ show: !1 });
-    }, this.children = (t) => {
-      const a = {};
-      return e.Children.forEach(t, (i) => {
-        i && (a[i.type.displayName] = i);
-      }), a;
-    }, this.state = {
-      show: !1,
-      slide: !1
-    }, N(D);
-  }
-  /** @hidden */
-  componentDidMount() {
-    this.props.expand && !this.state.show && this.setState({ show: !0 });
-  }
-  /** @hidden */
-  componentDidUpdate(n, t) {
-    const a = this.actionSheetRef.current;
-    if (this.props.expand && !this.state.show && this.setState({ show: !0 }), this.props.expand && this.state.show && !this.state.slide && this.setState({ slide: !0 }), !this.props.expand && this.state.show && this.state.slide && this.setState({ slide: !1 }), t !== this.state && this.state.slide && a && !this.props.className && (a.style.setProperty("--kendo-actionsheet-height", "auto"), a.style.setProperty("--kendo-actionsheet-max-height", "none")), a && this.props.navigatable) {
-      const h = [".k-actionsheet-item", ...[
+import * as n from "react";
+import r from "prop-types";
+import { Animation as q } from "@progress/kendo-react-animation";
+import { validatePackage as z, FOCUSABLE_ELEMENTS as G, Navigation as J, classNames as Q } from "@progress/kendo-react-common";
+import { packageMetadata as V } from "../package-metadata.mjs";
+import { ActionSheetItem as w } from "./ActionSheetItem.mjs";
+import { headerDisplayName as T } from "./ActionSheetHeader.mjs";
+import { footerDisplayName as W } from "./ActionSheetFooter.mjs";
+import { contentDisplayName as X } from "./ActionSheetContent.mjs";
+const P = n.forwardRef((e, A) => {
+  var D, R;
+  z(V);
+  const {
+    navigatableElements: K = O.navigatableElements,
+    navigatable: b = O.navigatable
+  } = e, _ = (t, i, a) => {
+    a.preventDefault(), a.shiftKey ? i.focusPrevious(t) : i.focusNext(t);
+  }, H = (t, i, a) => {
+    if (t.ariaDisabled)
+      return;
+    const h = t.className && t.className.indexOf ? t.className.indexOf("k-actionsheet-item") !== -1 : !1, E = i.elements.filter((o) => o.className.indexOf("k-actionsheet-item") !== -1);
+    if (h && e.onItemClick) {
+      a.preventDefault();
+      const o = e.items[E.indexOf(t)];
+      e.onItemClick.call(void 0, {
+        syntheticEvent: a,
+        item: o,
+        title: o && o.title
+      });
+    }
+    if (h && e.onItemSelect) {
+      a.preventDefault();
+      const o = e.items[E.indexOf(t)];
+      e.onItemSelect.call(void 0, {
+        syntheticEvent: a,
+        item: o,
+        title: o && o.title
+      });
+    }
+    e.animation || s();
+  }, L = (t, i, a) => {
+    e.onOverlayClick && (a.preventDefault(), e.onOverlayClick.call(void 0, a)), e.onClose && (a.preventDefault(), e.onClose.call(void 0, a)), e.animation || s();
+  }, s = () => {
+    m({ show: !1 });
+  }, B = (t) => {
+    b && d.current.triggerKeyboardEvent(t);
+  }, F = (t) => {
+    e.onOverlayClick && e.onOverlayClick.call(void 0, t), e.onClose && e.onClose.call(void 0, t), e.animation || s();
+  }, y = (t) => {
+    e.onItemClick && e.onItemClick.call(void 0, t), e.onItemSelect && e.onItemSelect.call(void 0, t), e.animation || s();
+  }, M = (t) => {
+    const i = {};
+    return n.Children.forEach(t, (a) => {
+      a && (i[a.type.displayName] = a);
+    }), i;
+  }, N = n.useRef(null), k = n.useRef(null);
+  n.useImperativeHandle(N, () => ({ props: e })), n.useImperativeHandle(
+    A,
+    () => N.current
+  );
+  const d = n.useRef(), $ = n.useRef(e.animationDuration || 300), v = n.useRef({ bottom: "0", width: "100%" }), g = n.useRef(), [l, U] = n.useState({ show: !1, slide: !1 }), m = (t) => {
+    U((i) => ({ ...i, ...t }));
+  };
+  n.useEffect(() => {
+    e.expand && !l.show && m({ show: !0 });
+  }, []), n.useEffect(() => {
+    const t = k.current;
+    if (e.expand && !l.show && m({ show: !0 }), e.expand && l.show && !l.slide && m({ slide: !0 }), !e.expand && l.show && l.slide && m({ slide: !1 }), g !== l && l.slide && t && !e.className && (t.style.setProperty("--kendo-actionsheet-height", "auto"), t.style.setProperty("--kendo-actionsheet-max-height", "none")), t && b) {
+      const a = [".k-actionsheet-item", ...[
         ".k-actionsheet-footer",
         ".k-actionsheet-content",
         ".k-actionsheet-titlebar"
-      ].map((l) => S.concat(this.props.navigatableElements).map(
-        (s) => `${l} ${s}`
+      ].map((h) => G.concat(K).map(
+        (E) => `${h} ${E}`
       )).flat()];
-      this.navigation = new C({
-        tabIndex: this.props.tabIndex || 0,
-        root: this.actionSheetRef,
+      d.current = new J({
+        tabIndex: e.tabIndex || 0,
+        root: k,
         rovingTabIndex: !1,
-        selectors: h,
+        selectors: a,
         keyboardEvents: {
           keydown: {
-            Tab: this.onTab,
-            Enter: this.onEnter,
-            Escape: this.onEscape
+            Tab: _,
+            Enter: H,
+            Escape: L
           }
         }
-      }), this.navigation.focusElement(this.navigation.first, null);
+      }), d.current.focusElement(d.current.first, null);
     }
-  }
-  /** @hidden */
-  render() {
-    const { title: n, subTitle: t, animationStyles: a, animation: i, expand: h, tabIndex: l, items: s } = this.props, r = s == null ? void 0 : s.filter(
-      (o) => !o.group || o.group === "top"
-    ), d = s == null ? void 0 : s.filter(
-      (o) => o.group === "bottom"
-    ), y = r && r.length > 0 && d && d.length > 0, f = this.children(this.props.children), u = this.props.animationDuration || this.animationDuration, k = this.state.slide && /* @__PURE__ */ e.createElement(
-      "div",
+    g.current = { ...l };
+  });
+  const S = "k-actionsheet-title", x = S, c = (D = e.items) == null ? void 0 : D.filter(
+    (t) => !t.group || t.group === "top"
+  ), f = (R = e.items) == null ? void 0 : R.filter(
+    (t) => t.group === "bottom"
+  ), j = c && c.length > 0 && f && f.length > 0, u = M(e.children), C = e.animationDuration || $.current, I = l.slide && /* @__PURE__ */ n.createElement(
+    "div",
+    {
+      className: Q("k-actionsheet", e.className, {
+        "k-actionsheet-bottom": !e.className
+      }),
+      role: "dialog",
+      "aria-modal": "true",
+      "aria-hidden": !1,
+      "aria-labelledby": x,
+      ref: k,
+      onKeyDown: B
+    },
+    u[T] && !e.title && !e.subTitle && u[T],
+    (e.title || e.subTitle) && /* @__PURE__ */ n.createElement("div", { className: "k-actionsheet-titlebar k-text-center" }, /* @__PURE__ */ n.createElement("div", { className: "k-actionsheet-titlebar-group k-hbox" }, /* @__PURE__ */ n.createElement("div", { className: S, id: x }, e.title && /* @__PURE__ */ n.createElement("div", null, e.title), e.subTitle && /* @__PURE__ */ n.createElement("div", { className: "k-actionsheet-subtitle" }, e.subTitle)))),
+    u[X] || /* @__PURE__ */ n.createElement("div", { className: "k-actionsheet-content" }, /* @__PURE__ */ n.createElement("div", { className: "k-list-ul", role: "group" }, c && c.map((t, i) => /* @__PURE__ */ n.createElement(
+      w,
       {
-        className: x("k-actionsheet", this.props.className, {
-          "k-actionsheet-bottom": !this.props.className
-        }),
-        role: "dialog",
-        "aria-modal": "true",
-        "aria-hidden": !1,
-        "aria-labelledby": this.ariaLabeledBy,
-        ref: this.actionSheetRef,
-        onKeyDown: this.handleKeyDown
-      },
-      f[v] && !n && !t && f[v],
-      (n || t) && /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-titlebar k-text-center" }, /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-titlebar-group k-hbox" }, /* @__PURE__ */ e.createElement("div", { className: this.actionSheetTitleClass, id: this.ariaLabeledBy }, n && /* @__PURE__ */ e.createElement("div", null, n), t && /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-subtitle" }, t)))),
-      f[w] || /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-content" }, /* @__PURE__ */ e.createElement("div", { className: "k-list-ul", role: "group" }, r && r.map((o, c) => /* @__PURE__ */ e.createElement(
-        E,
-        {
-          ...o,
-          id: c,
-          key: c,
-          item: o,
-          tabIndex: l || 0,
-          onClick: this.handleItemClick
-        }
-      ))), y && /* @__PURE__ */ e.createElement("hr", { className: "k-hr" }), /* @__PURE__ */ e.createElement("div", { className: "k-list-ul", role: "group" }, d && d.map((o, c) => /* @__PURE__ */ e.createElement(
-        E,
-        {
-          ...o,
-          id: c + ((r == null ? void 0 : r.length) || 0),
-          key: c,
-          item: o,
-          tabIndex: l || 0,
-          onClick: this.handleItemClick
-        }
-      )))),
-      f[I]
-    );
-    return /* @__PURE__ */ e.createElement(e.Fragment, null, h || this.state.show ? /* @__PURE__ */ e.createElement("div", { className: "k-actionsheet-container" }, /* @__PURE__ */ e.createElement("div", { className: "k-overlay", onClick: this.handleOverlayClick }), i ? /* @__PURE__ */ e.createElement(
-      g,
+        ...t,
+        id: i,
+        key: i,
+        item: t,
+        tabIndex: e.tabIndex || 0,
+        onClick: y
+      }
+    ))), j && /* @__PURE__ */ n.createElement("hr", { className: "k-hr" }), /* @__PURE__ */ n.createElement("div", { className: "k-list-ul", role: "group" }, f && f.map((t, i) => /* @__PURE__ */ n.createElement(
+      w,
       {
-        transitionName: this.state.slide ? "slide-up" : "slide-down",
-        onExited: this.hideActionSheet,
-        transitionEnterDuration: u,
-        transitionExitDuration: u,
-        animationEnteringStyle: a || this.bottomPosition,
-        animationEnteredStyle: a || this.bottomPosition,
-        animationExitingStyle: a || this.bottomPosition,
-        exit: !0,
-        enter: !0,
-        appear: !1
-      },
-      k
-    ) : k) : null);
-  }
-};
-m.displayName = "KendoReactActionSheet", m.propTypes = {
-  items: p.array,
-  subTitle: p.string,
-  title: p.string,
-  navigatable: p.bool,
-  navigatableElements: p.array
-}, m.defaultProps = {
+        ...t,
+        id: i + ((c == null ? void 0 : c.length) || 0),
+        key: i,
+        item: t,
+        tabIndex: e.tabIndex || 0,
+        onClick: y
+      }
+    )))),
+    u[W]
+  );
+  return /* @__PURE__ */ n.createElement(n.Fragment, null, e.expand || l.show ? /* @__PURE__ */ n.createElement("div", { className: "k-actionsheet-container" }, /* @__PURE__ */ n.createElement("div", { className: "k-overlay", onClick: F }), e.animation ? /* @__PURE__ */ n.createElement(
+    q,
+    {
+      transitionName: l.slide ? "slide-up" : "slide-down",
+      onExited: s,
+      transitionEnterDuration: C,
+      transitionExitDuration: C,
+      animationEnteringStyle: e.animationStyles || v.current,
+      animationEnteredStyle: e.animationStyles || v.current,
+      animationExitingStyle: e.animationStyles || v.current,
+      exit: !0,
+      enter: !0,
+      appear: !1
+    },
+    I
+  ) : I) : null);
+}), O = {
   navigatable: !0,
   navigatableElements: []
 };
-let b = m;
+P.propTypes = {
+  items: r.array,
+  subTitle: r.string,
+  title: r.string,
+  navigatable: r.bool,
+  navigatableElements: r.array
+};
+P.displayName = "KendoReactActionSheet";
 export {
-  b as ActionSheet
+  P as ActionSheet,
+  O as actionSheetDefaultProps
 };