InputControl

使用法

import { __experimentalInputControl as InputControl } from '@wordpress/components';
import { useState } from 'react';
const Example = () => {
   const [ value, setValue ] = useState( '' );
   return (
   <InputControl
   value={ value }
   onChange={ ( nextValue ) => setValue( nextValue ?? '' ) }
   />
   );
};

プロパティ

無効

trueの場合、inputは無効になります。

• タイプ: Boolean
• 必須: いいえ
• デフォルト: false
  

isPressEnterToChange

trueの場合、ENTERキーの押下がonChangeをトリガーするために必要です。有効にすると、タブを離れるときにも変更がトリガーされます（onBlur）。

• タイプ: Boolean
• 必須: いいえ
• デフォルト: false
  

視覚からラベルを隠す

trueの場合、ラベルはスクリーンリーダーにのみ表示されます。

• タイプ: Boolean
• 必須: いいえ
  

ラベル

このプロパティが追加されると、ラベルプロパティを使用してコンテンツとしてラベルが生成されます。

• タイプ: String
• 必須: いいえ
  

ラベルの位置

ラベルの位置（top、side、bottom、またはedge）。

• タイプ: String
• 必須: いいえ
  

onChange

入力の値を受け取る関数。

• タイプ: Function
• 必須: はい
  

プレフィックス

入力の左側に要素をレンダリングします。

• タイプ: React.ReactNode
• 必須: いいえ
  

サイズ

入力のサイズを調整します。

サイズには: default、small

• タイプ: String
• 必須: いいえ
• デフォルト: default
  

サフィックス

入力の右側に要素をレンダリングします。

• タイプ: React.ReactNode
• 必須: いいえ
  

タイプ

レンダリングする入力要素のタイプ。デフォルトは「text」です。

• タイプ: String
• 必須: いいえ
• デフォルト: 「text」
  

値

入力の現在の値。

• タイプ: String
• 必須: いいえ
  

__next40pxDefaultSize

将来のバージョンでデフォルトサイズになる大きなデフォルト高さを選択し始めます。

• タイプ: Boolean
• 必須: いいえ
• デフォルト: false