tembro 3.1.16 → 4.0.0

package/CHANGELOG.md

@@ -2,6 +2,36 @@
 
 All notable changes to this project will be documented in this file.
 
+## 4.0.0 - 2026-07-17
+
+### Added
+
+- Added the canonical `WorkspaceLayout`, `WorkspaceContent`, `WorkspaceMain`, `WorkspaceHeader`, `SidebarProvider`, and `SidebarTrigger` application shell.
+- Added `StateView` as the shared loading, empty, error, success, and informational state primitive.
+- Rebuilt bar, line, area, sparkline, and donut charts on Recharts with responsive sizing, tooltips, negative domains, deterministic rendering, and accessible table fallbacks.
+
+### Changed
+
+- Renamed source-copy layout files to `sidebar.tsx` and `workspace-header.tsx`; public components now use their real `Sidebar` and `WorkspaceHeader` names.
+- Consolidated `PageState`, `InlineState`, `LoadingState`, `DataState`, `EmptyState`, and `ErrorState` as compatibility adapters over `StateView`.
+- Consolidated `Tag` and `Chip` behavior around `Badge`, and removed duplicated status-dot rendering from `StatusLegend`.
+- Expanded `Section`, `ResourcePage`, `SplitLayout`, `InfoCard`, and `Badge` configuration while reducing overlapping wrappers.
+- Removed showcase/demo source from the production library and CLI vendor payload, reducing the packed package from roughly 5.3 MB unpacked and 3,013 files to roughly 3 MB and 1,200 files.
+
+### Breaking
+
+- Removed package exports for `./showcase` and `./showcase/*`; showcase code is development-only.
+- Removed deprecated `AppHeader`, `AppHeaderProps`, and `AppSidebarProps` exports. Use `WorkspaceHeader`, `WorkspaceHeaderProps`, and `SidebarProps`.
+- Renamed sidebar `data-slot` values from `app-sidebar*` to `sidebar*`; custom CSS selectors must be updated.
+
+## 3.1.17 - 2026-07-16
+
+- Added production-ready `agenda` and `board` variants, density controls, rich event metadata, selection state, hidden/disabled events, custom rendering, and formatted day labels to `CalendarScheduler`.
+- Added a compact trigger variant to `DatePicker` for dense filters, headers, and scheduling toolbars.
+- Added compact density to `StatisticCard` and configurable gaps to `StatisticGrid`.
+- Added `labelClassName` and a stable inline-flex label layout to `Button`, fixing complex icon/value/action labels that previously stacked vertically.
+- Updated the CalendarScheduler showcase and regression coverage for the expanded API.
+
 ## 3.1.16 - 2026-07-16
 
 - Fixed composed Card surfaces so `StatisticCard`, `InfoCard`, `ActivityFeed`, and other Card-based components retain base border, background, radius, and variant styling.

package/README.md

@@ -133,7 +133,7 @@ The CLI accepts several old names and redirects them to canonical entries. Examp
 // before
 <FormNumberInput control={control} name="price" />
 <FormAsyncSelect control={control} name="ownerId" loadOptions={loadOwners} />
-<AppSidebar items={items} />
+<Sidebar items={items} />
 <SmartCard title="Account" />
 
 // after

package/dist/components/calendar/date-picker.d.ts

@@ -9,9 +9,10 @@ export type DatePickerProps = Omit<CalendarProps, "mode" | "range" | "onRangeCha
     labels?: DatePickerLabels;
     disabled?: boolean;
     clearable?: boolean;
+    triggerVariant?: "default" | "compact";
     formatValue?: (value: string) => React.ReactNode;
     triggerClassName?: string;
     contentClassName?: string;
 };
-declare function DatePicker({ value, onValueChange, placeholder, labels, disabled, clearable, formatValue, triggerClassName, contentClassName, className, ...calendarProps }: DatePickerProps): React.JSX.Element;
+declare function DatePicker({ value, onValueChange, placeholder, labels, disabled, clearable, triggerVariant, formatValue, triggerClassName, contentClassName, className, ...calendarProps }: DatePickerProps): React.JSX.Element;
 export { DatePicker };

package/dist/components/charts/charts.d.ts

@@ -15,6 +15,23 @@ export type ChartSeries = {
 export type ChartAxisLabel = string | number | React.ReactNode;
 export type ChartSize = "sm" | "md" | "lg";
 export type ChartState = "ready" | "loading" | "empty";
+export type ChartDomain = [number | "auto" | "dataMin", number | "auto" | "dataMax"];
+export type ChartTooltipContentProps = {
+    active?: boolean;
+    label?: React.ReactNode;
+    payload?: ReadonlyArray<{
+        value?: number | string;
+        color?: string;
+        name?: string;
+        payload?: {
+            description?: React.ReactNode;
+            originalLabel?: React.ReactNode;
+        };
+    }>;
+    valueFormatter?: (value: number) => React.ReactNode;
+    labelFormatter?: (label: React.ReactNode) => React.ReactNode;
+};
+declare function ChartTooltipContent({ active, label, payload, valueFormatter, labelFormatter }: ChartTooltipContentProps): React.JSX.Element | null;
 export type ChartFrameProps = React.ComponentProps<typeof Card> & {
     title?: React.ReactNode;
     description?: React.ReactNode;
@@ -29,32 +46,41 @@ export type BarChartProps = React.ComponentProps<"div"> & {
     max?: number;
     showLabels?: boolean;
     showValues?: boolean;
+    showGrid?: boolean;
+    showTooltip?: boolean;
     valueFormatter?: (value: number) => React.ReactNode;
-    barClassName?: string;
     state?: ChartState;
     emptyLabel?: React.ReactNode;
+    barClassName?: string;
+    domain?: ChartDomain;
+    ariaLabel?: string;
 };
-declare function BarChart({ data, size, max, showLabels, showValues, valueFormatter, state, emptyLabel, className, barClassName, ...props }: BarChartProps): React.JSX.Element;
-export type LineChartProps = Omit<React.ComponentProps<"svg">, "values"> & {
+declare function BarChart({ data, size, max, showLabels, showValues, showGrid, showTooltip, valueFormatter, state, emptyLabel, barClassName, domain, ariaLabel, className, ...props }: BarChartProps): React.JSX.Element;
+export type LineChartProps = Omit<React.ComponentProps<"div">, "children"> & {
     values: number[];
     size?: ChartSize;
     width?: number;
+    height?: number;
     showArea?: boolean;
     showGrid?: boolean;
+    showAxis?: boolean;
+    showTooltip?: boolean;
     labels?: ChartAxisLabel[];
     valueFormatter?: (value: number) => React.ReactNode;
     stroke?: string;
     state?: ChartState;
     emptyLabel?: React.ReactNode;
+    domain?: ChartDomain;
+    ariaLabel?: string;
 };
-declare function LineChart({ values, size, width, showArea, showGrid, labels, valueFormatter, stroke, state, emptyLabel, className, style, ...props }: LineChartProps): React.JSX.Element;
+declare function LineChart({ values, size, width, height: heightProp, showArea, showGrid, showAxis, showTooltip, labels, valueFormatter, stroke, state, emptyLabel, domain, ariaLabel, className, style, ...props }: LineChartProps): React.JSX.Element;
 declare function AreaChart(props: Omit<LineChartProps, "showArea">): React.JSX.Element;
-export type SparklineProps = Omit<LineChartProps, "size" | "showArea"> & {
+export type SparklineProps = Omit<LineChartProps, "size" | "showArea" | "showAxis"> & {
     values: number[];
     positive?: boolean;
 };
-declare function Sparkline({ values, positive, stroke, className, ...props }: SparklineProps): React.JSX.Element;
-export type DonutChartProps = React.ComponentProps<"svg"> & {
+declare function Sparkline({ values, positive, stroke, className, showTooltip, ...props }: SparklineProps): React.JSX.Element;
+export type DonutChartProps = Omit<React.ComponentProps<"div">, "children"> & {
     data: ChartDatum[];
     size?: number;
     strokeWidth?: number;
@@ -62,8 +88,11 @@ export type DonutChartProps = React.ComponentProps<"svg"> & {
     centerValue?: React.ReactNode;
     state?: ChartState;
     emptyLabel?: React.ReactNode;
+    showTooltip?: boolean;
+    valueFormatter?: (value: number) => React.ReactNode;
+    ariaLabel?: string;
 };
-declare function DonutChart({ data, size, strokeWidth, centerLabel, centerValue, state, emptyLabel, className, ...props }: DonutChartProps): React.JSX.Element;
+declare function DonutChart({ data, size, strokeWidth, centerLabel, centerValue, state, emptyLabel, showTooltip, valueFormatter, ariaLabel, className, style, ...props }: DonutChartProps): React.JSX.Element;
 export type ChartLegendProps = React.ComponentProps<"div"> & {
     data: ChartDatum[];
 };
@@ -76,4 +105,4 @@ export type MetricTrendProps = React.ComponentProps<"div"> & {
     values?: number[];
 };
 declare function MetricTrend({ label, value, change, positive, values, className, ...props }: MetricTrendProps): React.JSX.Element;
-export { AreaChart, BarChart, ChartFrame, ChartLegend, DonutChart, LineChart, MetricTrend, Sparkline };
+export { AreaChart, BarChart, ChartFrame, ChartLegend, ChartTooltipContent, DonutChart, LineChart, MetricTrend, Sparkline };

package/dist/components/display/data-state.d.ts

@@ -1,26 +1,12 @@
-import * as React from "react";
-import { Card } from "@/components/ui/card";
-export type DataStateStatus = "idle" | "loading" | "empty" | "error" | "success";
-export type DataStateVariant = "card" | "plain" | "inline";
-export type DataStateTone = "default" | "muted" | "success" | "warning" | "danger" | "info";
-export type DataStateProps = Omit<React.ComponentProps<typeof Card>, "content" | "title" | "description" | "variant" | "tone"> & {
+import { type StateViewProps, type StateViewStatus, type StateViewTone, type StateViewVariant } from "@/components/feedback/state-view";
+export type DataStateStatus = Exclude<StateViewStatus, "info">;
+export type DataStateVariant = StateViewVariant;
+export type DataStateTone = StateViewTone;
+export type DataStateProps = Omit<StateViewProps, "status" | "variant" | "size" | "slot"> & {
     status: DataStateStatus;
-    title?: React.ReactNode;
-    description?: React.ReactNode;
-    badge?: React.ReactNode;
-    actions?: React.ReactNode;
-    footer?: React.ReactNode;
-    icon?: React.ReactNode;
-    tone?: DataStateTone;
     variant?: DataStateVariant;
     compact?: boolean;
-    align?: "start" | "center";
-    query?: React.ReactNode;
-    children?: React.ReactNode;
-    retryLabel?: React.ReactNode;
-    onRetry?: () => void;
-    clearLabel?: React.ReactNode;
-    onClear?: () => void;
 };
-declare function DataState({ status, title, description, badge, actions, footer, icon, tone, variant, compact, align, query, children, retryLabel, onRetry, clearLabel, onClear, className, ...props }: DataStateProps): React.JSX.Element;
+/** @deprecated Use StateView. */
+declare function DataState({ status, variant, compact, ...props }: DataStateProps): import("react").JSX.Element;
 export { DataState };

package/dist/components/display/statistic.d.ts

@@ -14,10 +14,12 @@ export type StatisticProps = React.ComponentProps<"div"> & {
 declare function Statistic({ label, value, prefix, suffix, description, trend, change, loading, className, ...props }: StatisticProps): React.JSX.Element;
 export type StatisticCardProps = React.ComponentProps<typeof Card> & StatisticProps & {
     action?: React.ReactNode;
+    density?: "compact" | "default";
 };
-declare function StatisticCard({ action, label, value, prefix, suffix, description, trend, change, loading, className, ...props }: StatisticCardProps): React.JSX.Element;
+declare function StatisticCard({ action, density, label, value, prefix, suffix, description, trend, change, loading, className, ...props }: StatisticCardProps): React.JSX.Element;
 export type StatisticGridProps = React.ComponentProps<"div"> & {
     columns?: 1 | 2 | 3 | 4;
+    gap?: "sm" | "default" | "lg";
 };
-declare function StatisticGrid({ columns, className, ...props }: StatisticGridProps): React.JSX.Element;
+declare function StatisticGrid({ columns, gap, className, ...props }: StatisticGridProps): React.JSX.Element;
 export { Statistic, StatisticCard, StatisticGrid };

package/dist/components/display/tag.d.ts

@@ -1,18 +1,16 @@
 import * as React from "react";
+import { type BadgeProps } from "@/components/ui/badge";
 export type TagTone = "neutral" | "info" | "success" | "warning" | "danger";
 export type TagSize = "sm" | "default" | "lg";
-export type TagProps = React.ComponentProps<"span"> & {
+export type TagProps = Omit<BadgeProps, "status" | "dot" | "label" | "count" | "tone"> & {
     tone?: TagTone;
-    size?: TagSize;
-    removable?: boolean;
-    selected?: boolean;
-    onRemove?: () => void;
-    removeLabel?: string;
 };
 export type TagGroupProps = React.ComponentProps<"div"> & {
     gap?: "sm" | "default" | "lg";
 };
-declare function Tag({ tone, size, removable, selected, onRemove, removeLabel, className, children, onKeyDown, ...props }: TagProps): React.JSX.Element;
+/** @deprecated Use Badge with className="rounded-full". */
+declare function Tag({ tone, className, children, ...props }: TagProps): React.JSX.Element;
+/** @deprecated Use Badge. */
 declare function Chip(props: TagProps): React.JSX.Element;
 declare function TagGroup({ gap, className, ...props }: TagGroupProps): React.JSX.Element;
 export { Chip, Tag, TagGroup };

package/dist/components/feedback/index.d.ts

@@ -1,3 +1,4 @@
 export * from "./alert";
 export * from "./loading-state";
 export * from "./page-state";
+export * from "./state-view";

package/dist/components/feedback/loading-state.d.ts

@@ -1,10 +1,9 @@
 import * as React from "react";
-export type LoadingStateProps = React.ComponentProps<"div"> & {
+import { type StateViewProps } from "./state-view";
+export type LoadingStateProps = Omit<StateViewProps, "status" | "title" | "loadingVariant" | "variant" | "slot"> & {
     label?: React.ReactNode;
-    description?: React.ReactNode;
-    icon?: React.ReactNode;
     variant?: "spinner" | "skeleton" | "progress";
-    progress?: number;
 };
-declare function LoadingState({ className, label, description, icon, variant, progress, ...props }: LoadingStateProps): React.JSX.Element;
+/** @deprecated Use StateView with status="loading". */
+declare function LoadingState({ label, variant, ...props }: LoadingStateProps): React.JSX.Element;
 export { LoadingState };

package/dist/components/feedback/page-state.d.ts

@@ -1,18 +1,18 @@
 import * as React from "react";
-export type PageStateTone = "empty" | "loading" | "error" | "success" | "info";
-export type PageStateProps = Omit<React.ComponentProps<"div">, "title"> & {
+import { type StateViewProps, type StateViewStatus } from "./state-view";
+export type PageStateTone = Extract<StateViewStatus, "empty" | "loading" | "error" | "success" | "info">;
+export type PageStateProps = Omit<StateViewProps, "status" | "size" | "variant" | "tone" | "actions" | "slot"> & {
     tone?: PageStateTone;
-    title?: React.ReactNode;
-    description?: React.ReactNode;
-    icon?: React.ReactNode;
     action?: React.ReactNode;
     extra?: React.ReactNode;
     compact?: boolean;
 };
-declare function PageState({ tone, title, description, icon, action, extra, compact, className, ...props }: PageStateProps): React.JSX.Element;
+/** @deprecated Use StateView. */
+declare function PageState({ tone, action, extra, compact, className, ...props }: PageStateProps): React.JSX.Element;
 export type InlineStateProps = Omit<PageStateProps, "compact"> & {
     retryLabel?: React.ReactNode;
     onRetry?: () => void;
 };
-declare function InlineState({ retryLabel, onRetry, action, className, ...props }: InlineStateProps): React.JSX.Element;
+/** @deprecated Use StateView with variant="inline". */
+declare function InlineState({ tone, action, className, ...props }: InlineStateProps): React.JSX.Element;
 export { InlineState, PageState };

package/dist/components/feedback/state-view.cjs

@@ -0,0 +1 @@
+module.exports = require("../../src/components/feedback/state-view.cjs")

package/dist/components/feedback/state-view.d.ts

@@ -0,0 +1,28 @@
+import * as React from "react";
+export type StateViewStatus = "idle" | "loading" | "empty" | "error" | "success" | "info";
+export type StateViewTone = "default" | "muted" | "success" | "warning" | "danger" | "info";
+export type StateViewVariant = "card" | "plain" | "inline";
+export type StateViewSize = "compact" | "default" | "page";
+export type StateViewProps = Omit<React.ComponentProps<"div">, "title"> & {
+    status?: StateViewStatus;
+    tone?: StateViewTone;
+    variant?: StateViewVariant;
+    size?: StateViewSize;
+    align?: "start" | "center";
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    icon?: React.ReactNode;
+    badge?: React.ReactNode;
+    actions?: React.ReactNode;
+    footer?: React.ReactNode;
+    query?: React.ReactNode;
+    retryLabel?: React.ReactNode;
+    onRetry?: () => void;
+    clearLabel?: React.ReactNode;
+    onClear?: () => void;
+    loadingVariant?: "spinner" | "skeleton" | "progress";
+    progress?: number;
+    slot?: string;
+};
+declare function StateView({ status, tone, variant, size, align, title, description, icon, badge, actions, footer, query, retryLabel, onRetry, clearLabel, onClear, loadingVariant, progress, slot, className, children, ...props }: StateViewProps): React.JSX.Element;
+export { StateView };

package/dist/components/feedback/state-view.js

@@ -0,0 +1 @@
+export * from "../../src/components/feedback/state-view.js"

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

@@ -1,4 +1,6 @@
-export * from "./app-header";
-export * from "./app-sidebar";
+export * from "./workspace-header";
+export * from "./sidebar";
 export * from "./breadcrumbs";
 export * from "./section";
+export * from "./sidebar-context";
+export * from "./workspace-layout";

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

@@ -1,3 +1,6 @@
-export * from "./app-sidebar";
+export * from "./sidebar";
+export * from "./workspace-header";
 export * from "./breadcrumbs";
 export * from "./section";
+export * from "./sidebar-context";
+export * from "./workspace-layout";

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

@@ -5,8 +5,12 @@ export type SectionProps = React.ComponentProps<"section"> & {
     actions?: React.ReactNode;
     padded?: boolean;
     bordered?: boolean;
+    variant?: "plain" | "panel";
+    density?: "compact" | "default" | "comfortable";
+    headerClassName?: string;
+    bodyClassName?: string;
 };
-declare function Section({ title, description, actions, padded, bordered, className, children, ...props }: SectionProps): React.JSX.Element;
+declare function Section({ title, description, actions, padded, bordered, variant, density, headerClassName, bodyClassName, className, children, ...props }: SectionProps): React.JSX.Element;
 export type ToolbarProps = React.ComponentProps<"div"> & {
     title?: React.ReactNode;
     description?: React.ReactNode;
@@ -19,6 +23,7 @@ export type SplitLayoutProps = React.ComponentProps<"div"> & {
     asidePosition?: "start" | "end";
     asideClassName?: string;
     contentClassName?: string;
+    asideWidth?: React.CSSProperties["width"];
 };
-declare function SplitLayout({ aside, asidePosition, asideClassName, contentClassName, className, children, ...props }: SplitLayoutProps): React.JSX.Element;
+declare function SplitLayout({ aside, asidePosition, asideClassName, contentClassName, asideWidth, className, children, style, ...props }: SplitLayoutProps): React.JSX.Element;
 export { Section, SplitLayout, Toolbar };

package/dist/components/layout/sidebar-context.cjs

@@ -0,0 +1 @@
+module.exports = require("../../src/components/layout/sidebar-context.cjs")

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

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { type ButtonProps } from "@/components/ui/button";
+export type SidebarContextValue = {
+    collapsed: boolean;
+    setCollapsed: (collapsed: boolean) => void;
+    toggleCollapsed: () => void;
+    mobileOpen: boolean;
+    setMobileOpen: (open: boolean) => void;
+    toggleMobile: () => void;
+};
+export type SidebarProviderProps = React.ComponentProps<"div"> & {
+    collapsed?: boolean;
+    defaultCollapsed?: boolean;
+    onCollapsedChange?: (collapsed: boolean) => void;
+    mobileOpen?: boolean;
+    defaultMobileOpen?: boolean;
+    onMobileOpenChange?: (open: boolean) => void;
+};
+declare function SidebarProvider({ collapsed: collapsedProp, defaultCollapsed, onCollapsedChange, mobileOpen: mobileOpenProp, defaultMobileOpen, onMobileOpenChange, children, className, ...props }: SidebarProviderProps): React.JSX.Element;
+declare function useSidebar(optional?: false): SidebarContextValue;
+declare function useSidebar(optional: true): SidebarContextValue | null;
+export type SidebarTriggerProps = Omit<ButtonProps, "onClick"> & {
+    breakpoint?: number;
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
+};
+declare function SidebarTrigger({ breakpoint, onClick, children, ...props }: SidebarTriggerProps): React.JSX.Element;
+export { SidebarProvider, SidebarTrigger, useSidebar };

package/dist/components/layout/sidebar-context.js

@@ -0,0 +1 @@
+export * from "../../src/components/layout/sidebar-context.js"

package/dist/components/layout/sidebar.cjs

@@ -0,0 +1 @@
+module.exports = require("../../src/components/layout/sidebar.cjs")

package/dist/components/layout/{app-sidebar.d.ts → sidebar.d.ts}

@@ -1,10 +1,10 @@
 import * as React from "react";
-type AppSidebarNavItem = {
+export type SidebarItem = {
     key: string;
     label: React.ReactNode;
     icon?: React.ReactNode;
     href?: string;
-    items?: AppSidebarNavItem[];
+    items?: SidebarItem[];
     active?: boolean;
     disabled?: boolean;
     badge?: React.ReactNode;
@@ -17,7 +17,7 @@ type AppSidebarNavItem = {
     tooltip?: React.ReactNode;
     onSelect?: () => void;
 };
-type AppSidebarFooterAccount = {
+export type SidebarFooterAccount = {
     label: React.ReactNode;
     description?: React.ReactNode;
     avatar?: React.ReactNode;
@@ -25,18 +25,18 @@ type AppSidebarFooterAccount = {
     tooltip?: React.ReactNode;
     onSelect?: () => void;
 };
-export type AppSidebarProps = React.ComponentProps<"aside"> & {
+export type SidebarProps = React.ComponentProps<"aside"> & {
     header?: React.ReactNode;
     footer?: React.ReactNode;
-    items?: AppSidebarNavItem[];
+    items?: SidebarItem[];
     collapsed?: boolean;
     width?: React.CSSProperties["width"];
     collapsedWidth?: React.CSSProperties["width"];
     mobileWidth?: React.CSSProperties["width"];
     collapsedRail?: React.ReactNode;
-    railItems?: AppSidebarNavItem[];
-    footerAccount?: AppSidebarFooterAccount;
-    secondaryActions?: AppSidebarNavItem[];
+    railItems?: SidebarItem[];
+    footerAccount?: SidebarFooterAccount;
+    secondaryActions?: SidebarItem[];
     footerSecondary?: React.ReactNode;
     tooltipOnCollapsed?: boolean;
     showSectionLabels?: boolean;
@@ -63,15 +63,14 @@ export type AppSidebarProps = React.ComponentProps<"aside"> & {
         open: boolean;
         setOpen: (open: boolean) => void;
     }) => React.ReactNode;
-    onItemSelect?: (item: AppSidebarNavItem) => void;
-    renderItem?: (item: AppSidebarNavItem, state: {
+    onItemSelect?: (item: SidebarItem) => void;
+    renderItem?: (item: SidebarItem, state: {
         collapsed: boolean;
     }) => React.ReactNode;
     renderLink?: (props: React.ComponentProps<"a"> & {
-        item: AppSidebarNavItem;
+        item: SidebarItem;
         [key: `data-${string}`]: string | boolean | undefined;
     }) => React.ReactNode;
 };
-declare function Sidebar({ className, header, footer, items, collapsed, width, collapsedWidth, mobileWidth, collapsedRail, railItems, footerAccount, secondaryActions, footerSecondary, tooltipOnCollapsed, showSectionLabels, itemSize, activeIndicator, navigationLabel, responsive, mobileBreakpoint, mobileOpen: mobileOpenProp, defaultMobileOpen, onMobileOpenChange, mobileTitle, mobileDescription, mobileToggleLabel, mobileCloseLabel, mobileToggleIcon, showMobileToggle, closeOnSelect, mobileToggleClassName, mobilePanelClassName, mobileOverlayClassName, renderMobileToggle, onItemSelect, renderItem, renderLink, children, ...props }: AppSidebarProps): React.JSX.Element;
+declare function Sidebar({ className, header, footer, items, collapsed: collapsedProp, width, collapsedWidth, mobileWidth, collapsedRail, railItems, footerAccount, secondaryActions, footerSecondary, tooltipOnCollapsed, showSectionLabels, itemSize, activeIndicator, navigationLabel, responsive, mobileBreakpoint, mobileOpen: mobileOpenProp, defaultMobileOpen, onMobileOpenChange, mobileTitle, mobileDescription, mobileToggleLabel, mobileCloseLabel, mobileToggleIcon, showMobileToggle, closeOnSelect, mobileToggleClassName, mobilePanelClassName, mobileOverlayClassName, renderMobileToggle, onItemSelect, renderItem, renderLink, children, ...props }: SidebarProps): React.JSX.Element;
 export { Sidebar };
-export type { AppSidebarFooterAccount as SidebarFooterAccount, AppSidebarNavItem as SidebarItem, AppSidebarProps as SidebarProps, };

package/dist/components/layout/sidebar.js

@@ -0,0 +1 @@
+export * from "../../src/components/layout/sidebar.js"

package/dist/components/layout/workspace-header.cjs

@@ -0,0 +1 @@
+module.exports = require("../../src/components/layout/workspace-header.cjs")

package/dist/components/layout/workspace-header.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+export type WorkspaceHeaderProps = React.ComponentProps<"header"> & {
+    left?: React.ReactNode;
+    center?: React.ReactNode;
+    right?: React.ReactNode;
+    sticky?: boolean;
+    heightClassName?: string;
+};
+declare function WorkspaceHeader({ className, left, center, right, sticky, heightClassName, children, ...props }: WorkspaceHeaderProps): React.JSX.Element;
+export { WorkspaceHeader };

package/dist/components/layout/workspace-header.js

@@ -0,0 +1 @@
+export * from "../../src/components/layout/workspace-header.js"

package/dist/components/layout/workspace-layout.cjs

@@ -0,0 +1 @@
+module.exports = require("../../src/components/layout/workspace-layout.cjs")

package/dist/components/layout/workspace-layout.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+export type WorkspaceLayoutProps = React.ComponentProps<"div"> & {
+    viewport?: boolean;
+};
+declare function WorkspaceLayout({ viewport, className, ...props }: WorkspaceLayoutProps): React.JSX.Element;
+export type WorkspaceContentProps = React.ComponentProps<"div">;
+declare function WorkspaceContent({ className, ...props }: WorkspaceContentProps): React.JSX.Element;
+export type WorkspaceMainProps = React.ComponentProps<"main"> & {
+    scrollable?: boolean;
+    padded?: boolean;
+};
+declare function WorkspaceMain({ scrollable, padded, className, ...props }: WorkspaceMainProps): React.JSX.Element;
+export { WorkspaceContent, WorkspaceLayout, WorkspaceMain };

package/dist/components/layout/workspace-layout.js

@@ -0,0 +1 @@
+export * from "../../src/components/layout/workspace-layout.js"

package/dist/components/modern/calendar-scheduler.d.ts

@@ -6,14 +6,37 @@ export type CalendarSchedulerEvent = {
     time?: string;
     tone?: "default" | "success" | "warning" | "danger";
     durationMinutes?: number;
+    description?: React.ReactNode;
+    meta?: React.ReactNode;
+    badge?: React.ReactNode;
+    icon?: React.ReactNode;
+    disabled?: boolean;
+    hidden?: boolean;
+    className?: string;
 };
 export type CalendarSchedulerProps = React.ComponentProps<"div"> & {
     events: CalendarSchedulerEvent[];
     days?: string[];
     view?: "day" | "week" | "month";
+    variant?: "board" | "agenda";
+    density?: "compact" | "default" | "comfortable";
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    actions?: React.ReactNode;
     empty?: React.ReactNode;
+    selectedEventId?: string;
+    defaultSelectedEventId?: string;
+    onSelectedEventChange?: (eventId: string, event: CalendarSchedulerEvent) => void;
     onCreateEvent?: (date: string) => void;
     onEventClick?: (event: CalendarSchedulerEvent) => void;
+    renderEvent?: (event: CalendarSchedulerEvent, state: {
+        selected: boolean;
+    }) => React.ReactNode;
+    createLabel?: React.ReactNode;
+    showCount?: boolean;
+    dayClassName?: string;
+    eventClassName?: string;
+    formatDay?: (day: string) => React.ReactNode;
 };
-declare function CalendarScheduler({ events, days, view, empty, onCreateEvent, onEventClick, className, ...props }: CalendarSchedulerProps): React.JSX.Element;
+declare function CalendarScheduler({ events, days, view, variant, density, title, description, actions, empty, selectedEventId, defaultSelectedEventId, onSelectedEventChange, onCreateEvent, onEventClick, renderEvent, createLabel, showCount, dayClassName, eventClassName, formatDay, className, ...props }: CalendarSchedulerProps): React.JSX.Element;
 export { CalendarScheduler };

package/dist/components/patterns/empty-state.d.ts

@@ -1,4 +1,5 @@
 import * as React from "react";
+import { type StateViewProps } from "@/components/feedback/state-view";
 import { Button } from "@/components/ui/button";
 export type EmptyStateTone = "empty" | "error" | "info";
 export type EmptyStateAction = {
@@ -7,16 +8,15 @@ export type EmptyStateAction = {
     href?: string;
     variant?: React.ComponentProps<typeof Button>["variant"];
 };
-export type EmptyStateProps = Omit<React.ComponentProps<"div">, "title"> & {
+export type EmptyStateProps = Omit<StateViewProps, "status" | "tone" | "actions" | "size" | "slot"> & {
     tone?: EmptyStateTone;
-    title?: React.ReactNode;
-    description?: React.ReactNode;
-    icon?: React.ReactNode;
     primaryAction?: EmptyStateAction;
     secondaryAction?: EmptyStateAction;
     compact?: boolean;
 };
-declare function EmptyState({ className, tone, title, description, icon, primaryAction, secondaryAction, compact, ...props }: EmptyStateProps): React.JSX.Element;
+/** @deprecated Use StateView. */
+declare function EmptyState({ tone, primaryAction, secondaryAction, compact, ...props }: EmptyStateProps): React.JSX.Element;
 export type ErrorStateProps = Omit<EmptyStateProps, "tone">;
+/** @deprecated Use StateView with status="error". */
 declare function ErrorState(props: ErrorStateProps): React.JSX.Element;
 export { EmptyState, ErrorState };

package/dist/components/patterns/resource-page.d.ts

@@ -1,14 +1,9 @@
 import * as React from "react";
 import { type DataTableProps } from "@/components/data-table/data-table";
 import { type PageHeaderProps } from "@/components/layout/page-header";
+import { type SectionProps } from "@/components/layout/section";
 export type ResourcePageDensity = "default" | "compact" | "comfortable";
-export type ResourcePageSectionProps = React.ComponentProps<"section"> & {
-    title?: React.ReactNode;
-    description?: React.ReactNode;
-    actions?: React.ReactNode;
-    headerClassName?: string;
-    bodyClassName?: string;
-};
+export type ResourcePageSectionProps = Omit<SectionProps, "variant">;
 declare function ResourcePageSection({ className, title, description, actions, headerClassName, bodyClassName, children, ...props }: ResourcePageSectionProps): React.JSX.Element;
 export type ResourcePageProps<TData, TValue = unknown> = Omit<React.ComponentProps<"div">, "children"> & {
     title?: React.ReactNode;
@@ -29,6 +24,7 @@ export type ResourcePageProps<TData, TValue = unknown> = Omit<React.ComponentPro
     toolbarClassName?: string;
     contentClassName?: string;
     asideClassName?: string;
+    asideWidth?: React.CSSProperties["width"];
 };
-declare function ResourcePage<TData, TValue = unknown>({ className, title, description, eyebrow, actions, breadcrumbs, stats, filters, tabs, table, children, aside, footer, headerProps, density, pageHeaderClassName, toolbarClassName, contentClassName, asideClassName, ...props }: ResourcePageProps<TData, TValue>): React.JSX.Element;
+declare function ResourcePage<TData, TValue = unknown>({ className, title, description, eyebrow, actions, breadcrumbs, stats, filters, tabs, table, children, aside, footer, headerProps, density, pageHeaderClassName, toolbarClassName, contentClassName, asideClassName, asideWidth, style, ...props }: ResourcePageProps<TData, TValue>): React.JSX.Element;
 export { ResourcePage, ResourcePageSection };

package/dist/components/ui/badge/index.d.ts

@@ -12,10 +12,11 @@ type BadgeProps = useRender.ComponentProps<"span"> & VariantProps<typeof badgeVa
     count?: React.ReactNode;
     status?: "neutral" | "info" | "success" | "warning" | "danger" | "muted";
     removable?: boolean;
+    selected?: boolean;
     onRemove?: () => void;
     removeLabel?: string;
     leftIcon?: React.ReactNode;
     rightIcon?: React.ReactNode;
 };
-declare function Badge({ className, variant, tone, size, dot, label, count, status, removable, onRemove, removeLabel, leftIcon, rightIcon, children, render, ...props }: BadgeProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+declare function Badge({ className, variant, tone, size, dot, label, count, status, removable, selected, onRemove, removeLabel, leftIcon, rightIcon, children, render, onKeyDown, ...props }: BadgeProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 export { Badge, badgeVariants, type BadgeProps };

package/dist/components/ui/button/index.d.ts

@@ -13,6 +13,7 @@ export type ButtonProps = ButtonPrimitive.Props & VariantProps<typeof buttonVari
     iconOnly?: boolean;
     fullWidth?: boolean;
     pressed?: boolean;
+    labelClassName?: string;
 };
-declare function Button({ className, variant, size, disabled, loading, loadingLabel, leftIcon, rightIcon, iconOnly, fullWidth, pressed, children, "aria-label": ariaLabel, ...props }: ButtonProps): React.JSX.Element;
+declare function Button({ className, variant, size, disabled, loading, loadingLabel, leftIcon, rightIcon, iconOnly, fullWidth, pressed, labelClassName, children, "aria-label": ariaLabel, ...props }: ButtonProps): React.JSX.Element;
 export { Button, buttonVariants };