@povio/ui 4.0.2 → 5.0.0-rc.2

package/dist/Button-sn52l1Yv.js

@@ -0,0 +1,506 @@
+import { t as UIConfig } from "./uiConfig.context-D2eUIPHn.js";
+import { t as clsx } from "./clsx-CnD0nOiA.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 UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
+import { t as LinkContext } from "./link.context-J7aQtMOr.js";
+import { t as ButtonContent } from "./ButtonContent-B2_dZ6vA.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-tint-interactive-primary-background/80 not-data-[selected]:hover:bg-tint-interactive-primary-background/80",
+					"not-data-[selected]:pressed:border-tint-interactive-primary-background/70 not-data-[selected]:pressed:bg-tint-interactive-primary-background/70",
+					"not-data-[selected]:disabled:border-tint-interactive-primary-background/50 not-data-[selected]:disabled:bg-tint-interactive-primary-background/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-primary-background/60 not-data-[selected]:focus-visible:bg-tint-interactive-primary-background/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-primary-background/75 selected:border-shade-interactive-primary-background/75 selected:text-interactive-primary-foreground",
+					"selected:hover:bg-shade-interactive-primary-background/65 selected:hover:border-shade-interactive-primary-background/65 selected:hover:text-interactive-primary-foreground",
+					"selected:disabled:bg-shade-interactive-primary-background/55 selected:disabled:border-shade-interactive-primary-background/55 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-tint-interactive-subtle-primary-foreground/80 not-data-[selected]:hover:text-tint-interactive-subtle-primary-foreground/80",
+					"not-data-[selected]:pressed:border-tint-interactive-subtle-primary-foreground/70 not-data-[selected]:pressed:text-tint-interactive-subtle-primary-foreground/70",
+					"not-data-[selected]:disabled:border-tint-interactive-subtle-primary-foreground/50 not-data-[selected]:disabled:text-tint-interactive-subtle-primary-foreground/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-subtle-primary-foreground/60 not-data-[selected]:focus-visible:text-tint-interactive-subtle-primary-foreground/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-primary-background/75 selected:border-shade-interactive-primary-background/75 selected:text-interactive-primary-foreground",
+					"selected:hover:bg-shade-interactive-primary-background/65 selected:hover:border-shade-interactive-primary-background/65 selected:hover:text-interactive-primary-foreground",
+					"selected:disabled:bg-shade-interactive-primary-background/55 selected:disabled:border-shade-interactive-primary-background/55 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-tint-interactive-subtle-primary-background/80 not-data-[selected]:hover:bg-tint-interactive-subtle-primary-background/80 not-data-[selected]:hover:text-tint-interactive-subtle-primary-foreground/80",
+					"not-data-[selected]:pressed:border-tint-interactive-subtle-primary-background/70 not-data-[selected]:pressed:bg-tint-interactive-subtle-primary-background/70 not-data-[selected]:pressed:text-tint-interactive-subtle-primary-foreground/70",
+					"not-data-[selected]:disabled:border-tint-interactive-subtle-primary-background/50 not-data-[selected]:disabled:bg-tint-interactive-subtle-primary-background/50 not-data-[selected]:disabled:text-tint-interactive-subtle-primary-foreground/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-subtle-primary-background/60 not-data-[selected]:focus-visible:bg-tint-interactive-subtle-primary-background/60 not-data-[selected]:focus-visible:text-tint-interactive-subtle-primary-foreground/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-primary-background/75 selected:border-shade-interactive-primary-background/75 selected:text-interactive-primary-foreground",
+					"selected:hover:bg-shade-interactive-primary-background/65 selected:hover:border-shade-interactive-primary-background/65 selected:hover:text-interactive-primary-foreground",
+					"selected:disabled:bg-shade-interactive-primary-background/55 selected:disabled:border-shade-interactive-primary-background/55 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-tint-interactive-subtle-primary-background/80 not-data-[selected]:hover:bg-tint-interactive-subtle-primary-background/80 not-data-[selected]:hover:text-tint-interactive-subtle-primary-foreground/80",
+					"not-data-[selected]:pressed:border-tint-interactive-subtle-primary-background/70 not-data-[selected]:pressed:bg-tint-interactive-subtle-primary-background/70 not-data-[selected]:pressed:text-tint-interactive-subtle-primary-foreground/70",
+					"not-data-[selected]:disabled:border-tint-interactive-subtle-primary-background/50 not-data-[selected]:disabled:bg-tint-interactive-subtle-primary-background/50 not-data-[selected]:disabled:text-tint-interactive-subtle-primary-foreground/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-subtle-primary-background/60 not-data-[selected]:focus-visible:bg-tint-interactive-subtle-primary-background/60 not-data-[selected]:focus-visible:text-tint-interactive-subtle-primary-foreground/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-primary-background/75 selected:border-shade-interactive-primary-background/75 selected:text-interactive-primary-foreground",
+					"selected:hover:bg-shade-interactive-primary-background/65 selected:hover:border-shade-interactive-primary-background/65 selected:hover:text-interactive-primary-foreground",
+					"selected:disabled:bg-shade-interactive-primary-background/55 selected:disabled:border-shade-interactive-primary-background/55 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-tint-interactive-secondary-background/80 not-data-[selected]:hover:bg-tint-interactive-secondary-background/80",
+					"not-data-[selected]:pressed:border-tint-interactive-secondary-background/70 not-data-[selected]:pressed:bg-tint-interactive-secondary-background/70",
+					"not-data-[selected]:disabled:border-tint-interactive-secondary-background/50 not-data-[selected]:disabled:bg-tint-interactive-secondary-background/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-secondary-background/60 not-data-[selected]:focus-visible:bg-tint-interactive-secondary-background/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-secondary-background/75 selected:border-shade-interactive-secondary-background/75 selected:text-interactive-secondary-foreground",
+					"selected:hover:bg-shade-interactive-secondary-background/65 selected:hover:border-shade-interactive-secondary-background/65 selected:hover:text-interactive-secondary-foreground",
+					"selected:disabled:bg-shade-interactive-secondary-background/55 selected:disabled:border-shade-interactive-secondary-background/55 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-tint-interactive-subtle-secondary-foreground/80 not-data-[selected]:hover:text-tint-interactive-subtle-secondary-foreground/80",
+					"not-data-[selected]:pressed:border-tint-interactive-subtle-secondary-foreground/70 not-data-[selected]:pressed:text-tint-interactive-subtle-secondary-foreground/70",
+					"not-data-[selected]:disabled:border-tint-interactive-subtle-secondary-foreground/50 not-data-[selected]:disabled:text-tint-interactive-subtle-secondary-foreground/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-subtle-secondary-foreground/60 not-data-[selected]:focus-visible:text-tint-interactive-subtle-secondary-foreground/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-secondary-background/75 selected:border-shade-interactive-secondary-background/75 selected:text-interactive-secondary-foreground",
+					"selected:hover:bg-shade-interactive-secondary-background/65 selected:hover:border-shade-interactive-secondary-background/65 selected:hover:text-interactive-secondary-foreground",
+					"selected:disabled:bg-shade-interactive-secondary-background/55 selected:disabled:border-shade-interactive-secondary-background/55 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-tint-interactive-subtle-secondary-background/80 not-data-[selected]:hover:bg-tint-interactive-subtle-secondary-background/80 not-data-[selected]:hover:text-tint-interactive-subtle-secondary-foreground/80",
+					"not-data-[selected]:pressed:border-tint-interactive-subtle-secondary-background/70 not-data-[selected]:pressed:bg-tint-interactive-subtle-secondary-background/70 not-data-[selected]:pressed:text-tint-interactive-subtle-secondary-foreground/70",
+					"not-data-[selected]:disabled:border-tint-interactive-subtle-secondary-background/50 not-data-[selected]:disabled:bg-tint-interactive-subtle-secondary-background/50 not-data-[selected]:disabled:text-tint-interactive-subtle-secondary-foreground/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-subtle-secondary-background/60 not-data-[selected]:focus-visible:bg-tint-interactive-subtle-secondary-background/60 not-data-[selected]:focus-visible:text-tint-interactive-subtle-secondary-foreground/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-secondary-background/75 selected:border-shade-interactive-secondary-background/75 selected:text-interactive-secondary-foreground",
+					"selected:hover:bg-shade-interactive-secondary-background/65 selected:hover:border-shade-interactive-secondary-background/65 selected:hover:text-interactive-secondary-foreground",
+					"selected:disabled:bg-shade-interactive-secondary-background/55 selected:disabled:border-shade-interactive-secondary-background/55 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-tint-interactive-subtle-secondary-background/80 not-data-[selected]:hover:bg-tint-interactive-subtle-secondary-background/80 not-data-[selected]:hover:text-tint-interactive-subtle-secondary-foreground/80",
+					"not-data-[selected]:pressed:border-tint-interactive-subtle-secondary-background/70 not-data-[selected]:pressed:bg-tint-interactive-subtle-secondary-background/70 not-data-[selected]:pressed:text-tint-interactive-subtle-secondary-foreground/70",
+					"not-data-[selected]:disabled:border-tint-interactive-subtle-secondary-background/50 not-data-[selected]:disabled:bg-tint-interactive-subtle-secondary-background/50 not-data-[selected]:disabled:text-tint-interactive-subtle-secondary-foreground/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-subtle-secondary-background/60 not-data-[selected]:focus-visible:bg-tint-interactive-subtle-secondary-background/60 not-data-[selected]:focus-visible:text-tint-interactive-subtle-secondary-foreground/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-secondary-background/75 selected:border-shade-interactive-secondary-background/75 selected:text-interactive-secondary-foreground",
+					"selected:hover:bg-shade-interactive-secondary-background/65 selected:hover:border-shade-interactive-secondary-background/65 selected:hover:text-interactive-secondary-foreground",
+					"selected:disabled:bg-shade-interactive-secondary-background/55 selected:disabled:border-shade-interactive-secondary-background/55 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-tint-interactive-destructive-background/80 not-data-[selected]:hover:bg-tint-interactive-destructive-background/80",
+					"not-data-[selected]:pressed:border-tint-interactive-destructive-background/70 not-data-[selected]:pressed:bg-tint-interactive-destructive-background/70",
+					"not-data-[selected]:disabled:border-tint-interactive-destructive-background/50 not-data-[selected]:disabled:bg-tint-interactive-destructive-background/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-destructive-background/60 not-data-[selected]:focus-visible:bg-tint-interactive-destructive-background/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-destructive-background/75 selected:border-shade-interactive-destructive-background/75 selected:text-interactive-destructive-foreground",
+					"selected:hover:bg-shade-interactive-destructive-background/65 selected:hover:border-shade-interactive-destructive-background/65 selected:hover:text-interactive-destructive-foreground",
+					"selected:disabled:bg-shade-interactive-destructive-background/55 selected:disabled:border-shade-interactive-destructive-background/55 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-tint-interactive-subtle-destructive-foreground/80 not-data-[selected]:hover:text-tint-interactive-subtle-destructive-foreground/80",
+					"not-data-[selected]:pressed:border-tint-interactive-subtle-destructive-foreground/70 not-data-[selected]:pressed:text-tint-interactive-subtle-destructive-foreground/70",
+					"not-data-[selected]:disabled:border-tint-interactive-subtle-destructive-foreground/50 not-data-[selected]:disabled:text-tint-interactive-subtle-destructive-foreground/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-subtle-destructive-foreground/60 not-data-[selected]:focus-visible:text-tint-interactive-subtle-destructive-foreground/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-destructive-background/75 selected:border-shade-interactive-destructive-background/75 selected:text-interactive-destructive-foreground",
+					"selected:hover:bg-shade-interactive-destructive-background/65 selected:hover:border-shade-interactive-destructive-background/65 selected:hover:text-interactive-destructive-foreground",
+					"selected:disabled:bg-shade-interactive-destructive-background/55 selected:disabled:border-shade-interactive-destructive-background/55 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-tint-interactive-subtle-destructive-background/80 not-data-[selected]:hover:bg-tint-interactive-subtle-destructive-background/80 not-data-[selected]:hover:text-tint-interactive-subtle-destructive-foreground/80",
+					"not-data-[selected]:pressed:border-tint-interactive-subtle-destructive-background/70 not-data-[selected]:pressed:bg-tint-interactive-subtle-destructive-background/70 not-data-[selected]:pressed:text-tint-interactive-subtle-destructive-foreground/70",
+					"not-data-[selected]:disabled:border-tint-interactive-subtle-destructive-background/50 not-data-[selected]:disabled:bg-tint-interactive-subtle-destructive-background/50 not-data-[selected]:disabled:text-tint-interactive-subtle-destructive-foreground/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-subtle-destructive-background/60 not-data-[selected]:focus-visible:bg-tint-interactive-subtle-destructive-background/60 not-data-[selected]:focus-visible:text-tint-interactive-subtle-destructive-foreground/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-destructive-background/75 selected:border-shade-interactive-destructive-background/75 selected:text-interactive-destructive-foreground",
+					"selected:hover:bg-shade-interactive-destructive-background/65 selected:hover:border-shade-interactive-destructive-background/65 selected:hover:text-interactive-destructive-foreground",
+					"selected:disabled:bg-shade-interactive-destructive-background/55 selected:disabled:border-shade-interactive-destructive-background/55 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-tint-interactive-subtle-destructive-background/80 not-data-[selected]:hover:bg-tint-interactive-subtle-destructive-background/80 not-data-[selected]:hover:text-tint-interactive-subtle-destructive-foreground/80",
+					"not-data-[selected]:pressed:border-tint-interactive-subtle-destructive-background/70 not-data-[selected]:pressed:bg-tint-interactive-subtle-destructive-background/70 not-data-[selected]:pressed:text-tint-interactive-subtle-destructive-foreground/70",
+					"not-data-[selected]:disabled:border-tint-interactive-subtle-destructive-background/50 not-data-[selected]:disabled:bg-tint-interactive-subtle-destructive-background/50 not-data-[selected]:disabled:text-tint-interactive-subtle-destructive-foreground/50",
+					"not-data-[selected]:focus-visible:border-tint-interactive-subtle-destructive-background/60 not-data-[selected]:focus-visible:bg-tint-interactive-subtle-destructive-background/60 not-data-[selected]:focus-visible:text-tint-interactive-subtle-destructive-foreground/60",
+					"focus-visible:outline-interactive-ring",
+					"selected:bg-shade-interactive-destructive-background/75 selected:border-shade-interactive-destructive-background/75 selected:text-interactive-destructive-foreground",
+					"selected:hover:bg-shade-interactive-destructive-background/65 selected:hover:border-shade-interactive-destructive-background/65 selected:hover:text-interactive-destructive-foreground",
+					"selected:disabled:bg-shade-interactive-destructive-background/55 selected:disabled:border-shade-interactive-destructive-background/55 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-tint-interactive-primary-background/80",
+					"not-data-[selected]:pressed:text-tint-interactive-primary-background/70",
+					"not-data-[selected]:disabled:text-tint-interactive-primary-background/50",
+					"not-data-[selected]:focus-visible:text-tint-interactive-primary-background/60",
+					"selected:text-shade-interactive-primary-background/75",
+					"selected:hover:text-shade-interactive-primary-background/65",
+					"selected:disabled:text-shade-interactive-primary-background/55",
+					"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-tint-interactive-secondary-background/80",
+					"not-data-[selected]:pressed:text-tint-interactive-secondary-background/70",
+					"not-data-[selected]:disabled:text-tint-interactive-secondary-background/50",
+					"not-data-[selected]:focus-visible:text-tint-interactive-secondary-background/60",
+					"selected:text-shade-interactive-secondary-background/75",
+					"selected:hover:text-shade-interactive-secondary-background/65",
+					"selected:disabled:text-shade-interactive-secondary-background/55",
+					"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-tint-interactive-destructive-background/80",
+					"not-data-[selected]:pressed:text-tint-interactive-destructive-background/70",
+					"not-data-[selected]:disabled:text-tint-interactive-destructive-background/50",
+					"not-data-[selected]:focus-visible:text-tint-interactive-destructive-background/60",
+					"selected:text-shade-interactive-destructive-background/75",
+					"selected:hover:text-shade-interactive-destructive-background/65",
+					"selected:disabled:text-shade-interactive-destructive-background/55",
+					"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-tint-interactive-primary-foreground/80",
+					"not-data-[selected]:pressed:text-tint-interactive-primary-foreground/70",
+					"not-data-[selected]:disabled:text-tint-interactive-primary-foreground/50",
+					"not-data-[selected]:focus-visible:text-tint-interactive-primary-foreground/60",
+					"selected:text-shade-interactive-primary-foreground/75",
+					"selected:hover:text-shade-interactive-primary-foreground/65",
+					"selected:disabled:text-shade-interactive-primary-foreground/55",
+					"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-tint-interactive-primary-background/80 not-data-[selected]:hover:[&_svg]:text-tint-interactive-secondary-background/80",
+					"not-data-[selected]:pressed:text-tint-interactive-primary-background/70 not-data-[selected]:pressed:[&_svg]:text-tint-interactive-secondary-background/70",
+					"not-data-[selected]:disabled:text-tint-interactive-primary-background/50 not-data-[selected]:disabled:[&_svg]:text-tint-interactive-secondary-background/50",
+					"not-data-[selected]:focus-visible:text-tint-interactive-primary-background/60 not-data-[selected]:focus-visible:[&_svg]:text-tint-interactive-secondary-background/60",
+					"selected:text-shade-interactive-primary-background/75 selected:[&_svg]:text-shade-interactive-secondary-background/75",
+					"selected:hover:text-shade-interactive-primary-background/65 selected:hover:[&_svg]:text-shade-interactive-secondary-background/65",
+					"selected:disabled:text-shade-interactive-primary-background/55 selected:disabled:[&_svg]:text-shade-interactive-secondary-background/55",
+					"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-4",
+			sm: "size-4",
+			default: "size-4",
+			none: "size-4"
+		} },
+		defaultVariants: { size: "default" }
+	}
+});
+const buttonTypography = compoundMapper({ default: {
+	size: "small",
+	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/{ButtonContent-CohuJJzG.js → ButtonContent-B2_dZ6vA.js}

@@ -1,7 +1,7 @@
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { n as cva, t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
-import { t as typographyDefinition } from "./typography.cva-BI0FyIqm.js";
-import { t as Spinner } from "./Spinner-owSXOEzg.js";
+import { t as typographyDefinition } from "./typography.cva-CJZZSGXW.js";
+import { t as Spinner } from "./Spinner-BEYBu85B.js";
 import { isValidElement } from "react";
 import { c } from "react/compiler-runtime";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -83,8 +83,8 @@ const ButtonContent = (t0) => {
 	let t4;
 	if ($[9] !== endIconElement || $[10] !== hideText || $[11] !== startIconOrLoader || $[12] !== typographyCva || $[13] !== typographyOverrides) {
 		const resolvedTypography = {
-			size: "label-2",
-			variant: "prominent-1",
+			size: "small",
+			className: "font-bold",
 			...typographyOverrides
 		};
 		t4 = startIconOrLoader;

package/dist/{Calendar-kSEji28A.js → Calendar-DzQApBCy.js}

@@ -2,7 +2,7 @@ import { t as ChevronDown } from "./chevron-down-B4Pr8bD3.js";
 import { t as ChevronLeft } from "./chevron-left-Dgo_b9wJ.js";
 import { t as ChevronRight } from "./chevron-right-3nKJR5Bb.js";
 import { t as ChevronUp } from "./chevron-up-D_Gqpb5M.js";
-import { a as CalendarGrid, i as $1697a7ad3db7b79f$re_export$useDateFormatter, o as $f11fb0bcf1b2687a$export$61c6a8c84e605fb6 } from "./DatePickerInput-eyHwzKPm.js";
+import { a as CalendarGrid, i as $1697a7ad3db7b79f$re_export$useDateFormatter, o as $f11fb0bcf1b2687a$export$61c6a8c84e605fb6 } from "./DatePickerInput-UBZcTmdv.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { n as $7705c033048f6da7$export$353f5b6fc5456de1 } from "./Button-D6KlWSFL.js";
 import { i as $928221da08ecbc62$export$a11e76429ed99b4, t as $928221da08ecbc62$export$41f133550aa26f48 } from "./ListBox-B7DW1S7n.js";
@@ -11,12 +11,12 @@ import { n as $23f2114a1b82827e$export$4282f70798064fe0 } from "./useLayoutEffec
 import { a as $390e54f620492c70$export$f680877a34711e37, r as $bbaa08b3cd72f041$export$9d1611c77c2fe928 } from "./useSyncRef-RGMv0rXK.js";
 import { c as $191c9b6d48a0a4e2$export$294aa081a6c6f55d, m as $cf2482eff2eeeec2$export$f12b703ca79dfbb1, r as $fd2148440a13ec26$export$fc1a364ae1f3ff10, s as $2c9edc598a03d523$export$420e68273165f4ec } from "./useFormValidationState-D3z-gafz.js";
 import { n as $8e9d2fae0ecb9001$export$457c3d6518dd4c6f, r as $2eb8e6d23f3d0cb0$export$43bb16f9c6d9e3f7, t as $3e6197669829fe11$export$40bfa8c7b0832715 } from "./useControlledState-DQxX6LMN.js";
-import { C as $0014db39426443c5$exports, S as $6a440d0e2d99dd46$export$4a931266a3838b86, f as $8b141f2f71e88f85$export$2440da353cedad43, g as $8b141f2f71e88f85$export$f18627323ab57ac0, h as $8b141f2f71e88f85$export$c5221a78ef73c5e9, p as $8b141f2f71e88f85$export$7e319ea407e63bc0, v as $7541913c0284d84b$export$300019f83c56d282, w as $121970af65029459$export$f8aeda7b10753fa1 } from "./staticDateTimeSegments-BQoA94W-.js";
+import { C as $0014db39426443c5$exports, S as $6a440d0e2d99dd46$export$4a931266a3838b86, f as $8b141f2f71e88f85$export$2440da353cedad43, g as $8b141f2f71e88f85$export$f18627323ab57ac0, h as $8b141f2f71e88f85$export$c5221a78ef73c5e9, p as $8b141f2f71e88f85$export$7e319ea407e63bc0, v as $7541913c0284d84b$export$300019f83c56d282, w as $121970af65029459$export$f8aeda7b10753fa1 } from "./staticDateTimeSegments-DR8bJw-F.js";
 import { n as $535772f9d2c1f38d$export$c5251b9e124bf29 } from "./FocusScope-CO9oJ1sc.js";
-import { t as Typography } from "./Typography-AcUd9df8.js";
+import { t as Typography } from "./Typography-B0Gp1lpc.js";
 import { PillButton } from "./components/pill-button.js";
-import { t as useBreakpoint } from "./useBreakpoint-3kpqzjoC.js";
-import { n as TimePickerForm } from "./datePickerValue.utils-GADbSu7a.js";
+import { t as useBreakpoint } from "./useBreakpoint-BOA-MyoT.js";
+import { n as TimePickerForm } from "./datePickerValue.utils-CFCY-fRJ.js";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { c } from "react/compiler-runtime";
 import { CalendarDateTime, DateFormatter, Time, toCalendarDate, toCalendarDateTime, today } from "@internationalized/date";
@@ -280,15 +280,15 @@ const CalendarHeader = ({ calendarState, datePickerState, prevButtonProps, nextB
 		timeLabel = timeFormatter.format(date);
 	}
 	return /* @__PURE__ */ jsxs("div", {
-		className: "inline-flex w-full items-center justify-between border-elevation-outline-default-1 border-b border-solid px-1",
+		className: "inline-flex w-full items-center justify-between border-border-default-subtle border-b border-solid px-1",
 		children: [
 			/* @__PURE__ */ jsx("div", {
 				className: clsx("inline-flex h-12 items-center", includesTime ? "p-1 md:p-3" : "p-3"),
 				children: /* @__PURE__ */ jsx($7705c033048f6da7$export$353f5b6fc5456de1, {
 					...prevButtonProps,
 					isDisabled: !!toggleState,
-					className: clsx("shrink-0 focus-visible:outline-interactive-contained-secondary-focus", !!toggleState && "opacity-0"),
-					children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-6 text-interactive-text-secondary-idle" })
+					className: clsx("shrink-0 focus-visible:outline-interactive-ring", !!toggleState && "opacity-0"),
+					children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-6 text-interactive-primary-background" })
 				})
 			}),
 			/* @__PURE__ */ jsxs($bc25b811ec97a172$export$40258cc1d95ff477, {
@@ -355,8 +355,8 @@ const CalendarHeader = ({ calendarState, datePickerState, prevButtonProps, nextB
 				children: /* @__PURE__ */ jsx($7705c033048f6da7$export$353f5b6fc5456de1, {
 					...nextButtonProps,
 					isDisabled: !!toggleState,
-					className: clsx("shrink-0 focus-visible:outline-interactive-contained-secondary-focus", !!toggleState && "opacity-0"),
-					children: /* @__PURE__ */ jsx(ChevronRight, { className: "size-6 text-interactive-text-secondary-idle" })
+					className: clsx("shrink-0 focus-visible:outline-interactive-ring", !!toggleState && "opacity-0"),
+					children: /* @__PURE__ */ jsx(ChevronRight, { className: "size-6 text-interactive-primary-background" })
 				})
 			})
 		]
@@ -435,10 +435,10 @@ const MonthPicker = ({ state, onSelectionChange, onDateChange, onCommit, selecte
 					if (monthNumber !== selectedMonth) return;
 					onCommit?.();
 				},
-				className: clsx("flex items-center justify-center text-interactive-text-secondary-idle", "rounded-button-rounding-m border border-elevation-outline-default-1 border-solid bg-elevation-fill-default-1", "hover:text-interactive-text-secondary-hover", "selected:border-interactive-contained-primary-idle selected:bg-interactive-contained-primary-idle selected:text-interactive-text-secondary-idle-inverted", "focus:outline-none focus-visible:outline-1 focus-visible:outline-interactive-contained-primary-focus focus-visible:outline-offset-1", isDisabled ? "cursor-default opacity-50" : "cursor-pointer"),
+				className: clsx("flex items-center justify-center text-surface-default-foreground", "rounded-button-rounding-default border border-border-default-subtle border-solid bg-surface-default-card", "not-selected:not-disabled:hover:text-tint-surface-default-foreground/80", "selected:border-interactive-primary-background selected:bg-interactive-primary-background selected:text-interactive-primary-foreground", "focus:outline-none focus-visible:outline-1 focus-visible:outline-interactive-ring focus-visible:outline-offset-1", isDisabled ? "cursor-default opacity-50" : "cursor-pointer"),
 				children: /* @__PURE__ */ jsx(Typography, {
 					as: "span",
-					size: "label-2",
+					size: "small",
 					children: month
 				})
 			}, monthNumber);
@@ -569,10 +569,10 @@ const YearPicker = ({ state, onSelectionChange, onDateChange, onCommit, selected
 					if (index !== selectedYearIndex) return;
 					onCommit?.();
 				},
-				className: clsx("flex px-4 py-2 text-interactive-text-secondary-idle outline-none", "border-elevation-outline-default-1 border-b border-solid bg-elevation-fill-default-1 last:border-b-0", "hover:text-interactive-text-secondary-hover", "selected:bg-interactive-contained-primary-idle selected:text-interactive-text-secondary-idle-inverted", "focus-visible:bg-interactive-contained-primary-focus focus-visible:text-interactive-text-secondary-idle-inverted", isDisabled ? "cursor-default opacity-50" : "cursor-pointer"),
+				className: clsx("flex px-4 py-2 text-surface-default-foreground outline-none", "border-border-default-subtle border-b border-solid bg-surface-default-card last:border-b-0", "not-selected:not-disabled:hover:text-tint-surface-default-foreground/80", "selected:bg-interactive-primary-background selected:text-interactive-primary-foreground", "focus-visible:bg-tint-interactive-primary-background/60 focus-visible:text-interactive-primary-foreground", isDisabled ? "cursor-default opacity-50" : "cursor-pointer"),
 				children: /* @__PURE__ */ jsx(Typography, {
 					as: "span",
-					size: "label-2",
+					size: "small",
 					children: year.formatted
 				})
 			}, index);

package/dist/{CheckContent-DzWpxKGq.js → CheckContent-DZ7Gk8GS.js}

@@ -1,15 +1,14 @@
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
-import { t as typographyDefinition } from "./typography.cva-BI0FyIqm.js";
+import { t as typographyDefinition } from "./typography.cva-CJZZSGXW.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/inputs/shared/CheckContent.tsx
 const CheckContent = ({ children, className, contentClassName, ...props }) => {
 	const typographyCva = UIOverrides.useCva("typography.cva", typographyDefinition);
 	return /* @__PURE__ */ jsx("div", {
 		className: clsx(typographyCva({
-			size: "label-1",
-			sizeMobile: "label-1",
-			variant: "default",
+			size: "large",
+			sizeMobile: "large",
 			...props.typography
 		}), contentClassName, className),
 		children