UNPKG

@wordpress/block-library

Version:
95 lines (91 loc) 3.08 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = save; var _clsx = _interopRequireDefault(require("clsx")); var _removeAccents = _interopRequireDefault(require("remove-accents")); var _blockEditor = require("@wordpress/block-editor"); var _dom = require("@wordpress/dom"); var _jsxRuntime = require("react/jsx-runtime"); /** * External dependencies */ /** * WordPress dependencies */ /** * Get the name attribute from a content string. * * @param {string} content The block content. * * @return {string} Returns the slug. */const getNameFromLabel = content => { return (0, _removeAccents.default)((0, _dom.__unstableStripHTML)(content)) // Convert anything that's not a letter or number to a hyphen. .replace(/[^\p{L}\p{N}]+/gu, '-') // Convert to lowercase .toLowerCase() // Remove any remaining leading or trailing hyphens. .replace(/(^-+)|(-+$)/g, ''); }; function save({ attributes }) { const { type, name, label, inlineLabel, required, placeholder, value } = attributes; const borderProps = (0, _blockEditor.__experimentalGetBorderClassesAndStyles)(attributes); const colorProps = (0, _blockEditor.__experimentalGetColorClassesAndStyles)(attributes); const inputStyle = { ...borderProps.style, ...colorProps.style }; const inputClasses = (0, _clsx.default)('wp-block-form-input__input', colorProps.className, borderProps.className); const TagName = type === 'textarea' ? 'textarea' : 'input'; const blockProps = _blockEditor.useBlockProps.save(); // Note: radio inputs aren't implemented yet. const isCheckboxOrRadio = type === 'checkbox' || type === 'radio'; if ('hidden' === type) { return /*#__PURE__*/(0, _jsxRuntime.jsx)("input", { type: type, name: name, value: value }); } return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", { ...blockProps, children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", { className: (0, _clsx.default)('wp-block-form-input__label', { 'is-label-inline': inlineLabel }), children: [!isCheckboxOrRadio && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", { className: "wp-block-form-input__label-content", children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText.Content, { value: label }) }), /*#__PURE__*/(0, _jsxRuntime.jsx)(TagName, { className: inputClasses, type: 'textarea' === type ? undefined : type, name: name || getNameFromLabel(label), required: required, "aria-required": required, placeholder: placeholder || undefined, style: inputStyle }), isCheckboxOrRadio && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", { className: "wp-block-form-input__label-content", children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText.Content, { value: label }) })] }) }); } //# sourceMappingURL=save.js.map