✨ TypeSet

📖 Overview

TypeSet brings WhatsApp / Telegram-style inline formatting to Flutter with two design goals:

Why TypeSet?

• 🔤 Familiar *bold* / _italic_ syntax users already know
• 🌐 Backend-driven — style text from your server without app updates
• 🔗 Configurable AutoLink with scheme & domain allowlists
• ✏️ Real-time editing preview via TypeSetEditingController
• 🎨 Theme-aware styles with TypeSetStyle.fromTheme()
• ⚡ AST-based parser with LRU document caching
• 🧪 95%+ test coverage

📱 TypeSet in action!

🚀 Getting Started

Installation

dependencies:
  typeset: ^3.0.0

flutter pub get

Minimum Requirements

Coming from v2.x? See the Migration Guide for step-by-step upgrade instructions.

💡 Usage

Quick Start

import 'package:typeset/typeset.dart';

// That's it — one widget, zero config
const TypeSet('Hello *world* from _TypeSet_.');

Formatting Syntax

AutoLink (URL Detection)

Raw URLs like https://flutter.dev and www.example.com are automatically detected and rendered as links when AutoLink is enabled (default).

String Extension

// Use the .typeset() extension for inline usage
'Hello *world*'.typeset(style: myTextStyle);

// Extract plain text (markers removed)
final plain = 'Hello *world*'.plainText; // "Hello world"

⚙️ Configuration

TypeSet uses a layered config system with clear precedence:

Local config  →  Scoped provider  →  Global config  →  Library defaults
(highest priority)                                      (lowest priority)

TypeSetConfig

Centralizes all style and AutoLink behavior:

import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:typeset/typeset.dart';

final config = TypeSetConfig(
  style: const TypeSetStyle(
    boldStyle: TextStyle(fontWeight: FontWeight.w900),
    italicStyle: TextStyle(fontStyle: FontStyle.italic, color: Color(0xFF6A1B9A)),
    underlineStyle: TextStyle(decorationThickness: 3),
    monospaceStyle: TextStyle(fontFamily: 'Courier', backgroundColor: Color(0xFFEFF3FF)),
    linkStyle: TextStyle(color: Color(0xFF0B5FFF), decoration: TextDecoration.underline),
    markerColor: Color(0xFF8D8D8D),
  ),
  autoLinkConfig: TypeSetAutoLinkConfig(
    allowedSchemes: {'https'},
    allowedDomains: RegExp(r'^flutter\.dev$'),
    linkRecognizerBuilder: (text, url) =>
        TapGestureRecognizer()..onTap = () => launchUrl(Uri.parse(url)),
  ),
);

TypeSet('Read *docs* at https://flutter.dev', config: config);

Theme-Aware Styles

// Automatically adapts to your app's ColorScheme
final style = TypeSetStyle.fromTheme(Theme.of(context));

Scoped Configuration

Apply config to a subtree using TypeSetConfigProvider:

TypeSetConfigProvider(
  config: TypeSetConfig.defaults().copyWith(
    autoLinkConfig: TypeSetAutoLinkConfig.httpsOnly,
  ),
  child: const TypeSet('Visit https://dart.dev'),
);

Global Configuration

Set app-wide defaults at startup:

void main() {
  TypeSetGlobalConfig.current = TypeSetConfig(
    autoLinkConfig: TypeSetAutoLinkConfig.httpsOnly,
  );
  runApp(const MyApp());
}

✏️ Editing

TypeSetEditingController

Drop-in replacement for TextEditingController with live formatting preview:

final controller = TypeSetEditingController(
  text: 'Use *bold* and __underline__',
  config: TypeSetConfig(
    style: const TypeSetStyle(markerColor: Color(0xFF9E9E9E)),
  ),
);

TextField(
  controller: controller,
  maxLines: 5,
  decoration: const InputDecoration(
    border: OutlineInputBorder(),
    hintText: 'Type formatted text…',
  ),
);

Context Menu Integration

Add formatting buttons to the text selection toolbar:

TextField(
  controller: controller,
  contextMenuBuilder: (context, editableTextState) {
    return AdaptiveTextSelectionToolbar.buttonItems(
      anchors: editableTextState.contextMenuAnchors,
      buttonItems: [
        ...getTypesetContextMenus(
          editableTextState: editableTextState,
          actions: [
            TypesetFormatAction.bold,
            TypesetFormatAction.italic,
            TypesetFormatAction.underline,
          ],
        ),
        ...editableTextState.contextMenuButtonItems,
      ],
    );
  },
);

🏗️ Architecture

Input string  →  Parser (AST)  →  AutoLink pass  →  Renderer (InlineSpans)

🔄 Migration from v2.x

Version 3.0.0 includes breaking changes. The upgrade is straightforward — see the full guide:

👉 MIGRATION.md — step-by-step instructions with before/after code

Quick summary of what changed:

📂 Example App

cd example
flutter run

🤝 Contributing

Contributions welcome! See CONTRIBUTING.md for guidelines.

• 🐛 Report a bug
• 💡 Request a feature
• 💬 Discussions

📝 License

Apache-2.0 — see LICENSE.