@hitachivantara/uikit-react-icons/dist/IconContainer.js

NEXT Design System icons packaged as a set of React components.

import { getSizeStyles } from "./utils.js";
import { forwardRef } from "react";
import styled from "@emotion/styled";
import { getColor } from "@hitachivantara/uikit-styles";
import { jsx } from "react/jsx-runtime";
//#region src/IconContainer.tsx
function getRotation(rotation) {
	switch (rotation) {
		case "up": return "-90deg";
		case "down": return "90deg";
		case true: return "180deg";
		default: return;
	}
}
var StyledIconContainer = styled("div")({
	display: "flex",
	flex: "0 0 auto",
	fontSize: 16,
	width: "var(--icsize, 32px)",
	height: "var(--icsize, 32px)",
	transition: "rotate 0.2s ease",
	justifyContent: "center",
	alignItems: "center"
});
/**
* A component used to contain icons in the established margins.
*
* This allows using external icons UI Kit components that expect padding around the icon.
* It also makes the use of theme colors easier through the `color` prop.
*
* @example
* <HvIconContainer color="warning" size="lg">
*  <svg />
* </HvIconContainer>
*/
var HvIconContainer = forwardRef(function HvIconContainer(props, ref) {
	const { size, style, color, rotate, children, ...others } = props;
	return /* @__PURE__ */ jsx(StyledIconContainer, {
		ref,
		style: {
			...getSizeStyles("", size),
			color: getColor(color),
			rotate: getRotation(rotate),
			...style
		},
		...others,
		children
	});
});
//#endregion
export { HvIconContainer };