Skip to content

inline images do not have font size set #418

Description

@jonmindtrip

Describe the bug
I'm trying to use an InlineImageProvider that pulls the images from system SF Symbol images, which should adjust size using the current font size. However, the font size configured in the markdown theme doesn't appear to be set on the image, so it always renders at the same size.

Checklist

  • [x ] I can reproduce this issue with a vanilla SwiftUI project.
  • [x ] I can reproduce this issue using the main branch of this package.
  • [x ] This bug hasn't been addressed in an existing GitHub issue.

Steps to reproduce
The code below reproduces the issue: a cloud image is embedded within a paragraph, a heading, and a list. Each of those is configured to use a different font size via the Theme, but the cloud image always displays at the same size.

To see the expected behavior, uncomment the .font(.system(size: N)) modifiers in the example code.

struct SystemImageInlineImageProvider: InlineImageProvider {
  private let name: (URL) -> String
  public init(name: @escaping (URL) -> String = \.lastPathComponent) {
    self.name = name
  }

  public func image(with url: URL, label: String) async throws -> Image {
    .init(systemName: self.name(url))
  }
}

extension InlineImageProvider where Self == SystemImageInlineImageProvider {
  static var system: Self { .init() }
}

extension Theme {
  static let custom = Theme()
    .text {
      FontSize(16)
    }
    .listItem { configuration in
      configuration.label
//        .font(.system(size: 24))
        .markdownTextStyle {
          FontSize(24)
        }
    }
    .heading1 { configuration in
      configuration.label
//        .font(.system(size: 30))
        .markdownTextStyle {
          FontSize(30)
          FontWeight(.semibold)
        }
    }
}

#Preview {
  let markdown = """
# An image ![cloud](cloud) in a header

A cloud ![cloud](cloud) within a paragraph of text.

This is a list
 - A cloud ![cloud](cloud) within a list item

"""
  Markdown(markdown)
    .markdownInlineImageProvider(.system)
    .markdownTheme(.custom)
}

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions