@sme.up/ketchup 8.0.2 → 8.1.0

package/dist/ketchup/{p-a84f1d24.entry.js → p-785e8d74.entry.js}

@@ -1 +1 @@
-import{r as t,c as i,f as s,h as e,H as o,g as h}from"./p-9dcfbb1e.js";import{k as n,g as r,s as a,c as d}from"./p-36dac88e.js";var c;!function(t){t.buttonData="Props of the button (when isButton is set to true).",t.isButton="The component will be rendered as a button, which opens the link associated to the iframe in another tab when clicked.",t.src="The address the iframe should be referencing to."}(c||(c={}));const p=class{constructor(s){t(this,s),this.kupIframeError=i(this,"kup-iframe-error",6),this.kupIframeLoad=i(this,"kup-iframe-load",6),this.kupManager=n(),this.buttonData={},this.isButton=!1,this.src=void 0}onKupIframeError(){this.kupIframeError.emit({comp:this,id:this.rootElement.id})}onKupIframeLoad(){this.kupIframeLoad.emit({comp:this,id:this.rootElement.id})}async getProps(t){return r(this,c,t)}async refresh(){s(this)}async setProps(t){a(this,c,t)}openInNew(){window.open(this.src,"_blank")}componentWillLoad(){this.kupManager.debug.logLoad(this,!1)}componentDidLoad(){this.kupManager.debug.logLoad(this,!0)}componentWillRender(){this.kupManager.debug.logRender(this,!1)}componentDidRender(){this.kupManager.debug.logRender(this,!0)}render(){if(null!=this.src&&""!==this.src)return this.buttonData.icon||(this.buttonData.icon="open_in_new"),this.buttonData.label||(this.buttonData.label="Open in new tab"),this.isButton?e(o,{"is-button":!0},e("kup-button",Object.assign({},this.buttonData,{"onkup-button-click":()=>this.openInNew()}))):e(o,{"is-iframe":!0},e("iframe",{onError:this.onKupIframeError.bind(this),onLoad:this.onKupIframeLoad.bind(this),src:this.src}));this.kupManager.debug.logMessage(this,"Resource undefined, not rendering!",d.WARNING)}get rootElement(){return h(this)}};p.style="iframe{box-sizing:border-box;height:100%;width:100%}:host([is-iframe]){box-sizing:border-box;display:block;height:100%;width:100%}";export{p as kup_iframe}
+import{r as t,c as i,f as s,h as e,H as o,g as h}from"./p-8c1edebd.js";import{k as n,g as r,s as a,c as d}from"./p-6ec8629e.js";var c;!function(t){t.buttonData="Props of the button (when isButton is set to true).",t.isButton="The component will be rendered as a button, which opens the link associated to the iframe in another tab when clicked.",t.src="The address the iframe should be referencing to."}(c||(c={}));const p=class{constructor(s){t(this,s),this.kupIframeError=i(this,"kup-iframe-error",6),this.kupIframeLoad=i(this,"kup-iframe-load",6),this.kupManager=n(),this.buttonData={},this.isButton=!1,this.src=void 0}onKupIframeError(){this.kupIframeError.emit({comp:this,id:this.rootElement.id})}onKupIframeLoad(){this.kupIframeLoad.emit({comp:this,id:this.rootElement.id})}async getProps(t){return r(this,c,t)}async refresh(){s(this)}async setProps(t){a(this,c,t)}openInNew(){window.open(this.src,"_blank")}componentWillLoad(){this.kupManager.debug.logLoad(this,!1)}componentDidLoad(){this.kupManager.debug.logLoad(this,!0)}componentWillRender(){this.kupManager.debug.logRender(this,!1)}componentDidRender(){this.kupManager.debug.logRender(this,!0)}render(){if(null!=this.src&&""!==this.src)return this.buttonData.icon||(this.buttonData.icon="open_in_new"),this.buttonData.label||(this.buttonData.label="Open in new tab"),this.isButton?e(o,{"is-button":!0},e("kup-button",Object.assign({},this.buttonData,{"onkup-button-click":()=>this.openInNew()}))):e(o,{"is-iframe":!0},e("iframe",{onError:this.onKupIframeError.bind(this),onLoad:this.onKupIframeLoad.bind(this),src:this.src}));this.kupManager.debug.logMessage(this,"Resource undefined, not rendering!",d.WARNING)}get rootElement(){return h(this)}};p.style="iframe{box-sizing:border-box;height:100%;width:100%}:host([is-iframe]){box-sizing:border-box;display:block;height:100%;width:100%}";export{p as kup_iframe}

package/dist/ketchup/{p-43b67de4.entry.js → p-78cc5a2d.entry.js}

@@ -1 +1 @@
-import{r as t,c as s,f as i,h as o,H as a,g as n}from"./p-9dcfbb1e.js";import{k as e,g as r,s as c}from"./p-36dac88e.js";import{c as l}from"./p-97e8ea42.js";import{F as p}from"./p-5f3680f2.js";import"./p-6c77a36c.js";import"./p-410c102a.js";const h="snackbar";var u;!function(t){t.actionButton="Set of FButton props to set the action button.",t.closeButton="When true, the hide button will be displayed.",t.customStyle="Custom style of the component.",t.text="Sets the textual content of the snackbar.",t.timeout="Defaults at null, when set the snackbar will automatically disappear after the specified amount of milliseconds."}(u||(u={}));const b=class{constructor(i){t(this,i),this.kupActionClick=s(this,"kup-snackbar-actionclick",6),this.kupTimeoutComplete=s(this,"kup-snackbar-timeoutcomplete",6),this.kupManager=e(),this.visible=!1,this.actionButton=null,this.closeButton=!0,this.customStyle="",this.text="",this.timeout=null}onKupActionClick(){this.hide(),this.kupActionClick.emit({comp:this,id:this.rootElement.id})}onKupTimeoutComplete(){this.kupTimeoutComplete.emit({comp:this,id:this.rootElement.id})}async getProps(t){return r(this,u,t)}async hide(){this.visible=!1}async refresh(){i(this)}async setProps(t){c(this,u,t)}async show(){this.visible=!0}componentWillLoad(){this.kupManager.debug.logLoad(this,!1),this.kupManager.theme.register(this)}componentDidLoad(){this.kupManager.debug.logLoad(this,!0)}componentWillRender(){this.kupManager.debug.logRender(this,!1)}componentDidRender(){this.timeout&&this.visible&&setTimeout((()=>{this.hide(),this.onKupTimeoutComplete()}),this.timeout),this.kupManager.debug.logRender(this,!0)}render(){return o(a,{"kup-visible":this.visible},o("style",null,this.kupManager.theme.setKupStyle(this.rootElement)),o("div",{id:l},o("div",{class:h},o("div",{class:`${h}__text`},this.text),this.actionButton||this.closeButton?o("div",{class:`${h}__buttons`},this.actionButton?o("div",{class:`${h}__action`},o(p,Object.assign({},this.actionButton,{onClick:()=>this.onKupActionClick()}))):null,this.closeButton?o("div",{class:`${h}__close`},o(p,{icon:"close",onClick:()=>this.hide()})):null):null)))}disconnectedCallback(){this.kupManager.theme.unregister(this)}get rootElement(){return n(this)}};b.style=":host{animation:snackbar-show 125ms;bottom:0;box-sizing:border-box;display:block;left:0;outline:none;pointer-events:none;position:fixed;transition:opacity 0.15s cubic-bezier(0, 0, 0.2, 1) 0ms, transform 0.15s cubic-bezier(0, 0, 0.2, 1) 0ms, -webkit-transform 0.15s cubic-bezier(0, 0, 0.2, 1) 0ms;width:100%;z-index:calc(var(--kup-navbar-zindex) + 1)}:host(:not([kup-visible])){display:none}#kup-component{box-sizing:border-box;display:flex;justify-content:center;height:100%;padding:8px;width:100%}.snackbar{align-items:center;background:var(--kup-navbar-background-color);border-radius:5px;box-shadow:var(--kup-box-shadow);color:var(--kup-navbar-color);display:flex;justify-content:space-between;max-width:672px;min-height:48px;min-width:344px}.snackbar__text{padding:14px 16px;pointer-events:all;word-break:break-word}.snackbar__buttons{--kup-button-primary-color:var(--kup-navbar-color);--kup-button-primary-color-rgb:var(--kup-navbar-color-rgb);--kup-button-primary-color-h:var(--kup-navbar-color-h);--kup-button-primary-color-s:var(--kup-navbar-color-s);--kup-button-primary-color-l:var(--kup-navbar-color-l);align-items:center;display:flex;justify-content:flex-end;margin-right:8px;pointer-events:all;width:max-content}.snackbar__close{--kup-button-font-size:11px;margin-left:8px;pointer-events:all}@keyframes snackbar-show{from{transform:scale(0.5);opacity:0}to{transform:scale(1);opacity:1}}:host(.kup-top){bottom:unset;top:var(--kup-navbar-height, 0)}";export{b as kup_snackbar}
+import{r as t,c as s,f as i,h as o,H as a,g as n}from"./p-8c1edebd.js";import{k as e,g as r,s as c}from"./p-6ec8629e.js";import{c as l}from"./p-ad2e21d2.js";import{F as p}from"./p-a5f15864.js";import"./p-0fd98ab4.js";import"./p-673bb93e.js";const h="snackbar";var u;!function(t){t.actionButton="Set of FButton props to set the action button.",t.closeButton="When true, the hide button will be displayed.",t.customStyle="Custom style of the component.",t.text="Sets the textual content of the snackbar.",t.timeout="Defaults at null, when set the snackbar will automatically disappear after the specified amount of milliseconds."}(u||(u={}));const b=class{constructor(i){t(this,i),this.kupActionClick=s(this,"kup-snackbar-actionclick",6),this.kupTimeoutComplete=s(this,"kup-snackbar-timeoutcomplete",6),this.kupManager=e(),this.visible=!1,this.actionButton=null,this.closeButton=!0,this.customStyle="",this.text="",this.timeout=null}onKupActionClick(){this.hide(),this.kupActionClick.emit({comp:this,id:this.rootElement.id})}onKupTimeoutComplete(){this.kupTimeoutComplete.emit({comp:this,id:this.rootElement.id})}async getProps(t){return r(this,u,t)}async hide(){this.visible=!1}async refresh(){i(this)}async setProps(t){c(this,u,t)}async show(){this.visible=!0}componentWillLoad(){this.kupManager.debug.logLoad(this,!1),this.kupManager.theme.register(this)}componentDidLoad(){this.kupManager.debug.logLoad(this,!0)}componentWillRender(){this.kupManager.debug.logRender(this,!1)}componentDidRender(){this.timeout&&this.visible&&setTimeout((()=>{this.hide(),this.onKupTimeoutComplete()}),this.timeout),this.kupManager.debug.logRender(this,!0)}render(){return o(a,{"kup-visible":this.visible},o("style",null,this.kupManager.theme.setKupStyle(this.rootElement)),o("div",{id:l},o("div",{class:h},o("div",{class:`${h}__text`},this.text),this.actionButton||this.closeButton?o("div",{class:`${h}__buttons`},this.actionButton?o("div",{class:`${h}__action`},o(p,Object.assign({},this.actionButton,{onClick:()=>this.onKupActionClick()}))):null,this.closeButton?o("div",{class:`${h}__close`},o(p,{icon:"close",onClick:()=>this.hide()})):null):null)))}disconnectedCallback(){this.kupManager.theme.unregister(this)}get rootElement(){return n(this)}};b.style=":host{animation:snackbar-show 125ms;bottom:0;box-sizing:border-box;display:block;left:0;outline:none;pointer-events:none;position:fixed;transition:opacity 0.15s cubic-bezier(0, 0, 0.2, 1) 0ms, transform 0.15s cubic-bezier(0, 0, 0.2, 1) 0ms, -webkit-transform 0.15s cubic-bezier(0, 0, 0.2, 1) 0ms;width:100%;z-index:calc(var(--kup-navbar-zindex) + 1)}:host(:not([kup-visible])){display:none}#kup-component{box-sizing:border-box;display:flex;justify-content:center;height:100%;padding:8px;width:100%}.snackbar{align-items:center;background:var(--kup-navbar-background-color);border-radius:5px;box-shadow:var(--kup-box-shadow);color:var(--kup-navbar-color);display:flex;justify-content:space-between;max-width:672px;min-height:48px;min-width:344px}.snackbar__text{padding:14px 16px;pointer-events:all;word-break:break-word}.snackbar__buttons{--kup-button-primary-color:var(--kup-navbar-color);--kup-button-primary-color-rgb:var(--kup-navbar-color-rgb);--kup-button-primary-color-h:var(--kup-navbar-color-h);--kup-button-primary-color-s:var(--kup-navbar-color-s);--kup-button-primary-color-l:var(--kup-navbar-color-l);align-items:center;display:flex;justify-content:flex-end;margin-right:8px;pointer-events:all;width:max-content}.snackbar__close{--kup-button-font-size:11px;margin-left:8px;pointer-events:all}@keyframes snackbar-show{from{transform:scale(0.5);opacity:0}to{transform:scale(1);opacity:1}}:host(.kup-top){bottom:unset;top:var(--kup-navbar-height, 0)}";export{b as kup_snackbar}

package/dist/ketchup/{p-c42b80c1.entry.js → p-799f7f10.entry.js}

@@ -1 +1 @@
-import{r as t,f as i,h as s,H as e,g as o}from"./p-9dcfbb1e.js";import{k as a,g as c,s as n,m as r,c as h,ao as l,R as u,ap as p,X as d,b}from"./p-36dac88e.js";import{F as m}from"./p-6c77a36c.js";import{F as k}from"./p-410c102a.js";import{c as g}from"./p-97e8ea42.js";var f,x;!function(t){t.customStyle="Custom style of the component.",t.data="Sets the data that will be used to display different components."}(f||(f={})),function(t){t.BOX="Box",t.BUTTON_LIST="Button List",t.CHART="Chart",t.CHIP="Chip",t.ECHART="Echart",t.DATATABLE="Datatable",t.JSON="JSON",t.TREE="Tree"}(x||(x={}));const y=class{constructor(i){t(this,i),this.dragHandler=null,this.kupManager=a(),this.textArea=null,this.wrapperRef=null,this.display=x.DATATABLE,this.customStyle="",this.data=null}async getProps(t){return c(this,f,t)}async refresh(){i(this)}async setProps(t){n(this,f,t)}comboboxProps(){const t=[];for(const i in x)Object.prototype.hasOwnProperty.call(x,i)&&t.push({id:x[i],selected:!1,value:x[i]});return{data:{"kup-list":{data:t,id:"kup-debug-theme-changer-list"},"kup-text-field":{emitSubmitEventOnEnter:!1,inputType:"text",label:this.kupManager.language.translate(r.VIEW_AS)}},id:"comp-switcher",initialValue:this.display,isSelect:!0,"onKup-combobox-itemclick":t=>{this.display=t.detail.value}}}setContent(){const t=!!(this.data&&this.data.columns&&this.data.columns.length>0),i=[],e={};if(this.display===x.JSON)e.initialValue=this.data?JSON.stringify(this.data,null,2):"",e.textArea=!0,i.push(s("kup-text-field",Object.assign({class:"kup-full-width kup-full-height"},e,{ref:t=>this.textArea=t,"onkup-textfield-input":t=>{try{this.data=JSON.parse(t.detail.value)}catch(t){this.data={columns:[{name:"ERROR",title:"Error"}],rows:[{cells:{ERROR:{value:"Invalid JSON:"+t}}}]}}}})));else if(t)switch(this.display){case x.BOX:e.data=this.data,i.push(s("kup-box",Object.assign({},e)));break;case x.BUTTON_LIST:e.data=this.data,i.push(s("kup-button-list",Object.assign({},e)));break;case x.CHIP:e.data=this.data,i.push(s("kup-chip",Object.assign({},e)));break;case x.CHART:case x.ECHART:e.data=this.data,e.series=[],e.axis=null;for(let t=0;t<this.data.columns.length;t++){const i=this.data.columns[t];i.obj&&this.kupManager.objects.isNumber(i.obj)||null!==e.axis?e.series.push(this.display===x.CHART?{code:i.name,decode:i.title}:i.name):e.axis=i.name}0===e.series.length&&this.kupManager.debug.logMessage(this,"Not enough numerical columns to display a chart!",h.WARNING),e.axis||this.kupManager.debug.logMessage(this,"No axis for the chart!",h.WARNING),i.push(s(this.display===x.CHART?"kup-chart":"kup-echart",Object.assign({},e)));break;case x.DATATABLE:e.data=this.data,e.autoFillMissingCells=!0,i.push(s("kup-data-table",Object.assign({},e)));break;case x.TREE:e.data=this.data,i.push(s("kup-tree",Object.assign({class:"kup-full-width"},e)));break;default:return void this.kupManager.debug.logMessage(this,"Display mode not supported ("+this.display+")!",h.ERROR)}else i.push(s("div",{class:"empty"},s(k,{sizeY:"100px",resource:"move_to_inbox"}),s("div",{class:"empty-text"},this.kupManager.language.translate(r.DROP_YOUR_DATA))));return i}updateData(t){{const i=Object.assign({},this.data),s=t.detail.sourceElement&&t.detail.sourceElement.column?t.detail.sourceElement.column:null,e=t.detail.sourceElement&&t.detail.sourceElement.row?t.detail.sourceElement.row:null;if(s&&s.name?i.columns?this.data.columns.find((t=>t.name===s.name))||i.columns.push(s):i.columns=[s]:this.kupManager.debug.logMessage(this,"Invalid column received.",h.WARNING),e&&(i.rows?i.rows.push(e):i.rows=[e]),this.data=i,this.data&&this.textArea)try{this.textArea.setValue(JSON.stringify(this.data,null,2))}catch(t){this.textArea.setValue("Invalid JSON:"+t)}}}componentWillLoad(){this.kupManager.debug.logLoad(this,!1),this.kupManager.language.register(this),this.kupManager.theme.register(this)}componentDidLoad(){this.rootElement.addEventListener(l,(t=>this.updateData(t))),this.dragHandler=this.rootElement.shadowRoot.querySelector("#drag-handle"),this.kupManager.interact.dialogify(this.rootElement,this.dragHandler),this.kupManager.interact.dropzone(this.wrapperRef,{accept:`[${u}],[${p}]`},{dispatcher:this.rootElement,type:d.MAGICBOX}),this.kupManager.debug.logLoad(this,!0)}componentWillRender(){this.kupManager.debug.logRender(this,!1)}componentDidRender(){this.kupManager.debug.logRender(this,!0)}render(){return s(e,null,s("style",null,this.kupManager.theme.setKupStyle(this.rootElement)),s("div",{id:g},s("div",{class:"magic-box-wrapper"},s("div",{class:"actions",id:"drag-handle"},s("kup-combobox",Object.assign({},this.comboboxProps())),s("kup-button",{styling:m.FLAT,icon:"delete",label:"Reset","onkup-button-click":()=>{this.data=null}}),s("kup-button",{id:"close-dialog",customStyle:`:host{${b.PRIMARY}: var(${b.TITLE});}`,icon:"clear","onkup-button-click":()=>{this.kupManager.hideMagicBox()}})),s("div",{class:"content",ref:t=>this.wrapperRef=t},this.setContent()))))}disconnectedCallback(){this.kupManager.interact.unregister([this.rootElement,this.wrapperRef]),this.kupManager.language.unregister(this),this.kupManager.theme.unregister(this)}get rootElement(){return o(this)}};y.style=":host{background-color:var(--kup-background-color);color:var(--kup-text-color);display:block;height:300px;min-width:700px;width:700px}#kup-component,.magic-box-wrapper{height:100%;width:100%}.magic-box-wrapper{border:3px dashed var(--kup-border-color);box-sizing:border-box;display:flex;flex-direction:column}.actions{align-items:center;background-color:var(--kup-title-background-color);display:inline-flex;height:52px;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1}.actions kup-button{margin:0.5em}.actions #comp-switcher{margin:auto 0}.actions #close-dialog{position:absolute;margin:0;top:0;right:0;background-color:var(--kup-title-background-color)}.content{box-sizing:border-box;height:100%;margin-top:52px;overflow:auto;transition:background-color 125ms ease}.empty{flex-direction:column;display:flex;text-align:center;justify-content:center;height:100%;width:100%;opacity:0.5;transition:opacity 0.25s ease-out}.empty .f-image{margin:0}.json{font-family:var(--kup-font-family-monospace);margin:0}[kup-drag-over]{background-color:rgba(var(--kup-success-color-rgb), 0.25)}";export{y as kup_magic_box}
+import{r as t,f as i,h as s,H as e,g as o}from"./p-8c1edebd.js";import{k as a,g as n,s as c,m as r,c as h,am as l,R as u,an as p,X as d,b}from"./p-6ec8629e.js";import{F as m}from"./p-0fd98ab4.js";import{F as k}from"./p-673bb93e.js";import{c as g}from"./p-ad2e21d2.js";var f,x;!function(t){t.customStyle="Custom style of the component.",t.data="Sets the data that will be used to display different components."}(f||(f={})),function(t){t.BOX="Box",t.BUTTON_LIST="Button List",t.CHART="Chart",t.CHIP="Chip",t.ECHART="Echart",t.DATATABLE="Datatable",t.JSON="JSON",t.TREE="Tree"}(x||(x={}));const y=class{constructor(i){t(this,i),this.dragHandler=null,this.kupManager=a(),this.textArea=null,this.wrapperRef=null,this.display=x.DATATABLE,this.customStyle="",this.data=null}async getProps(t){return n(this,f,t)}async refresh(){i(this)}async setProps(t){c(this,f,t)}comboboxProps(){const t=[];for(const i in x)Object.prototype.hasOwnProperty.call(x,i)&&t.push({id:x[i],selected:!1,value:x[i]});return{data:{"kup-list":{data:t,id:"kup-debug-theme-changer-list"},"kup-text-field":{emitSubmitEventOnEnter:!1,inputType:"text",label:this.kupManager.language.translate(r.VIEW_AS)}},id:"comp-switcher",initialValue:this.display,isSelect:!0,"onKup-combobox-itemclick":t=>{this.display=t.detail.value}}}setContent(){const t=!!(this.data&&this.data.columns&&this.data.columns.length>0),i=[],e={};if(this.display===x.JSON)e.initialValue=this.data?JSON.stringify(this.data,null,2):"",e.textArea=!0,i.push(s("kup-text-field",Object.assign({class:"kup-full-width kup-full-height"},e,{ref:t=>this.textArea=t,"onkup-textfield-input":t=>{try{this.data=JSON.parse(t.detail.value)}catch(t){this.data={columns:[{name:"ERROR",title:"Error"}],rows:[{cells:{ERROR:{value:"Invalid JSON:"+t}}}]}}}})));else if(t)switch(this.display){case x.BOX:e.data=this.data,i.push(s("kup-box",Object.assign({},e)));break;case x.BUTTON_LIST:e.data=this.data,i.push(s("kup-button-list",Object.assign({},e)));break;case x.CHIP:e.data=this.data,i.push(s("kup-chip",Object.assign({},e)));break;case x.CHART:case x.ECHART:e.data=this.data,e.series=[],e.axis=null;for(let t=0;t<this.data.columns.length;t++){const i=this.data.columns[t];i.obj&&this.kupManager.objects.isNumber(i.obj)||null!==e.axis?e.series.push(this.display===x.CHART?{code:i.name,decode:i.title}:i.name):e.axis=i.name}0===e.series.length&&this.kupManager.debug.logMessage(this,"Not enough numerical columns to display a chart!",h.WARNING),e.axis||this.kupManager.debug.logMessage(this,"No axis for the chart!",h.WARNING),i.push(s(this.display===x.CHART?"kup-chart":"kup-echart",Object.assign({},e)));break;case x.DATATABLE:e.data=this.data,e.autoFillMissingCells=!0,i.push(s("kup-data-table",Object.assign({},e)));break;case x.TREE:e.data=this.data,i.push(s("kup-tree",Object.assign({class:"kup-full-width"},e)));break;default:return void this.kupManager.debug.logMessage(this,"Display mode not supported ("+this.display+")!",h.ERROR)}else i.push(s("div",{class:"empty"},s(k,{sizeY:"100px",resource:"move_to_inbox"}),s("div",{class:"empty-text"},this.kupManager.language.translate(r.DROP_YOUR_DATA))));return i}updateData(t){{const i=Object.assign({},this.data),s=t.detail.sourceElement&&t.detail.sourceElement.column?t.detail.sourceElement.column:null,e=t.detail.sourceElement&&t.detail.sourceElement.row?t.detail.sourceElement.row:null;if(s&&s.name?i.columns?this.data.columns.find((t=>t.name===s.name))||i.columns.push(s):i.columns=[s]:this.kupManager.debug.logMessage(this,"Invalid column received.",h.WARNING),e&&(i.rows?i.rows.push(e):i.rows=[e]),this.data=i,this.data&&this.textArea)try{this.textArea.setValue(JSON.stringify(this.data,null,2))}catch(t){this.textArea.setValue("Invalid JSON:"+t)}}}componentWillLoad(){this.kupManager.debug.logLoad(this,!1),this.kupManager.language.register(this),this.kupManager.theme.register(this)}componentDidLoad(){this.rootElement.addEventListener(l,(t=>this.updateData(t))),this.dragHandler=this.rootElement.shadowRoot.querySelector("#drag-handle"),this.kupManager.interact.dialogify(this.rootElement,this.dragHandler),this.kupManager.interact.dropzone(this.wrapperRef,{accept:`[${u}],[${p}]`},{dispatcher:this.rootElement,type:d.MAGICBOX}),this.kupManager.debug.logLoad(this,!0)}componentWillRender(){this.kupManager.debug.logRender(this,!1)}componentDidRender(){this.kupManager.debug.logRender(this,!0)}render(){return s(e,null,s("style",null,this.kupManager.theme.setKupStyle(this.rootElement)),s("div",{id:g},s("div",{class:"magic-box-wrapper"},s("div",{class:"actions",id:"drag-handle"},s("kup-combobox",Object.assign({},this.comboboxProps())),s("kup-button",{styling:m.FLAT,icon:"delete",label:"Reset","onkup-button-click":()=>{this.data=null}}),s("kup-button",{id:"close-dialog",customStyle:`:host{${b.PRIMARY}: var(${b.TITLE});}`,icon:"clear","onkup-button-click":()=>{this.kupManager.hideMagicBox()}})),s("div",{class:"content",ref:t=>this.wrapperRef=t},this.setContent()))))}disconnectedCallback(){this.kupManager.interact.unregister([this.rootElement,this.wrapperRef]),this.kupManager.language.unregister(this),this.kupManager.theme.unregister(this)}get rootElement(){return o(this)}};y.style=":host{background-color:var(--kup-background-color);color:var(--kup-text-color);display:block;height:300px;min-width:700px;width:700px}#kup-component,.magic-box-wrapper{height:100%;width:100%}.magic-box-wrapper{border:3px dashed var(--kup-border-color);box-sizing:border-box;display:flex;flex-direction:column}.actions{align-items:center;background-color:var(--kup-title-background-color);display:inline-flex;height:52px;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1}.actions kup-button{margin:0.5em}.actions #comp-switcher{margin:auto 0}.actions #close-dialog{position:absolute;margin:0;top:0;right:0;background-color:var(--kup-title-background-color)}.content{box-sizing:border-box;height:100%;margin-top:52px;overflow:auto;transition:background-color 125ms ease}.empty{flex-direction:column;display:flex;text-align:center;justify-content:center;height:100%;width:100%;opacity:0.5;transition:opacity 0.25s ease-out}.empty .f-image{margin:0}.json{font-family:var(--kup-font-family-monospace);margin:0}[kup-drag-over]{background-color:rgba(var(--kup-success-color-rgb), 0.25)}";export{y as kup_magic_box}