@yamada-ui/react/dist/cjs/core/css/css.cjs

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

const require_utils_index = require('../../utils/index.cjs');
const require_var = require('../system/var.cjs');
const require_utils = require('./utils.cjs');
const require_color_mix = require('./color-mix.cjs');
const require_conditions = require('./conditions.cjs');
const require_styles = require('./styles.cjs');

//#region src/core/css/css.ts
function isVariableLength(key) {
	return require_styles.variableLengthProperties.includes(key);
}
function isConditionalObject(breakpoints) {
	return function(value) {
		if (!(0, require_utils_index.utils_exports.isObject)(value)) return false;
		const keys = Object.keys(value);
		if (!keys.length) return false;
		if (!keys.includes("base")) return false;
		return keys.every((key) => {
			return breakpoints.isResponsiveKey(key) || key.startsWith("@") || key.startsWith("_");
		});
	};
}
function transformColorModeArray(breakpoints) {
	return function(key, [lightValue, darkValue]) {
		let computedCSS = {};
		if (isConditionalObject(breakpoints)(lightValue)) computedCSS = transformConditionalObject(breakpoints)(key, lightValue);
		else computedCSS[key] = lightValue;
		if (isConditionalObject(breakpoints)(darkValue)) computedCSS[require_conditions.conditions._dark] = transformConditionalObject(breakpoints)(key, darkValue);
		else computedCSS[require_conditions.conditions._dark] = { [key]: darkValue };
		return computedCSS;
	};
}
function transformConditionalObject(breakpoints) {
	return function(key, value) {
		const conditionalKeys = Object.keys(value).filter((key$1) => !breakpoints.isResponsiveKey(key$1));
		return (0, require_utils_index.utils_exports.merge)(breakpoints.queries.reduce((prev, { breakpoint, query }) => {
			const breakpointValue = value[breakpoint];
			if (!(0, require_utils_index.utils_exports.isUndefined)(breakpointValue)) if ((0, require_utils_index.utils_exports.isArray)(breakpointValue)) {
				const colorModeValue = transformColorModeArray(breakpoints)(key, breakpointValue);
				prev = (0, require_utils_index.utils_exports.merge)(prev, query ? { [query]: colorModeValue } : colorModeValue);
			} else if (isConditionalObject(breakpoints)(breakpointValue)) {
				const conditionalValue = transformConditionalObject(breakpoints)(key, breakpointValue);
				prev = (0, require_utils_index.utils_exports.merge)(prev, query ? { [query]: conditionalValue } : conditionalValue);
			} else prev = (0, require_utils_index.utils_exports.merge)(prev, query ? { [query]: { [key]: breakpointValue } } : { [key]: breakpointValue });
			return prev;
		}, {}), conditionalKeys.reduce((prev, conditionalKey) => {
			const query = require_conditions.getCondition(conditionalKey);
			prev[query] = { [key]: value[conditionalKey] };
			return prev;
		}, {}));
	};
}
function transformConditionalValue({ breakpoints }) {
	return function(key, value) {
		if ((0, require_utils_index.utils_exports.isArray)(value)) return transformColorModeArray(breakpoints)(key, value);
		else if (isConditionalObject(breakpoints)(value)) return transformConditionalObject(breakpoints)(key, value);
		else return { [key]: value };
	};
}
function expandCSS(system) {
	return function(css$1) {
		let computedCSS = {};
		for (let [key, value] of Object.entries(css$1)) {
			if (value == null) continue;
			if (!isVariableLength(key)) computedCSS = (0, require_utils_index.utils_exports.merge)(computedCSS, transformConditionalValue(system)(key, value));
			else computedCSS = (0, require_utils_index.utils_exports.merge)(computedCSS, { [key]: value });
		}
		return computedCSS;
	};
}
function valueToVar(system) {
	return function(prop, value) {
		const result = require_var.transformInterpolation(value, function(value$1, fallbackValue) {
			if (value$1.includes("colorScheme.")) return require_var.getColorSchemeVar(system)(value$1);
			else if (value$1.includes("colors.")) return require_color_mix.colorMix(value$1, {
				fallback: fallbackValue,
				system
			});
			else if (require_utils.isCSSToken(system)(value$1)) return system.cssMap[value$1].ref;
			else if (fallbackValue) {
				fallbackValue = require_utils.isCSSToken(system)(fallbackValue) ? system.cssMap[fallbackValue].ref : fallbackValue;
				return require_var.getVar(value$1, fallbackValue);
			} else return require_var.getVar(value$1);
		});
		if (prop.startsWith("--") && (0, require_utils_index.utils_exports.isString)(result)) if (result.includes("colorScheme.")) return require_var.getColorSchemeVar(system)(result);
		else if (result.includes("colors.")) return require_color_mix.colorMix(result, { system });
		else if (require_utils.isCSSToken(system)(result)) return system.cssMap[result].ref;
		else return result;
		else return result;
	};
}
function mergeCSS(prev, value, prop, properties) {
	if (properties) for (const property of properties) {
		prev[property] = prev[property] ?? {};
		prev[property] = (0, require_utils_index.utils_exports.merge)(prev[property], value);
	}
	else {
		prev[prop] = prev[prop] ?? {};
		prev[prop] = (0, require_utils_index.utils_exports.merge)(prev[prop], value);
	}
	return prev;
}
function insertCSS(prev, value, prop, properties) {
	if (properties) for (const property of properties) prev[property] = value;
	else prev[prop] = value;
	return prev;
}
function getStyle(prop) {
	const style = require_styles.styles[prop];
	return style === true ? { properties: [prop] } : style;
}
function css(system, theme = {}) {
	return function(cssOrFn) {
		function createCSS(cssOrFn$1) {
			const cssObj = (0, require_utils_index.utils_exports.runIfFn)(cssOrFn$1, system);
			const computedCSS = expandCSS(system)(cssObj);
			let prev = {};
			for (let [prop, value] of Object.entries(computedCSS)) {
				value = valueToVar(system)(prop, value);
				if (value == null) continue;
				prop = require_conditions.getCondition(prop);
				const style = getStyle(prop);
				const options = {
					css,
					prev,
					properties: style?.properties,
					system,
					theme
				};
				if ((0, require_utils_index.utils_exports.isObject)(value)) {
					value = style?.transform?.(value, options) ?? value;
					if ((0, require_utils_index.utils_exports.isObject)(value)) prev = mergeCSS(prev, createCSS(value), prop, style?.properties);
					else prev = insertCSS(prev, value, prop, style?.properties);
					continue;
				}
				const important = require_utils.isImportant(value);
				value = require_utils.omitImportant(value);
				value = style?.transform?.(value, options) ?? value;
				if (important) value = require_utils.insertImportant(value, style);
				if (style?.static) prev = (0, require_utils_index.utils_exports.merge)(prev, style.static);
				if ((0, require_utils_index.utils_exports.isObject)(value)) {
					prev = (0, require_utils_index.utils_exports.merge)(prev, createCSS(value));
					continue;
				}
				prev = insertCSS(prev, value, prop, style?.properties);
			}
			return prev;
		}
		return createCSS(cssOrFn);
	};
}

//#endregion
exports.css = css;
exports.getStyle = getStyle;
exports.transformConditionalValue = transformConditionalValue;
//# sourceMappingURL=css.cjs.map