// Copyright 2023 The Chromium Authors
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import { assert } from '//resources/js/assert.js';
import { CrLitElement } from '//resources/lit/v3_0/lit.rollup.js';
import { getCss } from './cr_loading_gradient.css.js';
import { getHtml } from './cr_loading_gradient.html.js';
/* Count of cr-loading-gradient elements created. Used to assign unique IDs.
 * Unique IDs are necessary since clipPaths are slotted in from the light DOM,
 * so there can be leakages across multiple <cr-loading-gradient> instances. */
let count = 0;
export class CrLoadingGradientElement extends CrLitElement {
    static get is() {
        return 'cr-loading-gradient';
    }
    static get styles() {
        return getCss();
    }
    render() {
        return getHtml.bind(this)();
    }
    onSlotchange_() {
        const clipPath = this.querySelector('svg clipPath');
        assert(clipPath);
        const generatedId = `crLoadingGradient${count++}`;
        clipPath.id = generatedId;
        this.style.clipPath = `url(#${generatedId})`;
    }
}
customElements.define(CrLoadingGradientElement.is, CrLoadingGradientElement);
