@5minds/node-red-dashboard-2-processcube-dynamic-list/resources/ui-dynamic-list.umd.js

A ui component for showing progress bars tracking a process

(function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");t.appendChild(document.createTextNode(".list-entry[data-v-a51b547e]{background:#fff;display:flex;justify-content:space-between;padding:16px;margin-bottom:24px;border-radius:8px;box-shadow:0 0 8px #bababa;transition:box-shadow .25s ease;align-items:center}.list-entry-hoverable[data-v-a51b547e]{cursor:pointer}.list-entry-hoverable[data-v-a51b547e]:hover{box-shadow:0 0 32px #bababa;transition:box-shadow .5s ease}.list-entry_left[data-v-a51b547e]{display:flex;align-items:center;gap:24px}.list-entry_left-progress[data-v-a51b547e]{font-size:24px;font-weight:400;color:#405fa5}.list-entry_left-texts[data-v-a51b547e]{display:flex;flex-direction:column;gap:4px;justify-content:center}.list-entry_left-title[data-v-a51b547e]{display:flex;gap:8px;align-items:center}.list-entry_left-title-text[data-v-a51b547e]{font-size:18px;font-weight:400}.list-entry_left-title-state[data-v-a51b547e]{font-size:12px;color:#fff;font-weight:700;padding:4px 8px;border-radius:8px;border:2px solid transparent}.list-entry_left-details[data-v-a51b547e]{font-size:18px;color:#7a7a99;font-weight:400}.list-entry_right[data-v-a51b547e]{display:flex;align-self:center;flex-direction:column;align-items:end;gap:4px}.list-entry_right-assignee[data-v-a51b547e]{font-size:18px;font-weight:400}.list-entry_right-actions[data-v-a51b547e]{display:flex;gap:8px}.list-entry_right-action[data-v-a51b547e]{cursor:pointer;padding:4px;opacity:.6}.list-entry_right-action[data-v-a51b547e]:hover{opacity:1}")),document.head.appendChild(t)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
(function(n,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(n=typeof globalThis<"u"?globalThis:n||self,t(n["ui-dynamic-list"]={},n.Vue))})(this,function(n,t){"use strict";const _=(e,o)=>{const i=e.__vccOpts||e;for(const[l,c]of o)i[l]=c;return i},C={name:"UIDynamicList",inject:["$socket"],props:{id:{type:String,required:!0},props:{type:Object,default:()=>({})},state:{type:Object,default:()=>({enabled:!0,visible:!0})}},computed:{},data(){return{actions:[],entries:[],itemHoverEffect:!0}},mounted(){this.$socket.on("widget-load:"+this.id,e=>{var o,i;this.actions=((o=this.props)==null?void 0:o.actions)??[],this.entries=(e==null?void 0:e.payload)??[],this.itemHoverEffect=((i=this.props)==null?void 0:i.itemHoverEffect)??!0}),this.$socket.on("msg-input:"+this.id,e=>{this.entries=e.payload??[]}),this.$socket.emit("widget-load",this.id)},unmounted(){var e,o;(e=this.$socket)==null||e.off("widget-load"+this.id),(o=this.$socket)==null||o.off("msg-input:"+this.id)},methods:{send(e,o){const i=[];i[o]={payload:e},this.$socket.emit("widget-action",this.id,i)},entryClicked(e){this.send(e,0)},actionClicked(e,o,i){i.stopPropagation();const l=this.actions.findIndex(c=>c.id===e.id);l>-1&&this.send(o,l+1)}}},a=e=>(t.pushScopeId("data-v-a51b547e"),e=e(),t.popScopeId(),e),m=["onClick"],k={class:"list-entry_left"},f={key:0,class:"list-entry_left-progress"},g={key:0,width:"28",height:"28",viewBox:"0 0 28 28",fill:"none",xmlns:"http://www.w3.org/2000/svg"},y=[a(()=>t.createElementVNode("path",{d:"M12.04 20.44L21.91 10.57L19.95 8.61L12.04 16.52L8.05 12.53L6.09 14.49L12.04 20.44ZM14 28C12.0633 28 10.2433 27.6325 8.54 26.8975C6.83667 26.1625 5.355 25.165 4.095 23.905C2.835 22.645 1.8375 21.1633 1.1025 19.46C0.3675 17.7567 0 15.9367 0 14C0 12.0633 0.3675 10.2433 1.1025 8.54C1.8375 6.83667 2.835 5.355 4.095 4.095C5.355 2.835 6.83667 1.8375 8.54 1.1025C10.2433 0.3675 12.0633 0 14 0C15.9367 0 17.7567 0.3675 19.46 1.1025C21.1633 1.8375 22.645 2.835 23.905 4.095C25.165 5.355 26.1625 6.83667 26.8975 8.54C27.6325 10.2433 28 12.0633 28 14C28 15.9367 27.6325 17.7567 26.8975 19.46C26.1625 21.1633 25.165 22.645 23.905 23.905C22.645 25.165 21.1633 26.1625 19.46 26.8975C17.7567 27.6325 15.9367 28 14 28Z",fill:"#405FA5"},null,-1))],B={key:1,width:"28",height:"28",viewBox:"0 0 28 28",fill:"none",xmlns:"http://www.w3.org/2000/svg"},E=[a(()=>t.createElementVNode("path",{d:"M14 28C12.0633 28 10.2433 27.6325 8.54 26.8975C6.83667 26.1625 5.355 25.165 4.095 23.905C2.835 22.645 1.8375 21.1633 1.1025 19.46C0.3675 17.7567 0 15.9367 0 14C0 12.0633 0.3675 10.2433 1.1025 8.54C1.8375 6.83667 2.835 5.355 4.095 4.095C5.355 2.835 6.83667 1.8375 8.54 1.1025C10.2433 0.3675 12.0633 0 14 0C15.9367 0 17.7567 0.3675 19.46 1.1025C21.1633 1.8375 22.645 2.835 23.905 4.095C25.165 5.355 26.1625 6.83667 26.8975 8.54C27.6325 10.2433 28 12.0633 28 14C28 15.9367 27.6325 17.7567 26.8975 19.46C26.1625 21.1633 25.165 22.645 23.905 23.905C22.645 25.165 21.1633 26.1625 19.46 26.8975C17.7567 27.6325 15.9367 28 14 28ZM14 25.2C17.1267 25.2 19.775 24.115 21.945 21.945C24.115 19.775 25.2 17.1267 25.2 14C25.2 10.8733 24.115 8.225 21.945 6.055C19.775 3.885 17.1267 2.8 14 2.8C10.8733 2.8 8.225 3.885 6.055 6.055C3.885 8.225 2.8 10.8733 2.8 14C2.8 17.1267 3.885 19.775 6.055 21.945C8.225 24.115 10.8733 25.2 14 25.2Z",fill:"black"},null,-1))],w={class:"list-entry_left-texts"},b={class:"list-entry_left-title"},x={class:"list-entry_left-title-text"},V={key:0,class:"list-entry_left-details"},N={class:"list-entry_right"},S={class:"list-entry_right-actions"},L=["onClick","src"],I={key:0,class:"list-entry_right-assignee"};function D(e,o,i,l,c,d){return t.openBlock(),t.createElementBlock("div",null,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(c.entries,s=>{var p,h;return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["list-entry",{"list-entry-hoverable":c.itemHoverEffect}]),onClick:r=>d.entryClicked(s)},[t.createElementVNode("div",k,[((p=s.progress)==null?void 0:p.type)==="percentage"?(t.openBlock(),t.createElementBlock("span",f,t.toDisplayString(s.progress.value)+" %",1)):((h=s.progress)==null?void 0:h.type)==="boolean"?(t.openBlock(),t.createElementBlock(t.Fragment,{key:1},[s.progress.value===100?(t.openBlock(),t.createElementBlock("svg",g,y)):(t.openBlock(),t.createElementBlock("svg",B,E))],64)):t.createCommentVNode("",!0),t.createElementVNode("div",w,[t.createElementVNode("div",b,[t.createElementVNode("span",x,t.toDisplayString(s.title),1),s.state?(t.openBlock(),t.createElementBlock("span",{key:0,class:"list-entry_left-title-state",style:t.normalizeStyle({backgroundColor:s.state.backgroundColor})},t.toDisplayString(s.state.text),5)):t.createCommentVNode("",!0)]),s.details?(t.openBlock(),t.createElementBlock("span",V,t.toDisplayString(s.details),1)):t.createCommentVNode("",!0)])]),t.createElementVNode("div",N,[t.createElementVNode("div",S,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(c.actions,r=>(t.openBlock(),t.createElementBlock("img",{onClick:j=>d.actionClicked(r,s,j),class:"list-entry_right-action",src:r.icon},null,8,L))),256))]),s.assignee?(t.openBlock(),t.createElementBlock("span",I,t.toDisplayString(s.assignee),1)):t.createCommentVNode("",!0)])],10,m)}),256))])}const $=_(C,[["render",D],["__scopeId","data-v-a51b547e"]]);n.UIDynamicList=$,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});