npm - @lucasbernardosn/react-ui - Versions diffs - 0.1.0 → 0.2.0 - Mend

@lucasbernardosn/react-ui 0.1.0 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (192) hide show

package/dist/components/display/card/card-root-variants.js CHANGED Viewed

@@ -1,91 +1,44 @@
 import { cva } from "class-variance-authority";
 //#region src/components/display/card/card-root-variants.ts
-const cardDefaultVariants = {
-	size: "sm",
-	variant: "outline"
-};
+const cardDefaultVariants = { variant: "outline" };
 /**
-* O `size` só declara CSS variables, e as partes as leem:
-* - `--card-padding`: o respiro de Header, Body e Footer;
-* - `--card-title-size` e `--card-title-leading`: o Title;
-* - `--card-description-size` e `--card-description-leading`: a Description;
-* - `--card-header-gap`: o espaço entre título e descrição no Header.
-*
-* Assim as partes não precisam de contexto, e um card aninhado redeclara as variáveis para o que
-* está dentro dele.
+* O respiro de Header, Body e Footer fica em `--card-padding`, fixo em 16px: as partes leem a
+* variável, e um card aninhado a redeclara para o que está dentro dele.
 */
 const cardRootVariants = cva([
+	"[--card-padding:--spacing(4)]",
 	"relative",
 	"flex",
 	"flex-col",
 	"min-w-0",
-	"rounded-xl",
+	"rounded-md",
 	"corner-squircle",
 	"text-gray-12",
 	"text-start",
 	"wrap-break-word"
 ], {
-	variants: {
-		size: {
-			xs: [
-				"[--card-padding:--spacing(4)]",
-				"[--card-title-size:var(--text-base)]",
-				"[--card-title-leading:--spacing(5)]",
-				"[--card-description-size:var(--text-xs)]",
-				"[--card-description-leading:--spacing(4)]",
-				"[--card-header-gap:--spacing(0.5)]"
-			],
-			sm: [
-				"[--card-padding:--spacing(6)]",
-				"[--card-title-size:var(--text-lg)]",
-				"[--card-title-leading:--spacing(6)]",
-				"[--card-description-size:var(--text-sm)]",
-				"[--card-description-leading:--spacing(5)]",
-				"[--card-header-gap:--spacing(0.5)]"
-			],
-			md: [
-				"[--card-padding:--spacing(7)]",
-				"[--card-title-size:var(--text-xl)]",
-				"[--card-title-leading:--spacing(7)]",
-				"[--card-description-size:var(--text-base)]",
-				"[--card-description-leading:--spacing(6)]",
-				"[--card-header-gap:--spacing(1)]"
-			],
-			lg: [
-				"[--card-padding:--spacing(8)]",
-				"[--card-title-size:var(--text-2xl)]",
-				"[--card-title-leading:--spacing(8)]",
-				"[--card-description-size:var(--text-lg)]",
-				"[--card-description-leading:--spacing(7)]",
-				"[--card-header-gap:--spacing(1)]"
-			]
-		},
-		variant: {
-			elevated: [
-				"border",
-				"border-transparent",
-				"bg-white",
-				"dark:bg-gray-2",
-				"shadow-md"
-			],
-			outline: [
-				"border",
-				"border-gray-6",
-				"bg-white",
-				"dark:bg-gray-1"
-			],
-			subtle: [
-				"border",
-				"border-transparent",
-				"bg-gray-3",
-				"dark:bg-gray-3"
-			]
-		}
-	},
-	defaultVariants: {
-		size: cardDefaultVariants.size,
-		variant: cardDefaultVariants.variant
-	}
+	variants: { variant: {
+		elevated: [
+			"border",
+			"border-transparent",
+			"bg-white",
+			"dark:bg-gray-2",
+			"shadow-md"
+		],
+		outline: [
+			"border",
+			"border-gray-6",
+			"bg-white",
+			"dark:bg-gray-1"
+		],
+		subtle: [
+			"border",
+			"border-transparent",
+			"bg-gray-3",
+			"dark:bg-gray-3"
+		]
+	} },
+	defaultVariants: { variant: cardDefaultVariants.variant }
 });
 //#endregion
 export { cardDefaultVariants, cardRootVariants };

package/dist/components/display/card/card-root-variants.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"card-root-variants.js","names":[],"sources":["../../../../src/components/display/card/card-root-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport type CardVariants = {\n /*\n Respiro interno das partes e tipografia do cabeçalho: tamanho e entrelinha do título e da\n * descrição, e o espaço entre os dois.\n \n @default 'sm'\n /\n size?: 'xs' \| 'sm' \| 'md' \| 'lg';\n /\n Fundo, borda e sombra do card.\n \n @default 'outline'\n /\n variant?: 'elevated' \| 'outline' \| 'subtle';\n};\n\nexport const cardDefaultVariants: Required<CardVariants> = {\n ~~size: 'sm',\n~~ variant: 'outline',\n};\n\n/\n O ~~`size` só declara CSS variables, e as partes as leem:\n * - `--card-padding`: o~~ respiro de Header, Body e Footer~~;\n~~ * - `--card-~~title-size`~~ e ~~`--card-title-leading`:~~ o ~~Title;\n~~ * - ~~`--card-description-size` e `--card-description-leading`:~~ a ~~Description;\~~n * ~~- `--card-header-gap`: o espaço entre título e descrição no Header.\n \n Assim as partes não precisam de contexto~~, e um card aninhado redeclara ~~as variáveis~~ para o que\n * está dentro dele.\n */\nexport const cardRootVariants = cva(\n [\n 'relative',\n\n 'flex',\n 'flex-col',\n\n 'min-w-0',\n\n 'rounded-xl',\n 'corner-squircle',\n\n 'text-gray-12',\n 'text-start',\n 'wrap-break-word',\n ],\n {\n variants: {\n size: {\n xs: [\n '[--card-padding:--spacing(4)]',\n '[--card-title-size:var(--text-base)]',\n '[--card-title-leading:--spacing(5)]',\n '[--card-description-size:var(--text-xs)]',\n '[--card-description-leading:--spacing(4)]',\n '[--card-header-gap:--spacing(0.5)]',\n ],\n sm: [\n '[--card-padding:--spacing(6)]',\n '[--card-title-size:var(--text-lg)]',\n '[--card-title-leading:--spacing(6)]',\n '[--card-description-size:var(--text-sm)]',\n '[--card-description-leading:--spacing(5)]',\n '[--card-header-gap:--spacing(0.5)]',\n ],\n md: [\n '[--card-padding:--spacing(7)]',\n '[--card-title-size:var(--text-xl)]',\n '[--card-title-leading:--spacing(7)]',\n '[--card-description-size:var(--text-base)]',\n '[--card-description-leading:--spacing(6)]',\n '[--card-header-gap:--spacing(1)]',\n ],\n lg: [\n '[--card-padding:--spacing(8)]',\n '[--card-title-size:var(--text-2xl)]',\n '[--card-title-leading:--spacing(8)]',\n '[--card-description-size:var(--text-lg)]',\n '[--card-description-leading:--spacing(7)]',\n '[--card-header-gap:--spacing(1)]',\n ],\n },\n variant: {\n elevated: [\n 'border',\n 'border-transparent',\n\n 'bg-white',\n 'dark:bg-gray-2',\n\n 'shadow-md',\n ],\n outline: [\n 'border',\n 'border-gray-6',\n\n 'bg-white',\n 'dark:bg-gray-1',\n ],\n subtle: [\n 'border',\n 'border-transparent',\n\n 'bg-gray-3',\n 'dark:bg-gray-3',\n ],\n },\n },\n defaultVariants: {\n ~~size: cardDefaultVariants.size,\n~~ variant: cardDefaultVariants.variant,\n },\n },\n);\n"],"mappings":";;~~AAkBA~~,MAAa,sBAA8C~~;CACzD~~,~~MAAM;CACN~~,SAAS~~;AACX;;;;;;;;;;;AAYA~~,MAAa,mBAAmB,IAC9B;CACE;CAEA;CACA;CAEA;CAEA;CACA;CAEA;CACA;CACA;AACF,GACA;CACE,UAAU;EACR,~~MAAM~~;~~GACJ~~,~~IAAI~~;~~IACF~~;~~IACA;IACA;IACA;IACA;IACA;GACF;~~GACA~~,IAAI~~;~~IACF~~;~~IACA;IACA;IACA;IACA;IACA;GACF;~~GACA~~,IAAI~~;~~IACF~~;~~IACA;IACA;IACA;IACA;IACA;GACF;GACA,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;GACF;~~EACF;EACA,SAAS;GACP~~,UAAU~~;~~IACR~~;~~IACA~~;~~IAEA;IACA;IAEA;GACF;~~GACA~~,SAAS~~;~~IACP~~;~~IACA;IAEA;IACA;GACF;GACA~~,QAAQ;~~IACN~~;~~IACA~~;~~IAEA~~;~~IACA~~;~~GACF;~~EACF;CACF;CACA,iBAAiB;EACf,~~MAAM~~,oBAAoB~~;EAC1B~~,~~SAAS,oBAAoB;CAC~~/B;AACF,CACF"}
1	+ {"version":3,"file":"card-root-variants.js","names":[],"sources":["../../../../src/components/display/card/card-root-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport type CardVariants = {\n /*\n Fundo, borda e sombra do card.\n \n @default 'outline'\n /\n variant?: 'elevated' \| 'outline' \| 'subtle';\n};\n\nexport const cardDefaultVariants: Required<CardVariants> = {\n variant: 'outline',\n};\n\n/\n O respiro de Header, Body e Footer fica em `--card-padding`, fixo em 16px: as partes leem a\n * variável, e um card aninhado a redeclara para o que está dentro dele.\n */\nexport const cardRootVariants = cva(\n [\n '[--card-padding:--spacing(4)]',\n\n 'relative',\n\n 'flex',\n 'flex-col',\n\n 'min-w-0',\n\n 'rounded-md',\n 'corner-squircle',\n\n 'text-gray-12',\n 'text-start',\n 'wrap-break-word',\n ],\n {\n variants: {\n variant: {\n elevated: [\n 'border',\n 'border-transparent',\n\n 'bg-white',\n 'dark:bg-gray-2',\n\n 'shadow-md',\n ],\n outline: [\n 'border',\n 'border-gray-6',\n\n 'bg-white',\n 'dark:bg-gray-1',\n ],\n subtle: [\n 'border',\n 'border-transparent',\n\n 'bg-gray-3',\n 'dark:bg-gray-3',\n ],\n },\n },\n defaultVariants: {\n variant: cardDefaultVariants.variant,\n },\n },\n);\n"],"mappings":";;AAWA,MAAa,sBAA8C,EACzD,SAAS,UACX;;;;;AAMA,MAAa,mBAAmB,IAC9B;CACE;CAEA;CAEA;CACA;CAEA;CAEA;CACA;CAEA;CACA;CACA;AACF,GACA;CACE,UAAU,EACR,SAAS;EACP,UAAU;GACR;GACA;GAEA;GACA;GAEA;EACF;EACA,SAAS;GACP;GACA;GAEA;GACA;EACF;EACA,QAAQ;GACN;GACA;GAEA;GACA;EACF;CACF,EACF;CACA,iBAAiB,EACf,SAAS,oBAAoB,QAC/B;AACF,CACF"}

package/dist/components/display/card/card-root.js CHANGED Viewed

@@ -20,7 +20,7 @@ const splitVariantProps = createSplitProps();
 * ```
 */
 const CardRoot = (props) => {
-	const [variantProps, elementProps] = splitVariantProps(props, ["size", "variant"]);
+	const [variantProps, elementProps] = splitVariantProps(props, ["variant"]);
 	const { render, className, ...rest } = elementProps;
 	const baseProps = {
 		"data-component": "Card.Root",

package/dist/components/display/card/card-root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"card-root.js","names":[],"sources":["../../../../src/components/display/card/card-root.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { createSplitProps, type MergeOverride } from '@lucasbernardosn/utils';\nimport { mergeTwClassNames } from '#utils';\nimport { type CardVariants, cardRootVariants } from './card-root-variants';\n\nexport type CardRootProps = MergeOverride<\n useRender.ComponentProps<'div'>,\n CardVariants\n>;\n\nconst splitVariantProps = createSplitProps<CardVariants>();\n\n/*\n Contêiner que agrupa conteúdo e ações sobre um mesmo assunto.\n \n @example\n * ```tsx\n * <Card.Root>\n * <Card.Header>\n * <Card.Title>Plano Pro</Card.Title>\n * <Card.Description>Cobrança mensal</Card.Description>\n * </Card.Header>\n * <Card.Body>…</Card.Body>\n * <Card.Footer>…</Card.Footer>\n * </Card.Root>\n * ```\n */\nexport const CardRoot = (props: CardRootProps) => {\n const [variantProps, elementProps] = splitVariantProps(props, [\n '~~size',\n '~~variant'~~,\n~~ ]);\n\n const { render, className, ...rest } = elementProps;\n\n const baseProps = {\n 'data-component': 'Card.Root',\n className: mergeTwClassNames(cardRootVariants(variantProps), className),\n };\n\n return useRender({\n render,\n defaultTagName: 'div',\n props: mergeProps(baseProps, rest),\n });\n};\n\nCardRoot.displayName = 'Card.Root';\n"],"mappings":";;;;;AAUA,MAAM,oBAAoB,iBAA+B;;;;;;;;;;;;;;;;AAiBzD,MAAa,YAAY,UAAyB;CAChD,MAAM,CAAC,cAAc,gBAAgB,kBAAkB,OAAO,~~CAC5D~~,~~QACA~~,~~SACF,~~CAAC;~~CAED~~,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBAAkB,iBAAiB,YAAY,GAAG,SAAS;CACxE;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,SAAS,cAAc"}
1	+ {"version":3,"file":"card-root.js","names":[],"sources":["../../../../src/components/display/card/card-root.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { createSplitProps, type MergeOverride } from '@lucasbernardosn/utils';\nimport { mergeTwClassNames } from '#utils';\nimport { type CardVariants, cardRootVariants } from './card-root-variants';\n\nexport type CardRootProps = MergeOverride<\n useRender.ComponentProps<'div'>,\n CardVariants\n>;\n\nconst splitVariantProps = createSplitProps<CardVariants>();\n\n/*\n Contêiner que agrupa conteúdo e ações sobre um mesmo assunto.\n \n @example\n * ```tsx\n * <Card.Root>\n * <Card.Header>\n * <Card.Title>Plano Pro</Card.Title>\n * <Card.Description>Cobrança mensal</Card.Description>\n * </Card.Header>\n * <Card.Body>…</Card.Body>\n * <Card.Footer>…</Card.Footer>\n * </Card.Root>\n * ```\n */\nexport const CardRoot = (props: CardRootProps) => {\n const [variantProps, elementProps] = splitVariantProps(props, ['variant']);\n\n const { render, className, ...rest } = elementProps;\n\n const baseProps = {\n 'data-component': 'Card.Root',\n className: mergeTwClassNames(cardRootVariants(variantProps), className),\n };\n\n return useRender({\n render,\n defaultTagName: 'div',\n props: mergeProps(baseProps, rest),\n });\n};\n\nCardRoot.displayName = 'Card.Root';\n"],"mappings":";;;;;AAUA,MAAM,oBAAoB,iBAA+B;;;;;;;;;;;;;;;;AAiBzD,MAAa,YAAY,UAAyB;CAChD,MAAM,CAAC,cAAc,gBAAgB,kBAAkB,OAAO,CAAC,SAAS,CAAC;CAEzE,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBAAkB,iBAAiB,YAAY,GAAG,SAAS;CACxE;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,SAAS,cAAc"}

package/dist/components/display/card/card-title.d.ts CHANGED Viewed

@@ -3,19 +3,18 @@ import { useRender } from "@base-ui/react";
 //#region src/components/display/card/card-title.d.ts
 export type CardTitleProps = MergeOverride<useRender.ComponentProps<'h3'>, {
   /**
-   * Nível do título, que define a tag (`h1` a `h6`). Não muda a aparência: o tamanho vem do
-   * `size` do `Card.Root`. Com `render`, a tag do `render` prevalece.
+   * Nível do título, que define a tag (`h1` a `h6`). Não muda a aparência. Com `render`, a tag
+   * do `render` prevalece.
    *
    * @default 3
    */
   level?: 1 | 2 | 3 | 4 | 5 | 6;
 }>;
 /**
- * Título do card, no tamanho e na entrelinha do `size` do `Card.Root` mais próximo (pelas CSS
- * variables que ele declara); fora de um card, fica no tamanho do `sm`.
+ * Título do card, em tamanho fixo.
  *
- * Origem do título na escala: o `Dialog.Title` copia estas classes (tabela no README de `display`). Uma
- * mudança aqui vale para a cópia na mesma rodada.
+ * O `Dialog.Title` copia estas classes (tabela no README de `display`). Uma mudança aqui vale para a
+ * cópia na mesma rodada.
  */
 export declare const CardTitle: {
   (props: CardTitleProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;

package/dist/components/display/card/card-title.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"card-title.d.ts","names":[],"sources":["../../../../src/components/display/card/card-title.tsx"],"mappings":";;;YAIY,iBAAiB,cAC3B,UAAU;;;;;;;EAQR~~;;;;;;;;;qBAWS~~;GAAoB,OAAA,iCAAc,+CAAA"}
1	+ {"version":3,"file":"card-title.d.ts","names":[],"sources":["../../../../src/components/display/card/card-title.tsx"],"mappings":";;;YAIY,iBAAiB,cAC3B,UAAU;;;;;;;EAQR;;;;;;;;qBAUS;GAAoB,OAAA,iCAAc,+CAAA"}

package/dist/components/display/card/card-title.js CHANGED Viewed

@@ -2,20 +2,19 @@ import { mergeTwClassNames } from "../../../utils/merge-class-names.js";
 import { mergeProps, useRender } from "@base-ui/react";
 //#region src/components/display/card/card-title.tsx
 /**
-* Título do card, no tamanho e na entrelinha do `size` do `Card.Root` mais próximo (pelas CSS
-* variables que ele declara); fora de um card, fica no tamanho do `sm`.
+* Título do card, em tamanho fixo.
 *
-* Origem do título na escala: o `Dialog.Title` copia estas classes (tabela no README de `display`). Uma
-* mudança aqui vale para a cópia na mesma rodada.
+* O `Dialog.Title` copia estas classes (tabela no README de `display`). Uma mudança aqui vale para a
+* cópia na mesma rodada.
 */
 const CardTitle = (props) => {
 	const { level = 3, render, className, ...rest } = props;
 	const baseProps = {
 		"data-component": "Card.Title",
 		className: mergeTwClassNames([
-			"text-(length:--card-title-size,var(--text-lg))",
-			"leading-(--card-title-leading,--spacing(6))",
-			"font-semibold",
+			"text-base",
+			"leading-6",
+			"font-medium",
 			"text-gray-12",
 			"text-balance"
 		], className)

package/dist/components/display/card/card-title.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"card-title.js","names":[],"sources":["../../../../src/components/display/card/card-title.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport type { MergeOverride } from '@lucasbernardosn/utils';\nimport { mergeTwClassNames } from '#utils';\n\nexport type CardTitleProps = MergeOverride<\n useRender.ComponentProps<'h3'>,\n {\n /*\n Nível do título, que define a tag (`h1` a `h6`). Não muda a aparência~~: o tamanho vem do\n * `size` do `Card~~.~~Root`.~~ Com `render`, a tag do `render` prevalece.\n \n @default 3\n /\n level?: 1 \| 2 \| 3 \| 4 \| 5 \| 6;\n }\n>;\n\n/\n Título do card, no tamanho ~~e na entrelinha do `size` do `Card.Root` mais próximo (pelas CSS\~~n * variables que ele declara); fora de um card, fica no tamanho do `sm`.\n \n ~~Origem~~ ~~do título na escala: o~~ `Dialog.Title` copia estas classes (tabela no README de `display`). Uma\n * mudança aqui vale para a cópia na mesma rodada.\n */\nexport const CardTitle = (props: CardTitleProps) => {\n const { level = 3, render, className, ...rest } = props;\n\n const baseProps = {\n 'data-component': 'Card.Title',\n className: mergeTwClassNames(\n [\n 'text-~~(length:--card-title-size~~,~~var(--text-lg))~~'~~,\n '~~leading-~~(--card-title-leading,--spacing(~~6))'~~,\n~~ 'font-~~semibold~~'~~,\n~~ 'text-gray-12'~~,\n~~ 'text-balance'~~,\n~~ ],\n className,\n ),\n };\n\n return useRender({\n render,\n defaultTagName: `h${level}`,\n props: mergeProps(baseProps, rest),\n });\n};\n\nCardTitle.displayName = 'Card.Title';\n"],"mappings":"~~;;;;;;;;;;AAwBA~~,MAAa,aAAa,UAA0B;CAClD,MAAM,EAAE,QAAQ,GAAG,QAAQ,WAAW,GAAG,SAAS;CAElD,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;~~GACE~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~EACF~~,~~GACA~~,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB,IAAI;EACpB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,UAAU,cAAc"}
1	+ {"version":3,"file":"card-title.js","names":[],"sources":["../../../../src/components/display/card/card-title.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport type { MergeOverride } from '@lucasbernardosn/utils';\nimport { mergeTwClassNames } from '#utils';\n\nexport type CardTitleProps = MergeOverride<\n useRender.ComponentProps<'h3'>,\n {\n /*\n Nível do título, que define a tag (`h1` a `h6`). Não muda a aparência. Com `render`, a tag\n * do `render` prevalece.\n \n @default 3\n /\n level?: 1 \| 2 \| 3 \| 4 \| 5 \| 6;\n }\n>;\n\n/\n Título do card, em tamanho fixo.\n \n O `Dialog.Title` copia estas classes (tabela no README de `display`). Uma mudança aqui vale para a\n * cópia na mesma rodada.\n */\nexport const CardTitle = (props: CardTitleProps) => {\n const { level = 3, render, className, ...rest } = props;\n\n const baseProps = {\n 'data-component': 'Card.Title',\n className: mergeTwClassNames(\n ['text-base', 'leading-6', 'font-medium', 'text-gray-12', 'text-balance'],\n className,\n ),\n };\n\n return useRender({\n render,\n defaultTagName: `h${level}`,\n props: mergeProps(baseProps, rest),\n });\n};\n\nCardTitle.displayName = 'Card.Title';\n"],"mappings":";;;;;;;;;AAuBA,MAAa,aAAa,UAA0B;CAClD,MAAM,EAAE,QAAQ,GAAG,QAAQ,WAAW,GAAG,SAAS;CAElD,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GAAC;GAAa;GAAa;GAAe;GAAgB;EAAc,GACxE,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB,IAAI;EACpB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,UAAU,cAAc"}

package/dist/components/display/data-list/data-list-item-value-variants.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 //#region src/components/display/data-list/data-list-item-value-variants.d.ts
 export declare const dataListItemValueVariants: (props?: ({
-  orientation?: "vertical" | "horizontal" | null | undefined;
+  orientation?: "horizontal" | "vertical" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 //#endregion
 //# sourceMappingURL=data-list-item-value-variants.d.ts.map

package/dist/components/display/data-list/data-list-item-variants.d.ts CHANGED Viewed

@@ -1,12 +1,11 @@
 //#region src/components/display/data-list/data-list-item-variants.d.ts
 /**
  * O espaçamento depende da orientação: em `horizontal` os itens ficam lado a lado e o respiro é
- * lateral; em `vertical` eles empilham e o respiro é vertical. Por isso o `size` só tem valor nos
- * `compoundVariants`.
+ * lateral, com o valor abaixo do rótulo; em `vertical` eles empilham e o respiro é vertical, com
+ * rótulo e valor lado a lado.
  */
 export declare const dataListItemVariants: (props?: ({
-  orientation?: "vertical" | "horizontal" | null | undefined;
-  size?: "sm" | "md" | "lg" | null | undefined;
+  orientation?: "horizontal" | "vertical" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 //#endregion
 //# sourceMappingURL=data-list-item-variants.d.ts.map

package/dist/components/display/data-list/data-list-item-variants.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-list-item-variants.d.ts","names":[],"sources":["../../../../src/components/display/data-list/data-list-item-variants.ts"],"mappings":";;;;;;qBAQa,uBAAoB~~;;;6CA6D~~/B"}
1	+ {"version":3,"file":"data-list-item-variants.d.ts","names":[],"sources":["../../../../src/components/display/data-list/data-list-item-variants.ts"],"mappings":";;;;;;qBAQa,uBAAoB;;6CA6B/B"}

package/dist/components/display/data-list/data-list-item-variants.js CHANGED Viewed

@@ -3,68 +3,30 @@ import { cva } from "class-variance-authority";
 //#region src/components/display/data-list/data-list-item-variants.ts
 /**
 * O espaçamento depende da orientação: em `horizontal` os itens ficam lado a lado e o respiro é
-* lateral; em `vertical` eles empilham e o respiro é vertical. Por isso o `size` só tem valor nos
-* `compoundVariants`.
+* lateral, com o valor abaixo do rótulo; em `vertical` eles empilham e o respiro é vertical, com
+* rótulo e valor lado a lado.
 */
 const dataListItemVariants = cva(["flex"], {
-	variants: {
-		orientation: {
-			horizontal: [
-				"flex-col",
-				"items-start",
-				"first:pl-0",
-				"last:pr-0"
-			],
-			vertical: [
-				"flex-row",
-				"items-center",
-				"justify-between",
-				"first:pt-0",
-				"last:pb-0"
-			]
-		},
-		size: {
-			sm: [],
-			md: [],
-			lg: []
-		}
-	},
-	compoundVariants: [
-		{
-			orientation: "horizontal",
-			size: "sm",
-			className: ["gap-0.5", "px-1.5"]
-		},
-		{
-			orientation: "horizontal",
-			size: "md",
-			className: ["gap-1", "px-2"]
-		},
-		{
-			orientation: "horizontal",
-			size: "lg",
-			className: ["gap-2", "px-3"]
-		},
-		{
-			orientation: "vertical",
-			size: "sm",
-			className: ["gap-4", "py-2"]
-		},
-		{
-			orientation: "vertical",
-			size: "md",
-			className: ["gap-4", "py-2.5"]
-		},
-		{
-			orientation: "vertical",
-			size: "lg",
-			className: ["gap-8", "py-3.5"]
-		}
-	],
-	defaultVariants: {
-		orientation: dataListDefaultVariants.orientation,
-		size: dataListDefaultVariants.size
-	}
+	variants: { orientation: {
+		horizontal: [
+			"flex-col",
+			"items-start",
+			"gap-1",
+			"px-2",
+			"first:pl-0",
+			"last:pr-0"
+		],
+		vertical: [
+			"flex-row",
+			"items-center",
+			"justify-between",
+			"gap-4",
+			"py-2",
+			"first:pt-0",
+			"last:pb-0"
+		]
+	} },
+	defaultVariants: { orientation: dataListDefaultVariants.orientation }
 });
 //#endregion
 export { dataListItemVariants };

package/dist/components/display/data-list/data-list-item-variants.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-list-item-variants.js","names":[],"sources":["../../../../src/components/display/data-list/data-list-item-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { dataListDefaultVariants } from './use-data-list-context';\n\n/*\n O espaçamento depende da orientação: em `horizontal` os itens ficam lado a lado e o respiro é\n * lateral; em `vertical` eles empilham e o respiro é vertical. ~~Por~~ ~~isso~~ o ~~`size`~~ ~~só tem~~ valor ~~nos\n~~ * ~~`compoundVariants`.\~~n */\nexport const dataListItemVariants = cva(['flex'], {\n variants: {\n orientation: {\n horizontal: [\n 'flex-col',\n 'items-start',\n\n 'first:pl-0',\n 'last:pr-0',\n ],\n vertical: [\n 'flex-row',\n 'items-center',\n 'justify-between',\n\n '~~first:pt~~-0',\n '~~last:pb~~-0',\n ~~],\n },\n size: {~~\n ~~sm: [],\n md: [],\n lg: [],\n },\n },\n compoundVariants: [\n {\n orientation:~~ '~~horizontal',\n size~~: ~~'sm',\n className: ['gap~~-0.5'~~, 'px-1.5']~~,\n ~~},\n {\n orientation:~~ '~~horizontal',\n size~~: ~~'md',\n className: ['gap~~-1'~~, 'px-2']~~,\n ~~},\n {\n~~ ~~orientation: 'horizontal',\n size: 'lg',\n className: ['gap-2', 'px-3'~~],\n },\n ~~{\n orientation: 'vertical',\n size: 'sm',\n className: ['gap-4', 'py-2'],\n~~ },\n {\n orientation: 'vertical',\n size: 'md',\n className: ['gap-4', 'py-2.5'],\n },\n {\n orientation: 'vertical',\n size: 'lg',\n className: ['gap-8', 'py-3.5'],\n },\n ~~],\n~~ defaultVariants: {\n orientation: dataListDefaultVariants.orientation,\n ~~size: dataListDefaultVariants.size,\n~~ },\n});\n"],"mappings":";;;;;;;;AAQA,MAAa,uBAAuB,IAAI,CAAC,MAAM,GAAG;CAChD,UAAU;EACR,aAAa;~~GACX~~,YAAY;~~IACV~~;~~IACA~~;~~IAEA~~;~~IACA~~;~~GACF~~;GACA~~,UAAU~~;~~IACR;IACA;IACA;IAEA;IACA;GACF;~~EACF;EACA,~~MAAM~~;~~GACJ,IAAI,CAAC~~;~~GACL,IAAI,CAAC~~;~~GACL,IAAI,CAAC~~;~~EACP~~;~~CACF~~;~~CACA,kBAAkB~~;~~EAChB~~;~~GACE,aAAa~~;~~GACb~~,~~MAAM~~;GACN,WAAW,CAAC,WAAW,QAAQ;EACjC;EACA;GACE,aAAa;GACb,MAAM;GACN,WAAW,CAAC,SAAS,MAAM;EAC7B;EACA;GACE,aAAa;GACb,MAAM;GACN,WAAW,CAAC,SAAS,MAAM;EAC7B;EACA;GACE,aAAa;GACb,MAAM;GACN,WAAW,CAAC,SAAS,MAAM;EAC7B;EACA;GACE,aAAa;GACb,MAAM;GACN,WAAW,CAAC,SAAS,QAAQ;EAC/B;EACA;GACE,aAAa;GACb,MAAM;GACN,WAAW,CAAC,SAAS,QAAQ;EAC/B;CACF;CACA,iBAAiB;EACf,aAAa,wBAAwB~~;EACrC~~,~~MAAM,wBAAwB~~;~~CAChC;~~AACF,CAAC"}
1	+ {"version":3,"file":"data-list-item-variants.js","names":[],"sources":["../../../../src/components/display/data-list/data-list-item-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { dataListDefaultVariants } from './use-data-list-context';\n\n/*\n O espaçamento depende da orientação: em `horizontal` os itens ficam lado a lado e o respiro é\n * lateral, com o valor abaixo do rótulo; em `vertical` eles empilham e o respiro é vertical, com\n * rótulo e valor lado a lado.\n */\nexport const dataListItemVariants = cva(['flex'], {\n variants: {\n orientation: {\n horizontal: [\n 'flex-col',\n 'items-start',\n\n 'gap-1',\n 'px-2',\n\n 'first:pl-0',\n 'last:pr-0',\n ],\n vertical: [\n 'flex-row',\n 'items-center',\n 'justify-between',\n\n 'gap-4',\n 'py-2',\n\n 'first:pt-0',\n 'last:pb-0',\n ],\n },\n },\n defaultVariants: {\n orientation: dataListDefaultVariants.orientation,\n },\n});\n"],"mappings":";;;;;;;;AAQA,MAAa,uBAAuB,IAAI,CAAC,MAAM,GAAG;CAChD,UAAU,EACR,aAAa;EACX,YAAY;GACV;GACA;GAEA;GACA;GAEA;GACA;EACF;EACA,UAAU;GACR;GACA;GACA;GAEA;GACA;GAEA;GACA;EACF;CACF,EACF;CACA,iBAAiB,EACf,aAAa,wBAAwB,YACvC;AACF,CAAC"}

package/dist/components/display/data-list/data-list-item.js CHANGED Viewed

@@ -8,13 +8,10 @@ import { mergeProps, useRender } from "@base-ui/react";
 */
 const DataListItem = (props) => {
 	const { render, className, ...rest } = props;
-	const { orientation, size } = useDataListContext();
+	const { orientation } = useDataListContext();
 	const baseProps = {
 		"data-component": "DataList.Item",
-		className: mergeTwClassNames(dataListItemVariants({
-			orientation,
-			size
-		}), className)
+		className: mergeTwClassNames(dataListItemVariants({ orientation }), className)
 	};
 	return useRender({
 		render,

package/dist/components/display/data-list/data-list-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-list-item.js","names":[],"sources":["../../../../src/components/display/data-list/data-list-item.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\nimport { dataListItemVariants } from './data-list-item-variants';\nimport { useDataListContext } from './use-data-list-context';\n\nexport type DataListItemProps = useRender.ComponentProps<'div'>;\n\n/*\n Um par rótulo e valor. O `div` em volta de `dt` e `dd` é válido dentro de `dl`.\n */\nexport const DataListItem = (props: DataListItemProps) => {\n const { render, className, ...rest } = props;\n\n const { orientation, ~~size~~ } = useDataListContext();\n\n const baseProps = {\n 'data-component': 'DataList.Item',\n className: mergeTwClassNames(\n dataListItemVariants({ orientation, ~~size~~ }),\n className,\n ),\n };\n\n return useRender({\n render,\n defaultTagName: 'div',\n props: mergeProps(baseProps, rest),\n });\n};\n\nDataListItem.displayName = 'DataList.Item';\n"],"mappings":";;;;;;;;AAUA,MAAa,gBAAgB,UAA6B;CACxD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,EAAE,~~aAAa~~,~~SAAS,~~mBAAmB;~~CAEjD~~,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT,qBAAqB~~;GAAE;GAAa;EAAK~~,CAAC,~~GAC1C~~,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,aAAa,cAAc"}
1	+ {"version":3,"file":"data-list-item.js","names":[],"sources":["../../../../src/components/display/data-list/data-list-item.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\nimport { dataListItemVariants } from './data-list-item-variants';\nimport { useDataListContext } from './use-data-list-context';\n\nexport type DataListItemProps = useRender.ComponentProps<'div'>;\n\n/*\n Um par rótulo e valor. O `div` em volta de `dt` e `dd` é válido dentro de `dl`.\n */\nexport const DataListItem = (props: DataListItemProps) => {\n const { render, className, ...rest } = props;\n\n const { orientation } = useDataListContext();\n\n const baseProps = {\n 'data-component': 'DataList.Item',\n className: mergeTwClassNames(\n dataListItemVariants({ orientation }),\n className,\n ),\n };\n\n return useRender({\n render,\n defaultTagName: 'div',\n props: mergeProps(baseProps, rest),\n });\n};\n\nDataListItem.displayName = 'DataList.Item';\n"],"mappings":";;;;;;;;AAUA,MAAa,gBAAgB,UAA6B;CACxD,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,EAAE,gBAAgB,mBAAmB;CAE3C,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT,qBAAqB,EAAE,YAAY,CAAC,GACpC,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,aAAa,cAAc"}

package/dist/components/display/data-list/data-list-root-variants.d.ts CHANGED Viewed

@@ -1,8 +1,7 @@
 //#region src/components/display/data-list/data-list-root-variants.d.ts
 export declare const dataListRootVariants: (props?: ({
   divided?: boolean | null | undefined;
-  orientation?: "vertical" | "horizontal" | null | undefined;
-  size?: "sm" | "md" | "lg" | null | undefined;
+  orientation?: "horizontal" | "vertical" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 //#endregion
 //# sourceMappingURL=data-list-root-variants.d.ts.map

package/dist/components/display/data-list/data-list-root-variants.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-list-root-variants.d.ts","names":[],"sources":["../../../../src/components/display/data-list/data-list-root-variants.ts"],"mappings":";qBAGa,uBAAoB~~;;;;6CAiC~~/B"}
1	+ {"version":3,"file":"data-list-root-variants.d.ts","names":[],"sources":["../../../../src/components/display/data-list/data-list-root-variants.ts"],"mappings":";qBAGa,uBAAoB;;;6CA2B/B"}

package/dist/components/display/data-list/data-list-root-variants.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { dataListDefaultVariants } from "./use-data-list-context.js";
 import { cva } from "class-variance-authority";
 //#region src/components/display/data-list/data-list-root-variants.ts
-const dataListRootVariants = cva(["flex"], {
+const dataListRootVariants = cva(["flex", "text-sm"], {
 	variants: {
 		divided: {
 			true: [],
@@ -10,11 +10,6 @@ const dataListRootVariants = cva(["flex"], {
 		orientation: {
 			horizontal: ["flex-row"],
 			vertical: ["flex-col"]
-		},
-		size: {
-			sm: ["text-xs"],
-			md: ["text-sm"],
-			lg: ["text-base"]
 		}
 	},
 	compoundVariants: [{
@@ -28,8 +23,7 @@ const dataListRootVariants = cva(["flex"], {
 	}],
 	defaultVariants: {
 		divided: dataListDefaultVariants.divided,
-		orientation: dataListDefaultVariants.orientation,
-		size: dataListDefaultVariants.size
+		orientation: dataListDefaultVariants.orientation
 	}
 });
 //#endregion

package/dist/components/display/data-list/data-list-root-variants.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-list-root-variants.js","names":[],"sources":["../../../../src/components/display/data-list/data-list-root-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { dataListDefaultVariants } from './use-data-list-context';\n\nexport const dataListRootVariants = cva(['flex'], {\n variants: {\n divided: {\n true: [],\n false: [],\n },\n orientation: {\n horizontal: ['flex-row'],\n vertical: ['flex-col'],\n },\n ~~size: {\n sm: ['text-xs'],\n md: ['text-sm'],\n lg: ['text-base'],\n },\n~~ },\n compoundVariants: [\n {\n divided: true,\n orientation: 'horizontal',\n className: ['divide-x', 'divide-gray-6'],\n },\n {\n divided: true,\n orientation: 'vertical',\n className: ['divide-y', 'divide-gray-6'],\n },\n ],\n defaultVariants: {\n divided: dataListDefaultVariants.divided,\n orientation: dataListDefaultVariants.orientation,\n ~~size: dataListDefaultVariants.size,\n~~ },\n});\n"],"mappings":";;;AAGA,MAAa,uBAAuB,IAAI,CAAC,~~MAAM~~,GAAG;~~CAChD~~,UAAU;EACR,SAAS;GACP,MAAM,CAAC;GACP,OAAO,CAAC;EACV;EACA,aAAa;GACX,YAAY,CAAC,UAAU;GACvB,UAAU,CAAC,UAAU;EACvB;~~EACA,MAAM;GACJ,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,WAAW;EAClB;~~CACF;CACA,kBAAkB,CAChB;EACE,SAAS;EACT,aAAa;EACb,WAAW,CAAC,YAAY,eAAe;CACzC,GACA;EACE,SAAS;EACT,aAAa;EACb,WAAW,CAAC,YAAY,eAAe;CACzC,CACF;CACA,iBAAiB;EACf,SAAS,wBAAwB;EACjC,aAAa,wBAAwB;~~EACrC,MAAM,wBAAwB~~;~~CAChC;~~AACF,CAAC"}
1	+ {"version":3,"file":"data-list-root-variants.js","names":[],"sources":["../../../../src/components/display/data-list/data-list-root-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { dataListDefaultVariants } from './use-data-list-context';\n\nexport const dataListRootVariants = cva(['flex', 'text-sm'], {\n variants: {\n divided: {\n true: [],\n false: [],\n },\n orientation: {\n horizontal: ['flex-row'],\n vertical: ['flex-col'],\n },\n },\n compoundVariants: [\n {\n divided: true,\n orientation: 'horizontal',\n className: ['divide-x', 'divide-gray-6'],\n },\n {\n divided: true,\n orientation: 'vertical',\n className: ['divide-y', 'divide-gray-6'],\n },\n ],\n defaultVariants: {\n divided: dataListDefaultVariants.divided,\n orientation: dataListDefaultVariants.orientation,\n },\n});\n"],"mappings":";;;AAGA,MAAa,uBAAuB,IAAI,CAAC,QAAQ,SAAS,GAAG;CAC3D,UAAU;EACR,SAAS;GACP,MAAM,CAAC;GACP,OAAO,CAAC;EACV;EACA,aAAa;GACX,YAAY,CAAC,UAAU;GACvB,UAAU,CAAC,UAAU;EACvB;CACF;CACA,kBAAkB,CAChB;EACE,SAAS;EACT,aAAa;EACb,WAAW,CAAC,YAAY,eAAe;CACzC,GACA;EACE,SAAS;EACT,aAAa;EACb,WAAW,CAAC,YAAY,eAAe;CACzC,CACF;CACA,iBAAiB;EACf,SAAS,wBAAwB;EACjC,aAAa,wBAAwB;CACvC;AACF,CAAC"}

package/dist/components/display/data-list/data-list-root.js CHANGED Viewed

@@ -20,11 +20,7 @@ const splitVariantProps = createSplitProps();
 * ```
 */
 const DataListRoot = (props) => {
-	const [variantProps, elementProps] = splitVariantProps(props, [
-		"divided",
-		"orientation",
-		"size"
-	]);
+	const [variantProps, elementProps] = splitVariantProps(props, ["divided", "orientation"]);
 	const { render, className, ...rest } = elementProps;
 	const baseProps = {
 		"data-component": "DataList.Root",

package/dist/components/display/data-list/data-list-root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-list-root.js","names":[],"sources":["../../../../src/components/display/data-list/data-list-root.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { createSplitProps, type MergeOverride } from '@lucasbernardosn/utils';\nimport { mergeTwClassNames } from '#utils';\nimport { dataListRootVariants } from './data-list-root-variants';\nimport {\n DataListContextProvider,\n type DataListVariants,\n} from './use-data-list-context';\n\nexport type DataListRootProps = MergeOverride<\n useRender.ComponentProps<'dl'>,\n DataListVariants\n>;\n\nconst splitVariantProps = createSplitProps<DataListVariants>();\n\n/*\n Lista de pares rótulo e valor, renderizada como `dl`.\n \n @example\n * ```tsx\n * <DataList.Root>\n * <DataList.Item>\n * <DataList.ItemLabel>Status</DataList.ItemLabel>\n * <DataList.ItemValue>Ativo</DataList.ItemValue>\n * </DataList.Item>\n * </DataList.Root>\n * ```\n */\nexport const DataListRoot = (props: DataListRootProps) => {\n const [variantProps, elementProps] = splitVariantProps(props, [\n 'divided',\n 'orientation',\n ~~'size',\n~~ ]);\n\n const { render, className, ...rest } = elementProps;\n\n const baseProps = {\n 'data-component': 'DataList.Root',\n className: mergeTwClassNames(dataListRootVariants(variantProps), className),\n };\n\n return (\n <DataListContextProvider value={variantProps}>\n {useRender({\n render,\n defaultTagName: 'dl',\n props: mergeProps(baseProps, rest),\n })}\n </DataListContextProvider>\n );\n};\n\nDataListRoot.displayName = 'DataList.Root';\n"],"mappings":";;;;;;;AAcA,MAAM,oBAAoB,iBAAmC;;;;;;;;;;;;;;AAe7D,MAAa,gBAAgB,UAA6B;CACxD,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,qBAAqB,YAAY,GAAG,SAAS;CAC5E;CAEA,OACE,oBAAC,yBAAD;EAAyB,OAAO;EAC7B,UAAA,UAAU;GACT;GACA,gBAAgB;GAChB,OAAO,WAAW,WAAW,IAAI;EACnC,CAAC;CACsB,CAAA;AAE7B;AAEA,aAAa,cAAc"}
1	+ {"version":3,"file":"data-list-root.js","names":[],"sources":["../../../../src/components/display/data-list/data-list-root.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { createSplitProps, type MergeOverride } from '@lucasbernardosn/utils';\nimport { mergeTwClassNames } from '#utils';\nimport { dataListRootVariants } from './data-list-root-variants';\nimport {\n DataListContextProvider,\n type DataListVariants,\n} from './use-data-list-context';\n\nexport type DataListRootProps = MergeOverride<\n useRender.ComponentProps<'dl'>,\n DataListVariants\n>;\n\nconst splitVariantProps = createSplitProps<DataListVariants>();\n\n/*\n Lista de pares rótulo e valor, renderizada como `dl`.\n \n @example\n * ```tsx\n * <DataList.Root>\n * <DataList.Item>\n * <DataList.ItemLabel>Status</DataList.ItemLabel>\n * <DataList.ItemValue>Ativo</DataList.ItemValue>\n * </DataList.Item>\n * </DataList.Root>\n * ```\n */\nexport const DataListRoot = (props: DataListRootProps) => {\n const [variantProps, elementProps] = splitVariantProps(props, [\n 'divided',\n 'orientation',\n ]);\n\n const { render, className, ...rest } = elementProps;\n\n const baseProps = {\n 'data-component': 'DataList.Root',\n className: mergeTwClassNames(dataListRootVariants(variantProps), className),\n };\n\n return (\n <DataListContextProvider value={variantProps}>\n {useRender({\n render,\n defaultTagName: 'dl',\n props: mergeProps(baseProps, rest),\n })}\n </DataListContextProvider>\n );\n};\n\nDataListRoot.displayName = 'DataList.Root';\n"],"mappings":";;;;;;;AAcA,MAAM,oBAAoB,iBAAmC;;;;;;;;;;;;;;AAe7D,MAAa,gBAAgB,UAA6B;CACxD,MAAM,CAAC,cAAc,gBAAgB,kBAAkB,OAAO,CAC5D,WACA,aACF,CAAC;CAED,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBAAkB,qBAAqB,YAAY,GAAG,SAAS;CAC5E;CAEA,OACE,oBAAC,yBAAD;EAAyB,OAAO;EAC7B,UAAA,UAAU;GACT;GACA,gBAAgB;GAChB,OAAO,WAAW,WAAW,IAAI;EACnC,CAAC;CACsB,CAAA;AAE7B;AAEA,aAAa,cAAc"}

package/dist/components/display/data-list/use-data-list-context.d.ts CHANGED Viewed

@@ -16,12 +16,6 @@ export type DataListVariants = {
    * @default 'vertical'
    */
   orientation?: 'horizontal' | 'vertical';
-  /**
-   * Tamanho do texto e espaçamento dos itens.
-   *
-   * @default 'md'
-   */
-  size?: 'sm' | 'md' | 'lg';
 };
 export declare const dataListDefaultVariants: Required<DataListVariants>;
 export declare const DataListContextProvider: import("react").Provider<DataListVariants>, useDataListContext: () => DataListVariants;

package/dist/components/display/data-list/use-data-list-context.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-data-list-context.d.ts","names":[],"sources":["../../../../src/components/display/data-list/use-data-list-context.ts"],"mappings":";;;;YAKY;;;;;;EAMV;;;;;;;EAOA~~;;;;;;EAMA~~;;qBAGW,yBAAyB,SAAS;~~qBAMjC~~,yCAAuB,SAAA,mBAAE,0BAAkB"}
1	+ {"version":3,"file":"use-data-list-context.d.ts","names":[],"sources":["../../../../src/components/display/data-list/use-data-list-context.ts"],"mappings":";;;;YAKY;;;;;;EAMV;;;;;;;EAOA;;qBAGW,yBAAyB,SAAS;qBAKjC,yCAAuB,SAAA,mBAAE,0BAAkB"}

package/dist/components/display/data-list/use-data-list-context.js CHANGED Viewed

@@ -2,8 +2,7 @@ import { createContext } from "@lucasbernardosn/react-utils";
 //#region src/components/display/data-list/use-data-list-context.ts
 const dataListDefaultVariants = {
 	divided: false,
-	orientation: "vertical",
-	size: "md"
+	orientation: "vertical"
 };
 const [DataListContextProvider, useDataListContext] = createContext({
 	name: "DataListContext",

package/dist/components/display/data-list/use-data-list-context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-data-list-context.js","names":[],"sources":["../../../../src/components/display/data-list/use-data-list-context.ts"],"sourcesContent":["import { createContext } from '@lucasbernardosn/react-utils';\n\n/*\n Variantes do DataList. Informadas no `DataList.Root` e repassadas às partes por contexto.\n /\nexport type DataListVariants = {\n /\n Linha entre os itens.\n \n @default false\n /\n divided?: boolean;\n /\n Orientação da lista, não do par rótulo/valor: `vertical` empilha os itens, com rótulo e valor\n * lado a lado; `horizontal` põe os itens em linha, com o valor abaixo do rótulo.\n \n @default 'vertical'\n /\n orientation?: 'horizontal' \| 'vertical';\n ~~/\n Tamanho do texto e espaçamento dos itens.\n \n @default 'md'\n */\n size?: 'sm' \| 'md' \| 'lg';\n~~};\n\nexport const dataListDefaultVariants: Required<DataListVariants> = {\n divided: false,\n orientation: 'vertical',\n ~~size: 'md',\n~~};\n\nexport const [DataListContextProvider, useDataListContext] =\n createContext<DataListVariants>({\n name: 'DataListContext',\n providers: ['DataList.Root'],\n });\n"],"mappings":";;~~AA2BA~~,MAAa,0BAAsD;CACjE,SAAS;CACT,aAAa;~~CACb,MAAM~~;~~AACR;~~AAEA,MAAa,CAAC,yBAAyB,sBACrC,cAAgC;CAC9B,MAAM;CACN,WAAW,CAAC,eAAe;AAC7B,CAAC"}
1	+ {"version":3,"file":"use-data-list-context.js","names":[],"sources":["../../../../src/components/display/data-list/use-data-list-context.ts"],"sourcesContent":["import { createContext } from '@lucasbernardosn/react-utils';\n\n/*\n Variantes do DataList. Informadas no `DataList.Root` e repassadas às partes por contexto.\n /\nexport type DataListVariants = {\n /\n Linha entre os itens.\n \n @default false\n /\n divided?: boolean;\n /\n Orientação da lista, não do par rótulo/valor: `vertical` empilha os itens, com rótulo e valor\n * lado a lado; `horizontal` põe os itens em linha, com o valor abaixo do rótulo.\n \n @default 'vertical'\n */\n orientation?: 'horizontal' \| 'vertical';\n};\n\nexport const dataListDefaultVariants: Required<DataListVariants> = {\n divided: false,\n orientation: 'vertical',\n};\n\nexport const [DataListContextProvider, useDataListContext] =\n createContext<DataListVariants>({\n name: 'DataListContext',\n providers: ['DataList.Root'],\n });\n"],"mappings":";;AAqBA,MAAa,0BAAsD;CACjE,SAAS;CACT,aAAa;AACf;AAEA,MAAa,CAAC,yBAAyB,sBACrC,cAAgC;CAC9B,MAAM;CACN,WAAW,CAAC,eAAe;AAC7B,CAAC"}

package/dist/components/feedback/empty-state/empty-state-content.d.ts CHANGED Viewed

@@ -2,8 +2,7 @@ import { useRender } from "@base-ui/react";
 //#region src/components/feedback/empty-state/empty-state-content.d.ts
 export type EmptyStateContentProps = useRender.ComponentProps<'div'>;
 /**
- * Agrupa título e descrição, mais próximos entre si do que das outras partes, no espaço do `size`
- * do `EmptyState.Root`.
+ * Agrupa título e descrição, mais próximos entre si do que das outras partes.
  */
 export declare const EmptyStateContent: {
   (props: EmptyStateContentProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;

package/dist/components/feedback/empty-state/empty-state-content.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"empty-state-content.d.ts","names":[],"sources":["../../../../src/components/feedback/empty-state/empty-state-content.tsx"],"mappings":";;YAGY,yBAAyB,UAAU~~;;;;;qBAMlC~~;GAA4B,OAAA,yCAAsB,+CAAA"}
1	+ {"version":3,"file":"empty-state-content.d.ts","names":[],"sources":["../../../../src/components/feedback/empty-state/empty-state-content.tsx"],"mappings":";;YAGY,yBAAyB,UAAU;;;;qBAKlC;GAA4B,OAAA,yCAAsB,+CAAA"}

package/dist/components/feedback/empty-state/empty-state-content.js CHANGED Viewed

@@ -2,8 +2,7 @@ import { mergeTwClassNames } from "../../../utils/merge-class-names.js";
 import { mergeProps, useRender } from "@base-ui/react";
 //#region src/components/feedback/empty-state/empty-state-content.tsx
 /**
-* Agrupa título e descrição, mais próximos entre si do que das outras partes, no espaço do `size`
-* do `EmptyState.Root`.
+* Agrupa título e descrição, mais próximos entre si do que das outras partes.
 */
 const EmptyStateContent = (props) => {
 	const { render, className, ...rest } = props;
@@ -12,7 +11,7 @@ const EmptyStateContent = (props) => {
 		className: mergeTwClassNames([
 			"flex",
 			"flex-col",
-			"gap-(--empty-state-header-gap,--spacing(0.5))"
+			"gap-0.5"
 		], className)
 	};
 	return useRender({

package/dist/components/feedback/empty-state/empty-state-content.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"empty-state-content.js","names":[],"sources":["../../../../src/components/feedback/empty-state/empty-state-content.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type EmptyStateContentProps = useRender.ComponentProps<'div'>;\n\n/*\n Agrupa título e descrição, mais próximos entre si do que das outras partes~~, no espaço do `size`\~~n * do `EmptyState.Root`.\n */\nexport const EmptyStateContent = (props: EmptyStateContentProps) => {\n const { render, className, ...rest } = props;\n\n const baseProps = {\n 'data-component': 'EmptyState.Content',\n className: mergeTwClassNames(\n ['flex', 'flex-col', 'gap-~~(--empty-state-header-gap,--spacing(~~0.5))']~~,\n~~ className~~,\n~~ ),\n };\n\n return useRender({\n render,\n defaultTagName: 'div',\n props: mergeProps(baseProps, rest),\n });\n};\n\nEmptyStateContent.displayName = 'EmptyState.Content';\n"],"mappings":"~~;;;;;;;AASA~~,MAAa,qBAAqB,UAAkC;CAClE,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,~~kBACT~~;GAAC;GAAQ;GAAY;~~EAA+C~~,~~GACpE~~,~~SACF~~;~~CACF~~;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,kBAAkB,cAAc"}
1	+ {"version":3,"file":"empty-state-content.js","names":[],"sources":["../../../../src/components/feedback/empty-state/empty-state-content.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type EmptyStateContentProps = useRender.ComponentProps<'div'>;\n\n/*\n Agrupa título e descrição, mais próximos entre si do que das outras partes.\n */\nexport const EmptyStateContent = (props: EmptyStateContentProps) => {\n const { render, className, ...rest } = props;\n\n const baseProps = {\n 'data-component': 'EmptyState.Content',\n className: mergeTwClassNames(['flex', 'flex-col', 'gap-0.5'], className),\n };\n\n return useRender({\n render,\n defaultTagName: 'div',\n props: mergeProps(baseProps, rest),\n });\n};\n\nEmptyStateContent.displayName = 'EmptyState.Content';\n"],"mappings":";;;;;;AAQA,MAAa,qBAAqB,UAAkC;CAClE,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBAAkB;GAAC;GAAQ;GAAY;EAAS,GAAG,SAAS;CACzE;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,kBAAkB,cAAc"}

package/dist/components/feedback/empty-state/empty-state-description.d.ts CHANGED Viewed

@@ -2,8 +2,8 @@ import { useRender } from "@base-ui/react";
 //#region src/components/feedback/empty-state/empty-state-description.d.ts
 export type EmptyStateDescriptionProps = useRender.ComponentProps<'p'>;
 /**
- * Texto de apoio do estado vazio, em tom mais fraco que o título, no tamanho e na entrelinha do
- * `size` do `EmptyState.Root`.
+ * Texto de apoio do estado vazio, em tom mais fraco que o título, com a tipografia fixa das
+ * descrições.
  */
 export declare const EmptyStateDescription: {
   (props: EmptyStateDescriptionProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;

package/dist/components/feedback/empty-state/empty-state-description.js CHANGED Viewed

@@ -2,16 +2,16 @@ import { mergeTwClassNames } from "../../../utils/merge-class-names.js";
 import { mergeProps, useRender } from "@base-ui/react";
 //#region src/components/feedback/empty-state/empty-state-description.tsx
 /**
-* Texto de apoio do estado vazio, em tom mais fraco que o título, no tamanho e na entrelinha do
-* `size` do `EmptyState.Root`.
+* Texto de apoio do estado vazio, em tom mais fraco que o título, com a tipografia fixa das
+* descrições.
 */
 const EmptyStateDescription = (props) => {
 	const { render, className, ...rest } = props;
 	const baseProps = {
 		"data-component": "EmptyState.Description",
 		className: mergeTwClassNames([
-			"text-(length:--empty-state-description-size,var(--text-sm))",
-			"leading-(--empty-state-description-leading,--spacing(5))",
+			"text-sm",
+			"leading-5",
 			"text-gray-11",
 			"text-pretty"
 		], className)

package/dist/components/feedback/empty-state/empty-state-description.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"empty-state-description.js","names":[],"sources":["../../../../src/components/feedback/empty-state/empty-state-description.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type EmptyStateDescriptionProps = useRender.ComponentProps<'p'>;\n\n/*\n Texto de apoio do estado vazio, em tom mais fraco que o título, no ~~tamanho~~ e na ~~entrelinha do~~\n * ~~`size` do `EmptyState.Root`.\~~n */\nexport const EmptyStateDescription = (props: EmptyStateDescriptionProps) => {\n const { render, className, ...rest } = props;\n\n const baseProps = {\n 'data-component': 'EmptyState.Description',\n className: mergeTwClassNames(\n [\n 'text-~~(length:--empty-state-description-size,var(--text-~~sm))'~~,\n~~ 'leading-~~(--empty-state-description-leading,--spacing(~~5))'~~,\n~~ 'text-gray-11'~~,\n~~ 'text-pretty'~~,\n~~ ],\n className,\n ),\n };\n\n return useRender({\n render,\n defaultTagName: 'p',\n props: mergeProps(baseProps, rest),\n });\n};\n\nEmptyStateDescription.displayName = 'EmptyState.Description';\n"],"mappings":";;;;;;;AASA,MAAa,yBAAyB,UAAsC;CAC1E,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;~~GACE~~;~~GACA~~;~~GACA~~;~~GACA~~;~~EACF~~,~~GACA~~,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,sBAAsB,cAAc"}
1	+ {"version":3,"file":"empty-state-description.js","names":[],"sources":["../../../../src/components/feedback/empty-state/empty-state-description.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '#utils';\n\nexport type EmptyStateDescriptionProps = useRender.ComponentProps<'p'>;\n\n/*\n Texto de apoio do estado vazio, em tom mais fraco que o título, com a tipografia fixa das\n * descrições.\n */\nexport const EmptyStateDescription = (props: EmptyStateDescriptionProps) => {\n const { render, className, ...rest } = props;\n\n const baseProps = {\n 'data-component': 'EmptyState.Description',\n className: mergeTwClassNames(\n ['text-sm', 'leading-5', 'text-gray-11', 'text-pretty'],\n className,\n ),\n };\n\n return useRender({\n render,\n defaultTagName: 'p',\n props: mergeProps(baseProps, rest),\n });\n};\n\nEmptyStateDescription.displayName = 'EmptyState.Description';\n"],"mappings":";;;;;;;AASA,MAAa,yBAAyB,UAAsC;CAC1E,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBACT;GAAC;GAAW;GAAa;GAAgB;EAAa,GACtD,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,sBAAsB,cAAc"}