Tinyrack

Flutter

共通テーマとトークン、ネイティブな Material 3 の動作で Tinyrack アプリを構築します。

tinyrack_ui を使うと、Android、iOS、Linux、macOS、web、Windows で Tinyrack の色、タイポグラフィ、余白、モーション、コンポーネントの意図を共有できます。

flutter pub add tinyrack_ui
flutter pub add material_ui
import 'package:material_ui/material_ui.dart';
import 'package:tinyrack_ui/tinyrack_ui.dart';

MaterialApp(
  theme: TinyrackTheme.light(),
  darkTheme: TinyrackTheme.dark(),
  home: Scaffold(
    body: Center(
      child: TRButton(
        intent: TRIntent.primary,
        onPressed: deploy,
        child: const Text('デプロイ'),
      ),
    ),
  ),
);

コンポーネントページは、遅延読み込みした Flutter Web プレビューで実際の Dart ウィジェットを表示します。通常の React ルートのチャンクに Flutter ランタイムを含めず、現在のドキュメントテーマに追従します。