@create-lft-app/nextjs 3.1.0 → 3.2.0

package/template/src/components/ui/badge.tsx

@@ -1,50 +1,50 @@
-import * as React from "react"
-import { Slot } from "@radix-ui/react-slot"
-import { cva, type VariantProps } from "class-variance-authority"
-
-import { cn } from "@/lib/utils"
-
-const badgeVariants = cva(
-  "inline-flex items-center justify-center border px-2.5 py-0.5 text-xs font-medium transition-colors",
-  {
-    variants: {
-      variant: {
-        default:
-          "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
-        secondary:
-          "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
-        destructive:
-          "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
-        outline:
-          "text-foreground border-border",
-        tag:
-          "rounded-none border-0 bg-[#F2F1EF] dark:bg-[#1D1D1D] text-[#878787] text-[10px] px-2 py-1",
-        "tag-rounded":
-          "rounded-full border-0 bg-[#F2F1EF] dark:bg-[#1D1D1D] text-[#878787] text-[12px] px-3 py-1",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-    },
-  }
-)
-
-function Badge({
-  className,
-  variant,
-  asChild = false,
-  ...props
-}: React.ComponentProps<"span"> &
-  VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
-  const Comp = asChild ? Slot : "span"
-
-  return (
-    <Comp
-      data-slot="badge"
-      className={cn(badgeVariants({ variant }), className)}
-      {...props}
-    />
-  )
-}
-
-export { Badge, badgeVariants }
+import * as React from "react"
+import { Slot } from "@radix-ui/react-slot"
+import { cva, type VariantProps } from "class-variance-authority"
+
+import { cn } from "@/lib/utils"
+
+const badgeVariants = cva(
+  "inline-flex items-center justify-center border px-2.5 py-0.5 text-xs font-medium transition-colors",
+  {
+    variants: {
+      variant: {
+        default:
+          "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
+        secondary:
+          "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        destructive:
+          "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
+        outline:
+          "text-foreground border-border",
+        tag:
+          "rounded-none border-0 bg-muted text-muted-foreground text-[10px] px-2 py-1",
+        "tag-rounded":
+          "rounded-full border-0 bg-muted text-muted-foreground text-[12px] px-3 py-1",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+    },
+  }
+)
+
+function Badge({
+  className,
+  variant,
+  asChild = false,
+  ...props
+}: React.ComponentProps<"span"> &
+  VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
+  const Comp = asChild ? Slot : "span"
+
+  return (
+    <Comp
+      data-slot="badge"
+      className={cn(badgeVariants({ variant }), className)}
+      {...props}
+    />
+  )
+}
+
+export { Badge, badgeVariants }

package/template/src/components/ui/button.tsx

@@ -1,118 +1,118 @@
-'use client'
-
-import * as React from "react"
-import { Slot } from "@radix-ui/react-slot"
-import { motion } from "framer-motion"
-import { cva, type VariantProps } from "class-variance-authority"
-import { cn } from "@/lib/utils"
-
-const buttonVariants = cva(
-  [
-    "inline-flex items-center justify-center gap-2",
-    "whitespace-nowrap text-sm font-medium",
-    "transition-colors duration-150",
-    "disabled:pointer-events-none disabled:opacity-50",
-    "[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
-    "outline-none focus-visible:outline-none",
-  ].join(" "),
-  {
-    variants: {
-      variant: {
-        default: [
-          "bg-primary text-primary-foreground",
-          "hover:bg-primary/90",
-        ].join(" "),
-        destructive: [
-          "bg-destructive text-destructive-foreground",
-          "hover:bg-destructive/90",
-        ].join(" "),
-        outline: [
-          "border border-border bg-transparent",
-          "hover:bg-accent hover:text-accent-foreground",
-        ].join(" "),
-        secondary: [
-          "bg-secondary text-secondary-foreground",
-          "hover:bg-secondary/80",
-        ].join(" "),
-        ghost: [
-          "hover:bg-accent hover:text-accent-foreground",
-        ].join(" "),
-        link: [
-          "text-primary underline-offset-4",
-          "hover:underline",
-        ].join(" "),
-        icon: [
-          "text-[#878787]",
-          "hover:bg-accent hover:text-accent-foreground",
-          "rounded-full",
-        ].join(" "),
-      },
-      size: {
-        default: "h-10 px-4 py-2 rounded-md",
-        sm: "h-8 px-3 text-xs rounded-md",
-        lg: "h-11 px-8 rounded-md",
-        xl: "h-12 px-10 rounded-md",
-        icon: "h-8 w-8",
-        "icon-sm": "h-6 w-6",
-        "icon-lg": "h-10 w-10",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default",
-    },
-  }
-)
-
-type ButtonProps = React.ComponentProps<"button"> &
-  VariantProps<typeof buttonVariants> & {
-    asChild?: boolean
-    animate?: boolean
-  }
-
-const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
-  ({ className, variant = "default", size = "default", asChild = false, animate = true, ...props }, ref) => {
-    if (asChild) {
-      return (
-        <Slot
-          ref={ref as React.Ref<HTMLElement>}
-          data-slot="button"
-          data-variant={variant}
-          data-size={size}
-          className={cn(buttonVariants({ variant, size, className }))}
-          {...props}
-        />
-      )
-    }
-
-    if (!animate) {
-      return (
-        <button
-          ref={ref}
-          data-slot="button"
-          data-variant={variant}
-          data-size={size}
-          className={cn(buttonVariants({ variant, size, className }))}
-          {...props}
-        />
-      )
-    }
-
-    return (
-      <motion.button
-        ref={ref}
-        data-slot="button"
-        data-variant={variant}
-        data-size={size}
-        whileHover={{ scale: 1.02 }}
-        whileTap={{ scale: 0.98 }}
-        transition={{ duration: 0.1 }}
-        className={cn(buttonVariants({ variant, size, className }))}
-        {...(props as React.ComponentPropsWithoutRef<typeof motion.button>)}
-      />
-    )
-  }
-)
-Button.displayName = "Button"
-
-export { Button, buttonVariants }
+'use client'
+
+import * as React from "react"
+import { Slot } from "@radix-ui/react-slot"
+import { motion } from "framer-motion"
+import { cva, type VariantProps } from "class-variance-authority"
+import { cn } from "@/lib/utils"
+
+const buttonVariants = cva(
+  [
+    "inline-flex items-center justify-center gap-2",
+    "whitespace-nowrap text-sm font-medium",
+    "transition-colors duration-150",
+    "disabled:pointer-events-none disabled:opacity-50",
+    "[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+    "outline-none focus-visible:outline-none",
+  ].join(" "),
+  {
+    variants: {
+      variant: {
+        default: [
+          "bg-primary text-primary-foreground",
+          "hover:bg-primary/90",
+        ].join(" "),
+        destructive: [
+          "bg-destructive text-destructive-foreground",
+          "hover:bg-destructive/90",
+        ].join(" "),
+        outline: [
+          "border border-border bg-transparent",
+          "hover:bg-accent hover:text-accent-foreground",
+        ].join(" "),
+        secondary: [
+          "bg-secondary text-secondary-foreground",
+          "hover:bg-secondary/80",
+        ].join(" "),
+        ghost: [
+          "hover:bg-accent hover:text-accent-foreground",
+        ].join(" "),
+        link: [
+          "text-primary underline-offset-4",
+          "hover:underline",
+        ].join(" "),
+        icon: [
+          "text-muted-foreground",
+          "hover:bg-accent hover:text-accent-foreground",
+          "rounded-full",
+        ].join(" "),
+      },
+      size: {
+        default: "h-10 px-4 py-2 rounded-md",
+        sm: "h-8 px-3 text-xs rounded-md",
+        lg: "h-11 px-8 rounded-md",
+        xl: "h-12 px-10 rounded-md",
+        icon: "h-8 w-8",
+        "icon-sm": "h-6 w-6",
+        "icon-lg": "h-10 w-10",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  }
+)
+
+type ButtonProps = React.ComponentProps<"button"> &
+  VariantProps<typeof buttonVariants> & {
+    asChild?: boolean
+    animate?: boolean
+  }
+
+const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
+  ({ className, variant = "default", size = "default", asChild = false, animate = true, ...props }, ref) => {
+    if (asChild) {
+      return (
+        <Slot
+          ref={ref as React.Ref<HTMLElement>}
+          data-slot="button"
+          data-variant={variant}
+          data-size={size}
+          className={cn(buttonVariants({ variant, size, className }))}
+          {...props}
+        />
+      )
+    }
+
+    if (!animate) {
+      return (
+        <button
+          ref={ref}
+          data-slot="button"
+          data-variant={variant}
+          data-size={size}
+          className={cn(buttonVariants({ variant, size, className }))}
+          {...props}
+        />
+      )
+    }
+
+    return (
+      <motion.button
+        ref={ref}
+        data-slot="button"
+        data-variant={variant}
+        data-size={size}
+        whileHover={{ scale: 1.02 }}
+        whileTap={{ scale: 0.98 }}
+        transition={{ duration: 0.1 }}
+        className={cn(buttonVariants({ variant, size, className }))}
+        {...(props as React.ComponentPropsWithoutRef<typeof motion.button>)}
+      />
+    )
+  }
+)
+Button.displayName = "Button"
+
+export { Button, buttonVariants }