import React from 'react';

import type { IconProps } from './iconProps';

export const CardStackIcon = ({
  width = 20,
  height = 20,
  viewBox = '0 0 20 20',
  role = 'image',
  ref,
  ...rest
}: IconProps) => (
  <svg
    ref={ref}
    xmlns="http://www.w3.org/2000/svg"
    fill="none"
    width={width}
    height={height}
    viewBox={viewBox}
    role={role}
    {...rest}
  >
    <path
      fill="currentColor"
      d="M17 5.6v-.22c0-.35 0-.53-.03-.67a1.5 1.5 0 0 0-1.18-1.18c-.14-.03-.32-.03-.66-.03H2.88c-.35 0-.53 0-.67.03A1.5 1.5 0 0 0 1.03 4.7C1 4.85 1 5.03 1 5.38l.01.22c.04.2.2.35.4.39l.22.01h11.29l1.07-.7c.62-.4 1.4-.4 2.02 0l.85.55a.5.5 0 0 0 .13-.25ZM2 8h7.98a1.95 1.95 0 0 0-.13 2.39 1.96 1.96 0 0 0 0 2.22 1.96 1.96 0 0 0-.19 1.89H4c-1.41 0-2.12 0-2.56-.44C1 13.62 1 12.91 1 11.5V9c0-.47 0-.7.15-.85C1.29 8 1.53 8 2 8Zm12.81-1.44a.34.34 0 0 1 .38 0l3.62 2.36c.12.07.19.21.19.36s-.07.28-.19.36L15.2 12a.34.34 0 0 1-.38 0L11.2 9.64a.43.43 0 0 1-.19-.36c0-.15.07-.29.19-.36l3.62-2.36Z"
    />
    <path
      fill="currentColor"
      d="m11.6 10.87-.41.27a.43.43 0 0 0-.19.36c0 .15.07.28.19.36l3.62 2.36c.12.08.26.08.38 0l3.62-2.36a.43.43 0 0 0 .19-.36.43.43 0 0 0-.19-.36l-.4-.27-2.84 1.85c-.35.23-.79.23-1.14 0l-2.83-1.85Z"
    />
    <path
      fill="currentColor"
      d="m11.6 13.1-.41.26a.43.43 0 0 0-.19.36c0 .15.07.29.19.36l3.62 2.36c.12.08.26.08.38 0l3.62-2.36a.43.43 0 0 0 .19-.36.43.43 0 0 0-.19-.36l-.4-.27-2.84 1.85c-.35.23-.79.23-1.14 0l-2.83-1.85Z"
    />
  </svg>
);
