mirror of
https://github.com/LukeHagar/better-auth.git
synced 2025-12-10 12:27:44 +00:00
32 lines
878 B
Vue
32 lines
878 B
Vue
<script setup lang="ts">
|
|
import { ArrowRightIcon } from "@radix-icons/vue";
|
|
import { useCarousel } from "./useCarousel";
|
|
import type { WithClassAsProps } from "./interface";
|
|
import { cn } from "@/lib/utils";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
const props = defineProps<WithClassAsProps>();
|
|
|
|
const { orientation, canScrollNext, scrollNext } = useCarousel();
|
|
</script>
|
|
|
|
<template>
|
|
<Button
|
|
:disabled="!canScrollNext"
|
|
:class="cn(
|
|
'touch-manipulation absolute h-8 w-8 rounded-full p-0',
|
|
orientation === 'horizontal'
|
|
? '-right-12 top-1/2 -translate-y-1/2'
|
|
: '-bottom-12 left-1/2 -translate-x-1/2 rotate-90',
|
|
props.class,
|
|
)"
|
|
variant="outline"
|
|
@click="scrollNext"
|
|
>
|
|
<slot>
|
|
<ArrowRightIcon class="h-4 w-4 text-current" />
|
|
<span class="sr-only">Next Slide</span>
|
|
</slot>
|
|
</Button>
|
|
</template>
|