@mechane-ai/elements 0.8.0 → 0.10.0

package/dist/packages/feedback/src/toast.d.ts

@@ -1,28 +1,6 @@
-import { Toast as BaseToast } from '@base-ui/react/toast';
-import type { ComponentProps, ReactNode } from 'react';
-type ToastViewportProps = ComponentProps<typeof BaseToast.Viewport>;
-type ToastRootProps = ComponentProps<typeof BaseToast.Root>;
-type ToastContentProps = ComponentProps<typeof BaseToast.Content>;
-type ToastTitleProps = ComponentProps<typeof BaseToast.Title>;
-type ToastDescriptionProps = ComponentProps<typeof BaseToast.Description>;
-type ToastCloseProps = ComponentProps<typeof BaseToast.Close>;
-declare function ToastViewport({ className, style, ...props }: ToastViewportProps): ReactNode;
-declare function ToastRoot({ className, style, ...props }: ToastRootProps): ReactNode;
-declare function ToastContent({ className, style, ...props }: ToastContentProps): ReactNode;
-declare function ToastTitle({ className, style, ...props }: ToastTitleProps): ReactNode;
-declare function ToastDescription({ className, style, ...props }: ToastDescriptionProps): ReactNode;
-declare function ToastClose(props: ToastCloseProps): ReactNode;
-export declare const Toast: {
-    Provider: import("react").FC<import("@base-ui/react").ToastProviderProps>;
-    Portal: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ToastPortalProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Viewport: typeof ToastViewport;
-    Root: typeof ToastRoot;
-    Content: typeof ToastContent;
-    Title: typeof ToastTitle;
-    Description: typeof ToastDescription;
-    Close: typeof ToastClose;
-    Action: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ToastActionProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-    useManager: typeof BaseToast.useToastManager;
-    createManager: typeof BaseToast.createToastManager;
+import type { ReactNode } from 'react';
+import type { ToasterProps as SonnerToasterProps } from 'sonner';
+export type ToasterProps = Pick<SonnerToasterProps, 'id' | 'position' | 'hotkey' | 'expand' | 'duration' | 'visibleToasts' | 'closeButton' | 'offset' | 'mobileOffset' | 'dir' | 'swipeDirections' | 'containerAriaLabel'> & {
+    readonly closeButtonAriaLabel?: string;
 };
-export {};
+export declare function Toaster({ closeButton, closeButtonAriaLabel, offset, mobileOffset, ...props }: ToasterProps): ReactNode;

package/dist/packages/forms/src/agent-avatar-picker.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from 'react';
+import type { AgentAppearance } from '../../core/src/index.ts';
+export type AgentAvatarPickerProps = {
+    readonly value: AgentAppearance;
+    readonly onValueChange: (value: AgentAppearance) => void;
+    readonly disabled?: boolean;
+};
+export declare function AgentAvatarPicker({ value, onValueChange, disabled }: AgentAvatarPickerProps): ReactNode;

package/dist/packages/forms/src/field-styles.d.ts

@@ -6,27 +6,35 @@ export declare const fieldStyles: Readonly<{
         readonly gap: stylex.StyleXClassNameFor<"gap", string>;
         readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
         readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", string>;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", string>;
+        readonly WebkitFontSmoothing: stylex.StyleXClassNameFor<"WebkitFontSmoothing", "antialiased">;
     }>;
     readonly label: Readonly<{
         readonly color: stylex.StyleXClassNameFor<"color", string>;
+        readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", string>;
         readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", string>;
         readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
+        readonly overflowWrap: stylex.StyleXClassNameFor<"overflowWrap", "anywhere">;
     }>;
     readonly description: Readonly<{
         readonly margin: stylex.StyleXClassNameFor<"margin", 0>;
         readonly color: stylex.StyleXClassNameFor<"color", string>;
         readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
         readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
+        readonly overflowWrap: stylex.StyleXClassNameFor<"overflowWrap", "anywhere">;
     }>;
     readonly error: Readonly<{
         readonly color: stylex.StyleXClassNameFor<"color", string>;
         readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
         readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
+        readonly overflowWrap: stylex.StyleXClassNameFor<"overflowWrap", "anywhere">;
     }>;
     readonly input: Readonly<{
         readonly display: stylex.StyleXClassNameFor<"display", "block">;
         readonly boxSizing: stylex.StyleXClassNameFor<"boxSizing", "border-box">;
         readonly width: stylex.StyleXClassNameFor<"width", "100%">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
         readonly minHeight: stylex.StyleXClassNameFor<"minHeight", string>;
         readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", string>;
         readonly color: stylex.StyleXClassNameFor<"color", string>;
@@ -37,6 +45,7 @@ export declare const fieldStyles: Readonly<{
         readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", string>;
         readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", string>;
         readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", string>;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", string>;
         readonly WebkitFontSmoothing: stylex.StyleXClassNameFor<"WebkitFontSmoothing", "antialiased">;
         readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
         readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
@@ -68,6 +77,25 @@ export declare const fieldStyles: Readonly<{
         readonly maxHeight: stylex.StyleXClassNameFor<"maxHeight", "30dvh">;
     }>;
 }>;
+export declare const textareaAppearanceStyles: Readonly<{
+    readonly field: {};
+    readonly plain: Readonly<{
+        readonly minHeight: stylex.StyleXClassNameFor<"minHeight", string>;
+        readonly maxHeight: stylex.StyleXClassNameFor<"maxHeight", "30dvh">;
+        readonly fieldSizing: stylex.StyleXClassNameFor<"fieldSizing", "content">;
+        readonly resize: stylex.StyleXClassNameFor<"resize", "none">;
+        readonly padding: stylex.StyleXClassNameFor<"padding", 0>;
+        readonly borderWidth: stylex.StyleXClassNameFor<"borderWidth", 0>;
+        readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", 0>;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "transparent">;
+        readonly ':focus-visible': stylex.StyleXClassNameFor<":focus-visible", {
+            readonly outlineStyle: "none";
+        }>;
+        readonly ':disabled': stylex.StyleXClassNameFor<":disabled", {
+            readonly backgroundColor: "transparent";
+        }>;
+    }>;
+}>;
 export declare const inputSizeStyles: Readonly<{
     readonly sm: Readonly<{
         readonly minHeight: stylex.StyleXClassNameFor<"minHeight", string>;

package/dist/packages/forms/src/forms.d.ts

@@ -18,6 +18,7 @@ type NativeTextareaProps = ComponentProps<'textarea'>;
 type TextareaProps = Omit<NativeTextareaProps, 'value' | 'defaultValue' | 'onChange' | 'readOnly'> & TextValueProperties<NonNullable<NativeTextareaProps['value']>, NonNullable<NativeTextareaProps['onChange']>, NonNullable<BaseInputProps['onValueChange']>> & {
     readonly xstyle?: PlacementStyle;
     readonly compact?: boolean;
+    readonly appearance?: 'field' | 'plain';
 };
 declare function FieldRoot({ className, style, xstyle, ...props }: FieldRootProps): ReactNode;
 declare function FieldLabel({ className, style, ...props }: FieldLabelProps): ReactNode;
@@ -30,5 +31,5 @@ export declare const Field: {
     Error: typeof FieldError;
 };
 export declare function Input({ className, style, xstyle, size, ...props }: InputProps): ReactNode;
-export declare function Textarea({ compact, value, defaultValue, onValueChange, name, disabled, readOnly, required, className, style, xstyle, ...props }: TextareaProps): ReactNode;
+export declare function Textarea({ compact, appearance, value, defaultValue, onValueChange, name, disabled, readOnly, required, className, style, xstyle, ...props }: TextareaProps): ReactNode;
 export {};

package/dist/packages/forms/src/index.d.ts

@@ -1,4 +1,6 @@
 export { Combobox } from './combobox.tsx';
+export type { AgentAvatarPickerProps } from './agent-avatar-picker.tsx';
+export { AgentAvatarPicker } from './agent-avatar-picker.tsx';
 export { FilePicker, Fieldset, InputGroup, NumberField, Slider } from './form-controls.tsx';
 export { Field, Input, Textarea } from './forms.tsx';
 export { Select } from './select.tsx';

package/dist/packages/forms/src/selection-styles.d.ts

@@ -15,17 +15,21 @@ export declare const selectionStyles: Readonly<{
         readonly borderStyle: stylex.StyleXClassNameFor<"borderStyle", "solid">;
         readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", string>;
         readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", string>;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", string>;
         readonly WebkitFontSmoothing: stylex.StyleXClassNameFor<"WebkitFontSmoothing", "antialiased">;
         readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
         readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
         readonly textAlign: stylex.StyleXClassNameFor<"textAlign", "left">;
         readonly color: stylex.StyleXClassNameFor<"color", string>;
         readonly cursor: stylex.StyleXClassNameFor<"cursor", "pointer">;
-        readonly ':hover:not([data-disabled])': stylex.StyleXClassNameFor<":hover:not([data-disabled])", {
+        readonly ':hover:not(:active, [data-disabled])': stylex.StyleXClassNameFor<":hover:not(:active, [data-disabled])", {
             readonly backgroundColor: {
                 readonly [conditions.hoverPointer]: stylex.StyleXVar<string>;
             };
         }>;
+        readonly ':active:not([data-disabled])': stylex.StyleXClassNameFor<":active:not([data-disabled])", {
+            readonly backgroundColor: stylex.StyleXVar<string>;
+        }>;
         readonly ':is([data-disabled])': stylex.StyleXClassNameFor<":is([data-disabled])", {
             readonly opacity: stylex.StyleXVar<string>;
             readonly cursor: "default";
@@ -67,6 +71,8 @@ export declare const selectionStyles: Readonly<{
         readonly maxWidth: stylex.StyleXClassNameFor<"maxWidth", "calc(100vw - 16px)">;
     }>;
     readonly popup: Readonly<{
+        readonly boxSizing: stylex.StyleXClassNameFor<"boxSizing", "border-box">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
         readonly borderWidth: stylex.StyleXClassNameFor<"borderWidth", 1>;
         readonly borderStyle: stylex.StyleXClassNameFor<"borderStyle", "solid">;
         readonly borderColor: stylex.StyleXClassNameFor<"borderColor", string>;
@@ -75,6 +81,9 @@ export declare const selectionStyles: Readonly<{
         readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", string>;
         readonly color: stylex.StyleXClassNameFor<"color", string>;
         readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", string>;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", string>;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
+        readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
         readonly WebkitFontSmoothing: stylex.StyleXClassNameFor<"WebkitFontSmoothing", "antialiased">;
         readonly boxShadow: stylex.StyleXClassNameFor<"boxShadow", string>;
         readonly maxHeight: stylex.StyleXClassNameFor<"maxHeight", "var(--available-height)">;
@@ -83,22 +92,29 @@ export declare const selectionStyles: Readonly<{
     }>;
     readonly option: Readonly<{
         readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly boxSizing: stylex.StyleXClassNameFor<"boxSizing", "border-box">;
         readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
         readonly gap: stylex.StyleXClassNameFor<"gap", string>;
         readonly minHeight: stylex.StyleXClassNameFor<"minHeight", string>;
         readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", string>;
+        readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", string>;
         readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", string>;
         readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", string>;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", string>;
         readonly WebkitFontSmoothing: stylex.StyleXClassNameFor<"WebkitFontSmoothing", "antialiased">;
         readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
         readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
+        readonly overflowWrap: stylex.StyleXClassNameFor<"overflowWrap", "anywhere">;
         readonly cursor: stylex.StyleXClassNameFor<"cursor", "pointer">;
         readonly outlineWidth: stylex.StyleXClassNameFor<"outlineWidth", 0>;
         readonly ':is([data-highlighted])': stylex.StyleXClassNameFor<":is([data-highlighted])", {
             readonly backgroundColor: stylex.StyleXVar<string>;
         }>;
+        readonly ':active:not([data-disabled])': stylex.StyleXClassNameFor<":active:not([data-disabled])", {
+            readonly backgroundColor: stylex.StyleXVar<string>;
+        }>;
         readonly ':is([data-disabled])': stylex.StyleXClassNameFor<":is([data-disabled])", {
-            readonly color: stylex.StyleXVar<string>;
+            readonly opacity: stylex.StyleXVar<string>;
             readonly cursor: "default";
         }>;
     }>;

package/dist/packages/foundations/src/overlay-styles.d.ts

@@ -25,8 +25,9 @@ export declare const overlayStyles: Readonly<{
         readonly WebkitFontSmoothing: stylex.StyleXClassNameFor<"WebkitFontSmoothing", "antialiased">;
         readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
         readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
-        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", 600>;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", string>;
         readonly color: stylex.StyleXClassNameFor<"color", string>;
+        readonly overflowWrap: stylex.StyleXClassNameFor<"overflowWrap", "anywhere">;
     }>;
     readonly description: Readonly<{
         readonly margin: stylex.StyleXClassNameFor<"margin", 0>;
@@ -34,6 +35,7 @@ export declare const overlayStyles: Readonly<{
         readonly WebkitFontSmoothing: stylex.StyleXClassNameFor<"WebkitFontSmoothing", "antialiased">;
         readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
         readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", string>;
         readonly color: stylex.StyleXClassNameFor<"color", string>;
         readonly overflowWrap: stylex.StyleXClassNameFor<"overflowWrap", "anywhere">;
     }>;

package/dist/packages/foundations/src/popup-styles.d.ts

@@ -21,6 +21,7 @@ export declare const popupStyles: Readonly<{
         readonly WebkitFontSmoothing: stylex.StyleXClassNameFor<"WebkitFontSmoothing", "antialiased">;
         readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
         readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", string>;
         readonly outlineWidth: stylex.StyleXClassNameFor<"outlineWidth", 0>;
     }>;
     readonly content: Readonly<{
@@ -37,6 +38,8 @@ export declare const popupStyles: Readonly<{
         readonly display: stylex.StyleXClassNameFor<"display", "flex">;
         readonly boxSizing: stylex.StyleXClassNameFor<"boxSizing", "border-box">;
         readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+        readonly overflowWrap: stylex.StyleXClassNameFor<"overflowWrap", "anywhere">;
         readonly gap: stylex.StyleXClassNameFor<"gap", string>;
         readonly minHeight: stylex.StyleXClassNameFor<"minHeight", string>;
         readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", string>;
@@ -49,6 +52,9 @@ export declare const popupStyles: Readonly<{
         readonly ':is([data-highlighted])': stylex.StyleXClassNameFor<":is([data-highlighted])", {
             readonly backgroundColor: stylex.StyleXVar<string>;
         }>;
+        readonly ':active:not([data-disabled])': stylex.StyleXClassNameFor<":active:not([data-disabled])", {
+            readonly backgroundColor: stylex.StyleXVar<string>;
+        }>;
         readonly ':is([data-disabled])': stylex.StyleXClassNameFor<":is([data-disabled])", {
             readonly opacity: stylex.StyleXVar<string>;
             readonly cursor: "default";
@@ -66,6 +72,7 @@ export declare const popupStyles: Readonly<{
         readonly color: stylex.StyleXClassNameFor<"color", string>;
         readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
         readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", string>;
     }>;
     readonly separator: Readonly<{
         readonly height: stylex.StyleXClassNameFor<"height", 1>;

package/dist/packages/foundations/src/tokens.stylex.d.ts

@@ -59,6 +59,58 @@ export declare const darkChartColors: {
     positive: string;
     missing: string;
 };
+export declare const avatarColors: stylex.VarGroup<Readonly<{
+    identity1: string;
+    identity2: string;
+    identity3: string;
+    identity4: string;
+    identity5: string;
+    identity6: string;
+    identity7: string;
+    identity8: string;
+    identity9: string;
+    identity10: string;
+    identity11: string;
+    identity12: string;
+    identity13: string;
+    identity14: string;
+    identity15: string;
+    identity16: string;
+    identity17: string;
+    identity18: string;
+    identity19: string;
+    identity20: string;
+    identity21: string;
+    identity22: string;
+    identity23: string;
+    identity24: string;
+}>, symbol>;
+export declare const darkAvatarColors: {
+    identity1: string;
+    identity2: string;
+    identity3: string;
+    identity4: string;
+    identity5: string;
+    identity6: string;
+    identity7: string;
+    identity8: string;
+    identity9: string;
+    identity10: string;
+    identity11: string;
+    identity12: string;
+    identity13: string;
+    identity14: string;
+    identity15: string;
+    identity16: string;
+    identity17: string;
+    identity18: string;
+    identity19: string;
+    identity20: string;
+    identity21: string;
+    identity22: string;
+    identity23: string;
+    identity24: string;
+};
 export declare const syntaxColors: stylex.VarGroup<Readonly<{
     keyword: string;
     string: string;
@@ -85,9 +137,14 @@ export declare const spacing: stylex.VarGroup<Readonly<{
 export declare const typography: stylex.VarGroup<Readonly<{
     fontFamily: string;
     monoFamily: string;
+    regularWeight: string;
+    mediumWeight: string;
+    strongWeight: string;
+    boldWeight: string;
     bodySize: string;
     bodyLineHeight: string;
     multilineLineHeight: string;
+    proseLineHeight: string;
     captionSize: string;
     captionLineHeight: string;
     inputSize: string;
@@ -134,6 +191,10 @@ export declare const layers: {
     tooltip: string;
     skipLink: string;
 };
+export declare const tableGeometry: {
+    rowHeight: number;
+    headerHeight: number;
+};
 export declare const conditions: {
     coarsePointer: string;
     hoverPointer: string;

package/dist/packages/layout/src/app-shell.d.ts

@@ -5,6 +5,7 @@ type AppShellProps = {
     readonly footer?: ReactNode;
     readonly children: ReactNode;
     readonly mainId?: string;
+    readonly focus?: boolean;
 };
-export declare function AppShell({ sidebarHeader, sidebar, footer, children, mainId }: AppShellProps): ReactNode;
+export declare function AppShell({ sidebarHeader, sidebar, footer, children, mainId, focus, }: AppShellProps): ReactNode;
 export {};

package/dist/packages/layout/src/frame.stylex.d.ts

@@ -22,4 +22,5 @@ export declare const frameConditions: {
     sidebarCoarse: string;
     detailMobile: string;
     toolbarCompact: string;
+    workbenchCompact: string;
 };

package/dist/packages/layout/src/index.d.ts

@@ -2,9 +2,10 @@ export { AppShell } from './app-shell.tsx';
 export { DetailPage } from './detail-page.tsx';
 export { FocusPage } from './focus-page.tsx';
 export { Workbench, WorkbenchScroll, WorkbenchFooter } from './workbench.tsx';
+export { ViewStack } from './view-stack.tsx';
 export { PageToolbar, ToolbarAction } from './page-toolbar.tsx';
 export type { RecordPageRootProps, RecordPageToolbarProps, RecordPageBodyProps, RecordPageHeaderProps, RecordPageContentProps, RecordPageAsideProps, } from './record-page.tsx';
 export { RecordPage } from './record-page.tsx';
 export type { ResizableRootProps, ResizablePaneProps, ResizableHandleProps } from './resizable.tsx';
 export { Resizable } from './resizable.tsx';
-export { Navigation, NavigationItem, NavigationLink, SidebarLabel, SidebarFooter } from './sidebar.tsx';
+export { Navigation, NavigationSection, NavigationItem, NavigationLink, SidebarLabel, SidebarFooter, } from './sidebar.tsx';

package/dist/packages/layout/src/page-toolbar.d.ts

@@ -5,10 +5,12 @@ type PageToolbarProps = {
     readonly actions?: ReactNode;
     readonly breadcrumb?: boolean;
     readonly navigation?: boolean;
+    readonly views?: ReactNode;
+    readonly leading?: ReactNode;
 };
 type ToolbarActionProps = Omit<ComponentProps<typeof Button>, 'variant' | 'size' | 'xstyle'> & {
     readonly icon?: ReactNode;
 };
-export declare function PageToolbar({ title, actions, breadcrumb, navigation }: PageToolbarProps): ReactNode;
+export declare function PageToolbar({ title, actions, breadcrumb, navigation, views, leading, }: PageToolbarProps): ReactNode;
 export declare function ToolbarAction({ icon, children, ...props }: ToolbarActionProps): ReactNode;
 export {};

package/dist/packages/layout/src/sidebar.d.ts

@@ -33,15 +33,21 @@ type SidebarLabelProps = {
     readonly children: ReactNode;
     readonly grow?: boolean;
 };
+type SidebarFooterLayout = 'inline' | 'navigation';
 type SidebarFooterProps = {
     readonly children: ReactNode;
+    readonly layout?: SidebarFooterLayout;
 };
 export declare function Sidebar({ header, footer, close, children }: SidebarProps): ReactNode;
 export declare function SidebarClose(): ReactNode;
 export declare function Navigation({ children, label }: NavigationProps): ReactNode;
+export declare function NavigationSection({ children, label, }: {
+    readonly children: ReactNode;
+    readonly label: string;
+}): ReactNode;
 export declare function NavigationItem({ children, icon, selected, onClick, ...props }: NavigationItemProps): ReactNode;
 export declare function NavigationLink({ children, icon, selected, onClick, className, style, ...props }: NavigationLinkProps): ReactNode;
 export declare function SidebarLabel({ children, grow }: SidebarLabelProps): ReactNode;
-export declare function SidebarFooter({ children }: SidebarFooterProps): ReactNode;
+export declare function SidebarFooter({ children, layout }: SidebarFooterProps): ReactNode;
 export declare function SidebarToggle(): ReactNode;
 export {};

package/dist/packages/layout/src/view-stack.d.ts

@@ -0,0 +1,13 @@
+import type { ReactNode } from 'react';
+declare function ViewStackRoot({ children }: {
+    readonly children: ReactNode;
+}): ReactNode;
+declare function ViewStackPanel({ active, children }: {
+    readonly active: boolean;
+    readonly children: ReactNode;
+}): ReactNode;
+export declare const ViewStack: {
+    Root: typeof ViewStackRoot;
+    Panel: typeof ViewStackPanel;
+};
+export {};

package/dist/packages/layout/src/workbench.d.ts

@@ -1,11 +1,14 @@
 import type { ReactNode } from 'react';
 export declare function Workbench({ header, children, inspector, }: {
-    readonly header: ReactNode;
+    readonly header?: ReactNode;
     readonly children: ReactNode;
     readonly inspector?: ReactNode;
 }): ReactNode;
-export declare function WorkbenchScroll({ children }: {
+export declare function WorkbenchScroll({ label, children, flush, scrollRestorationId, }: {
+    readonly label: string;
     readonly children: ReactNode;
+    readonly flush?: boolean;
+    readonly scrollRestorationId?: string;
 }): ReactNode;
 export declare function WorkbenchFooter({ children }: {
     readonly children: ReactNode;

package/dist/packages/overlays/src/alert-dialog.d.ts

@@ -7,9 +7,12 @@ export declare const AlertDialog: {
     Root: typeof AlertDialogRoot;
     Trigger: BaseAlertDialog.Trigger;
     Portal: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").DialogPortalProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Backdrop: ({ className, style, ...props }: Omit<import("@base-ui/react").DialogBackdropProps, "ref"> & import("react").RefAttributes<HTMLDivElement>) => ReactNode;
-    Popup: ({ className, style, xstyle, ...props }: Omit<import("@base-ui/react").DialogPopupProps, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
+    Backdrop: ({ className, style, motion, ...props }: Omit<import("@base-ui/react").DialogBackdropProps, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
+        readonly motion?: "none" | "standard";
+    }) => ReactNode;
+    Popup: ({ className, style, xstyle, motion, ...props }: Omit<import("@base-ui/react").DialogPopupProps, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
         readonly xstyle?: import("../../foundations/src/style-composition.ts").PlacementStyle;
+        readonly motion?: "none" | "standard";
     }) => ReactNode;
     Title: ({ className, style, ...props }: Omit<import("@base-ui/react").DialogTitleProps, "ref"> & import("react").RefAttributes<HTMLHeadingElement>) => ReactNode;
     Description: ({ className, style, ...props }: Omit<import("@base-ui/react").DialogDescriptionProps, "ref"> & import("react").RefAttributes<HTMLParagraphElement>) => ReactNode;

package/dist/packages/overlays/src/dialog.d.ts

@@ -2,16 +2,20 @@ import { Dialog as BaseDialog } from '@base-ui/react/dialog';
 import type { ComponentProps, ReactNode } from 'react';
 import type { OpenStateProperties } from '../../foundations/src/control-state.ts';
 import type { PlacementStyle } from '../../foundations/src/style-composition.ts';
+type DialogMotion = 'standard' | 'none';
 type DialogRootProps<Payload> = Omit<BaseDialog.Root.Props<Payload>, 'open' | 'defaultOpen' | 'onOpenChange'> & OpenStateProperties<NonNullable<BaseDialog.Root.Props<Payload>['onOpenChange']>>;
-type DialogBackdropProps = ComponentProps<typeof BaseDialog.Backdrop>;
+type DialogBackdropProps = ComponentProps<typeof BaseDialog.Backdrop> & {
+    readonly motion?: DialogMotion;
+};
 type DialogPopupProps = ComponentProps<typeof BaseDialog.Popup> & {
     readonly xstyle?: PlacementStyle;
+    readonly motion?: DialogMotion;
 };
 type DialogTitleProps = ComponentProps<typeof BaseDialog.Title>;
 type DialogDescriptionProps = ComponentProps<typeof BaseDialog.Description>;
 declare function DialogRoot<Payload = unknown>(props: DialogRootProps<Payload>): ReactNode;
-declare function DialogBackdrop({ className, style, ...props }: DialogBackdropProps): ReactNode;
-declare function DialogPopup({ className, style, xstyle, ...props }: DialogPopupProps): ReactNode;
+declare function DialogBackdrop({ className, style, motion, ...props }: DialogBackdropProps): ReactNode;
+declare function DialogPopup({ className, style, xstyle, motion, ...props }: DialogPopupProps): ReactNode;
 declare function DialogTitle({ className, style, ...props }: DialogTitleProps): ReactNode;
 declare function DialogDescription({ className, style, ...props }: DialogDescriptionProps): ReactNode;
 export declare const Dialog: {

package/dist/pierre-diff--zsiHCCB.js

@@ -0,0 +1,71 @@
+import { n as e, t } from "./pierre-theme-D9hnHv3Z.js";
+import { t as n } from "./viewer-styles-CpHqp5Qv.js";
+import * as r from "@stylexjs/stylex";
+import { useCallback as i, useState as a } from "react";
+import { jsx as o } from "react/jsx-runtime";
+import { Virtualizer as s, parseDiffFromFile as c, parsePatchFiles as l, registerCustomTheme as u } from "@pierre/diffs";
+import { FileDiff as d, VirtualizerContext as f } from "@pierre/diffs/react";
+// packages/content/src/diff/pierre-diff.tsx
+var p = {
+	kVQacm: "xysyzu8",
+	$$css: !0
+}, m = { viewport: (e) => [
+	p,
+	{
+		kskxy: e == null ? e : "x1jols5v",
+		$$css: !0
+	},
+	{ "--x-maxHeight": ((e) => typeof e == "number" ? e + "px" : e ?? void 0)(e) }
+] };
+u("mechane", () => Promise.resolve(t), "zed");
+function h(e) {
+	return e === null ? null : {
+		name: e.name,
+		contents: e.code,
+		lang: e.language ?? "text"
+	};
+}
+function g(e) {
+	return e.patch === void 0 ? [c(h(e.before), h(e.after), {}, !0)] : l(e.patch, { throwOnError: !0 }).flatMap((e) => e.files);
+}
+function _({ files: t, layout: c, wrap: l, showUnchanged: u, annotations: p, maxHeight: h, label: g }) {
+	let [_] = a(() => new s()), v = i((e) => {
+		e === null ? _.cleanUp() : _.setup(e);
+	}, [_]);
+	return /* @__PURE__ */ o(f.Provider, {
+		value: _,
+		children: /* @__PURE__ */ o("div", {
+			ref: v,
+			role: "region",
+			"aria-label": `${g} changes`,
+			tabIndex: 0,
+			...r.props(n.scrollRegion, m.viewport(h)),
+			children: /* @__PURE__ */ o("div", { children: t.map((t) => /* @__PURE__ */ o(d, {
+				fileDiff: t,
+				disableWorkerPool: !0,
+				options: {
+					preferredHighlighter: "highlights",
+					theme: "mechane",
+					themeType: "system",
+					unsafeCSS: e,
+					diffStyle: c,
+					overflow: l ? "wrap" : "scroll",
+					hunkSeparators: "metadata",
+					expandUnchanged: u,
+					tokenizeMaxLength: 2e5,
+					tokenizeMaxLineLength: 4096
+				},
+				lineAnnotations: p.filter((e) => e.file === t.name).map((e) => ({
+					side: e.side === "old" ? "deletions" : "additions",
+					lineNumber: e.line,
+					metadata: e.content
+				})),
+				renderAnnotation: (e) => /* @__PURE__ */ o("div", {
+					className: "x1mvvolr xeuugli x1hz01jw xtqrqnz x1778rvt xj0a0fe",
+					children: e.metadata
+				})
+			}, t.name)) })
+		})
+	});
+}
+export { _ as PierreDiff, g as prepareDiff };