Initial Commit

app/components/ui/pagination/PaginationLast.vue

@@ -0,0 +1,34 @@
+<script setup lang="ts">
+import type { PaginationLastProps } from 'reka-ui'
+
+import type { HTMLAttributes } from 'vue'
+import type { ButtonVariants } from '@/components/ui/button'
+import { reactiveOmit } from '@vueuse/core'
+import { PaginationLast, useForwardProps } from 'reka-ui'
+import { cn } from '@/lib/utils'
+import { buttonVariants } from '@/components/ui/button'
+
+const props = withDefaults(defineProps<PaginationLastProps & {
+  size?: ButtonVariants['size']
+  class?: HTMLAttributes['class']
+}>(), {
+  size: 'default',
+})
+
+const delegatedProps = reactiveOmit(props, 'class', 'size')
+const forwarded = useForwardProps(delegatedProps)
+</script>
+
+<template>
+  <PaginationLast
+    data-slot="pagination-last"
+    aria-label="Letzte Seite"
+    :class="cn(buttonVariants({ variant: 'ghost', size }), '', props.class)"
+    v-bind="forwarded"
+  >
+    <slot>
+      <span class="hidden sm:block">Letzte</span>
+      <Icon name="ph:caret-double-right-fill" data-icon="inline-end" />
+    </slot>
+  </PaginationLast>
+</template>