eai-frontend-components 2.0.4

package/src/index.ts

@@ -0,0 +1,299 @@
+// =============================================================================
+// CORE UI COMPONENTS
+// =============================================================================
+
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from './components/ui/accordion';
+export { Alert, AlertDescription, AlertTitle } from './components/ui/alert';
+export {
+	AlertDialog,
+	AlertDialogAction,
+	AlertDialogCancel,
+	AlertDialogContent,
+	AlertDialogDescription,
+	AlertDialogFooter,
+	AlertDialogHeader,
+	AlertDialogTitle,
+	AlertDialogTrigger
+} from './components/ui/alert-dialog';
+export { Avatar, AvatarFallback, AvatarImage } from './components/ui/avatar';
+export { Badge, badgeVariants } from './components/ui/badge';
+export {
+	Breadcrumb,
+	BreadcrumbEllipsis,
+	BreadcrumbItem,
+	BreadcrumbLink,
+	BreadcrumbList,
+	BreadcrumbPage,
+	BreadcrumbSeparator
+} from './components/ui/breadcrumb';
+export { Button, buttonVariants } from './components/ui/button';
+export type { ButtonProps } from './components/ui/button';
+export { Calendar } from './components/ui/calendar';
+export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './components/ui/card';
+export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from './components/ui/carousel';
+export type { CarouselApi } from './components/ui/carousel';
+export { ChartContainer, ChartLegend, ChartLegendContent, ChartTooltip, ChartTooltipContent } from './components/ui/chart';
+export { Checkbox } from './components/ui/checkbox';
+export { Collapsible, CollapsibleContent, CollapsibleTrigger } from './components/ui/collapsible';
+export {
+	Command,
+	CommandDialog,
+	CommandEmpty,
+	CommandGroup,
+	CommandInput,
+	CommandItem,
+	CommandList,
+	CommandSeparator,
+	CommandShortcut
+} from './components/ui/command';
+export {
+	ContextMenu,
+	ContextMenuCheckboxItem,
+	ContextMenuContent,
+	ContextMenuGroup,
+	ContextMenuItem,
+	ContextMenuLabel,
+	ContextMenuPortal,
+	ContextMenuRadioGroup,
+	ContextMenuRadioItem,
+	ContextMenuSeparator,
+	ContextMenuShortcut,
+	ContextMenuSub,
+	ContextMenuSubContent,
+	ContextMenuSubTrigger,
+	ContextMenuTrigger
+} from './components/ui/context-menu';
+export { DatePickerWithRange as DateRangePicker } from './components/ui/dateRangePicker';
+export {
+	Dialog,
+	DialogClose,
+	DialogContent,
+	DialogDescription,
+	DialogFooter,
+	DialogHeader,
+	DialogOverlay,
+	DialogPortal,
+	DialogTitle,
+	DialogTrigger
+} from './components/ui/dialog';
+export {
+	Drawer,
+	DrawerClose,
+	DrawerContent,
+	DrawerDescription,
+	DrawerFooter,
+	DrawerHeader,
+	DrawerOverlay,
+	DrawerPortal,
+	DrawerTitle,
+	DrawerTrigger
+} from './components/ui/drawer';
+export {
+	DropdownMenu,
+	DropdownMenuCheckboxItem,
+	DropdownMenuContent,
+	DropdownMenuGroup,
+	DropdownMenuItem,
+	DropdownMenuLabel,
+	DropdownMenuPortal,
+	DropdownMenuRadioGroup,
+	DropdownMenuRadioItem,
+	DropdownMenuSeparator,
+	DropdownMenuShortcut,
+	DropdownMenuSub,
+	DropdownMenuSubContent,
+	DropdownMenuSubTrigger,
+	DropdownMenuTrigger
+} from './components/ui/dropdown-menu';
+export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField } from './components/ui/form';
+export { HoverCard, HoverCardContent, HoverCardTrigger } from './components/ui/hover-card';
+export { Input } from './components/ui/input';
+export { Label } from './components/ui/label';
+export { modifyCpfCnpj, modifyPhone } from './components/ui/masks';
+export {
+	Pagination,
+	PaginationContent,
+	PaginationEllipsis,
+	PaginationItem,
+	PaginationLink,
+	PaginationNext,
+	PaginationPrevious
+} from './components/ui/pagination';
+export { Popover, PopoverContent, PopoverTrigger } from './components/ui/popover';
+export { Progress } from './components/ui/progress';
+export { RadioGroup, RadioGroupItem } from './components/ui/radio-group';
+export { ScrollArea, ScrollBar } from './components/ui/scroll-area';
+export {
+	Select,
+	SelectContent,
+	SelectGroup,
+	SelectItem,
+	SelectLabel,
+	SelectScrollDownButton,
+	SelectScrollUpButton,
+	SelectSeparator,
+	SelectTrigger,
+	SelectValue
+} from './components/ui/select';
+export { Separator } from './components/ui/separator';
+export {
+	Sheet,
+	SheetClose,
+	SheetContent,
+	SheetDescription,
+	SheetFooter,
+	SheetHeader,
+	SheetOverlay,
+	SheetPortal,
+	SheetTitle,
+	SheetTrigger
+} from './components/ui/sheet';
+export {
+	Sidebar,
+	SidebarContent,
+	SidebarFooter,
+	SidebarGroup,
+	SidebarGroupAction,
+	SidebarGroupContent,
+	SidebarGroupLabel,
+	SidebarHeader,
+	SidebarInput,
+	SidebarInset,
+	SidebarMenu,
+	SidebarMenuAction,
+	SidebarMenuBadge,
+	SidebarMenuButton,
+	SidebarMenuItem,
+	SidebarMenuSkeleton,
+	SidebarMenuSub,
+	SidebarMenuSubButton,
+	SidebarMenuSubItem,
+	SidebarProvider,
+	SidebarRail,
+	SidebarSeparator,
+	SidebarTrigger,
+	useSidebar
+} from './components/ui/sidebar';
+export { Skeleton } from './components/ui/skeleton';
+export { Slider } from './components/ui/slider';
+export { Switch } from './components/ui/switch';
+export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from './components/ui/table';
+export { Tabs, TabsContent, TabsList, TabsTrigger } from './components/ui/tabs';
+export { Textarea } from './components/ui/textarea';
+export { Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport } from './components/ui/toast';
+export { Toaster } from './components/ui/toaster';
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from './components/ui/tooltip';
+export { default as UseCalendar } from './components/ui/use-calendar';
+
+// =============================================================================
+// CUSTOM COMPONENTS
+// =============================================================================
+
+// Custom Date Picker
+export type { CalendarProps } from './components/ui/custom/date-picker';
+
+// Custom Theme Provider
+export { DEFAULT_THEME_DATA, ThemeProvider, useTheme } from './components/ui/custom/theme-provider';
+
+// Custom Form Components
+export { FormInputCpfCnpj } from './components/ui/custom/form/cpf-cnpj';
+export { FormInputCurrency } from './components/ui/custom/form/currency';
+export { FormInputDate } from './components/ui/custom/form/date';
+export { FormDataRange } from './components/ui/custom/form/date-range';
+export { FormInputDecimal } from './components/ui/custom/form/decimal';
+export { FormInputFile } from './components/ui/custom/form/file';
+export { FormInputGhost } from './components/ui/custom/form/ghost';
+export { FormInput } from './components/ui/custom/form/input';
+export { FormInputMask } from './components/ui/custom/form/mask';
+export { MultiSelect, type MultiSelectOption } from './components/ui/custom/form/multi-select';
+export { FormInputPassWord } from './components/ui/custom/form/password';
+export { FormInputPercent } from './components/ui/custom/form/percent';
+export { FormInputPhone } from './components/ui/custom/form/phone';
+export { FormRadioGroup, type RadioOption } from './components/ui/custom/form/radio-group';
+export { FormSelect, type SelectOption } from './components/ui/custom/form/select';
+export { FormInputSwitch } from './components/ui/custom/form/switch';
+export { FormInputText } from './components/ui/custom/form/text';
+export { FormTextarea } from './components/ui/custom/form/textarea';
+
+// Form Helpers
+export { formHelpText } from './components/ui/custom/form/form-help-text';
+export { formLabel, formLabelAndSubLabel } from './components/ui/custom/form/form-label';
+export { formMessage } from './components/ui/custom/form/form-message';
+
+// Custom Table Components
+export {
+	DataTable,
+	type DataTableProps,
+	type OriginalDataTableData
+} from './components/ui/custom/table/data-table';
+export { DataTableExport } from './components/ui/custom/table/data-table-export';
+export { DataTableFooter } from './components/ui/custom/table/data-table-footer';
+export { DataTableHeader } from './components/ui/custom/table/data-table-header';
+export { DataTableRows } from './components/ui/custom/table/data-table-rows';
+
+// Table Types
+export type {
+	ActionRow, ActionTable, ExportDataTable,
+	FiltersActions
+} from './components/ui/custom/table/types/data-table';
+
+// Custom Sidebar Components
+export { default as ModuleSwitcher } from './components/ui/custom/sidebar/module-switcher';
+export { default as NavFooter } from './components/ui/custom/sidebar/nav-footer';
+export { default as NavMain } from './components/ui/custom/sidebar/nav-main';
+export { default as NavSubmenuCollapsible } from './components/ui/custom/sidebar/nav-submenu-collapsible';
+export { default as NavSubmenuDropdown } from './components/ui/custom/sidebar/nav-submenu-dropdown';
+export { default as NavUser } from './components/ui/custom/sidebar/nav-user';
+export { default as SidebarButton } from './components/ui/custom/sidebar/sidebar-button';
+export { default as SidebarItem } from './components/ui/custom/sidebar/sidebar-item';
+export { default as SidebarItemTwoLines } from './components/ui/custom/sidebar/sidebar-item-two-lines';
+
+// Other Custom Components
+export { default as Header } from './components/ui/custom/header';
+export { default as LabelWithTitle } from './components/ui/custom/label';
+export { default as NotFound } from './components/ui/custom/not-found';
+
+// Sidebar Types
+export {
+	SidebarSubmenuType,
+	type Module,
+	type SidebarPage
+} from './components/ui/custom/sidebar/types/sidebar';
+
+// =============================================================================
+// HOOKS & UTILITIES
+// =============================================================================
+
+// Toast Hook
+export { toast, useToast } from './components/ui/use-toast';
+
+// Utility Functions
+export { cn } from './lib/utils';
+
+// Theme Utilities
+export {
+	getTailwindColorShades,
+	replaceThemeTailwindColors,
+	type TailwindColorName
+} from './lib/help/theme';
+
+// Format Utilities
+export {
+	convertBytesToMB, convertDaysToMonth, convertGbToMb, convertMbToGb, convertMonthToDays, convertSecondsToMinutes, formatCpfCnpj,
+	formatDate, formatDateCalendar, formatDateTime, formatDecimal, formatNumber, formatPhone, roundNumber, stringDateToDate, stringToNumber
+} from './lib/help/format';
+
+// Date Utilities
+export {
+	addDaysToToday, aYearAgo, getFirstDayOf90DaysAgo, getFirstDayOfCurrentMonth, invertDate, stringToDate
+} from './lib/help/date-utils';
+
+// UUID Utilities
+export { isUUIDv4 } from './lib/help/uuid';
+
+// =============================================================================
+// STYLES
+// =============================================================================
+
+import './styles/globals.css';
+

package/src/lib/help/date-utils.ts

@@ -0,0 +1,41 @@
+export const getFirstDayOfCurrentMonth = (): Date => {
+	const now = new Date();
+	return new Date(now.getFullYear(), now.getMonth(), 1);
+};
+
+export const getFirstDayOf90DaysAgo = (): Date => {
+	const now = new Date();
+	return new Date(now.getFullYear(), now.getMonth() - 3, 1);
+};
+
+export const stringToDate = (dateString: string, separator: string = '/'): Date | undefined => {
+	if (!dateString) return undefined;
+
+	const dateParts = dateString.split(separator);
+	if (dateParts.length !== 3) return undefined;
+
+	const day = parseInt(dateParts[0], 10);
+	const month = parseInt(dateParts[1], 10) - 1; // Months are zero-based in JavaScript
+	const year = parseInt(dateParts[2], 10);
+
+	return new Date(year, month, day);
+};
+
+export const aYearAgo = (): Date => {
+	const aYearAgo = new Date();
+	aYearAgo.setFullYear(aYearAgo.getFullYear() - 1);
+
+	return aYearAgo;
+};
+
+export const invertDate = (date: string, separator: string = '/'): string => {
+	if (!date) return '';
+
+	return date.split(separator).reverse().join('-');
+};
+
+export const addDaysToToday = (days: number): Date => {
+	const date = new Date();
+	date.setDate(date.getDate() + days);
+	return date;
+};

package/src/lib/help/format.ts

@@ -0,0 +1,171 @@
+import { maskCpfCnpj, maskPhone } from "@/components/ui/masks";
+import { format } from '@react-input/mask';
+
+// PHONE
+export function formatPhone(telefone: string, removerCountryCode = true) {
+	if (!telefone) return '';
+
+	let numberPhone = telefone.replace(/\D/g, '');
+
+	// Remover código do país apenas se ele começar com '55'
+	if (removerCountryCode && numberPhone.startsWith('55')) {
+		numberPhone = numberPhone.substring(2);
+	}
+
+	return format(numberPhone, maskPhone(numberPhone));
+}
+
+// CPF/CNPJ
+export function formatCpfCnpj(cpfCnpj?: string): string {
+	if (!cpfCnpj) return '';
+
+	const numberCpfCnpj = cpfCnpj.replace(/\D/g, '');
+
+	return format(numberCpfCnpj, maskCpfCnpj(numberCpfCnpj));
+}
+
+// DATE
+function getDay(date: Date) {
+	return date.getDate().toString().padStart(2, '0');
+}
+
+function getMonth(date: Date) {
+	return (date.getMonth() + 1).toString().padStart(2, '0');
+}
+
+function getYear(date: Date) {
+	return date.getFullYear().toString();
+}
+
+export const formatDate = (date: string | Date | undefined, separator: string = '/') => {
+	if (!date) return '';
+
+	const d = new Date(date);
+
+	return d.toLocaleDateString('pt-BR');
+};
+
+export const formatDateTime = (date: Date | undefined, returnSeconds: boolean = false): string => {
+	if (!date) return '';
+
+	const hours = date.getHours().toString().padStart(2, '0');
+	const minutes = date.getMinutes().toString().padStart(2, '0');
+	const seconds = returnSeconds ? `:${date.getSeconds().toString().padStart(2, '0')}` : '';
+
+	return `${formatDate(date)} ${hours}:${minutes}${seconds}`;
+};
+
+export function formatDateCalendar(date: Date | undefined): string {
+	if (!date) return '';
+
+	const day = getDay(date);
+	const month = getMonth(date);
+	const year = getYear(date);
+
+	return `${year}-${month}-${day}`;
+}
+
+export function stringDateToDate(date: string | undefined, separator: string = '/'): Date | undefined {
+	if (!date) return undefined;
+
+	const [day, month, year] = date.split(separator).map(Number);
+
+	// new Date(ano, mês-1, dia) interpreta a data no fuso horário local
+	return new Date(year, month - 1, day);
+}
+
+// NUMBER
+export const roundNumber = (value: number, fractionDigits: number = 2): number => {
+	return Number(value.toFixed(fractionDigits));
+};
+
+export const stringToNumber = (value: string | undefined): number => {
+	if (!value) return 0;
+
+	const numericValue = value
+		.replace(/[^\d,-]/g, '')
+		.replace(/\./g, '')
+		.replace(',', '.');
+	return Number.parseFloat(numericValue);
+};
+
+export const convertMbToGb = (value: number) => {
+	return value > 0 ? roundNumber(value / 1024) : 0;
+};
+
+export const convertGbToMb = (value: number) => {
+	return value > 0 ? roundNumber(value * 1024) : 0;
+};
+
+export const convertSecondsToMinutes = (value: number): number => {
+	return value > 0 ? roundNumber(value / 60) : 0;
+};
+
+export const convertBytesToMB = (bytes: number): number => {
+	if (!bytes || Number.isNaN(bytes)) return 0;
+	return roundNumber(bytes / (1024 * 1024));
+};
+
+export const convertMonthToDays = (months: number): number => {
+	return months > 0 ? months * 30 : 0;
+};
+
+export const convertDaysToMonth = (days: number): number => {
+	return days > 0 ? roundNumber(days / 30) : 0;
+};
+
+// NUMBER
+export const formatNumber = (value: number) => {
+	return value.toLocaleString('pt-BR', {
+		style: 'decimal',
+		minimumFractionDigits: 0,
+		maximumFractionDigits: 0,
+	});
+};
+
+// DECIMAL
+export const formatDecimal = (value: number, decimalPlaces: number = 2) => {
+	return value.toLocaleString('pt-BR', {
+		style: 'decimal',
+		minimumFractionDigits: decimalPlaces,
+		maximumFractionDigits: decimalPlaces,
+	});
+};
+
+// PERCENT
+export const formatPercent = (value: number, decimalPlaces: number = 2) => {
+	return `% ${formatDecimal(value, decimalPlaces)}`;
+};
+
+// CURRENCY
+export const formatCurrency = (value: number, decimalPlaces: number = 2) => {
+	return value.toLocaleString('pt-BR', {
+		style: 'currency',
+		currency: 'BRL',
+		minimumFractionDigits: decimalPlaces,
+		maximumFractionDigits: decimalPlaces,
+	});
+};
+
+export const isInvalidCurrencyValue = (rawValue: string | undefined): boolean => {
+	if (!rawValue || rawValue.trim() === '') return true;
+
+	const numericValue = stringToNumber(rawValue);
+
+	return Number.isNaN(numericValue) || numericValue <= 0;
+};
+
+// OTHERS
+export function formatMsisdn(value: string = ''): string {
+	const msisdn = value.replace(/\D/g, '');
+	return `(${msisdn.slice(2, 4)}) ${msisdn.slice(4, 9)}-${msisdn.slice(9)}`;
+}
+
+export function formatCEP(cep?: string) {
+	if (!cep) return '';
+
+	return cep
+		.replace(/\D/g, '')
+		.replace(/(\d{5})(\d)/, '$1-$2')
+		.replace(/(-\d{3})\d+?$/, '$1');
+}