@wordpress/block-editor
Version:
80 lines (78 loc) • 2.55 kB
JavaScript
/**
* External dependencies
*/
import clsx from 'clsx';
/**
* WordPress dependencies
*/
import { CustomSelectControl } from '@wordpress/components';
import deprecated from '@wordpress/deprecated';
import { __ } from '@wordpress/i18n';
/**
* Internal dependencies
*/
import { useSettings } from '../use-settings';
import { jsx as _jsx } from "react/jsx-runtime";
export default function FontFamilyControl({
/** Start opting into the larger default height that will become the default size in a future version. */
__next40pxDefaultSize = false,
/** Start opting into the new margin-free styles that will become the default in a future version. */
__nextHasNoMarginBottom = false,
value = '',
onChange,
fontFamilies,
className,
...props
}) {
var _options$find;
const [blockLevelFontFamilies] = useSettings('typography.fontFamilies');
if (!fontFamilies) {
fontFamilies = blockLevelFontFamilies;
}
if (!fontFamilies || fontFamilies.length === 0) {
return null;
}
const options = [{
key: '',
name: __('Default')
}, ...fontFamilies.map(({
fontFamily,
name
}) => ({
key: fontFamily,
name: name || fontFamily,
style: {
fontFamily
}
}))];
if (!__nextHasNoMarginBottom) {
deprecated('Bottom margin styles for wp.blockEditor.FontFamilyControl', {
since: '6.7',
version: '7.0',
hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version'
});
}
if (!__next40pxDefaultSize && (props.size === undefined || props.size === 'default')) {
deprecated(`36px default size for wp.blockEditor.__experimentalFontFamilyControl`, {
since: '6.8',
version: '7.1',
hint: 'Set the `__next40pxDefaultSize` prop to true to start opting into the new default size, which will become the default in a future version.'
});
}
const selectedValue = (_options$find = options.find(option => option.key === value)) !== null && _options$find !== void 0 ? _options$find : '';
return /*#__PURE__*/_jsx(CustomSelectControl, {
__next40pxDefaultSize: __next40pxDefaultSize,
__shouldNotWarnDeprecated36pxSize: true,
label: __('Font'),
value: selectedValue,
onChange: ({
selectedItem
}) => onChange(selectedItem.key),
options: options,
className: clsx('block-editor-font-family-control', className, {
'is-next-has-no-margin-bottom': __nextHasNoMarginBottom
}),
...props
});
}
//# sourceMappingURL=index.js.map