import { __decorate } from "tslib";
import { attr, observable } from '@ni/fast-element';
import { DesignSystem, FoundationElement } from '@ni/fast-foundation';
import { styles } from './styles';
import { template } from './template';
import { FvCardAppearance, FvCardInteractionMode } from './types';
function slotHasAssignedElements(slot) {
    return slot.assignedElements({ flatten: true }).length > 0;
}
/**
 * An opinionated card component for FV layouts with optional media,
 * badges, footer metadata, and action content.
 */
export class FvCard extends FoundationElement {
    constructor() {
        super(...arguments);
        this.title = '';
        this.subtitle = '';
        this.description = '';
        this.appearance = FvCardAppearance.outline;
        this.interactionMode = FvCardInteractionMode.static;
        this.disabled = false;
        this.initials = '';
        /** @internal */
        this.hasIconContent = false;
        /** @internal */
        this.hasBadgesContent = false;
        /** @internal */
        this.hasDefaultContent = false;
        /** @internal */
        this.hasActionsContent = false;
        /** @internal */
        this.hasFooterStartContent = false;
        /** @internal */
        this.hasFooterEndContent = false;
    }
    /** @internal */
    get showInitials() {
        return !this.hasIconContent && this.initialsText.length > 0;
    }
    /** @internal */
    get hasMedia() {
        return this.hasIconContent || this.showInitials;
    }
    /** @internal */
    get initialsText() {
        return this.initials.trim().slice(0, 2).toUpperCase();
    }
    /** @internal */
    get showBody() {
        return this.description.length > 0 || this.hasDefaultContent;
    }
    /** @internal */
    get showFooter() {
        return this.hasFooterStartContent || this.hasFooterEndContent;
    }
    /** @internal */
    get showActions() {
        return this.interactionMode === FvCardInteractionMode.static && this.hasActionsContent;
    }
    /** @internal */
    get isCardInteractive() {
        return this.interactionMode === FvCardInteractionMode.card;
    }
    /** @internal */
    handleIconSlotChange(event) {
        this.hasIconContent = slotHasAssignedElements(event.target);
        return true;
    }
    /** @internal */
    handleBadgesSlotChange(event) {
        this.hasBadgesContent = slotHasAssignedElements(event.target);
        return true;
    }
    /** @internal */
    handleDefaultSlotChange(event) {
        this.hasDefaultContent = slotHasAssignedElements(event.target);
        return true;
    }
    /** @internal */
    handleActionsSlotChange(event) {
        this.hasActionsContent = slotHasAssignedElements(event.target);
        return true;
    }
    /** @internal */
    handleFooterStartSlotChange(event) {
        this.hasFooterStartContent = slotHasAssignedElements(event.target);
        return true;
    }
    /** @internal */
    handleFooterEndSlotChange(event) {
        this.hasFooterEndContent = slotHasAssignedElements(event.target);
        return true;
    }
}
__decorate([
    attr({ attribute: 'card-title' })
], FvCard.prototype, "title", void 0);
__decorate([
    attr
], FvCard.prototype, "subtitle", void 0);
__decorate([
    attr
], FvCard.prototype, "description", void 0);
__decorate([
    attr
], FvCard.prototype, "appearance", void 0);
__decorate([
    attr({ attribute: 'interaction-mode' })
], FvCard.prototype, "interactionMode", void 0);
__decorate([
    attr({ mode: 'boolean' })
], FvCard.prototype, "disabled", void 0);
__decorate([
    attr
], FvCard.prototype, "initials", void 0);
__decorate([
    observable
], FvCard.prototype, "hasIconContent", void 0);
__decorate([
    observable
], FvCard.prototype, "hasBadgesContent", void 0);
__decorate([
    observable
], FvCard.prototype, "hasDefaultContent", void 0);
__decorate([
    observable
], FvCard.prototype, "hasActionsContent", void 0);
__decorate([
    observable
], FvCard.prototype, "hasFooterStartContent", void 0);
__decorate([
    observable
], FvCard.prototype, "hasFooterEndContent", void 0);
const okFvCard = FvCard.compose({
    baseName: 'fv-card',
    template,
    styles
});
DesignSystem.getOrCreate()
    .withPrefix('ok')
    .register(okFvCard());
export const fvCardTag = 'ok-fv-card';
//# sourceMappingURL=index.js.map