@harborclient/sdk 1.0.61 → 1.0.63

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

@@ -1,5 +1,9 @@
 import type { IconDefinition } from '@fortawesome/fontawesome-svg-core';
 import type { ComponentPropsWithoutRef, JSX } from 'react';
+/**
+ * Active-state background treatment for footer icon toggles.
+ */
+type ActiveStyle = 'surface' | 'selection';
 interface Props extends Omit<ComponentPropsWithoutRef<'button'>, 'aria-label' | 'aria-pressed'> {
     /**
      * Font Awesome icon shown inside the footer toggle button.
@@ -18,11 +22,16 @@ interface Props extends Omit<ComponentPropsWithoutRef<'button'>, 'aria-label' |
      * Optional tooltip text. Defaults to the computed show/hide label.
      */
     title?: string;
+    /**
+     * Active-state background treatment. Use `"selection"` to match sidebar
+     * toolbar icon toggles; defaults to `"surface"` for the action menu icon.
+     */
+    activeStyle?: ActiveStyle;
 }
 /**
  * Icon-only toggle button for the window footer bar, used to show or hide
  * sidebars and similar panels.
  */
-export declare function FooterIcon({ icon, active, onClick, label, title, className, ...props }: Props): JSX.Element;
+export declare function FooterIcon({ icon, active, onClick, label, title, activeStyle, className, ...props }: Props): JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

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,wBAAwB,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAI3D,UAAU,KAAM,SAAQ,IAAI,CAAC,wBAAwB,CAAC,QAAQ,CAAC,EAAE,YAAY,GAAG,cAAc,CAAC;IAC7F;;OAEG;IACH,IAAI,EAAE,cAAc,CAAC;IAErB;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAWD;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,MAAM,EACN,OAAO,EACP,KAAK,EACL,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAerB"}
+{"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,wBAAwB,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAI3D;;GAEG;AACH,KAAK,WAAW,GAAG,SAAS,GAAG,WAAW,CAAC;AAE3C,UAAU,KAAM,SAAQ,IAAI,CAAC,wBAAwB,CAAC,QAAQ,CAAC,EAAE,YAAY,GAAG,cAAc,CAAC;IAC7F;;OAEG;IACH,IAAI,EAAE,cAAc,CAAC;IAErB;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAwBD;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,MAAM,EACN,OAAO,EACP,KAAK,EACL,KAAK,EACL,WAAuB,EACvB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAqBrB"}

package/dist/components/FooterIcon/index.js

@@ -1,19 +1,29 @@
 import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
 import { FaIcon } from '../FaIcon/index.js';
 import { cn } from '../utils.js';
+const footerIconBase = 'inline-flex h-7 w-7 shrink-0 cursor-pointer items-center justify-center rounded-md border-none app-no-drag';
 /**
  * Square icon toggle styles for footer sidebar buttons.
+ *
+ * @param active - Whether the associated panel or sidebar is open.
+ * @param activeStyle - Active background treatment for the toggle.
+ * @returns Tailwind class string for the footer icon button.
  */
-function footerIconButton(active) {
+function footerIconButton(active, activeStyle) {
+    if (activeStyle === 'selection') {
+        return active
+            ? `${footerIconBase} bg-selection text-text`
+            : `${footerIconBase} bg-transparent text-text hover:bg-selection focus-visible:bg-selection focus-visible:text-text`;
+    }
     return active
-        ? 'inline-flex h-7 w-7 shrink-0 cursor-pointer items-center justify-center rounded-md border-none bg-surface text-text shadow-sm app-no-drag'
-        : 'inline-flex h-7 w-7 shrink-0 cursor-pointer items-center justify-center rounded-md border-none bg-transparent text-muted hover:bg-selection hover:text-text app-no-drag';
+        ? `${footerIconBase} bg-surface text-text shadow-sm`
+        : `${footerIconBase} bg-transparent text-muted hover:bg-selection hover:text-text`;
 }
 /**
  * Icon-only toggle button for the window footer bar, used to show or hide
  * sidebars and similar panels.
  */
-export function FooterIcon({ icon, active, onClick, label, title, className, ...props }) {
+export function FooterIcon({ icon, active, onClick, label, title, activeStyle = 'surface', className, ...props }) {
     const accessibleLabel = active ? `Hide ${label}` : `Show ${label}`;
-    return (_jsx("button", { ...props, type: "button", className: cn('hc-footer-icon', footerIconButton(active), className), onClick: onClick, "aria-pressed": active, "aria-label": accessibleLabel, title: title ?? accessibleLabel, children: _jsx(FaIcon, { icon: icon, className: "hc-footer-icon-icon h-4 w-4" }) }));
+    return (_jsx("button", { ...props, type: "button", className: cn('hc-footer-icon', footerIconButton(active, activeStyle), className), onClick: onClick, "aria-pressed": active, "aria-label": accessibleLabel, title: title ?? accessibleLabel, children: _jsx(FaIcon, { icon: icon, className: cn('hc-footer-icon-icon h-4 w-4', activeStyle === 'selection' && (active ? 'opacity-100' : 'opacity-50')) }) }));
 }

package/package.json

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