| 1 | {"version":3,"sources":["@wordpress/block-library/src/spacer/index.js"],"names":["classnames","Fragment","useState","__","InspectorControls","BaseControl","PanelBody","ResizableBox","G","SVG","Path","withInstanceId","name","settings","title","description","icon","category","attributes","height","type","default","edit","isSelected","setAttributes","toggleSelection","instanceId","id","inputHeightValue","setInputHeightValue","top","right","bottom","left","topRight","bottomRight","bottomLeft","topLeft","event","direction","elt","delta","spacerHeight","parseInt","target","value","isNaN","save"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Fragment, useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { InspectorControls } from '@wordpress/block-editor';\nimport { BaseControl, PanelBody, ResizableBox, G, SVG, Path } from '@wordpress/components';\nimport { withInstanceId } from '@wordpress/compose';\n\nexport const name = 'core/spacer';\n\nexport const settings = {\n\ttitle: __( 'Spacer' ),\n\n\tdescription: __( 'Add white space between blocks and customize its height.' ),\n\n\ticon: <SVG viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><G><Path d=\"M13 4v2h3.59L6 16.59V13H4v7h7v-2H7.41L18 7.41V11h2V4h-7\" /></G></SVG>,\n\n\tcategory: 'layout',\n\n\tattributes: {\n\t\theight: {\n\t\t\ttype: 'number',\n\t\t\tdefault: 100,\n\t\t},\n\t},\n\n\tedit: withInstanceId(\n\t\t( { attributes, isSelected, setAttributes, toggleSelection, instanceId } ) => {\n\t\t\tconst { height } = attributes;\n\t\t\tconst id = `block-spacer-height-input-${ instanceId }`;\n\t\t\tconst [ inputHeightValue, setInputHeightValue ] = useState( height );\n\n\t\t\treturn (\n\t\t\t\t<Fragment>\n\t\t\t\t\t<ResizableBox\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'block-library-spacer__resize-container',\n\t\t\t\t\t\t\t{ 'is-selected': isSelected }\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tsize={ {\n\t\t\t\t\t\t\theight,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tminHeight=\"20\"\n\t\t\t\t\t\tenable={ {\n\t\t\t\t\t\t\ttop: false,\n\t\t\t\t\t\t\tright: false,\n\t\t\t\t\t\t\tbottom: true,\n\t\t\t\t\t\t\tleft: false,\n\t\t\t\t\t\t\ttopRight: false,\n\t\t\t\t\t\t\tbottomRight: false,\n\t\t\t\t\t\t\tbottomLeft: false,\n\t\t\t\t\t\t\ttopLeft: false,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonResizeStop={ ( event, direction, elt, delta ) => {\n\t\t\t\t\t\t\tconst spacerHeight = parseInt( height + delta.height, 10 );\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\theight: spacerHeight,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tsetInputHeightValue( spacerHeight );\n\t\t\t\t\t\t\ttoggleSelection( true );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonResizeStart={ () => {\n\t\t\t\t\t\t\ttoggleSelection( false );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t<InspectorControls>\n\t\t\t\t\t\t<PanelBody title={ __( 'Spacer Settings' ) }>\n\t\t\t\t\t\t\t<BaseControl label={ __( 'Height in pixels' ) } id={ id }>\n\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\t\t\tonChange={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\tlet spacerHeight = parseInt( event.target.value, 10 );\n\t\t\t\t\t\t\t\t\t\tsetInputHeightValue( spacerHeight );\n\t\t\t\t\t\t\t\t\t\tif ( isNaN( spacerHeight ) ) {\n\t\t\t\t\t\t\t\t\t\t\t// Set spacer height to default size and input box to empty string\n\t\t\t\t\t\t\t\t\t\t\tsetInputHeightValue( '' );\n\t\t\t\t\t\t\t\t\t\t\tspacerHeight = 100;\n\t\t\t\t\t\t\t\t\t\t} else if ( spacerHeight < 20 ) {\n\t\t\t\t\t\t\t\t\t\t\t// Set spacer height to minimum size\n\t\t\t\t\t\t\t\t\t\t\tspacerHeight = 20;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\t\theight: spacerHeight,\n\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tvalue={ inputHeightValue }\n\t\t\t\t\t\t\t\t\tmin=\"20\"\n\t\t\t\t\t\t\t\t\tstep=\"10\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</BaseControl>\n\t\t\t\t\t\t</PanelBody>\n\t\t\t\t\t</InspectorControls>\n\t\t\t\t</Fragment>\n\t\t\t);\n\t\t}\n\t),\n\n\tsave( { attributes } ) {\n\t\treturn <div style={ { height: attributes.height } } aria-hidden />;\n\t},\n};\n"]} |