// #region Imports
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;
};
var __metadata = (this && this.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
import { Themeable } from '../../../Behaviors/Themeable';
import { addInheritanceConsumerController } from '../../../Controllers/InheritanceConsumerController';
import { Component } from '../../../Decorators/ComponentDecorator';
import { CustomElement } from '../../Abstracts/CustomElement';
import { tableBodyElementTemplate } from './TableBodyElementTemplate';
import { TABLE_INHERITANCE_CONTEXT } from './TableInheritanceContext';
import { tableBodyElementCosmopolitanStyle } from './Themes/TableBodyElement.Cosmopolitan';
import { tableBodyElementJoyStyle } from './Themes/TableBodyElement.Joy';
import { tableBodyElementMemphisStyle } from './Themes/TableBodyElement.Memphis';
// #endregion
/**
 * Table Body - The main content area of a table component, containing rows of data.
 *
 * @element mosaik-table-body
 *
 * @slot  - The default slot.
 *
 * @cssprop {String} --table-body-background-color - The body background color CSS custom property.
 * @cssprop {String} --table-body-border-color - The body border color CSS custom property.
 * @cssprop {String} --table-body-border-radius - The body border radius CSS custom property.
 * @cssprop {String} --table-body-border-style - The body border style CSS custom property.
 * @cssprop {String} --table-body-border-width - The body border width CSS custom property.
 * @cssprop {String} --table-body-font-family - The body font family CSS custom property.
 * @cssprop {String} --table-body-font-letter-spacing - The body font letter spacing CSS custom property.
 * @cssprop {String} --table-body-font-line-height - The body font line height CSS custom property.
 * @cssprop {String} --table-body-font-size - The body font size CSS custom property.
 * @cssprop {String} --table-body-font-text-decoration - The body font text decoration CSS custom property.
 * @cssprop {String} --table-body-font-text-transform - The body font text transform CSS custom property.
 * @cssprop {String} --table-body-font-weight - The body font weight CSS custom property.
 * @cssprop {String} --table-body-foreground-color - The body foreground color CSS custom property.
 * @cssprop {String} --table-body-gap - The body gap CSS custom property.
 * @cssprop {String} --table-body-padding-bottom - The body padding bottom CSS custom property.
 * @cssprop {String} --table-body-padding-left - The body padding left CSS custom property.
 * @cssprop {String} --table-body-padding-right - The body padding right CSS custom property.
 * @cssprop {String} --table-body-padding-top - The body padding top CSS custom property.
 * @cssprop {String} --table-body-shadow - The body shadow CSS custom property.
 * @cssprop {String} --table-body-shadow-blur - The body shadow blur CSS custom property.
 * @cssprop {String} --table-body-shadow-color - The body shadow color CSS custom property.
 * @cssprop {String} --table-body-shadow-offset-x - The body shadow offset x CSS custom property.
 * @cssprop {String} --table-body-shadow-offset-y - The body shadow offset y CSS custom property.
 * @cssprop {String} --table-body-shadow-spread - The body shadow spread CSS custom property.
 * @cssprop {String} --table-body-transition-duration - The body transition duration CSS custom property.
 * @cssprop {String} --table-body-transition-mode - The body transition mode CSS custom property.
 * @cssprop {String} --table-body-transition-property - The body transition property CSS custom property.
 * @cssprop {String} --table-body-translate - The body translate CSS custom property.
 *
 * @example
 * Table body within a table:
 * ```html
 * <mosaik-table>
 *   <mosaik-table-body>
 *     <mosaik-table-row>
 *       <mosaik-table-cell text="Alice"></mosaik-table-cell>
 *       <mosaik-table-cell text="Developer"></mosaik-table-cell>
 *     </mosaik-table-row>
 *     <mosaik-table-row>
 *       <mosaik-table-cell text="Bob"></mosaik-table-cell>
 *       <mosaik-table-cell text="Designer"></mosaik-table-cell>
 *     </mosaik-table-row>
 *   </mosaik-table-body>
 * </mosaik-table>
 * ```
 *
 * @public
 */
let TableBodyElement = class TableBodyElement extends Themeable(CustomElement) {
    // #region Fields
    _inheritance = addInheritanceConsumerController(this, {
        context: TABLE_INHERITANCE_CONTEXT
    });
    // #endregion
    // #region Ctor
    /**
     * @public
     */
    constructor() {
        super();
    }
    // #endregion
    // #region Properties
    /**
     * Returns the `is` property.
     *
     * @public
     * @static
     * @readonly
    */
    static get is() {
        return 'mosaik-table-body';
    }
    // #endregion
    // #region Methods
    /**
     * Reflects inherited alternating flag as a host attribute for CSS styling.
     *
     * Note: The inheritance consumer triggers `requestUpdate('alternating', …)`,
     * but `alternating` is not a declared Lit property on this element.
     * Lit's `requestUpdate` reads `this['alternating']` (undefined) and compares
     * it to the old value, causing a no-op. Therefore we sync the attribute on
     * every update instead of checking `changedProperties`.
     *
     * @protected
     * @override
     */
    updated(changedProperties) {
        super.updated(changedProperties);
        const alternating = this._inheritance.get('alternating', false);
        if (alternating && !this.hasAttribute('alternating')) {
            this.setAttribute('alternating', '');
        }
        else if (!alternating && this.hasAttribute('alternating')) {
            this.removeAttribute('alternating');
        }
    }
};
TableBodyElement = __decorate([
    Component({
        selector: 'mosaik-table-body',
        template: tableBodyElementTemplate,
        themes: {
            joy: tableBodyElementJoyStyle,
            memphis: tableBodyElementMemphisStyle,
            cosmopolitan: tableBodyElementCosmopolitanStyle
        },
        imports: []
    }),
    __metadata("design:paramtypes", [])
], TableBodyElement);
export { TableBodyElement };
//# sourceMappingURL=TableBodyElement.js.map