wimui 0.51.1 → 0.52.0

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

@@ -1,12 +1,13 @@
 "use client";
 import { Root as e, Slottable as t } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
 import { useWimTranslation as n } from "../../../i18n/useWimTranslation.js";
-import r from "./countdown.module.js";
-import i from "react";
-import a from "classnames";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { dataDisplayNs as r } from "../../../i18n/generated/data-display.js";
+import i from "./countdown.module.js";
+import a from "react";
+import o from "classnames";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/components/data-display/Countdown/Countdown.tsx
-var c = (e) => e instanceof Date ? e.getTime() : new Date(e).getTime(), l = (e) => String(e).padStart(2, "0"), u = (e, t) => {
+var l = (e) => e instanceof Date ? e.getTime() : new Date(e).getTime(), u = (e) => String(e).padStart(2, "0"), d = (e, t) => {
 	let n = Math.floor(e / 86400), r = Math.floor(t ? e / 3600 : e % 86400 / 3600), i = Math.floor(e % 3600 / 60), a = e % 60, o = [];
 	return !t && n > 0 && o.push({
 		unit: "day",
@@ -21,32 +22,32 @@ var c = (e) => e instanceof Date ? e.getTime() : new Date(e).getTime(), l = (e)
 		unit: "second",
 		value: a
 	}), o;
-}, d = i.forwardRef(({ target: d, baseDate: f, variant: p = "digital", size: m = "md", locale: h, unitDisplay: g = "short", paused: _ = !1, onComplete: v, completedContent: y, fallback: b, asChild: x = !1, className: S, children: C, ...w }, T) => {
-	let { t: E, i18n: D } = n("data-display"), O = h ?? D?.language ?? "en", k = x ? e : "time", A = c(d), j = !Number.isNaN(A), M = f !== void 0, [N, P] = i.useState(() => Date.now()), F = M ? c(f) : N, I = j ? Math.max(0, A - F) : 0, L = j && I <= 0, R = !M && !_ && j && !L;
-	i.useEffect(() => {
-		!_ && !M && P(Date.now());
-	}, [_, M]), i.useEffect(() => {
-		if (!R) return;
-		let e = (A - Date.now()) % 1e3 || 1e3, t = window.setTimeout(() => P(Date.now()), e);
+}, f = a.forwardRef(({ target: f, baseDate: p, variant: m = "digital", size: h = "md", locale: g, unitDisplay: _ = "short", paused: v = !1, onComplete: y, completedContent: b, fallback: x, asChild: S = !1, className: C, children: w, ...T }, E) => {
+	let { t: D, i18n: O } = n(r), k = g ?? O?.language ?? "en", A = S ? e : "time", j = l(f), M = !Number.isNaN(j), N = p !== void 0, [P, F] = a.useState(() => Date.now()), I = N ? l(p) : P, L = M ? Math.max(0, j - I) : 0, R = M && L <= 0, z = !N && !v && M && !R;
+	a.useEffect(() => {
+		!v && !N && F(Date.now());
+	}, [v, N]), a.useEffect(() => {
+		if (!z) return;
+		let e = (j - Date.now()) % 1e3 || 1e3, t = window.setTimeout(() => F(Date.now()), e);
 		return () => window.clearTimeout(t);
 	}, [
-		R,
-		A,
-		N
+		z,
+		j,
+		P
 	]);
-	let z = i.useRef(!1);
-	i.useEffect(() => {
-		z.current = !1;
-	}, [A]), i.useEffect(() => {
-		j && !M && L && (z.current || (z.current = !0, v?.()));
+	let B = a.useRef(!1);
+	a.useEffect(() => {
+		B.current = !1;
+	}, [j]), a.useEffect(() => {
+		M && !N && R && (B.current || (B.current = !0, y?.()));
 	}, [
-		L,
+		R,
+		N,
 		M,
-		j,
-		v
+		y
 	]);
-	let B = i.useMemo(() => /* @__PURE__ */ new Map(), [O]), V = (e, t) => {
-		let n = `${e}-${t}`, r = B.get(n);
+	let V = a.useMemo(() => /* @__PURE__ */ new Map(), [k]), H = (e, t) => {
+		let n = `${e}-${t}`, r = V.get(n);
 		if (!r) {
 			let i = {
 				style: "unit",
@@ -54,47 +55,47 @@ var c = (e) => e instanceof Date ? e.getTime() : new Date(e).getTime(), l = (e)
 				unitDisplay: t
 			};
 			try {
-				r = new Intl.NumberFormat(O, i);
+				r = new Intl.NumberFormat(k, i);
 			} catch {
 				r = new Intl.NumberFormat("en", i);
 			}
-			B.set(n, r);
+			V.set(n, r);
 		}
 		return r;
-	}, H = (e) => V(e.unit, g).formatToParts(e.value).filter((e) => e.type === "unit").map((e) => e.value).join("");
-	if (!j) return /* @__PURE__ */ s(k, {
-		ref: T,
-		className: a("wim-countdown", r.root, S),
-		...w,
-		children: [/* @__PURE__ */ o(t, { children: C }), b]
+	}, U = (e) => H(e.unit, _).formatToParts(e.value).filter((e) => e.type === "unit").map((e) => e.value).join("");
+	if (!M) return /* @__PURE__ */ c(A, {
+		ref: E,
+		className: o("wim-countdown", i.root, C),
+		...T,
+		children: [/* @__PURE__ */ s(t, { children: w }), x]
 	});
-	let U = Math.floor(I / 1e3), W = u(U, p === "digital"), G = L && y !== void 0, K = u(U, !1).map((e) => V(e.unit, "long").format(e.value)).join(" ");
-	return /* @__PURE__ */ s(k, {
-		ref: T,
+	let W = Math.floor(L / 1e3), G = d(W, m === "digital"), K = R && b !== void 0, q = d(W, !1).map((e) => H(e.unit, "long").format(e.value)).join(" ");
+	return /* @__PURE__ */ c(A, {
+		ref: E,
 		role: "timer",
-		"aria-label": G ? void 0 : E("countdown.remaining", { time: K }),
-		className: a("wim-countdown", r.root, r[p], r[m], S),
-		dateTime: new Date(A).toISOString(),
-		...w,
-		children: [/* @__PURE__ */ o(t, { children: C }), G ? y : p === "digital" ? W.map((e, t) => /* @__PURE__ */ s(i.Fragment, { children: [t > 0 && /* @__PURE__ */ o("span", {
-			className: r.separator,
+		"aria-label": K ? void 0 : D("countdown.remaining", { time: q }),
+		className: o("wim-countdown", i.root, i[m], i[h], C),
+		dateTime: new Date(j).toISOString(),
+		...T,
+		children: [/* @__PURE__ */ s(t, { children: w }), K ? b : m === "digital" ? G.map((e, t) => /* @__PURE__ */ c(a.Fragment, { children: [t > 0 && /* @__PURE__ */ s("span", {
+			className: i.separator,
 			"aria-hidden": "true",
 			children: ":"
-		}), /* @__PURE__ */ o("span", {
-			className: r.value,
-			children: l(e.value)
-		})] }, e.unit)) : W.map((e) => /* @__PURE__ */ s("span", {
-			className: r.segment,
-			children: [/* @__PURE__ */ o("span", {
-				className: r.value,
-				children: e.unit === "day" ? String(e.value) : l(e.value)
-			}), /* @__PURE__ */ o("span", {
-				className: r.label,
-				children: H(e)
+		}), /* @__PURE__ */ s("span", {
+			className: i.value,
+			children: u(e.value)
+		})] }, e.unit)) : G.map((e) => /* @__PURE__ */ c("span", {
+			className: i.segment,
+			children: [/* @__PURE__ */ s("span", {
+				className: i.value,
+				children: e.unit === "day" ? String(e.value) : u(e.value)
+			}), /* @__PURE__ */ s("span", {
+				className: i.label,
+				children: U(e)
 			})]
 		}, e.unit))]
 	});
 });
-d.displayName = "Countdown";
+f.displayName = "Countdown";
 //#endregion
-export { d as Countdown };
+export { f as Countdown };

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

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

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;