@povio/ui 6.0.0-rc.1 → 6.0.0-rc.2

package/dist/badgeButton.cva-C1BuYx1N.js

@@ -0,0 +1,138 @@
+import { t as clsx } from "./clsx-CnD0nOiA.js";
+import { r as cva, t as UIOverrides } from "./uiOverrides.context-BTCH9y5a.js";
+import { n as uiOutlineClass } from "./outline.clsx-DGGQQRkM.js";
+import { t as compoundMapper } from "./compoundMapper-Di3SKZnS.js";
+//#region src/components/buttons/BadgeButton/badgeButton.cva.ts
+const badgeButtonDefinition = UIOverrides.defineConfig({
+	base: [
+		"inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden whitespace-nowrap",
+		"rounded-md border border-solid py-0.5 text-xs font-medium transition-[color,box-shadow]",
+		"[&_[data-icon-slot]]:size-3 [&_svg]:pointer-events-none",
+		uiOutlineClass,
+		"focus-visible:border-ring data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+		"aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40"
+	],
+	config: {
+		variants: {
+			color: {
+				primary: "",
+				secondary: "",
+				success: "",
+				warning: "",
+				error: ""
+			},
+			hasIcon: {
+				true: "px-2",
+				false: "px-2"
+			},
+			variant: {
+				contained: "",
+				solid: "",
+				outlined: "",
+				outline: "",
+				subtle: ""
+			}
+		},
+		compoundVariants: [
+			{
+				variant: ["contained", "solid"],
+				color: "primary",
+				className: "border-transparent bg-primary text-primary-foreground hover:bg-primary/90 selected:bg-primary/80"
+			},
+			{
+				variant: ["contained", "solid"],
+				color: "secondary",
+				className: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/90 selected:bg-accent selected:text-accent-foreground"
+			},
+			{
+				variant: ["contained", "solid"],
+				color: "error",
+				className: ["border-transparent bg-destructive text-white hover:bg-destructive/90 selected:bg-destructive/80", "focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40"]
+			},
+			{
+				variant: ["contained", "solid"],
+				color: "success",
+				className: ["border-transparent bg-success text-success-foreground hover:bg-success/90 selected:bg-success/80", "focus-visible:ring-success/20 dark:focus-visible:ring-success/40"]
+			},
+			{
+				variant: ["contained", "solid"],
+				color: "warning",
+				className: ["border-transparent bg-warning text-warning-foreground hover:bg-warning/90 selected:bg-warning/80", "focus-visible:ring-warning/20 dark:focus-visible:ring-warning/40"]
+			},
+			{
+				variant: ["outlined", "outline"],
+				color: "primary",
+				className: ["border-border bg-transparent text-foreground hover:bg-accent hover:text-accent-foreground", "selected:border-transparent selected:bg-primary selected:text-primary-foreground"]
+			},
+			{
+				variant: ["outlined", "outline"],
+				color: "secondary",
+				className: ["border-border bg-transparent text-muted-foreground hover:bg-accent hover:text-accent-foreground", "selected:border-transparent selected:bg-secondary selected:text-secondary-foreground"]
+			},
+			{
+				variant: ["outlined", "outline"],
+				color: "error",
+				className: ["border-destructive/50 bg-transparent text-destructive hover:bg-destructive/10", "selected:border-transparent selected:bg-destructive selected:text-white"]
+			},
+			{
+				variant: ["outlined", "outline"],
+				color: "success",
+				className: ["border-success/50 bg-transparent text-success hover:bg-success/10", "selected:border-transparent selected:bg-success selected:text-success-foreground"]
+			},
+			{
+				variant: ["outlined", "outline"],
+				color: "warning",
+				className: ["border-warning/50 bg-transparent text-warning hover:bg-warning/10", "selected:border-transparent selected:bg-warning selected:text-warning-foreground"]
+			},
+			{
+				variant: "subtle",
+				color: "primary",
+				className: ["border-transparent bg-primary/10 text-primary hover:bg-primary/20", "selected:bg-primary selected:text-primary-foreground"]
+			},
+			{
+				variant: "subtle",
+				color: "secondary",
+				className: ["border-transparent bg-muted text-muted-foreground hover:bg-accent hover:text-accent-foreground", "selected:bg-secondary selected:text-secondary-foreground"]
+			},
+			{
+				variant: "subtle",
+				color: "error",
+				className: ["border-transparent bg-destructive/10 text-destructive hover:bg-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30", "selected:bg-destructive selected:text-white"]
+			},
+			{
+				variant: "subtle",
+				color: "success",
+				className: ["border-transparent bg-success/10 text-success hover:bg-success/20 dark:bg-success/20 dark:hover:bg-success/30", "selected:bg-success selected:text-success-foreground"]
+			},
+			{
+				variant: "subtle",
+				color: "warning",
+				className: ["border-transparent bg-warning/10 text-warning hover:bg-warning/20 dark:bg-warning/20 dark:hover:bg-warning/30", "selected:bg-warning selected:text-warning-foreground"]
+			}
+		],
+		defaultVariants: {
+			hasIcon: false,
+			color: "primary",
+			variant: "contained"
+		}
+	}
+});
+const badgeButtonContentDefinition = UIOverrides.defineConfig({
+	base: [""],
+	config: {
+		variants: { iconPosition: {
+			left: "",
+			right: "",
+			none: ""
+		} },
+		defaultVariants: { iconPosition: "left" }
+	}
+});
+const badgeButtonContent = cva(badgeButtonContentDefinition.base, badgeButtonContentDefinition.config);
+const badgeButtonIconSize = clsx("pointer-events-none");
+const badgeButtonTypography = compoundMapper({ default: {
+	size: "small",
+	className: "font-medium"
+} });
+//#endregion
+export { badgeButtonTypography as a, badgeButtonIconSize as i, badgeButtonContentDefinition as n, badgeButtonDefinition as r, badgeButtonContent as t };

package/dist/{badgeButton.cva-B8EQLwPv.d.ts → badgeButton.cva-Cj5AWgfv.d.ts}

@@ -1,6 +1,6 @@
 import { n as StyleMergeUtils, t as UIOverrides } from "./uiOverrides.context-Dmev7iRS.js";
-import "./style-definitions-_RXJdSk-.js";
-import "./typography.cva-GpC6QQNx.js";
+import "./style-definitions-DzsmGccZ.js";
+import "./typography.cva-CKCCpIMj.js";
 //#region src/components/buttons/BadgeButton/badgeButton.cva.d.ts
 declare const badgeButtonDefinition: {
   base: string[];
@@ -13,8 +13,8 @@ declare const badgeButtonDefinition: {
       readonly error: "";
     };
     readonly hasIcon: {
-      readonly true: "px-badge-side-dismissable";
-      readonly false: "px-badge-side-default";
+      readonly true: "px-2";
+      readonly false: "px-2";
     };
     readonly variant: {
       readonly contained: "";
@@ -31,9 +31,9 @@ declare const badgeButtonContentDefinition: {
   base: string[];
   config: StyleMergeUtils.Config<{
     readonly iconPosition: {
-      readonly left: "gap-button-gap-icon-to-label";
-      readonly right: "gap-button-gap-icon-to-label";
-      readonly none: "gap-button-gap-icon-to-label";
+      readonly left: "";
+      readonly right: "";
+      readonly none: "";
     };
   }>;
 };

package/dist/{breadcrumbs.cva-DPwJJK_D.js → breadcrumbs.cva-DCAdmxWR.js}

@@ -1,19 +1,19 @@
 import { t as UIOverrides } from "./uiOverrides.context-BTCH9y5a.js";
 //#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-icons-size shrink-0 text-content-secondary"] });
-const breadcrumbIconDefinition = UIOverrides.defineConfig({ base: ["size-icons-size shrink-0"] });
+const breadcrumbsDefinition = UIOverrides.defineConfig({ base: ["flex items-center gap-1.5 text-sm break-words text-muted-foreground sm:gap-2.5"] });
+const breadcrumbSegmentDefinition = UIOverrides.defineConfig({ base: ["inline-flex items-center gap-1.5 sm:gap-2.5"] });
+const breadcrumbChevronDefinition = UIOverrides.defineConfig({ base: ["shrink-0"] });
+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"],
+	base: ["inline-flex cursor-pointer items-center gap-1.5 whitespace-nowrap no-underline transition-colors", "rounded-sm outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50"],
 	config: {
 		variants: {
 			isCurrent: {
-				true: "text-interactive-subtle-primary-foreground",
-				false: "text-content-secondary hover:text-state-content-secondary/hover"
+				true: "font-normal text-foreground",
+				false: "hover:text-foreground"
 			},
 			isEllipsis: {
-				true: "hover:text-state-interactive-subtle-primary-foreground/hover!",
+				true: "",
 				false: ""
 			}
 		},

package/dist/{button.cva-CBckM91c.d.ts → button.cva-YpNNY6C-.d.ts}

@@ -1,13 +1,13 @@
 import { n as StyleMergeUtils, t as UIOverrides } from "./uiOverrides.context-Dmev7iRS.js";
-import "./style-definitions-_RXJdSk-.js";
-import "./typography.cva-GpC6QQNx.js";
+import "./style-definitions-DzsmGccZ.js";
+import "./typography.cva-CKCCpIMj.js";
 //#region src/components/buttons/Button/button.cva.d.ts
 declare const buttonDefinition: {
   base: string[];
   config: StyleMergeUtils.Config<{
     readonly width: {
       readonly fill: "w-full";
-      readonly hug: "w-auto";
+      readonly hug: "";
     };
     readonly size: {
       readonly s: "";
@@ -28,7 +28,7 @@ declare const buttonDefinition: {
       readonly outline: "";
       readonly subtle: "";
       readonly text: "group-data-[split]/split:data-[separator]:after:hidden";
-      readonly ghost: "";
+      readonly ghost: "group-data-[split]/split:data-[separator]:after:hidden";
     };
     readonly inverted: {
       readonly true: "";
@@ -42,25 +42,30 @@ declare const buttonSizeDefinition: {
   base: string[];
   config: StyleMergeUtils.Config<{
     readonly size: {
-      readonly s: "rounded-button-rounding-small";
-      readonly sm: "rounded-button-rounding-small";
-      readonly default: "rounded-button-rounding-default";
+      readonly s: "rounded-md";
+      readonly sm: "rounded-md";
+      readonly default: "rounded-md";
       readonly none: "p-0";
     };
     readonly iconOnly: {
       readonly true: "";
       readonly false: "";
     };
+    readonly iconPosition: {
+      readonly left: "";
+      readonly right: "";
+      readonly none: "";
+    };
   }>;
 };
 declare const buttonContentDefinition: {
   base: string[];
   config: StyleMergeUtils.Config<{
     readonly size: {
-      readonly s: "gap-button-gap-icon-to-label";
-      readonly sm: "gap-button-gap-icon-to-label";
-      readonly default: "gap-button-gap-icon-to-label";
-      readonly none: "gap-button-gap-icon-to-label";
+      readonly s: "gap-1.5";
+      readonly sm: "gap-1.5";
+      readonly default: "gap-2";
+      readonly none: "gap-1.5";
     };
     readonly iconPosition: {
       readonly left: "";
@@ -78,10 +83,10 @@ declare const buttonIconSizeDefinition: {
   base: string[];
   config: StyleMergeUtils.Config<{
     readonly size: {
-      readonly s: "size-icons-size";
-      readonly sm: "size-icons-size";
-      readonly default: "size-icons-size";
-      readonly none: "size-icons-size";
+      readonly s: "size-4";
+      readonly sm: "size-4";
+      readonly default: "size-4";
+      readonly none: "size-4";
     };
   }>;
 };

package/dist/button.cva-fkUW5b2d.js

@@ -0,0 +1,267 @@
+import { t as UIOverrides } from "./uiOverrides.context-BTCH9y5a.js";
+import { n as uiOutlineClass } from "./outline.clsx-DGGQQRkM.js";
+import { t as compoundMapper } from "./compoundMapper-Di3SKZnS.js";
+//#region src/components/buttons/Button/button.cva.ts
+const buttonDefinition = UIOverrides.defineConfig({
+	base: [
+		"group inline-flex shrink-0 items-center justify-center border border-solid text-sm font-medium transition-all",
+		uiOutlineClass,
+		"focus-visible:border-ring disabled:pointer-events-none disabled:opacity-50",
+		"aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40",
+		"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:bg-current",
+		"group-data-[split]/split:data-[separator]:after:opacity-20"
+	],
+	config: {
+		variants: {
+			width: {
+				fill: "w-full",
+				hug: ""
+			},
+			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: "group-data-[split]/split:data-[separator]:after:hidden"
+			},
+			inverted: {
+				true: "",
+				false: ""
+			}
+		},
+		compoundVariants: [
+			{
+				variant: ["contained", "solid"],
+				color: ["primary", "dual"],
+				className: "border-transparent bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 selected:bg-primary/80"
+			},
+			{
+				variant: ["contained", "solid"],
+				color: "secondary",
+				className: "border-transparent bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80 selected:bg-accent selected:text-accent-foreground"
+			},
+			{
+				variant: ["contained", "solid"],
+				color: "error",
+				className: ["border-transparent bg-destructive text-white shadow-xs hover:bg-destructive/90 selected:bg-destructive/80", "focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40"]
+			},
+			{
+				variant: ["outlined", "outline"],
+				color: [
+					"primary",
+					"secondary",
+					"dual"
+				],
+				className: [
+					"border-border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",
+					"dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
+					"selected:bg-accent selected:text-accent-foreground"
+				]
+			},
+			{
+				variant: ["outlined", "outline"],
+				color: "error",
+				className: ["border-destructive/50 bg-background text-destructive shadow-xs hover:bg-destructive/10", "dark:bg-input/30 dark:hover:bg-destructive/20 selected:bg-destructive/10"]
+			},
+			{
+				variant: "subtle",
+				color: [
+					"primary",
+					"secondary",
+					"dual"
+				],
+				className: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80 selected:bg-accent selected:text-accent-foreground"
+			},
+			{
+				variant: "subtle",
+				color: "error",
+				className: "border-transparent bg-destructive/10 text-destructive hover:bg-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 selected:bg-destructive/20"
+			},
+			{
+				variant: "ghost",
+				color: [
+					"primary",
+					"secondary",
+					"dual"
+				],
+				className: ["border-transparent hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50", "selected:bg-accent selected:text-accent-foreground"]
+			},
+			{
+				variant: "ghost",
+				color: "error",
+				className: "border-transparent text-destructive hover:bg-destructive/10 selected:bg-destructive/10"
+			},
+			{
+				variant: "text",
+				color: ["primary", "dual"],
+				inverted: false,
+				className: "border-transparent text-primary underline-offset-4 hover:underline"
+			},
+			{
+				variant: "text",
+				color: "dual",
+				className: "[&_svg]:text-muted-foreground"
+			},
+			{
+				variant: "text",
+				color: ["primary", "dual"],
+				inverted: true,
+				className: "border-transparent text-primary-foreground underline-offset-4 hover:underline"
+			},
+			{
+				variant: "text",
+				color: "secondary",
+				className: "border-transparent text-muted-foreground underline-offset-4 hover:text-foreground hover:underline"
+			},
+			{
+				variant: "text",
+				color: "error",
+				className: "border-transparent text-destructive underline-offset-4 hover:underline"
+			}
+		],
+		defaultVariants: {
+			width: "hug",
+			color: "primary",
+			variant: "contained",
+			inverted: false
+		}
+	}
+});
+const buttonSizeDefinition = UIOverrides.defineConfig({
+	base: [],
+	config: {
+		variants: {
+			size: {
+				s: "rounded-md",
+				sm: "rounded-md",
+				default: "rounded-md",
+				none: "p-0"
+			},
+			iconOnly: {
+				true: "",
+				false: ""
+			},
+			iconPosition: {
+				left: "",
+				right: "",
+				none: ""
+			}
+		},
+		compoundVariants: [
+			{
+				size: ["s", "sm"],
+				iconOnly: false,
+				className: "h-8"
+			},
+			{
+				size: ["s", "sm"],
+				iconOnly: false,
+				iconPosition: "none",
+				className: "px-3"
+			},
+			{
+				size: ["s", "sm"],
+				iconOnly: false,
+				iconPosition: ["left", "right"],
+				className: "px-2.5"
+			},
+			{
+				size: "default",
+				iconOnly: false,
+				className: "h-9 py-2"
+			},
+			{
+				size: "default",
+				iconOnly: false,
+				iconPosition: "none",
+				className: "px-4"
+			},
+			{
+				size: "default",
+				iconOnly: false,
+				iconPosition: ["left", "right"],
+				className: "px-3"
+			},
+			{
+				size: ["s", "sm"],
+				iconOnly: true,
+				className: "size-8"
+			},
+			{
+				size: "default",
+				iconOnly: true,
+				className: "size-9"
+			}
+		],
+		defaultVariants: {
+			size: "default",
+			iconOnly: false,
+			iconPosition: "none"
+		}
+	}
+});
+const buttonContentDefinition = UIOverrides.defineConfig({
+	base: [],
+	config: {
+		variants: {
+			size: {
+				s: "gap-1.5",
+				sm: "gap-1.5",
+				default: "gap-2",
+				none: "gap-1.5"
+			},
+			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: "body",
+	className: "font-medium"
+} });
+//#endregion
+export { buttonTypography as a, buttonSizeDefinition as i, buttonDefinition as n, buttonIconSizeDefinition as r, buttonContentDefinition as t };

package/dist/{buttonContent.cva-DG-4lRz4.d.ts → buttonContent.cva-CxgT-rxJ.d.ts}

@@ -1,5 +1,5 @@
 import { t as UIOverrides } from "./uiOverrides.context-Dmev7iRS.js";
-import { t as ButtonContentConfig } from "./button.cva-CBckM91c.js";
+import { t as ButtonContentConfig } from "./button.cva-YpNNY6C-.js";
 //#region src/components/buttons/shared/buttonContent.cva.d.ts
 interface ButtonContentVariantProps extends UIOverrides.VariantProps<ButtonContentConfig> {}
 //#endregion

package/dist/{checkbox.cva-CJy87xUo.d.ts → checkbox.cva-CZnnBl8g.d.ts}

@@ -1,12 +1,12 @@
 import { n as StyleMergeUtils, t as UIOverrides } from "./uiOverrides.context-Dmev7iRS.js";
-import "./style-definitions-_RXJdSk-.js";
-import "./typography.cva-GpC6QQNx.js";
+import "./style-definitions-DzsmGccZ.js";
+import "./typography.cva-CKCCpIMj.js";
 //#region src/components/inputs/Checkbox/checkbox.cva.d.ts
 declare const checkboxDefinition: {
   base: string[];
   config: StyleMergeUtils.Config<{
     readonly variant: {
-      default: ["m-1 border-interactive-primary-background bg-support-transparent-outline", "text-interactive-primary-foreground", "group-focus-visible:outline-interactive-ring", "group-not-disabled:group-invalid:border-border-destructive-base", "group-disabled:border-state-interactive-primary-background/disabled", "group-not-disabled:group-not-invalid:group-hover:border-state-interactive-primary-background/hover", "group-not-disabled:group-not-invalid:group-pressed:border-state-interactive-primary-background/pressed", "group-selected:bg-interactive-primary-background", "group-selected:group-not-disabled:group-hover:bg-state-interactive-primary-background/hover", "group-selected:group-not-disabled:group-pressed:bg-state-interactive-primary-background/pressed", "group-selected:group-disabled:bg-state-interactive-primary-background/disabled", "group-indeterminate:bg-interactive-primary-background", "group-indeterminate:group-not-disabled:group-hover:bg-state-interactive-primary-background/hover", "group-indeterminate:group-not-disabled:group-pressed:bg-state-interactive-primary-background/pressed", "group-indeterminate:group-disabled:bg-state-interactive-primary-background/disabled"];
+      default: ["border-input text-primary-foreground dark:bg-input/30", "group-selected:border-primary group-selected:bg-primary dark:group-selected:bg-primary", "group-indeterminate:border-primary group-indeterminate:bg-primary dark:group-indeterminate:bg-primary", "group-not-selected:group-not-indeterminate:group-not-invalid:group-focus-visible:border-ring", "group-not-selected:group-not-indeterminate:group-invalid:border-destructive"];
     };
   }>;
 };
@@ -39,7 +39,7 @@ declare const checkboxGroupLabelDefinition: {
   config: StyleMergeUtils.Config<{
     readonly as: {
       readonly default: "";
-      readonly floating: ["pointer-events-none absolute", "top-[calc(var(--spacing-floating-label-input-height-filled)+var(--spacing-floating-label-input-offset-top))]", "text-content-primary", "font-semibold!", "text-small!"];
+      readonly floating: ["pointer-events-none absolute", "top-[0.5625rem]", "text-foreground", "font-medium!", "text-xs!"];
       readonly filter: "";
       readonly inline: "";
     };
@@ -67,7 +67,7 @@ declare const checkboxIconDefinition: {
   base: string[];
   config: StyleMergeUtils.Config<{
     readonly iconVariant: {
-      selected: ["size-3.5 group-selected:block"];
+      selected: ["group-selected:group-not-indeterminate:block"];
       indeterminate: ["group-indeterminate:block"];
     };
   }>;