UNPKG

@wordpress/block-library

Version:
8 lines (7 loc) 10.4 kB
{ "version": 3, "sources": ["../../src/form-input/deprecated.js"], "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tRichText,\n\tuseBlockProps,\n\t__experimentalGetBorderClassesAndStyles as getBorderClassesAndStyles,\n\t__experimentalGetColorClassesAndStyles as getColorClassesAndStyles,\n} from '@wordpress/block-editor';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\n\nconst getNameFromLabelV1 = ( content ) => {\n\treturn (\n\t\tremoveAccents( stripHTML( content ) )\n\t\t\t// Convert anything that's not a letter or number to a hyphen.\n\t\t\t.replace( /[^\\p{L}\\p{N}]+/gu, '-' )\n\t\t\t// Convert to lowercase\n\t\t\t.toLowerCase()\n\t\t\t// Remove any remaining leading or trailing hyphens.\n\t\t\t.replace( /(^-+)|(-+$)/g, '' )\n\t);\n};\n\nconst v2 = {\n\tattributes: {\n\t\ttype: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'text',\n\t\t},\n\t\tname: {\n\t\t\ttype: 'string',\n\t\t},\n\t\tlabel: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'Label',\n\t\t\tselector: '.wp-block-form-input__label-content',\n\t\t\tsource: 'html',\n\t\t\trole: 'content',\n\t\t},\n\t\tinlineLabel: {\n\t\t\ttype: 'boolean',\n\t\t\tdefault: false,\n\t\t},\n\t\trequired: {\n\t\t\ttype: 'boolean',\n\t\t\tdefault: false,\n\t\t\tselector: '.wp-block-form-input__input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'required',\n\t\t},\n\t\tplaceholder: {\n\t\t\ttype: 'string',\n\t\t\tselector: '.wp-block-form-input__input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'placeholder',\n\t\t\trole: 'content',\n\t\t},\n\t\tvalue: {\n\t\t\ttype: 'string',\n\t\t\tdefault: '',\n\t\t\tselector: 'input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'value',\n\t\t},\n\t\tvisibilityPermissions: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'all',\n\t\t},\n\t},\n\tsupports: {\n\t\tanchor: true,\n\t\treusable: false,\n\t\tspacing: {\n\t\t\tmargin: [ 'top', 'bottom' ],\n\t\t},\n\t\t__experimentalBorder: {\n\t\t\tradius: true,\n\t\t\t__experimentalSkipSerialization: true,\n\t\t\t__experimentalDefaultControls: {\n\t\t\t\tradius: true,\n\t\t\t},\n\t\t},\n\t},\n\tsave( { attributes } ) {\n\t\tconst { type, name, label, inlineLabel, required, placeholder, value } =\n\t\t\tattributes;\n\n\t\tconst borderProps = getBorderClassesAndStyles( attributes );\n\t\tconst colorProps = getColorClassesAndStyles( attributes );\n\n\t\tconst inputStyle = {\n\t\t\t...borderProps.style,\n\t\t\t...colorProps.style,\n\t\t};\n\n\t\tconst inputClasses = clsx(\n\t\t\t'wp-block-form-input__input',\n\t\t\tcolorProps.className,\n\t\t\tborderProps.className\n\t\t);\n\t\tconst TagName = type === 'textarea' ? 'textarea' : 'input';\n\n\t\tconst blockProps = useBlockProps.save();\n\n\t\tif ( 'hidden' === type ) {\n\t\t\treturn <input type={ type } name={ name } value={ value } />;\n\t\t}\n\n\t\treturn (\n\t\t\t<div { ...blockProps }>\n\t\t\t\t{ /* eslint-disable jsx-a11y/label-has-associated-control */ }\n\t\t\t\t<label\n\t\t\t\t\tclassName={ clsx( 'wp-block-form-input__label', {\n\t\t\t\t\t\t'is-label-inline': inlineLabel,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<span className=\"wp-block-form-input__label-content\">\n\t\t\t\t\t\t<RichText.Content value={ label } />\n\t\t\t\t\t</span>\n\t\t\t\t\t<TagName\n\t\t\t\t\t\tclassName={ inputClasses }\n\t\t\t\t\t\ttype={ 'textarea' === type ? undefined : type }\n\t\t\t\t\t\tname={ name || getNameFromLabelV1( label ) }\n\t\t\t\t\t\trequired={ required }\n\t\t\t\t\t\taria-required={ required }\n\t\t\t\t\t\tplaceholder={ placeholder || undefined }\n\t\t\t\t\t\tstyle={ inputStyle }\n\t\t\t\t\t/>\n\t\t\t\t</label>\n\t\t\t\t{ /* eslint-enable jsx-a11y/label-has-associated-control */ }\n\t\t\t</div>\n\t\t);\n\t},\n};\n\n// Version without wrapper div in saved markup\n// See: https://github.com/WordPress/gutenberg/pull/56507\nconst v1 = {\n\tattributes: {\n\t\ttype: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'text',\n\t\t},\n\t\tname: {\n\t\t\ttype: 'string',\n\t\t},\n\t\tlabel: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'Label',\n\t\t\tselector: '.wp-block-form-input__label-content',\n\t\t\tsource: 'html',\n\t\t\trole: 'content',\n\t\t},\n\t\tinlineLabel: {\n\t\t\ttype: 'boolean',\n\t\t\tdefault: false,\n\t\t},\n\t\trequired: {\n\t\t\ttype: 'boolean',\n\t\t\tdefault: false,\n\t\t\tselector: '.wp-block-form-input__input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'required',\n\t\t},\n\t\tplaceholder: {\n\t\t\ttype: 'string',\n\t\t\tselector: '.wp-block-form-input__input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'placeholder',\n\t\t\trole: 'content',\n\t\t},\n\t\tvalue: {\n\t\t\ttype: 'string',\n\t\t\tdefault: '',\n\t\t\tselector: 'input',\n\t\t\tsource: 'attribute',\n\t\t\tattribute: 'value',\n\t\t},\n\t\tvisibilityPermissions: {\n\t\t\ttype: 'string',\n\t\t\tdefault: 'all',\n\t\t},\n\t},\n\tsupports: {\n\t\tclassName: false,\n\t\tanchor: true,\n\t\treusable: false,\n\t\tspacing: {\n\t\t\tmargin: [ 'top', 'bottom' ],\n\t\t},\n\t\t__experimentalBorder: {\n\t\t\tradius: true,\n\t\t\t__experimentalSkipSerialization: true,\n\t\t\t__experimentalDefaultControls: {\n\t\t\t\tradius: true,\n\t\t\t},\n\t\t},\n\t},\n\tsave( { attributes } ) {\n\t\tconst { type, name, label, inlineLabel, required, placeholder, value } =\n\t\t\tattributes;\n\n\t\tconst borderProps = getBorderClassesAndStyles( attributes );\n\t\tconst colorProps = getColorClassesAndStyles( attributes );\n\n\t\tconst inputStyle = {\n\t\t\t...borderProps.style,\n\t\t\t...colorProps.style,\n\t\t};\n\n\t\tconst inputClasses = clsx(\n\t\t\t'wp-block-form-input__input',\n\t\t\tcolorProps.className,\n\t\t\tborderProps.className\n\t\t);\n\t\tconst TagName = type === 'textarea' ? 'textarea' : 'input';\n\n\t\tif ( 'hidden' === type ) {\n\t\t\treturn <input type={ type } name={ name } value={ value } />;\n\t\t}\n\n\t\t/* eslint-disable jsx-a11y/label-has-associated-control */\n\t\treturn (\n\t\t\t<label\n\t\t\t\tclassName={ clsx( 'wp-block-form-input__label', {\n\t\t\t\t\t'is-label-inline': inlineLabel,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t<span className=\"wp-block-form-input__label-content\">\n\t\t\t\t\t<RichText.Content value={ label } />\n\t\t\t\t</span>\n\t\t\t\t<TagName\n\t\t\t\t\tclassName={ inputClasses }\n\t\t\t\t\ttype={ 'textarea' === type ? undefined : type }\n\t\t\t\t\tname={ name || getNameFromLabelV1( label ) }\n\t\t\t\t\trequired={ required }\n\t\t\t\t\taria-required={ required }\n\t\t\t\t\tplaceholder={ placeholder || undefined }\n\t\t\t\t\tstyle={ inputStyle }\n\t\t\t\t/>\n\t\t\t</label>\n\t\t);\n\t\t/* eslint-enable jsx-a11y/label-has-associated-control */\n\t},\n};\n\nconst deprecated = [ v2, v1 ];\n\nexport default deprecated;\n"], "mappings": "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", "names": [] }