@hopara/react 0.3.21 → 0.3.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -33,7 +33,7 @@ The component requires a valid `accessToken`. Use the `Auth API` to fetch it, as
33
33
  ```jsx
34
34
  <div className="HoparaEmbedded">
35
35
  <Hopara
36
- app="your-app-id"
36
+ visualization="your-visualization-id"
37
37
  accessToken="your-access-token"
38
38
  />
39
39
  </div>
@@ -44,8 +44,8 @@ You can further customize the integration by using the component props:
44
44
 
45
45
  ```typescript
46
46
  type HoparaProps = {
47
- // The app id
48
- app: string
47
+ // The visualization id
48
+ visualization: string
49
49
 
50
50
  // The accessToken fetched from the auth API
51
51
  accessToken: string
@@ -70,6 +70,12 @@ type HoparaProps = {
70
70
 
71
71
  // The custom controller to be used on Hopara Visualization
72
72
  controller: HoparaController | undefined
73
+
74
+ // Overrides the map style defined in the visualization studio. See the Map Style section for the available options
75
+ mapStyle: string | undefined
76
+
77
+ // Functions called when callback actions are triggered
78
+ callbacks: CallbackFunction[]
73
79
  }
74
80
  ```
75
81
 
@@ -92,7 +98,7 @@ setInterval(() => {
92
98
 
93
99
  <div className="HoparaEmbedded">
94
100
  <Hopara
95
- app="your-app-id"
101
+ visualization="your-visualization-id"
96
102
  accessToken="your-access-token"
97
103
  controller={customController}
98
104
  />
@@ -100,7 +106,7 @@ setInterval(() => {
100
106
  ```
101
107
 
102
108
  ### Data Loader
103
- By default Hopara will load the same visualization and data as seen as in hopara.app. You can use the data loader prop to provide a custom way to load the data.
109
+ By default Hopara will load the same visualization and data as seen as in [hopara.app](https://hopara.app). You can use the data loader prop to provide a custom way to load the data.
104
110
 
105
111
  ```typescript
106
112
  type DataLoader = {
@@ -151,14 +157,14 @@ const dataLoaders = [{
151
157
  ...
152
158
  <div className="HoparaEmbedded">
153
159
  <Hopara
154
- app="your-app-id"
160
+ visualization="your-visualization-id"
155
161
  accessToken="your-access-token"
156
162
  dataLoaders={dataLoaders}
157
163
  />
158
164
  ```
159
165
 
160
166
  ### Data Updater
161
- By default Hopara will update the visualization in the same database configured in hopara.app. You can use the data updater prop to provide a custom way to update the data.
167
+ By default Hopara will update the visualization in the same database configured in [hopara.app](https://hopara.app). You can use the data updater prop to provide a custom way to update the data.
162
168
 
163
169
  The data updater is called when placing objetcs in a visualization and when resizing images.
164
170
 
@@ -189,7 +195,7 @@ const dataUpdaters = [{
189
195
 
190
196
  <div className="HoparaEmbedded">
191
197
  <Hopara
192
- app="your-app-id"
198
+ visualization="your-visualization-id"
193
199
  accessToken="your-access-token"
194
200
  dataUpdaters={dataUpdaters}
195
201
  />
@@ -219,4 +225,44 @@ type InitialRow = {
219
225
  entityId: string
220
226
  rowId: string
221
227
  }
222
- ```
228
+ ```
229
+
230
+ ### Map Style
231
+ In a geo visualization this config overrides the map style defined in the visualization studio.
232
+
233
+ The available options are `'none'`, `'building'`, `'dark'`, `'light'`, `'light-street'`, `'navigation'`, `'satellite'`.
234
+
235
+ ```jsx
236
+ Hopara.init({
237
+ visualization: 'my-hopara-viz',
238
+ accessToken: 'my-hopara-token',
239
+ targetElementId: 'my-target-element',
240
+ mapStyle: 'building',
241
+ })
242
+ ```
243
+
244
+ ### Callback Function
245
+ You can implement custom interactions by adding callback actions to a layer. When the user selects an object in the visualization and click on the action the registered javascript function will be called with the associated row data.
246
+
247
+ ```typescript
248
+ type CallbackFunction = {
249
+ name: string
250
+ callback: (row) => void
251
+ }
252
+ ```
253
+
254
+ ```jsx
255
+ Hopara.init({
256
+ visualization: 'my-hopara-viz',
257
+ accessToken: 'my-hopara-token',
258
+ targetElementId: 'my-target-element',
259
+ callbacks: [
260
+ {
261
+ name: 'my-callback-action',
262
+ callback: (row) => {
263
+ console.log('Callback triggered', row)
264
+ }
265
+ }
266
+ ],
267
+ })
268
+ ```
package/build/index.js CHANGED
@@ -1 +1 @@
1
- (function(e,a){for(var i in a)e[i]=a[i]})(exports,function(modules){var installedModules={};function __webpack_require__(moduleId){if(installedModules[moduleId]){return installedModules[moduleId].exports}var module=installedModules[moduleId]={i:moduleId,l:false,exports:{}};modules[moduleId].call(module.exports,module,module.exports,__webpack_require__);module.l=true;return module.exports}__webpack_require__.m=modules;__webpack_require__.c=installedModules;__webpack_require__.d=function(exports,name,getter){if(!__webpack_require__.o(exports,name)){Object.defineProperty(exports,name,{enumerable:true,get:getter})}};__webpack_require__.r=function(exports){if(typeof Symbol!=="undefined"&&Symbol.toStringTag){Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"})}Object.defineProperty(exports,"__esModule",{value:true})};__webpack_require__.t=function(value,mode){if(mode&1)value=__webpack_require__(value);if(mode&8)return value;if(mode&4&&typeof value==="object"&&value&&value.__esModule)return value;var ns=Object.create(null);__webpack_require__.r(ns);Object.defineProperty(ns,"default",{enumerable:true,value});if(mode&2&&typeof value!="string")for(var key in value)__webpack_require__.d(ns,key,function(key){return value[key]}.bind(null,key));return ns};__webpack_require__.n=function(module){var getter=module&&module.__esModule?function getDefault(){return module["default"]}:function getModuleExports(){return module};__webpack_require__.d(getter,"a",getter);return getter};__webpack_require__.o=function(object,property){return Object.prototype.hasOwnProperty.call(object,property)};__webpack_require__.p="";return __webpack_require__(__webpack_require__.s=4)}([function(module,exports){module.exports=require("lodash/fp")},function(module,exports){module.exports=require("react")},function(module){module.exports=JSON.parse('{"name":"@hopara/iframe","version":"0.3.21","main":"build/client.js","scripts":{"start":"ESLINT_NO_DEV_ERRORS=true react-app-rewired start","build":"react-app-rewired build","eject":"react-app-rewired eject","lint":"eslint --fix \'src/**/*.{ts,js,tsx,jsx}\' && tsc --noEmit","check-types":"tsc --noEmit"},"eslintConfig":{"extends":"react-app","overrides":[{"files":["**/*.stories.*"],"rules":{"import/no-anonymous-default-export":"off"}}]},"browserslist":["defaults, not ie 11"],"devDependencies":{"@babel/register":"^7.15.3","@hopara/components":"^0.3.21","@hopara/design-system":"^0.3.21","@hopara/system-test":"^0.3.21","babel-loader":"8.1.0","customize-cra":"^1.0.0","react":"^18.2.0","react-app-rewired":"^2.2.1","react-dom":"^18.2.0","react-router-dom":"^6.10.0","typescript":"^4.5.2"}}')},function(module,exports){module.exports=require("react/jsx-runtime")},function(module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__);__webpack_require__.d(__webpack_exports__,"Hopara",(function(){return View_Hopara}));__webpack_require__.d(__webpack_exports__,"HoparaController",(function(){return HoparaController}));__webpack_require__.d(__webpack_exports__,"DataLoader",(function(){return DataLoader}));__webpack_require__.d(__webpack_exports__,"DataUpdater",(function(){return DataUpdater}));var external_react_=__webpack_require__(1);var external_react_default=__webpack_require__.n(external_react_);let EventType;(function(EventType){EventType["INIT"]="init";EventType["READY"]="ready";EventType["UPDATE"]="update";EventType["LOAD_DATA"]="loadData";EventType["LOAD_DATA_RESPONSE"]="loadDataResponse";EventType["UPDATE_DATA"]="updateData";EventType["UPDATE_DATA_RESPONSE"]="updateDataResponse";EventType["REFRESH"]="refresh"})(EventType||(EventType={}));const HOPARA_EVENT_TYPE="__hopara__eventType__";const isReadyEvent=event=>event.data[HOPARA_EVENT_TYPE]===EventType.READY;const isLoadDataEvent=event=>event.data[HOPARA_EVENT_TYPE]===EventType.LOAD_DATA;const isUpdateDataEvent=event=>event.data[HOPARA_EVENT_TYPE]===EventType.UPDATE_DATA;class EventEmitter_EventEmitter{static sendMessage(data,targetWindow){const target=targetWindow||window.parent||window.top;if(!window||window===target)return;target.postMessage(data,"*")}static ready(){this.sendMessage({[HOPARA_EVENT_TYPE]:EventType.READY})}static init(config,targetWindow){this.sendMessage(Object.assign(config,{[HOPARA_EVENT_TYPE]:EventType.INIT}),targetWindow)}static loadDataRequest(dataLoader,filterSet){this.sendMessage({[HOPARA_EVENT_TYPE]:EventType.LOAD_DATA,data:{name:dataLoader.name,source:dataLoader.source},filterSet})}static loadDataResponse(config,dataLoader,rows,targetWindow){this.sendMessage(Object.assign(config,{[HOPARA_EVENT_TYPE]:EventType.LOAD_DATA_RESPONSE},{data:{name:dataLoader.name,source:dataLoader.source},rows}),targetWindow)}static updateDataRequest(dataUpdater,newRow,oldRow,diff){this.sendMessage({[HOPARA_EVENT_TYPE]:EventType.UPDATE_DATA,data:{name:dataUpdater.name,source:dataUpdater.source},newRow,oldRow,diff})}static refresh(config,targetWindow){this.sendMessage({...config,[HOPARA_EVENT_TYPE]:EventType.REFRESH},targetWindow)}static update(config,targetWindow){this.sendMessage({...config,[HOPARA_EVENT_TYPE]:EventType.UPDATE},targetWindow)}}class EventReceiver_EventReceiver{static isHoparaMessage(event){return event.data[HOPARA_EVENT_TYPE]!==undefined}static loadDataResponse(dataLoader){return new Promise((resolve=>{const callback=event=>{if(event.data[HOPARA_EVENT_TYPE]===EventType.LOAD_DATA_RESPONSE&&event.data.data.name===dataLoader.name&&event.data.data.source===dataLoader.source){window.removeEventListener("message",callback,false);resolve(event.data.rows)}};window.addEventListener("message",callback,false)}))}}var iframe_package=__webpack_require__(2);const embeddedEnvUrl={test:"https://statics.test.hopara.app/embedded",production:"https://statics.hopara.app/embedded"};class client_Hopara{constructor(config){this.config=void 0;this.iframe=void 0;this.doInit=()=>{const targetElement=this.config.targetElementId?document.getElementById(this.config.targetElementId):this.config.targetElement;if(!targetElement){console&&console.warn("Hopara: targetElement not found");return this}const iframe=this.createIframe();targetElement.appendChild(iframe);this.iframe=iframe;this.createListeners();return this};this.config=config}getIframeSrc(){var _embeddedEnvUrl,_this$config$env;const envUrl=(_embeddedEnvUrl=embeddedEnvUrl[(_this$config$env=this.config.env)!==null&&_this$config$env!==void 0?_this$config$env:"production"])!==null&&_embeddedEnvUrl!==void 0?_embeddedEnvUrl:embeddedEnvUrl.production;const url=this.config.embeddedUrl?this.config.embeddedUrl:`${envUrl}/${this.config.version?this.config.version:"latest"}/index.html`;return`${url}${this.config.debug?"?debug=true":""}`}getIframeStyle(){return"background-color: transparent; border: 0px none transparent; padding: 0px; overflow: hidden; width: 100%; height: 100%;"}createIframe(){const iframe=document.createElement("iframe");iframe.src=this.getIframeSrc();iframe.style=this.getIframeStyle();return iframe}getCleanConfig(){var _this$config$visualiz,_this$config$dataLoad,_this$config$dataUpda;return{accessToken:this.config.accessToken,app:this.config.app,visualization:(_this$config$visualiz=this.config.visualization)!==null&&_this$config$visualiz!==void 0?_this$config$visualiz:this.config.app,env:this.config.env,tenant:this.config.tenant,initialPosition:this.config.initialPosition,initialRow:this.config.initialRow,dataLoaders:(_this$config$dataLoad=this.config.dataLoaders)===null||_this$config$dataLoad===void 0?void 0:_this$config$dataLoad.map((dataLoader=>({name:dataLoader.name,source:dataLoader.source}))),dataUpdaters:(_this$config$dataUpda=this.config.dataUpdaters)===null||_this$config$dataUpda===void 0?void 0:_this$config$dataUpda.map((dataUpdater=>({name:dataUpdater.name,source:dataUpdater.source}))),controller:true,darkMode:this.config.darkMode,toolbar:this.config.toolbar}}createListeners(){window.addEventListener("message",(event=>{const targetWindow=event.source;if(!targetWindow&&EventReceiver_EventReceiver.isHoparaMessage(event)){throw new Error("Hopara: targetWindow is not available")}if(isReadyEvent(event)){return EventEmitter_EventEmitter.init(this.getCleanConfig(),targetWindow)}if(isLoadDataEvent(event)){var _this$config$dataLoad2;const dataLoader=(_this$config$dataLoad2=this.config.dataLoaders)===null||_this$config$dataLoad2===void 0?void 0:_this$config$dataLoad2.find((dataLoader=>dataLoader.name===event.data.data.name&&dataLoader.source===event.data.data.source));if(dataLoader)return dataLoader.loader(event.data.filterSet).then((data=>EventEmitter_EventEmitter.loadDataResponse(this.getCleanConfig(),dataLoader,data,targetWindow)))}if(isUpdateDataEvent(event)){var _this$config$dataUpda2;const dataUpdater=(_this$config$dataUpda2=this.config.dataUpdaters)===null||_this$config$dataUpda2===void 0?void 0:_this$config$dataUpda2.find((dataUpdater=>dataUpdater.name===event.data.data.name&&dataUpdater.source===event.data.data.source));if(dataUpdater)return dataUpdater.updater(event.data.newRow,event.data.oldRow,event.data.diff)}}))}refresh(){if(!this.iframe)throw new Error("Hopara: iframe is not available");if(this.iframe.contentWindow){EventEmitter_EventEmitter.refresh(this.getCleanConfig(),this.iframe.contentWindow)}}update(config){var _this$iframe;this.config=Object.assign({},this.config,config);if((_this$iframe=this.iframe)!==null&&_this$iframe!==void 0&&_this$iframe.contentWindow){EventEmitter_EventEmitter.update(this.getCleanConfig(),this.iframe.contentWindow)}}static init(config){if(!config&&console){console.warn("Hopara: init config not present");return}if((!window||!window.document)&&console){console.warn("Hopara: window is not available");return}const client=new client_Hopara(config);return client.doInit()}static moduleVersion(){return this._version}moduleVersion(){return client_Hopara._version}}client_Hopara._version=iframe_package.version;var client=client_Hopara;var fp_=__webpack_require__(0);var jsx_runtime_=__webpack_require__(3);class View_Hopara extends external_react_default.a.Component{constructor(){super(...arguments);this.wrapperRef=external_react_default.a.createRef();this.hoparaInstance=void 0}componentDidMount(){var _this$hoparaInstance;const hoparaInstance=client.init({...this.props,targetElement:this.wrapperRef.current});if(hoparaInstance)this.hoparaInstance=hoparaInstance;if(this.props.controller)this.props.controller.setRefreshSignal((_this$hoparaInstance=this.hoparaInstance)===null||_this$hoparaInstance===void 0?void 0:_this$hoparaInstance.refresh.bind(this.hoparaInstance))}shouldComponentUpdate(nextProps){if(!Object(fp_["isEqual"])(this.props.env,nextProps.env))return true;if(!Object(fp_["isEqual"])(this.props.visualization,nextProps.visualization))return true;if(!Object(fp_["isEqual"])(this.props.accessToken,nextProps.accessToken))return true;if(!Object(fp_["isEqual"])(this.props.initialPosition,nextProps.initialPosition))return true;if(!Object(fp_["isEqual"])(this.props.initialRow,nextProps.initialRow))return true;if(!Object(fp_["isEqual"])(this.props.controller,nextProps.controller))return true;if(!Object(fp_["isEqual"])(this.props.darkMode,nextProps.darkMode))return true;if(!Object(fp_["isEqual"])(this.props.toolbar,nextProps.toolbar))return true;return false}componentDidUpdate(){var _this$hoparaInstance2;if(this.hoparaInstance)this.hoparaInstance.update(this.props);if(this.props.controller)this.props.controller.setRefreshSignal((_this$hoparaInstance2=this.hoparaInstance)===null||_this$hoparaInstance2===void 0?void 0:_this$hoparaInstance2.refresh.bind(this.hoparaInstance))}render(){return Object(jsx_runtime_["jsx"])("div",{ref:this.wrapperRef,"data-hopara-embedded":true,style:{width:"100%",height:"100%"}})}}class HoparaController{constructor(){this.refreshSignal=void 0}setRefreshSignal(refreshSignal){this.refreshSignal=refreshSignal}refresh(){if(this.refreshSignal)this.refreshSignal()}}class DataLoader{constructor(props){this.name=void 0;this.source=void 0;this.loader=void 0;Object.assign(this,props)}isFromQuery(query){return this.name.toLowerCase()===query.name.toLowerCase()&&this.source.toLowerCase()===query.dataSource.toLowerCase()}}class DataLoaders extends Array{getLoader(query){if(!query)return undefined;return this.find((loader=>loader.isFromQuery(query)))}}class DataUpdater{constructor(props){this.name=void 0;this.source=void 0;this.updater=void 0;Object.assign(this,props)}isFromQuery(query){return this.name.toLowerCase()===query.name.toLowerCase()&&this.source.toLowerCase()===query.dataSource.toLowerCase()}}class DataUpdaters extends Array{getUpdater(query){if(!query)return undefined;return this.find((loader=>loader.isFromQuery(query)))}}}]));
1
+ (function(e,a){for(var i in a)e[i]=a[i]})(exports,function(modules){var installedModules={};function __webpack_require__(moduleId){if(installedModules[moduleId]){return installedModules[moduleId].exports}var module=installedModules[moduleId]={i:moduleId,l:false,exports:{}};modules[moduleId].call(module.exports,module,module.exports,__webpack_require__);module.l=true;return module.exports}__webpack_require__.m=modules;__webpack_require__.c=installedModules;__webpack_require__.d=function(exports,name,getter){if(!__webpack_require__.o(exports,name)){Object.defineProperty(exports,name,{enumerable:true,get:getter})}};__webpack_require__.r=function(exports){if(typeof Symbol!=="undefined"&&Symbol.toStringTag){Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"})}Object.defineProperty(exports,"__esModule",{value:true})};__webpack_require__.t=function(value,mode){if(mode&1)value=__webpack_require__(value);if(mode&8)return value;if(mode&4&&typeof value==="object"&&value&&value.__esModule)return value;var ns=Object.create(null);__webpack_require__.r(ns);Object.defineProperty(ns,"default",{enumerable:true,value});if(mode&2&&typeof value!="string")for(var key in value)__webpack_require__.d(ns,key,function(key){return value[key]}.bind(null,key));return ns};__webpack_require__.n=function(module){var getter=module&&module.__esModule?function getDefault(){return module["default"]}:function getModuleExports(){return module};__webpack_require__.d(getter,"a",getter);return getter};__webpack_require__.o=function(object,property){return Object.prototype.hasOwnProperty.call(object,property)};__webpack_require__.p="";return __webpack_require__(__webpack_require__.s=4)}([function(module,exports){module.exports=require("lodash/fp")},function(module,exports){module.exports=require("react")},function(module){module.exports=JSON.parse('{"name":"@hopara/iframe","version":"0.3.24","main":"build/client.js","scripts":{"start":"ESLINT_NO_DEV_ERRORS=true react-app-rewired start","build":"react-app-rewired build","eject":"react-app-rewired eject","lint":"eslint --fix \'src/**/*.{ts,js,tsx,jsx}\' && tsc --noEmit","check-types":"tsc --noEmit"},"eslintConfig":{"extends":"react-app","overrides":[{"files":["**/*.stories.*"],"rules":{"import/no-anonymous-default-export":"off"}}]},"browserslist":["defaults, not ie 11"],"devDependencies":{"@babel/register":"^7.15.3","@hopara/components":"^0.3.24","@hopara/design-system":"^0.3.24","@hopara/system-test":"^0.3.24","babel-loader":"8.1.0","customize-cra":"^1.0.0","react":"^18.2.0","react-app-rewired":"^2.2.1","react-dom":"^18.2.0","react-router-dom":"^6.10.0","typescript":"^4.5.2"}}')},function(module,exports){module.exports=require("react/jsx-runtime")},function(module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__);__webpack_require__.d(__webpack_exports__,"Hopara",(function(){return View_Hopara}));__webpack_require__.d(__webpack_exports__,"HoparaController",(function(){return HoparaController}));__webpack_require__.d(__webpack_exports__,"DataLoader",(function(){return DataLoader}));__webpack_require__.d(__webpack_exports__,"DataUpdater",(function(){return DataUpdater}));var external_react_=__webpack_require__(1);var external_react_default=__webpack_require__.n(external_react_);let EventType;(function(EventType){EventType["INIT"]="init";EventType["READY"]="ready";EventType["UPDATE"]="update";EventType["LOAD_DATA"]="loadData";EventType["LOAD_DATA_RESPONSE"]="loadDataResponse";EventType["UPDATE_DATA"]="updateData";EventType["UPDATE_DATA_RESPONSE"]="updateDataResponse";EventType["REFRESH"]="refresh";EventType["FUNCTION_CALLBACK"]="functionCallback"})(EventType||(EventType={}));const HOPARA_EVENT_TYPE="__hopara__eventType__";const isReadyEvent=event=>event.data[HOPARA_EVENT_TYPE]===EventType.READY;const isLoadDataEvent=event=>event.data[HOPARA_EVENT_TYPE]===EventType.LOAD_DATA;const isUpdateDataEvent=event=>event.data[HOPARA_EVENT_TYPE]===EventType.UPDATE_DATA;const isCallbackFunctionEvent=event=>event.data[HOPARA_EVENT_TYPE]===EventType.FUNCTION_CALLBACK;class EventEmitter_EventEmitter{static sendMessage(data,targetWindow){const target=targetWindow||window.parent||window.top;if(!window||window===target)return;target.postMessage(data,"*")}static ready(){this.sendMessage({[HOPARA_EVENT_TYPE]:EventType.READY})}static init(config,targetWindow){this.sendMessage(Object.assign(config,{[HOPARA_EVENT_TYPE]:EventType.INIT}),targetWindow)}static loadDataRequest(dataLoader,filterSet){this.sendMessage({[HOPARA_EVENT_TYPE]:EventType.LOAD_DATA,data:{name:dataLoader.name,source:dataLoader.source},filterSet})}static loadDataResponse(config,dataLoader,rows,targetWindow){this.sendMessage(Object.assign(config,{[HOPARA_EVENT_TYPE]:EventType.LOAD_DATA_RESPONSE},{data:{name:dataLoader.name,source:dataLoader.source},rows}),targetWindow)}static updateDataRequest(dataUpdater,newRow,oldRow,diff){this.sendMessage({[HOPARA_EVENT_TYPE]:EventType.UPDATE_DATA,data:{name:dataUpdater.name,source:dataUpdater.source},newRow,oldRow,diff})}static refresh(config,targetWindow){this.sendMessage({...config,[HOPARA_EVENT_TYPE]:EventType.REFRESH},targetWindow)}static update(config,targetWindow){this.sendMessage({...config,[HOPARA_EVENT_TYPE]:EventType.UPDATE},targetWindow)}static callback(name,row){this.sendMessage({[HOPARA_EVENT_TYPE]:EventType.FUNCTION_CALLBACK,name,row})}}class EventReceiver_EventReceiver{static isHoparaMessage(event){return event.data[HOPARA_EVENT_TYPE]!==undefined}static loadDataResponse(dataLoader){return new Promise((resolve=>{const callback=event=>{if(event.data[HOPARA_EVENT_TYPE]===EventType.LOAD_DATA_RESPONSE&&event.data.data.name===dataLoader.name&&event.data.data.source===dataLoader.source){window.removeEventListener("message",callback,false);resolve(event.data.rows)}};window.addEventListener("message",callback,false)}))}}var iframe_package=__webpack_require__(2);const embeddedEnvUrl={test:"https://statics.test.hopara.app/embedded",production:"https://statics.hopara.app/embedded"};class client_Hopara{constructor(config){this.config=void 0;this.iframe=void 0;this.doInit=()=>{const targetElement=this.config.targetElementId?document.getElementById(this.config.targetElementId):this.config.targetElement;if(!targetElement){console&&console.warn("Hopara: targetElement not found");return this}const iframe=this.createIframe();targetElement.appendChild(iframe);this.iframe=iframe;this.createListeners();return this};this.config=config}getIframeSrc(){var _embeddedEnvUrl,_this$config$env;const envUrl=(_embeddedEnvUrl=embeddedEnvUrl[(_this$config$env=this.config.env)!==null&&_this$config$env!==void 0?_this$config$env:"production"])!==null&&_embeddedEnvUrl!==void 0?_embeddedEnvUrl:embeddedEnvUrl.production;const url=this.config.embeddedUrl?this.config.embeddedUrl:`${envUrl}/${this.config.version?this.config.version:"latest"}/index.html`;return`${url}${this.config.debug?"?debug=true":""}`}getIframeStyle(){return"background-color: transparent; border: 0px none transparent; padding: 0px; overflow: hidden; width: 100%; height: 100%;"}createIframe(){const iframe=document.createElement("iframe");iframe.src=this.getIframeSrc();iframe.style=this.getIframeStyle();return iframe}getCleanConfig(){var _this$config$visualiz,_this$config$dataLoad,_this$config$dataUpda,_this$config$callback;return{accessToken:this.config.accessToken,app:this.config.app,visualization:(_this$config$visualiz=this.config.visualization)!==null&&_this$config$visualiz!==void 0?_this$config$visualiz:this.config.app,env:this.config.env,tenant:this.config.tenant,initialPosition:this.config.initialPosition,initialRow:this.config.initialRow,dataLoaders:(_this$config$dataLoad=this.config.dataLoaders)===null||_this$config$dataLoad===void 0?void 0:_this$config$dataLoad.map((dataLoader=>({name:dataLoader.name,source:dataLoader.source}))),dataUpdaters:(_this$config$dataUpda=this.config.dataUpdaters)===null||_this$config$dataUpda===void 0?void 0:_this$config$dataUpda.map((dataUpdater=>({name:dataUpdater.name,source:dataUpdater.source}))),darkMode:this.config.darkMode,toolbar:this.config.toolbar,mapStyle:this.config.mapStyle,callbackNames:(_this$config$callback=this.config.callbacks)===null||_this$config$callback===void 0?void 0:_this$config$callback.map((callback=>callback.name))}}createListeners(){window.addEventListener("message",(event=>{const targetWindow=event.source;if(!targetWindow&&EventReceiver_EventReceiver.isHoparaMessage(event)){throw new Error("Hopara: targetWindow is not available")}if(isReadyEvent(event)){return EventEmitter_EventEmitter.init(this.getCleanConfig(),targetWindow)}if(isLoadDataEvent(event)){var _this$config$dataLoad2;const dataLoader=(_this$config$dataLoad2=this.config.dataLoaders)===null||_this$config$dataLoad2===void 0?void 0:_this$config$dataLoad2.find((dataLoader=>dataLoader.name===event.data.data.name&&dataLoader.source===event.data.data.source));if(dataLoader)return dataLoader.loader(event.data.filterSet).then((data=>EventEmitter_EventEmitter.loadDataResponse(this.getCleanConfig(),dataLoader,data,targetWindow)))}if(isUpdateDataEvent(event)){var _this$config$dataUpda2;const dataUpdater=(_this$config$dataUpda2=this.config.dataUpdaters)===null||_this$config$dataUpda2===void 0?void 0:_this$config$dataUpda2.find((dataUpdater=>dataUpdater.name===event.data.data.name&&dataUpdater.source===event.data.data.source));if(dataUpdater)return dataUpdater.updater(event.data.newRow,event.data.oldRow,event.data.diff)}if(isCallbackFunctionEvent(event)){var _this$config$callback2;const callbackFunc=(_this$config$callback2=this.config.callbacks)===null||_this$config$callback2===void 0?void 0:_this$config$callback2.find((callback=>callback.name===event.data.name));if(callbackFunc)callbackFunc===null||callbackFunc===void 0?void 0:callbackFunc.callback(event.data.row)}}))}refresh(){if(!this.iframe)throw new Error("Hopara: iframe is not available");if(this.iframe.contentWindow){EventEmitter_EventEmitter.refresh(this.getCleanConfig(),this.iframe.contentWindow)}}update(config){var _this$iframe;this.config=Object.assign({},this.config,config);if((_this$iframe=this.iframe)!==null&&_this$iframe!==void 0&&_this$iframe.contentWindow){EventEmitter_EventEmitter.update(this.getCleanConfig(),this.iframe.contentWindow)}}static init(config){if(!config&&console){console.warn("Hopara: init config not present");return}if((!window||!window.document)&&console){console.warn("Hopara: window is not available");return}const client=new client_Hopara(config);return client.doInit()}static moduleVersion(){return this._version}moduleVersion(){return client_Hopara._version}}client_Hopara._version=iframe_package.version;var client=client_Hopara;var fp_=__webpack_require__(0);var jsx_runtime_=__webpack_require__(3);class View_Hopara extends external_react_default.a.Component{constructor(){super(...arguments);this.wrapperRef=external_react_default.a.createRef();this.hoparaInstance=void 0}componentDidMount(){var _this$hoparaInstance;const hoparaInstance=client.init({...this.props,targetElement:this.wrapperRef.current});if(hoparaInstance)this.hoparaInstance=hoparaInstance;if(this.props.controller)this.props.controller.setRefreshSignal((_this$hoparaInstance=this.hoparaInstance)===null||_this$hoparaInstance===void 0?void 0:_this$hoparaInstance.refresh.bind(this.hoparaInstance))}shouldComponentUpdate(nextProps){if(!Object(fp_["isEqual"])(this.props.env,nextProps.env))return true;if(!Object(fp_["isEqual"])(this.props.visualization,nextProps.visualization))return true;if(!Object(fp_["isEqual"])(this.props.accessToken,nextProps.accessToken))return true;if(!Object(fp_["isEqual"])(this.props.initialPosition,nextProps.initialPosition))return true;if(!Object(fp_["isEqual"])(this.props.initialRow,nextProps.initialRow))return true;if(!Object(fp_["isEqual"])(this.props.controller,nextProps.controller))return true;if(!Object(fp_["isEqual"])(this.props.darkMode,nextProps.darkMode))return true;if(!Object(fp_["isEqual"])(this.props.toolbar,nextProps.toolbar))return true;return false}componentDidUpdate(){var _this$hoparaInstance2;if(this.hoparaInstance)this.hoparaInstance.update(this.props);if(this.props.controller)this.props.controller.setRefreshSignal((_this$hoparaInstance2=this.hoparaInstance)===null||_this$hoparaInstance2===void 0?void 0:_this$hoparaInstance2.refresh.bind(this.hoparaInstance))}render(){return Object(jsx_runtime_["jsx"])("div",{ref:this.wrapperRef,"data-hopara-embedded":true,style:{width:"100%",height:"100%"}})}}class HoparaController{constructor(){this.refreshSignal=void 0}setRefreshSignal(refreshSignal){this.refreshSignal=refreshSignal}refresh(){if(this.refreshSignal)this.refreshSignal()}}class DataLoader{constructor(props){this.name=void 0;this.source=void 0;this.loader=void 0;Object.assign(this,props)}isFromQuery(query){return this.name.toLowerCase()===query.name.toLowerCase()&&this.source.toLowerCase()===query.dataSource.toLowerCase()}}class DataLoaders extends Array{getLoader(query){if(!query)return undefined;return this.find((loader=>loader.isFromQuery(query)))}}class DataUpdater{constructor(props){this.name=void 0;this.source=void 0;this.updater=void 0;Object.assign(this,props)}isFromQuery(query){return this.name.toLowerCase()===query.name.toLowerCase()&&this.source.toLowerCase()===query.dataSource.toLowerCase()}}class DataUpdaters extends Array{getUpdater(query){if(!query)return undefined;return this.find((loader=>loader.isFromQuery(query)))}}}]));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hopara/react",
3
- "version": "0.3.21",
3
+ "version": "0.3.24",
4
4
  "description": "Hopara React Component",
5
5
  "author": "Hopara",
6
6
  "homepage": "https://hopara.io",
@@ -28,7 +28,7 @@
28
28
  "devDependencies": {
29
29
  "@babel/core": "^7.18.9",
30
30
  "@babel/preset-env": "^7.16.4",
31
- "@hopara/iframe": "^0.3.21",
31
+ "@hopara/iframe": "^0.3.24",
32
32
  "babel-loader": "8.1.0",
33
33
  "customize-cra": "^1.0.0",
34
34
  "lodash": "~4.17.21",