@multiplatform.one/frappe-ui 7.23.1 → 7.24.0

package/src/desk/DeskShell.stories.tsx

@@ -1,9 +1,15 @@
 import { InMemoryFixtureProvider } from "@multiplatform.one/frappe";
 import { action } from "@multiplatform.one/storybook";
 import { Text, YStack } from "@multiplatform.one/components";
+import { sizeRecipeEscape } from "@multiplatform.one/theme";
 import { FrappeProvider } from "../FrappeProvider";
 import { DeskShell } from "./DeskShell";
 
+const frameHeight = sizeRecipeEscape(
+  640,
+  "story canvas: a fixed-height frame for a full-height screen to fill",
+);
+
 export default {
   title: "FrappeUI/Desk/DeskShell",
   component: DeskShell,
@@ -85,7 +91,7 @@ const content = (blocks: number) => (
 
 export const Main = (args: Record<string, unknown>) => (
   <FrappeProvider baseURL={MOCK_HOST} fixtures={new InMemoryFixtureProvider({})}>
-    <YStack height={640}>
+    <YStack height={frameHeight}>
       <DeskShell
         breadcrumbs={[{ label: "Desk", href: "/desk" }, { label: "Todo" }]}
         onNavigate={action("onNavigate")}
@@ -102,7 +108,7 @@ Main.storyName = "Main";
 
 export const NoSidebar = () => (
   <FrappeProvider baseURL={MOCK_HOST} fixtures={new InMemoryFixtureProvider({})}>
-    <YStack height={640}>
+    <YStack height={frameHeight}>
       <DeskShell showSidebar={false} onNavigate={action("onNavigate")}>
         {content(2)}
       </DeskShell>
@@ -112,7 +118,7 @@ export const NoSidebar = () => (
 
 export const NoAwesomebar = () => (
   <FrappeProvider baseURL={MOCK_HOST} fixtures={new InMemoryFixtureProvider({})}>
-    <YStack height={640}>
+    <YStack height={frameHeight}>
       <DeskShell showAwesomebar={false} onNavigate={action("onNavigate")}>
         {content(2)}
       </DeskShell>
@@ -123,7 +129,7 @@ export const NoAwesomebar = () => (
 /** Long page content must scroll inside the main area, header staying fixed. */
 export const LongContent = () => (
   <FrappeProvider baseURL={MOCK_HOST} fixtures={new InMemoryFixtureProvider({})}>
-    <YStack height={640}>
+    <YStack height={frameHeight}>
       <DeskShell
         breadcrumbs={[{ label: "Desk", href: "/desk" }, { label: "Long" }]}
         onNavigate={action("onNavigate")}
@@ -136,7 +142,7 @@ export const LongContent = () => (
 
 /** No breadcrumbs, no provider config: shell must still render header + nav + content. */
 export const Bare = () => (
-  <YStack height={640}>
+  <YStack height={frameHeight}>
     <DeskShell onNavigate={action("onNavigate")}>{content(1)}</DeskShell>
   </YStack>
 );
@@ -144,7 +150,7 @@ export const Bare = () => (
 /** Compact viewport: rail collapses to a phosphor toggle + overlay drawer. */
 export const Narrow = () => (
   <FrappeProvider baseURL={MOCK_HOST} fixtures={new InMemoryFixtureProvider({})}>
-    <YStack height={640}>
+    <YStack height={frameHeight}>
       <DeskShell
         breadcrumbs={[{ label: "Desk", href: "/desk" }, { label: "Todo" }]}
         onNavigate={action("onNavigate")}

package/src/desk/awesomebar.auth.spec.tsx

@@ -0,0 +1,77 @@
+// The desk Awesomebar keeps its document-search client in a ref. When the
+// provider's connection starts sending its token, or sends it under another
+// scheme, the next search must carry the new credentials instead of going out
+// on a client built for the old ones (MPO-410).
+import { renderWithProviders } from "@multiplatform.one/test-utils";
+import { act, waitFor } from "@testing-library/react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { FrappeProvider } from "../FrappeProvider";
+import { Awesomebar } from "./awesomebar";
+
+const combobox = vi.hoisted(() => ({
+  search: undefined as ((query: string) => void) | undefined,
+}));
+vi.mock("@multiplatform.one/forms", () => ({
+  formCommonColors: { muted: "$color10" },
+  Combobox: ({ onSearch }: { onSearch?: (query: string) => void }) => {
+    combobox.search = onSearch;
+    return null;
+  },
+}));
+
+type Auth = { useToken: boolean; token: string; type: string };
+
+const auth = (useToken: boolean, type = "token"): Auth => ({ useToken, token: "key:secret", type });
+
+const changes: [string, Auth, Auth, (string | null)[]][] = [
+  ["starts sending its token", auth(false), auth(true), [null, "token key:secret"]],
+  [
+    "switches its token scheme",
+    auth(true, "token"),
+    auth(true, "Bearer"),
+    ["token key:secret", "Bearer key:secret"],
+  ],
+];
+
+const searchPath = "/api/method/frappe.utils.global_search.search";
+let run = 0;
+let searches: (string | null)[] = [];
+
+beforeEach(() => {
+  run += 1;
+  searches = [];
+  vi.stubGlobal("fetch", async (input: string | URL | Request, init?: RequestInit) => {
+    const url = new URL(String(input));
+    if (url.pathname === searchPath) {
+      searches.push(new Headers(init?.headers).get("Authorization"));
+    }
+    return Response.json({ message: [], data: [] });
+  });
+});
+
+afterEach(() => vi.unstubAllGlobals());
+
+describe("Awesomebar document search", () => {
+  it.each(changes)(
+    "searches with the new credentials when the connection %s",
+    async (_, before, after, expected) => {
+      const baseURL = `http://awesomebar-${run}.test`;
+      const ui = (connectionAuth: Auth) => (
+        <FrappeProvider baseURL={baseURL} realtime={false} auth={connectionAuth}>
+          <Awesomebar />
+        </FrappeProvider>
+      );
+      const { rerender } = renderWithProviders(ui(before));
+      act(() => {
+        combobox.search?.("pikachu");
+      });
+      await waitFor(() => expect(searches).toHaveLength(1));
+      rerender(ui(after));
+      act(() => {
+        combobox.search?.("raichu");
+      });
+      await waitFor(() => expect(searches).toHaveLength(2));
+      expect(searches).toEqual(expected);
+    },
+  );
+});

package/src/desk/awesomebar.tsx

@@ -172,7 +172,7 @@ export function Awesomebar({ onNavigate, basePath = "/desk", ...stackProps }: Aw
   const httpRef = useRef<HttpClient | undefined>(undefined);
   const configKeyRef = useRef("");
   if (config?.baseURL) {
-    const key = `${config.baseURL}:${config.auth?.token ?? ""}`;
+    const key = `${config.baseURL}:${config.auth?.useToken ? "t" : ""}:${config.auth?.token ?? ""}:${config.auth?.type ?? ""}`;
     if (key !== configKeyRef.current) {
       httpRef.current = createHttpClientFromConfig({
         baseURL: config.baseURL,

package/src/fields/CodeEditor/index.tsx

@@ -29,7 +29,7 @@ import {
   useResolvedValidators,
   type AnyFormApi,
 } from "@multiplatform.one/forms";
-import { useResolvedKnobs } from "@multiplatform.one/theme";
+import { sizeRecipeForToken, useResolvedKnobs } from "@multiplatform.one/theme";
 import { useEffect, useState, type ReactNode } from "react";
 import { useTranslation } from "react-i18next";
 import type { FontSizeTokens, LabelProps, SizeTokens } from "tamagui";
@@ -183,7 +183,13 @@ export function CodeEditorField({
   if (skeleton) {
     return (
       <YStack {...knobProps.gap} width="100%">
-        {label && <Skeleton variant="text" width="30%" height={14} />}
+        {label && (
+          <Skeleton
+            variant="text"
+            width="30%"
+            height={sizeRecipeForToken(knobProps.sizeToken).fontSize}
+          />
+        )}
         <Skeleton variant="rounded" width="100%" height={compact ? 120 : 200} />
       </YStack>
     );

package/src/fields/Color/Color.stories.tsx

@@ -6,6 +6,8 @@ import { fieldtypeToTableField } from "../../fieldRegistry";
 import { FrappeStoryProvider } from "../../frappeStoryTarget";
 import { Color, type ColorProps } from ".";
 
+// hex-escape: Color field values are hex strings: specimen data, not paint
+
 export default {
   title: "FrappeUI/Color",
   component: Color,

package/src/fields/Color/index.tsx

@@ -62,6 +62,7 @@ export function Color<
     validators,
     disabled,
     value,
+    // hex-escape: a Color field stores hex; the placeholder shows that format and paints nothing
     placeholder = "#000000",
     _showPresets = true,
     presetColors,

package/src/fields/FileUpload.tsx

@@ -1,7 +1,7 @@
 import { useFrappeCollection } from "@multiplatform.one/frappe";
 import { Skeleton } from "@multiplatform.one/forms";
 import { FileIcon, UploadIcon, XIcon } from "@phosphor-icons/react";
-import { useResolvedKnobs } from "@multiplatform.one/theme";
+import { sizeRecipeForToken, useResolvedKnobs } from "@multiplatform.one/theme";
 import type React from "react";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -276,7 +276,13 @@ export function FileUpload({
   if (skeleton) {
     return (
       <YStack {...knobProps.gap}>
-        {label && <Skeleton variant="text" width="30%" height={14} />}
+        {label && (
+          <Skeleton
+            variant="text"
+            width="30%"
+            height={sizeRecipeForToken(knobProps.sizeToken).fontSize}
+          />
+        )}
         <Skeleton variant="rounded" width="100%" height={minHeight} />
       </YStack>
     );

package/src/fields/Heading/index.tsx

@@ -1,9 +1,20 @@
 import { useRegisterPageHeading } from "@multiplatform.one/components";
 import { Skeleton } from "@multiplatform.one/forms";
-import { useResolvedKnobs } from "@multiplatform.one/theme";
+import { sizeRecipeEscape, useResolvedKnobs } from "@multiplatform.one/theme";
 import type React from "react";
 import { useCallback, useEffect, useId, useState } from "react";
-import { H1, H2, H3, H4, Separator, Text, XStack, YStack, type YStackProps } from "tamagui";
+import {
+  getTokenValue,
+  H1,
+  H2,
+  H3,
+  H4,
+  Separator,
+  Text,
+  XStack,
+  YStack,
+  type YStackProps,
+} from "tamagui";
 
 export type HeadingLevel = 1 | 2 | 3 | 4;
 
@@ -105,7 +116,13 @@ export function Heading({
       <YStack {...knobProps.gap} {...stackProps}>
         <Skeleton variant="text" width="45%" height={compact ? 18 : 24} />
         <Skeleton variant="text" width="70%" height={compact ? 12 : 14} />
-        {showSeparator && <Skeleton variant="rounded" width="100%" height={1} />}
+        {showSeparator && (
+          <Skeleton
+            variant="rounded"
+            width="100%"
+            height={sizeRecipeEscape(1, "separator bone: the 1px rule a Separator draws")}
+          />
+        )}
       </YStack>
     );
   }
@@ -148,23 +165,30 @@ export function Heading({
     </XStack>
   );
 
+  const spacePx = (token: unknown) =>
+    Number(getTokenValue(token as Parameters<typeof getTokenValue>[0], "space")) || 0;
+  const descriptionGap = Math.max(0, spacePx(stackProps.gap ?? knobProps.gap.gap) - spacePx("$1"));
+  const showDescription = Boolean(resolvedDescription) && !isCollapsed;
+
   return (
     <YStack {...knobProps.gap} {...stackProps}>
-      {headingContent}
-      {resolvedDescription && !isCollapsed && (
-        <Text
-          fontSize={knobProps.sizeToken}
-          {...knobProps.body}
-          color="$color10"
-          marginTop="$-1"
-          marginBottom="$1"
-          paddingInlineStart={canCollapse ? "$6" : undefined}
-        >
-          {resolvedDescription}
-        </Text>
-      )}
+      <YStack gap={descriptionGap} paddingBottom={showDescription ? "$1" : undefined}>
+        {headingContent}
+        {showDescription && (
+          <Text
+            fontSize={knobProps.sizeToken}
+            {...knobProps.body}
+            color="$color10"
+            paddingInlineStart={canCollapse ? "$6" : undefined}
+          >
+            {resolvedDescription}
+          </Text>
+        )}
+      </YStack>
       {showSeparator && (
-        <Separator marginVertical={compact ? "$0.5" : "$1"} backgroundColor="$color5" />
+        <YStack paddingVertical={compact ? "$0.5" : "$1"}>
+          <Separator backgroundColor="$color5" />
+        </YStack>
       )}
       {collapsible ? (
         // Always mounted so the aria-controls target exists while collapsed

package/src/fields/MarkdownEditor/index.native.tsx

@@ -31,7 +31,7 @@ import { useEffect, useState, type ComponentType, type ReactNode } from "react";
 import { useTranslation } from "react-i18next";
 import type { FontSizeTokens, LabelProps, SizeTokens } from "tamagui";
 import { Paragraph, YStack } from "tamagui";
-import { useResolvedKnobs } from "@multiplatform.one/theme";
+import { sizeRecipeForToken, useResolvedKnobs } from "@multiplatform.one/theme";
 import { EditorPreviewPanes, PreviewSurface } from "../shared/EditorPreviewPanes";
 
 // ---------------------------------------------------------------------------
@@ -176,7 +176,13 @@ export function MarkdownEditorField({
   if (skeleton) {
     return (
       <YStack {...knobProps.gap} width="100%">
-        {label && <Skeleton variant="text" width="30%" height={14} />}
+        {label && (
+          <Skeleton
+            variant="text"
+            width="30%"
+            height={sizeRecipeForToken(knobProps.sizeToken).fontSize}
+          />
+        )}
         <Skeleton variant="rounded" width="100%" height={compact ? 120 : 200} />
       </YStack>
     );

package/src/fields/MarkdownEditor/index.tsx

@@ -27,6 +27,7 @@ import {
   type AnyFormApi,
 } from "@multiplatform.one/forms";
 import { RichEditor, type RichEditorRef } from "@multiplatform.one/rich-text";
+import { sizeRecipeForToken } from "@multiplatform.one/theme";
 import { useEffect, useRef, useState, type ReactNode } from "react";
 import type { LabelProps, SizeTokens } from "tamagui";
 import { YStack } from "tamagui";
@@ -111,7 +112,13 @@ export function MarkdownEditorField({
   if (skeleton) {
     return (
       <YStack {...knobProps.gap} width="100%">
-        {label && <Skeleton variant="text" width="30%" height={14} />}
+        {label && (
+          <Skeleton
+            variant="text"
+            width="30%"
+            height={sizeRecipeForToken(knobProps.sizeToken).fontSize}
+          />
+        )}
         <Skeleton variant="rounded" width="100%" height={compact ? 120 : 200} />
       </YStack>
     );

package/src/fields/ReadOnly/ReadOnly.stories.tsx

@@ -4,6 +4,8 @@ import { fieldtypeToTableField } from "../../fieldRegistry";
 import { FrappeStoryProvider } from "../../frappeStoryTarget";
 import { ReadOnly } from ".";
 
+// hex-escape: Color field values are hex strings: specimen data, not paint
+
 export default {
   title: "FrappeUI/ReadOnly",
   component: ReadOnly,

package/src/frappeNavigation.loader.spec.tsx

@@ -0,0 +1,45 @@
+// MPO-411. A routed view reads what its route's loader rendered on the server
+// through the host's navigation, so an app hands the view its loader instead
+// of reading the router itself.
+import { render } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import {
+  FrappeNavigationProvider,
+  useRouteLoaderData,
+  type FrappeNavigation,
+} from "./frappeNavigation";
+
+const loader = async () => ({ rows: [] });
+
+function Probe({ of, seen }: { of?: typeof loader; seen: (value: unknown) => void }) {
+  seen(useRouteLoaderData(of));
+  return null;
+}
+
+function read(navigation: FrappeNavigation | undefined, of?: typeof loader): unknown {
+  const seen = vi.fn();
+  render(
+    <FrappeNavigationProvider navigation={navigation}>
+      <Probe of={of} seen={seen} />
+    </FrappeNavigationProvider>,
+  );
+  return seen.mock.calls.at(-1)?.[0];
+}
+
+const base: FrappeNavigation = { usePathname: () => "/pokemon", useNavigate: () => () => {} };
+
+describe("useRouteLoaderData", () => {
+  it("hands the host the loader and returns what it read", () => {
+    const useLoader = vi.fn(() => ({ rows: ["bulbasaur"] }));
+    expect(read({ ...base, useLoader }, loader)).toEqual({ rows: ["bulbasaur"] });
+    expect(useLoader).toHaveBeenCalledWith(loader);
+  });
+
+  it("reads nothing without a loader or a host that runs them", () => {
+    const useLoader = vi.fn(() => ({ rows: ["bulbasaur"] }));
+    expect(read({ ...base, useLoader })).toBeUndefined();
+    expect(useLoader).not.toHaveBeenCalled();
+    expect(read(base, loader)).toBeUndefined();
+    expect(read(undefined, loader)).toBeUndefined();
+  });
+});

package/src/frappeNavigation.tsx

@@ -15,12 +15,28 @@ export interface FrappeNavigation {
   usePathname(): string;
   /** A function that pushes an href onto the history. */
   useNavigate(): (href: string) => void;
+  /**
+   * The query params of the route the caller renders in. A host without
+   * them leaves a routed list's controls out of the URL.
+   */
+  useSearchParams?(): Record<string, string | undefined>;
+  /** A function that replaces query params in place; undefined drops one. */
+  useSetSearchParams?(): (params: Record<string, string | undefined>) => void;
+  /**
+   * What the route's loader returned (the page it rendered on the server),
+   * given the loader the route exports. A host without loaders leaves it
+   * out, and a view reads live from the start.
+   */
+  useLoader?(loader: (...args: never[]) => unknown): unknown;
 }
 
 /** A routed view's handle on the host router. */
 export interface FrappeRouter {
   pathname: string;
   navigate(href: string): void;
+  /** Present when the host hands its query params to routed views. */
+  searchParams?: Record<string, string | undefined>;
+  setSearchParams?: (params: Record<string, string | undefined>) => void;
 }
 
 const FrappeNavigationContext = createContext<FrappeNavigation | undefined>(undefined);
@@ -44,6 +60,17 @@ export function useFrappeNavigation(): FrappeNavigation | undefined {
   return useContext(FrappeNavigationContext);
 }
 
+/**
+ * What `loader` returned for the route the caller renders in, through the
+ * host's navigation; undefined without a loader or a host that runs them.
+ */
+export function useRouteLoaderData(loader: ((...args: never[]) => unknown) | undefined): unknown {
+  const navigation = useContext(FrappeNavigationContext);
+  if (!loader || !navigation?.useLoader) return undefined;
+  // oxlint-disable-next-line rules-of-hooks -- one navigation and one loader per view
+  return navigation.useLoader(loader);
+}
+
 /** The host router for a routed view, or undefined when the host gave none. */
 export function useFrappeRouter(): FrappeRouter | undefined {
   const navigation = useFrappeNavigation();
@@ -52,7 +79,11 @@ export function useFrappeRouter(): FrappeRouter | undefined {
   const pathname = navigation.usePathname();
   // oxlint-disable-next-line rules-of-hooks -- one navigation per tree
   const navigate = navigation.useNavigate();
-  return { pathname, navigate };
+  // oxlint-disable-next-line rules-of-hooks -- one navigation per tree
+  const searchParams = navigation.useSearchParams?.();
+  // oxlint-disable-next-line rules-of-hooks -- one navigation per tree
+  const setSearchParams = navigation.useSetSearchParams?.();
+  return { pathname, navigate, searchParams, setSearchParams };
 }
 
 /**

package/src/frappeRoutes.notConfigured.spec.tsx

@@ -0,0 +1,77 @@
+// A host built with Frappe off (MPO-403): createApp mounts no FrappeProvider
+// without FRAPPE_ENABLED, so a doctype's routed pages find no bench URL and no
+// fixture corpus. They say the backend isn't configured instead of throwing
+// and taking the route down, and they dial nothing.
+import { renderWithProviders } from "@multiplatform.one/test-utils";
+import { cleanup, screen } from "@testing-library/react";
+import i18next from "i18next";
+import { initReactI18next } from "react-i18next";
+import { afterEach, beforeAll, beforeEach, describe, expect, it, vi } from "vitest";
+import { FrappeForm } from "./FrappeForm";
+import { FrappeListView } from "./FrappeListView";
+import { FrappeProvider } from "./FrappeProvider";
+
+interface Move {
+  name: string;
+  doctype: string;
+  move_name?: string;
+}
+
+const doctype = "Poke Move";
+const route = "/moves";
+
+let fetchSpy: ReturnType<typeof vi.fn>;
+
+beforeAll(async () => {
+  await i18next.use(initReactI18next).init({
+    lng: "en",
+    interpolation: { escapeValue: false },
+    resources: { en: { translation: {} } },
+  });
+});
+
+beforeEach(() => {
+  fetchSpy = vi.fn(async () => {
+    throw new Error("a page with no bench dialled one");
+  });
+  vi.stubGlobal("fetch", fetchSpy);
+});
+
+afterEach(() => {
+  cleanup();
+  vi.restoreAllMocks();
+  vi.unstubAllGlobals();
+});
+
+function expectNotConfigured() {
+  expect(screen.getByTestId("frappe-not-configured")).toBeTruthy();
+  expect(screen.getByText("Frappe is not configured")).toBeTruthy();
+  expect(fetchSpy).not.toHaveBeenCalled();
+}
+
+describe("a doctype's pages on a host with no Frappe backend", () => {
+  it("the new page says the backend isn't configured", () => {
+    renderWithProviders(<FrappeForm<Move> doctype={doctype} route={route} />);
+    expectNotConfigured();
+    expect(screen.getByText(`${doctype} can't load without a Frappe bench URL.`)).toBeTruthy();
+  });
+
+  it("a record page says the backend isn't configured", () => {
+    renderWithProviders(<FrappeForm<Move> doctype={doctype} name="a1b2c3" />);
+    expectNotConfigured();
+  });
+
+  it("the list page says the backend isn't configured", () => {
+    renderWithProviders(<FrappeListView<Move> doctype={doctype} route={route} />);
+    expectNotConfigured();
+  });
+
+  it("a provider that resolved no bench URL reads the same", () => {
+    renderWithProviders(
+      <FrappeProvider realtime={false}>
+        <FrappeForm<Move> doctype={doctype} route={route} />
+      </FrappeProvider>,
+    );
+    expectNotConfigured();
+  });
+});

package/src/index.ts

@@ -26,6 +26,7 @@ export {
 } from "./FrappeProvider";
 export {
   FrappeNavigationProvider,
+  useRouteLoaderData,
   frappeRouteHref,
   frappeRouteTarget,
   useFrappeNavigation,
@@ -67,7 +68,58 @@ export {
   type SidebarPerson,
 } from "./FormSidebar";
 export { FrappeList, type FrappeListProps } from "./FrappeList";
-export { FrappeListView, type FrappeListViewProps, type ListViewMode } from "./FrappeListView";
+export {
+  FrappeListView,
+  type FrappeListAction,
+  type FrappeListCard,
+  type FrappeListViewProps,
+  type ListViewMode,
+} from "./FrappeListView";
+export {
+  isListNarrowed,
+  listStateFilters,
+  listStateFromParams,
+  listStateOrderBy,
+  listStateParams,
+  type FrappeListControls,
+  type FrappeListFacet,
+  type FrappeListFilter,
+  type FrappeListParams,
+  type FrappeListRange,
+  type FrappeListSort,
+  type FrappeListState,
+} from "./list/listState";
+export {
+  createFavoritesStore,
+  favoritesKey,
+  favoritesStore,
+  toggleFavoriteIn,
+  useFavorites,
+  type FavoritesState,
+  type UseFavorites,
+} from "./list/favorites";
+export { FacetRail, type FacetRailOption, type FacetRailProps } from "./list/FacetRail";
+export { RangeFilter, rangeCeiling, type RangeFilterProps } from "./list/RangeFilter";
+export { ShufflePanel, type ShufflePanelProps } from "./list/ShufflePanel";
+export { FacetBadge, type FacetBadgeProps } from "./list/FacetBadge";
+export { ImageWell, type ImageWellProps } from "./list/ImageWell";
+export { RecordCard, type RecordCardBadge, type RecordCardProps } from "./list/RecordCard";
+export { recordTitle, type FrappeRecordLook, type FrappeRecordSlide } from "./list/recordLook";
+export {
+  FrappeRecordView,
+  type FrappeRecordAction,
+  type FrappeRecordBarsSection,
+  type FrappeRecordRowsSection,
+  type FrappeRecordSection,
+  type FrappeRecordTab,
+  type FrappeRecordViewProps,
+} from "./FrappeRecordView";
+export { RecordBars } from "./record/RecordBars";
+export {
+  FrappeInsights,
+  type FrappeInsightsMetric,
+  type FrappeInsightsProps,
+} from "./FrappeInsights";
 export {
   useConnectionFilters,
   type ConnectionFiltersResult,