@flamingo-stack/openframe-frontend-core 0.0.765 → 0.0.766

package/dist/components/onboarding-guides/onboarding-guides-catalog-view.js

@@ -5,12 +5,24 @@ import { useMemo, useTransition } from "react";
 import { useChatRuntime } from "../../contexts/chat-runtime-context.js";
 import { useRouter, useSearchParams } from "../../embed-shims/index.js";
 import { useSelfFetch } from "../../hooks/use-self-fetch.js";
+import { cn } from "../../utils/cn.js";
 import { resolveContentHref } from "../../utils/content-href.js";
 import { OnboardingGuideCard } from "../chat/entity-cards/onboarding-guide-card.js";
+import { LoadingRegion } from "../loading/loading-region.js";
 import { DocSearchBar, useDocSearch } from "../shared/doc-search/index.js";
 import { LoadError } from "../ui/error-state.js";
 import { FilterPillRow } from "../ui/filter-pill-row.js";
-import { OnboardingGuidesCatalogSkeleton } from "./onboarding-guides-catalog-skeleton.js";
+import { LoadingScope, useLoadingScope } from "../ui/loading-scope.js";
+import {
+  CATALOG_CONTROLS_CLASS,
+  CATALOG_LIST_CLASS,
+  CATALOG_SECTION_CLASS,
+  CATALOG_SECTION_COUNT_CLASS,
+  CATALOG_SECTION_HEADING_CLASS,
+  CATALOG_SECTIONS_CLASS,
+  CATALOG_VIEW_CLASS,
+  OnboardingCatalogSectionsSkeleton
+} from "./onboarding-guides-catalog-skeleton.js";
 function OnboardingGuidesCatalogView({
   initialGuides,
   initialSections,
@@ -24,7 +36,8 @@ function OnboardingGuidesCatalogView({
   const searchParams = useSearchParams();
   const [isPending, startTransition] = useTransition();
   const runtime = useChatRuntime();
-  const selfFetch = initialGuides === void 0 && guidesEndpoint !== void 0;
+  const scoped = useLoadingScope();
+  const selfFetch = !scoped && initialGuides === void 0 && guidesEndpoint !== void 0;
   const sectionValue = selfFetch ? searchParams.get("section") ?? "" : initialSection;
   const activeSection = sectionValue || "all";
   const guidesQs = sectionValue ? `?section=${encodeURIComponent(sectionValue)}` : "";
@@ -38,6 +51,7 @@ function OnboardingGuidesCatalogView({
     [initialSections, sectionsRes.data]
   );
   const isLoading = selfFetch ? guidesRes.isLoading : false;
+  const loading = scoped || selfFetch && guidesRes.data == null && isLoading;
   const grouped = useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     for (const g of guides) {
@@ -90,7 +104,7 @@ function OnboardingGuidesCatalogView({
     return /* @__PURE__ */ jsx(OnboardingGuideCard, { guide, href: cta.href, targetPlatform: cta.targetPlatform, size: "catalog" });
   };
   const renderCardFn = renderCard ?? defaultRenderCard;
-  const preControls = /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+  const preControls = /* @__PURE__ */ jsxs("div", { className: CATALOG_CONTROLS_CLASS, children: [
     /* @__PURE__ */ jsx(
       DocSearchBar,
       {
@@ -103,36 +117,61 @@ function OnboardingGuidesCatalogView({
         showDropdown: docSearch.keepDropdownOpen
       }
     ),
-    sections.length > 0 && /* @__PURE__ */ jsx(
+    (loading || sections.length > 0) && /* @__PURE__ */ jsx(
       FilterPillRow,
       {
         label: "Section",
         selectedValue: activeSection,
         onValueChange: setSection,
-        options: sectionFilterOptions
+        options: loading ? [] : sectionFilterOptions,
+        loading
       }
     )
   ] });
-  if (selfFetch && guidesRes.error) {
+  if (!loading && selfFetch && guidesRes.error) {
     return /* @__PURE__ */ jsx(LoadError, { message: "Failed to load onboarding guides.", onRetry: guidesRes.reload });
   }
-  if (selfFetch && guidesRes.data == null && isLoading) {
-    return /* @__PURE__ */ jsx(OnboardingGuidesCatalogSkeleton, {});
-  }
-  return /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-10", children: [
+  const view = /* @__PURE__ */ jsxs("div", { className: CATALOG_VIEW_CLASS, children: [
     preControls,
-    guides.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "py-16 text-center", children: [
+    /* @__PURE__ */ jsx(
+      OnboardingCatalogSections,
+      {
+        grouped,
+        loading,
+        dimmed: isPending || isLoading,
+        allSections: activeSection === "all",
+        renderCard: renderCardFn
+      }
+    )
+  ] });
+  if (!loading) return view;
+  return /* @__PURE__ */ jsx(LoadingRegion, { label: "Loading onboarding guides", announce: !scoped, children: /* @__PURE__ */ jsx(LoadingScope, { children: view }) });
+}
+function OnboardingCatalogSections({
+  grouped,
+  loading,
+  dimmed,
+  allSections,
+  renderCard
+}) {
+  if (useLoadingScope() || loading) return /* @__PURE__ */ jsx(OnboardingCatalogSectionsSkeleton, {});
+  if (grouped.length === 0) {
+    return /* @__PURE__ */ jsxs("div", { className: "py-16 text-center", children: [
       /* @__PURE__ */ jsx(GraduationCap, { className: "mx-auto mb-4 h-12 w-12 text-ods-text-secondary" }),
       /* @__PURE__ */ jsx("h2", { className: "mb-2 text-ods-text-primary text-h3", children: "No onboarding guides found" }),
-      /* @__PURE__ */ jsx("p", { className: "text-ods-text-secondary text-h6", children: activeSection !== "all" ? "No guides in this section yet." : "We're working on the onboarding library. Check back soon." })
-    ] }) : /* @__PURE__ */ jsx("div", { className: isPending || isLoading ? "space-y-10 opacity-60 transition-opacity" : "space-y-10", children: grouped.map((sec) => /* @__PURE__ */ jsxs("section", { className: "space-y-4", children: [
-      /* @__PURE__ */ jsxs("h2", { className: "flex items-center gap-2 text-ods-text-primary text-h3", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-ods-text-secondary text-h6", children: allSections ? "We're working on the onboarding library. Check back soon." : "No guides in this section yet." })
+    ] });
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn(CATALOG_SECTIONS_CLASS, dimmed && "opacity-60 transition-opacity"), children: grouped.map((sec) => (
+    // A section is the data's group: how many there are is the record's (`data-loading-item`).
+    /* @__PURE__ */ jsxs("section", { className: CATALOG_SECTION_CLASS, "data-loading-item": true, children: [
+      /* @__PURE__ */ jsxs("h2", { className: CATALOG_SECTION_HEADING_CLASS, children: [
         sec.section,
-        /* @__PURE__ */ jsx("span", { className: "inline-flex items-center justify-center rounded-full bg-ods-text-secondary/20 px-2 py-0.5 text-ods-text-secondary text-h6", children: sec.guides.length })
+        /* @__PURE__ */ jsx("span", { className: CATALOG_SECTION_COUNT_CLASS, children: sec.guides.length })
       ] }),
-      /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-4", children: sec.guides.map((guide) => /* @__PURE__ */ jsx("li", { children: renderCardFn(guide) }, guide.id)) })
-    ] }, sec.section)) })
-  ] });
+      /* @__PURE__ */ jsx("ul", { className: CATALOG_LIST_CLASS, children: sec.guides.map((guide) => /* @__PURE__ */ jsx("li", { children: renderCard(guide) }, guide.id)) })
+    ] }, sec.section)
+  )) });
 }
 export {
   OnboardingGuidesCatalogView

package/dist/components/pagination.d.ts

@@ -12,13 +12,37 @@ interface PaginationProps {
      * are buttons.
      */
     getPageHref?: (page: number) => string;
+    /**
+     * The list is still being read: the pager draws its own skeleton, for `totalPages` on `currentPage` when the count
+     * is known (more than one page), else for a list of many pages. Also drawn in a page's loading scope.
+     */
+    loading?: boolean;
 }
-declare const Pagination: ({ currentPage, totalPages, onPageChange, className, getPageHref }: PaginationProps) => import("react").JSX.Element;
+/**
+ * The controls the pager draws between previous and next: page numbers, and `-1` / `-2` for an ellipsis. Read by
+ * the pager and by its skeleton, so the skeleton draws the same controls.
+ */
+export declare function paginationSlots(currentPage: number, totalPages: number): number[];
+/**
+ * The page count the skeleton draws the pager for when the count is read with the list: a list of many pages, on
+ * its first page (prev, pages 1-4, the ellipsis, the last page, next), the pager's widest first-page shape.
+ */
+export declare const PAGINATION_SKELETON_TOTAL_PAGES = 10;
+declare const Pagination: ({ currentPage, totalPages, onPageChange, className, getPageHref, loading }: PaginationProps) => import("react").JSX.Element;
+/**
+ * The pager while its list is read: the same row and the controls the pager draws for `totalPages` on
+ * `currentPage` (`paginationSlots`), each page control a box of its size and the ellipsis as it is.
+ */
+declare function PaginationSkeleton({ totalPages, currentPage, className, }: {
+    totalPages?: number;
+    currentPage?: number;
+    className?: string;
+}): import("react").JSX.Element;
 declare const PaginationContent: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLUListElement> & import("react").RefAttributes<HTMLUListElement>>;
 declare const PaginationItem: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLLIElement> & import("react").RefAttributes<HTMLLIElement>>;
 declare const PaginationLink: import("react").ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement>>;
 declare const PaginationEllipsis: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLSpanElement> & import("react").RefAttributes<HTMLSpanElement>>;
 declare const PaginationPrevious: import("react").ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement>>;
 declare const PaginationNext: import("react").ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement>>;
-export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, };
+export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PaginationSkeleton, };
 //# sourceMappingURL=pagination.d.ts.map

package/dist/components/pagination.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../src/components/pagination.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,oBAAoB,EAAE,KAAK,cAAc,EAA+C,MAAM,OAAO,CAAC;AAMpH,UAAU,eAAe;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;CACxC;AAmFD,QAAA,MAAM,UAAU,GAAI,mEAAmE,eAAe,gCAsHrG,CAAC;AAEF,QAAA,MAAM,iBAAiB,+HAItB,CAAC;AAGF,QAAA,MAAM,cAAc,yHAElB,CAAC;AAGH,QAAA,MAAM,cAAc,uIAanB,CAAC;AAGF,QAAA,MAAM,kBAAkB,6HAavB,CAAC;AAGF,QAAA,MAAM,kBAAkB,uIASvB,CAAC;AAGF,QAAA,MAAM,cAAc,uIASnB,CAAC;AAGF,OAAO,EACL,UAAU,EACV,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACd,cAAc,EACd,cAAc,EACd,kBAAkB,GACnB,CAAC"}
+{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../src/components/pagination.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,oBAAoB,EAAE,KAAK,cAAc,EAA+C,MAAM,OAAO,CAAC;AAQpH,UAAU,eAAe;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAmFD;;;GAGG;AACH,wBAAgB,eAAe,CAAC,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,MAAM,EAAE,CA6BjF;AAeD;;;GAGG;AACH,eAAO,MAAM,+BAA+B,KAAK,CAAC;AAElD,QAAA,MAAM,UAAU,GAAI,4EAA4E,eAAe,gCA+E9G,CAAC;AAEF;;;GAGG;AACH,iBAAS,kBAAkB,CAAC,EAC1B,UAA4C,EAC5C,WAAe,EACf,SAAS,GACV,EAAE;IACD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAkBA;AAED,QAAA,MAAM,iBAAiB,+HAItB,CAAC;AAGF,QAAA,MAAM,cAAc,yHAElB,CAAC;AAGH,QAAA,MAAM,cAAc,uIAanB,CAAC;AAGF,QAAA,MAAM,kBAAkB,6HAavB,CAAC;AAGF,QAAA,MAAM,kBAAkB,uIASvB,CAAC;AAGF,QAAA,MAAM,cAAc,uIASnB,CAAC;AAGF,OAAO,EACL,UAAU,EACV,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACd,cAAc,EACd,cAAc,EACd,kBAAkB,EAClB,kBAAkB,GACnB,CAAC"}

package/dist/components/pagination.js

@@ -5,7 +5,9 @@ import { forwardRef } from "react";
 import Link from "../embed-shims/next-link.js";
 import { cn } from "../utils/cn.js";
 import { isModifierClick } from "./chat/utils/chat-nav-resolution.js";
+import { InteractiveSkeleton } from "./loading/unified-skeleton.js";
 import { Button } from "./ui/button/index.js";
+import { useLoadingScope } from "./ui/loading-scope.js";
 function PaginationControl({
   page,
   label,
@@ -54,40 +56,50 @@ function PaginationControl({
 }
 const NEIGHBOUR_CLASS = "!h-10 !w-10 content-md:!h-10 content-md:!w-10";
 const PAGE_CLASS = "!h-9 !w-9 content-md:!h-9 content-md:!w-9";
-const Pagination = ({ currentPage, totalPages, onPageChange, className, getPageHref }) => {
-  const getPageNumbers = () => {
-    const pages = [];
-    const maxPagesToShow = 5;
-    if (totalPages <= maxPagesToShow) {
-      for (let i = 1; i <= totalPages; i++) {
-        pages.push(i);
-      }
-    } else {
-      pages.push(1);
-      let start = Math.max(2, currentPage - 1);
-      let end = Math.min(totalPages - 1, currentPage + 1);
-      if (currentPage <= 2) {
-        end = Math.min(totalPages - 1, 4);
-      } else if (currentPage >= totalPages - 1) {
-        start = Math.max(2, totalPages - 3);
-      }
-      if (start > 2) {
-        pages.push(-1);
-      }
-      for (let i = start; i <= end; i++) {
-        pages.push(i);
-      }
-      if (end < totalPages - 1) {
-        pages.push(-2);
-      }
-      if (totalPages > 1) {
-        pages.push(totalPages);
-      }
-    }
+function paginationSlots(currentPage, totalPages) {
+  const pages = [];
+  const maxPagesToShow = 5;
+  if (totalPages <= maxPagesToShow) {
+    for (let i = 1; i <= totalPages; i++) pages.push(i);
     return pages;
-  };
-  const pageNumbers = getPageNumbers();
-  return /* @__PURE__ */ jsx("nav", { role: "navigation", "aria-label": "pagination", className: cn("mx-auto flex w-full justify-center", className), children: /* @__PURE__ */ jsxs("ul", { className: "flex flex-row items-center gap-1", children: [
+  }
+  pages.push(1);
+  let start = Math.max(2, currentPage - 1);
+  let end = Math.min(totalPages - 1, currentPage + 1);
+  if (currentPage <= 2) {
+    end = Math.min(totalPages - 1, 4);
+  } else if (currentPage >= totalPages - 1) {
+    start = Math.max(2, totalPages - 3);
+  }
+  if (start > 2) pages.push(-1);
+  for (let i = start; i <= end; i++) pages.push(i);
+  if (end < totalPages - 1) pages.push(-2);
+  if (totalPages > 1) pages.push(totalPages);
+  return pages;
+}
+function PaginationEllipsisSlot() {
+  return /* @__PURE__ */ jsxs("span", { className: "flex h-9 w-9 items-center justify-center text-muted-foreground text-h6", children: [
+    /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4" }),
+    /* @__PURE__ */ jsx("span", { className: "sr-only", children: "More pages" })
+  ] });
+}
+const PAGINATION_NAV_CLASS = "mx-auto flex w-full justify-center";
+const PAGINATION_LIST_CLASS = "flex flex-row items-center gap-1";
+const PAGINATION_SKELETON_TOTAL_PAGES = 10;
+const Pagination = ({ currentPage, totalPages, onPageChange, className, getPageHref, loading }) => {
+  if (useLoadingScope() || loading) {
+    const known = totalPages > 1;
+    return /* @__PURE__ */ jsx(
+      PaginationSkeleton,
+      {
+        className,
+        totalPages: known ? totalPages : void 0,
+        currentPage: known ? currentPage : void 0
+      }
+    );
+  }
+  const pageNumbers = paginationSlots(currentPage, totalPages);
+  return /* @__PURE__ */ jsx("nav", { role: "navigation", "aria-label": "pagination", className: cn(PAGINATION_NAV_CLASS, className), children: /* @__PURE__ */ jsxs("ul", { className: PAGINATION_LIST_CLASS, children: [
     /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
       PaginationControl,
       {
@@ -104,10 +116,7 @@ const Pagination = ({ currentPage, totalPages, onPageChange, className, getPageH
     ) }),
     pageNumbers.map((page, index) => {
       if (page < 0) {
-        return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("span", { className: "flex h-9 w-9 items-center justify-center text-muted-foreground text-h6", children: [
-          /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4" }),
-          /* @__PURE__ */ jsx("span", { className: "sr-only", children: "More pages" })
-        ] }) }, `ellipsis-${index}`);
+        return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(PaginationEllipsisSlot, {}) }, `ellipsis-${index}`);
       }
       return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
         PaginationControl,
@@ -142,6 +151,17 @@ const Pagination = ({ currentPage, totalPages, onPageChange, className, getPageH
     ) })
   ] }) });
 };
+function PaginationSkeleton({
+  totalPages = PAGINATION_SKELETON_TOTAL_PAGES,
+  currentPage = 1,
+  className
+}) {
+  return /* @__PURE__ */ jsx("div", { className: cn(PAGINATION_NAV_CLASS, className), "aria-hidden": true, inert: true, children: /* @__PURE__ */ jsxs("ul", { className: PAGINATION_LIST_CLASS, children: [
+    /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(InteractiveSkeleton.Button, { className: NEIGHBOUR_CLASS }) }),
+    paginationSlots(currentPage, Math.max(totalPages, 1)).map((page, index) => /* @__PURE__ */ jsx("li", { children: page < 0 ? /* @__PURE__ */ jsx(PaginationEllipsisSlot, {}) : /* @__PURE__ */ jsx(InteractiveSkeleton.Button, { className: PAGE_CLASS }) }, page < 0 ? `ellipsis-${index}` : page)),
+    /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(InteractiveSkeleton.Button, { className: NEIGHBOUR_CLASS }) })
+  ] }) });
+}
 const PaginationContent = forwardRef(
   ({ className, ...props }, ref) => {
     return /* @__PURE__ */ jsx("ul", { ref, className: cn("flex items-center justify-center", className), ...props });
@@ -204,11 +224,14 @@ const PaginationNext = forwardRef(
 );
 PaginationNext.displayName = "PaginationNext";
 export {
+  PAGINATION_SKELETON_TOTAL_PAGES,
   Pagination,
   PaginationContent,
   PaginationEllipsis,
   PaginationItem,
   PaginationLink,
   PaginationNext,
-  PaginationPrevious
+  PaginationPrevious,
+  PaginationSkeleton,
+  paginationSlots
 };

package/dist/components/persistent-filter-controls.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"persistent-filter-controls.d.ts","sourceRoot":"","sources":["../../src/components/persistent-filter-controls.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,UAAU,6BAA6B;IACrC;;OAEG;IACH,SAAS,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,wBAAwB,CAAC,EACvC,SAAS,EACT,QAAQ,EACR,SAAS,EACT,eAAqB,EACrB,kBAAwB,EACxB,kBAAyB,GAC1B,EAAE,6BAA6B,+BA0C/B;AAED;;GAEG;AACH,UAAU,8BAA8B;IACtC,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,yBAAyB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,8BAA8B,+BAU3G;AAED;;GAEG;AACH,UAAU,sBAAsB;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,sBAAsB,+BAU3F;AAED;;GAEG;AACH,UAAU,6BAA6B;IACrC,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,wBAAwB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,6BAA6B,+BAUzG"}
+{"version":3,"file":"persistent-filter-controls.d.ts","sourceRoot":"","sources":["../../src/components/persistent-filter-controls.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,UAAU,6BAA6B;IACrC;;OAEG;IACH,SAAS,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,wBAAwB,CAAC,EACvC,SAAS,EACT,QAAQ,EACR,SAAS,EACT,eAAqB,EACrB,kBAAwB,EACxB,kBAAyB,GAC1B,EAAE,6BAA6B,+BAmC/B;AAED;;GAEG;AACH,UAAU,8BAA8B;IACtC,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,yBAAyB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,8BAA8B,+BAU3G;AAED;;GAEG;AACH,UAAU,sBAAsB;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,sBAAsB,+BAU3F;AAED;;GAEG;AACH,UAAU,6BAA6B;IACrC,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,wBAAwB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,6BAA6B,+BAUzG"}

package/dist/components/persistent-filter-controls.js

@@ -36,8 +36,7 @@ function PersistentFilterControls({
             },
             children
           }
-        ),
-        isLoading && /* @__PURE__ */ jsx("div", { className: "absolute right-2 top-2 z-10", role: "status", "aria-label": "Loading filters", children: /* @__PURE__ */ jsx("div", { className: "h-4 w-4 animate-spin rounded-full border-2 border-ods-border border-t-ods-accent" }) })
+        )
       ]
     }
   );

package/dist/components/persistent-pagination.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"persistent-pagination.d.ts","sourceRoot":"","sources":["../../src/components/persistent-pagination.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,UAAU,yBAAyB;IACjC;;OAEG;IACH,SAAS,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,QAAQ,EACR,WAAW,EACX,UAAU,EACV,SAAS,EACT,eAAqB,EACrB,kBAAwB,GACzB,EAAE,yBAAyB,+BA0C3B;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,SAAS,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM;;;;;;;;;EAsB/F;AAED;;GAEG;AACH,UAAU,gCAAgC;IACxC,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;CAC7B;AAED,wBAAgB,2BAA2B,CAAC,EAC1C,SAAS,EACT,WAAW,EACX,UAAU,EACV,YAAY,EACZ,SAAS,GACV,EAAE,gCAAgC,+BAyDlC"}
+{"version":3,"file":"persistent-pagination.d.ts","sourceRoot":"","sources":["../../src/components/persistent-pagination.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,UAAU,yBAAyB;IACjC;;OAEG;IACH,SAAS,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,QAAQ,EACR,WAAW,EACX,UAAU,EACV,SAAS,EACT,eAAqB,EACrB,kBAAwB,GACzB,EAAE,yBAAyB,+BA0C3B;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,SAAS,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM;;;;;;;;;EAsB/F;AAED;;GAEG;AACH,UAAU,gCAAgC;IACxC,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;CAC7B;AAED,wBAAgB,2BAA2B,CAAC,EAC1C,SAAS,EACT,WAAW,EACX,UAAU,EACV,YAAY,EACZ,SAAS,GACV,EAAE,gCAAgC,+BA6DlC"}

package/dist/components/persistent-pagination.js

@@ -1,6 +1,7 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "../utils/cn.js";
+import { useLoadingScope } from "./ui/loading-scope.js";
 import { UnifiedPagination } from "./unified-pagination.js";
 function PersistentPagination({
   isLoading,
@@ -77,6 +78,7 @@ function PersistentPaginationWrapper({
   onPageChange,
   className
 }) {
+  const inScope = useLoadingScope();
   const hasResults = totalPages > 0;
   const displayTotalPages = hasResults ? totalPages : 1;
   const displayCurrentPage = hasResults ? currentPage : 1;
@@ -91,7 +93,7 @@ function PersistentPaginationWrapper({
         className
       ),
       style: {
-        opacity: isPaginationDisabled ? 0.3 : hasNoResults ? 0.5 : 1,
+        opacity: inScope ? 1 : isPaginationDisabled ? 0.3 : hasNoResults ? 0.5 : 1,
         transitionDuration: "300ms"
       },
       role: "navigation",

package/dist/components/platform/ToolBadge.d.ts

@@ -6,7 +6,6 @@
  */
 import type React from 'react';
 import type { ToolType } from '../../types/tool.types';
-export type { ToolType } from '../../types/tool.types';
 export interface ToolBadgeProps {
     /** A built-in tool: its label and grey mark come from the tool registry. */
     toolType?: ToolType;
@@ -35,6 +34,19 @@ export interface ToolBadgeProps {
     className?: string;
     iconClassName?: string;
 }
+/**
+ * A chip's height, as a CSS length: the chip and its skeleton take it, and a host that keeps room for N lines of chips
+ * (a card's footer that stays one height) sizes that room from it.
+ */
+export declare const TOOL_CHIP_HEIGHT = "2rem";
+export interface ToolBadgeSkeletonProps {
+    variant?: 'inline' | 'chip';
+    /** Whether the badge leads with its mark (default true). */
+    icon?: boolean;
+    className?: string;
+}
+/** A badge while its tool is read: the chip's own frame (or the inline row), a mark box and a bar for the name. */
+export declare function ToolBadgeSkeleton({ variant, icon, className }: ToolBadgeSkeletonProps): React.JSX.Element;
 /**
  * One tool, named: a mark and a label. Pass a `toolType` for a tool the
  * registry knows, or `label` + `icon` for one it does not (a connector or a

package/dist/components/platform/ToolBadge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToolBadge.d.ts","sourceRoot":"","sources":["../../../src/components/platform/ToolBadge.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAMvD,YAAY,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAEvD,MAAM,WAAW,cAAc;IAC7B,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,mFAAmF;IACnF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gGAAgG;IAChG,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;;;OAIG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC5B;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;GAIG;AACH,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA4D9C,CAAC"}
+{"version":3,"file":"ToolBadge.d.ts","sourceRoot":"","sources":["../../../src/components/platform/ToolBadge.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AASvD,MAAM,WAAW,cAAc;IAC7B,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,mFAAmF;IACnF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gGAAgG;IAChG,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;;;OAIG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC5B;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;GAGG;AACH,eAAO,MAAM,gBAAgB,SAAS,CAAC;AASvC,MAAM,WAAW,sBAAsB;IACrC,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC5B,4DAA4D;IAC5D,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,mHAAmH;AACnH,wBAAgB,iBAAiB,CAAC,EAAE,OAAkB,EAAE,IAAW,EAAE,SAAS,EAAE,EAAE,sBAAsB,qBAevG;AAED;;;;GAIG;AACH,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAgE9C,CAAC"}

package/dist/components/platform/ToolBadge.js

@@ -4,7 +4,27 @@ import Link from "../../embed-shims/next-link.js";
 import { cn } from "../../utils/cn.js";
 import { getToolLabel } from "../../utils/tool-utils.js";
 import { NavLinkAnchorViaRuntime } from "../chat/nav-link-anchor-via-runtime.js";
+import { TextLineSkeleton, UnifiedSkeleton } from "../loading/unified-skeleton.js";
 import { ToolIcon } from "../tool-icon.js";
+import { useLoadingScope } from "../ui/loading-scope.js";
+import { TOOL_MARK_CLASS } from "./tool-badge-mark.js";
+const CHIP_CLASS = "inline-flex items-center gap-[var(--spacing-system-xs)] rounded-md border border-ods-border bg-ods-card p-[var(--spacing-system-xsf)] text-ods-text-primary text-h5";
+const TOOL_CHIP_HEIGHT = "2rem";
+const CHIP_STYLE = { height: TOOL_CHIP_HEIGHT };
+const INLINE_CLASS = "flex items-center gap-1 text-ods-text-secondary";
+const CHIP_NAME_TYPICAL_CH = "11ch";
+function ToolBadgeSkeleton({ variant = "inline", icon = true, className }) {
+  if (variant === "chip") {
+    return /* @__PURE__ */ jsxs("span", { className: cn(CHIP_CLASS, className), style: CHIP_STYLE, "aria-hidden": true, children: [
+      icon && /* @__PURE__ */ jsx(UnifiedSkeleton, { as: "span", className: cn(TOOL_MARK_CLASS, "rounded-sm") }),
+      /* @__PURE__ */ jsx(TextLineSkeleton, { type: "h5", width: CHIP_NAME_TYPICAL_CH })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: cn(INLINE_CLASS, className), "aria-hidden": true, children: [
+    icon && /* @__PURE__ */ jsx(UnifiedSkeleton, { className: cn(TOOL_MARK_CLASS, "rounded-sm") }),
+    /* @__PURE__ */ jsx(TextLineSkeleton, { type: "h4", className: "w-20" })
+  ] });
+}
 const ToolBadge = ({
   toolType,
   label,
@@ -15,8 +35,10 @@ const ToolBadge = ({
   className,
   iconClassName
 }) => {
+  const loading = useLoadingScope();
   const text = label ?? (toolType ? getToolLabel(toolType) : "");
   const mark = icon ?? (toolType ? /* @__PURE__ */ jsx(ToolIcon, { toolType, className: iconClassName, size: 16 }) : null);
+  if (loading) return /* @__PURE__ */ jsx(ToolBadgeSkeleton, { variant, icon: !!mark, className });
   const linked = (node, linkClassName) => href && targetPlatform ? /* @__PURE__ */ jsx(
     NavLinkAnchorViaRuntime,
     {
@@ -32,14 +54,19 @@ const ToolBadge = ({
       /* @__PURE__ */ jsxs(
         "span",
         {
-          className: cn(
-            // The house tag (Figma `tag`): 32px, on the card surface, the caption face.
-            "inline-flex h-8 items-center gap-[var(--spacing-system-xs)] rounded-md border border-ods-border bg-ods-card p-[var(--spacing-system-xsf)] text-ods-text-primary text-h5",
-            href && "transition-colors hover:border-ods-border-hover",
-            className
-          ),
+          className: cn(CHIP_CLASS, href && "transition-colors hover:border-ods-border-hover", className),
+          style: CHIP_STYLE,
           children: [
-            mark && /* @__PURE__ */ jsx("span", { className: "flex h-4 w-4 shrink-0 items-center justify-center [&_img]:h-full [&_img]:w-full [&_img]:rounded-sm [&_img]:object-contain [&_svg]:h-full [&_svg]:w-full", children: mark }),
+            mark && /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: cn(
+                  TOOL_MARK_CLASS,
+                  "[&_img]:h-full [&_img]:w-full [&_img]:rounded-sm [&_img]:object-contain [&_svg]:h-full [&_svg]:w-full"
+                ),
+                children: mark
+              }
+            ),
             text && /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap", children: text })
           ]
         }
@@ -48,7 +75,7 @@ const ToolBadge = ({
     );
   }
   return linked(
-    /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-1 text-ods-text-secondary", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: cn(INLINE_CLASS, className), children: [
       mark,
       /* @__PURE__ */ jsx("span", { className: "text-ods-text-primary text-h4", children: text })
     ] }),
@@ -56,5 +83,7 @@ const ToolBadge = ({
   );
 };
 export {
-  ToolBadge
+  TOOL_CHIP_HEIGHT,
+  ToolBadge,
+  ToolBadgeSkeleton
 };

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

@@ -10,8 +10,8 @@ export { SoftwareSourceBadge } from './SoftwareSourceBadge';
 export type { SoftwareSourceBadgeProps, SoftwareSource } from './SoftwareSourceBadge';
 export { CveLink } from './CveLink';
 export type { CveLinkProps } from './CveLink';
-export { ToolBadge } from './ToolBadge';
-export type { ToolBadgeProps } from './ToolBadge';
+export { TOOL_CHIP_HEIGHT, ToolBadge, ToolBadgeSkeleton } from './ToolBadge';
+export type { ToolBadgeProps, ToolBadgeSkeletonProps } from './ToolBadge';
 export type { ToolType } from '../../types/tool.types';
 export { ShellTypeBadge } from './ShellTypeBadge';
 export type { ShellTypeBadgeProps } from './ShellTypeBadge';

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/platform/index.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAExD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,YAAY,EAAE,wBAAwB,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEtF,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAE9C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,YAAY,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAEvD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAC5D,YAAY,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAEzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,YAAY,EAAE,sBAAsB,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAEhF,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/platform/index.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAExD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,YAAY,EAAE,wBAAwB,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEtF,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAE9C,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAC7E,YAAY,EAAE,cAAc,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAC1E,YAAY,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAEvD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAC5D,YAAY,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAEzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,YAAY,EAAE,sBAAsB,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAEhF,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/components/platform/index.js

@@ -1,7 +1,7 @@
 import { SoftwareInfo } from "./SoftwareInfo.js";
 import { SoftwareSourceBadge } from "./SoftwareSourceBadge.js";
 import { CveLink } from "./CveLink.js";
-import { ToolBadge } from "./ToolBadge.js";
+import { TOOL_CHIP_HEIGHT, ToolBadge, ToolBadgeSkeleton } from "./ToolBadge.js";
 import { ShellTypeBadge } from "./ShellTypeBadge.js";
 import { ScriptInfoSection } from "./ScriptInfoSection.js";
 import { ScriptArguments } from "./ScriptArguments.js";
@@ -12,5 +12,7 @@ export {
   ShellTypeBadge,
   SoftwareInfo,
   SoftwareSourceBadge,
-  ToolBadge
+  TOOL_CHIP_HEIGHT,
+  ToolBadge,
+  ToolBadgeSkeleton
 };

package/dist/components/platform/tool-badge-mark.d.ts

@@ -0,0 +1,6 @@
+/**
+ * A tool or source mark's 16px box (`ToolBadge`'s mark, the "Data synced from" line's source glyph): read by the marks
+ * and by every skeleton that stands for one. A leaf, so a `ui` component can read it without loading the badge.
+ */
+export declare const TOOL_MARK_CLASS: string;
+//# sourceMappingURL=tool-badge-mark.d.ts.map

package/dist/components/platform/tool-badge-mark.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tool-badge-mark.d.ts","sourceRoot":"","sources":["../../../src/components/platform/tool-badge-mark.ts"],"names":[],"mappings":"AACA;;;GAGG;AACH,eAAO,MAAM,eAAe,QAA8D,CAAC"}

package/dist/components/platform/tool-badge-mark.js

@@ -0,0 +1,6 @@
+"use client";
+import { ICON_SIZE } from "../../styles/component-sizes.js";
+const TOOL_MARK_CLASS = `flex ${ICON_SIZE.sm} shrink-0 items-center justify-center`;
+export {
+  TOOL_MARK_CLASS
+};

package/dist/components/product-demo/fixtures/devices.d.ts

@@ -7,8 +7,6 @@ export interface DevicesFixture {
 }
 /** The fleet of the three demo customers on an ordinary morning: a mix of states, one desktop offline since last night. */
 export declare function buildDevicesFixture(cast: DemoCast): DevicesFixture;
-/** What the Devices page shows for a search: the query in the field and the rows that answer it. */
-export declare const DEVICES_SEARCH_QUERY = "Windows";
 /** The fleet narrowed to its Windows devices, the way the list answers that search. */
 export declare function buildWindowsDevicesFixture(cast: DemoCast): DevicesFixture;
 //# sourceMappingURL=devices.d.ts.map

package/dist/components/product-demo/fixtures/devices.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"devices.d.ts","sourceRoot":"","sources":["../../../../src/components/product-demo/fixtures/devices.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACvE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAyCxC,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,SAAS,EAAE,CAAC;IACrB,aAAa,EAAE,aAAa,CAAC;IAC7B,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,2HAA2H;AAC3H,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,QAAQ,GAAG,cAAc,CAuBlE;AAED,oGAAoG;AACpG,eAAO,MAAM,oBAAoB,YAAY,CAAC;AAE9C,uFAAuF;AACvF,wBAAgB,0BAA0B,CAAC,IAAI,EAAE,QAAQ,GAAG,cAAc,CAQzE"}
+{"version":3,"file":"devices.d.ts","sourceRoot":"","sources":["../../../../src/components/product-demo/fixtures/devices.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACvE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAyCxC,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,SAAS,EAAE,CAAC;IACrB,aAAa,EAAE,aAAa,CAAC;IAC7B,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,2HAA2H;AAC3H,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,QAAQ,GAAG,cAAc,CAuBlE;AAED,uFAAuF;AACvF,wBAAgB,0BAA0B,CAAC,IAAI,EAAE,QAAQ,GAAG,cAAc,CAQzE"}

package/dist/components/product-demo/fixtures/devices.js

@@ -48,7 +48,6 @@ function buildDevicesFixture(cast) {
   };
   return { devices, deviceFilters, totalCount: devices.length };
 }
-const DEVICES_SEARCH_QUERY = "Windows";
 function buildWindowsDevicesFixture(cast) {
   const fleet = buildDevicesFixture(cast);
   const devices = fleet.devices.filter((row) => row.osType === "WINDOWS");
@@ -59,7 +58,6 @@ function buildWindowsDevicesFixture(cast) {
   };
 }
 export {
-  DEVICES_SEARCH_QUERY,
   buildDevicesFixture,
   buildWindowsDevicesFixture
 };