chore: fix NumberField label for ids
fix new-york example DatePickerWithIndependentMonths to use related icon @radix-icons/vue
This commit is contained in:
parent
5094a7a498
commit
ff8e8f6613
|
|
@ -11,6 +11,7 @@ import { Label } from '@/lib/registry/default/ui/label'
|
|||
|
||||
<template>
|
||||
<NumberField
|
||||
id="balance"
|
||||
:default-value="1500"
|
||||
:format-options="{
|
||||
style: 'currency',
|
||||
|
|
@ -19,7 +20,7 @@ import { Label } from '@/lib/registry/default/ui/label'
|
|||
currencySign: 'accounting',
|
||||
}"
|
||||
>
|
||||
<Label>Balance</Label>
|
||||
<Label for="balance">Balance</Label>
|
||||
<NumberFieldContent>
|
||||
<NumberFieldDecrement />
|
||||
<NumberFieldInput />
|
||||
|
|
|
|||
|
|
@ -11,13 +11,14 @@ import { Label } from '@/lib/registry/default/ui/label'
|
|||
|
||||
<template>
|
||||
<NumberField
|
||||
id="number"
|
||||
:default-value="5"
|
||||
:format-options="{
|
||||
signDisplay: 'exceptZero',
|
||||
minimumFractionDigits: 1,
|
||||
}"
|
||||
>
|
||||
<Label>Number</Label>
|
||||
<Label for="number">Number</Label>
|
||||
<NumberFieldContent>
|
||||
<NumberFieldDecrement />
|
||||
<NumberFieldInput />
|
||||
|
|
|
|||
|
|
@ -10,8 +10,8 @@ import { Label } from '@/lib/registry/default/ui/label'
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<NumberField :default-value="18" :min="0">
|
||||
<Label>Age</Label>
|
||||
<NumberField id="age" :default-value="18" :min="0">
|
||||
<Label for="age">Age</Label>
|
||||
<NumberFieldContent>
|
||||
<NumberFieldDecrement />
|
||||
<NumberFieldInput />
|
||||
|
|
|
|||
|
|
@ -10,8 +10,8 @@ import { Label } from '@/lib/registry/default/ui/label'
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<NumberField :default-value="18" :min="0" disabled>
|
||||
<Label>Age</Label>
|
||||
<NumberField id="age-disabled" :default-value="18" disabled>
|
||||
<Label for="age-disabled">Age</Label>
|
||||
<NumberFieldContent>
|
||||
<NumberFieldDecrement />
|
||||
<NumberFieldInput />
|
||||
|
|
|
|||
|
|
@ -11,13 +11,14 @@ import { Label } from '@/lib/registry/default/ui/label'
|
|||
|
||||
<template>
|
||||
<NumberField
|
||||
id="percent"
|
||||
:default-value="0.05"
|
||||
:step="0.01"
|
||||
:format-options="{
|
||||
style: 'percent',
|
||||
}"
|
||||
>
|
||||
<Label>Percent</Label>
|
||||
<Label for="percent">Percent</Label>
|
||||
<NumberFieldContent>
|
||||
<NumberFieldDecrement />
|
||||
<NumberFieldInput />
|
||||
|
|
|
|||
|
|
@ -2,10 +2,10 @@
|
|||
import { type Ref, ref, watch } from 'vue'
|
||||
|
||||
import {
|
||||
Calendar as CalendarIcon,
|
||||
ChevronLeft,
|
||||
ChevronRight,
|
||||
} from 'lucide-vue-next'
|
||||
CalendarIcon,
|
||||
ChevronLeftIcon,
|
||||
ChevronRightIcon,
|
||||
} from '@radix-icons/vue'
|
||||
import {
|
||||
CalendarDate,
|
||||
type DateValue,
|
||||
|
|
@ -153,7 +153,7 @@ watch(secondMonthPlaceholder, (_secondMonthPlaceholder) => {
|
|||
"
|
||||
@click="updateMonth('first', -1)"
|
||||
>
|
||||
<ChevronLeft class="h-4 w-4" />
|
||||
<ChevronLeftIcon class="h-4 w-4" />
|
||||
</button>
|
||||
<div :class="cn('text-sm font-medium')">
|
||||
{{
|
||||
|
|
@ -171,7 +171,7 @@ watch(secondMonthPlaceholder, (_secondMonthPlaceholder) => {
|
|||
"
|
||||
@click="updateMonth('first', 1)"
|
||||
>
|
||||
<ChevronRight class="h-4 w-4" />
|
||||
<ChevronRightIcon class="h-4 w-4" />
|
||||
</button>
|
||||
</div>
|
||||
<RangeCalendarGrid>
|
||||
|
|
@ -219,7 +219,7 @@ watch(secondMonthPlaceholder, (_secondMonthPlaceholder) => {
|
|||
"
|
||||
@click="updateMonth('second', -1)"
|
||||
>
|
||||
<ChevronLeft class="h-4 w-4" />
|
||||
<ChevronLeftIcon class="h-4 w-4" />
|
||||
</button>
|
||||
<div :class="cn('text-sm font-medium')">
|
||||
{{
|
||||
|
|
@ -238,7 +238,7 @@ watch(secondMonthPlaceholder, (_secondMonthPlaceholder) => {
|
|||
"
|
||||
@click="updateMonth('second', 1)"
|
||||
>
|
||||
<ChevronRight class="h-4 w-4" />
|
||||
<ChevronRightIcon class="h-4 w-4" />
|
||||
</button>
|
||||
</div>
|
||||
<RangeCalendarGrid>
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ import { Label } from '@/lib/registry/new-york/ui/label'
|
|||
|
||||
<template>
|
||||
<NumberField
|
||||
id="balance"
|
||||
:default-value="1500"
|
||||
:format-options="{
|
||||
style: 'currency',
|
||||
|
|
@ -19,7 +20,7 @@ import { Label } from '@/lib/registry/new-york/ui/label'
|
|||
currencySign: 'accounting',
|
||||
}"
|
||||
>
|
||||
<Label>Balance</Label>
|
||||
<Label for="balance">Balance</Label>
|
||||
<NumberFieldContent>
|
||||
<NumberFieldDecrement />
|
||||
<NumberFieldInput />
|
||||
|
|
|
|||
|
|
@ -11,13 +11,14 @@ import { Label } from '@/lib/registry/new-york/ui/label'
|
|||
|
||||
<template>
|
||||
<NumberField
|
||||
id="number"
|
||||
:default-value="5"
|
||||
:format-options="{
|
||||
signDisplay: 'exceptZero',
|
||||
minimumFractionDigits: 1,
|
||||
}"
|
||||
>
|
||||
<Label>Number</Label>
|
||||
<Label for="number">Number</Label>
|
||||
<NumberFieldContent>
|
||||
<NumberFieldDecrement />
|
||||
<NumberFieldInput />
|
||||
|
|
|
|||
|
|
@ -10,8 +10,8 @@ import { Label } from '@/lib/registry/new-york/ui/label'
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<NumberField :default-value="18" :min="0">
|
||||
<Label>Age</Label>
|
||||
<NumberField id="age" :default-value="18" :min="0">
|
||||
<Label for="age">Age</Label>
|
||||
<NumberFieldContent>
|
||||
<NumberFieldDecrement />
|
||||
<NumberFieldInput />
|
||||
|
|
|
|||
|
|
@ -10,8 +10,8 @@ import { Label } from '@/lib/registry/new-york/ui/label'
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<NumberField :default-value="18" disabled>
|
||||
<Label>Age</Label>
|
||||
<NumberField id="age-disabled" :default-value="18" disabled>
|
||||
<Label for="age-disabled">Age</Label>
|
||||
<NumberFieldContent>
|
||||
<NumberFieldDecrement />
|
||||
<NumberFieldInput />
|
||||
|
|
|
|||
|
|
@ -11,13 +11,14 @@ import { Label } from '@/lib/registry/new-york/ui/label'
|
|||
|
||||
<template>
|
||||
<NumberField
|
||||
id="percent"
|
||||
:default-value="0.05"
|
||||
:step="0.01"
|
||||
:format-options="{
|
||||
style: 'percent',
|
||||
}"
|
||||
>
|
||||
<Label>Percent</Label>
|
||||
<Label for="percent">Percent</Label>
|
||||
<NumberFieldContent>
|
||||
<NumberFieldDecrement />
|
||||
<NumberFieldInput />
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user