refactor!: remove NumberFieldLabel

fix new-york and default path for components
This commit is contained in:
Sadegh Barati 2024-06-03 12:37:59 +03:30
parent 5c1131c31c
commit 0cbcd25f96
23 changed files with 31 additions and 77 deletions

View File

@ -28,13 +28,13 @@ import {
NumberFieldDecrement, NumberFieldDecrement,
NumberFieldIncrement, NumberFieldIncrement,
NumberFieldInput, NumberFieldInput,
NumberFieldLabel
} from '@/lib/registry/default/ui/number-field' } from '@/lib/registry/default/ui/number-field'
import { Label } from '@/lib/registry/default/ui/label'
</script> </script>
<template> <template>
<NumberField> <NumberField>
<NumberFieldLabel>Age</NumberFieldLabel> <Label>Age</Label>
<NumberFieldContent> <NumberFieldContent>
<NumberFieldDecrement /> <NumberFieldDecrement />
<NumberFieldInput /> <NumberFieldInput />

View File

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { DonutChart } from '@/lib/registry/new-york/ui/chart-donut' import { DonutChart } from '@/lib/registry/default/ui/chart-donut'
const data = [ const data = [
{ name: 'Jan', total: Math.floor(Math.random() * 2000) + 500, predicted: Math.floor(Math.random() * 2000) + 500 }, { name: 'Jan', total: Math.floor(Math.random() * 2000) + 500, predicted: Math.floor(Math.random() * 2000) + 500 },

View File

@ -5,8 +5,8 @@ import {
NumberFieldDecrement, NumberFieldDecrement,
NumberFieldIncrement, NumberFieldIncrement,
NumberFieldInput, NumberFieldInput,
NumberFieldLabel,
} from '@/lib/registry/default/ui/number-field' } from '@/lib/registry/default/ui/number-field'
import { Label } from '@/lib/registry/default/ui/label'
</script> </script>
<template> <template>
@ -19,7 +19,7 @@ import {
currencySign: 'accounting', currencySign: 'accounting',
}" }"
> >
<NumberFieldLabel>Balance</NumberFieldLabel> <Label>Balance</Label>
<NumberFieldContent> <NumberFieldContent>
<NumberFieldDecrement /> <NumberFieldDecrement />
<NumberFieldInput /> <NumberFieldInput />

View File

@ -5,8 +5,8 @@ import {
NumberFieldDecrement, NumberFieldDecrement,
NumberFieldIncrement, NumberFieldIncrement,
NumberFieldInput, NumberFieldInput,
NumberFieldLabel,
} from '@/lib/registry/default/ui/number-field' } from '@/lib/registry/default/ui/number-field'
import { Label } from '@/lib/registry/default/ui/label'
</script> </script>
<template> <template>
@ -17,7 +17,7 @@ import {
minimumFractionDigits: 1, minimumFractionDigits: 1,
}" }"
> >
<NumberFieldLabel>Number</NumberFieldLabel> <Label>Number</Label>
<NumberFieldContent> <NumberFieldContent>
<NumberFieldDecrement /> <NumberFieldDecrement />
<NumberFieldInput /> <NumberFieldInput />

View File

@ -5,13 +5,13 @@ import {
NumberFieldDecrement, NumberFieldDecrement,
NumberFieldIncrement, NumberFieldIncrement,
NumberFieldInput, NumberFieldInput,
NumberFieldLabel,
} from '@/lib/registry/default/ui/number-field' } from '@/lib/registry/default/ui/number-field'
import { Label } from '@/lib/registry/default/ui/label'
</script> </script>
<template> <template>
<NumberField :default-value="18" :min="0"> <NumberField :default-value="18" :min="0">
<NumberFieldLabel>Age</NumberFieldLabel> <Label>Age</Label>
<NumberFieldContent> <NumberFieldContent>
<NumberFieldDecrement /> <NumberFieldDecrement />
<NumberFieldInput /> <NumberFieldInput />

View File

@ -5,13 +5,13 @@ import {
NumberFieldDecrement, NumberFieldDecrement,
NumberFieldIncrement, NumberFieldIncrement,
NumberFieldInput, NumberFieldInput,
NumberFieldLabel,
} from '@/lib/registry/default/ui/number-field' } from '@/lib/registry/default/ui/number-field'
import { Label } from '@/lib/registry/default/ui/label'
</script> </script>
<template> <template>
<NumberField :default-value="18" :min="0" disabled> <NumberField :default-value="18" :min="0" disabled>
<NumberFieldLabel>Age</NumberFieldLabel> <Label>Age</Label>
<NumberFieldContent> <NumberFieldContent>
<NumberFieldDecrement /> <NumberFieldDecrement />
<NumberFieldInput /> <NumberFieldInput />

View File

@ -5,8 +5,8 @@ import {
NumberFieldDecrement, NumberFieldDecrement,
NumberFieldIncrement, NumberFieldIncrement,
NumberFieldInput, NumberFieldInput,
NumberFieldLabel, } from '@/lib/registry/default/ui/number-field'
} from '@/lib/registry/new-york/ui/number-field' import { Label } from '@/lib/registry/default/ui/label'
</script> </script>
<template> <template>
@ -17,7 +17,7 @@ import {
style: 'percent', style: 'percent',
}" }"
> >
<NumberFieldLabel>Percent</NumberFieldLabel> <Label>Percent</Label>
<NumberFieldContent> <NumberFieldContent>
<NumberFieldDecrement /> <NumberFieldDecrement />
<NumberFieldInput /> <NumberFieldInput />

View File

@ -1,22 +0,0 @@
<script setup lang="ts">
import type { NumberFieldLabelProps } from 'radix-vue'
import { NumberFieldLabel, useForwardProps } from 'radix-vue'
import { type HTMLAttributes, computed } from 'vue'
import { cn } from '@/lib/utils'
const props = defineProps<NumberFieldLabelProps & { class?: HTMLAttributes['class'] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props
return delegated
})
const forwarded = useForwardProps(delegatedProps)
</script>
<template>
<NumberFieldLabel v-bind="forwarded" :class="cn('text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70', props.class)">
<slot />
</NumberFieldLabel>
</template>

View File

@ -1,6 +1,5 @@
export { default as NumberField } from './NumberField.vue' export { default as NumberField } from './NumberField.vue'
export { default as NumberFieldInput } from './NumberFieldInput.vue' export { default as NumberFieldInput } from './NumberFieldInput.vue'
export { default as NumberFieldLabel } from './NumberFieldLabel.vue'
export { default as NumberFieldIncrement } from './NumberFieldIncrement.vue' export { default as NumberFieldIncrement } from './NumberFieldIncrement.vue'
export { default as NumberFieldDecrement } from './NumberFieldDecrement.vue' export { default as NumberFieldDecrement } from './NumberFieldDecrement.vue'
export { default as NumberFieldContent } from './NumberFieldContent.vue' export { default as NumberFieldContent } from './NumberFieldContent.vue'

View File

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { Card, CardContent } from '@/lib/registry/default/ui/card' import { Card, CardContent } from '@/lib/registry/new-york/ui/card'
defineProps<{ defineProps<{
title?: string title?: string

View File

@ -5,8 +5,8 @@ import {
NumberFieldDecrement, NumberFieldDecrement,
NumberFieldIncrement, NumberFieldIncrement,
NumberFieldInput, NumberFieldInput,
NumberFieldLabel,
} from '@/lib/registry/new-york/ui/number-field' } from '@/lib/registry/new-york/ui/number-field'
import { Label } from '@/lib/registry/new-york/ui/label'
</script> </script>
<template> <template>
@ -19,7 +19,7 @@ import {
currencySign: 'accounting', currencySign: 'accounting',
}" }"
> >
<NumberFieldLabel>Balance</NumberFieldLabel> <Label>Balance</Label>
<NumberFieldContent> <NumberFieldContent>
<NumberFieldDecrement /> <NumberFieldDecrement />
<NumberFieldInput /> <NumberFieldInput />

View File

@ -5,8 +5,8 @@ import {
NumberFieldDecrement, NumberFieldDecrement,
NumberFieldIncrement, NumberFieldIncrement,
NumberFieldInput, NumberFieldInput,
NumberFieldLabel,
} from '@/lib/registry/new-york/ui/number-field' } from '@/lib/registry/new-york/ui/number-field'
import { Label } from '@/lib/registry/new-york/ui/label'
</script> </script>
<template> <template>
@ -17,7 +17,7 @@ import {
minimumFractionDigits: 1, minimumFractionDigits: 1,
}" }"
> >
<NumberFieldLabel>Number</NumberFieldLabel> <Label>Number</Label>
<NumberFieldContent> <NumberFieldContent>
<NumberFieldDecrement /> <NumberFieldDecrement />
<NumberFieldInput /> <NumberFieldInput />

View File

@ -5,13 +5,13 @@ import {
NumberFieldDecrement, NumberFieldDecrement,
NumberFieldIncrement, NumberFieldIncrement,
NumberFieldInput, NumberFieldInput,
NumberFieldLabel,
} from '@/lib/registry/new-york/ui/number-field' } from '@/lib/registry/new-york/ui/number-field'
import { Label } from '@/lib/registry/new-york/ui/label'
</script> </script>
<template> <template>
<NumberField :default-value="18" :min="0"> <NumberField :default-value="18" :min="0">
<NumberFieldLabel>Age</NumberFieldLabel> <Label>Age</Label>
<NumberFieldContent> <NumberFieldContent>
<NumberFieldDecrement /> <NumberFieldDecrement />
<NumberFieldInput /> <NumberFieldInput />

View File

@ -5,13 +5,13 @@ import {
NumberFieldDecrement, NumberFieldDecrement,
NumberFieldIncrement, NumberFieldIncrement,
NumberFieldInput, NumberFieldInput,
NumberFieldLabel,
} from '@/lib/registry/new-york/ui/number-field' } from '@/lib/registry/new-york/ui/number-field'
import { Label } from '@/lib/registry/new-york/ui/label'
</script> </script>
<template> <template>
<NumberField :default-value="18" disabled> <NumberField :default-value="18" disabled>
<NumberFieldLabel>Age</NumberFieldLabel> <Label>Age</Label>
<NumberFieldContent> <NumberFieldContent>
<NumberFieldDecrement /> <NumberFieldDecrement />
<NumberFieldInput /> <NumberFieldInput />

View File

@ -5,8 +5,8 @@ import {
NumberFieldDecrement, NumberFieldDecrement,
NumberFieldIncrement, NumberFieldIncrement,
NumberFieldInput, NumberFieldInput,
NumberFieldLabel,
} from '@/lib/registry/new-york/ui/number-field' } from '@/lib/registry/new-york/ui/number-field'
import { Label } from '@/lib/registry/new-york/ui/label'
</script> </script>
<template> <template>
@ -17,7 +17,7 @@ import {
style: 'percent', style: 'percent',
}" }"
> >
<NumberFieldLabel>Percent</NumberFieldLabel> <Label>Percent</Label>
<NumberFieldContent> <NumberFieldContent>
<NumberFieldDecrement /> <NumberFieldDecrement />
<NumberFieldInput /> <NumberFieldInput />

View File

@ -1,7 +1,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import { type HTMLAttributes, computed } from 'vue' import { type HTMLAttributes, computed } from 'vue'
import { CalendarCellTrigger, type CalendarCellTriggerProps, useForwardProps } from 'radix-vue' import { CalendarCellTrigger, type CalendarCellTriggerProps, useForwardProps } from 'radix-vue'
import { buttonVariants } from '@/lib/registry/default/ui/button' import { buttonVariants } from '@/lib/registry/new-york/ui/button'
import { cn } from '@/lib/utils' import { cn } from '@/lib/utils'
const props = defineProps<CalendarCellTriggerProps & { class?: HTMLAttributes['class'] }>() const props = defineProps<CalendarCellTriggerProps & { class?: HTMLAttributes['class'] }>()

View File

@ -3,7 +3,7 @@ import { type HTMLAttributes, computed } from 'vue'
import { CalendarNext, type CalendarNextProps, useForwardProps } from 'radix-vue' import { CalendarNext, type CalendarNextProps, useForwardProps } from 'radix-vue'
import { ChevronRightIcon } from '@radix-icons/vue' import { ChevronRightIcon } from '@radix-icons/vue'
import { cn } from '@/lib/utils' import { cn } from '@/lib/utils'
import { buttonVariants } from '@/lib/registry/default/ui/button' import { buttonVariants } from '@/lib/registry/new-york/ui/button'
const props = defineProps<CalendarNextProps & { class?: HTMLAttributes['class'] }>() const props = defineProps<CalendarNextProps & { class?: HTMLAttributes['class'] }>()

View File

@ -3,7 +3,7 @@ import { type HTMLAttributes, computed } from 'vue'
import { CalendarPrev, type CalendarPrevProps, useForwardProps } from 'radix-vue' import { CalendarPrev, type CalendarPrevProps, useForwardProps } from 'radix-vue'
import { ChevronLeftIcon } from '@radix-icons/vue' import { ChevronLeftIcon } from '@radix-icons/vue'
import { cn } from '@/lib/utils' import { cn } from '@/lib/utils'
import { buttonVariants } from '@/lib/registry/default/ui/button' import { buttonVariants } from '@/lib/registry/new-york/ui/button'
const props = defineProps<CalendarPrevProps & { class?: HTMLAttributes['class'] }>() const props = defineProps<CalendarPrevProps & { class?: HTMLAttributes['class'] }>()

View File

@ -1,22 +0,0 @@
<script setup lang="ts">
import type { NumberFieldLabelProps } from 'radix-vue'
import { NumberFieldLabel, useForwardProps } from 'radix-vue'
import { type HTMLAttributes, computed } from 'vue'
import { cn } from '@/lib/utils'
const props = defineProps<NumberFieldLabelProps & { class?: HTMLAttributes['class'] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props
return delegated
})
const forwarded = useForwardProps(delegatedProps)
</script>
<template>
<NumberFieldLabel v-bind="forwarded" :class="cn('text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70', props.class)">
<slot />
</NumberFieldLabel>
</template>

View File

@ -1,6 +1,5 @@
export { default as NumberField } from './NumberField.vue' export { default as NumberField } from './NumberField.vue'
export { default as NumberFieldInput } from './NumberFieldInput.vue' export { default as NumberFieldInput } from './NumberFieldInput.vue'
export { default as NumberFieldLabel } from './NumberFieldLabel.vue'
export { default as NumberFieldIncrement } from './NumberFieldIncrement.vue' export { default as NumberFieldIncrement } from './NumberFieldIncrement.vue'
export { default as NumberFieldDecrement } from './NumberFieldDecrement.vue' export { default as NumberFieldDecrement } from './NumberFieldDecrement.vue'
export { default as NumberFieldContent } from './NumberFieldContent.vue' export { default as NumberFieldContent } from './NumberFieldContent.vue'

View File

@ -1,7 +1,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import { type HTMLAttributes, computed } from 'vue' import { type HTMLAttributes, computed } from 'vue'
import { RangeCalendarCellTrigger, type RangeCalendarCellTriggerProps, useForwardProps } from 'radix-vue' import { RangeCalendarCellTrigger, type RangeCalendarCellTriggerProps, useForwardProps } from 'radix-vue'
import { buttonVariants } from '@/lib/registry/default/ui/button' import { buttonVariants } from '@/lib/registry/new-york/ui/button'
import { cn } from '@/lib/utils' import { cn } from '@/lib/utils'
const props = defineProps<RangeCalendarCellTriggerProps & { class?: HTMLAttributes['class'] }>() const props = defineProps<RangeCalendarCellTriggerProps & { class?: HTMLAttributes['class'] }>()

View File

@ -3,7 +3,7 @@ import { type HTMLAttributes, computed } from 'vue'
import { RangeCalendarNext, type RangeCalendarNextProps, useForwardProps } from 'radix-vue' import { RangeCalendarNext, type RangeCalendarNextProps, useForwardProps } from 'radix-vue'
import { ChevronRightIcon } from '@radix-icons/vue' import { ChevronRightIcon } from '@radix-icons/vue'
import { cn } from '@/lib/utils' import { cn } from '@/lib/utils'
import { buttonVariants } from '@/lib/registry/default/ui/button' import { buttonVariants } from '@/lib/registry/new-york/ui/button'
const props = defineProps<RangeCalendarNextProps & { class?: HTMLAttributes['class'] }>() const props = defineProps<RangeCalendarNextProps & { class?: HTMLAttributes['class'] }>()

View File

@ -3,7 +3,7 @@ import { type HTMLAttributes, computed } from 'vue'
import { RangeCalendarPrev, type RangeCalendarPrevProps, useForwardProps } from 'radix-vue' import { RangeCalendarPrev, type RangeCalendarPrevProps, useForwardProps } from 'radix-vue'
import { ChevronLeftIcon } from '@radix-icons/vue' import { ChevronLeftIcon } from '@radix-icons/vue'
import { cn } from '@/lib/utils' import { cn } from '@/lib/utils'
import { buttonVariants } from '@/lib/registry/default/ui/button' import { buttonVariants } from '@/lib/registry/new-york/ui/button'
const props = defineProps<RangeCalendarPrevProps & { class?: HTMLAttributes['class'] }>() const props = defineProps<RangeCalendarPrevProps & { class?: HTMLAttributes['class'] }>()