Add svelte-sonner for notifications and enhance employee search functionality
- Integrated svelte-sonner for toast notifications in the layout. - Implemented server-side search for employees with pagination in the API. - Updated employee loading logic to support search queries and loading more results. - Enhanced employee detail view with navigation and improved UI interactions. - Adjusted cookie handling in hooks for PocketBase authentication.
This commit is contained in:
@@ -0,0 +1,46 @@
|
||||
<script lang="ts" module>
|
||||
import { cn, type WithElementRef } from "$lib/utils.js";
|
||||
import type { HTMLAttributes } from "svelte/elements";
|
||||
import { type VariantProps, tv } from "tailwind-variants";
|
||||
|
||||
export const badgeVariants = tv({
|
||||
base: "inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
|
||||
variants: {
|
||||
variant: {
|
||||
default:
|
||||
"border-transparent bg-primary text-primary-foreground shadow-xs hover:bg-primary/80",
|
||||
secondary:
|
||||
"border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
|
||||
destructive:
|
||||
"border-transparent bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/80",
|
||||
outline: "text-foreground border-input",
|
||||
link: "border-transparent bg-primary/10 text-primary hover:bg-primary/20",
|
||||
},
|
||||
},
|
||||
defaultVariants: {
|
||||
variant: "default",
|
||||
},
|
||||
});
|
||||
|
||||
export type BadgeVariant = VariantProps<typeof badgeVariants>["variant"];
|
||||
export type BadgeProps = WithElementRef<HTMLAttributes<HTMLSpanElement>> & {
|
||||
variant?: BadgeVariant;
|
||||
};
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
let {
|
||||
class: className,
|
||||
variant = "default",
|
||||
children,
|
||||
...restProps
|
||||
}: BadgeProps = $props();
|
||||
</script>
|
||||
|
||||
<span
|
||||
data-slot="badge"
|
||||
class={cn(badgeVariants({ variant }), className)}
|
||||
{...restProps}
|
||||
>
|
||||
{@render children?.()}
|
||||
</span>
|
||||
@@ -0,0 +1,15 @@
|
||||
import Root, {
|
||||
type BadgeProps,
|
||||
type BadgeVariant,
|
||||
badgeVariants,
|
||||
} from "./badge.svelte";
|
||||
|
||||
export {
|
||||
Root,
|
||||
type BadgeProps as Props,
|
||||
//
|
||||
Root as Badge,
|
||||
badgeVariants,
|
||||
type BadgeProps,
|
||||
type BadgeVariant,
|
||||
};
|
||||
Reference in New Issue
Block a user