@harborclient/sdk 1.0.6 → 1.0.9

package/dist/components/AsyncListState/index.js

@@ -20,7 +20,7 @@ export function LoadingMessage({ children = 'Loading…', className }) {
  * @param retryLabel - Visible retry button label.
  */
 export function ErrorRetry({ error, onRetry, retryLabel = 'Retry' }) {
-    return (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(FieldError, { spacing: "field", className: "mb-0 mt-0", children: error }), _jsx(Button, { type: "button", variant: "secondary", onClick: onRetry, children: retryLabel })] }));
+    return (_jsxs("div", { className: "hc-error-retry flex flex-wrap items-center gap-2", children: [_jsx(FieldError, { spacing: "field", className: "mb-0 mt-0", children: error }), _jsx(Button, { type: "button", variant: "secondary", onClick: onRetry, children: retryLabel })] }));
 }
 /**
  * Switches between loading, error-with-retry, empty, and ready list content for

package/dist/components/Autocomplete/AutocompleteInput.js

@@ -12,7 +12,7 @@ export function AutocompleteInput({ value, onChange, source, className, onFocus,
         value: safeValue,
         onSelect: onChange
     });
-    return (_jsxs(_Fragment, { children: [_jsx(Input, { ...props, ref: anchorRef, role: source ? 'combobox' : undefined, "aria-autocomplete": source ? 'list' : undefined, "aria-expanded": source ? open : undefined, "aria-controls": source && open ? listboxId : undefined, "aria-activedescendant": source && open && activeIndex >= 0 ? `${listboxId}-option-${activeIndex}` : undefined, className: className, value: safeValue, onChange: (event) => onChange(event.target.value), onFocus: (event) => {
+    return (_jsxs(_Fragment, { children: [_jsx(Input, { ...props, ref: anchorRef, role: source ? 'combobox' : undefined, "aria-autocomplete": source ? 'list' : undefined, "aria-expanded": source ? open : undefined, "aria-controls": source && open ? listboxId : undefined, "aria-activedescendant": source && open && activeIndex >= 0 ? `${listboxId}-option-${activeIndex}` : undefined, className: className ? `hc-autocomplete-input ${className}` : 'hc-autocomplete-input', value: safeValue, onChange: (event) => onChange(event.target.value), onFocus: (event) => {
                     openAutocomplete();
                     onFocus?.(event);
                 }, onBlur: (event) => {

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

@@ -5,11 +5,11 @@ interface Props {
      */
     onClick: () => void;
     /**
-     * Default accessible name when `ariaLabel` is not provided.
+     * Visible button text and default accessible name when `ariaLabel` is not provided.
      */
     label?: string;
     /**
-     * Accessible name when it should differ from `label`.
+     * Accessible name when it should differ from the visible `label`.
      */
     ariaLabel?: string;
     /**
@@ -18,13 +18,13 @@ interface Props {
     className?: string;
 }
 /**
- * Secondary icon back control for nested panel headers.
+ * Secondary back control for nested panel and overlay headers.
  *
- * Matches {@link PanelCloseButton} styling with a left-angle icon instead of close.
+ * Matches {@link PanelCloseButton} sizing with a left-angle icon and visible label.
  *
  * @param onClick - Back navigation handler.
- * @param label - Default accessible name; defaults to "Back".
- * @param ariaLabel - Accessible name override.
+ * @param label - Visible button text; defaults to "Back".
+ * @param ariaLabel - Accessible name override when it should differ from `label`.
  * @param className - Extra classes appended after the layout preset.
  */
 export declare function BackButton({ onClick, label, ariaLabel, className }: Props): JSX.Element;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/BackButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAKjC,UAAU,KAAK;IACb;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;GASG;AACH,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,KAAc,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAehG"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/BackButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAKjC,UAAU,KAAK;IACb;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;GASG;AACH,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,KAAc,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAgBhG"}

package/dist/components/BackButton/index.js

@@ -1,19 +1,19 @@
-import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "@harborclient/sdk/jsx-runtime";
 import { Button } from '../Button/index.js';
 import { FaIcon } from '../FaIcon/index.js';
 import { faAngleLeft } from '@fortawesome/free-solid-svg-icons';
 /**
- * Secondary icon back control for nested panel headers.
+ * Secondary back control for nested panel and overlay headers.
  *
- * Matches {@link PanelCloseButton} styling with a left-angle icon instead of close.
+ * Matches {@link PanelCloseButton} sizing with a left-angle icon and visible label.
  *
  * @param onClick - Back navigation handler.
- * @param label - Default accessible name; defaults to "Back".
- * @param ariaLabel - Accessible name override.
+ * @param label - Visible button text; defaults to "Back".
+ * @param ariaLabel - Accessible name override when it should differ from `label`.
  * @param className - Extra classes appended after the layout preset.
  */
 export function BackButton({ onClick, label = 'Back', ariaLabel, className }) {
-    const base = 'inline-flex shrink-0 items-center justify-center py-2';
-    const classes = className ? `${base} ${className}` : base;
-    return (_jsx(Button, { type: "button", variant: "secondary", className: classes, "aria-label": ariaLabel ?? label, onClick: onClick, children: _jsx(FaIcon, { icon: faAngleLeft, className: "h-4 w-4" }) }));
+    const base = 'inline-flex shrink-0 items-center justify-center gap-1.5 py-1 text-[14px] h-6';
+    const classes = className ? `hc-back-button ${base} ${className}` : `hc-back-button ${base}`;
+    return (_jsxs(Button, { type: "button", variant: "toolbar", className: classes, "aria-label": ariaLabel, onClick: onClick, children: [_jsx(FaIcon, { icon: faAngleLeft, className: "h-4 w-4", "aria-hidden": true }), _jsx("span", { children: label })] }));
 }

package/dist/components/Badge/index.js

@@ -26,7 +26,7 @@ function variantClasses(variant) {
  * @param className - Extra classes appended after the variant preset.
  */
 export function Badge({ children, variant = 'muted', className }) {
-    const base = `inline-flex shrink-0 items-center rounded px-1.5 py-0.5 text-[14px] ${variantClasses(variant)}`;
+    const base = `hc-badge inline-flex shrink-0 items-center rounded px-1.5 py-0.5 text-[14px] ${variantClasses(variant)}`;
     const classes = className ? `${base} ${className}` : base;
     return _jsx("span", { className: classes, children: children });
 }

package/dist/components/BusyIndicator/index.js

@@ -82,5 +82,5 @@ export function BusyIndicator({ isBusy }) {
     if (!visible) {
         return null;
     }
-    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "pointer-events-none fixed inset-x-0 top-0 z-[100] h-0.5 overflow-hidden bg-separator", "aria-hidden": "true", children: _jsx("div", { className: "busy-progress-bar h-full w-1/3 bg-accent" }) }), _jsx("div", { className: "pointer-events-none fixed right-3 top-3 z-[100] flex h-6 w-6 items-center justify-center rounded-full border border-separator bg-surface shadow-sm", role: "status", "aria-label": "Working", children: _jsx(Spinner, { size: "sm" }) })] }));
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "hc-busy-indicator pointer-events-none fixed inset-x-0 top-0 z-[100] h-0.5 overflow-hidden bg-separator", "aria-hidden": "true", children: _jsx("div", { className: "busy-progress-bar h-full w-1/3 bg-accent" }) }), _jsx("div", { className: "pointer-events-none fixed right-3 top-3 z-[100] flex h-6 w-6 items-center justify-center rounded-full border border-separator bg-surface shadow-sm", role: "status", "aria-label": "Working", children: _jsx(Spinner, { size: "sm" }) })] }));
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElE;;GAEG;AACH,MAAM,MAAM,aAAa,GACrB,SAAS,GACT,WAAW,GACX,eAAe,GACf,iBAAiB,GACjB,SAAS,GACT,MAAM,GACN,YAAY,CAAC;AAEjB,KAAK,iBAAiB,GAAG,MAAM,GAAG,YAAY,CAAC;AAE/C,KAAK,cAAc,GACf;IAAE,YAAY,EAAE,MAAM,CAAC;IAAC,iBAAiB,CAAC,EAAE,SAAS,CAAA;CAAE,GACvD;IAAE,iBAAiB,EAAE,MAAM,CAAC;IAAC,YAAY,CAAC,EAAE,SAAS,CAAA;CAAE,CAAC;AAE5D,KAAK,SAAS,GAAG,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,YAAY,GAAG,iBAAiB,CAAC,GAAG;IACjG;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;CAChD,CAAC;AAEF,MAAM,MAAM,WAAW,GACnB,CAAC,SAAS,GAAG;IAAE,OAAO,EAAE,iBAAiB,CAAA;CAAE,GAAG,cAAc,CAAC,GAC7D,CAAC,SAAS,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAC,aAAa,EAAE,iBAAiB,CAAC,CAAA;CAAE,CAAC,CAAC;AAc1E;;;;;;;;;;;;GAYG;AACH,wBAAgB,MAAM,CAAC,EACrB,OAAmB,EACnB,SAAS,EACT,IAAe,EACf,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,WAAW,GAAG,GAAG,CAAC,OAAO,CAG3B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElE;;GAEG;AACH,MAAM,MAAM,aAAa,GACrB,SAAS,GACT,WAAW,GACX,eAAe,GACf,iBAAiB,GACjB,SAAS,GACT,MAAM,GACN,YAAY,CAAC;AAEjB,KAAK,iBAAiB,GAAG,MAAM,GAAG,YAAY,CAAC;AAE/C,KAAK,cAAc,GACf;IAAE,YAAY,EAAE,MAAM,CAAC;IAAC,iBAAiB,CAAC,EAAE,SAAS,CAAA;CAAE,GACvD;IAAE,iBAAiB,EAAE,MAAM,CAAC;IAAC,YAAY,CAAC,EAAE,SAAS,CAAA;CAAE,CAAC;AAE5D,KAAK,SAAS,GAAG,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,YAAY,GAAG,iBAAiB,CAAC,GAAG;IACjG;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;CAChD,CAAC;AAEF,MAAM,MAAM,WAAW,GACnB,CAAC,SAAS,GAAG;IAAE,OAAO,EAAE,iBAAiB,CAAA;CAAE,GAAG,cAAc,CAAC,GAC7D,CAAC,SAAS,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAC,aAAa,EAAE,iBAAiB,CAAC,CAAA;CAAE,CAAC,CAAC;AAc1E;;;;;;;;;;;;GAYG;AACH,wBAAgB,MAAM,CAAC,EACrB,OAAmB,EACnB,SAAS,EACT,IAAe,EACf,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,WAAW,GAAG,GAAG,CAAC,OAAO,CAK3B"}

package/dist/components/Button/index.js

@@ -23,6 +23,8 @@ const VARIANT_CLASSES = {
  * @param type - Native button type; defaults to `button`.
  */
 export function Button({ variant = 'primary', className, type = 'button', innerRef, ...props }) {
-    const classes = className ? `${VARIANT_CLASSES[variant]} ${className}` : VARIANT_CLASSES[variant];
+    const classes = className
+        ? `hc-button ${VARIANT_CLASSES[variant]} ${className}`
+        : `hc-button ${VARIANT_CLASSES[variant]}`;
     return _jsx("button", { ref: innerRef, type: type, className: classes, ...props });
 }

package/dist/components/CodeEditor/index.js

@@ -420,8 +420,8 @@ export function CodeEditor({ value, onChange, language = 'text', readOnly = fals
         };
     }, [resolvedSetup, readOnly]);
     const wrapperClassName = readOnly
-        ? `overflow-hidden rounded-md bg-control shadow-[inset_0_0.5px_1px_rgba(0,0,0,0.06)] app-no-drag ${className}`
-        : `min-h-36 resize-y overflow-hidden rounded-md border border-separator bg-control shadow-[inset_0_0.5px_1px_rgba(0,0,0,0.06)] focus-within:shadow-[0_0_0_3px_color-mix(in_srgb,var(--mac-accent)_35%,transparent),inset_0_0.5px_1px_rgba(0,0,0,0.06)] app-no-drag ${className}`;
+        ? `hc-code-editor overflow-hidden rounded-md bg-control shadow-[inset_0_0.5px_1px_rgba(0,0,0,0.06)] app-no-drag ${className}`
+        : `hc-code-editor min-h-36 resize-y overflow-hidden rounded-md border border-separator bg-control shadow-[inset_0_0.5px_1px_rgba(0,0,0,0.06)] focus-within:shadow-[0_0_0_3px_color-mix(in_srgb,var(--mac-accent)_35%,transparent),inset_0_0.5px_1px_rgba(0,0,0,0.06)] app-no-drag ${className}`;
     const selectionTooltipContent = selectionTooltip
         ? getVariableTooltipContent(selectionTooltip.key, variables ?? [])
         : null;

package/dist/components/EmptyState/index.js

@@ -19,7 +19,7 @@ function variantClasses(variant) {
  * @param className - Extra classes appended after the preset.
  */
 export function EmptyState({ children, variant = 'inline', className }) {
-    const base = variantClasses(variant);
+    const base = `hc-empty-state ${variantClasses(variant)}`;
     const classes = className ? `${base} ${className}` : base;
     return _jsx("div", { className: classes, children: children });
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FaIcon/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEjC,UAAU,KAAK;IACb;;OAEG;IACH,IAAI,EAAE,cAAc,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;GAEG;AACH,wBAAgB,MAAM,CAAC,EAAE,IAAI,EAAE,SAAyB,EAAE,KAAK,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAOrF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FaIcon/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEjC,UAAU,KAAK;IACb;;OAEG;IACH,IAAI,EAAE,cAAc,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;GAEG;AACH,wBAAgB,MAAM,CAAC,EAAE,IAAI,EAAE,SAAyB,EAAE,KAAK,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAQrF"}

package/dist/components/FaIcon/index.js

@@ -4,9 +4,10 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
  * Renders a Font Awesome SVG icon with consistent default sizing.
  */
 export function FaIcon({ icon, className = 'h-3.5 w-3.5', title }) {
+    const classes = className ? `hc-fa-icon ${className}` : 'hc-fa-icon';
     return createElement(FontAwesomeIcon, {
         icon,
-        className,
+        className: classes,
         title,
         'aria-hidden': title ? undefined : true
     });

package/dist/components/FieldError/index.js

@@ -28,7 +28,7 @@ function spacingClasses(spacing) {
 export function FieldError({ children, id, spacing = 'field', roleAlert = true, className }) {
     if (children == null || children === '')
         return null;
-    const base = `${spacingClasses(spacing)} text-[14px] text-danger`;
+    const base = `hc-field-error ${spacingClasses(spacing)} text-[14px] text-danger`;
     const classes = className ? `${base} ${className}` : base;
     return (_jsx("p", { id: id, className: classes, role: roleAlert ? 'alert' : undefined, children: children }));
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FooterButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE5C,UAAU,KAAK;IACb;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAaD;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EACN,OAAO,EACP,UAAU,EACV,QAAQ,EACR,SAAS,EACV,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAcrB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FooterButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE5C,UAAU,KAAK;IACb;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAaD;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EACN,OAAO,EACP,UAAU,EACV,QAAQ,EACR,SAAS,EACV,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAgBrB"}

package/dist/components/FooterButton/index.js

@@ -14,6 +14,8 @@ function footerSegment(active) {
  * slide-up panels such as Console and Variables.
  */
 export function FooterButton({ active, onClick, controlsId, children, className }) {
-    const classes = className ? `${footerSegment(active)} ${className}` : footerSegment(active);
+    const classes = className
+        ? `hc-footer-button ${footerSegment(active)} ${className}`
+        : `hc-footer-button ${footerSegment(active)}`;
     return (_jsx("button", { type: "button", className: classes, onClick: onClick, "aria-expanded": active, "aria-controls": controlsId, children: children }));
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FooterIcon/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAGjC,UAAU,KAAK;IACb;;OAEG;IACH,IAAI,EAAE,cAAc,CAAC;IAErB;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAaD;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAgB1F"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FooterIcon/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAGjC,UAAU,KAAK;IACb;;OAEG;IACH,IAAI,EAAE,cAAc,CAAC;IAErB;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAaD;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAkB1F"}

package/dist/components/FooterIcon/index.js

@@ -16,6 +16,8 @@ function footerIconButton(active) {
  */
 export function FooterIcon({ icon, active, onClick, label, className }) {
     const accessibleLabel = active ? `Hide ${label}` : `Show ${label}`;
-    const classes = className ? `${footerIconButton(active)} ${className}` : footerIconButton(active);
+    const classes = className
+        ? `hc-footer-icon ${footerIconButton(active)} ${className}`
+        : `hc-footer-icon ${footerIconButton(active)}`;
     return (_jsx("button", { type: "button", className: classes, onClick: onClick, "aria-pressed": active, "aria-label": accessibleLabel, title: accessibleLabel, children: _jsx(FaIcon, { icon: icon, className: "h-4 w-4" }) }));
 }

package/dist/components/FormDataEditor/index.js

@@ -70,7 +70,7 @@ export function FormDataEditor({ parts, onChange, variables, onSelectFiles, onEd
         const currentFiles = rows[index]?.files ?? [];
         updateRow(index, { files: currentFiles.filter((file) => file !== filePath) });
     };
-    return (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs("tr", { children: [_jsx(TableHead, { className: "w-6 p-0", children: _jsx("span", { className: "sr-only", children: "Enable" }) }), _jsx(TableHead, { children: "Key" }), _jsx(TableHead, { className: "w-24", children: "Type" }), _jsx(TableHead, { children: "Value" }), _jsx(TableHead, { className: "w-7 p-0" })] }) }), _jsx(TableBody, { children: rows.map((row, index) => (_jsxs("tr", { children: [_jsx(TableCell, { className: "w-6 p-1 text-center", children: _jsx(Checkbox, { className: "app-no-drag", checked: row.enabled, onChange: (e) => updateRow(index, { enabled: e.target.checked }), "aria-label": `Enable row ${index + 1}`, title: "Enable" }) }), _jsx(TableCell, { children: _jsx(Input, { type: "text", className: "w-full", value: row.key, placeholder: "field", "aria-label": `Key, row ${index + 1}`, onChange: (e) => updateRow(index, { key: e.target.value }) }) }), _jsx(TableCell, { children: _jsxs(Select, { className: "w-full", value: row.type, "aria-label": `Type, row ${index + 1}`, onChange: (e) => {
+    return (_jsxs(Table, { className: "hc-form-data-editor", children: [_jsx(TableHeader, { children: _jsxs("tr", { children: [_jsx(TableHead, { className: "w-6 p-0", children: _jsx("span", { className: "sr-only", children: "Enable" }) }), _jsx(TableHead, { children: "Key" }), _jsx(TableHead, { className: "w-24", children: "Type" }), _jsx(TableHead, { children: "Value" }), _jsx(TableHead, { className: "w-7 p-0" })] }) }), _jsx(TableBody, { children: rows.map((row, index) => (_jsxs("tr", { children: [_jsx(TableCell, { className: "w-6 p-1 text-center", children: _jsx(Checkbox, { className: "app-no-drag", checked: row.enabled, onChange: (e) => updateRow(index, { enabled: e.target.checked }), "aria-label": `Enable row ${index + 1}`, title: "Enable" }) }), _jsx(TableCell, { children: _jsx(Input, { type: "text", className: "w-full", value: row.key, placeholder: "field", "aria-label": `Key, row ${index + 1}`, onChange: (e) => updateRow(index, { key: e.target.value }) }) }), _jsx(TableCell, { children: _jsxs(Select, { className: "w-full", value: row.type, "aria-label": `Type, row ${index + 1}`, onChange: (e) => {
                                     const type = e.target.value;
                                     updateRow(index, {
                                         type,

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FormGroup/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAI5C;;GAEG;AACH,MAAM,MAAM,eAAe,GACvB,SAAS,GACT,UAAU,GACV,QAAQ,GACR,OAAO,GACP,kBAAkB,GAClB,YAAY,CAAC;AAEjB;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,OAAO,CAAC;AAErD,UAAU,KAAK;IACb;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC;IAEzB;;OAEG;IACH,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAE/B;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAqBD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,OAAO,EACP,WAAW,EACX,KAAK,EACL,OAAO,EACP,aAAa,EACb,MAAkB,EAClB,SAAqB,EACrB,MAAc,EACd,SAAS,EACT,cAAc,EACf,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAsGrB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FormGroup/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAI5C;;GAEG;AACH,MAAM,MAAM,eAAe,GACvB,SAAS,GACT,UAAU,GACV,QAAQ,GACR,OAAO,GACP,kBAAkB,GAClB,YAAY,CAAC;AAEjB;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,OAAO,CAAC;AAErD,UAAU,KAAK;IACb;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC;IAEzB;;OAEG;IACH,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAE/B;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAqBD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,OAAO,EACP,WAAW,EACX,KAAK,EACL,OAAO,EACP,aAAa,EACb,MAAkB,EAClB,SAAqB,EACrB,MAAc,EACd,SAAS,EACT,cAAc,EACf,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CA8GrB"}

package/dist/components/FormGroup/index.js

@@ -43,31 +43,37 @@ export function FormGroup({ label, children, htmlFor, description, error, errorI
     const controlId = htmlFor ?? generatedId;
     const extra = className ?? '';
     if (layout === 'associated') {
-        const associatedClasses = labelClassName ?? 'text-[14px] text-text';
+        const associatedClasses = labelClassName
+            ? `hc-form-group ${labelClassName}`
+            : 'hc-form-group text-[14px] text-text';
         return (_jsx("label", { htmlFor: htmlFor, className: associatedClasses, children: label }));
     }
     if (layout === 'checkboxAdjacent') {
-        const wrapperClasses = extra ? `flex items-start gap-2 ${extra}` : 'flex items-start gap-2';
+        const wrapperClasses = extra
+            ? `hc-form-group flex items-start gap-2 ${extra}`
+            : 'hc-form-group flex items-start gap-2';
         const adjacentLabelClasses = labelClassName ?? 'min-w-0 flex-1 text-[14px] text-text';
         const linkedChildren = enhanceControl(children, { id: controlId });
         return (_jsxs("div", { className: wrapperClasses, children: [linkedChildren, _jsx("label", { htmlFor: controlId, className: adjacentLabelClasses, children: label })] }));
     }
     if (layout === 'radio') {
         const wrapperClasses = extra
-            ? `inline-flex cursor-pointer items-center gap-1.5 text-[14px] text-text app-no-drag ${extra}`
-            : 'inline-flex cursor-pointer items-center gap-1.5 text-[14px] text-text app-no-drag';
+            ? `hc-form-group inline-flex cursor-pointer items-center gap-1.5 text-[14px] text-text app-no-drag ${extra}`
+            : 'hc-form-group inline-flex cursor-pointer items-center gap-1.5 text-[14px] text-text app-no-drag';
         const linkedChildren = enhanceControl(children, { id: controlId });
         return (_jsxs("label", { htmlFor: controlId, className: wrapperClasses, children: [linkedChildren, label] }));
     }
     if (layout === 'checkbox') {
-        const wrapperClasses = extra ? `flex items-center gap-2 ${extra}` : 'flex items-center gap-2';
+        const wrapperClasses = extra
+            ? `hc-form-group flex items-center gap-2 ${extra}`
+            : 'hc-form-group flex items-center gap-2';
         const linkedChildren = enhanceControl(children, { id: controlId });
         return (_jsxs("label", { htmlFor: controlId, className: wrapperClasses, children: [linkedChildren, _jsx("span", { className: labelClasses(labelTone, srOnly, false), children: label })] }));
     }
     if (layout === 'inline') {
         const wrapperClasses = extra
-            ? `flex min-w-0 flex-1 items-center gap-2 ${extra}`
-            : 'flex min-w-0 flex-1 items-center gap-2';
+            ? `hc-form-group flex min-w-0 flex-1 items-center gap-2 ${extra}`
+            : 'hc-form-group flex min-w-0 flex-1 items-center gap-2';
         const linkedChildren = enhanceControl(children, { id: controlId });
         return (_jsxs("label", { htmlFor: controlId, className: wrapperClasses, children: [_jsx("span", { className: labelClasses(labelTone, srOnly, true), children: label }), linkedChildren] }));
     }
@@ -84,6 +90,8 @@ export function FormGroup({ label, children, htmlFor, description, error, errorI
         invalid: resolvedErrorId != null,
         id: htmlFor
     });
-    const wrapperClasses = extra ? `flex flex-col gap-1 ${extra}` : 'flex flex-col gap-1';
+    const wrapperClasses = extra
+        ? `hc-form-group flex flex-col gap-1 ${extra}`
+        : 'hc-form-group flex flex-col gap-1';
     return (_jsxs("div", { className: wrapperClasses, children: [_jsxs("label", { htmlFor: htmlFor, className: "flex flex-col gap-1", children: [_jsx("span", { className: labelClasses(labelTone, srOnly, false), children: label }), control, resolvedDescriptionId ? (_jsx("p", { id: resolvedDescriptionId, className: "m-0 text-[14px] text-muted", children: description })) : null] }), resolvedErrorId ? (_jsx(FieldError, { id: resolvedErrorId, spacing: "field", children: error })) : null] }));
 }

package/dist/components/KeyValueEditor/index.js

@@ -46,7 +46,7 @@ export function KeyValueEditor({ rows, onChange, placeholderKey = 'Key', placeho
         value: row.value ?? '',
         enabled: row.enabled ?? true
     });
-    return (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs("tr", { children: [_jsx(TableHead, { className: "w-6 p-0", children: _jsx("span", { className: "sr-only", children: "Enable" }) }), _jsx(TableHead, { children: "Key" }), _jsx(TableHead, { children: "Value" }), _jsx(TableHead, { className: "w-7 p-0" })] }) }), _jsx(TableBody, { children: rows.map((row, index) => {
+    return (_jsxs(Table, { className: "hc-key-value-editor", children: [_jsx(TableHeader, { children: _jsxs("tr", { children: [_jsx(TableHead, { className: "w-6 p-0", children: _jsx("span", { className: "sr-only", children: "Enable" }) }), _jsx(TableHead, { children: "Key" }), _jsx(TableHead, { children: "Value" }), _jsx(TableHead, { className: "w-7 p-0" })] }) }), _jsx(TableBody, { children: rows.map((row, index) => {
                     const normalizedRow = normalizeRow(row);
                     return (_jsxs("tr", { children: [_jsx(TableCell, { className: "w-6 p-1 text-center", children: _jsx(Checkbox, { className: "app-no-drag", checked: normalizedRow.enabled, onChange: (e) => updateRow(index, { enabled: e.target.checked }), "aria-label": `Enable row ${index + 1}`, title: "Enable" }) }), _jsx(TableCell, { children: _jsx(AutocompleteInput, { type: "text", className: "w-full", value: normalizedRow.key, source: keySource, placeholder: placeholderKey, "aria-label": `Key, row ${index + 1}`, onChange: (key) => updateRow(index, { key }) }) }), _jsx(TableCell, { children: _jsx(VariableInput, { wrapperClassName: `${fieldFrame} w-full`, className: "app-no-drag", value: normalizedRow.value, onChange: (value) => updateRow(index, { value }), variables: variables, source: valueSource, placeholder: placeholderValue, "aria-label": `Value, row ${index + 1}`, onEditVariable: onEditVariable }) }), _jsx(TableCell, { className: "w-7 p-1 text-center", children: _jsx(Button, { type: "button", variant: "iconDanger", onClick: () => removeRow(index), title: "Remove", "aria-label": `Remove row ${index + 1}`, children: _jsx(FaIcon, { icon: faXmark, className: "h-3.5 w-3.5" }) }) })] }, index));
                 }) })] }));

package/dist/components/MethodSelect/index.js

@@ -5,5 +5,5 @@ const METHODS = ['GET', 'POST', 'PUT', 'PATCH', 'DELETE', 'HEAD', 'OPTIONS'];
  * Dropdown for selecting an HTTP request method.
  */
 export function MethodSelect({ value, onChange }) {
-    return (_jsx(Select, { variant: "plain", className: "w-[100px] shrink-0 cursor-pointer appearance-none border-none bg-transparent px-2 py-1 text-[14px] font-semibold app-no-drag", value: value, "aria-label": "HTTP method", onChange: (e) => onChange(e.target.value), children: METHODS.map((method) => (_jsx("option", { value: method, children: method }, method))) }));
+    return (_jsx(Select, { variant: "plain", className: "hc-method-select w-[100px] shrink-0 cursor-pointer appearance-none border-none bg-transparent px-2 py-1 text-[14px] font-semibold app-no-drag", value: value, "aria-label": "HTTP method", onChange: (e) => onChange(e.target.value), children: METHODS.map((method) => (_jsx("option", { value: method, children: method }, method))) }));
 }

package/dist/components/Modal/index.js

@@ -30,7 +30,7 @@ export function Modal({ onClose, className = 'w-96', overlayClassName, disableEs
         document.addEventListener('keydown', handleKeyDown);
         return () => document.removeEventListener('keydown', handleKeyDown);
     }, [disableEscape, onClose]);
-    const overlayClass = `fixed inset-0 flex items-center justify-center bg-black/40 ${overlayClassName ?? 'z-50'}`;
+    const overlayClass = `hc-modal fixed inset-0 flex items-center justify-center bg-black/40 ${overlayClassName ?? 'z-50'}`;
     const panelClass = title
         ? `${className} flex max-h-[85vh] flex-col overflow-hidden rounded-lg border border-separator bg-surface shadow-xl`
         : `${className} rounded-lg border border-separator bg-surface p-4 shadow-xl`;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/OverlayCloseButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAKjC,UAAU,KAAK;IACb;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,EAAE,KAAe,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAQ9F"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/OverlayCloseButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAKjC,UAAU,KAAK;IACb;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,EAAE,KAAe,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAU9F"}

package/dist/components/OverlayCloseButton/index.js

@@ -10,6 +10,8 @@ import { FaIcon } from '../FaIcon/index.js';
  * @param className - Extra classes appended after the overlay preset.
  */
 export function OverlayCloseButton({ label = 'Close', onClose, className }) {
-    const classes = className ? `text-[28px] ${className}` : 'text-[28px]';
+    const classes = className
+        ? `hc-overlay-close-button text-[28px] ${className}`
+        : 'hc-overlay-close-button text-[28px]';
     return (_jsx(Button, { type: "button", variant: "icon", className: classes, "aria-label": label, onClick: onClose, children: _jsx(FaIcon, { icon: faXmark, className: "h-4 w-4" }) }));
 }

package/dist/components/Page/index.js

@@ -8,11 +8,11 @@ import { PageHeader } from '../PageHeader/index.js';
 export function Page({ title, description, icon, actions, footer, embedded = false, className, children }) {
     const header = (_jsx(PageHeader, { title: title, description: description, icon: icon, children: actions }));
     if (embedded) {
-        const outer = className ?? undefined;
+        const outer = className ? `hc-page ${className}` : 'hc-page';
         return (_jsxs("div", { className: outer, children: [header, children, footer] }));
     }
     const outer = className
-        ? `flex min-h-0 flex-1 flex-col overflow-y-auto p-6 ${className}`
-        : 'flex min-h-0 flex-1 flex-col overflow-y-auto p-6';
+        ? `hc-page flex min-h-0 flex-1 flex-col overflow-y-auto p-6 ${className}`
+        : 'hc-page flex min-h-0 flex-1 flex-col overflow-y-auto p-6';
     return (_jsx("div", { className: outer, children: _jsxs("div", { className: "mx-auto w-full", children: [header, children, footer] }) }));
 }

package/dist/components/PageHeader/index.js

@@ -6,7 +6,7 @@ import { FaIcon } from '../FaIcon/index.js';
  */
 export function PageHeader({ title, description, icon, children, className }) {
     const wrapperClassName = className
-        ? `-mx-6 mb-4 flex flex-wrap items-center gap-2 border-b border-separator px-6 py-3 ${className}`
-        : '-mx-6 mb-4 flex flex-wrap items-center gap-2 border-b border-separator px-6 py-3';
+        ? `hc-page-header -mx-6 mb-4 flex flex-wrap items-center gap-2 border-b border-separator px-6 py-3 ${className}`
+        : 'hc-page-header -mx-6 mb-4 flex flex-wrap items-center gap-2 border-b border-separator px-6 py-3';
     return (_jsxs("div", { className: wrapperClassName, children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("h2", { className: "m-0 flex items-center gap-2 text-[17px] font-semibold text-text", children: [icon ? _jsx(FaIcon, { icon: icon, className: "h-4 w-4 shrink-0 text-muted", "aria-hidden": true }) : null, title] }), description ? _jsx("p", { className: "m-0 mt-1 text-[14px] text-muted", children: description }) : null] }), children ? _jsx("div", { className: "flex flex-wrap items-center gap-2", children: children }) : null] }));
 }

package/dist/components/PageSidebar/index.js

@@ -14,7 +14,7 @@ function sidebarRow(active) {
  * Narrow sidebar navigation for multi-section pages such as settings overlays.
  */
 export function PageSidebar({ items, selected, onSelect, ariaLabel }) {
-    return (_jsx("nav", { className: "flex w-[180px] shrink-0 flex-col gap-0.5 border-r border-separator bg-sidebar px-2 py-3", "aria-label": ariaLabel, children: items.map((item) => {
+    return (_jsx("nav", { className: "hc-page-sidebar flex w-[180px] shrink-0 flex-col gap-0.5 border-r border-separator bg-sidebar px-2 py-3", "aria-label": ariaLabel, children: items.map((item) => {
             const active = selected === item.value;
             const rowClass = item.icon
                 ? `${sidebarRow(active)} w-full gap-2 border-none text-left text-[14px] app-no-drag`

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PanelCloseButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAKjC,UAAU,KAAK;IACb;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,KAAe,EACf,SAAS,EACT,SAAS,EACV,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAerB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PanelCloseButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAKjC,UAAU,KAAK;IACb;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,KAAe,EACf,SAAS,EACT,SAAS,EACV,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAiBrB"}

package/dist/components/PanelCloseButton/index.js

@@ -12,6 +12,8 @@ import { faXmark } from '@fortawesome/free-solid-svg-icons';
  */
 export function PanelCloseButton({ onClose, label = 'Close', ariaLabel, className }) {
     const base = 'inline-flex shrink-0 items-center justify-center py-2';
-    const classes = className ? `${base} ${className}` : base;
+    const classes = className
+        ? `hc-panel-close-button ${base} ${className}`
+        : `hc-panel-close-button ${base}`;
     return (_jsx(Button, { type: "button", variant: "secondary", className: classes, "aria-label": ariaLabel ?? label, onClick: onClose, children: _jsx(FaIcon, { icon: faXmark, className: "h-4 w-4" }) }));
 }

package/dist/components/Resizable/Resizable.js

@@ -28,5 +28,5 @@ export function Resizable({ id, open, onClose, closeLabel, storageKey, title, he
     });
     const closeButton = (_jsx("button", { type: "button", className: footerPanelCloseButtonClassName, onClick: onClose, "aria-label": `Close ${closeLabel}`, children: _jsx(FaIcon, { icon: faXmark, className: "h-3.5 w-3.5" }) }));
     const body = unmountWhenClosed && !open ? null : children;
-    return (_jsxs("div", { ref: containerRef, id: id, className: footerPanelClassName(open), style: { height }, role: "region", "aria-label": `${closeLabel} panel`, "aria-hidden": !open, inert: !open || undefined, children: [_jsx(ResizeHandle, { orientation: "horizontal", value: height, min: panelMinSize, max: panelMaxSize, onResizeStart: onResizeStart, onKeyboardResize: onKeyboardResize, ariaLabel: `Resize ${closeLabel} panel` }), headerless ? (_jsxs("div", { className: "relative flex min-h-0 flex-1 flex-col overflow-hidden", children: [_jsx("button", { type: "button", className: `absolute right-2 top-2 z-10 ${footerPanelCloseButtonClassName}`, onClick: onClose, "aria-label": `Close ${closeLabel}`, children: _jsx(FaIcon, { icon: faXmark, className: "h-3.5 w-3.5" }) }), _jsx("div", { className: "flex min-h-0 flex-1 flex-col", children: body })] })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex shrink-0 items-center justify-between border-b border-separator px-3 py-2", children: [_jsx("div", { className: "min-w-0 flex-1", children: title }), closeButton] }), body] }))] }));
+    return (_jsxs("div", { ref: containerRef, id: id, className: `hc-resizable ${footerPanelClassName(open)}`, style: { height }, role: "region", "aria-label": `${closeLabel} panel`, "aria-hidden": !open, inert: !open || undefined, children: [_jsx(ResizeHandle, { orientation: "horizontal", value: height, min: panelMinSize, max: panelMaxSize, onResizeStart: onResizeStart, onKeyboardResize: onKeyboardResize, ariaLabel: `Resize ${closeLabel} panel` }), headerless ? (_jsxs("div", { className: "relative flex min-h-0 flex-1 flex-col overflow-hidden", children: [_jsx("button", { type: "button", className: `absolute right-2 top-2 z-10 ${footerPanelCloseButtonClassName}`, onClick: onClose, "aria-label": `Close ${closeLabel}`, children: _jsx(FaIcon, { icon: faXmark, className: "h-3.5 w-3.5" }) }), _jsx("div", { className: "flex min-h-0 flex-1 flex-col", children: body })] })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex shrink-0 items-center justify-between border-b border-separator px-3 py-2", children: [_jsx("div", { className: "min-w-0 flex-1", children: title }), closeButton] }), body] }))] }));
 }

package/dist/components/ResourceList/index.js

@@ -8,7 +8,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "@harborclient/sdk/jsx-runtime";
  * @param aria-labelledby - Id of a visible heading that names the list.
  */
 export function ResourceList({ children, className, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy }) {
-    const base = 'm-0 flex list-none flex-col gap-2 p-0';
+    const base = 'hc-resource-list m-0 flex list-none flex-col gap-2 p-0';
     const classes = className ? `${base} ${className}` : base;
     return (_jsx("ul", { className: classes, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, children: children }));
 }

package/dist/components/RowActionsMenu/index.js

@@ -169,7 +169,7 @@ export function RowActionsMenu({ groups, menuId, openMenuId, onOpenChange }) {
             focusItem(typeahead.index);
         }
     };
-    return (_jsxs("div", { ref: rootRef, className: "relative shrink-0", children: [_jsx(Button, { innerRef: triggerRef, type: "button", variant: "icon", title: "Actions", "aria-label": "Row actions", "aria-haspopup": "menu", "aria-expanded": isOpen, "aria-controls": isOpen ? menuElementId : undefined, onClick: (e) => {
+    return (_jsxs("div", { ref: rootRef, className: "hc-row-actions-menu relative shrink-0", children: [_jsx(Button, { innerRef: triggerRef, type: "button", variant: "icon", title: "Actions", "aria-label": "Row actions", "aria-haspopup": "menu", "aria-expanded": isOpen, "aria-controls": isOpen ? menuElementId : undefined, onClick: (e) => {
                     e.stopPropagation();
                     if (isOpen) {
                         closeMenu();

package/dist/components/SegmentedTabs/index.js

@@ -33,7 +33,7 @@ export function SegmentedTabs({ tabs, value: valueProp, onChange: onChangeProp,
         ? (tabValue) => context.getPanelId(tabValue)
         : (tabValue) => `${standaloneId}-panel-${tabValue}`;
     const visibleTabs = tabs.filter((tab) => !tab.hidden);
-    const groupClassName = [segmentGroup, fullWidth ? 'w-full' : '', className]
+    const groupClassName = ['hc-segmented-tabs', segmentGroup, fullWidth ? 'w-full' : '', className]
         .filter(Boolean)
         .join(' ');
     /**

package/dist/components/SidebarLayout/index.js

@@ -5,7 +5,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "@harborclient/sdk/jsx-runtime";
  */
 export function SidebarLayout({ sidebar, children, className }) {
     const outer = className
-        ? `flex min-h-0 flex-1 flex-col ${className}`
-        : 'flex min-h-0 flex-1 flex-col';
+        ? `hc-sidebar-layout flex min-h-0 flex-1 flex-col ${className}`
+        : 'hc-sidebar-layout flex min-h-0 flex-1 flex-col';
     return (_jsx("div", { className: outer, children: _jsxs("div", { className: "flex min-h-0 flex-1", children: [sidebar, _jsx("div", { className: "flex-1 overflow-y-auto p-6 pt-0!", children: children })] }) }));
 }

package/dist/components/Spinner/index.js

@@ -16,7 +16,7 @@ function sizeClasses(size) {
  * @param className - Extra classes on the wrapper span.
  */
 export function Spinner({ size = 'md', label, className }) {
-    const wrapperBase = 'inline-flex items-center justify-center';
+    const wrapperBase = 'hc-spinner inline-flex items-center justify-center';
     const wrapperClasses = className ? `${wrapperBase} ${className}` : wrapperBase;
     return (_jsx("span", { className: wrapperClasses, role: label ? 'status' : undefined, "aria-label": label, children: _jsxs("svg", { className: `${sizeClasses(size)} animate-spin text-accent`, viewBox: "0 0 24 24", fill: "none", "aria-hidden": label ? true : undefined, children: [_jsx("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), _jsx("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })] }) }));
 }

package/dist/components/StatusMessage/index.js

@@ -7,7 +7,7 @@ import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
  * @param className - Extra classes appended after the preset.
  */
 export function StatusMessage({ children, live = true, id, className }) {
-    const base = 'text-[14px] text-muted';
+    const base = 'hc-status-message text-[14px] text-muted';
     const classes = className ? `${base} ${className}` : base;
     return (_jsx("p", { id: id, className: classes, role: live ? 'status' : undefined, "aria-live": live ? 'polite' : undefined, children: children }));
 }

package/dist/components/TabCloseButton/index.js

@@ -9,5 +9,5 @@ import { FaIcon } from '../FaIcon/index.js';
  * @param title - Optional native tooltip text.
  */
 export function TabCloseButton({ ariaLabel, onClick, title = 'Close tab' }) {
-    return (_jsx("button", { type: "button", className: "inline-flex aspect-square shrink-0 cursor-pointer items-center justify-center self-stretch rounded-md 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, onClick: onClick, children: _jsx(FaIcon, { icon: faXmark, className: "h-3.5 w-3.5" }) }));
+    return (_jsx("button", { type: "button", className: "hc-tab-close-button inline-flex aspect-square shrink-0 cursor-pointer items-center justify-center self-stretch rounded-md 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, onClick: onClick, children: _jsx(FaIcon, { icon: faXmark, className: "h-3.5 w-3.5" }) }));
 }

package/dist/components/Table/index.js

@@ -44,11 +44,11 @@ function mergeClasses(base, className) {
  */
 export function Table({ children, variant = 'bordered', className }) {
     if (variant === 'loose') {
-        const tableBase = 'w-full border-separate border-spacing-x-1.5 border-spacing-y-1.5';
+        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));
     }
-    const wrapperBase = 'overflow-hidden rounded-md border border-separator';
+    const wrapperBase = 'hc-table overflow-hidden rounded-md border border-separator';
     const wrapperClasses = className ? `${wrapperBase} ${className}` : wrapperBase;
     return createElement(TableVariantContext.Provider, { value: variant }, createElement('div', { className: wrapperClasses }, createElement('table', { className: 'w-full border-collapse' }, children)));
 }

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,CA2SrB"}
+{"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,CA6SrB"}

package/dist/components/VariableInput/index.js

@@ -161,7 +161,9 @@ export function VariableInput({ value, onChange, variables, placeholder, onKeyDo
         }
     };
     const tooltipContent = tooltip ? getVariableTooltipContent(tooltip.key, variables) : null;
-    return (_jsxs("div", { className: wrapperClassName ? `relative min-w-0 ${wrapperClassName}` : 'relative min-w-0 flex-1', children: [_jsx("div", { ref: backdropRef, "aria-hidden": true, className: "pointer-events-none absolute inset-0 overflow-hidden whitespace-nowrap px-2 py-1.5 text-[14px] text-inherit", children: safeValue ? (tokens.map((token, index) => token.key ? (_jsx("span", { ref: (el) => {
+    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: "pointer-events-none absolute inset-0 overflow-hidden whitespace-nowrap px-2 py-1.5 text-[14px] text-inherit", children: safeValue ? (tokens.map((token, index) => token.key ? (_jsx("span", { ref: (el) => {
                         if (el)
                             spanRefs.current.set(index, el);
                         else

package/dist/components/VariableTable/index.js

@@ -39,5 +39,5 @@ export function VariableTable({ variables, onChange, description }) {
         }
         onChange(variables.filter((_, i) => i !== index));
     };
-    return (_jsxs("div", { children: [description && _jsx("p", { className: "mb-3 text-[14px] text-muted", children: description }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsxs(Table, { variant: "loose", children: [_jsx(TableHeader, { children: _jsxs("tr", { children: [_jsx(TableHead, { children: "Key" }), _jsx(TableHead, { children: "Value" }), _jsx(TableHead, { children: "Default" }), _jsx(TableHead, { className: "w-14 text-center", children: "Share" }), _jsx(TableHead, { className: "w-7 p-0 text-center" })] }) }), _jsx(TableBody, { children: variables.map((variable, index) => (_jsxs("tr", { children: [_jsx(TableCell, { children: _jsx(Input, { type: "text", className: "w-full", value: variable.key, placeholder: "variable", "aria-label": `Key, row ${index + 1}`, onChange: (e) => updateVariable(index, { key: e.target.value }) }) }), _jsx(TableCell, { children: _jsx(Input, { type: "text", className: "w-full", value: variable.value, placeholder: "value", "aria-label": `Value, row ${index + 1}`, onChange: (e) => updateVariable(index, { value: e.target.value }) }) }), _jsx(TableCell, { children: _jsx(Input, { type: "text", className: "w-full", value: variable.defaultValue, placeholder: "default", "aria-label": `Default, row ${index + 1}`, onChange: (e) => updateVariable(index, { defaultValue: e.target.value }) }) }), _jsx(TableCell, { className: "w-14 text-center", children: _jsx(Checkbox, { checked: variable.share, onChange: (e) => updateVariable(index, { share: e.target.checked }), "aria-label": `Include value in export, row ${index + 1}`, title: "Include value in export" }) }), _jsx(TableCell, { className: "w-7 p-0 text-center", children: _jsx(Button, { type: "button", variant: "iconDanger", onClick: () => removeVariable(index), title: "Remove", "aria-label": `Remove row ${index + 1}`, children: _jsx(FaIcon, { icon: faXmark, className: "h-3.5 w-3.5" }) }) })] }, index))) })] }), _jsxs(Button, { type: "button", variant: "toolbar", className: "inline-flex items-center gap-1 self-start", onClick: addVariable, children: [_jsx(FaIcon, { icon: faPlus, className: "h-3 w-3" }), "Add variable"] })] })] }));
+    return (_jsxs("div", { className: "hc-variable-table", children: [description && _jsx("p", { className: "mb-3 text-[14px] text-muted", children: description }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsxs(Table, { variant: "loose", children: [_jsx(TableHeader, { children: _jsxs("tr", { children: [_jsx(TableHead, { children: "Key" }), _jsx(TableHead, { children: "Value" }), _jsx(TableHead, { children: "Default" }), _jsx(TableHead, { className: "w-14 text-center", children: "Share" }), _jsx(TableHead, { className: "w-7 p-0 text-center" })] }) }), _jsx(TableBody, { children: variables.map((variable, index) => (_jsxs("tr", { children: [_jsx(TableCell, { children: _jsx(Input, { type: "text", className: "w-full", value: variable.key, placeholder: "variable", "aria-label": `Key, row ${index + 1}`, onChange: (e) => updateVariable(index, { key: e.target.value }) }) }), _jsx(TableCell, { children: _jsx(Input, { type: "text", className: "w-full", value: variable.value, placeholder: "value", "aria-label": `Value, row ${index + 1}`, onChange: (e) => updateVariable(index, { value: e.target.value }) }) }), _jsx(TableCell, { children: _jsx(Input, { type: "text", className: "w-full", value: variable.defaultValue, placeholder: "default", "aria-label": `Default, row ${index + 1}`, onChange: (e) => updateVariable(index, { defaultValue: e.target.value }) }) }), _jsx(TableCell, { className: "w-14 text-center", children: _jsx(Checkbox, { checked: variable.share, onChange: (e) => updateVariable(index, { share: e.target.checked }), "aria-label": `Include value in export, row ${index + 1}`, title: "Include value in export" }) }), _jsx(TableCell, { className: "w-7 p-0 text-center", children: _jsx(Button, { type: "button", variant: "iconDanger", onClick: () => removeVariable(index), title: "Remove", "aria-label": `Remove row ${index + 1}`, children: _jsx(FaIcon, { icon: faXmark, className: "h-3.5 w-3.5" }) }) })] }, index))) })] }), _jsxs(Button, { type: "button", variant: "toolbar", className: "inline-flex items-center gap-1 self-start", onClick: addVariable, children: [_jsx(FaIcon, { icon: faPlus, className: "h-3 w-3" }), "Add variable"] })] })] }));
 }

package/dist/components/forms/Checkbox.js

@@ -5,7 +5,7 @@ import { checkboxBox, checkboxInput } from './classes.js';
  */
 export function Checkbox({ ref, className, ...props }) {
     const wrapperClasses = className
-        ? `relative inline-flex h-[18px] w-[18px] shrink-0 leading-none ${className}`
-        : 'relative inline-flex h-[18px] w-[18px] shrink-0 leading-none';
+        ? `hc-checkbox relative inline-flex h-[18px] w-[18px] shrink-0 leading-none ${className}`
+        : 'hc-checkbox relative inline-flex h-[18px] w-[18px] shrink-0 leading-none';
     return (_jsxs("span", { className: wrapperClasses, children: [_jsx("input", { ref: ref, type: "checkbox", className: checkboxInput, ...props }), _jsx("span", { className: checkboxBox, "aria-hidden": true, children: _jsx("svg", { className: "h-3 w-3", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M2.5 6L5 8.5L9.5 3.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }) })] }));
 }

package/dist/components/forms/Input.js

@@ -5,5 +5,5 @@ import { mergeFieldClasses } from './classes.js';
  */
 export function Input({ ref, variant = 'control', type, className, ...props }) {
     const resolvedVariant = type === 'checkbox' || type === 'radio' ? 'plain' : variant;
-    return (_jsx("input", { ref: ref, type: type, className: mergeFieldClasses(resolvedVariant, className), ...props }));
+    return (_jsx("input", { ref: ref, type: type, className: mergeFieldClasses(resolvedVariant, className, 'hc-input'), ...props }));
 }

package/dist/components/forms/Radio.js

@@ -5,7 +5,7 @@ import { radioCircle, radioInput } from './classes.js';
  */
 export function Radio({ ref, className, ...props }) {
     const wrapperClasses = className
-        ? `relative inline-flex h-[18px] w-[18px] shrink-0 leading-none ${className}`
-        : 'relative inline-flex h-[18px] w-[18px] shrink-0 leading-none';
+        ? `hc-radio relative inline-flex h-[18px] w-[18px] shrink-0 leading-none ${className}`
+        : 'hc-radio relative inline-flex h-[18px] w-[18px] shrink-0 leading-none';
     return (_jsxs("span", { className: wrapperClasses, children: [_jsx("input", { ref: ref, type: "radio", className: radioInput, ...props }), _jsx("span", { className: radioCircle, "aria-hidden": true, children: _jsx("span", { className: "h-2 w-2 rounded-full bg-accent" }) })] }));
 }

package/dist/components/forms/Select.js

@@ -6,5 +6,5 @@ import { mergeFieldClasses } from './classes.js';
  * Children should be plain `<option>` elements.
  */
 export function Select({ ref, variant = 'control', className, children, ...props }) {
-    return (_jsx("select", { ref: ref, className: mergeFieldClasses(variant, className), ...props, children: children }));
+    return (_jsx("select", { ref: ref, className: mergeFieldClasses(variant, className, 'hc-select'), ...props, children: children }));
 }

package/dist/components/forms/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/forms/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,sBAAsB,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAqB,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAEpE,UAAU,KAAM,SAAQ,sBAAsB,CAAC,mBAAmB,CAAC;IACjE;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CAChC;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,EAAE,GAAG,EAAE,OAAmB,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAE9F"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/forms/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,sBAAsB,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAqB,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAEpE,UAAU,KAAM,SAAQ,sBAAsB,CAAC,mBAAmB,CAAC;IACjE;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CAChC;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,EAAE,GAAG,EAAE,OAAmB,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAQ9F"}

package/dist/components/forms/Textarea.js

@@ -4,5 +4,5 @@ import { mergeFieldClasses } from './classes.js';
  * macOS-style multiline input with shared field styling presets.
  */
 export function Textarea({ ref, variant = 'control', className, ...props }) {
-    return _jsx("textarea", { ref: ref, className: mergeFieldClasses(variant, className), ...props });
+    return (_jsx("textarea", { ref: ref, className: mergeFieldClasses(variant, className, 'hc-textarea'), ...props }));
 }

package/dist/components/forms/classes.d.ts

@@ -26,7 +26,8 @@ export declare const radioCircle = "pointer-events-none flex h-[18px] w-[18px] s
  *
  * @param variant - Base styling preset; `plain` applies no preset classes.
  * @param className - Additional Tailwind classes appended after the preset.
- * @returns Combined class string, or undefined when both inputs are empty.
+ * @param rootClass - Stable component root class prepended to the result.
+ * @returns Combined class string, or undefined when all inputs are empty.
  */
-export declare function mergeFieldClasses(variant: FieldVariant, className?: string): string | undefined;
+export declare function mergeFieldClasses(variant: FieldVariant, className?: string, rootClass?: string): string | undefined;
 //# sourceMappingURL=classes.d.ts.map

package/dist/components/forms/classes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"classes.d.ts","sourceRoot":"","sources":["../../../src/components/forms/classes.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAE3D;;GAEG;AACH,eAAO,MAAM,UAAU,gEAAgE,CAAC;AAExF,mEAAmE;AACnE,eAAO,MAAM,KAAK,4FACyE,CAAC;AAE5F,wDAAwD;AACxD,eAAO,MAAM,YAAY,uFAC6D,CAAC;AAEvF,uEAAuE;AACvE,eAAO,MAAM,aAAa,iGACsE,CAAC;AAEjG,qGAAqG;AACrG,eAAO,MAAM,WAAW,qaAC4Y,CAAC;AAEra,oEAAoE;AACpE,eAAO,MAAM,UAAU,iGACyE,CAAC;AAEjG,kGAAkG;AAClG,eAAO,MAAM,WAAW,0YACiX,CAAC;AAO1Y;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,YAAY,EAAE,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAM/F"}
+{"version":3,"file":"classes.d.ts","sourceRoot":"","sources":["../../../src/components/forms/classes.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAE3D;;GAEG;AACH,eAAO,MAAM,UAAU,gEAAgE,CAAC;AAExF,mEAAmE;AACnE,eAAO,MAAM,KAAK,4FACyE,CAAC;AAE5F,wDAAwD;AACxD,eAAO,MAAM,YAAY,uFAC6D,CAAC;AAEvF,uEAAuE;AACvE,eAAO,MAAM,aAAa,iGACsE,CAAC;AAEjG,qGAAqG;AACrG,eAAO,MAAM,WAAW,qaAC4Y,CAAC;AAEra,oEAAoE;AACpE,eAAO,MAAM,UAAU,iGACyE,CAAC;AAEjG,kGAAkG;AAClG,eAAO,MAAM,WAAW,0YACiX,CAAC;AAO1Y;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,YAAY,EACrB,SAAS,CAAC,EAAE,MAAM,EAClB,SAAS,CAAC,EAAE,MAAM,GACjB,MAAM,GAAG,SAAS,CAOpB"}

package/dist/components/forms/classes.js

@@ -26,15 +26,13 @@ const VARIANT_CLASSES = {
  *
  * @param variant - Base styling preset; `plain` applies no preset classes.
  * @param className - Additional Tailwind classes appended after the preset.
- * @returns Combined class string, or undefined when both inputs are empty.
+ * @param rootClass - Stable component root class prepended to the result.
+ * @returns Combined class string, or undefined when all inputs are empty.
  */
-export function mergeFieldClasses(variant, className) {
+export function mergeFieldClasses(variant, className, rootClass) {
     const base = variant === 'plain' ? '' : VARIANT_CLASSES[variant];
-    if (base && className)
-        return `${base} ${className}`;
-    if (base)
-        return base;
-    if (className)
-        return className;
-    return undefined;
+    const parts = [rootClass, base, className].filter((part) => part != null && part !== '');
+    if (parts.length === 0)
+        return undefined;
+    return parts.join(' ');
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@harborclient/sdk",
-  "version": "1.0.6",
+  "version": "1.0.9",
   "description": "TypeScript SDK for HarborClient plugin development.",
   "keywords": [
     "harborclient",