@acronis-platform/ui-react 0.53.0 → 0.55.0

package/dist/react.js.map

@@ -1 +1 @@
-{"version":3,"file":"react.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"react.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/src/components/ui/filter-search/filter-search.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export type FilterSearchProps = React.ComponentPropsWithoutRef<'div'>;
+declare const FilterSearch: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export type FilterSearchActionsProps = React.ComponentPropsWithoutRef<'div'>;
+declare const FilterSearchActions: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { FilterSearch, FilterSearchActions };

package/dist/src/components/ui/filter-search/index.d.ts

@@ -0,0 +1,2 @@
+export { FilterSearch, FilterSearchActions, } from './filter-search';
+export type { FilterSearchProps, FilterSearchActionsProps } from './filter-search';

package/dist/src/components/ui/resizable/index.d.ts

@@ -1 +1,2 @@
-export { ResizablePanelGroup, ResizablePanel, ResizableHandle, type ResizableHandleProps, } from './resizable';
+export { ResizablePanelGroup, ResizablePanel, ResizableHandle, } from './resizable';
+export type { ResizableHandleProps } from './resizable';

package/dist/src/components/ui/resizable/resizable.d.ts

@@ -1,9 +1,6 @@
 import * as ResizablePrimitive from 'react-resizable-panels';
 declare function ResizablePanelGroup({ className, ...props }: ResizablePrimitive.GroupProps): import("react/jsx-runtime").JSX.Element;
 declare function ResizablePanel(props: ResizablePrimitive.PanelProps): import("react/jsx-runtime").JSX.Element;
-export interface ResizableHandleProps extends ResizablePrimitive.SeparatorProps {
-    /** Render the grab-bar pill centered on the handle. */
-    withHandle?: boolean;
-}
-declare function ResizableHandle({ withHandle, className, ...props }: ResizableHandleProps): import("react/jsx-runtime").JSX.Element;
+export type ResizableHandleProps = ResizablePrimitive.SeparatorProps;
+declare function ResizableHandle({ className, ...props }: ResizableHandleProps): import("react/jsx-runtime").JSX.Element;
 export { ResizablePanelGroup, ResizablePanel, ResizableHandle };

package/dist/src/components/ui/scroll-area/index.d.ts

@@ -0,0 +1 @@
+export { ScrollArea, ScrollBar, type ScrollAreaProps, type ScrollBarProps, } from './scroll-area';

package/dist/src/components/ui/scroll-area/scroll-area.d.ts

@@ -0,0 +1,10 @@
+import { ScrollArea as ScrollAreaPrimitive } from '@base-ui/react/scroll-area';
+import * as React from 'react';
+export type ScrollBarProps = React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Scrollbar>;
+declare const ScrollBar: React.ForwardRefExoticComponent<Omit<Omit<import('@base-ui/react').ScrollAreaScrollbarProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export interface ScrollAreaProps extends React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root> {
+    /** Which scrollbar(s) to render. @default 'vertical' */
+    orientation?: 'vertical' | 'horizontal' | 'both';
+}
+declare const ScrollArea: React.ForwardRefExoticComponent<ScrollAreaProps & React.RefAttributes<HTMLDivElement>>;
+export { ScrollArea, ScrollBar };

package/dist/src/components/ui/sidebar-primary/sidebar-primary.d.ts

@@ -1,6 +1,16 @@
 import { useRender } from '@base-ui/react/use-render';
 import { VariantProps } from 'class-variance-authority';
 import * as React from 'react';
+/**
+ * Tracks whether `ref`'s element is clipping its own content (`scrollWidth >
+ * clientWidth`) — used to gate a tooltip so it only opens when a truncated
+ * label is actually cut off. Re-measures via `ResizeObserver` (covers the
+ * rail's expand/collapse width transition); `enabled` skips measurement
+ * entirely (e.g. while collapsed, where the label is `sr-only`).
+ */
+declare function useIsOverflowing<T extends Element>(ref: React.RefObject<T | null>, { enabled }: {
+    enabled: boolean;
+}): boolean;
 export interface SidebarPrimaryProps extends React.ComponentPropsWithoutRef<'nav'> {
     /** Controlled expanded (rail width) state. */
     expanded?: boolean;
@@ -15,7 +25,22 @@ export interface SidebarPrimaryProps extends React.ComponentPropsWithoutRef<'nav
     render?: useRender.RenderProp;
 }
 declare const SidebarPrimary: React.ForwardRefExoticComponent<SidebarPrimaryProps & React.RefAttributes<HTMLElement>>;
-declare const SidebarPrimaryHeader: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export interface SidebarPrimaryHeaderProps extends React.ComponentPropsWithoutRef<'div'> {
+    /**
+     * Logo content shown while the rail is expanded (e.g. a full lockup).
+     * Pairs with `collapsedLogo` to swap distinct graphics per rail state
+     * instead of resizing one. When neither `logo` nor `collapsedLogo` is
+     * given, `children` renders in both states (the original single-slot
+     * behavior).
+     */
+    logo?: React.ReactNode;
+    /**
+     * Logo content shown while the rail is collapsed (e.g. a monogram mark).
+     * Falls back to `logo` when omitted.
+     */
+    collapsedLogo?: React.ReactNode;
+}
+declare const SidebarPrimaryHeader: React.ForwardRefExoticComponent<SidebarPrimaryHeaderProps & React.RefAttributes<HTMLDivElement>>;
 declare const SidebarPrimaryContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const SidebarPrimaryFooter: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const SidebarPrimarySection: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
@@ -29,6 +54,15 @@ export interface SidebarPrimaryMenuItemProps extends Omit<React.ComponentPropsWi
     /** Leading 16px icon (from `@acronis-platform/icons-react`). */
     icon?: React.ReactNode;
     children?: React.ReactNode;
+    /**
+     * Trailing affordance — a `SidebarPrimaryMenuItemExtras` element. Rendered as
+     * a flex sibling of the label (its own `gap` from `_global/container/gap`),
+     * not nested inside the label's truncating span — nesting it there collapses
+     * the row gap and lets `truncate` clip the affordance. Hidden in collapsed/rail
+     * mode regardless of node type — the parent wraps it, so this holds even for
+     * a raw node rather than `SidebarPrimaryMenuItemExtras`.
+     */
+    extras?: React.ReactNode;
     /**
      * Replace the rendered `<a>` with another element or component (e.g. a router
      * `Link` or a `<button>`) via Base UI composition.
@@ -41,7 +75,12 @@ export interface SidebarPrimaryMenuItemExtrasProps extends React.ComponentPropsW
     variant: 'tag' | 'externalLink' | 'shortcut' | 'tag-externalLink';
     /** Shortcut text (e.g. "⌘H") for the `shortcut` variant. */
     shortcut?: string;
-    /** Tag content for the `tag` / `tag-externalLink` variants. */
+    /**
+     * Tag content for the `tag` / `tag-externalLink` variants. Figma constrains
+     * this slot's `Tag` instance to `size="sm"` (no other size is offered on
+     * MenuItemExtras) — always pass a `<Tag variant="info" size="sm">`, never the
+     * default size.
+     */
     tag?: React.ReactNode;
 }
 declare const SidebarPrimaryMenuItemExtras: React.ForwardRefExoticComponent<SidebarPrimaryMenuItemExtrasProps & React.RefAttributes<HTMLSpanElement>>;
@@ -49,6 +88,12 @@ export interface SidebarPrimaryCollapseTriggerProps extends Omit<React.Component
     /** Leading 16px icon (e.g. a panel-left glyph). */
     icon?: React.ReactNode;
     children?: React.ReactNode;
+    /**
+     * Trailing affordance — a `SidebarPrimaryMenuItemExtras` element (Figma
+     * shows a `⌘H` shortcut here). Rendered as a flex sibling of the label, same
+     * as `SidebarPrimaryMenuItem`'s `extras` prop.
+     */
+    extras?: React.ReactNode;
 }
 declare const SidebarPrimaryCollapseTrigger: React.ForwardRefExoticComponent<SidebarPrimaryCollapseTriggerProps & React.RefAttributes<HTMLButtonElement>>;
-export { SidebarPrimary, SidebarPrimaryHeader, SidebarPrimaryContent, SidebarPrimaryFooter, SidebarPrimarySection, SidebarPrimaryMenu, SidebarPrimaryMenuItem, SidebarPrimaryMenuItemExtras, SidebarPrimaryCollapseTrigger, sidebarPrimaryMenuItemVariants, };
+export { SidebarPrimary, SidebarPrimaryHeader, SidebarPrimaryContent, SidebarPrimaryFooter, SidebarPrimarySection, SidebarPrimaryMenu, SidebarPrimaryMenuItem, SidebarPrimaryMenuItemExtras, SidebarPrimaryCollapseTrigger, useIsOverflowing, sidebarPrimaryMenuItemVariants, };

package/dist/src/components/ui/sidebar-secondary/index.d.ts

@@ -1 +1 @@
-export { SidebarSecondary, SidebarSecondaryHeader, SidebarSecondaryContent, SidebarSecondaryCollapsedBreadcrumb, SidebarSecondaryFooter, SidebarSecondarySection, SidebarSecondarySectionLabel, SidebarSecondaryMenu, SidebarSecondaryMenuItem, SidebarSecondaryMenuSub, SidebarSecondaryMenuSubTrigger, SidebarSecondaryMenuSubContent, SidebarSecondaryMenuSubItem, SidebarSecondaryMenuItemExtras, SidebarSecondaryCollapseTrigger, sidebarSecondaryMenuItemVariants, type SidebarSecondaryProps, type SidebarSecondaryHeaderProps, type SidebarSecondaryCollapsedBreadcrumbProps, type SidebarSecondaryMenuItemProps, type SidebarSecondaryMenuSubProps, type SidebarSecondaryMenuSubTriggerProps, type SidebarSecondaryMenuSubContentProps, type SidebarSecondaryMenuSubItemProps, type SidebarSecondaryMenuItemExtrasProps, type SidebarSecondaryCollapseTriggerProps, } from './sidebar-secondary';
+export { SidebarSecondary, SidebarSecondaryHeader, SidebarSecondaryContent, SidebarSecondaryFooter, SidebarSecondarySection, SidebarSecondarySectionLabel, SidebarSecondaryMenu, SidebarSecondaryMenuItem, SidebarSecondaryMenuItemExtras, SidebarSecondaryCollapseTrigger, sidebarSecondaryMenuItemVariants, type SidebarSecondaryProps, type SidebarSecondaryHeaderProps, type SidebarSecondaryMenuItemProps, type SidebarSecondaryMenuItemExtrasProps, type SidebarSecondaryCollapseTriggerProps, } from './sidebar-secondary';

package/dist/src/components/ui/sidebar-secondary/sidebar-secondary.d.ts

@@ -1,5 +1,4 @@
 import { useRender } from '@base-ui/react/use-render';
-import { Collapsible } from '@base-ui/react/collapsible';
 import { VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 export interface SidebarSecondaryProps extends React.ComponentPropsWithoutRef<'nav'> {
@@ -9,6 +8,22 @@ export interface SidebarSecondaryProps extends React.ComponentPropsWithoutRef<'n
     defaultExpanded?: boolean;
     /** Fires when the expanded state changes (e.g. a consumer toggle). */
     onExpandedChange?: (expanded: boolean) => void;
+    /**
+     * Enable the draggable resize edge on the right border.
+     * When `true`, the sidebar can be resized between the expanded-width token
+     * and twice that value.
+     */
+    resizable?: boolean;
+    /** Controlled width in px (only used when `resizable`). */
+    width?: number;
+    /** Fires when the width changes due to a drag interaction. */
+    onWidthChange?: (width: number) => void;
+    /** Accessible label for the resize edge (`role="separator"`). Defaults to `'Resize sidebar'`. */
+    resizeAriaLabel?: string;
+    /** Tooltip content shown when the sidebar is expanded. Pass `null` to hide the tooltip entirely. */
+    resizeTooltipExpanded?: React.ReactNode;
+    /** Tooltip content shown when the sidebar is collapsed. Pass `null` to hide the tooltip entirely. */
+    resizeTooltipCollapsed?: React.ReactNode;
     /**
      * Replace the rendered `<nav>` with another element or component
      * (Base UI composition). Accepts a React element or a render function.
@@ -23,11 +38,17 @@ export interface SidebarSecondaryHeaderProps extends React.ComponentPropsWithout
 declare const SidebarSecondaryHeader: React.ForwardRefExoticComponent<SidebarSecondaryHeaderProps & React.RefAttributes<HTMLDivElement>>;
 declare const SidebarSecondaryContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export interface SidebarSecondaryCollapsedBreadcrumbProps extends React.ComponentPropsWithoutRef<'div'> {
-    /** The parent section label (breadcrumbLabel). */
-    parentLabel: React.ReactNode;
-    /** The current page label (labelCurrentPage). */
-    currentLabel: React.ReactNode;
-    /** Separator between the two; defaults to a 16px ChevronRightIcon (R6). */
+    /**
+     * The parent section label (breadcrumbLabel).
+     * Auto-derived from the `SidebarSecondaryHeader` label when omitted.
+     */
+    parentLabel?: React.ReactNode;
+    /**
+     * The current page label (labelCurrentPage).
+     * Auto-derived from the selected `SidebarSecondaryMenuItem` when omitted.
+     */
+    currentLabel?: React.ReactNode;
+    /** Separator between the two; defaults to a 16px ChevronDownIcon. */
     separator?: React.ReactNode;
 }
 declare const SidebarSecondaryCollapsedBreadcrumb: React.ForwardRefExoticComponent<SidebarSecondaryCollapsedBreadcrumbProps & React.RefAttributes<HTMLDivElement>>;
@@ -63,32 +84,15 @@ declare const sidebarSecondaryMenuItemVariants: (props?: ({
 export interface SidebarSecondaryMenuItemProps extends Omit<React.ComponentPropsWithoutRef<'a'>, 'children'>, Omit<VariantProps<typeof sidebarSecondaryMenuItemVariants>, 'variant'> {
     /** Marks the current route: sets the `selected` variant + `aria-current="page"`. */
     selected?: boolean;
-    /** Optional leading 16px icon (Level-1 only; `hasIcon` in Figma). */
+    /** Optional leading 16px icon (`hasIcon` in Figma). */
     icon?: React.ReactNode;
+    /** Trailing extras (tag, shortcut, external-link icon — `hasExtras` in Figma). */
+    extras?: React.ReactNode;
     children?: React.ReactNode;
     /** Replace the rendered `<a>` (e.g. a router `Link` or a `<button>`). */
     render?: useRender.RenderProp;
 }
 declare const SidebarSecondaryMenuItem: React.ForwardRefExoticComponent<SidebarSecondaryMenuItemProps & React.RefAttributes<HTMLAnchorElement>>;
-export type SidebarSecondaryMenuSubProps = React.ComponentPropsWithoutRef<typeof Collapsible.Root>;
-declare const SidebarSecondaryMenuSub: React.ForwardRefExoticComponent<Omit<Omit<import('@base-ui/react').CollapsibleRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export interface SidebarSecondaryMenuSubTriggerProps extends React.ComponentPropsWithoutRef<typeof Collapsible.Trigger> {
-    /** Marks the parent row as selected. */
-    selected?: boolean;
-    /** Optional leading 16px icon. */
-    icon?: React.ReactNode;
-}
-declare const SidebarSecondaryMenuSubTrigger: React.ForwardRefExoticComponent<SidebarSecondaryMenuSubTriggerProps & React.RefAttributes<HTMLButtonElement>>;
-export type SidebarSecondaryMenuSubContentProps = React.ComponentPropsWithoutRef<typeof Collapsible.Panel>;
-declare const SidebarSecondaryMenuSubContent: React.ForwardRefExoticComponent<Omit<Omit<import('@base-ui/react').CollapsiblePanelProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export interface SidebarSecondaryMenuSubItemProps extends Omit<React.ComponentPropsWithoutRef<'a'>, 'children'> {
-    /** Marks the current route (Level-2 — no icon). */
-    selected?: boolean;
-    children?: React.ReactNode;
-    /** Replace the rendered `<a>` (e.g. a router `Link`). */
-    render?: useRender.RenderProp;
-}
-declare const SidebarSecondaryMenuSubItem: React.ForwardRefExoticComponent<SidebarSecondaryMenuSubItemProps & React.RefAttributes<HTMLAnchorElement>>;
 export interface SidebarSecondaryMenuItemExtrasProps extends React.ComponentPropsWithoutRef<'span'> {
     /** Which trailing affordance to render. */
     variant: 'tag' | 'externalLink' | 'shortcut' | 'tag-externalLink';
@@ -99,14 +103,15 @@ export interface SidebarSecondaryMenuItemExtrasProps extends React.ComponentProp
 }
 declare const SidebarSecondaryMenuItemExtras: React.ForwardRefExoticComponent<SidebarSecondaryMenuItemExtrasProps & React.RefAttributes<HTMLSpanElement>>;
 export interface SidebarSecondaryCollapseTriggerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'children'> {
-    /** Leading 16px icon (e.g. a panel-left glyph). */
+    /** Icon shown when the sidebar is expanded (collapse affordance). */
     icon?: React.ReactNode;
-    /**
-     * Optional trailing keyboard-shortcut hint (e.g. `⌘J`), right-aligned and
-     * hidden alongside the label in collapsed mode.
-     */
-    shortcut?: React.ReactNode;
+    /** Icon shown when the sidebar is collapsed (expand affordance). Falls back to `icon` when omitted. */
+    expandIcon?: React.ReactNode;
+    /** Tooltip text shown when the sidebar is collapsed. Defaults to `'Expand'`. */
+    expandTooltip?: React.ReactNode;
+    /** Trailing extras (e.g. a keyboard shortcut hint), same slot as `SidebarSecondaryMenuItem`. */
+    extras?: React.ReactNode;
     children?: React.ReactNode;
 }
 declare const SidebarSecondaryCollapseTrigger: React.ForwardRefExoticComponent<SidebarSecondaryCollapseTriggerProps & React.RefAttributes<HTMLButtonElement>>;
-export { SidebarSecondary, SidebarSecondaryHeader, SidebarSecondaryContent, SidebarSecondaryCollapsedBreadcrumb, SidebarSecondaryFooter, SidebarSecondarySection, SidebarSecondarySectionLabel, SidebarSecondaryMenu, SidebarSecondaryMenuItem, SidebarSecondaryMenuSub, SidebarSecondaryMenuSubTrigger, SidebarSecondaryMenuSubContent, SidebarSecondaryMenuSubItem, SidebarSecondaryMenuItemExtras, SidebarSecondaryCollapseTrigger, sidebarSecondaryMenuItemVariants, };
+export { SidebarSecondary, SidebarSecondaryHeader, SidebarSecondaryContent, SidebarSecondaryCollapsedBreadcrumb, SidebarSecondaryFooter, SidebarSecondarySection, SidebarSecondarySectionLabel, SidebarSecondaryMenu, SidebarSecondaryMenuItem, SidebarSecondaryMenuItemExtras, SidebarSecondaryCollapseTrigger, sidebarSecondaryMenuItemVariants, };

package/dist/src/index.d.ts

@@ -1,4 +1,5 @@
 export { cn } from './lib/utils';
+export { PortalContainerProvider, usePortalContainer, type PortalContainerProviderProps, } from './lib/portal-container';
 export * from './components/ui/accordion';
 export * from './components/ui/alert';
 export * from './components/ui/app-shell';
@@ -38,6 +39,7 @@ export * from './components/ui/pagination';
 export * from './components/ui/popover';
 export * from './components/ui/progress';
 export * from './components/ui/progress-circle';
+export * from './components/ui/scroll-area';
 export * from './components/ui/search-global';
 export { InputText as Input, type InputTextProps as InputProps, } from './components/ui/input-text';
 export { InputSearch as Search, type InputSearchProps as SearchProps, } from './components/ui/input-search';
@@ -54,6 +56,7 @@ export * from './components/ui/resizable';
 export * from './components/ui/sidebar-primary';
 export * from './components/ui/sidebar-secondary';
 export * from './components/ui/button-icon';
+export * from './components/ui/filter-search';
 export * from './components/ui/switch';
 export * from './components/ui/table';
 export * from './components/ui/tabs';

package/dist/src/lib/portal-container.d.ts

@@ -0,0 +1,36 @@
+import * as React from 'react';
+export interface PortalContainerProviderProps {
+    /**
+     * The DOM element portaled content should render into (e.g. a `<div>` inside
+     * a shadow root). When set, every ui-react portaling component
+     * (`Popover`, `DropdownMenu`, `Tooltip`, `Dialog`, `Sheet`, `Select`,
+     * `Combobox`, `Toast`) will mount its popup inside this element instead of
+     * `document.body`.
+     */
+    container: HTMLElement | null;
+    children: React.ReactNode;
+}
+/**
+ * Provides a default portal container for all ui-react portaling components.
+ *
+ * Wrap your app (or a subtree) so that popups, dialogs, tooltips, toasts, etc.
+ * render inside the given container instead of `document.body`. This is the
+ * recommended way for shadow-DOM MFEs to keep portaled content inside the
+ * shadow root where adopted stylesheets apply.
+ *
+ * Individual components' `portalContainer` prop overrides this context.
+ *
+ * @example
+ * ```tsx
+ * // Inside a shadow-DOM MFE — all portals go into the shadow root
+ * <PortalContainerProvider container={shadowRootMountDiv}>
+ *   <App />
+ * </PortalContainerProvider>
+ * ```
+ */
+export declare function PortalContainerProvider({ container, children }: PortalContainerProviderProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Returns the portal container set by the nearest `PortalContainerProvider`,
+ * or `undefined` if none exists (letting Base UI default to `document.body`).
+ */
+export declare function usePortalContainer(): HTMLElement | null | undefined;