import { inputColors } from "./consts.js";

//#region src/input/theme.ts
const baseStyle = {
	container: {
		focusWithinRing: 3,
		color: inputColors.inputText,
		fontSize: "lg",
		lineHeight: "135%"
	},
	input: { placeholderTextColor: inputColors.placeholder }
};
const defaultProps = {
	size: "lg",
	variant: "grey"
};
const parts = [
	"container",
	"icon",
	"input",
	"label"
];
const sizes = {
	sm: {
		container: {
			fontSize: "sm",
			h: 24
		},
		icon: { size: "xs" },
		input: {},
		label: { fontSize: "xs" }
	},
	md: {
		container: {
			fontSize: "md",
			h: 32
		},
		icon: { size: "sm" },
		input: {},
		label: { fontSize: "sm" }
	},
	lg: {
		container: {
			fontSize: "lg",
			h: 40
		},
		icon: { size: "md" },
		input: {},
		label: { fontSize: "md" }
	},
	xl: {
		container: {
			fontSize: "xl",
			h: 48
		},
		icon: { size: "md" },
		input: {},
		label: { fontSize: "lg" }
	}
};
const variants = {
	grey: { container: {
		borderColor: inputColors.border,
		focusWithinRingColor: inputColors.focus
	} },
	green: { container: {
		borderColor: inputColors.success,
		focusWithinRingColor: inputColors.success
	} },
	red: { container: {
		borderColor: inputColors.error,
		focusWithinRingColor: inputColors.error
	} }
};
var theme_default = {
	baseStyle,
	defaultProps,
	parts,
	sizes,
	variants
};

//#endregion
export { theme_default as default };
globalThis.__vuiVersion__ = "4.0.0-beta.1"
//# sourceMappingURL=theme.js.map