@wordpress/block-library/build-module/avatar/user-control.js

Block library for the WordPress editor.

import { jsx } from "react/jsx-runtime";
import { __ } from "@wordpress/i18n";
import { ComboboxControl } from "@wordpress/components";
import { useSelect } from "@wordpress/data";
import { store as coreStore } from "@wordpress/core-data";
import { useMemo, useState } from "@wordpress/element";
import { debounce } from "@wordpress/compose";
import { decodeEntities } from "@wordpress/html-entities";
const AUTHORS_QUERY = {
  who: "authors",
  per_page: 100,
  _fields: "id,name",
  context: "view"
};
function UserControl({ value, onChange }) {
  const [filterValue, setFilterValue] = useState("");
  const { authors, isLoading } = useSelect(
    (select) => {
      const { getUsers, isResolving } = select(coreStore);
      const query = { ...AUTHORS_QUERY };
      if (filterValue) {
        query.search = filterValue;
        query.search_columns = ["name"];
      }
      return {
        authors: getUsers(query),
        isLoading: isResolving("getUsers", [query])
      };
    },
    [filterValue]
  );
  const options = useMemo(() => {
    return (authors ?? []).map((author) => {
      return {
        value: author.id,
        label: decodeEntities(author.name)
      };
    });
  }, [authors]);
  return /* @__PURE__ */ jsx(
    ComboboxControl,
    {
      __next40pxDefaultSize: true,
      __nextHasNoMarginBottom: true,
      label: __("User"),
      help: __(
        "Select the avatar user to display, if it is blank it will use the post/page author."
      ),
      value,
      onChange,
      options,
      onFilterValueChange: debounce(setFilterValue, 300),
      isLoading
    }
  );
}
export {
  UserControl as default
};
//# sourceMappingURL=user-control.js.map