build method

  1. @override
View? build()
override

Builds this component's renderable output.

App code can return a node, another component, text, or an iterable of renderable values. The renderer normalizes the value internally.

Implementation

@override
View build() {
  final resolvedError = resolveFieldError(
    name: name,
    error: error,
    errors: errors,
  );

  final toolbarNodes = <FlintNode>[];
  for (final item in toolbarItems) {
    if (item == RichTextToolbarItem.divider) {
      toolbarNodes.add(
        FlintElement(
          'div',
          props: {'className': 'flint-rich-text-editor-btn-divider'},
        ),
      );
    } else {
      toolbarNodes.add(
        FlintElement(
          'button',
          props: {
            'type': 'button',
            'className': 'flint-rich-text-editor-btn',
          },
          children: [FlintText(item.name)],
        ),
      );
    }
  }

  return FlintElement(
    'div',
    props: fieldWrapperProps(
      props: props,
      className: className,
      dartStyle: dartStyle,
      style: style,
    ),
    children: [
      if (name != null) fieldLabel(id: _id, label: name!, required: required),
      FlintElement(
        'div',
        props: {'className': 'flint-rich-text-editor-container'},
        children: [
          FlintElement(
            'div',
            props: {'className': 'flint-rich-text-editor-toolbar'},
            children: toolbarNodes,
          ),
          FlintElement(
            'div',
            props: {
              'id': '$_id-content',
              'contenteditable': disabled ? 'false' : 'true',
              'placeholder': placeholder,
              'className': 'flint-rich-text-editor-content',
              'style': {
                'height': height,
                'min-height': '150px',
                ...editorStyle,
              },
            },
          ),
        ],
      ),
      ...fieldMessages(id: _id, helpText: helpText, error: resolvedError),
    ],
  );
}