update prettierrc

pull/3/head
TZGyn 2 years ago
parent a67fefd36e
commit 9d4e7d3df7
Signed by: TZGyn
GPG Key ID: 122EAF77AE81FD4A

@ -4,9 +4,7 @@
"semi": false, "semi": false,
"trailingComma": "all", "trailingComma": "all",
"printWidth": 80, "printWidth": 80,
"plugins": [ "bracketSameLine": true,
"prettier-plugin-svelte", "plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
"prettier-plugin-tailwindcss"
],
"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }] "overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
} }

@ -123,9 +123,7 @@
"user_email_unique": { "user_email_unique": {
"name": "user_email_unique", "name": "user_email_unique",
"nullsNotDistinct": false, "nullsNotDistinct": false,
"columns": [ "columns": ["email"]
"email"
]
} }
} }
}, },

@ -31,11 +31,9 @@
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<Button variant="ghost" href="/links" class="justify-start text-base" <Button variant="ghost" href="/links" class="justify-start text-base"
>Links</Button >Links</Button>
>
<Button variant="ghost" href="/projects" class="justify-start text-base " <Button variant="ghost" href="/projects" class="justify-start text-base "
>Projects</Button >Projects</Button>
>
</div> </div>
</div> </div>
@ -54,8 +52,7 @@
<DropdownMenu.Label>My Account</DropdownMenu.Label> <DropdownMenu.Label>My Account</DropdownMenu.Label>
<DropdownMenu.Separator /> <DropdownMenu.Separator />
<DropdownMenu.Item on:click={() => goto('/profile')} <DropdownMenu.Item on:click={() => goto('/profile')}
>Profile</DropdownMenu.Item >Profile</DropdownMenu.Item>
>
</DropdownMenu.Group> </DropdownMenu.Group>
</DropdownMenu.Content> </DropdownMenu.Content>
</DropdownMenu.Root> </DropdownMenu.Root>
@ -63,8 +60,7 @@
<AlertDialog.Root bind:open={dialogOpen}> <AlertDialog.Root bind:open={dialogOpen}>
<AlertDialog.Trigger asChild let:builder> <AlertDialog.Trigger asChild let:builder>
<Button variant="destructive" builders={[builder]} type="submit" <Button variant="destructive" builders={[builder]} type="submit"
>Sign Out</Button >Sign Out</Button>
>
</AlertDialog.Trigger> </AlertDialog.Trigger>
<AlertDialog.Content> <AlertDialog.Content>
<AlertDialog.Header> <AlertDialog.Header>
@ -75,8 +71,7 @@
</AlertDialog.Header> </AlertDialog.Header>
<AlertDialog.Footer> <AlertDialog.Footer>
<AlertDialog.Cancel disabled={isLoading} <AlertDialog.Cancel disabled={isLoading}
>Cancel</AlertDialog.Cancel >Cancel</AlertDialog.Cancel>
>
<Button on:click={logout} class="flex gap-2" disabled={isLoading}> <Button on:click={logout} class="flex gap-2" disabled={isLoading}>
{#if isLoading} {#if isLoading}
<Loader2 class="animate-spin" /> <Loader2 class="animate-spin" />

@ -10,18 +10,15 @@
<DropdownMenu.Trigger asChild let:builder> <DropdownMenu.Trigger asChild let:builder>
<Button builders={[builder]} variant="outline" size="icon"> <Button builders={[builder]} variant="outline" size="icon">
<Sun <Sun
class="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" class="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
/>
<Moon <Moon
class="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" class="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
/>
<span class="sr-only">Toggle theme</span> <span class="sr-only">Toggle theme</span>
</Button> </Button>
</DropdownMenu.Trigger> </DropdownMenu.Trigger>
<DropdownMenu.Content> <DropdownMenu.Content>
<DropdownMenu.Item on:click={() => setMode('light')} <DropdownMenu.Item on:click={() => setMode('light')}
>Light</DropdownMenu.Item >Light</DropdownMenu.Item>
>
<DropdownMenu.Item on:click={() => setMode('dark')}>Dark</DropdownMenu.Item> <DropdownMenu.Item on:click={() => setMode('dark')}>Dark</DropdownMenu.Item>
<DropdownMenu.Item on:click={() => resetMode()}>System</DropdownMenu.Item> <DropdownMenu.Item on:click={() => resetMode()}>System</DropdownMenu.Item>
</DropdownMenu.Content> </DropdownMenu.Content>

@ -1,13 +1,13 @@
<script lang="ts"> <script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui"; import { AlertDialog as AlertDialogPrimitive } from 'bits-ui'
import { buttonVariants } from "$lib/components/ui/button"; import { buttonVariants } from '$lib/components/ui/button'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
type $$Props = AlertDialogPrimitive.ActionProps; type $$Props = AlertDialogPrimitive.ActionProps
type $$Events = AlertDialogPrimitive.ActionEvents; type $$Events = AlertDialogPrimitive.ActionEvents
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<AlertDialogPrimitive.Action <AlertDialogPrimitive.Action
@ -15,7 +15,6 @@
{...$$restProps} {...$$restProps}
on:click on:click
on:keydown on:keydown
let:builder let:builder>
>
<slot {builder} /> <slot {builder} />
</AlertDialogPrimitive.Action> </AlertDialogPrimitive.Action>

@ -1,25 +1,20 @@
<script lang="ts"> <script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui"; import { AlertDialog as AlertDialogPrimitive } from 'bits-ui'
import { buttonVariants } from "$lib/components/ui/button"; import { buttonVariants } from '$lib/components/ui/button'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
type $$Props = AlertDialogPrimitive.CancelProps; type $$Props = AlertDialogPrimitive.CancelProps
type $$Events = AlertDialogPrimitive.CancelEvents; type $$Events = AlertDialogPrimitive.CancelEvents
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<AlertDialogPrimitive.Cancel <AlertDialogPrimitive.Cancel
class={cn( class={cn(buttonVariants({ variant: 'outline' }), 'mt-2 sm:mt-0', className)}
buttonVariants({ variant: "outline" }),
"mt-2 sm:mt-0",
className
)}
{...$$restProps} {...$$restProps}
on:click on:click
on:keydown on:keydown
let:builder let:builder>
>
<slot {builder} /> <slot {builder} />
</AlertDialogPrimitive.Cancel> </AlertDialogPrimitive.Cancel>

@ -1,15 +1,15 @@
<script lang="ts"> <script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui"; import { AlertDialog as AlertDialogPrimitive } from 'bits-ui'
import * as AlertDialog from "."; import * as AlertDialog from '.'
import { cn, flyAndScale } from "$lib/utils"; import { cn, flyAndScale } from '$lib/utils'
type $$Props = AlertDialogPrimitive.ContentProps; type $$Props = AlertDialogPrimitive.ContentProps
export let transition: $$Props["transition"] = flyAndScale; export let transition: $$Props['transition'] = flyAndScale
export let transitionConfig: $$Props["transitionConfig"] = undefined; export let transitionConfig: $$Props['transitionConfig'] = undefined
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<AlertDialog.Portal> <AlertDialog.Portal>
@ -18,11 +18,10 @@
{transition} {transition}
{transitionConfig} {transitionConfig}
class={cn( class={cn(
"fixed left-[50%] top-[50%] translate-x-[-50%] translate-y-[-50%] z-50 grid w-full max-w-lg gap-4 border bg-background p-6 shadow-lg sm:rounded-lg md:w-full", '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 sm:rounded-lg md:w-full',
className className,
)} )}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</AlertDialogPrimitive.Content> </AlertDialogPrimitive.Content>
</AlertDialog.Portal> </AlertDialog.Portal>

@ -1,16 +1,15 @@
<script lang="ts"> <script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui"; import { AlertDialog as AlertDialogPrimitive } from 'bits-ui'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
type $$Props = AlertDialogPrimitive.DescriptionProps; type $$Props = AlertDialogPrimitive.DescriptionProps
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<AlertDialogPrimitive.Description <AlertDialogPrimitive.Description
class={cn("text-sm text-muted-foreground", className)} class={cn('text-sm text-muted-foreground', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</AlertDialogPrimitive.Description> </AlertDialogPrimitive.Description>

@ -1,19 +1,18 @@
<script lang="ts"> <script lang="ts">
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from 'svelte/elements'
type $$Props = HTMLAttributes<HTMLDivElement>; type $$Props = HTMLAttributes<HTMLDivElement>
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<div <div
class={cn( class={cn(
"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", 'flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',
className className,
)} )}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</div> </div>

@ -1,16 +1,15 @@
<script lang="ts"> <script lang="ts">
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from 'svelte/elements'
type $$Props = HTMLAttributes<HTMLDivElement>; type $$Props = HTMLAttributes<HTMLDivElement>
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<div <div
class={cn("flex flex-col space-y-2 text-center sm:text-left", className)} class={cn('flex flex-col space-y-2 text-center sm:text-left', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</div> </div>

@ -1,24 +1,20 @@
<script lang="ts"> <script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui"; import { AlertDialog as AlertDialogPrimitive } from 'bits-ui'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
import { fade } from "svelte/transition"; import { fade } from 'svelte/transition'
type $$Props = AlertDialogPrimitive.OverlayProps; type $$Props = AlertDialogPrimitive.OverlayProps
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export let transition: $$Props["transition"] = fade; export let transition: $$Props['transition'] = fade
export let transitionConfig: $$Props["transitionConfig"] = { export let transitionConfig: $$Props['transitionConfig'] = {
duration: 150 duration: 150,
}; }
export { className as class }; export { className as class }
</script> </script>
<AlertDialogPrimitive.Overlay <AlertDialogPrimitive.Overlay
{transition} {transition}
{transitionConfig} {transitionConfig}
class={cn( class={cn('fixed inset-0 z-50 bg-background/80 backdrop-blur-sm ', className)}
"fixed inset-0 z-50 bg-background/80 backdrop-blur-sm ", {...$$restProps} />
className
)}
{...$$restProps}
/>

@ -1,7 +1,7 @@
<script lang="ts"> <script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui"; import { AlertDialog as AlertDialogPrimitive } from 'bits-ui'
type $$Props = AlertDialogPrimitive.PortalProps; type $$Props = AlertDialogPrimitive.PortalProps
</script> </script>
<AlertDialogPrimitive.Portal {...$$restProps}> <AlertDialogPrimitive.Portal {...$$restProps}>

@ -1,18 +1,17 @@
<script lang="ts"> <script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui"; import { AlertDialog as AlertDialogPrimitive } from 'bits-ui'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
type $$Props = AlertDialogPrimitive.TitleProps; type $$Props = AlertDialogPrimitive.TitleProps
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export let level: $$Props["level"] = "h3"; export let level: $$Props['level'] = 'h3'
export { className as class }; export { className as class }
</script> </script>
<AlertDialogPrimitive.Title <AlertDialogPrimitive.Title
class={cn("text-lg font-semibold", className)} class={cn('text-lg font-semibold', className)}
{level} {level}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</AlertDialogPrimitive.Title> </AlertDialogPrimitive.Title>

@ -1,17 +1,17 @@
import { AlertDialog as AlertDialogPrimitive } from "bits-ui"; import { AlertDialog as AlertDialogPrimitive } from 'bits-ui'
const Root = AlertDialogPrimitive.Root; const Root = AlertDialogPrimitive.Root
const Trigger = AlertDialogPrimitive.Trigger; const Trigger = AlertDialogPrimitive.Trigger
import Title from "./alert-dialog-title.svelte"; import Title from './alert-dialog-title.svelte'
import Action from "./alert-dialog-action.svelte"; import Action from './alert-dialog-action.svelte'
import Cancel from "./alert-dialog-cancel.svelte"; import Cancel from './alert-dialog-cancel.svelte'
import Portal from "./alert-dialog-portal.svelte"; import Portal from './alert-dialog-portal.svelte'
import Footer from "./alert-dialog-footer.svelte"; import Footer from './alert-dialog-footer.svelte'
import Header from "./alert-dialog-header.svelte"; import Header from './alert-dialog-header.svelte'
import Overlay from "./alert-dialog-overlay.svelte"; import Overlay from './alert-dialog-overlay.svelte'
import Content from "./alert-dialog-content.svelte"; import Content from './alert-dialog-content.svelte'
import Description from "./alert-dialog-description.svelte"; import Description from './alert-dialog-description.svelte'
export { export {
Root, Root,
@ -36,5 +36,5 @@ export {
Trigger as AlertDialogTrigger, Trigger as AlertDialogTrigger,
Overlay as AlertDialogOverlay, Overlay as AlertDialogOverlay,
Content as AlertDialogContent, Content as AlertDialogContent,
Description as AlertDialogDescription Description as AlertDialogDescription,
}; }

@ -13,7 +13,6 @@
'flex h-full w-full items-center justify-center rounded-full bg-muted', 'flex h-full w-full items-center justify-center rounded-full bg-muted',
className, className,
)} )}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</AvatarPrimitive.Fallback> </AvatarPrimitive.Fallback>

@ -14,5 +14,4 @@
{src} {src}
{alt} {alt}
class={cn('aspect-square h-full w-full', className)} class={cn('aspect-square h-full w-full', className)}
{...$$restProps} {...$$restProps} />
/>

@ -15,7 +15,6 @@
'relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full', 'relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full',
className, className,
)} )}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</AvatarPrimitive.Root> </AvatarPrimitive.Root>

@ -19,7 +19,6 @@
type="button" type="button"
{...$$restProps} {...$$restProps}
on:click on:click
on:keydown on:keydown>
>
<slot /> <slot />
</ButtonPrimitive.Root> </ButtonPrimitive.Root>

@ -1,13 +1,13 @@
<script lang="ts"> <script lang="ts">
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from 'svelte/elements'
type $$Props = HTMLAttributes<HTMLDivElement>; type $$Props = HTMLAttributes<HTMLDivElement>
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<div class={cn("p-6 pt-0", className)} {...$$restProps}> <div class={cn('p-6 pt-0', className)} {...$$restProps}>
<slot /> <slot />
</div> </div>

@ -1,13 +1,13 @@
<script lang="ts"> <script lang="ts">
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from 'svelte/elements'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
type $$Props = HTMLAttributes<HTMLParagraphElement>; type $$Props = HTMLAttributes<HTMLParagraphElement>
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<p class={cn("text-sm text-muted-foreground", className)} {...$$restProps}> <p class={cn('text-sm text-muted-foreground', className)} {...$$restProps}>
<slot /> <slot />
</p> </p>

@ -1,13 +1,13 @@
<script lang="ts"> <script lang="ts">
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from 'svelte/elements'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
type $$Props = HTMLAttributes<HTMLDivElement>; type $$Props = HTMLAttributes<HTMLDivElement>
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<div class={cn("flex items-center p-6 pt-0", className)} {...$$restProps}> <div class={cn('flex items-center p-6 pt-0', className)} {...$$restProps}>
<slot /> <slot />
</div> </div>

@ -1,13 +1,13 @@
<script lang="ts"> <script lang="ts">
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from 'svelte/elements'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
type $$Props = HTMLAttributes<HTMLDivElement>; type $$Props = HTMLAttributes<HTMLDivElement>
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<div class={cn("flex flex-col space-y-1.5 p-6", className)} {...$$restProps}> <div class={cn('flex flex-col space-y-1.5 p-6', className)} {...$$restProps}>
<slot /> <slot />
</div> </div>

@ -1,21 +1,20 @@
<script lang="ts"> <script lang="ts">
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from 'svelte/elements'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
import type { HeadingLevel } from "."; import type { HeadingLevel } from '.'
type $$Props = HTMLAttributes<HTMLHeadingElement> & { type $$Props = HTMLAttributes<HTMLHeadingElement> & {
tag?: HeadingLevel; tag?: HeadingLevel
}; }
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export let tag: $$Props["tag"] = "h3"; export let tag: $$Props['tag'] = 'h3'
export { className as class }; export { className as class }
</script> </script>
<svelte:element <svelte:element
this={tag} this={tag}
class={cn("text-lg font-semibold leading-none tracking-tight", className)} class={cn('text-lg font-semibold leading-none tracking-tight', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</svelte:element> </svelte:element>

@ -1,19 +1,18 @@
<script lang="ts"> <script lang="ts">
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from 'svelte/elements'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
type $$Props = HTMLAttributes<HTMLDivElement>; type $$Props = HTMLAttributes<HTMLDivElement>
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<div <div
class={cn( class={cn(
"rounded-lg border bg-card text-card-foreground shadow-sm", 'rounded-lg border bg-card text-card-foreground shadow-sm',
className className,
)} )}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</div> </div>

@ -1,9 +1,9 @@
import Root from "./card.svelte"; import Root from './card.svelte'
import Content from "./card-content.svelte"; import Content from './card-content.svelte'
import Description from "./card-description.svelte"; import Description from './card-description.svelte'
import Footer from "./card-footer.svelte"; import Footer from './card-footer.svelte'
import Header from "./card-header.svelte"; import Header from './card-header.svelte'
import Title from "./card-title.svelte"; import Title from './card-title.svelte'
export { export {
Root, Root,
@ -18,7 +18,7 @@ export {
Description as CardDescription, Description as CardDescription,
Footer as CardFooter, Footer as CardFooter,
Header as CardHeader, Header as CardHeader,
Title as CardTitle Title as CardTitle,
}; }
export type HeadingLevel = "h1" | "h2" | "h3" | "h4" | "h5" | "h6"; export type HeadingLevel = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'

@ -18,13 +18,11 @@
)} )}
bind:checked bind:checked
{...$$restProps} {...$$restProps}
on:click on:click>
>
<CheckboxPrimitive.Indicator <CheckboxPrimitive.Indicator
class={cn('flex h-4 w-4 items-center justify-center text-current')} class={cn('flex h-4 w-4 items-center justify-center text-current')}
let:isChecked let:isChecked
let:isIndeterminate let:isIndeterminate>
>
{#if isChecked} {#if isChecked}
<Check class="h-3.5 w-3.5" /> <Check class="h-3.5 w-3.5" />
{:else if isIndeterminate} {:else if isIndeterminate}

@ -1,17 +1,17 @@
<script lang="ts"> <script lang="ts">
import { Dialog as DialogPrimitive } from "bits-ui"; import { Dialog as DialogPrimitive } from 'bits-ui'
import * as Dialog from "."; import * as Dialog from '.'
import { cn, flyAndScale } from "$lib/utils"; import { cn, flyAndScale } from '$lib/utils'
import { X } from "lucide-svelte"; import { X } from 'lucide-svelte'
type $$Props = DialogPrimitive.ContentProps; type $$Props = DialogPrimitive.ContentProps
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export let transition: $$Props["transition"] = flyAndScale; export let transition: $$Props['transition'] = flyAndScale
export let transitionConfig: $$Props["transitionConfig"] = { export let transitionConfig: $$Props['transitionConfig'] = {
duration: 200 duration: 200,
}; }
export { className as class }; export { className as class }
</script> </script>
<Dialog.Portal> <Dialog.Portal>
@ -20,15 +20,13 @@
{transition} {transition}
{transitionConfig} {transitionConfig}
class={cn( class={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 sm:rounded-lg md:w-full", '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 sm:rounded-lg md:w-full',
className className,
)} )}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
<DialogPrimitive.Close <DialogPrimitive.Close
class="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground" class="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
>
<X class="h-4 w-4" /> <X class="h-4 w-4" />
<span class="sr-only">Close</span> <span class="sr-only">Close</span>
</DialogPrimitive.Close> </DialogPrimitive.Close>

@ -1,16 +1,15 @@
<script lang="ts"> <script lang="ts">
import { Dialog as DialogPrimitive } from "bits-ui"; import { Dialog as DialogPrimitive } from 'bits-ui'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
type $$Props = DialogPrimitive.DescriptionProps; type $$Props = DialogPrimitive.DescriptionProps
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<DialogPrimitive.Description <DialogPrimitive.Description
class={cn("text-sm text-muted-foreground", className)} class={cn('text-sm text-muted-foreground', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</DialogPrimitive.Description> </DialogPrimitive.Description>

@ -1,19 +1,18 @@
<script lang="ts"> <script lang="ts">
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from 'svelte/elements'
type $$Props = HTMLAttributes<HTMLDivElement>; type $$Props = HTMLAttributes<HTMLDivElement>
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<div <div
class={cn( class={cn(
"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", 'flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',
className className,
)} )}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</div> </div>

@ -1,16 +1,15 @@
<script lang="ts"> <script lang="ts">
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from 'svelte/elements'
type $$Props = HTMLAttributes<HTMLDivElement>; type $$Props = HTMLAttributes<HTMLDivElement>
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<div <div
class={cn("flex flex-col space-y-1.5 text-center sm:text-left", className)} class={cn('flex flex-col space-y-1.5 text-center sm:text-left', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</div> </div>

@ -1,24 +1,20 @@
<script lang="ts"> <script lang="ts">
import { Dialog as DialogPrimitive } from "bits-ui"; import { Dialog as DialogPrimitive } from 'bits-ui'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
import { fade } from "svelte/transition"; import { fade } from 'svelte/transition'
type $$Props = DialogPrimitive.OverlayProps; type $$Props = DialogPrimitive.OverlayProps
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export let transition: $$Props["transition"] = fade; export let transition: $$Props['transition'] = fade
export let transitionConfig: $$Props["transitionConfig"] = { export let transitionConfig: $$Props['transitionConfig'] = {
duration: 150 duration: 150,
}; }
export { className as class }; export { className as class }
</script> </script>
<DialogPrimitive.Overlay <DialogPrimitive.Overlay
{transition} {transition}
{transitionConfig} {transitionConfig}
class={cn( class={cn('fixed inset-0 z-50 bg-background/80 backdrop-blur-sm', className)}
"fixed inset-0 z-50 bg-background/80 backdrop-blur-sm", {...$$restProps} />
className
)}
{...$$restProps}
/>

@ -1,6 +1,6 @@
<script lang="ts"> <script lang="ts">
import { Dialog as DialogPrimitive } from "bits-ui"; import { Dialog as DialogPrimitive } from 'bits-ui'
type $$Props = DialogPrimitive.PortalProps; type $$Props = DialogPrimitive.PortalProps
</script> </script>
<DialogPrimitive.Portal {...$$restProps}> <DialogPrimitive.Portal {...$$restProps}>

@ -1,16 +1,15 @@
<script lang="ts"> <script lang="ts">
import { Dialog as DialogPrimitive } from "bits-ui"; import { Dialog as DialogPrimitive } from 'bits-ui'
import { cn } from "$lib/utils"; import { cn } from '$lib/utils'
type $$Props = DialogPrimitive.TitleProps; type $$Props = DialogPrimitive.TitleProps
let className: $$Props["class"] = undefined; let className: $$Props['class'] = undefined
export { className as class }; export { className as class }
</script> </script>
<DialogPrimitive.Title <DialogPrimitive.Title
class={cn("text-lg font-semibold leading-none tracking-tight", className)} class={cn('text-lg font-semibold leading-none tracking-tight', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</DialogPrimitive.Title> </DialogPrimitive.Title>

@ -1,15 +1,15 @@
import { Dialog as DialogPrimitive } from "bits-ui"; import { Dialog as DialogPrimitive } from 'bits-ui'
const Root = DialogPrimitive.Root; const Root = DialogPrimitive.Root
const Trigger = DialogPrimitive.Trigger; const Trigger = DialogPrimitive.Trigger
import Title from "./dialog-title.svelte"; import Title from './dialog-title.svelte'
import Portal from "./dialog-portal.svelte"; import Portal from './dialog-portal.svelte'
import Footer from "./dialog-footer.svelte"; import Footer from './dialog-footer.svelte'
import Header from "./dialog-header.svelte"; import Header from './dialog-header.svelte'
import Overlay from "./dialog-overlay.svelte"; import Overlay from './dialog-overlay.svelte'
import Content from "./dialog-content.svelte"; import Content from './dialog-content.svelte'
import Description from "./dialog-description.svelte"; import Description from './dialog-description.svelte'
export { export {
Root, Root,
@ -30,5 +30,5 @@ export {
Trigger as DialogTrigger, Trigger as DialogTrigger,
Overlay as DialogOverlay, Overlay as DialogOverlay,
Content as DialogContent, Content as DialogContent,
Description as DialogDescription Description as DialogDescription,
}; }

@ -24,8 +24,7 @@
on:focusout on:focusout
on:pointerdown on:pointerdown
on:pointerleave on:pointerleave
on:pointermove on:pointermove>
>
<span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center"> <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
<DropdownMenuPrimitive.CheckboxIndicator> <DropdownMenuPrimitive.CheckboxIndicator>
<Check class="h-4 w-4" /> <Check class="h-4 w-4" />

@ -19,7 +19,6 @@
className, className,
)} )}
{...$$restProps} {...$$restProps}
on:keydown on:keydown>
>
<slot /> <slot />
</DropdownMenuPrimitive.Content> </DropdownMenuPrimitive.Content>

@ -25,7 +25,6 @@
on:focusout on:focusout
on:pointerdown on:pointerdown
on:pointerleave on:pointerleave
on:pointermove on:pointermove>
>
<slot /> <slot />
</DropdownMenuPrimitive.Item> </DropdownMenuPrimitive.Item>

@ -13,7 +13,6 @@
<DropdownMenuPrimitive.Label <DropdownMenuPrimitive.Label
class={cn('px-2 py-1.5 text-sm font-semibold', inset && 'pl-8', className)} class={cn('px-2 py-1.5 text-sm font-semibold', inset && 'pl-8', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</DropdownMenuPrimitive.Label> </DropdownMenuPrimitive.Label>

@ -24,8 +24,7 @@
on:focusout on:focusout
on:pointerdown on:pointerdown
on:pointerleave on:pointerleave
on:pointermove on:pointermove>
>
<span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center"> <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
<DropdownMenuPrimitive.RadioIndicator> <DropdownMenuPrimitive.RadioIndicator>
<Circle class="h-2 w-2 fill-current" /> <Circle class="h-2 w-2 fill-current" />

@ -10,5 +10,4 @@
<DropdownMenuPrimitive.Separator <DropdownMenuPrimitive.Separator
class={cn('-mx-1 my-1 h-px bg-muted', className)} class={cn('-mx-1 my-1 h-px bg-muted', className)}
{...$$restProps} {...$$restProps} />
/>

@ -10,7 +10,6 @@
<span <span
class={cn('ml-auto text-xs tracking-widest opacity-60', className)} class={cn('ml-auto text-xs tracking-widest opacity-60', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</span> </span>

@ -24,7 +24,6 @@
{...$$restProps} {...$$restProps}
on:keydown on:keydown
on:focusout on:focusout
on:pointermove on:pointermove>
>
<slot /> <slot />
</DropdownMenuPrimitive.SubContent> </DropdownMenuPrimitive.SubContent>

@ -25,8 +25,7 @@
on:focusin on:focusin
on:focusout on:focusout
on:pointerleave on:pointerleave
on:pointermove on:pointermove>
>
<slot /> <slot />
<ChevronRight class="ml-auto h-4 w-4" /> <ChevronRight class="ml-auto h-4 w-4" />
</DropdownMenuPrimitive.SubTrigger> </DropdownMenuPrimitive.SubTrigger>

@ -21,6 +21,5 @@
}} }}
{...$$restProps} {...$$restProps}
on:click on:click
on:keydown on:keydown />
/>
<input hidden {name} value={$value} /> <input hidden {name} value={$value} />

@ -10,7 +10,6 @@
<FormPrimitive.Description <FormPrimitive.Description
class={cn('text-sm text-muted-foreground', className)} class={cn('text-sm text-muted-foreground', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</FormPrimitive.Description> </FormPrimitive.Description>

@ -24,5 +24,4 @@
on:mouseenter on:mouseenter
on:mouseleave on:mouseleave
on:paste on:paste
on:input on:input />
/>

@ -15,7 +15,6 @@
<Label <Label
for={$ids.input} for={$ids.input}
class={cn($errors && 'text-destructive', className)} class={cn($errors && 'text-destructive', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</Label> </Label>

@ -17,8 +17,7 @@
'appearance-none bg-transparent font-normal', 'appearance-none bg-transparent font-normal',
className, className,
)} )}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</FormPrimitive.Select> </FormPrimitive.Select>
<ChevronDown class="absolute right-3 top-2.5 h-4 w-4 opacity-50" /> <ChevronDown class="absolute right-3 top-2.5 h-4 w-4 opacity-50" />

@ -15,8 +15,7 @@
onValueChange?.(v) onValueChange?.(v)
setValue(v) setValue(v)
}} }}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
<input hidden {name} value={$value} /> <input hidden {name} value={$value} />
</RadioGroup.Root> </RadioGroup.Root>

@ -13,8 +13,7 @@
onSelectedChange?.(v) onSelectedChange?.(v)
setValue(v ? v.value : undefined) setValue(v ? v.value : undefined)
}} }}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
<input hidden {name} value={$value} /> <input hidden {name} value={$value} />
</Select.Root> </Select.Root>

@ -19,6 +19,5 @@
}} }}
{...$$restProps} {...$$restProps}
on:click on:click
on:keydown on:keydown />
/>
<input hidden {name} value={$value} /> <input hidden {name} value={$value} />

@ -25,5 +25,4 @@
on:mouseenter on:mouseenter
on:mouseleave on:mouseleave
on:paste on:paste
on:input on:input />
/>

@ -10,5 +10,4 @@
<FormPrimitive.Validation <FormPrimitive.Validation
class={cn('text-sm font-medium text-destructive', className)} class={cn('text-sm font-medium text-destructive', className)}
{...$$restProps} {...$$restProps} />
/>

@ -29,5 +29,4 @@
on:mouseleave on:mouseleave
on:paste on:paste
on:input on:input
{...$$restProps} {...$$restProps} />
/>

@ -15,7 +15,6 @@
className, className,
)} )}
{...$$restProps} {...$$restProps}
on:mousedown on:mousedown>
>
<slot /> <slot />
</LabelPrimitive.Root> </LabelPrimitive.Root>

@ -18,8 +18,7 @@
className, className,
)} )}
{...$$restProps} {...$$restProps}
on:click on:click>
>
<div class="flex items-center justify-center"> <div class="flex items-center justify-center">
<RadioGroupPrimitive.ItemIndicator> <RadioGroupPrimitive.ItemIndicator>
<Circle class="h-2.5 w-2.5 fill-current text-current" /> <Circle class="h-2.5 w-2.5 fill-current text-current" />

@ -12,7 +12,6 @@
<RadioGroupPrimitive.Root <RadioGroupPrimitive.Root
bind:value bind:value
class={cn('grid gap-2', className)} class={cn('grid gap-2', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</RadioGroupPrimitive.Root> </RadioGroupPrimitive.Root>

@ -28,8 +28,7 @@
className, className,
)} )}
{...$$restProps} {...$$restProps}
on:keydown on:keydown>
>
<div class="w-full p-1"> <div class="w-full p-1">
<slot /> <slot />
</div> </div>

@ -27,8 +27,7 @@
on:focusin on:focusin
on:focusout on:focusout
on:pointerleave on:pointerleave
on:pointermove on:pointermove>
>
<span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center"> <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
<SelectPrimitive.ItemIndicator> <SelectPrimitive.ItemIndicator>
<Check class="h-4 w-4" /> <Check class="h-4 w-4" />

@ -10,7 +10,6 @@
<SelectPrimitive.Label <SelectPrimitive.Label
class={cn('py-1.5 pl-8 pr-2 text-sm font-semibold', className)} class={cn('py-1.5 pl-8 pr-2 text-sm font-semibold', className)}
{...$$restProps} {...$$restProps}>
>
<slot /> <slot />
</SelectPrimitive.Label> </SelectPrimitive.Label>

@ -10,5 +10,4 @@
<SelectPrimitive.Separator <SelectPrimitive.Separator
class={cn('-mx-1 my-1 h-px bg-muted', className)} class={cn('-mx-1 my-1 h-px bg-muted', className)}
{...$$restProps} {...$$restProps} />
/>

@ -18,8 +18,7 @@
{...$$restProps} {...$$restProps}
let:builder let:builder
on:click on:click
on:keydown on:keydown>
>
<slot {builder} /> <slot {builder} />
<div> <div>
<ChevronDown class="h-4 w-4 opacity-50" /> <ChevronDown class="h-4 w-4 opacity-50" />

@ -18,5 +18,4 @@
)} )}
{orientation} {orientation}
{decorative} {decorative}
{...$$restProps} {...$$restProps} />
/>

@ -15,11 +15,9 @@
'peer inline-flex h-[24px] w-[44px] shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input', 'peer inline-flex h-[24px] w-[44px] shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input',
className, className,
)} )}
{...$$restProps} {...$$restProps}>
>
<SwitchPrimitive.Thumb <SwitchPrimitive.Thumb
class={cn( class={cn(
'pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0', 'pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0',
)} )} />
/>
</SwitchPrimitive.Root> </SwitchPrimitive.Root>

@ -27,5 +27,4 @@
on:mouseleave on:mouseleave
on:paste on:paste
on:input on:input
{...$$restProps} {...$$restProps} />
/>

@ -0,0 +1,5 @@
import type { LayoutServerLoad } from './$types'
export const load = (async () => {
return { shortener_url: process.env.SHORTENER_URL ?? 's.tzgyn.com' }
}) satisfies LayoutServerLoad

@ -6,7 +6,7 @@
import * as Card from '$lib/components/ui/card' import * as Card from '$lib/components/ui/card'
import { Input } from '$lib/components/ui/input' import { Input } from '$lib/components/ui/input'
import { Label } from '$lib/components/ui/label' import { Label } from '$lib/components/ui/label'
import { Loader2, PlusCircle } from 'lucide-svelte' import { Link2, Loader2, PlusCircle } from 'lucide-svelte'
import { invalidateAll } from '$app/navigation' import { invalidateAll } from '$app/navigation'
export let data: PageData export let data: PageData
@ -33,8 +33,7 @@
<div class="text-4xl font-bold">Links</div> <div class="text-4xl font-bold">Links</div>
<Dialog.Root bind:open={dialogOpen}> <Dialog.Root bind:open={dialogOpen}>
<Dialog.Trigger <Dialog.Trigger
class={buttonVariants({ variant: 'default' }) + 'flex gap-2'} class={buttonVariants({ variant: 'default' }) + 'flex gap-2'}>
>
<PlusCircle /> <PlusCircle />
Add Shortner Add Shortner
</Dialog.Trigger> </Dialog.Trigger>
@ -56,8 +55,7 @@
{#if isLoading} {#if isLoading}
<Loader2 class="animate-spin" /> <Loader2 class="animate-spin" />
{/if} {/if}
Add</Button Add</Button>
>
</Dialog.Footer> </Dialog.Footer>
</Dialog.Content> </Dialog.Content>
</Dialog.Root> </Dialog.Root>

@ -18,24 +18,20 @@
</script> </script>
<div <div
class="container relative h-screen flex-col items-center justify-center md:grid lg:max-w-none lg:grid-cols-2 lg:px-0" class="container relative h-screen flex-col items-center justify-center md:grid lg:max-w-none lg:grid-cols-2 lg:px-0">
>
<div class="absolute right-4 top-4 md:right-8 md:top-8"> <div class="absolute right-4 top-4 md:right-8 md:top-8">
<ThemeToggle /> <ThemeToggle />
</div> </div>
<div <div
class="relative hidden h-full flex-col bg-primary-foreground p-10 text-white dark:border-r lg:flex" class="relative hidden h-full flex-col bg-primary-foreground p-10 text-white dark:border-r lg:flex">
>
<div <div
class="relative z-20 flex items-center text-lg font-medium text-primary" class="relative z-20 flex items-center text-lg font-medium text-primary">
>
Shortener Shortener
</div> </div>
</div> </div>
<div class="p-8"> <div class="p-8">
<div <div
class="mx-auto flex w-full flex-col justify-center space-y-6 sm:w-[350px]" class="mx-auto flex w-full flex-col justify-center space-y-6 sm:w-[350px]">
>
<div class="flex flex-col space-y-2 text-center"> <div class="flex flex-col space-y-2 text-center">
<h1 class="text-2xl font-semibold tracking-tight"> <h1 class="text-2xl font-semibold tracking-tight">
Login to your account Login to your account
@ -49,8 +45,7 @@
Don't Have An Account? Signup{' '} Don't Have An Account? Signup{' '}
<a <a
href="/signup" href="/signup"
class="underline underline-offset-4 hover:text-primary" class="underline underline-offset-4 hover:text-primary">
>
Here Here
</a> </a>
</p> </p>

@ -7,24 +7,20 @@
</script> </script>
<div <div
class="container relative h-screen flex-col items-center justify-center md:grid lg:max-w-none lg:grid-cols-2 lg:px-0" class="container relative h-screen flex-col items-center justify-center md:grid lg:max-w-none lg:grid-cols-2 lg:px-0">
>
<div class="absolute right-4 top-4 md:right-8 md:top-8"> <div class="absolute right-4 top-4 md:right-8 md:top-8">
<ThemeToggle /> <ThemeToggle />
</div> </div>
<div <div
class="relative hidden h-full flex-col bg-primary-foreground p-10 text-white dark:border-r lg:flex" class="relative hidden h-full flex-col bg-primary-foreground p-10 text-white dark:border-r lg:flex">
>
<div <div
class="relative z-20 flex items-center text-lg font-medium text-primary" class="relative z-20 flex items-center text-lg font-medium text-primary">
>
Shortener Shortener
</div> </div>
</div> </div>
<div class="p-8"> <div class="p-8">
<div <div
class="mx-auto flex w-full flex-col justify-center space-y-6 sm:w-[350px]" class="mx-auto flex w-full flex-col justify-center space-y-6 sm:w-[350px]">
>
<div class="flex flex-col space-y-2 text-center"> <div class="flex flex-col space-y-2 text-center">
<h1 class="text-2xl font-semibold tracking-tight">Create an account</h1> <h1 class="text-2xl font-semibold tracking-tight">Create an account</h1>
<p class="text-sm text-muted-foreground"> <p class="text-sm text-muted-foreground">
@ -36,8 +32,7 @@
Already Have An Account? Login{' '} Already Have An Account? Login{' '}
<a <a
href="/login" href="/login"
class="underline underline-offset-4 hover:text-primary" class="underline underline-offset-4 hover:text-primary">
>
Here Here
</a>{' '} </a>{' '}
</p> </p>

Loading…
Cancel
Save