@transitive-sdk/utils-web 0.6.4 → 0.6.5

package/dist/utils-web.js

@@ -1 +1 @@
-(()=>{var e={890:(e,t,n)=>{"use strict";function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function o(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(e){return a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},a(e)}var u=n(362),c=u.DataCache,s=u.mqttParsePayload,l=u.pathMatch,f=u.topicToPath,h=u.pathToTopic,p=u.toFlatObject,d=u.getLogger,b=u.mergeVersions,y=u.parseMQTTTopic,v=u.isSubTopicOf,g=u.versionCompare,m=u.encodeTopicElement,w=n(517),O=d("MqttSync"),S="$SYS/broker/uptime",E=function(){},k=function(e){return e.endsWith("/#")?e:e.endsWith("/")?e.concat("#"):e.concat("/#")},T=function(e){return e.replace(/\/\//g,"/")},C=function(){function e(t){var n=this,r=t.mqttClient,o=t.onChange,a=t.ignoreRetain,u=t.migrate,l=t.onReady,p=t.sliceTopic;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),i(this,"data",new c),i(this,"subscribedPaths",{}),i(this,"publishedPaths",{}),i(this,"publishedMessages",{}),i(this,"publishQueue",new Map),i(this,"heartbeatWaitersOnce",[]),i(this,"heartbeats",0),i(this,"beforeDisconnectHooks",[]),this.mqtt=r,this.mqtt.on("message",(function(e,t,r){var i=t&&t.toString();if(O.debug("got message",e,i.slice(0,180),i.length>180?"... (".concat(i.length," bytes)"):"",r.retain),e==S)n.heartbeats>0&&(n.heartbeatWaitersOnce.forEach((function(e){return e()})),n.heartbeatWaitersOnce=[]),1==n.heartbeats&&!u&&l&&l(),n.heartbeats++;else if(r.retain||a){O.debug("processing message",e),p&&(e=h(f(e).slice(p)));var c=s(t);if(n.isPublished(e))n.publishedMessages[e]=c,n.data.update(e,c,{external:!0});else if(n.isSubscribed(e)){O.debug("applying received update",e);var d=n.data.update(e,c);o&&Object.keys(d).length>0&&o(d)}}})),this.mqtt.subscribe(S,{rap:!0},O.debug),(null==u?void 0:u.length)>0&&this.migrate(u,(function(){O.debug("done migrating",l),l&&n.waitForHeartbeatOnce(l)}))}var t,n;return t=e,n=[{key:"publishAtLevel",value:function(e,t,n){var r=this;O.debug("publishingAtLevel ".concat(n),e,t),n>0?w.forEach(t,(function(t,o){var i="".concat(e,"/").concat(m(o));O.debug("publishing ".concat(i)),r.publishAtLevel(i,t,n-1)})):this.mqtt.publish(e,JSON.stringify(t),{retain:!0},(function(e){e&&O.warn("Error when publishing migration result",e)}))}},{key:"migrate",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0,r=e.length;if(0!=r){var o=function(){return 0==--r&&n&&n()};e.forEach((function(e){var n=e.topic,r=e.newVersion,i=e.transform,a=void 0===i?void 0:i,u=e.flat,c=void 0!==u&&u,s=e.level,l=void 0===s?0:s;O.debug("migrating",n,r);var d=y(n),v=d.organization,m=d.device,S=d.capability,E=d.sub,k="/".concat(v,"/").concat(m,"/").concat(S),C=0==E.length?"/#":h(E),j="".concat(k,"/+").concat(C);t.subscribe(j,(function(e){if(e)return O.warn("Error during migration",e),void o();t.waitForHeartbeatOnce((function(){O.debug("got heartbeat",n,j);var e=t.data.getByTopic(k);if(!e)return t.unsubscribe(j),void o();var i=b(e,C,{maxVersion:r}),u=w.get(i,f(C)),s=a?a(u):u,d=T("".concat(k,"/").concat(r,"/").concat(C));if(O.debug("publishing merged",d),c){var y=p(s),v=f(d);w.forEach(y,(function(e,n){var r=h(v.concat(f(n)));t.mqtt.publish(r,JSON.stringify(e),{retain:!0},(function(e){e&&O.warn("Error when publishing migration result for ".concat(n),e)}))}))}else t.publishAtLevel(d,s,l);t.unsubscribe(j),t.waitForHeartbeatOnce((function(){var n=Object.keys(e).filter((function(e){return g(e,r)<0})).map((function(e){return T("".concat(k,"/").concat(e,"/").concat(C))}));O.debug({prefixesToClear:n}),t.clear(n),o()}))}))}))}))}else n&&n()}},{key:"clear",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0,r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},o=[],i=function(t){e.forEach((function(e){return l("".concat(e,"/#"),t)&&(!r.filter||r.filter(t))&&o.push(t)}))};this.mqtt.on("message",i),e.forEach((function(e){"string"==typeof e?t.mqtt.subscribe("".concat(e,"/#")):O.warn("Ignoring",e,"since it is not a string.")}));var a="undefined"!=typeof Buffer?Buffer.alloc(0):null;this.waitForHeartbeatOnce((function(){t.mqtt.removeListener("message",i),e.forEach((function(e){return t.mqtt.unsubscribe("".concat(e,"/#"))}));var r=o.length;O.debug("clearing ".concat(r," retained messages from ").concat(e)),o.forEach((function(e){t.mqtt.publish(e,a,{retain:!0})})),n&&n(r)}))}},{key:"waitForHeartbeatOnce",value:function(e){var t=this;setTimeout((function(){return t.heartbeatWaitersOnce.push(e)}),1)}},{key:"isSubscribed",value:function(e){return Object.keys(this.subscribedPaths).some((function(t){return l(t,e)}))}},{key:"isPublished",value:function(e){var t=this;return Object.keys(this.publishedPaths).some((function(n){return l(n,e)&&!t.publishedPaths[n].atomic}))}},{key:"subscribe",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:E;if(e=k(e),this.subscribedPaths[e])return O.debug("already subscribed to",e),void n();this.mqtt.subscribe(e,{rap:!0},(function(r,o){O.debug("subscribe",e,"granted:",o),o&&o.some((function(t){return t.topic==e&&t.qos<128}))?(t.subscribedPaths[e]=1,n(null)):n("not permitted to subscribe to topic ".concat(e,", ").concat(JSON.stringify(o)))}))}},{key:"unsubscribe",value:function(e){this.subscribedPaths[e]&&(this.mqtt.unsubscribe(e),delete this.subscribedPaths[e])}},{key:"_actuallyPublish",value:function(e,t){return this.mqtt.connected?(O.debug("actually publishing",e),this.mqtt.publish(e,null==t?null:JSON.stringify(t),{retain:!0}),!0):(O.warn("not connected, not publishing",e),!1)}},{key:"_processQueue_rec",value:function(e){var t=this;if(this.publishQueue.size>0){var n=function(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,i=[],a=!0,u=!1;try{for(n=n.call(e);!(a=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{a||null==n.return||n.return()}finally{if(u)throw o}}return i}}(e,t)||function(e,t){if(e){if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}(this.publishQueue.entries().next().value,2),o=n[0],i=n[1];this._actuallyPublish(o,i)?(this.publishQueue.delete(o),this._processQueue_rec(e)):setTimeout((function(){return t._processQueue_rec(e)}),5e3)}else e()}},{key:"_processQueue",value:function(){var e=this;this._processing||(this._processing=!0,this._processQueue_rec((function(){return e._processing=!1})))}},{key:"setThrottle",value:function(e){this._processQueueThrottled=w.throttle(this._processQueue.bind(this),e)}},{key:"clearThrottle",value:function(){delete this._processQueueThrottled}},{key:"addToQueue",value:function(e,t){this.publishQueue.set(e,t)}},{key:"_enqueue",value:function(e,t){var n;O.debug("enqueuing",e),this.addToQueue(e,t),this._processQueueThrottled?this._processQueueThrottled():this._processQueue(),null==t?delete this.publishedMessages[e]:this.publishedMessages[e]="object"==a(n=t)?JSON.parse(JSON.stringify(n)):n}},{key:"publish",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{atomic:!1};return e=k(e),!w.isEqual(this.publishedPaths[e],n)&&(this.publishedPaths[e]=n,n.atomic?(this.data.subscribePath(e,(function(n,r,o,i){if(null==i||!i.external){O.debug("processing change (atomic)",r,e);var a=e.slice(0,e.length-2),u=h(f(r).slice(0,f(a).length));t._enqueue(u,t.data.getByTopic(u))}})),!0):(this.mqtt.subscribe(e),void this.data.subscribePath(e,(function(e,n,r,o){if(null==o||!o.external)return O.debug("processing change",n),w.each(t.publishedMessages,(function(e,r){if(O.trace("oldKey",r),r==n)return!0;if(v(r,n)&&t._enqueue(r,null),v(n,r)){t._enqueue(r,null);var o=p(e);w.each(o,(function(e,n){var o="".concat(r).concat(n);t._enqueue(o,e)}))}})),t._enqueue(n,e),!0}))))}},{key:"beforeDisconnect",value:function(){var e=this;this.beforeDisconnectHooks.forEach((function(t){return t(e)}))}},{key:"onBeforeDisconnect",value:function(e){this.beforeDisconnectHooks.push(e)}}],n&&o(t.prototype,n),Object.defineProperty(t,"prototype",{writable:!1}),e}();e.exports=C},362:(e,t,n)=>{function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t,n){!function(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")}(e,t),t.set(e,n)}function a(e,t){return function(e,t){return t.get?t.get.call(e):t.value}(e,c(e,t,"get"))}function u(e,t,n){return function(e,t,n){if(t.set)t.set.call(e,n);else{if(!t.writable)throw new TypeError("attempted to set read only private field");t.value=n}}(e,c(e,t,"set"),n),n}function c(e,t,n){if(!t.has(e))throw new TypeError("attempted to "+n+" private field on non-instance");return t.get(e)}function s(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var l=n(13),f={get:n(712),set:n(298),unset:n(305),forEach:n(848),map:n(707),isEmpty:n(699),eq:n(113),isPlainObject:n(452),merge:n(831)},h=n(316),p=n(22),d=n(499);h.setAll=function(e){return Object.values(h.getLoggers()).forEach((function(t){return t.setLevel(e)}))};var b={warn:p.yellow,error:p.red,info:p.green,debug:p.gray},y=h.methodFactory;h.methodFactory=function(e,t,n){var r=y(e,t,n);if("undefined"!=typeof window){var o="".concat(n," ").concat(e);return function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];return r.apply(void 0,["[".concat(o,"]")].concat(t))}}var i,a="".concat(n," ").concat(b[i=e]?b[i](i):i);return function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];return r.apply(void 0,["[".concat(p.blue((new Date).toISOString())," ").concat(a,"]")].concat(t))}};var v=h.getLogger,g=function e(t,n){if(n&&0!=n.length){f.unset(t,n);var r=n.slice(0,-1),o=0==r.length?t:f.get(t,r);return f.isEmpty(o)?e(t,r):n}},m=function e(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[],r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return f.forEach(t,(function(t,o){var i=n.concat(String(o));(f.isPlainObject(t)||t instanceof Array)&&null!==t?e(t,i,r):r[k(i)]=t})),r},w=function e(t,n){if(0!=n.length){var r=n[0];if(r)for(var o in t)o==r||"*"==r||r.startsWith("+")?e(t[o],n.slice(1)):delete t[o]}},O=function e(t,n,r){var o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:[],i=arguments.length>4&&void 0!==arguments[4]?arguments[4]:{};if(0!=n.length&&"#"!=n[0]){var a=n[0];if(a)for(var u in t)if(u==a||"*"==a||a.startsWith("+")){var c=a.startsWith("+")&&a.length>1?Object.assign({},i,s({},a.slice(1),u)):i;e(t[u],n.slice(1),r,o.concat([u]),c)}}else r(t,o,i)},S=function(e){return e.replace(/%/g,"%25").replace(/\//g,"%2F")},E=function(e){return e.replace(/%25/g,"%").replace(/%2F/g,"/")},k=function(e){return"/".concat(e.map((function(e){return e.startsWith("+")?"+":e})).map(S).join("/"))},T=function(e){var t=e.split("/").map(E);return t.length>0&&0==t[0].length&&t.shift(),t.length>0&&0==t.at(-1).length&&t.pop(),t},C=function(e,t){return function e(t,n){if(0==t.length)return!0;if("#"==t[0][0])return!0;if(0==n.length)return!0;if(t[0]==n[0])return e(t.slice(1),n.slice(1));if("+"==t[0][0]){var r=e(t.slice(1),n.slice(1));return r&&Object.assign(s({},t[0].slice(1),n[0]),r)}return!1}(T(e),T(t))},j=function e(t,n){return 0==t.length||t[0]==n[0]&&e(t.slice(1),n.slice(1))},x=new WeakMap,P=new WeakMap,q=new WeakMap,_=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};r(this,e),i(this,x,{writable:!0,value:{}}),i(this,P,{writable:!0,value:[]}),i(this,q,{writable:!0,value:[]}),u(this,x,t)}var t,n;return t=e,n=[{key:"updateFromArray",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},r=f.get(a(this,x),e);if(null==t){if(null==r)return{};g(a(this,x),e)}else{if(f.eq(r,t))return{};f.set(a(this,x),e,t)}var o,i=k(e),u=s({},i,t);if(t instanceof Object){var c=m(t);o={},f.forEach(c,(function(e,t){o["".concat(i).concat(t)]=e}))}else o=u;return a(this,P).forEach((function(e){return e(u,n)})),a(this,q).forEach((function(e){return e(o,n)})),o}},{key:"update",value:function(e,t,n){if("string"==typeof e)return this.updateFromTopic(e,t,n);if(e instanceof Array)return this.updateFromArray(e,t,n);throw new Error("unrecognized path expression")}},{key:"updateFromTopic",value:function(e,t,n){return this.updateFromArray(T(e),t,n)}},{key:"updateFromModifier",value:function(e,t){var n=this;return f.map(e,(function(e,r){return n.updateFromTopic(r,e,t)}))}},{key:"subscribe",value:function(e){e instanceof Function?a(this,P).push(e):console.warn("DataCache.subscribe expects a function as argument. Did you mean to use subscribePath?")}},{key:"subscribePath",value:function(e,t){a(this,P).push((function(n,r){f.forEach(n,(function(n,o){var i=C(e,o);i&&t(n,o,i,r)}))}))}},{key:"subscribePathFlat",value:function(e,t){a(this,q).push((function(n,r){f.forEach(n,(function(n,o){var i=C(e,o);i&&t(n,o,i,r)}))}))}},{key:"unsubscribe",value:function(e){u(this,P,a(this,P).filter((function(t){return t!=e})))}},{key:"get",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[];return 0==e.length?a(this,x):f.get(a(this,x),e)}},{key:"getByTopic",value:function(e){return this.get(T(e))}},{key:"filter",value:function(e){var t=JSON.parse(JSON.stringify(this.get()));return w(t,e),t}},{key:"filterByTopic",value:function(e){return this.filter(T(e))}},{key:"forMatch",value:function(e,t){var n=T(e);this.forPathMatch(n,t)}},{key:"forPathMatch",value:function(e,t){O(this.get(),e,t)}}],n&&o(t.prototype,n),Object.defineProperty(t,"prototype",{writable:!1}),e}(),A=function(e,t){return function e(t,n){return 0==n.length&&0==t.length||!(0==n.length&&t.length>0)&&("#"==n[0]||!(n.length>0&&0==t.length)&&("+"==n[0]||n[0]==t[0])&&e(t.slice(1),n.slice(1)))}(T(e),T(t))},M=l;e.exports={parseMQTTUsername:function(e){var t=e.split(":");return{organization:t[0],client:t[1],sub:t.slice(2)}},parseMQTTTopic:function(e){var t=T(e);return{organization:t[0],device:t[1],capabilityScope:t[2],capabilityName:t[3],capability:"".concat(t[2],"/").concat(t[3]),version:t[4],sub:t.slice(5)}},updateObject:function(e,t){return f.forEach(t,(function(t,n){var r=T(n);null==t?g(e,r):f.set(e,r,t)})),e},DataCache:_,pathToTopic:k,topicToPath:T,toFlatObject:m,mqttTopicMatch:A,pathMatch:C,mqttParsePayload:function(e){return 0==e.length?null:JSON.parse(e.toString("utf-8"))},getRandomId:function(){return Math.random().toString(36).slice(2)},versionCompare:M,loglevel:h,getLogger:v,mergeVersions:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(!e)return t?f.set({},t,e):e;var r=Object.keys(e).filter((function(e){return(!n.maxVersion||M(e,n.maxVersion)<=0)&&(!n.minVersion||M(n.minVersion,e)<=0)})).sort(M),o={},i=t&&T(t);return r.forEach((function(t){var n=i?f.get(e[t],i):e[t];f.merge(o,n)})),i?f.set({},i,o):o},mqttClearRetained:function(e,t,n){var r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:1e3,o=[],i=function(e){t.forEach((function(t){return A(e,"".concat(t,"/#"))&&o.push(e)}))};e.on("message",i),t.forEach((function(t){"string"==typeof t?e.subscribe("".concat(t,"/#")):console.warn("Ignoring",t,"since it is not a string.")}));var a="undefined"!=typeof Buffer?Buffer.alloc(0):null;setTimeout((function(){e.removeListener("message",i),t.forEach((function(t){return e.unsubscribe("".concat(t,"/#"))}));var r=o.length;console.log("clearing ".concat(r," retained messages from ").concat(t)),o.forEach((function(t){e.publish(t,a,{retain:!0})})),n&&n(r)}),r)},isSubTopicOf:function(e,t){var n=T(t),r=T(e);return j(n,r)&&n.length<r.length},clone:function(e){return JSON.parse(JSON.stringify(e))},setFromPath:function e(t,n,r){if(0==n.length)return t;var o=n.shift();0==n.length?t[o]=r:(t[o]||(t[o]={}),e(t[o],n,r))},forMatchIterator:O,encodeTopicElement:S,decodeTopicElement:E,constants:d,visit:function e(t,n,r){var o;t&&(r(t),null===(o=t[n])||void 0===o||o.forEach((function(t){return e(t,n,r)})))},wait:function(e){return new Promise((function(t){setTimeout(t,e)}))}}},499:e=>{e.exports={rosReleases:{kinetic:{rosVersion:1,ubuntuCodename:"xenial"},melodic:{rosVersion:1,ubuntuCodename:"bionic"},noetic:{rosVersion:1,ubuntuCodename:"focal"},rolling:{rosVersion:2},humble:{rosVersion:2},galactic:{rosVersion:2},foxy:{rosVersion:2},eloquent:{rosVersion:2},dashing:{rosVersion:2}}}},368:(e,t,n)=>{"use strict";n.r(t),n.d(t,{MqttSync:()=>a,decodeJWT:()=>u,fetchJson:()=>s,parseCookie:()=>c});var r=n(362),o={};for(const e in r)["default","MqttSync","decodeJWT","parseCookie","fetchJson"].indexOf(e)<0&&(o[e]=()=>r[e]);n.d(t,o);var i=n(890),a=n.n(i)(),u=function(e){return JSON.parse(atob(e.split(".")[1]))},c=function(e){return e.split(";").map((function(e){return e.split("=")})).reduce((function(e,t){return e[decodeURIComponent(t[0].trim())]=t[1]&&decodeURIComponent(t[1].trim()),e}),{})},s=function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};fetch(e,{method:n.method||(n.body?"post":"get"),mode:"cors",cache:"no-cache",headers:{"Content-Type":"application/json"},redirect:"follow",referrerPolicy:"no-referrer",body:n.body?JSON.stringify(n.body):void 0}).then((function(t){if(!t.ok)throw new Error("fetching ".concat(e," failed: ").concat(t.status," ").concat(t.statusText));return t.json()})).then((function(e){return t(null,e)})).catch((function(e){return t("error: ".concat(e))}))}},442:(e,t,n)=>{"use strict";n.d(t,{H:()=>d});var r=n(689),o=n.n(r),i=n(368),a=n(517),u=n.n(a);const c=require("mqtt-browser");var s=n.n(c);function l(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,i=[],a=!0,u=!1;try{for(n=n.call(e);!(a=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{a||null==n.return||n.return()}finally{if(u)throw o}}return i}}(e,t)||function(e,t){if(e){if("string"==typeof e)return f(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?f(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function f(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var h=n(890),p=(0,i.getLogger)("utils-web/hooks"),d=function(e){var t=e.jwt,n=e.id,a=e.mqttUrl,c=l((0,r.useState)("connecting"),2),f=c[0],d=c[1],b=l((0,r.useState)(),2),y=b[0],v=b[1],g=l((0,r.useState)({}),2),m=g[0],w=g[1];return(0,r.useEffect)((function(){var e=(0,i.decodeJWT)(t),r=s().connect(a,{username:JSON.stringify({id:n,payload:e}),password:t});return r.on("connect",(function(){p.debug("connected");var e=new h({mqttClient:r,ignoreRetain:!0});v(e),d("connected"),e.data.subscribe(u().debounce((function(){return w((0,i.clone)(e.data.get()))}),100))})),r.on("error",(function(e){p.error(e),d("error: ".concat(e))})),function(){p.info("cleaning up useMQTTSync"),y&&y.beforeDisconnect?(y.beforeDisconnect(),y.waitForHeartbeatOnce((function(){return r.end()}))):r.end()}}),[t,n]),{status:f,ready:"connected"==f,StatusComponent:function(){return o().createElement("div",null,f)},mqttSync:y,data:m}}},335:e=>{function t(e,t){if(e){if("string"==typeof e)return n(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?n(e,t):void 0}}function n(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}e.exports=function(e){if(!e.attributes)return{};var r,o,i,a={},u=(i=e.attributes,function(e){if(Array.isArray(e))return n(e)}(i)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(i)||t(i)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()).map((function(e){return function(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}({},e.name,e.value)})),c=function(e,n){var r="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!r){if(Array.isArray(e)||(r=t(e))){r&&(e=r);var o=0,i=function(){};return{s:i,n:function(){return o>=e.length?{done:!0}:{done:!1,value:e[o++]}},e:function(e){throw e},f:i}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,u=!0,c=!1;return{s:function(){r=r.call(e)},n:function(){var e=r.next();return u=e.done,e},e:function(e){c=!0,a=e},f:function(){try{u||null==r.return||r.return()}finally{if(c)throw a}}}}(u);try{for(c.s();!(o=c.n()).done;){r=o.value;var s=Object.keys(r)[0];a[s.replace(/-([a-z])/g,(function(e){return e[1].toUpperCase()}))]=r[s]}}catch(e){c.e(e)}finally{c.f()}return a}},899:(e,t,n)=>{e.exports=function(){try{return n(962).styleElements}catch(e){return[]}}},271:(e,t,n)=>{function r(e){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},r(e)}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function a(e,t,n){return t&&i(e.prototype,t),n&&i(e,n),Object.defineProperty(e,"prototype",{writable:!1}),e}function u(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&p(e,t)}function c(e){var t=h();return function(){var n,r=d(e);if(t){var o=d(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return s(this,n)}}function s(e,t){if(t&&("object"===r(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}function l(e){var t="function"==typeof Map?new Map:void 0;return l=function(e){if(null===e||(n=e,-1===Function.toString.call(n).indexOf("[native code]")))return e;var n;if("function"!=typeof e)throw new TypeError("Super expression must either be null or a function");if(void 0!==t){if(t.has(e))return t.get(e);t.set(e,r)}function r(){return f(e,arguments,d(this).constructor)}return r.prototype=Object.create(e.prototype,{constructor:{value:r,enumerable:!1,writable:!0,configurable:!0}}),p(r,e)},l(e)}function f(e,t,n){return f=h()?Reflect.construct:function(e,t,n){var r=[null];r.push.apply(r,t);var o=new(Function.bind.apply(e,r));return n&&p(o,n.prototype),o},f.apply(null,arguments)}function h(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}function p(e,t){return p=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},p(e,t)}function d(e){return d=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},d(e)}var b=n(689),y=n(405),v=n(430),g=n(899),m=n(335);n(622),n(268),e.exports={create:function(e,t){var n,r=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:[],s={attachedCallback:"webComponentAttached",connectedCallback:"webComponentConnected",disconnectedCallback:"webComponentDisconnected",attributeChangedCallback:"webComponentAttributeChanged",adoptedCallback:"webComponentAdopted"};function f(e){n.webComponentConstructed&&n.webComponentConstructed.apply(n,[e])}function h(e,t){var r=t||[],o=s[e];o&&n&&n[o]&&n[o].apply(n,r)}var p=function(t){u(l,t);var s=c(l);function l(){return o(this,l),s.apply(this,arguments)}return a(l,[{key:"connectedCallback",value:function(){var t=this,o=t;if(r){var i=t.attachShadow({mode:"open"});o=document.createElement("div"),g().forEach((function(e){i.appendChild(e.cloneNode(i))})),i.appendChild(o),v(i)}y.render(b.cloneElement(e,m(t)),o,(function(){n=this,f(t),h("connectedCallback")}))}},{key:"disconnectedCallback",value:function(){h("disconnectedCallback")}},{key:"attributeChangedCallback",value:function(e,t,n,r){h("attributeChangedCallback",[e,t,n,r])}},{key:"adoptedCallback",value:function(e,t){h("adoptedCallback",[e,t])}}],[{key:"observedAttributes",get:function(){return i}}]),l}(l(HTMLElement));customElements.define(t,p)}}},11:(e,t,n)=>{"use strict";n.d(t,{EK:()=>T,SV:()=>q,ZM:()=>C,U5:()=>k,B7:()=>P,ax:()=>x,eZ:()=>_});var r=n(689),o=n.n(r);const i=require("react-bootstrap");var a=n(271),u=n.n(a);function c(e){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},c(e)}function s(){return s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s.apply(this,arguments)}function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function f(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function h(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function p(e,t,n){return t&&h(e.prototype,t),n&&h(e,n),Object.defineProperty(e,"prototype",{writable:!1}),e}function d(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&b(e,t)}function b(e,t){return b=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},b(e,t)}function y(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,r=m(e);if(t){var o=m(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return v(this,n)}}function v(e,t){if(t&&("object"===c(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return g(e)}function g(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function m(e){return m=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},m(e)}function w(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,i=[],a=!0,u=!1;try{for(n=n.call(e);!(a=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{a||null==n.return||n.return()}finally{if(u)throw o}}return i}}(e,t)||function(e,t){if(e){if("string"==typeof e)return O(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?O(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function O(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}n(368);var S={badge:{width:"4em"},code:{color:"#700",borderLeft:"3px solid #aaa",padding:"0.5em 0px 0.5em 2em",backgroundColor:"#f0f0f0",borderRadius:"4px",marginTop:"0.5em"},inlineCode:{color:"#700",margin:"0px 0.5em 0px 0.5em"}},E=[o().createElement(i.Badge,{bg:"success",style:S.badge},"OK"),o().createElement(i.Badge,{bg:"warning",style:S.badge},"Warn"),o().createElement(i.Badge,{bg:"danger",style:S.badge},"Error"),o().createElement(i.Badge,{bg:"secondary",style:S.badge},"Stale")],k=function(e){var t=e.level;return E[t]||o().createElement("span",null,t)},T=function(e){var t=e.children;return o().createElement("pre",{style:S.code},t)},C=function(e){var t=e.children;return o().createElement("tt",{style:S.inlineCode},t)},j={},x=o().createContext({}),P=function(e){var t=e.duration,n=e.onTimeout,a=e.onStart,u=e.setOnDisconnect,c=e.children;t=t||60;var s=w((0,r.useState)(t),2),l=s[0],f=s[1],h=w((0,r.useState)(!1),2),p=h[0],d=h[1],b=(0,r.useMemo)((function(){return Math.random().toString(36).slice(2)}),[]),y=function(){console.log("stopping timer for",b),n&&setTimeout(n,1),clearInterval(j[b]),j[b]=null,d(!1)};(0,r.useEffect)((function(){var e;l>0&&!p&&(e=j[b],console.log(e,j,l),!e&&l>0&&(d(!0),j[b]=setInterval((function(){return f((function(e){if(--e>0)return e;y()}))}),1e3),a&&setTimeout(a,1)))}),[l]),(0,r.useEffect)((function(){return y}),[]),u&&u((function(){y()}));var v=function(){return f(t)};return o().createElement(x.Provider,{value:{reset:v,duration:t,timer:l}},l>0?o().createElement("div",null,c,l<60&&o().createElement("div",null,"Timeout in: ",l," seconds")):o().createElement("div",null,"Timed out. ",o().createElement(i.Button,{onClick:v},"Resume")))},q=function(e){d(n,e);var t=y(n);function n(e){var r;return f(this,n),(r=t.call(this,e)).state={hasError:!1},r}return p(n,[{key:"componentDidCatch",value:function(e,t){console.warn("ErrorBoundary caught:",e,t)}},{key:"render",value:function(){return this.state.hasError?o().createElement("div",null,this.props.message||"Something went wrong here."):this.props.children}}],[{key:"getDerivedStateFromError",value:function(e){return{hasError:!0}}}]),n}(o().Component),_=function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[],r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"0.0.0",i=arguments.length>4&&void 0!==arguments[4]?arguments[4]:{},a=function(n){d(u,n);var a=y(u);function u(){var e;f(this,u);for(var t=arguments.length,n=new Array(t),r=0;r<t;r++)n[r]=arguments[r];return l(g(e=a.call.apply(a,[this].concat(n))),"onDisconnect",null),l(g(e),"state",{}),e}return p(u,[{key:"setOnDisconnect",value:function(e){this.onDisconnect=e}},{key:"webComponentDisconnected",value:function(){this.onDisconnect&&this.onDisconnect(),this.setState({_disconnected:!0})}},{key:"webComponentAttributeChanged",value:function(e,t,n){var r=this.state;r[e]=n,this.setState(r)}},{key:"render",value:function(){var n=i.stylesheets||["https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"];return o().createElement("div",{id:"cap-".concat(t,"-").concat(r)},o().createElement("style",null,n.map((function(e){return"@import url(".concat(e,");")}))),!this.state._disconnected&&o().createElement(e,s({},this.state,this.props,{setOnDisconnect:this.setOnDisconnect.bind(this)})))}}]),u}(o().Component);u().create(o().createElement(a,null),t,!1,n)}},268:e=>{"use strict";e.exports=require("@webcomponents/custom-elements")},622:e=>{"use strict";e.exports=require("@webcomponents/shadydom")},22:e=>{"use strict";e.exports=require("chalk")},517:e=>{"use strict";e.exports=require("lodash")},848:e=>{"use strict";e.exports=require("lodash/forEach")},712:e=>{"use strict";e.exports=require("lodash/get")},699:e=>{"use strict";e.exports=require("lodash/isEmpty")},113:e=>{"use strict";e.exports=require("lodash/isEqual")},452:e=>{"use strict";e.exports=require("lodash/isPlainObject")},707:e=>{"use strict";e.exports=require("lodash/map")},831:e=>{"use strict";e.exports=require("lodash/merge")},298:e=>{"use strict";e.exports=require("lodash/set")},305:e=>{"use strict";e.exports=require("lodash/unset")},316:e=>{"use strict";e.exports=require("loglevel")},689:e=>{"use strict";e.exports=require("react")},405:e=>{"use strict";e.exports=require("react-dom")},430:e=>{"use strict";e.exports=require("react-shadow-dom-retarget-events")},962:e=>{"use strict";e.exports=require("react-web-component-style-loader/exports")},13:e=>{"use strict";e.exports=require("semver/functions/compare")}},t={};function n(r){var o=t[r];if(void 0!==o)return o.exports;var i=t[r]={exports:{}};return e[r](i,i.exports,n),i.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var r={};(()=>{"use strict";n.r(r),n.d(r,{Code:()=>e.EK,ErrorBoundary:()=>e.SV,InlineCode:()=>e.ZM,LevelBadge:()=>e.U5,Timer:()=>e.B7,TimerContext:()=>e.ax,createWebComponent:()=>e.eZ,useMqttSync:()=>t.H});var e=n(11),t=n(442),o=n(368),i={};for(const e in o)["default","Code","ErrorBoundary","InlineCode","LevelBadge","Timer","TimerContext","createWebComponent","useMqttSync"].indexOf(e)<0&&(i[e]=()=>o[e]);n.d(r,i)})();var o=exports;for(var i in r)o[i]=r[i];r.__esModule&&Object.defineProperty(o,"__esModule",{value:!0})})();
+(()=>{var e={890:(e,t,n)=>{"use strict";function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function o(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(e){return a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},a(e)}var u=n(362),c=u.DataCache,s=u.mqttParsePayload,l=u.pathMatch,f=u.topicToPath,h=u.pathToTopic,p=u.toFlatObject,d=u.getLogger,b=u.mergeVersions,y=u.parseMQTTTopic,v=u.isSubTopicOf,g=u.versionCompare,m=u.encodeTopicElement,w=n(517),O=d("MqttSync"),S="$SYS/broker/uptime",E=function(){},k=function(e){return e.endsWith("/#")?e:e.endsWith("/")?e.concat("#"):e.concat("/#")},C=function(e){return e.replace(/\/\//g,"/")},T=function(){function e(t){var n=this,r=t.mqttClient,o=t.onChange,a=t.ignoreRetain,u=t.migrate,l=t.onReady,p=t.sliceTopic;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),i(this,"data",new c),i(this,"subscribedPaths",{}),i(this,"publishedPaths",{}),i(this,"publishedMessages",{}),i(this,"publishQueue",new Map),i(this,"heartbeatWaitersOnce",[]),i(this,"heartbeats",0),i(this,"beforeDisconnectHooks",[]),this.mqtt=r,this.mqtt.on("message",(function(e,t,r){var i=t&&t.toString();if(O.debug("got message",e,i.slice(0,180),i.length>180?"... (".concat(i.length," bytes)"):"",r.retain),e==S)n.heartbeats>0&&(n.heartbeatWaitersOnce.forEach((function(e){return e()})),n.heartbeatWaitersOnce=[]),1==n.heartbeats&&!u&&l&&l(),n.heartbeats++;else if(r.retain||a){O.debug("processing message",e),p&&(e=h(f(e).slice(p)));var c=s(t);if(n.isPublished(e))n.publishedMessages[e]=c,n.data.update(e,c,{external:!0});else if(n.isSubscribed(e)){O.debug("applying received update",e);var d=n.data.update(e,c);o&&Object.keys(d).length>0&&o(d)}}})),this.mqtt.subscribe(S,{rap:!0},O.debug),(null==u?void 0:u.length)>0&&this.migrate(u,(function(){O.debug("done migrating",l),l&&n.waitForHeartbeatOnce(l)}))}var t,n;return t=e,n=[{key:"publishAtLevel",value:function(e,t,n){var r=this;O.debug("publishingAtLevel ".concat(n),e,t),n>0?w.forEach(t,(function(t,o){var i="".concat(e,"/").concat(m(o));O.debug("publishing ".concat(i)),r.publishAtLevel(i,t,n-1)})):this.mqtt.publish(e,JSON.stringify(t),{retain:!0},(function(e){e&&O.warn("Error when publishing migration result",e)}))}},{key:"migrate",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0,r=e.length;if(0!=r){var o=function(){return 0==--r&&n&&n()};e.forEach((function(e){var n=e.topic,r=e.newVersion,i=e.transform,a=void 0===i?void 0:i,u=e.flat,c=void 0!==u&&u,s=e.level,l=void 0===s?0:s;O.debug("migrating",n,r);var d=y(n),v=d.organization,m=d.device,S=d.capability,E=d.sub,k="/".concat(v,"/").concat(m,"/").concat(S),T=0==E.length?"/#":h(E),j="".concat(k,"/+").concat(T);t.subscribe(j,(function(e){if(e)return O.warn("Error during migration",e),void o();t.waitForHeartbeatOnce((function(){O.debug("got heartbeat",n,j);var e=t.data.getByTopic(k);if(!e)return t.unsubscribe(j),void o();var i=b(e,T,{maxVersion:r}),u=w.get(i,f(T)),s=a?a(u):u,d=C("".concat(k,"/").concat(r,"/").concat(T));if(O.debug("publishing merged",d),c){var y=p(s),v=f(d);w.forEach(y,(function(e,n){var r=h(v.concat(f(n)));t.mqtt.publish(r,JSON.stringify(e),{retain:!0},(function(e){e&&O.warn("Error when publishing migration result for ".concat(n),e)}))}))}else t.publishAtLevel(d,s,l);t.unsubscribe(j),t.waitForHeartbeatOnce((function(){var n=Object.keys(e).filter((function(e){return g(e,r)<0})).map((function(e){return C("".concat(k,"/").concat(e,"/").concat(T))}));O.debug({prefixesToClear:n}),t.clear(n),o()}))}))}))}))}else n&&n()}},{key:"clear",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0,r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},o=[],i=function(t){e.forEach((function(e){return l("".concat(e,"/#"),t)&&(!r.filter||r.filter(t))&&o.push(t)}))};this.mqtt.on("message",i),e.forEach((function(e){"string"==typeof e?t.mqtt.subscribe("".concat(e,"/#")):O.warn("Ignoring",e,"since it is not a string.")}));var a="undefined"!=typeof Buffer?Buffer.alloc(0):null;this.waitForHeartbeatOnce((function(){t.mqtt.removeListener("message",i),e.forEach((function(e){return t.mqtt.unsubscribe("".concat(e,"/#"))}));var r=o.length;O.debug("clearing ".concat(r," retained messages from ").concat(e)),o.forEach((function(e){t.mqtt.publish(e,a,{retain:!0})})),n&&n(r)}))}},{key:"waitForHeartbeatOnce",value:function(e){var t=this;setTimeout((function(){return t.heartbeatWaitersOnce.push(e)}),1)}},{key:"isSubscribed",value:function(e){return Object.keys(this.subscribedPaths).some((function(t){return l(t,e)}))}},{key:"isPublished",value:function(e){var t=this;return Object.keys(this.publishedPaths).some((function(n){return l(n,e)&&!t.publishedPaths[n].atomic}))}},{key:"subscribe",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:E;if(e=k(e),this.subscribedPaths[e])return O.debug("already subscribed to",e),void n();this.mqtt.subscribe(e,{rap:!0},(function(r,o){O.debug("subscribe",e,"granted:",o),o&&o.some((function(t){return t.topic==e&&t.qos<128}))?(t.subscribedPaths[e]=1,n(null)):n("not permitted to subscribe to topic ".concat(e,", ").concat(JSON.stringify(o)))}))}},{key:"unsubscribe",value:function(e){this.subscribedPaths[e]&&(this.mqtt.unsubscribe(e),delete this.subscribedPaths[e])}},{key:"_actuallyPublish",value:function(e,t){return this.mqtt.connected?(O.debug("actually publishing",e),this.mqtt.publish(e,null==t?null:JSON.stringify(t),{retain:!0}),!0):(O.warn("not connected, not publishing",e),!1)}},{key:"_processQueue_rec",value:function(e){var t=this;if(this.publishQueue.size>0){var n=function(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,i=[],a=!0,u=!1;try{for(n=n.call(e);!(a=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{a||null==n.return||n.return()}finally{if(u)throw o}}return i}}(e,t)||function(e,t){if(e){if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}(this.publishQueue.entries().next().value,2),o=n[0],i=n[1];this._actuallyPublish(o,i)?(this.publishQueue.delete(o),this._processQueue_rec(e)):setTimeout((function(){return t._processQueue_rec(e)}),5e3)}else e()}},{key:"_processQueue",value:function(){var e=this;this._processing||(this._processing=!0,this._processQueue_rec((function(){return e._processing=!1})))}},{key:"setThrottle",value:function(e){this._processQueueThrottled=w.throttle(this._processQueue.bind(this),e)}},{key:"clearThrottle",value:function(){delete this._processQueueThrottled}},{key:"addToQueue",value:function(e,t){this.publishQueue.set(e,t)}},{key:"_enqueue",value:function(e,t){var n;O.debug("enqueuing",e),this.addToQueue(e,t),this._processQueueThrottled?this._processQueueThrottled():this._processQueue(),null==t?delete this.publishedMessages[e]:this.publishedMessages[e]="object"==a(n=t)?JSON.parse(JSON.stringify(n)):n}},{key:"publish",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{atomic:!1};return e=k(e),!w.isEqual(this.publishedPaths[e],n)&&(this.publishedPaths[e]=n,n.atomic?(this.data.subscribePath(e,(function(n,r,o,i){if(null==i||!i.external){O.debug("processing change (atomic)",r,e);var a=e.slice(0,e.length-2),u=h(f(r).slice(0,f(a).length));t._enqueue(u,t.data.getByTopic(u))}})),!0):(this.mqtt.subscribe(e),void this.data.subscribePath(e,(function(e,n,r,o){if(null==o||!o.external)return O.debug("processing change",n),w.each(t.publishedMessages,(function(e,r){if(O.trace("oldKey",r),r==n)return!0;if(v(r,n)&&t._enqueue(r,null),v(n,r)){t._enqueue(r,null);var o=p(e);w.each(o,(function(e,n){var o="".concat(r).concat(n);t._enqueue(o,e)}))}})),t._enqueue(n,e),!0}))))}},{key:"beforeDisconnect",value:function(){var e=this;this.beforeDisconnectHooks.forEach((function(t){return t(e)}))}},{key:"onBeforeDisconnect",value:function(e){this.beforeDisconnectHooks.push(e)}}],n&&o(t.prototype,n),Object.defineProperty(t,"prototype",{writable:!1}),e}();e.exports=T},362:(e,t,n)=>{function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t,n){!function(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")}(e,t),t.set(e,n)}function a(e,t){return function(e,t){return t.get?t.get.call(e):t.value}(e,c(e,t,"get"))}function u(e,t,n){return function(e,t,n){if(t.set)t.set.call(e,n);else{if(!t.writable)throw new TypeError("attempted to set read only private field");t.value=n}}(e,c(e,t,"set"),n),n}function c(e,t,n){if(!t.has(e))throw new TypeError("attempted to "+n+" private field on non-instance");return t.get(e)}function s(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var l=n(13),f={get:n(712),set:n(298),unset:n(305),forEach:n(848),map:n(707),isEmpty:n(699),eq:n(113),isPlainObject:n(452),merge:n(831)},h=n(316),p=n(22),d=n(499);h.setAll=function(e){return Object.values(h.getLoggers()).forEach((function(t){return t.setLevel(e)}))};var b={warn:p.yellow,error:p.red,info:p.green,debug:p.gray},y=h.methodFactory;h.methodFactory=function(e,t,n){var r=y(e,t,n);if("undefined"!=typeof window){var o="".concat(n," ").concat(e);return function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];return r.apply(void 0,["[".concat(o,"]")].concat(t))}}var i,a="".concat(n," ").concat(b[i=e]?b[i](i):i);return function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];return r.apply(void 0,["[".concat(p.blue((new Date).toISOString())," ").concat(a,"]")].concat(t))}};var v=h.getLogger,g=function e(t,n){if(n&&0!=n.length){f.unset(t,n);var r=n.slice(0,-1),o=0==r.length?t:f.get(t,r);return f.isEmpty(o)?e(t,r):n}},m=function e(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[],r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return f.forEach(t,(function(t,o){var i=n.concat(String(o));(f.isPlainObject(t)||t instanceof Array)&&null!==t?e(t,i,r):r[k(i)]=t})),r},w=function e(t,n){if(0!=n.length){var r=n[0];if(r)for(var o in t)o==r||"*"==r||r.startsWith("+")?e(t[o],n.slice(1)):delete t[o]}},O=function e(t,n,r){var o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:[],i=arguments.length>4&&void 0!==arguments[4]?arguments[4]:{};if(0!=n.length&&"#"!=n[0]){var a=n[0];if(a)for(var u in t)if(u==a||"*"==a||a.startsWith("+")){var c=a.startsWith("+")&&a.length>1?Object.assign({},i,s({},a.slice(1),u)):i;e(t[u],n.slice(1),r,o.concat([u]),c)}}else r(t,o,i)},S=function(e){return e.replace(/%/g,"%25").replace(/\//g,"%2F")},E=function(e){return e.replace(/%25/g,"%").replace(/%2F/g,"/")},k=function(e){return"/".concat(e.map((function(e){return e.startsWith("+")?"+":e})).map(S).join("/"))},C=function(e){var t=e.split("/").map(E);return t.length>0&&0==t[0].length&&t.shift(),t.length>0&&0==t.at(-1).length&&t.pop(),t},T=function(e,t){return function e(t,n){if(0==t.length)return!0;if("#"==t[0][0])return!0;if(0==n.length)return!0;if(t[0]==n[0])return e(t.slice(1),n.slice(1));if("+"==t[0][0]){var r=e(t.slice(1),n.slice(1));return r&&Object.assign(s({},t[0].slice(1),n[0]),r)}return!1}(C(e),C(t))},j=function e(t,n){return 0==t.length||t[0]==n[0]&&e(t.slice(1),n.slice(1))},x=new WeakMap,P=new WeakMap,q=new WeakMap,_=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};r(this,e),i(this,x,{writable:!0,value:{}}),i(this,P,{writable:!0,value:[]}),i(this,q,{writable:!0,value:[]}),u(this,x,t)}var t,n;return t=e,n=[{key:"updateFromArray",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},r=f.get(a(this,x),e);if(null==t){if(null==r)return{};g(a(this,x),e)}else{if(f.eq(r,t))return{};f.set(a(this,x),e,t)}var o,i=k(e),u=s({},i,t);if(t instanceof Object){var c=m(t);o={},f.forEach(c,(function(e,t){o["".concat(i).concat(t)]=e}))}else o=u;return a(this,P).forEach((function(e){return e(u,n)})),a(this,q).forEach((function(e){return e(o,n)})),o}},{key:"update",value:function(e,t,n){if("string"==typeof e)return this.updateFromTopic(e,t,n);if(e instanceof Array)return this.updateFromArray(e,t,n);throw new Error("unrecognized path expression")}},{key:"updateFromTopic",value:function(e,t,n){return this.updateFromArray(C(e),t,n)}},{key:"updateFromModifier",value:function(e,t){var n=this;return f.map(e,(function(e,r){return n.updateFromTopic(r,e,t)}))}},{key:"subscribe",value:function(e){e instanceof Function?a(this,P).push(e):console.warn("DataCache.subscribe expects a function as argument. Did you mean to use subscribePath?")}},{key:"subscribePath",value:function(e,t){a(this,P).push((function(n,r){f.forEach(n,(function(n,o){var i=T(e,o);i&&t(n,o,i,r)}))}))}},{key:"subscribePathFlat",value:function(e,t){a(this,q).push((function(n,r){f.forEach(n,(function(n,o){var i=T(e,o);i&&t(n,o,i,r)}))}))}},{key:"unsubscribe",value:function(e){u(this,P,a(this,P).filter((function(t){return t!=e})))}},{key:"get",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[];return 0==e.length?a(this,x):f.get(a(this,x),e)}},{key:"getByTopic",value:function(e){return this.get(C(e))}},{key:"filter",value:function(e){var t=JSON.parse(JSON.stringify(this.get()));return w(t,e),t}},{key:"filterByTopic",value:function(e){return this.filter(C(e))}},{key:"forMatch",value:function(e,t){var n=C(e);this.forPathMatch(n,t)}},{key:"forPathMatch",value:function(e,t){O(this.get(),e,t)}}],n&&o(t.prototype,n),Object.defineProperty(t,"prototype",{writable:!1}),e}(),A=function(e,t){return function e(t,n){return 0==n.length&&0==t.length||!(0==n.length&&t.length>0)&&("#"==n[0]||!(n.length>0&&0==t.length)&&("+"==n[0]||n[0]==t[0])&&e(t.slice(1),n.slice(1)))}(C(e),C(t))},M=l;e.exports={parseMQTTUsername:function(e){var t=e.split(":");return{organization:t[0],client:t[1],sub:t.slice(2)}},parseMQTTTopic:function(e){var t=C(e);return{organization:t[0],device:t[1],capabilityScope:t[2],capabilityName:t[3],capability:"".concat(t[2],"/").concat(t[3]),version:t[4],sub:t.slice(5)}},updateObject:function(e,t){return f.forEach(t,(function(t,n){var r=C(n);null==t?g(e,r):f.set(e,r,t)})),e},DataCache:_,pathToTopic:k,topicToPath:C,toFlatObject:m,mqttTopicMatch:A,pathMatch:T,mqttParsePayload:function(e){return 0==e.length?null:JSON.parse(e.toString("utf-8"))},getRandomId:function(){return Math.random().toString(36).slice(2)},versionCompare:M,loglevel:h,getLogger:v,mergeVersions:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(!e)return t?f.set({},t,e):e;var r=Object.keys(e).filter((function(e){return(!n.maxVersion||M(e,n.maxVersion)<=0)&&(!n.minVersion||M(n.minVersion,e)<=0)})).sort(M),o={},i=t&&C(t);return r.forEach((function(t){var n=i?f.get(e[t],i):e[t];f.merge(o,n)})),i?f.set({},i,o):o},mqttClearRetained:function(e,t,n){var r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:1e3,o=[],i=function(e){t.forEach((function(t){return A(e,"".concat(t,"/#"))&&o.push(e)}))};e.on("message",i),t.forEach((function(t){"string"==typeof t?e.subscribe("".concat(t,"/#")):console.warn("Ignoring",t,"since it is not a string.")}));var a="undefined"!=typeof Buffer?Buffer.alloc(0):null;setTimeout((function(){e.removeListener("message",i),t.forEach((function(t){return e.unsubscribe("".concat(t,"/#"))}));var r=o.length;console.log("clearing ".concat(r," retained messages from ").concat(t)),o.forEach((function(t){e.publish(t,a,{retain:!0})})),n&&n(r)}),r)},isSubTopicOf:function(e,t){var n=C(t),r=C(e);return j(n,r)&&n.length<r.length},clone:function(e){return JSON.parse(JSON.stringify(e))},setFromPath:function e(t,n,r){if(0==n.length)return t;var o=n.shift();0==n.length?t[o]=r:(t[o]||(t[o]={}),e(t[o],n,r))},forMatchIterator:O,encodeTopicElement:S,decodeTopicElement:E,constants:d,visit:function e(t,n,r){var o;t&&(r(t),null===(o=t[n])||void 0===o||o.forEach((function(t){return e(t,n,r)})))},wait:function(e){return new Promise((function(t){setTimeout(t,e)}))}}},499:e=>{e.exports={rosReleases:{kinetic:{rosVersion:1,ubuntuCodename:"xenial"},melodic:{rosVersion:1,ubuntuCodename:"bionic"},noetic:{rosVersion:1,ubuntuCodename:"focal"},rolling:{rosVersion:2},humble:{rosVersion:2},galactic:{rosVersion:2},foxy:{rosVersion:2},eloquent:{rosVersion:2},dashing:{rosVersion:2}}}},368:(e,t,n)=>{"use strict";n.r(t),n.d(t,{MqttSync:()=>a,decodeJWT:()=>u,fetchJson:()=>s,parseCookie:()=>c});var r=n(362),o={};for(const e in r)["default","MqttSync","decodeJWT","parseCookie","fetchJson"].indexOf(e)<0&&(o[e]=()=>r[e]);n.d(t,o);var i=n(890),a=n.n(i)(),u=function(e){return JSON.parse(atob(e.split(".")[1]))},c=function(e){return e.split(";").map((function(e){return e.split("=")})).reduce((function(e,t){return e[decodeURIComponent(t[0].trim())]=t[1]&&decodeURIComponent(t[1].trim()),e}),{})},s=function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};fetch(e,{method:n.method||(n.body?"post":"get"),mode:"cors",cache:"no-cache",headers:{"Content-Type":"application/json"},redirect:"follow",referrerPolicy:"no-referrer",body:n.body?JSON.stringify(n.body):void 0}).then((function(t){if(!t.ok)throw new Error("fetching ".concat(e," failed: ").concat(t.status," ").concat(t.statusText));return t.json()})).then((function(e){return t(null,e)})).catch((function(e){return t("error: ".concat(e))}))}},442:(e,t,n)=>{"use strict";n.d(t,{H:()=>d});var r=n(689),o=n.n(r),i=n(368),a=n(517),u=n.n(a);const c=require("mqtt-browser");var s=n.n(c);function l(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,i=[],a=!0,u=!1;try{for(n=n.call(e);!(a=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{a||null==n.return||n.return()}finally{if(u)throw o}}return i}}(e,t)||function(e,t){if(e){if("string"==typeof e)return f(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?f(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function f(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var h=n(890),p=(0,i.getLogger)("utils-web/hooks"),d=function(e){var t=e.jwt,n=e.id,a=e.mqttUrl,c=l((0,r.useState)("connecting"),2),f=c[0],d=c[1],b=l((0,r.useState)(),2),y=b[0],v=b[1],g=l((0,r.useState)({}),2),m=g[0],w=g[1];return(0,r.useEffect)((function(){var e=(0,i.decodeJWT)(t),r=s().connect(a,{username:JSON.stringify({id:n,payload:e}),password:t});return r.on("connect",(function(){p.debug("connected");var e=new h({mqttClient:r,ignoreRetain:!0});v(e),d("connected"),e.data.subscribe(u().debounce((function(){return w((0,i.clone)(e.data.get()))}),100))})),r.on("error",(function(e){p.error(e),d("error: ".concat(e))})),function(){p.info("cleaning up useMQTTSync"),y&&y.beforeDisconnect?(y.beforeDisconnect(),y.waitForHeartbeatOnce((function(){return r.end()}))):r.end()}}),[t,n]),{status:f,ready:"connected"==f,StatusComponent:function(){return o().createElement("div",null,f)},mqttSync:y,data:m}}},335:e=>{function t(e,t){if(e){if("string"==typeof e)return n(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?n(e,t):void 0}}function n(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}e.exports=function(e){if(!e.attributes)return{};var r,o,i,a={},u=(i=e.attributes,function(e){if(Array.isArray(e))return n(e)}(i)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(i)||t(i)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()).map((function(e){return function(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}({},e.name,e.value)})),c=function(e,n){var r="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!r){if(Array.isArray(e)||(r=t(e))){r&&(e=r);var o=0,i=function(){};return{s:i,n:function(){return o>=e.length?{done:!0}:{done:!1,value:e[o++]}},e:function(e){throw e},f:i}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,u=!0,c=!1;return{s:function(){r=r.call(e)},n:function(){var e=r.next();return u=e.done,e},e:function(e){c=!0,a=e},f:function(){try{u||null==r.return||r.return()}finally{if(c)throw a}}}}(u);try{for(c.s();!(o=c.n()).done;){r=o.value;var s=Object.keys(r)[0];a[s.replace(/-([a-z])/g,(function(e){return e[1].toUpperCase()}))]=r[s]}}catch(e){c.e(e)}finally{c.f()}return a}},899:(e,t,n)=>{e.exports=function(){try{return n(962).styleElements}catch(e){return[]}}},271:(e,t,n)=>{function r(e){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},r(e)}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function a(e,t,n){return t&&i(e.prototype,t),n&&i(e,n),Object.defineProperty(e,"prototype",{writable:!1}),e}function u(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&p(e,t)}function c(e){var t=h();return function(){var n,r=d(e);if(t){var o=d(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return s(this,n)}}function s(e,t){if(t&&("object"===r(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}function l(e){var t="function"==typeof Map?new Map:void 0;return l=function(e){if(null===e||(n=e,-1===Function.toString.call(n).indexOf("[native code]")))return e;var n;if("function"!=typeof e)throw new TypeError("Super expression must either be null or a function");if(void 0!==t){if(t.has(e))return t.get(e);t.set(e,r)}function r(){return f(e,arguments,d(this).constructor)}return r.prototype=Object.create(e.prototype,{constructor:{value:r,enumerable:!1,writable:!0,configurable:!0}}),p(r,e)},l(e)}function f(e,t,n){return f=h()?Reflect.construct:function(e,t,n){var r=[null];r.push.apply(r,t);var o=new(Function.bind.apply(e,r));return n&&p(o,n.prototype),o},f.apply(null,arguments)}function h(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}function p(e,t){return p=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},p(e,t)}function d(e){return d=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},d(e)}var b=n(689),y=n(405),v=n(430),g=n(899),m=n(335);n(622),n(268),e.exports={create:function(e,t){var n,r=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:[],s=arguments.length>4&&void 0!==arguments[4]?arguments[4]:void 0,f={attachedCallback:"webComponentAttached",connectedCallback:"webComponentConnected",disconnectedCallback:"webComponentDisconnected",attributeChangedCallback:"webComponentAttributeChanged",adoptedCallback:"webComponentAdopted"};function h(e){n.webComponentConstructed&&n.webComponentConstructed.apply(n,[e])}function p(e,t){var r=t||[],o=f[e];o&&n&&n[o]&&n[o].apply(n,r)}var d=function(t){u(f,t);var l=c(f);function f(){return o(this,f),l.apply(this,arguments)}return a(f,[{key:"connectedCallback",value:function(){var t=this,o=t;if(r){var i=t.attachShadow({mode:"open"});o=document.createElement("div"),g().forEach((function(e){i.appendChild(e.cloneNode(i))})),i.appendChild(o),v(i)}y.render(b.cloneElement(e,m(t)),o,(function(){n=this,h(t),p("connectedCallback")}))}},{key:"disconnectedCallback",value:function(){p("disconnectedCallback")}},{key:"attributeChangedCallback",value:function(e,t,n,r){p("attributeChangedCallback",[e,t,n,r])}},{key:"adoptedCallback",value:function(e,t){p("adoptedCallback",[e,t])}},{key:"call",value:function(e,t){var n,r;return null==s||null===(n=s.current)||void 0===n||null===(r=n[e])||void 0===r?void 0:r.call(null==s?void 0:s.current,t)}},{key:"getConfig",value:function(){return n.state.config}}],[{key:"observedAttributes",get:function(){return i}}]),f}(l(HTMLElement));customElements.define(t,d)}}},11:(e,t,n)=>{"use strict";n.d(t,{EK:()=>C,SV:()=>q,ZM:()=>T,U5:()=>k,B7:()=>P,ax:()=>x,eZ:()=>_});var r=n(689),o=n.n(r);const i=require("react-bootstrap");var a=n(271),u=n.n(a);function c(e){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},c(e)}function s(){return s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s.apply(this,arguments)}function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function f(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function h(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function p(e,t,n){return t&&h(e.prototype,t),n&&h(e,n),Object.defineProperty(e,"prototype",{writable:!1}),e}function d(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&b(e,t)}function b(e,t){return b=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},b(e,t)}function y(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,r=m(e);if(t){var o=m(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return v(this,n)}}function v(e,t){if(t&&("object"===c(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return g(e)}function g(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function m(e){return m=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},m(e)}function w(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,i=[],a=!0,u=!1;try{for(n=n.call(e);!(a=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{a||null==n.return||n.return()}finally{if(u)throw o}}return i}}(e,t)||function(e,t){if(e){if("string"==typeof e)return O(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?O(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function O(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}n(368);var S={badge:{width:"4em"},code:{color:"#700",borderLeft:"3px solid #aaa",padding:"0.5em 0px 0.5em 2em",backgroundColor:"#f0f0f0",borderRadius:"4px",marginTop:"0.5em"},inlineCode:{color:"#700",margin:"0px 0.5em 0px 0.5em"}},E=[o().createElement(i.Badge,{bg:"success",style:S.badge},"OK"),o().createElement(i.Badge,{bg:"warning",style:S.badge},"Warn"),o().createElement(i.Badge,{bg:"danger",style:S.badge},"Error"),o().createElement(i.Badge,{bg:"secondary",style:S.badge},"Stale")],k=function(e){var t=e.level;return E[t]||o().createElement("span",null,t)},C=function(e){var t=e.children;return o().createElement("pre",{style:S.code},t)},T=function(e){var t=e.children;return o().createElement("tt",{style:S.inlineCode},t)},j={},x=o().createContext({}),P=function(e){var t=e.duration,n=e.onTimeout,a=e.onStart,u=e.setOnDisconnect,c=e.children;t=t||60;var s=w((0,r.useState)(t),2),l=s[0],f=s[1],h=w((0,r.useState)(!1),2),p=h[0],d=h[1],b=(0,r.useMemo)((function(){return Math.random().toString(36).slice(2)}),[]),y=function(){console.log("stopping timer for",b),n&&setTimeout(n,1),clearInterval(j[b]),j[b]=null,d(!1)};(0,r.useEffect)((function(){var e;l>0&&!p&&(e=j[b],console.log(e,j,l),!e&&l>0&&(d(!0),j[b]=setInterval((function(){return f((function(e){if(--e>0)return e;y()}))}),1e3),a&&setTimeout(a,1)))}),[l]),(0,r.useEffect)((function(){return y}),[]),u&&u((function(){y()}));var v=function(){return f(t)};return o().createElement(x.Provider,{value:{reset:v,duration:t,timer:l}},l>0?o().createElement("div",null,c,l<60&&o().createElement("div",null,"Timeout in: ",l," seconds")):o().createElement("div",null,"Timed out. ",o().createElement(i.Button,{onClick:v},"Resume")))},q=function(e){d(n,e);var t=y(n);function n(e){var r;return f(this,n),(r=t.call(this,e)).state={hasError:!1},r}return p(n,[{key:"componentDidCatch",value:function(e,t){console.warn("ErrorBoundary caught:",e,t)}},{key:"render",value:function(){return this.state.hasError?o().createElement("div",null,this.props.message||"Something went wrong here."):this.props.children}}],[{key:"getDerivedStateFromError",value:function(e){return{hasError:!0}}}]),n}(o().Component),_=function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[],r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"0.0.0",i=arguments.length>4&&void 0!==arguments[4]?arguments[4]:{},a=o().createRef(),c=function(n){d(c,n);var u=y(c);function c(){var e;f(this,c);for(var t=arguments.length,n=new Array(t),r=0;r<t;r++)n[r]=arguments[r];return l(g(e=u.call.apply(u,[this].concat(n))),"onDisconnect",null),l(g(e),"state",{}),e}return p(c,[{key:"setOnDisconnect",value:function(e){this.onDisconnect=e}},{key:"webComponentDisconnected",value:function(){this.onDisconnect&&this.onDisconnect(),this.setState({_disconnected:!0})}},{key:"webComponentAttributeChanged",value:function(e,t,n){var r=this.state;r[e]=n,this.setState(r)}},{key:"setConfig",value:function(e){console.log("setting state",this,e),this.setState({config:e})}},{key:"render",value:function(){var n=i.stylesheets||["https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"];return o().createElement("div",{id:"cap-".concat(t,"-").concat(r)},o().createElement("style",null,n.map((function(e){return"@import url(".concat(e,");")}))),!this.state._disconnected&&o().createElement(e,s({ref:a},this.state,this.props,{setOnDisconnect:this.setOnDisconnect.bind(this),setConfig:this.setConfig.bind(this)})))}}]),c}(o().Component);u().create(o().createElement(c,null),t,i.shadowDOM||!1,n,a)}},268:e=>{"use strict";e.exports=require("@webcomponents/custom-elements")},622:e=>{"use strict";e.exports=require("@webcomponents/shadydom")},22:e=>{"use strict";e.exports=require("chalk")},517:e=>{"use strict";e.exports=require("lodash")},848:e=>{"use strict";e.exports=require("lodash/forEach")},712:e=>{"use strict";e.exports=require("lodash/get")},699:e=>{"use strict";e.exports=require("lodash/isEmpty")},113:e=>{"use strict";e.exports=require("lodash/isEqual")},452:e=>{"use strict";e.exports=require("lodash/isPlainObject")},707:e=>{"use strict";e.exports=require("lodash/map")},831:e=>{"use strict";e.exports=require("lodash/merge")},298:e=>{"use strict";e.exports=require("lodash/set")},305:e=>{"use strict";e.exports=require("lodash/unset")},316:e=>{"use strict";e.exports=require("loglevel")},689:e=>{"use strict";e.exports=require("react")},405:e=>{"use strict";e.exports=require("react-dom")},430:e=>{"use strict";e.exports=require("react-shadow-dom-retarget-events")},962:e=>{"use strict";e.exports=require("react-web-component-style-loader/exports")},13:e=>{"use strict";e.exports=require("semver/functions/compare")}},t={};function n(r){var o=t[r];if(void 0!==o)return o.exports;var i=t[r]={exports:{}};return e[r](i,i.exports,n),i.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var r={};(()=>{"use strict";n.r(r),n.d(r,{Code:()=>e.EK,ErrorBoundary:()=>e.SV,InlineCode:()=>e.ZM,LevelBadge:()=>e.U5,Timer:()=>e.B7,TimerContext:()=>e.ax,createWebComponent:()=>e.eZ,useMqttSync:()=>t.H});var e=n(11),t=n(442),o=n(368),i={};for(const e in o)["default","Code","ErrorBoundary","InlineCode","LevelBadge","Timer","TimerContext","createWebComponent","useMqttSync"].indexOf(e)<0&&(i[e]=()=>o[e]);n.d(r,i)})();var o=exports;for(var i in r)o[i]=r[i];r.__esModule&&Object.defineProperty(o,"__esModule",{value:!0})})();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transitive-sdk/utils-web",
-  "version": "0.6.4",
+  "version": "0.6.5",
   "description": "Web utils for the Transitive framework",
   "homepage": "https://transitiverobotics.com",
   "author": {
@@ -31,7 +31,7 @@
     "loglevel": "^1.8.0",
     "mqtt-browser": "^4.2.7",
     "react-shadow-dom-retarget-events": "^1.0.8",
-    "semver": "^7.3.5"
+    "semver": "7.3.5"
   },
   "devDependencies": {
     "@babel/core": "^7.13.8",

package/react-web-component/index.js

@@ -14,7 +14,8 @@ module.exports = {
    * @param {boolean} useShadowDom - If the value is set to "true" the web component will use the `shadowDom`. The default value is true.
    * @param {string[]} observedAttributes - The observed attributes of the web component
    */
-  create: (app, tagName, useShadowDom = true, observedAttributes = []) => {
+  create: (app, tagName, useShadowDom = true, observedAttributes = [],
+    compRef = undefined) => {
     let appInstance;
 
     const lifeCycleHooks = {
@@ -54,8 +55,9 @@ module.exports = {
           // Re-assign the mountPoint to the newly created "div" element
           mountPoint = document.createElement('div');
 
-          // Move all of the styles assigned to the react component inside of the shadowRoot.
-          // By default this is not used, only if the library is explicitly installed
+          // Move all of the styles assigned to the react component inside of
+          // the shadowRoot. By default this is not used, only if the library is
+          //  explicitly installed
           const styles = getStyleElementsFromReactWebComponentStyleLoader();
           styles.forEach((style) => {
             shadowRoot.appendChild(style.cloneNode(shadowRoot));
@@ -66,22 +68,37 @@ module.exports = {
           retargetEvents(shadowRoot);
         }
 
-        ReactDOM.render(React.cloneElement(app, extractAttributes(webComponentInstance)) , mountPoint, function () {
-          appInstance = this;
-
-          callConstructorHook(webComponentInstance);
-          callLifeCycleHook('connectedCallback');
-        });
+        ReactDOM.render(
+          React.cloneElement(app, extractAttributes(webComponentInstance)),
+          mountPoint, function() {
+            appInstance = this;
+            callConstructorHook(webComponentInstance);
+            callLifeCycleHook('connectedCallback');
+          });
       }
       disconnectedCallback () {
-          callLifeCycleHook('disconnectedCallback');
+        callLifeCycleHook('disconnectedCallback');
       }
       attributeChangedCallback (attributeName, oldValue, newValue, namespace) {
-        callLifeCycleHook('attributeChangedCallback', [attributeName, oldValue, newValue, namespace]);
+        callLifeCycleHook('attributeChangedCallback',
+          [attributeName, oldValue, newValue, namespace]);
       }
       adoptedCallback (oldDocument, newDocument) {
         callLifeCycleHook('adoptedCallback', [oldDocument, newDocument]);
       }
+
+      /** call a function defined in the component, either as a class method, or
+      * via useImperativeHandle */
+      call(functionName, args) {
+        return compRef?.current?.[functionName]?.call(compRef?.current, args);
+      }
+
+      /** predefined function to retrieve the pre-defined config object of the
+       * state, populated via the pre-defined `setConfig` method given as prop
+       * to the wrapped component. */
+      getConfig() {
+        return appInstance.state.config;
+      }
     }
 
     customElements.define(tagName, proto);

package/shared.jsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useMemo } from 'react';
+import React, { useState, useEffect, useMemo, useRef } from 'react';
 import { Button, Accordion, AccordionContext, Card, Badge }
 from 'react-bootstrap';
 import ReactWebComponent from './react-web-component';
@@ -136,6 +136,8 @@ export const createWebComponent = (Component, name,
     version = '0.0.0',
     options = {}) => {
 
+    const compRef = React.createRef();
+
     class Wrapper extends React.Component {
 
       onDisconnect = null;
@@ -156,7 +158,7 @@ export const createWebComponent = (Component, name,
         this.setState({_disconnected: true});
       }
 
-      /** Note this relies on the changed made in
+      /** Note this relies on the changes made in
       github:amay0048/react-web-component#780950800e2962f45f0f029be618bb8b84610c89
       that we used in our copy.
       TODO: move this into our copy, i.e., do it internally to react-web-component
@@ -169,23 +171,34 @@ export const createWebComponent = (Component, name,
         this.setState(newState);
       }
 
+      /** method exposed to the wrapped component via prop that allows setting
+      * the "config" state variable inside the wrapper (not the component
+      * itself). This config is retrieved by the portal for inclusion in the
+      * embedding instructions. */
+      setConfig(config) {
+        console.log('setting state', this, config);
+        this.setState({config});
+      }
+
       render() {
         const stylesheets = options.stylesheets || [
           'https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css'
         ];
-
         return <div id={`cap-${name}-${version}`}>
           <style>
             {stylesheets.map(url => `@import url(${url});`)}
           </style>
           {!this.state._disconnected &&
-            <Component
+            <Component ref={compRef}
               {...this.state}
               {...this.props}
-              setOnDisconnect={this.setOnDisconnect.bind(this)}/>}
+              setOnDisconnect={this.setOnDisconnect.bind(this)}
+              setConfig={this.setConfig.bind(this)}
+              />}
         </div>;
       }
     };
 
-    ReactWebComponent.create(<Wrapper />, name, false, reactiveAttributes);
+    ReactWebComponent.create(<Wrapper />, name, options.shadowDOM || false,
+      reactiveAttributes, compRef);
   };