import React from 'react';
import { Svg, Path, G, ClipPath, Rect, Defs } from 'react-native-svg';

const ShoppingBagIcon = ({ 
  size = 18,
  color = "#FF5100",
  strokeColor = "transparent",
  strokeWidth = 0
}) => (
  <Svg width={size} height={size} viewBox="0 0 18 18" fill="none">
    <Defs>
      <ClipPath id="clip0_168_1003">
        <Rect width="18" height="18" fill="white" />
      </ClipPath>
    </Defs>
    <G clipPath="url(#clip0_168_1003)">
      <Path
        d="M17.2688 2.98125C17.0438 1.35 15.9187 0 14.2312 0H3.76875C2.08125 0 1.06875 1.125 0.73125 2.98125L0 15.0188C0 16.65 1.35 18 2.98125 18H14.9625C16.5938 18 17.9438 16.65 17.9438 15.0188L17.2688 2.98125ZM13.6687 4.95C13.6687 7.48125 11.5875 9.61875 9 9.61875C6.4125 9.61875 4.33125 7.5375 4.33125 4.95C4.33125 4.5 4.725 4.05 5.23125 4.05C5.7375 4.05 6.13125 4.5 6.13125 4.95C6.13125 6.525 7.425 7.81875 9 7.81875C10.575 7.81875 11.8688 6.525 11.8688 4.95C11.8688 4.44375 12.2625 4.05 12.7688 4.05C13.275 4.05 13.6687 4.5 13.6687 4.95Z"
        fill={color}
        stroke={strokeColor}
        strokeWidth={strokeWidth}
      />
    </G>
  </Svg>
);

export default ShoppingBagIcon;