UNPKG

@public-ui/components

Version:

Contains all web components that belong to KoliBri - The accessible HTML-Standard.

4 lines 6.08 kB
/*! * KoliBri - The accessible HTML-Standard */ "use strict";var index=require("./index-C3uXtd6W.js"),tslib_es6=require("./tslib.es6-7DbU_BSw.js"),componentNames=require("./component-names-Bu9hV7OT.js"),i18n=require("./i18n-D4Klw_bZ.js"),events=require("./events-Cd8febUV.js");require("./common-1pTy2kta.js"),require("./i18n-yHKQt1gl.js");const parseColumnWidth=e=>Number.isFinite(e)&&void 0!==e&&e>0?e:void 0,KolTableSettings=class{constructor(e){index.registerInstance(this,e),this.headerCells=[],this.editingHeaderCells=[],this.errorMessage=null,this.translateTableSettings=i18n.translate("kol-table-settings"),this.translateTableSettingsCancel=i18n.translate("kol-table-settings-cancel"),this.translateTableSettingsApply=i18n.translate("kol-table-settings-apply"),this.translateErrorAllInvisible=i18n.translate("kol-table-settings-error-all-invisible"),this.translateColumnNotHidable=i18n.translate("kol-table-settings-column-not-hidable"),this._horizontalHeaderCells=[]}handleHeaderCellsChange(e){this.headerCells=e.map(e=>[...e]),this.editingHeaderCells=e.map(e=>e.map(e=>Object.assign({},e)))}componentWillLoad(){this.handleHeaderCellsChange(this._horizontalHeaderCells)}getPrimaryRow(){var e;return null!==(e=this.editingHeaderCells[this.editingHeaderCells.length-1])&&void 0!==e?e:[]}updatePrimaryRow(e){this.editingHeaderCells=this.editingHeaderCells.map((t,a,l)=>a===l.length-1?e:t)}moveColumn(e,t){const a=[...this.getPrimaryRow()],l=a.findIndex(t=>t.key===e);if(-1===l)return;let s;if("up"===t){if(0===l)return;s=l-1}else{if(l===a.length-1)return;s=l+1}const[i]=a.splice(l,1);a.splice(s,0,i),this.updatePrimaryRow(a)}handleVisibilityChange(e,t){const a=this.getPrimaryRow().map(a=>a.key===e&&!1!==a.hidable?Object.assign(Object.assign({},a),{visible:Boolean(t)}):a);this.updatePrimaryRow(a)}handleWidthChange(e,t){const a=this.getPrimaryRow().map(a=>a.key===e&&!1!==a.resizable?Object.assign(Object.assign({},a),{width:Number(t)}):a);this.updatePrimaryRow(a)}handleCancel(){var e;this.editingHeaderCells=this.headerCells.map(e=>[...e]),this.errorMessage=null,null===(e=this.popoverRef)||void 0===e||e.hidePopover()}handleSubmit(e){var t;e.preventDefault();if(this.getPrimaryRow().some(e=>!1!==e.visible)){if(this.host){this.errorMessage=null,this.headerCells=this.editingHeaderCells.map(e=>e.map(e=>Object.assign({},e)));const e=this.editingHeaderCells.map(e=>e.map(e=>{const t=e,{hidable:a,resizable:l,sortable:s,visible:i,width:n}=t,o=tslib_es6.__rest(t,["hidable","resizable","sortable","visible","width"]),r=Object.assign({},o);return void 0!==i&&(r.visible=i),void 0!==a&&(r.hidable=a),void 0!==s&&(r.sortable=s),void 0!==l&&(r.resizable=l),null!=n&&(r.width=n),r}));events.dispatchDomEvent(this.host,events.KolEvent.changeHeaderCells,e),null===(t=this.popoverRef)||void 0===t||t.hidePopover()}}else this.errorMessage=this.translateErrorAllInvisible}render(){const e=this.getPrimaryRow();return index.h(componentNames.KolPopoverButtonWcTag,{key:"65b350799d5422b6500b3ae983f9c7f3c925f3b0",ref:e=>this.popoverRef=e,class:"kol-table-settings",_icons:"kolicon-settings",_label:this.translateTableSettings,_popoverAlign:"top",_hideLabel:!0},index.h("div",{key:"450200fa5d74f6ceb99c0ea589e12aefbfcdc23d",class:"kol-table-settings__content"},index.h(componentNames.KolHeadingTag,{key:"8bd0456ba046beb7a819c978d32dd8e64c294be0",_label:this.translateTableSettings,_level:0}),this.errorMessage&&index.h(componentNames.KolAlertWcTag,{key:"e0d517d57e57c8e889997e18da3fb3badd0bcebe",_type:"error",_label:this.errorMessage,_variant:"msg",class:"kol-table-settings__error-message"}),index.h("form",{key:"34785b3e839f8fcc59d7930c6d8bc1ca82e8d5a7",onSubmit:this.handleSubmit.bind(this)},index.h("div",{key:"a28b130172a530644430aa4c9f52d6afa913522a",class:"kol-table-settings__columns-container"},index.h("div",{key:"d18e531412556d173f9441c462bd3361f829d205",class:"kol-table-settings__columns"},e.map((t,a)=>index.h("div",{key:t.key,class:"kol-table-settings__column"},index.h(componentNames.KolInputCheckboxTag,{_checked:!1!==t.visible,_label:`${t.label}${!1===t.hidable?` (${this.translateColumnNotHidable})`:""}`,_value:!0,_hideLabel:!0,_disabled:!1===t.hidable,_on:{onInput:(e,a)=>{var l;return this.handleVisibilityChange(null!==(l=t.key)&&void 0!==l?l:"",a)}}}),index.h("span",{class:"kol-table-settings__column-label"},t.label),index.h(componentNames.KolInputNumberTag,{_hideLabel:!0,_value:parseColumnWidth(t.width),_label:i18n.translate("kol-table-settings-column-width",{placeholders:{column:t.label}}),_min:1,_disabled:!1===t.resizable,_on:{onInput:(e,a)=>{var l;return this.handleWidthChange(null!==(l=t.key)&&void 0!==l?l:"",a)}}}),index.h(componentNames.KolButtonWcTag,{_icons:"kolicon-chevron-up",_label:i18n.translate("kol-table-settings-move-up",{placeholders:{column:t.label}}),_hideLabel:!0,_buttonVariant:"ghost",_on:{onClick:()=>{var e;return this.moveColumn(null!==(e=t.key)&&void 0!==e?e:"","up")}},_disabled:!1===t.sortable||0===a,"data-testid":"table-settings-move-up"}),index.h(componentNames.KolButtonWcTag,{_icons:"kolicon-chevron-down",_label:i18n.translate("kol-table-settings-move-down",{placeholders:{column:t.label}}),_hideLabel:!0,_buttonVariant:"ghost",_on:{onClick:()=>{var e;return this.moveColumn(null!==(e=t.key)&&void 0!==e?e:"","down")}},_disabled:!1===t.sortable||a===e.length-1,"data-testid":"table-settings-move-down"}))))),index.h("div",{key:"1fb081b1dfe3a3afdb1a046b5ce7576d292c0da7",class:"kol-table-settings__actions"},index.h(componentNames.KolButtonWcTag,{key:"0b8631652bc292bf61549a64418de4f82947f97d",_label:this.translateTableSettingsCancel,_buttonVariant:"secondary",_on:{onClick:()=>this.handleCancel()},"data-testid":"table-settings-cancel"}),index.h(componentNames.KolButtonWcTag,{key:"0d29c2f7f2a36370552276a9a1ec843d2518ed66",_label:this.translateTableSettingsApply,_buttonVariant:"primary",_type:"submit","data-testid":"table-settings-apply"})))))}get host(){return index.getElement(this)}static get watchers(){return{_horizontalHeaderCells:["handleHeaderCellsChange"]}}};exports.kol_table_settings_wc=KolTableSettings;