@wordpress/block-library
Version:
Block library for the WordPress editor.
79 lines (78 loc) • 2.58 kB
JavaScript
// packages/block-library/src/navigation/edit/overlay-menu-preview.js
import {
ToggleControl,
__experimentalToggleGroupControl as ToggleGroupControl,
__experimentalToggleGroupControlOption as ToggleGroupControlOption,
__experimentalToolsPanelItem as ToolsPanelItem
} from "@wordpress/components";
import { __ } from "@wordpress/i18n";
import OverlayMenuIcon from "./overlay-menu-icon";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
function OverlayMenuPreview({ setAttributes, hasIcon, icon }) {
return /* @__PURE__ */ jsxs(Fragment, { children: [
/* @__PURE__ */ jsx(
ToolsPanelItem,
{
label: __("Show icon button"),
isShownByDefault: true,
hasValue: () => !hasIcon,
onDeselect: () => setAttributes({ hasIcon: true }),
children: /* @__PURE__ */ jsx(
ToggleControl,
{
__nextHasNoMarginBottom: true,
label: __("Show icon button"),
help: __(
"Configure the visual appearance of the button that toggles the overlay menu."
),
onChange: (value) => setAttributes({ hasIcon: value }),
checked: hasIcon
}
)
}
),
/* @__PURE__ */ jsx(
ToolsPanelItem,
{
label: __("Icon"),
isShownByDefault: true,
hasValue: () => icon !== "handle",
onDeselect: () => setAttributes({ icon: "handle" }),
children: /* @__PURE__ */ jsxs(
ToggleGroupControl,
{
__next40pxDefaultSize: true,
__nextHasNoMarginBottom: true,
className: "wp-block-navigation__overlay-menu-icon-toggle-group",
label: __("Icon"),
value: icon,
onChange: (value) => setAttributes({ icon: value }),
isBlock: true,
children: [
/* @__PURE__ */ jsx(
ToggleGroupControlOption,
{
value: "handle",
"aria-label": __("handle"),
label: /* @__PURE__ */ jsx(OverlayMenuIcon, { icon: "handle" })
}
),
/* @__PURE__ */ jsx(
ToggleGroupControlOption,
{
value: "menu",
"aria-label": __("menu"),
label: /* @__PURE__ */ jsx(OverlayMenuIcon, { icon: "menu" })
}
)
]
}
)
}
)
] });
}
export {
OverlayMenuPreview as default
};
//# sourceMappingURL=overlay-menu-preview.js.map