smart-flow/yudao-ui-admin-vben
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: migrate from Radix Vue to Reka UI (#6870)

Browse Source 
* Initial plan

* Update dependencies and imports from radix-vue to reka-ui

Co-authored-by: likui628 <90845831+likui628@users.noreply.github.com>

* Fix type errors after reka-ui migration

Co-authored-by: likui628 <90845831+likui628@users.noreply.github.com>

* Run formatter to fix code style

Co-authored-by: likui628 <90845831+likui628@users.noreply.github.com>

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: likui628 <90845831+likui628@users.noreply.github.com>
This commit is contained in:
Copilot
2025-11-06 16:22:24 +08:00
committed by GitHub
parent 7268824612
commit 1e09fa4642
148 changed files with 303 additions and 405 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/@core/ui-kit/shadcn-ui/src/components/avatar/avatar.vue
View File

@@ -3,7 +3,7 @@ import type {
AvatarFallbackProps,
AvatarImageProps,
AvatarRootProps,
} from 'radix-vue';
} from 'reka-ui';
import type { CSSProperties } from 'vue';

2
packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/breadcrumb-view.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { BreadcrumbProps } from './types';
import { useForwardPropsEmits } from 'radix-vue';
import { useForwardPropsEmits } from 'reka-ui';
import BreadcrumbBackground from './breadcrumb-background.vue';
import Breadcrumb from './breadcrumb.vue';

2
packages/@core/ui-kit/shadcn-ui/src/components/button/button.ts
View File

@@ -1,4 +1,4 @@
import type { AsTag } from 'radix-vue';
import type { AsTag } from 'reka-ui';
import type { Component } from 'vue';

2
packages/@core/ui-kit/shadcn-ui/src/components/button/button.vue
View File

@@ -6,7 +6,7 @@ import { computed } from 'vue';
import { LoaderCircle } from '@vben-core/icons';
import { cn } from '@vben-core/shared/utils';
import { Primitive } from 'radix-vue';
import { Primitive } from 'reka-ui';
import { buttonVariants } from '../../ui';

8
packages/@core/ui-kit/shadcn-ui/src/components/checkbox/checkbox.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { CheckboxRootEmits, CheckboxRootProps } from 'radix-vue';
import type { CheckboxRootEmits, CheckboxRootProps } from 'reka-ui';
import { useId } from 'vue';
import { useForwardPropsEmits } from 'radix-vue';
import { useForwardPropsEmits } from 'reka-ui';
import { Checkbox } from '../../ui/checkbox';
@@ -11,7 +11,7 @@ const props = defineProps<CheckboxRootProps & { indeterminate?: boolean }>();
const emits = defineEmits<CheckboxRootEmits>();
const checked = defineModel<boolean>('checked');
const checked = defineModel<boolean>();
const forwarded = useForwardPropsEmits(props, emits);
@@ -20,7 +20,7 @@ const id = useId();
<template>
<div class="flex items-center">
<Checkbox v-bind="forwarded" :id="id" v-model:checked="checked" />
<Checkbox v-bind="forwarded" :id="id" v-model="checked" />
<label :for="id" class="ml-2 cursor-pointer text-sm"> <slot></slot> </label>
</div>
</template>

4
packages/@core/ui-kit/shadcn-ui/src/components/context-menu/context-menu.vue
View File

@@ -3,7 +3,7 @@ import type {
ContextMenuContentProps,
ContextMenuRootEmits,
ContextMenuRootProps,
} from 'radix-vue';
} from 'reka-ui';
import type { ClassType } from '@vben-core/typings';
@@ -11,7 +11,7 @@ import type { IContextMenuItem } from './interface';
import { computed } from 'vue';
import { useForwardPropsEmits } from 'radix-vue';
import { useForwardPropsEmits } from 'reka-ui';
import {
ContextMenu,

4
packages/@core/ui-kit/shadcn-ui/src/components/hover-card/hover-card.vue
View File

@@ -3,13 +3,13 @@ import type {
HoverCardContentProps,
HoverCardRootEmits,
HoverCardRootProps,
} from 'radix-vue';
} from 'reka-ui';
import type { ClassType } from '@vben-core/typings';
import { computed } from 'vue';
import { useForwardPropsEmits } from 'radix-vue';
import { useForwardPropsEmits } from 'reka-ui';
import { HoverCard, HoverCardContent, HoverCardTrigger } from '../../ui';

2
packages/@core/ui-kit/shadcn-ui/src/components/hover-card/index.ts
View File

@@ -1,2 +1,2 @@
export { default as VbenHoverCard } from './hover-card.vue';
export type { HoverCardContentProps } from 'radix-vue';
export type { HoverCardContentProps } from 'reka-ui';

4
packages/@core/ui-kit/shadcn-ui/src/components/pin-input/input.vue
View File

@@ -84,6 +84,8 @@ onBeforeUnmount(() => {
});
const id = useId();
const pinType = 'text' as const;
</script>
<template>
@@ -94,7 +96,7 @@ const id = useId();
class="flex w-full justify-between"
otp
placeholder="○"
type="number"
:type="pinType"
@complete="handleComplete"
>
<div class="relative flex w-full">

4
packages/@core/ui-kit/shadcn-ui/src/components/popover/popover.vue
View File

@@ -3,13 +3,13 @@ import type {
PopoverContentProps,
PopoverRootEmits,
PopoverRootProps,
} from 'radix-vue';
} from 'reka-ui';
import type { ClassType } from '@vben-core/typings';
import { computed } from 'vue';
import { useForwardPropsEmits } from 'radix-vue';
import { useForwardPropsEmits } from 'reka-ui';
import {
PopoverContent,

2
packages/@core/ui-kit/shadcn-ui/src/components/segmented/segmented.vue
View File

@@ -3,7 +3,7 @@ import type { SegmentedItem } from './types';
import { computed } from 'vue';
import { TabsTrigger } from 'radix-vue';
import { TabsTrigger } from 'reka-ui';
import { Tabs, TabsContent, TabsList } from '../../ui';
import TabsIndicator from './tabs-indicator.vue';

6
packages/@core/ui-kit/shadcn-ui/src/components/segmented/tabs-indicator.vue
View File

@@ -1,11 +1,11 @@
<script setup lang="ts">
import type { TabsIndicatorProps } from 'radix-vue';
import type { TabsIndicatorProps } from 'reka-ui';
import { computed } from 'vue';
import { cn } from '@vben-core/shared/utils';
import { TabsIndicator, useForwardProps } from 'radix-vue';
import { TabsIndicator, useForwardProps } from 'reka-ui';
const props = defineProps<TabsIndicatorProps & { class?: any }>();
@@ -23,7 +23,7 @@ const forwardedProps = useForwardProps(delegatedProps);
v-bind="forwardedProps"
:class="
cn(
'absolute bottom-0 left-0 z-10 h-full w-1/2 translate-x-[--radix-tabs-indicator-position] rounded-full px-0 py-1 pr-0.5 transition-[width,transform] duration-300',
'absolute bottom-0 left-0 z-10 h-full w-1/2 translate-x-[--reka-tabs-indicator-position] rounded-full px-0 py-1 pr-0.5 transition-[width,transform] duration-300',
props.class,
)
"

2
packages/@core/ui-kit/shadcn-ui/src/components/tooltip/tooltip.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import type { TooltipContentProps } from 'radix-vue';
import type { TooltipContentProps } from 'reka-ui';
import type { StyleValue } from 'vue';