wimui 0.51.2 → 0.52.2

package/dist/components/data-display/DataGrid/DataGrid.js

@@ -1,88 +1,89 @@
 "use client";
 import { useWimTranslation as e } from "../../../i18n/useWimTranslation.js";
-import { Checkbox as t } from "../../form/Checkbox/Checkbox.js";
-import { Pagination as n } from "../../navigation/Pagination/Pagination.js";
-import { Table as r } from "../Table/Table.js";
-import { useFixedColumns as i } from "./useFixedColumns.js";
-import { useDataGridKeyboard as a } from "./useDataGridKeyboard.js";
-import { useInfiniteScroll as o } from "./useInfiniteScroll.js";
-import s from "./datagrid.module.js";
-import { useCallback as c, useMemo as l } from "react";
-import u from "classnames";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { commonNs as t } from "../../../i18n/generated/common.js";
+import { Checkbox as n } from "../../form/Checkbox/Checkbox.js";
+import { Pagination as r } from "../../navigation/Pagination/Pagination.js";
+import { Table as i } from "../Table/Table.js";
+import { useFixedColumns as a } from "./useFixedColumns.js";
+import { useDataGridKeyboard as o } from "./useDataGridKeyboard.js";
+import { useInfiniteScroll as s } from "./useInfiniteScroll.js";
+import c from "./datagrid.module.js";
+import { useCallback as l, useMemo as u } from "react";
+import d from "classnames";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region src/components/data-display/DataGrid/DataGrid.tsx
-function p({ columns: p, data: m, rowKey: h = "id", loading: g = !1, striped: _ = !1, bordered: v = !1, hoverable: y = !0, stickyHeader: b = !0, height: x, maxHeight: S, emptyMessage: C, mobileCard: w = !1, selection: T, selectedRowKeys: E, onSelectionChange: D, sortConfig: O, onSortChange: k, pagination: A, infiniteScroll: j, className: M, ariaLabel: N }) {
-	let { t: P } = e("common"), F = g !== !1 && g !== void 0, I = g === !0 || g === "blocking", L = l(() => T ? T === !0 ? {
+function m({ columns: m, data: h, rowKey: g = "id", loading: _ = !1, striped: v = !1, bordered: y = !1, hoverable: b = !0, stickyHeader: x = !0, height: S, maxHeight: C, emptyMessage: w, mobileCard: T = !1, selection: E, selectedRowKeys: D, onSelectionChange: O, sortConfig: k, onSortChange: A, pagination: j, infiniteScroll: M, className: N, ariaLabel: P }) {
+	let { t: F } = e(t), I = _ !== !1 && _ !== void 0, L = _ === !0 || _ === "blocking", R = u(() => E ? E === !0 ? {
 		type: "checkbox",
-		selectedRowKeys: E ?? [],
+		selectedRowKeys: D ?? [],
 		onChange: (e, t) => {
-			D?.(e, t);
+			O?.(e, t);
 		}
-	} : T : null, [
-		T,
+	} : E : null, [
 		E,
-		D
-	]), { fixedLeftOffsets: R, fixedRightOffsets: z } = i(p, !!L), B = (e, t = !1) => {
-		let n = R[e];
+		D,
+		O
+	]), { fixedLeftOffsets: z, fixedRightOffsets: B } = a(m, !!R), V = (e, t = !1) => {
+		let n = z[e];
 		if (n) return {
 			stickyLeft: !0,
 			leftOffset: n.offset,
 			stickyZIndex: t ? 1e3 + n.zIndex : n.zIndex,
-			className: u(s.cellFixed, n.isLast && s.cellFixedLeftLast)
+			className: d(c.cellFixed, n.isLast && c.cellFixedLeftLast)
 		};
-		let r = z[e];
+		let r = B[e];
 		return r ? {
 			stickyRight: !0,
 			rightOffset: r.offset,
 			stickyZIndex: t ? 1e3 + r.zIndex : r.zIndex,
-			className: u(s.cellFixed, r.isFirst && s.cellFixedRightFirst)
+			className: d(c.cellFixed, r.isFirst && c.cellFixedRightFirst)
 		} : {};
-	}, V = c((e) => typeof h == "function" ? h(e) : e[h], [h]), H = l(() => !L || m.length === 0 ? !1 : m.every((e) => L.selectedRowKeys.includes(V(e))), [
-		m,
-		L,
-		V
-	]), U = l(() => L ? !H && m.some((e) => L.selectedRowKeys.includes(V(e))) : !1, [
-		m,
-		L,
-		H,
-		V
-	]), W = (e) => {
-		if (!L) return;
-		let t = e.target.checked, n = t ? m.map(V) : [], r = t ? m : [];
-		L.onChange(n, r);
-	}, G = (e, t) => {
-		if (!L) return;
-		let n = t.target.checked, r = V(e), i = n ? [...L.selectedRowKeys, r] : L.selectedRowKeys.filter((e) => e !== r), a = m.filter((e) => i.includes(V(e)));
-		L.onChange(i, a);
-	}, { focusedCell: K, handleKeyDown: q, containerRef: J } = a(p, m, !!L), { loaderRef: Y } = o(j), X = p.length + +!!L;
-	return /* @__PURE__ */ f("div", {
-		className: u("wim-data-grid", s.root, I && s.loading, w === "md" ? s.mobileCardMd : w && s.mobileCard, M),
-		"aria-busy": F || void 0,
-		children: [/* @__PURE__ */ f("div", {
-			className: s.container,
+	}, H = l((e) => typeof g == "function" ? g(e) : e[g], [g]), U = u(() => !R || h.length === 0 ? !1 : h.every((e) => R.selectedRowKeys.includes(H(e))), [
+		h,
+		R,
+		H
+	]), W = u(() => R ? !U && h.some((e) => R.selectedRowKeys.includes(H(e))) : !1, [
+		h,
+		R,
+		U,
+		H
+	]), G = (e) => {
+		if (!R) return;
+		let t = e.target.checked, n = t ? h.map(H) : [], r = t ? h : [];
+		R.onChange(n, r);
+	}, K = (e, t) => {
+		if (!R) return;
+		let n = t.target.checked, r = H(e), i = n ? [...R.selectedRowKeys, r] : R.selectedRowKeys.filter((e) => e !== r), a = h.filter((e) => i.includes(H(e)));
+		R.onChange(i, a);
+	}, { focusedCell: q, handleKeyDown: J, containerRef: Y } = o(m, h, !!R), { loaderRef: X } = s(M), Z = m.length + +!!R;
+	return /* @__PURE__ */ p("div", {
+		className: d("wim-data-grid", c.root, L && c.loading, T === "md" ? c.mobileCardMd : T && c.mobileCard, N),
+		"aria-busy": I || void 0,
+		children: [/* @__PURE__ */ p("div", {
+			className: c.container,
 			style: {
-				height: x,
-				maxHeight: S
+				height: S,
+				maxHeight: C
 			},
-			inert: I || void 0,
+			inert: L || void 0,
 			children: [
-				/* @__PURE__ */ f(r, {
-					ref: J,
-					onKeyDown: q,
+				/* @__PURE__ */ p(i, {
+					ref: Y,
+					onKeyDown: J,
 					tabIndex: 0,
 					role: "grid",
-					"aria-label": N ?? P("a11y.data_grid"),
-					"aria-rowcount": m.length + 1,
-					"aria-colcount": X,
-					striped: _,
-					bordered: v,
-					hoverable: y,
-					stickyHeader: b,
-					mobileCard: w,
+					"aria-label": P ?? F("a11y.data_grid"),
+					"aria-rowcount": h.length + 1,
+					"aria-colcount": Z,
+					striped: v,
+					bordered: y,
+					hoverable: b,
+					stickyHeader: x,
+					mobileCard: T,
 					fullWidth: !0,
-					className: u("wim-table", s.table),
-					containerClassName: s.tableContainer,
-					children: [/* @__PURE__ */ d(r.Header, { children: /* @__PURE__ */ f(r.Row, { children: [L && /* @__PURE__ */ d(r.Head, {
+					className: d("wim-table", c.table),
+					containerClassName: c.tableContainer,
+					children: [/* @__PURE__ */ f(i.Header, { children: /* @__PURE__ */ p(i.Row, { children: [R && /* @__PURE__ */ f(i.Head, {
 						role: "columnheader",
 						selection: !0,
 						stickyLeft: !0,
@@ -90,106 +91,106 @@ function p({ columns: p, data: m, rowKey: h = "id", loading: g = !1, striped: _
 						stickyZIndex: 1150,
 						"data-row": -1,
 						"data-col": -1,
-						"aria-label": P("a11y.select_all_rows"),
-						tabIndex: K.row === -1 && K.col === -1 ? 0 : -1,
-						children: (L.type ?? "checkbox") === "checkbox" && /* @__PURE__ */ d(t, {
-							checked: H,
-							indeterminate: U,
-							onChange: W,
-							"aria-label": P("a11y.select_all_rows")
+						"aria-label": F("a11y.select_all_rows"),
+						tabIndex: q.row === -1 && q.col === -1 ? 0 : -1,
+						children: (R.type ?? "checkbox") === "checkbox" && /* @__PURE__ */ f(n, {
+							checked: U,
+							indeterminate: W,
+							onChange: G,
+							"aria-label": F("a11y.select_all_rows")
 						})
-					}), p.map((e, t) => {
-						let n = B(e.key, !0);
-						return /* @__PURE__ */ d(r.Head, {
+					}), m.map((e, t) => {
+						let n = V(e.key, !0);
+						return /* @__PURE__ */ f(i.Head, {
 							role: "columnheader",
 							style: {
 								width: e.width,
 								minWidth: e.width
 							},
-							sortable: !!(e.sortable && k),
-							sortDirection: O?.key === e.key ? O.direction : "none",
+							sortable: !!(e.sortable && A),
+							sortDirection: k?.key === e.key ? k.direction : "none",
 							onSort: () => {
-								if (!e.sortable || !k) return;
-								let t = O?.key === e.key ? O.direction === "asc" ? "desc" : O.direction === "desc" ? "none" : "asc" : "asc";
-								k(e.key, t);
+								if (!e.sortable || !A) return;
+								let t = k?.key === e.key ? k.direction === "asc" ? "desc" : k.direction === "desc" ? "none" : "asc" : "asc";
+								A(e.key, t);
 							},
 							...n,
-							tabIndex: K.row === -1 && K.col === (L ? t + 1 : t) ? 0 : -1,
+							tabIndex: q.row === -1 && q.col === (R ? t + 1 : t) ? 0 : -1,
 							"data-row": -1,
-							"data-col": L ? t + 1 : t,
+							"data-col": R ? t + 1 : t,
 							children: e.title
 						}, e.key);
-					})] }) }), /* @__PURE__ */ d(r.Body, { children: m.map((e, n) => {
-						let i = V(e), a = L?.selectedRowKeys.includes(i);
-						return /* @__PURE__ */ f(r.Row, {
+					})] }) }), /* @__PURE__ */ f(i.Body, { children: h.map((e, t) => {
+						let r = H(e), a = R?.selectedRowKeys.includes(r);
+						return /* @__PURE__ */ p(i.Row, {
 							selected: a,
-							children: [L && /* @__PURE__ */ d(r.Cell, {
+							children: [R && /* @__PURE__ */ f(i.Cell, {
 								role: "gridcell",
 								selection: !0,
 								stickyLeft: !0,
 								leftOffset: 0,
 								stickyZIndex: 150,
-								"data-row": n,
+								"data-row": t,
 								"data-col": -1,
-								tabIndex: K.row === n && K.col === -1 ? 0 : -1,
-								children: /* @__PURE__ */ d(t, {
+								tabIndex: q.row === t && q.col === -1 ? 0 : -1,
+								children: /* @__PURE__ */ f(n, {
 									checked: a,
-									onChange: (t) => G(e, t),
-									"aria-label": P("a11y.select_row")
+									onChange: (t) => K(e, t),
+									"aria-label": F("a11y.select_row")
 								})
-							}), p.map((t, i) => {
-								let a = B(t.key, !1), o = e[t.dataIndex ?? t.key];
-								return /* @__PURE__ */ d(r.Cell, {
+							}), m.map((n, r) => {
+								let a = V(n.key, !1), o = e[n.dataIndex ?? n.key];
+								return /* @__PURE__ */ f(i.Cell, {
 									role: "gridcell",
-									label: typeof t.title == "string" ? t.title : void 0,
+									label: typeof n.title == "string" ? n.title : void 0,
 									...a,
-									"data-row": n,
-									"data-col": L ? i + 1 : i,
-									tabIndex: K.row === n && K.col === (L ? i + 1 : i) ? 0 : -1,
-									children: t.maxWidth == null ? t.render ? t.render(o, e, n) : o : /* @__PURE__ */ d("div", {
-										style: { maxWidth: t.maxWidth },
-										children: t.render ? t.render(o, e, n) : o
+									"data-row": t,
+									"data-col": R ? r + 1 : r,
+									tabIndex: q.row === t && q.col === (R ? r + 1 : r) ? 0 : -1,
+									children: n.maxWidth == null ? n.render ? n.render(o, e, t) : o : /* @__PURE__ */ f("div", {
+										style: { maxWidth: n.maxWidth },
+										children: n.render ? n.render(o, e, t) : o
 									})
-								}, t.key);
+								}, n.key);
 							})]
-						}, i);
+						}, r);
 					}) })]
 				}),
-				m.length === 0 && C && /* @__PURE__ */ d("div", {
+				h.length === 0 && w && /* @__PURE__ */ f("div", {
 					role: "status",
-					className: s.empty,
-					children: C
+					className: c.empty,
+					children: w
 				}),
-				j?.hasMore && /* @__PURE__ */ d("div", {
-					ref: Y,
-					className: s.loader,
-					children: j.hasMore && P("dataGrid.loading_more")
+				M?.hasMore && /* @__PURE__ */ f("div", {
+					ref: X,
+					className: c.loader,
+					children: M.hasMore && F("dataGrid.loading_more")
 				})
 			]
-		}), A && /* @__PURE__ */ f("div", {
-			className: s.footer,
-			inert: I || void 0,
-			children: [/* @__PURE__ */ f("div", {
-				className: s.info,
-				children: [P("dataGrid.displaying", {
-					shown: m.length,
-					total: A.total
-				}), L?.selectedRowKeys && L.selectedRowKeys.length > 0 && /* @__PURE__ */ d("span", {
-					className: s.selectionInfo,
-					children: P("dataGrid.rows_selected", { selected: L.selectedRowKeys.length })
+		}), j && /* @__PURE__ */ p("div", {
+			className: c.footer,
+			inert: L || void 0,
+			children: [/* @__PURE__ */ p("div", {
+				className: c.info,
+				children: [F("dataGrid.displaying", {
+					shown: h.length,
+					total: j.total
+				}), R?.selectedRowKeys && R.selectedRowKeys.length > 0 && /* @__PURE__ */ f("span", {
+					className: c.selectionInfo,
+					children: F("dataGrid.rows_selected", { selected: R.selectedRowKeys.length })
 				})]
-			}), /* @__PURE__ */ d("div", {
-				className: s.pagination,
-				children: /* @__PURE__ */ d(n, {
-					className: s.paginationContent,
-					current: A.current,
-					total: A.total,
-					pageSize: A.pageSize,
-					onChange: A.onChange
+			}), /* @__PURE__ */ f("div", {
+				className: c.pagination,
+				children: /* @__PURE__ */ f(r, {
+					className: c.paginationContent,
+					current: j.current,
+					total: j.total,
+					pageSize: j.pageSize,
+					onChange: j.onChange
 				})
 			})]
 		})]
 	});
 }
 //#endregion
-export { p as DataGrid };
+export { m as DataGrid };

package/dist/components/data-display/JsonViewer/JsonViewer.cjs

@@ -1,2 +1,2 @@
 "use client";
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../../icon/chevron-down.cjs"),r=require("../../../icon/chevron-right.cjs"),i=require("../../../icon/plus.cjs"),a=require("../../../icon/trash.cjs"),o=require("../../media/Icon/Icon.cjs"),s=require("../../form/IconButton/IconButton.cjs"),c=require("./json-viewer.module.cjs");let l=require("react");l=e.__toESM(l,1);let u=require("classnames");u=e.__toESM(u,1);let d=require("react/jsx-runtime");var f=(e,t,n)=>{if(t.length===0)return n;let[r,...i]=t;if(Array.isArray(e)){let t=[...e];return t[r]=f(e[r],i,n),t}return typeof e==`object`&&e?{...e,[r]:f(e[r],i,n)}:e},p=(e,t)=>{if(t.length===0)return e;let[n,...r]=t;if(t.length===1){if(Array.isArray(e))return e.filter((e,t)=>t!==n);if(typeof e==`object`&&e){let t={...e};return delete t[n],t}return e}if(Array.isArray(e)){let t=[...e];return t[n]=p(e[n],r),t}return typeof e==`object`&&e?{...e,[n]:p(e[n],r)}:e},m=(e,t,n)=>{if(t.length===0)return Array.isArray(e)?[...e,``]:typeof e==`object`&&e?{...e,[n||`new_key`]:``}:e;let[r,...i]=t;if(Array.isArray(e)){let t=[...e];return t[r]=m(e[r],i,n),t}return typeof e==`object`&&e?{...e,[r]:m(e[r],i,n)}:e},h=({value:e,onSave:t,className:n})=>{let[r,i]=(0,l.useState)(!1),[a,o]=(0,l.useState)(String(e)),s=l.default.useRef(null);l.default.useEffect(()=>{r&&s.current&&s.current.focus()},[r]);let f=()=>{i(!1);let n=a;typeof e==`number`&&(n=Number(a)),typeof e==`boolean`&&(n=a===`true`),a===`null`&&(n=null),t(n)};return r?(0,d.jsx)(`input`,{ref:s,className:c.default.input,value:a,onChange:e=>o(e.target.value),onBlur:f,onKeyDown:e=>{e.key===`Enter`&&f(),e.key===`Escape`&&i(!1)}}):(0,d.jsx)(`span`,{role:`button`,tabIndex:0,className:(0,u.default)(c.default.value,n,c.default.editable),onClick:()=>i(!0),onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),i(!0))},children:typeof e==`string`?`"${e}"`:String(e)})},g=({label:e,value:s,depth:f,currentDepth:p,path:m,editable:_,onUpdate:v,onDelete:y,onAdd:b})=>{let{t:x}=t.useWimTranslation(),[S,C]=(0,l.useState)(p<f),w=typeof s==`object`&&!!s,T=Array.isArray(s),E=()=>C(!S),D=()=>_?(0,d.jsxs)(`div`,{className:c.default.actions,children:[w&&(0,d.jsx)(`button`,{type:`button`,className:c.default.nodeAction,onClick:e=>{e.stopPropagation(),b(m)},title:x(`jsonViewer.addItem`),"aria-label":x(`jsonViewer.addItem`),children:(0,d.jsx)(o.Icon,{component:i.default,size:`xs`})}),p>0&&(0,d.jsx)(`button`,{type:`button`,className:(0,u.default)(c.default.nodeAction,c.default.delete),onClick:e=>{e.stopPropagation(),y(m)},title:x(`jsonViewer.deleteItem`),"aria-label":x(`jsonViewer.deleteItem`),children:(0,d.jsx)(o.Icon,{component:a.default,size:`xs`})})]}):null;if(!w)return(0,d.jsxs)(`div`,{className:c.default.node,children:[e&&(0,d.jsxs)(`span`,{className:c.default.key,children:[e,`:`]}),_?(0,d.jsx)(h,{value:s,onSave:e=>v(m,e),className:c.default[s===null?`null`:typeof s]}):(0,d.jsx)(`span`,{className:(0,u.default)(c.default.value,c.default[s===null?`null`:typeof s]),children:typeof s==`string`?`"${s}"`:String(s)}),D()]});let O=T?s.length===0:Object.keys(s).length===0;return(0,d.jsxs)(`div`,{className:c.default.node,children:[(0,d.jsxs)(`div`,{className:c.default.headerRow,children:[(0,d.jsxs)(`div`,{role:`button`,tabIndex:O?-1:0,className:(0,u.default)(c.default.header,!O&&c.default.collapsible),onClick:O?void 0:E,onKeyDown:e=>{!O&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),E())},children:[!O&&(0,d.jsx)(o.Icon,{component:S?n.default:r.default,size:`sm`,className:c.default.toggle}),e&&(0,d.jsxs)(`span`,{className:c.default.key,children:[e,`:`]}),(0,d.jsx)(`span`,{className:c.default.bracket,children:T?`[`:`{`}),!S&&!O&&(0,d.jsx)(`span`,{className:c.default.ellipsis,children:`...`}),!S&&(0,d.jsx)(`span`,{className:c.default.bracket,children:T?`]`:`}`}),S&&(0,d.jsx)(`span`,{className:c.default.count,children:T?`${s.length} items`:`${Object.keys(s).length} keys`})]}),D()]}),S&&!O&&(0,d.jsx)(`div`,{className:c.default.children,children:T?s.map((e,t)=>(0,d.jsx)(g,{value:e,depth:f,currentDepth:p+1,path:[...m,t],editable:_,onUpdate:v,onDelete:y,onAdd:b},t)):Object.entries(s).map(([e,t])=>(0,d.jsx)(g,{label:e,value:t,depth:f,currentDepth:p+1,path:[...m,e],editable:_,onUpdate:v,onDelete:y,onAdd:b},e))}),S&&(0,d.jsx)(`div`,{className:c.default.footer,children:(0,d.jsx)(`span`,{className:c.default.bracket,children:T?`]`:`}`})})]})},_=l.default.forwardRef(({data:e,expandDepth:n=1,showCopy:r=!0,showToolbar:i=!0,editable:a=!1,onChange:o,className:h,..._},v)=>{let{t:y}=t.useWimTranslation(),[b,x]=(0,l.useState)(e),[S,C]=(0,l.useState)(e),w=(0,l.useId)();e!==S&&(x(e),C(e));let T=(0,l.useCallback)((e,t)=>{x(n=>{let r=f(n,e,t);return o?.(r),r})},[o]),E=(0,l.useCallback)(e=>{x(t=>{let n=p(t,e);return o?.(n),n})},[o]),D=(0,l.useCallback)(e=>{x(t=>{let n=m(t,e);return o?.(n),n})},[o]),O=()=>{navigator.clipboard.writeText(JSON.stringify(b,null,2))};return(0,d.jsxs)(`div`,{ref:v,className:(0,u.default)(`wim-json-viewer`,c.default.root,h),role:i?`group`:void 0,"aria-labelledby":i?w:void 0,..._,children:[i&&(0,d.jsxs)(`div`,{className:c.default.toolbar,children:[(0,d.jsx)(`span`,{id:w,className:c.default.title,children:y(a?`jsonViewer.edit`:`jsonViewer.title`)}),r&&(0,d.jsx)(s.IconButton,{iconName:`CopyIcon`,variant:`ghost`,size:`sm`,onClick:O,"aria-label":y(`jsonViewer.copy`)})]}),(0,d.jsx)(`div`,{className:c.default.tree,children:(0,d.jsx)(g,{value:b,depth:n,currentDepth:0,path:[],editable:a,onUpdate:T,onDelete:E,onAdd:D})})]})});_.displayName=`JsonViewer`,exports.JsonViewer=_;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../../i18n/generated/common.cjs"),r=require("../../../icon/chevron-down.cjs"),i=require("../../../icon/chevron-right.cjs"),a=require("../../../icon/plus.cjs"),o=require("../../../icon/trash.cjs"),s=require("../../media/Icon/Icon.cjs"),c=require("../../form/IconButton/IconButton.cjs"),l=require("./json-viewer.module.cjs");let u=require("react");u=e.__toESM(u,1);let d=require("classnames");d=e.__toESM(d,1);let f=require("react/jsx-runtime");var p=(e,t,n)=>{if(t.length===0)return n;let[r,...i]=t;if(Array.isArray(e)){let t=[...e];return t[r]=p(e[r],i,n),t}return typeof e==`object`&&e?{...e,[r]:p(e[r],i,n)}:e},m=(e,t)=>{if(t.length===0)return e;let[n,...r]=t;if(t.length===1){if(Array.isArray(e))return e.filter((e,t)=>t!==n);if(typeof e==`object`&&e){let t={...e};return delete t[n],t}return e}if(Array.isArray(e)){let t=[...e];return t[n]=m(e[n],r),t}return typeof e==`object`&&e?{...e,[n]:m(e[n],r)}:e},h=(e,t,n)=>{if(t.length===0)return Array.isArray(e)?[...e,``]:typeof e==`object`&&e?{...e,[n||`new_key`]:``}:e;let[r,...i]=t;if(Array.isArray(e)){let t=[...e];return t[r]=h(e[r],i,n),t}return typeof e==`object`&&e?{...e,[r]:h(e[r],i,n)}:e},g=({value:e,onSave:t,className:n})=>{let[r,i]=(0,u.useState)(!1),[a,o]=(0,u.useState)(String(e)),s=u.default.useRef(null);u.default.useEffect(()=>{r&&s.current&&s.current.focus()},[r]);let c=()=>{i(!1);let n=a;typeof e==`number`&&(n=Number(a)),typeof e==`boolean`&&(n=a===`true`),a===`null`&&(n=null),t(n)};return r?(0,f.jsx)(`input`,{ref:s,className:l.default.input,value:a,onChange:e=>o(e.target.value),onBlur:c,onKeyDown:e=>{e.key===`Enter`&&c(),e.key===`Escape`&&i(!1)}}):(0,f.jsx)(`span`,{role:`button`,tabIndex:0,className:(0,d.default)(l.default.value,n,l.default.editable),onClick:()=>i(!0),onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),i(!0))},children:typeof e==`string`?`"${e}"`:String(e)})},_=({label:e,value:c,depth:p,currentDepth:m,path:h,editable:v,onUpdate:y,onDelete:b,onAdd:x})=>{let{t:S}=t.useWimTranslation(n.commonNs),[C,w]=(0,u.useState)(m<p),T=typeof c==`object`&&!!c,E=Array.isArray(c),D=()=>w(!C),O=()=>v?(0,f.jsxs)(`div`,{className:l.default.actions,children:[T&&(0,f.jsx)(`button`,{type:`button`,className:l.default.nodeAction,onClick:e=>{e.stopPropagation(),x(h)},title:S(`jsonViewer.addItem`),"aria-label":S(`jsonViewer.addItem`),children:(0,f.jsx)(s.Icon,{component:a.default,size:`xs`})}),m>0&&(0,f.jsx)(`button`,{type:`button`,className:(0,d.default)(l.default.nodeAction,l.default.delete),onClick:e=>{e.stopPropagation(),b(h)},title:S(`jsonViewer.deleteItem`),"aria-label":S(`jsonViewer.deleteItem`),children:(0,f.jsx)(s.Icon,{component:o.default,size:`xs`})})]}):null;if(!T)return(0,f.jsxs)(`div`,{className:l.default.node,children:[e&&(0,f.jsxs)(`span`,{className:l.default.key,children:[e,`:`]}),v?(0,f.jsx)(g,{value:c,onSave:e=>y(h,e),className:l.default[c===null?`null`:typeof c]}):(0,f.jsx)(`span`,{className:(0,d.default)(l.default.value,l.default[c===null?`null`:typeof c]),children:typeof c==`string`?`"${c}"`:String(c)}),O()]});let k=E?c.length===0:Object.keys(c).length===0;return(0,f.jsxs)(`div`,{className:l.default.node,children:[(0,f.jsxs)(`div`,{className:l.default.headerRow,children:[(0,f.jsxs)(`div`,{role:`button`,tabIndex:k?-1:0,className:(0,d.default)(l.default.header,!k&&l.default.collapsible),onClick:k?void 0:D,onKeyDown:e=>{!k&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),D())},children:[!k&&(0,f.jsx)(s.Icon,{component:C?r.default:i.default,size:`sm`,className:l.default.toggle}),e&&(0,f.jsxs)(`span`,{className:l.default.key,children:[e,`:`]}),(0,f.jsx)(`span`,{className:l.default.bracket,children:E?`[`:`{`}),!C&&!k&&(0,f.jsx)(`span`,{className:l.default.ellipsis,children:`...`}),!C&&(0,f.jsx)(`span`,{className:l.default.bracket,children:E?`]`:`}`}),C&&(0,f.jsx)(`span`,{className:l.default.count,children:E?`${c.length} items`:`${Object.keys(c).length} keys`})]}),O()]}),C&&!k&&(0,f.jsx)(`div`,{className:l.default.children,children:E?c.map((e,t)=>(0,f.jsx)(_,{value:e,depth:p,currentDepth:m+1,path:[...h,t],editable:v,onUpdate:y,onDelete:b,onAdd:x},t)):Object.entries(c).map(([e,t])=>(0,f.jsx)(_,{label:e,value:t,depth:p,currentDepth:m+1,path:[...h,e],editable:v,onUpdate:y,onDelete:b,onAdd:x},e))}),C&&(0,f.jsx)(`div`,{className:l.default.footer,children:(0,f.jsx)(`span`,{className:l.default.bracket,children:E?`]`:`}`})})]})},v=u.default.forwardRef(({data:e,expandDepth:r=1,showCopy:i=!0,showToolbar:a=!0,editable:o=!1,onChange:s,className:g,...v},y)=>{let{t:b}=t.useWimTranslation(n.commonNs),[x,S]=(0,u.useState)(e),[C,w]=(0,u.useState)(e),T=(0,u.useId)();e!==C&&(S(e),w(e));let E=(0,u.useCallback)((e,t)=>{S(n=>{let r=p(n,e,t);return s?.(r),r})},[s]),D=(0,u.useCallback)(e=>{S(t=>{let n=m(t,e);return s?.(n),n})},[s]),O=(0,u.useCallback)(e=>{S(t=>{let n=h(t,e);return s?.(n),n})},[s]),k=()=>{navigator.clipboard.writeText(JSON.stringify(x,null,2))};return(0,f.jsxs)(`div`,{ref:y,className:(0,d.default)(`wim-json-viewer`,l.default.root,g),role:a?`group`:void 0,"aria-labelledby":a?T:void 0,...v,children:[a&&(0,f.jsxs)(`div`,{className:l.default.toolbar,children:[(0,f.jsx)(`span`,{id:T,className:l.default.title,children:b(o?`jsonViewer.edit`:`jsonViewer.title`)}),i&&(0,f.jsx)(c.IconButton,{iconName:`CopyIcon`,variant:`ghost`,size:`sm`,onClick:k,"aria-label":b(`jsonViewer.copy`)})]}),(0,f.jsx)(`div`,{className:l.default.tree,children:(0,f.jsx)(_,{value:x,depth:r,currentDepth:0,path:[],editable:o,onUpdate:E,onDelete:D,onAdd:O})})]})});v.displayName=`JsonViewer`,exports.JsonViewer=v;