@veracity/vui/dist/core/theme.js

Veracity UI is a React component library crafted for use within Veracity applications and pages. Based on Styled Components and @xstyled.

import { runIfFn } from "../utils/function.js";
import { merge } from "../utils/object.js";
import { extendTheme } from "../theme/extendTheme.js";
import { useMemo } from "react";
import { getPx, th, themeGetter } from "@xstyled/styled-components";
import { useTheme } from "styled-components";

//#region src/core/theme.ts
/** Removes specific theming keys from the given props. */
function omitThemingProps(props) {
	const { size, variant, ...rest } = props;
	return rest;
}
/** Re-export of xstyled 'th' with custom typing and screen getter. */
const th$1 = th;
th$1.screen = themeGetter({
	name: "screen",
	key: "screens",
	compose: getPx
});
/**
* Combines baseStyle, size and variant styling from a component's theme configuration.
* @param component - name of any component configured in the theme
* @param props - props object of the given component
*/
function useStyleConfig(component, props = {}) {
	const { baseStyle, defaultProps, parts = [], sizes, variants } = useTheme$1()?.components[component] ?? {};
	const mergedProps = {
		...props,
		colorScheme: props?.colorScheme ?? defaultProps?.colorScheme,
		size: props?.size ?? defaultProps?.size,
		variant: props?.variant ?? defaultProps?.variant
	};
	const { colorScheme, size, variant } = mergedProps;
	return useMemo(() => {
		const baseStyles = runIfFn(baseStyle, mergedProps) ?? {};
		const sizeStyles = runIfFn(sizes?.[size], mergedProps) ?? {};
		const variantStyles = runIfFn(variants?.[variant], mergedProps) ?? {};
		let styles = {};
		if (parts.length > 0) parts.forEach((part) => {
			styles[part] = merge(baseStyles[part] ?? {}, sizeStyles[part] ?? {}, variantStyles[part] ?? {});
		});
		else styles = merge(baseStyles, sizeStyles, variantStyles);
		return styles;
	}, [
		colorScheme,
		size,
		variant
	]);
}
/** Returns theme value at the given path. */
function useTh(path, defaultValue) {
	const theme = useTheme$1();
	return th$1(path, defaultValue)({ theme });
}
/** Returns the theme object with extensions. */
function useTheme$1() {
	return useTheme();
}

//#endregion
export { extendTheme, omitThemingProps, th$1 as th, useStyleConfig, useTh, useTheme$1 as useTheme };
globalThis.__vuiVersion__ = "5.3.1"
//# sourceMappingURL=theme.js.map