themelia-react-ui 2.0.5 → 2.0.6

package/dist/components/features/table/table.types.d.ts

@@ -72,6 +72,10 @@ export interface DataTablePaginationStrings extends ExistingRequiredPaginationLa
     to: string;
 }
 export interface DataTableStrings {
+    /** Copy announced while the table body is loading. Optional for existing dictionaries. */
+    loading?: {
+        label: string;
+    };
     /** Shown in place of the collection when it has no entries. */
     emptyState: {
         message: string;
@@ -128,6 +132,7 @@ export interface DataTableStrings {
     };
 }
 export type DataTableStringsOverride = Partial<{
+    loading: Partial<NonNullable<DataTableStrings['loading']>>;
     /** Shown in place of the collection when it has no entries. */
     emptyState: Partial<DataTableStrings['emptyState']>;
     /** Overflow menu for the surface as a whole. */
@@ -171,7 +176,9 @@ export interface DataTableToolbarProps<TData> {
 }
 export interface DataTableSelectionToolbarContext<TData extends object> {
     table: Table<TData>;
+    /** Selected records available in the current `data` prop. */
     selectedRows: TData[];
+    /** Number of selected IDs, including selections outside the current page. */
     selectedRowCount: number;
     /** `totalRowCount` when supplied, else `pagination.total`, else the rows in `data`. */
     totalRowCount: number;
@@ -221,7 +228,8 @@ export interface DataTableProps<TData extends object, TValue> {
      * 1. Regular array: `columns={myColumns}`
      * 2. Tuple pattern with auto-memoization: `columns={[getColumns(t, actions), [t, actions]]}`
      *
-     * The tuple pattern eliminates the need for manual useMemo on the page level.
+     * The tuple keeps its definitions until the dependencies change. Include
+     * every value read by the definitions, including their cell callbacks.
      *
      * @example
      * // Pattern 1: Regular (requires manual memoization)
@@ -235,6 +243,10 @@ export interface DataTableProps<TData extends object, TValue> {
     columns: ColumnDef<TData, TValue>[] | [ColumnDef<TData, TValue>[], React.DependencyList];
     /** Records to render. */
     data: TData[];
+    /** Replaces body rows with placeholders while preserving headers and table state. */
+    loading?: boolean;
+    /** Number of placeholder rows while loading. Defaults to 6, capped at 20. */
+    loadingRows?: number;
     /** Banded headers spanning several columns, drawn above the header row. */
     columnGroups?: ColumnGroup[];
     /** Enables column sorting. */
@@ -485,6 +497,10 @@ export interface DataTableActionsProps<TData> {
     strings?: DataTableStrings;
 }
 export interface DataTableBodyProps<TData> {
+    /** Replaces the body with non-interactive shared Skeleton rows. */
+    loading?: boolean;
+    /** Number of placeholder rows. Defaults to 6, capped at 20. */
+    loadingRows?: number;
     /** The table instance from `useReactTable`, supplied by `DataTable`. */
     table: Table<TData>;
     /** Fired when a row is activated. */

package/dist/components/layout/header/header.types.d.ts

@@ -13,8 +13,9 @@ export interface HeaderBreadcrumbsProps extends LayoutNavigationAdapter {
     breadcrumbs?: BreadcrumbItem[];
     /** Root entry prepended to the trail. */
     homeBreadcrumb?: BreadcrumbItem | null;
-    /** Renders the sidebar collapse control. */
+    /** Renders the sidebar control when a provider or a trigger slot is present. @default true */
     showSidebarTrigger?: boolean;
+    /** Custom trigger content. Can be used without a sidebar provider. */
     triggerSlot?: ReactNode;
     className?: string;
 }
@@ -182,7 +183,7 @@ export interface HeaderProps extends LayoutNavigationAdapter, HTMLAttributes<HTM
     breadcrumbs?: BreadcrumbItem[];
     /** Root entry prepended to the trail. */
     homeBreadcrumb?: BreadcrumbItem | null;
-    /** Renders the sidebar collapse control. */
+    /** Renders the sidebar control when a sidebar provider is present. @default true */
     showSidebarTrigger?: boolean;
     /** Composes shell regions by container width: brand appears from 2xl/app-header (42rem default), center from 3xl/app-header (48rem default); left and right are always rendered when supplied. Keep essential narrow-width identity/navigation in left or right and supply compact/overflow behavior. */
     slots?: HeaderSlots;

package/dist/components/layout/layout.types.d.ts

@@ -5,13 +5,13 @@
  * router package. Navigation is delegated to the consumer through
  * `renderLink`.
  */
-import type { ComponentType, HTMLAttributes, MouseEvent, ReactNode } from 'react';
+import type { AriaAttributes, ComponentType, HTMLAttributes, MouseEvent, ReactNode } from 'react';
 /** Native region props, including strongly typed consumer `data-*` hooks. */
 export type LayoutSlotAttributes<ElementType extends HTMLElement> = HTMLAttributes<ElementType> & {
     [Key in `data-${string}`]?: string | number | boolean | undefined;
 };
 export interface LayoutLinkRenderProps {
-    /** Destination URL. When omitted, render non-interactive content. */
+    /** Destination URL. Without a URL, the default renders a button when onClick is supplied. */
     href?: string;
     children: ReactNode;
     className?: string;
@@ -19,6 +19,8 @@ export interface LayoutLinkRenderProps {
     rel?: string;
     onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
     'aria-label'?: string;
+    /** Current-page state supplied by a navigation owner. */
+    'aria-current'?: AriaAttributes['aria-current'];
     /** Consumer hint for active styling; renderers may ignore it. */
     active?: boolean;
     /** Consumer hint to render as muted/non-interactive. */
@@ -40,7 +42,7 @@ export interface LayoutNavigationAdapter {
     /** Renderer for framework-native links. */
     renderLink?: LayoutLinkRenderer;
 }
-/** Default link renderer — native anchor with disabled fallback. */
+/** Renders native links, callback buttons and inert entries. */
 export declare const defaultRenderLink: LayoutLinkRenderer;
 /** Resolve the consumer renderer or the native-anchor default. */
 export declare function resolveLayoutLinkRenderer({ renderLink, }?: LayoutNavigationAdapter): LayoutLinkRenderer;

package/dist/components/layout/navigation/side-nav.d.ts

@@ -10,6 +10,7 @@
 import { type LucideIcon } from 'lucide-react';
 import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
 import { type StringsProp } from '../../../lib/strings';
+import type { LayoutNavigationAdapter } from '../layout.types';
 export interface SideNavStrings {
     navigationLabel: string;
 }
@@ -36,8 +37,8 @@ export interface SideNavGroup {
     defaultCollapsed?: boolean;
     collapsible?: boolean;
 }
-interface SideNavSharedProps extends Omit<ComponentPropsWithoutRef<'nav'>, 'children'> {
-    /** Path of the active route, used to mark the current entry. */
+interface SideNavSharedProps extends Omit<ComponentPropsWithoutRef<'nav'>, 'children'>, LayoutNavigationAdapter {
+    /** Path supplied by the app. Omit it to leave every entry unmarked. */
     currentPath?: string;
     itemClassName?: string;
     activeItemClassName?: string;

package/dist/components/layout/normalize-layout-path.d.ts

@@ -0,0 +1 @@
+export declare function normalizeLayoutPath(rawUrl: string): string;

package/dist/components/layout/settings/settings.d.ts

@@ -1,4 +1,4 @@
-import type { ComponentType, ReactNode } from 'react';
+import { type ComponentType, type ReactNode } from 'react';
 import { type PageHeaderAction } from '../../base/navigation/page-header/page-header-commands';
 import { type StringsProp } from '../../../lib/strings';
 import { type LayoutNavigationAdapter } from '../layout.types';

package/dist/components/layout/sidebar/app-sidebar.d.ts

@@ -4,4 +4,4 @@
  */
 import * as React from 'react';
 import type { AppSidebarProps } from './sidebar.types';
-export declare function AppSidebar({ navigationGroups, 'aria-label': navigationLabel, footerNavItems, footerLabel, logo, collapsedLogo, workspaceLinks, workspaceStrings, workspaceContentClassName, headerClassName, logoClassName, iconMap, currentUrl, liveBadges, showBadges, menuDensity, renderLink, loading, collapsible, panelId, surface, variant, side, className, surfaceClassName, contentClassName, slots, renderItem, renderItemContent, searchable, searchValue, defaultSearchValue, onSearchValueChange, strings: stringsProp, expandedItems, defaultExpandedItems, onExpandedItemsChange, }: AppSidebarProps): React.JSX.Element;
+export declare function AppSidebar({ navigationGroups, 'aria-label': navigationLabel, footerNavItems, footerLabel, logo, collapsedLogo, workspaceLinks, workspaceStrings, workspaceContentClassName, headerClassName, logoClassName, iconMap, currentUrl, closeDrawerOnNavigate, liveBadges, showBadges, menuDensity, renderLink, loading, collapsible, panelId, surface, variant, side, className, surfaceClassName, contentClassName, slots, renderItem, renderItemContent, searchable, searchValue, defaultSearchValue, onSearchValueChange, strings: stringsProp, expandedItems, defaultExpandedItems, onExpandedItemsChange, }: AppSidebarProps): React.JSX.Element;

package/dist/components/layout/sidebar/sidebar-navigation-rail.d.ts

@@ -18,6 +18,8 @@ export interface SidebarNavigationRailProps extends Omit<LayoutSidebarProps, 'ch
     onValueChange?: (id: string) => void;
     /** Used for native current-route indication when value is omitted. */
     currentUrl?: string;
+    /** Close this already-open drawer when currentUrl, or the fallback value, changes. @default true */
+    closeDrawerOnNavigate?: boolean;
     iconMap?: Record<string, ComponentType<{
         className?: string;
     }>>;
@@ -33,4 +35,4 @@ export interface SidebarNavigationRailProps extends Omit<LayoutSidebarProps, 'ch
     /** Accessible name for this navigation region. @default 'Primary navigation' */
     'aria-label'?: string;
 }
-export declare function SidebarNavigationRail({ items, value, onValueChange, currentUrl, renderLink, iconMap, slots, collapsible, 'aria-label': ariaLabel, className, surface, surfaceClassName, style, side, panelId, ...props }: SidebarNavigationRailProps): import("react").JSX.Element;
+export declare function SidebarNavigationRail({ items, value, onValueChange, currentUrl, closeDrawerOnNavigate, renderLink, iconMap, slots, collapsible, 'aria-label': ariaLabel, className, surface, surfaceClassName, style, side, panelId, ...props }: SidebarNavigationRailProps): import("react").JSX.Element;

package/dist/components/layout/sidebar/sidebar.context.d.ts

@@ -1,6 +1,7 @@
 import { useBaseSidebarContext, type SidebarMenuDensity, type SidebarProviderProps } from '../../base/sidebar/sidebar';
 export declare const useLayoutSidebar: typeof import("../../ui/sidebar-state").useSidebar;
 export type LayoutSidebarContext = ReturnType<typeof useBaseSidebarContext>;
+export declare function useDismissSidebarDrawerOnNavigate({ openMobile, panelId, setOpenMobile }: LayoutSidebarContext, navigationKey: string | undefined, enabled: boolean): void;
 export type LayoutSidebarProviderProps = SidebarProviderProps & {
     /** Parent-driven drawer adaptation for embedded shells; defaults to viewport. */
     adaptTo?: 'viewport' | 'container';

package/dist/components/layout/sidebar/sidebar.types.d.ts

@@ -133,6 +133,8 @@ export interface AppSidebarProps extends LayoutNavigationAdapter, SidebarExpansi
     }>>;
     /** URL of the active route, used to mark the current item. */
     currentUrl?: string;
+    /** Close this already-open drawer when the app commits a new currentUrl. @default true */
+    closeDrawerOnNavigate?: boolean;
     /** Render item badges and live counts. @default true */
     showBadges?: boolean;
     /** Live counts keyed by item id — unread totals and similar. */

package/dist/components/primitives/link.d.ts

@@ -1,9 +1,10 @@
 import { type AnchorHTMLAttributes, type ReactNode, type Ref } from 'react';
-export interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+export interface LinkProps extends AnchorHTMLAttributes<HTMLElement> {
     children?: ReactNode;
     /** Rendered instead of a dead link when there is nothing to show. Defaults to an em dash. */
     emptyLabel?: ReactNode;
-    ref?: Ref<HTMLAnchorElement>;
+    /** The anchor when populated, or the shared empty span when content is absent. */
+    ref?: Ref<HTMLElement>;
 }
 /**
  * Link-coloured inline value. Standalone it uses the provider text size with an

package/dist/components/primitives/money.d.ts

@@ -18,7 +18,7 @@ export interface MoneyValue {
     minorUnitScale?: number;
     /** Optional consumer-resolved symbol. Intl placement is preserved. */
     symbol?: string | null;
-    /** Intl currency label style when the resolved format mode uses currency formatting. */
+    /** Intl label style for `with_symbol`/`locale_aware`. `with_code` always appends the code; `decimal` omits it. Select the format mode explicitly to override provider policy. */
     currencyDisplay?: Intl.NumberFormatOptions['currencyDisplay'];
     /** Minimum decimal digits. Defaults to the currency's Intl convention. */
     minimumFractionDigits?: number;

package/dist/components/primitives/number.d.ts

@@ -25,7 +25,7 @@ export interface NumberProps extends SpanProps {
 export interface PercentProps extends Omit<NumberProps, 'options'> {
     /** The value is already 0–100 rather than a 0–1 ratio. Defaults to `false`. */
     scaled?: boolean;
-    /** Passed to `Intl.NumberFormat` after the percent style and one-decimal default. */
+    /** Passed to `Intl.NumberFormat`. The default maximum is one decimal digit or the supplied minimum, whichever is higher. */
     options?: Intl.NumberFormatOptions;
     ref?: Ref<HTMLSpanElement>;
 }

package/dist/components/typography/rich-text/rich-text-tree.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode } from 'react';
-import type { Root } from 'hast';
+import type { Element, Root } from 'hast';
 /** An image in sanitized rich text, as handed to `renderImage`. */
 export interface RichTextImageAttributes {
     /** Source that passed the package image policy (http, https, blob or relative). */
@@ -11,9 +11,11 @@ export interface RichTextImageAttributes {
     height?: number;
 }
 export type RenderRichTextImage = (image: RichTextImageAttributes) => ReactNode;
+type ReplaceRichTextElement = (element: Element) => ReactNode;
 /**
- * Renders an already sanitized tree as React elements, so each image can be
- * the consumer's own component (a framework image, a lightbox trigger) while
- * the surrounding markup keeps its structure. Server and client output match.
+ * Renders an already sanitized tree as React elements. Individual images or
+ * other elements can use React components without breaking the surrounding
+ * markup. Server and client output match.
  */
-export declare function renderRichTextTree(tree: Root, renderImage: RenderRichTextImage): ReactNode;
+export declare function renderRichTextTree(tree: Root, renderImage?: RenderRichTextImage, replaceElement?: ReplaceRichTextElement): ReactNode;
+export {};

package/dist/{containers-CIxwbZt5.js → containers-CSdc32h9.js}

@@ -1,5 +1,5 @@
 "use client";
-import { t as e } from "./utils-B6kKb8jB.js";
+import { t as e } from "./utils-DhuoqFy4.js";
 import { t } from "./focus-recipes-B653VaLq.js";
 import { o as n } from "./structure.recipes-BB4-n58V.js";
 import { n as r, t as i } from "./composition.recipes-COdiFhxB.js";
@@ -109,4 +109,4 @@ g.displayName = "TwoColumnLayout";
 //#endregion
 export { d as i, p as n, f as r, g as t };
 
-//# sourceMappingURL=containers-CIxwbZt5.js.map
+//# sourceMappingURL=containers-CSdc32h9.js.map

package/dist/{containers-CIxwbZt5.js.map → containers-CSdc32h9.js.map}

@@ -1 +1 @@
-{"version":3,"file":"containers-CIxwbZt5.js","names":["_Fragment","cn","stackRecipe","compositionRhythm","compositionClasses","containerRecipe","Fragment$1","Container","forwardRef","props","useRender","className","PageViewport","focusRecipes","Section","gap","containerColumnRecipes","viewportColumnRecipes","TwoColumnLayout","headerClassName","headerProps","slotProps","mainClassName","mainProps","asideClassName","asideProps","footerClassName","footerProps","adaptTo","ratio","header","main","stickyAside","aside","footer"],"sources":["../src/components/layout/containers/content-container.tsx","../src/components/layout/containers/page-viewport.tsx","../src/components/layout/containers/section.tsx","../src/components/layout/containers/two-column-layout.tsx"],"sourcesContent":["import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\n\nimport { cn } from '../../../lib/utils';\n\nimport { containerRecipe } from './container.recipes';\nimport type { ContainerProps } from './containers.types';\n\n/** Container — one centered content-width and inline-gutter owner. */\nexport const Container = forwardRef<HTMLDivElement, ContainerProps>(function Container(\n\t{ className, maxWidth, gutter, render, ...props },\n\tref,\n) {\n\treturn useRender({\n\t\tdefaultTagName: 'div',\n\t\tref,\n\t\trender,\n\t\tprops: {\n\t\t\t...props,\n\t\t\tclassName: cn('container--component @container/content', containerRecipe({ maxWidth, gutter }), className),\n\t\t},\n\t\tstate: {},\n\t});\n});\n\nContainer.displayName = 'Container';\n","import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\n\nimport { cn } from '../../../lib/utils';\n\nimport type { PageViewportProps } from './containers.types';\nimport { focusRecipes } from '../../../lib/focus-recipes';\n\n/** PageViewport — the single page-scroll and page-container-query owner. */\nexport const PageViewport = forwardRef<HTMLDivElement, PageViewportProps>(function PageViewport(\n\t{ className, render, tabIndex = 0, ...props },\n\tref,\n) {\n\treturn useRender({\n\t\tdefaultTagName: 'div',\n\t\tref,\n\t\trender,\n\t\tprops: {\n\t\t\t...props,\n\t\t\ttabIndex,\n\t\t\tclassName: cn(\n\t\t\t\t`page-viewport--component min-h-0 min-w-0 flex-1 overflow-auto overscroll-contain [scrollbar-gutter:stable] @container/page focus-visible:outline-none ${focusRecipes.inset}`,\n\t\t\t\tclassName,\n\t\t\t),\n\t\t},\n\t\tstate: {},\n\t});\n});\n\nPageViewport.displayName = 'PageViewport';\n","import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\n\nimport { stackRecipe } from '../../base/structure/structure.recipes';\nimport {compositionRhythm} from '../../base/structure/composition.recipes';\nimport { cn } from '../../../lib/utils';\n\nimport type { SectionProps } from './containers.types';\n\n/** Section — a semantic vertical-rhythm owner for page content groups. */\nexport const Section = forwardRef<HTMLElement, SectionProps>(function Section(\n\t{ className, gap, render, ...props },\n\tref,\n) {\n\treturn useRender({\n\t\tdefaultTagName: 'section',\n\t\tref,\n\t\trender,\n\t\tprops: {\n\t\t\t...props,\n\t\t\tclassName: cn('section--component', stackRecipe({ gap: gap ?? compositionRhythm.related }), className),\n\t\t},\n\t\tstate: {},\n\t});\n});\n\nSection.displayName = 'Section';\n","import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\nimport type { ReactNode } from 'react';\n\nimport { cn } from '../../../lib/utils';\nimport {compositionClasses} from '../../base/structure/composition.recipes';\nimport type { LayoutSlotAttributes } from '../layout.types';\n\nexport interface TwoColumnLayoutSlotProps {\n\theader?: LayoutSlotAttributes<HTMLDivElement>;\n\tmain?: LayoutSlotAttributes<HTMLDivElement>;\n\taside?: LayoutSlotAttributes<HTMLElement>;\n\tfooter?: LayoutSlotAttributes<HTMLDivElement>;\n}\n\nexport interface TwoColumnLayoutProps extends useRender.ComponentProps<'div'> {\n\t/** Optional content spanning both columns before the work regions. */\n\theader?: ReactNode;\n\t/** Primary detail, form, or index content. */\n\tmain: ReactNode;\n\t/** Secondary summary, support, or action rail. */\n\taside: ReactNode;\n\t/** Optional content spanning both columns after the work regions. */\n\tfooter?: ReactNode;\n\t/** Keep the aside visible while the nearest page viewport scrolls. */\n\tstickyAside?: boolean;\n\t/** Preserve viewport breakpoints by default, or adapt inside Container/PageViewport. */\n\tadaptTo?: 'viewport' | 'container';\n\t/** Optional main/aside proportions; omission preserves the established flexible 2/1 split. */\n\tratio?: '7/5' | '8/4';\n\t/** Native attributes for each stable region. */\n\tslotProps?: TwoColumnLayoutSlotProps;\n}\n\nconst containerColumnRecipes = {\n\tdefault: '@3xl:grid-cols-[minmax(0,2fr)_minmax(18rem,1fr)]',\n\t'7/5': '@3xl:grid-cols-[minmax(0,7fr)_minmax(0,5fr)]',\n\t'8/4': '@3xl:grid-cols-[minmax(0,8fr)_minmax(0,4fr)]',\n} as const;\nconst viewportColumnRecipes = {\n\tdefault: 'lg:grid-cols-[minmax(0,2fr)_minmax(18rem,1fr)]',\n\t'7/5': 'lg:grid-cols-[minmax(0,7fr)_minmax(0,5fr)]',\n\t'8/4': 'lg:grid-cols-[minmax(0,8fr)_minmax(0,4fr)]',\n} as const;\n\n/** TwoColumnLayout — one truthful, stable-order main/aside grid. */\nexport const TwoColumnLayout = forwardRef<HTMLDivElement, TwoColumnLayoutProps>(\n\tfunction TwoColumnLayout(\n\t\t{\n\t\t\theader,\n\t\t\tmain,\n\t\t\taside,\n\t\t\tfooter,\n\t\t\tstickyAside = false,\n\t\t\tadaptTo = 'viewport',\n\t\t\tratio,\n\t\t\tslotProps,\n\t\t\tclassName,\n\t\t\trender,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\tconst { className: headerClassName, ...headerProps } = slotProps?.header ?? {};\n\t\tconst { className: mainClassName, ...mainProps } = slotProps?.main ?? {};\n\t\tconst { className: asideClassName, ...asideProps } = slotProps?.aside ?? {};\n\t\tconst { className: footerClassName, ...footerProps } = slotProps?.footer ?? {};\n\n\t\treturn useRender({\n\t\t\tdefaultTagName: 'div',\n\t\t\tref,\n\t\t\trender,\n\t\t\tprops: {\n\t\t\t\t...props,\n\t\t\t\t'data-slot': 'two-column-layout',\n\t\t\t\tclassName: cn(\n\t\t\t\t\t'two-column-layout--component grid min-w-0 grid-cols-1', compositionClasses.subjects,\n\t\t\t\t\tadaptTo === 'container' ? containerColumnRecipes[ratio ?? 'default'] : viewportColumnRecipes[ratio ?? 'default'],\n\t\t\t\t\tclassName,\n\t\t\t\t),\n\t\t\t\tchildren: (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{header !== undefined && header !== null ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t{...headerProps}\n\t\t\t\t\t\t\t\tdata-slot=\"two-column-layout-header\"\n\t\t\t\t\t\t\t\tclassName={cn('two-column-layout--header col-span-full min-w-0', headerClassName)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{header}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t{...mainProps}\n\t\t\t\t\t\t\tdata-slot=\"two-column-layout-main\"\n\t\t\t\t\t\t\tclassName={cn('two-column-layout--main flex min-h-0 min-w-0 flex-col', compositionClasses.subjects, mainClassName)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{main}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<aside\n\t\t\t\t\t\t\t{...asideProps}\n\t\t\t\t\t\t\tdata-slot=\"two-column-layout-aside\"\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t'two-column-layout--aside flex min-h-0 min-w-0 flex-col', compositionClasses.subjects,\n\t\t\t\t\t\t\t\tstickyAside && (adaptTo === 'container' ? '@3xl:sticky @3xl:top-space-2xl @3xl:self-start' : 'lg:sticky lg:top-space-2xl lg:self-start'),\n\t\t\t\t\t\t\t\tasideClassName,\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{aside}\n\t\t\t\t\t\t</aside>\n\t\t\t\t\t\t{footer !== undefined && footer !== null ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t{...footerProps}\n\t\t\t\t\t\t\t\tdata-slot=\"two-column-layout-footer\"\n\t\t\t\t\t\t\t\tclassName={cn('two-column-layout--footer col-span-full min-w-0', footerClassName)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{footer}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : null}\n\t\t\t\t\t</>\n\t\t\t\t),\n\t\t\t},\n\t\t\tstate: {},\n\t\t});\n\t},\n);\n\nTwoColumnLayout.displayName = 'TwoColumnLayout';\n"],"mappings":";;;;;;;;;;AASA,IAAaO,IAAYC,EAA2C,SACnE,EAAE,cAAW,aAAU,WAAQ,WAAQ,GAAGC,KAC1C,GACC;CACD,OAAOC,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH,WAAWR,EAAG,2CAA2CI,EAAgB;IAAE;IAAU;GAAO,CAAC,GAAGM,CAAS;EAC1G;EACA,OAAO,CAAC;CACT,CAAC;AACF,CAAC;AAED,EAAU,cAAc;;;AChBxB,IAAaC,IAAeJ,EAA8C,SACzE,EAAE,cAAW,WAAQ,cAAW,GAAG,GAAGC,KACtC,GACC;CACD,OAAOC,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH;GACA,WAAWR,EACV,yJAAyJY,EAAa,SACtKF,CACD;EACD;EACA,OAAO,CAAC;CACT,CAAC;AACF,CAAC;AAED,EAAa,cAAc;;;ACnB3B,IAAaG,IAAUN,EAAsC,SAC5D,EAAE,cAAW,QAAK,WAAQ,GAAGC,KAC7B,GACC;CACD,OAAOC,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH,WAAWR,EAAG,sBAAsBC,EAAY,EAAE,KAAKa,KAAOZ,EAAkB,QAAQ,CAAC,GAAGQ,CAAS;EACtG;EACA,OAAO,CAAC;CACT,CAAC;AACF,CAAC;AAED,EAAQ,cAAc;;;ACQtB,IAAMK,IAAyB;CAC9B,SAAS;CACT,OAAO;CACP,OAAO;AACR,GACMC,IAAwB;CAC7B,SAAS;CACT,OAAO;CACP,OAAO;AACR,GAGaC,IAAkBV,EAC9B,SACC,EACC,WACA,SACA,UACA,WACA,iBAAc,IACd,aAAU,YACV,UACA,cACA,cACA,WACA,GAAGC,KAEJ,GACC;CACD,IAAM,EAAE,WAAWU,GAAiB,GAAGC,MAAgBC,GAAW,UAAU,CAAC,GACvE,EAAE,WAAWC,GAAe,GAAGC,MAAcF,GAAW,QAAQ,CAAC,GACjE,EAAE,WAAWG,GAAgB,GAAGC,MAAeJ,GAAW,SAAS,CAAC,GACpE,EAAE,WAAWK,GAAiB,GAAGC,MAAgBN,GAAW,UAAU,CAAC;CAE7E,OAAOX,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH,aAAa;GACb,WAAWR,EACV,yDAAyDG,EAAmB,UAC5EwB,MAAY,cAAcZ,EAAuBa,KAAS,aAAaZ,EAAsBY,KAAS,YACtGlB,CACD;GACA,UACC,kBAAAX,GAAA,EAAA,UAAA;IACE8B,KAAmC,OAQhC,OAPH,kBAAC,OAAD;KACC,GAAIV;KACJ,aAAU;KACV,WAAWnB,EAAG,mDAAmDkB,CAAe;KAE/E,UAAAW;IACG,CAAA;IAEN,kBAAC,OAAD;KACC,GAAIP;KACJ,aAAU;KACV,WAAWtB,EAAG,yDAAyDG,EAAmB,UAAUkB,CAAa;KAEhH,UAAAS;IACG,CAAA;IACL,kBAAC,SAAD;KACC,GAAIN;KACJ,aAAU;KACV,WAAWxB,EACV,0DAA0DG,EAAmB,UAC7E4B,MAAgBJ,MAAY,cAAc,mDAAmD,6CAC7FJ,CACD;KAEC,UAAAS;IACK,CAAA;IACNC,KAAmC,OAQhC,OAPH,kBAAC,OAAD;KACC,GAAIP;KACJ,aAAU;KACV,WAAW1B,EAAG,mDAAmDyB,CAAe;KAE/E,UAAAQ;IACG,CAAA;GAEL,EAAA,CAAA;EAEJ;EACA,OAAO,CAAC;CACT,CAAC;AACF,CACD;AAEA,EAAgB,cAAc"}
+{"version":3,"file":"containers-CSdc32h9.js","names":["_Fragment","cn","stackRecipe","compositionRhythm","compositionClasses","containerRecipe","Fragment$1","Container","forwardRef","props","useRender","className","PageViewport","focusRecipes","Section","gap","containerColumnRecipes","viewportColumnRecipes","TwoColumnLayout","headerClassName","headerProps","slotProps","mainClassName","mainProps","asideClassName","asideProps","footerClassName","footerProps","adaptTo","ratio","header","main","stickyAside","aside","footer"],"sources":["../src/components/layout/containers/content-container.tsx","../src/components/layout/containers/page-viewport.tsx","../src/components/layout/containers/section.tsx","../src/components/layout/containers/two-column-layout.tsx"],"sourcesContent":["import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\n\nimport { cn } from '../../../lib/utils';\n\nimport { containerRecipe } from './container.recipes';\nimport type { ContainerProps } from './containers.types';\n\n/** Container — one centered content-width and inline-gutter owner. */\nexport const Container = forwardRef<HTMLDivElement, ContainerProps>(function Container(\n\t{ className, maxWidth, gutter, render, ...props },\n\tref,\n) {\n\treturn useRender({\n\t\tdefaultTagName: 'div',\n\t\tref,\n\t\trender,\n\t\tprops: {\n\t\t\t...props,\n\t\t\tclassName: cn('container--component @container/content', containerRecipe({ maxWidth, gutter }), className),\n\t\t},\n\t\tstate: {},\n\t});\n});\n\nContainer.displayName = 'Container';\n","import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\n\nimport { cn } from '../../../lib/utils';\n\nimport type { PageViewportProps } from './containers.types';\nimport { focusRecipes } from '../../../lib/focus-recipes';\n\n/** PageViewport — the single page-scroll and page-container-query owner. */\nexport const PageViewport = forwardRef<HTMLDivElement, PageViewportProps>(function PageViewport(\n\t{ className, render, tabIndex = 0, ...props },\n\tref,\n) {\n\treturn useRender({\n\t\tdefaultTagName: 'div',\n\t\tref,\n\t\trender,\n\t\tprops: {\n\t\t\t...props,\n\t\t\ttabIndex,\n\t\t\tclassName: cn(\n\t\t\t\t`page-viewport--component min-h-0 min-w-0 flex-1 overflow-auto overscroll-contain [scrollbar-gutter:stable] @container/page focus-visible:outline-none ${focusRecipes.inset}`,\n\t\t\t\tclassName,\n\t\t\t),\n\t\t},\n\t\tstate: {},\n\t});\n});\n\nPageViewport.displayName = 'PageViewport';\n","import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\n\nimport { stackRecipe } from '../../base/structure/structure.recipes';\nimport {compositionRhythm} from '../../base/structure/composition.recipes';\nimport { cn } from '../../../lib/utils';\n\nimport type { SectionProps } from './containers.types';\n\n/** Section — a semantic vertical-rhythm owner for page content groups. */\nexport const Section = forwardRef<HTMLElement, SectionProps>(function Section(\n\t{ className, gap, render, ...props },\n\tref,\n) {\n\treturn useRender({\n\t\tdefaultTagName: 'section',\n\t\tref,\n\t\trender,\n\t\tprops: {\n\t\t\t...props,\n\t\t\tclassName: cn('section--component', stackRecipe({ gap: gap ?? compositionRhythm.related }), className),\n\t\t},\n\t\tstate: {},\n\t});\n});\n\nSection.displayName = 'Section';\n","import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\nimport type { ReactNode } from 'react';\n\nimport { cn } from '../../../lib/utils';\nimport {compositionClasses} from '../../base/structure/composition.recipes';\nimport type { LayoutSlotAttributes } from '../layout.types';\n\nexport interface TwoColumnLayoutSlotProps {\n\theader?: LayoutSlotAttributes<HTMLDivElement>;\n\tmain?: LayoutSlotAttributes<HTMLDivElement>;\n\taside?: LayoutSlotAttributes<HTMLElement>;\n\tfooter?: LayoutSlotAttributes<HTMLDivElement>;\n}\n\nexport interface TwoColumnLayoutProps extends useRender.ComponentProps<'div'> {\n\t/** Optional content spanning both columns before the work regions. */\n\theader?: ReactNode;\n\t/** Primary detail, form, or index content. */\n\tmain: ReactNode;\n\t/** Secondary summary, support, or action rail. */\n\taside: ReactNode;\n\t/** Optional content spanning both columns after the work regions. */\n\tfooter?: ReactNode;\n\t/** Keep the aside visible while the nearest page viewport scrolls. */\n\tstickyAside?: boolean;\n\t/** Preserve viewport breakpoints by default, or adapt inside Container/PageViewport. */\n\tadaptTo?: 'viewport' | 'container';\n\t/** Optional main/aside proportions; omission preserves the established flexible 2/1 split. */\n\tratio?: '7/5' | '8/4';\n\t/** Native attributes for each stable region. */\n\tslotProps?: TwoColumnLayoutSlotProps;\n}\n\nconst containerColumnRecipes = {\n\tdefault: '@3xl:grid-cols-[minmax(0,2fr)_minmax(18rem,1fr)]',\n\t'7/5': '@3xl:grid-cols-[minmax(0,7fr)_minmax(0,5fr)]',\n\t'8/4': '@3xl:grid-cols-[minmax(0,8fr)_minmax(0,4fr)]',\n} as const;\nconst viewportColumnRecipes = {\n\tdefault: 'lg:grid-cols-[minmax(0,2fr)_minmax(18rem,1fr)]',\n\t'7/5': 'lg:grid-cols-[minmax(0,7fr)_minmax(0,5fr)]',\n\t'8/4': 'lg:grid-cols-[minmax(0,8fr)_minmax(0,4fr)]',\n} as const;\n\n/** TwoColumnLayout — one truthful, stable-order main/aside grid. */\nexport const TwoColumnLayout = forwardRef<HTMLDivElement, TwoColumnLayoutProps>(\n\tfunction TwoColumnLayout(\n\t\t{\n\t\t\theader,\n\t\t\tmain,\n\t\t\taside,\n\t\t\tfooter,\n\t\t\tstickyAside = false,\n\t\t\tadaptTo = 'viewport',\n\t\t\tratio,\n\t\t\tslotProps,\n\t\t\tclassName,\n\t\t\trender,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\tconst { className: headerClassName, ...headerProps } = slotProps?.header ?? {};\n\t\tconst { className: mainClassName, ...mainProps } = slotProps?.main ?? {};\n\t\tconst { className: asideClassName, ...asideProps } = slotProps?.aside ?? {};\n\t\tconst { className: footerClassName, ...footerProps } = slotProps?.footer ?? {};\n\n\t\treturn useRender({\n\t\t\tdefaultTagName: 'div',\n\t\t\tref,\n\t\t\trender,\n\t\t\tprops: {\n\t\t\t\t...props,\n\t\t\t\t'data-slot': 'two-column-layout',\n\t\t\t\tclassName: cn(\n\t\t\t\t\t'two-column-layout--component grid min-w-0 grid-cols-1', compositionClasses.subjects,\n\t\t\t\t\tadaptTo === 'container' ? containerColumnRecipes[ratio ?? 'default'] : viewportColumnRecipes[ratio ?? 'default'],\n\t\t\t\t\tclassName,\n\t\t\t\t),\n\t\t\t\tchildren: (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{header !== undefined && header !== null ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t{...headerProps}\n\t\t\t\t\t\t\t\tdata-slot=\"two-column-layout-header\"\n\t\t\t\t\t\t\t\tclassName={cn('two-column-layout--header col-span-full min-w-0', headerClassName)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{header}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t{...mainProps}\n\t\t\t\t\t\t\tdata-slot=\"two-column-layout-main\"\n\t\t\t\t\t\t\tclassName={cn('two-column-layout--main flex min-h-0 min-w-0 flex-col', compositionClasses.subjects, mainClassName)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{main}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<aside\n\t\t\t\t\t\t\t{...asideProps}\n\t\t\t\t\t\t\tdata-slot=\"two-column-layout-aside\"\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t'two-column-layout--aside flex min-h-0 min-w-0 flex-col', compositionClasses.subjects,\n\t\t\t\t\t\t\t\tstickyAside && (adaptTo === 'container' ? '@3xl:sticky @3xl:top-space-2xl @3xl:self-start' : 'lg:sticky lg:top-space-2xl lg:self-start'),\n\t\t\t\t\t\t\t\tasideClassName,\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{aside}\n\t\t\t\t\t\t</aside>\n\t\t\t\t\t\t{footer !== undefined && footer !== null ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t{...footerProps}\n\t\t\t\t\t\t\t\tdata-slot=\"two-column-layout-footer\"\n\t\t\t\t\t\t\t\tclassName={cn('two-column-layout--footer col-span-full min-w-0', footerClassName)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{footer}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : null}\n\t\t\t\t\t</>\n\t\t\t\t),\n\t\t\t},\n\t\t\tstate: {},\n\t\t});\n\t},\n);\n\nTwoColumnLayout.displayName = 'TwoColumnLayout';\n"],"mappings":";;;;;;;;;;AASA,IAAaO,IAAYC,EAA2C,SACnE,EAAE,cAAW,aAAU,WAAQ,WAAQ,GAAGC,KAC1C,GACC;CACD,OAAOC,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH,WAAWR,EAAG,2CAA2CI,EAAgB;IAAE;IAAU;GAAO,CAAC,GAAGM,CAAS;EAC1G;EACA,OAAO,CAAC;CACT,CAAC;AACF,CAAC;AAED,EAAU,cAAc;;;AChBxB,IAAaC,IAAeJ,EAA8C,SACzE,EAAE,cAAW,WAAQ,cAAW,GAAG,GAAGC,KACtC,GACC;CACD,OAAOC,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH;GACA,WAAWR,EACV,yJAAyJY,EAAa,SACtKF,CACD;EACD;EACA,OAAO,CAAC;CACT,CAAC;AACF,CAAC;AAED,EAAa,cAAc;;;ACnB3B,IAAaG,IAAUN,EAAsC,SAC5D,EAAE,cAAW,QAAK,WAAQ,GAAGC,KAC7B,GACC;CACD,OAAOC,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH,WAAWR,EAAG,sBAAsBC,EAAY,EAAE,KAAKa,KAAOZ,EAAkB,QAAQ,CAAC,GAAGQ,CAAS;EACtG;EACA,OAAO,CAAC;CACT,CAAC;AACF,CAAC;AAED,EAAQ,cAAc;;;ACQtB,IAAMK,IAAyB;CAC9B,SAAS;CACT,OAAO;CACP,OAAO;AACR,GACMC,IAAwB;CAC7B,SAAS;CACT,OAAO;CACP,OAAO;AACR,GAGaC,IAAkBV,EAC9B,SACC,EACC,WACA,SACA,UACA,WACA,iBAAc,IACd,aAAU,YACV,UACA,cACA,cACA,WACA,GAAGC,KAEJ,GACC;CACD,IAAM,EAAE,WAAWU,GAAiB,GAAGC,MAAgBC,GAAW,UAAU,CAAC,GACvE,EAAE,WAAWC,GAAe,GAAGC,MAAcF,GAAW,QAAQ,CAAC,GACjE,EAAE,WAAWG,GAAgB,GAAGC,MAAeJ,GAAW,SAAS,CAAC,GACpE,EAAE,WAAWK,GAAiB,GAAGC,MAAgBN,GAAW,UAAU,CAAC;CAE7E,OAAOX,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH,aAAa;GACb,WAAWR,EACV,yDAAyDG,EAAmB,UAC5EwB,MAAY,cAAcZ,EAAuBa,KAAS,aAAaZ,EAAsBY,KAAS,YACtGlB,CACD;GACA,UACC,kBAAAX,GAAA,EAAA,UAAA;IACE8B,KAAmC,OAQhC,OAPH,kBAAC,OAAD;KACC,GAAIV;KACJ,aAAU;KACV,WAAWnB,EAAG,mDAAmDkB,CAAe;KAE/E,UAAAW;IACG,CAAA;IAEN,kBAAC,OAAD;KACC,GAAIP;KACJ,aAAU;KACV,WAAWtB,EAAG,yDAAyDG,EAAmB,UAAUkB,CAAa;KAEhH,UAAAS;IACG,CAAA;IACL,kBAAC,SAAD;KACC,GAAIN;KACJ,aAAU;KACV,WAAWxB,EACV,0DAA0DG,EAAmB,UAC7E4B,MAAgBJ,MAAY,cAAc,mDAAmD,6CAC7FJ,CACD;KAEC,UAAAS;IACK,CAAA;IACNC,KAAmC,OAQhC,OAPH,kBAAC,OAAD;KACC,GAAIP;KACJ,aAAU;KACV,WAAW1B,EAAG,mDAAmDyB,CAAe;KAE/E,UAAAQ;IACG,CAAA;GAEL,EAAA,CAAA;EAEJ;EACA,OAAO,CAAC;CACT,CAAC;AACF,CACD;AAEA,EAAgB,cAAc"}

package/dist/{copyable-DIznBqiT.js → copyable-3fdHfMR3.js}

@@ -1,8 +1,8 @@
 "use client";
 import { useStrings as e } from "./lib/strings.js";
-import { t } from "./utils-B6kKb8jB.js";
-import { n } from "./buttons-BedGfygC.js";
-import { c as r } from "./typography-BQnine1k.js";
+import { t } from "./utils-DhuoqFy4.js";
+import { n } from "./buttons-DeW0bQeK.js";
+import { c as r } from "./typography-C7-YMW1S.js";
 import { forwardRef as i, useEffect as a, useState as o } from "react";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";
 import { Check as l, Copy as u } from "lucide-react";
@@ -62,4 +62,4 @@ p.displayName = "Copyable";
 //#endregion
 export { f as n, p as t };
 
-//# sourceMappingURL=copyable-DIznBqiT.js.map
+//# sourceMappingURL=copyable-3fdHfMR3.js.map

package/dist/{copyable-DIznBqiT.js.map → copyable-3fdHfMR3.js.map}

@@ -1 +1 @@
-{"version":3,"file":"copyable-DIznBqiT.js","names":["Text","defaultCopyableStrings","Copyable","forwardRef","stringsProp","props","strings","useStrings","copied","setCopied","useState","timeout","handleCopy","value","toast","onCopy","error","onError","hasRichDisplayValue","displayValue","buttonClassName","buttonAriaLabel","copyButtonProps","buttonProps","cn","truncate","className","mono","contentClassName","Button","Check","Copy"],"sources":["../src/components/base/copyable/copyable.tsx"],"sourcesContent":["import { Check, Copy } from 'lucide-react';\nimport {\n\tforwardRef,\n\tuseEffect,\n\tuseState,\n\ttype ComponentPropsWithoutRef,\n\ttype ReactNode,\n} from 'react';\n\nimport { toast } from 'sonner';\n\nimport { Button, type ButtonActionProps } from '../buttons';\nimport { Text } from '../../typography';\nimport { useStrings, type StringsProp } from '../../../lib/strings';\nimport { cn } from '../../../lib/utils';\n\nexport interface CopyableStrings {\n\tcopyLabel: string;\n\tcopiedLabel: string;\n\tsuccess: string;\n\terror: string;\n}\n\nexport const defaultCopyableStrings: CopyableStrings = {\n\tcopyLabel: 'Copy value',\n\tcopiedLabel: 'Copied',\n\tsuccess: 'Copied to clipboard',\n\terror: 'Failed to copy',\n};\n\nexport interface CopyableProps extends Omit<\n\tComponentPropsWithoutRef<'span'>,\n\t'children' | 'onCopy' | 'onError'\n> {\n\t/** Value written to the clipboard. */\n\tvalue: string;\n\t/** Optional display content when it differs from the copied value. */\n\tdisplayValue?: ReactNode;\n\t/** Use monospace typography for scalar display content. */\n\tmono?: boolean;\n\t/** Truncate scalar display content with an ellipsis at the width the caller allots. */\n\ttruncate?: boolean;\n\t/** Classes for the scalar display-content wrapper. */\n\tcontentClassName?: string;\n\t/** Classes and native action props for the dedicated copy button. */\n\tbuttonProps?: Omit<ButtonActionProps, 'children' | 'onClick' | 'type'>;\n\t/** Localizable copy affordance and toast copy. */\n\tstrings?: StringsProp<CopyableStrings>;\n\t/** Called after the Clipboard API successfully writes the value. */\n\tonCopy?: (value: string) => void;\n\t/** Called when the Clipboard API rejects the write. */\n\tonError?: (error: unknown) => void;\n}\n\n/**\n * Copyable keeps display content passive and renders a sibling copy button.\n * This permits rich display nodes such as Email or Url without nesting one\n * interactive element inside another.\n */\nexport const Copyable = forwardRef<HTMLSpanElement, CopyableProps>(function Copyable({\n\tvalue,\n\tdisplayValue,\n\tmono = false,\n\ttruncate = false,\n\tclassName,\n\tcontentClassName,\n\tbuttonProps,\n\tstrings: stringsProp,\n\tonCopy,\n\tonError,\n\t...props\n}, ref) {\n\tconst strings = useStrings(defaultCopyableStrings, stringsProp);\n\tconst [copied, setCopied] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!copied) return;\n\t\tconst timeout = window.setTimeout(() => setCopied(false), 2000);\n\t\treturn () => window.clearTimeout(timeout);\n\t}, [copied]);\n\n\tconst handleCopy = async () => {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(value);\n\t\t\tsetCopied(true);\n\t\t\ttoast.success(strings.success);\n\t\t\tonCopy?.(value);\n\t\t} catch (error) {\n\t\t\ttoast.error(strings.error);\n\t\t\tonError?.(error);\n\t\t}\n\t};\n\n\tconst isSimpleText =\n\t\ttypeof displayValue === 'string' ||\n\t\ttypeof displayValue === 'number' ||\n\t\ttypeof displayValue === 'bigint';\n\tconst hasRichDisplayValue = displayValue !== undefined && !isSimpleText;\n\tconst {\n\t\tclassName: buttonClassName,\n\t\t'aria-label': buttonAriaLabel,\n\t\t...copyButtonProps\n\t} = buttonProps ?? {};\n\n\treturn (\n\t\t<span\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t'copyable--component group inline-flex min-w-0 items-center gap-space-sm',\n\t\t\t\t// An inline-flex root sizes to its content, so without this it grew\n\t\t\t\t// past the width the caller allotted and took the copy button out of\n\t\t\t\t// view with it. Capping the root is what gives the content something\n\t\t\t\t// to truncate against; `block` on the value below is the other half.\n\t\t\t\ttruncate && 'max-w-full',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{/* A copyable value is not a link: it keeps the surrounding ink, and rich\n\t\t\t    display nodes such as Email or Url keep their own link styling. */}\n\t\t\t<span className=\"copyable--content min-w-0\">\n\t\t\t\t{hasRichDisplayValue ? (\n\t\t\t\t\tdisplayValue\n\t\t\t\t) : (\n\t\t\t\t\t<Text\n\t\t\t\t\t\ttag=\"span\"\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\tmono && 'font-mono',\n\t\t\t\t\t\t\t// `block` is load-bearing: Text renders a <span>, and overflow\n\t\t\t\t\t\t\t// and max-width do not apply to a non-replaced inline box, so\n\t\t\t\t\t\t\t// `truncate` alone set only white-space and the value ran past\n\t\t\t\t\t\t\t// its container with no ellipsis. Truncating against the width\n\t\t\t\t\t\t\t// the caller allots also retires a hardcoded max-w-[300px],\n\t\t\t\t\t\t\t// which no consumer token could reach.\n\t\t\t\t\t\t\ttruncate && 'block truncate',\n\t\t\t\t\t\t\tcontentClassName,\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{displayValue ?? value}\n\t\t\t\t\t</Text>\n\t\t\t\t)}\n\t\t\t</span>\n\t\t\t<Button\n\t\t\t\t{...copyButtonProps}\n\t\t\t\ttype=\"button\"\n\t\t\t\tsize=\"sm\" iconOnly\n\t\t\t\ttone=\"secondary\"\n\t\t\t\tbuttonStyle=\"ghost\"\n\t\t\t\taria-label={buttonAriaLabel ?? (copied ? strings.copiedLabel : strings.copyLabel)}\n\t\t\t\tonClick={() => void handleCopy()}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t// The copy glyph is a quiet affordance in the secondary ink until hovered.\n\t\t\t\t\t'copyable--trigger shrink-0 text-muted-foreground hover:text-foreground focus-visible:text-foreground',\n\t\t\t\t\tbuttonClassName,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{copied ? (\n\t\t\t\t\t<Check className=\"size-icon-sm text-success\" aria-hidden=\"true\" />\n\t\t\t\t) : (\n\t\t\t\t\t<Copy className=\"size-icon-sm\" aria-hidden=\"true\" />\n\t\t\t\t)}\n\t\t\t</Button>\n\t\t</span>\n\t);\n});\n\nCopyable.displayName = 'Copyable';\n"],"mappings":";;;;;;;;;;AAuBA,IAAaC,IAA0C;CACtD,WAAW;CACX,aAAa;CACb,SAAS;CACT,OAAO;AACR,GA+BaC,IAAWC,EAA2C,SAAkB,EACpF,UACA,iBACA,UAAO,IACP,cAAW,IACX,cACA,qBACA,gBACA,SAASC,GACT,WACA,YACA,GAAGC,KACD,GAAK;CACP,IAAMC,IAAUC,EAAWN,GAAwBG,CAAW,GACxD,CAACI,GAAQC,KAAaC,EAAS,EAAK;CAE1C,QAAgB;EACf,IAAI,CAACF,GAAQ;EACb,IAAMG,IAAU,OAAO,iBAAiBF,EAAU,EAAK,GAAG,GAAI;EAC9D,aAAa,OAAO,aAAaE,CAAO;CACzC,GAAG,CAACH,CAAM,CAAC;CAEX,IAAMI,IAAa,YAAY;EAC9B,IAAI;GAIH,AAHA,MAAM,UAAU,UAAU,UAAUC,CAAK,GACzCJ,EAAU,EAAI,GACdK,EAAM,QAAQR,EAAQ,OAAO,GAC7BS,IAASF,CAAK;EACf,SAASG,GAAO;GAEf,AADAF,EAAM,MAAMR,EAAQ,KAAK,GACzBW,IAAUD,CAAK;EAChB;CACD,GAMME,IAAsBC,MAAiB,KAAA,KAH5C,OAAOA,KAAiB,YACxB,OAAOA,KAAiB,YACxB,OAAOA,KAAiB,UAEnB,EACL,WAAWC,GACX,cAAcC,GACd,GAAGC,MACAC,KAAe,CAAC;CAEpB,OACC,kBAAC,QAAD;EACM;EACL,WAAWC,EACV,2EAKAC,KAAY,cACZC,CACD;EACA,GAAIrB;EAXL,UAAA,CAeC,kBAAC,QAAD;GAAM,WAAU;GACd,UAAAa,IACAC,IAEA,kBAACnB,GAAD;IACC,KAAI;IACJ,WAAWwB,EACVG,KAAQ,aAORF,KAAY,kBACZG,CACD;IAEC,UAAAT,KAAgBN;GACZ,CAAA;EAEF,CAAA,GACN,kBAACgB,GAAD;GACC,GAAIP;GACJ,MAAK;GACL,MAAK;GAAK,UAAA;GACV,MAAK;GACL,aAAY;GACZ,cAAYD,MAAoBb,IAASF,EAAQ,cAAcA,EAAQ;GACvE,eAAe,KAAKM,EAAW;GAC/B,WAAWY,EAEV,wGACAJ,CACD;GAEC,UAAAZ,IACA,kBAACsB,GAAD;IAAO,WAAU;IAA4B,eAAY;GAAQ,CAAA,IAEjE,kBAACC,GAAD;IAAM,WAAU;IAAe,eAAY;GAAQ,CAAA;EAE7C,CAAA,CACH;;AAER,CAAC;AAED,EAAS,cAAc"}
+{"version":3,"file":"copyable-3fdHfMR3.js","names":["Text","defaultCopyableStrings","Copyable","forwardRef","stringsProp","props","strings","useStrings","copied","setCopied","useState","timeout","handleCopy","value","toast","onCopy","error","onError","hasRichDisplayValue","displayValue","buttonClassName","buttonAriaLabel","copyButtonProps","buttonProps","cn","truncate","className","mono","contentClassName","Button","Check","Copy"],"sources":["../src/components/base/copyable/copyable.tsx"],"sourcesContent":["import { Check, Copy } from 'lucide-react';\nimport {\n\tforwardRef,\n\tuseEffect,\n\tuseState,\n\ttype ComponentPropsWithoutRef,\n\ttype ReactNode,\n} from 'react';\n\nimport { toast } from 'sonner';\n\nimport { Button, type ButtonActionProps } from '../buttons';\nimport { Text } from '../../typography';\nimport { useStrings, type StringsProp } from '../../../lib/strings';\nimport { cn } from '../../../lib/utils';\n\nexport interface CopyableStrings {\n\tcopyLabel: string;\n\tcopiedLabel: string;\n\tsuccess: string;\n\terror: string;\n}\n\nexport const defaultCopyableStrings: CopyableStrings = {\n\tcopyLabel: 'Copy value',\n\tcopiedLabel: 'Copied',\n\tsuccess: 'Copied to clipboard',\n\terror: 'Failed to copy',\n};\n\nexport interface CopyableProps extends Omit<\n\tComponentPropsWithoutRef<'span'>,\n\t'children' | 'onCopy' | 'onError'\n> {\n\t/** Value written to the clipboard. */\n\tvalue: string;\n\t/** Optional display content when it differs from the copied value. */\n\tdisplayValue?: ReactNode;\n\t/** Use monospace typography for scalar display content. */\n\tmono?: boolean;\n\t/** Truncate scalar display content with an ellipsis at the width the caller allots. */\n\ttruncate?: boolean;\n\t/** Classes for the scalar display-content wrapper. */\n\tcontentClassName?: string;\n\t/** Classes and native action props for the dedicated copy button. */\n\tbuttonProps?: Omit<ButtonActionProps, 'children' | 'onClick' | 'type'>;\n\t/** Localizable copy affordance and toast copy. */\n\tstrings?: StringsProp<CopyableStrings>;\n\t/** Called after the Clipboard API successfully writes the value. */\n\tonCopy?: (value: string) => void;\n\t/** Called when the Clipboard API rejects the write. */\n\tonError?: (error: unknown) => void;\n}\n\n/**\n * Copyable keeps display content passive and renders a sibling copy button.\n * This permits rich display nodes such as Email or Url without nesting one\n * interactive element inside another.\n */\nexport const Copyable = forwardRef<HTMLSpanElement, CopyableProps>(function Copyable({\n\tvalue,\n\tdisplayValue,\n\tmono = false,\n\ttruncate = false,\n\tclassName,\n\tcontentClassName,\n\tbuttonProps,\n\tstrings: stringsProp,\n\tonCopy,\n\tonError,\n\t...props\n}, ref) {\n\tconst strings = useStrings(defaultCopyableStrings, stringsProp);\n\tconst [copied, setCopied] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!copied) return;\n\t\tconst timeout = window.setTimeout(() => setCopied(false), 2000);\n\t\treturn () => window.clearTimeout(timeout);\n\t}, [copied]);\n\n\tconst handleCopy = async () => {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(value);\n\t\t\tsetCopied(true);\n\t\t\ttoast.success(strings.success);\n\t\t\tonCopy?.(value);\n\t\t} catch (error) {\n\t\t\ttoast.error(strings.error);\n\t\t\tonError?.(error);\n\t\t}\n\t};\n\n\tconst isSimpleText =\n\t\ttypeof displayValue === 'string' ||\n\t\ttypeof displayValue === 'number' ||\n\t\ttypeof displayValue === 'bigint';\n\tconst hasRichDisplayValue = displayValue !== undefined && !isSimpleText;\n\tconst {\n\t\tclassName: buttonClassName,\n\t\t'aria-label': buttonAriaLabel,\n\t\t...copyButtonProps\n\t} = buttonProps ?? {};\n\n\treturn (\n\t\t<span\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t'copyable--component group inline-flex min-w-0 items-center gap-space-sm',\n\t\t\t\t// An inline-flex root sizes to its content, so without this it grew\n\t\t\t\t// past the width the caller allotted and took the copy button out of\n\t\t\t\t// view with it. Capping the root is what gives the content something\n\t\t\t\t// to truncate against; `block` on the value below is the other half.\n\t\t\t\ttruncate && 'max-w-full',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{/* A copyable value is not a link: it keeps the surrounding ink, and rich\n\t\t\t    display nodes such as Email or Url keep their own link styling. */}\n\t\t\t<span className=\"copyable--content min-w-0\">\n\t\t\t\t{hasRichDisplayValue ? (\n\t\t\t\t\tdisplayValue\n\t\t\t\t) : (\n\t\t\t\t\t<Text\n\t\t\t\t\t\ttag=\"span\"\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\tmono && 'font-mono',\n\t\t\t\t\t\t\t// `block` is load-bearing: Text renders a <span>, and overflow\n\t\t\t\t\t\t\t// and max-width do not apply to a non-replaced inline box, so\n\t\t\t\t\t\t\t// `truncate` alone set only white-space and the value ran past\n\t\t\t\t\t\t\t// its container with no ellipsis. Truncating against the width\n\t\t\t\t\t\t\t// the caller allots also retires a hardcoded max-w-[300px],\n\t\t\t\t\t\t\t// which no consumer token could reach.\n\t\t\t\t\t\t\ttruncate && 'block truncate',\n\t\t\t\t\t\t\tcontentClassName,\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{displayValue ?? value}\n\t\t\t\t\t</Text>\n\t\t\t\t)}\n\t\t\t</span>\n\t\t\t<Button\n\t\t\t\t{...copyButtonProps}\n\t\t\t\ttype=\"button\"\n\t\t\t\tsize=\"sm\" iconOnly\n\t\t\t\ttone=\"secondary\"\n\t\t\t\tbuttonStyle=\"ghost\"\n\t\t\t\taria-label={buttonAriaLabel ?? (copied ? strings.copiedLabel : strings.copyLabel)}\n\t\t\t\tonClick={() => void handleCopy()}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t// The copy glyph is a quiet affordance in the secondary ink until hovered.\n\t\t\t\t\t'copyable--trigger shrink-0 text-muted-foreground hover:text-foreground focus-visible:text-foreground',\n\t\t\t\t\tbuttonClassName,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{copied ? (\n\t\t\t\t\t<Check className=\"size-icon-sm text-success\" aria-hidden=\"true\" />\n\t\t\t\t) : (\n\t\t\t\t\t<Copy className=\"size-icon-sm\" aria-hidden=\"true\" />\n\t\t\t\t)}\n\t\t\t</Button>\n\t\t</span>\n\t);\n});\n\nCopyable.displayName = 'Copyable';\n"],"mappings":";;;;;;;;;;AAuBA,IAAaC,IAA0C;CACtD,WAAW;CACX,aAAa;CACb,SAAS;CACT,OAAO;AACR,GA+BaC,IAAWC,EAA2C,SAAkB,EACpF,UACA,iBACA,UAAO,IACP,cAAW,IACX,cACA,qBACA,gBACA,SAASC,GACT,WACA,YACA,GAAGC,KACD,GAAK;CACP,IAAMC,IAAUC,EAAWN,GAAwBG,CAAW,GACxD,CAACI,GAAQC,KAAaC,EAAS,EAAK;CAE1C,QAAgB;EACf,IAAI,CAACF,GAAQ;EACb,IAAMG,IAAU,OAAO,iBAAiBF,EAAU,EAAK,GAAG,GAAI;EAC9D,aAAa,OAAO,aAAaE,CAAO;CACzC,GAAG,CAACH,CAAM,CAAC;CAEX,IAAMI,IAAa,YAAY;EAC9B,IAAI;GAIH,AAHA,MAAM,UAAU,UAAU,UAAUC,CAAK,GACzCJ,EAAU,EAAI,GACdK,EAAM,QAAQR,EAAQ,OAAO,GAC7BS,IAASF,CAAK;EACf,SAASG,GAAO;GAEf,AADAF,EAAM,MAAMR,EAAQ,KAAK,GACzBW,IAAUD,CAAK;EAChB;CACD,GAMME,IAAsBC,MAAiB,KAAA,KAH5C,OAAOA,KAAiB,YACxB,OAAOA,KAAiB,YACxB,OAAOA,KAAiB,UAEnB,EACL,WAAWC,GACX,cAAcC,GACd,GAAGC,MACAC,KAAe,CAAC;CAEpB,OACC,kBAAC,QAAD;EACM;EACL,WAAWC,EACV,2EAKAC,KAAY,cACZC,CACD;EACA,GAAIrB;EAXL,UAAA,CAeC,kBAAC,QAAD;GAAM,WAAU;GACd,UAAAa,IACAC,IAEA,kBAACnB,GAAD;IACC,KAAI;IACJ,WAAWwB,EACVG,KAAQ,aAORF,KAAY,kBACZG,CACD;IAEC,UAAAT,KAAgBN;GACZ,CAAA;EAEF,CAAA,GACN,kBAACgB,GAAD;GACC,GAAIP;GACJ,MAAK;GACL,MAAK;GAAK,UAAA;GACV,MAAK;GACL,aAAY;GACZ,cAAYD,MAAoBb,IAASF,EAAQ,cAAcA,EAAQ;GACvE,eAAe,KAAKM,EAAW;GAC/B,WAAWY,EAEV,wGACAJ,CACD;GAEC,UAAAZ,IACA,kBAACsB,GAAD;IAAO,WAAU;IAA4B,eAAY;GAAQ,CAAA,IAEjE,kBAACC,GAAD;IAAM,WAAU;IAAe,eAAY;GAAQ,CAAA;EAE7C,CAAA,CACH;;AAER,CAAC;AAED,EAAS,cAAc"}

package/dist/{data-display-BdgCAw8T.js → data-display-Cmj-xZYl.js}

@@ -1,17 +1,17 @@
 "use client";
 import { d as e } from "./ui-provider-C-74NVLc.js";
 import { useStrings as t } from "./lib/strings.js";
-import { t as n } from "./utils-B6kKb8jB.js";
-import { c as r, o as i, s as a } from "./typography-BQnine1k.js";
+import { t as n } from "./utils-DhuoqFy4.js";
+import { c as r, o as i, s as a } from "./typography-C7-YMW1S.js";
 import { n as o } from "./text.styles-B64My8RZ.js";
-import { r as s, t as c } from "./structure-DuxKl954.js";
-import { i as l, o as u, r as d, s as f } from "./feedback-Dm4izqFn.js";
+import { r as s, t as c } from "./structure-DZJ2wbAU.js";
+import { a as l, c as u, i as d, s as f } from "./feedback-Dzo1xtAU.js";
 import { n as p } from "./composition.recipes-COdiFhxB.js";
-import { _ as m, m as h } from "./primitives-ByWgGUgt.js";
-import { t as g } from "./badge-xIiV_E7f.js";
-import { t as _ } from "./separator-Ct_WSWTJ.js";
-import { n as v } from "./display-KsZLw9Ov.js";
-import { c as y, n as b, o as x, r as S, t as C, u as w } from "./item-DjCcM18E.js";
+import { _ as m, m as h } from "./primitives-BkkQjYl7.js";
+import { t as g } from "./badge-wWauMgAt.js";
+import { t as _ } from "./separator-DM6gs2vu.js";
+import { n as v } from "./display-CT_N2a3w.js";
+import { c as y, n as b, o as x, r as S, t as C, u as w } from "./item-FfWnaYST.js";
 import { forwardRef as T, useId as E } from "react";
 import { Fragment as D, jsx as O, jsxs as k } from "react/jsx-runtime";
 import { Search as A } from "lucide-react";
@@ -499,9 +499,10 @@ var B = {
 	description: "Once data lands, it will show up in this view.",
 	ariaLabel: "Empty state"
 }, V = {
-	sm: "!p-surface-xs",
-	md: "!p-surface",
-	lg: "!p-surface-lg"
+	none: "p-0",
+	sm: "p-surface-xs",
+	md: "p-surface",
+	lg: "p-surface-lg"
 }, H = {
 	none: "default",
 	icon: "icon",
@@ -519,10 +520,10 @@ var B = {
 		role: "status",
 		"aria-label": S ?? w.ariaLabel,
 		className: n("empty-state--component", V[E], y ? "border-border border border-dashed" : "border-border border-0", b),
-		children: [/* @__PURE__ */ k(u, {
+		children: [/* @__PURE__ */ k(f, {
 			className: "empty-state--header",
 			children: [
-				!!M && /* @__PURE__ */ O(f, {
+				!!M && /* @__PURE__ */ O(u, {
 					variant: H[m],
 					className: n("empty-state--media", U[m]),
 					children: j
@@ -960,4 +961,4 @@ Z.displayName = "RelationshipCardFrame";
 //#endregion
 export { K as a, B as c, L as d, I as f, N as h, q as i, z as l, P as m, Y as n, G as o, F as p, J as r, W as s, Z as t, R as u };
 
-//# sourceMappingURL=data-display-BdgCAw8T.js.map
+//# sourceMappingURL=data-display-Cmj-xZYl.js.map