Skip to main content
Version: v3

SlideInConfig

Configuration object for opening a Slide-In panel. Here's what a Slide-In looks like in Rancher UI:

Properties​

disableFocusTrap?​

optional disableFocusTrap?: boolean;

When true, disables the focus trap on the Slide-In panel. Useful for panels with no focusable elements or custom focus management.

height?​

optional height?: SlideInHeight;

Height preset for the Slide-In panel. Defaults to 'default' (below header). When set to 'full', the panel covers the full viewport height and the z-index is automatically elevated above the side menu.

  • 'default' — positioned below the header bar, filling the remaining viewport height
  • 'full' — full viewport height (100vh), covering the header and side menu

props?​

optional props?: object;

Vue Props to pass directly to the component rendered inside the slide in panel in an object format as "props=..."

Useful for passing additional information or context to the component rendered inside the Slide-In window

Index Signature​

[key: string]: any

showHeader?​

optional showHeader?: boolean;

Deprecated​

No longer needed — header visibility is inferred from the presence of title. Full deprecation expected in Rancher 2.17.

title?​

optional title?: string;

title for the Slide-In panel. When set, a header bar with the title and a close button is displayed. When omitted, no header is shown.

top?​

optional top?: string;

Deprecated​

No longer needed — automatically managed based on panelHeight. Full deprecation expected in Rancher 2.17.

width?​

optional width?: SlideInWidth;

Width preset for the Slide-In panel. Defaults to 'default' (33%).

  • 'default' — 33% of the viewport width
  • 'wide' — 73% of the viewport width