k8ordo
  • UI
  • Form
  • State
  • Router
  • Static
  • Server
Switch to dark mode
  • Get Started
  • Theming
  • i18n
  • Components
  • Hooks
  • Helpers
  • AI
k8ordo

React libraries that use Baseline features without holding back.

Packages
  • @k8ordo/ui
  • @k8ordo/form
  • @k8ordo/state
  • @k8ordo/router
  • @k8ordo/static
  • @k8ordo/server
UI
  • Get Started
  • Theming
  • i18n
  • Components
  • Hooks
  • Helpers
  • AI Chat
  • Generative UI
  • AI Agents
  • Storybook
Resources
  • GitHub
  • npm

© 2026 k8o — MIT License

Typeset in Noto Sans JP & M PLUS 2

i18n

Wording the components render on their own — close button labels, the required badge, the loading announcement — comes from a message dictionary. Replace the dictionary and the language changes without touching your own code.

Japanese by default

No setup required. UIProvider uses the Japanese dictionary, and components fall back to the same Japanese wording even without a provider.

Switching to English

Import en from @k8ordo/ui/i18n and pass it to messages. ja ships from the same entry point.

Overriding part of a dictionary

messages is a Partial<Messages>. Only the keys you pass are replaced; the rest fall back to the Japanese defaults. To start from English instead, spread en first and layer your changes on top.

Resolution order

Three sources can decide a string, and they win in the order prop > dictionary > default. Per-instance props (such as the Spinner label) always beat the dictionary, so reach for them when only one place should read differently.

Writing your own dictionary

Annotate with the Messages type and missing or misspelled keys become compile errors — including when the library adds a key.

Key reference

Every key in Messages. The values below are read from the shipped dictionaries themselves.

close
Used by: Alert / Dialog / Drawer
ja (default): 閉じる
en: Close
required
Used by: FormControl
ja (default): 必須
en: Required
loading
Used by: Spinner
ja (default): 読み込み中
en: Loading
avatar
Used by: Avatar
ja (default): アバター
en: Avatar
color
Used by: Code
ja (default): 色
en: Color
alertSuccess
Used by: Alert
ja (default): 成功
en: Success
alertInfo
Used by: Alert
ja (default): 情報
en: Information
alertWarning
Used by: Alert
ja (default): 警告
en: Warning
alertError
Used by: Alert
ja (default): エラー
en: Error
toastRegion
Used by: Toast
ja (default): 通知
en: Notifications
autocompletePlaceholder
Used by: Autocomplete
ja (default): 入力して絞り込めます
en: Type to filter
autocompleteRemoveTag
Used by: Autocomplete
ja (default): タグを削除
en: Remove tag
autocompleteClear
Used by: Autocomplete
ja (default): すべて削除
en: Clear all
autocompleteEmpty
Used by: Autocomplete
ja (default): 該当なし
en: No results
fileFieldRemove
Used by: FileField
ja (default): ファイルを削除
en: Remove file
fileFieldTrigger
Used by: FileField（生成 UI）
ja (default): ファイルを選択
en: Select files
numberFieldIncrement
Used by: NumberField
ja (default): 増やす
en: Increase
numberFieldDecrement
Used by: NumberField
ja (default): 減らす
en: Decrease
passwordShow
Used by: PasswordInput
ja (default): パスワードを表示
en: Show password
passwordHide
Used by: PasswordInput
ja (default): パスワードを非表示
en: Hide password
listBoxPlaceholder
Used by: ListBox
ja (default): 選択してください
en: Select an option
breadcrumb
Used by: Breadcrumb
ja (default): パンくずリスト
en: Breadcrumb
tabList
Used by: Tabs（生成 UI）
ja (default): タブ
en: Tabs
paginationLabel
Used by: Pagination
ja (default): ページネーション
en: Pagination
paginationPrevious
Used by: Pagination
ja (default): 前へ
en: Previous
paginationNext
Used by: Pagination
ja (default): 次へ
en: Next
chat
Used by: Conversation.Messages
ja (default): チャット
en: Chat
scrollToLatest
Used by: Conversation.ScrollButton
ja (default): 最新のメッセージへ移動
en: Scroll to latest message
reasoning
Used by: Reasoning
ja (default): 思考の過程
en: Reasoning
reasoningStreaming
Used by: Reasoning
ja (default): 思考中…
en: Thinking…
suggestions
Used by: Suggestion.List
ja (default): 候補
en: Suggestions
send
Used by: PromptInput
ja (default): 送信
en: Send
stop
Used by: PromptInput
ja (default): 停止
en: Stop
toolInput
Used by: ToolInvocation
ja (default): 入力
en: Input
toolOutput
Used by: ToolInvocation
ja (default): 出力
en: Output
toolError
Used by: ToolInvocation
ja (default): ツールの実行でエラーが発生しました。
en: The tool failed to run.
toolDenied
Used by: ToolInvocation
ja (default): ツールの実行は許可されませんでした。
en: The tool run was not approved.
responseCopied
Used by: Response
ja (default): コピーしました
en: Copied
responseCopyCode
Used by: Response
ja (default): コードをコピー
en: Copy code
responseCopyLink
Used by: Response
ja (default): リンクをコピー
en: Copy link
responseCopyTable
Used by: Response
ja (default): 表をコピー
en: Copy table
responseCopyTableAsCsv
Used by: Response
ja (default): 表を CSV でコピー
en: Copy table as CSV
responseCopyTableAsMarkdown
Used by: Response
ja (default): 表を Markdown でコピー
en: Copy table as Markdown
responseCopyTableAsTsv
Used by: Response
ja (default): 表を TSV でコピー
en: Copy table as TSV
responseDownloadDiagram
Used by: Response
ja (default): 図をダウンロード
en: Download diagram
responseDownloadDiagramAsMmd
Used by: Response
ja (default): 図を MMD でダウンロード
en: Download diagram as MMD
responseDownloadDiagramAsPng
Used by: Response
ja (default): 図を PNG でダウンロード
en: Download diagram as PNG
responseDownloadDiagramAsSvg
Used by: Response
ja (default): 図を SVG でダウンロード
en: Download diagram as SVG
responseDownloadFile
Used by: Response
ja (default): ファイルをダウンロード
en: Download file
responseDownloadImage
Used by: Response
ja (default): 画像をダウンロード
en: Download image
responseDownloadTable
Used by: Response
ja (default): 表をダウンロード
en: Download table
responseDownloadTableAsCsv
Used by: Response
ja (default): 表を CSV でダウンロード
en: Download table as CSV
responseDownloadTableAsMarkdown
Used by: Response
ja (default): 表を Markdown でダウンロード
en: Download table as Markdown
responseExitFullscreen
Used by: Response
ja (default): 全画面表示を終了
en: Exit fullscreen
responseViewFullscreen
Used by: Response
ja (default): 全画面表示
en: View fullscreen
responseImageNotAvailable
Used by: Response
ja (default): 画像を表示できません
en: Image not available
responseOpenExternalLink
Used by: Response
ja (default): 外部リンクを開きますか？
en: Open external link?
responseExternalLinkWarning
Used by: Response
ja (default): 外部サイトに移動しようとしています。
en: You're about to visit an external website.
responseOpenLink
Used by: Response
ja (default): リンクを開く
en: Open link
KeyUsed byja (default)en
closeAlert / Dialog / Drawer閉じるClose
requiredFormControl必須Required
loadingSpinner読み込み中Loading
avatarAvatarアバターAvatar
colorCode色Color
alertSuccessAlert成功Success
alertInfoAlert情報Information
alertWarningAlert警告Warning
alertErrorAlertエラーError
toastRegionToast通知Notifications
autocompletePlaceholder
Autocomplete
入力して絞り込めます
Type to filter
autocompleteRemoveTagAutocompleteタグを削除Remove tag
autocompleteClearAutocompleteすべて削除Clear all
autocompleteEmptyAutocomplete該当なしNo results
fileFieldRemoveFileFieldファイルを削除Remove file
fileFieldTriggerFileField（生成 UI）ファイルを選択Select files
numberFieldIncrementNumberField増やすIncrease
numberFieldDecrementNumberField減らすDecrease
passwordShowPasswordInputパスワードを表示Show password
passwordHidePasswordInputパスワードを非表示Hide password
listBoxPlaceholderListBox選択してくださいSelect an option
breadcrumbBreadcrumbパンくずリストBreadcrumb
tabListTabs（生成 UI）タブTabs
paginationLabelPaginationページネーションPagination
paginationPreviousPagination前へPrevious
paginationNextPagination次へNext
chatConversation.MessagesチャットChat
scrollToLatestConversation.ScrollButton最新のメッセージへ移動Scroll to latest message
reasoningReasoning思考の過程Reasoning
reasoningStreamingReasoning思考中…Thinking…
suggestionsSuggestion.List候補Suggestions
sendPromptInput送信Send
stopPromptInput停止Stop
toolInputToolInvocation入力Input
toolOutputToolInvocation出力Output
toolErrorToolInvocationツールの実行でエラーが発生しました。The tool failed to run.
toolDeniedToolInvocationツールの実行は許可されませんでした。The tool run was not approved.
responseCopiedResponseコピーしましたCopied
responseCopyCodeResponseコードをコピーCopy code
responseCopyLinkResponseリンクをコピーCopy link
responseCopyTableResponse表をコピーCopy table
responseCopyTableAsCsvResponse表を CSV でコピーCopy table as CSV
responseCopyTableAsMarkdownResponse表を Markdown でコピーCopy table as Markdown
responseCopyTableAsTsvResponse表を TSV でコピーCopy table as TSV
responseDownloadDiagramResponse図をダウンロードDownload diagram
responseDownloadDiagramAsMmdResponse図を MMD でダウンロードDownload diagram as MMD
responseDownloadDiagramAsPngResponse図を PNG でダウンロードDownload diagram as PNG
responseDownloadDiagramAsSvgResponse図を SVG でダウンロードDownload diagram as SVG
responseDownloadFileResponseファイルをダウンロードDownload file
responseDownloadImageResponse画像をダウンロードDownload image
responseDownloadTableResponse表をダウンロードDownload table
responseDownloadTableAsCsvResponse表を CSV でダウンロードDownload table as CSV
responseDownloadTableAsMarkdownResponse表を Markdown でダウンロードDownload table as Markdown
responseExitFullscreenResponse全画面表示を終了Exit fullscreen
responseViewFullscreenResponse全画面表示View fullscreen
responseImageNotAvailableResponse画像を表示できませんImage not available
responseOpenExternalLinkResponse外部リンクを開きますか？Open external link?
responseExternalLinkWarningResponse外部サイトに移動しようとしています。You're about to visit an external website.
responseOpenLinkResponseリンクを開くOpen link
import { UIProvider } from '@k8ordo/ui';

function App({ children }) {
  return <UIProvider>{children}</UIProvider>;
}
import { UIProvider } from '@k8ordo/ui';
import { en } from '@k8ordo/ui/i18n';

function App({ children }) {
  return (
    <UIProvider messages={en}>
      {children}
    </UIProvider>
  );
}
import { en } from '@k8ordo/ui/i18n';

<UIProvider messages={{ close: '閉じる (Esc)' }}>
  {children}
</UIProvider>

<UIProvider messages={{ ...en, autocompleteEmpty: 'No matches' }}>
  {children}
</UIProvider>
// 1. prop
<Spinner label="送信中" />
// -> 送信中

// 2. messages
<UIProvider messages={en}>
  <Spinner />
</UIProvider>
// -> Loading

// 3. default
<Spinner />
// -> 読み込み中
import type { Messages } from '@k8ordo/ui/i18n';

const fr: Messages = {
  close: 'Fermer',
  required: 'Requis',
  loading: 'Chargement',
  avatar: 'Avatar',
  color: 'Couleur',
  // ...
};

<UIProvider messages={fr}>{children}</UIProvider>