@rendra-ui/web 2.2.2 → 2.4.0

package/dist/{rendra-provider-DPulIoQB.js → rendra-provider-7jUgUHzR.js}

@@ -1,4 +1,4 @@
-/*! Rendra Design System v2.2.2 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
+/*! Rendra Design System v2.4.0 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
 import { jsx } from "react/jsx-runtime";
 import { createContext, useContext, useMemo, useSyncExternalStore } from "react";
 //#region src/components/rendra-provider.tsx
@@ -85,4 +85,4 @@ function useRendraBreadcrumbs() {
 //#endregion
 export { useRendraNavigate as a, useRendraLink as i, useCurrentPath as n, useRendraBreadcrumbs as r, RendraProvider as t };
 
-//# sourceMappingURL=rendra-provider-DPulIoQB.js.map
+//# sourceMappingURL=rendra-provider-7jUgUHzR.js.map

package/dist/{rendra-provider-DPulIoQB.js.map → rendra-provider-7jUgUHzR.js.map}

@@ -1 +1 @@
-{"version":3,"file":"rendra-provider-DPulIoQB.js","names":[],"sources":["../src/components/rendra-provider.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useMemo,\n  useSyncExternalStore,\n  type AnchorHTMLAttributes,\n  type ComponentType,\n  type ReactNode,\n} from 'react'\n\n/**\n * Link com a mesma interface do `<a>`/`Link`: recebe `to`, `className`, `children`,\n * `aria-*`, `onClick` e repassa o resto.\n */\nexport interface RendraLinkProps {\n  to: string\n  className?: string\n  children?: ReactNode\n  [key: string]: unknown\n}\n\nexport interface RendraBreadcrumbItem {\n  label: string\n  to?: string\n}\n\nexport interface RendraNavigateOptions {\n  replace?: boolean\n}\n\nexport interface RendraProviderProps {\n  children: ReactNode\n  /** Componente de link do roteador do host (ex.: `Link` do react-router). */\n  linkComponent: ComponentType<RendraLinkProps>\n  /** Devolve o caminho atual (ex.: `useLocation().pathname`). */\n  useCurrentPath: () => string\n  /** Navega para um caminho, com `replace` opcional. */\n  navigate: (to: string, options?: RendraNavigateOptions) => void\n  /** Volta à tela anterior. */\n  goBack: () => void\n  /** Trilha da rota atual (ex.: via `useMatches` e `handle.crumb`). Opcional. */\n  useBreadcrumbs?: () => RendraBreadcrumbItem[]\n}\n\ninterface RendraContextValue {\n  linkComponent: ComponentType<RendraLinkProps>\n  useCurrentPath: () => string\n  navigate: (to: string, options?: RendraNavigateOptions) => void\n  goBack: () => void\n  useBreadcrumbs: () => RendraBreadcrumbItem[]\n}\n\n/** Sem roteador nenhum: o link é só um `<a href>`. */\nfunction DefaultLink({ to, children, ...rest }: RendraLinkProps) {\n  return (\n    <a href={to} {...(rest as AnchorHTMLAttributes<HTMLAnchorElement>)}>\n      {children}\n    </a>\n  )\n}\n\nfunction subscribeToLocation(onChange: () => void) {\n  window.addEventListener('popstate', onChange)\n  return () => window.removeEventListener('popstate', onChange)\n}\n\n/** Sem roteador nenhum: lê `window.location.pathname` direto. */\nfunction useDefaultCurrentPath(): string {\n  return useSyncExternalStore(\n    subscribeToLocation,\n    () => window.location.pathname,\n    () => '/',\n  )\n}\n\n/** Sem roteador nenhum: navega com `window.location`. */\nfunction defaultNavigate(to: string, options?: RendraNavigateOptions) {\n  if (options?.replace) {\n    window.location.replace(to)\n  } else {\n    window.location.assign(to)\n  }\n}\n\n/** Sem roteador nenhum: volta pelo histórico do navegador. */\nfunction defaultGoBack() {\n  window.history.back()\n}\n\n/** Sem roteador nenhum: nenhuma trilha para montar. */\nfunction defaultUseBreadcrumbs(): RendraBreadcrumbItem[] {\n  return []\n}\n\nconst defaultValue: RendraContextValue = {\n  linkComponent: DefaultLink,\n  useCurrentPath: useDefaultCurrentPath,\n  navigate: defaultNavigate,\n  goBack: defaultGoBack,\n  useBreadcrumbs: defaultUseBreadcrumbs,\n}\n\nconst RendraContext = createContext<RendraContextValue>(defaultValue)\n\n/**\n * Única peça que sabe como navegar (`react-router`, outro roteador, ou nenhum).\n * Sem `RendraProvider` na árvore, os hooks abaixo caem para um comportamento simples,\n * baseado só em `window.location`/`history`, e os componentes continuam funcionando.\n */\nexport function RendraProvider({\n  children,\n  linkComponent,\n  useCurrentPath: useCurrentPathProp,\n  navigate,\n  goBack,\n  useBreadcrumbs,\n}: RendraProviderProps) {\n  const value = useMemo<RendraContextValue>(\n    () => ({\n      linkComponent,\n      useCurrentPath: useCurrentPathProp,\n      navigate,\n      goBack,\n      useBreadcrumbs: useBreadcrumbs ?? defaultUseBreadcrumbs,\n    }),\n    [linkComponent, useCurrentPathProp, navigate, goBack, useBreadcrumbs],\n  )\n  return <RendraContext.Provider value={value}>{children}</RendraContext.Provider>\n}\n\n/** Componente de link do provider ativo (ou `<a href>`, sem provider). */\nexport function useRendraLink(): ComponentType<RendraLinkProps> {\n  return useContext(RendraContext).linkComponent\n}\n\n/** Caminho atual (ex.: `/clientes/novo`), do provider ativo ou de `window.location`. */\nexport function useCurrentPath(): string {\n  const ctx = useContext(RendraContext)\n  return ctx.useCurrentPath()\n}\n\n/** Navegar e voltar, do provider ativo ou de `window.location`/`history`. */\nexport function useRendraNavigate(): {\n  navigate: (to: string, options?: RendraNavigateOptions) => void\n  goBack: () => void\n} {\n  const ctx = useContext(RendraContext)\n  return { navigate: ctx.navigate, goBack: ctx.goBack }\n}\n\n/** Trilha da rota atual, do provider ativo ou vazia, sem roteador. */\nexport function useRendraBreadcrumbs(): RendraBreadcrumbItem[] {\n  const ctx = useContext(RendraContext)\n  return ctx.useBreadcrumbs()\n}\n"],"mappings":";;;;;AAqDA,SAAS,YAAY,EAAE,IAAI,UAAU,GAAG,QAAyB;CAC/D,OACE,oBAAC,KAAD;EAAG,MAAM;EAAI,GAAK;EACf;CACA,CAAA;AAEP;AAEA,SAAS,oBAAoB,UAAsB;CACjD,OAAO,iBAAiB,YAAY,QAAQ;CAC5C,aAAa,OAAO,oBAAoB,YAAY,QAAQ;AAC9D;;AAGA,SAAS,wBAAgC;CACvC,OAAO,qBACL,2BACM,OAAO,SAAS,gBAChB,GACR;AACF;;AAGA,SAAS,gBAAgB,IAAY,SAAiC;CACpE,IAAI,SAAS,SACX,OAAO,SAAS,QAAQ,EAAE;MAE1B,OAAO,SAAS,OAAO,EAAE;AAE7B;;AAGA,SAAS,gBAAgB;CACvB,OAAO,QAAQ,KAAK;AACtB;;AAGA,SAAS,wBAAgD;CACvD,OAAO,CAAC;AACV;AAUA,IAAM,gBAAgB,cAAkC;CAPtD,eAAe;CACf,gBAAgB;CAChB,UAAU;CACV,QAAQ;CACR,gBAAgB;AAGsC,CAAY;;;;;;AAOpE,SAAgB,eAAe,EAC7B,UACA,eACA,gBAAgB,oBAChB,UACA,QACA,kBACsB;CACtB,MAAM,QAAQ,eACL;EACL;EACA,gBAAgB;EAChB;EACA;EACA,gBAAgB,kBAAkB;CACpC,IACA;EAAC;EAAe;EAAoB;EAAU;EAAQ;CAAc,CACtE;CACA,OAAO,oBAAC,cAAc,UAAf;EAA+B;EAAQ;CAAiC,CAAA;AACjF;;AAGA,SAAgB,gBAAgD;CAC9D,OAAO,WAAW,aAAa,CAAC,CAAC;AACnC;;AAGA,SAAgB,iBAAyB;CAEvC,OADY,WAAW,aAChB,CAAA,CAAI,eAAe;AAC5B;;AAGA,SAAgB,oBAGd;CACA,MAAM,MAAM,WAAW,aAAa;CACpC,OAAO;EAAE,UAAU,IAAI;EAAU,QAAQ,IAAI;CAAO;AACtD;;AAGA,SAAgB,uBAA+C;CAE7D,OADY,WAAW,aAChB,CAAA,CAAI,eAAe;AAC5B"}
+{"version":3,"file":"rendra-provider-7jUgUHzR.js","names":[],"sources":["../src/components/rendra-provider.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useMemo,\n  useSyncExternalStore,\n  type AnchorHTMLAttributes,\n  type ComponentType,\n  type ReactNode,\n} from 'react'\n\n/**\n * Link com a mesma interface do `<a>`/`Link`: recebe `to`, `className`, `children`,\n * `aria-*`, `onClick` e repassa o resto.\n */\nexport interface RendraLinkProps {\n  to: string\n  className?: string\n  children?: ReactNode\n  [key: string]: unknown\n}\n\nexport interface RendraBreadcrumbItem {\n  label: string\n  to?: string\n}\n\nexport interface RendraNavigateOptions {\n  replace?: boolean\n}\n\nexport interface RendraProviderProps {\n  children: ReactNode\n  /** Componente de link do roteador do host (ex.: `Link` do react-router). */\n  linkComponent: ComponentType<RendraLinkProps>\n  /** Devolve o caminho atual (ex.: `useLocation().pathname`). */\n  useCurrentPath: () => string\n  /** Navega para um caminho, com `replace` opcional. */\n  navigate: (to: string, options?: RendraNavigateOptions) => void\n  /** Volta à tela anterior. */\n  goBack: () => void\n  /** Trilha da rota atual (ex.: via `useMatches` e `handle.crumb`). Opcional. */\n  useBreadcrumbs?: () => RendraBreadcrumbItem[]\n}\n\ninterface RendraContextValue {\n  linkComponent: ComponentType<RendraLinkProps>\n  useCurrentPath: () => string\n  navigate: (to: string, options?: RendraNavigateOptions) => void\n  goBack: () => void\n  useBreadcrumbs: () => RendraBreadcrumbItem[]\n}\n\n/** Sem roteador nenhum: o link é só um `<a href>`. */\nfunction DefaultLink({ to, children, ...rest }: RendraLinkProps) {\n  return (\n    <a href={to} {...(rest as AnchorHTMLAttributes<HTMLAnchorElement>)}>\n      {children}\n    </a>\n  )\n}\n\nfunction subscribeToLocation(onChange: () => void) {\n  window.addEventListener('popstate', onChange)\n  return () => window.removeEventListener('popstate', onChange)\n}\n\n/** Sem roteador nenhum: lê `window.location.pathname` direto. */\nfunction useDefaultCurrentPath(): string {\n  return useSyncExternalStore(\n    subscribeToLocation,\n    () => window.location.pathname,\n    () => '/',\n  )\n}\n\n/** Sem roteador nenhum: navega com `window.location`. */\nfunction defaultNavigate(to: string, options?: RendraNavigateOptions) {\n  if (options?.replace) {\n    window.location.replace(to)\n  } else {\n    window.location.assign(to)\n  }\n}\n\n/** Sem roteador nenhum: volta pelo histórico do navegador. */\nfunction defaultGoBack() {\n  window.history.back()\n}\n\n/** Sem roteador nenhum: nenhuma trilha para montar. */\nfunction defaultUseBreadcrumbs(): RendraBreadcrumbItem[] {\n  return []\n}\n\nconst defaultValue: RendraContextValue = {\n  linkComponent: DefaultLink,\n  useCurrentPath: useDefaultCurrentPath,\n  navigate: defaultNavigate,\n  goBack: defaultGoBack,\n  useBreadcrumbs: defaultUseBreadcrumbs,\n}\n\nconst RendraContext = createContext<RendraContextValue>(defaultValue)\n\n/**\n * Única peça que sabe como navegar (`react-router`, outro roteador, ou nenhum).\n * Sem `RendraProvider` na árvore, os hooks abaixo caem para um comportamento simples,\n * baseado só em `window.location`/`history`, e os componentes continuam funcionando.\n */\nexport function RendraProvider({\n  children,\n  linkComponent,\n  useCurrentPath: useCurrentPathProp,\n  navigate,\n  goBack,\n  useBreadcrumbs,\n}: RendraProviderProps) {\n  const value = useMemo<RendraContextValue>(\n    () => ({\n      linkComponent,\n      useCurrentPath: useCurrentPathProp,\n      navigate,\n      goBack,\n      useBreadcrumbs: useBreadcrumbs ?? defaultUseBreadcrumbs,\n    }),\n    [linkComponent, useCurrentPathProp, navigate, goBack, useBreadcrumbs],\n  )\n  return <RendraContext.Provider value={value}>{children}</RendraContext.Provider>\n}\n\n/** Componente de link do provider ativo (ou `<a href>`, sem provider). */\nexport function useRendraLink(): ComponentType<RendraLinkProps> {\n  return useContext(RendraContext).linkComponent\n}\n\n/** Caminho atual (ex.: `/clientes/novo`), do provider ativo ou de `window.location`. */\nexport function useCurrentPath(): string {\n  const ctx = useContext(RendraContext)\n  return ctx.useCurrentPath()\n}\n\n/** Navegar e voltar, do provider ativo ou de `window.location`/`history`. */\nexport function useRendraNavigate(): {\n  navigate: (to: string, options?: RendraNavigateOptions) => void\n  goBack: () => void\n} {\n  const ctx = useContext(RendraContext)\n  return { navigate: ctx.navigate, goBack: ctx.goBack }\n}\n\n/** Trilha da rota atual, do provider ativo ou vazia, sem roteador. */\nexport function useRendraBreadcrumbs(): RendraBreadcrumbItem[] {\n  const ctx = useContext(RendraContext)\n  return ctx.useBreadcrumbs()\n}\n"],"mappings":";;;;;AAqDA,SAAS,YAAY,EAAE,IAAI,UAAU,GAAG,QAAyB;CAC/D,OACE,oBAAC,KAAD;EAAG,MAAM;EAAI,GAAK;EACf;CACA,CAAA;AAEP;AAEA,SAAS,oBAAoB,UAAsB;CACjD,OAAO,iBAAiB,YAAY,QAAQ;CAC5C,aAAa,OAAO,oBAAoB,YAAY,QAAQ;AAC9D;;AAGA,SAAS,wBAAgC;CACvC,OAAO,qBACL,2BACM,OAAO,SAAS,gBAChB,GACR;AACF;;AAGA,SAAS,gBAAgB,IAAY,SAAiC;CACpE,IAAI,SAAS,SACX,OAAO,SAAS,QAAQ,EAAE;MAE1B,OAAO,SAAS,OAAO,EAAE;AAE7B;;AAGA,SAAS,gBAAgB;CACvB,OAAO,QAAQ,KAAK;AACtB;;AAGA,SAAS,wBAAgD;CACvD,OAAO,CAAC;AACV;AAUA,IAAM,gBAAgB,cAAkC;CAPtD,eAAe;CACf,gBAAgB;CAChB,UAAU;CACV,QAAQ;CACR,gBAAgB;AAGsC,CAAY;;;;;;AAOpE,SAAgB,eAAe,EAC7B,UACA,eACA,gBAAgB,oBAChB,UACA,QACA,kBACsB;CACtB,MAAM,QAAQ,eACL;EACL;EACA,gBAAgB;EAChB;EACA;EACA,gBAAgB,kBAAkB;CACpC,IACA;EAAC;EAAe;EAAoB;EAAU;EAAQ;CAAc,CACtE;CACA,OAAO,oBAAC,cAAc,UAAf;EAA+B;EAAQ;CAAiC,CAAA;AACjF;;AAGA,SAAgB,gBAAgD;CAC9D,OAAO,WAAW,aAAa,CAAC,CAAC;AACnC;;AAGA,SAAgB,iBAAyB;CAEvC,OADY,WAAW,aAChB,CAAA,CAAI,eAAe;AAC5B;;AAGA,SAAgB,oBAGd;CACA,MAAM,MAAM,WAAW,aAAa;CACpC,OAAO;EAAE,UAAU,IAAI;EAAU,QAAQ,IAAI;CAAO;AACtD;;AAGA,SAAgB,uBAA+C;CAE7D,OADY,WAAW,aAChB,CAAA,CAAI,eAAe;AAC5B"}

package/dist/rich-text-editor.js

@@ -1,6 +1,6 @@
-/*! Rendra Design System v2.2.2 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
-import { t as cn } from "./cn-Bo1YMupg.js";
-import { a as DropdownMenuContent, d as DropdownMenuSeparator, h as DropdownMenuTrigger, r as DropdownMenu, s as DropdownMenuItem, t as Tooltip } from "./tooltip-dC9gqkuv.js";
+/*! Rendra Design System v2.4.0 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
+import { t as cn } from "./cn-DXDpTGsu.js";
+import { a as DropdownMenuContent, d as DropdownMenuSeparator, h as DropdownMenuTrigger, r as DropdownMenu, s as DropdownMenuItem, t as Tooltip } from "./tooltip-bdmbX6vC.js";
 import { AlignCenter, AlignJustify, AlignLeft, AlignRight, Bold, Code, Code2, Eraser, ImagePlus, Italic, Link2, List, ListOrdered, Minus, Quote, Redo2, Strikethrough, Table, Underline, Undo2 } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from "react";

package/dist/router-bridge.js

@@ -1,5 +1,5 @@
-/*! Rendra Design System v2.2.2 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
-import { t as RendraProvider } from "./rendra-provider-DPulIoQB.js";
+/*! Rendra Design System v2.4.0 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
+import { t as RendraProvider } from "./rendra-provider-7jUgUHzR.js";
 import { jsx } from "react/jsx-runtime";
 import { useCallback } from "react";
 import { Link, Outlet, useLocation, useMatches, useNavigate } from "react-router";

package/dist/tokens.css

@@ -1,4 +1,4 @@
-/*! Rendra Design System v2.2.2 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
+/*! Rendra Design System v2.4.0 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
 
 @layer theme, base, rendra.base, components, rendra.components, utilities;
 @layer theme, base, components, utilities;
@@ -700,6 +700,16 @@
     transform: scale(1);
   }
 }
+@keyframes rd-encaixe {
+  from {
+    opacity: 0;
+    transform: scale(0.85);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
 @keyframes rd-shake {
   0%,
   100% {

package/dist/{tooltip-dC9gqkuv.js → tooltip-bdmbX6vC.js}

@@ -1,5 +1,5 @@
-/*! Rendra Design System v2.2.2 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
-import { t as cn } from "./cn-Bo1YMupg.js";
+/*! Rendra Design System v2.4.0 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
+import { t as cn } from "./cn-DXDpTGsu.js";
 import { Check, ChevronRight } from "lucide-react";
 import { DropdownMenu, Tooltip } from "radix-ui";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -102,4 +102,4 @@ function Tooltip$1({ content, children, side = "top", disabled }) {
 //#endregion
 export { DropdownMenuContent as a, DropdownMenuLabel as c, DropdownMenuSeparator as d, DropdownMenuSub as f, DropdownMenuTrigger as h, DropdownMenuCheckboxItem as i, DropdownMenuRadioGroup as l, DropdownMenuSubTrigger as m, TooltipProvider as n, DropdownMenuGroup as o, DropdownMenuSubContent as p, DropdownMenu$1 as r, DropdownMenuItem as s, Tooltip$1 as t, DropdownMenuRadioItem as u };
 
-//# sourceMappingURL=tooltip-dC9gqkuv.js.map
+//# sourceMappingURL=tooltip-bdmbX6vC.js.map

package/dist/{tooltip-dC9gqkuv.js.map → tooltip-bdmbX6vC.js.map}

@@ -1 +1 @@
-{"version":3,"file":"tooltip-dC9gqkuv.js","names":[],"sources":["../src/components/ui/dropdown-menu.tsx","../src/components/ui/tooltip.tsx"],"sourcesContent":["import { Check, ChevronRight } from 'lucide-react'\nimport { DropdownMenu as D } from 'radix-ui'\nimport type { ComponentProps } from 'react'\nimport { cn } from '@/lib/cn'\n\nexport const DropdownMenu = D.Root\nexport const DropdownMenuTrigger = D.Trigger\nexport const DropdownMenuGroup = D.Group\nexport const DropdownMenuSub = D.Sub\nexport const DropdownMenuRadioGroup = D.RadioGroup\n\nconst panel =\n  'z-50 w-max min-w-3xs max-w-popover overflow-hidden rounded-surface border bg-popover p-1 text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95'\n\n// Itens com 44px no mobile (toque) e compactos a partir de md.\nconst item =\n  'relative flex min-h-touch cursor-pointer items-center gap-2 rounded-item px-3 text-sm outline-none select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-accent data-highlighted:text-accent-foreground md:min-h-0 md:py-2 [&_svg]:size-icon-sm [&_svg]:shrink-0 [&_svg]:text-muted-foreground'\n\nexport function DropdownMenuContent({\n  className,\n  sideOffset = 8,\n  ...props\n}: ComponentProps<typeof D.Content>) {\n  return (\n    <D.Portal>\n      <D.Content\n        sideOffset={sideOffset}\n        collisionPadding={16}\n        data-rendra=\"DDM-001\"\n        className={cn(panel, className)}\n        {...props}\n      />\n    </D.Portal>\n  )\n}\n\ninterface ItemProps extends ComponentProps<typeof D.Item> {\n  /** Item destrutivo (excluir, sair): texto na cor destrutiva. */\n  destructive?: boolean\n}\n\nexport function DropdownMenuItem({ className, destructive, ...props }: ItemProps) {\n  return (\n    <D.Item\n      className={cn(\n        item,\n        destructive &&\n          'text-destructive data-highlighted:bg-destructive-soft data-highlighted:text-destructive-soft-foreground [&_svg]:text-current',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function DropdownMenuCheckboxItem({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof D.CheckboxItem>) {\n  return (\n    <D.CheckboxItem className={cn(item, 'pl-8', className)} {...props}>\n      <span className=\"absolute left-2 flex size-icon-sm items-center justify-center\">\n        <D.ItemIndicator>\n          <Check className=\"text-primary-text\" />\n        </D.ItemIndicator>\n      </span>\n      {children}\n    </D.CheckboxItem>\n  )\n}\n\nexport function DropdownMenuRadioItem({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof D.RadioItem>) {\n  return (\n    <D.RadioItem className={cn(item, 'pl-8', className)} {...props}>\n      <span className=\"absolute left-2 flex size-icon-sm items-center justify-center\">\n        <D.ItemIndicator>\n          <Check className=\"text-primary-text\" />\n        </D.ItemIndicator>\n      </span>\n      {children}\n    </D.RadioItem>\n  )\n}\n\nexport function DropdownMenuLabel({ className, ...props }: ComponentProps<typeof D.Label>) {\n  return (\n    <D.Label\n      className={cn('px-2 py-2 text-xs font-medium text-muted-foreground', className)}\n      {...props}\n    />\n  )\n}\n\nexport function DropdownMenuSeparator({ className, ...props }: ComponentProps<typeof D.Separator>) {\n  return <D.Separator className={cn('-mx-1 my-1 h-px bg-border', className)} {...props} />\n}\n\nexport function DropdownMenuSubTrigger({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof D.SubTrigger>) {\n  return (\n    <D.SubTrigger className={cn(item, 'data-[state=open]:bg-accent', className)} {...props}>\n      {children}\n      <ChevronRight className=\"ml-auto\" />\n    </D.SubTrigger>\n  )\n}\n\nexport function DropdownMenuSubContent({\n  className,\n  ...props\n}: ComponentProps<typeof D.SubContent>) {\n  return (\n    <D.Portal>\n      <D.SubContent collisionPadding={16} className={cn(panel, className)} {...props} />\n    </D.Portal>\n  )\n}\n","import { Tooltip as T } from 'radix-ui'\nimport type { ReactNode } from 'react'\nimport { cn } from '@/lib/cn'\n\n/**\n * Tooltip: só para informação complementar, nunca essencial (não existe hover no toque).\n * Informação essencial vai em texto de ajuda visível ou em Popover acionado por toque.\n */\nexport function TooltipProvider({ children }: { children: ReactNode }) {\n  return (\n    <T.Provider delayDuration={300} skipDelayDuration={150}>\n      {children}\n    </T.Provider>\n  )\n}\n\ninterface TooltipProps {\n  content: ReactNode\n  children: ReactNode\n  side?: 'top' | 'right' | 'bottom' | 'left'\n  /** Desliga o tooltip sem mudar a árvore (ex.: sidebar expandida já mostra o rótulo). */\n  disabled?: boolean\n}\n\nexport function Tooltip({ content, children, side = 'top', disabled }: TooltipProps) {\n  if (disabled) return <>{children}</>\n  return (\n    <T.Root>\n      <T.Trigger asChild>{children}</T.Trigger>\n      <T.Portal>\n        <T.Content\n          side={side}\n          sideOffset={8}\n          collisionPadding={16}\n          data-rendra=\"TIP-001\"\n          className={cn(\n            'z-50 max-w-xs rounded-control bg-foreground px-3 py-2 text-xs font-medium text-background',\n            'animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0',\n          )}\n        >\n          {content}\n        </T.Content>\n      </T.Portal>\n    </T.Root>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"tooltip-bdmbX6vC.js","names":[],"sources":["../src/components/ui/dropdown-menu.tsx","../src/components/ui/tooltip.tsx"],"sourcesContent":["import { Check, ChevronRight } from 'lucide-react'\nimport { DropdownMenu as D } from 'radix-ui'\nimport type { ComponentProps } from 'react'\nimport { cn } from '@/lib/cn'\n\nexport const DropdownMenu = D.Root\nexport const DropdownMenuTrigger = D.Trigger\nexport const DropdownMenuGroup = D.Group\nexport const DropdownMenuSub = D.Sub\nexport const DropdownMenuRadioGroup = D.RadioGroup\n\nconst panel =\n  'z-50 w-max min-w-3xs max-w-popover overflow-hidden rounded-surface border bg-popover p-1 text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95'\n\n// Itens com 44px no mobile (toque) e compactos a partir de md.\nconst item =\n  'relative flex min-h-touch cursor-pointer items-center gap-2 rounded-item px-3 text-sm outline-none select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-accent data-highlighted:text-accent-foreground md:min-h-0 md:py-2 [&_svg]:size-icon-sm [&_svg]:shrink-0 [&_svg]:text-muted-foreground'\n\nexport function DropdownMenuContent({\n  className,\n  sideOffset = 8,\n  ...props\n}: ComponentProps<typeof D.Content>) {\n  return (\n    <D.Portal>\n      <D.Content\n        sideOffset={sideOffset}\n        collisionPadding={16}\n        data-rendra=\"DDM-001\"\n        className={cn(panel, className)}\n        {...props}\n      />\n    </D.Portal>\n  )\n}\n\ninterface ItemProps extends ComponentProps<typeof D.Item> {\n  /** Item destrutivo (excluir, sair): texto na cor destrutiva. */\n  destructive?: boolean\n}\n\nexport function DropdownMenuItem({ className, destructive, ...props }: ItemProps) {\n  return (\n    <D.Item\n      className={cn(\n        item,\n        destructive &&\n          'text-destructive data-highlighted:bg-destructive-soft data-highlighted:text-destructive-soft-foreground [&_svg]:text-current',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function DropdownMenuCheckboxItem({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof D.CheckboxItem>) {\n  return (\n    <D.CheckboxItem className={cn(item, 'pl-8', className)} {...props}>\n      <span className=\"absolute left-2 flex size-icon-sm items-center justify-center\">\n        <D.ItemIndicator>\n          <Check className=\"text-primary-text\" />\n        </D.ItemIndicator>\n      </span>\n      {children}\n    </D.CheckboxItem>\n  )\n}\n\nexport function DropdownMenuRadioItem({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof D.RadioItem>) {\n  return (\n    <D.RadioItem className={cn(item, 'pl-8', className)} {...props}>\n      <span className=\"absolute left-2 flex size-icon-sm items-center justify-center\">\n        <D.ItemIndicator>\n          <Check className=\"text-primary-text\" />\n        </D.ItemIndicator>\n      </span>\n      {children}\n    </D.RadioItem>\n  )\n}\n\nexport function DropdownMenuLabel({ className, ...props }: ComponentProps<typeof D.Label>) {\n  return (\n    <D.Label\n      className={cn('px-2 py-2 text-xs font-medium text-muted-foreground', className)}\n      {...props}\n    />\n  )\n}\n\nexport function DropdownMenuSeparator({ className, ...props }: ComponentProps<typeof D.Separator>) {\n  return <D.Separator className={cn('-mx-1 my-1 h-px bg-border', className)} {...props} />\n}\n\nexport function DropdownMenuSubTrigger({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof D.SubTrigger>) {\n  return (\n    <D.SubTrigger className={cn(item, 'data-[state=open]:bg-accent', className)} {...props}>\n      {children}\n      <ChevronRight className=\"ml-auto\" />\n    </D.SubTrigger>\n  )\n}\n\nexport function DropdownMenuSubContent({\n  className,\n  ...props\n}: ComponentProps<typeof D.SubContent>) {\n  return (\n    <D.Portal>\n      <D.SubContent collisionPadding={16} className={cn(panel, className)} {...props} />\n    </D.Portal>\n  )\n}\n","import { Tooltip as T } from 'radix-ui'\nimport type { ReactNode } from 'react'\nimport { cn } from '@/lib/cn'\n\n/**\n * Tooltip: só para informação complementar, nunca essencial (não existe hover no toque).\n * Informação essencial vai em texto de ajuda visível ou em Popover acionado por toque.\n */\nexport function TooltipProvider({ children }: { children: ReactNode }) {\n  return (\n    <T.Provider delayDuration={300} skipDelayDuration={150}>\n      {children}\n    </T.Provider>\n  )\n}\n\ninterface TooltipProps {\n  content: ReactNode\n  children: ReactNode\n  side?: 'top' | 'right' | 'bottom' | 'left'\n  /** Desliga o tooltip sem mudar a árvore (ex.: sidebar expandida já mostra o rótulo). */\n  disabled?: boolean\n}\n\nexport function Tooltip({ content, children, side = 'top', disabled }: TooltipProps) {\n  if (disabled) return <>{children}</>\n  return (\n    <T.Root>\n      <T.Trigger asChild>{children}</T.Trigger>\n      <T.Portal>\n        <T.Content\n          side={side}\n          sideOffset={8}\n          collisionPadding={16}\n          data-rendra=\"TIP-001\"\n          className={cn(\n            'z-50 max-w-xs rounded-control bg-foreground px-3 py-2 text-xs font-medium text-background',\n            'animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0',\n          )}\n        >\n          {content}\n        </T.Content>\n      </T.Portal>\n    </T.Root>\n  )\n}\n"],"mappings":"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"}

package/dist/types/components/app-shell/app-shell.d.ts

@@ -1,6 +1,6 @@
 import { type ReactNode } from 'react';
 import { type ShellLayout } from './layout';
-import type { NavGroup, ShellMenuItem, ShellNotificationsConfig, ShellUser } from './types';
+import type { NavGroup, ShellMenuItem, ShellNotificationsConfig, ShellUser, ShellUserMenuConfig, ShellWorkspacesConfig } from './types';
 export interface AppShellProps {
     /** Menu do sistema: sidebar, barra inferior e busca global. Único obrigatório. */
     navigation: NavGroup[];
@@ -18,6 +18,26 @@ export interface AppShellProps {
     quickActions?: ShellMenuItem[];
     /** Notificações do sino do header. Sem esta prop, o sino não aparece. */
     notifications?: ShellNotificationsConfig;
+    /**
+     * Quais submenus o menu do avatar mostra: `theme` (Tema), `template` (Template) e
+     * `layout` (Layout). Todos `true` por padrão; `{ theme: false }` esconde só o Tema.
+     * É o caminho para tirar essas escolhas do usuário (`userConfigurable` não faz isso).
+     */
+    userMenu?: ShellUserMenuConfig;
+    /**
+     * Seletor de espaço (empresa, unidade, workspace) no topo do menu do avatar, logo depois
+     * do usuário: um item de rádio por espaço, o de `activeId` marcado. `onSelect` recebe o
+     * `id` escolhido. Sem esta prop, o menu é o de sempre.
+     */
+    workspaces?: ShellWorkspacesConfig;
+    /**
+     * Logo do header no celular (abaixo de `md`): ocupa o lugar do título e da trilha. O título
+     * continua anunciado ao leitor de tela (só some do visual), o botão de voltar e o ícone de
+     * ajuda da tela ficam, e a trilha sai do header. A partir de `md` nada muda. O contêiner é
+     * `aria-hidden`: o logo é decorativo para o leitor, então o nó **não pode ser interativo**
+     * (um link ali dentro reprova `aria-hidden-focus` no axe).
+     */
+    headerLogo?: ReactNode;
     /**
      * Permite que o usuário troque o layout pelo menu do avatar (guardado no navegador).
      * Desligue em produção se o layout do projeto for fixo.
@@ -33,4 +53,4 @@ export interface AppShellProps {
  * Título da aba e meta description (SEO) não são responsabilidade do AppShell: o
  * boilerplate (src/app/app-layout.tsx) aplica isso com useRouteMeta, que lê @/config/seo.
  */
-export declare function AppShell({ navigation, layout: layoutProp, user, userMenuItems, onLogout, homeLabel, quickActions, notifications, userConfigurable, children, }: AppShellProps): import("react").JSX.Element;
+export declare function AppShell({ navigation, layout: layoutProp, user, userMenuItems, onLogout, homeLabel, quickActions, notifications, userMenu, workspaces, headerLogo, userConfigurable, children, }: AppShellProps): import("react").JSX.Element;

package/dist/types/components/app-shell/shell-context.d.ts

@@ -1,7 +1,7 @@
 import { type ReactNode } from 'react';
 import type { ShellLayout } from './layout';
 import type { NavigationTarget } from './navigation-utils';
-import type { NavGroup, NavItem, ShellMenuItem, ShellNotificationsConfig, ShellUser } from './types';
+import type { NavGroup, NavItem, ShellMenuItem, ShellNotificationsConfig, ShellUser, ShellUserMenuConfig, ShellWorkspacesConfig } from './types';
 export interface ShellContextValue {
     /** Layout efetivo: padrão interno + prop `layout` do AppShell + escolha do usuário. */
     layout: ShellLayout;
@@ -43,6 +43,12 @@ export interface ShellContextValue {
     quickActions: ShellMenuItem[];
     /** Notificações do sino do header. Sem esta prop, o sino não aparece. */
     notifications?: ShellNotificationsConfig;
+    /** Submenus Tema, Template e Layout do menu do avatar. Sem esta prop, os três aparecem. */
+    userMenu?: ShellUserMenuConfig;
+    /** Seletor de espaço no topo do menu do avatar. Sem esta prop, não aparece. */
+    workspaces?: ShellWorkspacesConfig;
+    /** Logo que ocupa o lugar do título e da trilha no header, abaixo de `md`. */
+    headerLogo?: ReactNode;
 }
 export declare const ShellContext: import("react").Context<ShellContextValue | null>;
 export declare function useShell(): ShellContextValue;

package/dist/types/components/app-shell/types.d.ts

@@ -51,3 +51,26 @@ export interface ShellNotificationsConfig {
     onMarkAllRead?: () => void;
     onItemClick?: (id: string) => void;
 }
+/** Quais submenus o menu do avatar mostra. Cada um é `true` por padrão. */
+export interface ShellUserMenuConfig {
+    /** Submenu "Tema" (claro, escuro, automático). */
+    theme?: boolean;
+    /** Submenu "Template" (modelo e paleta de cores). */
+    template?: boolean;
+    /** Submenu "Layout" (posição e comportamento do menu). */
+    layout?: boolean;
+}
+/** Seletor de espaço (empresa, unidade, workspace) no topo do menu do avatar. */
+export interface ShellWorkspacesConfig {
+    /** Espaços disponíveis. Lista vazia não desenha o bloco. */
+    items: {
+        id: string;
+        label: string;
+    }[];
+    /** `id` do espaço atual (o item marcado). */
+    activeId: string;
+    /** Chamado com o `id` do espaço escolhido. A troca em si é de quem monta a aplicação. */
+    onSelect: (id: string) => void;
+    /** Título do bloco no menu. Padrão: "Espaço". */
+    label?: string;
+}

package/dist/types/components/layout/page-header.d.ts

@@ -26,8 +26,24 @@ export interface PageHeaderProps {
      * dividindo a largura; no desktop ficam à direita, com largura automática.
      */
     actions?: ReactNode;
+    /**
+     * Título discreto no topo do corpo quando o cabeçalho do shell esconde o título (no celular,
+     * com `headerLogo`): `text-base` abaixo de `md` e só de leitor de tela a partir dele.
+     * `showTitle` vence. Padrão: `false`.
+     */
+    bodyTitle?: boolean;
+    /**
+     * `reserve` (padrão): o bloco do título ocupa lugar mesmo quando o título é só de leitor de
+     * tela (o vão de 16 px acima das ações no celular). `none`: sem título visível e sem
+     * `description`, o bloco não é desenhado e o vão some; o `h1` segue no DOM para o leitor.
+     */
+    titleSpace?: 'reserve' | 'none';
     /** Conteúdo abaixo, como abas ou metadados. */
     children?: ReactNode;
+    /**
+     * Classes extras, que vencem as do componente. Para zerar a margem negativa de baixo (que
+     * aproxima o cabeçalho do conteúdo) use `className="mb-0 md:mb-0"`.
+     */
     className?: string;
 }
 /**
@@ -35,4 +51,4 @@ export interface PageHeaderProps {
  * O título fica no header (com a trilha); aqui ele só é lido por leitores de tela,
  * para que cada página tenha um único título principal (h1).
  */
-export declare function PageHeader({ title, showTitle, description, help, breadcrumb, actions, children, className, }: PageHeaderProps): import("react").JSX.Element;
+export declare function PageHeader({ title, showTitle, description, help, breadcrumb, actions, bodyTitle, titleSpace, children, className, }: PageHeaderProps): import("react").JSX.Element;

package/dist/types/components/ui/brand-feedback-icon.d.ts

@@ -1,11 +1,10 @@
 import { type VariantProps } from 'class-variance-authority';
 import type { FeedbackType } from '../../brand/types';
 declare const iconVariants: (props?: ({
-    type?: "success" | "error" | "warning" | "info" | null | undefined;
     size?: "sm" | "lg" | "xl" | "2xl" | "md" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export declare const feedbackLabels: Record<FeedbackType, string>;
-export interface BrandFeedbackIconProps extends Omit<VariantProps<typeof iconVariants>, 'type'> {
+export interface BrandFeedbackIconProps extends VariantProps<typeof iconVariants> {
     type: FeedbackType;
     /** Texto para leitores de tela. Sem ele o ícone é decorativo (o texto ao lado informa). */
     label?: string;
@@ -15,6 +14,24 @@ export interface BrandFeedbackIconProps extends Omit<VariantProps<typeof iconVar
      * Troque a key do componente para repetir a animação.
      */
     animated?: boolean;
+    /**
+     * Cor do símbolo. `state` (padrão): a cor do estado (verde, vermelho, amarelo, azul).
+     * `brand`: a cor primária da marca (`text-primary-text`); o selo de estado mantém a cor do
+     * estado, para o significado não depender só da cor.
+     */
+    symbolTone?: 'state' | 'brand';
+    /**
+     * `false` (padrão): selo de estado sobreposto ao símbolo. `true`: o ícone do estado
+     * (Lucide, na cor do estado) fica ao lado do símbolo, no lugar do selo sobreposto. Com um
+     * SVG próprio em `brand.feedbackIcons[type]`, o SVG vence e nenhum selo é desenhado.
+     */
+    statusBadge?: boolean;
+    /**
+     * Só vale com `animated`. `pop` (padrão): entra com mola, o glifo se desenha e o erro
+     * treme. `encaixe`: entra em 240 ms, curva de saída suave, sem quique, sem desenho e sem
+     * tremor. Com "reduzir movimento" do sistema, nenhuma animação roda.
+     */
+    animation?: 'pop' | 'encaixe';
     className?: string;
 }
 /**
@@ -22,5 +39,5 @@ export interface BrandFeedbackIconProps extends Omit<VariantProps<typeof iconVar
  * semântica, com um selo de status para que o significado não dependa só da cor.
  * Cada tipo pode ser substituído por um SVG próprio em brand.config.ts (feedbackIcons).
  */
-export declare function BrandFeedbackIcon({ type, size, label, animated, className, }: BrandFeedbackIconProps): import("react").JSX.Element;
+export declare function BrandFeedbackIcon({ type, size, label, animated, symbolTone, statusBadge, animation, className, }: BrandFeedbackIconProps): import("react").JSX.Element;
 export {};

package/dist/types/components/ui/button-group.d.ts

@@ -16,6 +16,13 @@ interface ButtonGroupProps {
     onChange?: (value: string) => void;
     size?: 'sm' | 'md';
     fullWidth?: boolean;
+    /**
+     * Só no modo agrupado (`children`); o segmentado (`options`) ignora. `horizontal` (padrão):
+     * botões lado a lado. `vertical`: empilhados, na largura do grupo, com as bordas unidas.
+     * `responsive`: vertical abaixo de `md` e horizontal a partir dele (para três botões largos
+     * que não cabem em 360 px).
+     */
+    orientation?: 'horizontal' | 'vertical' | 'responsive';
     'aria-label'?: string;
     className?: string;
 }
@@ -23,5 +30,5 @@ interface ButtonGroupProps {
  * ButtonGroup único: agrupa botões de ação (children) ou funciona como controle
  * segmentado de escolha única (options + value).
  */
-export declare function ButtonGroup({ children, options, value, onChange, size, fullWidth, className, ...aria }: ButtonGroupProps): import("react").JSX.Element;
+export declare function ButtonGroup({ children, options, value, onChange, size, fullWidth, orientation, className, ...aria }: ButtonGroupProps): import("react").JSX.Element;
 export {};

package/dist/types/components/ui/empty-state.d.ts

@@ -9,6 +9,10 @@ export interface EmptyStateProps {
     actions?: ReactNode;
     /** compact: dentro de tabela ou card pequeno. */
     size?: 'default' | 'compact';
+    /**
+     * Classes extras, que vencem as do componente. Para zerar o respiro vertical (por exemplo,
+     * dentro de um card que já tem o seu) use `className="py-0 md:py-0"`.
+     */
     className?: string;
 }
 /** Estado vazio (e de erro) com o ícone de feedback da marca. */

package/dist/types/components/ui/error-page.d.ts

@@ -5,9 +5,14 @@ export interface ErrorPageProps {
     description?: string;
     /** Ocupa a tela inteira (fora do AppShell). */
     fullScreen?: boolean;
+    /**
+     * Mostra o botão Voltar (padrão). Com `false` só a ação principal é desenhada, na largura
+     * toda (regra "um botão = 100%").
+     */
+    back?: boolean;
 }
 /**
  * Tela de erro única (404 e 500), com o ícone de feedback da marca animado.
  * Ações seguem a regra 30/70: secundária à esquerda, principal à direita.
  */
-export declare function ErrorPage({ code, title, description, fullScreen }: ErrorPageProps): import("react").JSX.Element;
+export declare function ErrorPage({ code, title, description, fullScreen, back, }: ErrorPageProps): import("react").JSX.Element;

package/dist/types/components/ui/modal.d.ts

@@ -15,6 +15,10 @@ export interface ModalProps {
     /** Conteúdo do body (em form, os campos). */
     children?: ReactNode;
     confirmLabel?: string;
+    /**
+     * Rótulo do botão de cancelar. Em `confirm` e `destructive` o padrão é "Cancelar". Em `info`
+     * não há botão de cancelar: o segundo botão só aparece quando `cancelLabel` é passado.
+     */
     cancelLabel?: string;
     /** Pode ser assíncrono: o botão mostra carregamento até terminar. */
     onConfirm?: () => void | Promise<void>;

package/dist/types/components/ui/select.d.ts

@@ -49,7 +49,10 @@ interface MultipleProps extends BaseProps {
     multiple: true;
     value?: string[];
     onChange?: (value: string[]) => void;
-    /** Opção "Selecionar todos" no topo da lista. */
+    /**
+     * Linha "Selecionar todos" no topo da lista (vira "Desmarcar todos" com tudo marcado).
+     * Padrão: aparece sozinha com mais de 5 opções; `false` desliga, `true` força com 5 ou menos.
+     */
     selectAll?: boolean;
     /** Mostra "3 selecionados" no lugar dos chips. */
     showCount?: boolean;

package/dist/types/components/ui/wizard.d.ts

@@ -29,10 +29,23 @@ export interface WizardProps {
     onValidateStep?: (index: number) => boolean | Promise<boolean>;
     onFinish?: () => void | Promise<void>;
     onCancel?: () => void;
+    /** Rótulo do cancelar da primeira etapa (só aparece com `onCancel`). Padrão: "Cancelar". */
+    cancelLabel?: string;
+    /** Rótulo do voltar das etapas seguintes. Padrão: "Voltar". */
+    backLabel?: string;
+    /** Rótulo do avançar (todas as etapas menos a última). Padrão: "Avançar". */
+    nextLabel?: string;
     finishLabel?: string;
+    /**
+     * Torna a etapa opcional: "Pular" aparece no menu "Mais ações" da barra de ações (nunca na
+     * última etapa), avança **sem validar** e limpa o erro da etapa. Sem esta prop não há menu.
+     */
+    onSkip?: () => void;
+    /** Rótulo do item de pular. Padrão: "Pular". */
+    skipLabel?: string;
     orientation?: 'horizontal' | 'vertical';
     /** Botões no rodapé fixo da tela. Padrão: não, seguem junto do card do wizard. */
     stickyFooter?: boolean;
 }
 /** Cadastro em etapas, com validação por etapa e rodapé Voltar / Avançar. */
-export declare function Wizard({ steps, children, onValidateStep, onFinish, onCancel, finishLabel, orientation, stickyFooter, }: WizardProps): import("react").JSX.Element;
+export declare function Wizard({ steps, children, onValidateStep, onFinish, onCancel, cancelLabel, backLabel, nextLabel, finishLabel, onSkip, skipLabel, orientation, stickyFooter, }: WizardProps): import("react").JSX.Element;

package/dist/types/lib/initials.d.ts

@@ -0,0 +1,2 @@
+/** Iniciais de um nome: primeira letra do primeiro e do último nome, em maiúsculas. */
+export declare function initials(name: string): string;

package/dist/{use-breakpoint-BUHd0Cbz.js → use-breakpoint-Dyp-0E_c.js}

@@ -1,4 +1,4 @@
-/*! Rendra Design System v2.2.2 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
+/*! Rendra Design System v2.4.0 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
 import { useSyncExternalStore } from "react";
 //#region src/hooks/use-breakpoint.ts
 /**
@@ -46,4 +46,4 @@ function useBreakpoint() {
 //#endregion
 export { useBreakpoint as n, breakpoints as t };
 
-//# sourceMappingURL=use-breakpoint-BUHd0Cbz.js.map
+//# sourceMappingURL=use-breakpoint-Dyp-0E_c.js.map

package/dist/{use-breakpoint-BUHd0Cbz.js.map → use-breakpoint-Dyp-0E_c.js.map}

@@ -1 +1 @@
-{"version":3,"file":"use-breakpoint-BUHd0Cbz.js","names":[],"sources":["../src/hooks/use-breakpoint.ts"],"sourcesContent":["import { useSyncExternalStore } from 'react'\n\n/**\n * Pontos de quebra, espelhando os padrões do Tailwind (sm 40rem, md 48rem, lg 64rem...).\n * Único hook de detecção de tela do sistema. Para adaptação ao espaço disponível\n * dentro de um bloco (e não à tela), use container queries (@container) no CSS.\n */\nexport const breakpoints = { sm: 640, md: 768, lg: 1024, xl: 1280, '2xl': 1536 } as const\nexport type Breakpoint = keyof typeof breakpoints\n\nconst order: Breakpoint[] = ['sm', 'md', 'lg', 'xl', '2xl']\n\nfunction subscribe(cb: () => void) {\n  const lists = order.map((bp) => matchMedia(`(min-width: ${breakpoints[bp]}px)`))\n  lists.forEach((mq) => mq.addEventListener('change', cb))\n  return () => lists.forEach((mq) => mq.removeEventListener('change', cb))\n}\n\nfunction getCurrent(): Breakpoint | 'base' {\n  let current: Breakpoint | 'base' = 'base'\n  for (const bp of order) if (matchMedia(`(min-width: ${breakpoints[bp]}px)`).matches) current = bp\n  return current\n}\n\nexport function useBreakpoint() {\n  const current = useSyncExternalStore(subscribe, getCurrent, () => 'lg' as const)\n  const rank = current === 'base' ? -1 : order.indexOf(current)\n  const up = (bp: Breakpoint) => rank >= order.indexOf(bp)\n  return {\n    current,\n    up,\n    /** Abaixo de 768px: componentes se reconstroem no formato mobile. */\n    isMobile: !up('md'),\n    isTablet: up('md') && !up('lg'),\n    isDesktop: up('lg'),\n  }\n}\n"],"mappings":";;;;;;;;AAOA,IAAa,cAAc;CAAE,IAAI;CAAK,IAAI;CAAK,IAAI;CAAM,IAAI;CAAM,OAAO;AAAK;AAG/E,IAAM,QAAsB;CAAC;CAAM;CAAM;CAAM;CAAM;AAAK;AAE1D,SAAS,UAAU,IAAgB;CACjC,MAAM,QAAQ,MAAM,KAAK,OAAO,WAAW,eAAe,YAAY,IAAI,IAAI,CAAC;CAC/E,MAAM,SAAS,OAAO,GAAG,iBAAiB,UAAU,EAAE,CAAC;CACvD,aAAa,MAAM,SAAS,OAAO,GAAG,oBAAoB,UAAU,EAAE,CAAC;AACzE;AAEA,SAAS,aAAkC;CACzC,IAAI,UAA+B;CACnC,KAAK,MAAM,MAAM,OAAO,IAAI,WAAW,eAAe,YAAY,IAAI,IAAI,CAAC,CAAC,SAAS,UAAU;CAC/F,OAAO;AACT;AAEA,SAAgB,gBAAgB;CAC9B,MAAM,UAAU,qBAAqB,WAAW,kBAAkB,IAAa;CAC/E,MAAM,OAAO,YAAY,SAAS,KAAK,MAAM,QAAQ,OAAO;CAC5D,MAAM,MAAM,OAAmB,QAAQ,MAAM,QAAQ,EAAE;CACvD,OAAO;EACL;EACA;;EAEA,UAAU,CAAC,GAAG,IAAI;EAClB,UAAU,GAAG,IAAI,KAAK,CAAC,GAAG,IAAI;EAC9B,WAAW,GAAG,IAAI;CACpB;AACF"}
+{"version":3,"file":"use-breakpoint-Dyp-0E_c.js","names":[],"sources":["../src/hooks/use-breakpoint.ts"],"sourcesContent":["import { useSyncExternalStore } from 'react'\n\n/**\n * Pontos de quebra, espelhando os padrões do Tailwind (sm 40rem, md 48rem, lg 64rem...).\n * Único hook de detecção de tela do sistema. Para adaptação ao espaço disponível\n * dentro de um bloco (e não à tela), use container queries (@container) no CSS.\n */\nexport const breakpoints = { sm: 640, md: 768, lg: 1024, xl: 1280, '2xl': 1536 } as const\nexport type Breakpoint = keyof typeof breakpoints\n\nconst order: Breakpoint[] = ['sm', 'md', 'lg', 'xl', '2xl']\n\nfunction subscribe(cb: () => void) {\n  const lists = order.map((bp) => matchMedia(`(min-width: ${breakpoints[bp]}px)`))\n  lists.forEach((mq) => mq.addEventListener('change', cb))\n  return () => lists.forEach((mq) => mq.removeEventListener('change', cb))\n}\n\nfunction getCurrent(): Breakpoint | 'base' {\n  let current: Breakpoint | 'base' = 'base'\n  for (const bp of order) if (matchMedia(`(min-width: ${breakpoints[bp]}px)`).matches) current = bp\n  return current\n}\n\nexport function useBreakpoint() {\n  const current = useSyncExternalStore(subscribe, getCurrent, () => 'lg' as const)\n  const rank = current === 'base' ? -1 : order.indexOf(current)\n  const up = (bp: Breakpoint) => rank >= order.indexOf(bp)\n  return {\n    current,\n    up,\n    /** Abaixo de 768px: componentes se reconstroem no formato mobile. */\n    isMobile: !up('md'),\n    isTablet: up('md') && !up('lg'),\n    isDesktop: up('lg'),\n  }\n}\n"],"mappings":";;;;;;;;AAOA,IAAa,cAAc;CAAE,IAAI;CAAK,IAAI;CAAK,IAAI;CAAM,IAAI;CAAM,OAAO;AAAK;AAG/E,IAAM,QAAsB;CAAC;CAAM;CAAM;CAAM;CAAM;AAAK;AAE1D,SAAS,UAAU,IAAgB;CACjC,MAAM,QAAQ,MAAM,KAAK,OAAO,WAAW,eAAe,YAAY,IAAI,IAAI,CAAC;CAC/E,MAAM,SAAS,OAAO,GAAG,iBAAiB,UAAU,EAAE,CAAC;CACvD,aAAa,MAAM,SAAS,OAAO,GAAG,oBAAoB,UAAU,EAAE,CAAC;AACzE;AAEA,SAAS,aAAkC;CACzC,IAAI,UAA+B;CACnC,KAAK,MAAM,MAAM,OAAO,IAAI,WAAW,eAAe,YAAY,IAAI,IAAI,CAAC,CAAC,SAAS,UAAU;CAC/F,OAAO;AACT;AAEA,SAAgB,gBAAgB;CAC9B,MAAM,UAAU,qBAAqB,WAAW,kBAAkB,IAAa;CAC/E,MAAM,OAAO,YAAY,SAAS,KAAK,MAAM,QAAQ,OAAO;CAC5D,MAAM,MAAM,OAAmB,QAAQ,MAAM,QAAQ,EAAE;CACvD,OAAO;EACL;EACA;;EAEA,UAAU,CAAC,GAAG,IAAI;EAClB,UAAU,GAAG,IAAI,KAAK,CAAC,GAAG,IAAI;EAC9B,WAAW,GAAG,IAAI;CACpB;AACF"}

package/dist/widget-grid.js

@@ -1,5 +1,5 @@
-/*! Rendra Design System v2.2.2 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
-import { t as cn } from "./cn-Bo1YMupg.js";
+/*! Rendra Design System v2.4.0 | MIT | © 2026 Bruno Magalhaes | brunomagalhaes.me */
+import { t as cn } from "./cn-DXDpTGsu.js";
 import { GripVertical } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from "react";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rendra-ui/web",
-  "version": "2.2.2",
+  "version": "2.4.0",
   "type": "module",
   "description": "Rendra, design system e boilerplate React (Vite, TypeScript, Tailwind v4, Radix), com CLI de catálogo, auditoria e troca de variante.",
   "author": {
@@ -107,6 +107,7 @@
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
     "docs:images": "node scripts/readme-images.mjs",
+    "docs:og-image": "node scripts/og-image.mjs",
     "test": "vitest run",
     "test:watch": "vitest",
     "test:coverage": "vitest run --coverage",
@@ -114,7 +115,10 @@
     "test:visual": "playwright test --project=visual",
     "test:visual:update": "playwright test --project=visual --update-snapshots",
     "test:css-layers": "playwright test --project=css-layers",
+    "test:site": "playwright test -c playwright.site.config.ts",
     "registry:build": "node scripts/build-registry.mjs",
+    "pages:build": "node scripts/pages-build.mjs",
+    "pages:stage": "node scripts/pages-stage.mjs",
     "palettes:build": "node scripts/build-palettes.mjs"
   },
   "dependencies": {
@@ -173,6 +177,8 @@
     "prettier": "^3.9.9",
     "prettier-plugin-tailwindcss": "^0.8.1",
     "react-router": "^8.4.0",
+    "serve": "14.2.6",
+    "sharp": "^0.35.5",
     "storybook": "^10.6.0",
     "tailwindcss": "^4.3.3",
     "tw-animate-css": "^1.4.0",

package/dist/components-Dl15AjD-.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"components-Dl15AjD-.js","names":[],"sources":["../src/catalog/components.ts"],"sourcesContent":["/**\n * Catálogo de códigos de componente (etapa 1.2.0-alpha.1 do plano da v2).\n *\n * Cada componente de `src/components/ui` (menos os internos `overlay-shell` e\n * `picker-panel`, e menos os arquivos de teste) tem ao menos um código aqui. Uma variante\n * visual relevante (a prop que muda o formato do componente, não tom nem tamanho) ganha o\n * seu próprio código, numerado 001, 002... na ordem em que aparece neste arquivo.\n *\n * O código é o que o cliente escolhe no `docs/BRIEFING_MODELO.md` (\"Componentes e\n * variantes\") e o que aparece na vitrine (`/componentes`), no `data-rendra` do elemento\n * raiz de cada componente e no `registry.json` (`meta.codes`).\n *\n * Formato: `^[A-Z]{3,4}-\\d{3}$` (ex.: \"ABA-001\", \"BTN-006\"). Nunca editar um código depois\n * de publicado: ele é o identificador estável de uma variante.\n */\n\nexport interface ComponentCatalogEntry {\n  /** Formato ^[A-Z]{3,4}-\\d{3}$, ex.: \"ABA-001\". Único no catálogo inteiro. */\n  code: string\n  /** Nome em português do Brasil, ex.: \"Abas em linha\". */\n  name: string\n  /** Nome do componente React, ex.: \"Tabs\". */\n  component: string\n  /** Caminho relativo a partir de src/, ex.: \"components/ui/tabs.tsx\". */\n  file: string\n  /** Props (nome: valor) que definem esta variante especificamente. */\n  variantProps: Record<string, string | number | boolean>\n  /** Frase curta de quando usar esta variante, para o BRIEFING_MODELO. */\n  whenToUse: string\n  /**\n   * Esta é a variante que o componente usa quando a prop não é passada (o valor padrão de\n   * `variantProps` no próprio componente React, ex.: `variant = 'line'` em `tabs.tsx`)? No\n   * máximo uma por componente (nenhuma, para o componente sem variante ou sem um padrão real,\n   * como `Chart`, cuja prop `type` é obrigatória); um componente com mais de uma variante tem\n   * exatamente uma marcada `true` (teste de integridade, `assertCatalogIntegrity`). Usada por\n   * `rendra trocar`: um elemento sem a prop conta como esta variante, e trocar para uma\n   * variante `isDefault` remove a prop em vez de escrever o valor por extenso.\n   */\n  isDefault?: true\n}\n\n/** Formato do código: de 3 a 4 letras maiúsculas, hífen, três dígitos. */\nexport const COMPONENT_CODE_PATTERN = /^[A-Z]{3,4}-\\d{3}$/\n\n/**\n * Arquivos de `src/components/ui` que não entram no catálogo: são peças internas, sem uso\n * direto em tela (nunca aparecem sozinhos numa tela, só dentro de outro componente).\n */\nexport const CATALOG_EXCLUDED_FILES = [\n  'components/ui/overlay-shell.tsx',\n  'components/ui/picker-panel.tsx',\n  'components/ui/sortable-handle.tsx',\n]\n\nexport const CATALOG: ComponentCatalogEntry[] = [\n  // ---------------------------------------------------------------- accordion\n  {\n    code: 'ACRN-001',\n    name: 'Acordeão',\n    component: 'Accordion',\n    file: 'components/ui/accordion.tsx',\n    variantProps: {},\n    whenToUse: 'Para agrupar conteúdo que a pessoa abre um de cada vez, como perguntas frequentes.',\n  },\n  // ---------------------------------------------------------------- action-bar\n  {\n    code: 'ACB-001',\n    name: 'Barra de ação',\n    component: 'ActionBar',\n    file: 'components/ui/action-bar.tsx',\n    variantProps: {},\n    whenToUse:\n      'Para os botões de salvar, cancelar e ações extras de um formulário, drawer ou modal.',\n  },\n  // ---------------------------------------------------------------- alert\n  {\n    code: 'ALRT-001',\n    name: 'Alerta',\n    component: 'Alert',\n    file: 'components/ui/alert.tsx',\n    variantProps: {},\n    whenToUse: 'Para um aviso de sucesso, erro, atenção ou informação dentro do corpo da tela.',\n  },\n  // ---------------------------------------------------------------- avatar\n  {\n    code: 'AVT-001',\n    name: 'Avatar',\n    component: 'Avatar',\n    file: 'components/ui/avatar.tsx',\n    variantProps: {},\n    whenToUse: 'Para a foto ou as iniciais de uma pessoa.',\n  },\n  {\n    code: 'AVT-002',\n    name: 'Avatar em grupo',\n    component: 'AvatarGroup',\n    file: 'components/ui/avatar.tsx',\n    variantProps: {},\n    whenToUse: 'Para mostrar várias pessoas sobrepostas, com contador do excedente.',\n  },\n  // ---------------------------------------------------------------- badge\n  {\n    code: 'BDG-001',\n    name: 'Selo',\n    component: 'Badge',\n    file: 'components/ui/badge.tsx',\n    variantProps: {},\n    whenToUse: 'Para marcar situação, categoria ou contagem curta ao lado de um texto.',\n  },\n  // ---------------------------------------------------------------- brand-feedback-icon\n  {\n    code: 'BFI-001',\n    name: 'Ícone de feedback da marca',\n    component: 'BrandFeedbackIcon',\n    file: 'components/ui/brand-feedback-icon.tsx',\n    variantProps: {},\n    whenToUse:\n      'Para o símbolo da marca tingido pela cor semântica em toast, alerta e telas de status.',\n  },\n  // ---------------------------------------------------------------- brand-logo\n  {\n    code: 'LOGO-001',\n    name: 'Logotipo',\n    component: 'BrandLogo',\n    file: 'components/ui/brand-logo.tsx',\n    variantProps: {},\n    whenToUse: 'Para o logotipo da marca na sidebar, no header ou no painel do login.',\n  },\n  // ---------------------------------------------------------------- breadcrumb\n  {\n    code: 'BRD-001',\n    name: 'Trilha responsiva',\n    component: 'Breadcrumb',\n    file: 'components/ui/breadcrumb.tsx',\n    variantProps: { variant: 'responsive' },\n    whenToUse: 'Dentro do corpo da página: trilha no desktop e botão voltar no celular.',\n    isDefault: true,\n  },\n  {\n    code: 'BRD-002',\n    name: 'Trilha em texto',\n    component: 'Breadcrumb',\n    file: 'components/ui/breadcrumb.tsx',\n    variantProps: { variant: 'trail' },\n    whenToUse: 'No header do AppShell, abaixo do título, sempre em texto pequeno.',\n  },\n  // ---------------------------------------------------------------- button\n  {\n    code: 'BTN-001',\n    name: 'Botão primário',\n    component: 'Button',\n    file: 'components/ui/button.tsx',\n    variantProps: { variant: 'primary' },\n    whenToUse: 'Para a ação principal da tela, do formulário ou da barra de ações.',\n    isDefault: true,\n  },\n  {\n    code: 'BTN-002',\n    name: 'Botão secundário',\n    component: 'Button',\n    file: 'components/ui/button.tsx',\n    variantProps: { variant: 'secondary' },\n    whenToUse:\n      'Para uma segunda cor de destaque da marca, quando a primária já está em uso na tela.',\n  },\n  {\n    code: 'BTN-003',\n    name: 'Botão contornado',\n    component: 'Button',\n    file: 'components/ui/button.tsx',\n    variantProps: { variant: 'outline' },\n    whenToUse: 'Para a ação de cancelar ou para ações secundárias ao lado de um botão primário.',\n  },\n  {\n    code: 'BTN-004',\n    name: 'Botão fantasma',\n    component: 'Button',\n    file: 'components/ui/button.tsx',\n    variantProps: { variant: 'ghost' },\n    whenToUse: 'Para ações discretas dentro de cards, linhas de tabela e barras de ferramenta.',\n  },\n  {\n    code: 'BTN-005',\n    name: 'Botão destrutivo',\n    component: 'Button',\n    file: 'components/ui/button.tsx',\n    variantProps: { variant: 'destructive' },\n    whenToUse: 'Para uma ação irreversível, como excluir ou encerrar.',\n  },\n  {\n    code: 'BTN-006',\n    name: 'Botão link',\n    component: 'Button',\n    file: 'components/ui/button.tsx',\n    variantProps: { variant: 'link' },\n    whenToUse: 'Para uma ação com aparência de link de texto, dentro de uma frase ou de um rodapé.',\n  },\n  // ---------------------------------------------------------------- button-group\n  {\n    code: 'BTNG-001',\n    name: 'Grupo de botões',\n    component: 'ButtonGroup',\n    file: 'components/ui/button-group.tsx',\n    variantProps: {},\n    whenToUse: 'Para botões encostados ou um controle segmentado de escolha única.',\n  },\n  // ---------------------------------------------------------------- calendar\n  {\n    code: 'CAL-001',\n    name: 'Calendário',\n    component: 'Calendar',\n    file: 'components/ui/calendar.tsx',\n    variantProps: {},\n    whenToUse: 'Para agenda com visão de mês, semana, dia ou lista de eventos.',\n  },\n  // ---------------------------------------------------------------- card\n  {\n    code: 'CARD-001',\n    name: 'Card',\n    component: 'Card',\n    file: 'components/ui/card.tsx',\n    variantProps: {},\n    whenToUse: 'Para agrupar conteúdo de página com borda e sem sombra pesada.',\n  },\n  // ---------------------------------------------------------------- chart\n  {\n    code: 'CHT-001',\n    name: 'Gráfico de linha',\n    component: 'Chart',\n    file: 'components/ui/chart.tsx',\n    variantProps: { type: 'line' },\n    whenToUse: 'Para mostrar a evolução de um valor ao longo do tempo.',\n    // A prop `type` do Chart é obrigatória (sem valor padrão no componente): marcado aqui só\n    // para satisfazer o teste de integridade (um padrão por componente com mais de uma\n    // variante); \"rendra trocar\" nunca encontra um <Chart> sem `type`, porque não compila.\n    isDefault: true,\n  },\n  {\n    code: 'CHT-002',\n    name: 'Gráfico de barras',\n    component: 'Chart',\n    file: 'components/ui/chart.tsx',\n    variantProps: { type: 'bar' },\n    whenToUse: 'Para comparar valores entre categorias.',\n  },\n  {\n    code: 'CHT-003',\n    name: 'Gráfico de área',\n    component: 'Chart',\n    file: 'components/ui/chart.tsx',\n    variantProps: { type: 'area' },\n    whenToUse: 'Para mostrar volume acumulado ao longo do tempo.',\n  },\n  {\n    code: 'CHT-004',\n    name: 'Gráfico de pizza',\n    component: 'Chart',\n    file: 'components/ui/chart.tsx',\n    variantProps: { type: 'pie' },\n    whenToUse: 'Para mostrar a proporção de poucas categorias dentro de um total.',\n  },\n  {\n    code: 'CHT-005',\n    name: 'Gráfico combinado',\n    component: 'Chart',\n    file: 'components/ui/chart.tsx',\n    variantProps: { type: 'combo' },\n    whenToUse: 'Para juntar barras e linha no mesmo gráfico, como receita e meta.',\n  },\n  {\n    code: 'CHT-006',\n    name: 'Velocímetro de meta',\n    component: 'Chart',\n    file: 'components/ui/chart.tsx',\n    variantProps: { type: 'gauge' },\n    whenToUse: 'Para o percentual de uma meta batida, com faixas de cor.',\n  },\n  {\n    code: 'CHT-007',\n    name: 'Funil',\n    component: 'Chart',\n    file: 'components/ui/chart.tsx',\n    variantProps: { type: 'funnel' },\n    whenToUse: 'Para etapas que afunilam, com a conversão entre elas.',\n  },\n  // ---------------------------------------------------------------- chat\n  {\n    code: 'CHAT-001',\n    name: 'Lista de conversas',\n    component: 'ConversationList',\n    file: 'components/ui/chat.tsx',\n    variantProps: {},\n    whenToUse: 'Para a coluna de conversas do atendimento.',\n  },\n  {\n    code: 'CHAT-002',\n    name: 'Linha do tempo da conversa',\n    component: 'ChatThread',\n    file: 'components/ui/chat.tsx',\n    variantProps: {},\n    whenToUse: 'Para o histórico de mensagens de uma conversa aberta.',\n  },\n  {\n    code: 'CHAT-003',\n    name: 'Campo de mensagem',\n    component: 'ChatComposer',\n    file: 'components/ui/chat.tsx',\n    variantProps: {},\n    whenToUse: 'Para escrever, anexar e enviar uma mensagem no atendimento.',\n  },\n  // ---------------------------------------------------------------- checkbox\n  {\n    code: 'CHK-001',\n    name: 'Caixa de seleção',\n    component: 'Checkbox',\n    file: 'components/ui/checkbox.tsx',\n    variantProps: {},\n    whenToUse: 'Para uma escolha independente, ligada ou desligada (inclusive indeterminada).',\n  },\n  {\n    code: 'CHK-002',\n    name: 'Grupo de caixas de seleção',\n    component: 'CheckboxGroup',\n    file: 'components/ui/checkbox.tsx',\n    variantProps: {},\n    whenToUse: 'Para uma lista de opções fixas com \"selecionar todos\".',\n  },\n  // ---------------------------------------------------------------- checklist\n  {\n    code: 'CKLT-001',\n    name: 'Lista de verificação',\n    component: 'Checklist',\n    file: 'components/ui/checklist.tsx',\n    variantProps: {},\n    whenToUse:\n      'Para uma lista de itens que a pessoa cria, renomeia, marca e remove, tudo por teclado.',\n  },\n  // ---------------------------------------------------------------- color-picker\n  {\n    code: 'COR-001',\n    name: 'Seletor de cor',\n    component: 'ColorPicker',\n    file: 'components/ui/color-picker.tsx',\n    variantProps: {},\n    whenToUse: 'Para escolher uma cor entre amostras da marca ou uma cor livre por hexadecimal.',\n  },\n  // ---------------------------------------------------------------- data-toolbar\n  {\n    code: 'DTB-001',\n    name: 'Barra de ferramentas da listagem',\n    component: 'DataToolbar',\n    file: 'components/ui/data-toolbar.tsx',\n    variantProps: {},\n    whenToUse: 'Para busca, filtros, colunas e a ação Novo, sempre dentro do card da tabela.',\n  },\n  // ---------------------------------------------------------------- date-picker\n  {\n    code: 'DTP-001',\n    name: 'Seletor de data',\n    component: 'DatePicker',\n    file: 'components/ui/date-picker.tsx',\n    variantProps: {},\n    whenToUse: 'Para escolher uma data, um período ou um horário.',\n  },\n  // ---------------------------------------------------------------- document-viewer\n  {\n    code: 'DOC-001',\n    name: 'Visualizador de documentos',\n    component: 'DocumentViewer',\n    file: 'components/ui/document-viewer.tsx',\n    variantProps: {},\n    whenToUse: 'Para abrir um PDF (contrato, nota fiscal, comprovante) sem sair da tela.',\n  },\n  // ---------------------------------------------------------------- drawer\n  {\n    code: 'GAV-001',\n    name: 'Gaveta',\n    component: 'Drawer',\n    file: 'components/ui/drawer.tsx',\n    variantProps: {},\n    whenToUse: 'Para formulário ou detalhe de volume médio, até cerca de 12 campos.',\n  },\n  // ---------------------------------------------------------------- dropdown-menu\n  {\n    code: 'DDM-001',\n    name: 'Menu suspenso',\n    component: 'DropdownMenuContent',\n    file: 'components/ui/dropdown-menu.tsx',\n    variantProps: {},\n    whenToUse: 'Para uma lista de ações ou opções que abre a partir de um botão ou de um item.',\n  },\n  // ---------------------------------------------------------------- empty-state\n  {\n    code: 'VAZ-001',\n    name: 'Estado vazio',\n    component: 'EmptyState',\n    file: 'components/ui/empty-state.tsx',\n    variantProps: {},\n    whenToUse: 'Para quando uma lista, busca ou seção não tem nenhum dado ainda.',\n  },\n  // ---------------------------------------------------------------- error-page\n  {\n    code: 'ERRO-001',\n    name: 'Tela de erro',\n    component: 'ErrorPage',\n    file: 'components/ui/error-page.tsx',\n    variantProps: {},\n    whenToUse: 'Para página não encontrada (404) ou falha do lado do servidor (500).',\n  },\n  // ---------------------------------------------------------------- field\n  {\n    code: 'FLD-001',\n    name: 'Campo com rótulo e ajuda',\n    component: 'Field',\n    file: 'components/ui/field.tsx',\n    variantProps: {},\n    whenToUse: 'Para envolver qualquer controle de formulário com rótulo, ajuda e erro.',\n  },\n  {\n    code: 'FLD-002',\n    name: 'Rótulo',\n    component: 'Label',\n    file: 'components/ui/field.tsx',\n    variantProps: {},\n    whenToUse: 'Para um rótulo avulso, quando o Field completo não se aplica.',\n  },\n  // ---------------------------------------------------------------- form\n  {\n    code: 'FORM-001',\n    name: 'Formulário',\n    component: 'Form',\n    file: 'components/ui/form.tsx',\n    variantProps: {},\n    whenToUse: 'Para envolver um formulário inteiro, ligado ao React Hook Form.',\n  },\n  {\n    code: 'FORM-002',\n    name: 'Seção de formulário',\n    component: 'FormSection',\n    file: 'components/ui/form.tsx',\n    variantProps: {},\n    whenToUse: 'Para agrupar campos relacionados dentro de um card com título.',\n  },\n  // ---------------------------------------------------------------- image-cropper\n  {\n    code: 'CROP-001',\n    name: 'Recorte de imagem',\n    component: 'ImageCropper',\n    file: 'components/ui/image-cropper.tsx',\n    variantProps: {},\n    whenToUse:\n      'Para recortar uma imagem numa proporção fixa antes de enviar (foto de perfil, capa).',\n  },\n  // ---------------------------------------------------------------- image-viewer\n  {\n    code: 'IMG-001',\n    name: 'Visualizador de imagens',\n    component: 'ImageViewer',\n    file: 'components/ui/image-viewer.tsx',\n    variantProps: {},\n    whenToUse: 'Para abrir uma ou mais imagens em tela cheia, com legenda e navegação.',\n  },\n  // ---------------------------------------------------------------- info-hint\n  {\n    code: 'INFO-001',\n    name: 'Dica de informação',\n    component: 'InfoHint',\n    file: 'components/ui/info-hint.tsx',\n    variantProps: {},\n    whenToUse: 'Para texto orientativo que não tem um título de tela, card ou seção ao lado.',\n  },\n  // ---------------------------------------------------------------- input\n  {\n    code: 'CAMP-001',\n    name: 'Campo de texto',\n    component: 'Input',\n    file: 'components/ui/input.tsx',\n    variantProps: {},\n    whenToUse: 'Para texto, número, senha, telefone, moeda ou qualquer valor de uma linha.',\n  },\n  // ---------------------------------------------------------------- kanban\n  {\n    code: 'KANB-001',\n    name: 'Quadro kanban',\n    component: 'Kanban',\n    file: 'components/ui/kanban.tsx',\n    // variantProps fica vazio de propósito: a diferença para KANB-002 é a prop `dropTargets`\n    // (um array de destinos de arraste), não um literal de string/número/booleano, e o\n    // `rendra trocar` não tem como inventar um array, então ele recusa a troca com uma\n    // mensagem clara (\"sem prop que os distinga\"), e a variante certa fica documentada aqui.\n    variantProps: {},\n    whenToUse: 'Para um funil de etapas com cartões que se movem entre colunas.',\n    isDefault: true,\n  },\n  {\n    code: 'KANB-002',\n    name: 'Quadro kanban com destinos de arraste',\n    component: 'Kanban',\n    file: 'components/ui/kanban.tsx',\n    variantProps: { hasDropTargets: true },\n    whenToUse:\n      'Quando o card pode ir para uma ação além de outra coluna (ex.: \"Marcar como ganho\"), ' +\n      'mostrada numa barra durante o arraste e no menu \"Mover para\".',\n  },\n  // ---------------------------------------------------------------- list\n  {\n    code: 'LIST-001',\n    name: 'Lista',\n    component: 'List',\n    file: 'components/ui/list.tsx',\n    // variantProps fica vazio de propósito: a diferença para LIST-002 é a prop `onReorder`\n    // (uma função de callback), não um literal de string/número/booleano, e o `rendra trocar`\n    // não tem como inventar uma função, então ele recusa a troca com uma mensagem clara (\"sem\n    // prop que os distinga\"), e a variante certa fica documentada aqui.\n    variantProps: {},\n    whenToUse: 'Para linhas simples com início, título, descrição e fim, navegáveis ou não.',\n    isDefault: true,\n  },\n  {\n    code: 'LIST-002',\n    name: 'Lista reordenável',\n    component: 'List',\n    file: 'components/ui/list.tsx',\n    variantProps: { sortable: true },\n    whenToUse: 'Quando a pessoa pode mudar a ordem das linhas, por arraste ou pelas setas da alça.',\n  },\n  // ---------------------------------------------------------------- modal\n  {\n    code: 'MOD-001',\n    name: 'Modal de confirmação',\n    component: 'Modal',\n    file: 'components/ui/modal.tsx',\n    variantProps: { type: 'confirm' },\n    whenToUse:\n      'Para confirmar uma ação com uma principal e uma de cancelar; type=\"destructive\" usa o ' +\n      'mesmo código, porque só muda a cor.',\n    isDefault: true,\n  },\n  {\n    code: 'MOD-002',\n    name: 'Modal de formulário',\n    component: 'Modal',\n    file: 'components/ui/modal.tsx',\n    variantProps: { type: 'form' },\n    whenToUse: 'Para um formulário de até 3 campos simples, sem sair da tela atual.',\n  },\n  {\n    code: 'MOD-003',\n    name: 'Modal informativo',\n    component: 'Modal',\n    file: 'components/ui/modal.tsx',\n    variantProps: { type: 'info' },\n    whenToUse:\n      'Para só informar algo, sem decisão a tomar: um botão só, de largura total, que fecha o modal.',\n  },\n  // ---------------------------------------------------------------- otp-input\n  {\n    code: 'OTP-001',\n    name: 'Código de verificação',\n    component: 'OtpInput',\n    file: 'components/ui/otp-input.tsx',\n    variantProps: {},\n    whenToUse: 'Para confirmar um código enviado por SMS ou e-mail (2FA).',\n  },\n  // ---------------------------------------------------------------- pagination\n  {\n    code: 'PAG-001',\n    name: 'Paginação',\n    component: 'Pagination',\n    file: 'components/ui/pagination.tsx',\n    variantProps: {},\n    whenToUse: 'Para navegar entre páginas de uma listagem.',\n  },\n  // ---------------------------------------------------------------- popover\n  {\n    code: 'POP-001',\n    name: 'Popover',\n    component: 'PopoverContent',\n    file: 'components/ui/popover.tsx',\n    variantProps: {},\n    whenToUse: 'Para um painel curto que abre perto de um botão, como um filtro.',\n  },\n  // ---------------------------------------------------------------- progress\n  {\n    code: 'PROG-001',\n    name: 'Barra de progresso',\n    component: 'Progress',\n    file: 'components/ui/progress.tsx',\n    variantProps: {},\n    whenToUse: 'Para o andamento de uma tarefa ou de um envio.',\n  },\n  // ---------------------------------------------------------------- qr-code\n  {\n    code: 'QRC-001',\n    name: 'Código QR',\n    component: 'QrCode',\n    file: 'components/ui/qr-code.tsx',\n    variantProps: {},\n    whenToUse: 'Para gerar um código QR (link, código de acesso) sem depender de serviço externo.',\n  },\n  // ---------------------------------------------------------------- radio-group\n  {\n    code: 'RDO-001',\n    name: 'Opções em lista',\n    component: 'RadioGroup',\n    file: 'components/ui/radio-group.tsx',\n    variantProps: { variant: 'list' },\n    whenToUse: 'Para poucas opções simples, uma escolha só, em lista com bolinha e texto.',\n    isDefault: true,\n  },\n  {\n    code: 'RDO-002',\n    name: 'Opções em cartões',\n    component: 'RadioGroup',\n    file: 'components/ui/radio-group.tsx',\n    variantProps: { variant: 'cards' },\n    whenToUse: 'Para opções com ícone e descrição, quando cada uma merece mais destaque.',\n  },\n  // ---------------------------------------------------------------- rating\n  {\n    code: 'RTG-001',\n    name: 'Avaliação em estrelas',\n    component: 'Rating',\n    file: 'components/ui/rating.tsx',\n    variantProps: { variant: 'stars' },\n    whenToUse: 'Para uma nota rápida de satisfação, em estrelas.',\n    isDefault: true,\n  },\n  {\n    code: 'RTG-002',\n    name: 'Avaliação em escala',\n    component: 'Rating',\n    file: 'components/ui/rating.tsx',\n    variantProps: { variant: 'scale' },\n    whenToUse: 'Para uma nota de 0 a 10 (NPS e pesquisas parecidas), com rótulo nas pontas.',\n  },\n  // ---------------------------------------------------------------- rendra-credit\n  {\n    code: 'CRED-001',\n    name: 'Crédito Feito com Rendra',\n    component: 'RendraCredit',\n    file: 'components/ui/rendra-credit.tsx',\n    variantProps: {},\n    whenToUse:\n      'No rodapé da tela de login, discreto; pode ser removido (credit={false}) ou levado para ' +\n      'outro lugar visível, como uma tela Sobre.',\n  },\n  // ---------------------------------------------------------------- repeatable-field\n  {\n    code: 'REP-001',\n    name: 'Campo repetível',\n    component: 'RepeatableField',\n    file: 'components/ui/repeatable-field.tsx',\n    variantProps: {},\n    whenToUse:\n      'Para uma lista de campos do mesmo tipo (telefones, e-mails, endereços), com um principal.',\n  },\n  // ---------------------------------------------------------------- rich-text-editor\n  {\n    code: 'RTE-001',\n    name: 'Editor de texto rico',\n    component: 'RichTextEditor',\n    file: 'components/ui/rich-text-editor.tsx',\n    variantProps: {},\n    whenToUse: 'Para conteúdo com formatação, listas e imagens, como a descrição de um artigo.',\n  },\n  // ---------------------------------------------------------------- select\n  {\n    code: 'SEL-001',\n    name: 'Select',\n    component: 'Select',\n    file: 'components/ui/select.tsx',\n    variantProps: {},\n    whenToUse: 'Para escolher uma ou mais opções de uma lista, com ou sem busca.',\n  },\n  // ---------------------------------------------------------------- separator\n  {\n    code: 'SEP-001',\n    name: 'Separador',\n    component: 'Separator',\n    file: 'components/ui/separator.tsx',\n    variantProps: {},\n    whenToUse: 'Para dividir conteúdo dentro de um card, no lugar de um card dentro de card.',\n  },\n  // ---------------------------------------------------------------- skeleton\n  {\n    code: 'SKEL-001',\n    name: 'Esqueleto de carregamento',\n    component: 'Skeleton',\n    file: 'components/ui/skeleton.tsx',\n    variantProps: {},\n    whenToUse: 'Para o estado de carregamento, com a mesma estrutura do conteúdo final.',\n  },\n  // ---------------------------------------------------------------- slider\n  {\n    code: 'SLD-001',\n    name: 'Slider',\n    component: 'Slider',\n    file: 'components/ui/slider.tsx',\n    variantProps: {},\n    whenToUse: 'Para escolher um número ou uma faixa dentro de um intervalo, arrastando.',\n  },\n  // ---------------------------------------------------------------- spinner\n  {\n    code: 'SPIN-001',\n    name: 'Indicador de carregamento',\n    component: 'Spinner',\n    file: 'components/ui/spinner.tsx',\n    variantProps: {},\n    whenToUse:\n      'Para um carregamento breve dentro de um botão, campo ou lista, sem barra de progresso.',\n  },\n  // ---------------------------------------------------------------- stat-card\n  {\n    code: 'STAT-001',\n    name: 'Card de indicador',\n    component: 'StatCard',\n    file: 'components/ui/stat-card.tsx',\n    variantProps: {},\n    whenToUse: 'Para um número de destaque com variação, num painel ou dashboard.',\n  },\n  // ---------------------------------------------------------------- switch\n  {\n    code: 'SWT-001',\n    name: 'Switch',\n    component: 'Switch',\n    file: 'components/ui/switch.tsx',\n    variantProps: {},\n    whenToUse: 'Para ligar ou desligar uma opção com efeito imediato.',\n  },\n  // ---------------------------------------------------------------- table\n  {\n    code: 'TAB-001',\n    name: 'Tabela',\n    component: 'Table',\n    file: 'components/ui/table.tsx',\n    variantProps: {},\n    whenToUse: 'Para qualquer listagem de registros, com busca, filtros e paginação.',\n  },\n  // ---------------------------------------------------------------- tabs\n  {\n    code: 'ABA-001',\n    name: 'Abas em linha',\n    component: 'Tabs',\n    file: 'components/ui/tabs.tsx',\n    variantProps: { variant: 'line' },\n    whenToUse: 'Padrão para dividir o conteúdo de uma tela em seções, com sublinhado na aba ativa.',\n    isDefault: true,\n  },\n  {\n    code: 'ABA-002',\n    name: 'Abas em pílula',\n    component: 'Tabs',\n    file: 'components/ui/tabs.tsx',\n    variantProps: { variant: 'pill' },\n    whenToUse: 'Quando as abas precisam de mais destaque visual, como pílulas sobre fundo suave.',\n  },\n  // ---------------------------------------------------------------- textarea\n  {\n    code: 'TXT-001',\n    name: 'Área de texto',\n    component: 'Textarea',\n    file: 'components/ui/textarea.tsx',\n    variantProps: {},\n    whenToUse: 'Para texto longo, com contador de caracteres opcional.',\n  },\n  // ---------------------------------------------------------------- timeline\n  {\n    code: 'TLN-001',\n    name: 'Linha do tempo',\n    component: 'Timeline',\n    file: 'components/ui/timeline.tsx',\n    variantProps: {},\n    whenToUse: 'Para uma sequência de eventos em ordem, cada um com um tom semântico.',\n  },\n  // ---------------------------------------------------------------- toast\n  {\n    code: 'TST-001',\n    name: 'Toast',\n    component: 'toast',\n    file: 'components/ui/toast.tsx',\n    variantProps: {},\n    whenToUse: 'Para uma confirmação rápida depois de uma ação, sem interromper a tela.',\n  },\n  // ---------------------------------------------------------------- tooltip\n  {\n    code: 'TIP-001',\n    name: 'Tooltip',\n    component: 'Tooltip',\n    file: 'components/ui/tooltip.tsx',\n    variantProps: {},\n    whenToUse: 'Para informação complementar, nunca essencial, que aparece ao passar o mouse.',\n  },\n  // ---------------------------------------------------------------- upload\n  {\n    code: 'UPL-001',\n    name: 'Upload',\n    component: 'Upload',\n    file: 'components/ui/upload.tsx',\n    // A prop que distingue de UPL-002 é `layout` ('list' | 'gallery', padrão 'list'): declarar\n    // o valor padrão aqui (em vez de {}) é o que permite ao `rendra trocar` inserir\n    // layout=\"gallery\" num elemento sem a prop, ao trocar para UPL-002.\n    variantProps: { layout: 'list' },\n    whenToUse: 'Para arrastar e soltar ou escolher arquivos, com lista e progresso por arquivo.',\n    isDefault: true,\n  },\n  {\n    code: 'UPL-002',\n    name: 'Upload em galeria',\n    component: 'Upload',\n    file: 'components/ui/upload.tsx',\n    variantProps: { layout: 'gallery' },\n    whenToUse: 'Para upload de fotos e vídeos, com miniatura em vez de linha de lista.',\n  },\n  // ---------------------------------------------------------------- widget-grid\n  {\n    code: 'WDG-001',\n    name: 'Grade de widgets',\n    component: 'WidgetGrid',\n    file: 'components/ui/widget-grid.tsx',\n    variantProps: {},\n    whenToUse: 'Para um painel com blocos que a pessoa pode arrastar e redimensionar.',\n  },\n  // ---------------------------------------------------------------- wizard\n  {\n    code: 'WIZ-001',\n    name: 'Wizard',\n    component: 'Wizard',\n    file: 'components/ui/wizard.tsx',\n    variantProps: {},\n    whenToUse: 'Para um cadastro longo dividido em etapas, com validação por etapa.',\n  },\n  {\n    code: 'WIZ-002',\n    name: 'Indicador de etapas',\n    component: 'Stepper',\n    file: 'components/ui/wizard.tsx',\n    variantProps: {},\n    whenToUse: 'Para mostrar o progresso em etapas por conta própria, sem o Wizard inteiro.',\n  },\n]\n\n/** Um código específico do catálogo (ex.: para montar a vitrine ou o registry). */\nexport function getCatalogEntry(code: string): ComponentCatalogEntry | undefined {\n  return CATALOG.find((entry) => entry.code === code)\n}\n\n/** Todos os códigos de um componente (ex.: as duas variantes do Tabs), na ordem cadastrada. */\nexport function catalogByComponent(component: string): ComponentCatalogEntry[] {\n  return CATALOG.filter((entry) => entry.component === component)\n}\n\n/**\n * Resolve o código de catálogo de um componente a partir das props que definem a variante.\n * Sem variante (um código só, ou nenhuma prop bate), devolve o primeiro código cadastrado\n * para o componente. Usado pelos próprios componentes para calcular o `data-rendra`, sem\n * duplicar a tabela de variantes.\n */\nexport function resolveCatalogCode(component: string, props: Record<string, unknown> = {}): string {\n  const entries = catalogByComponent(component)\n  if (entries.length === 0) {\n    throw new Error(`Catálogo: nenhum código cadastrado para o componente \"${component}\".`)\n  }\n  const match = entries.find(\n    (entry) =>\n      Object.keys(entry.variantProps).length > 0 &&\n      Object.entries(entry.variantProps).every(([key, value]) => props[key] === value),\n  )\n  // entries.length > 0 já foi conferido acima: entries[0] sempre existe aqui.\n  return (match ?? entries[0]!).code\n}\n\n/*\n * Regras de integridade (usadas pelo teste em components.test.ts e por assertCatalogIntegrity).\n * São funções puras, sem acesso a arquivo: recebem a lista de entradas e devolvem o que\n * está errado, para o teste poder provar a regra com uma lista fabricada, não só com o\n * catálogo real.\n */\n\n/** Código que aparece mais de uma vez na lista. */\nexport function findDuplicateCodes(entries: ComponentCatalogEntry[]): string[] {\n  const seen = new Set<string>()\n  const duplicates = new Set<string>()\n  for (const entry of entries) {\n    if (seen.has(entry.code)) duplicates.add(entry.code)\n    seen.add(entry.code)\n  }\n  return [...duplicates]\n}\n\n/** Código fora do formato ^[A-Z]{3,4}-\\d{3}$. */\nexport function findInvalidFormatCodes(entries: ComponentCatalogEntry[]): string[] {\n  return entries\n    .filter((entry) => !COMPONENT_CODE_PATTERN.test(entry.code))\n    .map((entry) => entry.code)\n}\n\n/**\n * Código que colidiria com um código de modelo (T1, C4, M5...) de src/config/presets.ts,\n * cujo padrão é /[TCM]\\d+/ (uma letra T, C ou M seguida direto de dígitos, sem hífen).\n */\nexport function findPresetCollisions(entries: ComponentCatalogEntry[]): string[] {\n  return entries.filter((entry) => /[TCM]\\d+/.test(entry.code)).map((entry) => entry.code)\n}\n\n/** Arquivo (caminho relativo a src/) que não tem nenhuma entrada no catálogo. */\nexport function filesMissingCatalogEntry(\n  files: string[],\n  entries: ComponentCatalogEntry[],\n): string[] {\n  const covered = new Set(entries.map((entry) => entry.file))\n  return files.filter((file) => !covered.has(file))\n}\n\n/** Componente (nome) com mais de uma variante no catálogo, agrupadas na ordem cadastrada. */\nfunction groupByComponentWithMultipleVariants(\n  entries: ComponentCatalogEntry[],\n): Map<string, ComponentCatalogEntry[]> {\n  const byComponent = new Map<string, ComponentCatalogEntry[]>()\n  for (const entry of entries) {\n    const list = byComponent.get(entry.component) ?? []\n    list.push(entry)\n    byComponent.set(entry.component, list)\n  }\n  for (const [component, list] of byComponent) if (list.length <= 1) byComponent.delete(component)\n  return byComponent\n}\n\n/**\n * Componente com mais de uma variante que não tem nenhuma marcada `isDefault` (fase 3, Lote\n * B: `rendra trocar` precisa saber qual variante um elemento sem a prop representa).\n */\nexport function findComponentsWithoutDefault(entries: ComponentCatalogEntry[]): string[] {\n  const groups = groupByComponentWithMultipleVariants(entries)\n  return [...groups]\n    .filter(([, list]) => !list.some((entry) => entry.isDefault))\n    .map(([component]) => component)\n}\n\n/** Componente com mais de uma variante marcada `isDefault` ao mesmo tempo (só pode uma). */\nexport function findComponentsWithMultipleDefaults(entries: ComponentCatalogEntry[]): string[] {\n  const groups = groupByComponentWithMultipleVariants(entries)\n  return [...groups]\n    .filter(([, list]) => list.filter((entry) => entry.isDefault).length > 1)\n    .map(([component]) => component)\n}\n\n/**\n * Lança se houver código duplicado, fora do formato, colidindo com um código de modelo, ou\n * componente com mais de uma variante sem exatamente uma marcada `isDefault`.\n */\nexport function assertCatalogIntegrity(): void {\n  const duplicates = findDuplicateCodes(CATALOG)\n  if (duplicates.length > 0) {\n    throw new Error(`Catálogo: código duplicado: ${duplicates.join(', ')}.`)\n  }\n  const invalid = findInvalidFormatCodes(CATALOG)\n  if (invalid.length > 0) {\n    throw new Error(`Catálogo: código fora do formato ^[A-Z]{3,4}-\\\\d{3}$: ${invalid.join(', ')}.`)\n  }\n  const collisions = findPresetCollisions(CATALOG)\n  if (collisions.length > 0) {\n    throw new Error(\n      `Catálogo: código colide com um código de modelo (T/C/M): ${collisions.join(', ')}.`,\n    )\n  }\n  const semPadrao = findComponentsWithoutDefault(CATALOG)\n  if (semPadrao.length > 0) {\n    throw new Error(\n      `Catálogo: componente com mais de uma variante sem nenhuma marcada isDefault: ${semPadrao.join(', ')}.`,\n    )\n  }\n  const padraoDuplicado = findComponentsWithMultipleDefaults(CATALOG)\n  if (padraoDuplicado.length > 0) {\n    throw new Error(\n      `Catálogo: componente com mais de uma variante marcada isDefault: ${padraoDuplicado.join(', ')}.`,\n    )\n  }\n}\n"],"mappings":"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;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CACA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WACE;CACJ;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CACA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CACA;EACE,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;EACN,cAAc,CAAC;EACf,WAAW;CACb;CAEA;EACE,MAAM;EACN,MAAM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"}