- simplify imports

- update translations
- convert image to base64 before sending to printer
- update development docs

src/components/command-palette/index.tsx

@@ -1,13 +1,7 @@
 import { Trans } from "@lingui/react/macro";
 import { useRef } from "react";
 import { useHotkeys } from "react-hotkeys-hook";
-import {
-	Dialog,
-	DialogContent,
-	DialogDescription,
-	DialogHeader,
-	DialogTitle,
-} from "@/components/animate-ui/components/radix/dialog";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog";
 import { Command, CommandEmpty, CommandInput, CommandList } from "../ui/command";
 import { NavigationCommandGroup } from "./pages/navigation";
 import { PreferencesCommandGroup } from "./pages/preferences";

src/components/input/color-picker.tsx

@@ -1,8 +1,8 @@
 import { EyedropperIcon } from "@phosphor-icons/react";
 import { Slider as SliderPrimitive, Slot as SlotPrimitive } from "radix-ui";
 import * as React from "react";
-import { Button } from "@/components/animate-ui/components/buttons/button";
 import { VisuallyHiddenInput } from "@/components/input/visually-hidden-input";
+import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
 import {
@@ -826,6 +826,4 @@ export {
 	ColorPickerSwatch as Swatch,
 	ColorPickerEyeDropper as EyeDropper,
 	ColorPickerInput as Input,
-	//
-	useColorPickerStore as useColorPicker,
 };

src/components/input/github-stars-button.tsx

@@ -1,7 +1,7 @@
 import { t } from "@lingui/core/macro";
 import { GithubLogoIcon, StarIcon } from "@phosphor-icons/react";
 import { useQuery } from "@tanstack/react-query";
-import { Button } from "@/components/animate-ui/components/buttons/button";
+import { Button } from "@/components/ui/button";
 import { orpc } from "@/integrations/orpc/client";
 import { CountUp } from "../animation/count-up";
 

src/components/input/icon-picker.tsx

@@ -3,7 +3,7 @@ import { ProhibitIcon } from "@phosphor-icons/react";
 import Fuse from "fuse.js";
 import { memo, useCallback, useMemo, useState } from "react";
 import { type CellComponentProps, Grid } from "react-window";
-import { Button } from "@/components/animate-ui/components/buttons/button";
+import { Button } from "@/components/ui/button";
 import { type IconName, icons } from "@/schema/icons";
 import { cn } from "@/utils/style";
 import { Input } from "../ui/input";

src/components/input/rich-input.tsx

@@ -52,7 +52,7 @@ import { useMemo } from "react";
 import { toast } from "sonner";
 import { match } from "ts-pattern";
 import z from "zod";
-import { Button } from "@/components/animate-ui/components/buttons/button";
+import { Button } from "@/components/ui/button";
 import {
 	DropdownMenu,
 	DropdownMenuCheckboxItem,
@@ -60,7 +60,7 @@ import {
 	DropdownMenuItem,
 	DropdownMenuSeparator,
 	DropdownMenuTrigger,
-} from "@/components/animate-ui/components/radix/dropdown-menu";
+} from "@/components/ui/dropdown-menu";
 import { usePrompt } from "@/hooks/use-prompt";
 import { isRTL } from "@/utils/locale";
 import { sanitizeHtml } from "@/utils/sanitize";

src/components/layout/error-screen.tsx

@@ -1,7 +1,7 @@
 import { Trans } from "@lingui/react/macro";
 import { ArrowClockwiseIcon, WarningIcon } from "@phosphor-icons/react";
 import type { ErrorComponentProps } from "@tanstack/react-router";
-import { Button } from "@/components/animate-ui/components/buttons/button";
+import { Button } from "@/components/ui/button";
 import { Alert, AlertDescription, AlertTitle } from "../ui/alert";
 import { BrandIcon } from "../ui/brand-icon";
 

src/components/layout/not-found-screen.tsx

@@ -1,7 +1,7 @@
 import { Trans } from "@lingui/react/macro";
 import { ArrowLeftIcon, WarningIcon } from "@phosphor-icons/react";
 import { Link, type NotFoundRouteProps } from "@tanstack/react-router";
-import { Button } from "@/components/animate-ui/components/buttons/button";
+import { Button } from "@/components/ui/button";
 import { Alert, AlertDescription, AlertTitle } from "../ui/alert";
 import { BrandIcon } from "../ui/brand-icon";
 

src/components/level/combobox.tsx

@@ -5,7 +5,7 @@ import type z from "zod";
 import { levelDesignSchema } from "@/schema/resume/data";
 import { Combobox, type ComboboxProps } from "../ui/combobox";
 
-export type LevelType = z.infer<typeof levelDesignSchema>["type"];
+type LevelType = z.infer<typeof levelDesignSchema>["type"];
 
 type LevelTypeComboboxProps = Omit<ComboboxProps, "options">;
 

src/components/primitives/button.tsx

@@ -1,5 +1,5 @@
 import { type HTMLMotionProps, motion } from "motion/react";
-import { Slot, type WithAsChild } from "@/components/animate-ui/primitives/animate/slot";
+import { Slot, type WithAsChild } from "@/components/primitives/slot";
 
 type ButtonProps = WithAsChild<
 	Omit<HTMLMotionProps<"button">, "children"> & {

src/components/resume/shared/get-section-component.tsx

@@ -178,9 +178,7 @@ export function getSectionComponent(
 				if (visibleItems.length === 0) return null;
 
 				return (
-					<section
-						className={cn(`page-section page-section-custom page-section-${id} wrap-break-word`, sectionClassName)}
-					>
+					<section className={cn(`page-section page-section-custom page-section-${id}`, sectionClassName)}>
 						<h6 className="mb-1 text-(--page-primary-color)">{customSection.title}</h6>
 
 						<div
@@ -188,10 +186,7 @@ export function getSectionComponent(
 							style={{ gridTemplateColumns: `repeat(${customSection.columns}, 1fr)` }}
 						>
 							{visibleItems.map((item) => (
-								<div
-									key={item.id}
-									className={cn(`section-item section-item-${customSection.type} wrap-break-word *:space-y-1`)}
-								>
+								<div key={item.id} className={cn(`section-item section-item-${customSection.type} *:space-y-1`)}>
 									{renderItemByType(customSection.type, item, itemClassName)}
 								</div>
 							))}

src/components/resume/shared/page-link.tsx

@@ -10,7 +10,7 @@ export function PageLink({ url, label, className }: Props) {
 	if (!url) return null;
 
 	return (
-		<a href={url} target="_blank" rel="noopener noreferrer" className={cn("block truncate", className)}>
+		<a href={url} target="_blank" rel="noopener noreferrer" className={cn("inline-block text-wrap", className)}>
 			{label || url}
 		</a>
 	);

src/components/resume/shared/page-section.tsx

@@ -26,7 +26,7 @@ export function PageSection<T extends SectionType>({ type, className, children }
 				style={{ gridTemplateColumns: `repeat(${section.columns}, 1fr)` }}
 			>
 				{items.map((item) => (
-					<div key={item.id} className={cn(`section-item section-item-${type} wrap-break-word *:space-y-1`)}>
+					<div key={item.id} className={cn(`section-item section-item-${type} *:space-y-1`)}>
 						{children(item)}
 					</div>
 				))}

src/components/resume/shared/page-summary.tsx

@@ -13,7 +13,7 @@ export function PageSummary({ className }: PageSummaryProps) {
 	return (
 		<section
 			className={cn(
-				"page-section page-section-summary wrap-break-word",
+				"page-section page-section-summary",
 				section.hidden && "hidden",
 				section.content === "" && "hidden",
 				className,

src/components/theme/toggle-button.tsx

@@ -2,7 +2,7 @@ import { t } from "@lingui/core/macro";
 import { MoonIcon, SunIcon } from "@phosphor-icons/react";
 import { useCallback, useRef } from "react";
 import { flushSync } from "react-dom";
-import { Button } from "@/components/animate-ui/components/buttons/button";
+import { Button } from "@/components/ui/button";
 import { useTheme } from "./provider";
 
 export function ThemeToggleButton(props: React.ComponentProps<typeof Button>) {

src/components/ui/accordion.tsx

@@ -8,7 +8,7 @@ import {
 	type AccordionProps as AccordionPrimitiveProps,
 	AccordionTrigger as AccordionTriggerPrimitive,
 	type AccordionTriggerProps as AccordionTriggerPrimitiveProps,
-} from "@/components/animate-ui/primitives/radix/accordion";
+} from "@/components/primitives/accordion";
 import { cn } from "@/utils/style";
 
 type AccordionProps = AccordionPrimitiveProps;
@@ -20,7 +20,7 @@ function Accordion(props: AccordionProps) {
 type AccordionItemProps = AccordionItemPrimitiveProps;
 
 function AccordionItem({ className, ...props }: AccordionItemProps) {
-	return <AccordionItemPrimitive className={cn("border-b last:border-b-0", className)} {...props} />;
+	return <AccordionItemPrimitive className={cn(className)} {...props} />;
 }
 
 type AccordionTriggerProps = AccordionTriggerPrimitiveProps;

src/components/ui/alert-dialog.tsx

@@ -1,4 +1,3 @@
-import { buttonVariants } from "@/components/animate-ui/components/buttons/button";
 import {
 	AlertDialogAction as AlertDialogActionPrimitive,
 	type AlertDialogActionProps as AlertDialogActionPrimitiveProps,
@@ -21,7 +20,8 @@ import {
 	type AlertDialogTitleProps as AlertDialogTitlePrimitiveProps,
 	AlertDialogTrigger as AlertDialogTriggerPrimitive,
 	type AlertDialogTriggerProps as AlertDialogTriggerPrimitiveProps,
-} from "@/components/animate-ui/primitives/radix/alert-dialog";
+} from "@/components/primitives/alert-dialog";
+import { buttonVariants } from "@/components/ui/button";
 import { cn } from "@/utils/style";
 
 type AlertDialogProps = AlertDialogPrimitiveProps;

src/components/ui/badge.tsx

@@ -36,4 +36,4 @@ function Badge({
 	);
 }
 
-export { Badge, badgeVariants };
+export { Badge };

src/components/ui/button-group.tsx

@@ -74,4 +74,4 @@ function ButtonGroupSeparator({
 	);
 }
 
-export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants };
+export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText };

src/components/ui/button.tsx

@@ -1,8 +1,5 @@
 import { cva, type VariantProps } from "class-variance-authority";
-import {
-	Button as ButtonPrimitive,
-	type ButtonProps as ButtonPrimitiveProps,
-} from "@/components/animate-ui/primitives/buttons/button";
+import { Button as ButtonPrimitive, type ButtonProps as ButtonPrimitiveProps } from "@/components/primitives/button";
 import { cn } from "@/utils/style";
 
 const buttonVariants = cva(

src/components/ui/combobox.tsx

@@ -1,7 +1,7 @@
 import { t } from "@lingui/core/macro";
 import { CaretUpDownIcon, CheckIcon } from "@phosphor-icons/react";
 import * as React from "react";
-import { Button } from "@/components/animate-ui/components/buttons/button";
+import { Button } from "@/components/ui/button";
 import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from "@/components/ui/command";
 import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
 import { useControlledState } from "@/hooks/use-controlled-state";

src/components/ui/command.tsx

@@ -1,13 +1,7 @@
 import { CheckIcon, MagnifyingGlassIcon } from "@phosphor-icons/react";
 import { Command as CommandPrimitive } from "cmdk";
 import type * as React from "react";
-import {
-	Dialog,
-	DialogContent,
-	DialogDescription,
-	DialogHeader,
-	DialogTitle,
-} from "@/components/animate-ui/components/radix/dialog";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog";
 import { InputGroup, InputGroupAddon } from "@/components/ui/input-group";
 import { cn } from "@/utils/style";
 

src/components/ui/dialog.tsx

@@ -18,7 +18,7 @@ import {
 	type DialogTitleProps as DialogTitlePrimitiveProps,
 	DialogTrigger as DialogTriggerPrimitive,
 	type DialogTriggerProps as DialogTriggerPrimitiveProps,
-} from "@/components/animate-ui/primitives/radix/dialog";
+} from "@/components/primitives/dialog";
 import { cn } from "@/utils/style";
 
 type DialogProps = DialogPrimitiveProps;

src/components/ui/dropdown-menu.tsx

@@ -29,7 +29,7 @@ import {
 	type DropdownMenuSubTriggerProps as DropdownMenuSubTriggerPrimitiveProps,
 	DropdownMenuTrigger as DropdownMenuTriggerPrimitive,
 	type DropdownMenuTriggerProps as DropdownMenuTriggerPrimitiveProps,
-} from "@/components/animate-ui/primitives/radix/dropdown-menu";
+} from "@/components/primitives/dropdown-menu";
 import { cn } from "@/utils/style";
 
 type DropdownMenuProps = DropdownMenuPrimitiveProps;

src/components/ui/form.tsx

@@ -152,4 +152,4 @@ function FormMessage({ className, ...props }: React.ComponentProps<"p">) {
 	);
 }
 
-export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField };
+export { Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField };

src/components/ui/input-group.tsx

@@ -1,6 +1,6 @@
 import { cva, type VariantProps } from "class-variance-authority";
 import type * as React from "react";
-import { Button } from "@/components/animate-ui/components/buttons/button";
+import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
 import { cn } from "@/utils/style";

src/components/ui/multiple-combobox.tsx

@@ -1,7 +1,7 @@
 import { t } from "@lingui/core/macro";
 import { CaretUpDownIcon, CheckIcon } from "@phosphor-icons/react";
 import * as React from "react";
-import { Button } from "@/components/animate-ui/components/buttons/button";
+import { Button } from "@/components/ui/button";
 import {
 	Command,
 	CommandEmpty,

src/components/ui/sheet.tsx

@@ -1,7 +1,7 @@
 import { XIcon } from "@phosphor-icons/react";
 import { Dialog as SheetPrimitive } from "radix-ui";
 import type * as React from "react";
-import { Button } from "@/components/animate-ui/components/buttons/button";
+import { Button } from "@/components/ui/button";
 import { cn } from "@/utils/style";
 
 function Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {

src/components/ui/sidebar.tsx

@@ -2,7 +2,7 @@ import { SidebarSimpleIcon } from "@phosphor-icons/react";
 import { cva, type VariantProps } from "class-variance-authority";
 import { Slot as SlotPrimitive } from "radix-ui";
 import * as React from "react";
-import { Button } from "@/components/animate-ui/components/buttons/button";
+import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Separator } from "@/components/ui/separator";
 import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle } from "@/components/ui/sheet";

src/components/ui/switch.tsx

@@ -5,7 +5,7 @@ import {
 	Switch as SwitchPrimitive,
 	type SwitchProps as SwitchPrimitiveProps,
 	SwitchThumb as SwitchThumbPrimitive,
-} from "@/components/animate-ui/primitives/radix/switch";
+} from "@/components/primitives/switch";
 import { cn } from "@/utils/style";
 
 type SwitchProps = SwitchPrimitiveProps & {

src/components/ui/toggle.tsx

@@ -35,4 +35,4 @@ function Toggle({
 	);
 }
 
-export { Toggle, toggleVariants };
+export { Toggle };

src/components/user/dropdown-menu.tsx

@@ -4,6 +4,7 @@ import { Trans } from "@lingui/react/macro";
 import { PaletteIcon, SignOutIcon, TranslateIcon } from "@phosphor-icons/react";
 import { useRouter } from "@tanstack/react-router";
 import { toast } from "sonner";
+import { useTheme } from "@/components/theme/provider";
 import {
 	DropdownMenu,
 	DropdownMenuContent,
@@ -16,8 +17,7 @@ import {
 	DropdownMenuSubContent,
 	DropdownMenuSubTrigger,
 	DropdownMenuTrigger,
-} from "@/components/animate-ui/components/radix/dropdown-menu";
-import { useTheme } from "@/components/theme/provider";
+} from "@/components/ui/dropdown-menu";
 import { authClient } from "@/integrations/auth/client";
 import type { AuthSession } from "@/integrations/auth/types";
 import { isLocale, loadLocale, localeMap, setLocaleServerFn } from "@/utils/locale";