themelia-react-ui 2.0.4 → 2.0.6

package/dist/components/base/sidebar/sidebar.d.ts

@@ -1,11 +1,12 @@
 /**
  * base/sidebar — tokenized wrapper around the shadcn `Sidebar` compound component.
  *
- * The shadcn source stays untouched. This layer applies the package shell,
+ * The internal Base UI owner supplies shared state. This layer applies the package shell,
  * density, spacing, typography, focus, and stable DOM-hook contracts while
  * preserving every compound part and polymorphic `render` seam.
  */
 import * as React from 'react';
+import { type SidebarPanelId, type SidebarPresentation, type SidebarStateProps } from '../../ui/sidebar-state';
 import { SidebarContent as SidebarContentPrimitive, SidebarFooter as SidebarFooterPrimitive, SidebarGroup as SidebarGroupPrimitive, SidebarGroupAction as SidebarGroupActionPrimitive, SidebarGroupContent as SidebarGroupContentPrimitive, SidebarGroupLabel as SidebarGroupLabelPrimitive, SidebarHeader as SidebarHeaderPrimitive, SidebarInput as SidebarInputPrimitive, SidebarInset as SidebarInsetPrimitive, SidebarMenu as SidebarMenuPrimitive, SidebarMenuAction as SidebarMenuActionPrimitive, SidebarMenuBadge as SidebarMenuBadgePrimitive, SidebarMenuButton as SidebarMenuButtonPrimitive, SidebarMenuItem as SidebarMenuItemPrimitive, SidebarMenuSub as SidebarMenuSubPrimitive, SidebarMenuSubButton as SidebarMenuSubButtonPrimitive, SidebarMenuSubItem as SidebarMenuSubItemPrimitive, SidebarRail as SidebarRailPrimitive, SidebarSeparator as SidebarSeparatorPrimitive, SidebarTrigger as SidebarTriggerPrimitive, useSidebar as useSidebarPrimitive } from '../../ui/sidebar';
 import type { ComponentScale } from '../../../lib/component-vocabulary';
 import { type StringsProp } from '../../../lib/strings';
@@ -15,6 +16,10 @@ export interface SidebarStrings {
 }
 export declare const defaultSidebarStrings: SidebarStrings;
 export interface SidebarProps extends React.ComponentProps<'div'> {
+    /** Explicit state identity; otherwise inherits the nearest shell region. */
+    panelId?: SidebarPanelId;
+    /** Desktop canvas treatment. Drawers always retain their opaque sidebar surface. */
+    surface?: 'default' | 'transparent';
     /** Edge where the desktop rail and mobile sheet are anchored. */
     side?: 'left' | 'right';
     /** Surface treatment and inset behavior for the desktop shell. */
@@ -27,7 +32,7 @@ export interface SidebarProps extends React.ComponentProps<'div'> {
     surfaceClassName?: string;
     /** Classes for the responsive positioning root. */
     rootClassName?: string;
-    /** Copy for the visually hidden mobile sheet title and description. */
+    /** Copy for the mobile drawer heading and accessible description. */
     strings?: StringsProp<SidebarStrings>;
 }
 type SidebarContentProps = React.ComponentProps<typeof SidebarContentPrimitive>;
@@ -83,7 +88,7 @@ export interface SidebarMenuSubButtonProps extends Omit<React.ComponentProps<typ
     active?: boolean;
 }
 type SidebarMenuSubItemProps = React.ComponentProps<typeof SidebarMenuSubItemPrimitive>;
-export interface SidebarProviderProps extends React.ComponentProps<'div'> {
+export interface SidebarProviderProps extends React.ComponentProps<'div'>, SidebarStateProps {
     /** Use the provider width for drawers in embedded workspaces; viewport remains the default. */
     adaptTo?: 'viewport' | 'container';
     /** Initial expanded state for uncontrolled sidebars. @default true */
@@ -105,8 +110,24 @@ type SidebarRailProps = React.ComponentProps<typeof SidebarRailPrimitive>;
 type SidebarSeparatorProps = React.ComponentProps<typeof SidebarSeparatorPrimitive>;
 type SidebarTriggerProps = React.ComponentProps<typeof SidebarTriggerPrimitive>;
 declare function SidebarProvider({ className, style, menuDensity, ...props }: SidebarProviderProps): React.JSX.Element;
+export interface SidebarRegionProps extends Omit<React.ComponentProps<'div'>, 'ref'> {
+    /** Ref to the semantic aside boundary. */
+    ref?: React.Ref<HTMLElement>;
+    /** Named desktop/drawer state and descendant scope owned by this region. */
+    panelId: SidebarPanelId;
+    /** Minimum available width for docking; primary/secondary/aside default to 768/1024/1440. Zero stays docked. */
+    dockAt?: number;
+    /** Persistent region geometry, separate from docked/drawer presentation. */
+    presentation?: 'panel' | 'rail';
+    /** Physical edge inherited by the scoped Sidebar and its drawer. @default 'left' */
+    side?: 'left' | 'right';
+    /** Expanded CSS length; defaults to --shell-sidebar-width. Rail widths derive from existing density roots. */
+    width?: string;
+}
+/** A named state and width boundary. Shells can also use static content without a provider. */
+declare function SidebarRegion({ panelId, dockAt, presentation, side, width, className, style, ref: forwardedRef, children, ...props }: SidebarRegionProps): React.JSX.Element;
 /** Tokenized responsive sidebar shell with contained and viewport-fixed modes. */
-declare function Sidebar({ side, variant, collapsible, contained, className, surfaceClassName, rootClassName, children, dir, strings: stringsProp, ...props }: SidebarProps): React.JSX.Element;
+declare function Sidebar(props: SidebarProps): React.JSX.Element;
 declare function SidebarHeader({ className, ...props }: SidebarHeaderProps): React.JSX.Element;
 declare function SidebarFooter({ className, ...props }: SidebarFooterProps): React.JSX.Element;
 declare function SidebarContent({ className, ...props }: SidebarContentProps): React.JSX.Element;
@@ -128,8 +149,11 @@ declare function SidebarTrigger({ className, ...props }: SidebarTriggerProps): R
 declare function SidebarMenuButton({ className, render, size, tooltip, children, active, ...props }: SidebarMenuButtonProps): React.JSX.Element;
 declare function SidebarMenuSubButton({ className, children, active, ...props }: SidebarMenuSubButtonProps): React.JSX.Element;
 declare function SidebarGroupLabel({ className, children, ...props }: SidebarGroupLabelProps): React.JSX.Element;
-export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, };
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRegion, SidebarRail, SidebarSeparator, SidebarTrigger, };
 /** Internal bridge for the layout layer; not part of the base package entrypoint. */
 export declare const useBaseSidebarContext: typeof useSidebarPrimitive;
+/** Lets composed layouts omit a sidebar control when no provider is present. */
+export declare function useHasSidebarProvider(): boolean;
 /** Internal density bridge for composed navigation; not a base entrypoint export. */
 export declare function useBaseSidebarMenuDensity(): SidebarMenuDensity | undefined;
+export type { SidebarPanelId, SidebarPresentation };

package/dist/components/base/toaster/index.d.ts

@@ -1 +1,2 @@
 export { Toaster, type ToasterProps } from './toaster';
+export { toast } from 'sonner';

package/dist/components/base/upload/avatar-upload.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { type StringsProp } from '../../../lib/strings';
 import { type ComponentScale } from '../../../lib/ui-provider';
+import { type FieldControlAttributes } from '../../../lib/field-control-attributes';
 export type AvatarUploadSize = ComponentScale;
 export interface AvatarUploadStrings {
     change: string;
@@ -15,7 +16,7 @@ export interface AvatarUploadStrings {
     customValidationFailed: (fileName: string) => string;
 }
 export declare const defaultAvatarUploadStrings: AvatarUploadStrings;
-export interface AvatarUploadProps {
+export interface AvatarUploadProps extends FieldControlAttributes {
     /** Selected file. Controlled. */
     value?: File;
     onValueChange?: (file?: File) => void;

package/dist/components/base/upload/image-upload.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import { type StringsProp } from '../../../lib/strings';
+import { type FieldControlAttributes } from '../../../lib/field-control-attributes';
 type ImageUploadAspectRatio = 'square' | 'standard' | 'widescreen' | 'portrait';
 type ImageUploadLayout = 'stacked' | 'inline';
 type ImageUploadFit = 'cover' | 'contain';
@@ -28,7 +29,7 @@ export interface ImageUploadStrings {
     moreFiles: (count: number) => string;
 }
 export declare const defaultImageUploadStrings: ImageUploadStrings;
-export interface ImageUploadProps {
+export interface ImageUploadProps extends FieldControlAttributes {
     /** Accepted MIME types or extensions, as the native `accept` attribute. */
     accept?: string;
     /** Allows more than one file to be chosen. */

package/dist/components/blocks/ai/ai-citation/types.d.ts

@@ -16,7 +16,9 @@ export interface AiCitationStrings {
     title: string;
     sourceCount: (n: number) => string;
     hiddenCount: (n: number) => string;
+    /** Supplied overrides describe how to open the source list. */
     expand: string;
+    /** Supplied overrides describe how to close the source list. */
     collapse: string;
     visit: string;
     relevance: string;

package/dist/components/blocks/ai/ai-file-tree/types.d.ts

@@ -38,7 +38,7 @@ export interface AiFileTreeProps extends Omit<ComponentProps<'div'>, 'children'
     selectedId?: string;
     /** Click handler — fires for files only by default. */
     onSelect?: (node: AiFileTreeNode) => void;
-    /** Hide diff status badges; semantic icon colors remain visible. */
+    /** Hide diff status badges; each file icon then takes its status colour instead. With badges shown, icons stay neutral. */
     hideStatusLabels?: boolean;
     /** Indent width per nesting level (px). Omit for the shared token-backed hierarchy inset. */
     indent?: number;

package/dist/components/blocks/ai/ai-reasoning/types.d.ts

@@ -7,7 +7,9 @@ export interface AiReasoningStrings {
     thoughtFor: string;
     /** Header label when no duration is available. */
     thoughtDone: string;
+    /** Supplied overrides describe how to open the reasoning trace. */
     expandAria: string;
+    /** Supplied overrides describe how to close the reasoning trace. */
     collapseAria: string;
 }
 export declare const defaultAiReasoningStrings: AiReasoningStrings;

package/dist/components/blocks/ai/ai-sources/types.d.ts

@@ -16,7 +16,9 @@ export interface AiSourceItem {
 export interface AiSourcesStrings {
     /** Header title — `{{count}}` placeholder for the source count. */
     title: string;
+    /** Supplied overrides describe how to open the source list. */
     expand: string;
+    /** Supplied overrides describe how to close the source list. */
     collapse: string;
     visit: string;
 }

package/dist/components/blocks/ai/ai-tool-call/types.d.ts

@@ -7,11 +7,15 @@ export interface AiToolCallStrings {
     running: string;
     success: string;
     error: string;
+    /** Supplied overrides describe how to open the details. */
     expand: string;
+    /** Supplied overrides describe how to close the details. */
     collapse: string;
     args: string;
     result: string;
     durationLabel: string;
+    /** Label before the elapsed time of a call that is still queued or running. Additive. */
+    elapsedLabel?: string;
 }
 export declare const defaultAiToolCallStrings: AiToolCallStrings;
 export interface AiToolCallProps {
@@ -23,7 +27,7 @@ export interface AiToolCallProps {
     args?: ReactNode;
     result?: ReactNode;
     error?: ReactNode;
-    /** Duration in ms; rendered as "Took 1.2s". */
+    /** Duration in ms; rendered as "Took 1.2s", or "Elapsed 1.2s" while the call is queued or running. */
     durationMs?: number;
     /** Expanded state, for controlled use. */
     expanded?: boolean;

package/dist/components/blocks/ai/ai.strings.d.ts

@@ -15,6 +15,8 @@ export interface AiSummaryStrings {
         medium: string;
         high: string;
     };
+    /** Visible name of the confidence signal, read before its level. Additive. */
+    confidenceLabel?: string;
 }
 export declare const defaultAiSummaryStrings: AiSummaryStrings;
 export interface AiClassificationStrings {

package/dist/components/blocks/analytics/metric/metric.d.ts

@@ -1,3 +1,4 @@
+import type { SemanticTone } from '../../../../lib/component-vocabulary';
 import type { MetricColorScheme, MetricData, MetricSize, MetricVariant } from '../types';
 export interface MetricProps {
     /** Records to render. */
@@ -6,6 +7,9 @@ export interface MetricProps {
     variant?: MetricVariant;
     /** Size preset. */
     size?: MetricSize;
+    /** Tone for bordered surfaces and colored progress. Takes precedence over colorScheme. */
+    tone?: SemanticTone;
+    /** @deprecated Use tone. */
     colorScheme?: MetricColorScheme;
     /** Renders the sparkline. */
     showSparkline?: boolean;

package/dist/components/blocks/analytics/metric-comparison/metric-comparison.d.ts

@@ -6,6 +6,10 @@ export interface MetricComparisonStrings {
     currentLabel: string;
     previousLabel: string;
     suffix: string;
+    /** Copy shown when the relative change cannot be calculated. */
+    noBaseline?: string;
+    /** Unit for the absolute change between two percentages. Additive; defaults to `pp`. */
+    pointsUnit?: string;
 }
 export declare const defaultMetricComparisonStrings: MetricComparisonStrings;
 export interface MetricComparisonProps {

package/dist/components/blocks/analytics/metric-grid/metric-grid.d.ts

@@ -1,13 +1,12 @@
-import type { MetricColorScheme, MetricData, MetricSize, MetricVariant } from '../types';
-export interface MetricGridProps {
+import { type MetricProps } from '../metric/metric';
+import type { MetricData, MetricSize, MetricVariant } from '../types';
+export interface MetricGridProps extends Pick<MetricProps, 'tone' | 'colorScheme'> {
     /** Metrics rendered as one responsive peer collection. */
     metrics: MetricData[];
     /** Cell variant. `card` composes the canonical Card surface. */
     variant?: Extract<MetricVariant, 'card' | 'compact' | 'bordered' | 'accent' | 'colored'>;
     /** Shared visual size forwarded to every metric. */
     size?: MetricSize;
-    /** Shared semantic color recipe forwarded to every metric. */
-    colorScheme?: MetricColorScheme;
     /** Maximum column count; narrower parents use fewer tracks. `auto` chooses from the cell count. */
     columns?: 'auto' | 1 | 2 | 3 | 4 | 6;
     /** Peer spacing. Defaults to `xl`; use denser gaps explicitly for compact lists. */
@@ -27,7 +26,7 @@ export interface MetricGridProps {
      */
     className?: string;
 }
-export declare function MetricGrid({ metrics, variant, size, colorScheme, columns, gap, showSparklines, showChanges, showIcons, loading, className, }: MetricGridProps): import("react").JSX.Element;
+export declare function MetricGrid({ metrics, variant, size, tone, colorScheme, columns, gap, showSparklines, showChanges, showIcons, loading, className, }: MetricGridProps): import("react").JSX.Element;
 export declare namespace MetricGrid {
     var displayName: string;
 }

package/dist/components/blocks/analytics/types.d.ts

@@ -15,7 +15,7 @@ export type MetricDirection = 'up' | 'down' | 'neutral';
  * for some metrics "down" is good (e.g. churn), so consumers can override.
  */
 export type MetricTrend = 'positive' | 'negative' | 'neutral';
-/** Colour scheme used by Metric variants that support tinting. */
+/** @deprecated Use the shared semantic tone through the tone prop. */
 export type MetricColorScheme = 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info';
 /** Visual layout variant for the canonical `Metric` component. */
 export type MetricVariant = 
@@ -27,7 +27,7 @@ export type MetricVariant =
  | 'compact'
 /** Inline `Label: value ↑12%` chip. Pure inline copy. */
  | 'minimal'
-/** Border + soft tint based on `colorScheme`. */
+/** Border and soft tint based on `tone`. */
  | 'bordered'
 /** Dark surface card with bottom-aligned area sparkline. Hero-row variant. */
  | 'accent'

package/dist/components/blocks/analytics/usage-card/usage-card.strings.d.ts

@@ -12,6 +12,8 @@ export interface UsageCardStrings {
     daily: string;
     average: string;
     perDay: string;
+    /** Shown in place of the daily average when a day's record is missing. Additive. */
+    averageUnavailable?: string;
     resources: string;
     periods: string;
     loading: string;

package/dist/components/blocks/commerce/cart-summary/cart-summary.d.ts

@@ -1,5 +1,5 @@
 import { type CartSummaryCardProps } from './types';
-export declare function CartSummaryCard({ items, subtotal, tax, shipping, discount, total, onCheckout, className, strings: stringsProp, ...props }: CartSummaryCardProps): import("react").JSX.Element;
+export declare function CartSummaryCard({ items, subtotal, tax, shipping, discount, total, onCheckout, className, strings: stringsProp, surface, padding, headerDivider, ...props }: CartSummaryCardProps): import("react").JSX.Element;
 export declare namespace CartSummaryCard {
     var displayName: string;
 }

package/dist/components/blocks/commerce/cart-summary/types.d.ts

@@ -1,4 +1,5 @@
 import type { ComponentPropsWithoutRef } from 'react';
+import type { CardProps } from '../../../base/cards';
 import type { StringsProp } from '../../../../lib/strings';
 export interface CartLineItem {
     /** Stable identity for this entry. */
@@ -35,7 +36,8 @@ export interface CartSummaryStrings {
     formatQuantity: (quantity: number) => string;
 }
 export declare const defaultCartSummaryStrings: CartSummaryStrings;
-export interface CartSummaryCardProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'> {
+/** Unframed by default. Set surface="card" to let this owner frame its heading and body. */
+export interface CartSummaryCardProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'>, Pick<CardProps, 'surface' | 'padding' | 'headerDivider'> {
     /** Line items in the cart. */
     items: CartLineItem[];
     /** Formatted total before tax, shipping, and discounts. */

package/dist/components/blocks/commerce/discount-stack/discount-stack.d.ts

@@ -1,5 +1,5 @@
 import { type DiscountStackPreviewProps } from './types';
-export declare function DiscountStackPreview({ discounts, totalSavings, className, strings: stringsProp, ...props }: DiscountStackPreviewProps): import("react").JSX.Element;
+export declare function DiscountStackPreview({ discounts, totalSavings, className, strings: stringsProp, surface, padding, headerDivider, ...props }: DiscountStackPreviewProps): import("react").JSX.Element;
 export declare namespace DiscountStackPreview {
     var displayName: string;
 }

package/dist/components/blocks/commerce/discount-stack/types.d.ts

@@ -1,5 +1,6 @@
 import type { ComponentPropsWithoutRef, ReactNode } from 'react';
 import type { BadgeTone } from '../../../base/badge';
+import type { CardProps } from '../../../base/cards';
 import type { StringsProp } from '../../../../lib/strings';
 export interface Discount {
     /** Stable identity for this entry. Falls back to the kind, label and position. */
@@ -25,7 +26,8 @@ export interface DiscountStackStrings {
     totalSavings: string;
 }
 export declare const defaultDiscountStackStrings: DiscountStackStrings;
-export interface DiscountStackPreviewProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'> {
+/** Unframed by default. Set surface="card" to let this owner frame its heading and body. */
+export interface DiscountStackPreviewProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'>, Pick<CardProps, 'surface' | 'padding' | 'headerDivider'> {
     /** Discounts applied, in the order they stack. */
     discounts: Discount[];
     /** Formatted sum of every discount. */

package/dist/components/blocks/commerce/fulfillment-group/fulfillment-group.d.ts

@@ -1,5 +1,5 @@
 import { type FulfillmentGroupProps } from './types';
-export declare function FulfillmentGroup({ status, location, notice, noticeIcon: NoticeIcon, items, children, actions, renderLink, className, strings: stringsProp, ...props }: FulfillmentGroupProps): import("react").JSX.Element;
+export declare function FulfillmentGroup({ status, location, notice, noticeIcon: NoticeIcon, items, count, children, actions, renderLink, surface, padding, className, strings: stringsProp, ...props }: FulfillmentGroupProps): import("react").JSX.Element;
 export declare namespace FulfillmentGroup {
     var displayName: string;
 }

package/dist/components/blocks/commerce/fulfillment-group/types.d.ts

@@ -13,8 +13,12 @@ export interface FulfillmentGroupStrings extends OrderLineItemStrings {
     moreActions: string;
 }
 export declare const defaultFulfillmentGroupStrings: FulfillmentGroupStrings;
-/** Header and footer rules follow Card's provider defaults; `headerDivider` / `footerDivider` override them per group. */
-export interface FulfillmentGroupProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'>, Pick<CardProps, 'headerDivider' | 'footerDivider'> {
+/**
+ * Framed by default. Set surface="flat" to embed the group in an existing
+ * surface without a second frame. Header and footer rules follow Card's
+ * provider defaults; `headerDivider` / `footerDivider` override them per group.
+ */
+export interface FulfillmentGroupProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'>, Pick<CardProps, 'surface' | 'padding' | 'headerDivider' | 'footerDivider'> {
     /** Where these goods are. Drives the heading chip's label and tone. */
     status: FulfillmentStatus;
     /** Where the group ships from. */
@@ -30,6 +34,11 @@ export interface FulfillmentGroupProps extends Omit<ComponentPropsWithoutRef<'di
     }>;
     /** The rows, as data. The heading counts them. */
     items?: OrderLine[];
+    /**
+     * Units in the group, for the heading's count when `children` replace the
+     * `items` rows, such as a partial dispatch of a discounted line.
+     */
+    count?: number;
     /** Replaces `items` wholesale, for a caller who needs control of a row. The heading then carries no count. */
     children?: ReactNode;
     /**

package/dist/components/blocks/commerce/index.d.ts

@@ -21,12 +21,12 @@ export { CouponInputCard, defaultCouponInputStrings, type CouponInputCardProps,
 export { OrderStatusCard, defaultOrderStatusStrings, type OrderStatusCardProps, type OrderStatusStrings, type OrderStatusEvent, type OrderStatusKind, } from './order-status';
 export { PaymentMethod, PaymentMethodCard, defaultPaymentMethodStrings, type PaymentMethodCardProps, type PaymentMethodProps, type PaymentMethodStrings, type PaymentMethodVariant, type PaymentBrand, } from './payment-method';
 export { SeoListingCard, DEFAULT_SEO_LISTING_LIMITS, calculateSeoListingScore, defaultSeoListingCardStrings, getSeoPermalinkPath, getSeoPermalinkSlug, type SeoListingCardProps, type SeoListingCardStrings, type SeoListingCheckId, type SeoListingCheckResult, type SeoListingCheckStatus, type SeoListingScoreInput, type SeoListingScoreLimits, type SeoListingScoreResult, } from './seo-listing';
-export type { InvoiceStatus, InvoiceMiniData, InvoiceMiniProps } from './invoice-mini';
-export { InvoiceMini } from './invoice-mini';
-export type { InvoiceHeaderProps, InvoiceParty } from './invoice-header';
-export { InvoiceHeader } from './invoice-header';
-export type { InvoiceLineItem, InvoiceLineItemsProps } from './invoice-line-items';
-export { InvoiceLineItems } from './invoice-line-items';
+export type { InvoiceStatus, InvoiceMiniData, InvoiceMiniProps, InvoiceMiniStrings } from './invoice-mini';
+export { InvoiceMini, defaultInvoiceMiniStrings, invoiceStatusTone } from './invoice-mini';
+export type { InvoiceHeaderProps, InvoiceHeaderStrings, InvoiceParty } from './invoice-header';
+export { InvoiceHeader, defaultInvoiceHeaderStrings } from './invoice-header';
+export type { InvoiceColumn, InvoiceLineItem, InvoiceLineItemsFooterRow, InvoiceLineItemsProps, InvoiceLineItemsStrings, } from './invoice-line-items';
+export { InvoiceLineItems, defaultInvoiceLineItemsStrings } from './invoice-line-items';
 export type { OrderTimelineEvent, OrderTimelineProps } from './order-timeline';
 export { OrderTimeline } from './order-timeline';
 export type { PaymentEvent, PaymentTimelineProps } from './payment-timeline';
@@ -34,6 +34,7 @@ export { PaymentTimeline } from './payment-timeline';
 export { InventorySectionCard, defaultInventorySectionStrings, type InventoryPolicy, type InventorySectionCardProps, type InventorySectionChange, type InventorySectionField, type InventorySectionMetric, type InventorySectionName, type InventorySectionStrings, type InventorySectionValue, type InventoryStatus, } from './inventory-section';
 export { AmountRow, SummaryPanel, type AmountRowProps, type SummaryPanelProps } from './summary-panel';
 export type { FulfillmentStatus, OrderAddress, PaymentStatus, TransactionKind, TransactionStatus, } from './shared/order-status';
+export { fulfillmentStatusTone, paymentStatusTone, transactionStatusTone } from './shared/order-status';
 export { OrderHeader, defaultOrderHeaderStrings, type OrderHeaderProps, type OrderHeaderStrings, } from './order-header';
 export { FulfillmentGroup, defaultFulfillmentGroupStrings, type FulfillmentGroupProps, type FulfillmentGroupStrings, } from './fulfillment-group';
 export { OrderLineItem, defaultOrderLineItemStrings, type OrderLine, type OrderLineItemProps, type OrderLineItemStrings, type OrderLineProperty, } from './order-line-item';

package/dist/components/blocks/commerce/inventory-section/inventory-section.d.ts

@@ -1,5 +1,5 @@
 import { type InventorySectionCardProps } from './types';
-export declare function InventorySectionCard({ value, onValueChange, errors, disabled, readOnly, visibleSections, visibleFields, locationOptions, countryOptions, tagRecommendations, maxTags, onGenerateSku, onRestock, className, strings: stringsProp, }: InventorySectionCardProps): import("react").JSX.Element;
+export declare function InventorySectionCard({ value, onValueChange, errors, disabled, readOnly, visibleSections, visibleFields, locationOptions, countryOptions, tagRecommendations, maxTags, onGenerateSku, onRestock, surface, padding, headerDivider, className, strings: stringsProp, }: InventorySectionCardProps): import("react").JSX.Element;
 export declare namespace InventorySectionCard {
     var displayName: string;
 }

package/dist/components/blocks/commerce/inventory-section/types.d.ts

@@ -1,3 +1,4 @@
+import type { CardProps } from '../../../base/cards';
 import type { SelectOption } from '../../../base/choice-inputs';
 import type { WeightUnit } from '../../../base/forms-numeric';
 import type { StringsProp } from '../../../../lib/strings';
@@ -76,7 +77,8 @@ export interface InventorySectionStrings {
     };
 }
 export declare const defaultInventorySectionStrings: InventorySectionStrings;
-export interface InventorySectionCardProps {
+/** Unframed by default. Set surface="card" to let this owner frame its heading and body. */
+export interface InventorySectionCardProps extends Pick<CardProps, 'surface' | 'padding' | 'headerDivider'> {
     /** Current field values for every inventory section. Controlled. */
     value: InventorySectionValue;
     /** Fired with the next value. */
@@ -85,7 +87,10 @@ export interface InventorySectionCardProps {
     errors?: Partial<Record<InventorySectionField, string>>;
     /** Renders the entry as unselectable. */
     disabled?: boolean;
-    /** Renders every field as read-only text instead of an editable control. */
+    /**
+     * Locks every field and command while keeping the current values visible,
+     * for a reviewer without edit permission. Controls render disabled.
+     */
     readOnly?: boolean;
     /** Which sections are shown. Omitted sections default to visible. */
     visibleSections?: Partial<Record<InventorySectionName, boolean>>;

package/dist/components/blocks/commerce/invoice-header/index.d.ts

@@ -1,2 +1,3 @@
 export { InvoiceHeader } from './invoice-header';
-export type { InvoiceHeaderProps, InvoiceParty } from './types';
+export { defaultInvoiceHeaderStrings } from './types';
+export type { InvoiceHeaderProps, InvoiceHeaderStrings, InvoiceParty } from './types';

package/dist/components/blocks/commerce/invoice-header/invoice-header.d.ts

@@ -1,5 +1,5 @@
 import { type InvoiceHeaderProps } from './types';
-export declare function InvoiceHeader({ invoiceNumber, status, statusTone, from, to, issuedDate, dueDate, amount, className, strings: stringsProp, ...props }: InvoiceHeaderProps): import("react").JSX.Element;
+export declare function InvoiceHeader({ invoiceNumber, status, statusTone, from, to, issuedDate, dueDate, amount, className, strings: stringsProp, surface, padding, headerDivider, ...props }: InvoiceHeaderProps): import("react").JSX.Element;
 export declare namespace InvoiceHeader {
     var displayName: string;
 }

package/dist/components/blocks/commerce/invoice-header/types.d.ts

@@ -1,12 +1,18 @@
 import type { ComponentPropsWithoutRef, ReactNode } from 'react';
 import type { BadgeTone } from '../../../base/badge';
+import type { CardProps } from '../../../base/cards';
 import type { StringsProp } from '../../../../lib/strings';
 import type { InvoiceStatus } from '../invoice-mini/types';
 export interface InvoiceParty {
-    /** Display name. */
+    /** Display name, usually the legal name. */
     name: string;
     /** Where the party is: a city line, or a node such as a full address. */
     location?: ReactNode;
+    /**
+     * Further identity lines under the location in the same supporting role:
+     * tax or VAT ID, company registration, billing contact.
+     */
+    details?: ReactNode;
 }
 export interface InvoiceHeaderStrings {
     /** Surface title. */
@@ -17,20 +23,24 @@ export interface InvoiceHeaderStrings {
     due: string;
     amountDue: string;
     /** Chip label for each `InvoiceStatus`. */
+    draft: string;
     paid: string;
     pending: string;
     overdue: string;
+    disputed: string;
 }
 export declare const defaultInvoiceHeaderStrings: InvoiceHeaderStrings;
-export interface InvoiceHeaderProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'> {
+/** Unframed by default. Set surface="card" to let this owner frame its heading and body. */
+export interface InvoiceHeaderProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'>, Pick<CardProps, 'surface' | 'padding' | 'headerDivider'> {
     /** Human-facing invoice reference. */
     invoiceNumber: string;
     /**
-     * Payment state. Drives both the chip label (through `strings`) and its
+     * Invoice state. Drives both the chip label (through `strings`) and its
      * tone, so the two can never disagree. Shares the `InvoiceStatus` union
-     * with `InvoiceMini`.
+     * with `InvoiceMini`. Omit it when the page header already states the
+     * status, so the document shows no second chip.
      */
-    status: InvoiceStatus;
+    status?: InvoiceStatus;
     /**
      * Overrides the badge tone derived from `status`. Reach for it only when
      * the surrounding surface needs a tone the status does not imply.
@@ -44,7 +54,11 @@ export interface InvoiceHeaderProps extends Omit<ComponentPropsWithoutRef<'div'>
     issuedDate?: string;
     /** Formatted due date. */
     dueDate?: string;
-    /** Formatted invoice total. */
+    /**
+     * Formatted amount due: what the bill-to party still owes, shown as the
+     * header's total row under `strings.amountDue`. Before any payment it
+     * equals the invoice total; relabel through `strings` to show the total.
+     */
     amount: string;
     /** Merged onto the outermost node. */
     className?: string;

package/dist/components/blocks/commerce/invoice-line-items/invoice-line-items.d.ts

@@ -1,5 +1,5 @@
 import { type InvoiceLineItem, type InvoiceLineItemsProps } from './types';
-export declare function InvoiceLineItems<TItem = InvoiceLineItem>({ items, columns, footerRows, taxRate, currency, className, strings: stringsProp, }: InvoiceLineItemsProps<TItem>): import("react").JSX.Element;
+export declare function InvoiceLineItems<TItem = InvoiceLineItem>({ items, columns, footerRows, taxRate, currency, surface, className, strings: stringsProp, }: InvoiceLineItemsProps<TItem>): import("react").JSX.Element;
 export declare namespace InvoiceLineItems {
     var displayName: string;
 }

package/dist/components/blocks/commerce/invoice-line-items/types.d.ts

@@ -2,11 +2,11 @@ import type { ReactNode } from 'react';
 import type { StringsProp } from '../../../../lib/strings';
 /** Default line-item shape used by the concise InvoiceLineItems mode. */
 export interface InvoiceLineItem {
-    /** Supporting copy shown under the label. */
+    /** Purchased goods or service description for this line. */
     description: string;
     qty: number;
     price: number;
-    /** Total number of records across all pages. */
+    /** Accepted line amount, including any app-owned line adjustments. */
     total: number;
 }
 /**
@@ -18,10 +18,17 @@ export interface InvoiceColumn<TItem = InvoiceLineItem> {
     /** Stable identity for this entry. */
     id: string;
     header: ReactNode;
-    /** Tailwind class for the column's grid track (e.g. `'1fr'`, `'80px'`). */
+    /** CSS grid track value (e.g. `'minmax(0, 1fr)'`, `'80px'`), not a class name. */
     width?: string;
     align?: 'left' | 'right' | 'center';
     cell: (item: TItem, index: number) => ReactNode;
+    /**
+     * Shows the column only when the table is at least its `@lg` container
+     * width (32rem), the default recipe's breakpoint; narrower tables drop its
+     * track instead of crushing the others. Repeat its value in another cell
+     * with the `@lg/invoice-line-items:hidden` class so it stays readable.
+     */
+    wideOnly?: boolean;
     /** Class names appended to header cell. */
     headerClassName?: string;
     /** Class names appended to each row cell of this column. */
@@ -32,7 +39,10 @@ export interface InvoiceLineItemsFooterRow {
     /** Display label. */
     label: ReactNode;
     value: ReactNode;
-    /** Emphasis for the row. `total` renders bold + thicker top spacing. */
+    /**
+     * `total` adds top spacing and bolds the label and a plain-text value.
+     * React-node values keep their own typography; set their weight explicitly.
+     */
     emphasis?: 'normal' | 'total';
 }
 export interface InvoiceLineItemsStrings {
@@ -41,7 +51,7 @@ export interface InvoiceLineItemsStrings {
     price: string;
     subtotal: string;
     tax: string;
-    /** Total number of records across all pages. */
+    /** Label for line totals and the financial grand total. */
     total: string;
 }
 export declare const defaultInvoiceLineItemsStrings: InvoiceLineItemsStrings;
@@ -50,13 +60,20 @@ export interface InvoiceLineItemsProps<TItem = InvoiceLineItem> {
     items: TItem[];
     /** Optional custom columns. Defaults to Description / Qty / Price / Total. */
     columns?: InvoiceColumn<TItem>[];
-    /** Optional custom footer rows. When omitted with the default columns, an
-     * auto-computed subtotal / tax / total footer is used. */
+    /** Optional custom footer rows. React nodes own their typography, including
+     * total-value weight. When omitted with the default columns, an auto-computed
+     * subtotal / tax / total footer is used. */
     footerRows?: InvoiceLineItemsFooterRow[];
     /** Tax ratio for the default footer (`0.2` means 20%). @default 0.2 */
     taxRate?: number;
     /** ISO 4217 code for default monetary cells. Falls back to UIProvider. */
     currency?: string;
+    /**
+     * `card` paints the table's own framed surface. `flat` drops the frame,
+     * striping and row insets so the table sits flush inside a parent Card,
+     * ruled row from row. @default 'card'
+     */
+    surface?: 'card' | 'flat';
     /** Merged onto the outermost node. */
     className?: string;
     /** Overrides this surface's own copy. */

package/dist/components/blocks/commerce/invoice-mini/index.d.ts

@@ -1,2 +1,3 @@
 export { InvoiceMini } from './invoice-mini';
-export type { InvoiceStatus, InvoiceMiniData, InvoiceMiniProps } from './types';
+export { defaultInvoiceMiniStrings, invoiceStatusTone } from './types';
+export type { InvoiceStatus, InvoiceMiniData, InvoiceMiniProps, InvoiceMiniStrings } from './types';