components
1 year ago
css
2 years ago
attributes.js
3 years ago
block.js
1 year ago
deprecated.js
3 years ago
edit.js
2 years ago
editor.scss
1 year ago
element-icons.js
2 years ago
markformat.js
4 years ago
save.js
4 years ago
transforms.js
1 year ago
element-icons.js
56 lines
| 1 | /** |
| 2 | * WordPress dependencies |
| 3 | */ |
| 4 | import { |
| 5 | Path, |
| 6 | SVG, |
| 7 | } from '@wordpress/components'; |
| 8 | |
| 9 | /** |
| 10 | * HeadingLevelIcon props. |
| 11 | * |
| 12 | * @typedef WPHeadingLevelIconProps |
| 13 | * @property {number} level The heading level to show an icon for. |
| 14 | * @property {?boolean} isPressed Whether or not the icon should appear pressed; default: false. |
| 15 | */ |
| 16 | |
| 17 | /** |
| 18 | * Heading level icon. |
| 19 | * |
| 20 | * @param {WPHeadingLevelIconProps} props Component props. |
| 21 | * @return {JSX.Element} The heading level icon. |
| 22 | */ |
| 23 | export default function HeadingLevelIcon( { level } ) { |
| 24 | const levelToPath = { |
| 25 | h1: 'M9 5h2v10H9v-4H5v4H3V5h2v4h4V5zm6.6 0c-.6.9-1.5 1.7-2.6 2v1h2v7h2V5h-1.4z', |
| 26 | h2: 'M7 5h2v10H7v-4H3v4H1V5h2v4h4V5zm8 8c.5-.4.6-.6 1.1-1.1.4-.4.8-.8 1.2-1.3.3-.4.6-.8.9-1.3.2-.4.3-.8.3-1.3 0-.4-.1-.9-.3-1.3-.2-.4-.4-.7-.8-1-.3-.3-.7-.5-1.2-.6-.5-.2-1-.2-1.5-.2-.4 0-.7 0-1.1.1-.3.1-.7.2-1 .3-.3.1-.6.3-.9.5-.3.2-.6.4-.8.7l1.2 1.2c.3-.3.6-.5 1-.7.4-.2.7-.3 1.2-.3s.9.1 1.3.4c.3.3.5.7.5 1.1 0 .4-.1.8-.4 1.1-.3.5-.6.9-1 1.2-.4.4-1 .9-1.6 1.4-.6.5-1.4 1.1-2.2 1.6V15h8v-2H15z', |
| 27 | h3: 'M12.1 12.2c.4.3.8.5 1.2.7.4.2.9.3 1.4.3.5 0 1-.1 1.4-.3.3-.1.5-.5.5-.8 0-.2 0-.4-.1-.6-.1-.2-.3-.3-.5-.4-.3-.1-.7-.2-1-.3-.5-.1-1-.1-1.5-.1V9.1c.7.1 1.5-.1 2.2-.4.4-.2.6-.5.6-.9 0-.3-.1-.6-.4-.8-.3-.2-.7-.3-1.1-.3-.4 0-.8.1-1.1.3-.4.2-.7.4-1.1.6l-1.2-1.4c.5-.4 1.1-.7 1.6-.9.5-.2 1.2-.3 1.8-.3.5 0 1 .1 1.6.2.4.1.8.3 1.2.5.3.2.6.5.8.8.2.3.3.7.3 1.1 0 .5-.2.9-.5 1.3-.4.4-.9.7-1.5.9v.1c.6.1 1.2.4 1.6.8.4.4.7.9.7 1.5 0 .4-.1.8-.3 1.2-.2.4-.5.7-.9.9-.4.3-.9.4-1.3.5-.5.1-1 .2-1.6.2-.8 0-1.6-.1-2.3-.4-.6-.2-1.1-.6-1.6-1l1.1-1.4zM7 9H3V5H1v10h2v-4h4v4h2V5H7v4z', |
| 28 | h4: 'M9 15H7v-4H3v4H1V5h2v4h4V5h2v10zm10-2h-1v2h-2v-2h-5v-2l4-6h3v6h1v2zm-3-2V7l-2.8 4H16z', |
| 29 | h5: 'M12.1 12.2c.4.3.7.5 1.1.7.4.2.9.3 1.3.3.5 0 1-.1 1.4-.4.4-.3.6-.7.6-1.1 0-.4-.2-.9-.6-1.1-.4-.3-.9-.4-1.4-.4H14c-.1 0-.3 0-.4.1l-.4.1-.5.2-1-.6.3-5h6.4v1.9h-4.3L14 8.8c.2-.1.5-.1.7-.2.2 0 .5-.1.7-.1.5 0 .9.1 1.4.2.4.1.8.3 1.1.6.3.2.6.6.8.9.2.4.3.9.3 1.4 0 .5-.1 1-.3 1.4-.2.4-.5.8-.9 1.1-.4.3-.8.5-1.3.7-.5.2-1 .3-1.5.3-.8 0-1.6-.1-2.3-.4-.6-.2-1.1-.6-1.6-1-.1-.1 1-1.5 1-1.5zM9 15H7v-4H3v4H1V5h2v4h4V5h2v10z', |
| 30 | h6: 'M9 15H7v-4H3v4H1V5h2v4h4V5h2v10zm8.6-7.5c-.2-.2-.5-.4-.8-.5-.6-.2-1.3-.2-1.9 0-.3.1-.6.3-.8.5l-.6.9c-.2.5-.2.9-.2 1.4.4-.3.8-.6 1.2-.8.4-.2.8-.3 1.3-.3.4 0 .8 0 1.2.2.4.1.7.3 1 .6.3.3.5.6.7.9.2.4.3.8.3 1.3s-.1.9-.3 1.4c-.2.4-.5.7-.8 1-.4.3-.8.5-1.2.6-1 .3-2 .3-3 0-.5-.2-1-.5-1.4-.9-.4-.4-.8-.9-1-1.5-.2-.6-.3-1.3-.3-2.1s.1-1.6.4-2.3c.2-.6.6-1.2 1-1.6.4-.4.9-.7 1.4-.9.6-.3 1.1-.4 1.7-.4.7 0 1.4.1 2 .3.5.2 1 .5 1.4.8 0 .1-1.3 1.4-1.3 1.4zm-2.4 5.8c.2 0 .4 0 .6-.1.2 0 .4-.1.5-.2.1-.1.3-.3.4-.5.1-.2.1-.5.1-.7 0-.4-.1-.8-.4-1.1-.3-.2-.7-.3-1.1-.3-.3 0-.7.1-1 .2-.4.2-.7.4-1 .7 0 .3.1.7.3 1 .1.2.3.4.4.6.2.1.3.3.5.3.2.1.5.2.7.1z', |
| 31 | p: 'M7.411 18V6.005h3.887c1.474 0 2.429.067 2.881.184.687.185 1.257.57 1.726 1.173.452.603.687 1.374.687 2.329 0 .737-.135 1.357-.403 1.86-.268.502-.603.904-1.021 1.189-.403.284-.821.469-1.257.57-.57.117-1.407.167-2.496.167H9.823V18H7.411zm2.412-9.968v3.401h1.324c.955 0 1.591-.05 1.926-.184.319-.118.57-.319.754-.587.185-.268.268-.57.268-.938 0-.435-.117-.787-.385-1.072a1.607 1.607 0 00-.972-.536c-.284-.05-.87-.084-1.742-.084H9.823z', |
| 32 | div: 'M6.969 6.005h4.423c1.005 0 1.759.084 2.295.235.703.2 1.306.57 1.809 1.105.503.52.871 1.173 1.14 1.944.267.754.385 1.708.385 2.83 0 .99-.118 1.844-.369 2.547-.302.871-.72 1.592-1.273 2.128-.419.402-.989.72-1.709.955-.536.167-1.24.251-2.144.251H6.969V6.005zm2.43 2.027v7.94h1.808c.67 0 1.156-.033 1.458-.1.402-.1.72-.268.972-.502.268-.235.485-.62.636-1.156.168-.536.251-1.273.251-2.195 0-.938-.083-1.641-.25-2.144-.152-.486-.386-.888-.688-1.156-.285-.285-.67-.469-1.122-.57-.335-.067-.989-.117-1.977-.117H9.398z', |
| 33 | }; |
| 34 | |
| 35 | if ( ! levelToPath.hasOwnProperty( level ) ) { |
| 36 | return null; |
| 37 | } |
| 38 | |
| 39 | let viewBox = '0 0 20 20'; |
| 40 | |
| 41 | if ( 'p' === level || 'div' === level ) { |
| 42 | viewBox = '0 0 24 24'; |
| 43 | } |
| 44 | |
| 45 | return ( |
| 46 | <SVG |
| 47 | width="24" |
| 48 | height="24" |
| 49 | viewBox={ viewBox } |
| 50 | xmlns="http://www.w3.org/2000/svg" |
| 51 | > |
| 52 | <Path d={ levelToPath[ level ] } /> |
| 53 | </SVG> |
| 54 | ); |
| 55 | } |
| 56 |