RtkText

デザインシステムの色、フォントファミリー、フォントサイズを適用するテーマ付きテキストコンポーネントです。

プロパティ

プロパティ	型	必須	デフォルト	説明
`children`	`ReactNode`	✅	-	テキストコンテンツ
`size`	`'sm' \| 'md' \| 'lg' \| 'xl'`	❌	`'md'`	フォントサイズ（sm=14、md=16、lg=18、xl=20）
`fontWeight`	`'normal' \| 'bold' \| '100' \| '200' \| '300' \| '400' \| '500' \| '600' \| '700' \| '800' \| '900'`	❌	`'normal'`	フォントの太さ
`style`	`StyleProp<TextStyle>`	❌	`\{\}`	カスタムテキストスタイル
`onBrand`	`boolean`	❌	`false`	デフォルトのテキスト色の代わりにブランドテキスト色を使う

使用例

基本的な使い方

import { RtkText } from "@cloudflare/realtimekit-react-native-ui";

function MyComponent() {
	return <RtkText>Hello World</RtkText>;
}

プロパティを指定する場合

import { RtkText } from "@cloudflare/realtimekit-react-native-ui";

function MyComponent() {
	return (
		<RtkText size="lg" fontWeight="bold" onBrand={true}>
			Meeting Title
		</RtkText>
	);
}