theoludwig/.profile
1
0
Fork 0
mirror of https://github.com/theoludwig/theoludwig.git synced 2026-02-20 03:09:20 +01:00
Code Issues Releases Activity

chore: migrate from ESLint/Prettier to Oxc

Browse Source
This commit is contained in:
Théo LUDWIG
2026-02-17 01:23:03 +01:00
parent 57026d652c
commit d0cde4538c
83 changed files with 2569 additions and 4342 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
packages/ui/src/Design/Button/Button.tsx
View File

@@ -1,32 +1,37 @@
import { classNames } from "@repo/config-tailwind/classNames"
import { Link as NextLink } from "@repo/i18n/routing"
import type { VariantProps } from "cva"
import { cva } from "cva"
import { Spinner } from "../Spinner/Spinner.tsx"
import { Ripple } from "./Ripple.tsx"
const buttonVariants = cva({
base: "relative inline-flex items-center justify-center overflow-hidden rounded-md text-base font-semibold transition duration-150 ease-in-out focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
variants: {
variant: {
solid: "bg-primary hover:bg-primary/80 text-white",
outline:
"dark:border-primary-dark/60 dark:text-primary-dark dark:hover:border-primary-dark border-primary/60 text-primary hover:border-primary hover:bg-primary border bg-transparent hover:text-white",
},
size: {
small: "h-9 rounded-md px-3",
medium: "h-10 px-4 py-2",
large: "h-11 rounded-md px-8",
},
},
defaultVariants: {
variant: "solid",
size: "medium",
},
})
const BUTTON_VARIANTS = ["solid", "outline"] as const
type ButtonVariant = (typeof BUTTON_VARIANTS)[number]
const BUTTON_SIZES = ["small", "medium", "large"] as const
type ButtonSize = (typeof BUTTON_SIZES)[number]
const buttonVariants = (options?: { variant?: ButtonVariant; size?: ButtonSize }): string => {
const { variant = "solid", size = "medium" } = options ?? {}
return classNames(
"relative inline-flex items-center justify-center overflow-hidden rounded-md text-base font-semibold transition duration-150 ease-in-out focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
{
"bg-primary text-white hover:bg-primary/80": variant === "solid",
"border border-primary/60 bg-transparent text-primary hover:border-primary hover:bg-primary hover:text-white dark:border-primary-dark/60 dark:text-primary-dark dark:hover:border-primary-dark":
variant === "outline",
},
{
"h-9 rounded-md px-3": size === "small",
"h-10 px-4 py-2": size === "medium",
"h-11 rounded-md px-8": size === "large",
},
)
}
interface ButtonBaseProps {
variant?: ButtonVariant
size?: ButtonSize
interface ButtonBaseProps extends VariantProps<typeof buttonVariants> {
leftIcon?: React.ReactNode
rightIcon?: React.ReactNode
disabled?: boolean
@@ -34,14 +39,10 @@ interface ButtonBaseProps extends VariantProps<typeof buttonVariants> {
}
interface ButtonElementProps extends React.ComponentPropsWithoutRef<"button"> {}
interface LinkElementProps extends React.ComponentPropsWithoutRef<
typeof NextLink
> {}
interface LinkElementProps extends React.ComponentPropsWithoutRef<typeof NextLink> {}
export type ButtonLinkProps = ButtonBaseProps &
LinkElementProps & { href: string }
export type ButtonButtonProps = ButtonBaseProps &
ButtonElementProps & { href?: never }
export type ButtonLinkProps = ButtonBaseProps & LinkElementProps & { href: string }
export type ButtonButtonProps = ButtonBaseProps & ButtonElementProps & { href?: never }
export type ButtonProps = ButtonButtonProps | ButtonLinkProps
@@ -51,18 +52,13 @@ export type ButtonProps = ButtonButtonProps | ButtonLinkProps
* @returns
*/
export const Button: React.FC<ButtonProps> = (props) => {
const rippleColor =
props.variant === "outline" ? "rgb(30, 64, 175)" : "rgb(229, 231, 235)"
const rippleColor = props.variant === "outline" ? "rgb(30, 64, 175)" : "rgb(229, 231, 235)"
if (typeof props.href === "string") {
const { variant, size, leftIcon, rightIcon, className, children, ...rest } =
props
const { variant, size, leftIcon, rightIcon, className, children, ...rest } = props
return (
<NextLink
className={classNames(buttonVariants({ variant, size }), className)}
{...rest}
>
<NextLink className={classNames(buttonVariants({ variant, size }), className)} {...rest}>
{leftIcon != null ? <span className="mr-2">{leftIcon}</span> : null}
<span>{children}</span>
{rightIcon != null ? <span className="ml-2">{rightIcon}</span> : null}
@@ -98,13 +94,9 @@ export const Button: React.FC<ButtonProps> = (props) => {
disabled={isDisabled}
{...rest}
>
{leftIconElement != null ? (
<span className="mr-2">{leftIconElement}</span>
) : null}
{leftIconElement != null ? <span className="mr-2">{leftIconElement}</span> : null}
<span>{children}</span>
{rightIcon != null && !isLoading ? (
<span className="ml-2">{rightIcon}</span>
) : null}
{rightIcon != null && !isLoading ? <span className="ml-2">{rightIcon}</span> : null}
<Ripple color={rippleColor} />
</button>