/**
 * @license
 * Copyright 2023 Tyler Technologies, Inc. 
 * License: Apache-2.0
 */
import { __decorate } from "tslib";
import { CustomElement, attachShadowTemplate, coerceBoolean, getShadowElement, toggleAttribute, toggleClass } from '@tylertech/forge-core';
import { BaseComponent } from '../core/base/base-component';
import { CARD_CONSTANTS } from './card-constants';
const template = '<template><div class=\"forge-card\" part=\"root\"><slot></slot></div></template>';
const styles = '.forge-card{background-color:#fff;background-color:var(--mdc-theme-surface,#fff);border-radius:4px;border-radius:var(--mdc-shape-medium,4px);-webkit-box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);height:100%;height:var(--forge-card-height,100%);width:100%;width:var(--forge-card-width,100%);padding:16px;padding:var(--forge-card-padding,16px);overflow:hidden;overflow:var(--forge-card-overflow,hidden);-webkit-box-sizing:border-box;box-sizing:border-box}.forge-card--outlined{-webkit-box-shadow:0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12);box-shadow:0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12);border-width:1px;border-style:solid;border-color:#e0e0e0;border-color:#e0e0e0;border-color:var(--forge-theme-border-color,#e0e0e0)}:host{display:block}:host([hidden]){display:none}';
/**
 * The custom element class behind the `<forge-card>` component.
 *
 * @tag forge-card
 */
let CardComponent = class CardComponent extends BaseComponent {
    constructor() {
        super();
        this._outlined = false;
        attachShadowTemplate(this, template, styles);
        this._rootElement = getShadowElement(this, CARD_CONSTANTS.selectors.ROOT);
    }
    static get observedAttributes() {
        return [
            CARD_CONSTANTS.attributes.OUTLINED
        ];
    }
    connectedCallback() {
        this._applyOutlined();
    }
    attributeChangedCallback(name, oldValue, newValue) {
        if (oldValue === newValue) {
            return;
        }
        switch (name) {
            case CARD_CONSTANTS.attributes.OUTLINED:
                this.outlined = coerceBoolean(newValue);
                break;
        }
    }
    _applyOutlined() {
        toggleClass(this._rootElement, this._outlined, CARD_CONSTANTS.classes.OUTLINED);
    }
    /** Gets/sets whether the card is using the outlined style or not. */
    get outlined() {
        return this._outlined;
    }
    set outlined(value) {
        if (this._outlined !== value) {
            this._outlined = !!value;
            toggleAttribute(this, this._outlined, CARD_CONSTANTS.attributes.OUTLINED, String(!!this._outlined));
            this._applyOutlined();
        }
    }
};
CardComponent = __decorate([
    CustomElement({
        name: CARD_CONSTANTS.elementName
    })
], CardComponent);
export { CardComponent };
