@harborclient/sdk 1.0.29 → 1.0.30

package/dist/components/TabCloseButton/index.js

@@ -1,14 +1,10 @@
 import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
 import { faXmark } from '@fortawesome/free-solid-svg-icons';
 import { FaIcon } from '../FaIcon/index.js';
+import { cn } from '../utils.js';
 /**
  * Close control for document-style tabs in the request editor and AI chat.
- *
- * @param ariaLabel - Accessible name describing which tab closes.
- * @param onClick - Click handler; callers should stop propagation when needed.
- * @param title - Optional native tooltip text.
- * @param tabIndex - Tab order index; use with roving tabindex on the tab label.
  */
-export function TabCloseButton({ ariaLabel, onClick, title = 'Close tab', tabIndex }) {
-    return (_jsx("button", { type: "button", className: "hc-tab-close-button inline-flex h-7 w-7 shrink-0 cursor-pointer items-center justify-center self-center rounded-full border-none bg-transparent text-[14px] text-muted hover:bg-selection hover:text-text focus-visible:bg-selection focus-visible:text-text app-no-drag", title: title, "aria-label": ariaLabel, tabIndex: tabIndex, onClick: onClick, children: _jsx(FaIcon, { icon: faXmark, className: "hc-tab-close-button-icon h-3.5 w-3.5" }) }));
+export function TabCloseButton({ ariaLabel, onClick, title = 'Close tab', tabIndex, className, ...props }) {
+    return (_jsx("button", { ...props, type: "button", className: cn('hc-tab-close-button app-no-drag inline-flex h-7 w-7 shrink-0 cursor-pointer items-center justify-center self-center rounded-full border-none bg-transparent text-[14px] text-muted hover:bg-selection hover:text-text focus-visible:bg-selection focus-visible:text-text', className), title: title, "aria-label": ariaLabel, tabIndex: tabIndex, onClick: onClick, children: _jsx(FaIcon, { icon: faXmark, className: "hc-tab-close-button-icon h-3.5 w-3.5" }) }));
 }

package/dist/components/Table/TableBody.d.ts

@@ -0,0 +1,13 @@
+import type { ComponentPropsWithoutRef, JSX, ReactNode } from 'react';
+interface Props extends ComponentPropsWithoutRef<'tbody'> {
+    /**
+     * Header or body row content.
+     */
+    children: ReactNode;
+}
+/**
+ * Table body section wrapper.
+ */
+export declare function TableBody({ children, className, ...props }: Props): JSX.Element;
+export {};
+//# sourceMappingURL=TableBody.d.ts.map

package/dist/components/Table/TableBody.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableBody.d.ts","sourceRoot":"","sources":["../../../src/components/Table/TableBody.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAItE,UAAU,KAAM,SAAQ,wBAAwB,CAAC,OAAO,CAAC;IACvD;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAc/E"}

package/dist/components/Table/TableBody.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
+import { useContext } from '@harborclient/sdk/react';
+import { cn } from '../utils.js';
+import { TableVariantContext } from './TableContext.js';
+/**
+ * Table body section wrapper.
+ */
+export function TableBody({ children, className, ...props }) {
+    const variant = useContext(TableVariantContext);
+    return (_jsx("tbody", { ...props, className: cn(variant === 'bordered' ? 'hc-table-body [&_tr:last-child_td]:border-b-0' : 'hc-table-body', className), children: children }));
+}

package/dist/components/Table/TableCell.d.ts

@@ -0,0 +1,8 @@
+import type { ComponentPropsWithoutRef, JSX } from 'react';
+type Props = ComponentPropsWithoutRef<'td'>;
+/**
+ * Body cell with table styling for the active variant.
+ */
+export declare function TableCell({ children, className, ...props }: Props): JSX.Element;
+export {};
+//# sourceMappingURL=TableCell.d.ts.map

package/dist/components/Table/TableCell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableCell.d.ts","sourceRoot":"","sources":["../../../src/components/Table/TableCell.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAI3D,KAAK,KAAK,GAAG,wBAAwB,CAAC,IAAI,CAAC,CAAC;AAE5C;;GAEG;AACH,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAe/E"}

package/dist/components/Table/TableCell.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
+import { useContext } from '@harborclient/sdk/react';
+import { cn } from '../utils.js';
+import { TableVariantContext, tableCellClass, tableCellClassLoose } from './TableContext.js';
+/**
+ * Body cell with table styling for the active variant.
+ */
+export function TableCell({ children, className, ...props }) {
+    const variant = useContext(TableVariantContext);
+    return (_jsx("td", { ...props, className: cn('hc-table-cell', variant === 'loose' ? tableCellClassLoose : tableCellClass, className), children: children }));
+}

package/dist/components/Table/TableContext.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Layout preset for {@link Table} and its subcomponents.
+ */
+export type TableVariant = 'bordered' | 'loose';
+/**
+ * Default header cell classes for bordered editor tables.
+ */
+export declare const tableHeadClass = "border-r border-b border-separator p-3 text-left text-[14px] font-medium uppercase tracking-wide text-muted last:border-r-0";
+/**
+ * Default body cell classes for bordered editor tables.
+ */
+export declare const tableCellClass = "border-r border-b border-separator p-3 last:border-r-0";
+/**
+ * Header cell classes for loose tables with separate cell spacing.
+ */
+export declare const tableHeadClassLoose = "pb-1 text-left text-[14px] font-medium uppercase tracking-wide text-muted";
+/**
+ * Body cell classes for loose tables with separate cell spacing.
+ */
+export declare const tableCellClassLoose = "";
+export declare const TableVariantContext: import("react").Context<TableVariant>;
+//# sourceMappingURL=TableContext.d.ts.map

package/dist/components/Table/TableContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableContext.d.ts","sourceRoot":"","sources":["../../../src/components/Table/TableContext.tsx"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,UAAU,GAAG,OAAO,CAAC;AAEhD;;GAEG;AACH,eAAO,MAAM,cAAc,gIACoG,CAAC;AAEhI;;GAEG;AACH,eAAO,MAAM,cAAc,2DAA2D,CAAC;AAEvF;;GAEG;AACH,eAAO,MAAM,mBAAmB,8EAC6C,CAAC;AAE9E;;GAEG;AACH,eAAO,MAAM,mBAAmB,KAAK,CAAC;AAEtC,eAAO,MAAM,mBAAmB,uCAA0C,CAAC"}

package/dist/components/Table/TableContext.js

@@ -0,0 +1,18 @@
+import { createContext } from '@harborclient/sdk/react';
+/**
+ * Default header cell classes for bordered editor tables.
+ */
+export const tableHeadClass = 'border-r border-b border-separator p-3 text-left text-[14px] font-medium uppercase tracking-wide text-muted last:border-r-0';
+/**
+ * Default body cell classes for bordered editor tables.
+ */
+export const tableCellClass = 'border-r border-b border-separator p-3 last:border-r-0';
+/**
+ * Header cell classes for loose tables with separate cell spacing.
+ */
+export const tableHeadClassLoose = 'pb-1 text-left text-[14px] font-medium uppercase tracking-wide text-muted';
+/**
+ * Body cell classes for loose tables with separate cell spacing.
+ */
+export const tableCellClassLoose = '';
+export const TableVariantContext = createContext('bordered');

package/dist/components/Table/TableHead.d.ts

@@ -0,0 +1,8 @@
+import type { ComponentPropsWithoutRef, JSX } from 'react';
+type Props = ComponentPropsWithoutRef<'th'>;
+/**
+ * Header cell with table styling for the active variant.
+ */
+export declare function TableHead({ children, className, scope, ...props }: Props): JSX.Element;
+export {};
+//# sourceMappingURL=TableHead.d.ts.map

package/dist/components/Table/TableHead.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHead.d.ts","sourceRoot":"","sources":["../../../src/components/Table/TableHead.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAI3D,KAAK,KAAK,GAAG,wBAAwB,CAAC,IAAI,CAAC,CAAC;AAE5C;;GAEG;AACH,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAa,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAgB9F"}

package/dist/components/Table/TableHead.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
+import { useContext } from '@harborclient/sdk/react';
+import { cn } from '../utils.js';
+import { TableVariantContext, tableHeadClass, tableHeadClassLoose } from './TableContext.js';
+/**
+ * Header cell with table styling for the active variant.
+ */
+export function TableHead({ children, className, scope = 'col', ...props }) {
+    const variant = useContext(TableVariantContext);
+    return (_jsx("th", { ...props, scope: scope, className: cn('hc-table-head', variant === 'loose' ? tableHeadClassLoose : tableHeadClass, className), children: children }));
+}

package/dist/components/Table/TableHeader.d.ts

@@ -0,0 +1,13 @@
+import type { ComponentPropsWithoutRef, JSX, ReactNode } from 'react';
+interface Props extends ComponentPropsWithoutRef<'thead'> {
+    /**
+     * Header or body row content.
+     */
+    children: ReactNode;
+}
+/**
+ * Table header section wrapper.
+ */
+export declare function TableHeader({ children, className, ...props }: Props): JSX.Element;
+export {};
+//# sourceMappingURL=TableHeader.d.ts.map

package/dist/components/Table/TableHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHeader.d.ts","sourceRoot":"","sources":["../../../src/components/Table/TableHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtE,UAAU,KAAM,SAAQ,wBAAwB,CAAC,OAAO,CAAC;IACvD;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAMjF"}

package/dist/components/Table/TableHeader.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
+import { cn } from '../utils.js';
+/**
+ * Table header section wrapper.
+ */
+export function TableHeader({ children, className, ...props }) {
+    return (_jsx("thead", { ...props, className: cn('hc-table-header', className), children: children }));
+}

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

@@ -1,25 +1,12 @@
-import type { HTMLAttributes, JSX, ReactNode, TdHTMLAttributes, ThHTMLAttributes } from 'react';
-/**
- * Layout preset for {@link Table} and its subcomponents.
- */
-export type TableVariant = 'bordered' | 'loose';
-/**
- * Default header cell classes for bordered editor tables.
- */
-export declare const tableHeadClass = "border-r border-b border-separator p-3 text-left text-[14px] font-medium uppercase tracking-wide text-muted last:border-r-0";
-/**
- * Default body cell classes for bordered editor tables.
- */
-export declare const tableCellClass = "border-r border-b border-separator p-3 last:border-r-0";
-/**
- * Header cell classes for loose tables with separate cell spacing.
- */
-export declare const tableHeadClassLoose = "pb-1 text-left text-[14px] font-medium uppercase tracking-wide text-muted";
-/**
- * Body cell classes for loose tables with separate cell spacing.
- */
-export declare const tableCellClassLoose = "";
-interface TableProps {
+import type { ComponentPropsWithoutRef, JSX, ReactNode } from 'react';
+import { type TableVariant } from './TableContext.js';
+export type { TableVariant } from './TableContext.js';
+export { tableCellClass, tableCellClassLoose, tableHeadClass, tableHeadClassLoose } from './TableContext.js';
+export { TableBody } from './TableBody.js';
+export { TableCell } from './TableCell.js';
+export { TableHead } from './TableHead.js';
+export { TableHeader } from './TableHeader.js';
+interface Props extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'className'> {
     /**
      * Table header and body sections.
      */
@@ -35,69 +22,6 @@ interface TableProps {
 }
 /**
  * Table shell for editable row layouts.
- *
- * @param children - {@link TableHeader} and {@link TableBody} sections.
- * @param variant - Bordered collapsed layout or loose separate-cell spacing.
- * @param className - Extra classes on the wrapper (bordered) or table element (loose).
- */
-export declare function Table({ children, variant, className }: TableProps): JSX.Element;
-interface TableSectionProps extends HTMLAttributes<HTMLTableSectionElement> {
-    /**
-     * Header or body row content.
-     */
-    children: ReactNode;
-    /**
-     * Additional Tailwind classes merged onto the section element.
-     */
-    className?: string;
-}
-/**
- * Table header section wrapper.
- *
- * @param children - Header row elements, typically native `tr` nodes.
- * @param className - Extra classes appended after any section preset.
- */
-export declare function TableHeader({ children, className, ...rest }: TableSectionProps): JSX.Element;
-/**
- * Table body section wrapper.
- *
- * @param children - Body row elements, typically native `tr` nodes.
- * @param className - Extra classes appended after the layout preset.
- */
-export declare function TableBody({ children, className, ...rest }: TableSectionProps): JSX.Element;
-interface TableHeadProps extends ThHTMLAttributes<HTMLTableCellElement> {
-    /**
-     * Header cell content.
-     */
-    children?: ReactNode;
-    /**
-     * Additional Tailwind classes merged after the header cell preset.
-     */
-    className?: string;
-}
-/**
- * Header cell with table styling for the active variant.
- *
- * @param children - Header label content.
- * @param className - Extra classes appended after the layout preset.
- */
-export declare function TableHead({ children, className, scope, ...rest }: TableHeadProps): JSX.Element;
-interface TableCellProps extends TdHTMLAttributes<HTMLTableCellElement> {
-    /**
-     * Body cell content.
-     */
-    children?: ReactNode;
-    /**
-     * Additional Tailwind classes merged after the body cell preset.
-     */
-    className?: string;
-}
-/**
- * Body cell with table styling for the active variant.
- *
- * @param children - Cell content.
- * @param className - Extra classes appended after the layout preset.
  */
-export declare function TableCell({ children, className, ...rest }: TableCellProps): JSX.Element;
-export {};
+export declare function Table({ children, variant, className, ...props }: Props): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Table/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Table/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAC;AAEhG;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,UAAU,GAAG,OAAO,CAAC;AAEhD;;GAEG;AACH,eAAO,MAAM,cAAc,gIACoG,CAAC;AAEhI;;GAEG;AACH,eAAO,MAAM,cAAc,2DAA2D,CAAC;AAEvF;;GAEG;AACH,eAAO,MAAM,mBAAmB,8EAC6C,CAAC;AAE9E;;GAEG;AACH,eAAO,MAAM,mBAAmB,KAAK,CAAC;AAuBtC,UAAU,UAAU;IAClB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;GAMG;AACH,wBAAgB,KAAK,CAAC,EAAE,QAAQ,EAAE,OAAoB,EAAE,SAAS,EAAE,EAAE,UAAU,GAAG,GAAG,CAAC,OAAO,CAwB5F;AAED,UAAU,iBAAkB,SAAQ,cAAc,CAAC,uBAAuB,CAAC;IACzE;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,iBAAiB,GAAG,GAAG,CAAC,OAAO,CAQ5F;AAED;;;;;GAKG;AACH,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,iBAAiB,GAAG,GAAG,CAAC,OAAO,CAW1F;AAED,UAAU,cAAe,SAAQ,gBAAgB,CAAC,oBAAoB,CAAC;IACrE;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;GAKG;AACH,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,SAAS,EACT,KAAa,EACb,GAAG,IAAI,EACR,EAAE,cAAc,GAAG,GAAG,CAAC,OAAO,CAU9B;AAED,UAAU,cAAe,SAAQ,gBAAgB,CAAC,oBAAoB,CAAC;IACrE;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;GAKG;AACH,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,GAAG,GAAG,CAAC,OAAO,CAUvF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Table/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtE,OAAO,EAAE,KAAK,YAAY,EAAuB,MAAM,mBAAmB,CAAC;AAE3E,YAAY,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EACL,cAAc,EACd,mBAAmB,EACnB,cAAc,EACd,mBAAmB,EACpB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAE/C,UAAU,KAAM,SAAQ,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,WAAW,CAAC;IACrF;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,KAAK,CAAC,EAAE,QAAQ,EAAE,OAAoB,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CA+BjG"}

package/dist/components/Table/index.js

@@ -1,100 +1,23 @@
-import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
-import { createContext, createElement, useContext } from '@harborclient/sdk/react';
-/**
- * Default header cell classes for bordered editor tables.
- */
-export const tableHeadClass = 'border-r border-b border-separator p-3 text-left text-[14px] font-medium uppercase tracking-wide text-muted last:border-r-0';
-/**
- * Default body cell classes for bordered editor tables.
- */
-export const tableCellClass = 'border-r border-b border-separator p-3 last:border-r-0';
-/**
- * Header cell classes for loose tables with separate cell spacing.
- */
-export const tableHeadClassLoose = 'pb-1 text-left text-[14px] font-medium uppercase tracking-wide text-muted';
-/**
- * Body cell classes for loose tables with separate cell spacing.
- */
-export const tableCellClassLoose = '';
-const TableVariantContext = createContext('bordered');
-/**
- * Returns preset classes merged with optional overrides.
- *
- * @param base - Variant preset classes.
- * @param className - Additional classes appended after the preset.
- */
-function mergeClasses(base, className) {
-    if (base && className) {
-        return `${base} ${className}`;
-    }
-    if (base) {
-        return base;
-    }
-    if (className) {
-        return className;
-    }
-    return undefined;
-}
+import { createElement } from '@harborclient/sdk/react';
+import { cn } from '../utils.js';
+import { TableVariantContext } from './TableContext.js';
+export { tableCellClass, tableCellClassLoose, tableHeadClass, tableHeadClassLoose } from './TableContext.js';
+export { TableBody } from './TableBody.js';
+export { TableCell } from './TableCell.js';
+export { TableHead } from './TableHead.js';
+export { TableHeader } from './TableHeader.js';
 /**
  * Table shell for editable row layouts.
- *
- * @param children - {@link TableHeader} and {@link TableBody} sections.
- * @param variant - Bordered collapsed layout or loose separate-cell spacing.
- * @param className - Extra classes on the wrapper (bordered) or table element (loose).
  */
-export function Table({ children, variant = 'bordered', className }) {
+export function Table({ children, variant = 'bordered', className, ...props }) {
     if (variant === 'loose') {
-        const tableBase = 'hc-table w-full border-separate border-spacing-x-1.5 border-spacing-y-1.5';
-        const tableClasses = className ? `${tableBase} ${className}` : tableBase;
-        return createElement(TableVariantContext.Provider, { value: variant }, createElement('table', { className: tableClasses }, children));
+        return createElement(TableVariantContext.Provider, { value: variant }, createElement('table', {
+            ...props,
+            className: cn('hc-table w-full border-separate border-spacing-x-1.5 border-spacing-y-1.5', className)
+        }, children));
     }
-    const wrapperBase = 'hc-table overflow-hidden rounded-lg border border-separator';
-    const wrapperClasses = className ? `${wrapperBase} ${className}` : wrapperBase;
-    return createElement(TableVariantContext.Provider, { value: variant }, createElement('div', { className: wrapperClasses }, createElement('table', { className: 'hc-table-element w-full border-collapse' }, children)));
-}
-/**
- * Table header section wrapper.
- *
- * @param children - Header row elements, typically native `tr` nodes.
- * @param className - Extra classes appended after any section preset.
- */
-export function TableHeader({ children, className, ...rest }) {
-    const classes = mergeClasses('hc-table-header', className);
-    return (_jsx("thead", { className: classes, ...rest, children: children }));
-}
-/**
- * Table body section wrapper.
- *
- * @param children - Body row elements, typically native `tr` nodes.
- * @param className - Extra classes appended after the layout preset.
- */
-export function TableBody({ children, className, ...rest }) {
-    const variant = useContext(TableVariantContext);
-    const base = variant === 'bordered' ? 'hc-table-body [&_tr:last-child_td]:border-b-0' : 'hc-table-body';
-    const classes = mergeClasses(base, className);
-    return (_jsx("tbody", { className: classes, ...rest, children: children }));
-}
-/**
- * Header cell with table styling for the active variant.
- *
- * @param children - Header label content.
- * @param className - Extra classes appended after the layout preset.
- */
-export function TableHead({ children, className, scope = 'col', ...rest }) {
-    const variant = useContext(TableVariantContext);
-    const base = variant === 'loose' ? tableHeadClassLoose : tableHeadClass;
-    const classes = mergeClasses(`hc-table-head ${base}`, className);
-    return (_jsx("th", { scope: scope, className: classes, ...rest, children: children }));
-}
-/**
- * Body cell with table styling for the active variant.
- *
- * @param children - Cell content.
- * @param className - Extra classes appended after the layout preset.
- */
-export function TableCell({ children, className, ...rest }) {
-    const variant = useContext(TableVariantContext);
-    const base = variant === 'loose' ? tableCellClassLoose : tableCellClass;
-    const classes = mergeClasses(`hc-table-cell ${base}`, className);
-    return (_jsx("td", { className: classes, ...rest, children: children }));
+    return createElement(TableVariantContext.Provider, { value: variant }, createElement('div', {
+        ...props,
+        className: cn('hc-table overflow-hidden rounded-lg border border-separator', className)
+    }, createElement('table', { className: 'hc-table-element w-full border-collapse' }, children)));
 }

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

@@ -1,5 +1,5 @@
 import type { IconDefinition } from '@fortawesome/fontawesome-svg-core';
-import type { AriaAttributes, JSX, ReactNode, RefObject } from 'react';
+import type { AriaAttributes, ComponentPropsWithoutRef, JSX, ReactNode, RefObject } from 'react';
 /**
  * Declarative action rendered as an icon button in a sidebar toolbar.
  */
@@ -49,7 +49,7 @@ export interface ToolbarAction {
      */
     buttonRef?: RefObject<HTMLButtonElement | null>;
 }
-interface Props {
+interface Props extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'aria-label'> {
     /**
      * Icon actions rendered in the toolbar.
      */
@@ -58,18 +58,10 @@ interface Props {
      * Accessible name for the toolbar landmark.
      */
     ariaLabel?: string;
-    /**
-     * Extra classes merged onto the outer toolbar wrapper.
-     */
-    className?: string;
 }
 /**
  * Top-of-sidebar toolbar with left-aligned icon actions.
- *
- * @param actions - Declarative icon actions rendered on the left.
- * @param ariaLabel - Accessible name for the toolbar landmark.
- * @param className - Extra classes merged onto the outer wrapper.
  */
-export declare function Toolbar({ actions, ariaLabel, className }: Props): JSX.Element;
+export declare function Toolbar({ actions, ariaLabel, className, ...props }: Props): JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Toolbar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Toolbar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvE;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,IAAI,EAAE,cAAc,CAAC;IAErB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;OAEG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC,eAAe,CAAC,CAAC;IAE/C;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;CACjD;AAED,UAAU,KAAK;IACb;;OAEG;IACH,OAAO,EAAE,aAAa,EAAE,CAAC;IAEzB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAyBD;;;;;;GAMG;AACH,wBAAgB,OAAO,CAAC,EAAE,OAAO,EAAE,SAAqB,EAAE,SAAS,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAyCzF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Toolbar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,cAAc,EAAE,wBAAwB,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIjG;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,IAAI,EAAE,cAAc,CAAC;IAErB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;OAEG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC,eAAe,CAAC,CAAC;IAE/C;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;CACjD;AAED,UAAU,KAAM,SAAQ,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACtF;;OAEG;IACH,OAAO,EAAE,aAAa,EAAE,CAAC;IAEzB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuBD;;GAEG;AACH,wBAAgB,OAAO,CAAC,EACtB,OAAO,EACP,SAAqB,EACrB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CA6CrB"}

package/dist/components/Toolbar/index.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@harborclient/sdk/jsx-runtime";
 import { FaIcon } from '../FaIcon/index.js';
+import { cn } from '../utils.js';
 /**
  * Tailwind classes for inactive toolbar icon action buttons.
  */
@@ -10,8 +11,6 @@ const TOOLBAR_ACTION_BUTTON_INACTIVE = 'hc-toolbar-action inline-flex h-7 w-7 sh
 const TOOLBAR_ACTION_BUTTON_ACTIVE = 'hc-toolbar-action inline-flex h-7 w-7 shrink-0 cursor-pointer items-center justify-center rounded-md border-none bg-selection text-text shadow-sm focus-visible:bg-surface focus-visible:text-text disabled:cursor-not-allowed disabled:opacity-50 app-no-drag';
 /**
  * Resolves toolbar button classes for a declarative action.
- *
- * @param action - Toolbar action metadata.
  */
 function toolbarActionButton(action) {
     return action.ariaPressed === true
@@ -20,16 +19,9 @@ function toolbarActionButton(action) {
 }
 /**
  * Top-of-sidebar toolbar with left-aligned icon actions.
- *
- * @param actions - Declarative icon actions rendered on the left.
- * @param ariaLabel - Accessible name for the toolbar landmark.
- * @param className - Extra classes merged onto the outer wrapper.
  */
-export function Toolbar({ actions, ariaLabel = 'Toolbar', className }) {
-    const wrapperClassName = className
-        ? `hc-toolbar flex shrink-0 items-center border-b border-separator bg-sidebar-toolbar px-2 py-2 app-no-drag ${className}`
-        : 'hc-toolbar flex shrink-0 items-center border-b border-separator bg-sidebar-toolbar px-2 py-2 app-no-drag';
-    return (_jsx("div", { role: "toolbar", "aria-label": ariaLabel, className: wrapperClassName, children: _jsx("div", { className: "hc-toolbar-actions flex items-center gap-1", children: actions.map((action) => {
+export function Toolbar({ actions, ariaLabel = 'Toolbar', className, ...props }) {
+    return (_jsx("div", { ...props, role: "toolbar", "aria-label": ariaLabel, className: cn('hc-toolbar app-no-drag flex shrink-0 items-center border-b border-separator bg-sidebar-toolbar px-2 py-2', className), children: _jsx("div", { className: "hc-toolbar-actions flex items-center gap-1", children: actions.map((action) => {
                 const title = action.title ?? action.label;
                 return (_jsxs("div", { className: "hc-toolbar-action-wrap relative", children: [_jsx("button", { type: "button", ref: action.buttonRef, className: toolbarActionButton(action), title: title, "aria-label": action.label, "aria-expanded": action.ariaExpanded, "aria-pressed": action.ariaPressed, "aria-haspopup": action.ariaHaspopup, disabled: action.disabled, onClick: action.onClick, children: _jsx(FaIcon, { icon: action.icon, className: action.ariaPressed === true
                                     ? 'hc-toolbar-action-icon h-5! w-5!'

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

@@ -1,15 +1,13 @@
-import type { JSX, KeyboardEvent } from 'react';
+import type { ComponentPropsWithoutRef, JSX, KeyboardEvent } from 'react';
 import type { Variable } from '../../types.js';
 import type { AutocompleteSource } from '../Autocomplete/types.js';
-export interface Props {
+export interface Props extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'className' | 'id' | 'aria-label' | 'aria-labelledby' | 'onKeyDown' | 'onChange'> {
     /**
      * Current input value.
      */
     value: string;
     /**
      * Called when the value changes.
-     *
-     * @param value - Updated input value.
      */
     onChange: (value: string) => void;
     /**
@@ -59,5 +57,5 @@ export interface Props {
  * Token highlight color (`text-[#32D2E2]`) and the tooltip `app-no-drag` class rely on
  * host styling in HarborClient `styles.css`.
  */
-export declare function VariableInput({ value, onChange, variables, placeholder, onKeyDown, className, wrapperClassName, onEditVariable, id, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, source }: Props): JSX.Element;
+export declare function VariableInput({ value, onChange, variables, placeholder, onKeyDown, className, wrapperClassName, onEditVariable, id, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, source, ...props }: Props): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/VariableInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/VariableInput/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,GAAG,EAAE,aAAa,EAAc,MAAM,OAAO,CAAC;AAC5D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAS/C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAYnE,MAAM,WAAW,KAAK;IACpB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;OAIG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAElC;;OAEG;IACH,SAAS,EAAE,QAAQ,EAAE,CAAC;IAEtB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAE5B;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;OAEG;IACH,MAAM,CAAC,EAAE,kBAAkB,CAAC;CAC7B;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,SAAS,EACT,WAAW,EACX,SAAS,EACT,SAAc,EACd,gBAAgB,EAChB,cAAc,EACd,EAAE,EACF,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,MAAM,EACP,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAqTrB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/VariableInput/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,GAAG,EAAE,aAAa,EAAc,MAAM,OAAO,CAAC;AACtF,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAS/C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAanE,MAAM,WAAW,KAAM,SAAQ,IAAI,CACjC,wBAAwB,CAAC,KAAK,CAAC,EAC/B,UAAU,GAAG,WAAW,GAAG,IAAI,GAAG,YAAY,GAAG,iBAAiB,GAAG,WAAW,GAAG,UAAU,CAC9F;IACC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAElC;;OAEG;IACH,SAAS,EAAE,QAAQ,EAAE,CAAC;IAEtB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAE5B;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;OAEG;IACH,MAAM,CAAC,EAAE,kBAAkB,CAAC;CAC7B;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,SAAS,EACT,WAAW,EACX,SAAS,EACT,SAAc,EACd,gBAAgB,EAChB,cAAc,EACd,EAAE,EACF,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,MAAM,EACN,GAAG,KAAK,EACT,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CA2SrB"}

package/dist/components/VariableInput/index.js

@@ -4,13 +4,14 @@ import { getDynamicVariableDescription, getVariableTokenAtOffset, getVariableToo
 import { SuggestionList } from '../Autocomplete/SuggestionList.js';
 import { useAutocomplete } from '../Autocomplete/useAutocomplete.js';
 import { Input } from '../forms/index.js';
+import { cn } from '../utils.js';
 /**
  * Text input that highlights {{variable}} tokens and shows resolved values on hover.
  *
  * Token highlight color (`text-[#32D2E2]`) and the tooltip `app-no-drag` class rely on
  * host styling in HarborClient `styles.css`.
  */
-export function VariableInput({ value, onChange, variables, placeholder, onKeyDown, className = '', wrapperClassName, onEditVariable, id, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, source }) {
+export function VariableInput({ value, onChange, variables, placeholder, onKeyDown, className = '', wrapperClassName, onEditVariable, id, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, source, ...props }) {
     const safeValue = value ?? '';
     const inputRef = useRef(null);
     const backdropRef = useRef(null);
@@ -60,10 +61,6 @@ export function VariableInput({ value, onChange, variables, placeholder, onKeyDo
     };
     /**
      * Shows a tooltip for a variable token at the given screen position.
-     *
-     * @param key - Variable name from the token.
-     * @param top - Top coordinate for tooltip placement.
-     * @param left - Horizontal center coordinate for tooltip placement.
      */
     const showTooltipForKey = (key, top, left) => {
         setTooltip({
@@ -107,8 +104,6 @@ export function VariableInput({ value, onChange, variables, placeholder, onKeyDo
     };
     /**
      * Shows a tooltip when the pointer is over a variable token span.
-     *
-     * @param e - Mouse move event from the input.
      */
     const handleMouseMove = (e) => {
         cancelHide();
@@ -131,8 +126,6 @@ export function VariableInput({ value, onChange, variables, placeholder, onKeyDo
     };
     /**
      * Handles keyboard events on the input, including tooltip dismissal.
-     *
-     * @param event - Keyboard event from the input.
      */
     const handleKeyDown = (event) => {
         if (onInputKeyDown(event)) {
@@ -147,8 +140,6 @@ export function VariableInput({ value, onChange, variables, placeholder, onKeyDo
     };
     /**
      * Updates the tooltip after keyboard navigation moves the caret.
-     *
-     * @param event - Keyboard event from the input.
      */
     const handleKeyUp = (event) => {
         if (event.key === 'ArrowLeft' ||
@@ -161,24 +152,22 @@ export function VariableInput({ value, onChange, variables, placeholder, onKeyDo
         }
     };
     const tooltipContent = tooltip ? getVariableTooltipContent(tooltip.key, variables) : null;
-    return (_jsxs("div", { className: wrapperClassName
-            ? `hc-variable-input relative min-w-0 ${wrapperClassName}`
-            : 'hc-variable-input relative min-w-0 flex-1', children: [_jsx("div", { ref: backdropRef, "aria-hidden": true, className: "hc-variable-input-backdrop pointer-events-none absolute inset-0 overflow-hidden whitespace-nowrap px-2.5 py-1.5 text-[16px] text-inherit", children: safeValue ? (tokens.map((token, index) => token.key ? (_jsx("span", { ref: (el) => {
+    return (_jsxs("div", { ...props, className: cn('hc-variable-input relative min-w-0', wrapperClassName ?? 'flex-1'), children: [_jsx("div", { ref: backdropRef, "aria-hidden": true, className: "hc-variable-input-backdrop pointer-events-none absolute inset-0 overflow-hidden px-2.5 py-1.5 text-[16px] whitespace-nowrap text-inherit", children: safeValue ? (tokens.map((token, index) => token.key ? (_jsx("span", { ref: (el) => {
                         if (el)
                             spanRefs.current.set(index, el);
                         else
                             spanRefs.current.delete(index);
                     }, className: "hc-variable-input-token hc-variable-input-token-variable text-[#32D2E2]", children: token.text }, index)) : (_jsx("span", { className: "hc-variable-input-token", children: token.text }, index)))) : (_jsx("span", { className: "hc-variable-input-placeholder text-muted", children: placeholder })) }), _jsx(Input, { ref: inputRef, id: id, variant: "plain", role: source ? 'combobox' : undefined, "aria-autocomplete": source ? 'list' : undefined, "aria-expanded": source ? autocompleteOpen : undefined, "aria-controls": source && autocompleteOpen ? listboxId : undefined, "aria-activedescendant": source && autocompleteOpen && autocompleteActiveIndex >= 0
                     ? `${listboxId}-option-${autocompleteActiveIndex}`
-                    : undefined, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": tooltip ? tooltipId : undefined, className: `hc-variable-input-field relative w-full min-w-0 border-none bg-transparent px-2.5 py-1.5 text-[16px] text-transparent caret-text focus-visible:shadow-none ${className}`, type: "text", placeholder: placeholder, value: safeValue, onChange: (e) => {
+                    : undefined, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": tooltip ? tooltipId : undefined, className: cn('hc-variable-input-field relative w-full min-w-0 border-none bg-transparent px-2.5 py-1.5 text-[16px] text-transparent caret-text focus-visible:shadow-none', className), type: "text", placeholder: placeholder, value: safeValue, onChange: (e) => {
                     onChange(e.target.value);
                     queueMicrotask(updateTooltipFromCaret);
                 }, onFocus: () => {
                     openAutocomplete();
                     updateTooltipFromCaret();
-                }, onBlur: closeAutocomplete, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, onSelect: updateTooltipFromCaret, onClick: updateTooltipFromCaret, onScroll: syncScroll, onMouseMove: handleMouseMove, onMouseLeave: scheduleHide }), source && (_jsx(SuggestionList, { open: autocompleteOpen, items: autocompleteItems, activeIndex: autocompleteActiveIndex, anchorRef: inputRef, listboxId: listboxId, onSelect: selectItem, onActiveIndexChange: setActiveIndex, onClose: closeSuggestions })), tooltip && tooltipContent && (_jsxs("div", { id: tooltipId, role: "tooltip", className: "hc-variable-input-tooltip pointer-events-auto fixed z-50 flex max-w-sm -translate-x-1/2 -translate-y-full flex-col gap-2 rounded-lg border border-separator bg-surface px-4 py-3 text-[14px] text-text shadow-md after:pointer-events-auto after:absolute after:-bottom-2 after:left-0 after:right-0 after:h-2 after:content-['']", style: { top: tooltip.top - 4, left: tooltip.left }, onMouseEnter: cancelHide, onMouseLeave: scheduleHide, children: [_jsx("span", { className: tooltipContent.muted
+                }, onBlur: closeAutocomplete, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, onSelect: updateTooltipFromCaret, onClick: updateTooltipFromCaret, onScroll: syncScroll, onMouseMove: handleMouseMove, onMouseLeave: scheduleHide }), source && (_jsx(SuggestionList, { open: autocompleteOpen, items: autocompleteItems, activeIndex: autocompleteActiveIndex, anchorRef: inputRef, listboxId: listboxId, onSelect: selectItem, onActiveIndexChange: setActiveIndex, onClose: closeSuggestions })), tooltip && tooltipContent && (_jsxs("div", { id: tooltipId, role: "tooltip", className: "hc-variable-input-tooltip pointer-events-auto fixed z-50 flex max-w-sm -translate-x-1/2 -translate-y-full flex-col gap-2 rounded-lg border border-separator bg-surface px-4 py-3 text-[14px] text-text shadow-md after:pointer-events-auto after:absolute after:right-0 after:-bottom-2 after:left-0 after:h-2 after:content-['']", style: { top: tooltip.top - 4, left: tooltip.left }, onMouseEnter: cancelHide, onMouseLeave: scheduleHide, children: [_jsx("span", { className: tooltipContent.muted
                             ? 'hc-variable-input-tooltip-text text-muted'
-                            : 'hc-variable-input-tooltip-text', children: tooltipContent.text }), onEditVariable && (_jsx("button", { type: "button", className: "hc-variable-input-tooltip-edit -mx-1 self-start rounded px-1 py-0.5 text-[14px] text-accent hover:underline app-no-drag", "aria-label": `Edit value for ${tooltip.key}`, onClick: () => {
+                            : 'hc-variable-input-tooltip-text', children: tooltipContent.text }), onEditVariable && (_jsx("button", { type: "button", className: "hc-variable-input-tooltip-edit app-no-drag -mx-1 self-start rounded px-1 py-0.5 text-[14px] text-accent hover:underline", "aria-label": `Edit value for ${tooltip.key}`, onClick: () => {
                             onEditVariable();
                             setTooltip(null);
                         }, children: "Edit value" }))] }))] }));