const { ccclass, property, executeInEditMode, requireComponent } = cc._decorator;

/** Editable rounded panels; geometry follows the prefab node size, with no generated child nodes. */
@ccclass
@executeInEditMode
@requireComponent(cc.Graphics)
export default class CloudRiseSurface extends cc.Component {
    @property radius = 25;
    @property borderWidth = 0;
    @property fillOpacity = 255;
    @property(cc.Color) borderColor = cc.color(182, 132, 245);
    private previous = "";
    onEnable(): void { this.previous = ""; this.update(); }
    update(): void {
        const key = [this.node.width, this.node.height, this.node.color.toHEX(), this.radius, this.borderWidth, this.fillOpacity, this.borderColor.toHEX()].join(":");
        if (key === this.previous) return;
        this.previous = key;
        const g = this.getComponent(cc.Graphics); g.clear();
        const fill = this.node.color; fill.a = this.fillOpacity; g.fillColor = fill;
        g.strokeColor = this.borderColor; g.lineWidth = this.borderWidth;
        g.roundRect(-this.node.width / 2, -this.node.height / 2, this.node.width, this.node.height, this.radius);
        g.fill(); if (this.borderWidth > 0) g.stroke();
    }
}