Details table row

A single row in a Details table, displaying a label and its corresponding value.

StatusPaid

Total€ 149.99

TIP

This component is best used within a Details table.

Props

label: string
The label of the row.

value: string
The value of the row.

Snippet

FluxStatisticsDetailsTableRow.vue

<template>
    <Preview>
        <FluxPane style="min-width: 300px">
            <FluxPaneBody>
                <FluxStatisticsDetailsTable>
                    <FluxStatisticsDetailsTableRow
                        label="Status"
                        value="Paid"/>
                    <FluxStatisticsDetailsTableRow
                        label="Total"
                        value="€ 149.99"/>
                </FluxStatisticsDetailsTable>
            </FluxPaneBody>
        </FluxPane>
    </Preview>
</template>

<script
    setup
    lang="ts">
    import { FluxPane, FluxPaneBody } from '@flux-ui/components';
    import { FluxStatisticsDetailsTable, FluxStatisticsDetailsTableRow } from '@flux-ui/statistics';
</script>