@povio/ui 4.0.2 → 5.0.0-rc.1

package/dist/{FileInput-CI8D_wf_.d.ts → FileInput-BQbn77bE.d.ts}

@@ -1,9 +1,9 @@
 import { n as StyleMergeUtils, t as UIOverrides } from "./uiOverrides.context-C3xb4Ttq.js";
-import "./button.cva-ChabF4Am.js";
+import "./button.cva-BvRI-3Gn.js";
 import { n as FieldValues } from "./form.binding-DVJ5F0JE.js";
 import { t as ControlProps } from "./form.types-CecYaerF.js";
-import { n as FormFieldProps } from "./FormField-DTDj3F0A.js";
-import { t as InputSizeProps } from "./input.cva-ByFuAEIS.js";
+import { n as FormFieldProps } from "./FormField-B0miX3gu.js";
+import { t as InputSizeProps } from "./input.cva-BhDJxc7r.js";
 import { Ref } from "react";
 import { DropZoneProps, FileTriggerProps } from "react-aria-components";
 import { ClassProp } from "class-variance-authority/types";
@@ -23,8 +23,8 @@ declare const fileInputDropZoneDefinition: {
   base: string[];
   config: StyleMergeUtils.Config<{
     readonly variant: {
-      default: ["rounded-input-rounding-default border border-input-outlined-outline-idle border-solid bg-input-outlined-idle"];
-      nested: ["rounded-input-rounding-default border border-input-outlined-outline-idle border-solid bg-input-outlined-idle"];
+      default: ["rounded-input-rounding-default border border-border-default-input border-solid bg-surface-default-background"];
+      nested: ["rounded-input-rounding-default border border-border-default-input border-solid bg-surface-default-background"];
     };
   }>;
 };

package/dist/{FileInput-B-ADr0B3.js → FileInput-Dz1eESr_.js}

@@ -1,27 +1,25 @@
-import { t as UIConfig } from "./uiConfig.context-RFvaQYzD.js";
+import { t as UIConfig } from "./uiConfig.context-D2eUIPHn.js";
 import { n as $070c0dd15dc89b58$export$3c6489d84dc98b6, r as Upload, t as $b325d7bd7e74496a$export$6fb4a10d2c950550 } from "./FileTrigger-CDXcQthK.js";
 import { t as X } from "./x-B6vfz8Ps.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { n as cva, t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
-import { t as Typography } from "./Typography-AcUd9df8.js";
-import { t as Button } from "./Button-CcZBqoQp.js";
+import { t as Typography } from "./Typography-B0Gp1lpc.js";
+import { t as Button } from "./Button-sn52l1Yv.js";
 import { InlineIconButton } from "./components/inline-icon-button.js";
 import { TextButton } from "./components/text-button.js";
 import { i as $a8ea2faf2ebe4d2f$re_export$useLabels, r as $a8ea2faf2ebe4d2f$re_export$mergeRefs } from "./import-BE0r63d8.js";
 import { t as FieldController } from "./form.binding-CG1RPv6o.js";
-import { t as FormField } from "./FormField-CAcDJ4HC.js";
+import { t as FormField } from "./FormField-CHD4OJOt.js";
 import "./i18n-CX2EjhJI.js";
-import { a as inputSizeDefinition } from "./input.cva-KYGD4Bdz.js";
+import { a as inputSizeDefinition } from "./input.cva-BcXyC1vZ.js";
 import { t as FileUtils } from "./file.utils-DqQxnuAm.js";
 import { memo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
 //#region src/components/inputs/File/fileInput.types.ts
 const inputButtonSizeMapping = {
-	"extra-small": "xs",
 	small: "s",
-	default: "m",
-	large: "l"
+	default: "default"
 };
 //#endregion
 //#region src/components/inputs/File/shared/fileInputButton.cva.ts
@@ -45,14 +43,14 @@ const fileInputDropZoneDefinition = UIOverrides.defineConfig({
 		"relative",
 		"min-w-0 flex-1",
 		"flex items-center",
-		"group-invalid/input-upload:border group-invalid/input-upload:border-input-outlined-outline-error",
-		"data-[drop-target]:border-input-outlined-outline-hover",
-		"hover:border-input-outlined-outline-hover"
+		"group-invalid/input-upload:border group-invalid/input-upload:border-border-destructive-base",
+		"data-[drop-target]:border-tint-border-default-input/80",
+		"hover:border-tint-border-default-input/80"
 	],
 	config: {
 		variants: { variant: {
-			default: ["rounded-input-rounding-default border border-input-outlined-outline-idle border-solid bg-input-outlined-idle"],
-			nested: ["rounded-input-rounding-default border border-input-outlined-outline-idle border-solid bg-input-outlined-idle"]
+			default: ["rounded-input-rounding-default border border-border-default-input border-solid bg-surface-default-background"],
+			nested: ["rounded-input-rounding-default border border-border-default-input border-solid bg-surface-default-background"]
 		} },
 		defaultVariants: { variant: "default" }
 	}
@@ -80,10 +78,9 @@ const FileInputContent = (props) => {
 				isDisabled,
 				className: clsx(fileInputDropZone({ variant }), inputSizeCva({ size })),
 				children: [/* @__PURE__ */ jsx(Typography, {
-					variant: "default",
-					size: "label-1",
+					size: "large",
 					as: "span",
-					className: "min-w-0 flex-fill select-none truncate text-text-default-3",
+					className: "min-w-0 flex-fill select-none truncate text-surface-default-popover-foreground",
 					children: placeholder ?? t(($) => $.ui.fileUpload.emptyText)
 				}), variant === "nested" && /* @__PURE__ */ jsx(TextButton, {
 					isDisabled,
@@ -105,12 +102,11 @@ const FileInputContent = (props) => {
 const FileInputFilled = ({ files, onRemove, isDisabled, size }) => {
 	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
 	return /* @__PURE__ */ jsxs("div", {
-		className: clsx("flex items-center rounded-input-rounding-default border border-input-outlined-outline-idle border-solid bg-input-outlined-idle", inputSizeCva({ size })),
+		className: clsx("flex items-center rounded-input-rounding-default border border-border-default-input border-solid bg-surface-default-background", inputSizeCva({ size })),
 		children: [/* @__PURE__ */ jsx(Typography, {
-			variant: "default",
-			size: "label-1",
+			size: "large",
 			as: "span",
-			className: "flex-fill select-none truncate text-ellipsis text-text-default-1 input-disabled:text-text-default-3",
+			className: "flex-fill select-none truncate text-ellipsis text-surface-default-card-foreground input-disabled:text-surface-default-popover-foreground",
 			children: files.map((file) => file.name).join(", ")
 		}), /* @__PURE__ */ jsx(InlineIconButton, {
 			label: "Remove files",

package/dist/{FileUpload-3-4Vt4f1.js → FileUpload-D3Io7Is5.js}

@@ -1,19 +1,19 @@
 import { t as createLucideIcon } from "./createLucideIcon-LcezOE4z.js";
-import { t as UIConfig } from "./uiConfig.context-RFvaQYzD.js";
+import { t as UIConfig } from "./uiConfig.context-D2eUIPHn.js";
 import { n as $070c0dd15dc89b58$export$3c6489d84dc98b6, r as Upload, t as $b325d7bd7e74496a$export$6fb4a10d2c950550 } from "./FileTrigger-CDXcQthK.js";
 import { t as X } from "./x-B6vfz8Ps.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
-import { t as Typography } from "./Typography-AcUd9df8.js";
-import { t as Button } from "./Button-CcZBqoQp.js";
+import { t as Typography } from "./Typography-B0Gp1lpc.js";
+import { t as Button } from "./Button-sn52l1Yv.js";
 import { InlineIconButton } from "./components/inline-icon-button.js";
 import { TextButton } from "./components/text-button.js";
 import { i as $a8ea2faf2ebe4d2f$re_export$useLabels, r as $a8ea2faf2ebe4d2f$re_export$mergeRefs } from "./import-BE0r63d8.js";
 import { t as FieldController } from "./form.binding-CG1RPv6o.js";
-import { t as FormField } from "./FormField-CAcDJ4HC.js";
+import { t as FormField } from "./FormField-CHD4OJOt.js";
 import "./i18n-CX2EjhJI.js";
 import { t as FileUtils } from "./file.utils-DqQxnuAm.js";
-import { t as Progress } from "./Progress-_jkt2pQw.js";
+import { t as Progress } from "./Progress-DQWiFP0L.js";
 import { memo, useCallback, useMemo, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
@@ -100,7 +100,7 @@ const File = createLucideIcon(__iconData);
 //#region src/components/inputs/File/shared/FileUploadContentError.tsx
 const FileUploadContentError = ({ variant, as, isDisabled, state, browseText, fileTriggerProps, removeWithIcon = false, singleFile, onRemove, browseButtonProps }) => {
 	const { t } = useTranslation("ui");
-	const { size: browseButtonSize = "xs", variant: browseButtonVariant = "outlined", width: browseButtonWidth = "hug", ...browseButtonRestProps } = browseButtonProps ?? {};
+	const { size: browseButtonSize = "sm", variant: browseButtonVariant = "outlined", width: browseButtonWidth = "hug", ...browseButtonRestProps } = browseButtonProps ?? {};
 	return /* @__PURE__ */ jsx("div", {
 		className: clsx("flex w-full flex-fill flex-col items-start"),
 		children: /* @__PURE__ */ jsxs("div", {
@@ -116,22 +116,20 @@ const FileUploadContentError = ({ variant, as, isDisabled, state, browseText, fi
 					"flex-row": variant === "horizontal",
 					"opacity-50": isDisabled
 				}),
-				children: [/* @__PURE__ */ jsx(CircleAlert, { className: "h-6 w-6 text-elevation-fill-warning-1" }), /* @__PURE__ */ jsxs("div", {
+				children: [/* @__PURE__ */ jsx(CircleAlert, { className: "h-6 w-6 text-surface-warning-base" }), /* @__PURE__ */ jsxs("div", {
 					className: clsx("flex flex-col gap-file-upload-content-gap-text-to-text", {
 						"max-w-full items-center": variant === "vertical",
 						"max-w-[calc(100%_-_32px)]": variant === "horizontal"
 					}),
 					children: [/* @__PURE__ */ jsx(Typography, {
-						variant: "prominent-1",
-						size: "label-1",
+						size: "large",
 						as: "span",
-						className: clsx("self-stretch truncate text-text-default-1", { "text-center": variant === "vertical" }),
+						className: clsx("self-stretch truncate text-surface-default-card-foreground font-bold", { "text-center": variant === "vertical" }),
 						children: state.file?.name ?? state.displayName ?? ""
 					}), /* @__PURE__ */ jsx(Typography, {
-						variant: "default",
-						size: singleFile ? "label-2" : "label-3",
+						size: singleFile ? "small" : "small",
 						as: "span",
-						className: clsx("text-text-default-2", { "text-center": variant === "vertical" }),
+						className: clsx("text-surface-default-foreground", { "text-center": variant === "vertical" }),
 						children: state.error?.serverMessage ?? state.error?.message
 					})]
 				})]
@@ -144,14 +142,13 @@ const FileUploadContentError = ({ variant, as, isDisabled, state, browseText, fi
 				children: as === "link" ? /* @__PURE__ */ jsxs(Fragment$1, { children: [fileTriggerProps && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx($b325d7bd7e74496a$export$6fb4a10d2c950550, {
 					...fileTriggerProps,
 					children: /* @__PURE__ */ jsx(TextButton, {
-						className: "text-interactive-text-primary-idle",
+						className: "text-interactive-primary-background",
 						children: browseText ?? ""
 					})
 				}), /* @__PURE__ */ jsx(Typography, {
-					variant: "default",
-					size: "label-2",
+					size: "small",
 					as: "span",
-					className: "text-text-default-2",
+					className: "text-surface-default-foreground",
 					children: t(($) => $.ui.fileUpload.or)
 				})] }), removeWithIcon ? /* @__PURE__ */ jsx(InlineIconButton, {
 					label: "Cancel",
@@ -161,7 +158,7 @@ const FileUploadContentError = ({ variant, as, isDisabled, state, browseText, fi
 					},
 					icon: X
 				}) : /* @__PURE__ */ jsx(TextButton, {
-					className: "text-interactive-text-primary-idle lowercase",
+					className: "text-interactive-primary-background lowercase",
 					onPress: () => {
 						onRemove(state.id ?? "");
 					},
@@ -201,7 +198,7 @@ const FileUploadContentError = ({ variant, as, isDisabled, state, browseText, fi
 //#region src/components/inputs/File/shared/FileUploadContentFilled.tsx
 const FileUploadContentFilled = ({ variant, as, isDisabled, state, browseText, fileTriggerProps, removeWithIcon = false, singleFile, onRemove, browseButtonProps }) => {
 	const { t } = useTranslation("ui");
-	const { size: browseButtonSize = "xs", variant: browseButtonVariant = "outlined", width: browseButtonWidth = "hug", ...browseButtonRestProps } = browseButtonProps ?? {};
+	const { size: browseButtonSize = "sm", variant: browseButtonVariant = "outlined", width: browseButtonWidth = "hug", ...browseButtonRestProps } = browseButtonProps ?? {};
 	return /* @__PURE__ */ jsx("div", {
 		className: clsx("flex w-full flex-fill flex-col items-start"),
 		children: /* @__PURE__ */ jsxs("div", {
@@ -217,22 +214,20 @@ const FileUploadContentFilled = ({ variant, as, isDisabled, state, browseText, f
 					"flex-row": variant === "horizontal",
 					"opacity-50": isDisabled
 				}),
-				children: [/* @__PURE__ */ jsx(CircleCheckBig, { className: "h-6 w-6 text-text-default-1" }), /* @__PURE__ */ jsxs("div", {
+				children: [/* @__PURE__ */ jsx(CircleCheckBig, { className: "h-6 w-6 text-surface-default-card-foreground" }), /* @__PURE__ */ jsxs("div", {
 					className: clsx("flex flex-col gap-file-upload-content-gap-text-to-text", {
 						"max-w-full items-center": variant === "vertical",
 						"max-w-[calc(100%-32px)]": variant === "horizontal"
 					}),
 					children: [/* @__PURE__ */ jsx(Typography, {
-						variant: "prominent-1",
-						size: "label-1",
+						size: "large",
 						as: "span",
-						className: "self-stretch truncate text-center text-text-default-1",
+						className: "self-stretch truncate text-center text-surface-default-card-foreground font-bold",
 						children: state.file?.name ?? state.displayName ?? ""
 					}), /* @__PURE__ */ jsx(Typography, {
-						variant: "default",
-						size: singleFile ? "label-2" : "label-3",
+						size: singleFile ? "small" : "small",
 						as: "span",
-						className: "text-text-default-2",
+						className: "text-surface-default-foreground",
 						children: FileUtils.getFileDisplaySize(state)
 					})]
 				})]
@@ -246,14 +241,13 @@ const FileUploadContentFilled = ({ variant, as, isDisabled, state, browseText, f
 				children: as === "link" ? /* @__PURE__ */ jsxs(Fragment$1, { children: [fileTriggerProps && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx($b325d7bd7e74496a$export$6fb4a10d2c950550, {
 					...fileTriggerProps,
 					children: /* @__PURE__ */ jsx(TextButton, {
-						className: clsx("text-interactive-text-primary-idle", { "[&>span>span]:font-medium!": variant === "vertical" }),
+						className: clsx("text-interactive-primary-background", { "[&>span>span]:font-medium!": variant === "vertical" }),
 						children: browseText ?? ""
 					})
 				}), variant === "vertical" && /* @__PURE__ */ jsx(Typography, {
-					variant: "default",
-					size: "label-2",
+					size: "small",
 					as: "span",
-					className: "text-text-default-2",
+					className: "text-surface-default-foreground",
 					children: t(($) => $.ui.fileUpload.or)
 				})] }), removeWithIcon ? /* @__PURE__ */ jsx(InlineIconButton, {
 					label: "Cancel",
@@ -263,7 +257,7 @@ const FileUploadContentFilled = ({ variant, as, isDisabled, state, browseText, f
 					},
 					icon: X
 				}) : /* @__PURE__ */ jsx(TextButton, {
-					className: clsx(variant === "vertical" && "text-interactive-text-primary-idle lowercase [&>span>span]:font-medium!"),
+					className: clsx(variant === "vertical" && "text-interactive-primary-background lowercase [&>span>span]:font-medium!"),
 					color: variant === "horizontal" ? "secondary" : "primary",
 					onPress: () => {
 						onRemove(state.id ?? "");
@@ -306,7 +300,7 @@ const FileUploadContentFilled = ({ variant, as, isDisabled, state, browseText, f
 //#region src/components/inputs/File/shared/FileUploadContentLoading.tsx
 const FileUploadContentLoading = ({ index, variant, as, state, isDisabled, singleFile, onCancel, cancelButtonProps }) => {
 	const { t } = useTranslation("ui");
-	const { color: cancelButtonColor = "secondary", size: cancelButtonSize = "xs", variant: cancelButtonVariant = "outlined", width: cancelButtonWidth = "hug", ...cancelButtonRestProps } = cancelButtonProps ?? {};
+	const { color: cancelButtonColor = "secondary", size: cancelButtonSize = "sm", variant: cancelButtonVariant = "outlined", width: cancelButtonWidth = "hug", ...cancelButtonRestProps } = cancelButtonProps ?? {};
 	return /* @__PURE__ */ jsxs("div", {
 		className: clsx("flex w-full flex-col items-center", {
 			"flex-col": variant === "vertical",
@@ -324,22 +318,20 @@ const FileUploadContentLoading = ({ index, variant, as, state, isDisabled, singl
 					"w-full flex-col": variant === "vertical",
 					"w-1/2": variant === "horizontal"
 				}),
-				children: [/* @__PURE__ */ jsx(File, { className: "h-6 w-6 text-text-default-1" }), /* @__PURE__ */ jsxs("div", {
+				children: [/* @__PURE__ */ jsx(File, { className: "h-6 w-6 text-surface-default-card-foreground" }), /* @__PURE__ */ jsxs("div", {
 					className: clsx("flex flex-col", {
 						"max-w-full gap-file-upload-content-gap-icon-to-content text-center": variant === "vertical",
 						"max-w-[calc(100%-32px)] gap-file-upload-content-gap-text-to-text": variant === "horizontal"
 					}),
 					children: [/* @__PURE__ */ jsx(Typography, {
-						variant: "prominent-1",
-						size: "label-1",
+						size: "large",
 						as: "span",
-						className: "self-stretch truncate text-center text-text-default-1",
+						className: "self-stretch truncate text-center text-surface-default-card-foreground font-bold",
 						children: state.file?.name ?? state.displayName ?? ""
 					}), /* @__PURE__ */ jsx(Typography, {
-						variant: "default",
-						size: singleFile ? "label-2" : "label-3",
+						size: singleFile ? "small" : "small",
 						as: "span",
-						className: "text-text-default-2",
+						className: "text-surface-default-foreground",
 						children: FileUtils.getFileDisplaySize(state)
 					})]
 				})]
@@ -416,7 +408,7 @@ const FileCardComponent = ({ index, as, state, onRemove, isDisabled, browseButto
 		onRemove
 	]);
 	return /* @__PURE__ */ jsx("div", {
-		className: clsx("flex items-center self-stretch", "bg-elevation-fill-default-1", "px-file-upload-file-card-side-default", "py-4", "rounded-file-upload-file-card-rounding-default border border-elevation-outline-default-1 border-solid"),
+		className: clsx("flex items-center self-stretch", "bg-surface-default-card", "px-file-upload-file-card-side-default", "py-4", "rounded-file-upload-file-card-rounding-default border border-border-default-subtle border-solid"),
 		children: content
 	});
 };
@@ -441,7 +433,7 @@ const FileCardList = memo(({ uploadState, as, isDisabled, browseButtonProps, can
 //#endregion
 //#region src/components/inputs/File/shared/FileUploadContentEmpty.tsx
 const FileUploadContentEmpty = ({ variant, as, isDisabled, title, browseText, uploadText, singleFile, hideButton = false, className, browseButtonProps }) => {
-	const { size: browseButtonSize = "xs", variant: browseButtonVariant = "outlined", width: browseButtonWidth = "hug", ...browseButtonRestProps } = browseButtonProps ?? {};
+	const { size: browseButtonSize = "sm", variant: browseButtonVariant = "outlined", width: browseButtonWidth = "hug", ...browseButtonRestProps } = browseButtonProps ?? {};
 	return /* @__PURE__ */ jsxs("div", {
 		className: clsx("flex w-full items-center gap-file-upload-content-gap-text-to-text", className, {
 			"flex-col": variant === "vertical",
@@ -453,11 +445,10 @@ const FileUploadContentEmpty = ({ variant, as, isDisabled, title, browseText, up
 				"flex-row": variant === "horizontal",
 				"opacity-50": isDisabled
 			}),
-			children: [/* @__PURE__ */ jsx(Upload, { className: "h-6 w-6 text-text-default-1" }), /* @__PURE__ */ jsx(Typography, {
-				variant: "prominent-1",
-				size: "label-1",
+			children: [/* @__PURE__ */ jsx(Upload, { className: "h-6 w-6 text-surface-default-card-foreground" }), /* @__PURE__ */ jsx(Typography, {
+				size: "large",
 				as: "span",
-				className: clsx("self-stretch text-text-default-1", { "text-center": variant === "vertical" }),
+				className: clsx("self-stretch text-surface-default-card-foreground font-bold", { "text-center": variant === "vertical" }),
 				children: title
 			})]
 		}), /* @__PURE__ */ jsxs("div", {
@@ -467,16 +458,15 @@ const FileUploadContentEmpty = ({ variant, as, isDisabled, title, browseText, up
 				"gap-file-upload-content-gap-content-to-button": as === "button"
 			}),
 			children: [/* @__PURE__ */ jsx(Typography, {
-				variant: "default",
-				size: singleFile ? "label-2" : "label-3",
+				size: singleFile ? "small" : "small",
 				as: "span",
-				className: clsx("text-text-default-2", {
+				className: clsx("text-surface-default-foreground", {
 					"text-center": variant === "vertical",
 					"opacity-50": isDisabled
 				}),
 				children: uploadText
 			}), !hideButton && browseText && (as === "link" ? /* @__PURE__ */ jsx(TextButton, {
-				className: "text-interactive-text-primary-idle lowercase",
+				className: "text-interactive-primary-background lowercase",
 				children: browseText
 			}) : /* @__PURE__ */ jsx(Button, {
 				variant: browseButtonVariant,
@@ -564,24 +554,24 @@ const fileUploadDropZoneDefinition = UIOverrides.defineConfig({
 					"data-[drop-target]:before:content-['']",
 					"data-[drop-target]:before:absolute",
 					"data-[drop-target]:before:z-drop-target",
-					"data-[drop-target]:before:width-full",
-					"data-[drop-target]:before:height-full",
+					"data-[drop-target]:before:w-full",
+					"data-[drop-target]:before:h-full",
 					"data-[drop-target]:before:top-0",
 					"data-[drop-target]:before:left-0",
 					"data-[drop-target]:border data-[drop-target]:border-dashed",
-					"data-[drop-target]:border-elevation-outline-default-2",
+					"data-[drop-target]:border-interactive-ring",
 					"data-[drop-target]:before:pointer-events-none data-[drop-target]:before:inset-0",
-					"data-[drop-target]:before:bg-elevation-fill-default-2"
+					"data-[drop-target]:before:bg-tint-interactive-subtle-primary-background/80"
 				],
 				false: [
 					"flex items-center",
 					"py-file-upload-container-height-top-bottom",
 					"px-file-upload-container-side-default",
-					"gap-gap-file-upload-content-gap-icon-to-content",
-					"border border-input-outlined-outline-idle border-dashed bg-input-outlined-idle",
-					"hover:border-elevation-outline-default-2 hover:bg-elevation-fill-default-2",
-					"invalid:border invalid:border-input-outlined-outline-error",
-					"data-[drop-target]:border-elevation-outline-default-2 data-[drop-target]:bg-elevation-fill-default-2",
+					"gap-file-upload-content-gap-icon-to-content",
+					"border border-border-default-input border-dashed bg-surface-default-background",
+					"not-invalid:hover:border-tint-border-default-input/80 not-invalid:hover:bg-tint-surface-default-background/80",
+					"invalid:border invalid:border-border-destructive-base!",
+					"data-[drop-target]:border-interactive-ring data-[drop-target]:bg-tint-interactive-subtle-primary-background/80",
 					"data-[has-files]:border-solid"
 				]
 			}

package/dist/{FileUpload-BrnJdN3M.d.ts → FileUpload-qySCMcLn.d.ts}

@@ -1,5 +1,5 @@
 import { n as FieldValues } from "./form.binding-DVJ5F0JE.js";
-import { o as FileUploadProps } from "./fileUpload.types-xFzuCT_m.js";
+import { o as FileUploadProps } from "./fileUpload.types-DWuQKA2l.js";
 //#region src/components/inputs/File/FileUpload.d.ts
 declare const FileUploadComponent: <TFieldValues extends FieldValues = FieldValues>(props: FileUploadProps<TFieldValues>) => import("react").JSX.Element;
 declare const FileUpload: typeof FileUploadComponent;

package/dist/{FileUploadContainer-CkBENy6n.d.ts → FileUploadContainer-qOyGvb5J.d.ts}

@@ -1,4 +1,4 @@
-import { i as FileUploadContainerProps } from "./fileUpload.types-xFzuCT_m.js";
+import { i as FileUploadContainerProps } from "./fileUpload.types-DWuQKA2l.js";
 //#region src/components/inputs/File/FileUploadContainer.d.ts
 declare const FileUploadContainer: import("react").MemoExoticComponent<(props: FileUploadContainerProps) => import("react").JSX.Element>;
 //#endregion

package/dist/{Form-mzpVGNjX.d.ts → Form-u_N_6mwo.d.ts}

@@ -1,5 +1,5 @@
 import { c as UIForm, l as UseFormProps, o as FormSubmitErrorHandler, s as FormSubmitHandler } from "./form.binding-DVJ5F0JE.js";
-import { c as InputComponentProps, i as DefaultComponentType, r as AllowedComponentType, u as InputDefBaseProps } from "./dynamicInputs-CQMTixlW.js";
+import { c as InputComponentProps, i as DefaultComponentType, r as AllowedComponentType, u as InputDefBaseProps } from "./dynamicInputs-wEEikYeg.js";
 import { DependencyList, ReactNode } from "react";
 import { z } from "zod";
 //#region src/hooks/useAutosave.d.ts

package/dist/{FormField-DTDj3F0A.d.ts → FormField-B0miX3gu.d.ts}

@@ -1,5 +1,5 @@
 import { t as FormFieldErrorProps } from "./FormFieldError-BT4uxbKY.js";
-import { n as InputVariantProps } from "./input.cva-ByFuAEIS.js";
+import { n as InputVariantProps } from "./input.cva-BhDJxc7r.js";
 import { FocusEventHandler, LabelHTMLAttributes, MouseEventHandler, PropsWithChildren, ReactNode, Ref } from "react";
 import { DOMAttributes } from "@react-types/shared";
 //#region src/components/inputs/FormField/FormFieldHeader.d.ts

package/dist/{FormField-CAcDJ4HC.js → FormField-CHD4OJOt.js}

@@ -1,10 +1,10 @@
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { n as $43a3b93638fe5db9$export$b04be29aa201d4f5 } from "./Label-B2-B-uFY.js";
 import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
-import { t as typographyDefinition } from "./typography.cva-BI0FyIqm.js";
-import { t as Typography } from "./Typography-AcUd9df8.js";
+import { t as typographyDefinition } from "./typography.cva-CJZZSGXW.js";
+import { t as Typography } from "./Typography-B0Gp1lpc.js";
 import { t as compoundMapper } from "./compoundMapper-Di3SKZnS.js";
-import { t as FormFieldError } from "./FormFieldError-CFg0Wn3i.js";
+import { t as FormFieldError } from "./FormFieldError-QRAFHUTt.js";
 import { Suspense, lazy } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/inputs/FormField/formFieldHeader.cva.ts
@@ -24,20 +24,20 @@ const labelDefinition = UIOverrides.defineConfig({
 	base: [""],
 	config: {
 		variants: { as: {
-			default: ["flex items-start gap-1 text-text-default-1 input-disabled:text-text-default-3"],
-			filter: ["text-text-default-1 input-disabled:text-text-default-3"],
-			inline: ["flex items-start gap-1 text-text-default-1"],
+			default: ["flex items-start gap-1 text-surface-default-card-foreground input-disabled:text-tint-surface-default-card-foreground/50"],
+			filter: ["text-surface-default-card-foreground input-disabled:text-tint-surface-default-card-foreground/50"],
+			inline: ["flex items-start gap-1 text-surface-default-card-foreground input-disabled:text-tint-surface-default-card-foreground/50"],
 			floating: [
-				"pointer-events-none",
+				"pointer-events-none font-normal!",
 				"absolute transition-all duration-75",
 				"top-1/2 -translate-y-1/2",
-				"text-text-default-3",
-				"input-disabled:text-interactive-text-secondary-disabled!",
+				"text-surface-default-card-foreground",
+				"input-disabled:text-tint-surface-default-card-foreground/50!",
 				"input-filled:top-[calc(var(--spacing-floating-label-input-height-filled)+var(--spacing-floating-label-input-offset-top))]",
 				"input-filled:translate-y-0",
-				"input-filled:text-text-default-1",
-				"input-filled:font-semibold!",
-				"input-filled:text-label-3!",
+				"input-filled:text-surface-default-card-foreground",
+				"input-filled:font-bold!",
+				"input-filled:text-small!",
 				"group-data-[text-area]/text-area:top-floating-label-input-height-empty group-data-[text-area]/text-area:translate-y-0",
 				"group-has-[textarea:not(:placeholder-shown)]/text-area:hidden",
 				"group-data-[text-editor]/text-editor:top-floating-label-input-height-empty group-data-[text-editor]/text-editor:left-input-side-default group-data-[text-editor]/text-editor:translate-y-0",
@@ -52,40 +52,38 @@ const labelTypography = compoundMapper({
 		{
 			as: "default",
 			value: {
-				size: "label-2",
-				sizeMobile: "label-2",
-				variant: "prominent-1"
+				size: "small",
+				sizeMobile: "small",
+				className: "font-bold"
 			}
 		},
 		{
 			as: "filter",
 			value: {
-				size: "label-1",
-				sizeMobile: "label-1",
-				variant: "default"
+				size: "large",
+				sizeMobile: "large"
 			}
 		},
 		{
 			as: "inline",
 			value: {
-				size: "label-2",
-				sizeMobile: "label-2",
-				variant: "prominent-1"
+				size: "small",
+				sizeMobile: "small",
+				className: "font-bold"
 			}
 		},
 		{
 			as: "floating",
 			value: {
-				size: "label-1",
-				sizeMobile: "label-1",
-				variant: "default"
+				size: "large",
+				sizeMobile: "large"
 			}
 		}
 	],
 	default: {
-		size: "label-2",
-		sizeMobile: "label-2",
-		variant: "prominent-1"
+		size: "small",
+		sizeMobile: "small",
+		className: "font-bold"
 	},
 	defaultVariants: { as: "default" }
 });
@@ -99,20 +97,20 @@ const FormFieldLabel = ({ ref, as, label, isRequired, isDisabled, labelProps, cl
 		...labelProps,
 		ref,
 		className: clsx(typographyCva({
-			size: "label-2",
-			sizeMobile: "label-2",
-			variant: "prominent-1",
+			size: "small",
+			sizeMobile: "small",
+			className: "font-bold",
 			...labelTypographyMap({ as })
 		}), labelBaseCva({ as }), className, labelProps?.className),
 		children: [label, isRequired && /* @__PURE__ */ jsx("span", {
-			className: clsx(!isDisabled && "text-text-error-1"),
+			className: clsx(!isDisabled && "text-surface-destructive-base"),
 			children: "*"
 		})]
 	});
 };
 //#endregion
 //#region src/components/inputs/FormField/FormFieldHeader.tsx
-const FormFieldHeaderTooltip = lazy(() => import("./FormFieldHeaderTooltip-C2IDI4ac.js"));
+const FormFieldHeaderTooltip = lazy(() => import("./FormFieldHeaderTooltip-Dl24v4_j.js"));
 const FormFieldHeader = ({ label, tooltipText, helperText, isRequired, rightContent, isHeaderHidden, isDisabled, className, labelProps }) => {
 	const formFieldHeaderCva = UIOverrides.useCva("formField.headerCva", formFieldHeaderDefinition);
 	return /* @__PURE__ */ jsxs("div", {
@@ -127,7 +125,10 @@ const FormFieldHeader = ({ label, tooltipText, helperText, isRequired, rightCont
 					isDisabled,
 					labelProps
 				}), tooltipText ? /* @__PURE__ */ jsx(Suspense, {
-					fallback: /* @__PURE__ */ jsx("span", { className: "size-6" }),
+					fallback: /* @__PURE__ */ jsx("span", {
+						className: "size-6",
+						"data-form-field-tooltip-loading": ""
+					}),
 					children: /* @__PURE__ */ jsx(FormFieldHeaderTooltip, {
 						text: tooltipText,
 						isDisabled
@@ -136,8 +137,8 @@ const FormFieldHeader = ({ label, tooltipText, helperText, isRequired, rightCont
 			}), rightContent]
 		}), helperText && /* @__PURE__ */ jsx(Typography, {
 			slot: "description",
-			size: "label-2",
-			className: "text-text-default-2",
+			size: "small",
+			className: "text-surface-default-foreground",
 			children: helperText
 		})]
 	});
@@ -145,10 +146,10 @@ const FormFieldHeader = ({ label, tooltipText, helperText, isRequired, rightCont
 //#endregion
 //#region src/components/inputs/FormField/formFieldHelper.cva.ts
 const formFieldHelperDefinition = UIOverrides.defineConfig({
-	base: ["text-label-3 text-text-default-2"],
+	base: ["text-small text-surface-default-foreground"],
 	config: {
 		variants: { visible: {
-			true: "mt-1-5",
+			true: "mt-1.5",
 			false: "sr-only"
 		} },
 		defaultVariants: { visible: false }

package/dist/{FormFieldError-CFg0Wn3i.js → FormFieldError-QRAFHUTt.js}

@@ -3,10 +3,10 @@ import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/inputs/FormField/formFieldError.cva.ts
 const formFieldErrorDefinition = UIOverrides.defineConfig({
-	base: ["text-label-3 text-text-error-1"],
+	base: ["text-small text-surface-destructive-base"],
 	config: {
 		variants: { visible: {
-			true: "mt-1-5",
+			true: "mt-1.5",
 			false: "sr-only"
 		} },
 		defaultVariants: { visible: false }

package/dist/{FormFieldHeaderTooltip-C2IDI4ac.js → FormFieldHeaderTooltip-Dl24v4_j.js}

@@ -1,6 +1,6 @@
 import { t as createLucideIcon } from "./createLucideIcon-LcezOE4z.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
-import { t as Tooltip } from "./Tooltip-D94a1IQl.js";
+import { t as Tooltip } from "./Tooltip-aE1Vswxz.js";
 import { t as $a3be900807531178$re_export$Focusable } from "./exports-BNrTn8Tj.js";
 import { jsx } from "react/jsx-runtime";
 //#region ../../node_modules/.bun/lucide-react@1.43.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/info.mjs
@@ -37,7 +37,7 @@ const Info = createLucideIcon(__iconData);
 const FormFieldHeaderTooltip = ({ text, isDisabled }) => /* @__PURE__ */ jsx(Tooltip, {
 	text,
 	children: /* @__PURE__ */ jsx($a3be900807531178$re_export$Focusable, { children: /* @__PURE__ */ jsx(Info, {
-		className: clsx("size-6", isDisabled ? "text-interactive-text-secondary-disabled" : "text-interactive-text-secondary-idle hover:text-interactive-text-secondary-hover"),
+		className: clsx("size-6", isDisabled ? "text-tint-surface-default-popover-foreground/50" : "text-surface-default-popover-foreground hover:text-tint-surface-default-popover-foreground/80"),
 		tabIndex: 0
 	}) })
 });

package/dist/{IconButton-CYazzM7I.d.ts → IconButton-KXecZgYX.d.ts}

@@ -1,5 +1,5 @@
-import { n as LinkNavigationProps } from "./Link-DS9-0Ijl.js";
-import { n as ButtonAppearanceProps } from "./Button-DTNjsGx5.js";
+import { n as LinkNavigationProps } from "./Link-QYpprkN1.js";
+import { n as ButtonAppearanceProps } from "./Button-BZ3is6IU.js";
 import { FC, ReactElement, SVGProps } from "react";
 import { ButtonProps } from "react-aria-components";
 //#region src/components/buttons/IconButton/IconButton.d.ts

package/dist/{InlineIconButton-Rp5bXWcQ.d.ts → InlineIconButton-CbKZ2U_a.d.ts}

@@ -1,5 +1,5 @@
-import { n as LinkNavigationProps } from "./Link-DS9-0Ijl.js";
-import { a as ButtonProps, n as ButtonAppearanceProps } from "./Button-DTNjsGx5.js";
+import { n as LinkNavigationProps } from "./Link-QYpprkN1.js";
+import { a as ButtonProps, n as ButtonAppearanceProps } from "./Button-BZ3is6IU.js";
 import { FC, ReactElement, RefObject, SVGProps } from "react";
 //#region src/components/buttons/InlineIconButton/InlineIconButton.d.ts
 interface InlineIconButtonProps extends Omit<ButtonProps, "children">, ButtonAppearanceProps {