rl-core-front 0.1.0

package/src/i18n/messages/pt.ts

@@ -0,0 +1,305 @@
+export const pt = {
+  app: { name: "Core App" },
+  nav: {
+    home: "Início",
+    admin: "Administração",
+    dashboard: "Dashboard",
+    users: "Usuários",
+    rbac: "Papéis & Permissões",
+    profile: "Meu perfil",
+    logs: "Logs",
+    audit: "Auditoria",
+  },
+  logs: {
+    title: "Logs",
+    subtitle: "Toda requisição à API — sucesso e erro, rota, status e duração.",
+    tabRequests: "Requisições",
+    tabErrors: "Erros",
+    date: "Data/hora",
+    route: "Rota",
+    status: "Status",
+    duration: "Duração",
+    user: "Usuário",
+    systemUser: "Sistema",
+    ip: "IP",
+    requestId: "Request ID",
+    type: "Tipo",
+    message: "Mensagem",
+    viewDetails: "Ver detalhes",
+    detailsTitle: "Detalhes do erro",
+    stackTrace: "Stack trace",
+  },
+  auditTrail: {
+    title: "Trilha de Auditoria",
+    subtitle: "Histórico de alterações de dados — quem mudou o quê, e quando.",
+    entity: "Entidade",
+    action: "Ação",
+    actionCreate: "Criação",
+    actionUpdate: "Alteração",
+    actionDelete: "Remoção",
+    user: "Usuário",
+    systemUser: "Sistema",
+    date: "Data/hora",
+    ip: "IP",
+    viewChanges: "Ver alterações",
+    changesTitle: "Alterações",
+    field: "Campo",
+    before: "Antes",
+    after: "Depois",
+    noFields: "Nenhum campo registrado nesta alteração.",
+    showTechnical: "Mostrar campos técnicos",
+  },
+  /**
+   * Rótulo das colunas que aparecem no diff da auditoria. Campo sem chave aqui
+   * é exibido com o nome cru — não quebra quando nasce coluna nova no backend.
+   */
+  auditFields: {
+    name: "Nome",
+    lastName: "Sobrenome",
+    email: "Email",
+    phone: "Telefone",
+    isActive: "Ativo",
+    avatar: "Avatar",
+    twoFactorEnabled: "2FA ativo",
+    failedLoginAttempts: "Tentativas de login falhas",
+    mustChangePassword: "Precisa trocar a senha",
+    passwordChangedAt: "Senha alterada em",
+    createdAt: "Criado em",
+    updatedAt: "Atualizado em",
+    deletedAt: "Removido em",
+    description: "Descrição",
+    code: "Código",
+    permissions: "Permissões",
+    roles: "Papéis",
+  },
+  table: {
+    columns: "Colunas",
+    columnsButton: "Colunas",
+    columnsTitle: "Configurar visualização de colunas",
+    columnsHint: "Selecione as colunas que deseja visualizar na tabela.",
+    atLeastOne: "Pelo menos uma coluna deve permanecer visível",
+    results: "resultados",
+    perPage: "por página",
+    empty: "Nenhum registro",
+  },
+  filters: {
+    button: "Filtros",
+    title: "Filtros",
+    hint: "Preencha só os campos que quiser usar. Tudo é combinado com E.",
+    apply: "Aplicar",
+    clear: "Limpar",
+    clearAll: "Limpar tudo",
+    empty: "Esta listagem ainda não tem filtros.",
+    noOptions: "Nenhuma opção disponível",
+    all: "Todos",
+    from: "De",
+    to: "Até",
+    fromChip: "a partir de",
+    toChip: "até",
+    selectPeriod: "Selecione o período",
+    lastDays: "{days} dias",
+    previousMonth: "Mês anterior",
+    nextMonth: "Próximo mês",
+    simple: "Simples",
+    advanced: "Avançado",
+    advancedHint:
+      "Monte a expressão: cada grupo combina suas condições com E ou OU.",
+    addCondition: "Condição",
+    addGroup: "Grupo",
+    and: "E",
+    or: "OU",
+    emptyGroup: "Grupo sem condições.",
+    removeRule: "Remover condição",
+    removeGroup: "Remover grupo",
+    advancedSummary: "Filtro avançado · {count} condições",
+    field: "Campo",
+    operator: "Operador",
+    value: "Valor",
+    null: "Vazio (nulo)",
+    listHint: "Separe por vírgula",
+    tooDeep: "Grupos aninhados demais — o limite é 3 níveis.",
+    tooManyConditions: "Condições demais — o limite é 50.",
+    tooManyItems: "Itens demais numa lista — o limite é 100.",
+    operators: {
+      EQ: "igual a",
+      NE: "diferente de",
+      IS: "é",
+      NOT: "não é",
+      GT: "maior que",
+      GTE: "maior ou igual a",
+      LT: "menor que",
+      LTE: "menor ou igual a",
+      BETWEEN: "entre",
+      NOTBETWEEN: "fora de",
+      IN: "em",
+      NOTIN: "fora da lista",
+      LIKE: "corresponde a",
+      NOTLIKE: "não corresponde a",
+      STARTSWITH: "começa com",
+      ENDSWITH: "termina com",
+      SUBSTRING: "contém",
+    },
+  },
+  notifications: {
+    title: "Notificações",
+    all: "Todas",
+    unread: "Não lidas",
+    markAllRead: "Marcar todas como lidas",
+    empty: "Nenhuma notificação",
+  },
+  common: {
+    save: "Salvar",
+    cancel: "Cancelar",
+    edit: "Editar",
+    delete: "Excluir",
+    create: "Criar",
+    confirm: "Confirmar",
+    send: "Enviar",
+    yes: "Sim",
+    no: "Não",
+    actions: "Ações",
+    loading: "Carregando...",
+    language: "Idioma",
+    theme: "Tema",
+    light: "Claro",
+    dark: "Escuro",
+    system: "Sistema",
+    // Mensagens de sucesso genéricas — só para tela reaproveitada, que não sabe
+    // qual entidade está editando. Tela de entidade fixa usa texto próprio.
+    createdSuccess: "Registro criado com sucesso",
+    updatedSuccess: "Registro atualizado com sucesso",
+    deletedSuccess: "Registro excluído com sucesso",
+  },
+  auth: {
+    loginTitle: "Entrar",
+    email: "Email",
+    password: "Senha",
+    enter: "Entrar",
+    entering: "Entrando...",
+    forgotPassword: "Esqueci minha senha",
+    twoFactorSetupTitle: "Configurar 2FA",
+    twoFactorVerifyTitle: "Verificação em duas etapas",
+    backupTitle: "Códigos de backup",
+    setupHint:
+      "Configure a autenticação em duas etapas (obrigatória). Escaneie o QR com um app autenticador gratuito (Google Authenticator, Microsoft Authenticator, Authy...) e informe o código.",
+    manualKey: "Não consegue escanear? Use a chave manual:",
+    codeApp: "Código do app (6 dígitos)",
+    confirmActivate: "Confirmar e ativar 2FA",
+    confirming: "Confirmando...",
+    verifyHint:
+      "Informe o código do seu app autenticador. Sem acesso ao app? Use um código de backup ou receba um código por email.",
+    codeAny: "Código (TOTP, email ou backup)",
+    verify: "Validar código",
+    verifying: "Validando...",
+    receiveByEmail: "Receber código por email",
+    sendingEmail: "Enviando...",
+    backupWarning:
+      "Estes códigos só aparecem agora. Cada um pode ser usado uma vez caso você perca o acesso ao app.",
+    copy: "Copiar",
+    codesCopied: "Códigos de backup copiados",
+    savedContinue: "Guardei, continuar",
+    loginSuccess: "Login realizado com sucesso",
+    twoFactorConfigured: "2FA configurado com sucesso",
+    codeSent: "Código enviado para seu email",
+  },
+  recovery: {
+    forgotTitle: "Recuperar senha",
+    forgotHint:
+      "Informe seu email e enviaremos um link para redefinir a senha.",
+    sendLink: "Enviar link",
+    sending: "Enviando...",
+    forgotSuccess: "Se o email existir, enviamos as instruções de redefinição.",
+    backToLogin: "Voltar ao login",
+    resetTitle: "Redefinir senha",
+    newPassword: "Nova senha",
+    confirmPassword: "Confirmar nova senha",
+    resetCta: "Redefinir senha",
+    resetSuccess: "Senha redefinida com sucesso",
+    checking: "Verificando o link...",
+    firstAccessTitle: "Definir senha de primeiro acesso",
+    firstAccessHint:
+      "Crie sua senha para acessar o sistema. No primeiro login você também configurará o 2FA.",
+    linkExpired: "Este link expirou. Solicite um novo link para definir sua senha.",
+    linkUsed: "Este link já foi utilizado. Solicite um novo link.",
+    linkInvalid: "Link inválido. Solicite um novo link para definir sua senha.",
+    requestNewLink: "Solicitar novo link",
+  },
+  user: { menuProfile: "Meu perfil", logout: "Sair" },
+  dashboard: {
+    welcome: "Bem-vindo(a), {name}",
+    roles: "Papéis",
+    permissions: "Permissões",
+    security: "Segurança",
+    twoFactorActive: "2FA ativo",
+    twoFactorPending: "2FA pendente",
+  },
+  users: {
+    title: "Usuários",
+    newUser: "Novo usuário",
+    name: "Nome",
+    lastName: "Sobrenome",
+    phone: "Telefone",
+    email: "Email",
+    roles: "Papéis",
+    status: "Status",
+    active: "Ativo",
+    inactive: "Inativo",
+    locked: "Bloqueado",
+    passwordByEmailHint:
+      "O usuário receberá um link por email para definir a própria senha. Nenhuma senha é definida aqui.",
+    sendFirstAccessLink: "Enviar link de primeiro acesso",
+    sendPasswordResetLink: "Enviar link de redefinição de senha",
+    passwordResetLinkSent:
+      "Link de redefinição enviado — as sessões ativas do usuário foram encerradas",
+    firstAccessLinkSent:
+      "Link de primeiro acesso enviado para o email do usuário",
+    resetTwoFactor: "Resetar 2FA",
+    twoFactorReset: "2FA resetado — o usuário reconfigura no próximo login",
+  },
+  profile: {
+    title: "Meu perfil",
+    data: "Dados",
+    changePassword: "Alterar senha",
+    currentPassword: "Senha atual",
+    newPassword: "Nova senha",
+    confirmPassword: "Confirmar nova senha",
+    changed: "Senha alterada com sucesso",
+    forceProvisional:
+      "Você está usando uma senha provisória. Defina uma nova senha para continuar.",
+    forceExpired: "Sua senha expirou. Defina uma nova senha para continuar.",
+    changeAvatar: "Alterar foto",
+    cropTitle: "Recortar foto",
+    cropHint: "Arraste para posicionar e use o zoom para ajustar.",
+    cropZoom: "Zoom",
+    saved: "Perfil atualizado",
+    avatarUpdated: "Foto de perfil atualizada",
+    avatarRemoved: "Foto de perfil removida",
+  },
+  rbac: { title: "Papéis & Permissões" },
+  validation: {
+    required: "Campo obrigatório",
+    email: "Email inválido",
+    passwordStrong:
+      "Mín. 8 caracteres com maiúscula, minúscula, número e símbolo",
+    passwordsNotMatch: "As senhas não conferem",
+    codeShort: "Código muito curto",
+  },
+  errors: {
+    unexpected: "Erro inesperado",
+    // Texto por `errorCode` do backend. Só entra aqui o código cuja mensagem é
+    // fixa — quando o servidor manda dado dinâmico (tentativas restantes, por
+    // exemplo), a mensagem dele é melhor e o `use-request` a mantém.
+    codes: {
+      ACCOUNT_INACTIVE:
+        "Conta desativada. Entre em contato com o administrador do sistema.",
+      ACCOUNT_LOCKED:
+        "Conta bloqueada por excesso de tentativas. Peça ao administrador o envio de um novo link para definir sua senha.",
+      PASSWORD_REUSED:
+        "Esta senha já foi utilizada. Escolha uma senha que você ainda não usou neste sistema.",
+      TOO_MANY_REQUESTS:
+        "Muitas tentativas em pouco tempo. Aguarde um instante e tente de novo.",
+    },
+  },
+};
+
+export type Messages = typeof pt;

package/src/index.ts

@@ -0,0 +1,60 @@
+/**
+ * Superfície pública do `rl-core-front`.
+ *
+ * É o contrato: o que sai daqui é o que um projeto pode importar, e mudar ou
+ * remover algo desta lista é *breaking change* — vale um major no semver.
+ *
+ * O CSS não passa por aqui, porque CSS não se importa de arquivo TypeScript:
+ * `@import "rl-core-front/styles.css"` no globals.css do projeto.
+ */
+
+// ---------------------------------------------------------------------------
+// Telas — cada page.tsx do projeto reexporta a que quiser
+// ---------------------------------------------------------------------------
+export { AuditScreen } from "#core/features/audit/audit-screen";
+export { DashboardScreen } from "#core/features/dashboard/dashboard-screen";
+export { LoginScreen } from "#core/features/login/login-screen";
+export { LogsScreen } from "#core/features/logs/logs-screen";
+export { ProfileScreen } from "#core/features/profile/profile-screen";
+export { RbacScreen } from "#core/features/rbac/rbac-screen";
+export { ForgotPasswordScreen } from "#core/features/recovery/forgot-password-screen";
+export { ResetPasswordScreen } from "#core/features/recovery/reset-password-screen";
+export { UsersScreen } from "#core/features/users/users-screen";
+
+// ---------------------------------------------------------------------------
+// Providers e shell — vão no layout.tsx do projeto
+// ---------------------------------------------------------------------------
+export * from "#core/components";
+export * from "#core/contexts";
+
+// ---------------------------------------------------------------------------
+// Primitivos de UI — agnósticos de domínio
+// ---------------------------------------------------------------------------
+export * from "#core/components/ui";
+export { cn } from "#core/lib/utils";
+
+// ---------------------------------------------------------------------------
+// Hooks de listagem, requisição e filtro
+// ---------------------------------------------------------------------------
+export type { UseColumnVisibilityResult } from "#core/hooks/use-column-visibility";
+export { useColumnVisibility } from "#core/hooks/use-column-visibility";
+export type { ConfirmOptions, UseConfirmResult } from "#core/hooks/use-confirm";
+export { useConfirm } from "#core/hooks/use-confirm";
+export type { UseFilterSchemaResult } from "#core/hooks/use-filter-schema";
+export { useFilterSchema } from "#core/hooks/use-filter-schema";
+export type { FilterMode, FiltersState } from "#core/hooks/use-filters";
+export { useFilters } from "#core/hooks/use-filters";
+export type { UseListQueryResult } from "#core/hooks/use-list-query";
+export { useListQuery } from "#core/hooks/use-list-query";
+export type { RunOptions, UseRequestResult } from "#core/hooks/use-request";
+export { useRequest } from "#core/hooks/use-request";
+
+// ---------------------------------------------------------------------------
+// HTTP e traduções
+// ---------------------------------------------------------------------------
+export { api } from "#core/_services/api/axios.factory";
+export type { ListQuery } from "#core/_services/api/list-query";
+export { toListParams } from "#core/_services/api/list-query";
+export { en } from "#core/i18n/messages/en";
+export type { Messages } from "#core/i18n/messages/pt";
+export { pt } from "#core/i18n/messages/pt";

package/src/lib/utils.ts

@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+export function cn(...inputs: ClassValue[]): string {
+  return twMerge(clsx(inputs));
+}

package/src/middleware.ts

@@ -0,0 +1,42 @@
+import { NextRequest, NextResponse } from "next/server";
+
+/**
+ * Protege as rotas privadas verificando a presença do cookie de sessão.
+ * - Sem access_token → manda para /login.
+ * - Com access_token tentando acessar /login → manda para /dashboard.
+ *
+ * Observação: a validação forte do token é feita no backend; aqui é só
+ * o "portão" de roteamento (UX), evitando flicker de telas privadas.
+ */
+const PUBLIC_PATHS = ["/login", "/forgot-password", "/reset-password"];
+
+export function middleware(req: NextRequest): NextResponse<unknown> {
+  const { pathname } = req.nextUrl;
+  const hasSession =
+    req.cookies.has("access_token") || req.cookies.has("refresh_token");
+
+  const isPublic = PUBLIC_PATHS.some((p) => pathname.startsWith(p));
+
+  if (!hasSession && !isPublic) {
+    const url = req.nextUrl.clone();
+    url.pathname = "/login";
+    return NextResponse.redirect(url);
+  }
+
+  // reason=expired: o front detectou (via backend) que a sessão é inválida e está
+  // limpando os cookies — não manda de volta pro dashboard nesse meio-tempo, senão
+  // vira loop entre /dashboard e /login enquanto os cookies antigos ainda existem.
+  const isExpiredBounce = req.nextUrl.searchParams.get("reason") === "expired";
+
+  if (hasSession && pathname === "/login" && !isExpiredBounce) {
+    const url = req.nextUrl.clone();
+    url.pathname = "/dashboard";
+    return NextResponse.redirect(url);
+  }
+
+  return NextResponse.next();
+}
+
+export const config = {
+  matcher: ["/((?!api|_next/static|_next/image|favicon.ico).*)"],
+};

package/src/styles/core.css

@@ -0,0 +1,142 @@
+/*
+ * Design system do rl-core-front: tokens de cor, base do body, correção do
+ * autofill e a barra de progresso do toast.
+ *
+ * Um projeto que consome o pacote importa este arquivo no globals.css dele,
+ * depois do `@import "tailwindcss"`:
+ *
+ *   @import "tailwindcss";
+ *   @config "../../tailwind.config.ts";
+ *   @import "rl-core-front/styles.css";
+ */
+
+
+@layer base {
+  :root {
+    /*
+     * O Chrome resolve a cor do autofill (e da scrollbar, e dos controles
+     * nativos) por `color-scheme`, não pela nossa classe `.dark`. Sem declarar,
+     * ele assume claro e pinta o campo preenchido de azul-claro mesmo no tema
+     * escuro. É a causa raiz do input branco.
+     */
+    color-scheme: light;
+    --background: 210 20% 98%;
+    --foreground: 222 47% 11%;
+    --card: 0 0% 100%;
+    --card-foreground: 222 47% 11%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 222 47% 11%;
+    --primary: 211 80% 42%;
+    --primary-foreground: 0 0% 100%;
+    --secondary: 210 40% 96%;
+    --secondary-foreground: 222 47% 11%;
+    --muted: 210 40% 96%;
+    --muted-foreground: 215 16% 47%;
+    --accent: 210 40% 96%;
+    --accent-foreground: 222 47% 11%;
+    --destructive: 0 72% 51%;
+    --destructive-foreground: 0 0% 100%;
+    --success: 142 71% 45%;
+    --success-foreground: 0 0% 100%;
+    --warning: 38 92% 50%;
+    --warning-foreground: 0 0% 100%;
+    --border: 214 32% 91%;
+    --input: 214 32% 91%;
+    --ring: 211 80% 42%;
+    --radius: 0.6rem;
+  }
+
+  .dark {
+    color-scheme: dark;
+    --background: 210 30% 8%;
+    --foreground: 210 20% 92%;
+    --card: 213 25% 13%;
+    --card-foreground: 210 20% 92%;
+    --popover: 213 25% 13%;
+    --popover-foreground: 210 20% 92%;
+    --primary: 211 85% 60%;
+    --primary-foreground: 213 30% 10%;
+    --secondary: 213 20% 18%;
+    --secondary-foreground: 210 20% 92%;
+    --muted: 213 20% 18%;
+    --muted-foreground: 215 15% 65%;
+    --accent: 213 20% 22%;
+    --accent-foreground: 210 20% 92%;
+    --destructive: 0 63% 50%;
+    --destructive-foreground: 0 0% 100%;
+    --success: 142 65% 45%;
+    --success-foreground: 0 0% 100%;
+    --warning: 38 92% 55%;
+    --warning-foreground: 213 30% 10%;
+    --border: 213 20% 22%;
+    --input: 213 20% 24%;
+    --ring: 211 85% 60%;
+  }
+}
+
+@layer base {
+  * {
+    @apply border-border;
+  }
+  body {
+    @apply bg-background text-foreground;
+    font-feature-settings: 'rlig' 1, 'calt' 1;
+  }
+
+  /*
+   * Preenchimento automático (gerenciador de senhas). O `background-color` do
+   * campo preenchido é intocável por CSS de autor — o Chrome o declara com
+   * `!important` na folha do próprio browser, e regra de UA com `!important`
+   * ganha até de `!important` de autor. A saída é cobrir com sombra interna.
+   *
+   * A sombra vai na variável `--tw-inset-shadow` em vez de em `box-shadow`
+   * direto: o Tailwind v4 compõe o `box-shadow` do elemento a partir dela e de
+   * `--tw-ring-shadow`. Sobrescrever `box-shadow` (o que exigiria `!important`,
+   * já que `shadow-sm` mora na camada `utilities`) apagaria o anel de foco do
+   * input. Alimentando a variável, fundo e anel convivem.
+   *
+   * O `box-shadow` solto abaixo cobre o input que não usa utilitário de sombra,
+   * onde não existe composição para a variável entrar.
+   */
+  input:-webkit-autofill,
+  input:-webkit-autofill:hover,
+  input:-webkit-autofill:focus,
+  input:-webkit-autofill:active,
+  textarea:-webkit-autofill,
+  select:-webkit-autofill {
+    --tw-inset-shadow: 0 0 0 1000px hsl(var(--background)) inset;
+    box-shadow: 0 0 0 1000px hsl(var(--background)) inset;
+    -webkit-text-fill-color: hsl(var(--foreground));
+    caret-color: hsl(var(--foreground));
+    /* Atrasa a transição do fundo para nunca ver o amarelo inicial do Chrome. */
+    transition: background-color 9999s ease-out 0s;
+  }
+}
+
+/* Barra de progresso do toast — some ao passar o mouse (sonner já pausa o dismiss no hover) */
+[data-sonner-toast] {
+  position: relative;
+  overflow: hidden;
+}
+[data-sonner-toast]::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  height: 3px;
+  width: 100%;
+  background: currentColor;
+  opacity: 0.35;
+  animation: toast-progress 4s linear forwards;
+}
+[data-sonner-toast]:hover::after {
+  animation-play-state: paused;
+}
+@keyframes toast-progress {
+  from {
+    width: 100%;
+  }
+  to {
+    width: 0%;
+  }
+}

package/tailwind-preset.ts

@@ -0,0 +1,103 @@
+import type { Config } from 'tailwindcss';
+import tailwindcssAnimate from 'tailwindcss-animate';
+
+/**
+ * Preset do rl-core-front: tema, paleta e plugins.
+ *
+ * As cores apontam para variáveis CSS (`--primary`, `--background`…), cujos
+ * valores estão em `styles/core.css`. Os dois andam juntos — usar o preset sem
+ * importar o CSS deixa toda cor sem valor.
+ *
+ * Não traz `content`: o que varrer é decisão de cada projeto, que precisa
+ * incluir o próprio `src` **e** o do pacote dentro de node_modules.
+ *
+ * ```ts
+ * // tailwind.config.ts do projeto
+ * import corePreset from "rl-core-front/tailwind-preset";
+ *
+ * export default {
+ *   presets: [corePreset],
+ *   content: [
+ *     "./src/**\/*.{ts,tsx}",
+ *     "./node_modules/rl-core-front/src/**\/*.{ts,tsx}",
+ *   ],
+ * } satisfies Config;
+ * ```
+ */
+const preset: Omit<Config, 'content'> = {
+  darkMode: 'class',
+  theme: {
+    container: {
+      center: true,
+      padding: '2rem',
+      screens: { '2xl': '1400px' },
+    },
+    extend: {
+      colors: {
+        border: 'hsl(var(--border))',
+        input: 'hsl(var(--input))',
+        ring: 'hsl(var(--ring))',
+        background: 'hsl(var(--background))',
+        foreground: 'hsl(var(--foreground))',
+        primary: {
+          DEFAULT: 'hsl(var(--primary))',
+          foreground: 'hsl(var(--primary-foreground))',
+        },
+        secondary: {
+          DEFAULT: 'hsl(var(--secondary))',
+          foreground: 'hsl(var(--secondary-foreground))',
+        },
+        destructive: {
+          DEFAULT: 'hsl(var(--destructive))',
+          foreground: 'hsl(var(--destructive-foreground))',
+        },
+        muted: {
+          DEFAULT: 'hsl(var(--muted))',
+          foreground: 'hsl(var(--muted-foreground))',
+        },
+        accent: {
+          DEFAULT: 'hsl(var(--accent))',
+          foreground: 'hsl(var(--accent-foreground))',
+        },
+        popover: {
+          DEFAULT: 'hsl(var(--popover))',
+          foreground: 'hsl(var(--popover-foreground))',
+        },
+        card: {
+          DEFAULT: 'hsl(var(--card))',
+          foreground: 'hsl(var(--card-foreground))',
+        },
+        success: {
+          DEFAULT: 'hsl(var(--success))',
+          foreground: 'hsl(var(--success-foreground))',
+        },
+        warning: {
+          DEFAULT: 'hsl(var(--warning))',
+          foreground: 'hsl(var(--warning-foreground))',
+        },
+      },
+      borderRadius: {
+        lg: 'var(--radius)',
+        md: 'calc(var(--radius) - 2px)',
+        sm: 'calc(var(--radius) - 4px)',
+      },
+      keyframes: {
+        'accordion-down': {
+          from: { height: '0' },
+          to: { height: 'var(--radix-accordion-content-height)' },
+        },
+        'accordion-up': {
+          from: { height: 'var(--radix-accordion-content-height)' },
+          to: { height: '0' },
+        },
+      },
+      animation: {
+        'accordion-down': 'accordion-down 0.2s ease-out',
+        'accordion-up': 'accordion-up 0.2s ease-out',
+      },
+    },
+  },
+  plugins: [tailwindcssAnimate],
+};
+
+export default preset;