export const DecorationUnderline = () => {
	return (
		<svg xmlns="http://www.w3.org/2000/svg" width={25} height={24} fill="none">
			<path
				fill="#757575"
				d="M12.25 17c3.3 0 6-2.7 6-6V3h-2.5v8c0 1.95-1.55 3.5-3.5 3.5s-3.5-1.55-3.5-3.5V3h-2.5v8c0 3.3 2.7 6 6 6Zm-7 2v2h14v-2h-14Z"
			/>
		</svg>
	);
};

export const DecorationLineThrough = () => {
	return (
		<svg xmlns="http://www.w3.org/2000/svg" width={25} height={24} fill="none">
			<path
				fill="#757575"
				fillRule="evenodd"
				d="M12.154 19c-.795 0-1.603-.09-2.423-.27-.82-.166-1.481-.365-1.981-.595L8 16.192c.641.308 1.365.577 2.173.808.808.23 1.61.346 2.404.346.897 0 1.59-.16 2.077-.48.5-.334.75-.828.75-1.481 0-.488-.128-.891-.385-1.212-.243-.333-.609-.609-1.096-.827a9.075 9.075 0 0 0-.83-.346H4.75v-1h16v1h-4.094c.499.587.748 1.337.748 2.25 0 1.18-.442 2.103-1.327 2.77-.885.653-2.192.98-3.923.98ZM7.84 9a4.884 4.884 0 0 1-.013-.365c0-1.09.417-1.968 1.25-2.635.846-.667 2.032-1 3.558-1 .82 0 1.596.09 2.326.27.744.179 1.392.397 1.943.653l-.192 1.942c-.718-.423-1.41-.73-2.077-.923a7.456 7.456 0 0 0-2.077-.288c-.834 0-1.5.154-2 .461-.488.308-.731.782-.731 1.423 0 .165.016.32.047.462H7.84Z"
				clipRule="evenodd"
			/>
		</svg>
	);
};

export const DecorationOverLine = () => {
	return (
		<svg xmlns="http://www.w3.org/2000/svg" width={25} height={24} fill="none">
			<path
				fill="#757575"
				d="M12.25 21c3.3 0 6-2.7 6-6V7h-2.5v8c0 1.95-1.55 3.5-3.5 3.5s-3.5-1.55-3.5-3.5V7h-2.5v8c0 3.3 2.7 6 6 6ZM5.25 3v2h14V3h-14Z"
			/>
		</svg>
	);
};

// TypographyIcon Icon.
export const TypographyIcon = () => (
	<svg xmlns="http://www.w3.org/2000/svg" width={24} height={24} fill="none">
		<rect width={22.4} height={22.4} x={0.8} y={0.8} stroke="#2F2F2F" strokeWidth={1.6} rx={3.2} />
		<path
			stroke="#2F2F2F"
			strokeLinecap="round"
			strokeLinejoin="round"
			strokeWidth={1.5}
			fill="#fff"
			d="m13.032 16.75-1.963-5.6c-.912-2.6-1.368-3.9-2.108-3.9-.741 0-1.197 1.3-2.109 3.9l-1.963 5.6M6.586 12h4.75M19.09 13.316v3.053m0-3.053c.031-.559.033-.984-.034-1.331-.159-.819-1.014-1.312-1.842-1.413-.792-.096-1.428.108-2.071 1.046m3.946 1.698h-1.93c-.296 0-.595.014-.88.094-1.746.485-1.618 2.933.133 3.235.194.033.393.048.59.039.46-.02.884-.243 1.248-.524.426-.33.84-.79.84-1.487v-1.357Z"
		/>
	</svg>
);

export const ItalicIcon = () => (
	<svg xmlns="http://www.w3.org/2000/svg" width={25} height={24} fill="none">
		<path fill="#757575" d="M12.358 17.5h-1.911l2.248-10.569h1.912L12.358 17.5Z" />
	</svg>
);

export const PopupTriggerIcon = () => {
	return (
		<svg xmlns="http://www.w3.org/2000/svg" width={24} height={24} viewBox="0 0 24 24" fill="none">
			<rect x={0.8} y={0.8} width={22.4} height={22.4} rx={3.2} stroke="#2F2F2F" strokeWidth={1.6} />
			<path
				d="M13.0315 16.75L11.0684 11.1504C10.1567 8.55012 9.70094 7.25 8.9601 7.25C8.21926 7.25 7.76345 8.55012 6.85184 11.1504L4.88867 16.75M6.5851 12H11.3351"
				stroke="#2F2F2F"
				strokeWidth={1.5}
				strokeLinecap="round"
				strokeLinejoin="round"
			/>
			<path
				d="M19.0884 13.3159V16.3695M19.0884 13.3159C19.1204 12.7574 19.1217 12.3319 19.0546 11.9846C18.8965 11.166 18.0411 10.6727 17.2134 10.5723C16.4212 10.4763 15.7853 10.6802 15.142 11.6175M19.0884 13.3159H17.1588C16.8624 13.3159 16.5634 13.3302 16.2778 13.4096C14.532 13.8949 14.66 16.3431 16.4108 16.6449C16.6053 16.6784 16.8039 16.6928 17.0008 16.6839C17.4606 16.6634 17.8848 16.4413 18.249 16.1597C18.6754 15.8299 19.0884 15.3695 19.0884 14.6731V13.3159Z"
				stroke="#2F2F2F"
				strokeWidth={1.5}
				strokeLinecap="round"
				strokeLinejoin="round"
			/>
		</svg>
	);
};
