@oondemand/oon-core-front 0.1.4 → 0.3.0

package/dist/index.js

@@ -3,7 +3,7 @@ import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
 
 // src/app/OonApp.tsx
-import { useMemo as useMemo3 } from "react";
+import { useMemo as useMemo4 } from "react";
 import { RouterProvider } from "react-router-dom";
 
 // src/api/createRestClient.ts
@@ -56,7 +56,9 @@ function createRestClient(deps) {
   });
   instance.interceptors.request.use((config) => {
     const token = getToken();
-    if (token) config.headers.Authorization = `Bearer ${token}`;
+    if (token && !config.headers.Authorization) {
+      config.headers.Authorization = `Bearer ${token}`;
+    }
     if (appId) config.headers["x-oon-app"] = appId;
     return config;
   });
@@ -64,7 +66,9 @@ function createRestClient(deps) {
     (res) => res,
     (error) => {
       const normalized = normalizeError(error);
-      if (normalized.status === 401) onUnauthorized?.();
+      const requestPath = String(error.config?.url || "").split("?")[0].replace(/\/$/, "");
+      const isLogin = requestPath.endsWith("/auth/autenticar");
+      if (normalized.status === 401 && !isLogin) onUnauthorized?.();
       return Promise.reject(normalized);
     }
   );
@@ -120,7 +124,7 @@ function captureTokenFromUrl(tokenParam = "code") {
 
 // src/app/OonProviders.tsx
 import { useMemo as useMemo2 } from "react";
-import { ChakraProvider, defaultSystem } from "@chakra-ui/react";
+import { ChakraProvider } from "@chakra-ui/react";
 import { QueryClientProvider } from "@tanstack/react-query";
 
 // src/config/queryClient.ts
@@ -140,6 +144,82 @@ function createOonQueryClient() {
   });
 }
 
+// src/config/theme.ts
+import { createSystem, defaultConfig, defineConfig, mergeConfigs } from "@chakra-ui/react";
+var brandColors = {
+  brand: {
+    25: { value: "#F8FCFF" },
+    50: { value: "#EEF8FD" },
+    75: { value: "#E2F3FB" },
+    100: { value: "#C7E8F7" },
+    200: { value: "#82C8E8" },
+    300: { value: "#3FA6E0" },
+    350: { value: "#0F8DD0" },
+    400: { value: "#0580B9" },
+    500: { value: "#0474AF" },
+    600: { value: "#036491" },
+    700: { value: "#014364" },
+    800: { value: "#073A52" },
+    850: { value: "#082F3F" },
+    900: { value: "#07262E" }
+  }
+};
+var oonThemeConfig = defineConfig({
+  globalCss: {
+    "html, body, #root": {
+      minHeight: "100%"
+    },
+    body: {
+      margin: 0,
+      bg: "#F8F9FA",
+      color: "#24323A",
+      fontFamily: "Poppins, Inter, system-ui, sans-serif",
+      fontSize: "14px"
+    },
+    "button, input, select, textarea": {
+      fontFamily: "inherit"
+    },
+    "::selection": {
+      bg: "#C7E8F7",
+      color: "#07262E"
+    }
+  },
+  theme: {
+    tokens: {
+      colors: brandColors,
+      fonts: {
+        body: { value: "Poppins, Inter, system-ui, sans-serif" },
+        heading: { value: "Poppins, Inter, system-ui, sans-serif" }
+      },
+      radii: {
+        oon: { value: "10px" }
+      },
+      shadows: {
+        oon: { value: "0 8px 24px rgba(7, 38, 46, 0.08)" }
+      }
+    },
+    semanticTokens: {
+      colors: {
+        brand: {
+          solid: { value: "{colors.brand.500}" },
+          contrast: { value: "white" },
+          fg: { value: "{colors.brand.700}" },
+          muted: { value: "{colors.brand.50}" },
+          subtle: { value: "{colors.brand.75}" },
+          emphasized: { value: "{colors.brand.600}" },
+          focusRing: { value: "{colors.brand.500}" }
+        }
+      }
+    }
+  }
+});
+function createOonSystem(themeOverride) {
+  const base = mergeConfigs(defaultConfig, oonThemeConfig);
+  const config = themeOverride ? mergeConfigs(base, defineConfig(themeOverride)) : base;
+  return createSystem(config);
+}
+var oonSystem = createOonSystem();
+
 // src/api/ApiProvider.tsx
 import { createContext, useContext, useMemo } from "react";
 import { useQuery } from "@tanstack/react-query";
@@ -281,55 +361,212 @@ function useModelSchema(name) {
 }
 
 // src/security/AuthProvider.tsx
-import { createContext as createContext2, useContext as useContext2, useEffect, useState, useCallback } from "react";
+import {
+  createContext as createContext3,
+  useCallback as useCallback2,
+  useContext as useContext3,
+  useEffect as useEffect2,
+  useState as useState2
+} from "react";
+
+// src/security/ActivationProvider.tsx
+import {
+  createContext as createContext2,
+  useCallback,
+  useContext as useContext2,
+  useEffect,
+  useState
+} from "react";
 import { jsx as jsx2 } from "react/jsx-runtime";
-var AuthContext = createContext2(null);
-function AuthProvider({ http, storage, auth, loginUrl, children }) {
-  const tokenParam = auth?.tokenParam ?? "code";
-  const [user, setUser] = useState(null);
+var ActivationContext = createContext2(null);
+function mapStatus(data) {
+  if (data.status === "ativa") return "active";
+  if (data.status === "suspensa") return "suspended";
+  if (data.status === "revogada") return "revoked";
+  if (data.status === "configurando") return "configuring";
+  if (data.status === "erro" && !data.podeAtivar) return "error";
+  return "notActivated";
+}
+function ActivationProvider({
+  http,
+  children
+}) {
   const [status, setStatus] = useState("loading");
-  const redirectToLogin = useCallback(() => {
-    if (loginUrl) {
-      window.location.href = loginUrl;
-    } else {
-      setStatus("unauthenticated");
+  const [details, setDetails] = useState(null);
+  const refresh = useCallback(async () => {
+    setStatus("loading");
+    try {
+      const response = await http.get("/ativacao/status");
+      setDetails(response.data);
+      setStatus(mapStatus(response.data));
+    } catch {
+      setStatus("error");
     }
+  }, [http]);
+  useEffect(() => {
+    void refresh();
+  }, [refresh]);
+  return /* @__PURE__ */ jsx2(ActivationContext.Provider, { value: { status, details, refresh }, children });
+}
+function useOptionalActivation() {
+  return useContext2(ActivationContext);
+}
+function useActivation() {
+  const context = useOptionalActivation();
+  if (!context) {
+    throw new Error(
+      "useActivation deve ser usado dentro de <ActivationProvider>."
+    );
+  }
+  return context;
+}
+
+// src/security/AuthProvider.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var AuthContext = createContext3(null);
+function errorStatus(error) {
+  return error?.status;
+}
+function encodeBasicCredentials(email, password) {
+  const bytes = new TextEncoder().encode(`${email}:${password}`);
+  let binary = "";
+  for (const byte of bytes) binary += String.fromCharCode(byte);
+  return window.btoa(binary);
+}
+function AuthProvider({
+  http,
+  storage,
+  auth,
+  loginUrl,
+  children
+}) {
+  const tokenParam = auth?.tokenParam ?? "code";
+  const devToken = auth?.devToken?.trim() || null;
+  const [user, setUser] = useState2(null);
+  const [status, setStatus] = useState2("loading");
+  const activation = useOptionalActivation();
+  const redirectToExternalLogin = useCallback2(() => {
+    if (loginUrl) window.location.href = loginUrl;
   }, [loginUrl]);
-  const logout = useCallback(() => {
+  const applyValidationError = useCallback2(
+    (error) => {
+      const currentStatus = errorStatus(error);
+      setUser(null);
+      if (currentStatus === 403) {
+        setStatus("forbidden");
+        return;
+      }
+      if (currentStatus === 401) {
+        storage.clear();
+        setStatus("unauthenticated");
+        redirectToExternalLogin();
+        return;
+      }
+      setStatus("error");
+    },
+    [storage, redirectToExternalLogin]
+  );
+  const validateSession = useCallback2(async () => {
+    const response = await http.get(
+      "/auth/validar-token"
+    );
+    setUser(response.data.usuario);
+    setStatus("authenticated");
+  }, [http]);
+  const retry = useCallback2(async () => {
+    setStatus("loading");
+    try {
+      await validateSession();
+    } catch (error) {
+      applyValidationError(error);
+      throw error;
+    }
+  }, [validateSession, applyValidationError]);
+  const login = useCallback2(
+    async (email, password) => {
+      setStatus("loading");
+      setUser(null);
+      try {
+        const response = await http.post(
+          "/auth/autenticar",
+          {},
+          {
+            headers: {
+              Authorization: `Basic ${encodeBasicCredentials(email, password)}`
+            }
+          }
+        );
+        if (!response.data.token) {
+          const error = {
+            code: "AUTH_TOKEN_MISSING",
+            message: "Token n\xE3o retornado pelo backend.",
+            status: 502
+          };
+          throw error;
+        }
+        storage.set(response.data.token);
+        await validateSession();
+      } catch (error) {
+        applyValidationError(error);
+        throw error;
+      }
+    },
+    [http, storage, validateSession, applyValidationError]
+  );
+  const logout = useCallback2(() => {
     storage.clear();
     setUser(null);
-    redirectToLogin();
-  }, [storage, redirectToLogin]);
-  useEffect(() => {
+    setStatus("unauthenticated");
+    redirectToExternalLogin();
+  }, [storage, redirectToExternalLogin]);
+  useEffect2(() => {
     let active = true;
+    if (activation && !["active", "error"].includes(activation.status)) {
+      setUser(null);
+      setStatus("unauthenticated");
+      return;
+    }
     const incoming = captureTokenFromUrl(tokenParam);
-    if (incoming) storage.set(incoming);
-    const token = storage.get();
+    const stored = storage.get();
+    const token = incoming ?? devToken ?? stored;
+    if (token && token !== stored) storage.set(token);
     if (!token) {
-      redirectToLogin();
+      setUser(null);
+      setStatus("unauthenticated");
+      redirectToExternalLogin();
       return;
     }
-    http.get("/auth/validar-token").then((res) => {
+    setStatus("loading");
+    http.get("/auth/validar-token").then((response) => {
       if (!active) return;
-      setUser(res.data.usuario);
+      setUser(response.data.usuario);
       setStatus("authenticated");
-    }).catch(() => {
+    }).catch((error) => {
       if (!active) return;
-      storage.clear();
-      redirectToLogin();
+      applyValidationError(error);
     });
     return () => {
       active = false;
     };
-  }, [http, storage, tokenParam, redirectToLogin]);
+  }, [
+    http,
+    storage,
+    tokenParam,
+    devToken,
+    redirectToExternalLogin,
+    applyValidationError,
+    activation?.status
+  ]);
   const roles = user?.tipo ? [user.tipo] : [];
-  const hasPermission = useCallback(
+  const hasPermission = useCallback2(
     (permission) => {
       if (!permission) return true;
       const required = Array.isArray(permission) ? permission : [permission];
       if (required.length === 0) return true;
       if (roles.includes("admin") || roles.includes("master")) return true;
-      return required.some((p) => roles.includes(p) || roles.some((r) => p.startsWith(`${r}.`)));
+      return required.some(
+        (value2) => roles.includes(value2) || roles.some((role) => value2.startsWith(`${role}.`))
+      );
     },
     [roles]
   );
@@ -339,27 +576,34 @@ function AuthProvider({ http, storage, auth, loginUrl, children }) {
     status,
     isAuthenticated: status === "authenticated",
     hasPermission,
+    login,
+    retry,
     logout
   };
-  return /* @__PURE__ */ jsx2(AuthContext.Provider, { value, children });
+  return /* @__PURE__ */ jsx3(AuthContext.Provider, { value, children });
 }
 function useOonAuth() {
-  const ctx = useContext2(AuthContext);
-  if (!ctx) throw new Error("useOonAuth deve ser usado dentro de <AuthProvider> (oonCoreFront.start).");
-  return ctx;
+  const context = useContext3(AuthContext);
+  if (!context) {
+    throw new Error(
+      "useOonAuth deve ser usado dentro de <AuthProvider> (oonCoreFront.start)."
+    );
+  }
+  return context;
 }
 
 // src/app/OonProviders.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
+import { jsx as jsx4 } from "react/jsx-runtime";
 function OonProviders({ config, http, storage, children }) {
   const queryClient = useMemo2(() => createOonQueryClient(), []);
+  const system = useMemo2(() => createOonSystem(config.theme), [config.theme]);
   const loginUrl = config.auth?.loginUrl ?? config.api.meusAppsUrl;
-  return /* @__PURE__ */ jsx3(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx3(ChakraProvider, { value: defaultSystem, children: /* @__PURE__ */ jsx3(ApiProvider, { http, children: /* @__PURE__ */ jsx3(AuthProvider, { http, storage, auth: config.auth, loginUrl, children }) }) }) });
+  return /* @__PURE__ */ jsx4(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx4(ChakraProvider, { value: system, children: /* @__PURE__ */ jsx4(ApiProvider, { http, children: /* @__PURE__ */ jsx4(ActivationProvider, { http, children: /* @__PURE__ */ jsx4(AuthProvider, { http, storage, auth: config.auth, loginUrl, children }) }) }) }) });
 }
 
 // src/components/CoreCollection.tsx
-import { useState as useState4 } from "react";
-import { Box as Box4, Heading as Heading3, Stack as Stack2 } from "@chakra-ui/react";
+import { useState as useState6 } from "react";
+import { Box as Box5, Heading as Heading3, Stack as Stack3, Text as Text6 } from "@chakra-ui/react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 
 // src/components/internal/fieldUtils.ts
@@ -369,17 +613,39 @@ function isEditableField(meta) {
 }
 function fieldLabel(meta) {
   if (meta.label) return meta.label;
-  return meta.name.replace(/_/g, " ").replace(/([a-z])([A-Z])/g, "$1 $2").replace(/^./, (c) => c.toUpperCase());
+  return meta.name.replace(/_/g, " ").replace(/([a-z])([A-Z])/g, "$1 $2").replace(/^./, (character) => character.toUpperCase());
 }
 function columnsFromMeta(fields) {
-  return fields.filter(isEditableField).slice(0, 8).map((f) => ({ field: f.name, label: fieldLabel(f), kind: f.kind, sortable: true }));
+  return fields.filter(isEditableField).slice(0, 8).map((field) => ({ field: field.name, label: fieldLabel(field), kind: field.kind, sortable: true }));
+}
+function formRequired(field) {
+  const raw = field;
+  const options = raw.options;
+  const validation = raw.validation;
+  const schema = raw.schema;
+  return Boolean(
+    field.required || options && !Array.isArray(options) && typeof options === "object" && options.required || validation && typeof validation === "object" && validation.required || schema && typeof schema === "object" && schema.required
+  );
+}
+function formOptions(field) {
+  const rawOptions = field.options;
+  if (Array.isArray(rawOptions)) return rawOptions.filter((value) => typeof value === "string");
+  if (!rawOptions || typeof rawOptions !== "object") return void 0;
+  const options = rawOptions;
+  const candidates = [options.values, options.enum, options.options];
+  for (const candidate of candidates) {
+    if (Array.isArray(candidate)) return candidate.filter((value) => typeof value === "string");
+  }
+  return void 0;
 }
 function formFieldsFromMeta(fields) {
-  return fields.filter(isEditableField).map((f) => ({
-    field: f.name,
-    label: fieldLabel(f),
-    kind: f.kind,
-    options: f.options
+  return fields.filter(isEditableField).map((field) => ({
+    field: field.name,
+    label: fieldLabel(field),
+    kind: field.kind,
+    required: formRequired(field),
+    options: formOptions(field),
+    ref: field.ref
   }));
 }
 function formatCell(value, kind) {
@@ -398,8 +664,8 @@ function formatCell(value, kind) {
       return new Intl.NumberFormat("pt-BR", { style: "currency", currency: "BRL" }).format(Number(value));
     case "ref":
       if (value && typeof value === "object") {
-        const obj = value;
-        return String(obj.nome ?? obj.label ?? obj.descricao ?? obj._id ?? "\u2014");
+        const object = value;
+        return String(object.nome ?? object.label ?? object.descricao ?? object._id ?? "\u2014");
       }
       return String(value);
     default:
@@ -408,30 +674,35 @@ function formatCell(value, kind) {
 }
 
 // src/components/internal/DataGrid.tsx
-import { useState as useState2 } from "react";
-import { Box as Box2, Button, Flex as Flex2, Input, Spacer, Table, Text as Text3 } from "@chakra-ui/react";
+import { useDeferredValue, useState as useState3 } from "react";
+import { Badge, Box as Box2, Button as Button2, Flex as Flex2, Input, NativeSelect, Spacer, Table, Text as Text3 } from "@chakra-ui/react";
 import { keepPreviousData, useQuery as useQuery2 } from "@tanstack/react-query";
 
 // src/shell/LoadingScreen.tsx
-import { Flex, Spinner, Text } from "@chakra-ui/react";
-import { jsx as jsx4, jsxs } from "react/jsx-runtime";
-function LoadingScreen({ message }) {
+import { Button, Flex, Spinner, Text } from "@chakra-ui/react";
+import { jsx as jsx5, jsxs } from "react/jsx-runtime";
+function LoadingScreen({
+  message,
+  actionLabel,
+  onAction
+}) {
   return /* @__PURE__ */ jsxs(Flex, { direction: "column", align: "center", justify: "center", minH: "60vh", gap: 4, children: [
-    /* @__PURE__ */ jsx4(Spinner, { size: "lg" }),
-    message ? /* @__PURE__ */ jsx4(Text, { color: "gray.500", fontSize: "sm", children: message }) : null
+    /* @__PURE__ */ jsx5(Spinner, { size: "lg" }),
+    message ? /* @__PURE__ */ jsx5(Text, { color: "gray.500", fontSize: "sm", textAlign: "center", children: message }) : null,
+    actionLabel && onAction ? /* @__PURE__ */ jsx5(Button, { size: "sm", variant: "outline", onClick: onAction, children: actionLabel }) : null
   ] });
 }
 
 // src/shell/ErrorState.tsx
 import { Box, Heading, Text as Text2 } from "@chakra-ui/react";
-import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
 function ErrorState({
   error,
   title = "N\xE3o foi poss\xEDvel carregar"
 }) {
   return /* @__PURE__ */ jsxs2(Box, { borderWidth: "1px", borderColor: "red.200", bg: "red.50", borderRadius: "md", p: 4, children: [
-    /* @__PURE__ */ jsx5(Heading, { size: "sm", color: "red.700", children: title }),
-    /* @__PURE__ */ jsx5(Text2, { mt: 1, fontSize: "sm", color: "red.600", children: error?.message ?? "Erro inesperado." }),
+    /* @__PURE__ */ jsx6(Heading, { size: "sm", color: "red.700", children: title }),
+    /* @__PURE__ */ jsx6(Text2, { mt: 1, fontSize: "sm", color: "red.600", children: error?.message ?? "Erro inesperado." }),
     error?.requestId ? /* @__PURE__ */ jsxs2(Text2, { mt: 2, fontSize: "xs", color: "red.400", children: [
       "requestId: ",
       error.requestId
@@ -440,8 +711,44 @@ function ErrorState({
 }
 
 // src/components/internal/DataGrid.tsx
-import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
-var PAGE_SIZE = 20;
+import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+function SearchIcon() {
+  return /* @__PURE__ */ jsxs3("svg", { viewBox: "0 0 20 20", width: "17", height: "17", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx7("circle", { cx: "8.5", cy: "8.5", r: "5.25", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }),
+    /* @__PURE__ */ jsx7("path", { d: "m12.4 12.4 4 4", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
+  ] });
+}
+function EditIcon() {
+  return /* @__PURE__ */ jsxs3("svg", { viewBox: "0 0 20 20", width: "15", height: "15", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx7("path", { d: "M4 14.5V16h1.5L14.7 6.8l-1.5-1.5L4 14.5Z", fill: "none", stroke: "currentColor", strokeWidth: "1.45", strokeLinejoin: "round" }),
+    /* @__PURE__ */ jsx7("path", { d: "m12.5 6 1.5-1.5a1.05 1.05 0 0 1 1.5 0l.1.1a1.05 1.05 0 0 1 0 1.5L14.1 7.6", fill: "none", stroke: "currentColor", strokeWidth: "1.45", strokeLinecap: "round" })
+  ] });
+}
+function TrashIcon() {
+  return /* @__PURE__ */ jsxs3("svg", { viewBox: "0 0 20 20", width: "15", height: "15", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx7("path", { d: "M5.5 6.5h9l-.6 9H6.1l-.6-9Zm2-2h5l.7 2H6.8l.7-2Z", fill: "none", stroke: "currentColor", strokeWidth: "1.35", strokeLinejoin: "round" }),
+    /* @__PURE__ */ jsx7("path", { d: "M4.5 6.5h11", fill: "none", stroke: "currentColor", strokeWidth: "1.35", strokeLinecap: "round" })
+  ] });
+}
+function ChevronIcon({ direction }) {
+  return /* @__PURE__ */ jsx7("svg", { viewBox: "0 0 20 20", width: "17", height: "17", "aria-hidden": "true", style: { transform: direction === "right" ? "rotate(180deg)" : void 0 }, children: /* @__PURE__ */ jsx7("path", { d: "m12 5-5 5 5 5", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round" }) });
+}
+function PlusIcon() {
+  return /* @__PURE__ */ jsx7("svg", { viewBox: "0 0 20 20", width: "17", height: "17", "aria-hidden": "true", children: /* @__PURE__ */ jsx7("path", { d: "M10 4v12M4 10h12", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" }) });
+}
+function renderCell(value, kind) {
+  const formatted = formatCell(value, kind);
+  if (kind === "enum") {
+    const normalized = String(value ?? "").toLowerCase();
+    const palette = /erro|cancel|inativo|recus|critica/.test(normalized) ? "red" : /pendente|aguardando|rascunho/.test(normalized) ? "orange" : /processando|conferencia|integrando|validando/.test(normalized) ? "blue" : /ativo|sucesso|conclu|aplicada|disponivel|aprov/.test(normalized) ? "green" : "gray";
+    return /* @__PURE__ */ jsx7(Badge, { colorPalette: palette, variant: "subtle", borderRadius: "full", px: "7px", py: "3px", fontSize: "9px", fontWeight: "600", textTransform: "capitalize", children: formatted });
+  }
+  if (kind === "boolean") {
+    const active = value === true || value === "true";
+    return /* @__PURE__ */ jsx7(Badge, { colorPalette: active ? "green" : "gray", variant: "subtle", borderRadius: "full", px: "7px", py: "3px", fontSize: "9px", fontWeight: "600", children: formatted });
+  }
+  return formatted;
+}
 function DataGrid({
   resource,
   resourceKey,
@@ -452,104 +759,544 @@ function DataGrid({
   onDelete,
   toolbarExtra
 }) {
-  const [pageIndex, setPageIndex] = useState2(0);
-  const [searchTerm, setSearchTerm] = useState2("");
-  const [sort, setSort] = useState2(void 0);
+  const [pageIndex, setPageIndex] = useState3(0);
+  const [pageSize, setPageSize] = useState3(20);
+  const [searchTerm, setSearchTerm] = useState3("");
+  const deferredSearch = useDeferredValue(searchTerm);
+  const [sort, setSort] = useState3(void 0);
   const query = useQuery2({
-    queryKey: ["oon", "list", resourceKey, { pageIndex, searchTerm, sort }],
-    queryFn: () => resource.list({ pageIndex, pageSize: PAGE_SIZE, searchTerm: searchTerm || void 0, sort }),
+    queryKey: ["oon", "list", resourceKey, { pageIndex, pageSize, searchTerm: deferredSearch, sort }],
+    queryFn: () => resource.list({ pageIndex, pageSize, searchTerm: deferredSearch || void 0, sort }),
     placeholderData: keepPreviousData
   });
   const toggleSort = (field) => {
     setPageIndex(0);
-    setSort((prev) => {
-      if (prev === `${field}.asc`) return `${field}.desc`;
-      if (prev === `${field}.desc`) return void 0;
+    setSort((previous) => {
+      if (previous === `${field}.asc`) return `${field}.desc`;
+      if (previous === `${field}.desc`) return void 0;
       return `${field}.asc`;
     });
   };
   const pagination = query.data?.pagination;
   const rows = query.data?.results ?? [];
-  return /* @__PURE__ */ jsxs3(Box2, { children: [
-    /* @__PURE__ */ jsxs3(Flex2, { mb: 4, gap: 3, align: "center", children: [
-      search ? /* @__PURE__ */ jsx6(
-        Input,
-        {
-          size: "sm",
-          maxW: "320px",
-          placeholder: "Buscar...",
-          value: searchTerm,
-          onChange: (e) => {
-            setPageIndex(0);
-            setSearchTerm(e.target.value);
+  const totalItems = pagination?.totalItems ?? rows.length;
+  const totalPages = Math.max(1, pagination?.totalPages ?? 1);
+  const currentPage = Math.min(pageIndex + 1, totalPages);
+  const actionCount = onEdit || onDelete ? 1 : 0;
+  return /* @__PURE__ */ jsxs3(Box2, { bg: "white", borderWidth: "1px", borderColor: "#E5E9ED", borderRadius: "10px", boxShadow: "0 1px 2px rgba(15,23,42,.06)", overflow: "hidden", children: [
+    /* @__PURE__ */ jsxs3(Flex2, { minH: "60px", px: "14px", py: "12px", align: "center", gap: 4, borderBottomWidth: "1px", borderColor: "#E5E9ED", children: [
+      search ? /* @__PURE__ */ jsxs3(Flex2, { minW: { base: "100%", md: "min(420px, 55vw)" }, maxW: "420px", h: "35px", px: "10px", align: "center", gap: 2, color: "#98A2B3", bg: "white", borderWidth: "1px", borderColor: "#D5DDE3", borderRadius: "6px", _focusWithin: { borderColor: "#0F8DD0", boxShadow: "0 0 0 3px rgba(15,141,208,.10)" }, children: [
+        /* @__PURE__ */ jsx7(SearchIcon, {}),
+        /* @__PURE__ */ jsx7(
+          Input,
+          {
+            value: searchTerm,
+            onChange: (event) => {
+              setSearchTerm(event.target.value);
+              setPageIndex(0);
+            },
+            placeholder: "Pesquisar registros...",
+            h: "100%",
+            p: 0,
+            color: "#475467",
+            bg: "transparent",
+            border: 0,
+            borderRadius: 0,
+            fontSize: "11px",
+            _placeholder: { color: "#A6B0BC" },
+            _focusVisible: { boxShadow: "none", outline: "none" }
           }
-        }
-      ) : null,
-      /* @__PURE__ */ jsx6(Spacer, {}),
+        )
+      ] }) : null,
+      /* @__PURE__ */ jsx7(Spacer, {}),
+      /* @__PURE__ */ jsxs3(Flex2, { align: "center", gap: 3, color: "#98A2B3", fontSize: "10px", children: [
+        query.isFetching ? /* @__PURE__ */ jsx7(Text3, { children: "Atualizando..." }) : null,
+        /* @__PURE__ */ jsxs3(Text3, { as: "strong", color: "#667085", fontWeight: "600", children: [
+          totalItems,
+          " registro",
+          totalItems === 1 ? "" : "s"
+        ] })
+      ] }),
       toolbarExtra,
-      onCreate ? /* @__PURE__ */ jsx6(Button, { size: "sm", colorPalette: "blue", onClick: onCreate, children: "Novo" }) : null
+      onCreate ? /* @__PURE__ */ jsxs3(Button2, { minH: "35px", px: "13px", colorPalette: "brand", borderRadius: "6px", fontSize: "11px", fontWeight: "600", onClick: onCreate, children: [
+        /* @__PURE__ */ jsx7(PlusIcon, {}),
+        " Novo registro"
+      ] }) : null
     ] }),
-    query.isLoading ? /* @__PURE__ */ jsx6(LoadingScreen, {}) : query.isError ? /* @__PURE__ */ jsx6(ErrorState, { error: query.error }) : /* @__PURE__ */ jsx6(Box2, { borderWidth: "1px", borderColor: "gray.200", borderRadius: "md", overflowX: "auto", bg: "white", children: /* @__PURE__ */ jsxs3(Table.Root, { size: "sm", interactive: true, children: [
-      /* @__PURE__ */ jsx6(Table.Header, { children: /* @__PURE__ */ jsxs3(Table.Row, { children: [
-        columns.map((col) => /* @__PURE__ */ jsxs3(
+    query.isLoading ? /* @__PURE__ */ jsx7(LoadingScreen, {}) : query.isError ? /* @__PURE__ */ jsx7(ErrorState, { error: query.error }) : /* @__PURE__ */ jsx7(Box2, { overflowX: "auto", children: /* @__PURE__ */ jsxs3(Table.Root, { size: "sm", minW: "900px", borderCollapse: "collapse", children: [
+      /* @__PURE__ */ jsx7(Table.Header, { children: /* @__PURE__ */ jsxs3(Table.Row, { bg: "#F4F7F9", children: [
+        columns.map((column) => /* @__PURE__ */ jsxs3(
           Table.ColumnHeader,
           {
-            cursor: col.sortable ? "pointer" : void 0,
-            onClick: col.sortable ? () => toggleSort(col.field) : void 0,
+            h: "39px",
+            px: "10px",
+            py: "8px",
+            color: "#667085",
+            borderBottomWidth: "1px",
+            borderColor: "#D5DDE3",
+            fontSize: "10px",
+            fontWeight: "600",
+            letterSpacing: ".015em",
+            textTransform: "none",
+            whiteSpace: "nowrap",
+            cursor: column.sortable ? "pointer" : void 0,
+            onClick: column.sortable ? () => toggleSort(column.field) : void 0,
             children: [
-              col.label ?? col.field,
-              sort?.startsWith(`${col.field}.`) ? sort.endsWith(".asc") ? " \u25B2" : " \u25BC" : ""
+              column.label ?? column.field,
+              sort?.startsWith(`${column.field}.`) ? sort.endsWith(".asc") ? " \u25B2" : " \u25BC" : ""
             ]
           },
-          col.field
+          column.field
         )),
-        onEdit || onDelete ? /* @__PURE__ */ jsx6(Table.ColumnHeader, { textAlign: "end", children: "A\xE7\xF5es" }) : null
+        actionCount ? /* @__PURE__ */ jsx7(Table.ColumnHeader, { w: "84px", h: "39px", px: "10px", py: "8px", color: "#667085", borderBottomWidth: "1px", borderColor: "#D5DDE3", fontSize: "10px", fontWeight: "600", textAlign: "center", children: "A\xE7\xF5es" }) : null
       ] }) }),
-      /* @__PURE__ */ jsx6(Table.Body, { children: rows.length === 0 ? /* @__PURE__ */ jsx6(Table.Row, { children: /* @__PURE__ */ jsx6(Table.Cell, { colSpan: columns.length + 1, children: /* @__PURE__ */ jsx6(Text3, { color: "gray.400", py: 6, textAlign: "center", children: "Nenhum registro encontrado." }) }) }) : rows.map((row, idx) => /* @__PURE__ */ jsxs3(Table.Row, { children: [
-        columns.map((col) => /* @__PURE__ */ jsx6(Table.Cell, { children: formatCell(row[col.field], col.kind) }, col.field)),
-        onEdit || onDelete ? /* @__PURE__ */ jsx6(Table.Cell, { textAlign: "end", children: /* @__PURE__ */ jsxs3(Flex2, { gap: 2, justify: "end", children: [
-          onEdit ? /* @__PURE__ */ jsx6(Button, { size: "xs", variant: "ghost", onClick: () => onEdit(row), children: "Editar" }) : null,
-          onDelete ? /* @__PURE__ */ jsx6(Button, { size: "xs", variant: "ghost", colorPalette: "red", onClick: () => onDelete(row), children: "Excluir" }) : null
+      /* @__PURE__ */ jsx7(Table.Body, { children: rows.length === 0 ? /* @__PURE__ */ jsx7(Table.Row, { children: /* @__PURE__ */ jsx7(Table.Cell, { colSpan: columns.length + actionCount, children: /* @__PURE__ */ jsx7(Text3, { minH: "140px", display: "grid", placeItems: "center", color: "#98A2B3", fontSize: "12px", children: "Nenhum registro encontrado." }) }) }) : rows.map((row, index) => /* @__PURE__ */ jsxs3(Table.Row, { bg: index % 2 ? "#FBFCFD" : "white", _hover: { bg: "#F0F7FF" }, children: [
+        columns.map((column) => /* @__PURE__ */ jsx7(Table.Cell, { maxW: "250px", h: "42px", px: "10px", py: "8px", overflow: "hidden", color: "#52606D", borderBottomWidth: "1px", borderColor: "#EEF1F3", fontSize: "11px", textOverflow: "ellipsis", whiteSpace: "nowrap", children: renderCell(row[column.field], column.kind) }, column.field)),
+        actionCount ? /* @__PURE__ */ jsx7(Table.Cell, { h: "42px", px: "10px", py: "5px", borderBottomWidth: "1px", borderColor: "#EEF1F3", textAlign: "center", children: /* @__PURE__ */ jsxs3(Flex2, { justify: "center", gap: "5px", children: [
+          onEdit ? /* @__PURE__ */ jsx7(Button2, { type: "button", "aria-label": "Editar", w: "31px", minW: "31px", h: "31px", p: 0, color: "#667085", bg: "white", borderWidth: "1px", borderColor: "#E5E9ED", borderRadius: "6px", onClick: () => onEdit(row), _hover: { color: "#036491", bg: "#F0F7FF", borderColor: "#B8D9EB" }, children: /* @__PURE__ */ jsx7(EditIcon, {}) }) : null,
+          onDelete ? /* @__PURE__ */ jsx7(Button2, { type: "button", "aria-label": "Excluir", w: "31px", minW: "31px", h: "31px", p: 0, color: "#667085", bg: "white", borderWidth: "1px", borderColor: "#E5E9ED", borderRadius: "6px", onClick: () => onDelete(row), _hover: { color: "#B42318", bg: "#FFF5F5", borderColor: "#FECACA" }, children: /* @__PURE__ */ jsx7(TrashIcon, {}) }) : null
         ] }) }) : null
-      ] }, row._id ?? idx)) })
+      ] }, row._id ?? index)) })
     ] }) }),
-    pagination ? /* @__PURE__ */ jsxs3(Flex2, { mt: 4, align: "center", gap: 3, children: [
-      /* @__PURE__ */ jsxs3(Text3, { fontSize: "sm", color: "gray.500", children: [
-        pagination.totalItems,
-        " registro(s) \xB7 p\xE1gina ",
-        pagination.currentPage,
+    /* @__PURE__ */ jsxs3(Flex2, { minH: "56px", px: "14px", py: "10px", align: "center", justify: "flex-end", gap: "18px", color: "#7B8794", borderTopWidth: "1px", borderColor: "#E5E9ED", fontSize: "10px", flexWrap: "wrap", children: [
+      /* @__PURE__ */ jsxs3(Flex2, { align: "center", gap: 2, children: [
+        /* @__PURE__ */ jsx7(Text3, { children: "Linhas por p\xE1gina" }),
+        /* @__PURE__ */ jsxs3(NativeSelect.Root, { size: "xs", w: "68px", children: [
+          /* @__PURE__ */ jsx7(
+            NativeSelect.Field,
+            {
+              value: pageSize,
+              h: "30px",
+              pl: "8px",
+              pr: "26px",
+              color: "#52606D",
+              bg: "white",
+              borderColor: "#D5DDE3",
+              borderRadius: "5px",
+              fontSize: "10px",
+              onChange: (event) => {
+                setPageSize(Number(event.currentTarget.value));
+                setPageIndex(0);
+              },
+              children: [10, 20, 50, 100].map((size) => /* @__PURE__ */ jsx7("option", { value: size, children: size }, size))
+            }
+          ),
+          /* @__PURE__ */ jsx7(NativeSelect.Indicator, {})
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs3(Text3, { children: [
+        "P\xE1gina ",
+        currentPage,
         " de ",
-        pagination.totalPages
+        totalPages
       ] }),
-      /* @__PURE__ */ jsx6(Spacer, {}),
-      /* @__PURE__ */ jsx6(Button, { size: "xs", variant: "outline", disabled: pageIndex <= 0, onClick: () => setPageIndex((p) => p - 1), children: "Anterior" }),
-      /* @__PURE__ */ jsx6(
-        Button,
-        {
-          size: "xs",
-          variant: "outline",
-          disabled: pagination.currentPage >= pagination.totalPages,
-          onClick: () => setPageIndex((p) => p + 1),
-          children: "Pr\xF3xima"
-        }
-      )
-    ] }) : null
+      /* @__PURE__ */ jsxs3(Flex2, { gap: "5px", children: [
+        /* @__PURE__ */ jsx7(Button2, { type: "button", "aria-label": "P\xE1gina anterior", w: "31px", minW: "31px", h: "31px", p: 0, color: "#667085", bg: "white", borderWidth: "1px", borderColor: "#E5E9ED", borderRadius: "6px", disabled: pageIndex <= 0, onClick: () => setPageIndex((current) => Math.max(0, current - 1)), _hover: { color: "#036491", bg: "#F0F7FF", borderColor: "#B8D9EB" }, children: /* @__PURE__ */ jsx7(ChevronIcon, { direction: "left" }) }),
+        /* @__PURE__ */ jsx7(Button2, { type: "button", "aria-label": "Pr\xF3xima p\xE1gina", w: "31px", minW: "31px", h: "31px", p: 0, color: "#667085", bg: "white", borderWidth: "1px", borderColor: "#E5E9ED", borderRadius: "6px", disabled: currentPage >= totalPages, onClick: () => setPageIndex((current) => Math.min(totalPages - 1, current + 1)), _hover: { color: "#036491", bg: "#F0F7FF", borderColor: "#B8D9EB" }, children: /* @__PURE__ */ jsx7(ChevronIcon, { direction: "right" }) })
+      ] })
+    ] })
   ] });
 }
 
 // src/components/internal/DynamicForm.tsx
-import { useState as useState3 } from "react";
-import { Box as Box3, Button as Button2, Flex as Flex3, Heading as Heading2, Input as Input2, Stack, Text as Text4, NativeSelect } from "@chakra-ui/react";
-import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
-function coerce(value, kind) {
-  if (value === "") return void 0;
-  if (kind === "number" || kind === "currency" || kind === "currencyConverted") return Number(value);
-  if (kind === "boolean") return value === "true";
-  return value;
+import { useEffect as useEffect4, useState as useState5 } from "react";
+import { Box as Box4, Button as Button4, Flex as Flex4, Heading as Heading2, Input as Input3, NativeSelect as NativeSelect2, SimpleGrid, Stack as Stack2, Text as Text5, Textarea } from "@chakra-ui/react";
+
+// src/components/internal/ReferenceSelect.tsx
+import { useEffect as useEffect3, useMemo as useMemo3, useRef, useState as useState4 } from "react";
+import { Box as Box3, Button as Button3, Flex as Flex3, Input as Input2, Spinner as Spinner2, Stack, Text as Text4 } from "@chakra-ui/react";
+import { useQuery as useQuery3 } from "@tanstack/react-query";
+
+// src/components/internal/referenceUtils.ts
+var COMMON_LABEL_FIELDS = [
+  "nome",
+  "razaoSocial",
+  "razao_social",
+  "descricao",
+  "numero",
+  "codigoIndividual",
+  "codigo_individual",
+  "codigo",
+  "label",
+  "email"
+];
+function primitiveText(value) {
+  if (value == null || value === "") return null;
+  if (typeof value === "string" || typeof value === "number") return String(value);
+  return null;
+}
+function referenceOptionLabel(row, searchableFields = []) {
+  const ordered = [...COMMON_LABEL_FIELDS, ...searchableFields];
+  const seenFields = /* @__PURE__ */ new Set();
+  const seenValues = /* @__PURE__ */ new Set();
+  const values = [];
+  for (const field of ordered) {
+    if (seenFields.has(field)) continue;
+    seenFields.add(field);
+    const text = primitiveText(row[field]);
+    if (!text || seenValues.has(text)) continue;
+    seenValues.add(text);
+    values.push(text);
+    if (values.length === 2) break;
+  }
+  if (values.length) return values.join(" \u2014 ");
+  return primitiveText(row._id) ?? primitiveText(row.id) ?? "Registro sem identifica\xE7\xE3o";
+}
+function initialReferenceLabel(value) {
+  if (!value || typeof value !== "object") return "";
+  return referenceOptionLabel(value);
+}
+function referenceId(row) {
+  return String(row._id ?? row.id ?? "");
+}
+
+// src/components/internal/ReferenceSelect.tsx
+import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
+function SearchIcon2() {
+  return /* @__PURE__ */ jsxs4("svg", { viewBox: "0 0 20 20", width: "15", height: "15", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx8("circle", { cx: "8.5", cy: "8.5", r: "5.25", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }),
+    /* @__PURE__ */ jsx8("path", { d: "m12.4 12.4 4 4", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
+  ] });
+}
+function ChevronIcon2({ open }) {
+  return /* @__PURE__ */ jsx8(
+    "svg",
+    {
+      viewBox: "0 0 20 20",
+      width: "16",
+      height: "16",
+      "aria-hidden": "true",
+      style: { display: "block", transition: "transform .15s ease", transform: open ? "rotate(180deg)" : "rotate(0deg)" },
+      children: /* @__PURE__ */ jsx8("path", { d: "M5.5 7.5 10 12l4.5-4.5", fill: "none", stroke: "currentColor", strokeWidth: "1.7", strokeLinecap: "round", strokeLinejoin: "round" })
+    }
+  );
+}
+function ClearIcon() {
+  return /* @__PURE__ */ jsx8("svg", { viewBox: "0 0 20 20", width: "14", height: "14", "aria-hidden": "true", children: /* @__PURE__ */ jsx8("path", { d: "m6 6 8 8M14 6l-8 8", fill: "none", stroke: "currentColor", strokeWidth: "1.7", strokeLinecap: "round" }) });
+}
+function ReferenceSelect({
+  field,
+  inputId,
+  errorId,
+  label,
+  refModel,
+  value,
+  initialValue,
+  required,
+  invalid,
+  error,
+  onChange
+}) {
+  const initialLabel = useMemo3(() => initialReferenceLabel(initialValue), [initialValue]);
+  const [selectedLabel, setSelectedLabel] = useState4(initialLabel);
+  const [search, setSearch] = useState4("");
+  const [debouncedSearch, setDebouncedSearch] = useState4("");
+  const [open, setOpen] = useState4(false);
+  const [activeIndex, setActiveIndex] = useState4(-1);
+  const rootRef = useRef(null);
+  const searchRef = useRef(null);
+  const optionRefs = useRef([]);
+  const schemaQuery = useModelSchema(refModel);
+  const schema = schemaQuery.data;
+  const basePath = schema?.basePath ?? `/${refModel.toLowerCase()}s`;
+  const resource = useOonResource(basePath);
+  useEffect3(() => {
+    const timer = window.setTimeout(() => setDebouncedSearch(search.trim()), 250);
+    return () => window.clearTimeout(timer);
+  }, [search]);
+  useEffect3(() => {
+    if (!value) setSelectedLabel("");
+    else if (initialLabel) setSelectedLabel(initialLabel);
+  }, [initialLabel, value]);
+  useEffect3(() => {
+    if (!open) return;
+    const onPointerDown = (event) => {
+      if (!rootRef.current?.contains(event.target)) {
+        setOpen(false);
+        setActiveIndex(-1);
+      }
+    };
+    document.addEventListener("pointerdown", onPointerDown);
+    return () => document.removeEventListener("pointerdown", onPointerDown);
+  }, [open]);
+  useEffect3(() => {
+    if (!open) return;
+    window.setTimeout(() => searchRef.current?.focus(), 0);
+  }, [open]);
+  const listQuery = useQuery3({
+    queryKey: ["oon", "reference-options", refModel, basePath, debouncedSearch],
+    queryFn: () => resource.list({ pageIndex: 0, pageSize: 30, searchTerm: debouncedSearch || void 0 }),
+    enabled: !!schema && open,
+    staleTime: 3e4
+  });
+  const currentQuery = useQuery3({
+    queryKey: ["oon", "reference-current", refModel, basePath, value],
+    queryFn: () => resource.get(value),
+    enabled: !!schema && !!value && !selectedLabel,
+    staleTime: 5 * 6e4
+  });
+  useEffect3(() => {
+    if (!currentQuery.data) return;
+    setSelectedLabel(referenceOptionLabel(currentQuery.data, schema?.searchable));
+  }, [currentQuery.data, schema?.searchable]);
+  const items = listQuery.data?.results ?? [];
+  const listId = `oon-reference-${field}`;
+  const resolvedInputId = inputId ?? `oon-reference-input-${field}`;
+  const activeOptionId = activeIndex >= 0 ? `${listId}-option-${activeIndex}` : void 0;
+  const openList = (seed = "") => {
+    if (seed) setSearch(seed);
+    setOpen(true);
+    setActiveIndex((current) => current >= 0 ? current : 0);
+  };
+  const closeList = () => {
+    setOpen(false);
+    setActiveIndex(-1);
+  };
+  const choose = (record) => {
+    const id = referenceId(record);
+    if (!id) return;
+    onChange(id);
+    setSelectedLabel(referenceOptionLabel(record, schema?.searchable));
+    setSearch("");
+    setDebouncedSearch("");
+    closeList();
+  };
+  const clear = (event) => {
+    event.preventDefault();
+    event.stopPropagation();
+    onChange("");
+    setSelectedLabel("");
+    setSearch("");
+    setDebouncedSearch("");
+  };
+  const moveActive = (direction) => {
+    if (!items.length) return;
+    setActiveIndex((current) => {
+      const start2 = current < 0 ? direction === 1 ? -1 : 0 : current;
+      const next = (start2 + direction + items.length) % items.length;
+      window.setTimeout(() => optionRefs.current[next]?.scrollIntoView({ block: "nearest" }), 0);
+      return next;
+    });
+  };
+  return /* @__PURE__ */ jsxs4(Box3, { ref: rootRef, position: "relative", children: [
+    /* @__PURE__ */ jsxs4(
+      Button3,
+      {
+        id: resolvedInputId,
+        type: "button",
+        variant: "outline",
+        w: "100%",
+        minH: "37px",
+        h: "auto",
+        px: "10px",
+        py: "8px",
+        justifyContent: "space-between",
+        gap: 2,
+        color: "#475467",
+        bg: "white",
+        borderColor: invalid ? "#DC2626" : "#D5DDE3",
+        borderRadius: "6px",
+        boxShadow: invalid ? "0 0 0 3px rgba(220,38,38,.08)" : void 0,
+        fontSize: "11px",
+        fontWeight: "400",
+        textAlign: "left",
+        "aria-haspopup": "listbox",
+        "aria-expanded": open,
+        "aria-controls": listId,
+        "aria-activedescendant": open ? activeOptionId : void 0,
+        "aria-required": required,
+        "aria-invalid": invalid || void 0,
+        "aria-describedby": error ? errorId : void 0,
+        onClick: () => open ? closeList() : openList(),
+        onKeyDown: (event) => {
+          if (event.key === "ArrowDown") {
+            event.preventDefault();
+            if (!open) openList();
+            else moveActive(1);
+            return;
+          }
+          if (event.key === "ArrowUp") {
+            event.preventDefault();
+            if (!open) openList();
+            else moveActive(-1);
+            return;
+          }
+          if (event.key === "Enter" && open && activeIndex >= 0 && items[activeIndex]) {
+            event.preventDefault();
+            choose(items[activeIndex]);
+            return;
+          }
+          if (event.key === "Escape" && open) {
+            event.preventDefault();
+            event.stopPropagation();
+            closeList();
+            return;
+          }
+          if (!event.ctrlKey && !event.metaKey && !event.altKey && event.key.length === 1) {
+            event.preventDefault();
+            openList(event.key);
+          }
+        },
+        _hover: { bg: "white", borderColor: "#B9C7D1" },
+        _focusVisible: { borderColor: invalid ? "#DC2626" : "#0F8DD0", boxShadow: invalid ? "0 0 0 3px rgba(220,38,38,.08)" : "0 0 0 3px rgba(15,141,208,.10)" },
+        children: [
+          /* @__PURE__ */ jsx8(Text4, { as: "span", minW: 0, flex: "1", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", color: selectedLabel || value ? "#475467" : "#98A2B3", children: selectedLabel || (value ? String(value) : "Selecione ou digite para pesquisar...") }),
+          /* @__PURE__ */ jsxs4(Flex3, { as: "span", align: "center", gap: 1, flex: "0 0 auto", color: "#98A2B3", children: [
+            value ? /* @__PURE__ */ jsx8(
+              Box3,
+              {
+                as: "span",
+                role: "button",
+                tabIndex: 0,
+                "aria-label": `Limpar ${label}`,
+                w: "20px",
+                h: "20px",
+                display: "grid",
+                placeItems: "center",
+                borderRadius: "4px",
+                onClick: clear,
+                onKeyDown: (event) => {
+                  if (event.key === "Enter" || event.key === " ") clear(event);
+                },
+                _hover: { color: "#B42318", bg: "#FFF1F1" },
+                children: /* @__PURE__ */ jsx8(ClearIcon, {})
+              }
+            ) : null,
+            /* @__PURE__ */ jsx8(ChevronIcon2, { open })
+          ] })
+        ]
+      }
+    ),
+    open ? /* @__PURE__ */ jsxs4(
+      Box3,
+      {
+        position: "absolute",
+        zIndex: 120,
+        top: "calc(100% + 5px)",
+        left: 0,
+        right: 0,
+        overflow: "hidden",
+        bg: "white",
+        borderWidth: "1px",
+        borderColor: "#D5DDE3",
+        borderRadius: "8px",
+        boxShadow: "0 10px 30px rgba(15,23,42,.10)",
+        children: [
+          /* @__PURE__ */ jsxs4(Flex3, { h: "38px", px: "10px", align: "center", gap: "7px", color: "#98A2B3", borderBottomWidth: "1px", borderColor: "#E5E9ED", children: [
+            /* @__PURE__ */ jsx8(SearchIcon2, {}),
+            /* @__PURE__ */ jsx8(
+              Input2,
+              {
+                ref: searchRef,
+                value: search,
+                onChange: (event) => {
+                  setSearch(event.target.value);
+                  setActiveIndex(0);
+                },
+                placeholder: "Digite para filtrar...",
+                h: "100%",
+                p: 0,
+                color: "#475467",
+                bg: "transparent",
+                border: 0,
+                borderRadius: 0,
+                fontSize: "11px",
+                _focusVisible: { boxShadow: "none", outline: "none" },
+                onKeyDown: (event) => {
+                  if (event.key === "ArrowDown") {
+                    event.preventDefault();
+                    moveActive(1);
+                  } else if (event.key === "ArrowUp") {
+                    event.preventDefault();
+                    moveActive(-1);
+                  } else if (event.key === "Enter" && activeIndex >= 0 && items[activeIndex]) {
+                    event.preventDefault();
+                    choose(items[activeIndex]);
+                  } else if (event.key === "Escape") {
+                    event.preventDefault();
+                    event.stopPropagation();
+                    closeList();
+                  }
+                }
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx8(Stack, { id: listId, role: "listbox", gap: 0, maxH: "230px", p: "5px", overflowY: "auto", children: schemaQuery.isLoading || listQuery.isLoading ? /* @__PURE__ */ jsxs4(Flex3, { minH: "54px", align: "center", justify: "center", gap: 2, color: "#98A2B3", fontSize: "10px", children: [
+            /* @__PURE__ */ jsx8(Spinner2, { size: "xs" }),
+            " Carregando..."
+          ] }) : schemaQuery.isError || listQuery.isError ? /* @__PURE__ */ jsx8(Text4, { py: "18px", px: "10px", color: "#B42318", fontSize: "10px", textAlign: "center", children: "N\xE3o foi poss\xEDvel carregar as op\xE7\xF5es." }) : items.length === 0 ? /* @__PURE__ */ jsx8(Text4, { py: "18px", px: "10px", color: "#98A2B3", fontSize: "10px", textAlign: "center", children: "Nenhum registro encontrado." }) : items.map((record, index) => {
+            const id = referenceId(record);
+            if (!id) return null;
+            const selected = String(id) === String(value);
+            const active = index === activeIndex;
+            const optionLabel = referenceOptionLabel(record, schema?.searchable);
+            const status = record.status;
+            return /* @__PURE__ */ jsxs4(
+              Button3,
+              {
+                id: `${listId}-option-${index}`,
+                ref: (element) => {
+                  optionRefs.current[index] = element;
+                },
+                type: "button",
+                role: "option",
+                "aria-selected": selected,
+                w: "100%",
+                minH: "38px",
+                h: "auto",
+                px: "9px",
+                py: "7px",
+                display: "flex",
+                flexDirection: "column",
+                alignItems: "flex-start",
+                gap: 0,
+                color: active || selected ? "#014364" : "#475467",
+                bg: active || selected ? "#F0F7FF" : "transparent",
+                border: 0,
+                borderRadius: "5px",
+                fontWeight: "400",
+                textAlign: "left",
+                onMouseEnter: () => setActiveIndex(index),
+                onMouseDown: (event) => event.preventDefault(),
+                onClick: () => choose(record),
+                _hover: { color: "#014364", bg: "#F0F7FF" },
+                children: [
+                  /* @__PURE__ */ jsx8(Text4, { as: "strong", fontSize: "10px", fontWeight: "600", children: optionLabel }),
+                  status ? /* @__PURE__ */ jsx8(Text4, { as: "small", color: "#98A2B3", fontSize: "9px", textTransform: "capitalize", children: String(status).replace(/_/g, " ") }) : null
+                ]
+              },
+              id
+            );
+          }) })
+        ]
+      }
+    ) : null
+  ] });
 }
-function toInputValue(value, kind) {
+
+// src/components/internal/DynamicForm.tsx
+import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
+var idFor = (field) => `oon-form-field-${field.replace(/[^a-zA-Z0-9_-]/g, "-")}`;
+var errorIdFor = (field) => `${idFor(field)}-error`;
+var normalize = (value) => String(value ?? "").normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase();
+function CloseIcon() {
+  return /* @__PURE__ */ jsx9("svg", { viewBox: "0 0 20 20", width: "18", height: "18", "aria-hidden": "true", children: /* @__PURE__ */ jsx9("path", { d: "m6 6 8 8M14 6l-8 8", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" }) });
+}
+function CheckIcon() {
+  return /* @__PURE__ */ jsxs5("svg", { viewBox: "0 0 20 20", width: "16", height: "16", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx9("circle", { cx: "10", cy: "10", r: "7", fill: "none", stroke: "currentColor", strokeWidth: "1.4" }),
+    /* @__PURE__ */ jsx9("path", { d: "m6.8 10.1 2 2 4.3-4.4", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
+  ] });
+}
+function AlertIcon() {
+  return /* @__PURE__ */ jsxs5("svg", { viewBox: "0 0 20 20", width: "17", height: "17", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx9("circle", { cx: "10", cy: "10", r: "7", fill: "none", stroke: "currentColor", strokeWidth: "1.4" }),
+    /* @__PURE__ */ jsx9("path", { d: "M10 6.5v4.2M10 13.5v.1", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" })
+  ] });
+}
+function toValue(value, kind) {
   if (value == null) return "";
-  if (kind === "date" && value) {
+  if (kind === "date") {
     try {
       return new Date(value).toISOString().slice(0, 10);
     } catch {
@@ -557,101 +1304,221 @@ function toInputValue(value, kind) {
     }
   }
   if (typeof value === "object") {
-    const obj = value;
-    return String(obj._id ?? "");
+    const record = value;
+    return String(record._id ?? record.id ?? "");
   }
   return String(value);
 }
-function DynamicForm({ title, fields, initialValues, submitting, error, onSubmit, onCancel }) {
-  const [values, setValues] = useState3(() => {
-    const init = {};
-    for (const f of fields) init[f.field] = toInputValue(initialValues?.[f.field], f.kind);
-    return init;
+function coerce(value, kind) {
+  if (value === "") return void 0;
+  if (["number", "currency", "currencyConverted"].includes(kind ?? "")) return Number(value);
+  if (kind === "boolean") return value === "true";
+  return value;
+}
+function validate(fields, values) {
+  const errors = {};
+  fields.forEach((field) => {
+    if (field.required && !(values[field.field] ?? "").trim()) errors[field.field] = `${fieldLabel({ name: field.field, label: field.label })} \xE9 obrigat\xF3rio.`;
   });
-  const setField = (name, value) => setValues((prev) => ({ ...prev, [name]: value }));
-  const handleSubmit = (e) => {
-    e.preventDefault();
-    const payload = {};
-    for (const f of fields) {
-      const coerced = coerce(values[f.field] ?? "", f.kind);
-      if (coerced !== void 0) payload[f.field] = coerced;
+  return errors;
+}
+function messageOf(error) {
+  if (!error) return null;
+  if (typeof error === "string") return error;
+  if (error instanceof Error) return error.message;
+  if (typeof error === "object") {
+    const record = error;
+    if (typeof record.message === "string") return record.message;
+    if (record.error && typeof record.error === "object" && typeof record.error.message === "string") return record.error.message;
+  }
+  return "N\xE3o foi poss\xEDvel salvar o registro.";
+}
+function detailErrors(error, fields) {
+  const result = {};
+  const lookup = new Map(fields.flatMap((field) => [[normalize(field.field), field], [normalize(field.label), field]]));
+  const seen = /* @__PURE__ */ new WeakSet();
+  const visit = (value, hint) => {
+    if (value == null) return;
+    if (Array.isArray(value)) return value.forEach((item) => visit(item, hint));
+    if (typeof value !== "object" || seen.has(value)) return;
+    seen.add(value);
+    const record = value;
+    const candidate = String(record.field ?? record.path ?? record.property ?? record.name ?? hint ?? "");
+    const field = lookup.get(normalize(candidate.split(/[.[\]]+/).filter(Boolean).pop() ?? candidate));
+    const raw = record.message ?? record.msg ?? record.reason;
+    if (field && typeof raw === "string") result[field.field] = /required|obrigat/i.test(raw) ? `${fieldLabel({ name: field.field, label: field.label })} \xE9 obrigat\xF3rio.` : raw;
+    Object.entries(record).forEach(([key, nested]) => {
+      const direct = lookup.get(normalize(key));
+      if (direct && typeof nested === "string") result[direct.field] = nested;
+      visit(nested, key);
+    });
+  };
+  if (error && typeof error === "object") {
+    const record = error;
+    visit(record.details ?? record.error?.details ?? record);
+  }
+  return result;
+}
+function focusField(field) {
+  window.setTimeout(() => {
+    const element = document.getElementById(idFor(field));
+    element?.scrollIntoView?.({ behavior: "smooth", block: "center" });
+    element?.focus({ preventScroll: true });
+  }, 0);
+}
+function isMultiline(field) {
+  return field.multiline === true || /observa|descricao|mensagem|detalhe|necessidade/i.test(field.field);
+}
+function Label({ id, label, required }) {
+  return /* @__PURE__ */ jsx9("label", { htmlFor: id, children: /* @__PURE__ */ jsxs5(Text5, { as: "span", display: "block", mb: "6px", color: "#475467", fontSize: "11px", fontWeight: "600", children: [
+    label,
+    required ? /* @__PURE__ */ jsx9(Text5, { as: "span", color: "#DC2626", children: " *" }) : null
+  ] }) });
+}
+function ErrorText({ id, text }) {
+  return text ? /* @__PURE__ */ jsx9(Text5, { id, role: "alert", mt: "5px", color: "#DC2626", fontSize: "10px", fontWeight: "500", children: text }) : null;
+}
+var controlProps = (invalid) => ({
+  minH: "37px",
+  px: "10px",
+  py: "8px",
+  color: "#475467",
+  bg: "white",
+  borderColor: invalid ? "#DC2626" : "#D5DDE3",
+  borderRadius: "6px",
+  boxShadow: invalid ? "0 0 0 3px rgba(220,38,38,.08)" : void 0,
+  fontSize: "11px"
+});
+function DynamicForm({ title, eyebrow = "Cadastro", fields, initialValues, submitting, error, onSubmit, onCancel, onFieldChange }) {
+  const [values, setValues] = useState5(() => Object.fromEntries(fields.map((field) => [field.field, toValue(initialValues?.[field.field], field.kind)])));
+  const [errors, setErrors] = useState5({});
+  const [dismissed, setDismissed] = useState5(false);
+  useEffect4(() => {
+    const listener = (event) => {
+      if (event.key !== "Escape" || event.defaultPrevented || submitting) return;
+      if (event.target?.closest('[role="combobox"], [role="listbox"]')) return;
+      onCancel();
+    };
+    document.addEventListener("keydown", listener);
+    return () => document.removeEventListener("keydown", listener);
+  }, [onCancel, submitting]);
+  useEffect4(() => {
+    setDismissed(false);
+    if (!error) return;
+    const detailed = detailErrors(error, fields);
+    const fallback = /validacao|validation/i.test(normalize(messageOf(error))) ? validate(fields, values) : {};
+    const next = Object.keys(detailed).length ? detailed : fallback;
+    if (!Object.keys(next).length) return;
+    setErrors((current) => ({ ...current, ...next }));
+    const first = fields.find((field) => next[field.field]);
+    if (first) focusField(first.field);
+  }, [error]);
+  const change = (field, value) => {
+    setValues((current) => ({ ...current, [field]: value }));
+    setErrors((current) => {
+      if (!current[field]) return current;
+      const next = { ...current };
+      delete next[field];
+      return next;
+    });
+    setDismissed(true);
+    onFieldChange?.();
+  };
+  const submit = (event) => {
+    event.preventDefault();
+    const validation = validate(fields, values);
+    if (Object.keys(validation).length) {
+      setErrors(validation);
+      setDismissed(true);
+      const first = fields.find((field) => validation[field.field]);
+      if (first) focusField(first.field);
+      return;
     }
+    const payload = {};
+    fields.forEach((field) => {
+      const value = coerce(values[field.field] ?? "", field.kind);
+      if (value !== void 0) payload[field.field] = value;
+    });
+    setErrors({});
     onSubmit(payload);
   };
-  return /* @__PURE__ */ jsxs4(Box3, { borderWidth: "1px", borderColor: "gray.200", borderRadius: "md", bg: "white", p: 6, maxW: "640px", children: [
-    /* @__PURE__ */ jsx7(Heading2, { size: "md", mb: 4, children: title }),
-    /* @__PURE__ */ jsx7("form", { onSubmit: handleSubmit, children: /* @__PURE__ */ jsxs4(Stack, { gap: 4, children: [
-      fields.map((f) => {
-        const label = fieldLabel({ name: f.field, label: f.label });
-        if (f.kind === "enum" && f.options?.length) {
-          return /* @__PURE__ */ jsxs4(Box3, { children: [
-            /* @__PURE__ */ jsx7(Text4, { fontSize: "sm", mb: 1, fontWeight: "medium", children: label }),
-            /* @__PURE__ */ jsxs4(NativeSelect.Root, { size: "sm", children: [
-              /* @__PURE__ */ jsxs4(
-                NativeSelect.Field,
-                {
-                  value: values[f.field] ?? "",
-                  onChange: (e) => setField(f.field, e.currentTarget.value),
-                  children: [
-                    /* @__PURE__ */ jsx7("option", { value: "", children: "\u2014" }),
-                    f.options.map((opt) => /* @__PURE__ */ jsx7("option", { value: opt, children: opt }, opt))
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsx7(NativeSelect.Indicator, {})
-            ] })
-          ] }, f.field);
-        }
-        if (f.kind === "boolean") {
-          return /* @__PURE__ */ jsxs4(Box3, { children: [
-            /* @__PURE__ */ jsx7(Text4, { fontSize: "sm", mb: 1, fontWeight: "medium", children: label }),
-            /* @__PURE__ */ jsxs4(NativeSelect.Root, { size: "sm", children: [
-              /* @__PURE__ */ jsxs4(
-                NativeSelect.Field,
-                {
-                  value: values[f.field] ?? "",
-                  onChange: (e) => setField(f.field, e.currentTarget.value),
-                  children: [
-                    /* @__PURE__ */ jsx7("option", { value: "", children: "\u2014" }),
-                    /* @__PURE__ */ jsx7("option", { value: "true", children: "Sim" }),
-                    /* @__PURE__ */ jsx7("option", { value: "false", children: "N\xE3o" })
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsx7(NativeSelect.Indicator, {})
-            ] })
-          ] }, f.field);
-        }
-        const inputType = f.kind === "date" ? "date" : f.kind === "number" || f.kind === "currency" || f.kind === "currencyConverted" ? "number" : "text";
-        return /* @__PURE__ */ jsxs4(Box3, { children: [
-          /* @__PURE__ */ jsxs4(Text4, { fontSize: "sm", mb: 1, fontWeight: "medium", children: [
-            label,
-            f.required ? " *" : ""
+  const invalid = fields.filter((field) => errors[field.field]);
+  const generic = dismissed ? null : messageOf(error);
+  return /* @__PURE__ */ jsx9(Flex4, { position: "fixed", inset: 0, zIndex: 1e3, align: "center", justify: "center", p: { base: 2, md: 6 }, bg: "rgba(15,23,42,.48)", backdropFilter: "blur(2px)", onMouseDown: (event) => {
+    if (event.currentTarget === event.target && !submitting) onCancel();
+  }, children: /* @__PURE__ */ jsxs5(Box4, { role: "dialog", "aria-modal": "true", "aria-label": title, w: "min(860px, 96vw)", maxH: "min(880px, 94vh)", overflow: "hidden", bg: "white", borderWidth: "1px", borderColor: "#E5E9ED", borderRadius: "14px", boxShadow: "0 24px 70px rgba(15,23,42,.24)", children: [
+    /* @__PURE__ */ jsxs5(Flex4, { minH: "76px", px: "20px", py: "16px", align: "center", justify: "space-between", borderBottomWidth: "1px", borderColor: "#E5E9ED", children: [
+      /* @__PURE__ */ jsxs5(Box4, { children: [
+        /* @__PURE__ */ jsx9(Text5, { color: "#0474AF", fontSize: "10px", fontWeight: "600", letterSpacing: ".07em", textTransform: "uppercase", children: eyebrow }),
+        /* @__PURE__ */ jsx9(Heading2, { mt: "3px", color: "#344054", fontSize: "18px", fontWeight: "600", children: title })
+      ] }),
+      /* @__PURE__ */ jsx9(Button4, { type: "button", "aria-label": "Fechar", w: "31px", minW: "31px", h: "31px", p: 0, color: "#667085", bg: "white", borderWidth: "1px", borderColor: "#E5E9ED", borderRadius: "6px", disabled: submitting, onClick: onCancel, _hover: { color: "#036491", bg: "#F0F7FF", borderColor: "#B8D9EB" }, children: /* @__PURE__ */ jsx9(CloseIcon, {}) })
+    ] }),
+    /* @__PURE__ */ jsxs5("form", { noValidate: true, onSubmit: submit, children: [
+      /* @__PURE__ */ jsx9(Box4, { maxH: "calc(94vh - 148px)", px: "20px", pt: "18px", pb: "24px", overflowY: "auto", children: /* @__PURE__ */ jsxs5(Stack2, { gap: 4, children: [
+        invalid.length ? /* @__PURE__ */ jsxs5(Box4, { role: "alert", p: "11px 13px", color: "#9B1C1C", bg: "#FFF5F5", borderWidth: "1px", borderColor: "#FECACA", borderLeftWidth: "4px", borderLeftColor: "#DC2626", borderRadius: "8px", fontSize: "11px", children: [
+          /* @__PURE__ */ jsxs5(Flex4, { align: "center", gap: "7px", children: [
+            /* @__PURE__ */ jsx9(AlertIcon, {}),
+            /* @__PURE__ */ jsx9(Text5, { as: "strong", children: "N\xE3o foi poss\xEDvel salvar. Corrija os campos abaixo:" })
           ] }),
-          /* @__PURE__ */ jsx7(
-            Input2,
-            {
-              size: "sm",
-              type: inputType,
-              required: f.required,
-              value: values[f.field] ?? "",
-              onChange: (e) => setField(f.field, e.currentTarget.value)
-            }
-          )
-        ] }, f.field);
-      }),
-      error ? /* @__PURE__ */ jsx7(Text4, { fontSize: "sm", color: "red.600", children: error }) : null,
-      /* @__PURE__ */ jsxs4(Flex3, { gap: 3, justify: "end", mt: 2, children: [
-        /* @__PURE__ */ jsx7(Button2, { size: "sm", variant: "ghost", type: "button", onClick: onCancel, children: "Cancelar" }),
-        /* @__PURE__ */ jsx7(Button2, { size: "sm", colorPalette: "blue", type: "submit", loading: submitting, children: "Salvar" })
+          /* @__PURE__ */ jsx9(Box4, { as: "ul", mt: "7px", mb: 0, pl: "20px", display: "grid", gap: "3px", children: invalid.map((field) => /* @__PURE__ */ jsx9("li", { children: /* @__PURE__ */ jsxs5(Button4, { type: "button", variant: "plain", minH: "auto", h: "auto", p: 0, color: "#B42318", fontSize: "10px", fontWeight: "400", textDecoration: "underline", onClick: () => focusField(field.field), children: [
+            fieldLabel({ name: field.field, label: field.label }),
+            ": ",
+            errors[field.field]
+          ] }) }, field.field)) })
+        ] }) : null,
+        generic && !invalid.length ? /* @__PURE__ */ jsxs5(Flex4, { role: "alert", p: "10px 12px", align: "center", gap: 2, color: "#B42318", bg: "#FEF3F2", borderWidth: "1px", borderColor: "#FECDCA", borderRadius: "7px", fontSize: "11px", children: [
+          /* @__PURE__ */ jsx9(AlertIcon, {}),
+          generic
+        ] }) : null,
+        /* @__PURE__ */ jsx9(SimpleGrid, { columns: { base: 1, lg: 2 }, gapX: "16px", gapY: "15px", children: fields.map((baseField) => {
+          const field = baseField;
+          const label = fieldLabel({ name: field.field, label: field.label });
+          const message = errors[field.field];
+          const id = idFor(field.field);
+          const errorId = message ? errorIdFor(field.field) : void 0;
+          const multiline = isMultiline(field);
+          const span = field.span === 2 || multiline;
+          const wrap = (control) => /* @__PURE__ */ jsxs5(Box4, { gridColumn: span ? "1 / -1" : void 0, children: [
+            /* @__PURE__ */ jsx9(Label, { id, label, required: field.required }),
+            control,
+            /* @__PURE__ */ jsx9(ErrorText, { id: errorId, text: message })
+          ] }, field.field);
+          if (field.kind === "ref" && field.ref) return wrap(/* @__PURE__ */ jsx9(ReferenceSelect, { field: field.field, inputId: id, errorId, label, refModel: field.ref, value: values[field.field] ?? "", initialValue: initialValues?.[field.field], required: field.required, invalid: !!message, error: message, onChange: (value) => change(field.field, value) }));
+          if (field.kind === "enum" && field.options?.length) return wrap(/* @__PURE__ */ jsxs5(NativeSelect2.Root, { size: "sm", children: [
+            /* @__PURE__ */ jsxs5(NativeSelect2.Field, { id, "aria-invalid": !!message, "aria-describedby": errorId, value: values[field.field] ?? "", ...controlProps(!!message), onChange: (event) => change(field.field, event.currentTarget.value), children: [
+              /* @__PURE__ */ jsx9("option", { value: "", children: "\u2014 Selecione \u2014" }),
+              field.options.map((option) => /* @__PURE__ */ jsx9("option", { value: option, children: option }, option))
+            ] }),
+            /* @__PURE__ */ jsx9(NativeSelect2.Indicator, {})
+          ] }));
+          if (field.kind === "boolean") return wrap(/* @__PURE__ */ jsxs5(NativeSelect2.Root, { size: "sm", children: [
+            /* @__PURE__ */ jsxs5(NativeSelect2.Field, { id, "aria-invalid": !!message, "aria-describedby": errorId, value: values[field.field] ?? "", ...controlProps(!!message), onChange: (event) => change(field.field, event.currentTarget.value), children: [
+              /* @__PURE__ */ jsx9("option", { value: "", children: "\u2014 Selecione \u2014" }),
+              /* @__PURE__ */ jsx9("option", { value: "true", children: "Sim" }),
+              /* @__PURE__ */ jsx9("option", { value: "false", children: "N\xE3o" })
+            ] }),
+            /* @__PURE__ */ jsx9(NativeSelect2.Indicator, {})
+          ] }));
+          if (multiline) return wrap(/* @__PURE__ */ jsx9(Textarea, { id, rows: field.rows ?? 4, resize: "vertical", "aria-invalid": !!message, "aria-describedby": errorId, value: values[field.field] ?? "", ...controlProps(!!message), lineHeight: "1.5", onChange: (event) => change(field.field, event.currentTarget.value) }));
+          const type = field.kind === "date" ? "date" : ["number", "currency", "currencyConverted"].includes(field.kind ?? "") ? "number" : "text";
+          return wrap(/* @__PURE__ */ jsx9(Input3, { id, type, step: type === "number" ? "any" : void 0, autoComplete: "off", "aria-invalid": !!message, "aria-describedby": errorId, value: values[field.field] ?? "", ...controlProps(!!message), onChange: (event) => change(field.field, event.currentTarget.value) }));
+        }) })
+      ] }) }),
+      /* @__PURE__ */ jsxs5(Flex4, { minH: "68px", px: "20px", py: "14px", justify: "flex-end", gap: "9px", borderTopWidth: "1px", borderColor: "#E5E9ED", children: [
+        /* @__PURE__ */ jsx9(Button4, { type: "button", minH: "35px", px: "13px", color: "#475467", bg: "white", borderWidth: "1px", borderColor: "#D5DDE3", borderRadius: "6px", fontSize: "11px", fontWeight: "600", disabled: submitting, onClick: onCancel, children: "Cancelar" }),
+        /* @__PURE__ */ jsxs5(Button4, { type: "submit", minH: "35px", px: "13px", colorPalette: "brand", borderRadius: "6px", fontSize: "11px", fontWeight: "600", loading: submitting, children: [
+          /* @__PURE__ */ jsx9(CheckIcon, {}),
+          " Salvar"
+        ] })
       ] })
-    ] }) })
-  ] });
+    ] })
+  ] }) });
 }
 
 // src/components/CoreCollection.tsx
-import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
-function CoreCollection({ model, label, mode = "dynamic", endpoint, columns, form, importExport }) {
+import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
+function CoreCollection({ model, label, section = "Cole\xE7\xE3o", mode = "dynamic", endpoint, columns, form, importExport }) {
   const needsSchema = mode !== "full" || !columns || !form || !endpoint;
   const schemaQuery = useModelSchema(needsSchema ? model : "");
   const schema = schemaQuery.data;
@@ -660,8 +1527,8 @@ function CoreCollection({ model, label, mode = "dynamic", endpoint, columns, for
   const resolvedForm = form ?? (schema ? formFieldsFromMeta(schema.fields) : []);
   const resource = useOonResource(basePath);
   const queryClient = useQueryClient();
-  const [formState, setFormState] = useState4({ open: false });
-  const [formError, setFormError] = useState4(null);
+  const [formState, setFormState] = useState6({ open: false });
+  const [formError, setFormError] = useState6(null);
   const invalidate = () => queryClient.invalidateQueries({ queryKey: ["oon", "list", basePath] });
   const saveMutation = useMutation({
     mutationFn: (values) => {
@@ -674,54 +1541,68 @@ function CoreCollection({ model, label, mode = "dynamic", endpoint, columns, for
       setFormError(null);
       invalidate();
     },
-    onError: (err) => setFormError(err.message)
+    onError: (error) => setFormError(error)
   });
   const deleteMutation = useMutation({
     mutationFn: (row) => resource.delete(row._id),
     onSuccess: invalidate
   });
-  if (needsSchema && schemaQuery.isLoading) return /* @__PURE__ */ jsx8(LoadingScreen, {});
-  if (needsSchema && schemaQuery.isError) return /* @__PURE__ */ jsx8(ErrorState, { error: schemaQuery.error });
+  if (needsSchema && schemaQuery.isLoading) return /* @__PURE__ */ jsx10(LoadingScreen, {});
+  if (needsSchema && schemaQuery.isError) return /* @__PURE__ */ jsx10(ErrorState, { error: schemaQuery.error });
   const title = label ?? schema?.name ?? model;
-  return /* @__PURE__ */ jsxs5(Stack2, { gap: 6, children: [
-    /* @__PURE__ */ jsx8(Heading3, { size: "lg", children: title }),
-    formState.open ? /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsxs6(Stack3, { gap: 5, children: [
+    /* @__PURE__ */ jsxs6(Box5, { children: [
+      /* @__PURE__ */ jsx10(Text6, { fontSize: "11px", fontWeight: "700", color: "brand.500", textTransform: "uppercase", letterSpacing: "0.08em", mb: 1, children: section }),
+      /* @__PURE__ */ jsx10(Heading3, { size: "lg", color: "#24323A", letterSpacing: "-0.02em", children: title }),
+      /* @__PURE__ */ jsx10(Text6, { mt: 1, fontSize: "13px", color: "gray.500", children: "Consulte, filtre e mantenha os registros desta opera\xE7\xE3o." })
+    ] }),
+    /* @__PURE__ */ jsx10(
+      DataGrid,
+      {
+        resource,
+        resourceKey: basePath,
+        columns: resolvedColumns,
+        onCreate: () => {
+          setFormError(null);
+          setFormState({ open: true });
+        },
+        onEdit: (row) => {
+          setFormError(null);
+          setFormState({ open: true, row });
+        },
+        onDelete: (row) => {
+          if (window.confirm("Excluir este registro?")) deleteMutation.mutate(row);
+        }
+      }
+    ),
+    formState.open ? /* @__PURE__ */ jsx10(
       DynamicForm,
       {
         title: formState.row ? `Editar ${title}` : `Novo ${title}`,
+        eyebrow: section,
         fields: resolvedForm,
         initialValues: formState.row,
         submitting: saveMutation.isPending,
         error: formError,
-        onSubmit: (values) => saveMutation.mutate(values),
+        onSubmit: (values) => {
+          setFormError(null);
+          saveMutation.mutate(values);
+        },
+        onFieldChange: () => setFormError(null),
         onCancel: () => {
           setFormState({ open: false });
           setFormError(null);
         }
       }
-    ) : /* @__PURE__ */ jsxs5(Box4, { children: [
-      /* @__PURE__ */ jsx8(
-        DataGrid,
-        {
-          resource,
-          resourceKey: basePath,
-          columns: resolvedColumns,
-          onCreate: () => setFormState({ open: true }),
-          onEdit: (row) => setFormState({ open: true, row }),
-          onDelete: (row) => {
-            if (window.confirm("Excluir este registro?")) deleteMutation.mutate(row);
-          }
-        }
-      ),
-      importExport ? null : null
-    ] })
+    ) : null,
+    importExport ? null : null
   ] });
 }
 
 // src/components/CoreDocument.tsx
-import { jsx as jsx9 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 function CoreDocument({ model, label, endpoint, columns, form }) {
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx11(
     CoreCollection,
     {
       model,
@@ -735,25 +1616,48 @@ function CoreDocument({ model, label, endpoint, columns, form }) {
 }
 
 // src/components/CorePipeline.tsx
-import { Box as Box5, Flex as Flex4, Heading as Heading4, Stack as Stack3, Text as Text5 } from "@chakra-ui/react";
-import { useQuery as useQuery3 } from "@tanstack/react-query";
-import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
+import { useState as useState7 } from "react";
+import { Badge as Badge2, Box as Box6, Button as Button5, Flex as Flex5, Heading as Heading4, Stack as Stack4, Text as Text7 } from "@chakra-ui/react";
+import { useMutation as useMutation2, useQuery as useQuery4, useQueryClient as useQueryClient2 } from "@tanstack/react-query";
+import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
+function ticketId(row) {
+  const id = row._id ?? row.id;
+  return id == null ? void 0 : String(id);
+}
 function CorePipeline({ model, label, endpoint, stageField = "status", stages, titleField }) {
   const schemaQuery = useModelSchema(model);
   const schema = schemaQuery.data;
   const basePath = endpoint ?? schema?.basePath ?? `/${model.toLowerCase()}s`;
   const resource = useOonResource(basePath);
-  const listQuery = useQuery3({
+  const queryClient = useQueryClient2();
+  const [selectedTicket, setSelectedTicket] = useState7(null);
+  const [formError, setFormError] = useState7(null);
+  const listQuery = useQuery4({
     queryKey: ["oon", "pipeline", basePath],
     queryFn: () => resource.list({ pageSize: 200 }),
     enabled: !!schema
   });
-  if (schemaQuery.isLoading || listQuery.isLoading) return /* @__PURE__ */ jsx10(LoadingScreen, {});
-  if (schemaQuery.isError) return /* @__PURE__ */ jsx10(ErrorState, { error: schemaQuery.error });
-  if (listQuery.isError) return /* @__PURE__ */ jsx10(ErrorState, { error: listQuery.error });
-  const stageFieldMeta = schema?.fields.find((f) => f.name === stageField);
-  const resolvedStages = stages ?? (stageFieldMeta?.options ?? []).map((opt) => ({ id: opt, label: opt })) ?? [];
-  const title = titleField ?? schema?.fields.find((f) => f.kind === "string")?.name ?? schema?.searchable[0] ?? "_id";
+  const saveMutation = useMutation2({
+    mutationFn: (values) => {
+      const id = selectedTicket ? ticketId(selectedTicket) : void 0;
+      if (!id) throw new Error("N\xE3o foi poss\xEDvel identificar o ticket selecionado.");
+      return resource.update(id, values);
+    },
+    onSuccess: async () => {
+      await queryClient.invalidateQueries({ queryKey: ["oon", "pipeline", basePath] });
+      setSelectedTicket(null);
+      setFormError(null);
+    },
+    onError: (error) => setFormError(error)
+  });
+  if (schemaQuery.isLoading || listQuery.isLoading) return /* @__PURE__ */ jsx12(LoadingScreen, {});
+  if (schemaQuery.isError) return /* @__PURE__ */ jsx12(ErrorState, { error: schemaQuery.error });
+  if (listQuery.isError) return /* @__PURE__ */ jsx12(ErrorState, { error: listQuery.error });
+  const stageFieldMeta = schema?.fields.find((field) => field.name === stageField);
+  const resolvedStages = stages ?? (stageFieldMeta?.options ?? []).map((option) => ({ id: option, label: option }));
+  const title = titleField ?? schema?.fields.find((field) => field.kind === "string")?.name ?? schema?.searchable[0] ?? "_id";
+  const detailFields = (schema?.fields ?? []).filter((field) => field.name !== stageField && field.name !== title && !["raw"].includes(field.kind)).slice(0, 3);
+  const formFields = formFieldsFromMeta(schema?.fields ?? []);
   const rows = listQuery.data?.results ?? [];
   const byStage = /* @__PURE__ */ new Map();
   for (const stage of resolvedStages) byStage.set(stage.id, []);
@@ -762,25 +1666,101 @@ function CorePipeline({ model, label, endpoint, stageField = "status", stages, t
     if (!byStage.has(key)) byStage.set(key, []);
     byStage.get(key).push(row);
   }
-  return /* @__PURE__ */ jsxs6(Stack3, { gap: 6, children: [
-    /* @__PURE__ */ jsx10(Heading4, { size: "lg", children: label ?? schema?.name ?? model }),
-    /* @__PURE__ */ jsx10(Flex4, { gap: 4, align: "stretch", overflowX: "auto", pb: 2, children: Array.from(byStage.entries()).map(([stageId, items]) => {
-      const stageLabel = resolvedStages.find((s) => s.id === stageId)?.label ?? (stageId || "\u2014");
-      return /* @__PURE__ */ jsxs6(Box5, { minW: "280px", bg: "gray.100", borderRadius: "md", p: 3, children: [
-        /* @__PURE__ */ jsxs6(Flex4, { align: "center", justify: "space-between", mb: 3, children: [
-          /* @__PURE__ */ jsx10(Text5, { fontWeight: "semibold", fontSize: "sm", children: stageLabel }),
-          /* @__PURE__ */ jsx10(Text5, { fontSize: "xs", color: "gray.500", children: items.length })
-        ] }),
-        /* @__PURE__ */ jsx10(Stack3, { gap: 2, children: items.map((row, idx) => /* @__PURE__ */ jsx10(Box5, { bg: "white", borderRadius: "md", p: 3, borderWidth: "1px", borderColor: "gray.200", children: /* @__PURE__ */ jsx10(Text5, { fontSize: "sm", fontWeight: "medium", children: formatCell(row[title], "string") }) }, row._id ?? idx)) })
-      ] }, stageId);
-    }) })
+  return /* @__PURE__ */ jsxs7(Stack4, { gap: 5, children: [
+    /* @__PURE__ */ jsxs7(Box6, { children: [
+      /* @__PURE__ */ jsx12(Text7, { fontSize: "11px", fontWeight: "700", color: "brand.500", textTransform: "uppercase", letterSpacing: "0.08em", mb: 1, children: "Esteira de processo" }),
+      /* @__PURE__ */ jsx12(Heading4, { size: "lg", color: "#24323A", letterSpacing: "-0.02em", children: label ?? schema?.name ?? model }),
+      /* @__PURE__ */ jsx12(Text7, { mt: 1, fontSize: "13px", color: "gray.500", children: "Acompanhe os tickets por etapa e visualize os principais dados de cada item." })
+    ] }),
+    /* @__PURE__ */ jsx12(Flex5, { gap: 4, align: "stretch", overflowX: "auto", pb: 3, minH: "420px", children: Array.from(byStage.entries()).map(([stageId, items]) => {
+      const stageLabel = resolvedStages.find((stage) => stage.id === stageId)?.label ?? (stageId || "Sem etapa");
+      return /* @__PURE__ */ jsxs7(
+        Box6,
+        {
+          minW: "300px",
+          maxW: "340px",
+          flex: "1 0 300px",
+          bg: "#E8ECEF",
+          borderRadius: "12px",
+          p: 3,
+          borderWidth: "1px",
+          borderColor: "#DDE3E7",
+          children: [
+            /* @__PURE__ */ jsxs7(Flex5, { align: "center", justify: "space-between", mb: 3, px: 1, children: [
+              /* @__PURE__ */ jsx12(Text7, { fontWeight: "700", fontSize: "12px", color: "#33434C", textTransform: "uppercase", letterSpacing: "0.03em", children: stageLabel }),
+              /* @__PURE__ */ jsx12(Badge2, { colorPalette: "brand", variant: "solid", borderRadius: "full", minW: "24px", justifyContent: "center", children: items.length })
+            ] }),
+            /* @__PURE__ */ jsx12(Stack4, { gap: 2, children: items.length === 0 ? /* @__PURE__ */ jsx12(Box6, { borderWidth: "1px", borderStyle: "dashed", borderColor: "#C8D0D5", borderRadius: "10px", p: 5, textAlign: "center", children: /* @__PURE__ */ jsx12(Text7, { fontSize: "12px", color: "gray.500", children: "Nenhum ticket nesta etapa." }) }) : items.map((row, index) => {
+              const ticketTitle = formatCell(row[title], "string");
+              return /* @__PURE__ */ jsxs7(
+                Button5,
+                {
+                  type: "button",
+                  variant: "plain",
+                  display: "block",
+                  w: "100%",
+                  h: "auto",
+                  minH: "auto",
+                  p: 3,
+                  bg: "white",
+                  borderRadius: "10px",
+                  borderWidth: "1px",
+                  borderColor: "#DDE3E7",
+                  boxShadow: "0 3px 10px rgba(7, 38, 46, 0.05)",
+                  textAlign: "left",
+                  whiteSpace: "normal",
+                  transition: "all 0.15s ease",
+                  "aria-label": `Abrir ticket ${ticketTitle}`,
+                  onClick: () => {
+                    setFormError(null);
+                    setSelectedTicket(row);
+                  },
+                  _hover: { borderColor: "brand.300", transform: "translateY(-1px)", boxShadow: "0 7px 18px rgba(7, 38, 46, 0.09)" },
+                  _focusVisible: { borderColor: "brand.500", boxShadow: "0 0 0 3px rgba(4, 116, 175, 0.16)" },
+                  children: [
+                    /* @__PURE__ */ jsx12(Text7, { fontSize: "13px", fontWeight: "700", color: "#24323A", mb: 2, lineClamp: 2, children: ticketTitle }),
+                    /* @__PURE__ */ jsx12(Stack4, { gap: 1, children: detailFields.map((field) => /* @__PURE__ */ jsxs7(Flex5, { gap: 2, align: "baseline", justify: "space-between", children: [
+                      /* @__PURE__ */ jsx12(Text7, { fontSize: "10px", color: "gray.500", textTransform: "uppercase", letterSpacing: "0.03em", children: fieldLabel(field) }),
+                      /* @__PURE__ */ jsx12(Text7, { fontSize: "11px", color: "#46545C", fontWeight: "500", textAlign: "right", lineClamp: 1, children: formatCell(row[field.name], field.kind) })
+                    ] }, field.name)) })
+                  ]
+                },
+                ticketId(row) ?? index
+              );
+            }) })
+          ]
+        },
+        stageId
+      );
+    }) }),
+    selectedTicket ? /* @__PURE__ */ jsx12(
+      DynamicForm,
+      {
+        title: `Editar ${schema?.singular ?? label ?? model}`,
+        eyebrow: "Ticket",
+        fields: formFields,
+        initialValues: selectedTicket,
+        submitting: saveMutation.isPending,
+        error: formError,
+        onSubmit: (values) => {
+          setFormError(null);
+          saveMutation.mutate(values);
+        },
+        onFieldChange: () => setFormError(null),
+        onCancel: () => {
+          if (saveMutation.isPending) return;
+          setSelectedTicket(null);
+          setFormError(null);
+        }
+      }
+    ) : null
   ] });
 }
 
 // src/components/CoreDashboard.tsx
-import { Box as Box6, Heading as Heading5, SimpleGrid, Stack as Stack4, Text as Text6 } from "@chakra-ui/react";
+import { Box as Box7, Heading as Heading5, SimpleGrid as SimpleGrid2, Stack as Stack5, Text as Text8 } from "@chakra-ui/react";
 import { useQueries } from "@tanstack/react-query";
-import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
 function CoreDashboard({ label = "Dashboard", widgets = [] }) {
   const { resource } = useOonApi();
   const queries = useQueries({
@@ -797,17 +1777,17 @@ function CoreDashboard({ label = "Dashboard", widgets = [] }) {
     }))
   });
   let queryIdx = 0;
-  return /* @__PURE__ */ jsxs7(Stack4, { gap: 6, children: [
-    /* @__PURE__ */ jsx11(Heading5, { size: "lg", children: label }),
-    /* @__PURE__ */ jsx11(SimpleGrid, { columns: { base: 1, md: 2, lg: 3 }, gap: 4, children: widgets.map((w) => {
+  return /* @__PURE__ */ jsxs8(Stack5, { gap: 6, children: [
+    /* @__PURE__ */ jsx13(Heading5, { size: "lg", children: label }),
+    /* @__PURE__ */ jsx13(SimpleGrid2, { columns: { base: 1, md: 2, lg: 3 }, gap: 4, children: widgets.map((w) => {
       if (w.kind === "custom" && w.render) {
-        return /* @__PURE__ */ jsx11(Box6, { borderWidth: "1px", borderColor: "gray.200", borderRadius: "md", bg: "white", p: 5, children: w.render() }, w.id);
+        return /* @__PURE__ */ jsx13(Box7, { borderWidth: "1px", borderColor: "gray.200", borderRadius: "md", bg: "white", p: 5, children: w.render() }, w.id);
       }
       const q = queries[queryIdx++];
       const value = q?.isLoading ? "\u2026" : q?.isError ? "\u2014" : formatWidget(q?.data, w.kind, w.field);
-      return /* @__PURE__ */ jsxs7(Box6, { borderWidth: "1px", borderColor: "gray.200", borderRadius: "md", bg: "white", p: 5, children: [
-        /* @__PURE__ */ jsx11(Text6, { fontSize: "sm", color: "gray.500", children: w.label }),
-        /* @__PURE__ */ jsx11(Heading5, { size: "xl", mt: 1, children: value })
+      return /* @__PURE__ */ jsxs8(Box7, { borderWidth: "1px", borderColor: "gray.200", borderRadius: "md", bg: "white", p: 5, children: [
+        /* @__PURE__ */ jsx13(Text8, { fontSize: "sm", color: "gray.500", children: w.label }),
+        /* @__PURE__ */ jsx13(Heading5, { size: "xl", mt: 1, children: value })
       ] }, w.id);
     }) })
   ] });
@@ -821,7 +1801,7 @@ function formatWidget(value, kind, field) {
 }
 
 // src/app/moduleRegistry.tsx
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 function slug(value) {
   return value.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
 }
@@ -844,7 +1824,7 @@ function renderView(view) {
   switch (view.type) {
     case "collection": {
       const v = view;
-      return /* @__PURE__ */ jsx12(
+      return /* @__PURE__ */ jsx14(
         CoreCollection,
         {
           model: v.model,
@@ -858,11 +1838,11 @@ function renderView(view) {
     }
     case "document": {
       const v = view;
-      return /* @__PURE__ */ jsx12(CoreDocument, { model: v.model, label: viewLabel(v), approval: v.approval, attachments: v.attachments });
+      return /* @__PURE__ */ jsx14(CoreDocument, { model: v.model, label: viewLabel(v), approval: v.approval, attachments: v.attachments });
     }
     case "pipeline": {
       const v = view;
-      return /* @__PURE__ */ jsx12(
+      return /* @__PURE__ */ jsx14(
         CorePipeline,
         {
           model: v.model,
@@ -874,7 +1854,7 @@ function renderView(view) {
     }
     case "dashboard": {
       const v = view;
-      return /* @__PURE__ */ jsx12(CoreDashboard, { label: viewLabel(v), widgets: v.widgets });
+      return /* @__PURE__ */ jsx14(CoreDashboard, { label: viewLabel(v), widgets: v.widgets });
     }
     default:
       return null;
@@ -922,20 +1902,23 @@ function resolveRegistry(config) {
 }
 
 // src/app/createOonRouter.tsx
-import { createBrowserRouter } from "react-router-dom";
+import {
+  Navigate as Navigate4,
+  createBrowserRouter
+} from "react-router-dom";
 
 // src/shell/AuthenticatedLayout.tsx
-import { Box as Box8, Button as Button3, Flex as Flex6, Spacer as Spacer2, Text as Text8 } from "@chakra-ui/react";
+import { Box as Box9, Button as Button6, Flex as Flex7, Spacer as Spacer2, Text as Text10 } from "@chakra-ui/react";
 import { Outlet } from "react-router-dom";
 
 // src/shell/Sidebar.tsx
-import { Box as Box7, Flex as Flex5, Image, Stack as Stack5, Text as Text7 } from "@chakra-ui/react";
+import { Box as Box8, Flex as Flex6, Image, Stack as Stack6, Text as Text9 } from "@chakra-ui/react";
 import { NavLink } from "react-router-dom";
-import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
 function groupBySection(items) {
   const groups = /* @__PURE__ */ new Map();
   for (const item of items) {
-    const section = item.section ?? "";
+    const section = item.section ?? "Geral";
     if (!groups.has(section)) groups.set(section, []);
     groups.get(section).push(item);
   }
@@ -944,85 +1927,762 @@ function groupBySection(items) {
 function Sidebar({ app, menu }) {
   const { hasPermission } = useOonAuth();
   const visible = menu.filter((item) => hasPermission(item.permissions));
-  return /* @__PURE__ */ jsxs8(Box7, { as: "nav", w: "260px", minH: "100vh", borderRightWidth: "1px", borderColor: "gray.200", px: 4, py: 6, bg: "white", children: [
-    /* @__PURE__ */ jsxs8(Flex5, { align: "center", gap: 3, mb: 8, px: 2, children: [
-      app.logo ? /* @__PURE__ */ jsx13(Image, { src: app.logo, alt: app.name, maxH: "36px" }) : null,
-      /* @__PURE__ */ jsx13(Text7, { fontWeight: "bold", fontSize: "md", children: app.name })
-    ] }),
-    /* @__PURE__ */ jsx13(Stack5, { gap: 6, children: groupBySection(visible).map(([section, items]) => /* @__PURE__ */ jsxs8(Stack5, { gap: 1, children: [
-      section ? /* @__PURE__ */ jsx13(Text7, { fontSize: "xs", fontWeight: "semibold", color: "gray.400", textTransform: "uppercase", px: 3, mb: 1, children: section }) : null,
-      items.map((item) => /* @__PURE__ */ jsx13(NavLink, { to: item.href, end: item.href === "/", children: ({ isActive }) => /* @__PURE__ */ jsxs8(
-        Flex5,
+  return /* @__PURE__ */ jsxs9(
+    Box8,
+    {
+      as: "nav",
+      w: { base: "76px", lg: "248px" },
+      minH: "100vh",
+      borderRightWidth: "1px",
+      borderColor: "#E8ECEF",
+      px: { base: 2, lg: 3 },
+      py: 4,
+      bg: "white",
+      position: "sticky",
+      top: 0,
+      alignSelf: "flex-start",
+      overflowY: "auto",
+      children: [
+        /* @__PURE__ */ jsxs9(Flex6, { align: "center", gap: 3, mb: 6, px: { base: 1, lg: 2 }, minH: "42px", children: [
+          app.logo ? /* @__PURE__ */ jsx15(Image, { src: app.logo, alt: app.name, maxH: "36px", maxW: { base: "44px", lg: "150px" }, objectFit: "contain" }) : /* @__PURE__ */ jsx15(
+            Flex6,
+            {
+              w: "38px",
+              h: "38px",
+              flex: "0 0 auto",
+              borderRadius: "12px",
+              align: "center",
+              justify: "center",
+              bg: "brand.500",
+              color: "white",
+              fontWeight: "700",
+              fontSize: "lg",
+              children: "O"
+            }
+          ),
+          /* @__PURE__ */ jsxs9(Box8, { display: { base: "none", lg: "block" }, minW: 0, children: [
+            /* @__PURE__ */ jsx15(Text9, { fontWeight: "700", fontSize: "sm", color: "#07262E", lineClamp: 1, children: app.name }),
+            /* @__PURE__ */ jsx15(Text9, { fontSize: "10px", color: "gray.500", textTransform: "uppercase", letterSpacing: "0.08em", children: "Opera\xE7\xE3o digital" })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx15(Stack6, { gap: 5, children: groupBySection(visible).map(([section, items]) => /* @__PURE__ */ jsxs9(Stack6, { gap: 1, children: [
+          /* @__PURE__ */ jsx15(
+            Text9,
+            {
+              display: { base: "none", lg: "block" },
+              fontSize: "10px",
+              fontWeight: "600",
+              color: "gray.400",
+              textTransform: "uppercase",
+              letterSpacing: "0.08em",
+              px: 3,
+              mb: 1,
+              children: section
+            }
+          ),
+          items.map((item) => /* @__PURE__ */ jsx15(NavLink, { to: item.href, end: item.href === "/", title: item.label, children: ({ isActive }) => /* @__PURE__ */ jsxs9(
+            Flex6,
+            {
+              align: "center",
+              justify: { base: "center", lg: "flex-start" },
+              gap: 3,
+              px: { base: 2, lg: 3 },
+              py: "10px",
+              borderRadius: "9px",
+              fontSize: "13px",
+              fontWeight: isActive ? "600" : "500",
+              bg: isActive ? "brand.50" : "transparent",
+              color: isActive ? "brand.700" : "#46545C",
+              borderLeftWidth: "3px",
+              borderLeftColor: isActive ? "brand.500" : "transparent",
+              transition: "all 0.15s ease",
+              _hover: { bg: isActive ? "brand.50" : "#F8F9FA", color: "brand.700" },
+              children: [
+                item.icon ? /* @__PURE__ */ jsx15(Box8, { flex: "0 0 auto", children: item.icon }) : /* @__PURE__ */ jsx15(Box8, { w: "7px", h: "7px", borderRadius: "full", bg: isActive ? "brand.500" : "gray.300" }),
+                /* @__PURE__ */ jsx15(Text9, { display: { base: "none", lg: "block" }, lineClamp: 1, children: item.label })
+              ]
+            }
+          ) }, item.href))
+        ] }, section)) })
+      ]
+    }
+  );
+}
+
+// src/shell/AuthenticatedLayout.tsx
+import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
+function AuthenticatedLayout({ app, menu }) {
+  const { user, logout } = useOonAuth();
+  return /* @__PURE__ */ jsxs10(Flex7, { align: "stretch", minH: "100vh", bg: "#F8F9FA", children: [
+    /* @__PURE__ */ jsx16(Sidebar, { app, menu }),
+    /* @__PURE__ */ jsxs10(Flex7, { direction: "column", flex: "1", minW: 0, children: [
+      /* @__PURE__ */ jsxs10(
+        Flex7,
         {
+          as: "header",
           align: "center",
-          gap: 2,
-          px: 3,
-          py: 2,
-          borderRadius: "md",
-          fontSize: "sm",
-          fontWeight: isActive ? "semibold" : "normal",
-          bg: isActive ? "blue.50" : "transparent",
-          color: isActive ? "blue.700" : "gray.700",
-          _hover: { bg: isActive ? "blue.50" : "gray.50" },
+          minH: "64px",
+          px: { base: 4, lg: 6 },
+          py: 3,
+          borderBottomWidth: "1px",
+          borderColor: "#E8ECEF",
+          bg: "rgba(255, 255, 255, 0.96)",
+          backdropFilter: "blur(10px)",
+          position: "sticky",
+          top: 0,
+          zIndex: 10,
           children: [
-            item.icon,
-            /* @__PURE__ */ jsx13("span", { children: item.label })
+            /* @__PURE__ */ jsxs10(Box9, { children: [
+              /* @__PURE__ */ jsx16(Text10, { fontSize: "xs", fontWeight: "600", color: "brand.500", textTransform: "uppercase", letterSpacing: "0.08em", children: "Central Oon" }),
+              /* @__PURE__ */ jsx16(Text10, { fontSize: "sm", fontWeight: "600", color: "#24323A", children: app.title ?? app.name })
+            ] }),
+            /* @__PURE__ */ jsx16(Spacer2, {}),
+            user ? /* @__PURE__ */ jsxs10(Flex7, { align: "center", gap: 3, children: [
+              /* @__PURE__ */ jsxs10(Box9, { textAlign: "right", display: { base: "none", md: "block" }, children: [
+                /* @__PURE__ */ jsx16(Text10, { fontSize: "sm", fontWeight: "600", color: "#24323A", children: user.nome }),
+                user.email ? /* @__PURE__ */ jsx16(Text10, { fontSize: "xs", color: "gray.500", children: user.email }) : null
+              ] }),
+              /* @__PURE__ */ jsx16(Button6, { size: "sm", variant: "outline", colorPalette: "brand", borderRadius: "8px", onClick: logout, children: "Sair" })
+            ] }) : null
           ]
         }
-      ) }, item.href))
-    ] }, section || "_")) })
+      ),
+      /* @__PURE__ */ jsx16(Box9, { as: "main", flex: "1", p: { base: 4, lg: 6 }, minW: 0, children: /* @__PURE__ */ jsx16(Box9, { maxW: "1680px", mx: "auto", children: /* @__PURE__ */ jsx16(Outlet, {}) }) })
+    ] })
   ] });
 }
 
-// src/shell/AuthenticatedLayout.tsx
-import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
-function AuthenticatedLayout({ app, menu }) {
-  const { user, logout } = useOonAuth();
-  return /* @__PURE__ */ jsxs9(Flex6, { align: "stretch", minH: "100vh", bg: "gray.50", children: [
-    /* @__PURE__ */ jsx14(Sidebar, { app, menu }),
-    /* @__PURE__ */ jsxs9(Flex6, { direction: "column", flex: "1", minW: 0, children: [
-      /* @__PURE__ */ jsxs9(Flex6, { as: "header", align: "center", px: 6, py: 3, borderBottomWidth: "1px", borderColor: "gray.200", bg: "white", children: [
-        /* @__PURE__ */ jsx14(Text8, { fontSize: "sm", color: "gray.500", children: app.title ?? app.name }),
-        /* @__PURE__ */ jsx14(Spacer2, {}),
-        user ? /* @__PURE__ */ jsxs9(Flex6, { align: "center", gap: 3, children: [
-          /* @__PURE__ */ jsx14(Text8, { fontSize: "sm", color: "gray.700", children: user.nome }),
-          /* @__PURE__ */ jsx14(Button3, { size: "xs", variant: "outline", onClick: logout, children: "Sair" })
-        ] }) : null
+// src/security/AccessDeniedPage.tsx
+import { Box as Box10, Button as Button7, Flex as Flex8, Heading as Heading6, Text as Text11, VStack } from "@chakra-ui/react";
+import { useNavigate } from "react-router-dom";
+import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
+function AccessDeniedPage({ app }) {
+  const { logout } = useOonAuth();
+  const navigate = useNavigate();
+  function useAnotherAccount() {
+    logout();
+    navigate("/login", { replace: true });
+  }
+  return /* @__PURE__ */ jsx17(Flex8, { minH: "100vh", align: "center", justify: "center", bg: "#F5F8FA", px: 4, children: /* @__PURE__ */ jsx17(
+    Box10,
+    {
+      width: "100%",
+      maxW: "560px",
+      bg: "white",
+      borderWidth: "1px",
+      borderColor: "#E4EBEF",
+      borderRadius: "18px",
+      boxShadow: "0 24px 70px rgba(7, 38, 46, 0.10)",
+      p: { base: 6, md: 10 },
+      children: /* @__PURE__ */ jsxs11(VStack, { align: "stretch", gap: 6, children: [
+        /* @__PURE__ */ jsx17(
+          Box10,
+          {
+            width: "56px",
+            height: "56px",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            borderRadius: "16px",
+            bg: "orange.50",
+            color: "orange.700",
+            fontSize: "2xl",
+            fontWeight: "800",
+            "aria-hidden": "true",
+            children: "!"
+          }
+        ),
+        /* @__PURE__ */ jsxs11(Box10, { children: [
+          /* @__PURE__ */ jsx17(
+            Text11,
+            {
+              color: "#39BFED",
+              fontSize: "xs",
+              fontWeight: "700",
+              letterSpacing: "0.12em",
+              textTransform: "uppercase",
+              children: "Acesso negado"
+            }
+          ),
+          /* @__PURE__ */ jsx17(Heading6, { mt: 2, size: "lg", color: "#07262E", children: "Voc\xEA n\xE3o possui permiss\xE3o para este aplicativo" }),
+          /* @__PURE__ */ jsxs11(Text11, { mt: 3, color: "gray.600", children: [
+            "Seu usu\xE1rio foi autenticado, mas n\xE3o existe uma permiss\xE3o ativa para acessar ",
+            app.title ?? app.name,
+            ". Solicite o acesso ao administrador da sua organiza\xE7\xE3o."
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx17(
+          Button7,
+          {
+            alignSelf: "flex-start",
+            bg: "#07262E",
+            color: "white",
+            _hover: { bg: "#0B3843" },
+            onClick: useAnotherAccount,
+            children: "Entrar com outra conta"
+          }
+        )
+      ] })
+    }
+  ) });
+}
+
+// src/security/AppAccessGuard.tsx
+import { Navigate, useLocation } from "react-router-dom";
+import { Fragment, jsx as jsx18 } from "react/jsx-runtime";
+function loginRedirect(pathname, search) {
+  const destination = `${pathname}${search}`;
+  return `/login?redirect=${encodeURIComponent(destination)}`;
+}
+function AppAccessGuard({ children }) {
+  const { status, retry } = useOonAuth();
+  const location = useLocation();
+  if (status === "loading") return /* @__PURE__ */ jsx18(LoadingScreen, {});
+  if (status === "unauthenticated") {
+    return /* @__PURE__ */ jsx18(
+      Navigate,
+      {
+        to: loginRedirect(location.pathname, location.search),
+        replace: true
+      }
+    );
+  }
+  if (status === "forbidden") {
+    return /* @__PURE__ */ jsx18(Navigate, { to: "/acesso-negado", replace: true });
+  }
+  if (status === "error") {
+    return /* @__PURE__ */ jsx18(
+      LoadingScreen,
+      {
+        message: "N\xE3o foi poss\xEDvel validar seu acesso. Tente novamente.",
+        actionLabel: "Tentar novamente",
+        onAction: () => {
+          void retry().catch(() => void 0);
+        }
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx18(Fragment, { children });
+}
+
+// src/security/LoginPage.tsx
+import { useState as useState8 } from "react";
+import {
+  Box as Box11,
+  Button as Button8,
+  Flex as Flex9,
+  Heading as Heading7,
+  Input as Input4,
+  Text as Text12,
+  VStack as VStack2
+} from "@chakra-ui/react";
+import { Navigate as Navigate2, useLocation as useLocation2 } from "react-router-dom";
+import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
+function safeRedirect(search) {
+  const value = new URLSearchParams(search).get("redirect") || "/";
+  if (!value.startsWith("/") || value.startsWith("//")) return "/";
+  if (value.startsWith("/login") || value.startsWith("/acesso-negado")) {
+    return "/";
+  }
+  return value;
+}
+function LoginPage({ app }) {
+  const { status, login } = useOonAuth();
+  const location = useLocation2();
+  const [email, setEmail] = useState8("");
+  const [password, setPassword] = useState8("");
+  const [submitting, setSubmitting] = useState8(false);
+  const [message, setMessage] = useState8(null);
+  const redirect = safeRedirect(location.search);
+  if (status === "authenticated") {
+    return /* @__PURE__ */ jsx19(Navigate2, { to: redirect, replace: true });
+  }
+  if (status === "forbidden") {
+    return /* @__PURE__ */ jsx19(Navigate2, { to: "/acesso-negado", replace: true });
+  }
+  async function handleSubmit(event) {
+    event.preventDefault();
+    setSubmitting(true);
+    setMessage(null);
+    try {
+      await login(email.trim(), password);
+    } catch (error) {
+      const authError = error;
+      if (authError.status === 403) return;
+      setMessage(
+        authError.status === 401 ? "E-mail ou senha inv\xE1lidos." : authError.message || "N\xE3o foi poss\xEDvel entrar. Tente novamente."
+      );
+    } finally {
+      setSubmitting(false);
+    }
+  }
+  return /* @__PURE__ */ jsx19(Flex9, { minH: "100vh", align: "center", justify: "center", bg: "#F5F8FA", px: 4, children: /* @__PURE__ */ jsx19(
+    Box11,
+    {
+      width: "100%",
+      maxW: "440px",
+      bg: "white",
+      borderWidth: "1px",
+      borderColor: "#E4EBEF",
+      borderRadius: "18px",
+      boxShadow: "0 24px 70px rgba(7, 38, 46, 0.10)",
+      p: { base: 6, md: 9 },
+      children: /* @__PURE__ */ jsx19("form", { onSubmit: handleSubmit, children: /* @__PURE__ */ jsxs12(VStack2, { align: "stretch", gap: 6, children: [
+        /* @__PURE__ */ jsxs12(Box11, { children: [
+          /* @__PURE__ */ jsx19(
+            Text12,
+            {
+              color: "#39BFED",
+              fontSize: "xs",
+              fontWeight: "700",
+              letterSpacing: "0.12em",
+              textTransform: "uppercase",
+              children: "Central Oon"
+            }
+          ),
+          /* @__PURE__ */ jsx19(Heading7, { mt: 2, size: "lg", color: "#07262E", children: app.title ?? app.name }),
+          /* @__PURE__ */ jsx19(Text12, { mt: 2, color: "gray.600", fontSize: "sm", children: "Entre com seu usu\xE1rio autorizado para acessar este aplicativo." })
+        ] }),
+        /* @__PURE__ */ jsxs12(VStack2, { align: "stretch", gap: 4, children: [
+          /* @__PURE__ */ jsxs12(Box11, { children: [
+            /* @__PURE__ */ jsx19(Text12, { mb: 2, fontSize: "sm", fontWeight: "600", color: "#24323A", children: "E-mail" }),
+            /* @__PURE__ */ jsx19(
+              Input4,
+              {
+                type: "email",
+                value: email,
+                onChange: (event) => setEmail(event.target.value),
+                autoComplete: "email",
+                placeholder: "voce@empresa.com.br",
+                required: true
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs12(Box11, { children: [
+            /* @__PURE__ */ jsx19(Text12, { mb: 2, fontSize: "sm", fontWeight: "600", color: "#24323A", children: "Senha" }),
+            /* @__PURE__ */ jsx19(
+              Input4,
+              {
+                type: "password",
+                value: password,
+                onChange: (event) => setPassword(event.target.value),
+                autoComplete: "current-password",
+                placeholder: "Sua senha",
+                required: true
+              }
+            )
+          ] })
+        ] }),
+        message ? /* @__PURE__ */ jsx19(
+          Box11,
+          {
+            role: "alert",
+            borderRadius: "10px",
+            bg: "red.50",
+            color: "red.700",
+            px: 4,
+            py: 3,
+            fontSize: "sm",
+            children: message
+          }
+        ) : null,
+        /* @__PURE__ */ jsx19(
+          Button8,
+          {
+            type: "submit",
+            bg: "#07262E",
+            color: "white",
+            _hover: { bg: "#0B3843" },
+            disabled: submitting || !email.trim() || !password,
+            children: submitting ? "Validando acesso..." : "Entrar"
+          }
+        )
+      ] }) })
+    }
+  ) });
+}
+
+// src/security/ActivationPage.tsx
+import { useEffect as useEffect5, useState as useState9 } from "react";
+import { Box as Box12, Button as Button9, Heading as Heading8, Input as Input5, Text as Text13, VStack as VStack3 } from "@chakra-ui/react";
+import { Fragment as Fragment2, jsx as jsx20, jsxs as jsxs13 } from "react/jsx-runtime";
+function ActivationPage() {
+  const { http } = useOonApi();
+  const activation = useActivation();
+  const [step, setStep] = useState9(1);
+  const [config, setConfig] = useState9(null);
+  const [code, setCode] = useState9("");
+  const [preview, setPreview] = useState9(null);
+  const [global, setGlobal] = useState9({});
+  const [app, setApp] = useState9({});
+  const [rootEmail, setRootEmail] = useState9("");
+  const [rootPassword, setRootPassword] = useState9("");
+  const [error, setError] = useState9(null);
+  const [submitting, setSubmitting] = useState9(false);
+  useEffect5(() => {
+    http.get("/ativacao/configuracao").then((response) => {
+      setConfig(response.data);
+      setGlobal(response.data.defaults || {});
+    }).catch(
+      () => setError("N\xE3o foi poss\xEDvel carregar a configura\xE7\xE3o de ativa\xE7\xE3o.")
+    );
+  }, [http]);
+  useEffect5(() => {
+    if (activation.status === "active") {
+      window.location.replace("/login");
+    }
+  }, [activation.status]);
+  async function activateRoot() {
+    setSubmitting(true);
+    setError(null);
+    try {
+      await http.post("/ativacao/ativar-root", {
+        email: rootEmail.trim(),
+        senha: rootPassword
+      });
+      setRootPassword("");
+      setStep(6);
+      await activation.refresh();
+      window.setTimeout(() => window.location.replace("/login"), 900);
+    } catch (caught) {
+      setRootPassword("");
+      setError(
+        caught.message || "N\xE3o foi poss\xEDvel concluir a ativa\xE7\xE3o inicial."
+      );
+    } finally {
+      setSubmitting(false);
+    }
+  }
+  async function validateCode() {
+    setSubmitting(true);
+    setError(null);
+    try {
+      const response = await http.post("/ativacao/validar-codigo", {
+        codigoAtivacao: code
+      });
+      setPreview(response.data);
+      setStep(2);
+    } catch (caught) {
+      setError(caught.message || "C\xF3digo inv\xE1lido.");
+    } finally {
+      setSubmitting(false);
+    }
+  }
+  async function completeMemberActivation() {
+    setSubmitting(true);
+    setError(null);
+    try {
+      await http.post("/ativacao/concluir", {
+        codigoAtivacao: code,
+        nomeInstancia: global.nomeInstancia,
+        parametrosGlobais: global,
+        parametrosAplicacao: app
+      });
+      setStep(6);
+      setCode("");
+      await activation.refresh();
+      window.setTimeout(() => window.location.replace("/login"), 1200);
+    } catch (caught) {
+      setError(
+        caught.message || "N\xE3o foi poss\xEDvel concluir a ativa\xE7\xE3o."
+      );
+    } finally {
+      setSubmitting(false);
+    }
+  }
+  function renderField(field, values, setValues) {
+    return /* @__PURE__ */ jsxs13(Box12, { w: "100%", children: [
+      /* @__PURE__ */ jsxs13(Text13, { fontWeight: "medium", children: [
+        field.label,
+        field.required ? " *" : ""
       ] }),
-      /* @__PURE__ */ jsx14(Box8, { as: "main", flex: "1", p: 6, minW: 0, children: /* @__PURE__ */ jsx14(Outlet, {}) })
-    ] })
+      /* @__PURE__ */ jsx20(
+        Input5,
+        {
+          type: field.type === "password" || field.type === "secret" ? "password" : field.type === "email" ? "email" : field.type === "url" ? "url" : field.type === "number" || field.type === "integer" ? "number" : "text",
+          value: String(values[field.name] ?? field.defaultValue ?? ""),
+          readOnly: field.readOnly,
+          placeholder: field.placeholder,
+          minLength: field.minLength,
+          autoComplete: field.autoComplete,
+          onChange: (event) => setValues({ ...values, [field.name]: event.target.value })
+        }
+      ),
+      field.helpText ? /* @__PURE__ */ jsx20(Text13, { fontSize: "sm", color: "gray.500", children: field.helpText }) : null
+    ] }, field.name);
+  }
+  const rootMode = config?.mode === "root-bootstrap" || activation.details?.role === "root";
+  if (activation.status === "loading" || !config) {
+    return /* @__PURE__ */ jsx20(Box12, { minH: "100vh", bg: "gray.50", p: 8, children: /* @__PURE__ */ jsxs13(
+      VStack3,
+      {
+        maxW: "760px",
+        mx: "auto",
+        bg: "white",
+        p: 8,
+        borderRadius: "lg",
+        align: "stretch",
+        gap: 5,
+        children: [
+          /* @__PURE__ */ jsx20(Heading8, { children: "Preparando ativa\xE7\xE3o..." }),
+          error ? /* @__PURE__ */ jsx20(Text13, { color: "red.600", children: error }) : null
+        ]
+      }
+    ) });
+  }
+  if (rootMode) {
+    return /* @__PURE__ */ jsx20(Box12, { minH: "100vh", bg: "gray.50", p: 8, children: /* @__PURE__ */ jsxs13(
+      VStack3,
+      {
+        maxW: "560px",
+        mx: "auto",
+        bg: "white",
+        p: 8,
+        borderRadius: "lg",
+        align: "stretch",
+        gap: 5,
+        children: [
+          /* @__PURE__ */ jsx20(Heading8, { children: "Ativa\xE7\xE3o inicial do Ecossistema Oon" }),
+          /* @__PURE__ */ jsx20(Text13, { color: "gray.600", children: "Esta \xE9 a aplica\xE7\xE3o root do ecossistema. Informe somente o e-mail e a senha do primeiro administrador. O Core criar\xE1 a estrutura m\xEDnima necess\xE1ria para liberar o primeiro login." }),
+          /* @__PURE__ */ jsxs13(Text13, { fontSize: "sm", color: "gray.500", children: [
+            "App: ",
+            config.technical.appCode,
+            " \xB7 Ambiente:",
+            " ",
+            config.technical.ambiente
+          ] }),
+          error ? /* @__PURE__ */ jsx20(Text13, { color: "red.600", children: error }) : null,
+          step !== 6 ? /* @__PURE__ */ jsxs13(Fragment2, { children: [
+            /* @__PURE__ */ jsxs13(Box12, { w: "100%", children: [
+              /* @__PURE__ */ jsx20(Text13, { fontWeight: "medium", children: "E-mail do administrador *" }),
+              /* @__PURE__ */ jsx20(
+                Input5,
+                {
+                  type: "email",
+                  autoComplete: "email",
+                  value: rootEmail,
+                  onChange: (event) => setRootEmail(event.target.value),
+                  placeholder: "administrador@empresa.com.br"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs13(Box12, { w: "100%", children: [
+              /* @__PURE__ */ jsx20(Text13, { fontWeight: "medium", children: "Senha *" }),
+              /* @__PURE__ */ jsx20(
+                Input5,
+                {
+                  type: "password",
+                  minLength: 8,
+                  autoComplete: "new-password",
+                  value: rootPassword,
+                  onChange: (event) => setRootPassword(event.target.value),
+                  placeholder: "M\xEDnimo de 8 caracteres"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx20(
+              Button9,
+              {
+                colorPalette: "blue",
+                onClick: activateRoot,
+                loading: submitting,
+                disabled: submitting || !rootEmail.trim() || rootPassword.length < 8 || !activation.details?.podeAtivar,
+                children: "Criar ecossistema e ativar"
+              }
+            )
+          ] }) : /* @__PURE__ */ jsxs13(Fragment2, { children: [
+            /* @__PURE__ */ jsx20(Heading8, { size: "md", children: "Ativa\xE7\xE3o conclu\xEDda" }),
+            /* @__PURE__ */ jsx20(Text13, { children: "Usu\xE1rio, tenant, aplicativo, licen\xE7a e permiss\xF5es foram preparados. Redirecionando para o primeiro login..." })
+          ] })
+        ]
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx20(Box12, { minH: "100vh", bg: "gray.50", p: 8, children: /* @__PURE__ */ jsxs13(
+    VStack3,
+    {
+      maxW: "760px",
+      mx: "auto",
+      bg: "white",
+      p: 8,
+      borderRadius: "lg",
+      align: "stretch",
+      gap: 5,
+      children: [
+        /* @__PURE__ */ jsx20(Heading8, { children: "Ativa\xE7\xE3o da Central Oon" }),
+        /* @__PURE__ */ jsxs13(Text13, { children: [
+          "App: ",
+          config.technical.appCode,
+          " \xB7 Ambiente:",
+          " ",
+          config.technical.ambiente,
+          " \xB7 Central:",
+          " ",
+          config.technical.centralAtivacaoHost
+        ] }),
+        error ? /* @__PURE__ */ jsx20(Text13, { color: "red.600", children: error }) : null,
+        step === 1 && /* @__PURE__ */ jsxs13(Fragment2, { children: [
+          /* @__PURE__ */ jsx20(Text13, { children: "Informe o c\xF3digo de ativa\xE7\xE3o para validar tenant, aplicativo e licen\xE7a antes de consumir o c\xF3digo." }),
+          /* @__PURE__ */ jsx20(
+            Input5,
+            {
+              "aria-label": "C\xF3digo de ativa\xE7\xE3o",
+              value: code,
+              onChange: (event) => setCode(event.target.value),
+              placeholder: "OON-XXXX"
+            }
+          ),
+          /* @__PURE__ */ jsx20(
+            Button9,
+            {
+              onClick: validateCode,
+              loading: submitting,
+              disabled: !code || submitting,
+              children: "Validar c\xF3digo"
+            }
+          )
+        ] }),
+        step === 2 && /* @__PURE__ */ jsxs13(Fragment2, { children: [
+          /* @__PURE__ */ jsx20(Heading8, { size: "md", children: "Confirma\xE7\xE3o" }),
+          /* @__PURE__ */ jsx20("pre", { children: JSON.stringify(preview, null, 2) }),
+          /* @__PURE__ */ jsx20(Button9, { onClick: () => setStep(3), children: "Continuar" })
+        ] }),
+        step === 3 && /* @__PURE__ */ jsxs13(Fragment2, { children: [
+          config.globalFields.map(
+            (field) => renderField(field, global, setGlobal)
+          ),
+          /* @__PURE__ */ jsx20(Button9, { onClick: () => setStep(4), children: "Continuar" })
+        ] }),
+        step === 4 && /* @__PURE__ */ jsxs13(Fragment2, { children: [
+          config.appFields.length ? config.appFields.map((field) => renderField(field, app, setApp)) : /* @__PURE__ */ jsx20(Text13, { children: "Nenhum par\xE2metro adicional declarado." }),
+          /* @__PURE__ */ jsx20(Button9, { onClick: () => setStep(5), children: "Revisar" })
+        ] }),
+        step === 5 && /* @__PURE__ */ jsxs13(Fragment2, { children: [
+          /* @__PURE__ */ jsx20(Text13, { children: "Ao confirmar, o c\xF3digo ser\xE1 consumido e a inst\xE2ncia ser\xE1 registrada no Ecossistema Oon." }),
+          /* @__PURE__ */ jsx20(
+            Button9,
+            {
+              colorPalette: "blue",
+              onClick: completeMemberActivation,
+              loading: submitting,
+              disabled: submitting,
+              children: "Concluir ativa\xE7\xE3o"
+            }
+          )
+        ] }),
+        step === 6 && /* @__PURE__ */ jsxs13(Fragment2, { children: [
+          /* @__PURE__ */ jsx20(Heading8, { size: "md", children: "Ativa\xE7\xE3o conclu\xEDda" }),
+          /* @__PURE__ */ jsx20(Text13, { children: "Redirecionando para o login..." })
+        ] })
+      ]
+    }
+  ) });
+}
+function InstanceBlockedPage({
+  title,
+  message
+}) {
+  return /* @__PURE__ */ jsxs13(Box12, { p: 8, children: [
+    /* @__PURE__ */ jsx20(Heading8, { children: title }),
+    /* @__PURE__ */ jsx20(Text13, { children: message })
   ] });
 }
 
 // src/security/RouteGuard.tsx
-import { Fragment, jsx as jsx15 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx21 } from "react/jsx-runtime";
 function RouteGuard({
   permission,
   children
 }) {
   const { status, hasPermission } = useOonAuth();
-  if (status === "loading") return /* @__PURE__ */ jsx15(LoadingScreen, {});
-  if (status === "unauthenticated") return /* @__PURE__ */ jsx15(LoadingScreen, { message: "Redirecionando para o login..." });
+  if (status === "loading") return /* @__PURE__ */ jsx21(LoadingScreen, {});
+  if (status === "unauthenticated") return /* @__PURE__ */ jsx21(LoadingScreen, { message: "Redirecionando para o login..." });
   if (!hasPermission(permission)) {
-    return /* @__PURE__ */ jsx15(LoadingScreen, { message: "Voc\xEA n\xE3o tem acesso a esta tela." });
+    return /* @__PURE__ */ jsx21(LoadingScreen, { message: "Voc\xEA n\xE3o tem acesso a esta tela." });
   }
-  return /* @__PURE__ */ jsx15(Fragment, { children });
+  return /* @__PURE__ */ jsx21(Fragment3, { children });
+}
+
+// src/security/ActivationGuard.tsx
+import { Navigate as Navigate3 } from "react-router-dom";
+import { jsx as jsx22 } from "react/jsx-runtime";
+function ActivationGuard({ children }) {
+  const { status } = useActivation();
+  if (status === "loading") return null;
+  if (status === "suspended") return /* @__PURE__ */ jsx22(Navigate3, { to: "/instancia-suspensa", replace: true });
+  if (status === "revoked") return /* @__PURE__ */ jsx22(Navigate3, { to: "/instancia-revogada", replace: true });
+  if (status !== "active" && window.location.pathname !== "/ativacao") return /* @__PURE__ */ jsx22(Navigate3, { to: "/ativacao", replace: true });
+  return children;
 }
 
 // src/app/createOonRouter.tsx
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 function createOonRouter({ app, menu, routes, security }) {
   const guardEnabled = security?.enableRouteGuard !== false;
-  const publicRoutes = routes.filter((r) => r.public).map((r) => ({ path: r.path, element: r.element }));
-  const privateRoutes = routes.filter((r) => !r.public).map((r) => {
-    const element = guardEnabled ? /* @__PURE__ */ jsx16(RouteGuard, { permission: r.permissions, children: r.element }) : r.element;
-    return r.path === "/" ? { index: true, element } : { path: r.path.replace(/^\//, ""), element };
+  const publicRoutes = routes.filter((route) => route.public).map((route) => ({ path: route.path, element: route.element }));
+  const privateSource = routes.filter((route) => !route.public);
+  const privateRoutes = privateSource.map((route) => {
+    const element = guardEnabled ? /* @__PURE__ */ jsx23(RouteGuard, { permission: route.permissions, children: route.element }) : route.element;
+    return route.path === "/" ? { index: true, element } : { path: route.path.replace(/^\//, ""), element };
   });
+  const hasIndexRoute = privateSource.some((route) => route.path === "/");
+  const firstRoute = privateSource.find((route) => route.path !== "/");
+  if (!hasIndexRoute && firstRoute) {
+    privateRoutes.unshift({
+      index: true,
+      element: /* @__PURE__ */ jsx23(Navigate4, { to: firstRoute.path, replace: true })
+    });
+  }
+  const customPaths = new Set(publicRoutes.map((route) => route.path));
+  const builtInPublicRoutes = [];
+  if (!customPaths.has("/login")) {
+    builtInPublicRoutes.push({
+      path: "/login",
+      element: /* @__PURE__ */ jsx23(ActivationGuard, { children: /* @__PURE__ */ jsx23(LoginPage, { app }) })
+    });
+  }
+  if (!customPaths.has("/ativacao")) {
+    builtInPublicRoutes.push({
+      path: "/ativacao",
+      element: /* @__PURE__ */ jsx23(ActivationPage, {})
+    });
+  }
+  if (!customPaths.has("/instancia-suspensa")) {
+    builtInPublicRoutes.push({
+      path: "/instancia-suspensa",
+      element: /* @__PURE__ */ jsx23(
+        InstanceBlockedPage,
+        {
+          title: "Inst\xE2ncia suspensa",
+          message: "Esta Central est\xE1 suspensa."
+        }
+      )
+    });
+  }
+  if (!customPaths.has("/instancia-revogada")) {
+    builtInPublicRoutes.push({
+      path: "/instancia-revogada",
+      element: /* @__PURE__ */ jsx23(
+        InstanceBlockedPage,
+        {
+          title: "Inst\xE2ncia revogada",
+          message: "Esta Central foi revogada."
+        }
+      )
+    });
+  }
+  if (!customPaths.has("/acesso-negado")) {
+    builtInPublicRoutes.push({
+      path: "/acesso-negado",
+      element: /* @__PURE__ */ jsx23(AccessDeniedPage, { app })
+    });
+  }
   const tree = [
+    ...builtInPublicRoutes,
     ...publicRoutes,
     {
       path: "/",
-      element: /* @__PURE__ */ jsx16(AuthenticatedLayout, { app, menu }),
+      element: /* @__PURE__ */ jsx23(ActivationGuard, { children: /* @__PURE__ */ jsx23(AppAccessGuard, { children: /* @__PURE__ */ jsx23(AuthenticatedLayout, { app, menu }) }) }),
       children: privateRoutes
     }
   ];
@@ -1030,29 +2690,44 @@ function createOonRouter({ app, menu, routes, security }) {
 }
 
 // src/app/OonApp.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
+function localLoginUrl() {
+  const current = `${window.location.pathname}${window.location.search}`;
+  return `/login?redirect=${encodeURIComponent(current)}`;
+}
 function OonApp({ config }) {
-  const { http, storage, router } = useMemo3(() => {
+  const { http, storage, router } = useMemo4(() => {
     const storage2 = createTokenStorage(config.app.id);
-    const loginUrl = config.auth?.loginUrl ?? config.api.meusAppsUrl;
+    const externalLoginUrl = config.auth?.loginUrl ?? config.api.meusAppsUrl;
     const http2 = createRestClient({
       api: config.api,
       appId: config.app.id,
       getToken: () => storage2.get(),
       onUnauthorized: () => {
         storage2.clear();
-        if (loginUrl) window.location.href = loginUrl;
+        if (externalLoginUrl) {
+          window.location.href = externalLoginUrl;
+          return;
+        }
+        if (window.location.pathname !== "/login") {
+          window.location.href = localLoginUrl();
+        }
       }
     });
     const { routes, menu } = resolveRegistry(config);
-    const router2 = createOonRouter({ app: config.app, menu, routes, security: config.security });
+    const router2 = createOonRouter({
+      app: config.app,
+      menu,
+      routes,
+      security: config.security
+    });
     return { http: http2, storage: storage2, router: router2 };
   }, [config]);
-  return /* @__PURE__ */ jsx17(OonProviders, { config, http, storage, children: /* @__PURE__ */ jsx17(RouterProvider, { router }) });
+  return /* @__PURE__ */ jsx24(OonProviders, { config, http, storage, children: /* @__PURE__ */ jsx24(RouterProvider, { router }) });
 }
 
 // src/start.tsx
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx25 } from "react/jsx-runtime";
 function validateConfig(config) {
   if (!config?.app?.id) throw new Error("oonCoreFront.start: config.app.id \xE9 obrigat\xF3rio.");
   if (!config?.api?.baseUrl) throw new Error("oonCoreFront.start: config.api.baseUrl \xE9 obrigat\xF3rio.");
@@ -1086,7 +2761,7 @@ function start(config) {
   const el = document.getElementById(rootId);
   if (!el) throw new Error(`oonCoreFront.start: elemento #${rootId} n\xE3o encontrado no DOM.`);
   createRoot(el).render(
-    /* @__PURE__ */ jsx18(StrictMode, { children: /* @__PURE__ */ jsx18(OonApp, { config }) })
+    /* @__PURE__ */ jsx25(StrictMode, { children: /* @__PURE__ */ jsx25(OonApp, { config }) })
   );
 }
 var oonCoreFront = { start };
@@ -1142,7 +2817,7 @@ function manifestToConfig(manifest, runtime) {
       assistantBaseUrl: runtime.assistantBaseUrl,
       versionPrefix: runtime.versionPrefix ?? ""
     },
-    auth: { mode: "bearer", tokenParam: "code" },
+    auth: { mode: "bearer", tokenParam: "code", devToken: runtime.devToken },
     security: {
       enableRouteGuard: true,
       enablePermissionGate: true,
@@ -1174,34 +2849,34 @@ function defineOonModule(mod) {
 }
 
 // src/components/CoreIntegration.tsx
-import { Badge, Box as Box9, Button as Button4, Flex as Flex7, Heading as Heading6, Stack as Stack6, Text as Text9 } from "@chakra-ui/react";
-import { useMutation as useMutation2 } from "@tanstack/react-query";
-import { jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Badge as Badge3, Box as Box13, Button as Button10, Flex as Flex10, Heading as Heading9, Stack as Stack7, Text as Text14 } from "@chakra-ui/react";
+import { useMutation as useMutation3 } from "@tanstack/react-query";
+import { jsx as jsx26, jsxs as jsxs14 } from "react/jsx-runtime";
 function CoreIntegration({ label = "Integra\xE7\xF5es" }) {
   const { http } = useOonApi();
   const metadata = useCoreMetadata();
-  const reprocess = useMutation2({
+  const reprocess = useMutation3({
     mutationFn: () => http.post("/integrations/actions/process-active", {}, { headers: { "x-oon-origin": "integration" } })
   });
-  if (metadata.isLoading) return /* @__PURE__ */ jsx19(LoadingScreen, {});
-  if (metadata.isError) return /* @__PURE__ */ jsx19(ErrorState, { error: metadata.error });
+  if (metadata.isLoading) return /* @__PURE__ */ jsx26(LoadingScreen, {});
+  if (metadata.isError) return /* @__PURE__ */ jsx26(ErrorState, { error: metadata.error });
   const integrations = metadata.data?.integrations ?? [];
-  return /* @__PURE__ */ jsxs10(Stack6, { gap: 6, children: [
-    /* @__PURE__ */ jsxs10(Flex7, { align: "center", justify: "space-between", children: [
-      /* @__PURE__ */ jsx19(Heading6, { size: "lg", children: label }),
-      /* @__PURE__ */ jsx19(Button4, { size: "sm", variant: "outline", loading: reprocess.isPending, onClick: () => reprocess.mutate(), children: "Reprocessar ativos" })
+  return /* @__PURE__ */ jsxs14(Stack7, { gap: 6, children: [
+    /* @__PURE__ */ jsxs14(Flex10, { align: "center", justify: "space-between", children: [
+      /* @__PURE__ */ jsx26(Heading9, { size: "lg", children: label }),
+      /* @__PURE__ */ jsx26(Button10, { size: "sm", variant: "outline", loading: reprocess.isPending, onClick: () => reprocess.mutate(), children: "Reprocessar ativos" })
     ] }),
-    /* @__PURE__ */ jsx19(Stack6, { gap: 3, children: integrations.length === 0 ? /* @__PURE__ */ jsx19(Text9, { color: "gray.400", children: "Nenhuma integra\xE7\xE3o declarada." }) : integrations.map((it, idx) => /* @__PURE__ */ jsx19(
-      Box9,
+    /* @__PURE__ */ jsx26(Stack7, { gap: 3, children: integrations.length === 0 ? /* @__PURE__ */ jsx26(Text14, { color: "gray.400", children: "Nenhuma integra\xE7\xE3o declarada." }) : integrations.map((it, idx) => /* @__PURE__ */ jsx26(
+      Box13,
       {
         borderWidth: "1px",
         borderColor: "gray.200",
         borderRadius: "md",
         bg: "white",
         p: 4,
-        children: /* @__PURE__ */ jsxs10(Flex7, { align: "center", justify: "space-between", children: [
-          /* @__PURE__ */ jsx19(Text9, { fontWeight: "medium", children: it.label ?? it.name ?? "Integra\xE7\xE3o" }),
-          /* @__PURE__ */ jsx19(Badge, { colorPalette: it.status === "erro" ? "red" : it.status === "ativo" ? "green" : "gray", children: it.status ?? "\u2014" })
+        children: /* @__PURE__ */ jsxs14(Flex10, { align: "center", justify: "space-between", children: [
+          /* @__PURE__ */ jsx26(Text14, { fontWeight: "medium", children: it.label ?? it.name ?? "Integra\xE7\xE3o" }),
+          /* @__PURE__ */ jsx26(Badge3, { colorPalette: it.status === "erro" ? "red" : it.status === "ativo" ? "green" : "gray", children: it.status ?? "\u2014" })
         ] })
       },
       it.id ?? it.name ?? idx
@@ -1210,36 +2885,36 @@ function CoreIntegration({ label = "Integra\xE7\xF5es" }) {
 }
 
 // src/components/CoreCurrency.tsx
-import { Button as Button5, Flex as Flex8, Heading as Heading7, Stack as Stack7, Text as Text10 } from "@chakra-ui/react";
-import { useMutation as useMutation3, useQueryClient as useQueryClient2 } from "@tanstack/react-query";
-import { jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Button as Button11, Flex as Flex11, Heading as Heading10, Stack as Stack8, Text as Text15 } from "@chakra-ui/react";
+import { useMutation as useMutation4, useQueryClient as useQueryClient3 } from "@tanstack/react-query";
+import { jsx as jsx27, jsxs as jsxs15 } from "react/jsx-runtime";
 function CoreCurrency({ model = "Moeda", label = "Multi-moedas", endpoint = "/moedas", columns }) {
   const { http } = useOonApi();
-  const queryClient = useQueryClient2();
-  const updateRates = useMutation3({
+  const queryClient = useQueryClient3();
+  const updateRates = useMutation4({
     mutationFn: () => http.post(`${endpoint}/actions/update-rates`, {}, { headers: { "x-oon-origin": "integration" } }),
     onSuccess: () => queryClient.invalidateQueries({ queryKey: ["oon", "list", endpoint] })
   });
-  return /* @__PURE__ */ jsxs11(Stack7, { gap: 6, children: [
-    /* @__PURE__ */ jsxs11(Flex8, { align: "center", justify: "space-between", children: [
-      /* @__PURE__ */ jsx20(Heading7, { size: "lg", children: label }),
-      /* @__PURE__ */ jsx20(Button5, { size: "sm", colorPalette: "blue", loading: updateRates.isPending, onClick: () => updateRates.mutate(), children: "Atualizar cota\xE7\xF5es" })
+  return /* @__PURE__ */ jsxs15(Stack8, { gap: 6, children: [
+    /* @__PURE__ */ jsxs15(Flex11, { align: "center", justify: "space-between", children: [
+      /* @__PURE__ */ jsx27(Heading10, { size: "lg", children: label }),
+      /* @__PURE__ */ jsx27(Button11, { size: "sm", colorPalette: "blue", loading: updateRates.isPending, onClick: () => updateRates.mutate(), children: "Atualizar cota\xE7\xF5es" })
     ] }),
-    updateRates.isError ? /* @__PURE__ */ jsx20(Text10, { fontSize: "sm", color: "red.600", children: updateRates.error?.message }) : null,
-    /* @__PURE__ */ jsx20(CoreCollection, { model, label: "", mode: columns ? "full" : "dynamic", endpoint, columns })
+    updateRates.isError ? /* @__PURE__ */ jsx27(Text15, { fontSize: "sm", color: "red.600", children: updateRates.error?.message }) : null,
+    /* @__PURE__ */ jsx27(CoreCollection, { model, label: "", mode: columns ? "full" : "dynamic", endpoint, columns })
   ] });
 }
 
 // src/components/CoreAssistant.tsx
-import { useState as useState5 } from "react";
-import { Box as Box10, Button as Button6, Flex as Flex9, Heading as Heading8, Input as Input3, Stack as Stack8, Text as Text11 } from "@chakra-ui/react";
-import { useMutation as useMutation4 } from "@tanstack/react-query";
-import { jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
+import { useState as useState10 } from "react";
+import { Box as Box14, Button as Button12, Flex as Flex12, Heading as Heading11, Input as Input6, Stack as Stack9, Text as Text16 } from "@chakra-ui/react";
+import { useMutation as useMutation5 } from "@tanstack/react-query";
+import { jsx as jsx28, jsxs as jsxs16 } from "react/jsx-runtime";
 function CoreAssistant({ assistantCode, label = "Assistente", entity, endpoint = "/assistant-runs" }) {
   const { http } = useOonApi();
-  const [messages, setMessages] = useState5([]);
-  const [input, setInput] = useState5("");
-  const ask = useMutation4({
+  const [messages, setMessages] = useState10([]);
+  const [input, setInput] = useState10("");
+  const ask = useMutation5({
     mutationFn: async (message) => {
       const { data } = await http.post(
         endpoint,
@@ -1263,13 +2938,13 @@ function CoreAssistant({ assistantCode, label = "Assistente", entity, endpoint =
     setInput("");
     ask.mutate(text);
   };
-  return /* @__PURE__ */ jsxs12(Stack8, { gap: 4, maxW: "560px", children: [
-    /* @__PURE__ */ jsx21(Heading8, { size: "md", children: label }),
-    /* @__PURE__ */ jsx21(Box10, { borderWidth: "1px", borderColor: "gray.200", borderRadius: "md", bg: "white", p: 4, minH: "240px", children: /* @__PURE__ */ jsxs12(Stack8, { gap: 3, children: [
-      messages.length === 0 ? /* @__PURE__ */ jsx21(Text11, { color: "gray.400", fontSize: "sm", children: "Fa\xE7a uma pergunta ao assistente." }) : messages.map((m, idx) => /* @__PURE__ */ jsx21(Flex9, { justify: m.role === "user" ? "flex-end" : "flex-start", children: /* @__PURE__ */ jsx21(
-        Box10,
+  return /* @__PURE__ */ jsxs16(Stack9, { gap: 4, maxW: "560px", children: [
+    /* @__PURE__ */ jsx28(Heading11, { size: "md", children: label }),
+    /* @__PURE__ */ jsx28(Box14, { borderWidth: "1px", borderColor: "gray.200", borderRadius: "md", bg: "white", p: 4, minH: "240px", children: /* @__PURE__ */ jsxs16(Stack9, { gap: 3, children: [
+      messages.length === 0 ? /* @__PURE__ */ jsx28(Text16, { color: "gray.400", fontSize: "sm", children: "Fa\xE7a uma pergunta ao assistente." }) : messages.map((m, idx) => /* @__PURE__ */ jsx28(Flex12, { justify: m.role === "user" ? "flex-end" : "flex-start", children: /* @__PURE__ */ jsx28(
+        Box14,
         {
-          bg: m.role === "user" ? "blue.500" : "gray.100",
+          bg: m.role === "user" ? "brand.500" : "gray.100",
           color: m.role === "user" ? "white" : "gray.800",
           px: 3,
           py: 2,
@@ -1279,12 +2954,12 @@ function CoreAssistant({ assistantCode, label = "Assistente", entity, endpoint =
           children: m.content
         }
       ) }, idx)),
-      ask.isPending ? /* @__PURE__ */ jsx21(Text11, { color: "gray.400", fontSize: "sm", children: "Pensando\u2026" }) : null,
-      ask.isError ? /* @__PURE__ */ jsx21(Text11, { color: "red.600", fontSize: "sm", children: ask.error?.message }) : null
+      ask.isPending ? /* @__PURE__ */ jsx28(Text16, { color: "gray.400", fontSize: "sm", children: "Pensando\u2026" }) : null,
+      ask.isError ? /* @__PURE__ */ jsx28(Text16, { color: "red.600", fontSize: "sm", children: ask.error?.message }) : null
     ] }) }),
-    /* @__PURE__ */ jsxs12(Flex9, { gap: 2, children: [
-      /* @__PURE__ */ jsx21(
-        Input3,
+    /* @__PURE__ */ jsxs16(Flex12, { gap: 2, children: [
+      /* @__PURE__ */ jsx28(
+        Input6,
         {
           size: "sm",
           value: input,
@@ -1295,20 +2970,20 @@ function CoreAssistant({ assistantCode, label = "Assistente", entity, endpoint =
           }
         }
       ),
-      /* @__PURE__ */ jsx21(Button6, { size: "sm", colorPalette: "blue", onClick: send, loading: ask.isPending, children: "Enviar" })
+      /* @__PURE__ */ jsx28(Button12, { size: "sm", colorPalette: "blue", onClick: send, loading: ask.isPending, children: "Enviar" })
     ] })
   ] });
 }
 
 // src/security/PermissionGate.tsx
-import { Fragment as Fragment2, jsx as jsx22 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx29 } from "react/jsx-runtime";
 function PermissionGate({
   permission,
   fallback = null,
   children
 }) {
   const { hasPermission } = useOonAuth();
-  return /* @__PURE__ */ jsx22(Fragment2, { children: hasPermission(permission) ? children : fallback });
+  return /* @__PURE__ */ jsx29(Fragment4, { children: hasPermission(permission) ? children : fallback });
 }
 export {
   CoreAssistant,