gvf3n4ygn-test
Version:
CLI for SIGMA-UI components.
32 lines • 4.93 kB
JSON
{
"name": "pagination",
"dependencies": [],
"registryDependencies": [],
"files": [
{
"name": "PaginationEllipsis.vue",
"content": "<script setup lang=\"ts\">\nimport { PaginationEllipsis, type PaginationEllipsisProps } from 'radix-vue';\nimport { MoreHorizontalIcon } from 'lucide-vue-next';\n\nconst props = defineProps<PaginationEllipsisProps>();\n</script>\n\n<template>\n <PaginationEllipsis\n v-bind=\"props\"\n class=\"sigma-ui-pagination-ellipsis\"\n >\n <slot>\n <MoreHorizontalIcon class=\"sigma-ui-pagination-ellipsis__icon\" />\n </slot>\n </PaginationEllipsis>\n</template>\n\n<style>\n.sigma-ui-pagination-ellipsis {\n width: 2.25rem;\n height: 2.25rem;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.sigma-ui-pagination-ellipsis__icon {\n height: 1rem;\n width: 1rem;\n}\n</style>\n"
},
{
"name": "PaginationFirst.vue",
"content": "<script setup lang=\"ts\">\nimport { PaginationFirst, type PaginationFirstProps } from 'radix-vue';\nimport { ChevronsLeftIcon } from 'lucide-vue-next';\nimport { Button } from '@ui/registry/css/ui/button';\n\nconst props = withDefaults(defineProps<PaginationFirstProps>(), {\n asChild: true,\n});\n</script>\n\n<template>\n <PaginationFirst v-bind=\"props\">\n <Button\n class=\"sigma-ui-pagination-first\"\n :class=\"$attrs.class\"\n variant=\"outline\"\n >\n <slot>\n <ChevronsLeftIcon class=\"sigma-ui-pagination-first__icon\" />\n </slot>\n </Button>\n </PaginationFirst>\n</template>\n\n<style>\n.sigma-ui-pagination-first {\n width: 2.5rem;\n height: 2.5rem;\n padding: 0;\n}\n\n.sigma-ui-pagination-first__icon {\n height: 1rem;\n width: 1rem;\n}\n</style>\n"
},
{
"name": "PaginationLast.vue",
"content": "<script setup lang=\"ts\">\nimport { PaginationLast, type PaginationLastProps } from 'radix-vue';\nimport { ChevronsRightIcon } from 'lucide-vue-next';\nimport { Button } from '@ui/registry/css/ui/button';\n\nconst props = withDefaults(defineProps<PaginationLastProps>(), {\n asChild: true,\n});\n</script>\n\n<template>\n <PaginationLast v-bind=\"props\">\n <Button\n class=\"sigma-ui-pagination-last\"\n :class=\"$attrs.class\"\n variant=\"outline\"\n >\n <slot>\n <ChevronsRightIcon class=\"sigma-ui-pagination-last__icon\" />\n </slot>\n </Button>\n </PaginationLast>\n</template>\n\n<style>\n.sigma-ui-pagination-last {\n width: 2.5rem;\n height: 2.5rem;\n padding: 0;\n}\n\n.sigma-ui-pagination-last__icon {\n height: 1rem;\n width: 1rem;\n}\n</style>\n"
},
{
"name": "PaginationNext.vue",
"content": "<script setup lang=\"ts\">\nimport { PaginationNext, type PaginationNextProps } from 'radix-vue';\nimport { ChevronRightIcon } from 'lucide-vue-next';\nimport { Button } from '@ui/registry/css/ui/button';\n\nconst props = withDefaults(defineProps<PaginationNextProps>(), {\n asChild: true,\n});\n</script>\n\n<template>\n <PaginationNext v-bind=\"props\">\n <Button\n class=\"sigma-ui-pagination-next\"\n :class=\"$attrs.class\"\n variant=\"outline\"\n >\n <slot>\n <ChevronRightIcon class=\"sigma-ui-pagination-next__icon\" />\n </slot>\n </Button>\n </PaginationNext>\n</template>\n\n<style>\n.sigma-ui-pagination-next {\n width: 2.5rem;\n height: 2.5rem;\n padding: 0;\n}\n\n.sigma-ui-pagination-next__icon {\n height: 1rem;\n width: 1rem;\n}\n</style>\n"
},
{
"name": "PaginationPrev.vue",
"content": "<script setup lang=\"ts\">\nimport { PaginationPrev, type PaginationPrevProps } from 'radix-vue';\nimport { ChevronLeftIcon } from 'lucide-vue-next';\nimport { Button } from '@ui/registry/css/ui/button';\n\nconst props = withDefaults(defineProps<PaginationPrevProps>(), {\n asChild: true,\n});\n</script>\n\n<template>\n <PaginationPrev v-bind=\"props\">\n <Button\n class=\"sigma-ui-pagination-prev\"\n :class=\"$attrs.class\"\n variant=\"outline\"\n >\n <slot>\n <ChevronLeftIcon class=\"sigma-ui-pagination-prev__icon\" />\n </slot>\n </Button>\n </PaginationPrev>\n</template>\n\n<style>\n.sigma-ui-pagination-prev {\n width: 2.5rem;\n height: 2.5rem;\n padding: 0;\n}\n\n.sigma-ui-pagination-prev__icon {\n height: 1rem;\n width: 1rem;\n}\n</style>\n"
},
{
"name": "index.ts",
"content": "export {\n PaginationRoot as Pagination,\n PaginationList,\n PaginationListItem,\n} from 'radix-vue';\nexport { default as PaginationEllipsis } from './PaginationEllipsis.vue';\nexport { default as PaginationFirst } from './PaginationFirst.vue';\nexport { default as PaginationLast } from './PaginationLast.vue';\nexport { default as PaginationNext } from './PaginationNext.vue';\nexport { default as PaginationPrev } from './PaginationPrev.vue';\n"
}
],
"type": "components:ui"
}