Skip to content

Commit

Permalink
Merge pull request #57 from Quest-Finder/develop
Browse files Browse the repository at this point in the history
Develop
  • Loading branch information
DevVitorPedra committed Feb 18, 2024
2 parents d134b28 + a66ff76 commit 5212e77
Show file tree
Hide file tree
Showing 35 changed files with 1,274 additions and 248 deletions.
3 changes: 2 additions & 1 deletion components.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,8 @@
"config": "tailwind.config.js",
"css": "src/app/globals.css",
"baseColor": "slate",
"cssVariables": true
"cssVariables": true,
"preserveSymlinks": true
},
"aliases": {
"components": "@/components",
Expand Down
421 changes: 341 additions & 80 deletions package-lock.json

Large diffs are not rendered by default.

8 changes: 7 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,13 @@
"@clerk/localizations": "^1.26.3",
"@clerk/nextjs": "^4.25.3",
"@hookform/resolvers": "^3.3.4",
"@radix-ui/react-alert-dialog": "^1.0.5",
"@radix-ui/react-avatar": "^1.0.4",
"@radix-ui/react-separator": "^1.0.3",
"@radix-ui/react-dialog": "^1.0.5",
"@radix-ui/react-label": "^2.0.2",
"@radix-ui/react-radio-group": "^1.1.3",
"@radix-ui/react-select": "^2.0.0",
"@radix-ui/react-slot": "^1.0.2",
"@types/node": "20.4.4",
"@types/react": "18.2.15",
Expand Down Expand Up @@ -63,4 +69,4 @@
"prettier-plugin-tailwindcss": "^0.4.1",
"storybook": "^7.6.4"
}
}
}
155 changes: 155 additions & 0 deletions src/components/ui/alert-dialog.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,155 @@
'use client'

import * as React from 'react'
import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog'

import { cn } from '@/lib/utils'
import { buttonVariants } from '@/components/ui/button'

const AlertDialog = AlertDialogPrimitive.Root

const AlertDialogTrigger = AlertDialogPrimitive.Trigger

const AlertDialogPortal = AlertDialogPrimitive.Portal

interface AlertDialogOverlayProps
extends React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay> {}
const AlertDialogOverlay = React.forwardRef<
React.ElementRef<typeof AlertDialogPrimitive.Overlay>,
AlertDialogOverlayProps
>(({ className, ...props }, ref) => (
<AlertDialogPrimitive.Overlay
className={cn(
'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
className,
)}
{...props}
ref={ref}
/>
))
AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName

interface AlertDialogContentProps
extends React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content> {}
const AlertDialogContent = React.forwardRef<
React.ElementRef<typeof AlertDialogPrimitive.Content>,
AlertDialogContentProps
>(({ className, ...props }, ref) => (
<AlertDialogPortal>
<AlertDialogOverlay />
<AlertDialogPrimitive.Content
ref={ref}
className={cn(
'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg',
className,
)}
{...props}
/>
</AlertDialogPortal>
))
AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName

interface AlertDialogHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}
function AlertDialogHeader({ className, ...props }: AlertDialogHeaderProps) {
return (
<div
className={cn(
'flex flex-col space-y-2 text-center sm:text-left',
className,
)}
{...props}
/>
)
}

AlertDialogHeader.displayName = 'AlertDialogHeader'

interface AlertDialogFooterProps extends React.HTMLAttributes<HTMLDivElement> {}
function AlertDialogFooter({ className, ...props }: AlertDialogFooterProps) {
;<div
className={cn(
'flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',
className,
)}
{...props}
/>
}
AlertDialogFooter.displayName = 'AlertDialogFooter'

interface AlertDialogTitleProps
extends React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title> {}
function AlertDialogTitle({ className, ...props }: AlertDialogTitleProps) {
return (
<AlertDialogPrimitive.Title
className={cn(
'flex flex-col space-y-2 text-center sm:text-left',
className,
)}
{...props}
/>
)
}
AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName

interface AlertDialogDescriptionProps
extends React.ComponentPropsWithoutRef<
typeof AlertDialogPrimitive.Description
> {}
const AlertDialogDescription = React.forwardRef<
React.ElementRef<typeof AlertDialogPrimitive.Description>,
AlertDialogDescriptionProps
>(({ className, ...props }, ref) => (
<AlertDialogPrimitive.Description
ref={ref}
className={cn('text-sm text-muted-foreground', className)}
{...props}
/>
))
AlertDialogDescription.displayName =
AlertDialogPrimitive.Description.displayName

interface AlertDialogActionProps
extends React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action> {}
const AlertDialogAction = React.forwardRef<
React.ElementRef<typeof AlertDialogPrimitive.Action>,
AlertDialogActionProps
>(({ className, ...props }, ref) => (
<AlertDialogPrimitive.Action
ref={ref}
className={cn(buttonVariants(), className)}
{...props}
/>
))
AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName

interface AlertDialogCancelProps
extends React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel> {}
const AlertDialogCancel = React.forwardRef<
React.ElementRef<typeof AlertDialogPrimitive.Cancel>,
AlertDialogCancelProps
>(({ className, ...props }, ref) => (
<AlertDialogPrimitive.Cancel
ref={ref}
className={cn(
buttonVariants({ variant: 'outline' }),
'mt-2 sm:mt-0',
className,
)}
{...props}
/>
))
AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName

export {
AlertDialog,
AlertDialogPortal,
AlertDialogOverlay,
AlertDialogTrigger,
AlertDialogContent,
AlertDialogHeader,
AlertDialogFooter,
AlertDialogTitle,
AlertDialogDescription,
AlertDialogAction,
AlertDialogCancel,
}
13 changes: 10 additions & 3 deletions src/components/ui/avatar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,12 @@ import * as AvatarPrimitive from '@radix-ui/react-avatar'

import { cn } from '@/lib/utils'

interface AvataProps
extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root> {}

const Avatar = React.forwardRef<
React.ElementRef<typeof AvatarPrimitive.Root>,
React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>
AvataProps
>(({ className, ...props }, ref) => (
<AvatarPrimitive.Root
ref={ref}
Expand All @@ -20,9 +23,11 @@ const Avatar = React.forwardRef<
))
Avatar.displayName = AvatarPrimitive.Root.displayName

interface AvatarImageProps
extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image> {}
const AvatarImage = React.forwardRef<
React.ElementRef<typeof AvatarPrimitive.Image>,
React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>
AvatarImageProps
>(({ className, ...props }, ref) => (
<AvatarPrimitive.Image
ref={ref}
Expand All @@ -32,9 +37,11 @@ const AvatarImage = React.forwardRef<
))
AvatarImage.displayName = AvatarPrimitive.Image.displayName

interface AvatarFallbackProps
extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback> {}
const AvatarFallback = React.forwardRef<
React.ElementRef<typeof AvatarPrimitive.Fallback>,
React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>
AvatarFallbackProps
>(({ className, ...props }, ref) => (
<AvatarPrimitive.Fallback
ref={ref}
Expand Down
24 changes: 19 additions & 5 deletions src/components/ui/calendar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,18 @@

import * as React from 'react'
import { ChevronLeft, ChevronRight } from 'lucide-react'
import { DayPicker } from 'react-day-picker'
import { DayPicker, StyledElement } from 'react-day-picker'

import { cn } from '@/lib/utils'
import { buttonVariants } from '@/components/ui/button'
import { ptBR } from 'date-fns/locale'

export type CalendarProps = React.ComponentProps<typeof DayPicker>
type CalendarProps = React.ComponentPropsWithoutRef<typeof DayPicker> & {
className?: string
// eslint-disable-next-line @typescript-eslint/ban-types
classNames?: Partial<StyledElement<String>> & String
showOutsideDays?: boolean
}

function Calendar({
className,
Expand Down Expand Up @@ -58,15 +63,24 @@ function Calendar({
...classNames,
}}
components={{
IconLeft: ({ ...props }) => (
<ChevronLeft className='h-10 w-10 border-none' />
IconLeft: ({ ...iconProps }) => (
<ChevronLeft
className='h-10 w-10 border-none'
{...iconProps}
/>
),
IconRight: ({ ...iconProps }) => (
<ChevronRight
className='h-10 w-10'
{...iconProps}
/>
),
IconRight: ({ ...props }) => <ChevronRight className='h-10 w-10' />,
}}
{...props}
/>
)
}

Calendar.displayName = 'Calendar'

export { Calendar }
Loading

0 comments on commit 5212e77

Please sign in to comment.