var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { MelodicComponent } from '@melodicdev/core';
import { heroSectionTemplate } from './hero-section.template.js';
import { heroSectionStyles } from './hero-section.styles.js';
/**
 * ml-hero-section - Marketing hero/header section
 *
 * @example
 * ```html
 * <ml-hero-section variant="centered" size="lg">
 *   <span slot="eyebrow">New Release</span>
 *   <span slot="title">Build better apps</span>
 *   <span slot="description">A modern framework for the modern web.</span>
 *   <div slot="actions">
 *     <ml-button variant="primary">Get Started</ml-button>
 *   </div>
 * </ml-hero-section>
 * ```
 *
 * @slot eyebrow - Small text/badge above the title
 * @slot title - Main headline (or use `title` property)
 * @slot description - Supporting text (or use `description` property)
 * @slot actions - CTA buttons
 * @slot media - Image, video, or illustration
 * @slot social-proof - Logos, testimonials, stats below CTA
 */
let HeroSectionComponent = class HeroSectionComponent {
    constructor() {
        /** Layout variant */
        this.variant = 'centered';
        /** Size controls padding and font sizes */
        this.size = 'lg';
        /** Background style */
        this.background = 'none';
        /** Headline text (alternative to title slot) */
        this.title = '';
        /** Supporting text (alternative to description slot) */
        this.description = '';
    }
};
HeroSectionComponent = __decorate([
    MelodicComponent({
        selector: 'ml-hero-section',
        template: heroSectionTemplate,
        styles: heroSectionStyles,
        attributes: ['variant', 'size', 'background', 'title', 'description']
    })
], HeroSectionComponent);
export { HeroSectionComponent };
