import{r as t,h as s,g as e}from"./p-3ba9c73c.js";import{l as i}from"./p-2b74e80e.js";import{E as h}from"./p-b72d14f0.js";const o=class{constructor(s){t(this,s),this.optionIcon="fas:columns",this.question="",this.required=!1,this.columns=[],this.rows=[],this.labelQuestion="Formulate your question",this.labelRequired="Required",this.labelOCAddButton="Add",this.labelOCRemoveButton="Delete",this.labelOCOther="Other",this.labelOCImage="Image",this.labelRows="Rows",this.labelColumns="Columns",this.placeholderRows="Row",this.placeholderColumns="Column",this._link=i(this,this.handleInput),this._question=this._link("question"),this._required=this._link("required"),this._columns=this._link("columns"),this._rows=this._link("rows")}handleInput(t,s){const e=s.target;e&&(s.cancelBubble=!0,this[t]=e.value,this.value=this.updateValue({[t]:e.value}),this.el.dispatchEvent(new Event("input",{bubbles:!0})))}updateValue(t={}){return Object.assign({},{question:this.question,required:this.required,columns:this.columns,rows:this.rows},t)}componentDidLoad(){this.value=this.updateValue(),this.el.dispatchEvent(new Event("input",{bubbles:!0}))}render(){const t=Object.assign({icon:this.optionIcon,labelOCAddButton:this.labelOCAddButton,labelOCRemoveButton:this.labelOCRemoveButton,labelOCOther:this.labelOCOther,labelOCImage:this.labelOCImage},this._rows),e=Object.assign({icon:this.optionIcon,labelOCAddButton:this.labelOCAddButton,labelOCRemoveButton:this.labelOCRemoveButton,labelOCOther:this.labelOCOther,labelOCImage:this.labelOCImage},this._columns);return s(h,{question:this._question,required:this._required},s("div",null,s("bce-option-creator",Object.assign({},t)),s("bce-option-creator",Object.assign({},e))))}get el(){return e(this)}static get style(){return"bce-element-matrix-template>div{position:relative;display:-ms-flexbox;display:flex;-ms-flex-flow:column nowrap;flex-flow:column nowrap}bce-element-matrix-template>div>bce-option-creator{-ms-flex:1 1 auto;flex:1 1 auto}bce-element-matrix-template>div>bce-option-creator>:last-child{bottom:-27px}bce-element-matrix-template>div>bce-option-creator:first-child>[data-option]>bce-icon{-webkit-transform:rotate(-90deg) translateX(50%);transform:rotate(-90deg) translateX(50%)}\@media screen and (min-width:600px){bce-element-matrix-template>div{-ms-flex-align:start;align-items:flex-start;-ms-flex-flow:row nowrap;flex-flow:row nowrap}}"}};export{o as bce_element_matrix_template};