/**
 * Use this file for JavaScript code that you want to run in the front-end
 * on posts/pages that contain this block.
 *
 * When this file is defined as the value of the `viewScript` property
 * in `block.json` it will be enqueued on the front end of the site.
 *
 * Example:
 *
 * ```js
 * {
 *   "viewScript": "file:./view.js"
 * }
 * ```
 *
 * If you're not making any changes to this file because your project doesn't need any
 * JavaScript running in the front-end, then you should delete this file and remove
 * the `viewScript` property from `block.json`.
 *
 * @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-metadata/#view-script
 */

/* eslint-disable no-console */
document.addEventListener('DOMContentLoaded', function() {
    // Get the element with the id "lcp-header-container"
    var headerContainer = document.getElementById('lcp-header-container');
    
    // Check if the element exists
    if (headerContainer) {
        // Get the height of the header container
        var headerHeight = headerContainer.offsetHeight;

        // Get the current value of the --lcp--header--height custom property
        var currentHeaderHeight = getComputedStyle(document.documentElement).getPropertyValue('--lcp--header--height').trim();

        // Compare if the current value is different from the new headerHeight (in px)
        if (currentHeaderHeight !== headerHeight + 'px') {
            // If they are different, update the --lcp--header--height custom property
            document.documentElement.style.setProperty('--lcp--header--height', headerHeight + 'px');
        }
    }
});