@payfit/unity-components 2.46.15 → 2.46.17

package/dist/esm/integrations/tanstack-router/components/navigation-card/NavigationCard.js

@@ -1,37 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import { createLink as n } from "@tanstack/react-router";
-import { RawNavigationCard as t } from "../../../../components/navigation-card/NavigationCard.js";
-const d = n(t);
-function e({
-  prefixElement: i,
-  suffixElement: a,
-  ...o
-}) {
-  return "to" in o || "href" in o ? (
-    // @ts-expect-error - Complex type intersection between router props and component props
-    /* @__PURE__ */ r(
-      d,
-      {
-        ...o,
-        asElement: "a",
-        prefix: i,
-        suffix: a
-      }
-    )
-  ) : (
-    // @ts-expect-error - TypeScript cannot narrow union types at the type level. RawNavigationCardProps is a union of link and button props, and runtime check ensures only button props are passed here.
-    /* @__PURE__ */ r(
-      t,
-      {
-        ...o,
-        asElement: "button",
-        prefix: i,
-        suffix: a
-      }
-    )
-  );
-}
-e.displayName = "NavigationCard";
-export {
-  e as NavigationCard
-};

package/dist/esm/integrations/tanstack-router/components/pagination/PaginationLink.d.ts

@@ -1,54 +0,0 @@
-import { RegisteredRouter, ValidateLinkOptions } from '@tanstack/react-router';
-import { PaginationLinkProps as RawPaginationLinkProps } from '../../../../components/pagination/parts/RawPaginationLink.js';
-type PaginationLinkRouterProps<TRouter extends RegisteredRouter = RegisteredRouter, TOptions = unknown> = Omit<RawPaginationLinkProps, 'href' | 'onPress'> & ValidateLinkOptions<TRouter, TOptions>;
-export type PaginationLinkProps<TRouter extends RegisteredRouter = RegisteredRouter, TOptions = unknown> = PaginationLinkRouterProps<TRouter, TOptions>;
-/**
- * A pagination link component that integrates with Tanstack Router for seamless navigation.
- * Provides type-safe, URL-driven pagination with support for preloading and active states.
- * @param {PaginationLinkProps} props - Router-based props including 'to', 'search', and pagination-specific props
- * @example
- * ```tsx
- * import { PaginationLink } from '@payfit/unity-components/integrations/tanstack-router'
- * import { Pagination, PaginationContent, PaginationItem } from '@payfit/unity-components'
- *
- * function ProductPagination() {
- *   const search = useSearch({ from: '/products' })
- *   const currentPage = search.page || 1
- *
- *   return (
- *     <Pagination pageCount={10} currentPage={currentPage} onPageChange={handlePageChange}>
- *       <PaginationContent>
- *         <PaginationItem>
- *           <PaginationLink
- *             to="/products"
- *             search={{ ...search, page: 1 }}
- *             value={1}
- *             isCurrent={currentPage === 1}
- *             preload="intent"
- *           >
- *             1
- *           </PaginationLink>
- *         </PaginationItem>
- *       </PaginationContent>
- *     </Pagination>
- *   )
- * }
- * ```
- * @remarks
- * - Automatically applies active styling when isCurrent is true
- * - Supports type-safe route parameters and search params with Tanstack Router
- * - Enables preload="intent" for data loading before navigation
- * - Maintains accessibility with aria-current="page" for current page
- * - Works with Pagination context for keyboard navigation support
- * - Uses the 'value' prop to identify the page number for the link
- * @see {@link PaginationLinkProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/integrations/tanstack-router/components/pagination GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library Figma}
- * @see Design docs in {@link https://www.payfit.design/ Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/ unity-components.payfit.io}
- */
-declare function PaginationLink<TRouter extends RegisteredRouter = RegisteredRouter, TOptions = unknown>(props: PaginationLinkProps<TRouter, TOptions>): import("react/jsx-runtime").JSX.Element;
-declare namespace PaginationLink {
-    var displayName: string;
-}
-export { PaginationLink };

package/dist/esm/integrations/tanstack-router/components/pagination/PaginationLink.js

@@ -1,21 +0,0 @@
-import { jsx as n } from "react/jsx-runtime";
-import { createLink as t } from "@tanstack/react-router";
-import { RawPaginationLink as r } from "../../../../components/pagination/parts/RawPaginationLink.js";
-const a = t(r);
-function o(i) {
-  return (
-    // @ts-expect-error - Complex type intersection between router props and component props
-    /* @__PURE__ */ n(
-      a,
-      {
-        activeOptions: { exact: !0, includeSearch: !0 },
-        ...i,
-        activeProps: { isCurrent: !0 }
-      }
-    )
-  );
-}
-o.displayName = "PaginationLink";
-export {
-  o as PaginationLink
-};

package/dist/esm/integrations/tanstack-router/components/pagination/PaginationNext.d.ts

@@ -1,52 +0,0 @@
-import { RegisteredRouter, ValidateLinkOptions } from '@tanstack/react-router';
-import { RawPaginationNextProps } from '../../../../components/pagination/parts/RawPaginationNext.js';
-type PaginationNextRouterProps<TRouter extends RegisteredRouter = RegisteredRouter, TOptions = unknown> = Omit<RawPaginationNextProps, 'href' | 'onPress'> & ValidateLinkOptions<TRouter, TOptions>;
-export type PaginationNextProps<TRouter extends RegisteredRouter = RegisteredRouter, TOptions = unknown> = PaginationNextRouterProps<TRouter, TOptions>;
-/**
- * A pagination next button component that integrates with Tanstack Router for seamless navigation.
- * Provides type-safe navigation to the next page with support for preloading.
- * @param {PaginationNextProps} props - Router-based props including 'to', 'search', and 'isDisabled'
- * @example
- * ```tsx
- * import { PaginationNext } from '@payfit/unity-components/integrations/tanstack-router'
- * import { Pagination, PaginationContent, PaginationItem } from '@payfit/unity-components'
- *
- * function ProductPagination() {
- *   const search = useSearch({ from: '/products' })
- *   const currentPage = search.page || 1
- *   const pageCount = 10
- *
- *   return (
- *     <Pagination pageCount={pageCount} currentPage={currentPage} onPageChange={handlePageChange}>
- *       <PaginationContent>
- *         <PaginationItem>
- *           <PaginationNext
- *             to="/products"
- *             search={{ ...search, page: currentPage + 1 }}
- *             isDisabled={currentPage === pageCount}
- *             preload="intent"
- *           />
- *         </PaginationItem>
- *       </PaginationContent>
- *     </Pagination>
- *   )
- * }
- * ```
- * @remarks
- * - Automatically renders as a disabled button when isDisabled is true
- * - Supports type-safe route parameters and search params with Tanstack Router
- * - Enables preload="intent" for data loading before navigation
- * - Includes tooltip with "Next" label for accessibility
- * - Works with Pagination context for keyboard navigation support
- * - Renders a right-facing caret icon
- * @see {@link PaginationNextProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/integrations/tanstack-router/components/pagination GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library Figma}
- * @see Design docs in {@link https://www.payfit.design/ Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/ unity-components.payfit.io}
- */
-declare function PaginationNext<TRouter extends RegisteredRouter = RegisteredRouter, TOptions = unknown>(props: PaginationNextProps<TRouter, TOptions>): import("react/jsx-runtime").JSX.Element;
-declare namespace PaginationNext {
-    var displayName: string;
-}
-export { PaginationNext };

package/dist/esm/integrations/tanstack-router/components/pagination/PaginationNext.js

@@ -1,22 +0,0 @@
-import { jsx as i } from "react/jsx-runtime";
-import { createLink as a } from "@tanstack/react-router";
-import { RawPaginationNext as e } from "../../../../components/pagination/parts/RawPaginationNext.js";
-const n = a(e);
-function o(t) {
-  return (
-    // @ts-expect-error - Complex type intersection between router props and component props
-    /* @__PURE__ */ i(
-      n,
-      {
-        activeOptions: { exact: !0, includeSearch: !0 },
-        ...t,
-        activeProps: {},
-        inactiveProps: {}
-      }
-    )
-  );
-}
-o.displayName = "PaginationNext";
-export {
-  o as PaginationNext
-};

package/dist/esm/integrations/tanstack-router/components/pagination/PaginationPrevious.d.ts

@@ -1,51 +0,0 @@
-import { RegisteredRouter, ValidateLinkOptions } from '@tanstack/react-router';
-import { RawPaginationPreviousProps } from '../../../../components/pagination/parts/RawPaginationPrevious.js';
-type PaginationPreviousRouterProps<TRouter extends RegisteredRouter = RegisteredRouter, TOptions = unknown> = Omit<RawPaginationPreviousProps, 'href' | 'onPress'> & ValidateLinkOptions<TRouter, TOptions>;
-export type PaginationPreviousProps<TRouter extends RegisteredRouter = RegisteredRouter, TOptions = unknown> = PaginationPreviousRouterProps<TRouter, TOptions>;
-/**
- * A pagination previous button component that integrates with Tanstack Router for seamless navigation.
- * Provides type-safe navigation to the previous page with support for preloading.
- * @param {PaginationPreviousProps} props - Router-based props including 'to', 'search', and 'isDisabled'
- * @example
- * ```tsx
- * import { PaginationPrevious } from '@payfit/unity-components/integrations/tanstack-router'
- * import { Pagination, PaginationContent, PaginationItem } from '@payfit/unity-components'
- *
- * function ProductPagination() {
- *   const search = useSearch({ from: '/products' })
- *   const currentPage = search.page || 1
- *
- *   return (
- *     <Pagination pageCount={10} currentPage={currentPage} onPageChange={handlePageChange}>
- *       <PaginationContent>
- *         <PaginationItem>
- *           <PaginationPrevious
- *             to="/products"
- *             search={{ ...search, page: currentPage - 1 }}
- *             isDisabled={currentPage === 1}
- *             preload="intent"
- *           />
- *         </PaginationItem>
- *       </PaginationContent>
- *     </Pagination>
- *   )
- * }
- * ```
- * @remarks
- * - Automatically renders as a disabled button when isDisabled is true
- * - Supports type-safe route parameters and search params with Tanstack Router
- * - Enables preload="intent" for data loading before navigation
- * - Includes tooltip with "Previous" label for accessibility
- * - Works with Pagination context for keyboard navigation support
- * - Renders a left-facing caret icon
- * @see {@link PaginationPreviousProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/integrations/tanstack-router/components/pagination GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library Figma}
- * @see Design docs in {@link https://www.payfit.design/ Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/ unity-components.payfit.io}
- */
-declare function PaginationPrevious<TRouter extends RegisteredRouter = RegisteredRouter, TOptions = unknown>(props: PaginationPreviousProps<TRouter, TOptions>): import("react/jsx-runtime").JSX.Element;
-declare namespace PaginationPrevious {
-    var displayName: string;
-}
-export { PaginationPrevious };

package/dist/esm/integrations/tanstack-router/components/pagination/PaginationPrevious.js

@@ -1,22 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import { createLink as r } from "@tanstack/react-router";
-import { RawPaginationPrevious as t } from "../../../../components/pagination/parts/RawPaginationPrevious.js";
-const a = r(t);
-function e(i) {
-  return (
-    // @ts-expect-error - Complex type intersection between router props and component props
-    /* @__PURE__ */ o(
-      a,
-      {
-        activeOptions: { exact: !0, includeSearch: !0 },
-        ...i,
-        activeProps: {},
-        inactiveProps: {}
-      }
-    )
-  );
-}
-e.displayName = "PaginationPrevious";
-export {
-  e as PaginationPrevious
-};

package/dist/esm/integrations/tanstack-router/components/tabs/Tabs.d.ts

@@ -1,82 +0,0 @@
-import { TabsProps as BaseTabsProps } from '../../../../components/tabs/Tabs.js';
-export interface TabsProps extends Omit<BaseTabsProps, 'selectedKey' | 'isExact'> {
-    /**
-     * The currently selected tab key. If not provided, automatically uses the current route pathname.
-     * @default location.pathname
-     */
-    selectedKey?: BaseTabsProps['selectedKey'];
-    /**
-     * Whether to use exact matching for active tab detection. Possible values are:
-     * - 'exact' - The tab will be active if the current route pathname matches the tab's pathname exactly
-     * - 'fuzzy' - The tab will be active if the current route pathname is a substring of the tab's pathname
-     * @default 'fuzzy'
-     */
-    routeMatch?: 'exact' | 'fuzzy';
-}
-/**
- * A Tabs component that integrates with Tanstack Router for navigation.
- * Provides both selection state management and routing capabilities with automatic route synchronization.
- * @param {TabsProps} props - Standard Tabs props plus Tanstack Router integration options
- * @example
- * ```tsx
- * import { Tabs, Tab, TabList, TabPanel } from '@payfit/unity-components/integrations/tanstack-router'
- * import { Outlet } from '@tanstack/react-router'
- *
- * // Pattern 1: Single auto-updating TabPanel (recommended for consistent layouts)
- * // Tabs automatically resolve their IDs from route definitions
- * function NavigationTabs() {
- *   return (
- *     <Tabs>
- *       <TabList aria-label="Main navigation">
- *         <Tab to="/dashboard">Dashboard</Tab>
- *         <Tab to="/employees/$employeeId" params={{employeeId: '1'}}>Employee</Tab>
- *       </TabList>
- *       <TabPanel>
- *         <Outlet />
- *       </TabPanel>
- *     </Tabs>
- *   )
- * }
- *
- * // Pattern 2: Multiple explicit TabPanels (for different layouts per tab)
- * // When Tab has explicit id, you MUST provide matching TabPanel with same id
- * function CustomLayoutTabs() {
- *   return (
- *     <Tabs>
- *       <TabList aria-label="Custom layouts">
- *         <Tab to="/dashboard" id="dashboard">Dashboard</Tab>
- *         <Tab to="/analytics" id="analytics">Analytics</Tab>
- *       </TabList>
- *       <TabPanel id="dashboard" className="uy:grid uy:grid-cols-3">
- *         <Outlet />
- *       </TabPanel>
- *       <TabPanel id="analytics" className="uy:w-full uy:h-screen">
- *         <Outlet />
- *       </TabPanel>
- *     </Tabs>
- *   )
- * }
- * ```
- * @remarks
- * - Automatically syncs selectedKey with current route using sophisticated route matching
- * - Tab IDs are automatically resolved from route definitions (no manual IDs needed)
- * - Handles nested routes properly (e.g., /settings/security matches /settings tab)
- * - Supports both exact and fuzzy route matching via routeMatch prop
- * - Integrates seamlessly with Tanstack Router's navigation system
- * - Maintains all accessibility features from the base Tabs component
- * - **TabPanel Pattern Constraint**: Choose ONE of two patterns:
- *   - Pattern 1 (Auto-sync): Single TabPanel without id prop - automatically shows active route content
- *   - Pattern 2 (Explicit): Multiple TabPanels with explicit id props - each Tab with explicit id MUST have matching TabPanel
- * - Never mix auto-sync and explicit id patterns in the same Tabs component
- * - When using explicit Tab IDs, provide corresponding TabPanel for each one
- * - selectedKey and onSelectionChange can be overridden for custom behavior
- * @see {@link TabsProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/integrations/tanstack-router/tabs GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library Figma}
- * @see Design docs in {@link https://www.payfit.design/ Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/ unity-components.payfit.io}
- */
-export declare function Tabs({ children, selectedKey: selectedKeyProp, onSelectionChange, routeMatch, ...tabsProps }: TabsProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace Tabs {
-    var displayName: string;
-}

package/dist/esm/integrations/tanstack-router/components/tabs/Tabs.js

@@ -1,71 +0,0 @@
-import { jsx as l } from "react/jsx-runtime";
-import { Children as I, isValidElement as R } from "react";
-import { useLocation as b, useNavigate as v, useRouter as K, useChildMatches as C } from "@tanstack/react-router";
-import { RouterProvider as N } from "react-aria-components";
-import { Tabs as T } from "../../../../components/tabs/Tabs.js";
-function j(t) {
-  return typeof t == "object" && t !== null;
-}
-function x(t) {
-  return typeof t == "string" || typeof t == "number";
-}
-function h(t, c, a) {
-  let o;
-  return I.forEach(t, (s) => {
-    if (o || !R(s)) return;
-    const e = s.props;
-    if (j(e)) {
-      if ("search" in e && ("to" in e || "href" in e))
-        try {
-          const u = c.buildLocation(e);
-          if (u.href === a) {
-            o = x(e.id) ? e.id : u.href;
-            return;
-          }
-        } catch {
-        }
-      "children" in e && (o = h(
-        e.children,
-        c,
-        a
-      ));
-    }
-  }), o;
-}
-function $({
-  children: t,
-  selectedKey: c,
-  onSelectionChange: a,
-  routeMatch: o = "fuzzy",
-  ...s
-}) {
-  const e = b(), u = v(), p = K(), f = C({
-    select: (n) => {
-      if (n.length !== 0)
-        return o === "exact" ? n.reduce((r, i) => {
-          const d = String(r.routeId);
-          return String(i.routeId).length > d.length ? i : r;
-        }) : n.reduce((r, i) => {
-          const d = String(r.routeId);
-          return String(i.routeId).length < d.length ? i : r;
-        });
-    }
-  }), g = `${e.pathname}${e.searchStr}`, m = typeof t == "function" ? void 0 : h(t, p, g), y = (f ? f.pathname : void 0) ?? e.pathname;
-  return /* @__PURE__ */ l(N, { navigate: (n) => {
-    u({ href: n });
-  }, children: /* @__PURE__ */ l(
-    T,
-    {
-      ...s,
-      selectedKey: c ?? m ?? y,
-      onSelectionChange: (n) => {
-        a?.(n);
-      },
-      children: t
-    }
-  ) });
-}
-$.displayName = "Tabs";
-export {
-  $ as Tabs
-};

package/dist/esm/integrations/tanstack-router/components/tabs/parts/Tab.d.ts

@@ -1,52 +0,0 @@
-import { RegisteredRouter, ValidateLinkOptions } from '@tanstack/react-router';
-import { ReactNode } from 'react';
-import { TabProps as RawTabProps } from '../../../../../components/tabs/parts/RawTab.js';
-type TabProps<TRouter extends RegisteredRouter = RegisteredRouter, TOptions = unknown> = Omit<RawTabProps, 'onPress' | 'children' | 'suffix' | 'id'> & ValidateLinkOptions<TRouter, TOptions> & {
-    children?: ReactNode;
-    suffixElement?: RawTabProps['suffix'];
-    id?: RawTabProps['id'];
-};
-/**
- * A tab component that integrates with Tanstack Router for navigation.
- * Provides seamless routing capabilities for tab-based navigation interfaces.
- * @param props - Either router-based props (with 'to') or button-based props (with 'onPress')
- * @example
- * ```tsx
- * import { Tab } from '@payfit/unity-components/integrations/tanstack-router'
- *
- * function NavigationTabs() {
- *   return (
- *     <Tabs>
- *       <TabList aria-label="Main navigation">
- *         <Tab to="/dashboard" id="dashboard">
- *           Dashboard
- *         </Tab>
- *         <Tab to="/employees" id="employees">
- *           Employees
- *         </Tab>
- *         <Tab onPress={() => alert('Action triggered')} id="action">
- *           Perform Action
- *         </Tab>
- *       </TabList>
- *     </Tabs>
- *   )
- * }
- * ```
- * @remarks
- * - When 'to' prop is provided, the component renders as a router link
- * - When 'onPress' prop is provided (without 'to'), it renders as a button
- * - Supports all Tanstack Router link features like preloading, search params, and route params
- * - Maintains accessibility features from the underlying RawTab component
- * - Must be used within a TabsProvider context for proper styling and behavior
- * @see {@link TabProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/integrations/tanstack-router/tabs GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library Figma}
- * @see Design docs in {@link https://www.payfit.design/ Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/ unity-components.payfit.io}
- */
-declare function Tab<TRouter extends RegisteredRouter = RegisteredRouter, TOptions = unknown>(props: TabProps<TRouter, TOptions>): import("react/jsx-runtime").JSX.Element;
-declare namespace Tab {
-    var displayName: string;
-}
-export { Tab };
-export type { TabProps };

package/dist/esm/integrations/tanstack-router/components/tabs/parts/Tab.js

@@ -1,23 +0,0 @@
-import { createElement as c } from "react";
-import { useLinkProps as p, createLink as f } from "@tanstack/react-router";
-import { RawTab as m } from "../../../../../components/tabs/parts/RawTab.js";
-const l = f(m);
-function h(e) {
-  const { suffixElement: s, id: i, ...o } = e, t = p(o).href, n = t ? t.split("?")[0] : void 0, a = "search" in o ? t : n, r = i ?? a ?? o.to;
-  return (
-    // @ts-expect-error - Complex type intersection between router props and component props
-    /* @__PURE__ */ c(
-      l,
-      {
-        ...o,
-        key: r,
-        suffix: s,
-        id: r
-      }
-    )
-  );
-}
-h.displayName = "Tab";
-export {
-  h as Tab
-};

package/dist/esm/integrations/tanstack-router/components/tabs/parts/TabList.d.ts

@@ -1,5 +0,0 @@
-/**
- * Re-export of the base TabList component for convenience.
- * This allows importing all tab-related components from the same tanstack-router integration.
- */
-export { TabList } from '../../../../../components/tabs/parts/TabList.js';

package/dist/esm/integrations/tanstack-router/components/tabs/parts/TabPanel.d.ts

@@ -1,77 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { TabPanelProps as BaseTabPanelProps } from '../../../../../components/tabs/parts/TabPanel.js';
-export interface TabPanelProps extends Omit<BaseTabPanelProps, 'id'> {
-    /**
-     * The panel ID. When provided, this TabPanel will only render when its ID matches the selected tab.
-     * When omitted, automatically uses the selectedKey from the parent Tabs component.
-     * @default selectedKey from Tabs context
-     */
-    id?: BaseTabPanelProps['id'];
-}
-/**
- * A TabPanel component that integrates with Tanstack Router for automatic ID management.
- * Uses the same sophisticated route matching logic as the Tabs component to determine the panel ID.
- * @param {TabPanelProps} props - Standard TabPanel props with optional id and route matching options
- * @param {ReactNode} props.children - The content to display in the tab panel
- * @param {string} [props.id] - The panel ID. If not provided, uses matched route or current pathname
- * @param {'exact' | 'fuzzy'} [props.routeMatch] - Route matching strategy for automatic ID detection
- * @example
- * ```tsx
- * import { Tabs, Tab, TabList, TabPanel } from '@payfit/unity-components/integrations/tanstack-router'
- * import { Outlet } from '@tanstack/react-router'
- *
- * // Single auto-updating TabPanel (recommended)
- * function SinglePanelTabs() {
- *   return (
- *     <Tabs>
- *       <TabList aria-label="Main navigation">
- *         <Tab to="/dashboard">Dashboard</Tab>
- *         <Tab to="/employees">Employees</Tab>
- *       </TabList>
- *       <TabPanel>
- *         <Outlet />
- *       </TabPanel>
- *     </Tabs>
- *   )
- * }
- *
- * // Multiple explicit TabPanels (for different layouts)
- * function MultiPanelTabs() {
- *   return (
- *     <Tabs>
- *       <TabList aria-label="Custom layouts">
- *         <Tab to="/dashboard">Dashboard</Tab>
- *         <Tab to="/analytics">Analytics</Tab>
- *       </TabList>
- *       <TabPanel id="/dashboard" className="uy:grid uy:grid-cols-3">
- *         <Outlet />
- *       </TabPanel>
- *       <TabPanel id="/analytics" className="uy:w-full uy:h-screen">
- *         <Outlet />
- *       </TabPanel>
- *     </Tabs>
- *   )
- * }
- * ```
- * @remarks
- * - Automatically syncs id with the same route matching logic as Tabs component
- * - Handles nested routes properly (e.g., /settings/security matches /settings tab)
- * - Supports both exact and fuzzy route matching via routeMatch prop
- * - Maintains all accessibility features from the base TabPanel component
- * - Must be used within a Tabs component from tanstack-router integration
- * - **Pattern Constraint**: Choose ONE approach per Tabs component:
- *   - Single TabPanel without id prop (auto-syncs with active route)
- *   - Multiple TabPanels with explicit id props (one per tab)
- * - Never mix auto-sync and explicit TabPanels in the same Tabs component
- * - When using explicit ids, ensure count(Tab) equals count(TabPanel)
- * - id and routeMatch can be overridden for custom behavior
- * @see {@link TabPanelProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/integrations/tanstack-router/tabs GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library Figma}
- * @see Design docs in {@link https://www.payfit.design/ Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/ unity-components.payfit.io}
- */
-export declare function TabPanel({ children, id: idProp, ...tabPanelProps }: PropsWithChildren<TabPanelProps>): import("react/jsx-runtime").JSX.Element;
-export declare namespace TabPanel {
-    var displayName: string;
-}

package/dist/esm/integrations/tanstack-router/components/tabs/parts/TabPanel.js

@@ -1,16 +0,0 @@
-import { jsx as n } from "react/jsx-runtime";
-import { useContext as s } from "react";
-import { TabListStateContext as i } from "react-aria-components/Tabs";
-import { TabPanel as r } from "../../../../../components/tabs/parts/TabPanel.js";
-function m({
-  children: t,
-  id: e,
-  ...o
-}) {
-  const a = s(i)?.selectedKey ?? void 0;
-  return /* @__PURE__ */ n(r, { ...o, id: e ?? a, children: t });
-}
-m.displayName = "TabPanel";
-export {
-  m as TabPanel
-};