import { Icon } from '../iconography';

type StackIconProps = {
  type: 'create';
  children: React.ReactNode;
  size?: number;
};

export function StackIcon({ type, children, size = 18 }: StackIconProps) {
  return (
    <span className="relative leading-[0] inline-block">
      {type === 'create' && (
        <span
          style={{ width: size, height: size }}
          className="absolute right-0 top-0 flex -translate-y-1/3 translate-x-1/3 items-center justify-center rounded border border-solid border-white bg-gray-50-900"
        >
          <Icon.Add width={size - 4} height={size - 4} />
        </span>
      )}
      {children}
    </span>
  );
}
