MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-04-19 06:43:51 +02:00
Code Issues Packages Projects Releases Wiki Activity

eslint fix

Browse Source
This commit is contained in:
pa
2026-03-10 22:42:22 +09:00
parent 699bf620e5
commit 4877010006
124 changed files with 980 additions and 1121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/DisplayName.vue
View File

@@ -44,4 +44,3 @@
watch([() => props.userid, () => props.location, () => props.forceUpdateKey], parse, { immediate: true });
</script>

2
src/components/InstanceActionBar.vue
View File

@@ -355,8 +355,6 @@
}
};
const closeInstance = (location) => {
modalStore
.confirm({

8
src/components/dialogs/GroupDialog/GroupDialog.vue
View File

@@ -426,7 +426,7 @@
import GroupDialogPhotosTab from './GroupDialogPhotosTab.vue';
import GroupDialogPostsTab from './GroupDialogPostsTab.vue';
import GroupPostEditDialog from './GroupPostEditDialog.vue';
import { showUserDialog } from '../../../coordinators/userCoordinator';
import { showUserDialog } from '../../../coordinators/userCoordinator';
const { t } = useI18n();
const groupDialogTabs = computed(() => [
@@ -439,13 +439,9 @@ import { showUserDialog } from '../../../coordinators/userCoordinator';
const modalStore = useModalStore();
const { currentUser } = storeToRefs(useUserStore());
const { groupDialog, inviteGroupDialog } = storeToRefs(useGroupStore());
const {
updateGroupPostSearch,
showGroupMemberModerationDialog
} = useGroupStore();
const { updateGroupPostSearch, showGroupMemberModerationDialog } = useGroupStore();
const { showFullscreenImageDialog } = useGalleryStore();

3
src/components/dialogs/GroupDialog/GroupDialogMembersTab.vue
View File

@@ -216,12 +216,11 @@
import { applyGroupMember, handleGroupMember } from '../../../coordinators/groupCoordinator';
import { groupDialogSortingOptions } from '../../../shared/constants';
import { useGroupMembers } from './useGroupMembers';
import { showUserDialog } from '../../../coordinators/userCoordinator';
import { showUserDialog } from '../../../coordinators/userCoordinator';
const { userImage } = useUserDisplay();
const { t } = useI18n();
const { currentUser } = storeToRefs(useUserStore());
const { groupDialog } = storeToRefs(useGroupStore());

10
src/components/dialogs/GroupDialog/GroupMemberModerationDialog.vue
View File

@@ -122,7 +122,11 @@
import { useI18n } from 'vue-i18n';
import { useAppearanceSettingsStore, useGalleryStore, useGroupStore, useUserStore } from '../../../stores';
import { applyGroupMember, handleGroupMember, handleGroupMemberProps } from '../../../coordinators/groupCoordinator';
import {
applyGroupMember,
handleGroupMember,
handleGroupMemberProps
} from '../../../coordinators/groupCoordinator';
import { hasGroupPermission } from '../../../shared/utils';
import { useUserDisplay } from '../../../composables/useUserDisplay';
import { groupDialogFilterOptions, groupDialogSortingOptions } from '../../../shared/constants';
@@ -140,13 +144,13 @@
import GroupModerationInvitesTab from './GroupModerationInvitesTab.vue';
import GroupModerationLogsTab from './GroupModerationLogsTab.vue';
import GroupModerationMembersTab from './GroupModerationMembersTab.vue';
import { showUserDialog } from '../../../coordinators/userCoordinator';
import { showUserDialog } from '../../../coordinators/userCoordinator';
// ── Stores ───────────────────────────────────────────────────
const { userImage, userImageFull } = useUserDisplay();
const appearanceSettingsStore = useAppearanceSettingsStore();
const { randomUserColours } = storeToRefs(appearanceSettingsStore);
const { currentUser } = storeToRefs(useUserStore());
const { groupDialog, groupMemberModeration } = storeToRefs(useGroupStore());
const { showFullscreenImageDialog } = useGalleryStore();

45
src/components/dialogs/GroupDialog/GroupModerationBulkActions.vue
View File

@@ -40,9 +40,7 @@
</template>
<AlertTriangle style="margin-left: 3px; display: inline-block" />
</TooltipWrapper>
<span
v-text="user.user?.displayName || user.userId"
style="font-weight: bold; margin-left: 6px"></span>
<span v-text="user.user?.displayName || user.userId" style="font-weight: bold; margin-left: 6px"></span>
<button
type="button"
style="
@@ -79,10 +77,7 @@
<SelectValue :placeholder="t('dialog.group_member_moderation.choose_roles_placeholder')" />
</SelectTrigger>
<SelectContent>
<SelectItem
v-for="role in groupRef.roles"
:key="role.id"
:value="role.id">
<SelectItem v-for="role in groupRef.roles" :key="role.id" :value="role.id">
{{ role.name }}
</SelectItem>
</SelectContent>
@@ -96,9 +91,7 @@
variant="outline"
:disabled="
Boolean(
!selectedRoles.length ||
progressCurrent ||
!hasGroupPermission(groupRef, 'group-roles-assign')
!selectedRoles.length || progressCurrent || !hasGroupPermission(groupRef, 'group-roles-assign')
)
"
@click="$emit('add-roles')"
@@ -108,9 +101,7 @@
variant="secondary"
:disabled="
Boolean(
!selectedRoles.length ||
progressCurrent ||
!hasGroupPermission(groupRef, 'group-roles-assign')
!selectedRoles.length || progressCurrent || !hasGroupPermission(groupRef, 'group-roles-assign')
)
"
@click="$emit('remove-roles')"
@@ -118,45 +109,25 @@
>
<Button
variant="outline"
:disabled="
Boolean(
progressCurrent ||
!hasGroupPermission(groupRef, 'group-members-manage')
)
"
:disabled="Boolean(progressCurrent || !hasGroupPermission(groupRef, 'group-members-manage'))"
@click="$emit('save-note')"
>{{ t('dialog.group_member_moderation.save_note') }}</Button
>
<Button
variant="outline"
:disabled="
Boolean(
progressCurrent ||
!hasGroupPermission(groupRef, 'group-members-remove')
)
"
:disabled="Boolean(progressCurrent || !hasGroupPermission(groupRef, 'group-members-remove'))"
@click="$emit('kick')"
>{{ t('dialog.group_member_moderation.kick') }}</Button
>
<Button
variant="outline"
:disabled="
Boolean(
progressCurrent ||
!hasGroupPermission(groupRef, 'group-bans-manage')
)
"
:disabled="Boolean(progressCurrent || !hasGroupPermission(groupRef, 'group-bans-manage'))"
@click="$emit('ban')"
>{{ t('dialog.group_member_moderation.ban') }}</Button
>
<Button
variant="outline"
:disabled="
Boolean(
progressCurrent ||
!hasGroupPermission(groupRef, 'group-bans-manage')
)
"
:disabled="Boolean(progressCurrent || !hasGroupPermission(groupRef, 'group-bans-manage'))"
@click="$emit('unban')"
>{{ t('dialog.group_member_moderation.unban') }}</Button
>

2
src/components/dialogs/GroupDialog/__tests__/GroupDialogPostsTab.test.js
View File

@@ -130,7 +130,7 @@ const MOCK_POSTS = [
];
/**
* @param {Object} overrides
* @param {object} overrides
*/
function mountComponent(overrides = {}) {
const pinia = createTestingPinia({

3
src/components/dialogs/GroupDialog/useGroupCalendarEvents.js
View File

@@ -3,7 +3,6 @@ import { computed } from 'vue';
/**
* Composable for filtering group calendar events into past and upcoming,
* and updating follow state on individual events.
*
* @param {import('vue').Ref} groupDialog - reactive ref to the group dialog state
* @returns {{
* pastCalenderEvents: import('vue').ComputedRef<Array>,
@@ -35,7 +34,7 @@ export function useGroupCalendarEvents(groupDialog) {
});
/**
* @param {Object} event
* @param {object} event
*/
function updateFollowingCalendarData(event) {
const calendar = groupDialog.value.calendar;

3
src/components/dialogs/PreviousInstancesDialog/PreviousInstancesInfoDialog.vue
View File

@@ -43,9 +43,8 @@
import { createColumns } from './previousInstancesInfoColumns.jsx';
import { database } from '../../../services/database';
import { useVrcxVueTable } from '../../../lib/table/useVrcxVueTable';
import { lookupUser } from '../../../coordinators/userCoordinator';
import { lookupUser } from '../../../coordinators/userCoordinator';
const { previousInstancesInfoDialog, previousInstancesInfoState } = storeToRefs(useInstanceStore());
const { gameLogIsFriend, gameLogIsFavorite } = useGameLogStore();
const { t } = useI18n();

6
src/components/dialogs/UserDialog/UserDialog.vue
View File

@@ -142,9 +142,9 @@
const { userDialog, languageDialog, currentUser, isLocalUserVrcPlusSupporter } = storeToRefs(useUserStore());
const { cachedUsers, showSendBoopDialog } = useUserStore();
const { showFavoriteDialog } = useFavoriteStore();
import { showAvatarDialog, showAvatarAuthorDialog } from '../../../coordinators/avatarCoordinator';
import { showUserDialog, refreshUserDialogAvatars } from '../../../coordinators/userCoordinator';
import { getFriendRequest, handleFriendDelete } from '../../../coordinators/friendRelationshipCoordinator';
import { showAvatarDialog, showAvatarAuthorDialog } from '../../../coordinators/avatarCoordinator';
import { showUserDialog, refreshUserDialogAvatars } from '../../../coordinators/userCoordinator';
import { getFriendRequest, handleFriendDelete } from '../../../coordinators/friendRelationshipCoordinator';
const { showModerateGroupDialog } = useGroupStore();
const { inviteGroupDialog } = storeToRefs(useGroupStore());

1
src/components/dialogs/UserDialog/UserDialogFavoriteWorldsTab.vue
View File

@@ -85,7 +85,6 @@
const { userDialog, currentUser } = storeToRefs(useUserStore());
const { favoriteLimits } = storeToRefs(useFavoriteStore());
const favoriteWorldsTab = ref('0');
const userDialogFavoriteWorldsRequestId = ref(0);

2
src/components/dialogs/UserDialog/UserDialogMutualFriendsTab.vue
View File

@@ -73,7 +73,7 @@
import { useUserStore } from '../../../stores';
import { userDialogMutualFriendSortingOptions } from '../../../shared/constants';
import { userRequest } from '../../../api';
import { showUserDialog } from '../../../coordinators/userCoordinator';
import { showUserDialog } from '../../../coordinators/userCoordinator';
const { t } = useI18n();

2
src/components/dialogs/WorldDialog/SetWorldTagsDialog.vue
View File

@@ -134,8 +134,6 @@
const emit = defineEmits(['update:isSetWorldTagsDialogVisible']);
const { t } = useI18n();
const setWorldTagsDialog = ref({

13
src/components/dialogs/WorldDialog/useWorldDialogInfo.js
View File

@@ -9,12 +9,12 @@ import { database } from '../../../services/database';
/**
* Composable for WorldDialogInfoTab computed properties and actions.
*
* @param {import('vue').Ref} worldDialog - reactive ref to the world dialog state
* @param {Object} deps - external dependencies
* @param {object} deps - external dependencies
* @param {Function} deps.t - i18n translation function
* @param {Function} deps.toast - toast notification function
* @returns {Object} info composable API
* @param deps.sdkUnityVersion
* @returns {object} info composable API
*/
export function useWorldDialogInfo(worldDialog, { t, toast, sdkUnityVersion }) {
const memo = computed({
@@ -71,7 +71,12 @@ export function useWorldDialogInfo(worldDialog, { t, toast, sdkUnityVersion }) {
const platforms = [];
if (ref.unityPackages) {
for (const unityPackage of ref.unityPackages) {
if (!compareUnityVersion(unityPackage.unitySortNumber, sdkUnityVersion)) {
if (
!compareUnityVersion(
unityPackage.unitySortNumber,
sdkUnityVersion
)
) {
continue;
}
let platform = 'PC';

12
src/components/ui/button-group/ButtonGroup.vue
View File

@@ -1,12 +1,12 @@
<script setup>
import { cn } from '@/lib/utils';
import { cn } from '@/lib/utils';
import { buttonGroupVariants } from '.';
import { buttonGroupVariants } from '.';
const props = defineProps({
class: { type: null, required: false },
orientation: { type: null, required: false }
});
const props = defineProps({
class: { type: null, required: false },
orientation: { type: null, required: false }
});
</script>
<template>

22
src/components/ui/button-group/ButtonGroupSeparator.vue
View File

@@ -1,16 +1,16 @@
<script setup>
import { Separator } from '@/components/ui/separator';
import { cn } from '@/lib/utils';
import { reactiveOmit } from '@vueuse/core';
import { Separator } from '@/components/ui/separator';
import { cn } from '@/lib/utils';
import { reactiveOmit } from '@vueuse/core';
const props = defineProps({
orientation: { type: String, required: false, default: 'vertical' },
decorative: { type: Boolean, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const delegatedProps = reactiveOmit(props, 'class');
const props = defineProps({
orientation: { type: String, required: false, default: 'vertical' },
decorative: { type: Boolean, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const delegatedProps = reactiveOmit(props, 'class');
</script>
<template>

16
src/components/ui/button-group/ButtonGroupText.vue
View File

@@ -1,13 +1,13 @@
<script setup>
import { Primitive } from 'reka-ui';
import { cn } from '@/lib/utils';
import { Primitive } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
class: { type: null, required: false },
orientation: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false, default: 'div' }
});
const props = defineProps({
class: { type: null, required: false },
orientation: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false, default: 'div' }
});
</script>
<template>

14
src/components/ui/card/index.js
View File

@@ -1,7 +1,7 @@
export { default as Card } from "./Card.vue";
export { default as CardAction } from "./CardAction.vue";
export { default as CardContent } from "./CardContent.vue";
export { default as CardDescription } from "./CardDescription.vue";
export { default as CardFooter } from "./CardFooter.vue";
export { default as CardHeader } from "./CardHeader.vue";
export { default as CardTitle } from "./CardTitle.vue";
export { default as Card } from './Card.vue';
export { default as CardAction } from './CardAction.vue';
export { default as CardContent } from './CardContent.vue';
export { default as CardDescription } from './CardDescription.vue';
export { default as CardFooter } from './CardFooter.vue';
export { default as CardHeader } from './CardHeader.vue';
export { default as CardTitle } from './CardTitle.vue';

6
src/components/ui/collapsible/index.js
View File

@@ -1,3 +1,3 @@
export { default as Collapsible } from "./Collapsible.vue";
export { default as CollapsibleContent } from "./CollapsibleContent.vue";
export { default as CollapsibleTrigger } from "./CollapsibleTrigger.vue";
export { default as Collapsible } from './Collapsible.vue';
export { default as CollapsibleContent } from './CollapsibleContent.vue';
export { default as CollapsibleTrigger } from './CollapsibleTrigger.vue';

22
src/components/ui/context-menu/ContextMenu.vue
View File

@@ -1,18 +1,18 @@
<script setup>
import { ContextMenuRoot, useForwardPropsEmits } from "reka-ui";
import { ContextMenuRoot, useForwardPropsEmits } from 'reka-ui';
const props = defineProps({
pressOpenDelay: { type: Number, required: false },
dir: { type: String, required: false },
modal: { type: Boolean, required: false },
});
const emits = defineEmits(["update:open"]);
const props = defineProps({
pressOpenDelay: { type: Number, required: false },
dir: { type: String, required: false },
modal: { type: Boolean, required: false }
});
const emits = defineEmits(['update:open']);
const forwarded = useForwardPropsEmits(props, emits);
const forwarded = useForwardPropsEmits(props, emits);
</script>
<template>
<ContextMenuRoot data-slot="context-menu" v-bind="forwarded">
<slot />
</ContextMenuRoot>
<ContextMenuRoot data-slot="context-menu" v-bind="forwarded">
<slot />
</ContextMenuRoot>
</template>

73
src/components/ui/context-menu/ContextMenuCheckboxItem.vue
View File

@@ -1,48 +1,41 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { Check } from "lucide-vue-next";
import {
ContextMenuCheckboxItem,
ContextMenuItemIndicator,
useForwardPropsEmits,
} from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { Check } from 'lucide-vue-next';
import { ContextMenuCheckboxItem, ContextMenuItemIndicator, useForwardPropsEmits } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
modelValue: { type: [Boolean, String], required: false },
disabled: { type: Boolean, required: false },
textValue: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const emits = defineEmits(["select", "update:modelValue"]);
const props = defineProps({
modelValue: { type: [Boolean, String], required: false },
disabled: { type: Boolean, required: false },
textValue: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const emits = defineEmits(['select', 'update:modelValue']);
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
const forwarded = useForwardPropsEmits(delegatedProps, emits);
const forwarded = useForwardPropsEmits(delegatedProps, emits);
</script>
<template>
<ContextMenuCheckboxItem
data-slot="context-menu-checkbox-item"
v-bind="forwarded"
:class="
cn(
'focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
props.class,
)
"
>
<span
class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center"
>
<ContextMenuItemIndicator>
<slot name="indicator-icon">
<Check class="size-4" />
</slot>
</ContextMenuItemIndicator>
</span>
<slot />
</ContextMenuCheckboxItem>
<ContextMenuCheckboxItem
data-slot="context-menu-checkbox-item"
v-bind="forwarded"
:class="
cn(
'focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
props.class
)
">
<span class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
<ContextMenuItemIndicator>
<slot name="indicator-icon">
<Check class="size-4" />
</slot>
</ContextMenuItemIndicator>
</span>
<slot />
</ContextMenuCheckboxItem>
</template>

101
src/components/ui/context-menu/ContextMenuContent.vue
View File

@@ -1,62 +1,57 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import {
ContextMenuContent,
ContextMenuPortal,
useForwardPropsEmits,
} from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { ContextMenuContent, ContextMenuPortal, useForwardPropsEmits } from 'reka-ui';
import { cn } from '@/lib/utils';
defineOptions({
inheritAttrs: false,
});
defineOptions({
inheritAttrs: false
});
const props = defineProps({
forceMount: { type: Boolean, required: false },
loop: { type: Boolean, required: false },
sideFlip: { type: Boolean, required: false },
alignOffset: { type: Number, required: false },
alignFlip: { type: Boolean, required: false },
avoidCollisions: { type: Boolean, required: false },
collisionBoundary: { type: null, required: false },
collisionPadding: { type: [Number, Object], required: false },
hideShiftedArrow: { type: Boolean, required: false },
sticky: { type: String, required: false },
hideWhenDetached: { type: Boolean, required: false },
positionStrategy: { type: String, required: false },
disableUpdateOnLayoutShift: { type: Boolean, required: false },
prioritizePosition: { type: Boolean, required: false },
reference: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const emits = defineEmits([
"escapeKeyDown",
"pointerDownOutside",
"focusOutside",
"interactOutside",
"closeAutoFocus",
]);
const props = defineProps({
forceMount: { type: Boolean, required: false },
loop: { type: Boolean, required: false },
sideFlip: { type: Boolean, required: false },
alignOffset: { type: Number, required: false },
alignFlip: { type: Boolean, required: false },
avoidCollisions: { type: Boolean, required: false },
collisionBoundary: { type: null, required: false },
collisionPadding: { type: [Number, Object], required: false },
hideShiftedArrow: { type: Boolean, required: false },
sticky: { type: String, required: false },
hideWhenDetached: { type: Boolean, required: false },
positionStrategy: { type: String, required: false },
disableUpdateOnLayoutShift: { type: Boolean, required: false },
prioritizePosition: { type: Boolean, required: false },
reference: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const emits = defineEmits([
'escapeKeyDown',
'pointerDownOutside',
'focusOutside',
'interactOutside',
'closeAutoFocus'
]);
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
const forwarded = useForwardPropsEmits(delegatedProps, emits);
const forwarded = useForwardPropsEmits(delegatedProps, emits);
</script>
<template>
<ContextMenuPortal>
<ContextMenuContent
data-slot="context-menu-content"
v-bind="{ ...$attrs, ...forwarded }"
:class="
cn(
'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--reka-context-menu-content-available-height) min-w-[8rem] overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md',
props.class,
)
"
>
<slot />
</ContextMenuContent>
</ContextMenuPortal>
<ContextMenuPortal>
<ContextMenuContent
data-slot="context-menu-content"
v-bind="{ ...$attrs, ...forwarded }"
:class="
cn(
'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--reka-context-menu-content-available-height) min-w-[8rem] overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md',
props.class
)
">
<slot />
</ContextMenuContent>
</ContextMenuPortal>
</template>

16
src/components/ui/context-menu/ContextMenuGroup.vue
View File

@@ -1,14 +1,14 @@
<script setup>
import { ContextMenuGroup } from "reka-ui";
import { ContextMenuGroup } from 'reka-ui';
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
});
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false }
});
</script>
<template>
<ContextMenuGroup data-slot="context-menu-group" v-bind="props">
<slot />
</ContextMenuGroup>
<ContextMenuGroup data-slot="context-menu-group" v-bind="props">
<slot />
</ContextMenuGroup>
</template>

57
src/components/ui/context-menu/ContextMenuItem.vue
View File

@@ -1,37 +1,36 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { ContextMenuItem, useForwardPropsEmits } from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { ContextMenuItem, useForwardPropsEmits } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
disabled: { type: Boolean, required: false },
textValue: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
inset: { type: Boolean, required: false },
variant: { type: String, required: false, default: "default" },
});
const emits = defineEmits(["select"]);
const props = defineProps({
disabled: { type: Boolean, required: false },
textValue: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
inset: { type: Boolean, required: false },
variant: { type: String, required: false, default: 'default' }
});
const emits = defineEmits(['select']);
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
const forwarded = useForwardPropsEmits(delegatedProps, emits);
const forwarded = useForwardPropsEmits(delegatedProps, emits);
</script>
<template>
<ContextMenuItem
data-slot="context-menu-item"
:data-inset="inset ? '' : undefined"
:data-variant="variant"
v-bind="forwarded"
:class="
cn(
'focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive-foreground data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/40 data-[variant=destructive]:focus:text-destructive-foreground data-[variant=destructive]:*:[svg]:!text-destructive-foreground [&_svg:not([class*=\'text-\'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
props.class,
)
"
>
<slot />
</ContextMenuItem>
<ContextMenuItem
data-slot="context-menu-item"
:data-inset="inset ? '' : undefined"
:data-variant="variant"
v-bind="forwarded"
:class="
cn(
'focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive-foreground data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/40 data-[variant=destructive]:focus:text-destructive-foreground data-[variant=destructive]:*:[svg]:!text-destructive-foreground [&_svg:not([class*=\'text-\'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
props.class
)
">
<slot />
</ContextMenuItem>
</template>

40
src/components/ui/context-menu/ContextMenuLabel.vue
View File

@@ -1,30 +1,24 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { ContextMenuLabel } from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { ContextMenuLabel } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
inset: { type: Boolean, required: false },
});
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
inset: { type: Boolean, required: false }
});
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
</script>
<template>
<ContextMenuLabel
data-slot="context-menu-label"
:data-inset="inset ? '' : undefined"
v-bind="delegatedProps"
:class="
cn(
'text-foreground px-2 py-1.5 text-sm font-medium data-[inset]:pl-8',
props.class,
)
"
>
<slot />
</ContextMenuLabel>
<ContextMenuLabel
data-slot="context-menu-label"
:data-inset="inset ? '' : undefined"
v-bind="delegatedProps"
:class="cn('text-foreground px-2 py-1.5 text-sm font-medium data-[inset]:pl-8', props.class)">
<slot />
</ContextMenuLabel>
</template>

20
src/components/ui/context-menu/ContextMenuPortal.vue
View File

@@ -1,16 +1,16 @@
<script setup>
import { ContextMenuPortal } from "reka-ui";
import { ContextMenuPortal } from 'reka-ui';
const props = defineProps({
to: { type: null, required: false },
disabled: { type: Boolean, required: false },
defer: { type: Boolean, required: false },
forceMount: { type: Boolean, required: false },
});
const props = defineProps({
to: { type: null, required: false },
disabled: { type: Boolean, required: false },
defer: { type: Boolean, required: false },
forceMount: { type: Boolean, required: false }
});
</script>
<template>
<ContextMenuPortal data-slot="context-menu-portal" v-bind="props">
<slot />
</ContextMenuPortal>
<ContextMenuPortal data-slot="context-menu-portal" v-bind="props">
<slot />
</ContextMenuPortal>
</template>

25
src/components/ui/context-menu/ContextMenuRadioGroup.vue
View File

@@ -1,21 +1,18 @@
<script setup>
import { ContextMenuRadioGroup, useForwardPropsEmits } from "reka-ui";
import { ContextMenuRadioGroup, useForwardPropsEmits } from 'reka-ui';
const props = defineProps({
modelValue: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
});
const emits = defineEmits(["update:modelValue"]);
const props = defineProps({
modelValue: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false }
});
const emits = defineEmits(['update:modelValue']);
const forwarded = useForwardPropsEmits(props, emits);
const forwarded = useForwardPropsEmits(props, emits);
</script>
<template>
<ContextMenuRadioGroup
data-slot="context-menu-radio-group"
v-bind="forwarded"
>
<slot />
</ContextMenuRadioGroup>
<ContextMenuRadioGroup data-slot="context-menu-radio-group" v-bind="forwarded">
<slot />
</ContextMenuRadioGroup>
</template>

73
src/components/ui/context-menu/ContextMenuRadioItem.vue
View File

@@ -1,48 +1,41 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { Circle } from "lucide-vue-next";
import {
ContextMenuItemIndicator,
ContextMenuRadioItem,
useForwardPropsEmits,
} from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { Circle } from 'lucide-vue-next';
import { ContextMenuItemIndicator, ContextMenuRadioItem, useForwardPropsEmits } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
value: { type: null, required: true },
disabled: { type: Boolean, required: false },
textValue: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const emits = defineEmits(["select"]);
const props = defineProps({
value: { type: null, required: true },
disabled: { type: Boolean, required: false },
textValue: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const emits = defineEmits(['select']);
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
const forwarded = useForwardPropsEmits(delegatedProps, emits);
const forwarded = useForwardPropsEmits(delegatedProps, emits);
</script>
<template>
<ContextMenuRadioItem
data-slot="context-menu-radio-item"
v-bind="forwarded"
:class="
cn(
'focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
props.class,
)
"
>
<span
class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center"
>
<ContextMenuItemIndicator>
<slot name="indicator-icon">
<Circle class="size-2 fill-current" />
</slot>
</ContextMenuItemIndicator>
</span>
<slot />
</ContextMenuRadioItem>
<ContextMenuRadioItem
data-slot="context-menu-radio-item"
v-bind="forwarded"
:class="
cn(
'focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
props.class
)
">
<span class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
<ContextMenuItemIndicator>
<slot name="indicator-icon">
<Circle class="size-2 fill-current" />
</slot>
</ContextMenuItemIndicator>
</span>
<slot />
</ContextMenuRadioItem>
</template>

27
src/components/ui/context-menu/ContextMenuSeparator.vue
View File

@@ -1,21 +1,20 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { ContextMenuSeparator } from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { ContextMenuSeparator } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
</script>
<template>
<ContextMenuSeparator
data-slot="context-menu-separator"
v-bind="delegatedProps"
:class="cn('bg-border -mx-1 my-1 h-px', props.class)"
/>
<ContextMenuSeparator
data-slot="context-menu-separator"
v-bind="delegatedProps"
:class="cn('bg-border -mx-1 my-1 h-px', props.class)" />
</template>

21
src/components/ui/context-menu/ContextMenuShortcut.vue
View File

@@ -1,18 +1,15 @@
<script setup>
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
const props = defineProps({
class: { type: null, required: false },
});
const props = defineProps({
class: { type: null, required: false }
});
</script>
<template>
<span
data-slot="context-menu-shortcut"
:class="
cn('text-muted-foreground ml-auto text-xs tracking-widest', props.class)
"
>
<slot />
</span>
<span
data-slot="context-menu-shortcut"
:class="cn('text-muted-foreground ml-auto text-xs tracking-widest', props.class)">
<slot />
</span>
</template>

20
src/components/ui/context-menu/ContextMenuSub.vue
View File

@@ -1,17 +1,17 @@
<script setup>
import { ContextMenuSub, useForwardPropsEmits } from "reka-ui";
import { ContextMenuSub, useForwardPropsEmits } from 'reka-ui';
const props = defineProps({
defaultOpen: { type: Boolean, required: false },
open: { type: Boolean, required: false },
});
const emits = defineEmits(["update:open"]);
const props = defineProps({
defaultOpen: { type: Boolean, required: false },
open: { type: Boolean, required: false }
});
const emits = defineEmits(['update:open']);
const forwarded = useForwardPropsEmits(props, emits);
const forwarded = useForwardPropsEmits(props, emits);
</script>
<template>
<ContextMenuSub data-slot="context-menu-sub" v-bind="forwarded">
<slot />
</ContextMenuSub>
<ContextMenuSub data-slot="context-menu-sub" v-bind="forwarded">
<slot />
</ContextMenuSub>
</template>

97
src/components/ui/context-menu/ContextMenuSubContent.vue
View File

@@ -1,57 +1,56 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { ContextMenuSubContent, useForwardPropsEmits } from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { ContextMenuSubContent, useForwardPropsEmits } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
forceMount: { type: Boolean, required: false },
loop: { type: Boolean, required: false },
sideOffset: { type: Number, required: false },
sideFlip: { type: Boolean, required: false },
alignOffset: { type: Number, required: false },
alignFlip: { type: Boolean, required: false },
avoidCollisions: { type: Boolean, required: false },
collisionBoundary: { type: null, required: false },
collisionPadding: { type: [Number, Object], required: false },
arrowPadding: { type: Number, required: false },
hideShiftedArrow: { type: Boolean, required: false },
sticky: { type: String, required: false },
hideWhenDetached: { type: Boolean, required: false },
positionStrategy: { type: String, required: false },
updatePositionStrategy: { type: String, required: false },
disableUpdateOnLayoutShift: { type: Boolean, required: false },
prioritizePosition: { type: Boolean, required: false },
reference: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const emits = defineEmits([
"escapeKeyDown",
"pointerDownOutside",
"focusOutside",
"interactOutside",
"entryFocus",
"openAutoFocus",
"closeAutoFocus",
]);
const props = defineProps({
forceMount: { type: Boolean, required: false },
loop: { type: Boolean, required: false },
sideOffset: { type: Number, required: false },
sideFlip: { type: Boolean, required: false },
alignOffset: { type: Number, required: false },
alignFlip: { type: Boolean, required: false },
avoidCollisions: { type: Boolean, required: false },
collisionBoundary: { type: null, required: false },
collisionPadding: { type: [Number, Object], required: false },
arrowPadding: { type: Number, required: false },
hideShiftedArrow: { type: Boolean, required: false },
sticky: { type: String, required: false },
hideWhenDetached: { type: Boolean, required: false },
positionStrategy: { type: String, required: false },
updatePositionStrategy: { type: String, required: false },
disableUpdateOnLayoutShift: { type: Boolean, required: false },
prioritizePosition: { type: Boolean, required: false },
reference: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const emits = defineEmits([
'escapeKeyDown',
'pointerDownOutside',
'focusOutside',
'interactOutside',
'entryFocus',
'openAutoFocus',
'closeAutoFocus'
]);
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
const forwarded = useForwardPropsEmits(delegatedProps, emits);
const forwarded = useForwardPropsEmits(delegatedProps, emits);
</script>
<template>
<ContextMenuSubContent
data-slot="context-menu-sub-content"
v-bind="forwarded"
:class="
cn(
'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--reka-context-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg',
props.class,
)
"
>
<slot />
</ContextMenuSubContent>
<ContextMenuSubContent
data-slot="context-menu-sub-content"
v-bind="forwarded"
:class="
cn(
'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--reka-context-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg',
props.class
)
">
<slot />
</ContextMenuSubContent>
</template>

55
src/components/ui/context-menu/ContextMenuSubTrigger.vue
View File

@@ -1,36 +1,35 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { ChevronRight } from "lucide-vue-next";
import { ContextMenuSubTrigger, useForwardProps } from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { ChevronRight } from 'lucide-vue-next';
import { ContextMenuSubTrigger, useForwardProps } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
disabled: { type: Boolean, required: false },
textValue: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
inset: { type: Boolean, required: false },
});
const props = defineProps({
disabled: { type: Boolean, required: false },
textValue: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
inset: { type: Boolean, required: false }
});
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
const forwardedProps = useForwardProps(delegatedProps);
const forwardedProps = useForwardProps(delegatedProps);
</script>
<template>
<ContextMenuSubTrigger
data-slot="context-menu-sub-trigger"
:data-inset="inset ? '' : undefined"
v-bind="forwardedProps"
:class="
cn(
'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
props.class,
)
"
>
<slot />
<ChevronRight class="ml-auto" />
</ContextMenuSubTrigger>
<ContextMenuSubTrigger
data-slot="context-menu-sub-trigger"
:data-inset="inset ? '' : undefined"
v-bind="forwardedProps"
:class="
cn(
'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
props.class
)
">
<slot />
<ChevronRight class="ml-auto" />
</ContextMenuSubTrigger>
</template>

20
src/components/ui/context-menu/ContextMenuTrigger.vue
View File

@@ -1,17 +1,17 @@
<script setup>
import { ContextMenuTrigger, useForwardProps } from "reka-ui";
import { ContextMenuTrigger, useForwardProps } from 'reka-ui';
const props = defineProps({
disabled: { type: Boolean, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
});
const props = defineProps({
disabled: { type: Boolean, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false }
});
const forwardedProps = useForwardProps(props);
const forwardedProps = useForwardProps(props);
</script>
<template>
<ContextMenuTrigger data-slot="context-menu-trigger" v-bind="forwardedProps">
<slot />
</ContextMenuTrigger>
<ContextMenuTrigger data-slot="context-menu-trigger" v-bind="forwardedProps">
<slot />
</ContextMenuTrigger>
</template>

28
src/components/ui/context-menu/index.js
View File

@@ -1,14 +1,14 @@
export { default as ContextMenu } from "./ContextMenu.vue";
export { default as ContextMenuCheckboxItem } from "./ContextMenuCheckboxItem.vue";
export { default as ContextMenuContent } from "./ContextMenuContent.vue";
export { default as ContextMenuGroup } from "./ContextMenuGroup.vue";
export { default as ContextMenuItem } from "./ContextMenuItem.vue";
export { default as ContextMenuLabel } from "./ContextMenuLabel.vue";
export { default as ContextMenuRadioGroup } from "./ContextMenuRadioGroup.vue";
export { default as ContextMenuRadioItem } from "./ContextMenuRadioItem.vue";
export { default as ContextMenuSeparator } from "./ContextMenuSeparator.vue";
export { default as ContextMenuShortcut } from "./ContextMenuShortcut.vue";
export { default as ContextMenuSub } from "./ContextMenuSub.vue";
export { default as ContextMenuSubContent } from "./ContextMenuSubContent.vue";
export { default as ContextMenuSubTrigger } from "./ContextMenuSubTrigger.vue";
export { default as ContextMenuTrigger } from "./ContextMenuTrigger.vue";
export { default as ContextMenu } from './ContextMenu.vue';
export { default as ContextMenuCheckboxItem } from './ContextMenuCheckboxItem.vue';
export { default as ContextMenuContent } from './ContextMenuContent.vue';
export { default as ContextMenuGroup } from './ContextMenuGroup.vue';
export { default as ContextMenuItem } from './ContextMenuItem.vue';
export { default as ContextMenuLabel } from './ContextMenuLabel.vue';
export { default as ContextMenuRadioGroup } from './ContextMenuRadioGroup.vue';
export { default as ContextMenuRadioItem } from './ContextMenuRadioItem.vue';
export { default as ContextMenuSeparator } from './ContextMenuSeparator.vue';
export { default as ContextMenuShortcut } from './ContextMenuShortcut.vue';
export { default as ContextMenuSub } from './ContextMenuSub.vue';
export { default as ContextMenuSubContent } from './ContextMenuSubContent.vue';
export { default as ContextMenuSubTrigger } from './ContextMenuSubTrigger.vue';
export { default as ContextMenuTrigger } from './ContextMenuTrigger.vue';

2
src/components/ui/input/index.js
View File

@@ -1 +1 @@
export { default as Input } from "./Input.vue";
export { default as Input } from './Input.vue';

31
src/components/ui/item/Item.vue
View File

@@ -1,24 +1,19 @@
<script setup>
import { Primitive } from "reka-ui";
import { cn } from "@/lib/utils";
import { itemVariants } from ".";
import { Primitive } from 'reka-ui';
import { cn } from '@/lib/utils';
import { itemVariants } from '.';
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false, default: "div" },
class: { type: null, required: false },
variant: { type: null, required: false },
size: { type: null, required: false },
});
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false, default: 'div' },
class: { type: null, required: false },
variant: { type: null, required: false },
size: { type: null, required: false }
});
</script>
<template>
<Primitive
data-slot="item"
:as="as"
:as-child="asChild"
:class="cn(itemVariants({ variant, size }), props.class)"
>
<slot />
</Primitive>
<Primitive data-slot="item" :as="as" :as-child="asChild" :class="cn(itemVariants({ variant, size }), props.class)">
<slot />
</Primitive>
</template>

17
src/components/ui/item/ItemActions.vue
View File

@@ -1,16 +1,13 @@
<script setup>
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
const props = defineProps({
class: { type: null, required: false },
});
const props = defineProps({
class: { type: null, required: false }
});
</script>
<template>
<div
data-slot="item-actions"
:class="cn('flex items-center gap-2', props.class)"
>
<slot />
</div>
<div data-slot="item-actions" :class="cn('flex items-center gap-2', props.class)">
<slot />
</div>
</template>

24
src/components/ui/item/ItemContent.vue
View File

@@ -1,21 +1,15 @@
<script setup>
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
const props = defineProps({
class: { type: null, required: false },
});
const props = defineProps({
class: { type: null, required: false }
});
</script>
<template>
<div
data-slot="item-content"
:class="
cn(
'flex flex-1 flex-col gap-1 [&+[data-slot=item-content]]:flex-none',
props.class,
)
"
>
<slot />
</div>
<div
data-slot="item-content"
:class="cn('flex flex-1 flex-col gap-1 [&+[data-slot=item-content]]:flex-none', props.class)">
<slot />
</div>
</template>

31
src/components/ui/item/ItemDescription.vue
View File

@@ -1,22 +1,21 @@
<script setup>
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
const props = defineProps({
class: { type: null, required: false },
});
const props = defineProps({
class: { type: null, required: false }
});
</script>
<template>
<p
data-slot="item-description"
:class="
cn(
'text-muted-foreground line-clamp-2 text-sm leading-normal font-normal text-balance',
'[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',
props.class,
)
"
>
<slot />
</p>
<p
data-slot="item-description"
:class="
cn(
'text-muted-foreground line-clamp-2 text-sm leading-normal font-normal text-balance',
'[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',
props.class
)
">
<slot />
</p>
</template>

19
src/components/ui/item/ItemFooter.vue
View File

@@ -1,18 +1,13 @@
<script setup>
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
const props = defineProps({
class: { type: null, required: false },
});
const props = defineProps({
class: { type: null, required: false }
});
</script>
<template>
<div
data-slot="item-footer"
:class="
cn('flex basis-full items-center justify-between gap-2', props.class)
"
>
<slot />
</div>
<div data-slot="item-footer" :class="cn('flex basis-full items-center justify-between gap-2', props.class)">
<slot />
</div>
</template>

18
src/components/ui/item/ItemGroup.vue
View File

@@ -1,17 +1,13 @@
<script setup>
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
const props = defineProps({
class: { type: null, required: false },
});
const props = defineProps({
class: { type: null, required: false }
});
</script>
<template>
<div
role="list"
data-slot="item-group"
:class="cn('group/item-group flex flex-col', props.class)"
>
<slot />
</div>
<div role="list" data-slot="item-group" :class="cn('group/item-group flex flex-col', props.class)">
<slot />
</div>
</template>

19
src/components/ui/item/ItemHeader.vue
View File

@@ -1,18 +1,13 @@
<script setup>
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
const props = defineProps({
class: { type: null, required: false },
});
const props = defineProps({
class: { type: null, required: false }
});
</script>
<template>
<div
data-slot="item-header"
:class="
cn('flex basis-full items-center justify-between gap-2', props.class)
"
>
<slot />
</div>
<div data-slot="item-header" :class="cn('flex basis-full items-center justify-between gap-2', props.class)">
<slot />
</div>
</template>

22
src/components/ui/item/ItemMedia.vue
View File

@@ -1,19 +1,15 @@
<script setup>
import { cn } from "@/lib/utils";
import { itemMediaVariants } from ".";
import { cn } from '@/lib/utils';
import { itemMediaVariants } from '.';
const props = defineProps({
class: { type: null, required: false },
variant: { type: null, required: false },
});
const props = defineProps({
class: { type: null, required: false },
variant: { type: null, required: false }
});
</script>
<template>
<div
data-slot="item-media"
:data-variant="props.variant"
:class="cn(itemMediaVariants({ variant }), props.class)"
>
<slot />
</div>
<div data-slot="item-media" :data-variant="props.variant" :class="cn(itemMediaVariants({ variant }), props.class)">
<slot />
</div>
</template>

24
src/components/ui/item/ItemSeparator.vue
View File

@@ -1,20 +1,16 @@
<script setup>
import { cn } from "@/lib/utils";
import { Separator } from '@/components/ui/separator';
import { cn } from '@/lib/utils';
import { Separator } from '@/components/ui/separator';
const props = defineProps({
orientation: { type: String, required: false },
decorative: { type: Boolean, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const props = defineProps({
orientation: { type: String, required: false },
decorative: { type: Boolean, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
</script>
<template>
<Separator
data-slot="item-separator"
orientation="horizontal"
:class="cn('my-0', props.class)"
/>
<Separator data-slot="item-separator" orientation="horizontal" :class="cn('my-0', props.class)" />
</template>

24
src/components/ui/item/ItemTitle.vue
View File

@@ -1,21 +1,15 @@
<script setup>
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
const props = defineProps({
class: { type: null, required: false },
});
const props = defineProps({
class: { type: null, required: false }
});
</script>
<template>
<div
data-slot="item-title"
:class="
cn(
'flex w-fit items-center gap-2 text-sm leading-snug font-medium',
props.class,
)
"
>
<slot />
</div>
<div
data-slot="item-title"
:class="cn('flex w-fit items-center gap-2 text-sm leading-snug font-medium', props.class)">
<slot />
</div>
</template>

85
src/components/ui/item/index.js
View File

@@ -1,50 +1,49 @@
import { cva } from "class-variance-authority";
import { cva } from 'class-variance-authority';
export { default as Item } from "./Item.vue";
export { default as ItemActions } from "./ItemActions.vue";
export { default as ItemContent } from "./ItemContent.vue";
export { default as ItemDescription } from "./ItemDescription.vue";
export { default as ItemFooter } from "./ItemFooter.vue";
export { default as ItemGroup } from "./ItemGroup.vue";
export { default as ItemHeader } from "./ItemHeader.vue";
export { default as ItemMedia } from "./ItemMedia.vue";
export { default as ItemSeparator } from "./ItemSeparator.vue";
export { default as ItemTitle } from "./ItemTitle.vue";
export { default as Item } from './Item.vue';
export { default as ItemActions } from './ItemActions.vue';
export { default as ItemContent } from './ItemContent.vue';
export { default as ItemDescription } from './ItemDescription.vue';
export { default as ItemFooter } from './ItemFooter.vue';
export { default as ItemGroup } from './ItemGroup.vue';
export { default as ItemHeader } from './ItemHeader.vue';
export { default as ItemMedia } from './ItemMedia.vue';
export { default as ItemSeparator } from './ItemSeparator.vue';
export { default as ItemTitle } from './ItemTitle.vue';
export const itemVariants = cva(
"group/item flex items-center border border-transparent text-sm rounded-md transition-colors [a]:hover:bg-accent/50 [a]:transition-colors duration-100 flex-wrap outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
{
variants: {
variant: {
default: "bg-transparent",
outline: "border-border",
muted: "bg-muted/50",
},
size: {
default: "p-4 gap-4 ",
sm: "py-3 px-4 gap-2.5",
},
},
defaultVariants: {
variant: "default",
size: "default",
},
},
'group/item flex items-center border border-transparent text-sm rounded-md transition-colors [a]:hover:bg-accent/50 [a]:transition-colors duration-100 flex-wrap outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',
{
variants: {
variant: {
default: 'bg-transparent',
outline: 'border-border',
muted: 'bg-muted/50'
},
size: {
default: 'p-4 gap-4 ',
sm: 'py-3 px-4 gap-2.5'
}
},
defaultVariants: {
variant: 'default',
size: 'default'
}
}
);
export const itemMediaVariants = cva(
"flex shrink-0 items-center justify-center gap-2 group-has-[[data-slot=item-description]]/item:self-start [&_svg]:pointer-events-none group-has-[[data-slot=item-description]]/item:translate-y-0.5",
{
variants: {
variant: {
default: "bg-transparent",
icon: "size-8 border rounded-sm bg-muted [&_svg:not([class*='size-'])]:size-4",
image:
"size-10 rounded-sm overflow-hidden [&_img]:size-full [&_img]:object-cover",
},
},
defaultVariants: {
variant: "default",
},
},
'flex shrink-0 items-center justify-center gap-2 group-has-[[data-slot=item-description]]/item:self-start [&_svg]:pointer-events-none group-has-[[data-slot=item-description]]/item:translate-y-0.5',
{
variants: {
variant: {
default: 'bg-transparent',
icon: "size-8 border rounded-sm bg-muted [&_svg:not([class*='size-'])]:size-4",
image: 'size-10 rounded-sm overflow-hidden [&_img]:size-full [&_img]:object-cover'
}
},
defaultVariants: {
variant: 'default'
}
}
);

54
src/components/ui/scroll-area/ScrollBar.vue
View File

@@ -1,37 +1,31 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { ScrollAreaScrollbar, ScrollAreaThumb } from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { ScrollAreaScrollbar, ScrollAreaThumb } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
orientation: { type: String, required: false, default: "vertical" },
forceMount: { type: Boolean, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const props = defineProps({
orientation: { type: String, required: false, default: 'vertical' },
forceMount: { type: Boolean, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
</script>
<template>
<ScrollAreaScrollbar
data-slot="scroll-area-scrollbar"
v-bind="delegatedProps"
:class="
cn(
'flex touch-none p-px transition-colors select-none',
orientation === 'vertical' &&
'h-full w-2.5 border-l border-l-transparent',
orientation === 'horizontal' &&
'h-2.5 flex-col border-t border-t-transparent',
props.class,
)
"
>
<ScrollAreaThumb
data-slot="scroll-area-thumb"
class="bg-border relative flex-1 rounded-full"
/>
</ScrollAreaScrollbar>
<ScrollAreaScrollbar
data-slot="scroll-area-scrollbar"
v-bind="delegatedProps"
:class="
cn(
'flex touch-none p-px transition-colors select-none',
orientation === 'vertical' && 'h-full w-2.5 border-l border-l-transparent',
orientation === 'horizontal' && 'h-2.5 flex-col border-t border-t-transparent',
props.class
)
">
<ScrollAreaThumb data-slot="scroll-area-thumb" class="bg-border relative flex-1 rounded-full" />
</ScrollAreaScrollbar>
</template>

4
src/components/ui/scroll-area/index.js
View File

@@ -1,2 +1,2 @@
export { default as ScrollArea } from "./ScrollArea.vue";
export { default as ScrollBar } from "./ScrollBar.vue";
export { default as ScrollArea } from './ScrollArea.vue';
export { default as ScrollBar } from './ScrollBar.vue';

16
src/components/ui/select/SelectGroup.vue
View File

@@ -1,14 +1,14 @@
<script setup>
import { SelectGroup } from "reka-ui";
import { SelectGroup } from 'reka-ui';
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
});
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false }
});
</script>
<template>
<SelectGroup data-slot="select-group" v-bind="props">
<slot />
</SelectGroup>
<SelectGroup data-slot="select-group" v-bind="props">
<slot />
</SelectGroup>
</template>

74
src/components/ui/select/SelectItem.vue
View File

@@ -1,49 +1,43 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { Check } from "lucide-vue-next";
import {
SelectItem,
SelectItemIndicator,
SelectItemText,
useForwardProps,
} from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { Check } from 'lucide-vue-next';
import { SelectItem, SelectItemIndicator, SelectItemText, useForwardProps } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
value: { type: null, required: true },
disabled: { type: Boolean, required: false },
textValue: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const props = defineProps({
value: { type: null, required: true },
disabled: { type: Boolean, required: false },
textValue: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
const forwardedProps = useForwardProps(delegatedProps);
const forwardedProps = useForwardProps(delegatedProps);
</script>
<template>
<SelectItem
data-slot="select-item"
v-bind="forwardedProps"
:class="
cn(
'focus:bg-accent focus:text-accent-foreground [&_svg:not([class*=\'text-\'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2',
props.class,
)
"
>
<span class="absolute right-2 flex size-3.5 items-center justify-center">
<SelectItemIndicator>
<slot name="indicator-icon">
<Check class="size-4" />
</slot>
</SelectItemIndicator>
</span>
<SelectItem
data-slot="select-item"
v-bind="forwardedProps"
:class="
cn(
'focus:bg-accent focus:text-accent-foreground [&_svg:not([class*=\'text-\'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2',
props.class
)
">
<span class="absolute right-2 flex size-3.5 items-center justify-center">
<SelectItemIndicator>
<slot name="indicator-icon">
<Check class="size-4" />
</slot>
</SelectItemIndicator>
</span>
<SelectItemText>
<slot />
</SelectItemText>
</SelectItem>
<SelectItemText>
<slot />
</SelectItemText>
</SelectItem>
</template>

16
src/components/ui/select/SelectItemText.vue
View File

@@ -1,14 +1,14 @@
<script setup>
import { SelectItemText } from "reka-ui";
import { SelectItemText } from 'reka-ui';
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
});
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false }
});
</script>
<template>
<SelectItemText data-slot="select-item-text" v-bind="props">
<slot />
</SelectItemText>
<SelectItemText data-slot="select-item-text" v-bind="props">
<slot />
</SelectItemText>
</template>

25
src/components/ui/select/SelectLabel.vue
View File

@@ -1,20 +1,17 @@
<script setup>
import { SelectLabel } from "reka-ui";
import { cn } from "@/lib/utils";
import { SelectLabel } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
for: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const props = defineProps({
for: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
</script>
<template>
<SelectLabel
data-slot="select-label"
:class="cn('text-muted-foreground px-2 py-1.5 text-xs', props.class)"
>
<slot />
</SelectLabel>
<SelectLabel data-slot="select-label" :class="cn('text-muted-foreground px-2 py-1.5 text-xs', props.class)">
<slot />
</SelectLabel>
</template>

41
src/components/ui/select/SelectScrollDownButton.vue
View File

@@ -1,30 +1,27 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { ChevronDown } from "lucide-vue-next";
import { SelectScrollDownButton, useForwardProps } from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { ChevronDown } from 'lucide-vue-next';
import { SelectScrollDownButton, useForwardProps } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
const forwardedProps = useForwardProps(delegatedProps);
const forwardedProps = useForwardProps(delegatedProps);
</script>
<template>
<SelectScrollDownButton
data-slot="select-scroll-down-button"
v-bind="forwardedProps"
:class="
cn('flex cursor-default items-center justify-center py-1', props.class)
"
>
<slot>
<ChevronDown class="size-4" />
</slot>
</SelectScrollDownButton>
<SelectScrollDownButton
data-slot="select-scroll-down-button"
v-bind="forwardedProps"
:class="cn('flex cursor-default items-center justify-center py-1', props.class)">
<slot>
<ChevronDown class="size-4" />
</slot>
</SelectScrollDownButton>
</template>

41
src/components/ui/select/SelectScrollUpButton.vue
View File

@@ -1,30 +1,27 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { ChevronUp } from "lucide-vue-next";
import { SelectScrollUpButton, useForwardProps } from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { ChevronUp } from 'lucide-vue-next';
import { SelectScrollUpButton, useForwardProps } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
const forwardedProps = useForwardProps(delegatedProps);
const forwardedProps = useForwardProps(delegatedProps);
</script>
<template>
<SelectScrollUpButton
data-slot="select-scroll-up-button"
v-bind="forwardedProps"
:class="
cn('flex cursor-default items-center justify-center py-1', props.class)
"
>
<slot>
<ChevronUp class="size-4" />
</slot>
</SelectScrollUpButton>
<SelectScrollUpButton
data-slot="select-scroll-up-button"
v-bind="forwardedProps"
:class="cn('flex cursor-default items-center justify-center py-1', props.class)">
<slot>
<ChevronUp class="size-4" />
</slot>
</SelectScrollUpButton>
</template>

27
src/components/ui/select/SelectSeparator.vue
View File

@@ -1,21 +1,20 @@
<script setup>
import { reactiveOmit } from "@vueuse/core";
import { SelectSeparator } from "reka-ui";
import { cn } from "@/lib/utils";
import { reactiveOmit } from '@vueuse/core';
import { SelectSeparator } from 'reka-ui';
import { cn } from '@/lib/utils';
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
});
const props = defineProps({
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const delegatedProps = reactiveOmit(props, "class");
const delegatedProps = reactiveOmit(props, 'class');
</script>
<template>
<SelectSeparator
data-slot="select-separator"
v-bind="delegatedProps"
:class="cn('bg-border pointer-events-none -mx-1 my-1 h-px', props.class)"
/>
<SelectSeparator
data-slot="select-separator"
v-bind="delegatedProps"
:class="cn('bg-border pointer-events-none -mx-1 my-1 h-px', props.class)" />
</template>

28
src/components/ui/select/SelectTrigger.vue
View File

@@ -1,20 +1,20 @@
<script setup>
import { SelectIcon, SelectTrigger, useForwardProps } from 'reka-ui';
import { ChevronDown } from 'lucide-vue-next';
import { cn } from '@/lib/utils';
import { reactiveOmit } from '@vueuse/core';
import { SelectIcon, SelectTrigger, useForwardProps } from 'reka-ui';
import { ChevronDown } from 'lucide-vue-next';
import { cn } from '@/lib/utils';
import { reactiveOmit } from '@vueuse/core';
const props = defineProps({
disabled: { type: Boolean, required: false },
reference: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
size: { type: String, required: false, default: 'default' }
});
const props = defineProps({
disabled: { type: Boolean, required: false },
reference: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false },
size: { type: String, required: false, default: 'default' }
});
const delegatedProps = reactiveOmit(props, 'class', 'size');
const forwardedProps = useForwardProps(delegatedProps);
const delegatedProps = reactiveOmit(props, 'class', 'size');
const forwardedProps = useForwardProps(delegatedProps);
</script>
<template>

18
src/components/ui/select/SelectValue.vue
View File

@@ -1,15 +1,15 @@
<script setup>
import { SelectValue } from "reka-ui";
import { SelectValue } from 'reka-ui';
const props = defineProps({
placeholder: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
});
const props = defineProps({
placeholder: { type: String, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false }
});
</script>
<template>
<SelectValue data-slot="select-value" v-bind="props">
<slot />
</SelectValue>
<SelectValue data-slot="select-value" v-bind="props">
<slot />
</SelectValue>
</template>

22
src/components/ui/select/index.js
View File

@@ -1,11 +1,11 @@
export { default as Select } from "./Select.vue";
export { default as SelectContent } from "./SelectContent.vue";
export { default as SelectGroup } from "./SelectGroup.vue";
export { default as SelectItem } from "./SelectItem.vue";
export { default as SelectItemText } from "./SelectItemText.vue";
export { default as SelectLabel } from "./SelectLabel.vue";
export { default as SelectScrollDownButton } from "./SelectScrollDownButton.vue";
export { default as SelectScrollUpButton } from "./SelectScrollUpButton.vue";
export { default as SelectSeparator } from "./SelectSeparator.vue";
export { default as SelectTrigger } from "./SelectTrigger.vue";
export { default as SelectValue } from "./SelectValue.vue";
export { default as Select } from './Select.vue';
export { default as SelectContent } from './SelectContent.vue';
export { default as SelectGroup } from './SelectGroup.vue';
export { default as SelectItem } from './SelectItem.vue';
export { default as SelectItemText } from './SelectItemText.vue';
export { default as SelectLabel } from './SelectLabel.vue';
export { default as SelectScrollDownButton } from './SelectScrollDownButton.vue';
export { default as SelectScrollUpButton } from './SelectScrollUpButton.vue';
export { default as SelectSeparator } from './SelectSeparator.vue';
export { default as SelectTrigger } from './SelectTrigger.vue';
export { default as SelectValue } from './SelectValue.vue';

22
src/components/ui/separator/Separator.vue
View File

@@ -1,17 +1,17 @@
<script setup>
import { Separator } from 'reka-ui';
import { cn } from '@/lib/utils';
import { reactiveOmit } from '@vueuse/core';
import { Separator } from 'reka-ui';
import { cn } from '@/lib/utils';
import { reactiveOmit } from '@vueuse/core';
const props = defineProps({
orientation: { type: String, required: false, default: 'horizontal' },
decorative: { type: Boolean, required: false, default: true },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const props = defineProps({
orientation: { type: String, required: false, default: 'horizontal' },
decorative: { type: Boolean, required: false, default: true },
asChild: { type: Boolean, required: false },
as: { type: null, required: false },
class: { type: null, required: false }
});
const delegatedProps = reactiveOmit(props, 'class');
const delegatedProps = reactiveOmit(props, 'class');
</script>
<template>

2
src/components/ui/spinner/index.js
View File

@@ -1 +1 @@
export { default as Spinner } from "./Spinner.vue";
export { default as Spinner } from './Spinner.vue';

24
src/components/ui/tooltip/Tooltip.vue
View File

@@ -1,18 +1,18 @@
<script setup>
import { TooltipRoot, useForwardPropsEmits } from 'reka-ui';
import { TooltipRoot, useForwardPropsEmits } from 'reka-ui';
const props = defineProps({
defaultOpen: { type: Boolean, required: false },
open: { type: Boolean, required: false },
delayDuration: { type: Number, required: false },
disableHoverableContent: { type: Boolean, required: false },
disableClosingTrigger: { type: Boolean, required: false },
disabled: { type: Boolean, required: false },
ignoreNonKeyboardFocus: { type: Boolean, required: false }
});
const emits = defineEmits(['update:open']);
const props = defineProps({
defaultOpen: { type: Boolean, required: false },
open: { type: Boolean, required: false },
delayDuration: { type: Number, required: false },
disableHoverableContent: { type: Boolean, required: false },
disableClosingTrigger: { type: Boolean, required: false },
disabled: { type: Boolean, required: false },
ignoreNonKeyboardFocus: { type: Boolean, required: false }
});
const emits = defineEmits(['update:open']);
const forwarded = useForwardPropsEmits(props, emits);
const forwarded = useForwardPropsEmits(props, emits);
</script>
<template>

12
src/components/ui/tooltip/TooltipTrigger.vue
View File

@@ -1,11 +1,11 @@
<script setup>
import { TooltipTrigger } from 'reka-ui';
import { TooltipTrigger } from 'reka-ui';
const props = defineProps({
reference: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false }
});
const props = defineProps({
reference: { type: null, required: false },
asChild: { type: Boolean, required: false },
as: { type: null, required: false }
});
</script>
<template>