AisCardBody

AisCardBody is the content wrapper used internally by AisCard.

In most cases you do not need to use AisCardBody directly. AisCard creates it for you.

Use AisCardBody directly only for advanced composition, such as:

• custom accessibility semantics (role, aria-label, aria-labelledby, etc.)
• custom keyboard focus behavior (tabindex)
• custom layout/scroll wrappers when using AisCard with no-body

Accessibility Defaults

When AisCardBody detects scrollable overflow, it automatically adds tabindex="0" so keyboard users can focus and scroll the region.

Detection includes:

• overflow utility classes like overflow-auto, overflow-y-auto, overflow-scroll
• overflow styles (inline/computed), such as overflow-y: auto

If you provide your own tabindex directly on AisCardBody, your value is used.

Advanced Usage

Use AisCard with no-body, then add your own AisCardBody. In this example, we're adding explicit a11y attributes.

<AisCard no-body header="Search Results">
  <AisCardBody
    class="max-h-64 overflow-auto"
    role="region"
    aria-label="Search results list"
    tabindex="-1"
  >
    <!-- custom content -->
  </AisCardBody>
</AisCard>

Component Reference

Slots

Name	Scoped	Description
default	No