CnConfigurationCard
Configuration card with title, actions, and status indicator. Used for feature toggles and service configurations.
Try it
Loading CnConfigurationCard playground…

Props
| Prop | Type | Default | Description |
|---|---|---|---|
title | String | '' | Card title |
Slots
| Slot | Description |
|---|---|
default | Card content |
#icon | Icon displayed in the card header |
#actions | Action buttons in the card header |
#status | Custom status indicator |
#footer | Footer content below the card body |
Usage
<CnConfigurationCard
title="Elasticsearch"
description="Full-text search engine"
status="active"
status-label="Connected">
<NcTextField label="Host" v-model="esHost" />
<template #actions>
<NcButton @click="testConnection">Test Connection</NcButton>
</template>
</CnConfigurationCard>
Reference (auto-generated)
The tables below are generated from the SFC source via vue-docgen-cli. They reflect what's actually in CnConfigurationCard.vue and update automatically whenever the component changes.
Props
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
title | string | '' | Card title |
Slots
| Name | Bindings | Description |
|---|---|---|
icon | — | |
actions | — | |
status | — | |
default | — | |
footer | — |