UNPKG

@wordpress/block-library

Version:
86 lines (85 loc) 3.05 kB
/** * External dependencies */ import clsx from 'clsx'; function getComputedStyle(node) { return node.ownerDocument.defaultView.getComputedStyle(node); } export function detectColors(colorsDetectionElement, setColor, setBackground) { if (!colorsDetectionElement) { return; } setColor(getComputedStyle(colorsDetectionElement).color); let backgroundColorNode = colorsDetectionElement; let backgroundColor = getComputedStyle(backgroundColorNode).backgroundColor; while (backgroundColor === 'rgba(0, 0, 0, 0)' && backgroundColorNode.parentNode && backgroundColorNode.parentNode.nodeType === backgroundColorNode.parentNode.ELEMENT_NODE) { backgroundColorNode = backgroundColorNode.parentNode; backgroundColor = getComputedStyle(backgroundColorNode).backgroundColor; } setBackground(backgroundColor); } /** * Determine the colors for a menu. * * Order of priority is: * 1: Overlay custom colors (if submenu) * 2: Overlay theme colors (if submenu) * 3: Custom colors * 4: Theme colors * 5: Global styles * * @param {Object} context * @param {boolean} isSubMenu */ export function getColors(context, isSubMenu) { const { textColor, customTextColor, backgroundColor, customBackgroundColor, overlayTextColor, customOverlayTextColor, overlayBackgroundColor, customOverlayBackgroundColor, style } = context; const colors = {}; if (isSubMenu && !!customOverlayTextColor) { colors.customTextColor = customOverlayTextColor; } else if (isSubMenu && !!overlayTextColor) { colors.textColor = overlayTextColor; } else if (!!customTextColor) { colors.customTextColor = customTextColor; } else if (!!textColor) { colors.textColor = textColor; } else if (!!style?.color?.text) { colors.customTextColor = style.color.text; } if (isSubMenu && !!customOverlayBackgroundColor) { colors.customBackgroundColor = customOverlayBackgroundColor; } else if (isSubMenu && !!overlayBackgroundColor) { colors.backgroundColor = overlayBackgroundColor; } else if (!!customBackgroundColor) { colors.customBackgroundColor = customBackgroundColor; } else if (!!backgroundColor) { colors.backgroundColor = backgroundColor; } else if (!!style?.color?.background) { colors.customTextColor = style.color.background; } return colors; } export function getNavigationChildBlockProps(innerBlocksColors) { return { className: clsx('wp-block-navigation__submenu-container', { 'has-text-color': !!(innerBlocksColors.textColor || innerBlocksColors.customTextColor), [`has-${innerBlocksColors.textColor}-color`]: !!innerBlocksColors.textColor, 'has-background': !!(innerBlocksColors.backgroundColor || innerBlocksColors.customBackgroundColor), [`has-${innerBlocksColors.backgroundColor}-background-color`]: !!innerBlocksColors.backgroundColor }), style: { color: innerBlocksColors.customTextColor, backgroundColor: innerBlocksColors.customBackgroundColor } }; } //# sourceMappingURL=utils.js.map