Mermaid Zoom Out Icon render error

[ZbWeR]

Bug Description

Steps to Reproduce

Visit https://streamdown.ai/

Expected Behavior

Icon should be Zoom-Out

Actual Behavior

icon is 'check'

Code Sample

Streamdown Version

2.1.0

React Version

18.2.0

Node.js Version

No response

Browser(s)

No response

Operating System

None

Additional Context

No response

[simon5057]

This issue is a duplicate of the problem being addressed in PR #375 (Updated Zoom Out Icon SVG).

Temporary CSS Workaround:

While waiting for the PR to be merged, you can apply this CSS fix to override the incorrect checkmark icon:

[data-streamdown="mermaid-block"] {
  [title="Zoom out"] {
    svg {
      display: none;
    }

    &::after {
      content: "";
      display: block;
      width: 16px;
      height: 16px;
      background-color: currentColor;
      mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1.5 6.5C1.5 3.73858 3.73858 1.5 6.5 1.5C9.26142 1.5 11.5 3.73858 11.5 6.5C11.5 9.26142 9.26142 11.5 6.5 11.5C3.73858 11.5 1.5 9.26142 1.5 6.5ZM6.5 0C2.91015 0 0 2.91015 0 6.5C0 10.0899 2.91015 13 6.5 13C8.02469 13 9.42677 12.475 10.5353 11.596L13.9697 15.0303L14.5 15.5607L15.5607 14.5L15.0303 13.9697L11.596 10.5353C12.475 9.42677 13 8.02469 13 6.5C13 2.91015 10.0899 0 6.5 0ZM4.125 5.875H8.875V7.125H4.125V5.875Z'/%3E%3C/svg%3E");
      mask-repeat: no-repeat;
      mask-position: center;
      mask-size: contain;
      -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1.5 6.5C1.5 3.73858 3.73858 1.5 6.5 1.5C9.26142 1.5 11.5 3.73858 11.5 6.5C11.5 9.26142 9.26142 11.5 6.5 11.5C3.73858 11.5 1.5 9.26142 1.5 6.5ZM6.5 0C2.91015 0 0 2.91015 0 6.5C0 10.0899 2.91015 13 6.5 13C8.02469 13 9.42677 12.475 10.5353 11.596L13.9697 15.0303L14.5 15.5607L15.5607 14.5L15.0303 13.9697L11.596 10.5353C12.475 9.42677 13 8.02469 13 6.5C13 2.91015 10.0899 0 6.5 0ZM4.125 5.875H8.875V7.125H4.125V5.875Z'/%3E%3C/svg%3E");
      -webkit-mask-repeat: no-repeat;
      -webkit-mask-position: center;
      -webkit-mask-size: contain;
    }
  }
}

This workaround hides the incorrect SVG and uses a CSS mask to display the correct zoom-out icon using currentColor for proper theming support.

Related: #375

[haydenbleasel]

Resolved in #375