# ghostkit/3.7.0/gutenberg/formats/uppercase/index.js

Block Animations, Motion &amp; Scroll Effects – Ghost Kit, version 3.7.0. 46 lines.

- Page: https://pluginprobe.com/plugins/ghostkit/3.7.0/code/gutenberg/formats/uppercase/index.js
- Raw: https://pluginprobe.com/plugins/ghostkit/3.7.0/raw/gutenberg/formats/uppercase/index.js
- Modified: 2024-02-18T18:40:24+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/ghostkit/3.7.0/code/gutenberg/formats/uppercase/index.js#L10-L20`.

```javascript
import {
	RichTextShortcut,
	RichTextToolbarButton,
} from '@wordpress/block-editor';
import { __ } from '@wordpress/i18n';
import { toggleFormat } from '@wordpress/rich-text';

import getIcon from '../../utils/get-icon';

export const name = 'ghostkit/uppercase';

export const settings = {
	title: __('Uppercase', 'ghostkit'),
	tagName: 'span',
	className: 'ghostkit-text-uppercase',
	edit: function BadgeFormat(props) {
		const { value, onChange, isActive } = props;

		function toggleUppercase() {
			onChange(
				toggleFormat(value, {
					type: name,
				})
			);
		}

		return (
			<>
				<RichTextShortcut
					type="access"
					character="u"
					onUse={() => toggleUppercase()}
				/>
				<RichTextToolbarButton
					shortcutCharacter="u"
					shortcutType="access"
					title={__('Uppercase', 'ghostkit')}
					icon={getIcon('icon-text-uppercase')}
					onClick={() => toggleUppercase()}
					isActive={isActive}
				/>
			</>
		);
	},
};

```
