Preview

Usage

<cs-drawer header="Resource details">
  <cs-space-between size="l" direction="vertical">
    <cs-key-value-pairs columns="2">
      <!-- key-value content -->
    </cs-key-value-pairs>
  </cs-space-between>
</cs-drawer>

Properties

disable-content-paddingsboolean default: false

Determines whether the drawer content has padding. If true, removes the default padding from the content area.

i18n-stringsI18nStrings

An object containing all the necessary localized strings required by the component.

loadingboolean default: false

Renders the drawer in a loading state. We recommend that you also set a loadingText.

Slots

default

Main content of the drawer.

footer

Sticky footer content that remains visible at the bottom during scroll.

Automatically becomes non-sticky when scrollable content area is too small to ensure content remains accessible (not covered by the footer).

header

Header of the drawer.

It should contain the only h2 used in the drawer.

headerActions

Actions for the header. Available only if you specify the header property.