@wordpress/block-library/build-module/home-link/edit.js

Block library for the WordPress editor.

import { createElement, Fragment } from "@wordpress/element";

/**
 * External dependencies
 */
import classnames from 'classnames';
/**
 * WordPress dependencies
 */

import { RichText, useBlockProps, store as blockEditorStore } from '@wordpress/block-editor';
import { __ } from '@wordpress/i18n';
import { useSelect, useDispatch } from '@wordpress/data';
import { store as coreStore } from '@wordpress/core-data';
import { useEffect } from '@wordpress/element';

const preventDefault = event => event.preventDefault();

export default function HomeEdit(_ref) {
  var _style$color, _style$color2, _style$color3, _style$color4;

  let {
    attributes,
    setAttributes,
    context
  } = _ref;
  const {
    homeUrl
  } = useSelect(select => {
    var _getUnstableBase;

    const {
      getUnstableBase // Site index.

    } = select(coreStore);
    return {
      homeUrl: (_getUnstableBase = getUnstableBase()) === null || _getUnstableBase === void 0 ? void 0 : _getUnstableBase.home
    };
  }, []);
  const {
    __unstableMarkNextChangeAsNotPersistent
  } = useDispatch(blockEditorStore);
  const {
    textColor,
    backgroundColor,
    style
  } = context;
  const blockProps = useBlockProps({
    className: classnames('wp-block-navigation-item', {
      'has-text-color': !!textColor || !!(style !== null && style !== void 0 && (_style$color = style.color) !== null && _style$color !== void 0 && _style$color.text),
      [`has-${textColor}-color`]: !!textColor,
      'has-background': !!backgroundColor || !!(style !== null && style !== void 0 && (_style$color2 = style.color) !== null && _style$color2 !== void 0 && _style$color2.background),
      [`has-${backgroundColor}-background-color`]: !!backgroundColor
    }),
    style: {
      color: style === null || style === void 0 ? void 0 : (_style$color3 = style.color) === null || _style$color3 === void 0 ? void 0 : _style$color3.text,
      backgroundColor: style === null || style === void 0 ? void 0 : (_style$color4 = style.color) === null || _style$color4 === void 0 ? void 0 : _style$color4.background
    }
  });
  const {
    label
  } = attributes;
  useEffect(() => {
    if (label === undefined) {
      __unstableMarkNextChangeAsNotPersistent();

      setAttributes({
        label: __('Home')
      });
    }
  }, [label]);
  return createElement(Fragment, null, createElement("div", blockProps, createElement("a", {
    className: "wp-block-home-link__content wp-block-navigation-item__content",
    href: homeUrl,
    onClick: preventDefault
  }, createElement(RichText, {
    identifier: "label",
    className: "wp-block-home-link__label",
    value: label,
    onChange: labelValue => {
      setAttributes({
        label: labelValue
      });
    },
    "aria-label": __('Home link text'),
    placeholder: __('Add home link'),
    withoutInteractiveFormatting: true,
    allowedFormats: ['core/bold', 'core/italic', 'core/image', 'core/strikethrough']
  }))));
}
//# sourceMappingURL=edit.js.map