29 lines
2.3 KiB
JSON
29 lines
2.3 KiB
JSON
{
|
|
"name": "scroll-area",
|
|
"type": "registry:ui",
|
|
"dependencies": [],
|
|
"registryDependencies": [
|
|
"utils"
|
|
],
|
|
"files": [
|
|
{
|
|
"path": "ui/scroll-area/ScrollArea.vue",
|
|
"content": "<script setup lang=\"ts\">\nimport { cn } from '@/lib/utils'\nimport {\n ScrollAreaCorner,\n ScrollAreaRoot,\n type ScrollAreaRootProps,\n ScrollAreaViewport,\n} from 'reka-ui'\nimport { computed, type HTMLAttributes } from 'vue'\nimport ScrollBar from './ScrollBar.vue'\n\nconst props = defineProps<ScrollAreaRootProps & { class?: HTMLAttributes['class'] }>()\n\nconst delegatedProps = computed(() => {\n const { class: _, ...delegated } = props\n\n return delegated\n})\n</script>\n\n<template>\n <ScrollAreaRoot v-bind=\"delegatedProps\" :class=\"cn('relative overflow-hidden', props.class)\">\n <ScrollAreaViewport class=\"h-full w-full rounded-[inherit]\">\n <slot />\n </ScrollAreaViewport>\n <ScrollBar />\n <ScrollAreaCorner />\n </ScrollAreaRoot>\n</template>\n",
|
|
"type": "registry:ui",
|
|
"target": ""
|
|
},
|
|
{
|
|
"path": "ui/scroll-area/ScrollBar.vue",
|
|
"content": "<script setup lang=\"ts\">\nimport { cn } from '@/lib/utils'\nimport { ScrollAreaScrollbar, type ScrollAreaScrollbarProps, ScrollAreaThumb } from 'reka-ui'\nimport { computed, type HTMLAttributes } from 'vue'\n\nconst props = withDefaults(defineProps<ScrollAreaScrollbarProps & { class?: HTMLAttributes['class'] }>(), {\n orientation: 'vertical',\n})\n\nconst delegatedProps = computed(() => {\n const { class: _, ...delegated } = props\n\n return delegated\n})\n</script>\n\n<template>\n <ScrollAreaScrollbar\n v-bind=\"delegatedProps\"\n :class=\"\n cn('flex touch-none select-none transition-colors',\n orientation === 'vertical'\n && 'h-full w-2.5 border-l border-l-transparent p-px',\n orientation === 'horizontal'\n && 'h-2.5 flex-col border-t border-t-transparent p-px',\n props.class)\"\n >\n <ScrollAreaThumb class=\"relative flex-1 rounded-full bg-border\" />\n </ScrollAreaScrollbar>\n</template>\n",
|
|
"type": "registry:ui",
|
|
"target": ""
|
|
},
|
|
{
|
|
"path": "ui/scroll-area/index.ts",
|
|
"content": "export { default as ScrollArea } from './ScrollArea.vue'\nexport { default as ScrollBar } from './ScrollBar.vue'\n",
|
|
"type": "registry:ui",
|
|
"target": ""
|
|
}
|
|
]
|
|
}
|