@lucasbernardosn/react-ui 0.1.0 → 0.3.0

package/dist/components/display/avatar/get-avatar-color-scheme.js

@@ -0,0 +1,45 @@
+//#region src/components/display/avatar/get-avatar-color-scheme.ts
+/** As escalas que a cor automática sorteia: todas as do tema menos o gray, que fica sem nome. */
+const NAME_COLOR_SCHEMES = [
+	"bronze",
+	"gold",
+	"brown",
+	"orange",
+	"tomato",
+	"red",
+	"ruby",
+	"crimson",
+	"pink",
+	"plum",
+	"purple",
+	"violet",
+	"iris",
+	"indigo",
+	"blue",
+	"cyan",
+	"teal",
+	"jade",
+	"green",
+	"grass",
+	"lime",
+	"mint",
+	"sky",
+	"yellow",
+	"amber"
+];
+const WORD_SEPARATOR = /\s+/g;
+/**
+* Cor do avatar a partir do nome, sempre a mesma para o mesmo nome. O nome é normalizado
+* (espaços e maiúsculas) antes do hash, para "Ana Souza" e "ana  souza" caírem na mesma cor; sem
+* nome, gray.
+*/
+const getAvatarColorScheme = (name) => {
+	const normalizedName = (name ?? "").trim().replace(WORD_SEPARATOR, " ").toLowerCase();
+	if (normalizedName === "") return "gray";
+	const hash = Array.from(normalizedName).reduce((current, character) => (current * 31 + (character.codePointAt(0) ?? 0)) % 2147483647, 0);
+	return NAME_COLOR_SCHEMES[hash % NAME_COLOR_SCHEMES.length] ?? "gray";
+};
+//#endregion
+export { getAvatarColorScheme };
+
+//# sourceMappingURL=get-avatar-color-scheme.js.map

package/dist/components/display/avatar/get-avatar-color-scheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"get-avatar-color-scheme.js","names":[],"sources":["../../../../src/components/display/avatar/get-avatar-color-scheme.ts"],"sourcesContent":["import type { ColorSchemeFull } from '#types';\n\n/** As escalas que a cor automática sorteia: todas as do tema menos o gray, que fica sem nome. */\nconst NAME_COLOR_SCHEMES: ColorSchemeFull[] = [\n  'bronze',\n  'gold',\n  'brown',\n  'orange',\n  'tomato',\n  'red',\n  'ruby',\n  'crimson',\n  'pink',\n  'plum',\n  'purple',\n  'violet',\n  'iris',\n  'indigo',\n  'blue',\n  'cyan',\n  'teal',\n  'jade',\n  'green',\n  'grass',\n  'lime',\n  'mint',\n  'sky',\n  'yellow',\n  'amber',\n];\n\nconst WORD_SEPARATOR = /\\s+/g;\n\n/**\n * Cor do avatar a partir do nome, sempre a mesma para o mesmo nome. O nome é normalizado\n * (espaços e maiúsculas) antes do hash, para \"Ana Souza\" e \"ana  souza\" caírem na mesma cor; sem\n * nome, gray.\n */\nexport const getAvatarColorScheme = (\n  name: string | undefined,\n): ColorSchemeFull => {\n  const normalizedName = (name ?? '')\n    .trim()\n    .replace(WORD_SEPARATOR, ' ')\n    .toLowerCase();\n\n  if (normalizedName === '') {\n    return 'gray';\n  }\n\n  const hash = Array.from(normalizedName).reduce(\n    (current, character) =>\n      (current * 31 + (character.codePointAt(0) ?? 0)) % 2_147_483_647,\n    0,\n  );\n\n  return NAME_COLOR_SCHEMES[hash % NAME_COLOR_SCHEMES.length] ?? 'gray';\n};\n"],"mappings":";;AAGA,MAAM,qBAAwC;CAC5C;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,iBAAiB;;;;;;AAOvB,MAAa,wBACX,SACoB;CACpB,MAAM,kBAAkB,QAAQ,GAAA,CAC7B,KAAK,CAAC,CACN,QAAQ,gBAAgB,GAAG,CAAC,CAC5B,YAAY;CAEf,IAAI,mBAAmB,IACrB,OAAO;CAGT,MAAM,OAAO,MAAM,KAAK,cAAc,CAAC,CAAC,QACrC,SAAS,eACP,UAAU,MAAM,UAAU,YAAY,CAAC,KAAK,MAAM,YACrD,CACF;CAEA,OAAO,mBAAmB,OAAO,mBAAmB,WAAW;AACjE"}

package/dist/components/display/avatar/index.d.ts

@@ -0,0 +1,2 @@
+import { index_parts_d_exports } from "./index.parts.js";
+export { index_parts_d_exports as Avatar };

package/dist/components/display/avatar/index.js

@@ -0,0 +1,2 @@
+import { index_parts_exports } from "./index.parts.js";
+export { index_parts_exports as Avatar };

package/dist/components/display/avatar/index.parts.d.ts

@@ -0,0 +1,10 @@
+import { AvatarFallback, AvatarFallbackProps, AvatarFallbackState } from "./avatar-fallback.js";
+import { AvatarImage, AvatarImageProps, AvatarImageState } from "./avatar-image.js";
+import { AvatarRootVariants } from "./avatar-root-variants.js";
+import { AvatarRoot, AvatarRootProps, AvatarRootState } from "./avatar-root.js";
+declare namespace index_parts_d_exports {
+  export { AvatarFallback as Fallback, AvatarFallbackProps as FallbackProps, AvatarFallbackState as FallbackState, AvatarImage as Image, AvatarImageProps as ImageProps, AvatarImageState as ImageState, AvatarRoot as Root, AvatarRootProps as RootProps, AvatarRootState as RootState, AvatarRootVariants as RootVariants };
+}
+//#endregion
+export { AvatarFallback as Fallback, type AvatarFallbackProps as FallbackProps, type AvatarFallbackState as FallbackState, AvatarImage as Image, type AvatarImageProps as ImageProps, type AvatarImageState as ImageState, AvatarRoot as Root, type AvatarRootProps as RootProps, type AvatarRootState as RootState, type AvatarRootVariants as RootVariants, index_parts_d_exports };
+//# sourceMappingURL=index.parts.d.ts.map

package/dist/components/display/avatar/index.parts.js

@@ -0,0 +1,14 @@
+import { __exportAll } from "../../../_virtual/_rolldown/runtime.js";
+import { AvatarFallback } from "./avatar-fallback.js";
+import { AvatarImage } from "./avatar-image.js";
+import { AvatarRoot } from "./avatar-root.js";
+//#region src/components/display/avatar/index.parts.ts
+var index_parts_exports = /* @__PURE__ */ __exportAll({
+	Fallback: () => AvatarFallback,
+	Image: () => AvatarImage,
+	Root: () => AvatarRoot
+});
+//#endregion
+export { AvatarFallback as Fallback, AvatarImage as Image, AvatarRoot as Root, index_parts_exports };
+
+//# sourceMappingURL=index.parts.js.map

package/dist/components/display/avatar/index.parts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/components/display/avatar/index.parts.ts"],"sourcesContent":["export { AvatarFallback as Fallback } from './avatar-fallback';\nexport { AvatarImage as Image } from './avatar-image';\nexport { AvatarRoot as Root } from './avatar-root';\n\n/* types */\n\nexport type {\n  AvatarFallbackProps as FallbackProps,\n  AvatarFallbackState as FallbackState,\n} from './avatar-fallback';\nexport type {\n  AvatarImageProps as ImageProps,\n  AvatarImageState as ImageState,\n} from './avatar-image';\nexport type {\n  AvatarRootProps as RootProps,\n  AvatarRootState as RootState,\n} from './avatar-root';\nexport type { AvatarRootVariants as RootVariants } from './avatar-root-variants';\n"],"mappings":""}

package/dist/components/display/avatar/use-avatar-context.d.ts

@@ -0,0 +1,8 @@
+//#region src/components/display/avatar/use-avatar-context.d.ts
+export type AvatarContextValue = {
+  /** O `name` do `Avatar.Root`, de onde o `Avatar.Fallback` tira as iniciais. */
+  name: string | undefined;
+};
+export declare const AvatarContextProvider: import("react").Provider<AvatarContextValue>, useAvatarContext: () => AvatarContextValue;
+//#endregion
+//# sourceMappingURL=use-avatar-context.d.ts.map

package/dist/components/display/avatar/use-avatar-context.js

@@ -0,0 +1,10 @@
+import { createContext } from "@lucasbernardosn/react-utils";
+//#region src/components/display/avatar/use-avatar-context.ts
+const [AvatarContextProvider, useAvatarContext] = createContext({
+	name: "AvatarContext",
+	providers: ["Avatar.Root"]
+});
+//#endregion
+export { AvatarContextProvider, useAvatarContext };
+
+//# sourceMappingURL=use-avatar-context.js.map

package/dist/components/display/avatar/use-avatar-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-avatar-context.js","names":[],"sources":["../../../../src/components/display/avatar/use-avatar-context.ts"],"sourcesContent":["import { createContext } from '@lucasbernardosn/react-utils';\n\nexport type AvatarContextValue = {\n  /** O `name` do `Avatar.Root`, de onde o `Avatar.Fallback` tira as iniciais. */\n  name: string | undefined;\n};\n\nexport const [AvatarContextProvider, useAvatarContext] =\n  createContext<AvatarContextValue>({\n    name: 'AvatarContext',\n    providers: ['Avatar.Root'],\n  });\n"],"mappings":";;AAOA,MAAa,CAAC,uBAAuB,oBACnC,cAAkC;CAChC,MAAM;CACN,WAAW,CAAC,aAAa;AAC3B,CAAC"}

package/dist/components/display/badge/badge-variants.d.ts

@@ -0,0 +1,41 @@
+import { ColorSchemeFull } from "../../../types/color-scheme.js";
+//#region src/components/display/badge/badge-variants.d.ts
+export type BadgeVariants = {
+  /**
+   * Cor do texto, do fundo e da borda, entre todas as escalas do tema: para categorias, há
+   * variedade; para estado, `red`, `green`, `amber` e `blue`.
+   *
+   * @default 'gray'
+   */
+  colorScheme?: ColorSchemeFull;
+  /**
+   * Altura, padding, tamanho do texto e do ícone: `sm` = `h-5`, `md` = `h-6`, `lg` = `h-7`.
+   *
+   * @default 'sm'
+   */
+  size?: 'sm' | 'md' | 'lg';
+  /**
+   * Fundo e borda: `subtle` só com fundo, `surface` com fundo e borda, `outline` só com borda e
+   * `solid` com o fundo cheio (passo 9) e o texto em contraste.
+   *
+   * @default 'subtle'
+   */
+  variant?: 'subtle' | 'surface' | 'outline' | 'solid';
+};
+export declare const badgeDefaultVariants: Required<BadgeVariants>;
+/**
+ * Origem do visual do rótulo curto, copiado pela `Tag` (tabela no README de `display`).
+ *
+ * O `colorScheme` só declara as variáveis `--badge-*`, e a `variant` decide onde cada uma entra.
+ * Assim uma cor nova é um bloco de variáveis, sem um bloco por combinação de cor e `variant`. O
+ * fundo e a borda usam a escala alpha, para o badge funcionar sobre qualquer fundo. No `solid`, o
+ * texto é branco, menos em amber, yellow, sky, mint e lime, claros demais para ele, que levam
+ * preto; o gray sólido é preto no tema claro e branco no escuro, como o do `Button`.
+ */
+export declare const badgeVariants: (props?: ({
+  colorScheme?: "ruby" | "gray" | "brand" | "red" | "green" | "blue" | "teal" | "pink" | "purple" | "cyan" | "orange" | "brown" | "yellow" | "amber" | "bronze" | "gold" | "tomato" | "crimson" | "plum" | "violet" | "iris" | "indigo" | "jade" | "grass" | "lime" | "mint" | "sky" | null | undefined;
+  size?: "sm" | "md" | "lg" | null | undefined;
+  variant?: "solid" | "subtle" | "surface" | "outline" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+//#endregion
+//# sourceMappingURL=badge-variants.d.ts.map

package/dist/components/display/badge/badge-variants.js

@@ -0,0 +1,330 @@
+import { cva } from "class-variance-authority";
+//#region src/components/display/badge/badge-variants.ts
+const badgeDefaultVariants = {
+	colorScheme: "gray",
+	size: "sm",
+	variant: "subtle"
+};
+/**
+* Origem do visual do rótulo curto, copiado pela `Tag` (tabela no README de `display`).
+*
+* O `colorScheme` só declara as variáveis `--badge-*`, e a `variant` decide onde cada uma entra.
+* Assim uma cor nova é um bloco de variáveis, sem um bloco por combinação de cor e `variant`. O
+* fundo e a borda usam a escala alpha, para o badge funcionar sobre qualquer fundo. No `solid`, o
+* texto é branco, menos em amber, yellow, sky, mint e lime, claros demais para ele, que levam
+* preto; o gray sólido é preto no tema claro e branco no escuro, como o do `Button`.
+*/
+const badgeVariants = cva([
+	"inline-flex",
+	"items-center",
+	"shrink-0",
+	"align-middle",
+	"border",
+	"rounded-sm",
+	"corner-squircle",
+	"font-medium",
+	"leading-none",
+	"whitespace-nowrap",
+	"tabular-nums",
+	"[&_svg]:shrink-0"
+], {
+	variants: {
+		colorScheme: {
+			gray: [
+				"[--badge-fg:var(--color-gray-11)]",
+				"[--badge-subtle-bg:var(--color-gray-alpha-3)]",
+				"[--badge-surface-bg:var(--color-gray-alpha-2)]",
+				"[--badge-surface-border:var(--color-gray-alpha-6)]",
+				"[--badge-outline-border:var(--color-gray-alpha-8)]",
+				"[--badge-solid-bg:var(--color-black)]",
+				"dark:[--badge-solid-bg:var(--color-white)]",
+				"[--badge-solid-fg:var(--color-white)]",
+				"dark:[--badge-solid-fg:var(--color-black)]"
+			],
+			brand: [
+				"[--badge-fg:var(--color-brand-11)]",
+				"[--badge-subtle-bg:var(--color-brand-alpha-3)]",
+				"[--badge-surface-bg:var(--color-brand-alpha-2)]",
+				"[--badge-surface-border:var(--color-brand-alpha-6)]",
+				"[--badge-outline-border:var(--color-brand-alpha-8)]",
+				"[--badge-solid-bg:var(--color-brand-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			red: [
+				"[--badge-fg:var(--color-red-11)]",
+				"[--badge-subtle-bg:var(--color-red-alpha-3)]",
+				"[--badge-surface-bg:var(--color-red-alpha-2)]",
+				"[--badge-surface-border:var(--color-red-alpha-6)]",
+				"[--badge-outline-border:var(--color-red-alpha-8)]",
+				"[--badge-solid-bg:var(--color-red-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			green: [
+				"[--badge-fg:var(--color-green-11)]",
+				"[--badge-subtle-bg:var(--color-green-alpha-3)]",
+				"[--badge-surface-bg:var(--color-green-alpha-2)]",
+				"[--badge-surface-border:var(--color-green-alpha-6)]",
+				"[--badge-outline-border:var(--color-green-alpha-8)]",
+				"[--badge-solid-bg:var(--color-green-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			blue: [
+				"[--badge-fg:var(--color-blue-11)]",
+				"[--badge-subtle-bg:var(--color-blue-alpha-3)]",
+				"[--badge-surface-bg:var(--color-blue-alpha-2)]",
+				"[--badge-surface-border:var(--color-blue-alpha-6)]",
+				"[--badge-outline-border:var(--color-blue-alpha-8)]",
+				"[--badge-solid-bg:var(--color-blue-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			amber: [
+				"[--badge-fg:var(--color-amber-11)]",
+				"[--badge-subtle-bg:var(--color-amber-alpha-3)]",
+				"[--badge-surface-bg:var(--color-amber-alpha-2)]",
+				"[--badge-surface-border:var(--color-amber-alpha-6)]",
+				"[--badge-outline-border:var(--color-amber-alpha-8)]",
+				"[--badge-solid-bg:var(--color-amber-9)]",
+				"[--badge-solid-fg:var(--color-black)]"
+			],
+			purple: [
+				"[--badge-fg:var(--color-purple-11)]",
+				"[--badge-subtle-bg:var(--color-purple-alpha-3)]",
+				"[--badge-surface-bg:var(--color-purple-alpha-2)]",
+				"[--badge-surface-border:var(--color-purple-alpha-6)]",
+				"[--badge-outline-border:var(--color-purple-alpha-8)]",
+				"[--badge-solid-bg:var(--color-purple-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			pink: [
+				"[--badge-fg:var(--color-pink-11)]",
+				"[--badge-subtle-bg:var(--color-pink-alpha-3)]",
+				"[--badge-surface-bg:var(--color-pink-alpha-2)]",
+				"[--badge-surface-border:var(--color-pink-alpha-6)]",
+				"[--badge-outline-border:var(--color-pink-alpha-8)]",
+				"[--badge-solid-bg:var(--color-pink-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			cyan: [
+				"[--badge-fg:var(--color-cyan-11)]",
+				"[--badge-subtle-bg:var(--color-cyan-alpha-3)]",
+				"[--badge-surface-bg:var(--color-cyan-alpha-2)]",
+				"[--badge-surface-border:var(--color-cyan-alpha-6)]",
+				"[--badge-outline-border:var(--color-cyan-alpha-8)]",
+				"[--badge-solid-bg:var(--color-cyan-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			teal: [
+				"[--badge-fg:var(--color-teal-11)]",
+				"[--badge-subtle-bg:var(--color-teal-alpha-3)]",
+				"[--badge-surface-bg:var(--color-teal-alpha-2)]",
+				"[--badge-surface-border:var(--color-teal-alpha-6)]",
+				"[--badge-outline-border:var(--color-teal-alpha-8)]",
+				"[--badge-solid-bg:var(--color-teal-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			orange: [
+				"[--badge-fg:var(--color-orange-11)]",
+				"[--badge-subtle-bg:var(--color-orange-alpha-3)]",
+				"[--badge-surface-bg:var(--color-orange-alpha-2)]",
+				"[--badge-surface-border:var(--color-orange-alpha-6)]",
+				"[--badge-outline-border:var(--color-orange-alpha-8)]",
+				"[--badge-solid-bg:var(--color-orange-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			brown: [
+				"[--badge-fg:var(--color-brown-11)]",
+				"[--badge-subtle-bg:var(--color-brown-alpha-3)]",
+				"[--badge-surface-bg:var(--color-brown-alpha-2)]",
+				"[--badge-surface-border:var(--color-brown-alpha-6)]",
+				"[--badge-outline-border:var(--color-brown-alpha-8)]",
+				"[--badge-solid-bg:var(--color-brown-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			yellow: [
+				"[--badge-fg:var(--color-yellow-11)]",
+				"[--badge-subtle-bg:var(--color-yellow-alpha-3)]",
+				"[--badge-surface-bg:var(--color-yellow-alpha-2)]",
+				"[--badge-surface-border:var(--color-yellow-alpha-6)]",
+				"[--badge-outline-border:var(--color-yellow-alpha-8)]",
+				"[--badge-solid-bg:var(--color-yellow-9)]",
+				"[--badge-solid-fg:var(--color-black)]"
+			],
+			bronze: [
+				"[--badge-fg:var(--color-bronze-11)]",
+				"[--badge-subtle-bg:var(--color-bronze-alpha-3)]",
+				"[--badge-surface-bg:var(--color-bronze-alpha-2)]",
+				"[--badge-surface-border:var(--color-bronze-alpha-6)]",
+				"[--badge-outline-border:var(--color-bronze-alpha-8)]",
+				"[--badge-solid-bg:var(--color-bronze-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			gold: [
+				"[--badge-fg:var(--color-gold-11)]",
+				"[--badge-subtle-bg:var(--color-gold-alpha-3)]",
+				"[--badge-surface-bg:var(--color-gold-alpha-2)]",
+				"[--badge-surface-border:var(--color-gold-alpha-6)]",
+				"[--badge-outline-border:var(--color-gold-alpha-8)]",
+				"[--badge-solid-bg:var(--color-gold-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			tomato: [
+				"[--badge-fg:var(--color-tomato-11)]",
+				"[--badge-subtle-bg:var(--color-tomato-alpha-3)]",
+				"[--badge-surface-bg:var(--color-tomato-alpha-2)]",
+				"[--badge-surface-border:var(--color-tomato-alpha-6)]",
+				"[--badge-outline-border:var(--color-tomato-alpha-8)]",
+				"[--badge-solid-bg:var(--color-tomato-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			ruby: [
+				"[--badge-fg:var(--color-ruby-11)]",
+				"[--badge-subtle-bg:var(--color-ruby-alpha-3)]",
+				"[--badge-surface-bg:var(--color-ruby-alpha-2)]",
+				"[--badge-surface-border:var(--color-ruby-alpha-6)]",
+				"[--badge-outline-border:var(--color-ruby-alpha-8)]",
+				"[--badge-solid-bg:var(--color-ruby-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			crimson: [
+				"[--badge-fg:var(--color-crimson-11)]",
+				"[--badge-subtle-bg:var(--color-crimson-alpha-3)]",
+				"[--badge-surface-bg:var(--color-crimson-alpha-2)]",
+				"[--badge-surface-border:var(--color-crimson-alpha-6)]",
+				"[--badge-outline-border:var(--color-crimson-alpha-8)]",
+				"[--badge-solid-bg:var(--color-crimson-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			plum: [
+				"[--badge-fg:var(--color-plum-11)]",
+				"[--badge-subtle-bg:var(--color-plum-alpha-3)]",
+				"[--badge-surface-bg:var(--color-plum-alpha-2)]",
+				"[--badge-surface-border:var(--color-plum-alpha-6)]",
+				"[--badge-outline-border:var(--color-plum-alpha-8)]",
+				"[--badge-solid-bg:var(--color-plum-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			violet: [
+				"[--badge-fg:var(--color-violet-11)]",
+				"[--badge-subtle-bg:var(--color-violet-alpha-3)]",
+				"[--badge-surface-bg:var(--color-violet-alpha-2)]",
+				"[--badge-surface-border:var(--color-violet-alpha-6)]",
+				"[--badge-outline-border:var(--color-violet-alpha-8)]",
+				"[--badge-solid-bg:var(--color-violet-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			iris: [
+				"[--badge-fg:var(--color-iris-11)]",
+				"[--badge-subtle-bg:var(--color-iris-alpha-3)]",
+				"[--badge-surface-bg:var(--color-iris-alpha-2)]",
+				"[--badge-surface-border:var(--color-iris-alpha-6)]",
+				"[--badge-outline-border:var(--color-iris-alpha-8)]",
+				"[--badge-solid-bg:var(--color-iris-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			indigo: [
+				"[--badge-fg:var(--color-indigo-11)]",
+				"[--badge-subtle-bg:var(--color-indigo-alpha-3)]",
+				"[--badge-surface-bg:var(--color-indigo-alpha-2)]",
+				"[--badge-surface-border:var(--color-indigo-alpha-6)]",
+				"[--badge-outline-border:var(--color-indigo-alpha-8)]",
+				"[--badge-solid-bg:var(--color-indigo-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			sky: [
+				"[--badge-fg:var(--color-sky-11)]",
+				"[--badge-subtle-bg:var(--color-sky-alpha-3)]",
+				"[--badge-surface-bg:var(--color-sky-alpha-2)]",
+				"[--badge-surface-border:var(--color-sky-alpha-6)]",
+				"[--badge-outline-border:var(--color-sky-alpha-8)]",
+				"[--badge-solid-bg:var(--color-sky-9)]",
+				"[--badge-solid-fg:var(--color-black)]"
+			],
+			mint: [
+				"[--badge-fg:var(--color-mint-11)]",
+				"[--badge-subtle-bg:var(--color-mint-alpha-3)]",
+				"[--badge-surface-bg:var(--color-mint-alpha-2)]",
+				"[--badge-surface-border:var(--color-mint-alpha-6)]",
+				"[--badge-outline-border:var(--color-mint-alpha-8)]",
+				"[--badge-solid-bg:var(--color-mint-9)]",
+				"[--badge-solid-fg:var(--color-black)]"
+			],
+			lime: [
+				"[--badge-fg:var(--color-lime-11)]",
+				"[--badge-subtle-bg:var(--color-lime-alpha-3)]",
+				"[--badge-surface-bg:var(--color-lime-alpha-2)]",
+				"[--badge-surface-border:var(--color-lime-alpha-6)]",
+				"[--badge-outline-border:var(--color-lime-alpha-8)]",
+				"[--badge-solid-bg:var(--color-lime-9)]",
+				"[--badge-solid-fg:var(--color-black)]"
+			],
+			jade: [
+				"[--badge-fg:var(--color-jade-11)]",
+				"[--badge-subtle-bg:var(--color-jade-alpha-3)]",
+				"[--badge-surface-bg:var(--color-jade-alpha-2)]",
+				"[--badge-surface-border:var(--color-jade-alpha-6)]",
+				"[--badge-outline-border:var(--color-jade-alpha-8)]",
+				"[--badge-solid-bg:var(--color-jade-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			],
+			grass: [
+				"[--badge-fg:var(--color-grass-11)]",
+				"[--badge-subtle-bg:var(--color-grass-alpha-3)]",
+				"[--badge-surface-bg:var(--color-grass-alpha-2)]",
+				"[--badge-surface-border:var(--color-grass-alpha-6)]",
+				"[--badge-outline-border:var(--color-grass-alpha-8)]",
+				"[--badge-solid-bg:var(--color-grass-9)]",
+				"[--badge-solid-fg:var(--color-white)]"
+			]
+		},
+		size: {
+			sm: [
+				"h-5",
+				"px-1.5",
+				"gap-1",
+				"text-xs",
+				"[&_svg]:size-3"
+			],
+			md: [
+				"h-6",
+				"px-2",
+				"gap-1",
+				"text-xs",
+				"[&_svg]:size-3.5"
+			],
+			lg: [
+				"h-7",
+				"px-2.5",
+				"gap-1.5",
+				"text-sm",
+				"[&_svg]:size-4"
+			]
+		},
+		variant: {
+			subtle: [
+				"border-transparent",
+				"bg-(--badge-subtle-bg)",
+				"text-(--badge-fg)"
+			],
+			surface: [
+				"border-(--badge-surface-border)",
+				"bg-(--badge-surface-bg)",
+				"text-(--badge-fg)"
+			],
+			outline: ["border-(--badge-outline-border)", "text-(--badge-fg)"],
+			solid: [
+				"border-transparent",
+				"bg-(--badge-solid-bg)",
+				"text-(--badge-solid-fg)"
+			]
+		}
+	},
+	defaultVariants: {
+		colorScheme: badgeDefaultVariants.colorScheme,
+		size: badgeDefaultVariants.size,
+		variant: badgeDefaultVariants.variant
+	}
+});
+//#endregion
+export { badgeDefaultVariants, badgeVariants };
+
+//# sourceMappingURL=badge-variants.js.map

package/dist/components/display/badge/badge-variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge-variants.js","names":[],"sources":["../../../../src/components/display/badge/badge-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport type { ColorSchemeFull } from '#types';\n\nexport type BadgeVariants = {\n  /**\n   * Cor do texto, do fundo e da borda, entre todas as escalas do tema: para categorias, há\n   * variedade; para estado, `red`, `green`, `amber` e `blue`.\n   *\n   * @default 'gray'\n   */\n  colorScheme?: ColorSchemeFull;\n  /**\n   * Altura, padding, tamanho do texto e do ícone: `sm` = `h-5`, `md` = `h-6`, `lg` = `h-7`.\n   *\n   * @default 'sm'\n   */\n  size?: 'sm' | 'md' | 'lg';\n  /**\n   * Fundo e borda: `subtle` só com fundo, `surface` com fundo e borda, `outline` só com borda e\n   * `solid` com o fundo cheio (passo 9) e o texto em contraste.\n   *\n   * @default 'subtle'\n   */\n  variant?: 'subtle' | 'surface' | 'outline' | 'solid';\n};\n\nexport const badgeDefaultVariants: Required<BadgeVariants> = {\n  colorScheme: 'gray',\n  size: 'sm',\n  variant: 'subtle',\n};\n\n/**\n * Origem do visual do rótulo curto, copiado pela `Tag` (tabela no README de `display`).\n *\n * O `colorScheme` só declara as variáveis `--badge-*`, e a `variant` decide onde cada uma entra.\n * Assim uma cor nova é um bloco de variáveis, sem um bloco por combinação de cor e `variant`. O\n * fundo e a borda usam a escala alpha, para o badge funcionar sobre qualquer fundo. No `solid`, o\n * texto é branco, menos em amber, yellow, sky, mint e lime, claros demais para ele, que levam\n * preto; o gray sólido é preto no tema claro e branco no escuro, como o do `Button`.\n */\nexport const badgeVariants = cva(\n  [\n    'inline-flex',\n    'items-center',\n    'shrink-0',\n    'align-middle',\n\n    'border',\n    'rounded-sm',\n    'corner-squircle',\n\n    'font-medium',\n    'leading-none',\n    'whitespace-nowrap',\n    'tabular-nums',\n\n    '[&_svg]:shrink-0',\n  ],\n  {\n    variants: {\n      colorScheme: {\n        gray: [\n          '[--badge-fg:var(--color-gray-11)]',\n          '[--badge-subtle-bg:var(--color-gray-alpha-3)]',\n          '[--badge-surface-bg:var(--color-gray-alpha-2)]',\n          '[--badge-surface-border:var(--color-gray-alpha-6)]',\n          '[--badge-outline-border:var(--color-gray-alpha-8)]',\n          '[--badge-solid-bg:var(--color-black)]',\n          'dark:[--badge-solid-bg:var(--color-white)]',\n          '[--badge-solid-fg:var(--color-white)]',\n          'dark:[--badge-solid-fg:var(--color-black)]',\n        ],\n        brand: [\n          '[--badge-fg:var(--color-brand-11)]',\n          '[--badge-subtle-bg:var(--color-brand-alpha-3)]',\n          '[--badge-surface-bg:var(--color-brand-alpha-2)]',\n          '[--badge-surface-border:var(--color-brand-alpha-6)]',\n          '[--badge-outline-border:var(--color-brand-alpha-8)]',\n          '[--badge-solid-bg:var(--color-brand-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        red: [\n          '[--badge-fg:var(--color-red-11)]',\n          '[--badge-subtle-bg:var(--color-red-alpha-3)]',\n          '[--badge-surface-bg:var(--color-red-alpha-2)]',\n          '[--badge-surface-border:var(--color-red-alpha-6)]',\n          '[--badge-outline-border:var(--color-red-alpha-8)]',\n          '[--badge-solid-bg:var(--color-red-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        green: [\n          '[--badge-fg:var(--color-green-11)]',\n          '[--badge-subtle-bg:var(--color-green-alpha-3)]',\n          '[--badge-surface-bg:var(--color-green-alpha-2)]',\n          '[--badge-surface-border:var(--color-green-alpha-6)]',\n          '[--badge-outline-border:var(--color-green-alpha-8)]',\n          '[--badge-solid-bg:var(--color-green-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        blue: [\n          '[--badge-fg:var(--color-blue-11)]',\n          '[--badge-subtle-bg:var(--color-blue-alpha-3)]',\n          '[--badge-surface-bg:var(--color-blue-alpha-2)]',\n          '[--badge-surface-border:var(--color-blue-alpha-6)]',\n          '[--badge-outline-border:var(--color-blue-alpha-8)]',\n          '[--badge-solid-bg:var(--color-blue-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        amber: [\n          '[--badge-fg:var(--color-amber-11)]',\n          '[--badge-subtle-bg:var(--color-amber-alpha-3)]',\n          '[--badge-surface-bg:var(--color-amber-alpha-2)]',\n          '[--badge-surface-border:var(--color-amber-alpha-6)]',\n          '[--badge-outline-border:var(--color-amber-alpha-8)]',\n          '[--badge-solid-bg:var(--color-amber-9)]',\n          '[--badge-solid-fg:var(--color-black)]',\n        ],\n        purple: [\n          '[--badge-fg:var(--color-purple-11)]',\n          '[--badge-subtle-bg:var(--color-purple-alpha-3)]',\n          '[--badge-surface-bg:var(--color-purple-alpha-2)]',\n          '[--badge-surface-border:var(--color-purple-alpha-6)]',\n          '[--badge-outline-border:var(--color-purple-alpha-8)]',\n          '[--badge-solid-bg:var(--color-purple-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        pink: [\n          '[--badge-fg:var(--color-pink-11)]',\n          '[--badge-subtle-bg:var(--color-pink-alpha-3)]',\n          '[--badge-surface-bg:var(--color-pink-alpha-2)]',\n          '[--badge-surface-border:var(--color-pink-alpha-6)]',\n          '[--badge-outline-border:var(--color-pink-alpha-8)]',\n          '[--badge-solid-bg:var(--color-pink-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        cyan: [\n          '[--badge-fg:var(--color-cyan-11)]',\n          '[--badge-subtle-bg:var(--color-cyan-alpha-3)]',\n          '[--badge-surface-bg:var(--color-cyan-alpha-2)]',\n          '[--badge-surface-border:var(--color-cyan-alpha-6)]',\n          '[--badge-outline-border:var(--color-cyan-alpha-8)]',\n          '[--badge-solid-bg:var(--color-cyan-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        teal: [\n          '[--badge-fg:var(--color-teal-11)]',\n          '[--badge-subtle-bg:var(--color-teal-alpha-3)]',\n          '[--badge-surface-bg:var(--color-teal-alpha-2)]',\n          '[--badge-surface-border:var(--color-teal-alpha-6)]',\n          '[--badge-outline-border:var(--color-teal-alpha-8)]',\n          '[--badge-solid-bg:var(--color-teal-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        orange: [\n          '[--badge-fg:var(--color-orange-11)]',\n          '[--badge-subtle-bg:var(--color-orange-alpha-3)]',\n          '[--badge-surface-bg:var(--color-orange-alpha-2)]',\n          '[--badge-surface-border:var(--color-orange-alpha-6)]',\n          '[--badge-outline-border:var(--color-orange-alpha-8)]',\n          '[--badge-solid-bg:var(--color-orange-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        brown: [\n          '[--badge-fg:var(--color-brown-11)]',\n          '[--badge-subtle-bg:var(--color-brown-alpha-3)]',\n          '[--badge-surface-bg:var(--color-brown-alpha-2)]',\n          '[--badge-surface-border:var(--color-brown-alpha-6)]',\n          '[--badge-outline-border:var(--color-brown-alpha-8)]',\n          '[--badge-solid-bg:var(--color-brown-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        yellow: [\n          '[--badge-fg:var(--color-yellow-11)]',\n          '[--badge-subtle-bg:var(--color-yellow-alpha-3)]',\n          '[--badge-surface-bg:var(--color-yellow-alpha-2)]',\n          '[--badge-surface-border:var(--color-yellow-alpha-6)]',\n          '[--badge-outline-border:var(--color-yellow-alpha-8)]',\n          '[--badge-solid-bg:var(--color-yellow-9)]',\n          '[--badge-solid-fg:var(--color-black)]',\n        ],\n        bronze: [\n          '[--badge-fg:var(--color-bronze-11)]',\n          '[--badge-subtle-bg:var(--color-bronze-alpha-3)]',\n          '[--badge-surface-bg:var(--color-bronze-alpha-2)]',\n          '[--badge-surface-border:var(--color-bronze-alpha-6)]',\n          '[--badge-outline-border:var(--color-bronze-alpha-8)]',\n          '[--badge-solid-bg:var(--color-bronze-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        gold: [\n          '[--badge-fg:var(--color-gold-11)]',\n          '[--badge-subtle-bg:var(--color-gold-alpha-3)]',\n          '[--badge-surface-bg:var(--color-gold-alpha-2)]',\n          '[--badge-surface-border:var(--color-gold-alpha-6)]',\n          '[--badge-outline-border:var(--color-gold-alpha-8)]',\n          '[--badge-solid-bg:var(--color-gold-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        tomato: [\n          '[--badge-fg:var(--color-tomato-11)]',\n          '[--badge-subtle-bg:var(--color-tomato-alpha-3)]',\n          '[--badge-surface-bg:var(--color-tomato-alpha-2)]',\n          '[--badge-surface-border:var(--color-tomato-alpha-6)]',\n          '[--badge-outline-border:var(--color-tomato-alpha-8)]',\n          '[--badge-solid-bg:var(--color-tomato-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        ruby: [\n          '[--badge-fg:var(--color-ruby-11)]',\n          '[--badge-subtle-bg:var(--color-ruby-alpha-3)]',\n          '[--badge-surface-bg:var(--color-ruby-alpha-2)]',\n          '[--badge-surface-border:var(--color-ruby-alpha-6)]',\n          '[--badge-outline-border:var(--color-ruby-alpha-8)]',\n          '[--badge-solid-bg:var(--color-ruby-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        crimson: [\n          '[--badge-fg:var(--color-crimson-11)]',\n          '[--badge-subtle-bg:var(--color-crimson-alpha-3)]',\n          '[--badge-surface-bg:var(--color-crimson-alpha-2)]',\n          '[--badge-surface-border:var(--color-crimson-alpha-6)]',\n          '[--badge-outline-border:var(--color-crimson-alpha-8)]',\n          '[--badge-solid-bg:var(--color-crimson-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        plum: [\n          '[--badge-fg:var(--color-plum-11)]',\n          '[--badge-subtle-bg:var(--color-plum-alpha-3)]',\n          '[--badge-surface-bg:var(--color-plum-alpha-2)]',\n          '[--badge-surface-border:var(--color-plum-alpha-6)]',\n          '[--badge-outline-border:var(--color-plum-alpha-8)]',\n          '[--badge-solid-bg:var(--color-plum-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        violet: [\n          '[--badge-fg:var(--color-violet-11)]',\n          '[--badge-subtle-bg:var(--color-violet-alpha-3)]',\n          '[--badge-surface-bg:var(--color-violet-alpha-2)]',\n          '[--badge-surface-border:var(--color-violet-alpha-6)]',\n          '[--badge-outline-border:var(--color-violet-alpha-8)]',\n          '[--badge-solid-bg:var(--color-violet-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        iris: [\n          '[--badge-fg:var(--color-iris-11)]',\n          '[--badge-subtle-bg:var(--color-iris-alpha-3)]',\n          '[--badge-surface-bg:var(--color-iris-alpha-2)]',\n          '[--badge-surface-border:var(--color-iris-alpha-6)]',\n          '[--badge-outline-border:var(--color-iris-alpha-8)]',\n          '[--badge-solid-bg:var(--color-iris-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        indigo: [\n          '[--badge-fg:var(--color-indigo-11)]',\n          '[--badge-subtle-bg:var(--color-indigo-alpha-3)]',\n          '[--badge-surface-bg:var(--color-indigo-alpha-2)]',\n          '[--badge-surface-border:var(--color-indigo-alpha-6)]',\n          '[--badge-outline-border:var(--color-indigo-alpha-8)]',\n          '[--badge-solid-bg:var(--color-indigo-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        sky: [\n          '[--badge-fg:var(--color-sky-11)]',\n          '[--badge-subtle-bg:var(--color-sky-alpha-3)]',\n          '[--badge-surface-bg:var(--color-sky-alpha-2)]',\n          '[--badge-surface-border:var(--color-sky-alpha-6)]',\n          '[--badge-outline-border:var(--color-sky-alpha-8)]',\n          '[--badge-solid-bg:var(--color-sky-9)]',\n          '[--badge-solid-fg:var(--color-black)]',\n        ],\n        mint: [\n          '[--badge-fg:var(--color-mint-11)]',\n          '[--badge-subtle-bg:var(--color-mint-alpha-3)]',\n          '[--badge-surface-bg:var(--color-mint-alpha-2)]',\n          '[--badge-surface-border:var(--color-mint-alpha-6)]',\n          '[--badge-outline-border:var(--color-mint-alpha-8)]',\n          '[--badge-solid-bg:var(--color-mint-9)]',\n          '[--badge-solid-fg:var(--color-black)]',\n        ],\n        lime: [\n          '[--badge-fg:var(--color-lime-11)]',\n          '[--badge-subtle-bg:var(--color-lime-alpha-3)]',\n          '[--badge-surface-bg:var(--color-lime-alpha-2)]',\n          '[--badge-surface-border:var(--color-lime-alpha-6)]',\n          '[--badge-outline-border:var(--color-lime-alpha-8)]',\n          '[--badge-solid-bg:var(--color-lime-9)]',\n          '[--badge-solid-fg:var(--color-black)]',\n        ],\n        jade: [\n          '[--badge-fg:var(--color-jade-11)]',\n          '[--badge-subtle-bg:var(--color-jade-alpha-3)]',\n          '[--badge-surface-bg:var(--color-jade-alpha-2)]',\n          '[--badge-surface-border:var(--color-jade-alpha-6)]',\n          '[--badge-outline-border:var(--color-jade-alpha-8)]',\n          '[--badge-solid-bg:var(--color-jade-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n        grass: [\n          '[--badge-fg:var(--color-grass-11)]',\n          '[--badge-subtle-bg:var(--color-grass-alpha-3)]',\n          '[--badge-surface-bg:var(--color-grass-alpha-2)]',\n          '[--badge-surface-border:var(--color-grass-alpha-6)]',\n          '[--badge-outline-border:var(--color-grass-alpha-8)]',\n          '[--badge-solid-bg:var(--color-grass-9)]',\n          '[--badge-solid-fg:var(--color-white)]',\n        ],\n      },\n      size: {\n        sm: ['h-5', 'px-1.5', 'gap-1', 'text-xs', '[&_svg]:size-3'],\n        md: ['h-6', 'px-2', 'gap-1', 'text-xs', '[&_svg]:size-3.5'],\n        lg: ['h-7', 'px-2.5', 'gap-1.5', 'text-sm', '[&_svg]:size-4'],\n      },\n      variant: {\n        // A borda transparente fica para as variantes terem a mesma medida.\n        subtle: [\n          'border-transparent',\n          'bg-(--badge-subtle-bg)',\n          'text-(--badge-fg)',\n        ],\n        surface: [\n          'border-(--badge-surface-border)',\n          'bg-(--badge-surface-bg)',\n          'text-(--badge-fg)',\n        ],\n        outline: ['border-(--badge-outline-border)', 'text-(--badge-fg)'],\n        solid: [\n          'border-transparent',\n          'bg-(--badge-solid-bg)',\n          'text-(--badge-solid-fg)',\n        ],\n      },\n    },\n    defaultVariants: {\n      colorScheme: badgeDefaultVariants.colorScheme,\n      size: badgeDefaultVariants.size,\n      variant: badgeDefaultVariants.variant,\n    },\n  },\n);\n"],"mappings":";;AA0BA,MAAa,uBAAgD;CAC3D,aAAa;CACb,MAAM;CACN,SAAS;AACX;;;;;;;;;;AAWA,MAAa,gBAAgB,IAC3B;CACE;CACA;CACA;CACA;CAEA;CACA;CACA;CAEA;CACA;CACA;CACA;CAEA;AACF,GACA;CACE,UAAU;EACR,aAAa;GACX,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,KAAK;IACH;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,KAAK;IACH;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GACA,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;GACF;EACF;EACA,MAAM;GACJ,IAAI;IAAC;IAAO;IAAU;IAAS;IAAW;GAAgB;GAC1D,IAAI;IAAC;IAAO;IAAQ;IAAS;IAAW;GAAkB;GAC1D,IAAI;IAAC;IAAO;IAAU;IAAW;IAAW;GAAgB;EAC9D;EACA,SAAS;GAEP,QAAQ;IACN;IACA;IACA;GACF;GACA,SAAS;IACP;IACA;IACA;GACF;GACA,SAAS,CAAC,mCAAmC,mBAAmB;GAChE,OAAO;IACL;IACA;IACA;GACF;EACF;CACF;CACA,iBAAiB;EACf,aAAa,qBAAqB;EAClC,MAAM,qBAAqB;EAC3B,SAAS,qBAAqB;CAChC;AACF,CACF"}

package/dist/components/display/badge/badge.d.ts

@@ -0,0 +1,23 @@
+import { BadgeVariants } from "./badge-variants.js";
+import { MergeOverride } from "@lucasbernardosn/ts-utils";
+import { useRender } from "@base-ui/react";
+//#region src/components/display/badge/badge.d.ts
+export type BadgeProps = MergeOverride<useRender.ComponentProps<'span'>, BadgeVariants>;
+/**
+ * Rótulo curto de exibição, para uma categoria, um estado ou uma contagem ("Pago", "NF-e", "3").
+ * Não tem interação: para um item que se remove, a `Tag`.
+ *
+ * Um ícone entra nos filhos, antes ou depois do texto, pelo `Icon` da lib. A cor sozinha não
+ * comunica para quem não a distingue: o texto diz o que o badge significa.
+ *
+ * @example
+ * ```tsx
+ * <Badge colorScheme="green">Pago</Badge>
+ * ```
+ */
+export declare const Badge: {
+  (props: BadgeProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=badge.d.ts.map

package/dist/components/display/badge/badge.js

@@ -0,0 +1,40 @@
+import { mergeTwClassNames } from "../../../utils/merge-class-names.js";
+import { badgeVariants } from "./badge-variants.js";
+import { createSplitProps } from "@lucasbernardosn/ts-utils";
+import { mergeProps, useRender } from "@base-ui/react";
+//#region src/components/display/badge/badge.tsx
+const splitVariantProps = createSplitProps();
+/**
+* Rótulo curto de exibição, para uma categoria, um estado ou uma contagem ("Pago", "NF-e", "3").
+* Não tem interação: para um item que se remove, a `Tag`.
+*
+* Um ícone entra nos filhos, antes ou depois do texto, pelo `Icon` da lib. A cor sozinha não
+* comunica para quem não a distingue: o texto diz o que o badge significa.
+*
+* @example
+* ```tsx
+* <Badge colorScheme="green">Pago</Badge>
+* ```
+*/
+const Badge = (props) => {
+	const [variantProps, elementProps] = splitVariantProps(props, [
+		"colorScheme",
+		"size",
+		"variant"
+	]);
+	const { render, className, ...rest } = elementProps;
+	const baseProps = {
+		"data-component": "Badge",
+		className: mergeTwClassNames(badgeVariants(variantProps), className)
+	};
+	return useRender({
+		render,
+		defaultTagName: "span",
+		props: mergeProps(baseProps, rest)
+	});
+};
+Badge.displayName = "Badge";
+//#endregion
+export { Badge };
+
+//# sourceMappingURL=badge.js.map

package/dist/components/display/badge/badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.js","names":[],"sources":["../../../../src/components/display/badge/badge.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport {\n  createSplitProps,\n  type MergeOverride,\n} from '@lucasbernardosn/ts-utils';\nimport { mergeTwClassNames } from '#utils';\nimport { type BadgeVariants, badgeVariants } from './badge-variants';\n\nexport type BadgeProps = MergeOverride<\n  useRender.ComponentProps<'span'>,\n  BadgeVariants\n>;\n\nconst splitVariantProps = createSplitProps<BadgeVariants>();\n\n/**\n * Rótulo curto de exibição, para uma categoria, um estado ou uma contagem (\"Pago\", \"NF-e\", \"3\").\n * Não tem interação: para um item que se remove, a `Tag`.\n *\n * Um ícone entra nos filhos, antes ou depois do texto, pelo `Icon` da lib. A cor sozinha não\n * comunica para quem não a distingue: o texto diz o que o badge significa.\n *\n * @example\n * ```tsx\n * <Badge colorScheme=\"green\">Pago</Badge>\n * ```\n */\nexport const Badge = (props: BadgeProps) => {\n  const [variantProps, elementProps] = splitVariantProps(props, [\n    'colorScheme',\n    'size',\n    'variant',\n  ]);\n\n  const { render, className, ...rest } = elementProps;\n\n  const baseProps = {\n    'data-component': 'Badge',\n    className: mergeTwClassNames(badgeVariants(variantProps), className),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'span',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nBadge.displayName = 'Badge';\n"],"mappings":";;;;;AAaA,MAAM,oBAAoB,iBAAgC;;;;;;;;;;;;;AAc1D,MAAa,SAAS,UAAsB;CAC1C,MAAM,CAAC,cAAc,gBAAgB,kBAAkB,OAAO;EAC5D;EACA;EACA;CACF,CAAC;CAED,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBAAkB,cAAc,YAAY,GAAG,SAAS;CACrE;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,MAAM,cAAc"}

package/dist/components/display/badge/index.d.ts

@@ -0,0 +1,3 @@
+import { BadgeVariants } from "./badge-variants.js";
+import { Badge, BadgeProps } from "./badge.js";
+export { Badge, type BadgeProps, type BadgeVariants };

package/dist/components/display/badge/index.js

@@ -0,0 +1,2 @@
+import { Badge } from "./badge.js";
+export { Badge };

package/dist/components/display/card/card-description.d.ts

@@ -2,11 +2,10 @@ import { useRender } from "@base-ui/react";
 //#region src/components/display/card/card-description.d.ts
 export type CardDescriptionProps = useRender.ComponentProps<'p'>;
 /**
- * Texto de apoio do card, abaixo do título, no tamanho e na entrelinha do `size` do `Card.Root`
- * mais próximo; fora de um card, fica no tamanho do `sm`.
+ * Texto de apoio do card, abaixo do título, em tamanho fixo.
  *
- * Origem da descrição na escala: o `Dialog.Description` copia estas classes (tabela no README de `display`). Uma
- * mudança aqui vale para a cópia na mesma rodada.
+ * O `Dialog.Description` copia estas classes (tabela no README de `display`). Uma mudança aqui vale
+ * para a cópia na mesma rodada.
  */
 export declare const CardDescription: {
   (props: CardDescriptionProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;