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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6,59 +6,83 @@
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
8
  "use client";
9
- import * as p from "react";
10
- import a from "prop-types";
11
- import { PanelBarItem as u } from "./PanelBarItem.mjs";
12
- import { flatChildren as x, isArrayEqual as g, flatVisibleChildren as k, getInitialState as P, getFirstId as I, renderChildren as b } from "./util.mjs";
13
- import { Keys as d, validatePackage as v, shouldShowValidationUI as w, classNames as S, WatermarkOverlay as K } from "@progress/kendo-react-common";
14
- import { packageMetadata as m } from "../package-metadata.mjs";
15
- import { NavigationAction as n } from "./interfaces/NavigationAction.mjs";
16
- const c = class c extends p.Component {
17
- constructor(i) {
18
- super(i), this._element = null, this.showLicenseWatermark = !1, this.handleSelect = (t) => {
9
+ import * as c from "react";
10
+ import o from "prop-types";
11
+ import { PanelBarItem as m } from "./PanelBarItem.mjs";
12
+ import { flatChildren as k, isArrayEqual as P, flatVisibleChildren as b, getFocusedChild as I, getInitialState as S, getFirstId as K, renderChildren as v } from "./util.mjs";
13
+ import { Keys as l, validatePackage as w, shouldShowValidationUI as F, classNames as q, WatermarkOverlay as C } from "@progress/kendo-react-common";
14
+ import { packageMetadata as y } from "../package-metadata.mjs";
15
+ import { NavigationAction as r } from "./interfaces/NavigationAction.mjs";
16
+ const h = class h extends c.Component {
17
+ constructor(a) {
18
+ super(a), this._element = null, this.showLicenseWatermark = !1, this.handleSelect = (t) => {
19
19
  this.onSelect(t), this.onFocus(t);
20
20
  }, this.onSelect = (t) => {
21
- const r = x(p.Children.toArray(this.children));
22
- let s, e;
23
- switch (r.forEach((l) => {
24
- l.props.uniquePrivateKey === (t.uniquePrivateKey || this.state.focused) && (s = l);
21
+ const n = k(c.Children.toArray(this.children));
22
+ let s, i;
23
+ switch (n.forEach((e) => {
24
+ e.props.uniquePrivateKey === (t.uniquePrivateKey || this.state.focused) && (s = e);
25
25
  }), this.expandMode) {
26
26
  case "single":
27
- e = [...s.props.parentUniquePrivateKey, s.props.uniquePrivateKey], g(this.expandedItems, e) && (s.props.parentUniquePrivateKey ? e = [...s.props.parentUniquePrivateKey] : e = []);
27
+ i = [...s.props.parentUniquePrivateKey, s.props.uniquePrivateKey], P(this.expandedItems, i) && (s.props.parentUniquePrivateKey ? i = [...s.props.parentUniquePrivateKey] : i = []);
28
28
  break;
29
29
  case "multiple": {
30
- e = this.expandedItems.slice();
31
- const l = e.indexOf(s.props.uniquePrivateKey);
32
- l === -1 ? e.push(s.props.uniquePrivateKey) : e.splice(l, 1);
30
+ i = this.expandedItems.slice();
31
+ const e = i.indexOf(s.props.uniquePrivateKey);
32
+ e === -1 ? i.push(s.props.uniquePrivateKey) : i.splice(e, 1);
33
33
  break;
34
34
  }
35
35
  default:
36
- e = this.expandedItems.slice();
36
+ i = this.expandedItems.slice();
37
37
  break;
38
38
  }
39
- this.setState({ selected: s.props.uniquePrivateKey, expanded: e }), this.props.onSelect && this.props.onSelect.call(void 0, {
39
+ this.setState({ selected: s.props.uniquePrivateKey, expanded: i }), this.props.onSelect && this.props.onSelect.call(void 0, {
40
40
  target: s,
41
- expandedItems: e
41
+ expandedItems: i
42
42
  });
43
- }, this.onFocus = (t, r = 0) => {
44
- const s = k(p.Children.toArray(this.children));
45
- let e;
46
- s.forEach((l, h) => {
47
- if (l.props.uniquePrivateKey === (t.uniquePrivateKey || this.state.focused)) {
48
- const y = h + r < 0 ? 0 : h + r > s.length ? s.length - 1 : h + r;
49
- e = s[y];
50
- }
51
- }), e && (this.activeDescendant = e.props.id, this.setState({ focused: e.props.uniquePrivateKey }));
52
- }, this.onNavigate = (t, r) => {
43
+ }, this.onFocus = (t, n = 0, s) => {
44
+ const i = b(c.Children.toArray(this.children)), e = I(i, n, t, this.state.focused, s);
45
+ if (e) {
46
+ const d = this.expandedItems.slice();
47
+ if (s === r.Right && e && e.props && e.props.children && e.props.children.length > 0) {
48
+ if (d.push(e.props.uniquePrivateKey), this.setState({ expanded: [...new Set(d)] }), e.props.expanded) {
49
+ const u = e.props.children[0].props.uniquePrivateKey;
50
+ this.setState({ focused: u });
51
+ }
52
+ } else if (s === r.Left && (e && e.props && e.props.parentUniquePrivateKey && e.props.parentUniquePrivateKey.length > 0 || e && e.props && !e.props.disabled && e.props.children && e.props.children.length > 0)) {
53
+ const u = e.props.parentUniquePrivateKey;
54
+ if (e.props.expanded) {
55
+ const f = e.props.uniquePrivateKey, g = d.indexOf(f);
56
+ d.splice(g, 1), this.setState({ expanded: d });
57
+ } else if (e.props.level > 0) {
58
+ const f = e.props.parentUniquePrivateKey[u.length - 1];
59
+ this.setState({ focused: f });
60
+ }
61
+ } else
62
+ this.activeDescendant = e.props.id, this.setState({ focused: e.props.uniquePrivateKey });
63
+ }
64
+ }, this.onNavigate = (t, n) => {
53
65
  let s;
54
- switch (r) {
55
- case n.Previous:
66
+ switch (n) {
67
+ case r.First:
68
+ this.onFocus(t, s, r.First);
69
+ break;
70
+ case r.Last:
71
+ this.onFocus(t, s, r.Last);
72
+ break;
73
+ case r.Left:
74
+ this.onFocus(t, s, r.Left);
75
+ break;
76
+ case r.Right:
77
+ this.onFocus(t, s, r.Right);
78
+ break;
79
+ case r.Previous:
56
80
  s = -1, this.onFocus(t, s);
57
81
  break;
58
- case n.Next:
82
+ case r.Next:
59
83
  s = 1, this.onFocus(t, s);
60
84
  break;
61
- case n.Toggle:
85
+ case r.Toggle:
62
86
  this.onSelect(t);
63
87
  break;
64
88
  }
@@ -69,69 +93,75 @@ const c = class c extends p.Component {
69
93
  this.setState({ wrapperFocused: !1 });
70
94
  });
71
95
  }, this.handleKeyDown = (t) => {
72
- const r = this._element && getComputedStyle(this._element).direction === "rtl" || !1;
96
+ const n = this._element && getComputedStyle(this._element).direction === "rtl" || !1;
73
97
  if (t.target === t.currentTarget) {
74
98
  const s = t.keyCode;
75
- let e;
99
+ let i;
76
100
  switch (s) {
77
- case d.left:
78
- e = r ? n.Next : n.Previous;
101
+ case l.left:
102
+ i = n ? r.Right : r.Left;
103
+ break;
104
+ case l.up:
105
+ i = r.Previous;
106
+ break;
107
+ case l.right:
108
+ i = n ? r.Left : r.Right;
79
109
  break;
80
- case d.up:
81
- e = n.Previous;
110
+ case l.down:
111
+ i = r.Next;
82
112
  break;
83
- case d.right:
84
- e = r ? n.Previous : n.Next;
113
+ case l.home:
114
+ i = r.First;
85
115
  break;
86
- case d.down:
87
- e = n.Next;
116
+ case l.end:
117
+ i = r.Last;
88
118
  break;
89
- case d.space:
90
- case d.enter:
91
- e = n.Toggle;
119
+ case l.space:
120
+ case l.enter:
121
+ i = r.Toggle;
92
122
  break;
93
123
  default:
94
- e = null;
124
+ i = null;
95
125
  break;
96
126
  }
97
- e !== null && (t.preventDefault(), this.onNavigate(t, e));
127
+ i !== null && (t.preventDefault(), this.onNavigate(t, i));
98
128
  }
99
- }, v(m), this.showLicenseWatermark = w(m);
100
- const o = P(i, this.expandMode);
101
- o.focused || (o.focused = I(i)), this.state = o;
129
+ }, w(y), this.showLicenseWatermark = F(y);
130
+ const p = S(a, this.expandMode);
131
+ p.focused || (p.focused = K(a)), this.state = p;
102
132
  }
103
133
  get expandMode() {
104
134
  return this.props.expandMode || "multiple";
105
135
  }
106
136
  get selectedItem() {
107
- const { selected: i = this.state.selected } = this.props;
108
- return i;
137
+ const { selected: a = this.state.selected } = this.props;
138
+ return a;
109
139
  }
110
140
  get expandedItems() {
111
141
  return this.props.isControlled ? this.props.expanded || [] : this.state.expanded;
112
142
  }
113
143
  get children() {
114
- const i = { ...this.state, selected: this.selectedItem }, o = {
144
+ const a = { ...this.state, selected: this.selectedItem }, p = {
115
145
  animation: this.props.animation,
116
146
  keepItemsMounted: this.props.keepItemsMounted,
117
- state: i,
147
+ state: a,
118
148
  expanded: this.expandedItems,
119
149
  handleSelect: this.handleSelect,
120
150
  children: this.props.children
121
151
  };
122
- return b(o);
152
+ return v(p);
123
153
  }
124
154
  /**
125
155
  * @hidden
126
156
  */
127
157
  render() {
128
- const i = {
158
+ const a = {
129
159
  "aria-activedescendant": this.activeDescendant
130
- }, o = S(
160
+ }, p = q(
131
161
  "k-panelbar",
132
162
  this.props.className
133
163
  );
134
- return /* @__PURE__ */ p.createElement(
164
+ return /* @__PURE__ */ c.createElement(
135
165
  "ul",
136
166
  {
137
167
  ref: (t) => {
@@ -143,30 +173,30 @@ const c = class c extends p.Component {
143
173
  onKeyDown: this.handleKeyDown,
144
174
  onFocus: this.handleWrapperFocus,
145
175
  onBlur: this.handleWrapperBlur,
146
- className: o,
176
+ className: p,
147
177
  style: this.props.style,
148
- ...i
178
+ ...a
149
179
  },
150
180
  this.children,
151
- this.showLicenseWatermark && /* @__PURE__ */ p.createElement(K, null)
181
+ this.showLicenseWatermark && /* @__PURE__ */ c.createElement(C, null)
152
182
  );
153
183
  }
154
- nextTick(i) {
155
- this.nextTickId = window.setTimeout(() => i());
184
+ nextTick(a) {
185
+ this.nextTickId = window.setTimeout(() => a());
156
186
  }
157
187
  };
158
- c.propTypes = {
159
- animation: a.bool,
160
- children: function(i, o) {
161
- const t = i[o];
188
+ h.propTypes = {
189
+ animation: o.bool,
190
+ children: function(a, p) {
191
+ const t = a[p];
162
192
  if (t) {
163
193
  if (Array.isArray(t)) {
164
- for (const r of t)
165
- if (!r.type || r.type !== u)
194
+ for (const n of t)
195
+ if (!n.type || n.type !== m)
166
196
  return new Error(
167
197
  "PanelBar children should be either PanelBarItem or Array of PanelBarItem."
168
198
  );
169
- } else if (t.type !== u)
199
+ } else if (t.type !== m)
170
200
  return new Error(
171
201
  "PanelBar child should be either PanelBarItem or Array of PanelBarItem."
172
202
  );
@@ -174,21 +204,21 @@ c.propTypes = {
174
204
  }
175
205
  return null;
176
206
  },
177
- dir: a.string,
178
- selected: a.string,
179
- expanded: a.arrayOf(a.string),
180
- focused: a.string,
181
- expandMode: a.oneOf(["single", "multiple"]),
182
- className: a.string,
183
- keepItemsMounted: a.bool,
184
- onSelect: a.func,
185
- style: a.object
186
- }, c.defaultProps = {
207
+ dir: o.string,
208
+ selected: o.string,
209
+ expanded: o.arrayOf(o.string),
210
+ focused: o.string,
211
+ expandMode: o.oneOf(["single", "multiple"]),
212
+ className: o.string,
213
+ keepItemsMounted: o.bool,
214
+ onSelect: o.func,
215
+ style: o.object
216
+ }, h.defaultProps = {
187
217
  expandMode: "multiple",
188
218
  animation: !0,
189
219
  keepItemsMounted: !1
190
220
  };
191
- let f = c;
221
+ let x = h;
192
222
  export {
193
- f as PanelBar
223
+ x as PanelBar
194
224
  };
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("react"),t=require("prop-types"),c=require("@progress/kendo-react-common"),y=require("@progress/kendo-svg-icons"),T=require("@progress/kendo-react-animation");function A(i){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const e in i)if(e!=="default"){const r=Object.getOwnPropertyDescriptor(i,e);Object.defineProperty(n,e,r.get?r:{enumerable:!0,get:()=>i[e]})}}return n.default=i,Object.freeze(n)}const a=A(P);function j({imageUrl:i,icon:n,svgIcon:e,iconClass:r}){return i?a.createElement("img",{role:"presentation",className:"k-panelbar-item-icon k-image",src:i}):n||e?a.createElement(c.IconWrap,{className:"k-panelbar-item-icon",name:n,icon:e}):r?a.createElement("span",{role:"presentation",className:"k-panelbar-item-icon "+r}):null}const d=class d extends a.PureComponent{constructor(n){super(n),this.handleItemClick=()=>{const{onSelect:e,disabled:r,id:p}=this.props;e&&!r&&e.call(void 0,{uniquePrivateKey:this.props.uniquePrivateKey,id:p,target:this})},this.childFactory=e=>this.props.keepItemsMounted?a.cloneElement(e,{...e.props,in:this.props.expanded}):e,this.state={show:n.expanded||!1}}render(){const{id:n,children:e,title:r,uniquePrivateKey:p,disabled:s,selected:m,focused:g,expanded:o,className:v,level:h,headerClassName:N,animation:b,keepItemsMounted:l}=this.props,E={role:"treeitem","aria-disabled":s,"aria-hidden":!s&&!o,"aria-selected":!s&&m,"aria-expanded":!s&&o&&!!e},x=c.classNames("k-panelbar-item",{"k-panelbar-header":h===0,"k-expanded":o&&!!e,"k-disabled":s},`k-level-${h}`,v),I=c.classNames("k-link",{"k-selected":!s&&m,"k-focus":!s&&g},N),S={display:"block"},C=j(this.props),O=!s&&e?a.createElement(c.IconWrap,{name:o?"chevron-up":"chevron-down",icon:o?y.chevronUpIcon:y.chevronDownIcon,className:c.classNames("k-panelbar-toggle",o?"k-panelbar-collapse":"k-panelbar-expand")}):null;let k=!1;e&&Array.isArray(e)&&(k=e[0].type===d);const q=k?a.createElement("ul",{role:"group","aria-expanded":o,"aria-hidden":!o,className:"k-panelbar-group",style:{display:l?this.state.show?"block":"none":"block"}},e):e,f=!s&&o||l?q:null,w=(b===void 0||b)&&!s&&e?a.createElement(T.Reveal,{transitionEnterDuration:200,transitionExitDuration:200,key:p+"_animation",style:S,children:f,childFactory:l&&this.childFactory,unmountOnExit:!l,onBeforeEnter:()=>l&&this.setState({show:!0}),onAfterExited:()=>l&&this.setState({show:!1})}):f;return a.createElement("li",{id:n,className:x,...E},a.createElement("span",{className:I,onClick:this.handleItemClick},C,a.createElement("span",{className:"k-panelbar-item-text"},r),O),w)}};d.propTypes={animation:t.bool,children:t.any,className:t.string,icon:t.string,iconClass:t.string,imageUrl:t.string,svgIcon:c.svgIconPropType,expanded:t.bool,disabled:t.bool,onSelect:t.func,selected:t.bool,level:t.number,title:t.oneOfType([t.string,t.element]),id:t.oneOfType([t.string,t.number]),focused:t.bool,keepItemsMounted:t.bool},d.defaultProps={title:"Untitled"};let u=d;exports.PanelBarItem=u;
8
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("react"),t=require("prop-types"),c=require("@progress/kendo-react-common"),y=require("@progress/kendo-svg-icons"),T=require("@progress/kendo-react-animation");function A(i){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const e in i)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(i,e);Object.defineProperty(n,e,s.get?s:{enumerable:!0,get:()=>i[e]})}}return n.default=i,Object.freeze(n)}const a=A(P);function j({imageUrl:i,icon:n,svgIcon:e,iconClass:s}){return i?a.createElement("img",{role:"presentation",className:"k-panelbar-item-icon k-image",src:i}):n||e?a.createElement(c.IconWrap,{className:"k-panelbar-item-icon",name:n,icon:e}):s?a.createElement("span",{role:"presentation",className:"k-panelbar-item-icon "+s}):null}const d=class d extends a.PureComponent{constructor(n){super(n),this.handleItemClick=()=>{const{onSelect:e,disabled:s,id:p}=this.props;e&&!s&&e.call(void 0,{uniquePrivateKey:this.props.uniquePrivateKey,id:p,target:this})},this.childFactory=e=>this.props.keepItemsMounted?a.cloneElement(e,{...e.props,in:this.props.expanded}):e,this.state={show:n.expanded||!1}}render(){const{id:n,children:e,title:s,uniquePrivateKey:p,disabled:r,selected:m,focused:g,expanded:o,className:v,level:h,headerClassName:N,animation:b,keepItemsMounted:l}=this.props,E={role:"treeitem","aria-disabled":r,"aria-hidden":!r&&!o,"aria-selected":!r&&m,"aria-expanded":!r&&o&&!!e},x=c.classNames("k-panelbar-item",{"k-panelbar-header":h===0,"k-expanded":o&&!!e,"k-disabled":r},`k-level-${h}`,v),I=c.classNames("k-link",{"k-selected":!r&&m,"k-focus":g},N),S={display:"block"},C=j(this.props),O=!r&&e?a.createElement(c.IconWrap,{name:o?"chevron-up":"chevron-down",icon:o?y.chevronUpIcon:y.chevronDownIcon,className:c.classNames("k-panelbar-toggle",o?"k-panelbar-collapse":"k-panelbar-expand")}):null;let k=!1;e&&Array.isArray(e)&&(k=e[0].type===d);const q=k?a.createElement("ul",{role:"group","aria-expanded":o,"aria-hidden":!o,className:"k-panelbar-group",style:{display:l?this.state.show?"block":"none":"block"}},e):e,f=!r&&o||l?q:null,w=(b===void 0||b)&&!r&&e?a.createElement(T.Reveal,{transitionEnterDuration:200,transitionExitDuration:200,key:p+"_animation",style:S,children:f,childFactory:l&&this.childFactory,unmountOnExit:!l,onBeforeEnter:()=>l&&this.setState({show:!0}),onAfterExited:()=>l&&this.setState({show:!1})}):f;return a.createElement("li",{id:n,className:x,...E},a.createElement("span",{className:I,onClick:this.handleItemClick},C,a.createElement("span",{className:"k-panelbar-item-text"},s),O),w)}};d.propTypes={animation:t.bool,children:t.any,className:t.string,icon:t.string,iconClass:t.string,imageUrl:t.string,svgIcon:c.svgIconPropType,expanded:t.bool,disabled:t.bool,onSelect:t.func,selected:t.bool,level:t.number,title:t.oneOfType([t.string,t.element]),id:t.oneOfType([t.string,t.number]),focused:t.bool,keepItemsMounted:t.bool},d.defaultProps={title:"Untitled"};let u=d;exports.PanelBarItem=u;
@@ -67,7 +67,7 @@ const l = class l extends n.PureComponent {
67
67
  "k-link",
68
68
  {
69
69
  "k-selected": !a && m,
70
- "k-focus": !a && E
70
+ "k-focus": E
71
71
  },
72
72
  v
73
73
  ), I = { display: "block" }, w = K(this.props), A = !a && e ? /* @__PURE__ */ n.createElement(
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var r=(e=>(e[e.Toggle=0]="Toggle",e[e.Next=1]="Next",e[e.Previous=2]="Previous",e))(r||{});exports.NavigationAction=r;
8
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var r=(e=>(e[e.Toggle=0]="Toggle",e[e.Next=1]="Next",e[e.Previous=2]="Previous",e[e.First=3]="First",e[e.Last=4]="Last",e[e.Left=5]="Left",e[e.Right=6]="Right",e))(r||{});exports.NavigationAction=r;
@@ -6,7 +6,7 @@
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
8
  "use client";
9
- var r = /* @__PURE__ */ ((e) => (e[e.Toggle = 0] = "Toggle", e[e.Next = 1] = "Next", e[e.Previous = 2] = "Previous", e))(r || {});
9
+ var r = /* @__PURE__ */ ((e) => (e[e.Toggle = 0] = "Toggle", e[e.Next = 1] = "Next", e[e.Previous = 2] = "Previous", e[e.First = 3] = "First", e[e.Last = 4] = "Last", e[e.Left = 5] = "Left", e[e.Right = 6] = "Right", e))(r || {});
10
10
  export {
11
11
  r as NavigationAction
12
12
  };
package/panelbar/util.js CHANGED
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const O=require("react"),l=require("./PanelBarItem.js");function S(n){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const e in n)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(n,e);Object.defineProperty(r,e,t.get?t:{enumerable:!0,get:()=>n[e]})}}return r.default=n,Object.freeze(r)}const p=S(O),j=n=>typeof n!="object"||!("type"in n)||n.type!==l.PanelBarItem,m=({animation:n=!0,keepItemsMounted:r=!1,state:e,expanded:t,handleSelect:i,children:o,parentExpanded:u=!0,level:a=0,parentPrivateKey:d=[]})=>{const b=p.Children.toArray(o).filter(j),E=b.length?b:o;return p.Children.map(E,(s,x)=>{if(s&&s.type===l.PanelBarItem){let g;const f=c(s,d,x);if(s.props.children){const B={animation:n,keepItemsMounted:r,state:e,expanded:t,handleSelect:i,children:s.props.children,parentExpanded:(t||[]).indexOf(f)>-1,level:a+1,parentPrivateKey:[...d,f]};g=m(B)}return p.cloneElement(s,{...s.props,animation:s.props.animation!==void 0?s.props.animation:n,keepItemsMounted:r,id:s.props.id||`k-panelbar-item-default-${f}`,uniquePrivateKey:f,parentUniquePrivateKey:d,parentExpanded:u,level:a,expanded:(t||[]).indexOf(f)>-1,focused:e.focused===f&&e.wrapperFocused,selected:e.selected===f,children:g,onSelect:i})}else return p.createElement("div",{className:"k-panelbar-content"},s)})},q=n=>{const r=p.Children.toArray(n.children)[0];return r?c(r,[],0):""},y=(n,r,e={expanded:n.expanded||[],selected:n.selected||"",focused:n.focused||"",wrapperFocused:!1},t=!0,i=[])=>(p.Children.map(n.children,(o,u)=>{if(o&&o.type===l.PanelBarItem){const a=c(o,i,u);!o.props.disabled&&t&&(o.props.selected&&(e.selected=a),o.props.focused&&(e.focused=a),o.props.expanded&&(r==="multiple"?e.expanded.push(a):r==="single"&&(e.expanded=[a])),o.props.children&&(e=y(o.props,r,e,!!o.props.expanded,[...i,a])))}}),e),c=(n,r,e)=>n&&n.props&&n.props.id?n.props.id:r.length?r[r.length-1]+`.${e}`:`.${e}`;function I(n,r=[]){return(n||[]).forEach(e=>{e.disabled||(r.push(e),e.expanded&&e.children&&I(e.children,r))}),r}function C(n,r=[]){return p.Children.forEach(n,e=>{e&&e.props&&!e.props.disabled&&(r.push(e),e.props.children&&C(e.props.children,r))}),r}function P(n,r=[]){return p.Children.forEach(n,e=>{e&&e.props&&!e.props.disabled&&(e.props.expanded||e.props.parentExpanded)&&(r.push(e),e.props.children&&P(e.props.children,r))}),r}const v=n=>n!=null;exports.PanelBarUtils=void 0;(n=>{function r(e){return e.map((t,i)=>{let o;return t.content&&(o=t.content),t.children&&(o=r(t.children)),p.createElement(l.PanelBarItem,{...t,children:o,key:t.id||i})})}n.mapItemsToComponents=r})(exports.PanelBarUtils||(exports.PanelBarUtils={}));const F=(n,r)=>n.length!==r.length?!1:n.every((e,t)=>e===r[t]);exports.flatChildren=C;exports.flatVisibleChildren=P;exports.flatVisibleItems=I;exports.getFirstId=q;exports.getInitialState=y;exports.isArrayEqual=F;exports.isPresent=v;exports.renderChildren=m;
8
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const B=require("react"),d=require("./PanelBarItem.js"),l=require("./interfaces/NavigationAction.js");function F(n){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const e in n)if(e!=="default"){const o=Object.getOwnPropertyDescriptor(n,e);Object.defineProperty(r,e,o.get?o:{enumerable:!0,get:()=>n[e]})}}return r.default=n,Object.freeze(r)}const i=F(B),O=n=>typeof n!="object"||!("type"in n)||n.type!==d.PanelBarItem,y=({animation:n=!0,keepItemsMounted:r=!1,state:e,expanded:o,handleSelect:a,children:t,parentExpanded:c=!0,level:s=0,parentPrivateKey:f=[]})=>{const b=i.Children.toArray(t).filter(O),q=b.length?b:t;return i.Children.map(q,(p,C)=>{if(p&&p.type===d.PanelBarItem){let m;const u=g(p,f,C);if(p.props.children){const A={animation:n,keepItemsMounted:r,state:e,expanded:o,handleSelect:a,children:p.props.children,parentExpanded:(o||[]).indexOf(u)>-1,level:s+1,parentPrivateKey:[...f,u]};m=y(A)}return i.cloneElement(p,{...p.props,animation:p.props.animation!==void 0?p.props.animation:n,keepItemsMounted:r,id:p.props.id||`k-panelbar-item-default-${u}`,uniquePrivateKey:u,parentUniquePrivateKey:f,parentExpanded:c,level:s,expanded:(o||[]).indexOf(u)>-1,focused:e.focused===u&&e.wrapperFocused,selected:e.selected===u,children:m,onSelect:a})}else return i.createElement("div",{className:"k-panelbar-content"},p)})},x=n=>{const r=i.Children.toArray(n.children)[0];return r?g(r,[],0):""},I=(n,r,e={expanded:n.expanded||[],selected:n.selected||"",focused:n.focused||"",wrapperFocused:!1},o=!0,a=[])=>(i.Children.map(n.children,(t,c)=>{if(t&&t.type===d.PanelBarItem){const s=g(t,a,c);!t.props.disabled&&o&&(t.props.selected&&(e.selected=s),t.props.focused&&(e.focused=s),t.props.expanded&&(r==="multiple"?e.expanded.push(s):r==="single"&&(e.expanded=[s])),t.props.children&&(e=I(t.props,r,e,!!t.props.expanded,[...a,s])))}}),e),g=(n,r,e)=>n&&n.props&&n.props.id?n.props.id:r.length?r[r.length-1]+`.${e}`:`.${e}`;function P(n,r=[]){return(n||[]).forEach(e=>{e.disabled||(r.push(e),e.expanded&&e.children&&P(e.children,r))}),r}function v(n,r=[]){return i.Children.forEach(n,e=>{e&&e.props&&!e.props.disabled&&(r.push(e),e.props.children&&v(e.props.children,r))}),r}function E(n,r=[]){return i.Children.forEach(n,e=>{e&&e.props&&(e.props.expanded||e.props.parentExpanded)&&(r.push(e),e.props.children&&E(e.props.children,r))}),r}const N=n=>n!=null;exports.PanelBarUtils=void 0;(n=>{function r(e){return e.map((o,a)=>{let t;return o.content&&(t=o.content),o.children&&(t=r(o.children)),i.createElement(d.PanelBarItem,{...o,children:t,key:o.id||a})})}n.mapItemsToComponents=r})(exports.PanelBarUtils||(exports.PanelBarUtils={}));const S=(n,r)=>n.length!==r.length?!1:n.every((e,o)=>e===r[o]),j=(n,r,e,o,a)=>{let t;if(a===l.NavigationAction.First||a===l.NavigationAction.Last)switch(a){case l.NavigationAction.First:t=n[0];break;case l.NavigationAction.Last:t=n[n.length-1];break}else n.forEach((c,s)=>{if(c.props.uniquePrivateKey===(e.uniquePrivateKey||o)){const f=s+r<0?n.length-1:s+r>n.length-1?0:s+r;t=n[f]}});return t};exports.flatChildren=v;exports.flatVisibleChildren=E;exports.flatVisibleItems=P;exports.getFirstId=x;exports.getFocusedChild=j;exports.getInitialState=I;exports.isArrayEqual=S;exports.isPresent=N;exports.renderChildren=y;
package/panelbar/util.mjs CHANGED
@@ -6,121 +6,142 @@
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
8
  "use client";
9
- import * as t from "react";
10
- import { PanelBarItem as i } from "./PanelBarItem.mjs";
11
- const y = (n) => typeof n != "object" || !("type" in n) || n.type !== i, I = ({
12
- animation: n = !0,
13
- keepItemsMounted: r = !1,
9
+ import * as u from "react";
10
+ import { PanelBarItem as g } from "./PanelBarItem.mjs";
11
+ import { NavigationAction as d } from "./interfaces/NavigationAction.mjs";
12
+ const I = (r) => typeof r != "object" || !("type" in r) || r.type !== g, F = ({
13
+ animation: r = !0,
14
+ keepItemsMounted: n = !1,
14
15
  state: e,
15
- expanded: o,
16
- handleSelect: f,
17
- children: p,
18
- parentExpanded: u = !0,
19
- level: a = 0,
16
+ expanded: p,
17
+ handleSelect: t,
18
+ children: o,
19
+ parentExpanded: i = !0,
20
+ level: s = 0,
20
21
  parentPrivateKey: c = []
21
22
  }) => {
22
- const m = t.Children.toArray(p).filter(y), C = m.length ? m : p;
23
- return t.Children.map(C, (s, E) => {
24
- if (s && s.type === i) {
25
- let g;
26
- const d = l(s, c, E);
27
- if (s.props.children) {
28
- const b = {
29
- animation: n,
30
- keepItemsMounted: r,
23
+ const m = u.Children.toArray(o).filter(I), b = m.length ? m : o;
24
+ return u.Children.map(b, (a, x) => {
25
+ if (a && a.type === g) {
26
+ let y;
27
+ const f = l(a, c, x);
28
+ if (a.props.children) {
29
+ const v = {
30
+ animation: r,
31
+ keepItemsMounted: n,
31
32
  state: e,
32
- expanded: o,
33
- handleSelect: f,
34
- children: s.props.children,
35
- parentExpanded: (o || []).indexOf(d) > -1,
36
- level: a + 1,
37
- parentPrivateKey: [...c, d]
33
+ expanded: p,
34
+ handleSelect: t,
35
+ children: a.props.children,
36
+ parentExpanded: (p || []).indexOf(f) > -1,
37
+ level: s + 1,
38
+ parentPrivateKey: [...c, f]
38
39
  };
39
- g = I(b);
40
+ y = F(v);
40
41
  }
41
- return t.cloneElement(
42
- s,
42
+ return u.cloneElement(
43
+ a,
43
44
  {
44
- ...s.props,
45
- animation: s.props.animation !== void 0 ? s.props.animation : n,
46
- keepItemsMounted: r,
47
- id: s.props.id || `k-panelbar-item-default-${d}`,
48
- uniquePrivateKey: d,
45
+ ...a.props,
46
+ animation: a.props.animation !== void 0 ? a.props.animation : r,
47
+ keepItemsMounted: n,
48
+ id: a.props.id || `k-panelbar-item-default-${f}`,
49
+ uniquePrivateKey: f,
49
50
  parentUniquePrivateKey: c,
50
- parentExpanded: u,
51
- level: a,
52
- expanded: (o || []).indexOf(d) > -1,
53
- focused: e.focused === d && e.wrapperFocused,
54
- selected: e.selected === d,
55
- children: g,
56
- onSelect: f
51
+ parentExpanded: i,
52
+ level: s,
53
+ expanded: (p || []).indexOf(f) > -1,
54
+ focused: e.focused === f && e.wrapperFocused,
55
+ selected: e.selected === f,
56
+ children: y,
57
+ onSelect: t
57
58
  }
58
59
  );
59
60
  } else
60
- return /* @__PURE__ */ t.createElement("div", { className: "k-panelbar-content" }, s);
61
+ return /* @__PURE__ */ u.createElement("div", { className: "k-panelbar-content" }, a);
61
62
  });
62
- }, w = (n) => {
63
- const r = t.Children.toArray(n.children)[0];
64
- return r ? l(r, [], 0) : "";
65
- }, v = (n, r, e = {
66
- expanded: n.expanded || [],
67
- selected: n.selected || "",
68
- focused: n.focused || "",
63
+ }, $ = (r) => {
64
+ const n = u.Children.toArray(r.children)[0];
65
+ return n ? l(n, [], 0) : "";
66
+ }, q = (r, n, e = {
67
+ expanded: r.expanded || [],
68
+ selected: r.selected || "",
69
+ focused: r.focused || "",
69
70
  wrapperFocused: !1
70
- }, o = !0, f = []) => (t.Children.map(n.children, (p, u) => {
71
- if (p && p.type === i) {
72
- const a = l(p, f, u);
73
- !p.props.disabled && o && (p.props.selected && (e.selected = a), p.props.focused && (e.focused = a), p.props.expanded && (r === "multiple" ? e.expanded.push(a) : r === "single" && (e.expanded = [a])), p.props.children && (e = v(
74
- p.props,
75
- r,
71
+ }, p = !0, t = []) => (u.Children.map(r.children, (o, i) => {
72
+ if (o && o.type === g) {
73
+ const s = l(o, t, i);
74
+ !o.props.disabled && p && (o.props.selected && (e.selected = s), o.props.focused && (e.focused = s), o.props.expanded && (n === "multiple" ? e.expanded.push(s) : n === "single" && (e.expanded = [s])), o.props.children && (e = q(
75
+ o.props,
76
+ n,
76
77
  e,
77
- !!p.props.expanded,
78
- [...f, a]
78
+ !!o.props.expanded,
79
+ [...t, s]
79
80
  )));
80
81
  }
81
- }), e), l = (n, r, e) => n && n.props && n.props.id ? n.props.id : r.length ? r[r.length - 1] + `.${e}` : `.${e}`;
82
- function q(n, r = []) {
83
- return (n || []).forEach((e) => {
84
- e.disabled || (r.push(e), e.expanded && e.children && q(e.children, r));
85
- }), r;
82
+ }), e), l = (r, n, e) => r && r.props && r.props.id ? r.props.id : n.length ? n[n.length - 1] + `.${e}` : `.${e}`;
83
+ function C(r, n = []) {
84
+ return (r || []).forEach((e) => {
85
+ e.disabled || (n.push(e), e.expanded && e.children && C(e.children, n));
86
+ }), n;
86
87
  }
87
- function F(n, r = []) {
88
- return t.Children.forEach(n, (e) => {
89
- e && e.props && !e.props.disabled && (r.push(e), e.props.children && F(e.props.children, r));
90
- }), r;
88
+ function k(r, n = []) {
89
+ return u.Children.forEach(r, (e) => {
90
+ e && e.props && !e.props.disabled && (n.push(e), e.props.children && k(e.props.children, n));
91
+ }), n;
91
92
  }
92
- function $(n, r = []) {
93
- return t.Children.forEach(n, (e) => {
94
- e && e.props && !e.props.disabled && (e.props.expanded || e.props.parentExpanded) && (r.push(e), e.props.children && $(e.props.children, r));
95
- }), r;
93
+ function P(r, n = []) {
94
+ return u.Children.forEach(r, (e) => {
95
+ e && e.props && (e.props.expanded || e.props.parentExpanded) && (n.push(e), e.props.children && P(e.props.children, n));
96
+ }), n;
96
97
  }
97
- const A = (n) => n != null;
98
- var x;
99
- ((n) => {
100
- function r(e) {
101
- return e.map((o, f) => {
102
- let p;
103
- return o.content && (p = o.content), o.children && (p = r(o.children)), /* @__PURE__ */ t.createElement(
104
- i,
98
+ const B = (r) => r != null;
99
+ var E;
100
+ ((r) => {
101
+ function n(e) {
102
+ return e.map((p, t) => {
103
+ let o;
104
+ return p.content && (o = p.content), p.children && (o = n(p.children)), /* @__PURE__ */ u.createElement(
105
+ g,
105
106
  {
106
- ...o,
107
- children: p,
108
- key: o.id || f
107
+ ...p,
108
+ children: o,
109
+ key: p.id || t
109
110
  }
110
111
  );
111
112
  });
112
113
  }
113
- n.mapItemsToComponents = r;
114
- })(x || (x = {}));
115
- const B = (n, r) => n.length !== r.length ? !1 : n.every((e, o) => e === r[o]);
114
+ r.mapItemsToComponents = n;
115
+ })(E || (E = {}));
116
+ const K = (r, n) => r.length !== n.length ? !1 : r.every((e, p) => e === n[p]), L = (r, n, e, p, t) => {
117
+ let o;
118
+ if (t === d.First || t === d.Last)
119
+ switch (t) {
120
+ case d.First:
121
+ o = r[0];
122
+ break;
123
+ case d.Last:
124
+ o = r[r.length - 1];
125
+ break;
126
+ }
127
+ else
128
+ r.forEach((i, s) => {
129
+ if (i.props.uniquePrivateKey === (e.uniquePrivateKey || p)) {
130
+ const c = s + n < 0 ? r.length - 1 : s + n > r.length - 1 ? 0 : s + n;
131
+ o = r[c];
132
+ }
133
+ });
134
+ return o;
135
+ };
116
136
  export {
117
- x as PanelBarUtils,
118
- F as flatChildren,
119
- $ as flatVisibleChildren,
120
- q as flatVisibleItems,
121
- w as getFirstId,
122
- v as getInitialState,
123
- B as isArrayEqual,
124
- A as isPresent,
125
- I as renderChildren
137
+ E as PanelBarUtils,
138
+ k as flatChildren,
139
+ P as flatVisibleChildren,
140
+ C as flatVisibleItems,
141
+ $ as getFirstId,
142
+ L as getFocusedChild,
143
+ q as getInitialState,
144
+ K as isArrayEqual,
145
+ B as isPresent,
146
+ F as renderChildren
126
147
  };