@progress/kendo-react-layout 7.2.4-develop.3 → 7.2.4-develop.4

package/splitter/Splitter.mjs

@@ -0,0 +1,238 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";
+import * as S from "react";
+import { SplitterPane as T } from "./SplitterPane.mjs";
+import { SplitterBar as b } from "./SplitterBar.mjs";
+import { validatePackage as w, classNames 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 _ } from "@progress/kendo-react-intl";
+const k = {
+  collapsible: !1,
+  collapsed: !1,
+  resizable: !0,
+  scrollable: !0
+}, K = 150, D = class D extends S.Component {
+  /**
+   * @hidden
+   */
+  constructor(s) {
+    super(s), 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++) {
+        let o = !1;
+        const p = e[n];
+        S.isValidElement(p) && (o = p.type.displayName === "Splitter");
+        let h = !1;
+        a && r !== void 0 && (h = r === n || r + 1 === n), l.push({
+          ...k,
+          orientation: i,
+          containsSplitter: o,
+          overlay: h,
+          ...(t || [])[n]
+        });
+      }
+      return l;
+    }, this.mapSplitterPanes = (t, e) => {
+      const i = _(this).toLanguageString(O, R[O]);
+      return t.map((r, a) => {
+        let l;
+        const n = a * 2, o = n + 1;
+        if (a + 1 < t.length) {
+          const h = t[a + 1];
+          l = /* @__PURE__ */ S.createElement(
+            b,
+            {
+              key: o,
+              index: a,
+              orientation: r.orientation,
+              prev: r,
+              next: h,
+              ariaLabel: i,
+              onDrag: this.onBarDragResize,
+              onToggle: this.onBarToggle,
+              onKeyboardResize: this.onBarKeyboardResize,
+              isRtl: this.isRtl
+            }
+          );
+        }
+        return [/* @__PURE__ */ S.createElement(
+          T,
+          {
+            key: n,
+            ...r
+          },
+          e[a]
+        ), l];
+      });
+    }, this.onBarToggle = (t, e) => {
+      const r = this.panesOptions(this.panesContent).map((a, l) => {
+        const n = this.getPaneProps(a);
+        return l === t ? {
+          ...n,
+          collapsed: !a.collapsed
+        } : {
+          ...n
+        };
+      });
+      this.props.onChange && this.props.onChange({
+        newState: r,
+        isLast: !0,
+        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);
+      if (!p || !h)
+        return;
+      if (r) {
+        this.setState({
+          isDragging: !0,
+          dragIndex: i,
+          startTime: l,
+          originalX: n,
+          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) {
+        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();
+    }, 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);
+    }, 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, w(N), this.state = {
+      isDragging: !1,
+      dragIndex: void 0,
+      startTime: 0,
+      originalX: 0,
+      originalY: 0,
+      originalPrevSize: 0,
+      originalNextSize: 0,
+      panes: s.defaultPanes || []
+    };
+  }
+  get isControlledState() {
+    return this.props.panes !== void 0;
+  }
+  get panes() {
+    return this.panesDuringOnChange !== void 0 ? this.panesDuringOnChange : this.isControlledState ? this.props.panes : this.state.panes;
+  }
+  get orientation() {
+    return this.props.orientation || "horizontal";
+  }
+  get isRtl() {
+    return this._container && getComputedStyle(this._container).direction === "rtl" || !1;
+  }
+  get panesContent() {
+    return S.Children.toArray(this.props.children).filter((s) => s);
+  }
+  /**
+   * @hidden
+   */
+  render() {
+    const s = this.panesContent, t = this.panesOptions(s), e = B(
+      "k-widget",
+      "k-splitter",
+      "k-splitter-flex",
+      `k-splitter-${this.orientation}`,
+      this.props.className
+    );
+    return this.validatePanes(t), /* @__PURE__ */ S.createElement(
+      "div",
+      {
+        style: this.props.style,
+        ref: (i) => this._container = i,
+        className: e
+      },
+      this.mapSplitterPanes(t, s)
+    );
+  }
+  surroudingPanes(s) {
+    return {
+      prevElement: s.previousElementSibling,
+      nextElement: s.nextElementSibling
+    };
+  }
+  isPercent(s) {
+    return /%$/.test(s);
+  }
+  toPixels(s, t) {
+    let e = parseInt(s, 10);
+    return this.isPercent(s) && (e = t * e / 100), e;
+  }
+  resetDragState() {
+    this.setState({
+      isDragging: !1,
+      dragIndex: void 0,
+      startTime: 0,
+      originalX: 0,
+      originalY: 0,
+      originalPrevSize: 0,
+      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,
+      initialSize: e,
+      min: g(o.min) || h - g(p.max) || 0,
+      max: g(o.max) || h - g(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);
+      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) => {
+      const z = this.getPaneProps(m);
+      return v === s ? {
+        ...z,
+        size: c
+      } : v === t ? {
+        ...z,
+        size: x
+      } : {
+        ...z
+      };
+    });
+    this.panesDuringOnChange = C, this.isControlledState || this.setState({
+      panes: C
+    }), this.props.onChange && this.props.onChange({
+      newState: C,
+      isLast: a,
+      nativeEvent: l
+    }), this.panesDuringOnChange = void 0;
+  }
+  getPaneProps(s) {
+    const { orientation: t, overlay: e, containsSplitter: i, ...r } = s;
+    return r;
+  }
+};
+D.displayName = "Splitter";
+let y = D;
+export {
+  y as Splitter
+};

package/splitter/SplitterBar.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * 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 d=require("react"),r=require("@progress/kendo-react-common"),a=require("@progress/kendo-svg-icons");function u(c){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const t in c)if(t!=="default"){const e=Object.getOwnPropertyDescriptor(c,t);Object.defineProperty(o,t,e.get?e:{enumerable:!0,get:()=>c[t]})}}return o.default=c,Object.freeze(o)}const n=u(d);class f extends n.Component{constructor(o){super(o),this.draggable=null,this.onDrag=(t,e,l)=>{const{event:s}=t,{onDrag:i,index:p}=this.props,h=this.draggable&&this.draggable.element;h&&!this.isStatic&&this.isDraggable&&i(s,h,p,e,l)},this.onFocus=()=>{this.setState({focused:!0})},this.onBlur=()=>{this.setState({focused:!1})},this.onToggle=t=>{const{onToggle:e,index:l,prev:s,next:i}=this.props;(s.collapsible||i.collapsible)&&e(s.collapsible?l:l+1,t)},this.onPrevToggle=t=>{const{onToggle:e,index:l,prev:s}=this.props;s.collapsible&&e(l,t)},this.onNextToggle=t=>{const{onToggle:e,index:l,next:s}=this.props;s.collapsible&&e(l+1,t)},this.onKeyDown=t=>{const e=t&&t.keyCode,l=this.isHorizontal,{index:s}=this.props,i=this.draggable&&this.draggable.element,p=(h,g,b)=>{t.preventDefault(),this.props.onKeyboardResize(h,g,b,t)};i&&(e===r.Keys.enter?(t.preventDefault(),this.onToggle(t)):this.isDraggable&&(l&&e===r.Keys.left?p(i,s,-10):l&&e===r.Keys.right?p(i,s,10):!l&&e===r.Keys.up?p(i,s,-10):!l&&e===r.Keys.down&&p(i,s,10)))},this.state={focused:!1}}get isStatic(){const{prev:o,next:t}=this.props,e=o.resizable&&t.resizable,l=o.collapsible||t.collapsible;return!e&&!l}get isDraggable(){const{prev:o,next:t}=this.props,e=o.resizable&&t.resizable,l=o.collapsed||t.collapsed;return!!e&&!l}get isHorizontal(){return this.props.orientation==="horizontal"}render(){const o=this.isDraggable,t=this.isStatic,e=this.isHorizontal,l=r.classNames("k-splitbar",{"k-focus":this.state.focused,"k-splitbar-horizontal":e,"k-splitbar-vertical":!e,"k-splitbar-draggable-horizontal":e&&o,"k-splitbar-draggable-vertical":!e&&o,"k-splitbar-static-horizontal":e&&t,"k-splitbar-static-vertical":!e&&t});return n.createElement(r.Draggable,{onPress:s=>this.onDrag(s,!0,!1),onDrag:s=>this.onDrag(s,!1,!1),onRelease:s=>this.onDrag(s,!1,!0),ref:s=>{this.draggable=s}},n.createElement("div",{tabIndex:t?-1:0,role:"separator","aria-valuenow":0,"aria-label":this.props.ariaLabel,"aria-orientation":e?"vertical":void 0,className:l,style:{touchAction:"none"},onFocus:this.onFocus,onBlur:this.onBlur,onDoubleClick:this.onToggle,onKeyDown:this.onKeyDown},this.props.prev.collapsible&&n.createElement("div",{className:"k-collapse-prev",onClick:this.onPrevToggle},n.createElement(r.IconWrap,{name:this.props.prev.collapsible?e?this.props.prev.collapsed?this.props.isRtl?"caret-alt-left":"caret-alt-right":this.props.isRtl?"caret-alt-right":"caret-alt-left":this.props.prev.collapsed?"caret-alt-down":"caret-alt-up":void 0,icon:this.props.prev.collapsible?e?this.props.prev.collapsed?this.props.isRtl?a.caretAltLeftIcon:a.caretAltRightIcon:this.props.isRtl?a.caretAltRightIcon:a.caretAltLeftIcon:this.props.prev.collapsed?a.caretAltDownIcon:a.caretAltUpIcon:void 0,size:"xsmall"})),n.createElement("div",{className:"k-resize-handle"}),this.props.next.collapsible&&n.createElement("div",{className:"k-collapse-next",onClick:this.onNextToggle},n.createElement(r.IconWrap,{name:this.props.next.collapsible?e?this.props.next.collapsed?this.props.isRtl?"caret-alt-right":"caret-alt-left":this.props.isRtl?"caret-alt-left":"caret-alt-right":this.props.next.collapsed?"caret-alt-up":"caret-alt-down":void 0,icon:this.props.next.collapsible?e?this.props.next.collapsed?this.props.isRtl?a.caretAltRightIcon:a.caretAltLeftIcon:this.props.isRtl?a.caretAltLeftIcon:a.caretAltRightIcon:this.props.next.collapsed?a.caretAltUpIcon:a.caretAltDownIcon:void 0,size:"xsmall"}))))}}exports.SplitterBar=f;

package/splitter/SplitterBar.mjs

@@ -0,0 +1,129 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";
+import * as a from "react";
+import { Keys as n, classNames as m, Draggable as v, IconWrap as g } from "@progress/kendo-react-common";
+import { caretAltLeftIcon as c, caretAltRightIcon as h, caretAltDownIcon as b, caretAltUpIcon as d } from "@progress/kendo-svg-icons";
+class k extends a.Component {
+  constructor(o) {
+    super(o), this.draggable = null, this.onDrag = (t, e, l) => {
+      const { event: s } = t, { onDrag: i, index: r } = this.props, p = this.draggable && this.draggable.element;
+      p && !this.isStatic && this.isDraggable && i(s, p, r, e, l);
+    }, this.onFocus = () => {
+      this.setState({
+        focused: !0
+      });
+    }, this.onBlur = () => {
+      this.setState({
+        focused: !1
+      });
+    }, this.onToggle = (t) => {
+      const { onToggle: e, index: l, prev: s, next: i } = this.props;
+      (s.collapsible || i.collapsible) && e(s.collapsible ? l : l + 1, t);
+    }, this.onPrevToggle = (t) => {
+      const { onToggle: e, index: l, prev: s } = this.props;
+      s.collapsible && e(l, t);
+    }, this.onNextToggle = (t) => {
+      const { onToggle: e, index: l, next: s } = this.props;
+      s.collapsible && e(l + 1, t);
+    }, this.onKeyDown = (t) => {
+      const e = t && t.keyCode, l = this.isHorizontal, { index: s } = this.props, i = this.draggable && this.draggable.element, r = (p, f, u) => {
+        t.preventDefault(), this.props.onKeyboardResize(p, f, u, t);
+      };
+      i && (e === n.enter ? (t.preventDefault(), this.onToggle(t)) : this.isDraggable && (l && e === n.left ? r(i, s, -10) : l && e === n.right ? r(i, s, 10) : !l && e === n.up ? r(i, s, -10) : !l && e === n.down && r(i, s, 10)));
+    }, this.state = {
+      focused: !1
+    };
+  }
+  get isStatic() {
+    const { prev: o, next: t } = this.props, e = o.resizable && t.resizable, l = o.collapsible || t.collapsible;
+    return !e && !l;
+  }
+  get isDraggable() {
+    const { prev: o, next: t } = this.props, e = o.resizable && t.resizable, l = o.collapsed || t.collapsed;
+    return !!e && !l;
+  }
+  get isHorizontal() {
+    return this.props.orientation === "horizontal";
+  }
+  render() {
+    const o = this.isDraggable, t = this.isStatic, e = this.isHorizontal, l = m(
+      "k-splitbar",
+      {
+        "k-focus": this.state.focused,
+        "k-splitbar-horizontal": e,
+        "k-splitbar-vertical": !e,
+        "k-splitbar-draggable-horizontal": e && o,
+        "k-splitbar-draggable-vertical": !e && o,
+        "k-splitbar-static-horizontal": e && t,
+        "k-splitbar-static-vertical": !e && t
+      }
+    );
+    return /* @__PURE__ */ a.createElement(
+      v,
+      {
+        onPress: (s) => this.onDrag(s, !0, !1),
+        onDrag: (s) => this.onDrag(s, !1, !1),
+        onRelease: (s) => this.onDrag(s, !1, !0),
+        ref: (s) => {
+          this.draggable = s;
+        }
+      },
+      /* @__PURE__ */ a.createElement(
+        "div",
+        {
+          tabIndex: t ? -1 : 0,
+          role: "separator",
+          "aria-valuenow": 0,
+          "aria-label": this.props.ariaLabel,
+          "aria-orientation": e ? "vertical" : void 0,
+          className: l,
+          style: { touchAction: "none" },
+          onFocus: this.onFocus,
+          onBlur: this.onBlur,
+          onDoubleClick: this.onToggle,
+          onKeyDown: this.onKeyDown
+        },
+        this.props.prev.collapsible && /* @__PURE__ */ a.createElement(
+          "div",
+          {
+            className: "k-collapse-prev",
+            onClick: this.onPrevToggle
+          },
+          /* @__PURE__ */ a.createElement(
+            g,
+            {
+              name: this.props.prev.collapsible ? e ? this.props.prev.collapsed ? this.props.isRtl ? "caret-alt-left" : "caret-alt-right" : this.props.isRtl ? "caret-alt-right" : "caret-alt-left" : this.props.prev.collapsed ? "caret-alt-down" : "caret-alt-up" : void 0,
+              icon: this.props.prev.collapsible ? e ? this.props.prev.collapsed ? this.props.isRtl ? c : h : this.props.isRtl ? h : c : this.props.prev.collapsed ? b : d : void 0,
+              size: "xsmall"
+            }
+          )
+        ),
+        /* @__PURE__ */ a.createElement("div", { className: "k-resize-handle" }),
+        this.props.next.collapsible && /* @__PURE__ */ a.createElement(
+          "div",
+          {
+            className: "k-collapse-next",
+            onClick: this.onNextToggle
+          },
+          /* @__PURE__ */ a.createElement(
+            g,
+            {
+              name: this.props.next.collapsible ? e ? this.props.next.collapsed ? this.props.isRtl ? "caret-alt-right" : "caret-alt-left" : this.props.isRtl ? "caret-alt-left" : "caret-alt-right" : this.props.next.collapsed ? "caret-alt-up" : "caret-alt-down" : void 0,
+              icon: this.props.next.collapsible ? e ? this.props.next.collapsed ? this.props.isRtl ? h : c : this.props.isRtl ? c : h : this.props.next.collapsed ? d : b : void 0,
+              size: "xsmall"
+            }
+          )
+        )
+      )
+    );
+  }
+}
+export {
+  k as SplitterBar
+};

package/splitter/SplitterPane.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * 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 m=require("react"),b=require("@progress/kendo-react-common");function k(t){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const n=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(l,e,n.get?n:{enumerable:!0,get:()=>t[e]})}}return l.default=t,Object.freeze(l)}const s=k(m);class g extends s.Component{render(){const{id:l,size:e,collapsed:n,overlay:r,containsSplitter:a,collapsible:o,resizable:c,scrollable:i,keepMounted:p}=this.props,d=e&&e.length>0,u={flexBasis:e},f=b.classNames("k-pane",{"k-hidden":n,hidden:n,"k-pane-flex":a,"k-pane-static":!c&&!o||d,"k-scrollable":i});return s.createElement("div",{id:l,role:"group",style:u,className:f},!n||p?this.props.children:void 0,r?s.createElement("div",{className:"k-splitter-overlay k-overlay"}):void 0)}}exports.SplitterPane=g;

package/splitter/SplitterPane.mjs

@@ -0,0 +1,50 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";
+import * as l from "react";
+import { classNames as k } from "@progress/kendo-react-common";
+class f extends l.Component {
+  render() {
+    const {
+      id: t,
+      size: e,
+      collapsed: s,
+      overlay: a,
+      containsSplitter: o,
+      collapsible: r,
+      resizable: i,
+      scrollable: n,
+      keepMounted: c
+    } = this.props, p = e && e.length > 0, d = {
+      flexBasis: e
+    }, m = k(
+      "k-pane",
+      {
+        "k-hidden": s,
+        hidden: s,
+        "k-pane-flex": o,
+        "k-pane-static": !i && !r || p,
+        "k-scrollable": n
+      }
+    );
+    return /* @__PURE__ */ l.createElement(
+      "div",
+      {
+        id: t,
+        role: "group",
+        style: d,
+        className: m
+      },
+      !s || c ? this.props.children : void 0,
+      a ? /* @__PURE__ */ l.createElement("div", { className: "k-splitter-overlay k-overlay" }) : void 0
+    );
+  }
+}
+export {
+  f as SplitterPane
+};

package/splitter/messages/index.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * 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 e="splitBarLabel",s={[e]:"split bar"};exports.messages=s;exports.splitBarLabel=e;

package/splitter/messages/index.mjs

@@ -0,0 +1,15 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";
+const s = "splitBarLabel", e = {
+  [s]: "split bar"
+};
+export {
+  e as messages,
+  s as splitBarLabel
+};

package/stacklayout/StackLayout.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * 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 j=require("react"),n=require("prop-types"),O=require("../package-metadata.js"),d=require("@progress/kendo-react-common");function z(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=z(j),g=i.forwardRef((t,s)=>{d.validatePackage(O.packageMetadata);const c=i.useRef(null),l=i.useCallback(()=>({element:c.current}),[]);i.useImperativeHandle(s,l);const{className:m,style:f,id:y,children:k}=t,h=d.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(()=>d.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"},m),[r,e,a,o,m]),v={gap:`${typeof t.gap=="number"?t.gap+"px":t.gap}`,...f};return i.createElement("div",{ref:c,className:b,style:v,id:y||h},k)}),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.defaultProps=u;g.displayName="KendoReactStackLayout";exports.StackLayout=g;

package/stacklayout/StackLayout.mjs

@@ -0,0 +1,84 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";
+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";
+const c = o.forwardRef((e, g) => {
+  b(z);
+  const r = o.useRef(null), d = o.useCallback(
+    () => ({
+      element: r.current
+    }),
+    []
+  );
+  o.useImperativeHandle(g, d);
+  const { className: m, style: u, id: h, children: k } = e, f = A(), 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]
+  ), y = o.useMemo(
+    () => j(
+      "k-stack-layout",
+      {
+        "k-hstack": s === "horizontal",
+        "k-vstack": s === "vertical",
+        "k-justify-content-start": t && a === "start" || !t && i === "top",
+        "k-justify-content-center": t && a === "center" || !t && i === "middle",
+        "k-justify-content-end": t && a === "end" || !t && i === "bottom",
+        "k-justify-content-stretch": t && a === "stretch" || !t && i === "stretch",
+        "k-align-items-start": !t && a === "start" || t && i === "top",
+        "k-align-items-center": !t && a === "center" || t && i === "middle",
+        "k-align-items-end": !t && a === "end" || t && i === "bottom",
+        "k-align-items-stretch": !t && a === "stretch" || t && i === "stretch"
+      },
+      m
+    ),
+    [s, t, a, i, m]
+  ), v = {
+    gap: `${typeof e.gap == "number" ? e.gap + "px" : e.gap}`,
+    ...u
+  };
+  return /* @__PURE__ */ o.createElement(
+    "div",
+    {
+      ref: r,
+      className: y,
+      style: v,
+      id: h || f
+    },
+    k
+  );
+}), l = {
+  orientation: "horizontal",
+  hAlign: "stretch",
+  vAlign: "stretch"
+};
+c.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"])
+  })
+};
+c.defaultProps = l;
+c.displayName = "KendoReactStackLayout";
+export {
+  c as StackLayout
+};

package/stepper/Step.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * 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 te=require("react"),n=require("prop-types"),ne=require("./context/StepperContext.js"),c=require("@progress/kendo-react-common"),ae=require("@progress/kendo-react-intl"),D=require("@progress/kendo-svg-icons"),L=require("./contants.js"),P=require("./messages/index.js");function se(s){const d=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const l in s)if(l!=="default"){const p=Object.getOwnPropertyDescriptor(s,l);Object.defineProperty(d,l,p.get?p:{enumerable:!0,get:()=>s[l]})}}return d.default=s,Object.freeze(d)}const e=se(te),f=e.forwardRef((s,d)=>{const{children:l,className:p,current:v,disabled:o,focused:I,icon:m,svgIcon:O,index:a,isValid:t,label:b,optional:g,style:M,tabIndex:T,text:q,..._}=s,{animationDuration:N,isVertical:x,item:z,linear:V,mode:F,numOfSteps:i,value:r,onChange:E,onFocus:C,successIcon:w,errorIcon:H,successSVGIcon:W,errorSVGIcon:$}=e.useContext(ne.StepperContext),k=e.useRef(null),R=e.useCallback(()=>{k.current&&c.focusFirstFocusableChild(k.current)},[]),S=e.useCallback(()=>({element:k.current,focus:R}),[R]);e.useImperativeHandle(d,S);const h=!V||a===r-1||a===r||a===r+1,A=F==="labels"||!!m&&!!b,B=ae.useLocalization(),G=(u=>B.toLanguageString(u,P.messages[u]))(P.optionalText),U=typeof N=="number"?N:N!==!1?L.DEFAULT_ANIMATION_DURATION:L.NO_ANIMATION,K=e.useCallback(u=>{E&&!o&&c.dispatchEvent(E,u,S(),{value:a})},[E,r,o]),J=e.useCallback(u=>{C&&!o&&c.dispatchEvent(C,u,S(),void 0)},[C,o]),Q=e.useMemo(()=>c.classNames("k-step",{"k-step-first":a===0,"k-step-last":i&&a===i-1,"k-step-done":a<r,"k-step-current":v,"k-step-optional":g,"k-step-error":t!==void 0&&!t,"k-step-success":t},{"k-disabled":o,"k-focus":I},p),[a,i,r,v,g,o,I,t,p]),X=e.useMemo(()=>({maxWidth:x?void 0:`calc(100% / ${i})`,maxHeight:x?`calc(100% / ${i})`:void 0,pointerEvents:h?void 0:"none",...M}),[x,i,M,h]),j=t?w:H,y=j?e.createElement("span",{className:"k-step-indicator-icon "+j,"aria-hidden":"true"}):e.createElement(c.IconWrap,{className:"k-step-indicator-icon",name:t?"check-circle":"exclamation-circle",icon:t?W||D.checkOutlineIcon:$||D.exclamationCircleIcon}),Y=e.createElement(e.Fragment,null,F!=="labels"?e.createElement("span",{className:"k-step-indicator","aria-hidden":!0,style:{transitionDuration:U+"ms"}},m||O?!A&&t!==void 0?y:e.createElement(c.IconWrap,{className:"k-step-indicator-icon",name:m&&c.toIconName(m),icon:O}):t!==void 0?y:e.createElement("span",{className:"k-step-indicator-text"},q||a+1)):null),Z=e.createElement("span",{className:"k-step-label"},b&&e.createElement("span",{className:"k-step-text"},b),A&&t!==void 0&&y,g&&e.createElement("span",{className:"k-step-label-optional"},G)),ee=e.createElement(e.Fragment,null,Y,Z);return e.createElement("li",{ref:k,className:Q,style:X,..._},e.createElement("a",{className:"k-step-link",title:b||void 0,onClick:K,onFocus:J,tabIndex:T||(I?0:-1),"aria-current":v,"aria-disabled":o||!h||void 0,"aria-invalid":t!==void 0&&!t||void 0},z?l:ee))});f.propTypes={children:n.any,className:n.string,current:n.bool,disabled:n.bool,icon:n.string,index:n.number,isValid:n.bool,label:n.string,optional:n.bool,style:n.object,tabIndex:n.number,text:n.string};const oe={tabIndex:0};f.defaultProps=oe;f.displayName="KendoStep";exports.Step=f;