@wordpress/block-library
Version:
Block library for the WordPress editor.
159 lines (158 loc) • 4.34 kB
JavaScript
// packages/block-library/src/tabs/deprecated.js
import { useBlockProps, useInnerBlocksProps } from "@wordpress/block-editor";
import { createBlock } from "@wordpress/blocks";
import { jsx, jsxs } from "react/jsx-runtime";
var v1Attributes = {
tabsId: {
type: "string",
default: ""
},
orientation: {
type: "string",
default: "horizontal",
enum: ["horizontal", "vertical"]
},
activeTabIndex: {
type: "number",
default: 0
},
tabInactiveColor: {
type: "string"
},
customTabInactiveColor: {
type: "string"
},
tabHoverColor: {
type: "string"
},
customTabHoverColor: {
type: "string"
},
tabActiveColor: {
type: "string"
},
customTabActiveColor: {
type: "string"
},
tabTextColor: {
type: "string"
},
customTabTextColor: {
type: "string"
},
tabActiveTextColor: {
type: "string"
},
customTabActiveTextColor: {
type: "string"
},
tabHoverTextColor: {
type: "string"
},
customTabHoverTextColor: {
type: "string"
}
};
function v1Save({ attributes }) {
const blockProps = useBlockProps.save();
const innerBlocksProps = useInnerBlocksProps.save({});
const title = attributes?.metadata?.name || "Tab Contents";
return /* @__PURE__ */ jsxs("div", { ...blockProps, children: [
/* @__PURE__ */ jsx("h3", { className: "tabs__title", children: title }),
/* @__PURE__ */ jsx("ul", { className: "tabs__list" }),
innerBlocksProps.children
] });
}
function v1Migrate(attributes, innerBlocks) {
const tabsMenuAttributes = {
// Map inactive colors to core background/text supports
backgroundColor: attributes.tabInactiveColor,
textColor: attributes.tabTextColor,
// Map custom inactive colors
style: {
color: {
background: attributes.customTabInactiveColor,
text: attributes.customTabTextColor
}
},
// Active colors
activeBackgroundColor: attributes.tabActiveColor,
customActiveBackgroundColor: attributes.customTabActiveColor,
activeTextColor: attributes.tabActiveTextColor,
customActiveTextColor: attributes.customTabActiveTextColor,
// Hover colors
hoverBackgroundColor: attributes.tabHoverColor,
customHoverBackgroundColor: attributes.customTabHoverColor,
hoverTextColor: attributes.tabHoverTextColor,
customHoverTextColor: attributes.customTabHoverTextColor
};
if (tabsMenuAttributes.style?.color) {
if (!tabsMenuAttributes.style.color.background) {
delete tabsMenuAttributes.style.color.background;
}
if (!tabsMenuAttributes.style.color.text) {
delete tabsMenuAttributes.style.color.text;
}
if (Object.keys(tabsMenuAttributes.style.color).length === 0) {
delete tabsMenuAttributes.style.color;
}
if (Object.keys(tabsMenuAttributes.style).length === 0) {
delete tabsMenuAttributes.style;
}
}
Object.keys(tabsMenuAttributes).forEach((key) => {
if (tabsMenuAttributes[key] === void 0) {
delete tabsMenuAttributes[key];
}
});
const tabsMenuBlock = createBlock("core/tabs-menu", tabsMenuAttributes);
const tabPanelsBlock = createBlock("core/tab-panels", {}, innerBlocks);
const newAttributes = {
tabsId: attributes.tabsId,
orientation: attributes.orientation,
activeTabIndex: attributes.activeTabIndex,
metadata: attributes.metadata
};
return [newAttributes, [tabsMenuBlock, tabPanelsBlock]];
}
function v1IsEligible(attributes, innerBlocks) {
return innerBlocks.some((block) => block.name === "core/tab");
}
var deprecated = [
{
attributes: v1Attributes,
supports: {
align: true,
color: {
text: false,
background: false
},
html: false,
interactivity: true,
spacing: {
blockGap: ["horizontal", "vertical"],
margin: true,
padding: false
},
typography: {
fontSize: true,
__experimentalFontFamily: true
},
__experimentalBorder: {
radius: true,
__experimentalSkipSerialization: true,
__experimentalDefaultControls: {
radius: true
}
}
},
isEligible: v1IsEligible,
migrate: v1Migrate,
save: v1Save
}
];
var deprecated_default = deprecated;
export {
deprecated_default as default
};
//# sourceMappingURL=deprecated.mjs.map