@codegouvfr/react-dsfr
Version:
French State Design System React integration library
4 lines (3 loc) • 3.82 kB
JavaScript
/*! DSFR v1.13.2 | SPDX-License-Identifier: MIT | License-Filename: LICENSE.md | restricted use (see terms and conditions) */
const e=window.dsfr,t={SCROLLABLE:e.internals.ns.emission("table","scrollable"),CHANGE:e.internals.ns.emission("table","change"),CAPTION_HEIGHT:e.internals.ns.emission("table","captionheight"),CAPTION_WIDTH:e.internals.ns.emission("table","captionwidth")};class s extends e.core.Instance{static get instanceClassName(){return"Table"}init(){this.addAscent(t.CAPTION_HEIGHT,this.setCaptionHeight.bind(this))}setCaptionHeight(e){this.setProperty("--table-offset",e)}}class i extends e.core.Instance{static get instanceClassName(){return"TableWrapper"}init(){this.addAscent(t.CAPTION_HEIGHT,this.setCaptionHeight.bind(this))}setCaptionHeight(e){requestAnimationFrame((()=>this.ascend(t.CAPTION_HEIGHT,0))),this.setProperty("--table-offset",e)}}const n={TABLE:e.internals.ns.selector("table"),TABLE_WRAPPER:[`${e.internals.ns.selector("table")} ${e.internals.ns.selector("table__wrapper")}`],SHADOW:e.internals.ns.selector("table__shadow"),SHADOW_LEFT:e.internals.ns.selector("table__shadow--left"),SHADOW_RIGHT:e.internals.ns.selector("table__shadow--right"),ELEMENT:[`${e.internals.ns.selector("table")}:not(${e.internals.ns.selector("table--no-scroll")}) table`],CAPTION:`${e.internals.ns.selector("table")} table caption`,ROW:`${e.internals.ns.selector("table")} tbody tr`,COL:`${e.internals.ns.selector("table")} thead th`};class l extends e.core.Instance{static get instanceClassName(){return"TableElement"}init(){this.listen("scroll",this.scroll.bind(this)),this.content=this.querySelector("tbody"),this.tableOffsetHeight=0,this.isResizing=!0}get isScrolling(){return this._isScrolling}set isScrolling(e){this._isScrolling!==e&&(this._isScrolling=e,e?(this.addClass(n.SHADOW),this.scroll()):(this.removeClass(n.SHADOW),this.removeClass(n.SHADOW_LEFT),this.removeClass(n.SHADOW_RIGHT)))}scroll(){const e=this.node.scrollLeft<=0,t=this.content.offsetWidth-this.node.offsetWidth-0,s=Math.abs(this.node.scrollLeft)>=t,i="rtl"===document.documentElement.getAttribute("dir"),l=i?n.SHADOW_RIGHT:n.SHADOW_LEFT,a=i?n.SHADOW_LEFT:n.SHADOW_RIGHT;e?this.removeClass(l):this.addClass(l),s?this.removeClass(a):this.addClass(a)}resize(){this.isScrolling=this.content.offsetWidth>this.node.offsetWidth}dispose(){this.isScrolling=!1}}class a extends e.core.Instance{static get instanceClassName(){return"TableCaption"}init(){this.height=0,this.isResizing=!0}resize(){const e=this.getRect().height;this.height!==e&&(this.height=e,this.ascend(t.CAPTION_HEIGHT,`calc(${e}px + 1rem)`))}}const r={CHANGE:e.internals.ns.emission("checkbox","change"),RETRIEVE:e.internals.ns.emission("checkbox","retrieve")};class h extends e.core.Instance{static get instanceClassName(){return"TableRow"}init(){e.checkbox&&(this.addAscent(r.CHANGE,this._handleCheckboxChange.bind(this)),this.descend(r.RETRIEVE))}_handleCheckboxChange(t){"row-select"!==t.name&&"true"!==t.getAttribute(e.internals.ns.attr("row-select"))||(this.isSelected=!0===t.checked)}render(){const e=this.getRect().height+2;this._height!==e&&(this._height=e,this.setProperty("--row-height",`${this._height}px`))}get isSelected(){return this._isSelected}set isSelected(e){this._isSelected!==e&&(this.isRendering=e,this._isSelected=e,this.setAttribute("aria-selected",e))}}e.table={Table:s,TableWrapper:i,TableElement:l,TableCaption:a,TableSelector:n,TableRow:h},e.internals.register(e.table.TableSelector.TABLE,e.table.Table),e.internals.register(e.table.TableSelector.TABLE_WRAPPER,e.table.TableWrapper),e.internals.register(e.table.TableSelector.ELEMENT,e.table.TableElement),e.internals.register(e.table.TableSelector.CAPTION,e.table.TableCaption),e.internals.register(e.table.TableSelector.ROW,e.table.TableRow);
//# sourceMappingURL=table.module.min.js.map