@wordpress/block-library
Version:
Block library for the WordPress editor.
145 lines (144 loc) • 4.85 kB
JavaScript
// packages/block-library/src/latest-comments/edit.js
import { InspectorControls, useBlockProps } from "@wordpress/block-editor";
import {
Disabled,
RangeControl,
SelectControl,
ToggleControl,
__experimentalToolsPanel as ToolsPanel,
__experimentalToolsPanelItem as ToolsPanelItem
} from "@wordpress/components";
import ServerSideRender from "@wordpress/server-side-render";
import { __ } from "@wordpress/i18n";
import { useToolsPanelDropdownMenuProps } from "../utils/hooks";
import { jsx, jsxs } from "react/jsx-runtime";
var MIN_COMMENTS = 1;
var MAX_COMMENTS = 100;
function LatestComments({ attributes, setAttributes }) {
const { commentsToShow, displayAvatar, displayDate, displayContent } = attributes;
const serverSideAttributes = {
...attributes,
style: {
...attributes?.style,
spacing: void 0
}
};
const dropdownMenuProps = useToolsPanelDropdownMenuProps();
return /* @__PURE__ */ jsxs("div", { ...useBlockProps(), children: [
/* @__PURE__ */ jsx(InspectorControls, { children: /* @__PURE__ */ jsxs(
ToolsPanel,
{
label: __("Settings"),
resetAll: () => {
setAttributes({
commentsToShow: 5,
displayAvatar: true,
displayDate: true,
displayContent: "excerpt"
});
},
dropdownMenuProps,
children: [
/* @__PURE__ */ jsx(
ToolsPanelItem,
{
hasValue: () => !displayAvatar,
label: __("Display avatar"),
onDeselect: () => setAttributes({ displayAvatar: true }),
isShownByDefault: true,
children: /* @__PURE__ */ jsx(
ToggleControl,
{
__nextHasNoMarginBottom: true,
label: __("Display avatar"),
checked: displayAvatar,
onChange: () => setAttributes({
displayAvatar: !displayAvatar
})
}
)
}
),
/* @__PURE__ */ jsx(
ToolsPanelItem,
{
hasValue: () => !displayDate,
label: __("Display date"),
onDeselect: () => setAttributes({ displayDate: true }),
isShownByDefault: true,
children: /* @__PURE__ */ jsx(
ToggleControl,
{
__nextHasNoMarginBottom: true,
label: __("Display date"),
checked: displayDate,
onChange: () => setAttributes({ displayDate: !displayDate })
}
)
}
),
/* @__PURE__ */ jsx(
ToolsPanelItem,
{
hasValue: () => displayContent !== "excerpt",
label: __("Display content"),
onDeselect: () => setAttributes({ displayContent: "excerpt" }),
isShownByDefault: true,
children: /* @__PURE__ */ jsx(
SelectControl,
{
__nextHasNoMarginBottom: true,
__next40pxDefaultSize: true,
label: __("Display content"),
value: displayContent,
options: [
{ label: __("No content"), value: "none" },
{ label: __("Excerpt"), value: "excerpt" },
{ label: __("Full content"), value: "full" }
],
onChange: (value) => setAttributes({
displayContent: value
})
}
)
}
),
/* @__PURE__ */ jsx(
ToolsPanelItem,
{
hasValue: () => commentsToShow !== 5,
label: __("Number of comments"),
onDeselect: () => setAttributes({ commentsToShow: 5 }),
isShownByDefault: true,
children: /* @__PURE__ */ jsx(
RangeControl,
{
__nextHasNoMarginBottom: true,
__next40pxDefaultSize: true,
label: __("Number of comments"),
value: commentsToShow,
onChange: (value) => setAttributes({ commentsToShow: value }),
min: MIN_COMMENTS,
max: MAX_COMMENTS,
required: true
}
)
}
)
]
}
) }),
/* @__PURE__ */ jsx(Disabled, { children: /* @__PURE__ */ jsx(
ServerSideRender,
{
block: "core/latest-comments",
attributes: serverSideAttributes,
urlQueryArgs: { _locale: "site" }
}
) })
] });
}
export {
LatestComments as default
};
//# sourceMappingURL=edit.js.map