import * as i0 from '@angular/core';
import { input, booleanAttribute, inject, ElementRef, Injector, runInInjectionContext, effect, ChangeDetectionStrategy, Component } from '@angular/core';
import '@ui5/webcomponents/dist/TableHeaderCell.js';

class TableHeaderCell {
    constructor() {
        /**
         * Defines the width of the column.
      
      By default, the column will grow and shrink according to the available space.
      This will distribute the space proportionally among all columns with no specific width set.
      
      See [\<length\>](https://developer.mozilla.org/en-US/docs/Web/CSS/length) and
      [\<percentage\>](https://developer.mozilla.org/en-US/docs/Web/CSS/percentage) for possible width values.
         */
        this.width = input(...(ngDevMode ? [undefined, { debugName: "width" }] : []));
        /**
         * Defines the minimum width of the column.
      
      If the table is in `Popin` mode and the minimum width does not fit anymore,
      the column will move into the popin.
      
      By default, the table prevents the column from becoming too small.
      Changing this value to a small value might lead to accessibility issues.
      
      **Note:** This property only takes effect for columns with a [\<percentage\>](https://developer.mozilla.org/en-US/docs/Web/CSS/percentage) value
      or the default width.
         */
        this.minWidth = input(...(ngDevMode ? [undefined, { debugName: "minWidth" }] : []));
        /**
         * Defines the importance of the column.
      
      This property affects the popin behaviour.
      Columns with higher importance will move into the popin area later then less important
      columns.
         */
        this.importance = input(0, ...(ngDevMode ? [{ debugName: "importance" }] : []));
        /**
         * The text for the column when it pops in.
         */
        this.popinText = input(...(ngDevMode ? [undefined, { debugName: "popinText" }] : []));
        /**
         * Defines the sort indicator of the column.
         */
        this.sortIndicator = input("None", ...(ngDevMode ? [{ debugName: "sortIndicator" }] : []));
        /**
         * Defines if the column is hidden in the popin.
      
      **Note:** Please be aware that hiding the column in the popin might lead to accessibility issues as
      users might not be able to access the content of the column on small screens.
         */
        this.popinHidden = input(false, ...(ngDevMode ? [{ debugName: "popinHidden", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
        /**
         * Determines the horizontal alignment of table cells.
         */
        this.horizontalAlign = input(...(ngDevMode ? [undefined, { debugName: "horizontalAlign" }] : [])); // className is now passed
        /**
         * Available slots for content projection in this component.
         *
         * Slots allow you to insert custom content into predefined areas of the web component.
         * Use the `slot` attribute on child elements to target specific slots.
         *
         * - **action**: Defines the action of the column.
      
      **Note:** While multiple actions are technically possible, this is not supported.
         * - **(default)**: Defines the content of the component.
         *
         * @example
         * ```html
         * <ui5-table-header-cell>
         *   <div slot="header">Custom header content</div>
         *   <p>Default slot content</p>
         * </ui5-table-header-cell>
         * ```
         *
         * @readonly
         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
         */
        this.slots = [
            {
                "name": "action",
                "description": "Defines the action of the column.\n\n**Note:** While multiple actions are technically possible, this is not supported.",
                "since": "2.8.0"
            },
            {
                "name": "default",
                "description": "Defines the content of the component."
            }
        ];
        this.elementRef = inject(ElementRef);
        this.injector = inject(Injector);
    }
    get element() {
        return this.elementRef.nativeElement;
    }
    ngAfterViewInit() {
        const wcElement = this.element;
        const inputsToSync = [
            'width',
            'minWidth',
            'importance',
            'popinText',
            'sortIndicator',
            'popinHidden',
            'horizontalAlign',
        ];
        // Synchronize inputs (properties)
        for (const inputName of inputsToSync) {
            // Find the corresponding camelCase signal property on the Angular component
            const signalName = inputName.replace(/-./g, (x) => x[1].toUpperCase());
            // Use the Injector to run the effect in the correct context
            if (this[signalName] && typeof this[signalName] === 'function') {
                runInInjectionContext(this.injector, () => {
                    effect(() => {
                        // Read the signal value
                        const value = this[signalName]();
                        if (wcElement) {
                            // Write the value to the Web Component's property
                            wcElement[inputName] = value;
                        }
                    });
                });
            }
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: TableHeaderCell, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.4", type: TableHeaderCell, isStandalone: true, selector: "ui5-table-header-cell, [ui5-table-header-cell]", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, importance: { classPropertyName: "importance", publicName: "importance", isSignal: true, isRequired: false, transformFunction: null }, popinText: { classPropertyName: "popinText", publicName: "popinText", isSignal: true, isRequired: false, transformFunction: null }, sortIndicator: { classPropertyName: "sortIndicator", publicName: "sortIndicator", isSignal: true, isRequired: false, transformFunction: null }, popinHidden: { classPropertyName: "popinHidden", publicName: "popinHidden", isSignal: true, isRequired: false, transformFunction: null }, horizontalAlign: { classPropertyName: "horizontalAlign", publicName: "horizontalAlign", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["ui5TableHeaderCell"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: TableHeaderCell, decorators: [{
            type: Component,
            args: [{
                    standalone: true,
                    selector: 'ui5-table-header-cell, [ui5-table-header-cell]',
                    template: '<ng-content></ng-content>',
                    exportAs: 'ui5TableHeaderCell',
                    changeDetection: ChangeDetectionStrategy.OnPush,
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { TableHeaderCell };
//# sourceMappingURL=fundamental-ngx-ui5-webcomponents-table-header-cell.mjs.map
