@keboola/design 17.1.0 → 17.2.1

package/dist/internal/components/Truncated.js

@@ -1,5 +1,5 @@
 import { cn } from "../../classNames-DkX30VJU.js";
-import { Tooltip } from "../../utils-BxEJOnFD.js";
+import { Tooltip } from "../../utils-CLNKe1ar.js";
 import { useState } from "react";
 import { jsx } from "react/jsx-runtime";
 // src/components/Truncated.tsx

package/dist/internal/components/ZoomableSvg.js

@@ -1 +1 @@
-export { ZoomableSvg, svgToPngBlob, toSvgFileContent } from "../../ZoomableSvg-CIOqAYpd.js";
+export { ZoomableSvg, svgToPngBlob, toSvgFileContent } from "../../ZoomableSvg-Cp2zJNIG.js";

package/dist/internal/utils.js

@@ -1,5 +1,5 @@
 import { cn } from "../classNames-DkX30VJU.js";
-import { DEFAULT_ENTRY_SEPARATOR, copyToClipboard, createChangeInputEvent, createPrefixedString, debounce, isMac, noop, splitEntry, useSHA256, withHiddenFullscreen, withTooltipProvider, withVisualSettle } from "../utils-BxEJOnFD.js";
+import { DEFAULT_ENTRY_SEPARATOR, copyToClipboard, createChangeInputEvent, createPrefixedString, debounce, isMac, noop, splitEntry, useSHA256, withHiddenFullscreen, withTooltipProvider, withVisualSettle } from "../utils-CLNKe1ar.js";
 import { findLiteralMatches, findLiteralTermMatches, hasLiteralMatch } from "../findLiteralMatches-BaLZTPtx.js";
 import { mergeRefs } from "./utils/mergeRefs.js";
 export { DEFAULT_ENTRY_SEPARATOR, cn, copyToClipboard, createChangeInputEvent, createPrefixedString, debounce, findLiteralMatches, findLiteralTermMatches, hasLiteralMatch, isMac, mergeRefs, noop, splitEntry, useSHA256, withHiddenFullscreen, withTooltipProvider, withVisualSettle };

package/dist/markdown-editor.js

@@ -1,15 +1,15 @@
 import { cn } from "./classNames-DkX30VJU.js";
-import { Tooltip } from "./utils-BxEJOnFD.js";
+import { Tooltip } from "./utils-CLNKe1ar.js";
 import { AlignCenter, AlignJustify, AlignLeft, AlignRight, Bold, ChevronDown, Code, Heading1, Heading2, Heading3, Italic, Link, List, ListOrdered, Quote, SquareCode, Strikethrough, Type, Underline } from "./icons-DDR9dFSr.js";
-import { Button } from "./Button-BAMX1iuI.js";
+import { Button } from "./Button-BgjVUBON.js";
 import { ButtonGroup } from "./internal/components/ButtonGroup.js";
 import { DropdownMenu } from "./DropdownMenu-Ba9atqDa.js";
 import { Label } from "./internal/components/Label.js";
 import { useStableCallback } from "./internal/hooks/useStableCallback.js";
 import { Popover } from "./Popover-DhOPlWgF.js";
-import { TextInput } from "./TextInput-BAL-zOAN.js";
-import { FormGroup } from "./FormGroup-D7ahkK1q.js";
-import { Kbd } from "./Kbd-6velz9J-.js";
+import { TextInput } from "./TextInput-tWtbWBFQ.js";
+import { FormGroup } from "./FormGroup-B-_HsL1J.js";
+import { Kbd } from "./Kbd-D4F65jXO.js";
 import { Skeleton } from "./internal/components/Skeleton/Skeleton.js";
 import { toast } from "./toast-Dzj1EFOb.js";
 import { Suspense, createContext, lazy, use, useCallback, useEffect, useId, useRef, useState } from "react";
@@ -276,7 +276,7 @@ const KeyboardPlugin = ({ onSave, onCancel, singleLine, blurOnEscape, skipBlurSa
 	return null;
 };
 // src/blocks/MarkdownEditor/nodes/MermaidNodeComponent.tsx
-const MermaidDiagram = lazy(() => import("./MermaidDiagram-l83gco3r.js").then((n) => n.MermaidDiagram_exports).then((m) => ({ default: m.MermaidDiagram }), (error) => {
+const MermaidDiagram = lazy(() => import("./MermaidDiagram-Cg-c8jjI.js").then((n) => n.MermaidDiagram_exports).then((m) => ({ default: m.MermaidDiagram }), (error) => {
 	console.error("[MarkdownEditor] failed to load MermaidDiagram chunk", error);
 	return { default: ({ code }) => /* @__PURE__ */ jsx("pre", { children: /* @__PURE__ */ jsx("code", { children: code }) }) };
 }));

package/dist/mermaid.js

@@ -1 +1 @@
-export { MermaidDiagram } from "./MermaidDiagram-l83gco3r.js";
+export { MermaidDiagram } from "./MermaidDiagram-Cg-c8jjI.js";

package/dist/rjsf.js

@@ -1,24 +1,24 @@
 import { cn } from "./classNames-DkX30VJU.js";
-import { Tooltip, debounce } from "./utils-BxEJOnFD.js";
+import { Tooltip, debounce } from "./utils-CLNKe1ar.js";
 import { BookOpen, Info, Trash2 } from "./icons-DDR9dFSr.js";
-import { Button } from "./Button-BAMX1iuI.js";
+import { Button } from "./Button-BgjVUBON.js";
 import { Label } from "./internal/components/Label.js";
 import { Link } from "./internal/components/Link.js";
 import { useStableCallback } from "./internal/hooks/useStableCallback.js";
-import { TextInput } from "./TextInput-BAL-zOAN.js";
-import { RadioGroup } from "./RadioGroup-BIElT-nH.js";
-import { Checkbox } from "./Checkbox-CfjpwIcg.js";
-import { Combobox } from "./Combobox-RZ0i3w8u.js";
+import { TextInput } from "./TextInput-tWtbWBFQ.js";
+import { RadioGroup } from "./RadioGroup-BCpVnOjW.js";
+import { Checkbox } from "./Checkbox-CsvhT9Bj.js";
+import { Combobox } from "./Combobox-D_modNUu.js";
 import { MultiCombobox } from "./internal/blocks/MultiCombobox.js";
-import { FormGroup } from "./FormGroup-D7ahkK1q.js";
+import { FormGroup } from "./FormGroup-B-_HsL1J.js";
 import { NumberInput } from "./internal/blocks/NumberInput.js";
 import { Textarea } from "./internal/blocks/Textarea.js";
-import { DateInput } from "./DateInput-CCYG0AtT.js";
+import { DateInput } from "./DateInput-DpoPkZRC.js";
 import { PasswordInput } from "./internal/blocks/PasswordInput.js";
-import { Alert } from "./Alert-BQB-og_I.js";
+import { Alert } from "./Alert-CcAVKRSM.js";
 import { CollapsiblePanel } from "./internal/components/CollapsiblePanel.js";
-import { Tabs, TabsContent } from "./Tabs-DUOUQKh7.js";
-import { CodeEditor, isLanguageMode } from "./CodeEditor-BdTxkPD4.js";
+import { Tabs, TabsContent } from "./Tabs-Z6ckOaSb.js";
+import { CodeEditor, isLanguageMode } from "./CodeEditor-Dx9gyVHV.js";
 import { createContext, isValidElement, use, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import DOMPurify from "dompurify";
@@ -233,15 +233,37 @@ const CodeEditorField = ({ fieldPathId, formData, onChange, disabled, readonly,
 		options: uiOptions ?? {}
 	});
 };
+// src/blocks/RjsfSchemaEditor/TooltipIcon.tsx
+const TooltipIcon = ({ rawHelp }) => {
+	const renderMarkdown = useRenderMarkdown();
+	return /* @__PURE__ */ jsx(Tooltip, {
+		placement: "top",
+		variant: "explanatory",
+		tooltip: renderMarkdown(rawHelp),
+		triggerAsChild: true,
+		children: /* @__PURE__ */ jsx("span", {
+			className: "tw:cursor-help tw:text-muted-foreground",
+			children: /* @__PURE__ */ jsx(Info, { className: "tw:size-4" })
+		})
+	});
+};
 // src/blocks/RjsfSchemaEditor/SchemaDescription.tsx
-/** Renders a schema description with sanitized HTML support (links, formatting, etc.). */
-const SchemaDescription = ({ description }) => {
+/**
+* Renders a schema description with sanitized HTML support (links, formatting, etc.).
+* - `tooltip` adds a help icon at the end of the text.
+*/
+const SchemaDescription = ({ description, tooltip }) => {
 	if (!description) return null;
-	return /* @__PURE__ */ jsx("p", {
+	return /* @__PURE__ */ jsxs("p", {
 		className: "tw:text-xs tw:text-muted-foreground",
-		dangerouslySetInnerHTML: { __html: DOMPurify.sanitize(description) }
+		children: [/* @__PURE__ */ jsx("span", { dangerouslySetInnerHTML: { __html: DOMPurify.sanitize(description) } }), tooltip && /* @__PURE__ */ jsx(InlineTooltipIcon, { rawHelp: tooltip })]
 	});
 };
+/** Help icon that flows with the text it ends. */
+const InlineTooltipIcon = ({ rawHelp }) => /* @__PURE__ */ jsx("span", {
+	className: "tw:ml-1 tw:inline-block tw:align-middle",
+	children: /* @__PURE__ */ jsx(TooltipIcon, { rawHelp })
+});
 // src/blocks/RjsfSchemaEditor/fields/GridObjectField.tsx
 /**
 * Custom field that renders an object's properties in a responsive grid layout.
@@ -346,20 +368,6 @@ const InfoField = ({ schema, uiSchema }) => {
 		})
 	});
 };
-// src/blocks/RjsfSchemaEditor/TooltipIcon.tsx
-const TooltipIcon = ({ rawHelp }) => {
-	const renderMarkdown = useRenderMarkdown();
-	return /* @__PURE__ */ jsx(Tooltip, {
-		placement: "top",
-		variant: "explanatory",
-		tooltip: renderMarkdown(rawHelp),
-		triggerAsChild: true,
-		children: /* @__PURE__ */ jsx("span", {
-			className: "tw:cursor-help tw:text-muted-foreground",
-			children: /* @__PURE__ */ jsx(Info, { className: "tw:size-4" })
-		})
-	});
-};
 // src/blocks/RjsfSchemaEditor/fields/TableArrayField.tsx
 /** Default value for a freshly added cell/item, honouring the schema default. */
 const defaultValueFor = (prop) => {
@@ -454,7 +462,7 @@ const TableArrayField = ({ schema, uiSchema = {}, formData, onChange, disabled,
 				className: "tw:px-2 tw:py-1.5 tw:[&>div]:mb-0",
 				children: /* @__PURE__ */ jsx(SchemaField, {
 					name: key,
-					schema: properties[key],
+					schema: properties[key] ?? {},
 					uiSchema: getCellUiSchema(key),
 					formData: item[key],
 					...SCHEMA_FIELD_STUBS,
@@ -481,28 +489,31 @@ const TableArrayField = ({ schema, uiSchema = {}, formData, onChange, disabled,
 		onClick: handleAddRow,
 		children: ["Add ", itemSchema?.title || "Item"]
 	});
-	if (schema.title) {
-		const tooltip = uiSchema["ui:help"];
-		return /* @__PURE__ */ jsxs(CollapsiblePanel, {
-			className: "tw:rounded-lg",
-			headerClassName: "tw:rounded-lg",
-			header: /* @__PURE__ */ jsxs("span", {
-				className: "tw:inline-flex tw:items-center tw:gap-1",
-				children: [schema.title, tooltip && /* @__PURE__ */ jsx(TooltipIcon, { rawHelp: tooltip })]
-			}),
-			defaultExpanded: true,
-			bodyClassName: "tw:flex tw:flex-col tw:gap-4",
-			children: [
-				/* @__PURE__ */ jsx(SchemaDescription, { description: schema.description }),
-				table,
-				addButton
-			]
-		});
-	}
+	const tooltip = uiSchema["ui:help"];
+	const tooltipInDescription = Boolean(tooltip && schema.description && uiSchema["ui:options"]?.tooltipPlacement === "description");
+	const description = /* @__PURE__ */ jsx(SchemaDescription, {
+		description: schema.description,
+		tooltip: tooltipInDescription ? tooltip : void 0
+	});
+	if (schema.title) return /* @__PURE__ */ jsxs(CollapsiblePanel, {
+		className: "tw:rounded-lg",
+		headerClassName: "tw:rounded-lg",
+		header: /* @__PURE__ */ jsxs("span", {
+			className: "tw:inline-flex tw:items-center tw:gap-1",
+			children: [schema.title, tooltip && !tooltipInDescription && /* @__PURE__ */ jsx(TooltipIcon, { rawHelp: tooltip })]
+		}),
+		defaultExpanded: true,
+		bodyClassName: "tw:flex tw:flex-col tw:gap-4",
+		children: [
+			description,
+			table,
+			addButton
+		]
+	});
 	return /* @__PURE__ */ jsxs("div", {
 		className: "tw:flex tw:flex-col tw:gap-4",
 		children: [
-			/* @__PURE__ */ jsx(SchemaDescription, { description: schema.description }),
+			description,
 			table,
 			addButton
 		]
@@ -742,12 +753,15 @@ const FieldTemplateBody = ({ id, label, rawHelp, rawDescription, rawErrors, chil
 	if (widget === "test-connection" || widget === "sync-action") return /* @__PURE__ */ jsx(Fragment$1, { children });
 	if (schema.type === "object") return /* @__PURE__ */ jsx(Fragment$1, { children });
 	if (schema.type === "array" && !uiSchema?.["ui:widget"]) return /* @__PURE__ */ jsx(Fragment$1, { children });
-	const documentation = (uiSchema?.["ui:options"])?.documentation;
+	const uiOptions = uiSchema?.["ui:options"];
+	const documentation = uiOptions?.documentation;
 	const hasErrors = rawErrors && rawErrors.length > 0;
 	const isCheckbox = schema.type === "boolean" && uiSchema?.["ui:widget"] !== "select";
 	const showLabel = displayLabel && label && !isCheckbox;
-	const hasHelpIcons = Boolean(rawHelp || documentation);
-	const helpIcons = /* @__PURE__ */ jsxs(Fragment$1, { children: [rawHelp && /* @__PURE__ */ jsx(TooltipIcon, { rawHelp }), documentation && /* @__PURE__ */ jsx(DocumentationLinkIcon, { documentation })] });
+	const helpInDescription = Boolean(rawHelp && rawDescription && uiOptions?.tooltipPlacement === "description");
+	const labelHelp = helpInDescription ? void 0 : rawHelp;
+	const hasHelpIcons = Boolean(labelHelp || documentation);
+	const helpIcons = /* @__PURE__ */ jsxs(Fragment$1, { children: [labelHelp && /* @__PURE__ */ jsx(TooltipIcon, { rawHelp: labelHelp }), documentation && /* @__PURE__ */ jsx(DocumentationLinkIcon, { documentation })] });
 	return /* @__PURE__ */ jsxs(FormGroup, {
 		state: hasErrors ? "error" : "default",
 		children: [
@@ -766,7 +780,7 @@ const FieldTemplateBody = ({ id, label, rawHelp, rawDescription, rawErrors, chil
 				className: "tw:flex tw:items-center tw:gap-1",
 				children: [children, helpIcons]
 			}) : children,
-			rawDescription && /* @__PURE__ */ jsx(FormGroup.Help, { children: /* @__PURE__ */ jsx("span", { dangerouslySetInnerHTML: { __html: DOMPurify.sanitize(rawDescription) } }) }),
+			rawDescription && /* @__PURE__ */ jsxs(FormGroup.Help, { children: [/* @__PURE__ */ jsx("span", { dangerouslySetInnerHTML: { __html: DOMPurify.sanitize(rawDescription) } }), helpInDescription && rawHelp && /* @__PURE__ */ jsx(InlineTooltipIcon, { rawHelp })] }),
 			hasErrors && /* @__PURE__ */ jsx(FormGroup.Help, { children: rawErrors.join(". ") })
 		]
 	});
@@ -1339,7 +1353,13 @@ const generateUiSchema = (schema, readOnly = false, definitions, globalConfig, h
 			if (globalValue !== void 0) {
 				if (typeof globalValue !== "object" || globalValue === null || Array.isArray(globalValue)) fieldUi["ui:disabled"] = true;
 			}
-			if (options?.tooltip) fieldUi["ui:help"] = String(options.tooltip);
+			if (options?.tooltip) {
+				fieldUi["ui:help"] = String(options.tooltip);
+				if (options.tooltip_placement === "description") fieldUi["ui:options"] = {
+					...fieldUi["ui:options"],
+					tooltipPlacement: "description"
+				};
+			}
 			if ((options?.documentation)?.link) fieldUi["ui:options"] = {
 				...fieldUi["ui:options"],
 				documentation: options?.documentation