@wordpress/block-library/build-module/footnotes/edit.js

Block library for the WordPress editor.

// packages/block-library/src/footnotes/edit.js
import { BlockIcon, RichText, useBlockProps } from "@wordpress/block-editor";
import { useEntityProp } from "@wordpress/core-data";
import { __ } from "@wordpress/i18n";
import { Placeholder } from "@wordpress/components";
import { formatListNumbered as icon } from "@wordpress/icons";
import { jsx, jsxs } from "react/jsx-runtime";
function FootnotesEdit({ context: { postType, postId } }) {
  const [meta, updateMeta] = useEntityProp(
    "postType",
    postType,
    "meta",
    postId
  );
  const footnotesSupported = "string" === typeof meta?.footnotes;
  const footnotes = meta?.footnotes ? JSON.parse(meta.footnotes) : [];
  const blockProps = useBlockProps();
  if (!footnotesSupported) {
    return /* @__PURE__ */ jsx("div", { ...blockProps, children: /* @__PURE__ */ jsx(
      Placeholder,
      {
        icon: /* @__PURE__ */ jsx(BlockIcon, { icon }),
        label: __("Footnotes"),
        instructions: __(
          "Footnotes are not supported here. Add this block to post or page content."
        )
      }
    ) });
  }
  if (!footnotes.length) {
    return /* @__PURE__ */ jsx("div", { ...blockProps, children: /* @__PURE__ */ jsx(
      Placeholder,
      {
        icon: /* @__PURE__ */ jsx(BlockIcon, { icon }),
        label: __("Footnotes"),
        instructions: __(
          "Footnotes found in blocks within this document will be displayed here."
        )
      }
    ) });
  }
  return /* @__PURE__ */ jsx("ol", { ...blockProps, children: footnotes.map(({ id, content }) => (
    /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */
    /* @__PURE__ */ jsxs(
      "li",
      {
        onMouseDown: (event) => {
          if (event.target === event.currentTarget) {
            event.target.firstElementChild.focus();
            event.preventDefault();
          }
        },
        children: [
          /* @__PURE__ */ jsx(
            RichText,
            {
              id,
              tagName: "span",
              value: content,
              identifier: id,
              onFocus: (event) => {
                if (!event.target.textContent.trim()) {
                  event.target.scrollIntoView();
                }
              },
              onChange: (nextFootnote) => {
                updateMeta({
                  ...meta,
                  footnotes: JSON.stringify(
                    footnotes.map((footnote) => {
                      return footnote.id === id ? {
                        content: nextFootnote,
                        id
                      } : footnote;
                    })
                  )
                });
              }
            }
          ),
          " ",
          /* @__PURE__ */ jsx("a", { href: `#${id}-link`, children: "\u21A9\uFE0E" })
        ]
      },
      id
    )
  )) });
}
export {
  FootnotesEdit as default
};
//# sourceMappingURL=edit.js.map