@thebuoyant-tsdev/mui-ts-library 3.25.0 → 3.26.1

package/README.de.md

@@ -483,6 +483,28 @@ Dieses Projekt folgt [Semantic Versioning](https://semver.org/):
 
 ## Changelog
 
+### [3.26.1] — 2026-07-13
+
+**Behoben**
+- README-Changelog-Abschnitte (EN + DE) fehlten auf npmjs.com die Einträge für `[3.25.0]` und `[3.26.0]`. Keine Code-Änderungen.
+
+---
+
+### [3.26.0] — 2026-07-13
+
+**Hinzugefügt**
+- **`PopoverColorPicker`** — Convenience-Wrapper, der einen farbigen Swatch-Trigger-Button mit einem MUI-Popover und dem vollen `ColorPicker` kombiniert. Kein `Popover`, `anchorEl` oder Open/Close-State nötig — nur `value` + `onChange`. Alle `ColorPicker`-Props werden direkt durchgereicht. Neue Props: `swatchSize` (Standard `28`) und `swatchShape` (`"square"` | `"circle"`). Vollständig barrierefrei. Neue Exports: `popoverColorPickerClasses`. Vollständig rückwärtskompatibel. Siehe [Full Changelog](https://github.com/thebuoyant/mui-ts-library/blob/main/CHANGELOG.de.md) für Details.
+
+---
+
+### [3.25.0] — 2026-07-12
+
+**Hinzugefügt**
+- **`JsonEditor` — Download-Button:** Neuer Toolbar-Button der den Editor-Inhalt als `.json`-Datei exportiert. Standardmäßig sichtbar (`showDownload: true`). Dateiname per `downloadFilename` steuerbar (Standard `"file.json"`). Mit `toolbarConfig={{ showDownload: false }}` ausblendbar. Vollständig rückwärtskompatibel. Siehe [Full Changelog](https://github.com/thebuoyant/mui-ts-library/blob/main/CHANGELOG.de.md) für Details.
+- **`GanttChart` — Tastaturnavigation:** Das Task-Panel ist jetzt per Tastatur bedienbar — `Tab` fokussiert, `↑`/`↓` bewegen die Auswahl, `Enter` öffnet den Bearbeiten-Dialog, `Escape` hebt die Auswahl auf. Keine neuen Props erforderlich. Siehe [Full Changelog](https://github.com/thebuoyant/mui-ts-library/blob/main/CHANGELOG.de.md) für Details.
+
+---
+
 ### [3.24.1] — 2026-07-10
 
 **Behoben**

package/README.md

@@ -483,6 +483,28 @@ This project follows [Semantic Versioning](https://semver.org/):
 
 ## Changelog
 
+### [3.26.1] — 2026-07-13
+
+**Fixed**
+- README changelog sections (EN + DE) were missing the `[3.25.0]` and `[3.26.0]` entries on npmjs.com. No code changes.
+
+---
+
+### [3.26.0] — 2026-07-13
+
+**Added**
+- **`PopoverColorPicker`** — a convenience wrapper that combines a colored swatch trigger button with a MUI Popover containing the full `ColorPicker`. No `Popover`, `anchorEl`, or open/close state needed — just `value` + `onChange`. All `ColorPicker` props pass through directly. New props: `swatchSize` (default `28`) and `swatchShape` (`"square"` | `"circle"`). Fully accessible (aria-expanded, aria-haspopup, keyboard support). New exports: `popoverColorPickerClasses`. Fully backwards-compatible. See [Full Changelog](https://github.com/thebuoyant/mui-ts-library/blob/main/CHANGELOG.md) for details.
+
+---
+
+### [3.25.0] — 2026-07-12
+
+**Added**
+- **`JsonEditor` — Download button:** New toolbar button that exports the current editor content as a `.json` file. Shown by default (`showDownload: true`). Control the filename via `downloadFilename` (default `"file.json"`). Add `toolbarConfig={{ showDownload: false }}` to opt out. Fully backwards-compatible. See [Full Changelog](https://github.com/thebuoyant/mui-ts-library/blob/main/CHANGELOG.md) for details.
+- **`GanttChart` — Keyboard Navigation:** The task panel is now keyboard-accessible — `Tab` to focus, `↑`/`↓` to move selection, `Enter` to open the edit dialog, `Escape` to deselect. No new props required. See [Full Changelog](https://github.com/thebuoyant/mui-ts-library/blob/main/CHANGELOG.md) for details.
+
+---
+
 ### [3.24.1] — 2026-07-10
 
 **Fixed**

package/dist/components/color-picker/ColorPicker.js

@@ -4,8 +4,8 @@ import { clamp as n, hexToRgba as r, hslaToHsva as i, hsvaToHsla as a, hsvaToRgb
 import { DEFAULT_COLOR_PICKER_TRANSLATION as u } from "./ColorPicker.types.js";
 import { useEffect as d, useRef as f, useState as p } from "react";
 import { Box as m, IconButton as ee, MenuItem as h, Select as te, TextField as g, Tooltip as ne, Typography as re, useTheme as ie } from "@mui/material";
-import { jsx as _, jsxs as v } from "react/jsx-runtime";
 import ae from "@mui/icons-material/Colorize";
+import { jsx as _, jsxs as v } from "react/jsx-runtime";
 //#region src/components/color-picker/ColorPicker.tsx
 function y(e, t) {
 	let r = n(e, 0, 100);

package/dist/components/color-picker/ColorPicker.types.d.ts

@@ -31,6 +31,19 @@ export type ColorPickerTranslation = {
     hueSliderLabel: string;
 };
 export declare const DEFAULT_COLOR_PICKER_TRANSLATION: Required<ColorPickerTranslation>;
+export type PopoverColorPickerTranslation = {
+    /** aria-label for the swatch trigger button. */
+    openLabel: string;
+};
+export declare const DEFAULT_POPOVER_COLOR_PICKER_TRANSLATION: Required<PopoverColorPickerTranslation>;
+export type PopoverColorPickerProps = Omit<ColorPickerProps, "translation"> & {
+    /** Size of the swatch trigger button in px (default: 28). */
+    swatchSize?: number;
+    /** Shape of the swatch button (default: `'square'`). */
+    swatchShape?: "square" | "circle";
+    /** i18n strings — merged with the inner ColorPicker translation. */
+    translation?: Partial<ColorPickerTranslation & PopoverColorPickerTranslation>;
+};
 export type ColorPickerProps = {
     /** Current color — accepts hex (#rgb, #rgba, #rrggbb, #rrggbbaa), rgb()/rgba(), or hsl()/hsla(). */
     value: string;

package/dist/components/color-picker/ColorPicker.types.js

@@ -13,6 +13,6 @@ var e = {
 	savedColorsLabel: "Saved colors",
 	gradientAreaLabel: "Saturation and brightness",
 	hueSliderLabel: "Hue"
-};
+}, t = { openLabel: "Open color picker" };
 //#endregion
-export { e as DEFAULT_COLOR_PICKER_TRANSLATION };
+export { e as DEFAULT_COLOR_PICKER_TRANSLATION, t as DEFAULT_POPOVER_COLOR_PICKER_TRANSLATION };

package/dist/components/color-picker/PopoverColorPicker.d.ts

@@ -0,0 +1,2 @@
+import { type PopoverColorPickerProps } from "./ColorPicker.types";
+export declare function PopoverColorPicker({ value, onChange, onChangeCommitted, swatchSize, swatchShape, disabled, translation, ...colorPickerProps }: PopoverColorPickerProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/color-picker/PopoverColorPicker.js

@@ -0,0 +1,81 @@
+import { muiTsStateClasses as e } from "../../utils/muiTsClasses.js";
+import { popoverColorPickerClasses as t } from "./popoverColorPickerClasses.js";
+import { DEFAULT_POPOVER_COLOR_PICKER_TRANSLATION as n } from "./ColorPicker.types.js";
+import { ColorPicker as r } from "./ColorPicker.js";
+import { useState as i } from "react";
+import { Box as a, Popover as o, useTheme as s } from "@mui/material";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/color-picker/PopoverColorPicker.tsx
+var d = {
+	backgroundImage: "linear-gradient(45deg, #ccc 25%, transparent 25%), linear-gradient(-45deg, #ccc 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #ccc 75%), linear-gradient(-45deg, transparent 75%, #ccc 75%)",
+	backgroundSize: "8px 8px",
+	backgroundPosition: "0 0, 0 4px, 4px -4px, -4px 0px"
+};
+function f({ value: f, onChange: p, onChangeCommitted: m, swatchSize: h = 28, swatchShape: g = "square", disabled: _ = !1, translation: v, ...y }) {
+	let b = s(), x = {
+		...n,
+		...v
+	}, [S, C] = i(null), w = !!S, T = g === "circle" ? "50%" : `${b.shape.borderRadius}px`;
+	return /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l(a, {
+		component: "button",
+		type: "button",
+		disabled: _,
+		"aria-label": x.openLabel,
+		"aria-expanded": w,
+		"aria-haspopup": "dialog",
+		onClick: (e) => C(e.currentTarget),
+		className: [t.root, _ ? e.disabled : void 0].filter(Boolean).join(" "),
+		sx: {
+			width: h,
+			height: h,
+			minWidth: h,
+			p: 0,
+			borderRadius: T,
+			border: `1px solid ${b.palette.divider}`,
+			cursor: _ ? "default" : "pointer",
+			overflow: "hidden",
+			flexShrink: 0,
+			...d,
+			"&:hover:not(:disabled)": { borderColor: b.palette.primary.main },
+			"&:focus-visible": {
+				outline: `2px solid ${b.palette.primary.main}`,
+				outlineOffset: 2
+			}
+		},
+		children: /* @__PURE__ */ l(a, {
+			className: t.swatch,
+			sx: {
+				width: "100%",
+				height: "100%",
+				borderRadius: "inherit",
+				backgroundColor: f
+			}
+		})
+	}), /* @__PURE__ */ l(o, {
+		open: w,
+		anchorEl: S,
+		onClose: () => C(null),
+		anchorOrigin: {
+			vertical: "bottom",
+			horizontal: "left"
+		},
+		transformOrigin: {
+			vertical: "top",
+			horizontal: "left"
+		},
+		slotProps: { paper: {
+			sx: { p: 1.5 },
+			"data-testid": "popover-color-picker"
+		} },
+		children: /* @__PURE__ */ l(r, {
+			value: f,
+			onChange: p,
+			onChangeCommitted: m,
+			disabled: _,
+			translation: v,
+			...y
+		})
+	})] });
+}
+//#endregion
+export { f as PopoverColorPicker };

package/dist/components/color-picker/popoverColorPickerClasses.d.ts

@@ -0,0 +1,15 @@
+/**
+ * CSS class names for every named slot in the PopoverColorPicker component.
+ *
+ * @example
+ * ```css
+ * .MuiTsPopoverColorPicker-root { border-radius: 50%; }
+ * .MuiTsPopoverColorPicker-root.MuiTs-disabled { opacity: 0.4; pointer-events: none; }
+ * ```
+ */
+export declare const popoverColorPickerClasses: {
+    /** The swatch button that triggers the popover. Also receives `MuiTs-disabled` when `disabled={true}`. */
+    readonly root: "MuiTsPopoverColorPicker-root";
+    /** The inner colored box inside the swatch button. */
+    readonly swatch: "MuiTsPopoverColorPicker-swatch";
+};

package/dist/components/color-picker/popoverColorPickerClasses.js

@@ -0,0 +1,7 @@
+//#region src/components/color-picker/popoverColorPickerClasses.ts
+var e = {
+	root: "MuiTsPopoverColorPicker-root",
+	swatch: "MuiTsPopoverColorPicker-swatch"
+};
+//#endregion
+export { e as popoverColorPickerClasses };

package/dist/components/json-editor/JsonEditorContent.js

@@ -2,30 +2,30 @@ import { computeJsonPath as e } from "./util/jsonPathFinder.js";
 import { findRangeForPath as t, validateAgainstSchema as n } from "./util/jsonSchemaValidator.js";
 import { useEffect as r, useRef as i, useState as a } from "react";
 import { Box as o, Fade as s, Paper as c, Typography as ee, useTheme as te } from "@mui/material";
-import { EditorView as l, highlightActiveLine as ne, highlightActiveLineGutter as u, keymap as re, lineNumbers as d, placeholder as f } from "@codemirror/view";
-import { Compartment as p, EditorState as m } from "@codemirror/state";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { EditorView as d, highlightActiveLine as ne, highlightActiveLineGutter as f, keymap as re, lineNumbers as p, placeholder as m } from "@codemirror/view";
+import { Compartment as h, EditorState as g } from "@codemirror/state";
 import { json as ie, jsonParseLinter as ae } from "@codemirror/lang-json";
 import { defaultKeymap as oe, history as se, historyKeymap as ce } from "@codemirror/commands";
-import { HighlightStyle as le, foldGutter as h, foldKeymap as ue, syntaxHighlighting as de } from "@codemirror/language";
-import { forceLinting as fe, lintGutter as pe, linter as g } from "@codemirror/lint";
-import { tags as _ } from "@lezer/highlight";
+import { HighlightStyle as le, foldGutter as _, foldKeymap as ue, syntaxHighlighting as de } from "@codemirror/language";
+import { forceLinting as fe, lintGutter as pe, linter as v } from "@codemirror/lint";
+import { tags as y } from "@lezer/highlight";
 import { showMinimap as me } from "@replit/codemirror-minimap";
-import { jsx as v, jsxs as y } from "react/jsx-runtime";
 //#region src/components/json-editor/JsonEditorContent.tsx
 function b(e) {
-	return e ? [d(), u()] : [];
+	return e ? [p(), f()] : [];
 }
 function x(e) {
-	return e ? [h()] : [];
+	return e ? [_()] : [];
 }
 function S(e) {
-	return e ? [f(e)] : [];
+	return e ? [m(e)] : [];
 }
-function C({ value: u, onChange: d, placeholder: f, disabled: h = !1, readonly: C = !1, schema: w, showLineNumbers: T = !0, showMinimap: E = !1, showFolding: D = !0, enablePathFinder: O = !0, highlightColors: k, onViewReady: A, onCursorChange: j, onBlur: M, onFocus: N, onPathCopy: P }) {
-	let F = i(null), I = i(null), L = i(null), R = i(d), z = i(j), he = i(M), B = i(N), V = i(A), H = i(P), U = i(O), W = i(w), [G, K] = a(null), q = i(new p()), J = i(new p()), Y = i(new p()), X = i(new p()), Z = i(new p()), Q = te(), $ = Q.palette.mode === "dark", ge = k?.propertyName ?? Q.palette.primary.main, _e = k?.string ?? Q.palette.success.main, ve = k?.number ?? Q.palette.warning.main, ye = k?.boolean ?? Q.palette.info.main, be = k?.null ?? Q.palette.text.secondary;
+function C({ value: f, onChange: p, placeholder: m, disabled: _ = !1, readonly: C = !1, schema: w, showLineNumbers: T = !0, showMinimap: E = !1, showFolding: D = !0, enablePathFinder: O = !0, highlightColors: k, onViewReady: A, onCursorChange: j, onBlur: M, onFocus: N, onPathCopy: P }) {
+	let F = i(null), I = i(null), L = i(null), R = i(p), z = i(j), he = i(M), B = i(N), V = i(A), H = i(P), U = i(O), W = i(w), [G, K] = a(null), q = i(new h()), J = i(new h()), Y = i(new h()), X = i(new h()), Z = i(new h()), Q = te(), $ = Q.palette.mode === "dark", ge = k?.propertyName ?? Q.palette.primary.main, _e = k?.string ?? Q.palette.success.main, ve = k?.number ?? Q.palette.warning.main, ye = k?.boolean ?? Q.palette.info.main, be = k?.null ?? Q.palette.text.secondary;
 	return r(() => {
-		R.current = d;
-	}, [d]), r(() => {
+		R.current = p;
+	}, [p]), r(() => {
 		z.current = j;
 	}, [j]), r(() => {
 		he.current = M;
@@ -41,44 +41,44 @@ function C({ value: u, onChange: d, placeholder: f, disabled: h = !1, readonly:
 		W.current = w, L.current && fe(L.current);
 	}, [w]), r(() => {
 		if (!I.current) return;
-		let r = L.current?.state.doc.toString() ?? u ?? "", i = le.define([
+		let r = L.current?.state.doc.toString() ?? f ?? "", i = le.define([
 			{
-				tag: _.propertyName,
+				tag: y.propertyName,
 				color: ge,
 				fontWeight: "bold"
 			},
 			{
-				tag: _.string,
+				tag: y.string,
 				color: _e
 			},
 			{
-				tag: _.number,
+				tag: y.number,
 				color: ve
 			},
 			{
-				tag: _.bool,
+				tag: y.bool,
 				color: ye,
 				fontWeight: "bold"
 			},
 			{
-				tag: _.null,
+				tag: y.null,
 				color: be,
 				fontStyle: "italic"
 			},
 			{
-				tag: _.bracket,
+				tag: y.bracket,
 				color: Q.palette.text.secondary
 			},
 			{
-				tag: _.punctuation,
+				tag: y.punctuation,
 				color: Q.palette.text.disabled
 			},
 			{
-				tag: _.invalid,
+				tag: y.invalid,
 				color: Q.palette.error.main,
 				textDecoration: "underline wavy"
 			}
-		]), a = l.theme({
+		]), a = d.theme({
 			"&": {
 				height: "100%",
 				fontFamily: "'Fira Code', 'JetBrains Mono', 'Consolas', monospace",
@@ -141,8 +141,8 @@ function C({ value: u, onChange: d, placeholder: f, disabled: h = !1, readonly:
 			de(i),
 			ie(),
 			pe(),
-			g(ae()),
-			g((e) => {
+			v(ae()),
+			v((e) => {
 				let r = W.current;
 				if (!r) return [];
 				let i;
@@ -169,19 +169,19 @@ function C({ value: u, onChange: d, placeholder: f, disabled: h = !1, readonly:
 				...ce,
 				...ue
 			]),
-			q.current.of(l.editable.of(!h && !C)),
-			J.current.of(m.readOnly.of(C)),
+			q.current.of(d.editable.of(!_ && !C)),
+			J.current.of(g.readOnly.of(C)),
 			ne(),
 			X.current.of(b(T)),
 			Y.current.of(x(D)),
-			Z.current.of(S(f)),
+			Z.current.of(S(m)),
 			...o,
-			l.updateListener.of((e) => {
+			d.updateListener.of((e) => {
 				e.docChanged && R.current?.(e.state.doc.toString());
 				let t = e.state.selection.main.head, n = e.state.doc.lineAt(t);
 				z.current(n.number, t - n.from + 1);
 			}),
-			l.domEventHandlers({
+			d.domEventHandlers({
 				blur: () => {
 					he.current?.();
 				},
@@ -211,8 +211,8 @@ function C({ value: u, onChange: d, placeholder: f, disabled: h = !1, readonly:
 					}), !0) : !1;
 				}
 			})
-		], c = new l({
-			state: m.create({
+		], c = new d({
+			state: g.create({
 				doc: r,
 				extensions: s
 			}),
@@ -233,24 +233,24 @@ function C({ value: u, onChange: d, placeholder: f, disabled: h = !1, readonly:
 		let e = L.current;
 		if (!e) return;
 		let t = e.state.doc.toString();
-		t !== (u ?? "") && e.dispatch({ changes: {
+		t !== (f ?? "") && e.dispatch({ changes: {
 			from: 0,
 			to: t.length,
-			insert: u ?? ""
+			insert: f ?? ""
 		} });
-	}, [u]), r(() => {
-		L.current?.dispatch({ effects: [q.current.reconfigure(l.editable.of(!h && !C)), J.current.reconfigure(m.readOnly.of(C))] });
-	}, [h, C]), r(() => {
+	}, [f]), r(() => {
+		L.current?.dispatch({ effects: [q.current.reconfigure(d.editable.of(!_ && !C)), J.current.reconfigure(g.readOnly.of(C))] });
+	}, [_, C]), r(() => {
 		L.current?.dispatch({ effects: X.current.reconfigure(b(T)) });
 	}, [T]), r(() => {
 		L.current?.dispatch({ effects: Y.current.reconfigure(x(D)) });
 	}, [D]), r(() => {
-		L.current?.dispatch({ effects: Z.current.reconfigure(S(f)) });
-	}, [f]), r(() => {
+		L.current?.dispatch({ effects: Z.current.reconfigure(S(m)) });
+	}, [m]), r(() => {
 		if (!G) return;
 		let e = setTimeout(() => K(null), 1500);
 		return () => clearTimeout(e);
-	}, [G]), /* @__PURE__ */ y(o, {
+	}, [G]), /* @__PURE__ */ u(o, {
 		ref: F,
 		sx: {
 			position: "relative",
@@ -258,14 +258,14 @@ function C({ value: u, onChange: d, placeholder: f, disabled: h = !1, readonly:
 			overflow: "hidden",
 			display: "flex"
 		},
-		children: [/* @__PURE__ */ v(o, {
+		children: [/* @__PURE__ */ l(o, {
 			ref: I,
 			sx: {
 				flex: 1,
 				overflow: "hidden",
 				display: "flex",
 				flexDirection: "column",
-				opacity: h ? .5 : 1,
+				opacity: _ ? .5 : 1,
 				backgroundColor: Q.palette.background.paper,
 				"& .cm-editor": {
 					flex: 1,
@@ -273,9 +273,9 @@ function C({ value: u, onChange: d, placeholder: f, disabled: h = !1, readonly:
 					flexDirection: "column"
 				}
 			}
-		}), G && /* @__PURE__ */ v(s, {
+		}), G && /* @__PURE__ */ l(s, {
 			in: !0,
-			children: /* @__PURE__ */ v(c, {
+			children: /* @__PURE__ */ l(c, {
 				elevation: 3,
 				sx: {
 					position: "absolute",
@@ -289,7 +289,7 @@ function C({ value: u, onChange: d, placeholder: f, disabled: h = !1, readonly:
 					bgcolor: "grey.900",
 					color: "common.white"
 				},
-				children: /* @__PURE__ */ y(ee, {
+				children: /* @__PURE__ */ u(ee, {
 					variant: "caption",
 					sx: { fontFamily: "monospace" },
 					children: ["Copied: ", G.path]

package/dist/components/json-editor/JsonEditorToolbar.js

@@ -1,8 +1,8 @@
 import { ToolbarButton as e } from "../shared/ToolbarButton.js";
 import { useTimedFlag as t } from "../shared/useTimedFlag.js";
 import { Box as n, Divider as r } from "@mui/material";
-import { redo as i, undo as a } from "@codemirror/commands";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { redo as o, undo as s } from "@codemirror/commands";
 import c from "@mui/icons-material/ContentCopy";
 import l from "@mui/icons-material/Download";
 import u from "@mui/icons-material/Check";
@@ -62,14 +62,14 @@ function g({ editorView: g, toolbarConfig: _, translation: v, indent: y, downloa
 	}
 	function M() {
 		let e = g;
-		e && (a(e), e.focus());
+		e && (s(e), e.focus());
 	}
 	function N() {
 		let e = g;
-		e && (i(e), e.focus());
+		e && (o(e), e.focus());
 	}
 	let P = _.showFormat || _.showCompact, F = _.showCopy || _.showDownload || _.showClear, I = _.showUndoRedo;
-	return /* @__PURE__ */ s(n, {
+	return /* @__PURE__ */ a(n, {
 		sx: {
 			display: "flex",
 			flexWrap: "wrap",
@@ -81,83 +81,83 @@ function g({ editorView: g, toolbarConfig: _, translation: v, indent: y, downloa
 		role: "toolbar",
 		"aria-label": "JSON editor actions",
 		children: [
-			P && /* @__PURE__ */ s(n, {
+			P && /* @__PURE__ */ a(n, {
 				sx: {
 					display: "flex",
 					gap: .25
 				},
-				children: [_.showFormat && /* @__PURE__ */ o(e, {
+				children: [_.showFormat && /* @__PURE__ */ i(e, {
 					label: v.format,
-					icon: /* @__PURE__ */ o(m, { fontSize: "small" }),
+					icon: /* @__PURE__ */ i(m, { fontSize: "small" }),
 					onClick: D,
 					disabled: E
-				}), _.showCompact && /* @__PURE__ */ o(e, {
+				}), _.showCompact && /* @__PURE__ */ i(e, {
 					label: v.compact,
-					icon: /* @__PURE__ */ o(h, { fontSize: "small" }),
+					icon: /* @__PURE__ */ i(h, { fontSize: "small" }),
 					onClick: O,
 					disabled: E
 				})]
 			}),
-			P && (F || I) && /* @__PURE__ */ o(r, {
+			P && (F || I) && /* @__PURE__ */ i(r, {
 				orientation: "vertical",
 				flexItem: !0,
 				sx: { mx: .5 }
 			}),
-			F && /* @__PURE__ */ s(n, {
+			F && /* @__PURE__ */ a(n, {
 				sx: {
 					display: "flex",
 					gap: .25
 				},
 				children: [
-					_.showCopy && /* @__PURE__ */ o(e, {
+					_.showCopy && /* @__PURE__ */ i(e, {
 						label: S ? v.copySuccess : v.copy,
-						icon: S ? /* @__PURE__ */ o(u, {
+						icon: S ? /* @__PURE__ */ i(u, {
 							fontSize: "small",
 							color: "success"
-						}) : /* @__PURE__ */ o(c, { fontSize: "small" }),
+						}) : /* @__PURE__ */ i(c, { fontSize: "small" }),
 						onClick: k,
 						disabled: E
 					}),
-					_.showDownload && /* @__PURE__ */ o(e, {
+					_.showDownload && /* @__PURE__ */ i(e, {
 						label: w ? v.downloadSuccess : v.download,
-						icon: w ? /* @__PURE__ */ o(u, {
+						icon: w ? /* @__PURE__ */ i(u, {
 							fontSize: "small",
 							color: "success"
-						}) : /* @__PURE__ */ o(l, { fontSize: "small" }),
+						}) : /* @__PURE__ */ i(l, { fontSize: "small" }),
 						onClick: A,
 						disabled: E
 					}),
-					_.showClear && /* @__PURE__ */ o(e, {
+					_.showClear && /* @__PURE__ */ i(e, {
 						label: v.clear,
-						icon: /* @__PURE__ */ o(d, { fontSize: "small" }),
+						icon: /* @__PURE__ */ i(d, { fontSize: "small" }),
 						onClick: j,
 						disabled: E
 					})
 				]
 			}),
-			F && I && /* @__PURE__ */ o(r, {
+			F && I && /* @__PURE__ */ i(r, {
 				orientation: "vertical",
 				flexItem: !0,
 				sx: { mx: .5 }
 			}),
-			I && /* @__PURE__ */ s(n, {
+			I && /* @__PURE__ */ a(n, {
 				sx: {
 					display: "flex",
 					gap: .25
 				},
-				children: [/* @__PURE__ */ o(e, {
+				children: [/* @__PURE__ */ i(e, {
 					label: v.undo,
-					icon: /* @__PURE__ */ o(f, { fontSize: "small" }),
+					icon: /* @__PURE__ */ i(f, { fontSize: "small" }),
 					onClick: M,
 					disabled: E
-				}), /* @__PURE__ */ o(e, {
+				}), /* @__PURE__ */ i(e, {
 					label: v.redo,
-					icon: /* @__PURE__ */ o(p, { fontSize: "small" }),
+					icon: /* @__PURE__ */ i(p, { fontSize: "small" }),
 					onClick: N,
 					disabled: E
 				})]
 			}),
-			!P && !F && !I && /* @__PURE__ */ o(n, { sx: { height: 32 } })
+			!P && !F && !I && /* @__PURE__ */ i(n, { sx: { height: 32 } })
 		]
 	});
 }