import { r as registerInstance, c as createEvent, h } from './index-Co4V4Zk-.js';

const spwTableHeaderCss = () => `html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:var(--spw-ds-font-main)}body{margin:0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:contents}:host(.--is-sticky) .spw-table-header{position:sticky;top:0;z-index:50}.spw-table-header{border:1px solid var(--spw-color-themes-grey-grey-300);color:var(--spw-color-themes-grey-grey-800);font-size:14px;text-align:left;font-weight:700;transition:all 0.2s linear;background:var(--spw-color-themes-grey-grey-200);white-space:nowrap;border-top:none !important;border-bottom:none !important;box-shadow:inset 0 1px 0 var(--spw-color-themes-grey-grey-300), inset 0 -1px 0 var(--spw-color-themes-grey-grey-300);background-clip:padding-box}.spw-table-header--text-align-left{text-align:left}.spw-table-header--text-align-center{text-align:center}.spw-table-header--text-align-right{text-align:right}.spw-table-header--vertical-align-top{vertical-align:top}.spw-table-header--vertical-align-bottom{vertical-align:bottom}.spw-table-header--vertical-align-middle{vertical-align:middle}.spw-table-header--sortable{user-select:none;cursor:pointer}.spw-table-header--sortable:hover{background:var(--spw-color-themes-grey-grey-300)}.spw-table-header__content{display:flex;justify-content:space-between;align-items:center;gap:8px}.spw-table-header__content spw-icon{color:var(--spw-color-themes-grey-grey-500)}.spw-table-header__content spw-icon:hover{color:var(--spw-color-themes-grey-grey-900)}.spw-table-header__content--is-sorted .spw-table-header__sort-icon{color:var(--spw-color-themes-grey-grey-900)}.spw-table-header__sort-icons{display:flex;gap:0}.spw-table-header--padding-small{padding:8px}.spw-table-header--padding-medium{padding:16px}.spw-table-header__icons{display:flex;gap:8px;align-items:center;color:var(--spw-color-themes-grey-grey-500)}.spw-table-header ::slotted(spw-checkbox){--spw-ds-checkbox-checked-color:#000}.spw-table-header--sticky{position:sticky;background-color:var(--spw-color-themes-grey-grey-200)}.spw-table-header--sticky::after{content:"";position:absolute;top:0;bottom:-1px;width:8px;pointer-events:none;transition:opacity 0.2s}.spw-table-header--sticky-start::after{right:-8px;box-shadow:inset 8px 0 8px -8px rgba(0, 0, 0, 0.15)}.spw-table-header--sticky-end::after{left:-8px;box-shadow:inset -8px 0 8px -8px rgba(0, 0, 0, 0.15)}@media (max-width: 767px){:host{display:none}}`;

const SpwTableHeader = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.spwHeaderClick = createEvent(this, "spwHeaderClick", 7);
        /** Définit un style visuel qui met en avant la cellule (à appliquer sur spw-table-cell ou spw-table-header) */
        this.isHighlighted = false;
        /** Définit un alignement de texte pour la cellule (à appliquer sur spw-table-cell ou spw-table-header) */
        this.textAlign = 'left';
        /** Définit un alignement vertical pour la cellule (à appliquer sur spw-table-cell ou spw-table-header) */
        this.verticalAlign = 'top';
        /** Définit le padding pour la cellule (à appliquer sur spw-table-cell ou spw-table-header) */
        this.padding = 'medium';
        /** Définit si la colonne est triable (à appliquer sur spw-table-header) */
        this.sortable = false;
        /** Définit si la colonne est triée ou non (à appliquer sur spw-table-header) */
        this.isSorted = false;
        /** Rend la cellule sticky lors du défilement horizontal  (à appliquer sur spw-table-header ou spw-table-cell) */
        this.sticky = false;
        /** Position du sticky : 'start' (left: 0) ou 'end' (right: 0)  (à appliquer sur spw-table-header ou spw-table-cell) */
        this.stickyPosition = 'start';
        /** Décalage en pixels pour le sticky (utile pour empiler plusieurs colonnes sticky)  (à appliquer sur spw-table-header ou spw-table-cell) */
        this.stickyOffset = 0;
        this.handleClick = (event) => {
            if (event.target.closest('[slot="filters"]')) {
                event.stopPropagation();
                return;
            }
            if (this.sortable) {
                this.spwHeaderClick.emit(this.columnId);
            }
        };
    }
    get elementClass() {
        return {
            'spw-table-header': true,
            'spw-table-header--sortable': this.sortable,
            'spw-table-header--is-sorted': this.isSorted,
            'spw-table-header--has-tooltip': !!(this.tooltipTitle || this.tooltipText),
            [`spw-table-header--padding-${this.padding}`]: true,
            [`spw-table-header--text-align-${this.textAlign}`]: true,
            [`spw-table-header--vertical-align-${this.verticalAlign}`]: true,
            'spw-table-header--sticky': this.sticky,
            [`spw-table-header--sticky-${this.stickyPosition}`]: this.sticky,
        };
    }
    render() {
        const attrs = {
            'aria-sort': this.isSorted ? this.sortDirection : 'none',
            'onClick': this.handleClick,
            'class': this.elementClass,
            'colSpan': this.colspan,
            'headers': this.headers,
            'part': 'cell',
            'rowSpan': this.rowspan,
        };
        if (this.sticky) {
            const stickyStyles = {
                position: 'sticky',
                zIndex: '60',
            };
            if (this.stickyPosition === 'start') {
                stickyStyles.left = `${this.stickyOffset}px`;
            }
            else {
                stickyStyles.right = `${this.stickyOffset}px`;
            }
            attrs.style = stickyStyles;
        }
        return (h("th", Object.assign({ key: 'f9d040dd58d8739e60d70bb53a477d3f0da25c72' }, attrs), h("div", { key: 'b1e0ab131f026740b669cd37e493d79d8ef46ad1', class: {
                'spw-table-header__content': true,
                'spw-table-header__content--is-sorted': this.isSorted,
            } }, h("slot", { key: 'eec3daf6a29e815971d4e82265e54bd2f966fbcb' }), h("div", { key: '0b3ee697ce5ab7d29aded245f3b879561e237bc6', class: "spw-table-header__icons" }, h("slot", { key: 'c5ac4935be906a8b6f52d2bf48d153e4ce91c2ad', name: "filters" }), (this.tooltipTitle || this.tooltipText) && (h("spw-tooltip", { key: '27ec14c3d6853005a17e42a32e593cb4a19c978e', "tooltip-title": this.tooltipTitle, "tooltip-text": this.tooltipText }, h("spw-icon", { key: '6998539763d4144d4e0275089f73ae734a2f04c3', variant: "fa-regular", icon: "fa-circle-question" }))), this.sortable && (h("spw-icon", { key: '31169ff6d560ca8ef0329b07ed9330d021c497be', class: "spw-table-header__sort-icon", icon: this.isSorted ? (this.sortDirection === 'asc' ? 'fa-arrow-up-short-wide' : 'fa-arrow-down-wide-short') : 'fa-arrow-up-arrow-down' }))))));
    }
};
SpwTableHeader.style = spwTableHeaderCss();

export { SpwTableHeader as spw_table_header };
