@shipfox/client-agent 21.0.0 → 22.0.0

package/.turbo/turbo-build.log

@@ -1,2 +1,2 @@
 $ shipfox-swc
-Successfully compiled: 37 files with swc (358.51ms)
+Successfully compiled: 38 files with swc (560.28ms)

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @shipfox/client-agent
 
+## 22.0.0
+
+### Patch Changes
+
+- 50b3867: Consolidate authentication, onboarding, integration-install, and callback surfaces onto the shared focused frame.
+- 7693eb3: Render empty and load-error states inside bordered panel bodies and keep loading placeholders aligned with their data regions.
+- 00c1cb8: Panels across these surfaces share one hover, focus, and elevation treatment. Grids of openable things, including the integration gallery, the available providers grid, and the harness picker, render as cells inside a single panel divided by hairlines instead of separate bordered tiles.
+- Updated dependencies [50b3867]
+- Updated dependencies [00c1cb8]
+- Updated dependencies [7693eb3]
+- Updated dependencies [00c1cb8]
+- Updated dependencies [56f4526]
+  - @shipfox/client-shell@22.0.0
+  - @shipfox/react-ui@2.1.0
+  - @shipfox/client-ui@22.0.0
+
 ## 21.0.0
 
 ### Patch Changes

package/dist/components/add-custom-provider-card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"add-custom-provider-card.d.ts","sourceRoot":"","sources":["../../src/components/add-custom-provider-card.tsx"],"names":[],"mappings":"AAOA,wBAAgB,qBAAqB,CAAC,EAAC,WAAW,EAAC,EAAE;IAAC,WAAW,EAAE,MAAM,IAAI,CAAA;CAAC,+BAwB7E"}
+{"version":3,"file":"add-custom-provider-card.d.ts","sourceRoot":"","sources":["../../src/components/add-custom-provider-card.tsx"],"names":[],"mappings":"AAGA,wBAAgB,qBAAqB,CAAC,EAAC,WAAW,EAAC,EAAE;IAAC,WAAW,EAAE,MAAM,IAAI,CAAA;CAAC,+BAc7E"}

package/dist/components/add-custom-provider-card.js

@@ -1,38 +1,18 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Icon } from '@shipfox/react-ui/icon';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { PanelCell, PanelCellAction } from '@shipfox/react-ui/panel';
 import { Text } from '@shipfox/react-ui/typography';
-import { cn } from '@shipfox/react-ui/utils';
-const SURFACE_CLASS = 'overflow-hidden rounded-8 border border-border-neutral-base bg-background-neutral-base';
 export function AddCustomProviderCard({ onConfigure }) {
-    return /*#__PURE__*/ _jsx("li", {
-        children: /*#__PURE__*/ _jsx("button", {
-            type: "button",
-            className: cn('group block h-full w-full cursor-pointer p-panel-compact text-left outline-none transition-colors hover:bg-background-components-hover focus-visible:shadow-button-neutral-focus', SURFACE_CLASS),
+    return /*#__PURE__*/ _jsx(PanelCell, {
+        children: /*#__PURE__*/ _jsx(PanelCellAction, {
+            action: "Configure",
             "aria-label": "Configure custom provider",
             onClick: onConfigure,
-            children: /*#__PURE__*/ _jsxs("div", {
-                className: "flex min-w-0 items-center justify-between gap-cluster",
-                children: [
-                    /*#__PURE__*/ _jsx(Text, {
-                        size: "md",
-                        bold: true,
-                        className: "min-w-0 truncate",
-                        children: "Custom"
-                    }),
-                    /*#__PURE__*/ _jsxs("div", {
-                        className: "flex shrink-0 items-center gap-tight text-foreground-neutral-muted transition-colors group-hover:text-foreground-highlight-interactive",
-                        children: [
-                            /*#__PURE__*/ _jsx(Text, {
-                                size: "sm",
-                                children: "Configure"
-                            }),
-                            /*#__PURE__*/ _jsx(Icon, {
-                                name: "chevronRight",
-                                className: "size-16"
-                            })
-                        ]
-                    })
-                ]
+            children: /*#__PURE__*/ _jsx(Text, {
+                as: "span",
+                size: "md",
+                bold: true,
+                className: "min-w-0 truncate",
+                children: "Custom"
             })
         })
     });

package/dist/components/add-custom-provider-card.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/add-custom-provider-card.tsx"],"sourcesContent":["import {Icon} from '@shipfox/react-ui/icon';\nimport {Text} from '@shipfox/react-ui/typography';\nimport {cn} from '@shipfox/react-ui/utils';\n\nconst SURFACE_CLASS =\n  'overflow-hidden rounded-8 border border-border-neutral-base bg-background-neutral-base';\n\nexport function AddCustomProviderCard({onConfigure}: {onConfigure: () => void}) {\n  return (\n    <li>\n      <button\n        type=\"button\"\n        className={cn(\n          'group block h-full w-full cursor-pointer p-panel-compact text-left outline-none transition-colors hover:bg-background-components-hover focus-visible:shadow-button-neutral-focus',\n          SURFACE_CLASS,\n        )}\n        aria-label=\"Configure custom provider\"\n        onClick={onConfigure}\n      >\n        <div className=\"flex min-w-0 items-center justify-between gap-cluster\">\n          <Text size=\"md\" bold className=\"min-w-0 truncate\">\n            Custom\n          </Text>\n          <div className=\"flex shrink-0 items-center gap-tight text-foreground-neutral-muted transition-colors group-hover:text-foreground-highlight-interactive\">\n            <Text size=\"sm\">Configure</Text>\n            <Icon name=\"chevronRight\" className=\"size-16\" />\n          </div>\n        </div>\n      </button>\n    </li>\n  );\n}\n"],"names":["Icon","Text","cn","SURFACE_CLASS","AddCustomProviderCard","onConfigure","li","button","type","className","aria-label","onClick","div","size","bold","name"],"mappings":";AAAA,SAAQA,IAAI,QAAO,yBAAyB;AAC5C,SAAQC,IAAI,QAAO,+BAA+B;AAClD,SAAQC,EAAE,QAAO,0BAA0B;AAE3C,MAAMC,gBACJ;AAEF,OAAO,SAASC,sBAAsB,EAACC,WAAW,EAA4B;IAC5E,qBACE,KAACC;kBACC,cAAA,KAACC;YACCC,MAAK;YACLC,WAAWP,GACT,oLACAC;YAEFO,cAAW;YACXC,SAASN;sBAET,cAAA,MAACO;gBAAIH,WAAU;;kCACb,KAACR;wBAAKY,MAAK;wBAAKC,IAAI;wBAACL,WAAU;kCAAmB;;kCAGlD,MAACG;wBAAIH,WAAU;;0CACb,KAACR;gCAAKY,MAAK;0CAAK;;0CAChB,KAACb;gCAAKe,MAAK;gCAAeN,WAAU;;;;;;;;AAMhD"}
+{"version":3,"sources":["../../src/components/add-custom-provider-card.tsx"],"sourcesContent":["import {PanelCell, PanelCellAction} from '@shipfox/react-ui/panel';\nimport {Text} from '@shipfox/react-ui/typography';\n\nexport function AddCustomProviderCard({onConfigure}: {onConfigure: () => void}) {\n  return (\n    <PanelCell>\n      <PanelCellAction\n        action=\"Configure\"\n        aria-label=\"Configure custom provider\"\n        onClick={onConfigure}\n      >\n        <Text as=\"span\" size=\"md\" bold className=\"min-w-0 truncate\">\n          Custom\n        </Text>\n      </PanelCellAction>\n    </PanelCell>\n  );\n}\n"],"names":["PanelCell","PanelCellAction","Text","AddCustomProviderCard","onConfigure","action","aria-label","onClick","as","size","bold","className"],"mappings":";AAAA,SAAQA,SAAS,EAAEC,eAAe,QAAO,0BAA0B;AACnE,SAAQC,IAAI,QAAO,+BAA+B;AAElD,OAAO,SAASC,sBAAsB,EAACC,WAAW,EAA4B;IAC5E,qBACE,KAACJ;kBACC,cAAA,KAACC;YACCI,QAAO;YACPC,cAAW;YACXC,SAASH;sBAET,cAAA,KAACF;gBAAKM,IAAG;gBAAOC,MAAK;gBAAKC,IAAI;gBAACC,WAAU;0BAAmB;;;;AAMpE"}

package/dist/components/available-provider-card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"available-provider-card.d.ts","sourceRoot":"","sources":["../../src/components/available-provider-card.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,iBAAiB,CAAC;AAKvD,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,WAAW,GACZ,EAAE;IACD,KAAK,EAAE,iBAAiB,CAAC;IACzB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,+BAwBA"}
+{"version":3,"file":"available-provider-card.d.ts","sourceRoot":"","sources":["../../src/components/available-provider-card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,iBAAiB,CAAC;AAEvD,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,WAAW,GACZ,EAAE;IACD,KAAK,EAAE,iBAAiB,CAAC;IACzB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,+BAcA"}

package/dist/components/available-provider-card.js

@@ -1,38 +1,18 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Icon } from '@shipfox/react-ui/icon';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { PanelCell, PanelCellAction } from '@shipfox/react-ui/panel';
 import { Text } from '@shipfox/react-ui/typography';
-import { cn } from '@shipfox/react-ui/utils';
-const SURFACE_CLASS = 'overflow-hidden rounded-8 border border-border-neutral-base bg-background-neutral-base';
 export function AvailableProviderCard({ entry, onConfigure }) {
-    return /*#__PURE__*/ _jsx("li", {
-        children: /*#__PURE__*/ _jsx("button", {
-            type: "button",
-            className: cn('group block w-full cursor-pointer p-panel-compact text-left outline-none transition-colors hover:bg-background-components-hover focus-visible:shadow-button-neutral-focus', SURFACE_CLASS),
+    return /*#__PURE__*/ _jsx(PanelCell, {
+        children: /*#__PURE__*/ _jsx(PanelCellAction, {
+            action: "Configure",
             "aria-label": `Configure ${entry.label}`,
             onClick: onConfigure,
-            children: /*#__PURE__*/ _jsxs("div", {
-                className: "flex min-w-0 items-center justify-between gap-cluster",
-                children: [
-                    /*#__PURE__*/ _jsx(Text, {
-                        size: "md",
-                        bold: true,
-                        className: "min-w-0 truncate",
-                        children: entry.label
-                    }),
-                    /*#__PURE__*/ _jsxs("div", {
-                        className: "flex shrink-0 items-center gap-tight text-foreground-neutral-muted transition-colors group-hover:text-foreground-highlight-interactive",
-                        children: [
-                            /*#__PURE__*/ _jsx(Text, {
-                                size: "sm",
-                                children: "Configure"
-                            }),
-                            /*#__PURE__*/ _jsx(Icon, {
-                                name: "chevronRight",
-                                className: "size-16"
-                            })
-                        ]
-                    })
-                ]
+            children: /*#__PURE__*/ _jsx(Text, {
+                as: "span",
+                size: "md",
+                bold: true,
+                className: "min-w-0 truncate",
+                children: entry.label
             })
         })
     });

package/dist/components/available-provider-card.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/available-provider-card.tsx"],"sourcesContent":["import {Icon} from '@shipfox/react-ui/icon';\nimport {Text} from '@shipfox/react-ui/typography';\nimport {cn} from '@shipfox/react-ui/utils';\nimport type {SupportedProvider} from '#core/models.js';\n\nconst SURFACE_CLASS =\n  'overflow-hidden rounded-8 border border-border-neutral-base bg-background-neutral-base';\n\nexport function AvailableProviderCard({\n  entry,\n  onConfigure,\n}: {\n  entry: SupportedProvider;\n  onConfigure: () => void;\n}) {\n  return (\n    <li>\n      <button\n        type=\"button\"\n        className={cn(\n          'group block w-full cursor-pointer p-panel-compact text-left outline-none transition-colors hover:bg-background-components-hover focus-visible:shadow-button-neutral-focus',\n          SURFACE_CLASS,\n        )}\n        aria-label={`Configure ${entry.label}`}\n        onClick={onConfigure}\n      >\n        <div className=\"flex min-w-0 items-center justify-between gap-cluster\">\n          <Text size=\"md\" bold className=\"min-w-0 truncate\">\n            {entry.label}\n          </Text>\n          <div className=\"flex shrink-0 items-center gap-tight text-foreground-neutral-muted transition-colors group-hover:text-foreground-highlight-interactive\">\n            <Text size=\"sm\">Configure</Text>\n            <Icon name=\"chevronRight\" className=\"size-16\" />\n          </div>\n        </div>\n      </button>\n    </li>\n  );\n}\n"],"names":["Icon","Text","cn","SURFACE_CLASS","AvailableProviderCard","entry","onConfigure","li","button","type","className","aria-label","label","onClick","div","size","bold","name"],"mappings":";AAAA,SAAQA,IAAI,QAAO,yBAAyB;AAC5C,SAAQC,IAAI,QAAO,+BAA+B;AAClD,SAAQC,EAAE,QAAO,0BAA0B;AAG3C,MAAMC,gBACJ;AAEF,OAAO,SAASC,sBAAsB,EACpCC,KAAK,EACLC,WAAW,EAIZ;IACC,qBACE,KAACC;kBACC,cAAA,KAACC;YACCC,MAAK;YACLC,WAAWR,GACT,6KACAC;YAEFQ,cAAY,CAAC,UAAU,EAAEN,MAAMO,KAAK,EAAE;YACtCC,SAASP;sBAET,cAAA,MAACQ;gBAAIJ,WAAU;;kCACb,KAACT;wBAAKc,MAAK;wBAAKC,IAAI;wBAACN,WAAU;kCAC5BL,MAAMO,KAAK;;kCAEd,MAACE;wBAAIJ,WAAU;;0CACb,KAACT;gCAAKc,MAAK;0CAAK;;0CAChB,KAACf;gCAAKiB,MAAK;gCAAeP,WAAU;;;;;;;;AAMhD"}
+{"version":3,"sources":["../../src/components/available-provider-card.tsx"],"sourcesContent":["import {PanelCell, PanelCellAction} from '@shipfox/react-ui/panel';\nimport {Text} from '@shipfox/react-ui/typography';\nimport type {SupportedProvider} from '#core/models.js';\n\nexport function AvailableProviderCard({\n  entry,\n  onConfigure,\n}: {\n  entry: SupportedProvider;\n  onConfigure: () => void;\n}) {\n  return (\n    <PanelCell>\n      <PanelCellAction\n        action=\"Configure\"\n        aria-label={`Configure ${entry.label}`}\n        onClick={onConfigure}\n      >\n        <Text as=\"span\" size=\"md\" bold className=\"min-w-0 truncate\">\n          {entry.label}\n        </Text>\n      </PanelCellAction>\n    </PanelCell>\n  );\n}\n"],"names":["PanelCell","PanelCellAction","Text","AvailableProviderCard","entry","onConfigure","action","aria-label","label","onClick","as","size","bold","className"],"mappings":";AAAA,SAAQA,SAAS,EAAEC,eAAe,QAAO,0BAA0B;AACnE,SAAQC,IAAI,QAAO,+BAA+B;AAGlD,OAAO,SAASC,sBAAsB,EACpCC,KAAK,EACLC,WAAW,EAIZ;IACC,qBACE,KAACL;kBACC,cAAA,KAACC;YACCK,QAAO;YACPC,cAAY,CAAC,UAAU,EAAEH,MAAMI,KAAK,EAAE;YACtCC,SAASJ;sBAET,cAAA,KAACH;gBAAKQ,IAAG;gBAAOC,MAAK;gBAAKC,IAAI;gBAACC,WAAU;0BACtCT,MAAMI,KAAK;;;;AAKtB"}

package/dist/components/available-providers-grid.d.ts

@@ -1,6 +1,5 @@
 import type { ReactNode } from 'react';
 import type { SupportedProvider } from '#core/models.js';
-export declare const PROVIDER_GRID_CLASS = "grid grid-cols-2 gap-cluster max-[760px]:grid-cols-1";
 export declare function AvailableProvidersGrid<TEntry extends SupportedProvider>({ entries, onSelect, trailingCard, trailingCardMatchesSearch, }: {
     entries: TEntry[];
     onSelect: (entry: TEntry) => void;

package/dist/components/available-providers-grid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"available-providers-grid.d.ts","sourceRoot":"","sources":["../../src/components/available-providers-grid.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAErC,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,iBAAiB,CAAC;AAIvD,eAAO,MAAM,mBAAmB,yDAAyD,CAAC;AAK1F,wBAAgB,sBAAsB,CAAC,MAAM,SAAS,iBAAiB,EAAE,EACvE,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,yBAAsC,GACvC,EAAE;IACD,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,YAAY,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IACrC,yBAAyB,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,SAAS,CAAC;CACtE,+BAuDA"}
+{"version":3,"file":"available-providers-grid.d.ts","sourceRoot":"","sources":["../../src/components/available-providers-grid.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAErC,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,iBAAiB,CAAC;AAOvD,wBAAgB,sBAAsB,CAAC,MAAM,SAAS,iBAAiB,EAAE,EACvE,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,yBAAsC,GACvC,EAAE;IACD,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,YAAY,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IACrC,yBAAyB,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,SAAS,CAAC;CACtE,+BA+DA"}

package/dist/components/available-providers-grid.js

@@ -1,12 +1,12 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Button } from '@shipfox/react-ui/button';
 import { EmptyState } from '@shipfox/react-ui/empty-state';
 import { Icon } from '@shipfox/react-ui/icon';
 import { Input } from '@shipfox/react-ui/input';
+import { Panel, PanelBody, PanelGrid, PanelHeader } from '@shipfox/react-ui/panel';
 import { useMemo, useRef, useState } from 'react';
 import { providerMatchesSearch } from '#core/provider-policy.js';
 import { AvailableProviderCard } from './available-provider-card.js';
-export const PROVIDER_GRID_CLASS = 'grid grid-cols-2 gap-cluster max-[760px]:grid-cols-1';
 const SEARCH_VISIBILITY_THRESHOLD = 8;
 const MAX_ECHOED_QUERY_LENGTH = 40;
 export function AvailableProvidersGrid({ entries, onSelect, trailingCard, trailingCardMatchesSearch = ()=>true }) {
@@ -26,34 +26,40 @@ export function AvailableProvidersGrid({ entries, onSelect, trailingCard, traili
         setSearch('');
         inputRef.current?.focus();
     }
-    return /*#__PURE__*/ _jsxs("div", {
-        className: "flex flex-col gap-cluster",
+    return /*#__PURE__*/ _jsxs(_Fragment, {
         children: [
-            showSearch ? /*#__PURE__*/ _jsx(Input, {
-                ref: inputRef,
-                type: "search",
-                "aria-label": "Search providers",
-                placeholder: "Search providers...",
-                value: search,
-                iconLeft: /*#__PURE__*/ _jsx(Icon, {
-                    name: "searchLine",
-                    className: "size-16 text-foreground-neutral-muted"
-                }),
-                onChange: (event)=>setSearch(event.target.value)
-            }) : null,
-            visibleCount > 0 ? /*#__PURE__*/ _jsxs("ul", {
-                className: PROVIDER_GRID_CLASS,
-                "aria-label": providerListLabel,
+            /*#__PURE__*/ _jsxs(Panel, {
                 children: [
-                    filteredEntries.map((entry)=>/*#__PURE__*/ _jsx(AvailableProviderCard, {
-                            entry: entry,
-                            onConfigure: ()=>onSelect(entry)
-                        }, entry.id)),
-                    trailingCardVisible ? trailingCard : null
+                    showSearch ? /*#__PURE__*/ _jsx(PanelHeader, {
+                        children: /*#__PURE__*/ _jsx(Input, {
+                            ref: inputRef,
+                            type: "search",
+                            "aria-label": "Search providers",
+                            placeholder: "Search providers...",
+                            value: search,
+                            iconLeft: /*#__PURE__*/ _jsx(Icon, {
+                                name: "searchLine",
+                                className: "size-16 text-foreground-neutral-muted"
+                            }),
+                            onChange: (event)=>setSearch(event.target.value)
+                        })
+                    }) : null,
+                    /*#__PURE__*/ _jsx(PanelBody, {
+                        children: visibleCount > 0 ? /*#__PURE__*/ _jsxs(PanelGrid, {
+                            "aria-label": providerListLabel,
+                            children: [
+                                filteredEntries.map((entry)=>/*#__PURE__*/ _jsx(AvailableProviderCard, {
+                                        entry: entry,
+                                        onConfigure: ()=>onSelect(entry)
+                                    }, entry.id)),
+                                trailingCardVisible ? trailingCard : null
+                            ]
+                        }) : /*#__PURE__*/ _jsx(NoProviderSearchResults, {
+                            search: trimmedSearch,
+                            onClear: clearSearch
+                        })
+                    })
                 ]
-            }) : /*#__PURE__*/ _jsx(NoProviderSearchResults, {
-                search: trimmedSearch,
-                onClear: clearSearch
             }),
             /*#__PURE__*/ _jsx("p", {
                 role: "status",

package/dist/components/available-providers-grid.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/available-providers-grid.tsx"],"sourcesContent":["import {Button} from '@shipfox/react-ui/button';\nimport {EmptyState} from '@shipfox/react-ui/empty-state';\nimport {Icon} from '@shipfox/react-ui/icon';\nimport {Input} from '@shipfox/react-ui/input';\nimport type {ReactNode} from 'react';\nimport {useMemo, useRef, useState} from 'react';\nimport type {SupportedProvider} from '#core/models.js';\nimport {providerMatchesSearch} from '#core/provider-policy.js';\nimport {AvailableProviderCard} from './available-provider-card.js';\n\nexport const PROVIDER_GRID_CLASS = 'grid grid-cols-2 gap-cluster max-[760px]:grid-cols-1';\n\nconst SEARCH_VISIBILITY_THRESHOLD = 8;\nconst MAX_ECHOED_QUERY_LENGTH = 40;\n\nexport function AvailableProvidersGrid<TEntry extends SupportedProvider>({\n  entries,\n  onSelect,\n  trailingCard,\n  trailingCardMatchesSearch = () => true,\n}: {\n  entries: TEntry[];\n  onSelect: (entry: TEntry) => void;\n  trailingCard?: ReactNode | undefined;\n  trailingCardMatchesSearch?: ((query: string) => boolean) | undefined;\n}) {\n  const [search, setSearch] = useState('');\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const trimmedSearch = search.trim();\n  const filteredEntries = useMemo(\n    () => entries.filter((entry) => providerMatchesSearch(entry, search)),\n    [entries, search],\n  );\n  const trailingCardVisible = trailingCard !== undefined && trailingCardMatchesSearch(search);\n  const visibleCount = filteredEntries.length + (trailingCardVisible ? 1 : 0);\n  const showSearch = entries.length > SEARCH_VISIBILITY_THRESHOLD || trimmedSearch !== '';\n  const providerListLabel =\n    trimmedSearch !== '' ? 'Available providers matching search' : 'Available providers';\n  const resultCountText =\n    trimmedSearch === '' ? '' : providerResultCountText(filteredEntries.length, trimmedSearch);\n\n  function clearSearch() {\n    setSearch('');\n    inputRef.current?.focus();\n  }\n\n  return (\n    <div className=\"flex flex-col gap-cluster\">\n      {showSearch ? (\n        <Input\n          ref={inputRef}\n          type=\"search\"\n          aria-label=\"Search providers\"\n          placeholder=\"Search providers...\"\n          value={search}\n          iconLeft={<Icon name=\"searchLine\" className=\"size-16 text-foreground-neutral-muted\" />}\n          onChange={(event) => setSearch(event.target.value)}\n        />\n      ) : null}\n\n      {visibleCount > 0 ? (\n        <ul className={PROVIDER_GRID_CLASS} aria-label={providerListLabel}>\n          {filteredEntries.map((entry) => (\n            <AvailableProviderCard\n              key={entry.id}\n              entry={entry}\n              onConfigure={() => onSelect(entry)}\n            />\n          ))}\n          {trailingCardVisible ? trailingCard : null}\n        </ul>\n      ) : (\n        <NoProviderSearchResults search={trimmedSearch} onClear={clearSearch} />\n      )}\n\n      <p role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n        {resultCountText}\n      </p>\n    </div>\n  );\n}\n\nfunction NoProviderSearchResults({search, onClear}: {search: string; onClear: () => void}) {\n  return (\n    <EmptyState\n      icon=\"searchLine\"\n      title={`No providers match \"${truncateQuery(search)}\"`}\n      description=\"Try a different search, or clear it to see all providers.\"\n      action={\n        <Button size=\"sm\" variant=\"secondary\" onClick={onClear}>\n          Clear search\n        </Button>\n      }\n    />\n  );\n}\n\nfunction truncateQuery(query: string): string {\n  if (query.length <= MAX_ECHOED_QUERY_LENGTH) return query;\n  return `${query.slice(0, MAX_ECHOED_QUERY_LENGTH - 3)}...`;\n}\n\nfunction providerResultCountText(count: number, query: string): string {\n  if (count === 1) return `1 provider matches \"${query}\"`;\n  return `${count} providers match \"${query}\"`;\n}\n"],"names":["Button","EmptyState","Icon","Input","useMemo","useRef","useState","providerMatchesSearch","AvailableProviderCard","PROVIDER_GRID_CLASS","SEARCH_VISIBILITY_THRESHOLD","MAX_ECHOED_QUERY_LENGTH","AvailableProvidersGrid","entries","onSelect","trailingCard","trailingCardMatchesSearch","search","setSearch","inputRef","trimmedSearch","trim","filteredEntries","filter","entry","trailingCardVisible","undefined","visibleCount","length","showSearch","providerListLabel","resultCountText","providerResultCountText","clearSearch","current","focus","div","className","ref","type","aria-label","placeholder","value","iconLeft","name","onChange","event","target","ul","map","onConfigure","id","NoProviderSearchResults","onClear","p","role","aria-live","icon","title","truncateQuery","description","action","size","variant","onClick","query","slice","count"],"mappings":";AAAA,SAAQA,MAAM,QAAO,2BAA2B;AAChD,SAAQC,UAAU,QAAO,gCAAgC;AACzD,SAAQC,IAAI,QAAO,yBAAyB;AAC5C,SAAQC,KAAK,QAAO,0BAA0B;AAE9C,SAAQC,OAAO,EAAEC,MAAM,EAAEC,QAAQ,QAAO,QAAQ;AAEhD,SAAQC,qBAAqB,QAAO,2BAA2B;AAC/D,SAAQC,qBAAqB,QAAO,+BAA+B;AAEnE,OAAO,MAAMC,sBAAsB,uDAAuD;AAE1F,MAAMC,8BAA8B;AACpC,MAAMC,0BAA0B;AAEhC,OAAO,SAASC,uBAAyD,EACvEC,OAAO,EACPC,QAAQ,EACRC,YAAY,EACZC,4BAA4B,IAAM,IAAI,EAMvC;IACC,MAAM,CAACC,QAAQC,UAAU,GAAGZ,SAAS;IACrC,MAAMa,WAAWd,OAAgC;IACjD,MAAMe,gBAAgBH,OAAOI,IAAI;IACjC,MAAMC,kBAAkBlB,QACtB,IAAMS,QAAQU,MAAM,CAAC,CAACC,QAAUjB,sBAAsBiB,OAAOP,UAC7D;QAACJ;QAASI;KAAO;IAEnB,MAAMQ,sBAAsBV,iBAAiBW,aAAaV,0BAA0BC;IACpF,MAAMU,eAAeL,gBAAgBM,MAAM,GAAIH,CAAAA,sBAAsB,IAAI,CAAA;IACzE,MAAMI,aAAahB,QAAQe,MAAM,GAAGlB,+BAA+BU,kBAAkB;IACrF,MAAMU,oBACJV,kBAAkB,KAAK,wCAAwC;IACjE,MAAMW,kBACJX,kBAAkB,KAAK,KAAKY,wBAAwBV,gBAAgBM,MAAM,EAAER;IAE9E,SAASa;QACPf,UAAU;QACVC,SAASe,OAAO,EAAEC;IACpB;IAEA,qBACE,MAACC;QAAIC,WAAU;;YACZR,2BACC,KAAC1B;gBACCmC,KAAKnB;gBACLoB,MAAK;gBACLC,cAAW;gBACXC,aAAY;gBACZC,OAAOzB;gBACP0B,wBAAU,KAACzC;oBAAK0C,MAAK;oBAAaP,WAAU;;gBAC5CQ,UAAU,CAACC,QAAU5B,UAAU4B,MAAMC,MAAM,CAACL,KAAK;iBAEjD;YAEHf,eAAe,kBACd,MAACqB;gBAAGX,WAAW5B;gBAAqB+B,cAAYV;;oBAC7CR,gBAAgB2B,GAAG,CAAC,CAACzB,sBACpB,KAAChB;4BAECgB,OAAOA;4BACP0B,aAAa,IAAMpC,SAASU;2BAFvBA,MAAM2B,EAAE;oBAKhB1B,sBAAsBV,eAAe;;+BAGxC,KAACqC;gBAAwBnC,QAAQG;gBAAeiC,SAASpB;;0BAG3D,KAACqB;gBAAEC,MAAK;gBAASC,aAAU;gBAASnB,WAAU;0BAC3CN;;;;AAIT;AAEA,SAASqB,wBAAwB,EAACnC,MAAM,EAAEoC,OAAO,EAAwC;IACvF,qBACE,KAACpD;QACCwD,MAAK;QACLC,OAAO,CAAC,oBAAoB,EAAEC,cAAc1C,QAAQ,CAAC,CAAC;QACtD2C,aAAY;QACZC,sBACE,KAAC7D;YAAO8D,MAAK;YAAKC,SAAQ;YAAYC,SAASX;sBAAS;;;AAMhE;AAEA,SAASM,cAAcM,KAAa;IAClC,IAAIA,MAAMrC,MAAM,IAAIjB,yBAAyB,OAAOsD;IACpD,OAAO,GAAGA,MAAMC,KAAK,CAAC,GAAGvD,0BAA0B,GAAG,GAAG,CAAC;AAC5D;AAEA,SAASqB,wBAAwBmC,KAAa,EAAEF,KAAa;IAC3D,IAAIE,UAAU,GAAG,OAAO,CAAC,oBAAoB,EAAEF,MAAM,CAAC,CAAC;IACvD,OAAO,GAAGE,MAAM,kBAAkB,EAAEF,MAAM,CAAC,CAAC;AAC9C"}
+{"version":3,"sources":["../../src/components/available-providers-grid.tsx"],"sourcesContent":["import {Button} from '@shipfox/react-ui/button';\nimport {EmptyState} from '@shipfox/react-ui/empty-state';\nimport {Icon} from '@shipfox/react-ui/icon';\nimport {Input} from '@shipfox/react-ui/input';\nimport {Panel, PanelBody, PanelGrid, PanelHeader} from '@shipfox/react-ui/panel';\nimport type {ReactNode} from 'react';\nimport {useMemo, useRef, useState} from 'react';\nimport type {SupportedProvider} from '#core/models.js';\nimport {providerMatchesSearch} from '#core/provider-policy.js';\nimport {AvailableProviderCard} from './available-provider-card.js';\n\nconst SEARCH_VISIBILITY_THRESHOLD = 8;\nconst MAX_ECHOED_QUERY_LENGTH = 40;\n\nexport function AvailableProvidersGrid<TEntry extends SupportedProvider>({\n  entries,\n  onSelect,\n  trailingCard,\n  trailingCardMatchesSearch = () => true,\n}: {\n  entries: TEntry[];\n  onSelect: (entry: TEntry) => void;\n  trailingCard?: ReactNode | undefined;\n  trailingCardMatchesSearch?: ((query: string) => boolean) | undefined;\n}) {\n  const [search, setSearch] = useState('');\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const trimmedSearch = search.trim();\n  const filteredEntries = useMemo(\n    () => entries.filter((entry) => providerMatchesSearch(entry, search)),\n    [entries, search],\n  );\n  const trailingCardVisible = trailingCard !== undefined && trailingCardMatchesSearch(search);\n  const visibleCount = filteredEntries.length + (trailingCardVisible ? 1 : 0);\n  const showSearch = entries.length > SEARCH_VISIBILITY_THRESHOLD || trimmedSearch !== '';\n  const providerListLabel =\n    trimmedSearch !== '' ? 'Available providers matching search' : 'Available providers';\n  const resultCountText =\n    trimmedSearch === '' ? '' : providerResultCountText(filteredEntries.length, trimmedSearch);\n\n  function clearSearch() {\n    setSearch('');\n    inputRef.current?.focus();\n  }\n\n  return (\n    <>\n      <Panel>\n        {showSearch ? (\n          <PanelHeader>\n            <Input\n              ref={inputRef}\n              type=\"search\"\n              aria-label=\"Search providers\"\n              placeholder=\"Search providers...\"\n              value={search}\n              iconLeft={\n                <Icon name=\"searchLine\" className=\"size-16 text-foreground-neutral-muted\" />\n              }\n              onChange={(event) => setSearch(event.target.value)}\n            />\n          </PanelHeader>\n        ) : null}\n\n        <PanelBody>\n          {visibleCount > 0 ? (\n            <PanelGrid aria-label={providerListLabel}>\n              {filteredEntries.map((entry) => (\n                <AvailableProviderCard\n                  key={entry.id}\n                  entry={entry}\n                  onConfigure={() => onSelect(entry)}\n                />\n              ))}\n              {trailingCardVisible ? trailingCard : null}\n            </PanelGrid>\n          ) : (\n            <NoProviderSearchResults search={trimmedSearch} onClear={clearSearch} />\n          )}\n        </PanelBody>\n      </Panel>\n\n      <p role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n        {resultCountText}\n      </p>\n    </>\n  );\n}\n\nfunction NoProviderSearchResults({search, onClear}: {search: string; onClear: () => void}) {\n  return (\n    <EmptyState\n      icon=\"searchLine\"\n      title={`No providers match \"${truncateQuery(search)}\"`}\n      description=\"Try a different search, or clear it to see all providers.\"\n      action={\n        <Button size=\"sm\" variant=\"secondary\" onClick={onClear}>\n          Clear search\n        </Button>\n      }\n    />\n  );\n}\n\nfunction truncateQuery(query: string): string {\n  if (query.length <= MAX_ECHOED_QUERY_LENGTH) return query;\n  return `${query.slice(0, MAX_ECHOED_QUERY_LENGTH - 3)}...`;\n}\n\nfunction providerResultCountText(count: number, query: string): string {\n  if (count === 1) return `1 provider matches \"${query}\"`;\n  return `${count} providers match \"${query}\"`;\n}\n"],"names":["Button","EmptyState","Icon","Input","Panel","PanelBody","PanelGrid","PanelHeader","useMemo","useRef","useState","providerMatchesSearch","AvailableProviderCard","SEARCH_VISIBILITY_THRESHOLD","MAX_ECHOED_QUERY_LENGTH","AvailableProvidersGrid","entries","onSelect","trailingCard","trailingCardMatchesSearch","search","setSearch","inputRef","trimmedSearch","trim","filteredEntries","filter","entry","trailingCardVisible","undefined","visibleCount","length","showSearch","providerListLabel","resultCountText","providerResultCountText","clearSearch","current","focus","ref","type","aria-label","placeholder","value","iconLeft","name","className","onChange","event","target","map","onConfigure","id","NoProviderSearchResults","onClear","p","role","aria-live","icon","title","truncateQuery","description","action","size","variant","onClick","query","slice","count"],"mappings":";AAAA,SAAQA,MAAM,QAAO,2BAA2B;AAChD,SAAQC,UAAU,QAAO,gCAAgC;AACzD,SAAQC,IAAI,QAAO,yBAAyB;AAC5C,SAAQC,KAAK,QAAO,0BAA0B;AAC9C,SAAQC,KAAK,EAAEC,SAAS,EAAEC,SAAS,EAAEC,WAAW,QAAO,0BAA0B;AAEjF,SAAQC,OAAO,EAAEC,MAAM,EAAEC,QAAQ,QAAO,QAAQ;AAEhD,SAAQC,qBAAqB,QAAO,2BAA2B;AAC/D,SAAQC,qBAAqB,QAAO,+BAA+B;AAEnE,MAAMC,8BAA8B;AACpC,MAAMC,0BAA0B;AAEhC,OAAO,SAASC,uBAAyD,EACvEC,OAAO,EACPC,QAAQ,EACRC,YAAY,EACZC,4BAA4B,IAAM,IAAI,EAMvC;IACC,MAAM,CAACC,QAAQC,UAAU,GAAGX,SAAS;IACrC,MAAMY,WAAWb,OAAgC;IACjD,MAAMc,gBAAgBH,OAAOI,IAAI;IACjC,MAAMC,kBAAkBjB,QACtB,IAAMQ,QAAQU,MAAM,CAAC,CAACC,QAAUhB,sBAAsBgB,OAAOP,UAC7D;QAACJ;QAASI;KAAO;IAEnB,MAAMQ,sBAAsBV,iBAAiBW,aAAaV,0BAA0BC;IACpF,MAAMU,eAAeL,gBAAgBM,MAAM,GAAIH,CAAAA,sBAAsB,IAAI,CAAA;IACzE,MAAMI,aAAahB,QAAQe,MAAM,GAAGlB,+BAA+BU,kBAAkB;IACrF,MAAMU,oBACJV,kBAAkB,KAAK,wCAAwC;IACjE,MAAMW,kBACJX,kBAAkB,KAAK,KAAKY,wBAAwBV,gBAAgBM,MAAM,EAAER;IAE9E,SAASa;QACPf,UAAU;QACVC,SAASe,OAAO,EAAEC;IACpB;IAEA,qBACE;;0BACE,MAAClC;;oBACE4B,2BACC,KAACzB;kCACC,cAAA,KAACJ;4BACCoC,KAAKjB;4BACLkB,MAAK;4BACLC,cAAW;4BACXC,aAAY;4BACZC,OAAOvB;4BACPwB,wBACE,KAAC1C;gCAAK2C,MAAK;gCAAaC,WAAU;;4BAEpCC,UAAU,CAACC,QAAU3B,UAAU2B,MAAMC,MAAM,CAACN,KAAK;;yBAGnD;kCAEJ,KAACtC;kCACEyB,eAAe,kBACd,MAACxB;4BAAUmC,cAAYR;;gCACpBR,gBAAgByB,GAAG,CAAC,CAACvB,sBACpB,KAACf;wCAECe,OAAOA;wCACPwB,aAAa,IAAMlC,SAASU;uCAFvBA,MAAMyB,EAAE;gCAKhBxB,sBAAsBV,eAAe;;2CAGxC,KAACmC;4BAAwBjC,QAAQG;4BAAe+B,SAASlB;;;;;0BAK/D,KAACmB;gBAAEC,MAAK;gBAASC,aAAU;gBAASX,WAAU;0BAC3CZ;;;;AAIT;AAEA,SAASmB,wBAAwB,EAACjC,MAAM,EAAEkC,OAAO,EAAwC;IACvF,qBACE,KAACrD;QACCyD,MAAK;QACLC,OAAO,CAAC,oBAAoB,EAAEC,cAAcxC,QAAQ,CAAC,CAAC;QACtDyC,aAAY;QACZC,sBACE,KAAC9D;YAAO+D,MAAK;YAAKC,SAAQ;YAAYC,SAASX;sBAAS;;;AAMhE;AAEA,SAASM,cAAcM,KAAa;IAClC,IAAIA,MAAMnC,MAAM,IAAIjB,yBAAyB,OAAOoD;IACpD,OAAO,GAAGA,MAAMC,KAAK,CAAC,GAAGrD,0BAA0B,GAAG,GAAG,CAAC;AAC5D;AAEA,SAASqB,wBAAwBiC,KAAa,EAAEF,KAAa;IAC3D,IAAIE,UAAU,GAAG,OAAO,CAAC,oBAAoB,EAAEF,MAAM,CAAC,CAAC;IACvD,OAAO,GAAGE,MAAM,kBAAkB,EAAEF,MAAM,CAAC,CAAC;AAC9C"}

package/dist/components/harnesses-section.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"harnesses-section.d.ts","sourceRoot":"","sources":["../../src/components/harnesses-section.tsx"],"names":[],"mappings":"AA4BA,wBAAgB,yBAAyB,CAAC,EAAC,WAAW,EAAC,EAAE;IAAC,WAAW,EAAE,MAAM,CAAA;CAAC,+BA+F7E"}
+{"version":3,"file":"harnesses-section.d.ts","sourceRoot":"","sources":["../../src/components/harnesses-section.tsx"],"names":[],"mappings":"AAyBA,wBAAgB,yBAAyB,CAAC,EAAC,WAAW,EAAC,EAAE;IAAC,WAAW,EAAE,MAAM,CAAA;CAAC,+BAoG7E"}