@bl33dz/fa814698dcde12f86a37ac31dd3aedf9 1.0.6 → 1.0.9

package/src/shadcn/tabs/GridTabsList.vue

@@ -1,30 +1,30 @@
-<script setup lang="ts">
-import { computed } from 'vue';
-import { cn } from '@/lib/utils';
-import TabsList from '@/ui/tab-list.vue';
-
-const props = defineProps({
-  cols: { type: Number, default: 2 },
-  class: { type: String, default: '' },
-});
-
-const gridClass = computed(() =>
-  cn(
-    props.cols === 2 && 'grid-cols-2',
-    props.cols === 3 && 'grid-cols-3',
-    props.cols === 4 && 'grid-cols-4',
-    props.cols === 5 && 'grid-cols-5',
-    props.cols === 6 && 'grid-cols-6',
-    props.class
-  )
-);
-</script>
-<template>
-  <TabsList
-    variant="grid"
-    :class="gridClass"
-    v-bind="$attrs"
-  >
-    <slot />
-  </TabsList>
-</template>
+<script setup lang="ts">
+import { computed } from 'vue';
+import { cn } from '@/lib/utils';
+import TabsList from '@/ui/tab-list.vue';
+
+const props = defineProps({
+  cols: { type: Number, default: 2 },
+  class: { type: String, default: '' },
+});
+
+const gridClass = computed(() =>
+  cn(
+    props.cols === 2 && 'grid-cols-2',
+    props.cols === 3 && 'grid-cols-3',
+    props.cols === 4 && 'grid-cols-4',
+    props.cols === 5 && 'grid-cols-5',
+    props.cols === 6 && 'grid-cols-6',
+    props.class
+  )
+);
+</script>
+<template>
+  <TabsList
+    variant="grid"
+    :class="gridClass"
+    v-bind="$attrs"
+  >
+    <slot />
+  </TabsList>
+</template>

package/src/shadcn/tabs/ScrollableTabsList.vue

@@ -1,8 +1,8 @@
-<template>
-  <div class="flex overflow-x-auto gap-1">
-    <slot />
-  </div>
-</template>
-<script setup lang="ts">
-// No props needed
-</script>
+<template>
+  <div class="flex overflow-x-auto gap-1">
+    <slot />
+  </div>
+</template>
+<script setup lang="ts">
+// No props needed
+</script>

package/src/shadcn/tabs/Tabs.vue

@@ -1,23 +1,23 @@
-<script setup lang="ts">
-import type { TabsRootEmits, TabsRootProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { TabsRoot, useForwardPropsEmits } from "reka-ui"
-import { cn } from "@/lib/utils"
-
-const props = defineProps<TabsRootProps & { class?: HTMLAttributes["class"] }>()
-const emits = defineEmits<TabsRootEmits>()
-
-const delegatedProps = reactiveOmit(props, "class")
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <TabsRoot
-    data-slot="tabs"
-    v-bind="forwarded"
-    :class="cn('flex flex-col', props.class)"
-  >
-    <slot />
-  </TabsRoot>
-</template>
+<script setup lang="ts">
+import type { TabsRootEmits, TabsRootProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import { TabsRoot, useForwardPropsEmits } from "reka-ui"
+import { cn } from "@/lib/utils"
+
+const props = defineProps<TabsRootProps & { class?: HTMLAttributes["class"] }>()
+const emits = defineEmits<TabsRootEmits>()
+
+const delegatedProps = reactiveOmit(props, "class")
+const forwarded = useForwardPropsEmits(delegatedProps, emits)
+</script>
+
+<template>
+  <TabsRoot
+    data-slot="tabs"
+    v-bind="forwarded"
+    :class="cn('flex flex-col', props.class)"
+  >
+    <slot />
+  </TabsRoot>
+</template>

package/src/shadcn/tabs/TabsContent.vue

@@ -1,21 +1,21 @@
-<script setup lang="ts">
-import type { TabsContentProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { TabsContent } from "reka-ui"
-import { cn } from "@/lib/utils"
-
-const props = defineProps<TabsContentProps & { class?: HTMLAttributes["class"] }>()
-
-const delegatedProps = reactiveOmit(props, "class")
-</script>
-
-<template>
-  <TabsContent
-    data-slot="tabs-content"
-    :class="cn('flex-1 outline-none', props.class)"
-    v-bind="delegatedProps"
-  >
-    <slot />
-  </TabsContent>
-</template>
+<script setup lang="ts">
+import type { TabsContentProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import { TabsContent } from "reka-ui"
+import { cn } from "@/lib/utils"
+
+const props = defineProps<TabsContentProps & { class?: HTMLAttributes["class"] }>()
+
+const delegatedProps = reactiveOmit(props, "class")
+</script>
+
+<template>
+  <TabsContent
+    data-slot="tabs-content"
+    :class="cn('flex-1 outline-none', props.class)"
+    v-bind="delegatedProps"
+  >
+    <slot />
+  </TabsContent>
+</template>

package/src/shadcn/tabs/TabsList.vue

@@ -1,24 +1,24 @@
-<script setup lang="ts">
-import type { TabsListProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { TabsList } from "reka-ui"
-import { cn } from "@/lib/utils"
-
-const props = defineProps<TabsListProps & { class?: HTMLAttributes["class"] }>()
-
-const delegatedProps = reactiveOmit(props, "class")
-</script>
-
-<template>
-  <TabsList
-    data-slot="tabs-list"
-    v-bind="delegatedProps"
-    :class="cn(
-      'bg-muted text-muted-foreground inline-flex items-center justify-center p-[3px]',
-      props.class,
-    )"
-  >
-    <slot />
-  </TabsList>
-</template>
+<script setup lang="ts">
+import type { TabsListProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import { TabsList } from "reka-ui"
+import { cn } from "@/lib/utils"
+
+const props = defineProps<TabsListProps & { class?: HTMLAttributes["class"] }>()
+
+const delegatedProps = reactiveOmit(props, "class")
+</script>
+
+<template>
+  <TabsList
+    data-slot="tabs-list"
+    v-bind="delegatedProps"
+    :class="cn(
+      'bg-muted text-muted-foreground inline-flex items-center justify-center p-[3px]',
+      props.class,
+    )"
+  >
+    <slot />
+  </TabsList>
+</template>

package/src/shadcn/tabs/TabsTrigger.vue

@@ -1,30 +1,30 @@
-<script setup lang="ts">
-import type { TabsTriggerProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { TabsTrigger as RekaTabsTrigger } from "reka-ui"
-import { cn } from "@/lib/utils"
-
-const props = defineProps<TabsTriggerProps & { class?: HTMLAttributes["class"]; variant?: "default" | "vertical" }>()
-</script>
-
-<template>
-  <RekaTabsTrigger
-    data-slot="tabs-trigger"
-    v-bind="props"
-    :class="cn(
-      'relative inline-flex items-center justify-center gap-2 px-4 py-2 transition-all duration-200 ease-out',
-      'min-w-0 max-w-48 w-auto shrink-0',
-      'text-muted-foreground hover:text-foreground',
-      'border-b-2 border-transparent',
-      'data-[state=active]:text-primary data-[state=active]:border-primary',
-      'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/20 focus-visible:ring-offset-2',
-      'disabled:pointer-events-none disabled:opacity-50',
-      '[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
-      '[&>span]:truncate [&>span]:block',
-      props.variant === 'vertical' && 'w-full justify-start border-b-0 border-r-2',
-      props.class,
-    )"
-  >
-    <slot />
-  </RekaTabsTrigger>
-</template>
+<script setup lang="ts">
+import type { TabsTriggerProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { TabsTrigger as RekaTabsTrigger } from "reka-ui"
+import { cn } from "@/lib/utils"
+
+const props = defineProps<TabsTriggerProps & { class?: HTMLAttributes["class"]; variant?: "default" | "vertical" }>()
+</script>
+
+<template>
+  <RekaTabsTrigger
+    data-slot="tabs-trigger"
+    v-bind="props"
+    :class="cn(
+      'relative inline-flex items-center justify-center gap-2 px-4 py-2 transition-all duration-200 ease-out',
+      'min-w-0 max-w-48 w-auto shrink-0',
+      'text-muted-foreground hover:text-foreground',
+      'border-b-2 border-transparent',
+      'data-[state=active]:text-primary data-[state=active]:border-primary',
+      'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/20 focus-visible:ring-offset-2',
+      'disabled:pointer-events-none disabled:opacity-50',
+      '[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
+      '[&>span]:truncate [&>span]:block',
+      props.variant === 'vertical' && 'w-full justify-start border-b-0 border-r-2',
+      props.class,
+    )"
+  >
+    <slot />
+  </RekaTabsTrigger>
+</template>

package/src/shadcn/tabs/VerticalTabsList.vue

@@ -1,28 +1,28 @@
-
-<script setup lang="ts">
-import TabsList from "@/ui/tab-list.vue"
-import { cn } from "@/lib/utils"
-import { reactiveOmit } from "@vueuse/core"
-import type { TabsListProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-
-const props = defineProps<
-  TabsListProps & {
-    class?: HTMLAttributes["class"]
-    width?: "w-32" | "w-40" | "w-48" | "w-56" | "w-64"
-  }
->()
-
-const delegatedProps = reactiveOmit(props, ["class", "width"])
-const widthClass = props.width ?? "w-48"
-</script>
-
-<template>
-  <TabsList
-    variant="vertical"
-    v-bind="delegatedProps"
-    :class="cn(widthClass, props.class)"
-  >
-    <slot />
-  </TabsList>
-</template>
+
+<script setup lang="ts">
+import TabsList from "@/ui/tab-list.vue"
+import { cn } from "@/lib/utils"
+import { reactiveOmit } from "@vueuse/core"
+import type { TabsListProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+
+const props = defineProps<
+  TabsListProps & {
+    class?: HTMLAttributes["class"]
+    width?: "w-32" | "w-40" | "w-48" | "w-56" | "w-64"
+  }
+>()
+
+const delegatedProps = reactiveOmit(props, ["class", "width"])
+const widthClass = props.width ?? "w-48"
+</script>
+
+<template>
+  <TabsList
+    variant="vertical"
+    v-bind="delegatedProps"
+    :class="cn(widthClass, props.class)"
+  >
+    <slot />
+  </TabsList>
+</template>

package/src/shadcn/tabs/VerticalTabsTrigger.vue

@@ -1,16 +1,16 @@
-<script setup lang="ts">
-import TabsTrigger from "@/ui/tab-trigger.vue"
-import type { TabsTriggerProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-
-const props = defineProps<TabsTriggerProps & { class?: HTMLAttributes["class"] }>()
-</script>
-
-<template>
-  <TabsTrigger
-    v-bind="{ ...props, variant: 'vertical' }"
-    :class="props.class"
-  >
-    <slot />
-  </TabsTrigger>
-</template>
+<script setup lang="ts">
+import TabsTrigger from "@/ui/tab-trigger.vue"
+import type { TabsTriggerProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+
+const props = defineProps<TabsTriggerProps & { class?: HTMLAttributes["class"] }>()
+</script>
+
+<template>
+  <TabsTrigger
+    v-bind="{ ...props, variant: 'vertical' }"
+    :class="props.class"
+  >
+    <slot />
+  </TabsTrigger>
+</template>

package/src/shadcn/tabs/index.ts

@@ -1,10 +1,10 @@
-export { default as Tabs } from "./Tabs.vue"
-export { default as TabsContent } from "./TabsContent.vue"
-export { default as TabsList } from "./TabsList.vue"
-export { default as TabsTrigger } from "./TabsTrigger.vue"
-export { default as GridTabsList } from "./GridTabsList.vue";
-export { default as VerticalTabsList } from "./VerticalTabsList.vue";
-export { default as ScrollableTabsList } from "./ScrollableTabsList.vue";
-export { default as CornerCutTabsTrigger } from "./CornerCutTabsTrigger.vue";
-export { default as VerticalTabsTrigger } from "./VerticalTabsTrigger.vue";
-export { default as CardTabsContent } from "./CardTabsContent.vue";
+export { default as Tabs } from "./Tabs.vue"
+export { default as TabsContent } from "./TabsContent.vue"
+export { default as TabsList } from "./TabsList.vue"
+export { default as TabsTrigger } from "./TabsTrigger.vue"
+export { default as GridTabsList } from "./GridTabsList.vue";
+export { default as VerticalTabsList } from "./VerticalTabsList.vue";
+export { default as ScrollableTabsList } from "./ScrollableTabsList.vue";
+export { default as CornerCutTabsTrigger } from "./CornerCutTabsTrigger.vue";
+export { default as VerticalTabsTrigger } from "./VerticalTabsTrigger.vue";
+export { default as CardTabsContent } from "./CardTabsContent.vue";

package/src/shadcn/toggle/Toggle.vue

@@ -1,35 +1,35 @@
-<script setup lang="ts">
-import type { ToggleEmits, ToggleProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import type { ToggleVariants } from "."
-import { reactiveOmit } from "@vueuse/core"
-import { Toggle, useForwardPropsEmits } from "reka-ui"
-import { cn } from "@/lib/utils"
-import { toggleVariants } from "."
-
-const props = withDefaults(defineProps<ToggleProps & {
-  class?: HTMLAttributes["class"]
-  variant?: ToggleVariants["variant"]
-  size?: ToggleVariants["size"]
-}>(), {
-  variant: "default",
-  size: "default",
-  disabled: false,
-})
-
-const emits = defineEmits<ToggleEmits>()
-
-const delegatedProps = reactiveOmit(props, "class", "size", "variant")
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <Toggle
-    v-slot="slotProps"
-    data-slot="toggle"
-    v-bind="forwarded"
-    :class="cn(toggleVariants({ variant, size }), props.class)"
-  >
-    <slot v-bind="slotProps" />
-  </Toggle>
-</template>
+<script setup lang="ts">
+import type { ToggleEmits, ToggleProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import type { ToggleVariants } from "."
+import { reactiveOmit } from "@vueuse/core"
+import { Toggle, useForwardPropsEmits } from "reka-ui"
+import { cn } from "@/lib/utils"
+import { toggleVariants } from "."
+
+const props = withDefaults(defineProps<ToggleProps & {
+  class?: HTMLAttributes["class"]
+  variant?: ToggleVariants["variant"]
+  size?: ToggleVariants["size"]
+}>(), {
+  variant: "default",
+  size: "default",
+  disabled: false,
+})
+
+const emits = defineEmits<ToggleEmits>()
+
+const delegatedProps = reactiveOmit(props, "class", "size", "variant")
+const forwarded = useForwardPropsEmits(delegatedProps, emits)
+</script>
+
+<template>
+  <Toggle
+    v-slot="slotProps"
+    data-slot="toggle"
+    v-bind="forwarded"
+    :class="cn(toggleVariants({ variant, size }), props.class)"
+  >
+    <slot v-bind="slotProps" />
+  </Toggle>
+</template>

package/src/shadcn/toggle/index.ts

@@ -1,28 +1,28 @@
-import type { VariantProps } from "class-variance-authority"
-import { cva } from "class-variance-authority"
-
-export { default as Toggle } from "./Toggle.vue"
-
-export const toggleVariants = cva(
-  "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap",
-  {
-    variants: {
-      variant: {
-        default: "bg-transparent",
-        outline:
-          "border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground",
-      },
-      size: {
-        default: "h-9 px-2 min-w-9",
-        sm: "h-8 px-1.5 min-w-8",
-        lg: "h-10 px-2.5 min-w-10",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default",
-    },
-  },
-)
-
-export type ToggleVariants = VariantProps<typeof toggleVariants>
+import type { VariantProps } from "class-variance-authority"
+import { cva } from "class-variance-authority"
+
+export { default as Toggle } from "./Toggle.vue"
+
+export const toggleVariants = cva(
+  "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap",
+  {
+    variants: {
+      variant: {
+        default: "bg-transparent",
+        outline:
+          "border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground",
+      },
+      size: {
+        default: "h-9 px-2 min-w-9",
+        sm: "h-8 px-1.5 min-w-8",
+        lg: "h-10 px-2.5 min-w-10",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  },
+)
+
+export type ToggleVariants = VariantProps<typeof toggleVariants>

package/src/shadcn/tooltip/Tooltip.vue

@@ -1,18 +1,18 @@
-<script setup lang="ts">
-import type { TooltipRootEmits, TooltipRootProps } from "reka-ui"
-import { TooltipRoot, useForwardPropsEmits } from "reka-ui"
-
-const props = defineProps<TooltipRootProps>()
-const emits = defineEmits<TooltipRootEmits>()
-
-const forwarded = useForwardPropsEmits(props, emits)
-</script>
-
-<template>
-  <TooltipRoot
-    data-slot="tooltip"
-    v-bind="forwarded"
-  >
-    <slot />
-  </TooltipRoot>
-</template>
+<script setup lang="ts">
+import type { TooltipRootEmits, TooltipRootProps } from "reka-ui"
+import { TooltipRoot, useForwardPropsEmits } from "reka-ui"
+
+const props = defineProps<TooltipRootProps>()
+const emits = defineEmits<TooltipRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
+</script>
+
+<template>
+  <TooltipRoot
+    data-slot="tooltip"
+    v-bind="forwarded"
+  >
+    <slot />
+  </TooltipRoot>
+</template>

package/src/shadcn/tooltip/TooltipContent.vue

@@ -1,34 +1,34 @@
-<script setup lang="ts">
-import type { TooltipContentEmits, TooltipContentProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { TooltipArrow, TooltipContent, TooltipPortal, useForwardPropsEmits } from "reka-ui"
-import { cn } from "@/lib/utils"
-
-defineOptions({
-  inheritAttrs: false,
-})
-
-const props = withDefaults(defineProps<TooltipContentProps & { class?: HTMLAttributes["class"] }>(), {
-  sideOffset: 4,
-})
-
-const emits = defineEmits<TooltipContentEmits>()
-
-const delegatedProps = reactiveOmit(props, "class")
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <TooltipPortal>
-    <TooltipContent
-      data-slot="tooltip-content"
-      v-bind="{ ...forwarded, ...$attrs }"
-      :class="cn('bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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 w-fit rounded-md px-3 py-1.5 text-xs text-balance', props.class)"
-    >
-      <slot />
-
-      <TooltipArrow class="bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" />
-    </TooltipContent>
-  </TooltipPortal>
-</template>
+<script setup lang="ts">
+import type { TooltipContentEmits, TooltipContentProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import { TooltipArrow, TooltipContent, TooltipPortal, useForwardPropsEmits } from "reka-ui"
+import { cn } from "@/lib/utils"
+
+defineOptions({
+  inheritAttrs: false,
+})
+
+const props = withDefaults(defineProps<TooltipContentProps & { class?: HTMLAttributes["class"] }>(), {
+  sideOffset: 4,
+})
+
+const emits = defineEmits<TooltipContentEmits>()
+
+const delegatedProps = reactiveOmit(props, "class")
+const forwarded = useForwardPropsEmits(delegatedProps, emits)
+</script>
+
+<template>
+  <TooltipPortal>
+    <TooltipContent
+      data-slot="tooltip-content"
+      v-bind="{ ...forwarded, ...$attrs }"
+      :class="cn('bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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 w-fit rounded-md px-3 py-1.5 text-xs text-balance', props.class)"
+    >
+      <slot />
+
+      <TooltipArrow class="bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" />
+    </TooltipContent>
+  </TooltipPortal>
+</template>