@lucasbernardosn/react-ui 0.2.0 → 0.3.0

package/dist/components/feedback/toast/toast-action.d.ts

@@ -0,0 +1,14 @@
+import { Toast } from "@base-ui/react/toast";
+//#region src/components/feedback/toast/toast-action.d.ts
+export type ToastActionProps = Toast.Action.Props;
+export type ToastActionState = Toast.Action.State;
+/**
+ * Botão de ação do toast ("Desfazer"), com as `actionProps` do toast por cima das recebidas. Some
+ * quando não tem rótulo. Sem estilo próprio; passe um botão da lib em `render`.
+ */
+export declare const ToastAction: {
+  (props: ToastActionProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=toast-action.d.ts.map

package/dist/components/feedback/toast/toast-action.js

@@ -0,0 +1,21 @@
+import { mergeStateClassNames } from "../../../utils/merge-state-class-names.js";
+import { jsx } from "react/jsx-runtime";
+import { Toast } from "@base-ui/react/toast";
+//#region src/components/feedback/toast/toast-action.tsx
+/**
+* Botão de ação do toast ("Desfazer"), com as `actionProps` do toast por cima das recebidas. Some
+* quando não tem rótulo. Sem estilo próprio; passe um botão da lib em `render`.
+*/
+const ToastAction = (props) => {
+	const { className, ...rest } = props;
+	return /* @__PURE__ */ jsx(Toast.Action, {
+		"data-component": "Toast.Action",
+		className: mergeStateClassNames([], className),
+		...rest
+	});
+};
+ToastAction.displayName = "Toast.Action";
+//#endregion
+export { ToastAction };
+
+//# sourceMappingURL=toast-action.js.map

package/dist/components/feedback/toast/toast-action.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-action.js","names":["BaseToast"],"sources":["../../../../src/components/feedback/toast/toast-action.tsx"],"sourcesContent":["import { Toast as BaseToast } from '@base-ui/react/toast';\nimport { mergeStateClassNames } from '#utils';\n\nexport type ToastActionProps = BaseToast.Action.Props;\n\nexport type ToastActionState = BaseToast.Action.State;\n\n/**\n * Botão de ação do toast (\"Desfazer\"), com as `actionProps` do toast por cima das recebidas. Some\n * quando não tem rótulo. Sem estilo próprio; passe um botão da lib em `render`.\n */\nexport const ToastAction = (props: ToastActionProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseToast.Action\n      data-component=\"Toast.Action\"\n      className={mergeStateClassNames([], className)}\n      {...rest}\n    />\n  );\n};\n\nToastAction.displayName = 'Toast.Action';\n"],"mappings":";;;;;;;;AAWA,MAAa,eAAe,UAA4B;CACtD,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,MAAU,QAAX;EACE,kBAAe;EACf,WAAW,qBAAqB,CAAC,GAAG,SAAS;EAC7C,GAAI;CACL,CAAA;AAEL;AAEA,YAAY,cAAc"}

package/dist/components/feedback/toast/toast-close.d.ts

@@ -0,0 +1,13 @@
+import { Toast } from "@base-ui/react/toast";
+//#region src/components/feedback/toast/toast-close.d.ts
+export type ToastCloseProps = Toast.Close.Props;
+export type ToastCloseState = Toast.Close.State;
+/**
+ * Botão que fecha o toast. Sem estilo próprio; passe o `CloseButton` em `render`.
+ */
+export declare const ToastClose: {
+  (props: ToastCloseProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=toast-close.d.ts.map

package/dist/components/feedback/toast/toast-close.js

@@ -0,0 +1,20 @@
+import { mergeStateClassNames } from "../../../utils/merge-state-class-names.js";
+import { jsx } from "react/jsx-runtime";
+import { Toast } from "@base-ui/react/toast";
+//#region src/components/feedback/toast/toast-close.tsx
+/**
+* Botão que fecha o toast. Sem estilo próprio; passe o `CloseButton` em `render`.
+*/
+const ToastClose = (props) => {
+	const { className, ...rest } = props;
+	return /* @__PURE__ */ jsx(Toast.Close, {
+		"data-component": "Toast.Close",
+		className: mergeStateClassNames([], className),
+		...rest
+	});
+};
+ToastClose.displayName = "Toast.Close";
+//#endregion
+export { ToastClose };
+
+//# sourceMappingURL=toast-close.js.map

package/dist/components/feedback/toast/toast-close.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-close.js","names":["BaseToast"],"sources":["../../../../src/components/feedback/toast/toast-close.tsx"],"sourcesContent":["import { Toast as BaseToast } from '@base-ui/react/toast';\nimport { mergeStateClassNames } from '#utils';\n\nexport type ToastCloseProps = BaseToast.Close.Props;\n\nexport type ToastCloseState = BaseToast.Close.State;\n\n/**\n * Botão que fecha o toast. Sem estilo próprio; passe o `CloseButton` em `render`.\n */\nexport const ToastClose = (props: ToastCloseProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseToast.Close\n      data-component=\"Toast.Close\"\n      className={mergeStateClassNames([], className)}\n      {...rest}\n    />\n  );\n};\n\nToastClose.displayName = 'Toast.Close';\n"],"mappings":";;;;;;;AAUA,MAAa,cAAc,UAA2B;CACpD,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,MAAU,OAAX;EACE,kBAAe;EACf,WAAW,qBAAqB,CAAC,GAAG,SAAS;EAC7C,GAAI;CACL,CAAA;AAEL;AAEA,WAAW,cAAc"}

package/dist/components/feedback/toast/toast-content.d.ts

@@ -0,0 +1,18 @@
+import { Toast } from "@base-ui/react/toast";
+//#region src/components/feedback/toast/toast-content.d.ts
+export type ToastContentProps = Toast.Content.Props;
+export type ToastContentState = Toast.Content.State;
+/**
+ * O miolo do toast, com o respiro: indicador, textos, ação e botão de fechar, em linha. Não é o
+ * `Content` dos outros componentes (o grupo de título e descrição): o nome vem do Base UI.
+ *
+ * Na pilha recolhida, o toast de trás fica com a altura do da frente, e o conteúdo dele some
+ * (`data-behind`) até a pilha expandir. A altura não deve seguir a do `Toast.Root` (`h-full`):
+ * mudar as duas juntas cancela a transição de altura do toast.
+ */
+export declare const ToastContent: {
+  (props: ToastContentProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=toast-content.d.ts.map

package/dist/components/feedback/toast/toast-content.js

@@ -0,0 +1,35 @@
+import { mergeStateClassNames } from "../../../utils/merge-state-class-names.js";
+import { jsx } from "react/jsx-runtime";
+import { Toast } from "@base-ui/react/toast";
+//#region src/components/feedback/toast/toast-content.tsx
+/**
+* O miolo do toast, com o respiro: indicador, textos, ação e botão de fechar, em linha. Não é o
+* `Content` dos outros componentes (o grupo de título e descrição): o nome vem do Base UI.
+*
+* Na pilha recolhida, o toast de trás fica com a altura do da frente, e o conteúdo dele some
+* (`data-behind`) até a pilha expandir. A altura não deve seguir a do `Toast.Root` (`h-full`):
+* mudar as duas juntas cancela a transição de altura do toast.
+*/
+const ToastContent = (props) => {
+	const { className, ...rest } = props;
+	return /* @__PURE__ */ jsx(Toast.Content, {
+		"data-component": "Toast.Content",
+		className: mergeStateClassNames([
+			"flex",
+			"items-start",
+			"gap-2",
+			"p-4",
+			"overflow-hidden",
+			"transition-opacity",
+			"duration-250",
+			"ease-in-out",
+			"data-behind:not-data-expanded:opacity-0"
+		], className),
+		...rest
+	});
+};
+ToastContent.displayName = "Toast.Content";
+//#endregion
+export { ToastContent };
+
+//# sourceMappingURL=toast-content.js.map

package/dist/components/feedback/toast/toast-content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-content.js","names":["BaseToast"],"sources":["../../../../src/components/feedback/toast/toast-content.tsx"],"sourcesContent":["import { Toast as BaseToast } from '@base-ui/react/toast';\nimport { mergeStateClassNames } from '#utils';\n\nexport type ToastContentProps = BaseToast.Content.Props;\n\nexport type ToastContentState = BaseToast.Content.State;\n\n/**\n * O miolo do toast, com o respiro: indicador, textos, ação e botão de fechar, em linha. Não é o\n * `Content` dos outros componentes (o grupo de título e descrição): o nome vem do Base UI.\n *\n * Na pilha recolhida, o toast de trás fica com a altura do da frente, e o conteúdo dele some\n * (`data-behind`) até a pilha expandir. A altura não deve seguir a do `Toast.Root` (`h-full`):\n * mudar as duas juntas cancela a transição de altura do toast.\n */\nexport const ToastContent = (props: ToastContentProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseToast.Content\n      data-component=\"Toast.Content\"\n      className={mergeStateClassNames(\n        [\n          'flex',\n          'items-start',\n          'gap-2',\n\n          'p-4',\n\n          'overflow-hidden',\n\n          'transition-opacity',\n          'duration-250',\n          'ease-in-out',\n\n          'data-behind:not-data-expanded:opacity-0',\n        ],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nToastContent.displayName = 'Toast.Content';\n"],"mappings":";;;;;;;;;;;;AAeA,MAAa,gBAAgB,UAA6B;CACxD,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,MAAU,SAAX;EACE,kBAAe;EACf,WAAW,qBACT;GACE;GACA;GACA;GAEA;GAEA;GAEA;GACA;GACA;GAEA;EACF,GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,aAAa,cAAc"}

package/dist/components/feedback/toast/toast-description.d.ts

@@ -0,0 +1,17 @@
+import { Toast } from "@base-ui/react/toast";
+//#region src/components/feedback/toast/toast-description.d.ts
+export type ToastDescriptionProps = Toast.Description.Props;
+export type ToastDescriptionState = Toast.Description.State;
+/**
+ * Texto de apoio do toast: sem filhos, mostra a `description` do toast, e some quando ele não tem
+ * uma. Sem título, ela é a mensagem do toast.
+ *
+ * Cópia do `Alert.Description`, a origem (tabela no README de `feedback`). A diferença: é o `p` do
+ * Base UI, e a cor vem de `--toast-fg`, que o `type` declara.
+ */
+export declare const ToastDescription: {
+  (props: ToastDescriptionProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=toast-description.d.ts.map

package/dist/components/feedback/toast/toast-description.js

@@ -0,0 +1,29 @@
+import { mergeStateClassNames } from "../../../utils/merge-state-class-names.js";
+import { jsx } from "react/jsx-runtime";
+import { Toast } from "@base-ui/react/toast";
+//#region src/components/feedback/toast/toast-description.tsx
+/**
+* Texto de apoio do toast: sem filhos, mostra a `description` do toast, e some quando ele não tem
+* uma. Sem título, ela é a mensagem do toast.
+*
+* Cópia do `Alert.Description`, a origem (tabela no README de `feedback`). A diferença: é o `p` do
+* Base UI, e a cor vem de `--toast-fg`, que o `type` declara.
+*/
+const ToastDescription = (props) => {
+	const { className, ...rest } = props;
+	return /* @__PURE__ */ jsx(Toast.Description, {
+		"data-component": "Toast.Description",
+		className: mergeStateClassNames([
+			"text-sm",
+			"leading-5",
+			"text-(--toast-fg,var(--color-gray-11))",
+			"text-pretty"
+		], className),
+		...rest
+	});
+};
+ToastDescription.displayName = "Toast.Description";
+//#endregion
+export { ToastDescription };
+
+//# sourceMappingURL=toast-description.js.map

package/dist/components/feedback/toast/toast-description.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-description.js","names":["BaseToast"],"sources":["../../../../src/components/feedback/toast/toast-description.tsx"],"sourcesContent":["import { Toast as BaseToast } from '@base-ui/react/toast';\nimport { mergeStateClassNames } from '#utils';\n\nexport type ToastDescriptionProps = BaseToast.Description.Props;\n\nexport type ToastDescriptionState = BaseToast.Description.State;\n\n/**\n * Texto de apoio do toast: sem filhos, mostra a `description` do toast, e some quando ele não tem\n * uma. Sem título, ela é a mensagem do toast.\n *\n * Cópia do `Alert.Description`, a origem (tabela no README de `feedback`). A diferença: é o `p` do\n * Base UI, e a cor vem de `--toast-fg`, que o `type` declara.\n */\nexport const ToastDescription = (props: ToastDescriptionProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseToast.Description\n      data-component=\"Toast.Description\"\n      className={mergeStateClassNames(\n        [\n          'text-sm',\n          'leading-5',\n          'text-(--toast-fg,var(--color-gray-11))',\n          'text-pretty',\n        ],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nToastDescription.displayName = 'Toast.Description';\n"],"mappings":";;;;;;;;;;;AAcA,MAAa,oBAAoB,UAAiC;CAChE,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,MAAU,aAAX;EACE,kBAAe;EACf,WAAW,qBACT;GACE;GACA;GACA;GACA;EACF,GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,iBAAiB,cAAc"}

package/dist/components/feedback/toast/toast-indicator-variants.d.ts

@@ -0,0 +1,10 @@
+//#region src/components/feedback/toast/toast-indicator-variants.d.ts
+/**
+ * A cor do ícone segue o tipo do toast, no passo 11: sobre a superfície neutra do toast, o ícone é
+ * o único lugar com a cor do tipo.
+ */
+export declare const toastIndicatorVariants: (props?: ({
+  type?: "loading" | "neutral" | "info" | "success" | "warning" | "error" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+//#endregion
+//# sourceMappingURL=toast-indicator-variants.d.ts.map

package/dist/components/feedback/toast/toast-indicator-variants.js

@@ -0,0 +1,27 @@
+import { cva } from "class-variance-authority";
+//#region src/components/feedback/toast/toast-indicator-variants.ts
+/**
+* A cor do ícone segue o tipo do toast, no passo 11: sobre a superfície neutra do toast, o ícone é
+* o único lugar com a cor do tipo.
+*/
+const toastIndicatorVariants = cva([
+	"flex",
+	"items-center",
+	"justify-center",
+	"shrink-0",
+	"h-5",
+	"text-xl",
+	"leading-none",
+	"[&_svg]:size-[1em]"
+], { variants: { type: {
+	neutral: ["text-gray-11"],
+	info: ["text-blue-11"],
+	success: ["text-green-11"],
+	warning: ["text-amber-11"],
+	error: ["text-red-11"],
+	loading: ["text-gray-11"]
+} } });
+//#endregion
+export { toastIndicatorVariants };
+
+//# sourceMappingURL=toast-indicator-variants.js.map

package/dist/components/feedback/toast/toast-indicator-variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-indicator-variants.js","names":[],"sources":["../../../../src/components/feedback/toast/toast-indicator-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\n/**\n * A cor do ícone segue o tipo do toast, no passo 11: sobre a superfície neutra do toast, o ícone é\n * o único lugar com a cor do tipo.\n */\nexport const toastIndicatorVariants = cva(\n  [\n    'flex',\n    'items-center',\n    'justify-center',\n    'shrink-0',\n\n    'h-5',\n\n    'text-xl',\n    // Sem entrelinha, um emoji ocuparia mais altura que o ícone.\n    'leading-none',\n\n    '[&_svg]:size-[1em]',\n  ],\n  {\n    variants: {\n      type: {\n        neutral: ['text-gray-11'],\n        info: ['text-blue-11'],\n        success: ['text-green-11'],\n        warning: ['text-amber-11'],\n        error: ['text-red-11'],\n        loading: ['text-gray-11'],\n      },\n    },\n  },\n);\n"],"mappings":";;;;;;AAMA,MAAa,yBAAyB,IACpC;CACE;CACA;CACA;CACA;CAEA;CAEA;CAEA;CAEA;AACF,GACA,EACE,UAAU,EACR,MAAM;CACJ,SAAS,CAAC,cAAc;CACxB,MAAM,CAAC,cAAc;CACrB,SAAS,CAAC,eAAe;CACzB,SAAS,CAAC,eAAe;CACzB,OAAO,CAAC,aAAa;CACrB,SAAS,CAAC,cAAc;AAC1B,EACF,EACF,CACF"}

package/dist/components/feedback/toast/toast-indicator.d.ts

@@ -0,0 +1,18 @@
+import React from "react";
+import { useRender } from "@base-ui/react";
+//#region src/components/feedback/toast/toast-indicator.d.ts
+export type ToastIndicatorProps = useRender.ComponentProps<'div'>;
+/**
+ * Ícone do toast, na cor do tipo. Cópia do `Alert.Indicator`, a origem (tabela no README de
+ * `feedback`), com os mesmos ícones; as diferenças: a cor vem do `type` e o `loading` mostra um
+ * `Spinner`. Com filhos, usa os filhos. O `svg` mede `1em` (20px), numa caixa da altura da linha
+ * do título, para ficar alinhado à primeira linha.
+ *
+ * Fica com `aria-hidden`: o ícone repete o que o texto diz.
+ */
+export declare const ToastIndicator: {
+  (props: ToastIndicatorProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=toast-indicator.d.ts.map

package/dist/components/feedback/toast/toast-indicator.js

@@ -0,0 +1,45 @@
+import { mergeTwClassNames } from "../../../utils/merge-class-names.js";
+import { Icon } from "../../display/icon/icon.js";
+import { Spinner } from "../spinner/spinner.js";
+import { toastIndicatorVariants } from "./toast-indicator-variants.js";
+import { useToastRootContext } from "./use-toast-root-context.js";
+import { mergeProps, useRender } from "@base-ui/react";
+import { jsx } from "react/jsx-runtime";
+import { CheckCircleIcon, InfoIcon, WarningCircleIcon, WarningIcon } from "@phosphor-icons/react";
+//#region src/components/feedback/toast/toast-indicator.tsx
+/**
+* Ícone do toast, na cor do tipo. Cópia do `Alert.Indicator`, a origem (tabela no README de
+* `feedback`), com os mesmos ícones; as diferenças: a cor vem do `type` e o `loading` mostra um
+* `Spinner`. Com filhos, usa os filhos. O `svg` mede `1em` (20px), numa caixa da altura da linha
+* do título, para ficar alinhado à primeira linha.
+*
+* Fica com `aria-hidden`: o ícone repete o que o texto diz.
+*/
+const ToastIndicator = (props) => {
+	const { render, className, children, ...rest } = props;
+	const { type } = useToastRootContext();
+	const baseProps = {
+		"data-component": "Toast.Indicator",
+		"aria-hidden": true,
+		children: children ?? typeIndicators[type],
+		className: mergeTwClassNames(toastIndicatorVariants({ type }), className)
+	};
+	return useRender({
+		render,
+		defaultTagName: "div",
+		props: mergeProps(baseProps, rest)
+	});
+};
+ToastIndicator.displayName = "Toast.Indicator";
+const typeIndicators = {
+	neutral: /* @__PURE__ */ jsx(Icon, { render: /* @__PURE__ */ jsx(InfoIcon, {}) }),
+	info: /* @__PURE__ */ jsx(Icon, { render: /* @__PURE__ */ jsx(InfoIcon, {}) }),
+	success: /* @__PURE__ */ jsx(Icon, { render: /* @__PURE__ */ jsx(CheckCircleIcon, {}) }),
+	warning: /* @__PURE__ */ jsx(Icon, { render: /* @__PURE__ */ jsx(WarningIcon, {}) }),
+	error: /* @__PURE__ */ jsx(Icon, { render: /* @__PURE__ */ jsx(WarningCircleIcon, {}) }),
+	loading: /* @__PURE__ */ jsx(Spinner, {})
+};
+//#endregion
+export { ToastIndicator };
+
+//# sourceMappingURL=toast-indicator.js.map

package/dist/components/feedback/toast/toast-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-indicator.js","names":[],"sources":["../../../../src/components/feedback/toast/toast-indicator.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport {\n  CheckCircleIcon,\n  InfoIcon,\n  WarningCircleIcon,\n  WarningIcon,\n} from '@phosphor-icons/react';\nimport type React from 'react';\nimport { Icon } from '#components/display/icon';\nimport { Spinner } from '#components/feedback/spinner';\nimport { mergeTwClassNames } from '#utils';\nimport { toastIndicatorVariants } from './toast-indicator-variants';\nimport type { ToastType } from './toast-manager';\nimport { useToastRootContext } from './use-toast-root-context';\n\nexport type ToastIndicatorProps = useRender.ComponentProps<'div'>;\n\n/**\n * Ícone do toast, na cor do tipo. Cópia do `Alert.Indicator`, a origem (tabela no README de\n * `feedback`), com os mesmos ícones; as diferenças: a cor vem do `type` e o `loading` mostra um\n * `Spinner`. Com filhos, usa os filhos. O `svg` mede `1em` (20px), numa caixa da altura da linha\n * do título, para ficar alinhado à primeira linha.\n *\n * Fica com `aria-hidden`: o ícone repete o que o texto diz.\n */\nexport const ToastIndicator = (props: ToastIndicatorProps) => {\n  const { render, className, children, ...rest } = props;\n\n  const { type } = useToastRootContext();\n\n  const baseProps = {\n    'data-component': 'Toast.Indicator',\n    'aria-hidden': true,\n    children: children ?? typeIndicators[type],\n    className: mergeTwClassNames(toastIndicatorVariants({ type }), className),\n  };\n\n  return useRender({\n    render,\n    defaultTagName: 'div',\n    props: mergeProps(baseProps, rest),\n  });\n};\n\nToastIndicator.displayName = 'Toast.Indicator';\n\nconst typeIndicators: Record<ToastType, React.ReactNode> = {\n  neutral: <Icon render={<InfoIcon />} />,\n  info: <Icon render={<InfoIcon />} />,\n  success: <Icon render={<CheckCircleIcon />} />,\n  warning: <Icon render={<WarningIcon />} />,\n  error: <Icon render={<WarningCircleIcon />} />,\n  loading: <Spinner />,\n};\n"],"mappings":";;;;;;;;;;;;;;;;;AAyBA,MAAa,kBAAkB,UAA+B;CAC5D,MAAM,EAAE,QAAQ,WAAW,UAAU,GAAG,SAAS;CAEjD,MAAM,EAAE,SAAS,oBAAoB;CAErC,MAAM,YAAY;EAChB,kBAAkB;EAClB,eAAe;EACf,UAAU,YAAY,eAAe;EACrC,WAAW,kBAAkB,uBAAuB,EAAE,KAAK,CAAC,GAAG,SAAS;CAC1E;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,eAAe,cAAc;AAE7B,MAAM,iBAAqD;CACzD,SAAS,oBAAC,MAAD,EAAM,QAAQ,oBAAC,UAAD,CAAW,CAAA,EAAI,CAAA;CACtC,MAAM,oBAAC,MAAD,EAAM,QAAQ,oBAAC,UAAD,CAAW,CAAA,EAAI,CAAA;CACnC,SAAS,oBAAC,MAAD,EAAM,QAAQ,oBAAC,iBAAD,CAAkB,CAAA,EAAI,CAAA;CAC7C,SAAS,oBAAC,MAAD,EAAM,QAAQ,oBAAC,aAAD,CAAc,CAAA,EAAI,CAAA;CACzC,OAAO,oBAAC,MAAD,EAAM,QAAQ,oBAAC,mBAAD,CAAoB,CAAA,EAAI,CAAA;CAC7C,SAAS,oBAAC,SAAD,CAAU,CAAA;AACrB"}

package/dist/components/feedback/toast/toast-manager.d.ts

@@ -0,0 +1,80 @@
+import { MergeOverride } from "@lucasbernardosn/ts-utils";
+import { ToastManager, ToastManagerAddOptions, ToastManagerUpdateOptions } from "@base-ui/react/toast";
+//#region src/components/feedback/toast/toast-manager.d.ts
+/**
+ * O que o toast comunica: decide o ícone e a cor do `Toast.Indicator`, no vocabulário do `status`
+ * do Alert. O `loading` não fecha sozinho e é o tipo que o `Toast.promise` usa enquanto espera.
+ */
+export type ToastType = 'neutral' | 'info' | 'success' | 'warning' | 'error' | 'loading';
+export type ToastAddOptions = MergeOverride<Omit<ToastManagerAddOptions<object>, 'data' | 'positionerProps' | 'transitionStatus'>, {
+  /**
+   * O que o toast comunica. Sem a `priority`, o `error` é anunciado com prioridade alta.
+   *
+   * @default 'neutral'
+   */
+  type?: ToastType;
+}>;
+export type ToastUpdateOptions = MergeOverride<Omit<ToastManagerUpdateOptions<object>, 'data' | 'positionerProps'>, {
+  /**
+   * O que o toast comunica. Trocar o tipo sem passar a `priority` a ajusta junto: alta no
+   * `error`, baixa nos demais.
+   */
+  type?: ToastType;
+}>;
+/** Opções de um dos estados do `Toast.promise`: um texto vira a descrição. */
+export type ToastPromiseStateOptions = string | Omit<ToastUpdateOptions, 'type'>;
+export type ToastPromiseOptions<Value> = {
+  /** Enquanto a promise não resolve. O toast fica aberto, sem timeout. */
+  loading: ToastPromiseStateOptions;
+  /** Quando ela resolve, com o valor resolvido. */
+  success: ToastPromiseStateOptions | ((result: Value) => ToastPromiseStateOptions);
+  /** Quando ela rejeita, com o erro. Anunciado com prioridade alta, se a `priority` não vier. */
+  error: ToastPromiseStateOptions | ((error: unknown) => ToastPromiseStateOptions);
+};
+/**
+ * Abre um toast no `Toast.Outlet` e devolve o id, para atualizar ou fechar depois. Pode ser
+ * chamado de qualquer lugar, inclusive de fora do React. Um `id` que já está aberto atualiza o
+ * toast no lugar e reinicia o timeout.
+ *
+ * Com prioridade alta, o leitor de tela anuncia só o `title` e a `description` que forem texto:
+ * um `ReactNode` aparece, mas não é lido.
+ *
+ * @example
+ * ```ts
+ * Toast.add({ type: 'success', title: 'Nota 4821 emitida' });
+ * ```
+ */
+export declare const toastAdd: (options: ToastAddOptions) => string;
+/**
+ * Atualiza um toast aberto. As opções substituem as que ele tinha.
+ */
+export declare const toastUpdate: (id: string, options: ToastUpdateOptions) => void;
+/**
+ * Fecha um toast pelo id, ou todos, sem o id. Ele sai da fila depois da animação de saída.
+ */
+export declare const toastClose: (id?: string) => void;
+/**
+ * Mostra um toast de `loading` enquanto a promise roda e o troca pelo de `success` ou de `error`
+ * quando ela termina. Devolve a mesma promise, que continua rejeitando no erro: quem chamou trata
+ * a falha como trataria sem o toast.
+ *
+ * @example
+ * ```ts
+ * await Toast.promise(emitInvoice(4821), {
+ *   loading: 'Emitindo a nota…',
+ *   success: (invoice) => `Nota ${invoice.number} emitida`,
+ *   error: (error) => ({
+ *     title: 'A nota não foi emitida',
+ *     description: error instanceof Error ? error.message : undefined,
+ *   }),
+ * });
+ * ```
+ */
+export declare const toastPromise: <Value>(promise: Promise<Value>, options: ToastPromiseOptions<Value>) => Promise<Value>;
+/**
+ * O manager que o `Toast.Outlet` passa ao `Toast.Provider`: o do Base UI, com a fila de
+ * `runWhenSubscribed` na frente.
+ */
+export declare const queuedToastManager: ToastManager<object>;
+//#endregion
+//# sourceMappingURL=toast-manager.d.ts.map

package/dist/components/feedback/toast/toast-manager.js

@@ -0,0 +1,138 @@
+import { Toast } from "@base-ui/react/toast";
+import { generateId } from "@base-ui/utils/generateId";
+//#region src/components/feedback/toast/toast-manager.ts
+/**
+* Abre um toast no `Toast.Outlet` e devolve o id, para atualizar ou fechar depois. Pode ser
+* chamado de qualquer lugar, inclusive de fora do React. Um `id` que já está aberto atualiza o
+* toast no lugar e reinicia o timeout.
+*
+* Com prioridade alta, o leitor de tela anuncia só o `title` e a `description` que forem texto:
+* um `ReactNode` aparece, mas não é lido.
+*
+* @example
+* ```ts
+* Toast.add({ type: 'success', title: 'Nota 4821 emitida' });
+* ```
+*/
+const toastAdd = (options) => queuedToastManager.add(withTypePriority(options));
+/**
+* Atualiza um toast aberto. As opções substituem as que ele tinha.
+*/
+const toastUpdate = (id, options) => queuedToastManager.update(id, withTypePriority(options));
+/**
+* Fecha um toast pelo id, ou todos, sem o id. Ele sai da fila depois da animação de saída.
+*/
+const toastClose = (id) => queuedToastManager.close(id);
+/**
+* Mostra um toast de `loading` enquanto a promise roda e o troca pelo de `success` ou de `error`
+* quando ela termina. Devolve a mesma promise, que continua rejeitando no erro: quem chamou trata
+* a falha como trataria sem o toast.
+*
+* @example
+* ```ts
+* await Toast.promise(emitInvoice(4821), {
+*   loading: 'Emitindo a nota…',
+*   success: (invoice) => `Nota ${invoice.number} emitida`,
+*   error: (error) => ({
+*     title: 'A nota não foi emitida',
+*     description: error instanceof Error ? error.message : undefined,
+*   }),
+* });
+* ```
+*/
+const toastPromise = (promise, options) => queuedToastManager.promise(promise, {
+	...options,
+	error: (error) => {
+		const resolved = typeof options.error === "function" ? options.error(error) : options.error;
+		return {
+			priority: "high",
+			...typeof resolved === "string" ? { description: resolved } : resolved
+		};
+	}
+});
+/**
+* Sem a `priority`, ela segue o tipo: alta no `error`, para o leitor de tela interromper o que lê,
+* e baixa nos demais, anunciados numa pausa. Sem o tipo, nada muda: numa atualização, o toast
+* mantém a prioridade que tinha.
+*/
+const withTypePriority = (options) => {
+	if (options.priority !== void 0 || options.type === void 0) return options;
+	return {
+		...options,
+		priority: options.type === "error" ? "high" : "low"
+	};
+};
+const baseToastManager = Toast.createToastManager();
+let subscriberCount = 0;
+let pendingCalls = [];
+let missingOutletTimeout;
+/**
+* Até um `Toast.Outlet` montar, as chamadas esperam numa fila. O manager do Base UI só repassa
+* cada chamada a quem já se inscreveu, e o `Outlet` se inscreve num efeito: um toast aberto no
+* efeito de um componente montado antes dele se perderia sem aviso.
+*
+* O aviso de nenhum `Outlet` espera 1s, porque um toast aberto antes da primeira renderização é
+* uso válido; o de mais de um vale na hora, porque cada toast apareceria em todos. Os dois valem
+* em produção também: só aparecem com o app montado errado.
+*/
+const runWhenSubscribed = (call) => {
+	if (subscriberCount > 0) {
+		call();
+		return;
+	}
+	pendingCalls.push(call);
+	missingOutletTimeout ??= setTimeout(() => {
+		missingOutletTimeout = void 0;
+		if (subscriberCount === 0) console.error("Toast: um toast foi aberto sem nenhum <Toast.Outlet /> montado, e ele só vai aparecer quando um montar. Monte um <Toast.Outlet /> perto da raiz do app.");
+	}, 1e3);
+};
+/**
+* O manager que o `Toast.Outlet` passa ao `Toast.Provider`: o do Base UI, com a fila de
+* `runWhenSubscribed` na frente.
+*/
+const queuedToastManager = {
+	" subscribe": (listener) => {
+		const unsubscribe = baseToastManager[" subscribe"](listener);
+		subscriberCount += 1;
+		clearTimeout(missingOutletTimeout);
+		missingOutletTimeout = void 0;
+		if (subscriberCount > 1) console.error("Toast: mais de um <Toast.Outlet /> está montado, e cada toast vai aparecer em todos. Monte um só, perto da raiz do app.");
+		const calls = pendingCalls;
+		pendingCalls = [];
+		for (const call of calls) call();
+		return () => {
+			subscriberCount -= 1;
+			unsubscribe();
+		};
+	},
+	add: (options) => {
+		/** O id sai na hora, mesmo com a chamada na fila, para quem abriu poder fechar depois. */
+		const id = options.id ?? generateId("toast");
+		runWhenSubscribed(() => baseToastManager.add({
+			...options,
+			id
+		}));
+		return id;
+	},
+	close: (id) => {
+		runWhenSubscribed(() => baseToastManager.close(id));
+	},
+	update: (id, updates) => {
+		runWhenSubscribed(() => baseToastManager.update(id, updates));
+	},
+	promise: (promise, options) => {
+		if (subscriberCount > 0) return baseToastManager.promise(promise, options);
+		/**
+		* Na fila, quem chamou recebe a própria promise, que rejeita do mesmo jeito. A do Base UI,
+		* criada só quando o `Outlet` monta, ninguém espera: a rejeição dela é engolida aqui.
+		*/
+		runWhenSubscribed(() => {
+			baseToastManager.promise(promise, options).catch(() => void 0);
+		});
+		return promise;
+	}
+};
+//#endregion
+export { queuedToastManager, toastAdd, toastClose, toastPromise, toastUpdate };
+
+//# sourceMappingURL=toast-manager.js.map

package/dist/components/feedback/toast/toast-manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-manager.js","names":["BaseToast"],"sources":["../../../../src/components/feedback/toast/toast-manager.ts"],"sourcesContent":["import {\n  Toast as BaseToast,\n  type ToastManager,\n  type ToastManagerAddOptions,\n  type ToastManagerUpdateOptions,\n} from '@base-ui/react/toast';\nimport { generateId } from '@base-ui/utils/generateId';\nimport type { MergeOverride } from '@lucasbernardosn/ts-utils';\n\n/**\n * O que o toast comunica: decide o ícone e a cor do `Toast.Indicator`, no vocabulário do `status`\n * do Alert. O `loading` não fecha sozinho e é o tipo que o `Toast.promise` usa enquanto espera.\n */\nexport type ToastType =\n  | 'neutral'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'error'\n  | 'loading';\n\nexport type ToastAddOptions = MergeOverride<\n  Omit<\n    ToastManagerAddOptions<object>,\n    'data' | 'positionerProps' | 'transitionStatus'\n  >,\n  {\n    /**\n     * O que o toast comunica. Sem a `priority`, o `error` é anunciado com prioridade alta.\n     *\n     * @default 'neutral'\n     */\n    type?: ToastType;\n  }\n>;\n\nexport type ToastUpdateOptions = MergeOverride<\n  Omit<ToastManagerUpdateOptions<object>, 'data' | 'positionerProps'>,\n  {\n    /**\n     * O que o toast comunica. Trocar o tipo sem passar a `priority` a ajusta junto: alta no\n     * `error`, baixa nos demais.\n     */\n    type?: ToastType;\n  }\n>;\n\n/** Opções de um dos estados do `Toast.promise`: um texto vira a descrição. */\nexport type ToastPromiseStateOptions =\n  | string\n  | Omit<ToastUpdateOptions, 'type'>;\n\nexport type ToastPromiseOptions<Value> = {\n  /** Enquanto a promise não resolve. O toast fica aberto, sem timeout. */\n  loading: ToastPromiseStateOptions;\n  /** Quando ela resolve, com o valor resolvido. */\n  success:\n    | ToastPromiseStateOptions\n    | ((result: Value) => ToastPromiseStateOptions);\n  /** Quando ela rejeita, com o erro. Anunciado com prioridade alta, se a `priority` não vier. */\n  error:\n    | ToastPromiseStateOptions\n    | ((error: unknown) => ToastPromiseStateOptions);\n};\n\n/**\n * Abre um toast no `Toast.Outlet` e devolve o id, para atualizar ou fechar depois. Pode ser\n * chamado de qualquer lugar, inclusive de fora do React. Um `id` que já está aberto atualiza o\n * toast no lugar e reinicia o timeout.\n *\n * Com prioridade alta, o leitor de tela anuncia só o `title` e a `description` que forem texto:\n * um `ReactNode` aparece, mas não é lido.\n *\n * @example\n * ```ts\n * Toast.add({ type: 'success', title: 'Nota 4821 emitida' });\n * ```\n */\nexport const toastAdd = (options: ToastAddOptions) =>\n  queuedToastManager.add(withTypePriority(options));\n\n/**\n * Atualiza um toast aberto. As opções substituem as que ele tinha.\n */\nexport const toastUpdate = (id: string, options: ToastUpdateOptions) =>\n  queuedToastManager.update(id, withTypePriority(options));\n\n/**\n * Fecha um toast pelo id, ou todos, sem o id. Ele sai da fila depois da animação de saída.\n */\nexport const toastClose = (id?: string) => queuedToastManager.close(id);\n\n/**\n * Mostra um toast de `loading` enquanto a promise roda e o troca pelo de `success` ou de `error`\n * quando ela termina. Devolve a mesma promise, que continua rejeitando no erro: quem chamou trata\n * a falha como trataria sem o toast.\n *\n * @example\n * ```ts\n * await Toast.promise(emitInvoice(4821), {\n *   loading: 'Emitindo a nota…',\n *   success: (invoice) => `Nota ${invoice.number} emitida`,\n *   error: (error) => ({\n *     title: 'A nota não foi emitida',\n *     description: error instanceof Error ? error.message : undefined,\n *   }),\n * });\n * ```\n */\nexport const toastPromise = <Value>(\n  promise: Promise<Value>,\n  options: ToastPromiseOptions<Value>,\n) =>\n  queuedToastManager.promise(promise, {\n    ...options,\n    error: (error: unknown) => {\n      const resolved =\n        typeof options.error === 'function'\n          ? options.error(error)\n          : options.error;\n\n      const errorOptions =\n        typeof resolved === 'string' ? { description: resolved } : resolved;\n\n      return { priority: 'high', ...errorOptions };\n    },\n  });\n\n/**\n * Sem a `priority`, ela segue o tipo: alta no `error`, para o leitor de tela interromper o que lê,\n * e baixa nos demais, anunciados numa pausa. Sem o tipo, nada muda: numa atualização, o toast\n * mantém a prioridade que tinha.\n */\nconst withTypePriority = <Options extends ToastUpdateOptions>(\n  options: Options,\n): Options => {\n  if (options.priority !== undefined || options.type === undefined) {\n    return options;\n  }\n\n  return { ...options, priority: options.type === 'error' ? 'high' : 'low' };\n};\n\nconst baseToastManager = BaseToast.createToastManager<object>();\n\nlet subscriberCount = 0;\nlet pendingCalls: (() => void)[] = [];\nlet missingOutletTimeout: ReturnType<typeof setTimeout> | undefined;\n\n/**\n * Até um `Toast.Outlet` montar, as chamadas esperam numa fila. O manager do Base UI só repassa\n * cada chamada a quem já se inscreveu, e o `Outlet` se inscreve num efeito: um toast aberto no\n * efeito de um componente montado antes dele se perderia sem aviso.\n *\n * O aviso de nenhum `Outlet` espera 1s, porque um toast aberto antes da primeira renderização é\n * uso válido; o de mais de um vale na hora, porque cada toast apareceria em todos. Os dois valem\n * em produção também: só aparecem com o app montado errado.\n */\nconst runWhenSubscribed = (call: () => void) => {\n  if (subscriberCount > 0) {\n    call();\n    return;\n  }\n\n  pendingCalls.push(call);\n\n  missingOutletTimeout ??= setTimeout(() => {\n    missingOutletTimeout = undefined;\n\n    if (subscriberCount === 0) {\n      console.error(\n        'Toast: um toast foi aberto sem nenhum <Toast.Outlet /> montado, e ele só vai aparecer ' +\n          'quando um montar. Monte um <Toast.Outlet /> perto da raiz do app.',\n      );\n    }\n  }, 1000);\n};\n\n/**\n * O manager que o `Toast.Outlet` passa ao `Toast.Provider`: o do Base UI, com a fila de\n * `runWhenSubscribed` na frente.\n */\nexport const queuedToastManager: ToastManager<object> = {\n  ' subscribe': (listener) => {\n    const unsubscribe = baseToastManager[' subscribe'](listener);\n\n    subscriberCount += 1;\n\n    clearTimeout(missingOutletTimeout);\n    missingOutletTimeout = undefined;\n\n    if (subscriberCount > 1) {\n      console.error(\n        'Toast: mais de um <Toast.Outlet /> está montado, e cada toast vai aparecer em todos. ' +\n          'Monte um só, perto da raiz do app.',\n      );\n    }\n\n    const calls = pendingCalls;\n    pendingCalls = [];\n\n    for (const call of calls) {\n      call();\n    }\n\n    return () => {\n      subscriberCount -= 1;\n      unsubscribe();\n    };\n  },\n  add: (options) => {\n    /** O id sai na hora, mesmo com a chamada na fila, para quem abriu poder fechar depois. */\n    const id = options.id ?? generateId('toast');\n\n    runWhenSubscribed(() => baseToastManager.add({ ...options, id }));\n\n    return id;\n  },\n  close: (id) => {\n    runWhenSubscribed(() => baseToastManager.close(id));\n  },\n  update: (id, updates) => {\n    runWhenSubscribed(() => baseToastManager.update(id, updates));\n  },\n  promise: (promise, options) => {\n    if (subscriberCount > 0) {\n      return baseToastManager.promise(promise, options);\n    }\n\n    /**\n     * Na fila, quem chamou recebe a própria promise, que rejeita do mesmo jeito. A do Base UI,\n     * criada só quando o `Outlet` monta, ninguém espera: a rejeição dela é engolida aqui.\n     */\n    runWhenSubscribed(() => {\n      baseToastManager.promise(promise, options).catch(() => undefined);\n    });\n\n    return promise;\n  },\n};\n"],"mappings":";;;;;;;;;;;;;;;;AA8EA,MAAa,YAAY,YACvB,mBAAmB,IAAI,iBAAiB,OAAO,CAAC;;;;AAKlD,MAAa,eAAe,IAAY,YACtC,mBAAmB,OAAO,IAAI,iBAAiB,OAAO,CAAC;;;;AAKzD,MAAa,cAAc,OAAgB,mBAAmB,MAAM,EAAE;;;;;;;;;;;;;;;;;;AAmBtE,MAAa,gBACX,SACA,YAEA,mBAAmB,QAAQ,SAAS;CAClC,GAAG;CACH,QAAQ,UAAmB;EACzB,MAAM,WACJ,OAAO,QAAQ,UAAU,aACrB,QAAQ,MAAM,KAAK,IACnB,QAAQ;EAKd,OAAO;GAAE,UAAU;GAAQ,GAFzB,OAAO,aAAa,WAAW,EAAE,aAAa,SAAS,IAAI;EAElB;CAC7C;AACF,CAAC;;;;;;AAOH,MAAM,oBACJ,YACY;CACZ,IAAI,QAAQ,aAAa,KAAA,KAAa,QAAQ,SAAS,KAAA,GACrD,OAAO;CAGT,OAAO;EAAE,GAAG;EAAS,UAAU,QAAQ,SAAS,UAAU,SAAS;CAAM;AAC3E;AAEA,MAAM,mBAAmBA,MAAU,mBAA2B;AAE9D,IAAI,kBAAkB;AACtB,IAAI,eAA+B,CAAC;AACpC,IAAI;;;;;;;;;;AAWJ,MAAM,qBAAqB,SAAqB;CAC9C,IAAI,kBAAkB,GAAG;EACvB,KAAK;EACL;CACF;CAEA,aAAa,KAAK,IAAI;CAEtB,yBAAyB,iBAAiB;EACxC,uBAAuB,KAAA;EAEvB,IAAI,oBAAoB,GACtB,QAAQ,MACN,yJAEF;CAEJ,GAAG,GAAI;AACT;;;;;AAMA,MAAa,qBAA2C;CACtD,eAAe,aAAa;EAC1B,MAAM,cAAc,iBAAiB,aAAa,CAAC,QAAQ;EAE3D,mBAAmB;EAEnB,aAAa,oBAAoB;EACjC,uBAAuB,KAAA;EAEvB,IAAI,kBAAkB,GACpB,QAAQ,MACN,yHAEF;EAGF,MAAM,QAAQ;EACd,eAAe,CAAC;EAEhB,KAAK,MAAM,QAAQ,OACjB,KAAK;EAGP,aAAa;GACX,mBAAmB;GACnB,YAAY;EACd;CACF;CACA,MAAM,YAAY;;EAEhB,MAAM,KAAK,QAAQ,MAAM,WAAW,OAAO;EAE3C,wBAAwB,iBAAiB,IAAI;GAAE,GAAG;GAAS;EAAG,CAAC,CAAC;EAEhE,OAAO;CACT;CACA,QAAQ,OAAO;EACb,wBAAwB,iBAAiB,MAAM,EAAE,CAAC;CACpD;CACA,SAAS,IAAI,YAAY;EACvB,wBAAwB,iBAAiB,OAAO,IAAI,OAAO,CAAC;CAC9D;CACA,UAAU,SAAS,YAAY;EAC7B,IAAI,kBAAkB,GACpB,OAAO,iBAAiB,QAAQ,SAAS,OAAO;;;;;EAOlD,wBAAwB;GACtB,iBAAiB,QAAQ,SAAS,OAAO,CAAC,CAAC,YAAY,KAAA,CAAS;EAClE,CAAC;EAED,OAAO;CACT;AACF"}

package/dist/components/feedback/toast/toast-outlet.d.ts

@@ -0,0 +1,28 @@
+import { ToastProviderProps } from "./toast-provider.js";
+import { ToastVariants } from "./use-toast-context.js";
+import React from "react";
+//#region src/components/feedback/toast/toast-outlet.d.ts
+export type ToastOutletProps = ToastVariants & Pick<ToastProviderProps, 'limit' | 'timeout'>;
+/**
+ * Onde aparecem os toasts abertos por `Toast.add` e `Toast.promise`. Monte um só, perto da raiz
+ * do app, abaixo dos providers globais (tema, tradução): os toasts só enxergam os providers acima
+ * dele, não os de quem os abriu.
+ *
+ * Um toast aberto antes de o `Outlet` montar espera por ele. O `limit` (3, por padrão) é quantos
+ * ficam visíveis; os mais antigos além dele somem até os da frente saírem. O `timeout` (5000ms,
+ * por padrão) vale para o toast que não traz o próprio, e `0` deixa o toast aberto.
+ *
+ * @example
+ * ```tsx
+ * <ThemeProvider>
+ *   <App />
+ *   <Toast.Outlet position="top-center" />
+ * </ThemeProvider>
+ * ```
+ */
+export declare const ToastOutlet: {
+  (props: ToastOutletProps): React.ReactNode;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=toast-outlet.d.ts.map