@lucasbernardosn/react-ui 0.1.0 → 0.2.0

package/dist/components/overlays/action-bar/action-bar-popup-variants.js.map

@@ -1 +1 @@
-{"version":3,"file":"action-bar-popup-variants.js","names":[],"sources":["../../../../src/components/overlays/action-bar/action-bar-popup-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { actionBarDefaultVariants } from './use-action-bar-context';\n\n/**\n * Cópia de `popoverPopupVariants`, a origem da superfície dos popups, onde fundo, contorno, sombra\n * e cor do texto estão explicados. As diferenças:\n * - posição própria, `fixed` no rodapé, sem positioner, e sem teto de altura nem animação de\n *   tamanho;\n * - ações em linha (`items-center`, `gap-3`), padding próprio, `rounded-lg` e `shadow-lg`;\n * - entra subindo (`translate-y-4`), e não crescendo a partir de um trigger.\n *\n * A distância das bordas da tela fica em `--action-bar-offset`, somada à área segura do celular\n * embaixo.\n *\n * No `bottom`, o `-translate-x-1/2` centraliza e a animação de entrada mexe no `translate-y`: no\n * Tailwind os dois eixos compõem a mesma propriedade `translate`, então um não anula o outro.\n */\nexport const actionBarPopupVariants = cva(\n  [\n    '[--action-bar-offset:--spacing(4)]',\n\n    'fixed',\n    'bottom-[calc(env(safe-area-inset-bottom)+var(--action-bar-offset))]',\n\n    'flex',\n    'items-center',\n    'gap-3',\n\n    'max-w-[calc(100dvw-2*var(--action-bar-offset))]',\n\n    'px-3',\n    'py-2.5',\n\n    'rounded-lg',\n    'corner-squircle',\n    'outline-1',\n    'outline-gray-6',\n\n    'bg-white',\n    'dark:bg-gray-2',\n\n    'shadow-lg',\n    'shadow-black/12',\n    'dark:shadow-none',\n\n    // A barra vai para o `body` pelo portal: sem cor própria, o texto herdaria a do navegador.\n    'text-sm',\n    'text-gray-12',\n\n    'not-motion-reduced:transition-[translate,opacity]',\n    'not-motion-reduced:ease-enter',\n    'not-motion-reduced:duration-150',\n\n    'not-motion-reduced:data-starting-style:translate-y-4',\n    'not-motion-reduced:data-ending-style:translate-y-4',\n    'not-motion-reduced:data-ending-style:ease-exit',\n    'not-motion-reduced:data-ending-style:duration-100',\n    'data-starting-style:opacity-0',\n    'data-ending-style:opacity-0',\n  ],\n  {\n    variants: {\n      placement: {\n        bottom: ['left-1/2', '-translate-x-1/2'],\n        'bottom-start': ['left-(--action-bar-offset)'],\n        'bottom-end': ['right-(--action-bar-offset)'],\n      },\n    },\n    defaultVariants: {\n      placement: actionBarDefaultVariants.placement,\n    },\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;AAiBA,MAAa,yBAAyB,IACpC;CACE;CAEA;CACA;CAEA;CACA;CACA;CAEA;CAEA;CACA;CAEA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CAGA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;AACF,GACA;CACE,UAAU,EACR,WAAW;EACT,QAAQ,CAAC,YAAY,kBAAkB;EACvC,gBAAgB,CAAC,4BAA4B;EAC7C,cAAc,CAAC,6BAA6B;CAC9C,EACF;CACA,iBAAiB,EACf,WAAW,yBAAyB,UACtC;AACF,CACF"}
+{"version":3,"file":"action-bar-popup-variants.js","names":[],"sources":["../../../../src/components/overlays/action-bar/action-bar-popup-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { actionBarDefaultVariants } from './use-action-bar-context';\n\n/**\n * Cópia de `popoverPopupVariants`, a origem da superfície dos popups, onde fundo, contorno, sombra\n * e cor do texto estão explicados. As diferenças:\n * - posição própria, `fixed` no rodapé, sem positioner, e sem teto de altura nem animação de\n *   tamanho;\n * - ações em linha (`items-center`, `gap-3`), padding próprio, `rounded-md` e `shadow-lg`;\n * - entra subindo (`translate-y-4`), e não crescendo a partir de um trigger.\n *\n * A distância das bordas da tela fica em `--action-bar-offset`, somada à área segura do celular\n * embaixo.\n *\n * No `bottom`, o `-translate-x-1/2` centraliza e a animação de entrada mexe no `translate-y`: no\n * Tailwind os dois eixos compõem a mesma propriedade `translate`, então um não anula o outro.\n */\nexport const actionBarPopupVariants = cva(\n  [\n    '[--action-bar-offset:--spacing(4)]',\n\n    'fixed',\n    'bottom-[calc(env(safe-area-inset-bottom)+var(--action-bar-offset))]',\n\n    'flex',\n    'items-center',\n    'gap-3',\n\n    'max-w-[calc(100dvw-2*var(--action-bar-offset))]',\n\n    'px-4',\n    'py-2',\n\n    'rounded-md',\n    'corner-squircle',\n    'outline-1',\n    'outline-gray-6',\n\n    'bg-white',\n    'dark:bg-gray-2',\n\n    'shadow-lg',\n    'shadow-black/12',\n    'dark:shadow-none',\n\n    // A barra vai para o `body` pelo portal: sem cor própria, o texto herdaria a do navegador.\n    'text-sm',\n    'text-gray-12',\n\n    'not-motion-reduced:transition-[translate,opacity]',\n    'not-motion-reduced:ease-enter',\n    'not-motion-reduced:duration-150',\n\n    'not-motion-reduced:data-starting-style:translate-y-4',\n    'not-motion-reduced:data-ending-style:translate-y-4',\n    'not-motion-reduced:data-ending-style:ease-exit',\n    'not-motion-reduced:data-ending-style:duration-100',\n    'data-starting-style:opacity-0',\n    'data-ending-style:opacity-0',\n  ],\n  {\n    variants: {\n      placement: {\n        bottom: ['left-1/2', '-translate-x-1/2'],\n        'bottom-start': ['left-(--action-bar-offset)'],\n        'bottom-end': ['right-(--action-bar-offset)'],\n      },\n    },\n    defaultVariants: {\n      placement: actionBarDefaultVariants.placement,\n    },\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;AAiBA,MAAa,yBAAyB,IACpC;CACE;CAEA;CACA;CAEA;CACA;CACA;CAEA;CAEA;CACA;CAEA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CAGA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;AACF,GACA;CACE,UAAU,EACR,WAAW;EACT,QAAQ,CAAC,YAAY,kBAAkB;EACvC,gBAAgB,CAAC,4BAA4B;EAC7C,cAAc,CAAC,6BAA6B;CAC9C,EACF;CACA,iBAAiB,EACf,WAAW,yBAAyB,UACtC;AACF,CACF"}

package/dist/components/overlays/alert-dialog/alert-dialog-footer.js

@@ -17,10 +17,9 @@ const AlertDialogFooter = (props) => {
 			"justify-end",
 			"gap-2",
 			"px-(--alert-dialog-padding)",
-			"pt-4",
+			"pt-2",
 			"pb-(--alert-dialog-padding)",
-			"first:pt-(--alert-dialog-padding)",
-			"[[data-component='AlertDialog.Header']+&]:pt-2"
+			"first:pt-(--alert-dialog-padding)"
 		], className)
 	};
 	return useRender({

package/dist/components/overlays/alert-dialog/alert-dialog-footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog-footer.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-footer.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type AlertDialogFooterProps = useRender.ComponentProps<'div'>;\n\n/**\n * Linha de ações na base do alert dialog, alinhadas à direita.\n *\n * Cópia de `DialogFooter`, sem diferenças (tabela no README de `overlays`); o mecanismo está\n * explicado lá.\n */\nexport const AlertDialogFooter = (props: AlertDialogFooterProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'AlertDialog.Footer',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'items-center',\n        'justify-end',\n        'gap-2',\n\n        'px-(--alert-dialog-padding)',\n        'pt-4',\n        'pb-(--alert-dialog-padding)',\n        // Abrindo o dialog, fecha o respiro de cima; logo depois do `Header`, completa os 16px\n        // dele até os 24px, sem somar os dois.\n        'first:pt-(--alert-dialog-padding)',\n        \"[[data-component='AlertDialog.Header']+&]:pt-2\",\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer';\n"],"mappings":";;;;;;;;;AAWA,MAAa,qBAAqB,UAAkC;CAClE,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GACA;GAEA;GACA;GACA;GAGA;GACA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,kBAAkB,cAAc"}
+{"version":3,"file":"alert-dialog-footer.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-footer.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type AlertDialogFooterProps = useRender.ComponentProps<'div'>;\n\n/**\n * Linha de ações na base do alert dialog, alinhadas à direita.\n *\n * Cópia de `DialogFooter`, sem diferenças (tabela no README de `overlays`); o mecanismo está\n * explicado lá.\n */\nexport const AlertDialogFooter = (props: AlertDialogFooterProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'AlertDialog.Footer',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'items-center',\n        'justify-end',\n        'gap-2',\n\n        'px-(--alert-dialog-padding)',\n        'pt-2',\n        'pb-(--alert-dialog-padding)',\n        // Abrindo o dialog, fecha o respiro de cima.\n        'first:pt-(--alert-dialog-padding)',\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer';\n"],"mappings":";;;;;;;;;AAWA,MAAa,qBAAqB,UAAkC;CAClE,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GACA;GAEA;GACA;GACA;GAEA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,kBAAkB,cAAc"}

package/dist/components/overlays/alert-dialog/alert-dialog-header.js

@@ -17,7 +17,7 @@ const AlertDialogHeader = (props) => {
 			"gap-0.5",
 			"px-(--alert-dialog-padding)",
 			"pt-(--alert-dialog-padding)",
-			"pb-4",
+			"pb-2",
 			"[&:not(:has(~[data-component='AlertDialog.Body'],~[data-component='AlertDialog.Footer']))]:pb-(--alert-dialog-padding)"
 		], className)
 	};

package/dist/components/overlays/alert-dialog/alert-dialog-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog-header.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-header.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type AlertDialogHeaderProps = useRender.ComponentProps<'div'>;\n\n/**\n * Topo do alert dialog, onde ficam título e descrição.\n *\n * Cópia de `DialogHeader`, sem diferenças (tabela no README de `overlays`); o mecanismo está\n * explicado lá.\n */\nexport const AlertDialogHeader = (props: AlertDialogHeaderProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'AlertDialog.Header',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'flex-col',\n        'gap-0.5',\n\n        'px-(--alert-dialog-padding)',\n        'pt-(--alert-dialog-padding)',\n        'pb-4',\n        // Sem `Body` nem `Footer` depois, fecha o respiro do dialog embaixo. Por irmão, e não por\n        // `last:`, porque um `Close` pode vir depois.\n        \"[&:not(:has(~[data-component='AlertDialog.Body'],~[data-component='AlertDialog.Footer']))]:pb-(--alert-dialog-padding)\",\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nAlertDialogHeader.displayName = 'AlertDialog.Header';\n"],"mappings":";;;;;;;;;AAWA,MAAa,qBAAqB,UAAkC;CAClE,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GAEA;GACA;GACA;GAGA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,kBAAkB,cAAc"}
+{"version":3,"file":"alert-dialog-header.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-header.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type AlertDialogHeaderProps = useRender.ComponentProps<'div'>;\n\n/**\n * Topo do alert dialog, onde ficam título e descrição.\n *\n * Cópia de `DialogHeader`, sem diferenças (tabela no README de `overlays`); o mecanismo está\n * explicado lá.\n */\nexport const AlertDialogHeader = (props: AlertDialogHeaderProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'AlertDialog.Header',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'flex-col',\n        'gap-0.5',\n\n        'px-(--alert-dialog-padding)',\n        'pt-(--alert-dialog-padding)',\n        'pb-2',\n        // Sem `Body` nem `Footer` depois, fecha o respiro do dialog embaixo. Por irmão, e não por\n        // `last:`, porque um `Close` pode vir depois.\n        \"[&:not(:has(~[data-component='AlertDialog.Body'],~[data-component='AlertDialog.Footer']))]:pb-(--alert-dialog-padding)\",\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nAlertDialogHeader.displayName = 'AlertDialog.Header';\n"],"mappings":";;;;;;;;;AAWA,MAAa,qBAAqB,UAAkC;CAClE,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GAEA;GACA;GACA;GAGA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,kBAAkB,cAAc"}

package/dist/components/overlays/alert-dialog/alert-dialog-popup-variants.js

@@ -6,13 +6,13 @@ import { cva } from "class-variance-authority";
 * largura pelo `size`, respiro e tipografia fixos e aninhamento estão explicados lá.
 */
 const alertDialogPopupVariants = cva([
-	"[--alert-dialog-padding:--spacing(6)]",
+	"[--alert-dialog-padding:--spacing(4)]",
 	"relative",
 	"flex",
 	"flex-col",
 	"w-full",
 	"max-h-full",
-	"rounded-lg",
+	"rounded-md",
 	"corner-squircle",
 	"outline-1",
 	"outline-gray-6",

package/dist/components/overlays/alert-dialog/alert-dialog-popup-variants.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog-popup-variants.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-popup-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { alertDialogDefaultVariants } from './use-alert-dialog-context';\n\n/**\n * Cópia de `dialogPopupVariants`, sem diferenças (tabela no README de `overlays`): superfície,\n * largura pelo `size`, respiro e tipografia fixos e aninhamento estão explicados lá.\n */\nexport const alertDialogPopupVariants = cva(\n  [\n    '[--alert-dialog-padding:--spacing(6)]',\n\n    'relative',\n\n    'flex',\n    'flex-col',\n\n    'w-full',\n    'max-h-full',\n\n    'rounded-lg',\n    'corner-squircle',\n    'outline-1',\n    'outline-gray-6',\n\n    'bg-white',\n    'dark:bg-gray-2',\n\n    'shadow-lg',\n    'shadow-black/12',\n    'dark:shadow-none',\n\n    // O popup vai para o `body` pelo portal: sem cor própria, o texto herdaria a do navegador.\n    'text-sm',\n    'text-gray-12',\n\n    'not-motion-reduced:transition-[translate,opacity,scale]',\n    'not-motion-reduced:ease-enter',\n    'not-motion-reduced:duration-150',\n\n    'not-motion-reduced:data-starting-style:scale-95',\n    'not-motion-reduced:data-ending-style:scale-95',\n    'not-motion-reduced:data-ending-style:ease-exit',\n    'not-motion-reduced:data-ending-style:duration-100',\n    'data-starting-style:opacity-0',\n    'data-ending-style:opacity-0',\n\n    'not-motion-reduced:data-nested-dialog-open:scale-[calc(1-0.05*var(--nested-dialogs))]',\n    'not-motion-reduced:data-nested-dialog-open:-translate-y-[calc(var(--nested-dialogs)*(--spacing(6)))]',\n\n    \"after:content-['']\",\n    'after:absolute',\n    'after:inset-0',\n    'after:rounded-[inherit]',\n    'after:bg-black/20',\n    'after:opacity-0',\n    'after:pointer-events-none',\n    'not-motion-reduced:after:transition-opacity',\n    'not-motion-reduced:after:duration-150',\n    'data-nested-dialog-open:after:opacity-100',\n  ],\n  {\n    variants: {\n      size: {\n        xs: ['max-w-xs'],\n        sm: ['max-w-sm'],\n        md: ['max-w-md'],\n        lg: ['max-w-lg'],\n        xl: ['max-w-xl'],\n        '2xl': ['max-w-2xl'],\n        '3xl': ['max-w-3xl'],\n        '4xl': ['max-w-4xl'],\n        '5xl': ['max-w-5xl'],\n        '6xl': ['max-w-6xl'],\n        '7xl': ['max-w-7xl'],\n        full: ['max-w-none', 'h-full'],\n      },\n    },\n    defaultVariants: {\n      size: alertDialogDefaultVariants.size,\n    },\n  },\n);\n"],"mappings":";;;;;;;AAOA,MAAa,2BAA2B,IACtC;CACE;CAEA;CAEA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CAGA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,GACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,MAAM,CAAC,cAAc,QAAQ;CAC/B,EACF;CACA,iBAAiB,EACf,MAAM,2BAA2B,KACnC;AACF,CACF"}
+{"version":3,"file":"alert-dialog-popup-variants.js","names":[],"sources":["../../../../src/components/overlays/alert-dialog/alert-dialog-popup-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { alertDialogDefaultVariants } from './use-alert-dialog-context';\n\n/**\n * Cópia de `dialogPopupVariants`, sem diferenças (tabela no README de `overlays`): superfície,\n * largura pelo `size`, respiro e tipografia fixos e aninhamento estão explicados lá.\n */\nexport const alertDialogPopupVariants = cva(\n  [\n    '[--alert-dialog-padding:--spacing(4)]',\n\n    'relative',\n\n    'flex',\n    'flex-col',\n\n    'w-full',\n    'max-h-full',\n\n    'rounded-md',\n    'corner-squircle',\n    'outline-1',\n    'outline-gray-6',\n\n    'bg-white',\n    'dark:bg-gray-2',\n\n    'shadow-lg',\n    'shadow-black/12',\n    'dark:shadow-none',\n\n    // O popup vai para o `body` pelo portal: sem cor própria, o texto herdaria a do navegador.\n    'text-sm',\n    'text-gray-12',\n\n    'not-motion-reduced:transition-[translate,opacity,scale]',\n    'not-motion-reduced:ease-enter',\n    'not-motion-reduced:duration-150',\n\n    'not-motion-reduced:data-starting-style:scale-95',\n    'not-motion-reduced:data-ending-style:scale-95',\n    'not-motion-reduced:data-ending-style:ease-exit',\n    'not-motion-reduced:data-ending-style:duration-100',\n    'data-starting-style:opacity-0',\n    'data-ending-style:opacity-0',\n\n    'not-motion-reduced:data-nested-dialog-open:scale-[calc(1-0.05*var(--nested-dialogs))]',\n    'not-motion-reduced:data-nested-dialog-open:-translate-y-[calc(var(--nested-dialogs)*(--spacing(6)))]',\n\n    \"after:content-['']\",\n    'after:absolute',\n    'after:inset-0',\n    'after:rounded-[inherit]',\n    'after:bg-black/20',\n    'after:opacity-0',\n    'after:pointer-events-none',\n    'not-motion-reduced:after:transition-opacity',\n    'not-motion-reduced:after:duration-150',\n    'data-nested-dialog-open:after:opacity-100',\n  ],\n  {\n    variants: {\n      size: {\n        xs: ['max-w-xs'],\n        sm: ['max-w-sm'],\n        md: ['max-w-md'],\n        lg: ['max-w-lg'],\n        xl: ['max-w-xl'],\n        '2xl': ['max-w-2xl'],\n        '3xl': ['max-w-3xl'],\n        '4xl': ['max-w-4xl'],\n        '5xl': ['max-w-5xl'],\n        '6xl': ['max-w-6xl'],\n        '7xl': ['max-w-7xl'],\n        full: ['max-w-none', 'h-full'],\n      },\n    },\n    defaultVariants: {\n      size: alertDialogDefaultVariants.size,\n    },\n  },\n);\n"],"mappings":";;;;;;;AAOA,MAAa,2BAA2B,IACtC;CACE;CAEA;CAEA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CAGA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,GACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,MAAM,CAAC,cAAc,QAAQ;CAC/B,EACF;CACA,iBAAiB,EACf,MAAM,2BAA2B,KACnC;AACF,CACF"}

package/dist/components/overlays/dialog/dialog-body.d.ts

@@ -6,8 +6,8 @@ export type DialogBodyProps = useRender.ComponentProps<'div'>;
  * rola, e `Header` e `Footer` continuam visíveis.
  *
  * O padding de uma área que rola rola junto com o conteúdo. Por isso o `Body` tem só 8px em cima
- * e embaixo, e o resto do espaço entre as partes fica no `Header` (16px embaixo) e no `Footer`
- * (16px em cima), que não rolam: parado, o espaço é de 24px; rolando, o conteúdo some 16px antes
+ * e embaixo, e o resto do espaço entre as partes fica no `Header` (8px embaixo) e no `Footer`
+ * (8px em cima), que não rolam: parado, o espaço é de 16px; rolando, o conteúdo some 8px antes
  * do título e dos botões. Sem `Header` antes ou sem `Footer` depois, o `Body` fecha o respiro do
  * dialog daquele lado.
  *

package/dist/components/overlays/dialog/dialog-body.js

@@ -6,8 +6,8 @@ import { mergeProps, useRender } from "@base-ui/react";
 * rola, e `Header` e `Footer` continuam visíveis.
 *
 * O padding de uma área que rola rola junto com o conteúdo. Por isso o `Body` tem só 8px em cima
-* e embaixo, e o resto do espaço entre as partes fica no `Header` (16px embaixo) e no `Footer`
-* (16px em cima), que não rolam: parado, o espaço é de 24px; rolando, o conteúdo some 16px antes
+* e embaixo, e o resto do espaço entre as partes fica no `Header` (8px embaixo) e no `Footer`
+* (8px em cima), que não rolam: parado, o espaço é de 16px; rolando, o conteúdo some 8px antes
 * do título e dos botões. Sem `Header` antes ou sem `Footer` depois, o `Body` fecha o respiro do
 * dialog daquele lado.
 *

package/dist/components/overlays/dialog/dialog-body.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-body.js","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-body.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type DialogBodyProps = useRender.ComponentProps<'div'>;\n\n/**\n * Conteúdo principal do dialog. Quando o popup chega à altura do `Dialog.Viewport`, só o `Body`\n * rola, e `Header` e `Footer` continuam visíveis.\n *\n * O padding de uma área que rola rola junto com o conteúdo. Por isso o `Body` tem só 8px em cima\n * e embaixo, e o resto do espaço entre as partes fica no `Header` (16px embaixo) e no `Footer`\n * (16px em cima), que não rolam: parado, o espaço é de 24px; rolando, o conteúdo some 16px antes\n * do título e dos botões. Sem `Header` antes ou sem `Footer` depois, o `Body` fecha o respiro do\n * dialog daquele lado.\n *\n * Cópia de `CardBody` (tabela no README de `display`). As diferenças: lê `--dialog-padding`, rola\n * por dentro (`min-h-0`, `overflow-y-auto`) e divide o espaço vertical com `Header` e `Footer`.\n *\n * Origem do `AlertDialog.Body` e do `Drawer.Body`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const DialogBody = (props: DialogBodyProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'Dialog.Body',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'flex-1',\n        'flex-col',\n        // Sem o `min-h-0`, o item flex não encolhe abaixo do conteúdo, e o popup vaza da tela.\n        'min-h-0',\n        'overflow-y-auto',\n\n        'px-(--dialog-padding)',\n        'py-2',\n        'first:pt-(--dialog-padding)',\n        // Por irmão, e não por `last:`, porque um `Close` pode vir depois.\n        \"[&:not(:has(~[data-component='Dialog.Footer']))]:pb-(--dialog-padding)\",\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nDialogBody.displayName = 'Dialog.Body';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAsBA,MAAa,cAAc,UAA2B;CACpD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GAEA;GACA;GAEA;GACA;GACA;GAEA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,WAAW,cAAc"}
+{"version":3,"file":"dialog-body.js","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-body.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type DialogBodyProps = useRender.ComponentProps<'div'>;\n\n/**\n * Conteúdo principal do dialog. Quando o popup chega à altura do `Dialog.Viewport`, só o `Body`\n * rola, e `Header` e `Footer` continuam visíveis.\n *\n * O padding de uma área que rola rola junto com o conteúdo. Por isso o `Body` tem só 8px em cima\n * e embaixo, e o resto do espaço entre as partes fica no `Header` (8px embaixo) e no `Footer`\n * (8px em cima), que não rolam: parado, o espaço é de 16px; rolando, o conteúdo some 8px antes\n * do título e dos botões. Sem `Header` antes ou sem `Footer` depois, o `Body` fecha o respiro do\n * dialog daquele lado.\n *\n * Cópia de `CardBody` (tabela no README de `display`). As diferenças: lê `--dialog-padding`, rola\n * por dentro (`min-h-0`, `overflow-y-auto`) e divide o espaço vertical com `Header` e `Footer`.\n *\n * Origem do `AlertDialog.Body` e do `Drawer.Body`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const DialogBody = (props: DialogBodyProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'Dialog.Body',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'flex-1',\n        'flex-col',\n        // Sem o `min-h-0`, o item flex não encolhe abaixo do conteúdo, e o popup vaza da tela.\n        'min-h-0',\n        'overflow-y-auto',\n\n        'px-(--dialog-padding)',\n        'py-2',\n        'first:pt-(--dialog-padding)',\n        // Por irmão, e não por `last:`, porque um `Close` pode vir depois.\n        \"[&:not(:has(~[data-component='Dialog.Footer']))]:pb-(--dialog-padding)\",\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nDialogBody.displayName = 'Dialog.Body';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAsBA,MAAa,cAAc,UAA2B;CACpD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GAEA;GACA;GAEA;GACA;GACA;GAEA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,WAAW,cAAc"}

package/dist/components/overlays/dialog/dialog-description.d.ts

@@ -5,8 +5,7 @@ export type DialogDescriptionState = Dialog.Description.State;
 /**
  * Texto de apoio do dialog, abaixo do título, ligado ao popup por `aria-describedby`.
  *
- * Cópia de `CardDescription` (tabela no README de `display`). A diferença: tamanho e entrelinha
- * fixos no `sm` da escala (ver `dialogPopupVariants`).
+ * Cópia de `CardDescription` (tabela no README de `display`), com as mesmas classes.
  *
  * Origem do `AlertDialog.Description` e do `Drawer.Description`, que copiam estas classes
  * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na

package/dist/components/overlays/dialog/dialog-description.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-description.d.ts","names":["BaseDialog"],"sources":["../../../../src/components/overlays/dialog/dialog-description.tsx"],"mappings":";;YAGY,yBAAyBA,OAAW,YAAY;YAEhD,yBAAyBA,OAAW,YAAY;;;;;;;;;;;qBAY/C;GAA4B,OAAA,yCAAsB,IAAA"}
+{"version":3,"file":"dialog-description.d.ts","names":["BaseDialog"],"sources":["../../../../src/components/overlays/dialog/dialog-description.tsx"],"mappings":";;YAGY,yBAAyBA,OAAW,YAAY;YAEhD,yBAAyBA,OAAW,YAAY;;;;;;;;;;qBAW/C;GAA4B,OAAA,yCAAsB,IAAA"}

package/dist/components/overlays/dialog/dialog-description.js

@@ -5,8 +5,7 @@ import { Dialog } from "@base-ui/react/dialog";
 /**
 * Texto de apoio do dialog, abaixo do título, ligado ao popup por `aria-describedby`.
 *
-* Cópia de `CardDescription` (tabela no README de `display`). A diferença: tamanho e entrelinha
-* fixos no `sm` da escala (ver `dialogPopupVariants`).
+* Cópia de `CardDescription` (tabela no README de `display`), com as mesmas classes.
 *
 * Origem do `AlertDialog.Description` e do `Drawer.Description`, que copiam estas classes
 * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na

package/dist/components/overlays/dialog/dialog-description.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-description.js","names":["BaseDialog"],"sources":["../../../../src/components/overlays/dialog/dialog-description.tsx"],"sourcesContent":["import { Dialog as BaseDialog } from '@base-ui/react/dialog';\nimport { mergeStateClassNames } from '#utils';\n\nexport type DialogDescriptionProps = BaseDialog.Description.Props;\n\nexport type DialogDescriptionState = BaseDialog.Description.State;\n\n/**\n * Texto de apoio do dialog, abaixo do título, ligado ao popup por `aria-describedby`.\n *\n * Cópia de `CardDescription` (tabela no README de `display`). A diferença: tamanho e entrelinha\n * fixos no `sm` da escala (ver `dialogPopupVariants`).\n *\n * Origem do `AlertDialog.Description` e do `Drawer.Description`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const DialogDescription = (props: DialogDescriptionProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseDialog.Description\n      data-component=\"Dialog.Description\"\n      className={mergeStateClassNames(\n        ['text-sm', 'leading-5', 'text-gray-11', 'text-pretty'],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nDialogDescription.displayName = 'Dialog.Description';\n"],"mappings":";;;;;;;;;;;;;;AAiBA,MAAa,qBAAqB,UAAkC;CAClE,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,OAAW,aAAZ;EACE,kBAAe;EACf,WAAW,qBACT;GAAC;GAAW;GAAa;GAAgB;EAAa,GACtD,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,kBAAkB,cAAc"}
+{"version":3,"file":"dialog-description.js","names":["BaseDialog"],"sources":["../../../../src/components/overlays/dialog/dialog-description.tsx"],"sourcesContent":["import { Dialog as BaseDialog } from '@base-ui/react/dialog';\nimport { mergeStateClassNames } from '#utils';\n\nexport type DialogDescriptionProps = BaseDialog.Description.Props;\n\nexport type DialogDescriptionState = BaseDialog.Description.State;\n\n/**\n * Texto de apoio do dialog, abaixo do título, ligado ao popup por `aria-describedby`.\n *\n * Cópia de `CardDescription` (tabela no README de `display`), com as mesmas classes.\n *\n * Origem do `AlertDialog.Description` e do `Drawer.Description`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const DialogDescription = (props: DialogDescriptionProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseDialog.Description\n      data-component=\"Dialog.Description\"\n      className={mergeStateClassNames(\n        ['text-sm', 'leading-5', 'text-gray-11', 'text-pretty'],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nDialogDescription.displayName = 'Dialog.Description';\n"],"mappings":";;;;;;;;;;;;;AAgBA,MAAa,qBAAqB,UAAkC;CAClE,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,OAAW,aAAZ;EACE,kBAAe;EACf,WAAW,qBACT;GAAC;GAAW;GAAa;GAAgB;EAAa,GACtD,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,kBAAkB,cAAc"}

package/dist/components/overlays/dialog/dialog-footer.d.ts

@@ -5,7 +5,7 @@ export type DialogFooterProps = useRender.ComponentProps<'div'>;
  * Linha de ações na base do dialog, alinhadas à direita.
  *
  * Cópia de `CardFooter` (tabela no README de `display`). As diferenças: lê `--dialog-padding`,
- * alinha as ações à direita (`justify-end`) e declara 16px em cima, que não rolam com o `Body`
+ * alinha as ações à direita (`justify-end`) e declara 8px em cima, que não rolam com o `Body`
  * (ver `DialogBody`).
  *
  * Origem do `AlertDialog.Footer` e do `Drawer.Footer`, que copiam estas classes

package/dist/components/overlays/dialog/dialog-footer.js

@@ -5,7 +5,7 @@ import { mergeProps, useRender } from "@base-ui/react";
 * Linha de ações na base do dialog, alinhadas à direita.
 *
 * Cópia de `CardFooter` (tabela no README de `display`). As diferenças: lê `--dialog-padding`,
-* alinha as ações à direita (`justify-end`) e declara 16px em cima, que não rolam com o `Body`
+* alinha as ações à direita (`justify-end`) e declara 8px em cima, que não rolam com o `Body`
 * (ver `DialogBody`).
 *
 * Origem do `AlertDialog.Footer` e do `Drawer.Footer`, que copiam estas classes
@@ -22,10 +22,9 @@ const DialogFooter = (props) => {
 			"justify-end",
 			"gap-2",
 			"px-(--dialog-padding)",
-			"pt-4",
+			"pt-2",
 			"pb-(--dialog-padding)",
-			"first:pt-(--dialog-padding)",
-			"[[data-component='Dialog.Header']+&]:pt-2"
+			"first:pt-(--dialog-padding)"
 		], className)
 	};
 	return useRender({

package/dist/components/overlays/dialog/dialog-footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-footer.js","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-footer.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type DialogFooterProps = useRender.ComponentProps<'div'>;\n\n/**\n * Linha de ações na base do dialog, alinhadas à direita.\n *\n * Cópia de `CardFooter` (tabela no README de `display`). As diferenças: lê `--dialog-padding`,\n * alinha as ações à direita (`justify-end`) e declara 16px em cima, que não rolam com o `Body`\n * (ver `DialogBody`).\n *\n * Origem do `AlertDialog.Footer` e do `Drawer.Footer`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const DialogFooter = (props: DialogFooterProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'Dialog.Footer',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'items-center',\n        'justify-end',\n        'gap-2',\n\n        'px-(--dialog-padding)',\n        'pt-4',\n        'pb-(--dialog-padding)',\n        // Abrindo o dialog, fecha o respiro de cima; logo depois do `Header`, completa os 16px\n        // dele até os 24px, sem somar os dois.\n        'first:pt-(--dialog-padding)',\n        \"[[data-component='Dialog.Header']+&]:pt-2\",\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nDialogFooter.displayName = 'Dialog.Footer';\n"],"mappings":";;;;;;;;;;;;;;AAgBA,MAAa,gBAAgB,UAA6B;CACxD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GACA;GAEA;GACA;GACA;GAGA;GACA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,aAAa,cAAc"}
+{"version":3,"file":"dialog-footer.js","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-footer.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type DialogFooterProps = useRender.ComponentProps<'div'>;\n\n/**\n * Linha de ações na base do dialog, alinhadas à direita.\n *\n * Cópia de `CardFooter` (tabela no README de `display`). As diferenças: lê `--dialog-padding`,\n * alinha as ações à direita (`justify-end`) e declara 8px em cima, que não rolam com o `Body`\n * (ver `DialogBody`).\n *\n * Origem do `AlertDialog.Footer` e do `Drawer.Footer`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const DialogFooter = (props: DialogFooterProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'Dialog.Footer',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'items-center',\n        'justify-end',\n        'gap-2',\n\n        'px-(--dialog-padding)',\n        'pt-2',\n        'pb-(--dialog-padding)',\n        // Abrindo o dialog, fecha o respiro de cima.\n        'first:pt-(--dialog-padding)',\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nDialogFooter.displayName = 'Dialog.Footer';\n"],"mappings":";;;;;;;;;;;;;;AAgBA,MAAa,gBAAgB,UAA6B;CACxD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GACA;GAEA;GACA;GACA;GAEA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,aAAa,cAAc"}

package/dist/components/overlays/dialog/dialog-header.d.ts

@@ -4,10 +4,9 @@ export type DialogHeaderProps = useRender.ComponentProps<'div'>;
 /**
  * Topo do dialog, onde ficam título e descrição.
  *
- * Cópia de `CardHeader`, a origem do cabeçalho com a escala de título e descrição (tabela no
- * README de `display`). As diferenças: o espaço entre título e descrição fica fixo no `sm` da
- * escala, o respiro vem de `--dialog-padding`, e o `Header` declara 16px embaixo, que não rolam
- * com o `Body` (ver `DialogBody`).
+ * Cópia de `CardHeader` (tabela no README de `display`). As diferenças: o respiro vem de
+ * `--dialog-padding`, e o `Header` declara 8px embaixo, que não rolam com o `Body` (ver
+ * `DialogBody`).
  *
  * Origem do `AlertDialog.Header` e do `Drawer.Header`, que copiam estas classes
  * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na

package/dist/components/overlays/dialog/dialog-header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-header.d.ts","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-header.tsx"],"mappings":";;YAGY,oBAAoB,UAAU;;;;;;;;;;;;;qBAc7B;GAAuB,OAAA,oCAAiB,+CAAA"}
+{"version":3,"file":"dialog-header.d.ts","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-header.tsx"],"mappings":";;YAGY,oBAAoB,UAAU;;;;;;;;;;;;qBAa7B;GAAuB,OAAA,oCAAiB,+CAAA"}

package/dist/components/overlays/dialog/dialog-header.js

@@ -4,10 +4,9 @@ import { mergeProps, useRender } from "@base-ui/react";
 /**
 * Topo do dialog, onde ficam título e descrição.
 *
-* Cópia de `CardHeader`, a origem do cabeçalho com a escala de título e descrição (tabela no
-* README de `display`). As diferenças: o espaço entre título e descrição fica fixo no `sm` da
-* escala, o respiro vem de `--dialog-padding`, e o `Header` declara 16px embaixo, que não rolam
-* com o `Body` (ver `DialogBody`).
+* Cópia de `CardHeader` (tabela no README de `display`). As diferenças: o respiro vem de
+* `--dialog-padding`, e o `Header` declara 8px embaixo, que não rolam com o `Body` (ver
+* `DialogBody`).
 *
 * Origem do `AlertDialog.Header` e do `Drawer.Header`, que copiam estas classes
 * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na
@@ -23,7 +22,7 @@ const DialogHeader = (props) => {
 			"gap-0.5",
 			"px-(--dialog-padding)",
 			"pt-(--dialog-padding)",
-			"pb-4",
+			"pb-2",
 			"[&:not(:has(~[data-component='Dialog.Body'],~[data-component='Dialog.Footer']))]:pb-(--dialog-padding)"
 		], className)
 	};

package/dist/components/overlays/dialog/dialog-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-header.js","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-header.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type DialogHeaderProps = useRender.ComponentProps<'div'>;\n\n/**\n * Topo do dialog, onde ficam título e descrição.\n *\n * Cópia de `CardHeader`, a origem do cabeçalho com a escala de título e descrição (tabela no\n * README de `display`). As diferenças: o espaço entre título e descrição fica fixo no `sm` da\n * escala, o respiro vem de `--dialog-padding`, e o `Header` declara 16px embaixo, que não rolam\n * com o `Body` (ver `DialogBody`).\n *\n * Origem do `AlertDialog.Header` e do `Drawer.Header`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const DialogHeader = (props: DialogHeaderProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'Dialog.Header',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'flex-col',\n        'gap-0.5',\n\n        'px-(--dialog-padding)',\n        'pt-(--dialog-padding)',\n        'pb-4',\n        // Sem `Body` nem `Footer` depois, fecha o respiro do dialog embaixo. Por irmão, e não por\n        // `last:`, porque um `Close` pode vir depois.\n        \"[&:not(:has(~[data-component='Dialog.Body'],~[data-component='Dialog.Footer']))]:pb-(--dialog-padding)\",\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nDialogHeader.displayName = 'Dialog.Header';\n"],"mappings":";;;;;;;;;;;;;;;AAiBA,MAAa,gBAAgB,UAA6B;CACxD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GAEA;GACA;GACA;GAGA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,aAAa,cAAc"}
+{"version":3,"file":"dialog-header.js","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-header.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type DialogHeaderProps = useRender.ComponentProps<'div'>;\n\n/**\n * Topo do dialog, onde ficam título e descrição.\n *\n * Cópia de `CardHeader` (tabela no README de `display`). As diferenças: o respiro vem de\n * `--dialog-padding`, e o `Header` declara 8px embaixo, que não rolam com o `Body` (ver\n * `DialogBody`).\n *\n * Origem do `AlertDialog.Header` e do `Drawer.Header`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const DialogHeader = (props: DialogHeaderProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'Dialog.Header',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'flex-col',\n        'gap-0.5',\n\n        'px-(--dialog-padding)',\n        'pt-(--dialog-padding)',\n        'pb-2',\n        // Sem `Body` nem `Footer` depois, fecha o respiro do dialog embaixo. Por irmão, e não por\n        // `last:`, porque um `Close` pode vir depois.\n        \"[&:not(:has(~[data-component='Dialog.Body'],~[data-component='Dialog.Footer']))]:pb-(--dialog-padding)\",\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nDialogHeader.displayName = 'Dialog.Header';\n"],"mappings":";;;;;;;;;;;;;;AAgBA,MAAa,gBAAgB,UAA6B;CACxD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GAEA;GACA;GACA;GAGA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,aAAa,cAAc"}

package/dist/components/overlays/dialog/dialog-popup-variants.d.ts

@@ -4,12 +4,11 @@
  * cor do texto e animação estão explicados (tabela no README de `overlays`). As diferenças:
  * - sem positioner: o `Dialog.Viewport` centraliza o popup, que cresce a partir do centro;
  * - largura pelo `size` e altura até a do viewport, com o `Body` rolando;
- * - `rounded-lg` e `shadow-lg`;
+ * - `rounded-md` e `shadow-lg`;
  * - o aninhamento, abaixo.
  *
- * O respiro de `Header`, `Body` e `Footer` fica em `--dialog-padding`, fixo em 24px, como o
- * título e a descrição, que ficam no `sm` da escala: o `size` do Dialog é a largura, e um Dialog
- * largo não ganha título maior.
+ * O respiro de `Header`, `Body` e `Footer` fica em `--dialog-padding`, fixo em 16px, como o
+ * título e a descrição: o `size` do Dialog é a largura, e um Dialog largo não ganha título maior.
  *
  * Com outro Dialog aberto sobre ele, o Base UI marca o popup com `data-nested-dialog-open` e
  * escreve em `--nested-dialogs` quantos estão abertos à frente. O popup de trás encolhe, sobe 24px

package/dist/components/overlays/dialog/dialog-popup-variants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-popup-variants.d.ts","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-popup-variants.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;qBAyBa,sBAAmB;;6CA0E/B"}
+{"version":3,"file":"dialog-popup-variants.d.ts","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-popup-variants.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;qBAwBa,sBAAmB;;6CA0E/B"}

package/dist/components/overlays/dialog/dialog-popup-variants.js

@@ -6,12 +6,11 @@ import { cva } from "class-variance-authority";
 * cor do texto e animação estão explicados (tabela no README de `overlays`). As diferenças:
 * - sem positioner: o `Dialog.Viewport` centraliza o popup, que cresce a partir do centro;
 * - largura pelo `size` e altura até a do viewport, com o `Body` rolando;
-* - `rounded-lg` e `shadow-lg`;
+* - `rounded-md` e `shadow-lg`;
 * - o aninhamento, abaixo.
 *
-* O respiro de `Header`, `Body` e `Footer` fica em `--dialog-padding`, fixo em 24px, como o
-* título e a descrição, que ficam no `sm` da escala: o `size` do Dialog é a largura, e um Dialog
-* largo não ganha título maior.
+* O respiro de `Header`, `Body` e `Footer` fica em `--dialog-padding`, fixo em 16px, como o
+* título e a descrição: o `size` do Dialog é a largura, e um Dialog largo não ganha título maior.
 *
 * Com outro Dialog aberto sobre ele, o Base UI marca o popup com `data-nested-dialog-open` e
 * escreve em `--nested-dialogs` quantos estão abertos à frente. O popup de trás encolhe, sobe 24px
@@ -24,13 +23,13 @@ import { cva } from "class-variance-authority";
 * mesma rodada.
 */
 const dialogPopupVariants = cva([
-	"[--dialog-padding:--spacing(6)]",
+	"[--dialog-padding:--spacing(4)]",
 	"relative",
 	"flex",
 	"flex-col",
 	"w-full",
 	"max-h-full",
-	"rounded-lg",
+	"rounded-md",
 	"corner-squircle",
 	"outline-1",
 	"outline-gray-6",

package/dist/components/overlays/dialog/dialog-popup-variants.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-popup-variants.js","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-popup-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { dialogDefaultVariants } from './use-dialog-context';\n\n/**\n * Cópia de `popoverPopupVariants`, a origem da superfície dos popups, onde fundo, contorno, sombra,\n * cor do texto e animação estão explicados (tabela no README de `overlays`). As diferenças:\n * - sem positioner: o `Dialog.Viewport` centraliza o popup, que cresce a partir do centro;\n * - largura pelo `size` e altura até a do viewport, com o `Body` rolando;\n * - `rounded-lg` e `shadow-lg`;\n * - o aninhamento, abaixo.\n *\n * O respiro de `Header`, `Body` e `Footer` fica em `--dialog-padding`, fixo em 24px, como o\n * título e a descrição, que ficam no `sm` da escala: o `size` do Dialog é a largura, e um Dialog\n * largo não ganha título maior.\n *\n * Com outro Dialog aberto sobre ele, o Base UI marca o popup com `data-nested-dialog-open` e\n * escreve em `--nested-dialogs` quantos estão abertos à frente. O popup de trás encolhe, sobe 24px\n * por nível e escurece (pelo `::after`), porque o Dialog aninhado não renderiza backdrop: cada\n * nível aparece como uma faixa acima do da frente. Um Dialog da frente mais alto que o de trás o\n * cobre por inteiro, porque os dois ficam centralizados.\n *\n * Origem do `AlertDialog.Popup` e do `Drawer.Popup`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const dialogPopupVariants = cva(\n  [\n    '[--dialog-padding:--spacing(6)]',\n\n    'relative',\n\n    'flex',\n    'flex-col',\n\n    'w-full',\n    'max-h-full',\n\n    'rounded-lg',\n    'corner-squircle',\n    'outline-1',\n    'outline-gray-6',\n\n    'bg-white',\n    'dark:bg-gray-2',\n\n    'shadow-lg',\n    'shadow-black/12',\n    'dark:shadow-none',\n\n    // O popup vai para o `body` pelo portal: sem cor própria, o texto herdaria a do navegador.\n    'text-sm',\n    'text-gray-12',\n\n    'not-motion-reduced:transition-[translate,opacity,scale]',\n    'not-motion-reduced:ease-enter',\n    'not-motion-reduced:duration-150',\n\n    'not-motion-reduced:data-starting-style:scale-95',\n    'not-motion-reduced:data-ending-style:scale-95',\n    'not-motion-reduced:data-ending-style:ease-exit',\n    'not-motion-reduced:data-ending-style:duration-100',\n    'data-starting-style:opacity-0',\n    'data-ending-style:opacity-0',\n\n    'not-motion-reduced:data-nested-dialog-open:scale-[calc(1-0.05*var(--nested-dialogs))]',\n    'not-motion-reduced:data-nested-dialog-open:-translate-y-[calc(var(--nested-dialogs)*(--spacing(6)))]',\n\n    \"after:content-['']\",\n    'after:absolute',\n    'after:inset-0',\n    'after:rounded-[inherit]',\n    'after:bg-black/20',\n    'after:opacity-0',\n    'after:pointer-events-none',\n    'not-motion-reduced:after:transition-opacity',\n    'not-motion-reduced:after:duration-150',\n    'data-nested-dialog-open:after:opacity-100',\n  ],\n  {\n    variants: {\n      size: {\n        xs: ['max-w-xs'],\n        sm: ['max-w-sm'],\n        md: ['max-w-md'],\n        lg: ['max-w-lg'],\n        xl: ['max-w-xl'],\n        '2xl': ['max-w-2xl'],\n        '3xl': ['max-w-3xl'],\n        '4xl': ['max-w-4xl'],\n        '5xl': ['max-w-5xl'],\n        '6xl': ['max-w-6xl'],\n        '7xl': ['max-w-7xl'],\n        full: ['max-w-none', 'h-full'],\n      },\n    },\n    defaultVariants: {\n      size: dialogDefaultVariants.size,\n    },\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,MAAa,sBAAsB,IACjC;CACE;CAEA;CAEA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CAGA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,GACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,MAAM,CAAC,cAAc,QAAQ;CAC/B,EACF;CACA,iBAAiB,EACf,MAAM,sBAAsB,KAC9B;AACF,CACF"}
+{"version":3,"file":"dialog-popup-variants.js","names":[],"sources":["../../../../src/components/overlays/dialog/dialog-popup-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { dialogDefaultVariants } from './use-dialog-context';\n\n/**\n * Cópia de `popoverPopupVariants`, a origem da superfície dos popups, onde fundo, contorno, sombra,\n * cor do texto e animação estão explicados (tabela no README de `overlays`). As diferenças:\n * - sem positioner: o `Dialog.Viewport` centraliza o popup, que cresce a partir do centro;\n * - largura pelo `size` e altura até a do viewport, com o `Body` rolando;\n * - `rounded-md` e `shadow-lg`;\n * - o aninhamento, abaixo.\n *\n * O respiro de `Header`, `Body` e `Footer` fica em `--dialog-padding`, fixo em 16px, como o\n * título e a descrição: o `size` do Dialog é a largura, e um Dialog largo não ganha título maior.\n *\n * Com outro Dialog aberto sobre ele, o Base UI marca o popup com `data-nested-dialog-open` e\n * escreve em `--nested-dialogs` quantos estão abertos à frente. O popup de trás encolhe, sobe 24px\n * por nível e escurece (pelo `::after`), porque o Dialog aninhado não renderiza backdrop: cada\n * nível aparece como uma faixa acima do da frente. Um Dialog da frente mais alto que o de trás o\n * cobre por inteiro, porque os dois ficam centralizados.\n *\n * Origem do `AlertDialog.Popup` e do `Drawer.Popup`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const dialogPopupVariants = cva(\n  [\n    '[--dialog-padding:--spacing(4)]',\n\n    'relative',\n\n    'flex',\n    'flex-col',\n\n    'w-full',\n    'max-h-full',\n\n    'rounded-md',\n    'corner-squircle',\n    'outline-1',\n    'outline-gray-6',\n\n    'bg-white',\n    'dark:bg-gray-2',\n\n    'shadow-lg',\n    'shadow-black/12',\n    'dark:shadow-none',\n\n    // O popup vai para o `body` pelo portal: sem cor própria, o texto herdaria a do navegador.\n    'text-sm',\n    'text-gray-12',\n\n    'not-motion-reduced:transition-[translate,opacity,scale]',\n    'not-motion-reduced:ease-enter',\n    'not-motion-reduced:duration-150',\n\n    'not-motion-reduced:data-starting-style:scale-95',\n    'not-motion-reduced:data-ending-style:scale-95',\n    'not-motion-reduced:data-ending-style:ease-exit',\n    'not-motion-reduced:data-ending-style:duration-100',\n    'data-starting-style:opacity-0',\n    'data-ending-style:opacity-0',\n\n    'not-motion-reduced:data-nested-dialog-open:scale-[calc(1-0.05*var(--nested-dialogs))]',\n    'not-motion-reduced:data-nested-dialog-open:-translate-y-[calc(var(--nested-dialogs)*(--spacing(6)))]',\n\n    \"after:content-['']\",\n    'after:absolute',\n    'after:inset-0',\n    'after:rounded-[inherit]',\n    'after:bg-black/20',\n    'after:opacity-0',\n    'after:pointer-events-none',\n    'not-motion-reduced:after:transition-opacity',\n    'not-motion-reduced:after:duration-150',\n    'data-nested-dialog-open:after:opacity-100',\n  ],\n  {\n    variants: {\n      size: {\n        xs: ['max-w-xs'],\n        sm: ['max-w-sm'],\n        md: ['max-w-md'],\n        lg: ['max-w-lg'],\n        xl: ['max-w-xl'],\n        '2xl': ['max-w-2xl'],\n        '3xl': ['max-w-3xl'],\n        '4xl': ['max-w-4xl'],\n        '5xl': ['max-w-5xl'],\n        '6xl': ['max-w-6xl'],\n        '7xl': ['max-w-7xl'],\n        full: ['max-w-none', 'h-full'],\n      },\n    },\n    defaultVariants: {\n      size: dialogDefaultVariants.size,\n    },\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAa,sBAAsB,IACjC;CACE;CAEA;CAEA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CAGA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,GACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;EACf,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,OAAO,CAAC,WAAW;EACnB,MAAM,CAAC,cAAc,QAAQ;CAC/B,EACF;CACA,iBAAiB,EACf,MAAM,sBAAsB,KAC9B;AACF,CACF"}

package/dist/components/overlays/dialog/dialog-title.d.ts

@@ -5,9 +5,8 @@ export type DialogTitleState = Dialog.Title.State;
 /**
  * Título do dialog, um `h2` ligado ao popup por `aria-labelledby`.
  *
- * Cópia de `CardTitle` (tabela no README de `display`). As diferenças: tamanho e entrelinha fixos
- * no `sm` da escala (ver `dialogPopupVariants`), e a tag vem do Base UI (`h2`), sem a prop
- * `level`; outra tag vai por `render`.
+ * Cópia de `CardTitle` (tabela no README de `display`). A diferença: a tag vem do Base UI (`h2`),
+ * sem a prop `level`; outra tag vai por `render`.
  *
  * Origem do `AlertDialog.Title` e do `Drawer.Title`, que copiam estas classes
  * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na

package/dist/components/overlays/dialog/dialog-title.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-title.d.ts","names":["BaseDialog"],"sources":["../../../../src/components/overlays/dialog/dialog-title.tsx"],"mappings":";;YAGY,mBAAmBA,OAAW,MAAM;YAEpC,mBAAmBA,OAAW,MAAM;;;;;;;;;;;;qBAanC;GAAsB,OAAA,mCAAgB,IAAA"}
+{"version":3,"file":"dialog-title.d.ts","names":["BaseDialog"],"sources":["../../../../src/components/overlays/dialog/dialog-title.tsx"],"mappings":";;YAGY,mBAAmBA,OAAW,MAAM;YAEpC,mBAAmBA,OAAW,MAAM;;;;;;;;;;;qBAYnC;GAAsB,OAAA,mCAAgB,IAAA"}

package/dist/components/overlays/dialog/dialog-title.js

@@ -5,9 +5,8 @@ import { Dialog } from "@base-ui/react/dialog";
 /**
 * Título do dialog, um `h2` ligado ao popup por `aria-labelledby`.
 *
-* Cópia de `CardTitle` (tabela no README de `display`). As diferenças: tamanho e entrelinha fixos
-* no `sm` da escala (ver `dialogPopupVariants`), e a tag vem do Base UI (`h2`), sem a prop
-* `level`; outra tag vai por `render`.
+* Cópia de `CardTitle` (tabela no README de `display`). A diferença: a tag vem do Base UI (`h2`),
+* sem a prop `level`; outra tag vai por `render`.
 *
 * Origem do `AlertDialog.Title` e do `Drawer.Title`, que copiam estas classes
 * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na
@@ -18,9 +17,9 @@ const DialogTitle = (props) => {
 	return /* @__PURE__ */ jsx(Dialog.Title, {
 		"data-component": "Dialog.Title",
 		className: mergeStateClassNames([
-			"text-lg",
+			"text-base",
 			"leading-6",
-			"font-semibold",
+			"font-medium",
 			"text-gray-12",
 			"text-balance"
 		], className),

package/dist/components/overlays/dialog/dialog-title.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-title.js","names":["BaseDialog"],"sources":["../../../../src/components/overlays/dialog/dialog-title.tsx"],"sourcesContent":["import { Dialog as BaseDialog } from '@base-ui/react/dialog';\nimport { mergeStateClassNames } from '#utils';\n\nexport type DialogTitleProps = BaseDialog.Title.Props;\n\nexport type DialogTitleState = BaseDialog.Title.State;\n\n/**\n * Título do dialog, um `h2` ligado ao popup por `aria-labelledby`.\n *\n * Cópia de `CardTitle` (tabela no README de `display`). As diferenças: tamanho e entrelinha fixos\n * no `sm` da escala (ver `dialogPopupVariants`), e a tag vem do Base UI (`h2`), sem a prop\n * `level`; outra tag vai por `render`.\n *\n * Origem do `AlertDialog.Title` e do `Drawer.Title`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const DialogTitle = (props: DialogTitleProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseDialog.Title\n      data-component=\"Dialog.Title\"\n      className={mergeStateClassNames(\n        [\n          'text-lg',\n          'leading-6',\n          'font-semibold',\n          'text-gray-12',\n          'text-balance',\n        ],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nDialogTitle.displayName = 'Dialog.Title';\n"],"mappings":";;;;;;;;;;;;;;;AAkBA,MAAa,eAAe,UAA4B;CACtD,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,OAAW,OAAZ;EACE,kBAAe;EACf,WAAW,qBACT;GACE;GACA;GACA;GACA;GACA;EACF,GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,YAAY,cAAc"}
+{"version":3,"file":"dialog-title.js","names":["BaseDialog"],"sources":["../../../../src/components/overlays/dialog/dialog-title.tsx"],"sourcesContent":["import { Dialog as BaseDialog } from '@base-ui/react/dialog';\nimport { mergeStateClassNames } from '#utils';\n\nexport type DialogTitleProps = BaseDialog.Title.Props;\n\nexport type DialogTitleState = BaseDialog.Title.State;\n\n/**\n * Título do dialog, um `h2` ligado ao popup por `aria-labelledby`.\n *\n * Cópia de `CardTitle` (tabela no README de `display`). A diferença: a tag vem do Base UI (`h2`),\n * sem a prop `level`; outra tag vai por `render`.\n *\n * Origem do `AlertDialog.Title` e do `Drawer.Title`, que copiam estas classes\n * (tabela no README de `overlays`, com as diferenças). Uma mudança aqui vale para as cópias na\n * mesma rodada.\n */\nexport const DialogTitle = (props: DialogTitleProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseDialog.Title\n      data-component=\"Dialog.Title\"\n      className={mergeStateClassNames(\n        [\n          'text-base',\n          'leading-6',\n          'font-medium',\n          'text-gray-12',\n          'text-balance',\n        ],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nDialogTitle.displayName = 'Dialog.Title';\n"],"mappings":";;;;;;;;;;;;;;AAiBA,MAAa,eAAe,UAA4B;CACtD,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,OAAW,OAAZ;EACE,kBAAe;EACf,WAAW,qBACT;GACE;GACA;GACA;GACA;GACA;EACF,GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,YAAY,cAAc"}

package/dist/components/overlays/drawer/drawer-footer.js

@@ -18,10 +18,9 @@ const DrawerFooter = (props) => {
 			"justify-end",
 			"gap-2",
 			"px-(--drawer-padding)",
-			"pt-4",
+			"pt-2",
 			"pb-(--drawer-padding)",
-			"first:pt-(--drawer-padding)",
-			"[[data-component='Drawer.Header']+&]:pt-2"
+			"first:pt-(--drawer-padding)"
 		], className)
 	};
 	return useRender({

package/dist/components/overlays/drawer/drawer-footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer-footer.js","names":[],"sources":["../../../../src/components/overlays/drawer/drawer-footer.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type DrawerFooterProps = useRender.ComponentProps<'div'>;\n\n/**\n * Linha de ações na base do drawer, alinhadas à direita. Num drawer lateral, fica no pé da tela,\n * porque o `Body` ocupa o espaço que sobra.\n *\n * Cópia de `DialogFooter`, com o respiro em `--drawer-padding` (tabela no README de\n * `overlays`); o mecanismo está explicado lá.\n */\nexport const DrawerFooter = (props: DrawerFooterProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'Drawer.Footer',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'items-center',\n        'justify-end',\n        'gap-2',\n\n        'px-(--drawer-padding)',\n        'pt-4',\n        'pb-(--drawer-padding)',\n        // Abrindo o drawer, fecha o respiro de cima; logo depois do `Header`, completa os 16px\n        // dele até os 24px, sem somar os dois.\n        'first:pt-(--drawer-padding)',\n        \"[[data-component='Drawer.Header']+&]:pt-2\",\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nDrawerFooter.displayName = 'Drawer.Footer';\n"],"mappings":";;;;;;;;;;AAYA,MAAa,gBAAgB,UAA6B;CACxD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GACA;GAEA;GACA;GACA;GAGA;GACA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,aAAa,cAAc"}
+{"version":3,"file":"drawer-footer.js","names":[],"sources":["../../../../src/components/overlays/drawer/drawer-footer.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type DrawerFooterProps = useRender.ComponentProps<'div'>;\n\n/**\n * Linha de ações na base do drawer, alinhadas à direita. Num drawer lateral, fica no pé da tela,\n * porque o `Body` ocupa o espaço que sobra.\n *\n * Cópia de `DialogFooter`, com o respiro em `--drawer-padding` (tabela no README de\n * `overlays`); o mecanismo está explicado lá.\n */\nexport const DrawerFooter = (props: DrawerFooterProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'Drawer.Footer',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'items-center',\n        'justify-end',\n        'gap-2',\n\n        'px-(--drawer-padding)',\n        'pt-2',\n        'pb-(--drawer-padding)',\n        // Abrindo o drawer, fecha o respiro de cima.\n        'first:pt-(--drawer-padding)',\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nDrawerFooter.displayName = 'Drawer.Footer';\n"],"mappings":";;;;;;;;;;AAYA,MAAa,gBAAgB,UAA6B;CACxD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GACA;GAEA;GACA;GACA;GAEA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,aAAa,cAAc"}

package/dist/components/overlays/drawer/drawer-header.js

@@ -17,7 +17,7 @@ const DrawerHeader = (props) => {
 			"gap-0.5",
 			"px-(--drawer-padding)",
 			"pt-(--drawer-padding)",
-			"pb-4",
+			"pb-2",
 			"[&:not(:has(~[data-component='Drawer.Body'],~[data-component='Drawer.Footer']))]:pb-(--drawer-padding)"
 		], className)
 	};

package/dist/components/overlays/drawer/drawer-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer-header.js","names":[],"sources":["../../../../src/components/overlays/drawer/drawer-header.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type DrawerHeaderProps = useRender.ComponentProps<'div'>;\n\n/**\n * Topo do drawer, onde ficam título e descrição.\n *\n * Cópia de `DialogHeader`, com o respiro em `--drawer-padding` (tabela no README de\n * `overlays`); o mecanismo está explicado lá.\n */\nexport const DrawerHeader = (props: DrawerHeaderProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'Drawer.Header',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'flex-col',\n        'gap-0.5',\n\n        'px-(--drawer-padding)',\n        'pt-(--drawer-padding)',\n        'pb-4',\n        // Sem `Body` nem `Footer` depois, fecha o respiro do drawer embaixo. Por irmão, e não por\n        // `last:`, porque um `Close` pode vir depois.\n        \"[&:not(:has(~[data-component='Drawer.Body'],~[data-component='Drawer.Footer']))]:pb-(--drawer-padding)\",\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nDrawerHeader.displayName = 'Drawer.Header';\n"],"mappings":";;;;;;;;;AAWA,MAAa,gBAAgB,UAA6B;CACxD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GAEA;GACA;GACA;GAGA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,aAAa,cAAc"}
+{"version":3,"file":"drawer-header.js","names":[],"sources":["../../../../src/components/overlays/drawer/drawer-header.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type DrawerHeaderProps = useRender.ComponentProps<'div'>;\n\n/**\n * Topo do drawer, onde ficam título e descrição.\n *\n * Cópia de `DialogHeader`, com o respiro em `--drawer-padding` (tabela no README de\n * `overlays`); o mecanismo está explicado lá.\n */\nexport const DrawerHeader = (props: DrawerHeaderProps) => {\n  const { render, className, ...rest } = props;\n\n  const baseProps = {\n    'data-component': 'Drawer.Header',\n    className: mergeTwClassNames(\n      [\n        'flex',\n        'flex-col',\n        'gap-0.5',\n\n        'px-(--drawer-padding)',\n        'pt-(--drawer-padding)',\n        'pb-2',\n        // Sem `Body` nem `Footer` depois, fecha o respiro do drawer embaixo. Por irmão, e não por\n        // `last:`, porque um `Close` pode vir depois.\n        \"[&:not(:has(~[data-component='Drawer.Body'],~[data-component='Drawer.Footer']))]:pb-(--drawer-padding)\",\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nDrawerHeader.displayName = 'Drawer.Header';\n"],"mappings":";;;;;;;;;AAWA,MAAa,gBAAgB,UAA6B;CACxD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GACE;GACA;GACA;GAEA;GACA;GACA;GAGA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,aAAa,cAAc"}

package/dist/components/overlays/drawer/drawer-popup-variants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"drawer-popup-variants.d.ts","names":[],"sources":["../../../../src/components/overlays/drawer/drawer-popup-variants.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;qBA4Ba,sBAAmB;;;6CAuI/B"}
+{"version":3,"file":"drawer-popup-variants.d.ts","names":[],"sources":["../../../../src/components/overlays/drawer/drawer-popup-variants.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;qBA4Ba,sBAAmB;;;6CAkI/B"}

package/dist/components/overlays/drawer/drawer-popup-variants.js

@@ -27,7 +27,7 @@ import { cva } from "class-variance-authority";
 * inteiro.
 */
 const drawerPopupVariants = cva([
-	"[--drawer-padding:--spacing(6)]",
+	"[--drawer-padding:--spacing(4)]",
 	"[--drawer-peek:--spacing(6)]",
 	"relative",
 	"flex",
@@ -35,7 +35,6 @@ const drawerPopupVariants = cva([
 	"w-full",
 	"outline-1",
 	"outline-gray-6",
-	"corner-squircle",
 	"bg-white",
 	"dark:bg-gray-2",
 	"shadow-lg",
@@ -63,7 +62,6 @@ const drawerPopupVariants = cva([
 			right: [
 				"h-full",
 				"max-w-(--drawer-size)",
-				"rounded-l-lg",
 				"origin-left",
 				"translate-x-[calc(var(--drawer-swipe-movement-x,0px)-var(--nested-drawers,0)*var(--drawer-peek))]",
 				"data-starting-style:translate-x-full",
@@ -75,7 +73,6 @@ const drawerPopupVariants = cva([
 			left: [
 				"h-full",
 				"max-w-(--drawer-size)",
-				"rounded-r-lg",
 				"origin-right",
 				"translate-x-[calc(var(--drawer-swipe-movement-x,0px)+var(--nested-drawers,0)*var(--drawer-peek))]",
 				"data-starting-style:-translate-x-full",
@@ -86,7 +83,6 @@ const drawerPopupVariants = cva([
 			],
 			top: [
 				"max-h-[85dvh]",
-				"rounded-b-lg",
 				"origin-bottom",
 				"translate-y-[calc(var(--drawer-swipe-movement-y,0px)+var(--nested-drawers,0)*var(--drawer-peek))]",
 				"data-starting-style:-translate-y-full",
@@ -97,7 +93,6 @@ const drawerPopupVariants = cva([
 			],
 			bottom: [
 				"max-h-[85dvh]",
-				"rounded-t-lg",
 				"origin-top",
 				"translate-y-[calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y,0px)-var(--nested-drawers,0)*var(--drawer-peek))]",
 				"pb-[max(0px,calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y,0px)))]",

package/dist/components/overlays/drawer/drawer-popup-variants.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer-popup-variants.js","names":[],"sources":["../../../../src/components/overlays/drawer/drawer-popup-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { drawerDefaultVariants } from './use-drawer-context';\n\n/**\n * Cópia de `dialogPopupVariants`, a superfície e o respiro de uma janela modal (tabela no README\n * de `overlays`). As diferenças:\n * - preso à borda do `side`, sem arredondar o lado da borda; nos lados, ocupa a altura da tela e\n *   tem a largura do `size` (em `--drawer-size`); em cima e embaixo, a altura do conteúdo até 85%\n *   da tela;\n * - entra e sai deslizando da borda, em 400ms; a saída dura menos quanto mais forte o gesto\n *   (`--drawer-swipe-strength`), e durante o arrasto não há transição, para o popup seguir o dedo;\n * - o aninhamento, a folga e a alça, abaixo.\n *\n * O deslocamento soma as variáveis que o Base UI escreve: o arrasto (`--drawer-swipe-movement-x`\n * ou `-y`) e, embaixo, o snap point (`--drawer-snap-point-offset`). Embaixo, o `padding-bottom`\n * cresce junto com o deslocamento, para o fim do conteúdo ficar na parte visível do popup.\n *\n * Folga: arrastando para dentro, o popup se afasta da borda. O `::after`, da cor do popup, se\n * estende 3rem além da borda e cobre o vão.\n *\n * Aninhamento: com outro drawer aberto à frente, o de trás recua 24px por nível\n * (`--nested-drawers`) para dentro da tela, encolhe 5% e escurece por `brightness`, já que o\n * `::after` está ocupado pela folga. O encolhimento parte da borda de dentro, para os 24px\n * aparecerem inteiros; o vão que abre na borda da tela fica coberto pela folga.\n *\n * Embaixo, um `::before` desenha a alça no topo, que só indica o gesto: o arrasto vale no popup\n * inteiro.\n */\nexport const drawerPopupVariants = cva(\n  [\n    '[--drawer-padding:--spacing(6)]',\n    '[--drawer-peek:--spacing(6)]',\n\n    'relative',\n\n    'flex',\n    'flex-col',\n\n    'w-full',\n\n    'outline-1',\n    'outline-gray-6',\n    'corner-squircle',\n\n    'bg-white',\n    'dark:bg-gray-2',\n\n    'shadow-lg',\n    'shadow-black/12',\n    'dark:shadow-none',\n\n    // O popup vai para o `body` pelo portal: sem cor própria, o texto herdaria a do navegador.\n    'text-sm',\n    'text-gray-12',\n\n    \"after:content-['']\",\n    'after:absolute',\n    'after:bg-inherit',\n    'after:pointer-events-none',\n\n    'not-motion-reduced:transition-[translate,scale,filter]',\n    'not-motion-reduced:ease-enter-emphasized',\n    'not-motion-reduced:duration-400',\n    'not-motion-reduced:data-ending-style:ease-exit-emphasized',\n    'not-motion-reduced:data-ending-style:duration-[calc(var(--drawer-swipe-strength,1)*300ms)]',\n    'data-swiping:duration-0',\n    'data-nested-drawer-swiping:duration-0',\n    'data-swiping:select-none',\n\n    'data-nested-drawer-open:scale-[calc(1-0.05*var(--nested-drawers))]',\n    'data-nested-drawer-open:brightness-80',\n  ],\n  {\n    variants: {\n      side: {\n        right: [\n          'h-full',\n          'max-w-(--drawer-size)',\n          'rounded-l-lg',\n          'origin-left',\n\n          'translate-x-[calc(var(--drawer-swipe-movement-x,0px)-var(--nested-drawers,0)*var(--drawer-peek))]',\n          'data-starting-style:translate-x-full',\n          'data-ending-style:translate-x-full',\n\n          'after:inset-y-0',\n          'after:left-full',\n          'after:w-12',\n        ],\n        left: [\n          'h-full',\n          'max-w-(--drawer-size)',\n          'rounded-r-lg',\n          'origin-right',\n\n          'translate-x-[calc(var(--drawer-swipe-movement-x,0px)+var(--nested-drawers,0)*var(--drawer-peek))]',\n          'data-starting-style:-translate-x-full',\n          'data-ending-style:-translate-x-full',\n\n          'after:inset-y-0',\n          'after:right-full',\n          'after:w-12',\n        ],\n        top: [\n          'max-h-[85dvh]',\n          'rounded-b-lg',\n          'origin-bottom',\n\n          'translate-y-[calc(var(--drawer-swipe-movement-y,0px)+var(--nested-drawers,0)*var(--drawer-peek))]',\n          'data-starting-style:-translate-y-full',\n          'data-ending-style:-translate-y-full',\n\n          'after:inset-x-0',\n          'after:bottom-full',\n          'after:h-12',\n        ],\n        bottom: [\n          'max-h-[85dvh]',\n          'rounded-t-lg',\n          'origin-top',\n\n          'translate-y-[calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y,0px)-var(--nested-drawers,0)*var(--drawer-peek))]',\n          'pb-[max(0px,calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y,0px)))]',\n          'data-starting-style:translate-y-full',\n          'data-ending-style:translate-y-full',\n          'data-starting-style:pb-0',\n          'data-ending-style:pb-0',\n\n          'after:inset-x-0',\n          'after:top-full',\n          'after:h-12',\n\n          \"before:content-['']\",\n          'before:absolute',\n          'before:top-2',\n          'before:left-1/2',\n          'before:-translate-x-1/2',\n          'before:h-1',\n          'before:w-10',\n          'before:rounded-full',\n          'before:bg-gray-6',\n        ],\n      },\n      size: {\n        xs: ['[--drawer-size:var(--container-xs)]'],\n        sm: ['[--drawer-size:var(--container-sm)]'],\n        md: ['[--drawer-size:var(--container-md)]'],\n        lg: ['[--drawer-size:var(--container-lg)]'],\n        xl: ['[--drawer-size:var(--container-xl)]'],\n        '2xl': ['[--drawer-size:var(--container-2xl)]'],\n        '3xl': ['[--drawer-size:var(--container-3xl)]'],\n        '4xl': ['[--drawer-size:var(--container-4xl)]'],\n        '5xl': ['[--drawer-size:var(--container-5xl)]'],\n        '6xl': ['[--drawer-size:var(--container-6xl)]'],\n        '7xl': ['[--drawer-size:var(--container-7xl)]'],\n        full: ['[--drawer-size:100%]'],\n      },\n    },\n    defaultVariants: {\n      side: drawerDefaultVariants.side,\n      size: drawerDefaultVariants.size,\n    },\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAa,sBAAsB,IACjC;CACE;CACA;CAEA;CAEA;CACA;CAEA;CAEA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CAGA;CACA;CAEA;CACA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;AACF,GACA;CACE,UAAU;EACR,MAAM;GACJ,OAAO;IACL;IACA;IACA;IACA;IAEA;IACA;IACA;IAEA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IAEA;IACA;IACA;IAEA;IACA;IACA;GACF;GACA,KAAK;IACH;IACA;IACA;IAEA;IACA;IACA;IAEA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IAEA;IACA;IACA;IACA;IACA;IACA;IAEA;IACA;IACA;IAEA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;EACF;EACA,MAAM;GACJ,IAAI,CAAC,qCAAqC;GAC1C,IAAI,CAAC,qCAAqC;GAC1C,IAAI,CAAC,qCAAqC;GAC1C,IAAI,CAAC,qCAAqC;GAC1C,IAAI,CAAC,qCAAqC;GAC1C,OAAO,CAAC,sCAAsC;GAC9C,OAAO,CAAC,sCAAsC;GAC9C,OAAO,CAAC,sCAAsC;GAC9C,OAAO,CAAC,sCAAsC;GAC9C,OAAO,CAAC,sCAAsC;GAC9C,OAAO,CAAC,sCAAsC;GAC9C,MAAM,CAAC,sBAAsB;EAC/B;CACF;CACA,iBAAiB;EACf,MAAM,sBAAsB;EAC5B,MAAM,sBAAsB;CAC9B;AACF,CACF"}
+{"version":3,"file":"drawer-popup-variants.js","names":[],"sources":["../../../../src/components/overlays/drawer/drawer-popup-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { drawerDefaultVariants } from './use-drawer-context';\n\n/**\n * Cópia de `dialogPopupVariants`, a superfície e o respiro de uma janela modal (tabela no README\n * de `overlays`). As diferenças:\n * - preso à borda do `side`, sem arredondar o lado da borda; nos lados, ocupa a altura da tela e\n *   tem a largura do `size` (em `--drawer-size`); em cima e embaixo, a altura do conteúdo até 85%\n *   da tela;\n * - entra e sai deslizando da borda, em 400ms; a saída dura menos quanto mais forte o gesto\n *   (`--drawer-swipe-strength`), e durante o arrasto não há transição, para o popup seguir o dedo;\n * - o aninhamento, a folga e a alça, abaixo.\n *\n * O deslocamento soma as variáveis que o Base UI escreve: o arrasto (`--drawer-swipe-movement-x`\n * ou `-y`) e, embaixo, o snap point (`--drawer-snap-point-offset`). Embaixo, o `padding-bottom`\n * cresce junto com o deslocamento, para o fim do conteúdo ficar na parte visível do popup.\n *\n * Folga: arrastando para dentro, o popup se afasta da borda. O `::after`, da cor do popup, se\n * estende 3rem além da borda e cobre o vão.\n *\n * Aninhamento: com outro drawer aberto à frente, o de trás recua 24px por nível\n * (`--nested-drawers`) para dentro da tela, encolhe 5% e escurece por `brightness`, já que o\n * `::after` está ocupado pela folga. O encolhimento parte da borda de dentro, para os 24px\n * aparecerem inteiros; o vão que abre na borda da tela fica coberto pela folga.\n *\n * Embaixo, um `::before` desenha a alça no topo, que só indica o gesto: o arrasto vale no popup\n * inteiro.\n */\nexport const drawerPopupVariants = cva(\n  [\n    '[--drawer-padding:--spacing(4)]',\n    '[--drawer-peek:--spacing(6)]',\n\n    'relative',\n\n    'flex',\n    'flex-col',\n\n    'w-full',\n\n    'outline-1',\n    'outline-gray-6',\n\n    'bg-white',\n    'dark:bg-gray-2',\n\n    'shadow-lg',\n    'shadow-black/12',\n    'dark:shadow-none',\n\n    // O popup vai para o `body` pelo portal: sem cor própria, o texto herdaria a do navegador.\n    'text-sm',\n    'text-gray-12',\n\n    \"after:content-['']\",\n    'after:absolute',\n    'after:bg-inherit',\n    'after:pointer-events-none',\n\n    'not-motion-reduced:transition-[translate,scale,filter]',\n    'not-motion-reduced:ease-enter-emphasized',\n    'not-motion-reduced:duration-400',\n    'not-motion-reduced:data-ending-style:ease-exit-emphasized',\n    'not-motion-reduced:data-ending-style:duration-[calc(var(--drawer-swipe-strength,1)*300ms)]',\n    'data-swiping:duration-0',\n    'data-nested-drawer-swiping:duration-0',\n    'data-swiping:select-none',\n\n    'data-nested-drawer-open:scale-[calc(1-0.05*var(--nested-drawers))]',\n    'data-nested-drawer-open:brightness-80',\n  ],\n  {\n    variants: {\n      side: {\n        right: [\n          'h-full',\n          'max-w-(--drawer-size)',\n          'origin-left',\n\n          'translate-x-[calc(var(--drawer-swipe-movement-x,0px)-var(--nested-drawers,0)*var(--drawer-peek))]',\n          'data-starting-style:translate-x-full',\n          'data-ending-style:translate-x-full',\n\n          'after:inset-y-0',\n          'after:left-full',\n          'after:w-12',\n        ],\n        left: [\n          'h-full',\n          'max-w-(--drawer-size)',\n          'origin-right',\n\n          'translate-x-[calc(var(--drawer-swipe-movement-x,0px)+var(--nested-drawers,0)*var(--drawer-peek))]',\n          'data-starting-style:-translate-x-full',\n          'data-ending-style:-translate-x-full',\n\n          'after:inset-y-0',\n          'after:right-full',\n          'after:w-12',\n        ],\n        top: [\n          'max-h-[85dvh]',\n          'origin-bottom',\n\n          'translate-y-[calc(var(--drawer-swipe-movement-y,0px)+var(--nested-drawers,0)*var(--drawer-peek))]',\n          'data-starting-style:-translate-y-full',\n          'data-ending-style:-translate-y-full',\n\n          'after:inset-x-0',\n          'after:bottom-full',\n          'after:h-12',\n        ],\n        bottom: [\n          'max-h-[85dvh]',\n          'origin-top',\n\n          'translate-y-[calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y,0px)-var(--nested-drawers,0)*var(--drawer-peek))]',\n          'pb-[max(0px,calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y,0px)))]',\n          'data-starting-style:translate-y-full',\n          'data-ending-style:translate-y-full',\n          'data-starting-style:pb-0',\n          'data-ending-style:pb-0',\n\n          'after:inset-x-0',\n          'after:top-full',\n          'after:h-12',\n\n          \"before:content-['']\",\n          'before:absolute',\n          'before:top-2',\n          'before:left-1/2',\n          'before:-translate-x-1/2',\n          'before:h-1',\n          'before:w-10',\n          'before:rounded-full',\n          'before:bg-gray-6',\n        ],\n      },\n      size: {\n        xs: ['[--drawer-size:var(--container-xs)]'],\n        sm: ['[--drawer-size:var(--container-sm)]'],\n        md: ['[--drawer-size:var(--container-md)]'],\n        lg: ['[--drawer-size:var(--container-lg)]'],\n        xl: ['[--drawer-size:var(--container-xl)]'],\n        '2xl': ['[--drawer-size:var(--container-2xl)]'],\n        '3xl': ['[--drawer-size:var(--container-3xl)]'],\n        '4xl': ['[--drawer-size:var(--container-4xl)]'],\n        '5xl': ['[--drawer-size:var(--container-5xl)]'],\n        '6xl': ['[--drawer-size:var(--container-6xl)]'],\n        '7xl': ['[--drawer-size:var(--container-7xl)]'],\n        full: ['[--drawer-size:100%]'],\n      },\n    },\n    defaultVariants: {\n      side: drawerDefaultVariants.side,\n      size: drawerDefaultVariants.size,\n    },\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAa,sBAAsB,IACjC;CACE;CACA;CAEA;CAEA;CACA;CAEA;CAEA;CACA;CAEA;CACA;CAEA;CACA;CACA;CAGA;CACA;CAEA;CACA;CACA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;AACF,GACA;CACE,UAAU;EACR,MAAM;GACJ,OAAO;IACL;IACA;IACA;IAEA;IACA;IACA;IAEA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IAEA;IACA;IACA;IAEA;IACA;IACA;GACF;GACA,KAAK;IACH;IACA;IAEA;IACA;IACA;IAEA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IAEA;IACA;IACA;IACA;IACA;IACA;IAEA;IACA;IACA;IAEA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;EACF;EACA,MAAM;GACJ,IAAI,CAAC,qCAAqC;GAC1C,IAAI,CAAC,qCAAqC;GAC1C,IAAI,CAAC,qCAAqC;GAC1C,IAAI,CAAC,qCAAqC;GAC1C,IAAI,CAAC,qCAAqC;GAC1C,OAAO,CAAC,sCAAsC;GAC9C,OAAO,CAAC,sCAAsC;GAC9C,OAAO,CAAC,sCAAsC;GAC9C,OAAO,CAAC,sCAAsC;GAC9C,OAAO,CAAC,sCAAsC;GAC9C,OAAO,CAAC,sCAAsC;GAC9C,MAAM,CAAC,sBAAsB;EAC/B;CACF;CACA,iBAAiB;EACf,MAAM,sBAAsB;EAC5B,MAAM,sBAAsB;CAC9B;AACF,CACF"}

package/dist/components/overlays/drawer/drawer-title.js

@@ -13,9 +13,9 @@ const DrawerTitle = (props) => {
 	return /* @__PURE__ */ jsx(Drawer.Title, {
 		"data-component": "Drawer.Title",
 		className: mergeStateClassNames([
-			"text-lg",
+			"text-base",
 			"leading-6",
-			"font-semibold",
+			"font-medium",
 			"text-gray-12",
 			"text-balance"
 		], className),

package/dist/components/overlays/drawer/drawer-title.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer-title.js","names":["BaseDrawer"],"sources":["../../../../src/components/overlays/drawer/drawer-title.tsx"],"sourcesContent":["import { Drawer as BaseDrawer } from '@base-ui/react/drawer';\nimport { mergeStateClassNames } from '#utils';\n\nexport type DrawerTitleProps = BaseDrawer.Title.Props;\n\nexport type DrawerTitleState = BaseDrawer.Title.State;\n\n/**\n * Título do drawer, um `h2` ligado ao popup por `aria-labelledby`.\n *\n * Cópia de `DialogTitle`, sem diferenças (tabela no README de `overlays`); o mecanismo está\n * explicado lá.\n */\nexport const DrawerTitle = (props: DrawerTitleProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseDrawer.Title\n      data-component=\"Drawer.Title\"\n      className={mergeStateClassNames(\n        [\n          'text-lg',\n          'leading-6',\n          'font-semibold',\n          'text-gray-12',\n          'text-balance',\n        ],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nDrawerTitle.displayName = 'Drawer.Title';\n"],"mappings":";;;;;;;;;;AAaA,MAAa,eAAe,UAA4B;CACtD,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,OAAW,OAAZ;EACE,kBAAe;EACf,WAAW,qBACT;GACE;GACA;GACA;GACA;GACA;EACF,GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,YAAY,cAAc"}
+{"version":3,"file":"drawer-title.js","names":["BaseDrawer"],"sources":["../../../../src/components/overlays/drawer/drawer-title.tsx"],"sourcesContent":["import { Drawer as BaseDrawer } from '@base-ui/react/drawer';\nimport { mergeStateClassNames } from '#utils';\n\nexport type DrawerTitleProps = BaseDrawer.Title.Props;\n\nexport type DrawerTitleState = BaseDrawer.Title.State;\n\n/**\n * Título do drawer, um `h2` ligado ao popup por `aria-labelledby`.\n *\n * Cópia de `DialogTitle`, sem diferenças (tabela no README de `overlays`); o mecanismo está\n * explicado lá.\n */\nexport const DrawerTitle = (props: DrawerTitleProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseDrawer.Title\n      data-component=\"Drawer.Title\"\n      className={mergeStateClassNames(\n        [\n          'text-base',\n          'leading-6',\n          'font-medium',\n          'text-gray-12',\n          'text-balance',\n        ],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nDrawerTitle.displayName = 'Drawer.Title';\n"],"mappings":";;;;;;;;;;AAaA,MAAa,eAAe,UAA4B;CACtD,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,OAAW,OAAZ;EACE,kBAAe;EACf,WAAW,qBACT;GACE;GACA;GACA;GACA;GACA;EACF,GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,YAAY,cAAc"}