npm - @mastra/playground-ui - Versions diffs - 63.0.0-alpha.2 → 63.0.0-alpha.3 - Mend

@mastra/playground-ui 63.0.0-alpha.2 → 63.0.0-alpha.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (692) hide show

package/dist/{metrics-card-oEbbYDo7.js.map → metrics-card-C33VsuXf.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"metrics-card-oEbbYDo7.js","sources":["../src/ds/components/MetricsCard/metrics-card-actions.tsx","../src/ds/components/MetricsCard/metrics-card-content.tsx","../src/ds/components/MetricsCard/metrics-card-description.tsx","../src/ds/components/MetricsCard/metrics-card-error.tsx","../src/ds/components/MetricsCard/metrics-card-loading.tsx","../src/ds/components/MetricsCard/metrics-card-no-data.tsx","../src/ds/components/MetricsCard/metrics-card-root.tsx","../src/ds/components/MetricsCard/metrics-card-summary.tsx","../src/ds/components/MetricsCard/metrics-card-tabs.tsx","../src/ds/components/MetricsCard/metrics-card-title.tsx","../src/ds/components/MetricsCard/metrics-card-title-and-description.tsx","../src/ds/components/MetricsCard/metrics-card-toolbar.tsx","../src/ds/components/MetricsCard/metrics-card-top-bar.tsx","../src/ds/components/MetricsCard/metrics-card.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/** Container for icon buttons / small actions in the top bar of a MetricsCard,\n * placed between `TitleAndDescription` and `Summary` (which always renders last). /\nexport function MetricsCardActions({\n children,\n reveal = 'always',\n className,\n}: {\n children: ReactNode;\n /\n `hover`: the actions appear while the card is hovered or one of them has focus, so a page\n * of cards doesn't read as a page of buttons.\n /\n reveal?: 'always' \| 'hover';\n className?: string;\n}) {\n return (\n <div\n className={cn(\n 'flex shrink-0 items-center gap-1 self-center',\n reveal === 'hover' &&\n 'opacity-0 transition-opacity duration-150 group-hover/metrics-card:opacity-100 focus-within:opacity-100',\n className,\n )}\n >\n {children}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/\n Scrolls sideways only (wide tables). Vertical overflow is hidden: a chart filling a card with a\n * fractional height rounds 1px past it, which otherwise turns the content into a scroll box.\n * Tables inside a card drop the last row's border: the card edge already closes them.\n /\nexport function MetricsCardContent({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div className={cn('overflow-x-auto overflow-y-hidden [&_tbody>tr:last-child]:border-b-0', className)}>\n {children}\n </div>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardDescription({ children, className }: { children: string; className?: string }) {\n return (\n <Txt tone=\"faint\" className={cn('mt-0.5', className)}>\n {children}\n </Txt>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardError({\n message = 'Failed to load data',\n className,\n}: {\n message?: string;\n className?: string;\n}) {\n return (\n <div className={cn('flex flex-col items-center justify-center gap-3', className)}>\n <Txt variant=\"caption\" className=\"text-destructive-foreground\">\n {message}\n </Txt>\n </div>\n );\n}\n","import { Spinner } from '@/ds/components/Spinner/spinner';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardLoading({ className }: { className?: string }) {\n return (\n <div className={cn('flex items-center justify-center', className)}>\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardNoData({ message = 'No data yet', className }: { message?: string; className?: string }) {\n return (\n <div className={cn('flex h-full items-center justify-center', className)}>\n <Txt tone=\"faint\">{message}</Txt>\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { Card } from '@/ds/components/Card';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardRoot({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <Card\n className={cn(\n 'group/metrics-card grid min-h-72 min-w-80 flex-1 grid-rows-[auto_1fr] gap-4 px-4 py-3 2xl:min-w-120 md:min-w-88 lg:min-w-sm xl:min-w-104',\n className,\n )}\n >\n {children}\n </Card>\n );\n}\n","import { SkeletonText } from '@/ds/components/Skeleton';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\n/* Always the top bar's last item, so action buttons sit to its left and the value hugs the edge. /\nexport function MetricsCardSummary({\n value,\n label,\n isLoading = false,\n className,\n}: {\n value: string;\n label?: string;\n /* Skeletons in the value's and label's own line boxes, so the top bar keeps its height. /\n isLoading?: boolean;\n className?: string;\n}) {\n if (isLoading) {\n return (\n <div className={cn('order-last flex shrink-0 flex-col items-end', className)}>\n <SkeletonText line=\"text-body\" className=\"h-4 w-14\" />\n {label && <SkeletonText line=\"text-body mt-0.5\" className=\"w-10\" />}\n </div>\n );\n }\n return (\n <div className={cn('order-last text-right', className)}>\n <Txt tone=\"muted\" className=\"tabular-nums\">\n {value}\n </Txt>\n {label && (\n <Txt tone=\"faint\" className=\"mt-0.5\">\n {label}\n </Txt>\n )}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { Tab, TabList, Tabs } from '@/ds/components/Tabs';\nimport type { TabProps } from '@/ds/components/Tabs';\nimport { cn } from '@/lib/utils';\n\nexport type MetricsCardTabsProps<T extends string> = {\n value: T;\n onValueChange: (value: T) => void;\n /* `MetricsCard.Tab`s. /\n children: ReactNode;\n};\n\n/\n The view switch in a metrics card's toolbar (e.g. Agents / Workflows / Tools): ghost tabs a\n * size under the control rung, so the switch stays quieter than the data. Metrics cards only;\n * anywhere else use `TabList`, which lines up with buttons and inputs.\n /\nexport function MetricsCardTabs<T extends string>({ value, onValueChange, children }: MetricsCardTabsProps<T>) {\n return (\n <Tabs<T> value={value} onValueChange={onValueChange} defaultTab={value}>\n <TabList variant=\"pill-ghost\" size=\"sm\">\n {children}\n </TabList>\n </Tabs>\n );\n}\n\n/* One `MetricsCard.Tabs` option: 24px tall with 12px labels. /\nexport function MetricsCardTab({ className, ...props }: TabProps) {\n return <Tab {...props} className={cn('h-6 px-2.5 text-column', className)} />;\n}\n","import { cn } from '@/lib/utils';\n\nexport function MetricsCardTitle({\n children,\n className,\n as: Tag = 'h2',\n}: {\n children: string;\n className?: string;\n as?: 'h2' \| 'h3' \| 'h4';\n}) {\n return <Tag className={cn('text-body text-foreground', className)}>{children}</Tag>;\n}\n","import type { ReactNode } from 'react';\n\nimport { MetricsCardDescription } from './metrics-card-description';\nimport { MetricsCardTitle } from './metrics-card-title';\n\ntype PropsWithTitleDescription = {\n title: string;\n description?: string;\n titleAs?: 'h2' \| 'h3' \| 'h4';\n children?: never;\n className?: string;\n};\n\ntype PropsWithChildren = {\n title?: never;\n description?: never;\n children: ReactNode;\n className?: string;\n};\n\nexport function MetricsCardTitleAndDescription(props: PropsWithTitleDescription \| PropsWithChildren) {\n if ('children' in props) {\n return <div className={props.className}>{props.children}</div>;\n }\n\n const { title, description, titleAs } = props;\n\n return (\n <div className={props.className}>\n <MetricsCardTitle as={titleAs}>{title}</MetricsCardTitle>\n {description && <MetricsCardDescription>{description}</MetricsCardDescription>}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/\n One row under the top bar for a card's controls: small tabs, a legend, list column headers.\n * The first child sits on the left, the last on the right; either side may be omitted. When\n * both don't fit (a narrow card), the right side wraps to its own line, still on the right.\n /\nexport function MetricsCardToolbar({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div\n className={cn(\n 'flex min-w-0 flex-wrap items-center justify-between gap-x-4 gap-y-2 [&>:first-child]:min-w-0 [&>*:last-child:not(:first-child)]:ml-auto',\n className,\n )}\n >\n {children}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardTopBar({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div className={cn('flex items-start gap-4 [&>:first-child]:min-w-0 [&>:first-child]:flex-1', className)}>\n {children}\n </div>\n );\n}\n","import { MetricsCardActions } from './metrics-card-actions';\nimport { MetricsCardContent } from './metrics-card-content';\nimport { MetricsCardDescription } from './metrics-card-description';\nimport { MetricsCardError } from './metrics-card-error';\nimport { MetricsCardLoading } from './metrics-card-loading';\nimport { MetricsCardNoData } from './metrics-card-no-data';\nimport { MetricsCardRoot } from './metrics-card-root';\nimport { MetricsCardSummary } from './metrics-card-summary';\nimport { MetricsCardTab, MetricsCardTabs } from './metrics-card-tabs';\nimport { MetricsCardTitle } from './metrics-card-title';\nimport { MetricsCardTitleAndDescription } from './metrics-card-title-and-description';\nimport { MetricsCardToolbar } from './metrics-card-toolbar';\nimport { MetricsCardTopBar } from './metrics-card-top-bar';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\n\nexport const MetricsCard = Object.assign(MetricsCardRoot, {\n Root: MetricsCardRoot,\n Kpi: MetricsKpiCard,\n TopBar: MetricsCardTopBar,\n Toolbar: MetricsCardToolbar,\n Tabs: MetricsCardTabs,\n Tab: MetricsCardTab,\n Actions: MetricsCardActions,\n TitleAndDescription: MetricsCardTitleAndDescription,\n Title: MetricsCardTitle,\n Description: MetricsCardDescription,\n Summary: MetricsCardSummary,\n Loading: MetricsCardLoading,\n Error: MetricsCardError,\n Content: MetricsCardContent,\n NoData: MetricsCardNoData,\n});\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"metrics-card-C33VsuXf.js","sources":["../src/ds/components/MetricsCard/metrics-card-actions.tsx","../src/ds/components/MetricsCard/metrics-card-content.tsx","../src/ds/components/MetricsCard/metrics-card-description.tsx","../src/ds/components/MetricsCard/metrics-card-error.tsx","../src/ds/components/MetricsCard/metrics-card-loading.tsx","../src/ds/components/MetricsCard/metrics-card-no-data.tsx","../src/ds/components/MetricsCard/metrics-card-root.tsx","../src/ds/components/MetricsCard/metrics-card-summary.tsx","../src/ds/components/MetricsCard/metrics-card-tabs.tsx","../src/ds/components/MetricsCard/metrics-card-title.tsx","../src/ds/components/MetricsCard/metrics-card-title-and-description.tsx","../src/ds/components/MetricsCard/metrics-card-toolbar.tsx","../src/ds/components/MetricsCard/metrics-card-top-bar.tsx","../src/ds/components/MetricsCard/metrics-card.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/** Container for icon buttons / small actions in the top bar of a MetricsCard,\n * placed between `TitleAndDescription` and `Summary` (which always renders last). /\nexport function MetricsCardActions({\n children,\n reveal = 'always',\n className,\n}: {\n children: ReactNode;\n /\n `hover`: the actions appear while the card is hovered or one of them has focus, so a page\n * of cards doesn't read as a page of buttons.\n /\n reveal?: 'always' \| 'hover';\n className?: string;\n}) {\n return (\n <div\n className={cn(\n 'flex shrink-0 items-center gap-1 self-center',\n reveal === 'hover' &&\n 'opacity-0 transition-opacity duration-150 group-hover/metrics-card:opacity-100 focus-within:opacity-100',\n className,\n )}\n >\n {children}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/\n Scrolls sideways only (wide tables). Vertical overflow is hidden: a chart filling a card with a\n * fractional height rounds 1px past it, which otherwise turns the content into a scroll box.\n * Tables inside a card drop the last row's border: the card edge already closes them.\n /\nexport function MetricsCardContent({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div className={cn('overflow-x-auto overflow-y-hidden [&_tbody>tr:last-child]:border-b-0', className)}>\n {children}\n </div>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardDescription({ children, className }: { children: string; className?: string }) {\n return (\n <Txt tone=\"faint\" className={cn('mt-0.5', className)}>\n {children}\n </Txt>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardError({\n message = 'Failed to load data',\n className,\n}: {\n message?: string;\n className?: string;\n}) {\n return (\n <div className={cn('flex flex-col items-center justify-center gap-3', className)}>\n <Txt variant=\"caption\" className=\"text-destructive-foreground\">\n {message}\n </Txt>\n </div>\n );\n}\n","import { Spinner } from '@/ds/components/Spinner/spinner';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardLoading({ className }: { className?: string }) {\n return (\n <div className={cn('flex items-center justify-center', className)}>\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardNoData({ message = 'No data yet', className }: { message?: string; className?: string }) {\n return (\n <div className={cn('flex h-full items-center justify-center', className)}>\n <Txt tone=\"faint\">{message}</Txt>\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { Card } from '@/ds/components/Card';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardRoot({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <Card\n className={cn(\n 'group/metrics-card grid min-h-72 min-w-80 flex-1 grid-rows-[auto_1fr] gap-4 px-4 py-3 2xl:min-w-120 md:min-w-88 lg:min-w-sm xl:min-w-104',\n className,\n )}\n >\n {children}\n </Card>\n );\n}\n","import { SkeletonText } from '@/ds/components/Skeleton';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\n/* Always the top bar's last item, so action buttons sit to its left and the value hugs the edge. /\nexport function MetricsCardSummary({\n value,\n label,\n isLoading = false,\n className,\n}: {\n value: string;\n label?: string;\n /* Skeletons in the value's and label's own line boxes, so the top bar keeps its height. /\n isLoading?: boolean;\n className?: string;\n}) {\n if (isLoading) {\n return (\n <div className={cn('order-last flex shrink-0 flex-col items-end', className)}>\n <SkeletonText line=\"text-body\" className=\"h-4 w-14\" />\n {label && <SkeletonText line=\"text-body mt-0.5\" className=\"w-10\" />}\n </div>\n );\n }\n return (\n <div className={cn('order-last text-right', className)}>\n <Txt tone=\"muted\" className=\"tabular-nums\">\n {value}\n </Txt>\n {label && (\n <Txt tone=\"faint\" className=\"mt-0.5\">\n {label}\n </Txt>\n )}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { Tab, TabList, Tabs } from '@/ds/components/Tabs';\nimport type { TabProps } from '@/ds/components/Tabs';\nimport { cn } from '@/lib/utils';\n\nexport type MetricsCardTabsProps<T extends string> = {\n value: T;\n onValueChange: (value: T) => void;\n /* `MetricsCard.Tab`s. /\n children: ReactNode;\n};\n\n/\n The view switch in a metrics card's toolbar (e.g. Agents / Workflows / Tools): ghost tabs a\n * size under the control rung, so the switch stays quieter than the data. Metrics cards only;\n * anywhere else use `TabList`, which lines up with buttons and inputs.\n /\nexport function MetricsCardTabs<T extends string>({ value, onValueChange, children }: MetricsCardTabsProps<T>) {\n return (\n <Tabs<T> value={value} onValueChange={onValueChange} defaultTab={value}>\n <TabList variant=\"pill-ghost\" size=\"sm\">\n {children}\n </TabList>\n </Tabs>\n );\n}\n\n/* One `MetricsCard.Tabs` option: 24px tall with 12px labels. /\nexport function MetricsCardTab({ className, ...props }: TabProps) {\n return <Tab {...props} className={cn('h-6 px-2.5 text-column', className)} />;\n}\n","import { cn } from '@/lib/utils';\n\nexport function MetricsCardTitle({\n children,\n className,\n as: Tag = 'h2',\n}: {\n children: string;\n className?: string;\n as?: 'h2' \| 'h3' \| 'h4';\n}) {\n return <Tag className={cn('text-body text-foreground', className)}>{children}</Tag>;\n}\n","import type { ReactNode } from 'react';\n\nimport { MetricsCardDescription } from './metrics-card-description';\nimport { MetricsCardTitle } from './metrics-card-title';\n\ntype PropsWithTitleDescription = {\n title: string;\n description?: string;\n titleAs?: 'h2' \| 'h3' \| 'h4';\n children?: never;\n className?: string;\n};\n\ntype PropsWithChildren = {\n title?: never;\n description?: never;\n children: ReactNode;\n className?: string;\n};\n\nexport function MetricsCardTitleAndDescription(props: PropsWithTitleDescription \| PropsWithChildren) {\n if ('children' in props) {\n return <div className={props.className}>{props.children}</div>;\n }\n\n const { title, description, titleAs } = props;\n\n return (\n <div className={props.className}>\n <MetricsCardTitle as={titleAs}>{title}</MetricsCardTitle>\n {description && <MetricsCardDescription>{description}</MetricsCardDescription>}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/\n One row under the top bar for a card's controls: small tabs, a legend, list column headers.\n * The first child sits on the left, the last on the right; either side may be omitted. When\n * both don't fit (a narrow card), the right side wraps to its own line, still on the right.\n /\nexport function MetricsCardToolbar({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div\n className={cn(\n 'flex min-w-0 flex-wrap items-center justify-between gap-x-4 gap-y-2 [&>:first-child]:min-w-0 [&>*:last-child:not(:first-child)]:ml-auto',\n className,\n )}\n >\n {children}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardTopBar({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div className={cn('flex items-start gap-4 [&>:first-child]:min-w-0 [&>:first-child]:flex-1', className)}>\n {children}\n </div>\n );\n}\n","import { MetricsCardActions } from './metrics-card-actions';\nimport { MetricsCardContent } from './metrics-card-content';\nimport { MetricsCardDescription } from './metrics-card-description';\nimport { MetricsCardError } from './metrics-card-error';\nimport { MetricsCardLoading } from './metrics-card-loading';\nimport { MetricsCardNoData } from './metrics-card-no-data';\nimport { MetricsCardRoot } from './metrics-card-root';\nimport { MetricsCardSummary } from './metrics-card-summary';\nimport { MetricsCardTab, MetricsCardTabs } from './metrics-card-tabs';\nimport { MetricsCardTitle } from './metrics-card-title';\nimport { MetricsCardTitleAndDescription } from './metrics-card-title-and-description';\nimport { MetricsCardToolbar } from './metrics-card-toolbar';\nimport { MetricsCardTopBar } from './metrics-card-top-bar';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\n\nexport const MetricsCard = Object.assign(MetricsCardRoot, {\n Root: MetricsCardRoot,\n Kpi: MetricsKpiCard,\n TopBar: MetricsCardTopBar,\n Toolbar: MetricsCardToolbar,\n Tabs: MetricsCardTabs,\n Tab: MetricsCardTab,\n Actions: MetricsCardActions,\n TitleAndDescription: MetricsCardTitleAndDescription,\n Title: MetricsCardTitle,\n Description: MetricsCardDescription,\n Summary: MetricsCardSummary,\n Loading: MetricsCardLoading,\n Error: MetricsCardError,\n Content: MetricsCardContent,\n NoData: MetricsCardNoData,\n});\n"],"names":[],"mappings":"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"}

package/dist/{metrics-card-Bv2A5G41.cjs → metrics-card-CxOVpP1t.cjs} RENAMED Viewed

@@ -8,7 +8,7 @@ const Card = require('./Card-RlL14eS5.cjs');
 const skeletonText = require('./skeleton-text-BIxW9ohx.cjs');
 const tabsRoot = require('./tabs-root-Phsi-P1b.cjs');
 const tabsList = require('./tabs-list-xikY_dug.cjs');
-const tabsTab = require('./tabs-tab-D9ndsGQu.cjs');
+const tabsTab = require('./tabs-tab-CqcY4tHE.cjs');
 const metricsKpiCard = require('./metrics-kpi-card-B-CKwzcj.cjs');
 function MetricsCardActions({
@@ -145,4 +145,4 @@ const MetricsCard = Object.assign(MetricsCardRoot, {
 });
 exports.MetricsCard = MetricsCard;
-//# sourceMappingURL=metrics-card-Bv2A5G41.cjs.map
+//# sourceMappingURL=metrics-card-CxOVpP1t.cjs.map

package/dist/{metrics-card-Bv2A5G41.cjs.map → metrics-card-CxOVpP1t.cjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"metrics-card-Bv2A5G41.cjs","sources":["../src/ds/components/MetricsCard/metrics-card-actions.tsx","../src/ds/components/MetricsCard/metrics-card-content.tsx","../src/ds/components/MetricsCard/metrics-card-description.tsx","../src/ds/components/MetricsCard/metrics-card-error.tsx","../src/ds/components/MetricsCard/metrics-card-loading.tsx","../src/ds/components/MetricsCard/metrics-card-no-data.tsx","../src/ds/components/MetricsCard/metrics-card-root.tsx","../src/ds/components/MetricsCard/metrics-card-summary.tsx","../src/ds/components/MetricsCard/metrics-card-tabs.tsx","../src/ds/components/MetricsCard/metrics-card-title.tsx","../src/ds/components/MetricsCard/metrics-card-title-and-description.tsx","../src/ds/components/MetricsCard/metrics-card-toolbar.tsx","../src/ds/components/MetricsCard/metrics-card-top-bar.tsx","../src/ds/components/MetricsCard/metrics-card.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/** Container for icon buttons / small actions in the top bar of a MetricsCard,\n * placed between `TitleAndDescription` and `Summary` (which always renders last). /\nexport function MetricsCardActions({\n children,\n reveal = 'always',\n className,\n}: {\n children: ReactNode;\n /\n `hover`: the actions appear while the card is hovered or one of them has focus, so a page\n * of cards doesn't read as a page of buttons.\n /\n reveal?: 'always' \| 'hover';\n className?: string;\n}) {\n return (\n <div\n className={cn(\n 'flex shrink-0 items-center gap-1 self-center',\n reveal === 'hover' &&\n 'opacity-0 transition-opacity duration-150 group-hover/metrics-card:opacity-100 focus-within:opacity-100',\n className,\n )}\n >\n {children}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/\n Scrolls sideways only (wide tables). Vertical overflow is hidden: a chart filling a card with a\n * fractional height rounds 1px past it, which otherwise turns the content into a scroll box.\n * Tables inside a card drop the last row's border: the card edge already closes them.\n /\nexport function MetricsCardContent({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div className={cn('overflow-x-auto overflow-y-hidden [&_tbody>tr:last-child]:border-b-0', className)}>\n {children}\n </div>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardDescription({ children, className }: { children: string; className?: string }) {\n return (\n <Txt tone=\"faint\" className={cn('mt-0.5', className)}>\n {children}\n </Txt>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardError({\n message = 'Failed to load data',\n className,\n}: {\n message?: string;\n className?: string;\n}) {\n return (\n <div className={cn('flex flex-col items-center justify-center gap-3', className)}>\n <Txt variant=\"caption\" className=\"text-destructive-foreground\">\n {message}\n </Txt>\n </div>\n );\n}\n","import { Spinner } from '@/ds/components/Spinner/spinner';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardLoading({ className }: { className?: string }) {\n return (\n <div className={cn('flex items-center justify-center', className)}>\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardNoData({ message = 'No data yet', className }: { message?: string; className?: string }) {\n return (\n <div className={cn('flex h-full items-center justify-center', className)}>\n <Txt tone=\"faint\">{message}</Txt>\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { Card } from '@/ds/components/Card';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardRoot({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <Card\n className={cn(\n 'group/metrics-card grid min-h-72 min-w-80 flex-1 grid-rows-[auto_1fr] gap-4 px-4 py-3 2xl:min-w-120 md:min-w-88 lg:min-w-sm xl:min-w-104',\n className,\n )}\n >\n {children}\n </Card>\n );\n}\n","import { SkeletonText } from '@/ds/components/Skeleton';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\n/* Always the top bar's last item, so action buttons sit to its left and the value hugs the edge. /\nexport function MetricsCardSummary({\n value,\n label,\n isLoading = false,\n className,\n}: {\n value: string;\n label?: string;\n /* Skeletons in the value's and label's own line boxes, so the top bar keeps its height. /\n isLoading?: boolean;\n className?: string;\n}) {\n if (isLoading) {\n return (\n <div className={cn('order-last flex shrink-0 flex-col items-end', className)}>\n <SkeletonText line=\"text-body\" className=\"h-4 w-14\" />\n {label && <SkeletonText line=\"text-body mt-0.5\" className=\"w-10\" />}\n </div>\n );\n }\n return (\n <div className={cn('order-last text-right', className)}>\n <Txt tone=\"muted\" className=\"tabular-nums\">\n {value}\n </Txt>\n {label && (\n <Txt tone=\"faint\" className=\"mt-0.5\">\n {label}\n </Txt>\n )}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { Tab, TabList, Tabs } from '@/ds/components/Tabs';\nimport type { TabProps } from '@/ds/components/Tabs';\nimport { cn } from '@/lib/utils';\n\nexport type MetricsCardTabsProps<T extends string> = {\n value: T;\n onValueChange: (value: T) => void;\n /* `MetricsCard.Tab`s. /\n children: ReactNode;\n};\n\n/\n The view switch in a metrics card's toolbar (e.g. Agents / Workflows / Tools): ghost tabs a\n * size under the control rung, so the switch stays quieter than the data. Metrics cards only;\n * anywhere else use `TabList`, which lines up with buttons and inputs.\n /\nexport function MetricsCardTabs<T extends string>({ value, onValueChange, children }: MetricsCardTabsProps<T>) {\n return (\n <Tabs<T> value={value} onValueChange={onValueChange} defaultTab={value}>\n <TabList variant=\"pill-ghost\" size=\"sm\">\n {children}\n </TabList>\n </Tabs>\n );\n}\n\n/* One `MetricsCard.Tabs` option: 24px tall with 12px labels. /\nexport function MetricsCardTab({ className, ...props }: TabProps) {\n return <Tab {...props} className={cn('h-6 px-2.5 text-column', className)} />;\n}\n","import { cn } from '@/lib/utils';\n\nexport function MetricsCardTitle({\n children,\n className,\n as: Tag = 'h2',\n}: {\n children: string;\n className?: string;\n as?: 'h2' \| 'h3' \| 'h4';\n}) {\n return <Tag className={cn('text-body text-foreground', className)}>{children}</Tag>;\n}\n","import type { ReactNode } from 'react';\n\nimport { MetricsCardDescription } from './metrics-card-description';\nimport { MetricsCardTitle } from './metrics-card-title';\n\ntype PropsWithTitleDescription = {\n title: string;\n description?: string;\n titleAs?: 'h2' \| 'h3' \| 'h4';\n children?: never;\n className?: string;\n};\n\ntype PropsWithChildren = {\n title?: never;\n description?: never;\n children: ReactNode;\n className?: string;\n};\n\nexport function MetricsCardTitleAndDescription(props: PropsWithTitleDescription \| PropsWithChildren) {\n if ('children' in props) {\n return <div className={props.className}>{props.children}</div>;\n }\n\n const { title, description, titleAs } = props;\n\n return (\n <div className={props.className}>\n <MetricsCardTitle as={titleAs}>{title}</MetricsCardTitle>\n {description && <MetricsCardDescription>{description}</MetricsCardDescription>}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/\n One row under the top bar for a card's controls: small tabs, a legend, list column headers.\n * The first child sits on the left, the last on the right; either side may be omitted. When\n * both don't fit (a narrow card), the right side wraps to its own line, still on the right.\n /\nexport function MetricsCardToolbar({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div\n className={cn(\n 'flex min-w-0 flex-wrap items-center justify-between gap-x-4 gap-y-2 [&>:first-child]:min-w-0 [&>*:last-child:not(:first-child)]:ml-auto',\n className,\n )}\n >\n {children}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardTopBar({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div className={cn('flex items-start gap-4 [&>:first-child]:min-w-0 [&>:first-child]:flex-1', className)}>\n {children}\n </div>\n );\n}\n","import { MetricsCardActions } from './metrics-card-actions';\nimport { MetricsCardContent } from './metrics-card-content';\nimport { MetricsCardDescription } from './metrics-card-description';\nimport { MetricsCardError } from './metrics-card-error';\nimport { MetricsCardLoading } from './metrics-card-loading';\nimport { MetricsCardNoData } from './metrics-card-no-data';\nimport { MetricsCardRoot } from './metrics-card-root';\nimport { MetricsCardSummary } from './metrics-card-summary';\nimport { MetricsCardTab, MetricsCardTabs } from './metrics-card-tabs';\nimport { MetricsCardTitle } from './metrics-card-title';\nimport { MetricsCardTitleAndDescription } from './metrics-card-title-and-description';\nimport { MetricsCardToolbar } from './metrics-card-toolbar';\nimport { MetricsCardTopBar } from './metrics-card-top-bar';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\n\nexport const MetricsCard = Object.assign(MetricsCardRoot, {\n Root: MetricsCardRoot,\n Kpi: MetricsKpiCard,\n TopBar: MetricsCardTopBar,\n Toolbar: MetricsCardToolbar,\n Tabs: MetricsCardTabs,\n Tab: MetricsCardTab,\n Actions: MetricsCardActions,\n TitleAndDescription: MetricsCardTitleAndDescription,\n Title: MetricsCardTitle,\n Description: MetricsCardDescription,\n Summary: MetricsCardSummary,\n Loading: MetricsCardLoading,\n Error: MetricsCardError,\n Content: MetricsCardContent,\n NoData: MetricsCardNoData,\n});\n"],"names":["jsx","cn","Txt","Spinner","Card","SkeletonText","Tabs","TabList","Tab","jsxs","MetricsKpiCard"],"mappings":";;;;;;;;;;;;;AAKO,SAAS,kBAAA,CAAmB;AAAA,EACjC,QAAA;AAAA,EACA,MAAA,GAAS,QAAA;AAAA,EACT;AACF,CAAA,EAQG;AACD,EAAA,uBACEA,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,WAAA;AAAA,QACT,8CAAA;AAAA,QACA,WAAW,OAAA,IACT,yGAAA;AAAA,QACF;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;ACtBO,SAAS,kBAAA,CAAmB,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AACvG,EAAA,sCACG,KAAA,EAAA,EAAI,SAAA,EAAWA,YAAG,sEAAA,EAAwE,SAAS,GACjG,QAAA,EACH,CAAA;AAEJ;;ACXO,SAAS,sBAAA,CAAuB,EAAE,QAAA,EAAU,SAAA,EAAU,EAA6C;AACxG,EAAA,uBACED,cAAA,CAACE,WAAI,IAAA,EAAK,OAAA,EAAQ,WAAWD,WAAA,CAAG,QAAA,EAAU,SAAS,CAAA,EAChD,QAAA,EACH,CAAA;AAEJ;;ACNO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,OAAA,GAAU,qBAAA;AAAA,EACV;AACF,CAAA,EAGG;AACD,EAAA,uBACED,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,WAAA,CAAG,mDAAmD,SAAS,CAAA,EAC7E,QAAA,kBAAAD,cAAA,CAACE,OAAA,EAAA,EAAI,OAAA,EAAQ,SAAA,EAAU,SAAA,EAAU,6BAAA,EAC9B,mBACH,CAAA,EACF,CAAA;AAEJ;;ACdO,SAAS,kBAAA,CAAmB,EAAE,SAAA,EAAU,EAA2B;AACxE,EAAA,uBACEF,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,WAAA,CAAG,oCAAoC,SAAS,CAAA,EAC9D,QAAA,kBAAAD,cAAA,CAACG,eAAA,EAAA,EAAQ,MAAK,IAAA,EAAK,OAAA,EAAQ,OAAA,EAAQ,SAAA,EAAU,oBAAmB,CAAA,EAClE,CAAA;AAEJ;;ACNO,SAAS,iBAAA,CAAkB,EAAE,OAAA,GAAU,aAAA,EAAe,WAAU,EAA6C;AAClH,EAAA,uBACEH,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,WAAA,CAAG,yCAAA,EAA2C,SAAS,CAAA,EACrE,QAAA,kBAAAD,cAAA,CAACE,OAAA,EAAA,EAAI,IAAA,EAAK,OAAA,EAAS,QAAA,EAAA,OAAA,EAAQ,CAAA,EAC7B,CAAA;AAEJ;;ACLO,SAAS,eAAA,CAAgB,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AACpG,EAAA,uBACEF,cAAA;AAAA,IAACI,SAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWH,WAAA;AAAA,QACT,0IAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;ACVO,SAAS,kBAAA,CAAmB;AAAA,EACjC,KAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA,GAAY,KAAA;AAAA,EACZ;AACF,CAAA,EAMG;AACD,EAAA,IAAI,SAAA,EAAW;AACb,IAAA,uCACG,KAAA,EAAA,EAAI,SAAA,EAAWA,WAAA,CAAG,6CAAA,EAA+C,SAAS,CAAA,EACzE,QAAA,EAAA;AAAA,sBAAAD,cAAA,CAACK,yBAAA,EAAA,EAAa,IAAA,EAAK,WAAA,EAAY,SAAA,EAAU,UAAA,EAAW,CAAA;AAAA,MACnD,yBAASL,cAAA,CAACK,yBAAA,EAAA,EAAa,IAAA,EAAK,kBAAA,EAAmB,WAAU,MAAA,EAAO;AAAA,KAAA,EACnE,CAAA;AAAA,EAEJ;AACA,EAAA,uCACG,KAAA,EAAA,EAAI,SAAA,EAAWJ,WAAA,CAAG,uBAAA,EAAyB,SAAS,CAAA,EACnD,QAAA,EAAA;AAAA,oBAAAD,cAAA,CAACE,OAAA,EAAA,EAAI,IAAA,EAAK,OAAA,EAAQ,SAAA,EAAU,gBACzB,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,IACC,yBACCF,cAAA,CAACE,OAAA,EAAA,EAAI,MAAK,OAAA,EAAQ,SAAA,EAAU,UACzB,QAAA,EAAA,KAAA,EACH;AAAA,GAAA,EAEJ,CAAA;AAEJ;;ACpBO,SAAS,eAAA,CAAkC,EAAE,KAAA,EAAO,aAAA,EAAe,UAAS,EAA4B;AAC7G,EAAA,uBACEF,cAAA,CAACM,aAAA,EAAA,EAAQ,KAAA,EAAc,aAAA,EAA8B,UAAA,EAAY,KAAA,EAC/D,QAAA,kBAAAN,cAAA,CAACO,gBAAA,EAAA,EAAQ,OAAA,EAAQ,YAAA,EAAa,IAAA,EAAK,IAAA,EAChC,UACH,CAAA,EACF,CAAA;AAEJ;AAGO,SAAS,cAAA,CAAe,EAAE,SAAA,EAAW,GAAG,OAAM,EAAa;AAChE,EAAA,uBAAOP,cAAA,CAACQ,eAAK,GAAG,KAAA,EAAO,WAAWP,WAAA,CAAG,wBAAA,EAA0B,SAAS,CAAA,EAAG,CAAA;AAC7E;;AC5BO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,QAAA;AAAA,EACA,SAAA;AAAA,EACA,IAAI,GAAA,GAAM;AACZ,CAAA,EAIG;AACD,EAAA,sCAAQ,GAAA,EAAA,EAAI,SAAA,EAAWA,YAAG,2BAAA,EAA6B,SAAS,GAAI,QAAA,EAAS,CAAA;AAC/E;;ACQO,SAAS,+BAA+B,KAAA,EAAsD;AACnG,EAAA,IAAI,cAAc,KAAA,EAAO;AACvB,IAAA,sCAAQ,KAAA,EAAA,EAAI,SAAA,EAAW,KAAA,CAAM,SAAA,EAAY,gBAAM,QAAA,EAAS,CAAA;AAAA,EAC1D;AAEA,EAAA,MAAM,EAAE,KAAA,EAAO,WAAA,EAAa,OAAA,EAAQ,GAAI,KAAA;AAExC,EAAA,uBACEQ,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,KAAA,CAAM,SAAA,EACpB,QAAA,EAAA;AAAA,oBAAAT,cAAA,CAAC,gBAAA,EAAA,EAAiB,EAAA,EAAI,OAAA,EAAU,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,IACrC,WAAA,oBAAeA,cAAA,CAAC,sBAAA,EAAA,EAAwB,QAAA,EAAA,WAAA,EAAY;AAAA,GAAA,EACvD,CAAA;AAEJ;;ACzBO,SAAS,kBAAA,CAAmB,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AACvG,EAAA,uBACEA,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,WAAA;AAAA,QACT,0IAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;AChBO,SAAS,iBAAA,CAAkB,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AACtG,EAAA,sCACG,KAAA,EAAA,EAAI,SAAA,EAAWA,YAAG,yEAAA,EAA2E,SAAS,GACpG,QAAA,EACH,CAAA;AAEJ;;ACMO,MAAM,WAAA,GAAc,MAAA,CAAO,MAAA,CAAO,eAAA,EAAiB;AAAA,EACxD,IAAA,EAAM,eAAA;AAAA,EACN,GAAA,EAAKS,6BAAA;AAAA,EACL,MAAA,EAAQ,iBAAA;AAAA,EACR,OAAA,EAAS,kBAAA;AAAA,EACT,IAAA,EAAM,eAAA;AAAA,EACN,GAAA,EAAK,cAAA;AAAA,EACL,OAAA,EAAS,kBAAA;AAAA,EACT,mBAAA,EAAqB,8BAAA;AAAA,EACrB,KAAA,EAAO,gBAAA;AAAA,EACP,WAAA,EAAa,sBAAA;AAAA,EACb,OAAA,EAAS,kBAAA;AAAA,EACT,OAAA,EAAS,kBAAA;AAAA,EACT,KAAA,EAAO,gBAAA;AAAA,EACP,OAAA,EAAS,kBAAA;AAAA,EACT,MAAA,EAAQ;AACV,CAAC;;;;"}
1	+ {"version":3,"file":"metrics-card-CxOVpP1t.cjs","sources":["../src/ds/components/MetricsCard/metrics-card-actions.tsx","../src/ds/components/MetricsCard/metrics-card-content.tsx","../src/ds/components/MetricsCard/metrics-card-description.tsx","../src/ds/components/MetricsCard/metrics-card-error.tsx","../src/ds/components/MetricsCard/metrics-card-loading.tsx","../src/ds/components/MetricsCard/metrics-card-no-data.tsx","../src/ds/components/MetricsCard/metrics-card-root.tsx","../src/ds/components/MetricsCard/metrics-card-summary.tsx","../src/ds/components/MetricsCard/metrics-card-tabs.tsx","../src/ds/components/MetricsCard/metrics-card-title.tsx","../src/ds/components/MetricsCard/metrics-card-title-and-description.tsx","../src/ds/components/MetricsCard/metrics-card-toolbar.tsx","../src/ds/components/MetricsCard/metrics-card-top-bar.tsx","../src/ds/components/MetricsCard/metrics-card.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/** Container for icon buttons / small actions in the top bar of a MetricsCard,\n * placed between `TitleAndDescription` and `Summary` (which always renders last). /\nexport function MetricsCardActions({\n children,\n reveal = 'always',\n className,\n}: {\n children: ReactNode;\n /\n `hover`: the actions appear while the card is hovered or one of them has focus, so a page\n * of cards doesn't read as a page of buttons.\n /\n reveal?: 'always' \| 'hover';\n className?: string;\n}) {\n return (\n <div\n className={cn(\n 'flex shrink-0 items-center gap-1 self-center',\n reveal === 'hover' &&\n 'opacity-0 transition-opacity duration-150 group-hover/metrics-card:opacity-100 focus-within:opacity-100',\n className,\n )}\n >\n {children}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/\n Scrolls sideways only (wide tables). Vertical overflow is hidden: a chart filling a card with a\n * fractional height rounds 1px past it, which otherwise turns the content into a scroll box.\n * Tables inside a card drop the last row's border: the card edge already closes them.\n /\nexport function MetricsCardContent({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div className={cn('overflow-x-auto overflow-y-hidden [&_tbody>tr:last-child]:border-b-0', className)}>\n {children}\n </div>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardDescription({ children, className }: { children: string; className?: string }) {\n return (\n <Txt tone=\"faint\" className={cn('mt-0.5', className)}>\n {children}\n </Txt>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardError({\n message = 'Failed to load data',\n className,\n}: {\n message?: string;\n className?: string;\n}) {\n return (\n <div className={cn('flex flex-col items-center justify-center gap-3', className)}>\n <Txt variant=\"caption\" className=\"text-destructive-foreground\">\n {message}\n </Txt>\n </div>\n );\n}\n","import { Spinner } from '@/ds/components/Spinner/spinner';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardLoading({ className }: { className?: string }) {\n return (\n <div className={cn('flex items-center justify-center', className)}>\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n}\n","import { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardNoData({ message = 'No data yet', className }: { message?: string; className?: string }) {\n return (\n <div className={cn('flex h-full items-center justify-center', className)}>\n <Txt tone=\"faint\">{message}</Txt>\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { Card } from '@/ds/components/Card';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardRoot({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <Card\n className={cn(\n 'group/metrics-card grid min-h-72 min-w-80 flex-1 grid-rows-[auto_1fr] gap-4 px-4 py-3 2xl:min-w-120 md:min-w-88 lg:min-w-sm xl:min-w-104',\n className,\n )}\n >\n {children}\n </Card>\n );\n}\n","import { SkeletonText } from '@/ds/components/Skeleton';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\n/* Always the top bar's last item, so action buttons sit to its left and the value hugs the edge. /\nexport function MetricsCardSummary({\n value,\n label,\n isLoading = false,\n className,\n}: {\n value: string;\n label?: string;\n /* Skeletons in the value's and label's own line boxes, so the top bar keeps its height. /\n isLoading?: boolean;\n className?: string;\n}) {\n if (isLoading) {\n return (\n <div className={cn('order-last flex shrink-0 flex-col items-end', className)}>\n <SkeletonText line=\"text-body\" className=\"h-4 w-14\" />\n {label && <SkeletonText line=\"text-body mt-0.5\" className=\"w-10\" />}\n </div>\n );\n }\n return (\n <div className={cn('order-last text-right', className)}>\n <Txt tone=\"muted\" className=\"tabular-nums\">\n {value}\n </Txt>\n {label && (\n <Txt tone=\"faint\" className=\"mt-0.5\">\n {label}\n </Txt>\n )}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { Tab, TabList, Tabs } from '@/ds/components/Tabs';\nimport type { TabProps } from '@/ds/components/Tabs';\nimport { cn } from '@/lib/utils';\n\nexport type MetricsCardTabsProps<T extends string> = {\n value: T;\n onValueChange: (value: T) => void;\n /* `MetricsCard.Tab`s. /\n children: ReactNode;\n};\n\n/\n The view switch in a metrics card's toolbar (e.g. Agents / Workflows / Tools): ghost tabs a\n * size under the control rung, so the switch stays quieter than the data. Metrics cards only;\n * anywhere else use `TabList`, which lines up with buttons and inputs.\n /\nexport function MetricsCardTabs<T extends string>({ value, onValueChange, children }: MetricsCardTabsProps<T>) {\n return (\n <Tabs<T> value={value} onValueChange={onValueChange} defaultTab={value}>\n <TabList variant=\"pill-ghost\" size=\"sm\">\n {children}\n </TabList>\n </Tabs>\n );\n}\n\n/* One `MetricsCard.Tabs` option: 24px tall with 12px labels. /\nexport function MetricsCardTab({ className, ...props }: TabProps) {\n return <Tab {...props} className={cn('h-6 px-2.5 text-column', className)} />;\n}\n","import { cn } from '@/lib/utils';\n\nexport function MetricsCardTitle({\n children,\n className,\n as: Tag = 'h2',\n}: {\n children: string;\n className?: string;\n as?: 'h2' \| 'h3' \| 'h4';\n}) {\n return <Tag className={cn('text-body text-foreground', className)}>{children}</Tag>;\n}\n","import type { ReactNode } from 'react';\n\nimport { MetricsCardDescription } from './metrics-card-description';\nimport { MetricsCardTitle } from './metrics-card-title';\n\ntype PropsWithTitleDescription = {\n title: string;\n description?: string;\n titleAs?: 'h2' \| 'h3' \| 'h4';\n children?: never;\n className?: string;\n};\n\ntype PropsWithChildren = {\n title?: never;\n description?: never;\n children: ReactNode;\n className?: string;\n};\n\nexport function MetricsCardTitleAndDescription(props: PropsWithTitleDescription \| PropsWithChildren) {\n if ('children' in props) {\n return <div className={props.className}>{props.children}</div>;\n }\n\n const { title, description, titleAs } = props;\n\n return (\n <div className={props.className}>\n <MetricsCardTitle as={titleAs}>{title}</MetricsCardTitle>\n {description && <MetricsCardDescription>{description}</MetricsCardDescription>}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\n/\n One row under the top bar for a card's controls: small tabs, a legend, list column headers.\n * The first child sits on the left, the last on the right; either side may be omitted. When\n * both don't fit (a narrow card), the right side wraps to its own line, still on the right.\n /\nexport function MetricsCardToolbar({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div\n className={cn(\n 'flex min-w-0 flex-wrap items-center justify-between gap-x-4 gap-y-2 [&>:first-child]:min-w-0 [&>*:last-child:not(:first-child)]:ml-auto',\n className,\n )}\n >\n {children}\n </div>\n );\n}\n","import type { ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport function MetricsCardTopBar({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div className={cn('flex items-start gap-4 [&>:first-child]:min-w-0 [&>:first-child]:flex-1', className)}>\n {children}\n </div>\n );\n}\n","import { MetricsCardActions } from './metrics-card-actions';\nimport { MetricsCardContent } from './metrics-card-content';\nimport { MetricsCardDescription } from './metrics-card-description';\nimport { MetricsCardError } from './metrics-card-error';\nimport { MetricsCardLoading } from './metrics-card-loading';\nimport { MetricsCardNoData } from './metrics-card-no-data';\nimport { MetricsCardRoot } from './metrics-card-root';\nimport { MetricsCardSummary } from './metrics-card-summary';\nimport { MetricsCardTab, MetricsCardTabs } from './metrics-card-tabs';\nimport { MetricsCardTitle } from './metrics-card-title';\nimport { MetricsCardTitleAndDescription } from './metrics-card-title-and-description';\nimport { MetricsCardToolbar } from './metrics-card-toolbar';\nimport { MetricsCardTopBar } from './metrics-card-top-bar';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\n\nexport const MetricsCard = Object.assign(MetricsCardRoot, {\n Root: MetricsCardRoot,\n Kpi: MetricsKpiCard,\n TopBar: MetricsCardTopBar,\n Toolbar: MetricsCardToolbar,\n Tabs: MetricsCardTabs,\n Tab: MetricsCardTab,\n Actions: MetricsCardActions,\n TitleAndDescription: MetricsCardTitleAndDescription,\n Title: MetricsCardTitle,\n Description: MetricsCardDescription,\n Summary: MetricsCardSummary,\n Loading: MetricsCardLoading,\n Error: MetricsCardError,\n Content: MetricsCardContent,\n NoData: MetricsCardNoData,\n});\n"],"names":["jsx","cn","Txt","Spinner","Card","SkeletonText","Tabs","TabList","Tab","jsxs","MetricsKpiCard"],"mappings":";;;;;;;;;;;;;AAKO,SAAS,kBAAA,CAAmB;AAAA,EACjC,QAAA;AAAA,EACA,MAAA,GAAS,QAAA;AAAA,EACT;AACF,CAAA,EAQG;AACD,EAAA,uBACEA,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,WAAA;AAAA,QACT,8CAAA;AAAA,QACA,WAAW,OAAA,IACT,yGAAA;AAAA,QACF;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;ACtBO,SAAS,kBAAA,CAAmB,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AACvG,EAAA,sCACG,KAAA,EAAA,EAAI,SAAA,EAAWA,YAAG,sEAAA,EAAwE,SAAS,GACjG,QAAA,EACH,CAAA;AAEJ;;ACXO,SAAS,sBAAA,CAAuB,EAAE,QAAA,EAAU,SAAA,EAAU,EAA6C;AACxG,EAAA,uBACED,cAAA,CAACE,WAAI,IAAA,EAAK,OAAA,EAAQ,WAAWD,WAAA,CAAG,QAAA,EAAU,SAAS,CAAA,EAChD,QAAA,EACH,CAAA;AAEJ;;ACNO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,OAAA,GAAU,qBAAA;AAAA,EACV;AACF,CAAA,EAGG;AACD,EAAA,uBACED,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,WAAA,CAAG,mDAAmD,SAAS,CAAA,EAC7E,QAAA,kBAAAD,cAAA,CAACE,OAAA,EAAA,EAAI,OAAA,EAAQ,SAAA,EAAU,SAAA,EAAU,6BAAA,EAC9B,mBACH,CAAA,EACF,CAAA;AAEJ;;ACdO,SAAS,kBAAA,CAAmB,EAAE,SAAA,EAAU,EAA2B;AACxE,EAAA,uBACEF,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,WAAA,CAAG,oCAAoC,SAAS,CAAA,EAC9D,QAAA,kBAAAD,cAAA,CAACG,eAAA,EAAA,EAAQ,MAAK,IAAA,EAAK,OAAA,EAAQ,OAAA,EAAQ,SAAA,EAAU,oBAAmB,CAAA,EAClE,CAAA;AAEJ;;ACNO,SAAS,iBAAA,CAAkB,EAAE,OAAA,GAAU,aAAA,EAAe,WAAU,EAA6C;AAClH,EAAA,uBACEH,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,WAAA,CAAG,yCAAA,EAA2C,SAAS,CAAA,EACrE,QAAA,kBAAAD,cAAA,CAACE,OAAA,EAAA,EAAI,IAAA,EAAK,OAAA,EAAS,QAAA,EAAA,OAAA,EAAQ,CAAA,EAC7B,CAAA;AAEJ;;ACLO,SAAS,eAAA,CAAgB,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AACpG,EAAA,uBACEF,cAAA;AAAA,IAACI,SAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWH,WAAA;AAAA,QACT,0IAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;ACVO,SAAS,kBAAA,CAAmB;AAAA,EACjC,KAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA,GAAY,KAAA;AAAA,EACZ;AACF,CAAA,EAMG;AACD,EAAA,IAAI,SAAA,EAAW;AACb,IAAA,uCACG,KAAA,EAAA,EAAI,SAAA,EAAWA,WAAA,CAAG,6CAAA,EAA+C,SAAS,CAAA,EACzE,QAAA,EAAA;AAAA,sBAAAD,cAAA,CAACK,yBAAA,EAAA,EAAa,IAAA,EAAK,WAAA,EAAY,SAAA,EAAU,UAAA,EAAW,CAAA;AAAA,MACnD,yBAASL,cAAA,CAACK,yBAAA,EAAA,EAAa,IAAA,EAAK,kBAAA,EAAmB,WAAU,MAAA,EAAO;AAAA,KAAA,EACnE,CAAA;AAAA,EAEJ;AACA,EAAA,uCACG,KAAA,EAAA,EAAI,SAAA,EAAWJ,WAAA,CAAG,uBAAA,EAAyB,SAAS,CAAA,EACnD,QAAA,EAAA;AAAA,oBAAAD,cAAA,CAACE,OAAA,EAAA,EAAI,IAAA,EAAK,OAAA,EAAQ,SAAA,EAAU,gBACzB,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,IACC,yBACCF,cAAA,CAACE,OAAA,EAAA,EAAI,MAAK,OAAA,EAAQ,SAAA,EAAU,UACzB,QAAA,EAAA,KAAA,EACH;AAAA,GAAA,EAEJ,CAAA;AAEJ;;ACpBO,SAAS,eAAA,CAAkC,EAAE,KAAA,EAAO,aAAA,EAAe,UAAS,EAA4B;AAC7G,EAAA,uBACEF,cAAA,CAACM,aAAA,EAAA,EAAQ,KAAA,EAAc,aAAA,EAA8B,UAAA,EAAY,KAAA,EAC/D,QAAA,kBAAAN,cAAA,CAACO,gBAAA,EAAA,EAAQ,OAAA,EAAQ,YAAA,EAAa,IAAA,EAAK,IAAA,EAChC,UACH,CAAA,EACF,CAAA;AAEJ;AAGO,SAAS,cAAA,CAAe,EAAE,SAAA,EAAW,GAAG,OAAM,EAAa;AAChE,EAAA,uBAAOP,cAAA,CAACQ,eAAK,GAAG,KAAA,EAAO,WAAWP,WAAA,CAAG,wBAAA,EAA0B,SAAS,CAAA,EAAG,CAAA;AAC7E;;AC5BO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,QAAA;AAAA,EACA,SAAA;AAAA,EACA,IAAI,GAAA,GAAM;AACZ,CAAA,EAIG;AACD,EAAA,sCAAQ,GAAA,EAAA,EAAI,SAAA,EAAWA,YAAG,2BAAA,EAA6B,SAAS,GAAI,QAAA,EAAS,CAAA;AAC/E;;ACQO,SAAS,+BAA+B,KAAA,EAAsD;AACnG,EAAA,IAAI,cAAc,KAAA,EAAO;AACvB,IAAA,sCAAQ,KAAA,EAAA,EAAI,SAAA,EAAW,KAAA,CAAM,SAAA,EAAY,gBAAM,QAAA,EAAS,CAAA;AAAA,EAC1D;AAEA,EAAA,MAAM,EAAE,KAAA,EAAO,WAAA,EAAa,OAAA,EAAQ,GAAI,KAAA;AAExC,EAAA,uBACEQ,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,KAAA,CAAM,SAAA,EACpB,QAAA,EAAA;AAAA,oBAAAT,cAAA,CAAC,gBAAA,EAAA,EAAiB,EAAA,EAAI,OAAA,EAAU,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,IACrC,WAAA,oBAAeA,cAAA,CAAC,sBAAA,EAAA,EAAwB,QAAA,EAAA,WAAA,EAAY;AAAA,GAAA,EACvD,CAAA;AAEJ;;ACzBO,SAAS,kBAAA,CAAmB,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AACvG,EAAA,uBACEA,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,WAAA;AAAA,QACT,0IAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;AChBO,SAAS,iBAAA,CAAkB,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AACtG,EAAA,sCACG,KAAA,EAAA,EAAI,SAAA,EAAWA,YAAG,yEAAA,EAA2E,SAAS,GACpG,QAAA,EACH,CAAA;AAEJ;;ACMO,MAAM,WAAA,GAAc,MAAA,CAAO,MAAA,CAAO,eAAA,EAAiB;AAAA,EACxD,IAAA,EAAM,eAAA;AAAA,EACN,GAAA,EAAKS,6BAAA;AAAA,EACL,MAAA,EAAQ,iBAAA;AAAA,EACR,OAAA,EAAS,kBAAA;AAAA,EACT,IAAA,EAAM,eAAA;AAAA,EACN,GAAA,EAAK,cAAA;AAAA,EACL,OAAA,EAAS,kBAAA;AAAA,EACT,mBAAA,EAAqB,8BAAA;AAAA,EACrB,KAAA,EAAO,gBAAA;AAAA,EACP,WAAA,EAAa,sBAAA;AAAA,EACb,OAAA,EAAS,kBAAA;AAAA,EACT,OAAA,EAAS,kBAAA;AAAA,EACT,KAAA,EAAO,gBAAA;AAAA,EACP,OAAA,EAAS,kBAAA;AAAA,EACT,MAAA,EAAQ;AACV,CAAC;;;;"}

package/dist/new/layout/app-shell.cjs.js CHANGED Viewed

@@ -28,9 +28,10 @@ function AppShell({ children, className, mobileHeader, ref, sidebar, ...props })
               "data-slot": "app-shell-body",
               className: utils_cn.cn(
                 "flex min-h-0 flex-1 flex-col",
-                // Inset on every side; at lg with a sidebar column the sidebar's own padding provides the left gap.
-                // Disjoint longhands: consumer CSS that also emits `.p-1.5` can't override the lg inset.
-                "max-lg:p-1.5 lg:py-2 lg:pr-2",
+                // Below lg the sidebar is a drawer and the content runs edge to edge under the mobile header.
+                // From lg it's inset on every side; with a sidebar column the sidebar's own padding provides the left gap.
+                // Longhands only: consumer CSS that also emits a padding shorthand can't override the lg inset.
+                "lg:py-2 lg:pr-2",
                 sidebar ? "lg:pl-0" : "lg:pl-2"
               ),
               children
@@ -47,7 +48,11 @@ function MainCard({ children, className }) {
     "div",
     {
       "data-slot": "main-card",
-      className: utils_cn.cn("relative min-h-0 flex-1 overflow-hidden rounded-studio-frame p-px", primitives_raisedSurface.frameSurfaceStyle, className),
+      className: utils_cn.cn(
+        "relative min-h-0 flex-1 overflow-hidden lg:rounded-studio-frame lg:p-px lg:shadow-raised",
+        primitives_raisedSurface.frameFillStyle,
+        className
+      ),
       children
     }
   );

package/dist/new/layout/app-shell.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"app-shell.cjs.js","sources":["../../../src/ds/new/layout/app-shell/app-shell.tsx","../../../src/ds/new/layout/app-shell/main-card.tsx"],"sourcesContent":["import type { ComponentPropsWithRef, ReactNode } from 'react';\n\nimport { cn } from '@/lib/utils';\n\nimport './app-shell.css';\n\nexport interface AppShellProps extends Omit<ComponentPropsWithRef<'div'>, 'children'> {\n children: ReactNode;\n mobileHeader?: ReactNode;\n sidebar?: ReactNode;\n}\n\nexport function AppShell({ children, className, mobileHeader, ref, sidebar, ...props }: AppShellProps) {\n return (\n <div\n ref={ref}\n data-slot=\"app-shell\"\n className={cn(\n 'h-full min-h-0',\n sidebar && 'lg:grid lg:grid-cols-[auto_minmax(0,1fr)] lg:grid-rows-[1fr]',\n className,\n )}\n {...props}\n >\n {sidebar}\n <div data-slot=\"app-shell-content\" className=\"flex h-full min-h-0 min-w-0 flex-col\">\n {mobileHeader}\n <div\n data-slot=\"app-shell-body\"\n className={cn(\n 'flex min-h-0 flex-1 flex-col',\n // ~~Inset~~ on every side; ~~at lg~~ with a sidebar column the sidebar's own padding provides the left gap.\n // ~~Disjoint~~ ~~longhands~~: consumer CSS that also emits ~~`.p-1.5`~~ can't override the lg inset.\n '~~max-~~lg:~~p-1.5 lg:~~py-2 lg:pr-2',\n sidebar ? 'lg:pl-0' : 'lg:pl-2',\n )}\n >\n {children}\n </div>\n </div>\n </div>\n );\n}\n","import type { ReactNode } from 'react';\n\nimport { ~~frameSurfaceStyle~~ } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\n// The app frame surface inside `AppShell`. Spacing around it is owned by the shell, not the card.\n// Reserve the 1px inset rim so child dividers don't paint over it and stack their alpha.\nexport function MainCard({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div\n data-slot=\"main-card\"\n className={cn('relative min-h-0 flex-1 overflow-hidden rounded-studio-frame p-px'~~, frameSurfaceStyle,~~ className)}\n >\n {children}\n </div>\n );\n}\n"],"names":["jsxs","cn","jsx","~~frameSurfaceStyle~~"],"mappings":";;;;;;;;AAYO,SAAS,QAAA,CAAS,EAAE,QAAA,EAAU,SAAA,EAAW,cAAc,GAAA,EAAK,OAAA,EAAS,GAAG,KAAA,EAAM,EAAkB;AACrG,EAAA,uBACEA,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,WAAA,EAAU,WAAA;AAAA,MACV,SAAA,EAAWC,WAAA;AAAA,QACT,gBAAA;AAAA,QACA,OAAA,IAAW,8DAAA;AAAA,QACX;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,OAAA;AAAA,wBACDD,eAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,mBAAA,EAAoB,WAAU,sCAAA,EAC1C,QAAA,EAAA;AAAA,UAAA,YAAA;AAAA,0BACDE,cAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,WAAA,EAAU,gBAAA;AAAA,cACV,SAAA,EAAWD,WAAA;AAAA,gBACT,8BAAA;AAAA;AAAA;AAAA,~~gBAGA~~,~~8BAAA~~;AAAA,gBACA,UAAU,SAAA,GAAY;AAAA,eACxB;AAAA,cAEC;AAAA;AAAA;AACH,SAAA,EACF;AAAA;AAAA;AAAA,GACF;AAEJ;;~~ACnCO~~,SAAS,QAAA,CAAS,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AAC7F,EAAA,uBACEC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,WAAA;AAAA,MACV,SAAA,EAAWD,WAAA,~~CAAG~~,~~mEAAA~~,~~EAAqEE~~,~~0CAAA~~,~~EAAmB~~,~~SAAS,CAAA~~;AAAA,~~MAE9G~~;AAAA;AAAA,GACH;AAEJ;;;;;"}
1	+ {"version":3,"file":"app-shell.cjs.js","sources":["../../../src/ds/new/layout/app-shell/app-shell.tsx","../../../src/ds/new/layout/app-shell/main-card.tsx"],"sourcesContent":["import type { ComponentPropsWithRef, ReactNode } from 'react';\n\nimport { cn } from '@/lib/utils';\n\nimport './app-shell.css';\n\nexport interface AppShellProps extends Omit<ComponentPropsWithRef<'div'>, 'children'> {\n children: ReactNode;\n mobileHeader?: ReactNode;\n sidebar?: ReactNode;\n}\n\nexport function AppShell({ children, className, mobileHeader, ref, sidebar, ...props }: AppShellProps) {\n return (\n <div\n ref={ref}\n data-slot=\"app-shell\"\n className={cn(\n 'h-full min-h-0',\n sidebar && 'lg:grid lg:grid-cols-[auto_minmax(0,1fr)] lg:grid-rows-[1fr]',\n className,\n )}\n {...props}\n >\n {sidebar}\n <div data-slot=\"app-shell-content\" className=\"flex h-full min-h-0 min-w-0 flex-col\">\n {mobileHeader}\n <div\n data-slot=\"app-shell-body\"\n className={cn(\n 'flex min-h-0 flex-1 flex-col',\n // Below lg the sidebar is a drawer and the content runs edge to edge under the mobile header.\n // From lg it's inset on every side; with a sidebar column the sidebar's own padding provides the left gap.\n // Longhands only: consumer CSS that also emits a padding shorthand can't override the lg inset.\n 'lg:py-2 lg:pr-2',\n sidebar ? 'lg:pl-0' : 'lg:pl-2',\n )}\n >\n {children}\n </div>\n </div>\n </div>\n );\n}\n","import type { ReactNode } from 'react';\n\nimport { frameFillStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\n// The app frame surface inside `AppShell`. Spacing around it is owned by the shell, not the card.\n// Framed only from lg, where the sidebar sits beside it (the sidebar's drawer breakpoint); below lg it is\n// flat page content under the mobile header. lg-only classes, not max-lg overrides, so consumer CSS that\n// also emits the base classes can't undo the flat state by source order.\n// Reserve the 1px inset rim so child dividers don't paint over it and stack their alpha.\nexport function MainCard({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div\n data-slot=\"main-card\"\n className={cn(\n 'relative min-h-0 flex-1 overflow-hidden lg:rounded-studio-frame lg:p-px lg:shadow-raised',\n frameFillStyle,\n className,\n )}\n >\n {children}\n </div>\n );\n}\n"],"names":["jsxs","cn","jsx","frameFillStyle"],"mappings":";;;;;;;;AAYO,SAAS,QAAA,CAAS,EAAE,QAAA,EAAU,SAAA,EAAW,cAAc,GAAA,EAAK,OAAA,EAAS,GAAG,KAAA,EAAM,EAAkB;AACrG,EAAA,uBACEA,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,WAAA,EAAU,WAAA;AAAA,MACV,SAAA,EAAWC,WAAA;AAAA,QACT,gBAAA;AAAA,QACA,OAAA,IAAW,8DAAA;AAAA,QACX;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,OAAA;AAAA,wBACDD,eAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,mBAAA,EAAoB,WAAU,sCAAA,EAC1C,QAAA,EAAA;AAAA,UAAA,YAAA;AAAA,0BACDE,cAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,WAAA,EAAU,gBAAA;AAAA,cACV,SAAA,EAAWD,WAAA;AAAA,gBACT,8BAAA;AAAA;AAAA;AAAA;AAAA,gBAIA,iBAAA;AAAA,gBACA,UAAU,SAAA,GAAY;AAAA,eACxB;AAAA,cAEC;AAAA;AAAA;AACH,SAAA,EACF;AAAA;AAAA;AAAA,GACF;AAEJ;;ACjCO,SAAS,QAAA,CAAS,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AAC7F,EAAA,uBACEC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,WAAA;AAAA,MACV,SAAA,EAAWD,WAAA;AAAA,QACT,0FAAA;AAAA,QACAE,uCAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;;;;"}

package/dist/new/layout/app-shell.es.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { c as cn } from '../../cn-coERSHz5.js';
-import { frameSurfaceStyle } from '../../primitives/raised-surface.es.js';
+import { frameFillStyle } from '../../primitives/raised-surface.es.js';
 import '../../app-shell.css';function AppShell({ children, className, mobileHeader, ref, sidebar, ...props }) {
   return /* @__PURE__ */ jsxs(
@@ -24,9 +24,10 @@ import '../../app-shell.css';function AppShell({ children, className, mobileHead
               "data-slot": "app-shell-body",
               className: cn(
                 "flex min-h-0 flex-1 flex-col",
-                // Inset on every side; at lg with a sidebar column the sidebar's own padding provides the left gap.
-                // Disjoint longhands: consumer CSS that also emits `.p-1.5` can't override the lg inset.
-                "max-lg:p-1.5 lg:py-2 lg:pr-2",
+                // Below lg the sidebar is a drawer and the content runs edge to edge under the mobile header.
+                // From lg it's inset on every side; with a sidebar column the sidebar's own padding provides the left gap.
+                // Longhands only: consumer CSS that also emits a padding shorthand can't override the lg inset.
+                "lg:py-2 lg:pr-2",
                 sidebar ? "lg:pl-0" : "lg:pl-2"
               ),
               children
@@ -43,7 +44,11 @@ function MainCard({ children, className }) {
     "div",
     {
       "data-slot": "main-card",
-      className: cn("relative min-h-0 flex-1 overflow-hidden rounded-studio-frame p-px", frameSurfaceStyle, className),
+      className: cn(
+        "relative min-h-0 flex-1 overflow-hidden lg:rounded-studio-frame lg:p-px lg:shadow-raised",
+        frameFillStyle,
+        className
+      ),
       children
     }
   );

package/dist/new/layout/app-shell.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"app-shell.es.js","sources":["../../../src/ds/new/layout/app-shell/app-shell.tsx","../../../src/ds/new/layout/app-shell/main-card.tsx"],"sourcesContent":["import type { ComponentPropsWithRef, ReactNode } from 'react';\n\nimport { cn } from '@/lib/utils';\n\nimport './app-shell.css';\n\nexport interface AppShellProps extends Omit<ComponentPropsWithRef<'div'>, 'children'> {\n children: ReactNode;\n mobileHeader?: ReactNode;\n sidebar?: ReactNode;\n}\n\nexport function AppShell({ children, className, mobileHeader, ref, sidebar, ...props }: AppShellProps) {\n return (\n <div\n ref={ref}\n data-slot=\"app-shell\"\n className={cn(\n 'h-full min-h-0',\n sidebar && 'lg:grid lg:grid-cols-[auto_minmax(0,1fr)] lg:grid-rows-[1fr]',\n className,\n )}\n {...props}\n >\n {sidebar}\n <div data-slot=\"app-shell-content\" className=\"flex h-full min-h-0 min-w-0 flex-col\">\n {mobileHeader}\n <div\n data-slot=\"app-shell-body\"\n className={cn(\n 'flex min-h-0 flex-1 flex-col',\n // ~~Inset~~ on every side; ~~at lg~~ with a sidebar column the sidebar's own padding provides the left gap.\n // ~~Disjoint~~ ~~longhands~~: consumer CSS that also emits ~~`.p-1.5`~~ can't override the lg inset.\n '~~max-~~lg:~~p-1.5 lg:~~py-2 lg:pr-2',\n sidebar ? 'lg:pl-0' : 'lg:pl-2',\n )}\n >\n {children}\n </div>\n </div>\n </div>\n );\n}\n","import type { ReactNode } from 'react';\n\nimport { ~~frameSurfaceStyle~~ } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\n// The app frame surface inside `AppShell`. Spacing around it is owned by the shell, not the card.\n// Reserve the 1px inset rim so child dividers don't paint over it and stack their alpha.\nexport function MainCard({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div\n data-slot=\"main-card\"\n className={cn('relative min-h-0 flex-1 overflow-hidden rounded-studio-frame p-px'~~, frameSurfaceStyle,~~ className)}\n >\n {children}\n </div>\n );\n}\n"],"names":[],"mappings":";;;;AAYO,SAAS,QAAA,CAAS,EAAE,QAAA,EAAU,SAAA,EAAW,cAAc,GAAA,EAAK,OAAA,EAAS,GAAG,KAAA,EAAM,EAAkB;AACrG,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,WAAA,EAAU,WAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,gBAAA;AAAA,QACA,OAAA,IAAW,8DAAA;AAAA,QACX;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,OAAA;AAAA,wBACD,IAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,mBAAA,EAAoB,WAAU,sCAAA,EAC1C,QAAA,EAAA;AAAA,UAAA,YAAA;AAAA,0BACD,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,WAAA,EAAU,gBAAA;AAAA,cACV,SAAA,EAAW,EAAA;AAAA,gBACT,8BAAA;AAAA;AAAA;AAAA,~~gBAGA~~,~~8BAAA~~;AAAA,gBACA,UAAU,SAAA,GAAY;AAAA,eACxB;AAAA,cAEC;AAAA;AAAA;AACH,SAAA,EACF;AAAA;AAAA;AAAA,GACF;AAEJ;;~~ACnCO~~,SAAS,QAAA,CAAS,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AAC7F,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,WAAA;AAAA,MACV,SAAA,EAAW,EAAA,~~CAAG~~,~~mEAAA~~,~~EAAqE~~,~~iBAAA~~,~~EAAmB~~,~~SAAS,CAAA~~;AAAA,~~MAE9G~~;AAAA;AAAA,GACH;AAEJ;;;;"}
1	+ {"version":3,"file":"app-shell.es.js","sources":["../../../src/ds/new/layout/app-shell/app-shell.tsx","../../../src/ds/new/layout/app-shell/main-card.tsx"],"sourcesContent":["import type { ComponentPropsWithRef, ReactNode } from 'react';\n\nimport { cn } from '@/lib/utils';\n\nimport './app-shell.css';\n\nexport interface AppShellProps extends Omit<ComponentPropsWithRef<'div'>, 'children'> {\n children: ReactNode;\n mobileHeader?: ReactNode;\n sidebar?: ReactNode;\n}\n\nexport function AppShell({ children, className, mobileHeader, ref, sidebar, ...props }: AppShellProps) {\n return (\n <div\n ref={ref}\n data-slot=\"app-shell\"\n className={cn(\n 'h-full min-h-0',\n sidebar && 'lg:grid lg:grid-cols-[auto_minmax(0,1fr)] lg:grid-rows-[1fr]',\n className,\n )}\n {...props}\n >\n {sidebar}\n <div data-slot=\"app-shell-content\" className=\"flex h-full min-h-0 min-w-0 flex-col\">\n {mobileHeader}\n <div\n data-slot=\"app-shell-body\"\n className={cn(\n 'flex min-h-0 flex-1 flex-col',\n // Below lg the sidebar is a drawer and the content runs edge to edge under the mobile header.\n // From lg it's inset on every side; with a sidebar column the sidebar's own padding provides the left gap.\n // Longhands only: consumer CSS that also emits a padding shorthand can't override the lg inset.\n 'lg:py-2 lg:pr-2',\n sidebar ? 'lg:pl-0' : 'lg:pl-2',\n )}\n >\n {children}\n </div>\n </div>\n </div>\n );\n}\n","import type { ReactNode } from 'react';\n\nimport { frameFillStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\n// The app frame surface inside `AppShell`. Spacing around it is owned by the shell, not the card.\n// Framed only from lg, where the sidebar sits beside it (the sidebar's drawer breakpoint); below lg it is\n// flat page content under the mobile header. lg-only classes, not max-lg overrides, so consumer CSS that\n// also emits the base classes can't undo the flat state by source order.\n// Reserve the 1px inset rim so child dividers don't paint over it and stack their alpha.\nexport function MainCard({ children, className }: { children: ReactNode; className?: string }) {\n return (\n <div\n data-slot=\"main-card\"\n className={cn(\n 'relative min-h-0 flex-1 overflow-hidden lg:rounded-studio-frame lg:p-px lg:shadow-raised',\n frameFillStyle,\n className,\n )}\n >\n {children}\n </div>\n );\n}\n"],"names":[],"mappings":";;;;AAYO,SAAS,QAAA,CAAS,EAAE,QAAA,EAAU,SAAA,EAAW,cAAc,GAAA,EAAK,OAAA,EAAS,GAAG,KAAA,EAAM,EAAkB;AACrG,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,WAAA,EAAU,WAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,gBAAA;AAAA,QACA,OAAA,IAAW,8DAAA;AAAA,QACX;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,OAAA;AAAA,wBACD,IAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,mBAAA,EAAoB,WAAU,sCAAA,EAC1C,QAAA,EAAA;AAAA,UAAA,YAAA;AAAA,0BACD,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,WAAA,EAAU,gBAAA;AAAA,cACV,SAAA,EAAW,EAAA;AAAA,gBACT,8BAAA;AAAA;AAAA;AAAA;AAAA,gBAIA,iBAAA;AAAA,gBACA,UAAU,SAAA,GAAY;AAAA,eACxB;AAAA,cAEC;AAAA;AAAA;AACH,SAAA,EACF;AAAA;AAAA;AAAA,GACF;AAEJ;;ACjCO,SAAS,QAAA,CAAS,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgD;AAC7F,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,WAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,0FAAA;AAAA,QACA,cAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;;;"}

package/dist/pagination-range-BlUsZjqD.js ADDED Viewed

@@ -0,0 +1,191 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useRender } from '@base-ui/react/use-render';
+import { Ellipsis, ChevronRight, ChevronLeft } from 'lucide-react';
+import { createContext, use, useRef, useCallback, useState, useMemo, cloneElement, isValidElement } from 'react';
+import { FluidHoverHighlight } from './components/fluid-hover-highlight.es.js';
+import { Icon } from './icons/Icon.es.js';
+import { controlSizeClasses } from './primitives/control-size.es.js';
+import { raisedControlSurfaceStyle } from './primitives/form-element.es.js';
+import { focusRing, controlStateColorTransition } from './primitives/transitions.es.js';
+import { useFluidHover } from './hooks/use-fluid-hover.es.js';
+import { c as cn } from './cn-coERSHz5.js';
+const PaginationContext = createContext(void 0);
+const isCurrent = (element) => element.getAttribute("aria-current") === "page";
+const clearCurrent = (index) => (current) => {
+  if (current === index) return null;
+  return current;
+};
+function usePaginationItemRef() {
+  const ctx = use(PaginationContext);
+  const indexRef = useRef(void 0);
+  const unsubscribeRef = useRef(void 0);
+  return useCallback(
+    (element) => {
+      unsubscribeRef.current?.();
+      unsubscribeRef.current = void 0;
+      if (!ctx) return;
+      const { registerItem, allocateIndex, releaseIndex, setCurrentIndex } = ctx;
+      if (!element) {
+        const index2 = indexRef.current;
+        if (index2 === void 0) return;
+        registerItem(index2, null);
+        releaseIndex(index2);
+        setCurrentIndex(clearCurrent(index2));
+        indexRef.current = void 0;
+        return;
+      }
+      indexRef.current ??= allocateIndex();
+      const index = indexRef.current;
+      registerItem(index, element);
+      const sync = () => {
+        if (isCurrent(element)) {
+          setCurrentIndex(index);
+          return;
+        }
+        setCurrentIndex(clearCurrent(index));
+      };
+      sync();
+      const observer = typeof MutationObserver === "undefined" ? void 0 : new MutationObserver(sync);
+      observer?.observe(element, { attributes: true, attributeFilter: ["aria-current"] });
+      unsubscribeRef.current = () => observer?.disconnect();
+    },
+    [ctx]
+  );
+}
+function Pagination({ className, "aria-label": ariaLabel = "Pagination", ...props }) {
+  return /* @__PURE__ */ jsx(
+    "nav",
+    {
+      "data-slot": "pagination",
+      "aria-label": ariaLabel,
+      className: cn("flex items-center justify-center", className),
+      ...props
+    }
+  );
+}
+const isInert = (element) => element.getAttribute("aria-disabled") === "true";
+function PaginationContent({ className, ...props }) {
+  const containerRef = useRef(null);
+  const hover = useFluidHover(containerRef, { axis: "x", isItemDisabled: isInert, gapClick: false });
+  const [currentIndex, setCurrentIndex] = useState(null);
+  const counterRef = useRef(0);
+  const freeRef = useRef([]);
+  const { registerItem } = hover;
+  const context = useMemo(
+    () => ({
+      registerItem,
+      allocateIndex: () => freeRef.current.pop() ?? counterRef.current++,
+      releaseIndex: (index) => {
+        freeRef.current.push(index);
+      },
+      setCurrentIndex
+    }),
+    [registerItem]
+  );
+  const currentIndicator = { ...hover, activeIndex: currentIndex };
+  return /* @__PURE__ */ jsx(PaginationContext, { value: context, children: /* @__PURE__ */ jsxs("div", { ref: containerRef, ...hover.handlers, className: "relative isolate", children: [
+    /* @__PURE__ */ jsx(FluidHoverHighlight, { hover, className: "-z-2 rounded-full bg-fill-subtle" }),
+    /* @__PURE__ */ jsx(FluidHoverHighlight, { hover: currentIndicator, className: cn("-z-1 rounded-full", raisedControlSurfaceStyle) }),
+    /* @__PURE__ */ jsx("ul", { "data-slot": "pagination-content", className: cn("flex items-center gap-1", className), ...props })
+  ] }) });
+}
+function PaginationItem(props) {
+  return /* @__PURE__ */ jsx("li", { "data-slot": "pagination-item", ...props });
+}
+const paginationLinkClass = cn(
+  controlSizeClasses.sm,
+  controlStateColorTransition,
+  focusRing,
+  "relative inline-flex min-w-control-sm cursor-pointer items-center justify-center gap-1 rounded-full px-2.5 text-muted-foreground tabular-nums",
+  "hover:text-foreground aria-[current=page]:text-foreground",
+  "aria-disabled:cursor-not-allowed aria-disabled:text-placeholder aria-disabled:hover:text-placeholder"
+);
+function preventActivation(event) {
+  event.preventDefault();
+}
+function isAnchorElement(render) {
+  return isValidElement(render) && render.type === "a";
+}
+function linkRender(render, disabled) {
+  if (disabled && isAnchorElement(render)) return cloneElement(render, { href: void 0 });
+  return render;
+}
+function elementProps(render, disabled) {
+  if (render === void 0) return { type: "button" };
+  if (disabled && isAnchorElement(render)) return { role: "link", tabIndex: 0 };
+  return {};
+}
+function activationProps(disabled, onClick) {
+  if (disabled) return { "aria-disabled": true, onClick: preventActivation, onAuxClick: preventActivation };
+  return { onClick };
+}
+function PaginationLink({ isActive, disabled, render, className, onClick, ...props }) {
+  const ref = usePaginationItemRef();
+  return useRender({
+    defaultTagName: "button",
+    render: linkRender(render, disabled),
+    ref,
+    props: {
+      ...elementProps(render, disabled),
+      ...props,
+      ...activationProps(disabled, onClick),
+      "data-slot": "pagination-link",
+      "aria-current": isActive && "page",
+      className: cn(paginationLinkClass, className)
+    }
+  });
+}
+function PaginationPrevious({ text = "Previous", ...props }) {
+  return /* @__PURE__ */ jsxs(PaginationLink, { ...props, children: [
+    /* @__PURE__ */ jsx(Icon, { size: "sm", "aria-hidden": true, children: /* @__PURE__ */ jsx(ChevronLeft, {}) }),
+    text
+  ] });
+}
+function PaginationNext({ text = "Next", ...props }) {
+  return /* @__PURE__ */ jsxs(PaginationLink, { ...props, children: [
+    text,
+    /* @__PURE__ */ jsx(Icon, { size: "sm", "aria-hidden": true, children: /* @__PURE__ */ jsx(ChevronRight, {}) })
+  ] });
+}
+function PaginationEllipsis({ className, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      "data-slot": "pagination-ellipsis",
+      className: cn("flex w-control-sm items-center justify-center text-muted-foreground", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(Icon, { size: "sm", "aria-hidden": true, children: /* @__PURE__ */ jsx(Ellipsis, {}) }),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "More pages" })
+      ]
+    }
+  );
+}
+const pageItem = (page) => ({ kind: "page", page });
+function windowStart(page, pageCount) {
+  const start = Math.max(1, Math.min(page - 1, pageCount - 5));
+  if (start === 2) return 1;
+  return start;
+}
+function windowEnd(page, pageCount) {
+  const end = Math.min(pageCount - 2, Math.max(page + 1, 4));
+  if (end === pageCount - 3) return pageCount - 2;
+  return end;
+}
+function getPaginationRange(page, pageCount) {
+  if (pageCount <= 7) return Array.from({ length: pageCount }, (_, index) => pageItem(index));
+  const first = windowStart(page, pageCount);
+  const last = windowEnd(page, pageCount);
+  const items = [pageItem(0)];
+  if (first > 1) items.push({ kind: "ellipsis", key: "start" });
+  for (let index = first; index <= last; index += 1) items.push(pageItem(index));
+  if (last < pageCount - 2) items.push({ kind: "ellipsis", key: "end" });
+  items.push(pageItem(pageCount - 1));
+  return items;
+}
+export { Pagination as P, PaginationContent as a, PaginationEllipsis as b, PaginationItem as c, PaginationLink as d, PaginationNext as e, PaginationPrevious as f, getPaginationRange as g };
+//# sourceMappingURL=pagination-range-BlUsZjqD.js.map

package/dist/pagination-range-BlUsZjqD.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"pagination-range-BlUsZjqD.js","sources":["../src/ds/components/Pagination/pagination-context.ts","../src/ds/components/Pagination/pagination.tsx","../src/ds/components/Pagination/pagination-range.ts"],"sourcesContent":["import { createContext, use, useCallback, useRef } from 'react';\nimport type { Dispatch, SetStateAction } from 'react';\nimport type { UseFluidHoverReturn } from '@/hooks/use-fluid-hover';\n\nexport type PaginationContextValue = {\n registerItem: UseFluidHoverReturn['registerItem'];\n allocateIndex: () => number;\n releaseIndex: (index: number) => void;\n setCurrentIndex: Dispatch<SetStateAction<number | null>>;\n};\n\nexport const PaginationContext = createContext<PaginationContextValue | undefined>(undefined);\n\nconst isCurrent = (element: HTMLElement) => element.getAttribute('aria-current') === 'page';\n\nconst clearCurrent = (index: number) => (current: number | null) => {\n if (current === index) return null;\n return current;\n};\n\nexport function usePaginationItemRef() {\n const ctx = use(PaginationContext);\n const indexRef = useRef<number | undefined>(undefined);\n const unsubscribeRef = useRef<(() => void) | undefined>(undefined);\n\n return useCallback(\n (element: HTMLElement | null) => {\n unsubscribeRef.current?.();\n unsubscribeRef.current = undefined;\n if (!ctx) return;\n const { registerItem, allocateIndex, releaseIndex, setCurrentIndex } = ctx;\n\n if (!element) {\n const index = indexRef.current;\n if (index === undefined) return;\n registerItem(index, null);\n releaseIndex(index);\n setCurrentIndex(clearCurrent(index));\n indexRef.current = undefined;\n return;\n }\n\n indexRef.current ??= allocateIndex();\n const index = indexRef.current;\n registerItem(index, element);\n\n const sync = () => {\n if (isCurrent(element)) {\n setCurrentIndex(index);\n return;\n }\n setCurrentIndex(clearCurrent(index));\n };\n sync();\n const observer = typeof MutationObserver === 'undefined' ? undefined : new MutationObserver(sync);\n observer?.observe(element, { attributes: true, attributeFilter: ['aria-current'] });\n unsubscribeRef.current = () => observer?.disconnect();\n },\n [ctx],\n );\n}\n","import { useRender } from '@base-ui/react/use-render';\nimport { ChevronLeft, ChevronRight, Ellipsis } from 'lucide-react';\nimport { cloneElement, isValidElement, useMemo, useRef, useState } from 'react';\nimport type { ComponentProps, MouseEvent, ReactElement } from 'react';\nimport { PaginationContext, usePaginationItemRef } from './pagination-context';\nimport type { PaginationContextValue } from './pagination-context';\nimport { FluidHoverHighlight } from '@/components/fluid-hover-highlight';\nimport { Icon } from '@/ds/icons/Icon';\nimport { controlSizeClasses } from '@/ds/primitives/control-size';\nimport { raisedControlSurfaceStyle } from '@/ds/primitives/form-element';\nimport { controlStateColorTransition, focusRing } from '@/ds/primitives/transitions';\nimport { useFluidHover } from '@/hooks/use-fluid-hover';\nimport { cn } from '@/lib/utils';\n\nexport type PaginationProps = ComponentProps<'nav'>;\n\nexport function Pagination({ className, 'aria-label': ariaLabel = 'Pagination', ...props }: PaginationProps) {\n return (\n <nav\n data-slot=\"pagination\"\n aria-label={ariaLabel}\n className={cn('flex items-center justify-center', className)}\n {...props}\n />\n );\n}\n\nconst isInert = (element: HTMLElement) => element.getAttribute('aria-disabled') === 'true';\n\nexport type PaginationContentProps = ComponentProps<'ul'>;\n\nexport function PaginationContent({ className, ...props }: PaginationContentProps) {\n const containerRef = useRef<HTMLDivElement>(null);\n const hover = useFluidHover(containerRef, { axis: 'x', isItemDisabled: isInert, gapClick: false });\n const [currentIndex, setCurrentIndex] = useState<number | null>(null);\n const counterRef = useRef(0);\n const freeRef = useRef<number[]>([]);\n const { registerItem } = hover;\n const context = useMemo<PaginationContextValue>(\n () => ({\n registerItem,\n allocateIndex: () => freeRef.current.pop() ?? counterRef.current++,\n releaseIndex: index => {\n freeRef.current.push(index);\n },\n setCurrentIndex,\n }),\n [registerItem],\n );\n const currentIndicator = { ...hover, activeIndex: currentIndex };\n\n return (\n <PaginationContext value={context}>\n <div ref={containerRef} {...hover.handlers} className=\"relative isolate\">\n <FluidHoverHighlight hover={hover} className=\"-z-2 rounded-full bg-fill-subtle\" />\n <FluidHoverHighlight hover={currentIndicator} className={cn('-z-1 rounded-full', raisedControlSurfaceStyle)} />\n <ul data-slot=\"pagination-content\" className={cn('flex items-center gap-1', className)} {...props} />\n </div>\n </PaginationContext>\n );\n}\n\nexport type PaginationItemProps = ComponentProps<'li'>;\n\nexport function PaginationItem(props: PaginationItemProps) {\n return <li data-slot=\"pagination-item\" {...props} />;\n}\n\nconst paginationLinkClass = cn(\n controlSizeClasses.sm,\n controlStateColorTransition,\n focusRing,\n 'relative inline-flex min-w-control-sm cursor-pointer items-center justify-center gap-1 rounded-full px-2.5 text-muted-foreground tabular-nums',\n 'hover:text-foreground aria-[current=page]:text-foreground',\n 'aria-disabled:cursor-not-allowed aria-disabled:text-placeholder aria-disabled:hover:text-placeholder',\n);\n\nexport type PaginationLinkProps = useRender.ComponentProps<'button'> & {\n isActive?: boolean;\n disabled?: boolean;\n};\n\ntype LinkRender = PaginationLinkProps['render'];\n\nfunction preventActivation(event: MouseEvent<HTMLElement>) {\n event.preventDefault();\n}\n\nfunction isAnchorElement(render: LinkRender): render is ReactElement<ComponentProps<'a'>> {\n return isValidElement(render) && render.type === 'a';\n}\n\nfunction linkRender(render: LinkRender, disabled: boolean | undefined) {\n if (disabled && isAnchorElement(render)) return cloneElement(render, { href: undefined });\n return render;\n}\n\nfunction elementProps(render: LinkRender, disabled: boolean | undefined) {\n if (render === undefined) return { type: 'button' as const };\n if (disabled && isAnchorElement(render)) return { role: 'link', tabIndex: 0 };\n return {};\n}\n\nfunction activationProps(disabled: boolean | undefined, onClick: PaginationLinkProps['onClick']) {\n if (disabled) return { 'aria-disabled': true, onClick: preventActivation, onAuxClick: preventActivation };\n return { onClick };\n}\n\nexport function PaginationLink({ isActive, disabled, render, className, onClick, ...props }: PaginationLinkProps) {\n const ref = usePaginationItemRef();\n return useRender({\n defaultTagName: 'button',\n render: linkRender(render, disabled),\n ref,\n props: {\n ...elementProps(render, disabled),\n ...props,\n ...activationProps(disabled, onClick),\n 'data-slot': 'pagination-link',\n 'aria-current': isActive && 'page',\n className: cn(paginationLinkClass, className),\n },\n });\n}\n\nexport type PaginationPreviousProps = PaginationLinkProps & { text?: string };\n\nexport function PaginationPrevious({ text = 'Previous', ...props }: PaginationPreviousProps) {\n return (\n <PaginationLink {...props}>\n <Icon size=\"sm\" aria-hidden>\n <ChevronLeft />\n </Icon>\n {text}\n </PaginationLink>\n );\n}\n\nexport type PaginationNextProps = PaginationLinkProps & { text?: string };\n\nexport function PaginationNext({ text = 'Next', ...props }: PaginationNextProps) {\n return (\n <PaginationLink {...props}>\n {text}\n <Icon size=\"sm\" aria-hidden>\n <ChevronRight />\n </Icon>\n </PaginationLink>\n );\n}\n\nexport type PaginationEllipsisProps = ComponentProps<'span'>;\n\nexport function PaginationEllipsis({ className, ...props }: PaginationEllipsisProps) {\n return (\n <span\n data-slot=\"pagination-ellipsis\"\n className={cn('flex w-control-sm items-center justify-center text-muted-foreground', className)}\n {...props}\n >\n <Icon size=\"sm\" aria-hidden>\n <Ellipsis />\n </Icon>\n <span className=\"sr-only\">More pages</span>\n </span>\n );\n}\n","export type PaginationRangeItem = { kind: 'page'; page: number } | { kind: 'ellipsis'; key: 'start' | 'end' };\n\nconst pageItem = (page: number): PaginationRangeItem => ({ kind: 'page', page });\n\nfunction windowStart(page: number, pageCount: number) {\n const start = Math.max(1, Math.min(page - 1, pageCount - 5));\n if (start === 2) return 1;\n return start;\n}\n\nfunction windowEnd(page: number, pageCount: number) {\n const end = Math.min(pageCount - 2, Math.max(page + 1, 4));\n if (end === pageCount - 3) return pageCount - 2;\n return end;\n}\n\nexport function getPaginationRange(page: number, pageCount: number): PaginationRangeItem[] {\n if (pageCount <= 7) return Array.from({ length: pageCount }, (_, index) => pageItem(index));\n const first = windowStart(page, pageCount);\n const last = windowEnd(page, pageCount);\n const items: PaginationRangeItem[] = [pageItem(0)];\n if (first > 1) items.push({ kind: 'ellipsis', key: 'start' });\n for (let index = first; index <= last; index += 1) items.push(pageItem(index));\n if (last < pageCount - 2) items.push({ kind: 'ellipsis', key: 'end' });\n items.push(pageItem(pageCount - 1));\n return items;\n}\n"],"names":["index"],"mappings":"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"}