flutter_package / gpt_markdown

Go to a project
Toggle navigation Toggle navigation pinning
saminsohag
2334006f 2 parents b4782e41 f45132b2

Merge remote-tracking branch 'origin/main'

Inline Side-by-side
Showing 4 changed files with 108 additions and 26 deletions
... ... @@ -99,6 +99,7 @@ class MarkdownHelper {
You can use Markdown to format text easily. Here are some examples:
- `Highlighted Text`: `This text is highlighted`
- **Bold Text**: **This text is bold**
- *Italic Text*: *This text is italicized*
- [Link](https://www.example.com): [This is a link](https://www.example.com)
... ... @@ -266,6 +267,29 @@ Markdown and LaTeX can be powerful tools for formatting text and mathematical ex
style: const TextStyle(
fontSize: 15,
),
highlightBuilder: (context, text, style) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 4, vertical: 2),
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.secondaryContainer,
borderRadius: BorderRadius.circular(4),
border: Border.all(
color: Theme.of(context).colorScheme.secondary.withOpacity(0.5),
width: 1,
),
),
child: Text(
text,
style: TextStyle(
color: Theme.of(context).colorScheme.onSecondaryContainer,
fontFamily: 'monospace',
fontWeight: FontWeight.bold,
fontSize: style.fontSize != null ? style.fontSize! * 0.9 : 13.5,
height: style.height,
),
),
);
},
latexWorkaround: (tex) {
List<String> stack = [];
tex = tex.splitMapJoin(
... ... @@ -377,6 +401,20 @@ Markdown and LaTeX can be powerful tools for formatting text and mathematical ex
);
},
);
codeBuilder: (context, name, code) {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Text(
code.trim(),
style: TextStyle(
fontFamily: 'JetBrains Mono',
fontSize: 14,
height: 1.5,
color: Theme.of(context).colorScheme.onSurface,
),
),
);
};
if (selectable) {
child = SelectionArea(
child: child,
... ...
... ... @@ -12,6 +12,8 @@ class GptMarkdownConfig {
this.followLinkColor = false,
this.codeBuilder,
this.sourceTagBuilder,
this.highlightBuilder,
this.linkBuilder,
this.maxLines,
this.overflow,
});
... ... @@ -32,6 +34,8 @@ class GptMarkdownConfig {
codeBuilder;
final int? maxLines;
final TextOverflow? overflow;
final Widget Function(BuildContext context, String text, TextStyle style)? highlightBuilder;
final Widget Function(BuildContext context, String text, String url, TextStyle style)? linkBuilder;
GptMarkdownConfig copyWith({
TextStyle? style,
... ... @@ -51,6 +55,8 @@ class GptMarkdownConfig {
codeBuilder,
final int? maxLines,
final TextOverflow? overflow,
final Widget Function(BuildContext context, String text, TextStyle style)? highlightBuilder,
final Widget Function(BuildContext context, String text, String url, TextStyle style)? linkBuilder,
}) {
return GptMarkdownConfig(
style: style ?? this.style,
... ... @@ -65,6 +71,8 @@ class GptMarkdownConfig {
sourceTagBuilder: sourceTagBuilder ?? this.sourceTagBuilder,
maxLines: maxLines ?? this.maxLines,
overflow: overflow ?? this.overflow,
highlightBuilder: highlightBuilder ?? this.highlightBuilder,
linkBuilder: linkBuilder ?? this.linkBuilder,
);
}
... ...
... ... @@ -34,6 +34,8 @@ class GptMarkdown extends StatelessWidget {
this.latexBuilder,
this.codeBuilder,
this.sourceTagBuilder,
this.highlightBuilder,
this.linkBuilder,
this.maxLines,
this.overflow,
});
... ... @@ -53,6 +55,8 @@ class GptMarkdown extends StatelessWidget {
final Widget Function(BuildContext context, String name, String code)?
codeBuilder;
final Widget Function(BuildContext, String, TextStyle)? sourceTagBuilder;
final Widget Function(BuildContext context, String text, TextStyle style)? highlightBuilder;
final Widget Function(BuildContext context, String text, String url, TextStyle style)? linkBuilder;
@override
Widget build(BuildContext context) {
... ... @@ -93,6 +97,8 @@ class GptMarkdown extends StatelessWidget {
maxLines: maxLines,
overflow: overflow,
sourceTagBuilder: sourceTagBuilder,
highlightBuilder: highlightBuilder,
linkBuilder: linkBuilder,
),
));
}
... ...
... ... @@ -422,25 +422,37 @@ class HighlightedText extends InlineMd {
final GptMarkdownConfig config,
) {
var match = exp.firstMatch(text.trim());
var conf = config.copyWith(
style: config.style?.copyWith(
fontWeight: FontWeight.bold,
background: Paint()
..color = GptMarkdownTheme.of(context).highlightColor
..strokeCap = StrokeCap.round
..strokeJoin = StrokeJoin.round,
) ??
TextStyle(
fontWeight: FontWeight.bold,
background: Paint()
..color = GptMarkdownTheme.of(context).highlightColor
..strokeCap = StrokeCap.round
..strokeJoin = StrokeJoin.round,
),
);
var highlightedText = match?[1] ?? "";
if (config.highlightBuilder != null) {
return WidgetSpan(
alignment: PlaceholderAlignment.middle,
child: config.highlightBuilder!(
context,
highlightedText,
config.style ?? const TextStyle(),
),
);
}
var style = config.style?.copyWith(
fontWeight: FontWeight.bold,
background: Paint()
..color = GptMarkdownTheme.of(context).highlightColor
..strokeCap = StrokeCap.round
..strokeJoin = StrokeJoin.round,
) ??
TextStyle(
fontWeight: FontWeight.bold,
background: Paint()
..color = GptMarkdownTheme.of(context).highlightColor
..strokeCap = StrokeCap.round
..strokeJoin = StrokeJoin.round,
);
return TextSpan(
text: match?[1],
style: conf.style,
text: highlightedText,
style: style,
);
}
}
... ... @@ -721,15 +733,35 @@ class ATagMd extends InlineMd {
if (match?[1] == null && match?[2] == null) {
return const TextSpan();
}
final linkText = match?[1] ?? "";
final url = match?[2] ?? "";
// Use custom builder if provided
if (config.linkBuilder != null) {
return WidgetSpan(
child: GestureDetector(
onTap: () => config.onLinkTab?.call(url, linkText),
child: config.linkBuilder!(
context,
linkText,
url,
config.style ?? const TextStyle(),
),
),
);
}
// Default rendering
var theme = GptMarkdownTheme.of(context);
return WidgetSpan(
child: LinkButton(
hoverColor: theme.linkHoverColor,
color: theme.linkColor,
onPressed: () {
config.onLinkTab?.call("${match?[2]}", "${match?[1]}");
config.onLinkTab?.call(url, linkText);
},
text: match?[1] ?? "",
text: linkText,
config: config,
),
);
... ... @@ -892,11 +924,9 @@ class CodeBlockMd extends BlockMd {
String codes = this.exp.firstMatch(text)?[2] ?? "";
String name = this.exp.firstMatch(text)?[1] ?? "";
codes = codes.replaceAll(r"```", "").trim();
return Padding(
padding: const EdgeInsets.all(16.0),
child: config.codeBuilder != null
? config.codeBuilder?.call(context, name, codes)
: CodeField(name: name, codes: codes),
);
return config.codeBuilder != null
? config.codeBuilder!(context, name, codes)
: CodeField(name: name, codes: codes);
}
}
... ...