@uipath/apollo-wind 2.67.1 → 2.68.0

package/dist/components/forms/metadata-form.cjs

@@ -44,7 +44,7 @@ const external_react_hook_form_namespaceObject = require("react-hook-form");
 const v4_namespaceObject = require("zod/v4");
 const accordion_cjs_namespaceObject = require("../ui/accordion.cjs");
 const button_cjs_namespaceObject = require("../ui/button.cjs");
-const tabs_cjs_namespaceObject = require("../ui/tabs.cjs");
+const panel_tabs_cjs_namespaceObject = require("../ui/panel-tabs.cjs");
 const tooltip_cjs_namespaceObject = require("../ui/tooltip.cjs");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
 const external_data_fetcher_cjs_namespaceObject = require("./data-fetcher.cjs");
@@ -470,53 +470,48 @@ function TabbedStepForm({ schema, context, customComponents, disabled, sectionVa
     if (0 === visibleSteps.length) return null;
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
         children: [
-            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(tabs_cjs_namespaceObject.Tabs, {
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(panel_tabs_cjs_namespaceObject.PanelTabs, {
                 value: currentTab,
                 onValueChange: selectTab,
-                className: "flex min-h-0 flex-1 flex-col gap-1",
                 children: [
-                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-                        className: "shrink-0 pt-3 [padding-inline:var(--mf-content-inset,0px)]",
-                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(tabs_cjs_namespaceObject.ScrollableTabsList, {
-                            className: "h-auto justify-start gap-0.5 rounded-lg bg-transparent px-0 py-0.5 text-muted-foreground",
-                            scrollButtonClassName: "size-6 hover:bg-surface-overlay",
-                            children: visibleSteps.map((step)=>{
-                                const errorCount = errorCountByStepId[step.id] ?? 0;
-                                return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(tabs_cjs_namespaceObject.TabsTrigger, {
-                                    value: step.id,
-                                    className: "inline-flex h-6 shrink-0 items-center gap-1.5 whitespace-nowrap rounded-md px-2.5 text-xs font-medium text-muted-foreground shadow-none transition-colors hover:text-foreground data-[state=active]:bg-surface-overlay data-[state=active]:text-foreground data-[state=active]:shadow-sm",
-                                    children: [
-                                        step.title,
-                                        errorCount > 0 && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                            role: "img",
-                                            "aria-label": `${errorCount} ${1 === errorCount ? 'issue' : 'issues'}`,
-                                            title: `${errorCount} ${1 === errorCount ? 'issue' : 'issues'}`,
-                                            className: "grid h-4 min-w-4 place-items-center rounded-full bg-error px-1 text-[10px] font-semibold leading-none text-error-background",
-                                            children: errorCount
-                                        })
-                                    ]
-                                }, step.id);
-                            })
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(panel_tabs_cjs_namespaceObject.PanelTabsList, {
+                        children: visibleSteps.map((step)=>{
+                            const errorCount = errorCountByStepId[step.id] ?? 0;
+                            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(panel_tabs_cjs_namespaceObject.PanelTabsTrigger, {
+                                value: step.id,
+                                children: [
+                                    step.title,
+                                    errorCount > 0 && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                                        role: "img",
+                                        "aria-label": `${errorCount} ${1 === errorCount ? 'issue' : 'issues'}`,
+                                        title: `${errorCount} ${1 === errorCount ? 'issue' : 'issues'}`,
+                                        className: "grid h-4 min-w-4 place-items-center rounded-full bg-error px-1 text-[10px] font-semibold leading-none text-error-background",
+                                        children: errorCount
+                                    })
+                                ]
+                            }, step.id);
                         })
                     }),
                     visibleSteps.map((step)=>{
                         const stepSections = step.sections.filter((section)=>!section.conditions || context.evaluateConditions(section.conditions));
-                        return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(tabs_cjs_namespaceObject.TabsContent, {
+                        const showEmptyState = 0 === stepSections.length && void 0 !== step.emptyState;
+                        const selfPadded = !showEmptyState && 'plain' === sectionVariant;
+                        const sections = stepSections.map((section, index)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(metadata_form_FormSection, {
+                                section: section,
+                                context: context,
+                                customComponents: customComponents,
+                                disabled: disabled,
+                                sectionVariant: sectionVariant,
+                                afterTabs: 0 === index
+                            }, section.id));
+                        return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(panel_tabs_cjs_namespaceObject.PanelTabsContent, {
                             value: step.id,
-                            className: "mt-0 min-h-0 flex-1 overflow-auto",
-                            children: 0 === stepSections.length && void 0 !== step.emptyState ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-                                className: "pt-4 text-sm text-muted-foreground [padding-inline:var(--mf-content-inset,0px)]",
-                                children: step.emptyState
-                            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-                                className: 'plain' === sectionVariant ? 'pb-6 [padding-inline:var(--mf-content-inset,0px)]' : 'space-y-2 pb-6 pt-4 [padding-inline:var(--mf-content-inset,0px)]',
-                                children: stepSections.map((section)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(metadata_form_FormSection, {
-                                        section: section,
-                                        context: context,
-                                        customComponents: customComponents,
-                                        disabled: disabled,
-                                        sectionVariant: sectionVariant
-                                    }, section.id))
-                            })
+                            padded: !selfPadded,
+                            innerClassName: showEmptyState ? 'text-sm text-muted-foreground' : 'space-y-2',
+                            children: showEmptyState ? step.emptyState : selfPadded ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                                className: "pb-6 [padding-inline:var(--mf-content-inset,0px)]",
+                                children: sections
+                            }) : sections
                         }, step.id);
                     })
                 ]
@@ -530,13 +525,14 @@ function TabbedStepForm({ schema, context, customComponents, disabled, sectionVa
         ]
     });
 }
-const metadata_form_FormSection = /*#__PURE__*/ external_react_default().memo(function({ section, context, customComponents, disabled, sectionVariant = 'card' }) {
+const metadata_form_FormSection = /*#__PURE__*/ external_react_default().memo(function({ section, context, customComponents, disabled, sectionVariant = 'card', afterTabs = false }) {
     const gridColumns = context.schema.layout?.columns || 1;
     const gap = context.schema.layout?.gap || 4;
     const isPlain = 'plain' === sectionVariant;
     const dividerClassName = 'border-t first:border-t-0';
     const wrapperClassName = isPlain ? 'border-b-0' : 'border rounded-lg px-3';
-    const triggerClassName = isPlain ? 'py-4 text-sm font-semibold hover:no-underline' : 'text-sm font-medium';
+    const plainTopClassName = afterTabs ? 'pt-1.5' : 'pt-4';
+    const triggerClassName = isPlain ? `${plainTopClassName} pb-4 text-sm font-semibold hover:no-underline` : 'text-sm font-medium';
     const fieldsGrid = /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
         className: "grid",
         style: {
@@ -551,7 +547,7 @@ const metadata_form_FormSection = /*#__PURE__*/ external_react_default().memo(fu
             }, field.name))
     });
     if (!section.title) return isPlain ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: `${dividerClassName} pb-4 pt-4`,
+        className: `${dividerClassName} pb-4 ${plainTopClassName}`,
         children: fieldsGrid
     }) : fieldsGrid;
     const innerContent = /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
@@ -593,7 +589,7 @@ const metadata_form_FormSection = /*#__PURE__*/ external_react_default().memo(fu
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
                 className: "flex",
                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-                    className: isPlain ? 'flex flex-1 items-center justify-start gap-2 py-4 text-sm font-semibold' : 'flex flex-1 items-center justify-between py-4 text-sm font-medium',
+                    className: isPlain ? `flex flex-1 items-center justify-start gap-2 pb-4 text-sm font-semibold ${plainTopClassName}` : 'flex flex-1 items-center justify-between py-4 text-sm font-medium',
                     children: section.title
                 })
             }),

package/dist/components/forms/metadata-form.js

@@ -5,7 +5,7 @@ import { FormProvider, useForm, useFormState, useWatch } from "react-hook-form";
 import { z } from "zod/v4";
 import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../ui/accordion.js";
 import { Button } from "../ui/button.js";
-import { ScrollableTabsList, Tabs, TabsContent, TabsTrigger } from "../ui/tabs.js";
+import { PanelTabs, PanelTabsContent, PanelTabsList, PanelTabsTrigger } from "../ui/panel-tabs.js";
 import { TooltipProvider } from "../ui/tooltip.js";
 import { deepEqual, get } from "../../lib/index.js";
 import { DataFetcher } from "./data-fetcher.js";
@@ -431,53 +431,48 @@ function TabbedStepForm({ schema, context, customComponents, disabled, sectionVa
     if (0 === visibleSteps.length) return null;
     return /*#__PURE__*/ jsxs(Fragment, {
         children: [
-            /*#__PURE__*/ jsxs(Tabs, {
+            /*#__PURE__*/ jsxs(PanelTabs, {
                 value: currentTab,
                 onValueChange: selectTab,
-                className: "flex min-h-0 flex-1 flex-col gap-1",
                 children: [
-                    /*#__PURE__*/ jsx("div", {
-                        className: "shrink-0 pt-3 [padding-inline:var(--mf-content-inset,0px)]",
-                        children: /*#__PURE__*/ jsx(ScrollableTabsList, {
-                            className: "h-auto justify-start gap-0.5 rounded-lg bg-transparent px-0 py-0.5 text-muted-foreground",
-                            scrollButtonClassName: "size-6 hover:bg-surface-overlay",
-                            children: visibleSteps.map((step)=>{
-                                const errorCount = errorCountByStepId[step.id] ?? 0;
-                                return /*#__PURE__*/ jsxs(TabsTrigger, {
-                                    value: step.id,
-                                    className: "inline-flex h-6 shrink-0 items-center gap-1.5 whitespace-nowrap rounded-md px-2.5 text-xs font-medium text-muted-foreground shadow-none transition-colors hover:text-foreground data-[state=active]:bg-surface-overlay data-[state=active]:text-foreground data-[state=active]:shadow-sm",
-                                    children: [
-                                        step.title,
-                                        errorCount > 0 && /*#__PURE__*/ jsx("span", {
-                                            role: "img",
-                                            "aria-label": `${errorCount} ${1 === errorCount ? 'issue' : 'issues'}`,
-                                            title: `${errorCount} ${1 === errorCount ? 'issue' : 'issues'}`,
-                                            className: "grid h-4 min-w-4 place-items-center rounded-full bg-error px-1 text-[10px] font-semibold leading-none text-error-background",
-                                            children: errorCount
-                                        })
-                                    ]
-                                }, step.id);
-                            })
+                    /*#__PURE__*/ jsx(PanelTabsList, {
+                        children: visibleSteps.map((step)=>{
+                            const errorCount = errorCountByStepId[step.id] ?? 0;
+                            return /*#__PURE__*/ jsxs(PanelTabsTrigger, {
+                                value: step.id,
+                                children: [
+                                    step.title,
+                                    errorCount > 0 && /*#__PURE__*/ jsx("span", {
+                                        role: "img",
+                                        "aria-label": `${errorCount} ${1 === errorCount ? 'issue' : 'issues'}`,
+                                        title: `${errorCount} ${1 === errorCount ? 'issue' : 'issues'}`,
+                                        className: "grid h-4 min-w-4 place-items-center rounded-full bg-error px-1 text-[10px] font-semibold leading-none text-error-background",
+                                        children: errorCount
+                                    })
+                                ]
+                            }, step.id);
                         })
                     }),
                     visibleSteps.map((step)=>{
                         const stepSections = step.sections.filter((section)=>!section.conditions || context.evaluateConditions(section.conditions));
-                        return /*#__PURE__*/ jsx(TabsContent, {
+                        const showEmptyState = 0 === stepSections.length && void 0 !== step.emptyState;
+                        const selfPadded = !showEmptyState && 'plain' === sectionVariant;
+                        const sections = stepSections.map((section, index)=>/*#__PURE__*/ jsx(metadata_form_FormSection, {
+                                section: section,
+                                context: context,
+                                customComponents: customComponents,
+                                disabled: disabled,
+                                sectionVariant: sectionVariant,
+                                afterTabs: 0 === index
+                            }, section.id));
+                        return /*#__PURE__*/ jsx(PanelTabsContent, {
                             value: step.id,
-                            className: "mt-0 min-h-0 flex-1 overflow-auto",
-                            children: 0 === stepSections.length && void 0 !== step.emptyState ? /*#__PURE__*/ jsx("div", {
-                                className: "pt-4 text-sm text-muted-foreground [padding-inline:var(--mf-content-inset,0px)]",
-                                children: step.emptyState
-                            }) : /*#__PURE__*/ jsx("div", {
-                                className: 'plain' === sectionVariant ? 'pb-6 [padding-inline:var(--mf-content-inset,0px)]' : 'space-y-2 pb-6 pt-4 [padding-inline:var(--mf-content-inset,0px)]',
-                                children: stepSections.map((section)=>/*#__PURE__*/ jsx(metadata_form_FormSection, {
-                                        section: section,
-                                        context: context,
-                                        customComponents: customComponents,
-                                        disabled: disabled,
-                                        sectionVariant: sectionVariant
-                                    }, section.id))
-                            })
+                            padded: !selfPadded,
+                            innerClassName: showEmptyState ? 'text-sm text-muted-foreground' : 'space-y-2',
+                            children: showEmptyState ? step.emptyState : selfPadded ? /*#__PURE__*/ jsx("div", {
+                                className: "pb-6 [padding-inline:var(--mf-content-inset,0px)]",
+                                children: sections
+                            }) : sections
                         }, step.id);
                     })
                 ]
@@ -491,13 +486,14 @@ function TabbedStepForm({ schema, context, customComponents, disabled, sectionVa
         ]
     });
 }
-const metadata_form_FormSection = /*#__PURE__*/ react.memo(function({ section, context, customComponents, disabled, sectionVariant = 'card' }) {
+const metadata_form_FormSection = /*#__PURE__*/ react.memo(function({ section, context, customComponents, disabled, sectionVariant = 'card', afterTabs = false }) {
     const gridColumns = context.schema.layout?.columns || 1;
     const gap = context.schema.layout?.gap || 4;
     const isPlain = 'plain' === sectionVariant;
     const dividerClassName = 'border-t first:border-t-0';
     const wrapperClassName = isPlain ? 'border-b-0' : 'border rounded-lg px-3';
-    const triggerClassName = isPlain ? 'py-4 text-sm font-semibold hover:no-underline' : 'text-sm font-medium';
+    const plainTopClassName = afterTabs ? 'pt-1.5' : 'pt-4';
+    const triggerClassName = isPlain ? `${plainTopClassName} pb-4 text-sm font-semibold hover:no-underline` : 'text-sm font-medium';
     const fieldsGrid = /*#__PURE__*/ jsx("div", {
         className: "grid",
         style: {
@@ -512,7 +508,7 @@ const metadata_form_FormSection = /*#__PURE__*/ react.memo(function({ section, c
             }, field.name))
     });
     if (!section.title) return isPlain ? /*#__PURE__*/ jsx("div", {
-        className: `${dividerClassName} pb-4 pt-4`,
+        className: `${dividerClassName} pb-4 ${plainTopClassName}`,
         children: fieldsGrid
     }) : fieldsGrid;
     const innerContent = /*#__PURE__*/ jsxs("div", {
@@ -554,7 +550,7 @@ const metadata_form_FormSection = /*#__PURE__*/ react.memo(function({ section, c
             /*#__PURE__*/ jsx("div", {
                 className: "flex",
                 children: /*#__PURE__*/ jsx("div", {
-                    className: isPlain ? 'flex flex-1 items-center justify-start gap-2 py-4 text-sm font-semibold' : 'flex flex-1 items-center justify-between py-4 text-sm font-medium',
+                    className: isPlain ? `flex flex-1 items-center justify-start gap-2 pb-4 text-sm font-semibold ${plainTopClassName}` : 'flex flex-1 items-center justify-between py-4 text-sm font-medium',
                     children: section.title
                 })
             }),

package/dist/components/ui/index.cjs

@@ -36,10 +36,10 @@ var __webpack_modules__ = {
     "@/components/ui/button" (module) {
         module.exports = require("./button.cjs");
     },
-    "./calendar" (module) {
+    "@/components/ui/calendar" (module) {
         module.exports = require("./calendar.cjs");
     },
-    "./card" (module) {
+    "@/components/ui/card" (module) {
         module.exports = require("./card.cjs");
     },
     "./chart" (module) {
@@ -48,7 +48,7 @@ var __webpack_modules__ = {
     "@/components/ui/checkbox" (module) {
         module.exports = require("./checkbox.cjs");
     },
-    "./collapsible" (module) {
+    "@/components/ui/collapsible" (module) {
         module.exports = require("./collapsible.cjs");
     },
     "./combobox" (module) {
@@ -57,7 +57,7 @@ var __webpack_modules__ = {
     "@/components/ui/command" (module) {
         module.exports = require("./command.cjs");
     },
-    "./context-menu" (module) {
+    "@/components/ui/context-menu" (module) {
         module.exports = require("./context-menu.cjs");
     },
     "./data-table" (module) {
@@ -96,7 +96,7 @@ var __webpack_modules__ = {
     "./form-field" (module) {
         module.exports = require("./form-field.cjs");
     },
-    "./hover-card" (module) {
+    "@/components/ui/hover-card" (module) {
         module.exports = require("./hover-card.cjs");
     },
     "@/components/ui/info-tooltip" (module) {
@@ -105,13 +105,13 @@ var __webpack_modules__ = {
     "@/components/ui/input-group" (module) {
         module.exports = require("./input-group.cjs");
     },
-    "./input" (module) {
+    "@/components/ui/input" (module) {
         module.exports = require("./input.cjs");
     },
     "./json-tree-view" (module) {
         module.exports = require("./json-tree-view/index.cjs");
     },
-    "@/components/ui/label" (module) {
+    "./label" (module) {
         module.exports = require("./label.cjs");
     },
     "@/components/ui/layout" (module) {
@@ -138,6 +138,9 @@ var __webpack_modules__ = {
     "./pagination" (module) {
         module.exports = require("./pagination.cjs");
     },
+    "./panel-tabs" (module) {
+        module.exports = require("./panel-tabs.cjs");
+    },
     "@/components/ui/popover" (module) {
         module.exports = require("./popover.cjs");
     },
@@ -222,7 +225,7 @@ var __webpack_modules__ = {
     "./tree-view" (module) {
         module.exports = require("./tree-view.cjs");
     },
-    "./variable-picker" (module) {
+    "@/components/ui/variable-picker" (module) {
         module.exports = require("./variable-picker/index.cjs");
     },
     "./variable-value-control" (module) {
@@ -273,8 +276,8 @@ var __webpack_exports__ = {};
 (()=>{
     __webpack_require__.r(__webpack_exports__);
     __webpack_require__.d(__webpack_exports__, {
-        FileTreeView: ()=>_tree_view__rspack_import_73_default.a,
-        TreeView: ()=>_tree_view__rspack_import_73.TreeView
+        FileTreeView: ()=>_tree_view__rspack_import_74_default.a,
+        TreeView: ()=>_tree_view__rspack_import_74.TreeView
     });
     var _accordion__rspack_import_0 = __webpack_require__("./accordion");
     var __rspack_reexport = {};
@@ -372,7 +375,7 @@ var __webpack_exports__ = {};
         "TreeView"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_button_group__rspack_import_11[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _calendar__rspack_import_12 = __webpack_require__("./calendar");
+    var _calendar__rspack_import_12 = __webpack_require__("@/components/ui/calendar");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _calendar__rspack_import_12)if ([
         "default",
@@ -380,7 +383,7 @@ var __webpack_exports__ = {};
         "TreeView"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_calendar__rspack_import_12[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _card__rspack_import_13 = __webpack_require__("./card");
+    var _card__rspack_import_13 = __webpack_require__("@/components/ui/card");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _card__rspack_import_13)if ([
         "default",
@@ -404,7 +407,7 @@ var __webpack_exports__ = {};
         "TreeView"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_checkbox__rspack_import_15[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _collapsible__rspack_import_16 = __webpack_require__("./collapsible");
+    var _collapsible__rspack_import_16 = __webpack_require__("@/components/ui/collapsible");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _collapsible__rspack_import_16)if ([
         "default",
@@ -428,7 +431,7 @@ var __webpack_exports__ = {};
         "TreeView"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_command__rspack_import_18[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _context_menu__rspack_import_19 = __webpack_require__("./context-menu");
+    var _context_menu__rspack_import_19 = __webpack_require__("@/components/ui/context-menu");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _context_menu__rspack_import_19)if ([
         "default",
@@ -532,7 +535,7 @@ var __webpack_exports__ = {};
         "TreeView"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_form_field__rspack_import_31[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _hover_card__rspack_import_32 = __webpack_require__("./hover-card");
+    var _hover_card__rspack_import_32 = __webpack_require__("@/components/ui/hover-card");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _hover_card__rspack_import_32)if ([
         "default",
@@ -548,7 +551,7 @@ var __webpack_exports__ = {};
         "TreeView"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_info_tooltip__rspack_import_33[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _input__rspack_import_34 = __webpack_require__("./input");
+    var _input__rspack_import_34 = __webpack_require__("@/components/ui/input");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _input__rspack_import_34)if ([
         "default",
@@ -572,7 +575,7 @@ var __webpack_exports__ = {};
         "TreeView"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_json_tree_view__rspack_import_36[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _label__rspack_import_37 = __webpack_require__("@/components/ui/label");
+    var _label__rspack_import_37 = __webpack_require__("./label");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _label__rspack_import_37)if ([
         "default",
@@ -820,63 +823,71 @@ var __webpack_exports__ = {};
         "TreeView"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_table__rspack_import_67[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _tabs__rspack_import_68 = __webpack_require__("./tabs");
+    var _panel_tabs__rspack_import_68 = __webpack_require__("./panel-tabs");
+    var __rspack_reexport = {};
+    for(const __rspack_import_key in _panel_tabs__rspack_import_68)if ([
+        "default",
+        "FileTreeView",
+        "TreeView"
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_panel_tabs__rspack_import_68[__rspack_import_key];
+    __webpack_require__.d(__webpack_exports__, __rspack_reexport);
+    var _tabs__rspack_import_69 = __webpack_require__("./tabs");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _tabs__rspack_import_68)if ([
+    for(const __rspack_import_key in _tabs__rspack_import_69)if ([
         "default",
         "FileTreeView",
         "TreeView"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_tabs__rspack_import_68[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_tabs__rspack_import_69[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _textarea__rspack_import_69 = __webpack_require__("@/components/ui/textarea");
+    var _textarea__rspack_import_70 = __webpack_require__("@/components/ui/textarea");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _textarea__rspack_import_69)if ([
+    for(const __rspack_import_key in _textarea__rspack_import_70)if ([
         "default",
         "FileTreeView",
         "TreeView"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_textarea__rspack_import_69[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_textarea__rspack_import_70[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _toggle__rspack_import_70 = __webpack_require__("@/components/ui/toggle");
+    var _toggle__rspack_import_71 = __webpack_require__("@/components/ui/toggle");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _toggle__rspack_import_70)if ([
+    for(const __rspack_import_key in _toggle__rspack_import_71)if ([
         "default",
         "FileTreeView",
         "TreeView"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_toggle__rspack_import_70[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_toggle__rspack_import_71[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _toggle_group__rspack_import_71 = __webpack_require__("./toggle-group");
+    var _toggle_group__rspack_import_72 = __webpack_require__("./toggle-group");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _toggle_group__rspack_import_71)if ([
+    for(const __rspack_import_key in _toggle_group__rspack_import_72)if ([
         "default",
         "FileTreeView",
         "TreeView"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_toggle_group__rspack_import_71[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_toggle_group__rspack_import_72[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _tooltip__rspack_import_72 = __webpack_require__("@/components/ui/tooltip");
+    var _tooltip__rspack_import_73 = __webpack_require__("@/components/ui/tooltip");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _tooltip__rspack_import_72)if ([
+    for(const __rspack_import_key in _tooltip__rspack_import_73)if ([
         "default",
         "FileTreeView",
         "TreeView"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_tooltip__rspack_import_72[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_tooltip__rspack_import_73[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _tree_view__rspack_import_73 = __webpack_require__("./tree-view");
-    var _tree_view__rspack_import_73_default = /*#__PURE__*/ __webpack_require__.n(_tree_view__rspack_import_73);
-    var _variable_picker__rspack_import_74 = __webpack_require__("./variable-picker");
+    var _tree_view__rspack_import_74 = __webpack_require__("./tree-view");
+    var _tree_view__rspack_import_74_default = /*#__PURE__*/ __webpack_require__.n(_tree_view__rspack_import_74);
+    var _variable_picker__rspack_import_75 = __webpack_require__("@/components/ui/variable-picker");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _variable_picker__rspack_import_74)if ([
+    for(const __rspack_import_key in _variable_picker__rspack_import_75)if ([
         "default",
         "FileTreeView",
         "TreeView"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_variable_picker__rspack_import_74[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_variable_picker__rspack_import_75[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _variable_value_control__rspack_import_75 = __webpack_require__("./variable-value-control");
+    var _variable_value_control__rspack_import_76 = __webpack_require__("./variable-value-control");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _variable_value_control__rspack_import_75)if ([
+    for(const __rspack_import_key in _variable_value_control__rspack_import_76)if ([
         "default",
         "FileTreeView",
         "TreeView"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_variable_value_control__rspack_import_75[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_variable_value_control__rspack_import_76[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
 })();
 exports.FileTreeView = __webpack_exports__.FileTreeView;

package/dist/components/ui/index.d.ts

@@ -66,6 +66,7 @@ export * from './stats-card';
 export * from './stepper';
 export * from './switch';
 export * from './table';
+export * from './panel-tabs';
 export * from './tabs';
 export * from './textarea';
 export * from './toggle';

package/dist/components/ui/index.js

@@ -67,6 +67,7 @@ export * from "./stats-card.js";
 export * from "./stepper.js";
 export * from "./switch.js";
 export * from "./table.js";
+export * from "./panel-tabs.js";
 export * from "./tabs.js";
 export * from "./textarea.js";
 export * from "./toggle.js";

package/dist/components/ui/json-tree-view/JsonTree.types.d.ts

@@ -127,6 +127,11 @@ export interface NodeDecoration {
     label?: string;
     /** Small muted text after the key label (e.g. an identifier). */
     sublabel?: string;
+    /**
+     * Shows the sublabel only while the row is hovered or holds focus. It sits
+     * in the row's flexible space, so revealing it never moves the trailing cluster.
+     */
+    sublabelOnHover?: boolean;
     /** Replaces the type badge's icon and/or color. */
     badge?: NodeDecorationBadge;
     /** Small pill rendered next to the key (e.g. "mocked"). */
@@ -135,6 +140,17 @@ export interface NodeDecoration {
      * Hides the built-in keys/items count on a container row.
      */
     hideCount?: boolean;
+    /**
+     * Hides the value cell on a scalar row, for a row that names something
+     * (e.g. a node with no output yet) rather than holding a value.
+     */
+    hideValue?: boolean;
+    /**
+     * Content in the row's trailing cluster, between the `start` and `end`
+     * actions (e.g. a count). The cluster never shrinks, so it stays in place
+     * while the key and sublabel truncate.
+     */
+    meta?: ReactNode;
 }
 /** Context passed to a custom value cell renderer. */
 export interface RenderValueContext {
@@ -176,6 +192,16 @@ export interface NodeAction {
     disabled?: boolean;
     /** Color tone; `error` tints a destructive action. Defaults to neutral. */
     tone?: NodeDecorationTone;
+    /**
+     * Keeps the action visible at rest instead of revealing it on row hover.
+     * For a row's primary action. Ignored once actions collapse into the menu.
+     */
+    persistent?: boolean;
+    /**
+     * Where the action sits in the row's trailing cluster: `start` renders it
+     * before the decoration `meta`, `end` (the default) after it.
+     */
+    placement?: 'start' | 'end';
 }
 /** Context passed to `nodeActions`, mirroring the value-cell edit context. */
 export interface NodeActionContext {