@yamada-ui/react/dist/cjs/components/color-swatch/color-swatch.style.cjs

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

const require_config = require('../../core/system/config.cjs');

//#region src/components/color-swatch/color-swatch.style.ts
const colorSwatchStyle = require_config.defineComponentSlotStyle({
	base: {
		overlay: {
			boxSize: "full",
			inset: 0,
			position: "absolute"
		},
		root: {
			"& > *": {
				alignItems: "center",
				boxSize: "full",
				display: "flex",
				inset: 0,
				justifyContent: "center",
				overflow: "hidden",
				position: "absolute"
			},
			"--checkers-bg": ["colors.whiteAlpha.500", "colors.blackAlpha.500"],
			"--checkers-fg": ["colors.blackAlpha.300", "colors.whiteAlpha.300"],
			aspectRatio: "1",
			overflow: "hidden",
			position: "relative",
			w: "{width}"
		}
	},
	sizes: {
		"2xs": { root: { "--width": "sizes.6" } },
		xs: { root: { "--width": "sizes.8" } },
		sm: { root: { "--width": "sizes.9" } },
		md: { root: { "--width": "sizes.10" } },
		lg: { root: { "--width": "sizes.11" } },
		xl: { root: { "--width": "sizes.12" } },
		"2xl": { root: { "--width": "sizes.14" } }
	},
	variants: {
		circle: { root: { rounded: "full" } },
		plain: { root: { rounded: "l2" } },
		square: { root: { rounded: "0" } }
	},
	defaultProps: {
		size: "xs",
		variant: "plain"
	}
});

//#endregion
exports.colorSwatchStyle = colorSwatchStyle;
//# sourceMappingURL=color-swatch.style.cjs.map