
import * as React from 'react';

interface IconProps extends React.SVGAttributes<SVGElement> {
  children?: never;
  color?: string;
}

/**
 * @name PencilSquareIcon
 
 *
 * @category outline
 *
 * @description
 * 
 *
 * 
 * @usage
 * 
 *
 * @accessibility
 * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
 *
 * @returns {JSX.Element} Componente SVG.
 */
const PencilSquareIcon = React.forwardRef<SVGSVGElement, IconProps>(
  ({ color = 'currentColor', ...props }, forwardedRef) => {
    return (
      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" stroke-width="1.5" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10"/></svg>
    );
  }
);

PencilSquareIcon.displayName = 'PencilSquareIcon';

export { PencilSquareIcon };
