import {css, html, LitElement, nothing} from "lit";
import {customElement, property} from "lit/decorators.js";
const tagName = "sonic-if"; // For Astro.build
/**
 * Le composant *sonic-if* affiche son contenu dans le slot principal si sa propriété .condition est évaluée à true
 */
@customElement(tagName)
export class SonicIF extends LitElement {
  static styles = css`
    :host {
      display: contents;
    }
  `;

  /**
   * Le contenu s'affiche si la condition est évaluée à true.
   */
  @property({type: Boolean}) condition = false;
  render() {
    if (!this.condition) return nothing;
    return html` <slot></slot> `;
  }
}