@wordpress/block-library
Version:
Block library for the WordPress editor.
91 lines (90 loc) • 2.22 kB
JavaScript
// packages/block-library/src/tabs/edit.js
import clsx from "clsx";
import {
useBlockProps,
useInnerBlocksProps,
withColors
} from "@wordpress/block-editor";
import StyleEngine from "./style-engine";
import Controls from "./controls";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
var TABS_TEMPLATE = [["core/tab", {}]];
var DEFAULT_BLOCK = {
name: "core/tab",
attributesToCopy: ["className", "fontFamily", "fontSize"]
};
function Edit({
clientId,
attributes,
setAttributes,
tabInactiveColor,
setTabInactiveColor,
tabHoverColor,
setTabHoverColor,
tabActiveColor,
setTabActiveColor,
tabTextColor,
setTabTextColor,
tabActiveTextColor,
setTabActiveTextColor,
tabHoverTextColor,
setTabHoverTextColor
}) {
const { style, orientation } = attributes;
const blockProps = useBlockProps({
className: clsx(
"vertical" === orientation ? "is-vertical" : "is-horizontal"
),
style: {
...style
}
});
const innerBlockProps = useInnerBlocksProps(blockProps, {
defaultBlock: DEFAULT_BLOCK,
directInsert: true,
__experimentalCaptureToolbars: true,
clientId,
orientation,
template: TABS_TEMPLATE,
renderAppender: false
// Appender is rendered by individual tab blocks.
});
return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { ...innerBlockProps, children: [
innerBlockProps.children,
/* @__PURE__ */ jsx(StyleEngine, { attributes, clientId }),
/* @__PURE__ */ jsx(
Controls,
{
...{
clientId,
attributes,
setAttributes,
tabInactiveColor,
setTabInactiveColor,
tabHoverColor,
setTabHoverColor,
tabActiveColor,
setTabActiveColor,
tabTextColor,
setTabTextColor,
tabActiveTextColor,
setTabActiveTextColor,
tabHoverTextColor,
setTabHoverTextColor
}
}
)
] }) });
}
var edit_default = withColors(
"tabInactiveColor",
"tabHoverColor",
"tabActiveColor",
"tabTextColor",
"tabActiveTextColor",
"tabHoverTextColor"
)(Edit);
export {
edit_default as default
};
//# sourceMappingURL=edit.js.map