@lucasbernardosn/react-ui 0.0.0-stage → 0.1.0

package/dist/components/layout/splitter/splitter-panel.js

@@ -0,0 +1,40 @@
+import { mergeTwClassNames } from "../../../utils/merge-class-names.js";
+import { useSplitterContext } from "./use-splitter-context.js";
+import { createSplitProps } from "@lucasbernardosn/utils";
+import { mergeProps, useRender } from "@base-ui/react";
+import * as ZagSplitter from "@zag-js/splitter";
+//#region src/components/layout/splitter/splitter-panel.tsx
+const splitPanelProps = createSplitProps();
+/**
+* Painel redimensionável.
+*
+* O `id` liga o painel à entrada de mesmo `id` em `panels`, no `Splitter.Root`
+* — não é o `id` do elemento, que o Zag gera.
+*
+* O Zag escreve inline o tamanho (`flex-grow` em %, `flex-basis: 0`) e
+* `overflow: hidden`: conteúdo que rola precisa de uma área de rolagem dentro.
+* Um `style` passado aqui sobrescreve o do Zag chave a chave.
+*
+* O painel não declara `display`, então `hidden` o esconde, e os visíveis
+* dividem o espaço na proporção dos próprios tamanhos. O Zag continua contando
+* o escondido: esconda junto o puxador vizinho.
+*/
+const SplitterPanel = (props) => {
+	const [panelProps, elementProps] = splitPanelProps(props, ZagSplitter.panelProps);
+	const { render, className, ...rest } = elementProps;
+	const zagProps = useSplitterContext().getPanelProps(panelProps);
+	const baseProps = {
+		"data-component": "Splitter.Panel",
+		className: mergeTwClassNames([], className)
+	};
+	return useRender({
+		render,
+		defaultTagName: "div",
+		props: mergeProps(baseProps, zagProps, rest)
+	});
+};
+SplitterPanel.displayName = "Splitter.Panel";
+//#endregion
+export { SplitterPanel };
+
+//# sourceMappingURL=splitter-panel.js.map

package/dist/components/layout/splitter/splitter-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"splitter-panel.js","names":[],"sources":["../../../../src/components/layout/splitter/splitter-panel.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { createSplitProps, type MergeOverride } from '@lucasbernardosn/utils';\nimport * as ZagSplitter from '@zag-js/splitter';\nimport { mergeTwClassNames } from '#utils';\nimport { useSplitterContext } from './use-splitter-context';\n\n/**\n * Props do `Splitter.Panel`: o `id` do painel e as props do elemento\n * renderizado.\n */\nexport type SplitterPanelProps = MergeOverride<\n  useRender.ComponentProps<'div'>,\n  ZagSplitter.PanelProps\n>;\n\nconst splitPanelProps = createSplitProps<ZagSplitter.PanelProps>();\n\n/**\n * Painel redimensionável.\n *\n * O `id` liga o painel à entrada de mesmo `id` em `panels`, no `Splitter.Root`\n * — não é o `id` do elemento, que o Zag gera.\n *\n * O Zag escreve inline o tamanho (`flex-grow` em %, `flex-basis: 0`) e\n * `overflow: hidden`: conteúdo que rola precisa de uma área de rolagem dentro.\n * Um `style` passado aqui sobrescreve o do Zag chave a chave.\n *\n * O painel não declara `display`, então `hidden` o esconde, e os visíveis\n * dividem o espaço na proporção dos próprios tamanhos. O Zag continua contando\n * o escondido: esconda junto o puxador vizinho.\n */\nexport const SplitterPanel = (props: SplitterPanelProps) => {\n  const [panelProps, elementProps] = splitPanelProps(\n    props,\n    ZagSplitter.panelProps,\n  );\n\n  const { render, className, ...rest } = elementProps;\n\n  const splitter = useSplitterContext();\n\n  const zagProps = splitter.getPanelProps(panelProps);\n\n  const baseProps = {\n    'data-component': 'Splitter.Panel',\n    className: mergeTwClassNames([], className),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, zagProps, rest),\n  });\n};\n\nSplitterPanel.displayName = 'Splitter.Panel';\n"],"mappings":";;;;;;AAeA,MAAM,kBAAkB,iBAAyC;;;;;;;;;;;;;;;AAgBjE,MAAa,iBAAiB,UAA8B;CAC1D,MAAM,CAAC,YAAY,gBAAgB,gBACjC,OACA,YAAY,UACd;CAEA,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAIvC,MAAM,WAFW,mBAEO,CAAC,CAAC,cAAc,UAAU;CAElD,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBAAkB,CAAC,GAAG,SAAS;CAC5C;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,UAAU,IAAI;CAC7C,CAAC;AACH;AAEA,cAAc,cAAc"}

package/dist/components/layout/splitter/splitter-resize-trigger.d.ts

@@ -0,0 +1,34 @@
+import { MergeOverride } from "@lucasbernardosn/utils";
+import { useRender } from "@base-ui/react";
+import * as ZagSplitter from "@zag-js/splitter";
+//#region src/components/layout/splitter/splitter-resize-trigger.d.ts
+/**
+ * Props do `Splitter.ResizeTrigger`: o `id` do par de painéis, o `disabled` e
+ * as props do elemento renderizado.
+ */
+export type SplitterResizeTriggerProps = MergeOverride<useRender.ComponentProps<'button'>, ZagSplitter.ResizeTriggerProps>;
+/**
+ * Puxador entre dois painéis.
+ *
+ * O `id` nomeia o par no formato `antes:depois` (ex.: `nav:content`). Arrasto,
+ * setas (1% por tecla, 10% com `Shift`), `Home`/`End` e `F6` entre puxadores
+ * vêm do Zag. O rótulo acessível padrão é genérico: passe um `aria-label` que
+ * diga o que é redimensionado.
+ *
+ * **Não ocupa espaço no layout.** A linha de 1px é pintada sobre a última
+ * coluna do painel anterior, e a área de toque, de 9px, fica centrada nela: 4px
+ * de cada lado, por cima dos dois painéis. Com largura própria, os painéis
+ * dividiriam o espaço menos a do puxador, e um tamanho pedido em px sairia
+ * menor na tela. Uma barra de rolagem encostada na divisa fica sob a área de
+ * toque: afaste-a com padding no painel.
+ *
+ * Em repouso, só o cursor indica o puxador; o tom aparece no arrasto e no foco
+ * pelo teclado, e no foco a linha ganha a cor do anel de foco. O hover não
+ * muda nada, e ganha tom por classe no uso.
+ */
+export declare const SplitterResizeTrigger: {
+  (props: SplitterResizeTriggerProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=splitter-resize-trigger.d.ts.map

package/dist/components/layout/splitter/splitter-resize-trigger.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"splitter-resize-trigger.d.ts","names":[],"sources":["../../../../src/components/layout/splitter/splitter-resize-trigger.tsx"],"mappings":";;;;;;;;YAUY,6BAA6B,cACvC,UAAU,0BACV,YAAY;;;;;;;;;;;;;;;;;;;;qBAyBD;GAAgC,OAAA,6CAA0B,+CAAA"}

package/dist/components/layout/splitter/splitter-resize-trigger.js

@@ -0,0 +1,74 @@
+import { mergeTwClassNames } from "../../../utils/merge-class-names.js";
+import { useSplitterContext } from "./use-splitter-context.js";
+import { createSplitProps } from "@lucasbernardosn/utils";
+import { mergeProps, useRender } from "@base-ui/react";
+import * as ZagSplitter from "@zag-js/splitter";
+//#region src/components/layout/splitter/splitter-resize-trigger.tsx
+const splitResizeTriggerProps = createSplitProps();
+/**
+* Puxador entre dois painéis.
+*
+* O `id` nomeia o par no formato `antes:depois` (ex.: `nav:content`). Arrasto,
+* setas (1% por tecla, 10% com `Shift`), `Home`/`End` e `F6` entre puxadores
+* vêm do Zag. O rótulo acessível padrão é genérico: passe um `aria-label` que
+* diga o que é redimensionado.
+*
+* **Não ocupa espaço no layout.** A linha de 1px é pintada sobre a última
+* coluna do painel anterior, e a área de toque, de 9px, fica centrada nela: 4px
+* de cada lado, por cima dos dois painéis. Com largura própria, os painéis
+* dividiriam o espaço menos a do puxador, e um tamanho pedido em px sairia
+* menor na tela. Uma barra de rolagem encostada na divisa fica sob a área de
+* toque: afaste-a com padding no painel.
+*
+* Em repouso, só o cursor indica o puxador; o tom aparece no arrasto e no foco
+* pelo teclado, e no foco a linha ganha a cor do anel de foco. O hover não
+* muda nada, e ganha tom por classe no uso.
+*/
+const SplitterResizeTrigger = (props) => {
+	const [triggerProps, elementProps] = splitResizeTriggerProps(props, ZagSplitter.resizeTriggerProps);
+	const { render, className, ...rest } = elementProps;
+	const zagProps = useSplitterContext().getResizeTriggerProps(triggerProps);
+	const baseProps = {
+		"data-component": "Splitter.ResizeTrigger",
+		type: "button",
+		"aria-label": "Redimensionar painéis",
+		className: mergeTwClassNames([
+			"relative",
+			"z-10",
+			"outline-none",
+			"data-[orientation=horizontal]:w-0",
+			"data-[orientation=vertical]:h-0",
+			"after:absolute",
+			"after:content-['']",
+			"after:bg-gray-6",
+			"data-[orientation=horizontal]:after:inset-y-0",
+			"data-[orientation=horizontal]:after:-inset-s-px",
+			"data-[orientation=horizontal]:after:w-px",
+			"data-[orientation=vertical]:after:inset-x-0",
+			"data-[orientation=vertical]:after:-top-px",
+			"data-[orientation=vertical]:after:h-px",
+			"before:absolute",
+			"before:content-['']",
+			"before:transition-colors",
+			"data-[orientation=horizontal]:before:inset-y-0",
+			"data-[orientation=horizontal]:before:-inset-s-1.25",
+			"data-[orientation=horizontal]:before:w-2.25",
+			"data-[orientation=vertical]:before:inset-x-0",
+			"data-[orientation=vertical]:before:-top-1.25",
+			"data-[orientation=vertical]:before:h-2.25",
+			"focus-visible:before:bg-gray-6/50",
+			"focus-visible:after:bg-gray-9",
+			"data-dragging:before:bg-gray-6"
+		], className)
+	};
+	return useRender({
+		render,
+		defaultTagName: "button",
+		props: mergeProps(baseProps, zagProps, rest)
+	});
+};
+SplitterResizeTrigger.displayName = "Splitter.ResizeTrigger";
+//#endregion
+export { SplitterResizeTrigger };
+
+//# sourceMappingURL=splitter-resize-trigger.js.map

package/dist/components/layout/splitter/splitter-resize-trigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"splitter-resize-trigger.js","names":[],"sources":["../../../../src/components/layout/splitter/splitter-resize-trigger.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { createSplitProps, type MergeOverride } from '@lucasbernardosn/utils';\nimport * as ZagSplitter from '@zag-js/splitter';\nimport { mergeTwClassNames } from '#utils';\nimport { useSplitterContext } from './use-splitter-context';\n\n/**\n * Props do `Splitter.ResizeTrigger`: o `id` do par de painéis, o `disabled` e\n * as props do elemento renderizado.\n */\nexport type SplitterResizeTriggerProps = MergeOverride<\n  useRender.ComponentProps<'button'>,\n  ZagSplitter.ResizeTriggerProps\n>;\n\nconst splitResizeTriggerProps =\n  createSplitProps<ZagSplitter.ResizeTriggerProps>();\n\n/**\n * Puxador entre dois painéis.\n *\n * O `id` nomeia o par no formato `antes:depois` (ex.: `nav:content`). Arrasto,\n * setas (1% por tecla, 10% com `Shift`), `Home`/`End` e `F6` entre puxadores\n * vêm do Zag. O rótulo acessível padrão é genérico: passe um `aria-label` que\n * diga o que é redimensionado.\n *\n * **Não ocupa espaço no layout.** A linha de 1px é pintada sobre a última\n * coluna do painel anterior, e a área de toque, de 9px, fica centrada nela: 4px\n * de cada lado, por cima dos dois painéis. Com largura própria, os painéis\n * dividiriam o espaço menos a do puxador, e um tamanho pedido em px sairia\n * menor na tela. Uma barra de rolagem encostada na divisa fica sob a área de\n * toque: afaste-a com padding no painel.\n *\n * Em repouso, só o cursor indica o puxador; o tom aparece no arrasto e no foco\n * pelo teclado, e no foco a linha ganha a cor do anel de foco. O hover não\n * muda nada, e ganha tom por classe no uso.\n */\nexport const SplitterResizeTrigger = (props: SplitterResizeTriggerProps) => {\n  const [triggerProps, elementProps] = splitResizeTriggerProps(\n    props,\n    ZagSplitter.resizeTriggerProps,\n  );\n\n  const { render, className, ...rest } = elementProps;\n\n  const splitter = useSplitterContext();\n\n  const zagProps = splitter.getResizeTriggerProps(triggerProps);\n\n  const baseProps = {\n    'data-component': 'Splitter.ResizeTrigger',\n    // Sem `type`, um `button` dentro de `form` envia o formulário no clique.\n    type: 'button' as const,\n    'aria-label': 'Redimensionar painéis',\n    className: mergeTwClassNames(\n      [\n        'relative',\n        // Por cima dos painéis, inclusive dos filhos posicionados deles: a área\n        // de toque invade os dois lados da divisa.\n        'z-10',\n        'outline-none',\n\n        'data-[orientation=horizontal]:w-0',\n        'data-[orientation=vertical]:h-0',\n\n        // LINHA — 1px sobre a última coluna (ou linha) do painel anterior.\n        'after:absolute',\n        \"after:content-['']\",\n        'after:bg-gray-6',\n\n        'data-[orientation=horizontal]:after:inset-y-0',\n        'data-[orientation=horizontal]:after:-inset-s-px',\n        'data-[orientation=horizontal]:after:w-px',\n\n        'data-[orientation=vertical]:after:inset-x-0',\n        'data-[orientation=vertical]:after:-top-px',\n        'data-[orientation=vertical]:after:h-px',\n\n        // ÁREA DE TOQUE — centrada na linha, não na divisa: a linha está na coluna\n        // antes dela, e 4px + 1px + 4px exigem largura ímpar. Tingida no arrasto e\n        // no foco.\n        'before:absolute',\n        \"before:content-['']\",\n        'before:transition-colors',\n\n        'data-[orientation=horizontal]:before:inset-y-0',\n        'data-[orientation=horizontal]:before:-inset-s-1.25',\n        'data-[orientation=horizontal]:before:w-2.25',\n\n        'data-[orientation=vertical]:before:inset-x-0',\n        'data-[orientation=vertical]:before:-top-1.25',\n        'data-[orientation=vertical]:before:h-2.25',\n\n        // Sem tom no hover: a área de toque cobre a borda dos dois painéis, e\n        // passar o mouse por ali não deve acender nada. O Zag foca o puxador no\n        // clique sem `focus-visible`, então o tom de foco só vem do teclado.\n        'focus-visible:before:bg-gray-6/50',\n        // O tom da área sozinho tem pouco contraste: a linha marca o foco.\n        'focus-visible:after:bg-gray-9',\n        'data-dragging:before:bg-gray-6',\n      ],\n      className,\n    ),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'button',\n    props: mergeProps(baseProps, zagProps, rest),\n  });\n};\n\nSplitterResizeTrigger.displayName = 'Splitter.ResizeTrigger';\n"],"mappings":";;;;;;AAeA,MAAM,0BACJ,iBAAiD;;;;;;;;;;;;;;;;;;;;AAqBnD,MAAa,yBAAyB,UAAsC;CAC1E,MAAM,CAAC,cAAc,gBAAgB,wBACnC,OACA,YAAY,kBACd;CAEA,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAIvC,MAAM,WAFW,mBAEO,CAAC,CAAC,sBAAsB,YAAY;CAE5D,MAAM,YAAY;EAChB,kBAAkB;EAElB,MAAM;EACN,cAAc;EACd,WAAW,kBACT;GACE;GAGA;GACA;GAEA;GACA;GAGA;GACA;GACA;GAEA;GACA;GACA;GAEA;GACA;GACA;GAKA;GACA;GACA;GAEA;GACA;GACA;GAEA;GACA;GACA;GAKA;GAEA;GACA;EACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,UAAU,IAAI;CAC7C,CAAC;AACH;AAEA,sBAAsB,cAAc"}

package/dist/components/layout/splitter/splitter-root-provider.d.ts

@@ -0,0 +1,42 @@
+import { UseSplitterReturn } from "./use-splitter.js";
+import { MergeOverride } from "@lucasbernardosn/utils";
+import { useRender } from "@base-ui/react";
+//#region src/components/layout/splitter/splitter-root-provider.d.ts
+type RootProviderProps = {
+  /**
+   * Instância do Splitter criada com o hook `useSplitter`.
+   */
+  value: UseSplitterReturn;
+};
+/**
+ * Props do `Splitter.RootProvider`: a instância do Splitter e as props do
+ * elemento renderizado.
+ */
+export type SplitterRootProviderProps = MergeOverride<useRender.ComponentProps<'div'>, RootProviderProps>;
+/**
+ * Raiz do Splitter alimentada por uma instância criada fora dela.
+ *
+ * Recebe em `value` o retorno de `useSplitter`, o que permite ler os tamanhos
+ * e comandar os painéis de componentes irmãos — um botão que restaura o
+ * layout, ou um indicador da largura atual. Os estilos inline da raiz são os
+ * mesmos do `Splitter.Root`.
+ *
+ * @example
+ * ```tsx
+ * const splitter = useSplitter({ panels: [{ id: 'a' }, { id: 'b' }] });
+ *
+ * return (
+ *   <Splitter.RootProvider value={splitter}>
+ *     <Splitter.Panel id="a">A</Splitter.Panel>
+ *     <Splitter.ResizeTrigger id="a:b" />
+ *     <Splitter.Panel id="b">B</Splitter.Panel>
+ *   </Splitter.RootProvider>
+ * );
+ * ```
+ */
+export declare const SplitterRootProvider: {
+  (props: SplitterRootProviderProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=splitter-root-provider.d.ts.map

package/dist/components/layout/splitter/splitter-root-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"splitter-root-provider.d.ts","names":[],"sources":["../../../../src/components/layout/splitter/splitter-root-provider.tsx"],"mappings":";;;;KAMK;;;;EAIH,OAAO;;;;;;YAOG,4BAA4B,cACtC,UAAU,uBACV;;;;;;;;;;;;;;;;;;;;;;qBAwBW;GAA+B,OAAA,4CAAyB,IAAA"}

package/dist/components/layout/splitter/splitter-root-provider.js

@@ -0,0 +1,47 @@
+import { mergeTwClassNames } from "../../../utils/merge-class-names.js";
+import { SplitterContextProvider } from "./use-splitter-context.js";
+import { mergeProps, useRender } from "@base-ui/react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/layout/splitter/splitter-root-provider.tsx
+/**
+* Raiz do Splitter alimentada por uma instância criada fora dela.
+*
+* Recebe em `value` o retorno de `useSplitter`, o que permite ler os tamanhos
+* e comandar os painéis de componentes irmãos — um botão que restaura o
+* layout, ou um indicador da largura atual. Os estilos inline da raiz são os
+* mesmos do `Splitter.Root`.
+*
+* @example
+* ```tsx
+* const splitter = useSplitter({ panels: [{ id: 'a' }, { id: 'b' }] });
+*
+* return (
+*   <Splitter.RootProvider value={splitter}>
+*     <Splitter.Panel id="a">A</Splitter.Panel>
+*     <Splitter.ResizeTrigger id="a:b" />
+*     <Splitter.Panel id="b">B</Splitter.Panel>
+*   </Splitter.RootProvider>
+* );
+* ```
+*/
+const SplitterRootProvider = (props) => {
+	const { value: splitter, render, className, ...rest } = props;
+	const zagProps = splitter.getRootProps();
+	const baseProps = {
+		"data-component": "Splitter.RootProvider",
+		className: mergeTwClassNames([], className)
+	};
+	return /* @__PURE__ */ jsx(SplitterContextProvider, {
+		value: splitter,
+		children: useRender({
+			render,
+			defaultTagName: "div",
+			props: mergeProps(baseProps, zagProps, rest)
+		})
+	});
+};
+SplitterRootProvider.displayName = "Splitter.RootProvider";
+//#endregion
+export { SplitterRootProvider };
+
+//# sourceMappingURL=splitter-root-provider.js.map

package/dist/components/layout/splitter/splitter-root-provider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"splitter-root-provider.js","names":[],"sources":["../../../../src/components/layout/splitter/splitter-root-provider.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport type { MergeOverride } from '@lucasbernardosn/utils';\nimport { mergeTwClassNames } from '#utils';\nimport type { UseSplitterReturn } from './use-splitter';\nimport { SplitterContextProvider } from './use-splitter-context';\n\ntype RootProviderProps = {\n  /**\n   * Instância do Splitter criada com o hook `useSplitter`.\n   */\n  value: UseSplitterReturn;\n};\n\n/**\n * Props do `Splitter.RootProvider`: a instância do Splitter e as props do\n * elemento renderizado.\n */\nexport type SplitterRootProviderProps = MergeOverride<\n  useRender.ComponentProps<'div'>,\n  RootProviderProps\n>;\n\n/**\n * Raiz do Splitter alimentada por uma instância criada fora dela.\n *\n * Recebe em `value` o retorno de `useSplitter`, o que permite ler os tamanhos\n * e comandar os painéis de componentes irmãos — um botão que restaura o\n * layout, ou um indicador da largura atual. Os estilos inline da raiz são os\n * mesmos do `Splitter.Root`.\n *\n * @example\n * ```tsx\n * const splitter = useSplitter({ panels: [{ id: 'a' }, { id: 'b' }] });\n *\n * return (\n *   <Splitter.RootProvider value={splitter}>\n *     <Splitter.Panel id=\"a\">A</Splitter.Panel>\n *     <Splitter.ResizeTrigger id=\"a:b\" />\n *     <Splitter.Panel id=\"b\">B</Splitter.Panel>\n *   </Splitter.RootProvider>\n * );\n * ```\n */\nexport const SplitterRootProvider = (props: SplitterRootProviderProps) => {\n  const { value: splitter, render, className, ...rest } = props;\n\n  const zagProps = splitter.getRootProps();\n\n  const baseProps = {\n    'data-component': 'Splitter.RootProvider',\n    className: mergeTwClassNames([], className),\n  };\n\n  return (\n    <SplitterContextProvider value={splitter}>\n      {useRender({\n        render,\n        defaultTagName: 'div',\n        props: mergeProps(baseProps, zagProps, rest),\n      })}\n    </SplitterContextProvider>\n  );\n};\n\nSplitterRootProvider.displayName = 'Splitter.RootProvider';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,MAAa,wBAAwB,UAAqC;CACxE,MAAM,EAAE,OAAO,UAAU,QAAQ,WAAW,GAAG,SAAS;CAExD,MAAM,WAAW,SAAS,aAAa;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBAAkB,CAAC,GAAG,SAAS;CAC5C;CAEA,OACE,oBAAC,yBAAD;EAAyB,OAAO;EAC7B,UAAA,UAAU;GACT;GACA,gBAAgB;GAChB,OAAO,WAAW,WAAW,UAAU,IAAI;EAC7C,CAAC;CACsB,CAAA;AAE7B;AAEA,qBAAqB,cAAc"}

package/dist/components/layout/splitter/splitter-root.d.ts

@@ -0,0 +1,43 @@
+import { UseSplitterProps } from "./use-splitter.js";
+import { MergeOverride } from "@lucasbernardosn/utils";
+import { useRender } from "@base-ui/react";
+//#region src/components/layout/splitter/splitter-root.d.ts
+/**
+ * Props do `Splitter.Root`: as opções do Splitter e as props do elemento
+ * renderizado.
+ */
+export type SplitterRootProps = MergeOverride<useRender.ComponentProps<'div'>, UseSplitterProps>;
+/**
+ * Raiz do Splitter.
+ *
+ * Cria a máquina de redimensionamento e disponibiliza os tamanhos e os
+ * comandos para as partes aninhadas. Em `panels` ficam as restrições de cada
+ * painel; `minSize`, `maxSize` e `defaultSize` aceitam número (%) ou texto com
+ * unidade (`'240px'`, `'20rem'`), convertido para % a cada medida da raiz.
+ *
+ * O Zag escreve inline `display: flex`, a direção, `width`/`height: 100%` e
+ * `overflow: hidden` — classe nenhuma muda isso. Numa coluna flex, a raiz
+ * encolhe para caber ao lado dos irmãos: o `overflow: hidden` zera o mínimo
+ * automático, e o `height: 100%` vira só a base.
+ *
+ * Use o `Splitter.RootProvider` no lugar deste componente quando os tamanhos
+ * precisarem ser lidos ou comandados de fora da própria subárvore.
+ *
+ * @example
+ * ```tsx
+ * <Splitter.Root
+ *   panels={[{ id: 'a', minSize: 20 }, { id: 'b', minSize: 20 }]}
+ *   defaultSize={[40, 60]}
+ * >
+ *   <Splitter.Panel id="a">A</Splitter.Panel>
+ *   <Splitter.ResizeTrigger id="a:b" />
+ *   <Splitter.Panel id="b">B</Splitter.Panel>
+ * </Splitter.Root>
+ * ```
+ */
+export declare const SplitterRoot: {
+  (props: SplitterRootProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=splitter-root.d.ts.map

package/dist/components/layout/splitter/splitter-root.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"splitter-root.d.ts","names":[],"sources":["../../../../src/components/layout/splitter/splitter-root.tsx"],"mappings":";;;;;;;;YAWY,oBAAoB,cAC9B,UAAU,uBACV;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAiCW;GAAuB,OAAA,oCAAiB,IAAA"}

package/dist/components/layout/splitter/splitter-root.js

@@ -0,0 +1,60 @@
+import { mergeTwClassNames } from "../../../utils/merge-class-names.js";
+import { SplitterContextProvider } from "./use-splitter-context.js";
+import { useSplitter } from "./use-splitter.js";
+import { createSplitProps } from "@lucasbernardosn/utils";
+import { mergeProps, useRender } from "@base-ui/react";
+import { jsx } from "react/jsx-runtime";
+import * as ZagSplitter from "@zag-js/splitter";
+//#region src/components/layout/splitter/splitter-root.tsx
+const splitRootProps = createSplitProps();
+/**
+* Raiz do Splitter.
+*
+* Cria a máquina de redimensionamento e disponibiliza os tamanhos e os
+* comandos para as partes aninhadas. Em `panels` ficam as restrições de cada
+* painel; `minSize`, `maxSize` e `defaultSize` aceitam número (%) ou texto com
+* unidade (`'240px'`, `'20rem'`), convertido para % a cada medida da raiz.
+*
+* O Zag escreve inline `display: flex`, a direção, `width`/`height: 100%` e
+* `overflow: hidden` — classe nenhuma muda isso. Numa coluna flex, a raiz
+* encolhe para caber ao lado dos irmãos: o `overflow: hidden` zera o mínimo
+* automático, e o `height: 100%` vira só a base.
+*
+* Use o `Splitter.RootProvider` no lugar deste componente quando os tamanhos
+* precisarem ser lidos ou comandados de fora da própria subárvore.
+*
+* @example
+* ```tsx
+* <Splitter.Root
+*   panels={[{ id: 'a', minSize: 20 }, { id: 'b', minSize: 20 }]}
+*   defaultSize={[40, 60]}
+* >
+*   <Splitter.Panel id="a">A</Splitter.Panel>
+*   <Splitter.ResizeTrigger id="a:b" />
+*   <Splitter.Panel id="b">B</Splitter.Panel>
+* </Splitter.Root>
+* ```
+*/
+const SplitterRoot = (props) => {
+	const [useSplitterProps, elementProps] = splitRootProps(props, ZagSplitter.props);
+	const { render, className, ...rest } = elementProps;
+	const splitter = useSplitter(useSplitterProps);
+	const zagProps = splitter.getRootProps();
+	const baseProps = {
+		"data-component": "Splitter.Root",
+		className: mergeTwClassNames([], className)
+	};
+	return /* @__PURE__ */ jsx(SplitterContextProvider, {
+		value: splitter,
+		children: useRender({
+			render,
+			defaultTagName: "div",
+			props: mergeProps(baseProps, zagProps, rest)
+		})
+	});
+};
+SplitterRoot.displayName = "Splitter.Root";
+//#endregion
+export { SplitterRoot };
+
+//# sourceMappingURL=splitter-root.js.map

package/dist/components/layout/splitter/splitter-root.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"splitter-root.js","names":[],"sources":["../../../../src/components/layout/splitter/splitter-root.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { createSplitProps, type MergeOverride } from '@lucasbernardosn/utils';\nimport * as ZagSplitter from '@zag-js/splitter';\nimport { mergeTwClassNames } from '#utils';\nimport { type UseSplitterProps, useSplitter } from './use-splitter';\nimport { SplitterContextProvider } from './use-splitter-context';\n\n/**\n * Props do `Splitter.Root`: as opções do Splitter e as props do elemento\n * renderizado.\n */\nexport type SplitterRootProps = MergeOverride<\n  useRender.ComponentProps<'div'>,\n  UseSplitterProps\n>;\n\nconst splitRootProps = createSplitProps<UseSplitterProps>();\n\n/**\n * Raiz do Splitter.\n *\n * Cria a máquina de redimensionamento e disponibiliza os tamanhos e os\n * comandos para as partes aninhadas. Em `panels` ficam as restrições de cada\n * painel; `minSize`, `maxSize` e `defaultSize` aceitam número (%) ou texto com\n * unidade (`'240px'`, `'20rem'`), convertido para % a cada medida da raiz.\n *\n * O Zag escreve inline `display: flex`, a direção, `width`/`height: 100%` e\n * `overflow: hidden` — classe nenhuma muda isso. Numa coluna flex, a raiz\n * encolhe para caber ao lado dos irmãos: o `overflow: hidden` zera o mínimo\n * automático, e o `height: 100%` vira só a base.\n *\n * Use o `Splitter.RootProvider` no lugar deste componente quando os tamanhos\n * precisarem ser lidos ou comandados de fora da própria subárvore.\n *\n * @example\n * ```tsx\n * <Splitter.Root\n *   panels={[{ id: 'a', minSize: 20 }, { id: 'b', minSize: 20 }]}\n *   defaultSize={[40, 60]}\n * >\n *   <Splitter.Panel id=\"a\">A</Splitter.Panel>\n *   <Splitter.ResizeTrigger id=\"a:b\" />\n *   <Splitter.Panel id=\"b\">B</Splitter.Panel>\n * </Splitter.Root>\n * ```\n */\nexport const SplitterRoot = (props: SplitterRootProps) => {\n  const [useSplitterProps, elementProps] = splitRootProps(\n    props,\n    ZagSplitter.props,\n  );\n\n  const { render, className, ...rest } = elementProps;\n\n  const splitter = useSplitter(useSplitterProps);\n\n  const zagProps = splitter.getRootProps();\n\n  const baseProps = {\n    'data-component': 'Splitter.Root',\n    className: mergeTwClassNames([], className),\n  };\n\n  return (\n    <SplitterContextProvider value={splitter}>\n      {useRender({\n        render,\n        defaultTagName: 'div',\n        props: mergeProps(baseProps, zagProps, rest),\n      })}\n    </SplitterContextProvider>\n  );\n};\n\nSplitterRoot.displayName = 'Splitter.Root';\n"],"mappings":";;;;;;;;AAgBA,MAAM,iBAAiB,iBAAmC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8B1D,MAAa,gBAAgB,UAA6B;CACxD,MAAM,CAAC,kBAAkB,gBAAgB,eACvC,OACA,YAAY,KACd;CAEA,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,WAAW,YAAY,gBAAgB;CAE7C,MAAM,WAAW,SAAS,aAAa;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,WAAW,kBAAkB,CAAC,GAAG,SAAS;CAC5C;CAEA,OACE,oBAAC,yBAAD;EAAyB,OAAO;EAC7B,UAAA,UAAU;GACT;GACA,gBAAgB;GAChB,OAAO,WAAW,WAAW,UAAU,IAAI;EAC7C,CAAC;CACsB,CAAA;AAE7B;AAEA,aAAa,cAAc"}

package/dist/components/layout/splitter/use-splitter-context.d.ts

@@ -0,0 +1,11 @@
+import { UseSplitterReturn } from "./use-splitter.js";
+//#region src/components/layout/splitter/use-splitter-context.d.ts
+/**
+ * Provider e hook para acessar a API do Splitter.
+ *
+ * O hook lança um erro quando chamado fora de um `Splitter.Root` ou
+ * `Splitter.RootProvider`.
+ */
+export declare const SplitterContextProvider: import("react").Provider<UseSplitterReturn>, useSplitterContext: () => UseSplitterReturn;
+//#endregion
+//# sourceMappingURL=use-splitter-context.d.ts.map

package/dist/components/layout/splitter/use-splitter-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-splitter-context.d.ts","names":[],"sources":["../../../../src/components/layout/splitter/use-splitter-context.ts"],"mappings":";;;;;;;;qBASc,yCAAuB,SAAA,oBAAE,0BAAkB"}

package/dist/components/layout/splitter/use-splitter-context.js

@@ -0,0 +1,16 @@
+import { createContext } from "@lucasbernardosn/react-utils";
+//#region src/components/layout/splitter/use-splitter-context.ts
+/**
+* Provider e hook para acessar a API do Splitter.
+*
+* O hook lança um erro quando chamado fora de um `Splitter.Root` ou
+* `Splitter.RootProvider`.
+*/
+const [SplitterContextProvider, useSplitterContext] = createContext({
+	name: "SplitterContext",
+	providers: ["Splitter.Root", "Splitter.RootProvider"]
+});
+//#endregion
+export { SplitterContextProvider, useSplitterContext };
+
+//# sourceMappingURL=use-splitter-context.js.map

package/dist/components/layout/splitter/use-splitter-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-splitter-context.js","names":[],"sources":["../../../../src/components/layout/splitter/use-splitter-context.ts"],"sourcesContent":["import { createContext } from '@lucasbernardosn/react-utils';\nimport type { UseSplitterReturn } from './use-splitter';\n\n/**\n * Provider e hook para acessar a API do Splitter.\n *\n * O hook lança um erro quando chamado fora de um `Splitter.Root` ou\n * `Splitter.RootProvider`.\n */\nexport const [SplitterContextProvider, useSplitterContext] =\n  createContext<UseSplitterReturn>({\n    name: 'SplitterContext',\n    providers: ['Splitter.Root', 'Splitter.RootProvider'],\n  });\n"],"mappings":";;;;;;;;AASA,MAAa,CAAC,yBAAyB,sBACrC,cAAiC;CAC/B,MAAM;CACN,WAAW,CAAC,iBAAiB,uBAAuB;AACtD,CAAC"}

package/dist/components/layout/splitter/use-splitter.d.ts

@@ -0,0 +1,47 @@
+import { Optional } from "@lucasbernardosn/utils";
+import { PropTypes } from "@zag-js/react";
+import * as ZagSplitter from "@zag-js/splitter";
+//#region src/components/layout/splitter/use-splitter.d.ts
+/**
+ * Propriedades do hook `useSplitter`.
+ *
+ * São as mesmas opções aceitas pelo `Splitter.Root`, com o `id` opcional — um
+ * id único é gerado quando ele não é informado.
+ */
+export type UseSplitterProps = Optional<ZagSplitter.Props, 'id'>;
+/**
+ * Retorno do hook `useSplitter`: a API completa do Splitter, com os tamanhos
+ * atuais, o estado de arrasto, os comandos (`setSizes`, `resetSizes`,
+ * `collapsePanel`…) e as props de cada parte.
+ */
+export type UseSplitterReturn = ZagSplitter.Api<PropTypes>;
+/**
+ * Cria e gerencia o estado de um Splitter.
+ *
+ * Use junto do `Splitter.RootProvider` quando for preciso ler ou comandar os
+ * tamanhos de fora da subárvore do componente. Nos casos comuns prefira o
+ * `Splitter.Root`, que chama este hook internamente.
+ *
+ * O componente que chama o hook re-renderiza a cada quadro do arrasto. Quando
+ * ele monta uma árvore grande, prefira o `Splitter.Root` e leia a API com
+ * `useSplitterContext` num componente pequeno, só onde ela é usada.
+ *
+ * @example
+ * ```tsx
+ * const splitter = useSplitter({
+ *   panels: [{ id: 'a' }, { id: 'b' }],
+ *   defaultSize: [50, 50],
+ * });
+ *
+ * return (
+ *   <>
+ *     <button onClick={() => splitter.resetSizes()}>Restaurar</button>
+ *
+ *     <Splitter.RootProvider value={splitter}>…</Splitter.RootProvider>
+ *   </>
+ * );
+ * ```
+ */
+export declare const useSplitter: (props: UseSplitterProps) => UseSplitterReturn;
+//#endregion
+//# sourceMappingURL=use-splitter.d.ts.map

package/dist/components/layout/splitter/use-splitter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-splitter.d.ts","names":[],"sources":["../../../../src/components/layout/splitter/use-splitter.ts"],"mappings":";;;;;;;;;;YAWY,mBAAmB,SAAS,YAAY;;;;;;YAOxC,oBAAoB,YAAY,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA6BnC,cAAe,OAAO,qBAAmB"}

package/dist/components/layout/splitter/use-splitter.js

@@ -0,0 +1,43 @@
+import { useId } from "react";
+import { normalizeProps, useMachine } from "@zag-js/react";
+import * as ZagSplitter from "@zag-js/splitter";
+//#region src/components/layout/splitter/use-splitter.ts
+/**
+* Cria e gerencia o estado de um Splitter.
+*
+* Use junto do `Splitter.RootProvider` quando for preciso ler ou comandar os
+* tamanhos de fora da subárvore do componente. Nos casos comuns prefira o
+* `Splitter.Root`, que chama este hook internamente.
+*
+* O componente que chama o hook re-renderiza a cada quadro do arrasto. Quando
+* ele monta uma árvore grande, prefira o `Splitter.Root` e leia a API com
+* `useSplitterContext` num componente pequeno, só onde ela é usada.
+*
+* @example
+* ```tsx
+* const splitter = useSplitter({
+*   panels: [{ id: 'a' }, { id: 'b' }],
+*   defaultSize: [50, 50],
+* });
+*
+* return (
+*   <>
+*     <button onClick={() => splitter.resetSizes()}>Restaurar</button>
+*
+*     <Splitter.RootProvider value={splitter}>…</Splitter.RootProvider>
+*   </>
+* );
+* ```
+*/
+const useSplitter = (props) => {
+	const id = useId();
+	const service = useMachine(ZagSplitter.machine, {
+		id,
+		...props
+	});
+	return ZagSplitter.connect(service, normalizeProps);
+};
+//#endregion
+export { useSplitter };
+
+//# sourceMappingURL=use-splitter.js.map

package/dist/components/layout/splitter/use-splitter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-splitter.js","names":[],"sources":["../../../../src/components/layout/splitter/use-splitter.ts"],"sourcesContent":["import type { Optional } from '@lucasbernardosn/utils';\nimport { normalizeProps, type PropTypes, useMachine } from '@zag-js/react';\nimport * as ZagSplitter from '@zag-js/splitter';\nimport { useId } from 'react';\n\n/**\n * Propriedades do hook `useSplitter`.\n *\n * São as mesmas opções aceitas pelo `Splitter.Root`, com o `id` opcional — um\n * id único é gerado quando ele não é informado.\n */\nexport type UseSplitterProps = Optional<ZagSplitter.Props, 'id'>;\n\n/**\n * Retorno do hook `useSplitter`: a API completa do Splitter, com os tamanhos\n * atuais, o estado de arrasto, os comandos (`setSizes`, `resetSizes`,\n * `collapsePanel`…) e as props de cada parte.\n */\nexport type UseSplitterReturn = ZagSplitter.Api<PropTypes>;\n\n/**\n * Cria e gerencia o estado de um Splitter.\n *\n * Use junto do `Splitter.RootProvider` quando for preciso ler ou comandar os\n * tamanhos de fora da subárvore do componente. Nos casos comuns prefira o\n * `Splitter.Root`, que chama este hook internamente.\n *\n * O componente que chama o hook re-renderiza a cada quadro do arrasto. Quando\n * ele monta uma árvore grande, prefira o `Splitter.Root` e leia a API com\n * `useSplitterContext` num componente pequeno, só onde ela é usada.\n *\n * @example\n * ```tsx\n * const splitter = useSplitter({\n *   panels: [{ id: 'a' }, { id: 'b' }],\n *   defaultSize: [50, 50],\n * });\n *\n * return (\n *   <>\n *     <button onClick={() => splitter.resetSizes()}>Restaurar</button>\n *\n *     <Splitter.RootProvider value={splitter}>…</Splitter.RootProvider>\n *   </>\n * );\n * ```\n */\nexport const useSplitter = (props: UseSplitterProps): UseSplitterReturn => {\n  // Id de fallback: só é usado quando `props.id` não é informado.\n  const id = useId();\n\n  const service = useMachine(ZagSplitter.machine, { id, ...props });\n\n  return ZagSplitter.connect(service, normalizeProps);\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+CA,MAAa,eAAe,UAA+C;CAEzE,MAAM,KAAK,MAAM;CAEjB,MAAM,UAAU,WAAW,YAAY,SAAS;EAAE;EAAI,GAAG;CAAM,CAAC;CAEhE,OAAO,YAAY,QAAQ,SAAS,cAAc;AACpD"}

package/dist/components/layout/stack/h-stack.d.ts

@@ -0,0 +1,12 @@
+import { StackProps } from "./stack.js";
+//#region src/components/layout/stack/h-stack.d.ts
+export type HStackProps = Omit<StackProps, 'direction'>;
+/**
+ * `Stack` em linha, com os itens centralizados no eixo vertical.
+ */
+export declare const HStack: {
+  (props: HStackProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=h-stack.d.ts.map

package/dist/components/layout/stack/h-stack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"h-stack.d.ts","names":[],"sources":["../../../../src/components/layout/stack/h-stack.tsx"],"mappings":";;YAGY,cAAc,KAAK;;;;qBAKlB;GAAiB,OAAA,8BAAW,IAAA"}

package/dist/components/layout/stack/h-stack.js

@@ -0,0 +1,21 @@
+import { mergeTwClassNames } from "../../../utils/merge-class-names.js";
+import { Stack } from "./stack.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/layout/stack/h-stack.tsx
+/**
+* `Stack` em linha, com os itens centralizados no eixo vertical.
+*/
+const HStack = (props) => {
+	const { className, ...rest } = props;
+	return /* @__PURE__ */ jsx(Stack, {
+		"data-component": "HStack",
+		...rest,
+		className: mergeTwClassNames(["items-center"], className),
+		direction: "row"
+	});
+};
+HStack.displayName = "HStack";
+//#endregion
+export { HStack };
+
+//# sourceMappingURL=h-stack.js.map

package/dist/components/layout/stack/h-stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"h-stack.js","names":[],"sources":["../../../../src/components/layout/stack/h-stack.tsx"],"sourcesContent":["import { mergeTwClassNames } from '#utils';\nimport { Stack, type StackProps } from './stack';\n\nexport type HStackProps = Omit<StackProps, 'direction'>;\n\n/**\n * `Stack` em linha, com os itens centralizados no eixo vertical.\n */\nexport const HStack = (props: HStackProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <Stack\n      data-component=\"HStack\"\n      {...rest}\n      className={mergeTwClassNames(['items-center'], className)}\n      direction=\"row\"\n    />\n  );\n};\n\nHStack.displayName = 'HStack';\n"],"mappings":";;;;;;;AAQA,MAAa,UAAU,UAAuB;CAC5C,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAAC,OAAD;EACE,kBAAe;EACf,GAAI;EACJ,WAAW,kBAAkB,CAAC,cAAc,GAAG,SAAS;EACxD,WAAU;CACX,CAAA;AAEL;AAEA,OAAO,cAAc"}

package/dist/components/layout/stack/index.d.ts

@@ -0,0 +1,5 @@
+import { StackVariants } from "./stack-variants.js";
+import { Stack, StackProps } from "./stack.js";
+import { HStack, HStackProps } from "./h-stack.js";
+import { VStack, VStackProps } from "./v-stack.js";
+export { HStack, type HStackProps, Stack, type StackProps, type StackVariants, VStack, type VStackProps };

package/dist/components/layout/stack/index.js

@@ -0,0 +1,4 @@
+import { Stack } from "./stack.js";
+import { HStack } from "./h-stack.js";
+import { VStack } from "./v-stack.js";
+export { HStack, Stack, VStack };

package/dist/components/layout/stack/stack-variants.d.ts

@@ -0,0 +1,15 @@
+//#region src/components/layout/stack/stack-variants.d.ts
+export type StackVariants = {
+  /**
+   * Direção em que os itens são empilhados.
+   *
+   * @default 'col'
+   */
+  direction?: 'col' | 'row' | 'col-reverse' | 'row-reverse';
+};
+export declare const stackDefaultVariants: Required<StackVariants>;
+export declare const stackVariants: (props?: ({
+  direction?: "col" | "row" | "col-reverse" | "row-reverse" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+//#endregion
+//# sourceMappingURL=stack-variants.d.ts.map

package/dist/components/layout/stack/stack-variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack-variants.d.ts","names":[],"sources":["../../../../src/components/layout/stack/stack-variants.ts"],"mappings":";YAEY;;;;;;EAMV;;qBAGW,sBAAsB,SAAS;qBAI/B,gBAAa;;6CAYxB"}

package/dist/components/layout/stack/stack-variants.js

@@ -0,0 +1,16 @@
+import { cva } from "class-variance-authority";
+//#region src/components/layout/stack/stack-variants.ts
+const stackDefaultVariants = { direction: "col" };
+const stackVariants = cva(["flex", "gap-2"], {
+	variants: { direction: {
+		col: ["flex-col"],
+		row: ["flex-row"],
+		"col-reverse": ["flex-col-reverse"],
+		"row-reverse": ["flex-row-reverse"]
+	} },
+	defaultVariants: { direction: stackDefaultVariants.direction }
+});
+//#endregion
+export { stackDefaultVariants, stackVariants };
+
+//# sourceMappingURL=stack-variants.js.map

package/dist/components/layout/stack/stack-variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack-variants.js","names":[],"sources":["../../../../src/components/layout/stack/stack-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport type StackVariants = {\n  /**\n   * Direção em que os itens são empilhados.\n   *\n   * @default 'col'\n   */\n  direction?: 'col' | 'row' | 'col-reverse' | 'row-reverse';\n};\n\nexport const stackDefaultVariants: Required<StackVariants> = {\n  direction: 'col',\n};\n\nexport const stackVariants = cva(['flex', 'gap-2'], {\n  variants: {\n    direction: {\n      col: ['flex-col'],\n      row: ['flex-row'],\n      'col-reverse': ['flex-col-reverse'],\n      'row-reverse': ['flex-row-reverse'],\n    },\n  },\n  defaultVariants: {\n    direction: stackDefaultVariants.direction,\n  },\n});\n"],"mappings":";;AAWA,MAAa,uBAAgD,EAC3D,WAAW,MACb;AAEA,MAAa,gBAAgB,IAAI,CAAC,QAAQ,OAAO,GAAG;CAClD,UAAU,EACR,WAAW;EACT,KAAK,CAAC,UAAU;EAChB,KAAK,CAAC,UAAU;EAChB,eAAe,CAAC,kBAAkB;EAClC,eAAe,CAAC,kBAAkB;CACpC,EACF;CACA,iBAAiB,EACf,WAAW,qBAAqB,UAClC;AACF,CAAC"}