Widget inline OR Fetching text style from parent

[ArvidNy]

How would you do this if you want the widget to be inline? I have a running text where I want to add a custom popup to a tag. Something like this:

<p>This is a text with a <i>word</i> that I want to add a popup to.</p>

With this approach...

meta.register(BuildOp(
      onRenderBlock: (tree, placeholder) {
        return placeholder.wrapWith((_, child) {
          return InfoPopupWidget(
             customContent: () => MyWidget()
             child: child,
            );
        });
    }));

...this is rendered:

This is a text with a 
word
 that I want to add a popup to.

I can get closer to what I want with this, but then I don't know how to get the text style from the CSS that I need:

 onParsed: (tree) {
        final newTree = tree.parent.sub();
        newTree.append(WidgetBit.inline(
            tree.parent,
            InfoPopupWidget(
              customContent: () => MyWidget()
              child: Text(tree.element.text,
                      style: /* How do I get the style that I need here? */),
            )));
        return newTree;
      },

_Originally posted by @ArvidNy in https://github.com/daohoangson/flutter_widget_from_html/discussions/1108#discussioncomment-8783544_

[daohoangson]

Have you tried using BuildOp.inline?

[ArvidNy]

See the second example. Then I do not know how to get the parsed widget or the correct style for the text.

[WhyDrinkIce]

@daohoangson Excuse me. I have a problem and don't know if it is a bug or my fault. It only shows the first InlineWidget.The rest of the content, including regular text, is not being rendered.

var kHtml = '''
<p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <c-at id="a"/>  bbbbbbbbbbbbbbbbbb <c-at id="b"/>   </p>
''';

class _SmiliesWidgetFactory extends WidgetFactory {
  final smilieOp = BuildOp(
    debugLabel: 'smilie',
    onParsed: (tree) {
      final alt = tree.element.attributes['alt'];
      return tree..addText(kSmilies[alt] ?? alt ?? '');
    },
  );

  final atOp = BuildOp.inline(
      // alwaysRenderBlock: false,
      debugLabel: 'at',
      onRenderInlineBlock: (tree, c) {
        final id = tree.element.attributes["id"] ?? "null";
        return Text("@$id", style: TextStyle(color: Colors.red));
      });

  @override
  void parse(BuildTree tree) {
    final e = tree.element;
    if (e.localName == 'img' &&
        e.classes.contains('smilie') &&
        e.attributes.containsKey('alt')) {
      tree.register(smilieOp);
      return;
    }

    if (e.localName == 'c-at') {
      tree.register(atOp);
      return;
    }

    return super.parse(tree);
  }
}