字体大小选取器

FontSizePicker是一个React组件,它呈现允许用户选择字体大小的UI。
该组件呈现一个用户界面,该界面允许用户选择预定义(通用)字体大小,并包含一个选项,如果启用了该功能,则允许用户选择自定义字体大小(通过选择值)。

用法

从'react'导入{useState};从“@wordpress/components”导入{FontSizePicker};从'@wordpress/i18n'导入{__};const fontSizes=[{名称:__('小'),slug:'小',尺寸:12,},{name:__(“大”),slug:“大”,尺寸:26,},];const fallbackFontSize=16;const MyFontSizePicker=()=>{const[fontSize,setFontSize]=使用状态(12);返回(<字体大小选取器fontSizes={fontSizes}值={fontSize}fallbackFontSize={fallback字体大小}onChange={(newFontSize)=>{设置字体大小(newFontSize);} }/>);};...<MyFontSizePicker/>

道具

组件接受以下道具:

disableCustomFontSizes:布尔值

如果真的,将无法选择自定义fontSize。用户将被迫选择fontSizes中传递的预定义大小之一。

  • 必需:否
  • 违约:

fallbackFontSize:number(回退字体大小:数字)

如果不存在任何值,此属性将定义字体大小选取器滑块的起始位置。仅在以下情况下相关带滑块真的.

  • 必需:否

字体大小:字体大小[]

字体大小对象的数组。对象应包含属性size、name和slug。
财产大小包含一个带有字体大小值的数字,在二甲苯或指定应使用的字体大小CSS属性的字符串,例如:“13px”、“1em”或“clamp(12px,5vw,100px)”。
这个名称属性包含该字体大小的标签,例如:小型.
这个段塞属性是具有字体大小唯一标识符的字符串。用于类生成过程。

注:鼻涕虫违约习俗是保留的,无法使用。

  • 必需:否
  • 违约:[]

onChange:(value:number|string|未定义,selectedItem?:FontSize)=>void

接收新字体大小值的函数。
如果在没有任何参数的情况下调用onChange,则应重置该值,注意重置在该上下文中的含义,例如,将字体大小设置为未定义,或将字体大小设为起始值。

  • 必需:是

size:'default'|'__unstable-large'

控件的大小。

  • 必需:否
  • 违约:“默认”

单位:字符串[]

自定义字体大小选择的可用单位。

  • 必需:否
  • 违约:[“px”、“em”、“rem”、“vw”、“vh”]

value:number |字符串

当前字体大小值。

  • 必需:否

带重置:布尔值

如果真的,当自定义字体大小处于活动状态时,将在输入字段旁边显示重置按钮。在以下情况下无效禁用自定义字体大小真的.

  • 必需:否
  • 违约:真的

使用滑块:布尔

如果真的,当自定义字体大小处于活动状态时,将在输入字段旁边显示一个滑块。在以下情况下无效禁用自定义字体大小真的.

  • 必需:否
  • 违约:

__next40px默认大小:布尔值

开始选择更大的默认高度,这将成为未来版本的默认大小。

  • 必需:否
  • 违约: