shadcn-vue/apps/www/registry/default/example/NumberFieldCurrency.vue
2024-11-21 11:52:31 +08:00

31 lines
680 B
Vue

<script setup lang="ts">
import { Label } from '@/lib/registry/default/ui/label'
import {
NumberField,
NumberFieldContent,
NumberFieldDecrement,
NumberFieldIncrement,
NumberFieldInput,
} from '@/lib/registry/default/ui/number-field'
</script>
<template>
<NumberField
id="balance"
:default-value="1500"
:format-options="{
style: 'currency',
currency: 'EUR',
currencyDisplay: 'code',
currencySign: 'accounting',
}"
>
<Label for="balance">Balance</Label>
<NumberFieldContent>
<NumberFieldDecrement />
<NumberFieldInput />
<NumberFieldIncrement />
</NumberFieldContent>
</NumberField>
</template>