@povio/ui 5.0.0-rc.2 → 5.0.0-rc.4

package/dist/{Breadcrumbs-DiIYJAWf.js → Breadcrumbs-FF8hMfXd.js}

@@ -1,23 +1,25 @@
-import { t as DropdownMenuDesktop } from "./DropdownMenuDesktop-CGYxsavQ.js";
+import { t as DropdownMenuDesktop } from "./DropdownMenuDesktop-Cl9gZVq0.js";
 import { t as ChevronRight } from "./chevron-right-3nKJR5Bb.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
+import { t as UIOverrides } from "./uiOverrides.context-BTCH9y5a.js";
+import { t as IconSlot } from "./IconSlot-DSK7qNxc.js";
 import { l as $7230ffa83bc0c2cf$export$fabf2dc03a41866e, n as $7230ffa83bc0c2cf$export$29f1550f4b0d4415, r as $7230ffa83bc0c2cf$export$4d86445c2cf5e3, s as $7230ffa83bc0c2cf$export$df3a06d6289f983e } from "./utils-Czcqspm7.js";
-import { p as $263ab7fc0f95ccdb$export$4feb769f8ddf26c5 } from "./Dialog-CXoVeIkU.js";
+import { m as $263ab7fc0f95ccdb$export$4feb769f8ddf26c5 } from "./Dialog-CKLkS00H.js";
 import { n as $984a1fc08f87e4f3$export$e2509388b49734e7, t as $984a1fc08f87e4f3$export$a6c7ac8248d6e38a } from "./Link-FupWOW1f.js";
 import { n as $7705c033048f6da7$export$353f5b6fc5456de1 } from "./Button-D6KlWSFL.js";
-import { t as Tooltip } from "./Tooltip-aE1Vswxz.js";
-import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
-import { t as Typography } from "./Typography-B0Gp1lpc.js";
+import { t as Tooltip } from "./Tooltip-CpG1nz7Y.js";
+import { a as breadcrumbsDefinition, i as breadcrumbSegmentDefinition, n as breadcrumbIconDefinition, r as breadcrumbItemDefinition, t as breadcrumbChevronDefinition } from "./breadcrumbs.cva-7zzdDhVR.js";
+import { t as Typography } from "./Typography-LU4z2pR1.js";
 import { t as LinkContext } from "./link.context-J7aQtMOr.js";
 import $ahdqC$react, { createContext, forwardRef, useContext, useLayoutEffect, useRef, useState } from "react";
 import { c } from "react/compiler-runtime";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { mergeProps } from "react-aria/mergeProps";
 import { CollectionBuilder, createLeafComponent } from "react-aria/CollectionBuilder";
 import { filterDOMProps } from "react-aria/filterDOMProps";
 import { useBreadcrumbs } from "react-aria/useBreadcrumbs";
 import { Collection } from "react-aria/Collection";
 import { CollectionNode } from "react-aria/private/collections/BaseCollection";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region ../../node_modules/.bun/react-aria-components@1.21.1+67f6792bdf102c28/node_modules/react-aria-components/dist/private/Breadcrumbs.mjs
 const $65dbe90f868fa5f4$export$65596d3621b0a4a0 = /*#__PURE__*/ createContext(null);
 const $65dbe90f868fa5f4$export$2dc68d50d56fbbd = /*#__PURE__*/ forwardRef(function Breadcrumbs(props, ref) {
@@ -73,31 +75,6 @@ const $65dbe90f868fa5f4$export$dabcc1ec9dd9d1cc = /*#__PURE__*/ createLeafCompon
 	}, /*#__PURE__*/ $ahdqC$react.createElement($984a1fc08f87e4f3$export$e2509388b49734e7.Provider, { value: linkProps }, renderProps.children));
 });
 //#endregion
-//#region src/components/Breadcrumbs/breadcrumbs.cva.ts
-const breadcrumbsDefinition = UIOverrides.defineConfig({ base: ["flex items-center gap-breadcrumbs-gap-segment-to-segment"] });
-const breadcrumbSegmentDefinition = UIOverrides.defineConfig({ base: ["flex items-center gap-breadcrumbs-gap-segment-to-segment"] });
-const breadcrumbChevronDefinition = UIOverrides.defineConfig({ base: ["size-6 shrink-0 text-surface-default-foreground"] });
-const breadcrumbIconDefinition = UIOverrides.defineConfig({ base: ["size-4 shrink-0"] });
-const breadcrumbItemDefinition = UIOverrides.defineConfig({
-	base: ["inline-flex cursor-pointer items-center gap-breadcrumbs-gap-icon-to-text whitespace-nowrap font-inter font-medium text-small no-underline"],
-	config: {
-		variants: {
-			isCurrent: {
-				true: "text-interactive-primary-background",
-				false: "text-surface-default-foreground hover:text-tint-surface-default-foreground/80"
-			},
-			isEllipsis: {
-				true: "hover:text-tint-interactive-primary-background/80!",
-				false: ""
-			}
-		},
-		defaultVariants: {
-			isCurrent: false,
-			isEllipsis: false
-		}
-	}
-});
-//#endregion
 //#region src/components/Breadcrumbs/Breadcrumbs.tsx
 const Breadcrumbs = (t0) => {
 	const $ = c(58);
@@ -145,9 +122,9 @@ const Breadcrumbs = (t0) => {
 		t4 = (item, isCurrent, iconOnly_0) => /* @__PURE__ */ jsxs(LinkComponent, {
 			...item.link,
 			className: breadcrumbItem({ isCurrent }),
-			children: [item.icon && /* @__PURE__ */ jsx(item.icon, {
-				className: breadcrumbIconCva({}),
-				"aria-label": item.label
+			children: [item.icon && /* @__PURE__ */ jsx(IconSlot, {
+				icon: /* @__PURE__ */ jsx(item.icon, { "aria-label": item.label }),
+				className: breadcrumbIconCva({})
 			}), !iconOnly_0 && /* @__PURE__ */ jsx(Typography, {
 				size: "small",
 				children: item.label
@@ -209,7 +186,10 @@ const Breadcrumbs = (t0) => {
 		} else t9 = $[18];
 		let t10;
 		if ($[19] !== t9) {
-			t10 = /* @__PURE__ */ jsx(ChevronRight, { className: t9 });
+			t10 = /* @__PURE__ */ jsx(IconSlot, {
+				icon: ChevronRight,
+				className: t9
+			});
 			$[19] = t9;
 			$[20] = t10;
 		} else t10 = $[20];
@@ -241,7 +221,10 @@ const Breadcrumbs = (t0) => {
 		} else t14 = $[29];
 		let t15;
 		if ($[30] !== t14) {
-			t15 = /* @__PURE__ */ jsx(ChevronRight, { className: t14 });
+			t15 = /* @__PURE__ */ jsx(IconSlot, {
+				icon: ChevronRight,
+				className: t14
+			});
 			$[30] = t14;
 			$[31] = t15;
 		} else t15 = $[31];
@@ -306,7 +289,10 @@ const Breadcrumbs = (t0) => {
 			className: breadcrumbSegmentCva({}),
 			children: (t9) => {
 				const { isCurrent: isCurrent_0 } = t9;
-				return /* @__PURE__ */ jsxs(Fragment$1, { children: [renderBreadcrumbLink(item_1, isCurrent_0, iconOnly && item_1 === items[0]), !isCurrent_0 && /* @__PURE__ */ jsx(ChevronRight, { className: breadcrumbChevronCva({}) })] });
+				return /* @__PURE__ */ jsxs(Fragment$1, { children: [renderBreadcrumbLink(item_1, isCurrent_0, iconOnly && item_1 === items[0]), !isCurrent_0 && /* @__PURE__ */ jsx(IconSlot, {
+					icon: ChevronRight,
+					className: breadcrumbChevronCva({})
+				})] });
 			}
 		});
 		$[46] = breadcrumbChevronCva;
@@ -346,4 +332,4 @@ function _temp2(i) {
 	return i.label;
 }
 //#endregion
-export { breadcrumbSegmentDefinition as a, breadcrumbItemDefinition as i, breadcrumbChevronDefinition as n, breadcrumbsDefinition as o, breadcrumbIconDefinition as r, Breadcrumbs as t };
+export { Breadcrumbs as t };

package/dist/Button-C5rv4Cr2.js

@@ -0,0 +1,506 @@
+import { t as UIConfig } from "./uiConfig.context-BS3r_kTS.js";
+import { t as clsx } from "./clsx-CnD0nOiA.js";
+import { t as UIOverrides } from "./uiOverrides.context-BTCH9y5a.js";
+import { t as $984a1fc08f87e4f3$export$a6c7ac8248d6e38a } from "./Link-FupWOW1f.js";
+import { n as $7705c033048f6da7$export$353f5b6fc5456de1 } from "./Button-D6KlWSFL.js";
+import { t as $75afe627ae0cc0fa$export$d2b052e7b4be1756 } from "./ToggleButton-BW1ensey.js";
+import { t as LinkContext } from "./link.context-J7aQtMOr.js";
+import { t as ButtonContent } from "./ButtonContent-c7lJayVQ.js";
+import { n as uiOutlineClass } from "./outline.clsx-50W_vNDl.js";
+import { t as compoundMapper } from "./compoundMapper-Di3SKZnS.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/buttons/Button/button.cva.ts
+const buttonDefinition = UIOverrides.defineConfig({
+	base: [
+		"group inline-flex items-center justify-center border border-solid",
+		uiOutlineClass,
+		"group-data-[split]/split:data-[separator]:relative",
+		"group-data-[split]/split:data-[separator]:after:content-['']",
+		"group-data-[split]/split:data-[separator]:after:h-full",
+		"group-data-[split]/split:data-[separator]:after:w-px",
+		"group-data-[split]/split:data-[separator]:after:absolute",
+		"group-data-[split]/split:data-[separator]:after:-right-px",
+		"group-data-[split]/split:data-[separator]:after:border-t",
+		"group-data-[split]/split:data-[separator]:after:border-b",
+		"group-data-[split]/split:data-[separator]:after:box-content"
+	],
+	config: {
+		variants: {
+			width: {
+				fill: "w-full",
+				hug: "w-auto"
+			},
+			size: {
+				s: "",
+				sm: "",
+				default: "",
+				none: ""
+			},
+			color: {
+				primary: "",
+				secondary: "",
+				error: "",
+				dual: ""
+			},
+			variant: {
+				contained: "",
+				solid: "",
+				outlined: "",
+				outline: "",
+				subtle: "",
+				text: "group-data-[split]/split:data-[separator]:after:hidden",
+				ghost: ""
+			},
+			inverted: {
+				true: "",
+				false: ""
+			}
+		},
+		compoundVariants: [
+			{
+				variant: ["contained", "solid"],
+				color: ["primary", "dual"],
+				className: [
+					"bg-interactive-primary-background border-interactive-primary-background text-interactive-primary-foreground",
+					"not-data-[selected]:hover:border-state-interactive-primary-background/hover not-data-[selected]:hover:bg-state-interactive-primary-background/hover",
+					"not-data-[selected]:pressed:border-state-interactive-primary-background/pressed not-data-[selected]:pressed:bg-state-interactive-primary-background/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-primary-background/disabled not-data-[selected]:disabled:bg-state-interactive-primary-background/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-primary-background/focus not-data-[selected]:focus-visible:bg-state-interactive-primary-background/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-primary-background/toggled selected:border-state-interactive-primary-background/toggled selected:text-interactive-primary-foreground",
+					"selected:hover:bg-state-interactive-primary-background/toggled-hovered selected:hover:border-state-interactive-primary-background/toggled-hovered selected:hover:text-interactive-primary-foreground",
+					"selected:disabled:bg-state-interactive-primary-background/toggled-disabled selected:disabled:border-state-interactive-primary-background/toggled-disabled selected:disabled:text-interactive-primary-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:bg-interactive-primary-foreground! group-data-[split]/split:data-[separator]:selected:after:bg-interactive-primary-foreground!"
+				]
+			},
+			{
+				variant: ["outlined", "outline"],
+				color: ["primary", "dual"],
+				className: [
+					"bg-support-transparent-outline border-interactive-subtle-primary-foreground text-interactive-subtle-primary-foreground",
+					"not-data-[selected]:hover:border-state-interactive-subtle-primary-foreground/hover not-data-[selected]:hover:text-state-interactive-subtle-primary-foreground/hover",
+					"not-data-[selected]:pressed:border-state-interactive-subtle-primary-foreground/pressed not-data-[selected]:pressed:text-state-interactive-subtle-primary-foreground/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-subtle-primary-foreground/disabled not-data-[selected]:disabled:text-state-interactive-subtle-primary-foreground/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-subtle-primary-foreground/focus not-data-[selected]:focus-visible:text-state-interactive-subtle-primary-foreground/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-primary-background/toggled selected:border-state-interactive-primary-background/toggled selected:text-interactive-primary-foreground",
+					"selected:hover:bg-state-interactive-primary-background/toggled-hovered selected:hover:border-state-interactive-primary-background/toggled-hovered selected:hover:text-interactive-primary-foreground",
+					"selected:disabled:bg-state-interactive-primary-background/toggled-disabled selected:disabled:border-state-interactive-primary-background/toggled-disabled selected:disabled:text-interactive-primary-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-primary-foreground! group-data-[split]/split:data-[separator]:selected:after:bg-interactive-primary-foreground!"
+				]
+			},
+			{
+				variant: "subtle",
+				color: ["primary", "dual"],
+				className: [
+					"bg-interactive-subtle-primary-background border-interactive-subtle-primary-background text-interactive-subtle-primary-foreground",
+					"not-data-[selected]:hover:border-state-interactive-subtle-primary-background/hover not-data-[selected]:hover:bg-state-interactive-subtle-primary-background/hover not-data-[selected]:hover:text-state-interactive-subtle-primary-foreground/hover",
+					"not-data-[selected]:pressed:border-state-interactive-subtle-primary-background/pressed not-data-[selected]:pressed:bg-state-interactive-subtle-primary-background/pressed not-data-[selected]:pressed:text-state-interactive-subtle-primary-foreground/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-subtle-primary-background/disabled not-data-[selected]:disabled:bg-state-interactive-subtle-primary-background/disabled not-data-[selected]:disabled:text-state-interactive-subtle-primary-foreground/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-subtle-primary-background/focus not-data-[selected]:focus-visible:bg-state-interactive-subtle-primary-background/focus not-data-[selected]:focus-visible:text-state-interactive-subtle-primary-foreground/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-primary-background/toggled selected:border-state-interactive-primary-background/toggled selected:text-interactive-primary-foreground",
+					"selected:hover:bg-state-interactive-primary-background/toggled-hovered selected:hover:border-state-interactive-primary-background/toggled-hovered selected:hover:text-interactive-primary-foreground",
+					"selected:disabled:bg-state-interactive-primary-background/toggled-disabled selected:disabled:border-state-interactive-primary-background/toggled-disabled selected:disabled:text-interactive-primary-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-primary-foreground! group-data-[split]/split:data-[separator]:selected:after:bg-interactive-primary-foreground!"
+				]
+			},
+			{
+				variant: "ghost",
+				color: ["primary", "dual"],
+				className: [
+					"bg-support-transparent-outline border-support-transparent-outline text-interactive-subtle-primary-foreground",
+					"not-data-[selected]:hover:border-state-interactive-subtle-primary-background/hover not-data-[selected]:hover:bg-state-interactive-subtle-primary-background/hover not-data-[selected]:hover:text-state-interactive-subtle-primary-foreground/hover",
+					"not-data-[selected]:pressed:border-state-interactive-subtle-primary-background/pressed not-data-[selected]:pressed:bg-state-interactive-subtle-primary-background/pressed not-data-[selected]:pressed:text-state-interactive-subtle-primary-foreground/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-subtle-primary-background/disabled not-data-[selected]:disabled:bg-state-interactive-subtle-primary-background/disabled not-data-[selected]:disabled:text-state-interactive-subtle-primary-foreground/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-subtle-primary-background/focus not-data-[selected]:focus-visible:bg-state-interactive-subtle-primary-background/focus not-data-[selected]:focus-visible:text-state-interactive-subtle-primary-foreground/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-primary-background/toggled selected:border-state-interactive-primary-background/toggled selected:text-interactive-primary-foreground",
+					"selected:hover:bg-state-interactive-primary-background/toggled-hovered selected:hover:border-state-interactive-primary-background/toggled-hovered selected:hover:text-interactive-primary-foreground",
+					"selected:disabled:bg-state-interactive-primary-background/toggled-disabled selected:disabled:border-state-interactive-primary-background/toggled-disabled selected:disabled:text-interactive-primary-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:hidden"
+				]
+			},
+			{
+				variant: ["contained", "solid"],
+				color: "secondary",
+				className: [
+					"bg-interactive-secondary-background border-interactive-secondary-background text-interactive-secondary-foreground",
+					"not-data-[selected]:hover:border-state-interactive-secondary-background/hover not-data-[selected]:hover:bg-state-interactive-secondary-background/hover",
+					"not-data-[selected]:pressed:border-state-interactive-secondary-background/pressed not-data-[selected]:pressed:bg-state-interactive-secondary-background/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-secondary-background/disabled not-data-[selected]:disabled:bg-state-interactive-secondary-background/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-secondary-background/focus not-data-[selected]:focus-visible:bg-state-interactive-secondary-background/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-secondary-background/toggled selected:border-state-interactive-secondary-background/toggled selected:text-interactive-secondary-foreground",
+					"selected:hover:bg-state-interactive-secondary-background/toggled-hovered selected:hover:border-state-interactive-secondary-background/toggled-hovered selected:hover:text-interactive-secondary-foreground",
+					"selected:disabled:bg-state-interactive-secondary-background/toggled-disabled selected:disabled:border-state-interactive-secondary-background/toggled-disabled selected:disabled:text-interactive-secondary-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:bg-interactive-secondary-foreground! group-data-[split]/split:data-[separator]:selected:after:bg-interactive-secondary-foreground!"
+				]
+			},
+			{
+				variant: ["outlined", "outline"],
+				color: "secondary",
+				className: [
+					"bg-support-transparent-outline border-interactive-subtle-secondary-foreground text-interactive-subtle-secondary-foreground",
+					"not-data-[selected]:hover:border-state-interactive-subtle-secondary-foreground/hover not-data-[selected]:hover:text-state-interactive-subtle-secondary-foreground/hover",
+					"not-data-[selected]:pressed:border-state-interactive-subtle-secondary-foreground/pressed not-data-[selected]:pressed:text-state-interactive-subtle-secondary-foreground/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-subtle-secondary-foreground/disabled not-data-[selected]:disabled:text-state-interactive-subtle-secondary-foreground/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-subtle-secondary-foreground/focus not-data-[selected]:focus-visible:text-state-interactive-subtle-secondary-foreground/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-secondary-background/toggled selected:border-state-interactive-secondary-background/toggled selected:text-interactive-secondary-foreground",
+					"selected:hover:bg-state-interactive-secondary-background/toggled-hovered selected:hover:border-state-interactive-secondary-background/toggled-hovered selected:hover:text-interactive-secondary-foreground",
+					"selected:disabled:bg-state-interactive-secondary-background/toggled-disabled selected:disabled:border-state-interactive-secondary-background/toggled-disabled selected:disabled:text-interactive-secondary-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-secondary-foreground! group-data-[split]/split:data-[separator]:selected:after:bg-interactive-secondary-foreground!"
+				]
+			},
+			{
+				variant: "subtle",
+				color: "secondary",
+				className: [
+					"bg-interactive-subtle-secondary-background border-interactive-subtle-secondary-background text-interactive-subtle-secondary-foreground",
+					"not-data-[selected]:hover:border-state-interactive-subtle-secondary-background/hover not-data-[selected]:hover:bg-state-interactive-subtle-secondary-background/hover not-data-[selected]:hover:text-state-interactive-subtle-secondary-foreground/hover",
+					"not-data-[selected]:pressed:border-state-interactive-subtle-secondary-background/pressed not-data-[selected]:pressed:bg-state-interactive-subtle-secondary-background/pressed not-data-[selected]:pressed:text-state-interactive-subtle-secondary-foreground/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-subtle-secondary-background/disabled not-data-[selected]:disabled:bg-state-interactive-subtle-secondary-background/disabled not-data-[selected]:disabled:text-state-interactive-subtle-secondary-foreground/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-subtle-secondary-background/focus not-data-[selected]:focus-visible:bg-state-interactive-subtle-secondary-background/focus not-data-[selected]:focus-visible:text-state-interactive-subtle-secondary-foreground/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-secondary-background/toggled selected:border-state-interactive-secondary-background/toggled selected:text-interactive-secondary-foreground",
+					"selected:hover:bg-state-interactive-secondary-background/toggled-hovered selected:hover:border-state-interactive-secondary-background/toggled-hovered selected:hover:text-interactive-secondary-foreground",
+					"selected:disabled:bg-state-interactive-secondary-background/toggled-disabled selected:disabled:border-state-interactive-secondary-background/toggled-disabled selected:disabled:text-interactive-secondary-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-secondary-foreground! group-data-[split]/split:data-[separator]:selected:after:bg-interactive-secondary-foreground!"
+				]
+			},
+			{
+				variant: "ghost",
+				color: "secondary",
+				className: [
+					"bg-support-transparent-outline border-support-transparent-outline text-interactive-subtle-secondary-foreground",
+					"not-data-[selected]:hover:border-state-interactive-subtle-secondary-background/hover not-data-[selected]:hover:bg-state-interactive-subtle-secondary-background/hover not-data-[selected]:hover:text-state-interactive-subtle-secondary-foreground/hover",
+					"not-data-[selected]:pressed:border-state-interactive-subtle-secondary-background/pressed not-data-[selected]:pressed:bg-state-interactive-subtle-secondary-background/pressed not-data-[selected]:pressed:text-state-interactive-subtle-secondary-foreground/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-subtle-secondary-background/disabled not-data-[selected]:disabled:bg-state-interactive-subtle-secondary-background/disabled not-data-[selected]:disabled:text-state-interactive-subtle-secondary-foreground/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-subtle-secondary-background/focus not-data-[selected]:focus-visible:bg-state-interactive-subtle-secondary-background/focus not-data-[selected]:focus-visible:text-state-interactive-subtle-secondary-foreground/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-secondary-background/toggled selected:border-state-interactive-secondary-background/toggled selected:text-interactive-secondary-foreground",
+					"selected:hover:bg-state-interactive-secondary-background/toggled-hovered selected:hover:border-state-interactive-secondary-background/toggled-hovered selected:hover:text-interactive-secondary-foreground",
+					"selected:disabled:bg-state-interactive-secondary-background/toggled-disabled selected:disabled:border-state-interactive-secondary-background/toggled-disabled selected:disabled:text-interactive-secondary-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:hidden"
+				]
+			},
+			{
+				variant: ["contained", "solid"],
+				color: "error",
+				className: [
+					"bg-interactive-destructive-background border-interactive-destructive-background text-interactive-destructive-foreground",
+					"not-data-[selected]:hover:border-state-interactive-destructive-background/hover not-data-[selected]:hover:bg-state-interactive-destructive-background/hover",
+					"not-data-[selected]:pressed:border-state-interactive-destructive-background/pressed not-data-[selected]:pressed:bg-state-interactive-destructive-background/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-destructive-background/disabled not-data-[selected]:disabled:bg-state-interactive-destructive-background/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-destructive-background/focus not-data-[selected]:focus-visible:bg-state-interactive-destructive-background/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-destructive-background/toggled selected:border-state-interactive-destructive-background/toggled selected:text-interactive-destructive-foreground",
+					"selected:hover:bg-state-interactive-destructive-background/toggled-hovered selected:hover:border-state-interactive-destructive-background/toggled-hovered selected:hover:text-interactive-destructive-foreground",
+					"selected:disabled:bg-state-interactive-destructive-background/toggled-disabled selected:disabled:border-state-interactive-destructive-background/toggled-disabled selected:disabled:text-interactive-destructive-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:bg-interactive-destructive-foreground! group-data-[split]/split:data-[separator]:selected:after:bg-interactive-destructive-foreground!"
+				]
+			},
+			{
+				variant: ["outlined", "outline"],
+				color: "error",
+				className: [
+					"bg-support-transparent-outline border-interactive-subtle-destructive-foreground text-interactive-subtle-destructive-foreground",
+					"not-data-[selected]:hover:border-state-interactive-subtle-destructive-foreground/hover not-data-[selected]:hover:text-state-interactive-subtle-destructive-foreground/hover",
+					"not-data-[selected]:pressed:border-state-interactive-subtle-destructive-foreground/pressed not-data-[selected]:pressed:text-state-interactive-subtle-destructive-foreground/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-subtle-destructive-foreground/disabled not-data-[selected]:disabled:text-state-interactive-subtle-destructive-foreground/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-subtle-destructive-foreground/focus not-data-[selected]:focus-visible:text-state-interactive-subtle-destructive-foreground/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-destructive-background/toggled selected:border-state-interactive-destructive-background/toggled selected:text-interactive-destructive-foreground",
+					"selected:hover:bg-state-interactive-destructive-background/toggled-hovered selected:hover:border-state-interactive-destructive-background/toggled-hovered selected:hover:text-interactive-destructive-foreground",
+					"selected:disabled:bg-state-interactive-destructive-background/toggled-disabled selected:disabled:border-state-interactive-destructive-background/toggled-disabled selected:disabled:text-interactive-destructive-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-destructive-foreground! group-data-[split]/split:data-[separator]:selected:after:bg-interactive-destructive-foreground!"
+				]
+			},
+			{
+				variant: "subtle",
+				color: "error",
+				className: [
+					"bg-interactive-subtle-destructive-background border-interactive-subtle-destructive-background text-interactive-subtle-destructive-foreground",
+					"not-data-[selected]:hover:border-state-interactive-subtle-destructive-background/hover not-data-[selected]:hover:bg-state-interactive-subtle-destructive-background/hover not-data-[selected]:hover:text-state-interactive-subtle-destructive-foreground/hover",
+					"not-data-[selected]:pressed:border-state-interactive-subtle-destructive-background/pressed not-data-[selected]:pressed:bg-state-interactive-subtle-destructive-background/pressed not-data-[selected]:pressed:text-state-interactive-subtle-destructive-foreground/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-subtle-destructive-background/disabled not-data-[selected]:disabled:bg-state-interactive-subtle-destructive-background/disabled not-data-[selected]:disabled:text-state-interactive-subtle-destructive-foreground/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-subtle-destructive-background/focus not-data-[selected]:focus-visible:bg-state-interactive-subtle-destructive-background/focus not-data-[selected]:focus-visible:text-state-interactive-subtle-destructive-foreground/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-destructive-background/toggled selected:border-state-interactive-destructive-background/toggled selected:text-interactive-destructive-foreground",
+					"selected:hover:bg-state-interactive-destructive-background/toggled-hovered selected:hover:border-state-interactive-destructive-background/toggled-hovered selected:hover:text-interactive-destructive-foreground",
+					"selected:disabled:bg-state-interactive-destructive-background/toggled-disabled selected:disabled:border-state-interactive-destructive-background/toggled-disabled selected:disabled:text-interactive-destructive-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-destructive-foreground! group-data-[split]/split:data-[separator]:selected:after:bg-interactive-destructive-foreground!"
+				]
+			},
+			{
+				variant: "ghost",
+				color: "error",
+				className: [
+					"bg-support-transparent-outline border-support-transparent-outline text-interactive-subtle-destructive-foreground",
+					"not-data-[selected]:hover:border-state-interactive-subtle-destructive-background/hover not-data-[selected]:hover:bg-state-interactive-subtle-destructive-background/hover not-data-[selected]:hover:text-state-interactive-subtle-destructive-foreground/hover",
+					"not-data-[selected]:pressed:border-state-interactive-subtle-destructive-background/pressed not-data-[selected]:pressed:bg-state-interactive-subtle-destructive-background/pressed not-data-[selected]:pressed:text-state-interactive-subtle-destructive-foreground/pressed",
+					"not-data-[selected]:disabled:border-state-interactive-subtle-destructive-background/disabled not-data-[selected]:disabled:bg-state-interactive-subtle-destructive-background/disabled not-data-[selected]:disabled:text-state-interactive-subtle-destructive-foreground/disabled",
+					"not-data-[selected]:focus-visible:border-state-interactive-subtle-destructive-background/focus not-data-[selected]:focus-visible:bg-state-interactive-subtle-destructive-background/focus not-data-[selected]:focus-visible:text-state-interactive-subtle-destructive-foreground/focus",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-state-interactive-destructive-background/toggled selected:border-state-interactive-destructive-background/toggled selected:text-interactive-destructive-foreground",
+					"selected:hover:bg-state-interactive-destructive-background/toggled-hovered selected:hover:border-state-interactive-destructive-background/toggled-hovered selected:hover:text-interactive-destructive-foreground",
+					"selected:disabled:bg-state-interactive-destructive-background/toggled-disabled selected:disabled:border-state-interactive-destructive-background/toggled-disabled selected:disabled:text-interactive-destructive-foreground/40",
+					"group-data-[split]/split:data-[separator]:after:hidden"
+				]
+			},
+			{
+				variant: "text",
+				color: "primary",
+				inverted: false,
+				className: [
+					"bg-support-transparent-outline border-support-transparent-outline",
+					"text-interactive-primary-background",
+					"not-data-[selected]:hover:text-state-interactive-primary-background/hover",
+					"not-data-[selected]:pressed:text-state-interactive-primary-background/pressed",
+					"not-data-[selected]:disabled:text-state-interactive-primary-background/disabled",
+					"not-data-[selected]:focus-visible:text-state-interactive-primary-background/focus",
+					"selected:text-state-interactive-primary-background/toggled",
+					"selected:hover:text-state-interactive-primary-background/toggled-hovered",
+					"selected:disabled:text-state-interactive-primary-background/toggled-disabled",
+					"focus-visible:outline-interactive-ring"
+				]
+			},
+			{
+				variant: "text",
+				color: "secondary",
+				className: [
+					"bg-support-transparent-outline border-support-transparent-outline",
+					"text-interactive-secondary-background",
+					"not-data-[selected]:hover:text-state-interactive-secondary-background/hover",
+					"not-data-[selected]:pressed:text-state-interactive-secondary-background/pressed",
+					"not-data-[selected]:disabled:text-state-interactive-secondary-background/disabled",
+					"not-data-[selected]:focus-visible:text-state-interactive-secondary-background/focus",
+					"selected:text-state-interactive-secondary-background/toggled",
+					"selected:hover:text-state-interactive-secondary-background/toggled-hovered",
+					"selected:disabled:text-state-interactive-secondary-background/toggled-disabled",
+					"focus-visible:outline-interactive-ring"
+				]
+			},
+			{
+				variant: "text",
+				color: "error",
+				className: [
+					"bg-support-transparent-outline border-support-transparent-outline",
+					"text-interactive-destructive-background",
+					"not-data-[selected]:hover:text-state-interactive-destructive-background/hover",
+					"not-data-[selected]:pressed:text-state-interactive-destructive-background/pressed",
+					"not-data-[selected]:disabled:text-state-interactive-destructive-background/disabled",
+					"not-data-[selected]:focus-visible:text-state-interactive-destructive-background/focus",
+					"selected:text-state-interactive-destructive-background/toggled",
+					"selected:hover:text-state-interactive-destructive-background/toggled-hovered",
+					"selected:disabled:text-state-interactive-destructive-background/toggled-disabled",
+					"focus-visible:outline-interactive-ring"
+				]
+			},
+			{
+				variant: "text",
+				color: "primary",
+				inverted: true,
+				className: [
+					"bg-support-transparent-outline border-support-transparent-outline",
+					"text-interactive-primary-foreground",
+					"not-data-[selected]:hover:text-state-interactive-primary-foreground/hover",
+					"not-data-[selected]:pressed:text-state-interactive-primary-foreground/pressed",
+					"not-data-[selected]:disabled:text-state-interactive-primary-foreground/disabled",
+					"not-data-[selected]:focus-visible:text-state-interactive-primary-foreground/focus",
+					"selected:text-state-interactive-primary-foreground/toggled",
+					"selected:hover:text-state-interactive-primary-foreground/toggled-hovered",
+					"selected:disabled:text-state-interactive-primary-foreground/toggled-disabled",
+					"focus-visible:outline-interactive-ring"
+				]
+			},
+			{
+				variant: "text",
+				color: "dual",
+				className: [
+					"bg-support-transparent-outline border-support-transparent-outline",
+					"text-interactive-primary-background",
+					"[&_svg]:text-interactive-secondary-background",
+					"not-data-[selected]:hover:text-state-interactive-primary-background/hover not-data-[selected]:hover:[&_svg]:text-state-interactive-secondary-background/hover",
+					"not-data-[selected]:pressed:text-state-interactive-primary-background/pressed not-data-[selected]:pressed:[&_svg]:text-state-interactive-secondary-background/pressed",
+					"not-data-[selected]:disabled:text-state-interactive-primary-background/disabled not-data-[selected]:disabled:[&_svg]:text-state-interactive-secondary-background/disabled",
+					"not-data-[selected]:focus-visible:text-state-interactive-primary-background/focus not-data-[selected]:focus-visible:[&_svg]:text-state-interactive-secondary-background/focus",
+					"selected:text-state-interactive-primary-background/toggled selected:[&_svg]:text-state-interactive-secondary-background/toggled",
+					"selected:hover:text-state-interactive-primary-background/toggled-hovered selected:hover:[&_svg]:text-state-interactive-secondary-background/toggled-hovered",
+					"selected:disabled:text-state-interactive-primary-background/toggled-disabled selected:disabled:[&_svg]:text-state-interactive-secondary-background/toggled-disabled",
+					"focus-visible:outline-interactive-ring"
+				]
+			}
+		],
+		defaultVariants: {
+			width: "hug",
+			color: "primary",
+			variant: "contained",
+			inverted: false
+		}
+	}
+});
+const buttonSizeDefinition = UIOverrides.defineConfig({
+	base: [],
+	config: {
+		variants: {
+			size: {
+				s: "rounded-button-rounding-small",
+				sm: "rounded-button-rounding-small",
+				default: "rounded-button-rounding-default",
+				none: "p-0"
+			},
+			iconOnly: {
+				true: "",
+				false: ""
+			}
+		},
+		compoundVariants: [
+			{
+				size: ["s", "sm"],
+				iconOnly: false,
+				className: "px-button-side-small py-button-height-small"
+			},
+			{
+				size: "default",
+				iconOnly: false,
+				className: "px-button-side-default py-button-height-default"
+			},
+			{
+				size: ["s", "sm"],
+				iconOnly: true,
+				className: "p-button-height-small"
+			},
+			{
+				size: "default",
+				iconOnly: true,
+				className: "p-button-height-default"
+			}
+		],
+		defaultVariants: {
+			size: "default",
+			iconOnly: false
+		}
+	}
+});
+const buttonContentDefinition = UIOverrides.defineConfig({
+	base: [],
+	config: {
+		variants: {
+			size: {
+				s: "gap-button-gap-icon-to-label",
+				sm: "gap-button-gap-icon-to-label",
+				default: "gap-button-gap-icon-to-label",
+				none: "gap-button-gap-icon-to-label"
+			},
+			iconPosition: {
+				left: "",
+				right: "",
+				none: ""
+			},
+			iconOnly: {
+				true: "",
+				false: ""
+			}
+		},
+		defaultVariants: {
+			size: "default",
+			iconPosition: "left",
+			iconOnly: false
+		}
+	}
+});
+const buttonIconSizeDefinition = UIOverrides.defineConfig({
+	base: [],
+	config: {
+		variants: { size: {
+			s: "size-icons-size",
+			sm: "size-icons-size",
+			default: "size-icons-size",
+			none: "size-icons-size"
+		} },
+		defaultVariants: { size: "default" }
+	}
+});
+const buttonTypography = compoundMapper({ default: {
+	size: "large",
+	className: "font-bold"
+} });
+//#endregion
+//#region src/components/buttons/Button/Button.tsx
+const getContentIconPosition = ({ icon, startIcon, endIcon, iconPosition }) => {
+	if (startIcon || !endIcon && icon && iconPosition !== "right") return "left";
+	if (endIcon || icon) return "right";
+	return "none";
+};
+const Button = ({ icon: Icon, startIcon, endIcon, iconPosition, children, isLoading: isLoadingProp, loading, className, link, iconClassName, noDisableWhenLoading, disableWhileLoading, contentRef, variant: variantProp, size: sizeProp, width: widthProp, fullWidth, ...props }) => {
+	const linkContext = LinkContext.useLinkContext();
+	const uiConfig = UIConfig.useConfig();
+	const variant = variantProp ?? uiConfig.button.variant;
+	const size = sizeProp ?? uiConfig.button.size;
+	const width = fullWidth ? "fill" : widthProp;
+	const isLoading = isLoadingProp ?? loading;
+	const shouldDisableWhileLoading = disableWhileLoading ?? !noDisableWhenLoading;
+	const contentIconPosition = getContentIconPosition({
+		icon: Icon,
+		startIcon,
+		endIcon,
+		iconPosition
+	});
+	const buttonCva = UIOverrides.useCva("button.cva", buttonDefinition);
+	const buttonSizeCva = UIOverrides.useCva("button.sizeCva", buttonSizeDefinition);
+	const buttonContentCva = UIOverrides.useCva("button.contentCva", buttonContentDefinition);
+	const buttonIconSizeCva = UIOverrides.useCva("button.iconSize", buttonIconSizeDefinition);
+	const typographyMap = UIOverrides.useMapper("button.typography", buttonTypography);
+	const Component = (() => {
+		if (link) return linkContext?.LinkComponent ?? $984a1fc08f87e4f3$export$a6c7ac8248d6e38a;
+		if (props.toggle != null) return $75afe627ae0cc0fa$export$d2b052e7b4be1756;
+		return $7705c033048f6da7$export$353f5b6fc5456de1;
+	})();
+	if (link && !link.to && link.href) link.to = link.href;
+	return /* @__PURE__ */ jsx(Component, {
+		...props,
+		...link,
+		isDisabled: props.isDisabled || isLoading && shouldDisableWhileLoading,
+		className: clsx(buttonCva({
+			...props,
+			variant,
+			size,
+			width,
+			className
+		}), buttonSizeCva({
+			...props,
+			variant,
+			size
+		}), buttonContentCva({
+			...props,
+			variant,
+			size,
+			iconPosition: contentIconPosition
+		})),
+		children: /* @__PURE__ */ jsx(ButtonContent, {
+			ref: contentRef,
+			isLoading,
+			icon: Icon,
+			startIcon,
+			endIcon,
+			content: children,
+			hideText: props.iconOnly,
+			iconPosition,
+			iconClassName: buttonIconSizeCva({
+				...props,
+				variant,
+				size,
+				className: iconClassName
+			}),
+			typography: typographyMap({
+				...props,
+				variant,
+				size
+			})
+		})
+	});
+};
+//#endregion
+export { buttonSizeDefinition as a, buttonIconSizeDefinition as i, buttonContentDefinition as n, buttonDefinition as r, Button as t };

package/dist/{Button-BZ3is6IU.d.ts → Button-D-4qb0IR.d.ts}

@@ -1,6 +1,6 @@
-import { n as LinkNavigationProps } from "./Link-QYpprkN1.js";
-import { n as ButtonVariantProps } from "./button.cva-BvRI-3Gn.js";
-import { t as ButtonContentVariantProps } from "./buttonContent.cva-BDT_CReI.js";
+import { n as LinkNavigationProps } from "./Link-Ow9H7kNv.js";
+import { n as ButtonVariantProps } from "./button.cva-C7kEhgoA.js";
+import { t as ButtonContentVariantProps } from "./buttonContent.cva-DPIlROA9.js";
 import { FC, ReactElement, ReactNode, Ref, SVGProps } from "react";
 import { ButtonProps as ButtonProps$2, ToggleButtonProps as ToggleButtonProps$2 } from "react-aria-components";
 //#region src/components/buttons/Button/Button.d.ts