@embeddable.com/sdk-react 0.0.16 → 0.1.0

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.
@@ -1,9 +1,19 @@
1
1
  import * as React from 'react';
2
+ import { LoadDataParams } from "@embeddable.com/sdk-core";
2
3
  type WrapperProps = {
3
4
  propsUpdateListener: HTMLElement;
5
+ componentId: string;
4
6
  };
5
7
  export type Config = {
6
8
  extendedProps?: (props: any) => any;
9
+ events: Record<string, EmbeddableEventHandler>;
10
+ dataLoaders: (props: any) => Record<string, LoadDataParams>;
11
+ };
12
+ export type EmbeddableEventHandler = (value: any) => any;
13
+ export type DataResponse = {
14
+ isLoading: boolean;
15
+ data?: any;
16
+ error?: string;
7
17
  };
8
18
  export declare function embedComponent(InnerComponent: React.ComponentType, config: Config): {
9
19
  ({ propsUpdateListener, ...props }: WrapperProps): React.JSX.Element;
@@ -1,19 +1,13 @@
1
1
  import * as React from 'react';
2
2
  export type Config<T> = {
3
- inputs: any;
3
+ inputs: (value: any, setter: Setter<T>) => any;
4
4
  events: Record<string, EmbeddableEventHandler<T>>;
5
+ mapProps?: (_: any) => any;
5
6
  };
6
- export type EmbeddableEventHandler<T> = (value: T, setter: Setter<T>) => void;
7
- export type EmbeddableEvent<T> = {
8
- editorId: string;
9
- value: T;
10
- };
7
+ export type EmbeddableEventHandler<T> = (value: T) => T;
11
8
  type Setter<T> = (value: T) => void;
12
9
  export declare function embedControl<T>(InnerComponent: React.ComponentType, config: Config<T>): {
13
- ({ editorId, initialValue }: {
14
- editorId: any;
15
- initialValue: any;
16
- }): React.JSX.Element;
10
+ (props: any): React.JSX.Element;
17
11
  displayName: string;
18
12
  };
19
13
  export {};
package/lib/index.cjs.js CHANGED
@@ -1,6 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  var React = require('react');
4
+ var sdkCore = require('@embeddable.com/sdk-core');
4
5
 
5
6
  function _interopNamespaceDefault(e) {
6
7
  var n = Object.create(null);
@@ -66,58 +67,110 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
66
67
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
67
68
  };
68
69
 
69
- var EVENT_NAME$1 = 'embeddable-event:update-props';
70
+ var UPDATE_PROPS_EVENT_NAME = 'embeddable-event:update-props';
71
+ var RELOAD_DATASET_EVENT_NAME = 'embeddable-event:reload-dataset';
72
+ var ReducerActionTypes = {
73
+ loading: 'loading',
74
+ error: 'error',
75
+ data: 'data',
76
+ };
77
+ var reducer = function (state, action) {
78
+ var _a, _b, _c;
79
+ switch (action.type) {
80
+ case (ReducerActionTypes.loading): {
81
+ return __assign(__assign({}, state), (_a = {}, _a[action.inputName] = { isLoading: true }, _a));
82
+ }
83
+ case (ReducerActionTypes.data): {
84
+ return __assign(__assign({}, state), (_b = {}, _b[action.inputName] = { isLoading: false, data: action.payload.data }, _b));
85
+ }
86
+ case (ReducerActionTypes.error): {
87
+ return __assign(__assign({}, state), (_c = {}, _c[action.inputName] = { isLoading: false, error: action.payload.message || action.payload }, _c));
88
+ }
89
+ }
90
+ return state;
91
+ };
92
+ var createInitialLoadersState = function (dataLoaders) { return Object.keys(dataLoaders).reduce(function (loaderState, loaderKey) {
93
+ var _a;
94
+ return (__assign(__assign({}, loaderState), (_a = {}, _a[loaderKey] = { isLoading: false }, _a)));
95
+ }, {}); };
96
+ var latestVariables = {};
70
97
  function embedComponent(InnerComponent, config) {
71
98
  var _a;
72
99
  function EmbeddableWrapper(_a) {
73
100
  var propsUpdateListener = _a.propsUpdateListener, props = __rest(_a, ["propsUpdateListener"]);
74
101
  var _b = React__namespace.useState(props), propsProxy = _b[0], setProps = _b[1];
102
+ var componentId = props.componentId;
75
103
  var propsUpdateEventHandler = function (_a) {
76
104
  var detail = _a.detail;
77
105
  return setProps(detail);
78
106
  };
79
107
  React__namespace.useEffect(function () {
80
- propsUpdateListener.addEventListener(EVENT_NAME$1, propsUpdateEventHandler);
81
- return function () { return propsUpdateListener.removeEventListener(EVENT_NAME$1, propsUpdateEventHandler); };
108
+ propsUpdateListener.addEventListener(UPDATE_PROPS_EVENT_NAME, propsUpdateEventHandler);
109
+ return function () { return propsUpdateListener.removeEventListener(UPDATE_PROPS_EVENT_NAME, propsUpdateEventHandler); };
82
110
  }, []);
83
111
  var extendedProps = React__namespace.useMemo(function () { var _a; return (_a = config === null || config === void 0 ? void 0 : config.extendedProps) === null || _a === void 0 ? void 0 : _a.call(config, propsProxy); }, [propsProxy, config === null || config === void 0 ? void 0 : config.extendedProps]);
84
- return React__namespace.createElement(InnerComponent, __assign({}, propsProxy, extendedProps));
112
+ var dataLoaders = React__namespace.useMemo(function () { var _a, _b; return (_b = (_a = config === null || config === void 0 ? void 0 : config.dataLoaders) === null || _a === void 0 ? void 0 : _a.call(config, propsProxy)) !== null && _b !== void 0 ? _b : {}; }, [propsProxy, config === null || config === void 0 ? void 0 : config.dataLoaders]);
113
+ var _c = React__namespace.useReducer(reducer, dataLoaders, createInitialLoadersState), loadersState = _c[0], dispatch = _c[1];
114
+ var handleDataLoaded = function (inputName) { return function (res) { return dispatch({ type: ReducerActionTypes.data, inputName: inputName, payload: res.data }); }; };
115
+ var handleError = function (inputName) { return function (error) { return dispatch({ type: ReducerActionTypes.error, inputName: inputName, payload: error }); }; };
116
+ var reloadDataset = function (inputName, params) {
117
+ dispatch({ type: ReducerActionTypes.loading, inputName: inputName });
118
+ params.dataLoader(params.requestParams, latestVariables)
119
+ .then(handleDataLoaded(inputName))
120
+ .catch(handleError(inputName));
121
+ };
122
+ var variableChangedEventHandler = function (_a) {
123
+ var detail = _a.detail;
124
+ latestVariables = detail.variableValues;
125
+ Object.entries(dataLoaders)
126
+ .filter(function (_a) {
127
+ _a[0]; var params = _a[1];
128
+ return params.requestParams.from.datasetId === detail.datasetId;
129
+ })
130
+ .forEach(function (_a) {
131
+ var inputName = _a[0], params = _a[1];
132
+ return reloadDataset(inputName, params);
133
+ });
134
+ };
135
+ React__namespace.useEffect(function () {
136
+ Object.entries(dataLoaders).forEach(function (_a) {
137
+ var inputName = _a[0], params = _a[1];
138
+ return reloadDataset(inputName, params);
139
+ });
140
+ window.addEventListener(RELOAD_DATASET_EVENT_NAME, variableChangedEventHandler);
141
+ return function () { return window.removeEventListener(RELOAD_DATASET_EVENT_NAME, variableChangedEventHandler); };
142
+ }, [JSON.stringify(Object.values(dataLoaders).map(function (loader) { return loader.requestParams; }))]);
143
+ var createEvent = function (value, eventName) { return sdkCore.setValue(value, componentId, eventName); };
144
+ var events = config === null || config === void 0 ? void 0 : config.events;
145
+ var eventProps = {};
146
+ if (events) {
147
+ var _loop_1 = function (event_1) {
148
+ if (events.hasOwnProperty(event_1)) {
149
+ var eventFunction_1 = events[event_1];
150
+ eventProps[event_1] = function (value) { return createEvent(eventFunction_1(value), event_1); };
151
+ }
152
+ };
153
+ for (var event_1 in events) {
154
+ _loop_1(event_1);
155
+ }
156
+ }
157
+ return React__namespace.createElement(InnerComponent, __assign({}, propsProxy, extendedProps, eventProps, loadersState));
85
158
  }
86
159
  EmbeddableWrapper.displayName = "embedded(".concat((_a = InnerComponent.displayName) !== null && _a !== void 0 ? _a : 'Component', ")");
87
160
  return EmbeddableWrapper;
88
161
  }
89
162
 
90
- var EVENT_NAME = "embeddable:editor:changed";
91
163
  function embedControl(InnerComponent, config) {
92
164
  var _a;
93
- function EmbeddableWrapper(_a) {
94
- var editorId = _a.editorId, initialValue = _a.initialValue;
95
- var _b = React__namespace.useState(initialValue), componentState = _b[0], setComponentState = _b[1];
96
- var createEvent = function (value) {
97
- var event = new CustomEvent(EVENT_NAME, {
98
- bubbles: false,
99
- detail: {
100
- editorId: editorId,
101
- value: value
102
- },
103
- });
104
- window.dispatchEvent(event);
165
+ function EmbeddableWrapper(props) {
166
+ var _a, _b;
167
+ var componentId = props.componentId, initialValue = props.initialValue;
168
+ var _c = React__namespace.useState(initialValue), componentState = _c[0], setComponentState = _c[1];
169
+ var setter = function (value) {
170
+ setComponentState(value);
171
+ sdkCore.setValue(value, componentId);
105
172
  };
106
- var events = config.events;
107
- var eventProps = {};
108
- var _loop_1 = function (event_1) {
109
- if (events.hasOwnProperty(event_1)) {
110
- var eventFunction_1 = events[event_1];
111
- eventProps[event_1] = function (value) {
112
- eventFunction_1(value, setComponentState);
113
- createEvent(value);
114
- };
115
- }
116
- };
117
- for (var event_1 in events) {
118
- _loop_1(event_1);
119
- }
120
- return React__namespace.createElement(InnerComponent, __assign({}, eventProps, config.inputs(componentState)));
173
+ return React__namespace.createElement(InnerComponent, __assign({}, config.inputs(componentState, setter), ((_b = (_a = config.mapProps) === null || _a === void 0 ? void 0 : _a.call(config, props)) !== null && _b !== void 0 ? _b : {})));
121
174
  }
122
175
  EmbeddableWrapper.displayName = "embedded(".concat((_a = InnerComponent.displayName) !== null && _a !== void 0 ? _a : 'Editor', ")");
123
176
  return EmbeddableWrapper;
package/lib/index.esm.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import * as React from 'react';
2
+ import { setValue } from '@embeddable.com/sdk-core';
2
3
 
3
4
  /******************************************************************************
4
5
  Copyright (c) Microsoft Corporation.
@@ -45,58 +46,110 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
45
46
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
46
47
  };
47
48
 
48
- var EVENT_NAME$1 = 'embeddable-event:update-props';
49
+ var UPDATE_PROPS_EVENT_NAME = 'embeddable-event:update-props';
50
+ var RELOAD_DATASET_EVENT_NAME = 'embeddable-event:reload-dataset';
51
+ var ReducerActionTypes = {
52
+ loading: 'loading',
53
+ error: 'error',
54
+ data: 'data',
55
+ };
56
+ var reducer = function (state, action) {
57
+ var _a, _b, _c;
58
+ switch (action.type) {
59
+ case (ReducerActionTypes.loading): {
60
+ return __assign(__assign({}, state), (_a = {}, _a[action.inputName] = { isLoading: true }, _a));
61
+ }
62
+ case (ReducerActionTypes.data): {
63
+ return __assign(__assign({}, state), (_b = {}, _b[action.inputName] = { isLoading: false, data: action.payload.data }, _b));
64
+ }
65
+ case (ReducerActionTypes.error): {
66
+ return __assign(__assign({}, state), (_c = {}, _c[action.inputName] = { isLoading: false, error: action.payload.message || action.payload }, _c));
67
+ }
68
+ }
69
+ return state;
70
+ };
71
+ var createInitialLoadersState = function (dataLoaders) { return Object.keys(dataLoaders).reduce(function (loaderState, loaderKey) {
72
+ var _a;
73
+ return (__assign(__assign({}, loaderState), (_a = {}, _a[loaderKey] = { isLoading: false }, _a)));
74
+ }, {}); };
75
+ var latestVariables = {};
49
76
  function embedComponent(InnerComponent, config) {
50
77
  var _a;
51
78
  function EmbeddableWrapper(_a) {
52
79
  var propsUpdateListener = _a.propsUpdateListener, props = __rest(_a, ["propsUpdateListener"]);
53
80
  var _b = React.useState(props), propsProxy = _b[0], setProps = _b[1];
81
+ var componentId = props.componentId;
54
82
  var propsUpdateEventHandler = function (_a) {
55
83
  var detail = _a.detail;
56
84
  return setProps(detail);
57
85
  };
58
86
  React.useEffect(function () {
59
- propsUpdateListener.addEventListener(EVENT_NAME$1, propsUpdateEventHandler);
60
- return function () { return propsUpdateListener.removeEventListener(EVENT_NAME$1, propsUpdateEventHandler); };
87
+ propsUpdateListener.addEventListener(UPDATE_PROPS_EVENT_NAME, propsUpdateEventHandler);
88
+ return function () { return propsUpdateListener.removeEventListener(UPDATE_PROPS_EVENT_NAME, propsUpdateEventHandler); };
61
89
  }, []);
62
90
  var extendedProps = React.useMemo(function () { var _a; return (_a = config === null || config === void 0 ? void 0 : config.extendedProps) === null || _a === void 0 ? void 0 : _a.call(config, propsProxy); }, [propsProxy, config === null || config === void 0 ? void 0 : config.extendedProps]);
63
- return React.createElement(InnerComponent, __assign({}, propsProxy, extendedProps));
91
+ var dataLoaders = React.useMemo(function () { var _a, _b; return (_b = (_a = config === null || config === void 0 ? void 0 : config.dataLoaders) === null || _a === void 0 ? void 0 : _a.call(config, propsProxy)) !== null && _b !== void 0 ? _b : {}; }, [propsProxy, config === null || config === void 0 ? void 0 : config.dataLoaders]);
92
+ var _c = React.useReducer(reducer, dataLoaders, createInitialLoadersState), loadersState = _c[0], dispatch = _c[1];
93
+ var handleDataLoaded = function (inputName) { return function (res) { return dispatch({ type: ReducerActionTypes.data, inputName: inputName, payload: res.data }); }; };
94
+ var handleError = function (inputName) { return function (error) { return dispatch({ type: ReducerActionTypes.error, inputName: inputName, payload: error }); }; };
95
+ var reloadDataset = function (inputName, params) {
96
+ dispatch({ type: ReducerActionTypes.loading, inputName: inputName });
97
+ params.dataLoader(params.requestParams, latestVariables)
98
+ .then(handleDataLoaded(inputName))
99
+ .catch(handleError(inputName));
100
+ };
101
+ var variableChangedEventHandler = function (_a) {
102
+ var detail = _a.detail;
103
+ latestVariables = detail.variableValues;
104
+ Object.entries(dataLoaders)
105
+ .filter(function (_a) {
106
+ _a[0]; var params = _a[1];
107
+ return params.requestParams.from.datasetId === detail.datasetId;
108
+ })
109
+ .forEach(function (_a) {
110
+ var inputName = _a[0], params = _a[1];
111
+ return reloadDataset(inputName, params);
112
+ });
113
+ };
114
+ React.useEffect(function () {
115
+ Object.entries(dataLoaders).forEach(function (_a) {
116
+ var inputName = _a[0], params = _a[1];
117
+ return reloadDataset(inputName, params);
118
+ });
119
+ window.addEventListener(RELOAD_DATASET_EVENT_NAME, variableChangedEventHandler);
120
+ return function () { return window.removeEventListener(RELOAD_DATASET_EVENT_NAME, variableChangedEventHandler); };
121
+ }, [JSON.stringify(Object.values(dataLoaders).map(function (loader) { return loader.requestParams; }))]);
122
+ var createEvent = function (value, eventName) { return setValue(value, componentId, eventName); };
123
+ var events = config === null || config === void 0 ? void 0 : config.events;
124
+ var eventProps = {};
125
+ if (events) {
126
+ var _loop_1 = function (event_1) {
127
+ if (events.hasOwnProperty(event_1)) {
128
+ var eventFunction_1 = events[event_1];
129
+ eventProps[event_1] = function (value) { return createEvent(eventFunction_1(value), event_1); };
130
+ }
131
+ };
132
+ for (var event_1 in events) {
133
+ _loop_1(event_1);
134
+ }
135
+ }
136
+ return React.createElement(InnerComponent, __assign({}, propsProxy, extendedProps, eventProps, loadersState));
64
137
  }
65
138
  EmbeddableWrapper.displayName = "embedded(".concat((_a = InnerComponent.displayName) !== null && _a !== void 0 ? _a : 'Component', ")");
66
139
  return EmbeddableWrapper;
67
140
  }
68
141
 
69
- var EVENT_NAME = "embeddable:editor:changed";
70
142
  function embedControl(InnerComponent, config) {
71
143
  var _a;
72
- function EmbeddableWrapper(_a) {
73
- var editorId = _a.editorId, initialValue = _a.initialValue;
74
- var _b = React.useState(initialValue), componentState = _b[0], setComponentState = _b[1];
75
- var createEvent = function (value) {
76
- var event = new CustomEvent(EVENT_NAME, {
77
- bubbles: false,
78
- detail: {
79
- editorId: editorId,
80
- value: value
81
- },
82
- });
83
- window.dispatchEvent(event);
144
+ function EmbeddableWrapper(props) {
145
+ var _a, _b;
146
+ var componentId = props.componentId, initialValue = props.initialValue;
147
+ var _c = React.useState(initialValue), componentState = _c[0], setComponentState = _c[1];
148
+ var setter = function (value) {
149
+ setComponentState(value);
150
+ setValue(value, componentId);
84
151
  };
85
- var events = config.events;
86
- var eventProps = {};
87
- var _loop_1 = function (event_1) {
88
- if (events.hasOwnProperty(event_1)) {
89
- var eventFunction_1 = events[event_1];
90
- eventProps[event_1] = function (value) {
91
- eventFunction_1(value, setComponentState);
92
- createEvent(value);
93
- };
94
- }
95
- };
96
- for (var event_1 in events) {
97
- _loop_1(event_1);
98
- }
99
- return React.createElement(InnerComponent, __assign({}, eventProps, config.inputs(componentState)));
152
+ return React.createElement(InnerComponent, __assign({}, config.inputs(componentState, setter), ((_b = (_a = config.mapProps) === null || _a === void 0 ? void 0 : _a.call(config, props)) !== null && _b !== void 0 ? _b : {})));
100
153
  }
101
154
  EmbeddableWrapper.displayName = "embedded(".concat((_a = InnerComponent.displayName) !== null && _a !== void 0 ? _a : 'Editor', ")");
102
155
  return EmbeddableWrapper;
package/lib/index.umd.js CHANGED
@@ -86,58 +86,123 @@
86
86
 
87
87
  var reactExports = react.exports;
88
88
 
89
- var EVENT_NAME$1 = 'embeddable-event:update-props';
89
+ var UPDATE_VALUE_EVENT = "embeddable:value:changed";
90
+ var setValue = function (value, componentId, eventName) {
91
+ var event = new CustomEvent(UPDATE_VALUE_EVENT, {
92
+ bubbles: false,
93
+ detail: {
94
+ componentId: componentId,
95
+ value: value,
96
+ eventName: eventName
97
+ },
98
+ });
99
+ window.dispatchEvent(event);
100
+ };
101
+
102
+ var UPDATE_PROPS_EVENT_NAME = 'embeddable-event:update-props';
103
+ var RELOAD_DATASET_EVENT_NAME = 'embeddable-event:reload-dataset';
104
+ var ReducerActionTypes = {
105
+ loading: 'loading',
106
+ error: 'error',
107
+ data: 'data',
108
+ };
109
+ var reducer = function (state, action) {
110
+ var _a, _b, _c;
111
+ switch (action.type) {
112
+ case (ReducerActionTypes.loading): {
113
+ return __assign(__assign({}, state), (_a = {}, _a[action.inputName] = { isLoading: true }, _a));
114
+ }
115
+ case (ReducerActionTypes.data): {
116
+ return __assign(__assign({}, state), (_b = {}, _b[action.inputName] = { isLoading: false, data: action.payload.data }, _b));
117
+ }
118
+ case (ReducerActionTypes.error): {
119
+ return __assign(__assign({}, state), (_c = {}, _c[action.inputName] = { isLoading: false, error: action.payload.message || action.payload }, _c));
120
+ }
121
+ }
122
+ return state;
123
+ };
124
+ var createInitialLoadersState = function (dataLoaders) { return Object.keys(dataLoaders).reduce(function (loaderState, loaderKey) {
125
+ var _a;
126
+ return (__assign(__assign({}, loaderState), (_a = {}, _a[loaderKey] = { isLoading: false }, _a)));
127
+ }, {}); };
128
+ var latestVariables = {};
90
129
  function embedComponent(InnerComponent, config) {
91
130
  var _a;
92
131
  function EmbeddableWrapper(_a) {
93
132
  var propsUpdateListener = _a.propsUpdateListener, props = __rest(_a, ["propsUpdateListener"]);
94
133
  var _b = reactExports.useState(props), propsProxy = _b[0], setProps = _b[1];
134
+ var componentId = props.componentId;
95
135
  var propsUpdateEventHandler = function (_a) {
96
136
  var detail = _a.detail;
97
137
  return setProps(detail);
98
138
  };
99
139
  reactExports.useEffect(function () {
100
- propsUpdateListener.addEventListener(EVENT_NAME$1, propsUpdateEventHandler);
101
- return function () { return propsUpdateListener.removeEventListener(EVENT_NAME$1, propsUpdateEventHandler); };
140
+ propsUpdateListener.addEventListener(UPDATE_PROPS_EVENT_NAME, propsUpdateEventHandler);
141
+ return function () { return propsUpdateListener.removeEventListener(UPDATE_PROPS_EVENT_NAME, propsUpdateEventHandler); };
102
142
  }, []);
103
143
  var extendedProps = reactExports.useMemo(function () { var _a; return (_a = config === null || config === void 0 ? void 0 : config.extendedProps) === null || _a === void 0 ? void 0 : _a.call(config, propsProxy); }, [propsProxy, config === null || config === void 0 ? void 0 : config.extendedProps]);
104
- return reactExports.createElement(InnerComponent, __assign({}, propsProxy, extendedProps));
144
+ var dataLoaders = reactExports.useMemo(function () { var _a, _b; return (_b = (_a = config === null || config === void 0 ? void 0 : config.dataLoaders) === null || _a === void 0 ? void 0 : _a.call(config, propsProxy)) !== null && _b !== void 0 ? _b : {}; }, [propsProxy, config === null || config === void 0 ? void 0 : config.dataLoaders]);
145
+ var _c = reactExports.useReducer(reducer, dataLoaders, createInitialLoadersState), loadersState = _c[0], dispatch = _c[1];
146
+ var handleDataLoaded = function (inputName) { return function (res) { return dispatch({ type: ReducerActionTypes.data, inputName: inputName, payload: res.data }); }; };
147
+ var handleError = function (inputName) { return function (error) { return dispatch({ type: ReducerActionTypes.error, inputName: inputName, payload: error }); }; };
148
+ var reloadDataset = function (inputName, params) {
149
+ dispatch({ type: ReducerActionTypes.loading, inputName: inputName });
150
+ params.dataLoader(params.requestParams, latestVariables)
151
+ .then(handleDataLoaded(inputName))
152
+ .catch(handleError(inputName));
153
+ };
154
+ var variableChangedEventHandler = function (_a) {
155
+ var detail = _a.detail;
156
+ latestVariables = detail.variableValues;
157
+ Object.entries(dataLoaders)
158
+ .filter(function (_a) {
159
+ _a[0]; var params = _a[1];
160
+ return params.requestParams.from.datasetId === detail.datasetId;
161
+ })
162
+ .forEach(function (_a) {
163
+ var inputName = _a[0], params = _a[1];
164
+ return reloadDataset(inputName, params);
165
+ });
166
+ };
167
+ reactExports.useEffect(function () {
168
+ Object.entries(dataLoaders).forEach(function (_a) {
169
+ var inputName = _a[0], params = _a[1];
170
+ return reloadDataset(inputName, params);
171
+ });
172
+ window.addEventListener(RELOAD_DATASET_EVENT_NAME, variableChangedEventHandler);
173
+ return function () { return window.removeEventListener(RELOAD_DATASET_EVENT_NAME, variableChangedEventHandler); };
174
+ }, [JSON.stringify(Object.values(dataLoaders).map(function (loader) { return loader.requestParams; }))]);
175
+ var createEvent = function (value, eventName) { return setValue(value, componentId, eventName); };
176
+ var events = config === null || config === void 0 ? void 0 : config.events;
177
+ var eventProps = {};
178
+ if (events) {
179
+ var _loop_1 = function (event_1) {
180
+ if (events.hasOwnProperty(event_1)) {
181
+ var eventFunction_1 = events[event_1];
182
+ eventProps[event_1] = function (value) { return createEvent(eventFunction_1(value), event_1); };
183
+ }
184
+ };
185
+ for (var event_1 in events) {
186
+ _loop_1(event_1);
187
+ }
188
+ }
189
+ return reactExports.createElement(InnerComponent, __assign({}, propsProxy, extendedProps, eventProps, loadersState));
105
190
  }
106
191
  EmbeddableWrapper.displayName = "embedded(".concat((_a = InnerComponent.displayName) !== null && _a !== void 0 ? _a : 'Component', ")");
107
192
  return EmbeddableWrapper;
108
193
  }
109
194
 
110
- var EVENT_NAME = "embeddable:editor:changed";
111
195
  function embedControl(InnerComponent, config) {
112
196
  var _a;
113
- function EmbeddableWrapper(_a) {
114
- var editorId = _a.editorId, initialValue = _a.initialValue;
115
- var _b = reactExports.useState(initialValue), componentState = _b[0], setComponentState = _b[1];
116
- var createEvent = function (value) {
117
- var event = new CustomEvent(EVENT_NAME, {
118
- bubbles: false,
119
- detail: {
120
- editorId: editorId,
121
- value: value
122
- },
123
- });
124
- window.dispatchEvent(event);
125
- };
126
- var events = config.events;
127
- var eventProps = {};
128
- var _loop_1 = function (event_1) {
129
- if (events.hasOwnProperty(event_1)) {
130
- var eventFunction_1 = events[event_1];
131
- eventProps[event_1] = function (value) {
132
- eventFunction_1(value, setComponentState);
133
- createEvent(value);
134
- };
135
- }
197
+ function EmbeddableWrapper(props) {
198
+ var _a, _b;
199
+ var componentId = props.componentId, initialValue = props.initialValue;
200
+ var _c = reactExports.useState(initialValue), componentState = _c[0], setComponentState = _c[1];
201
+ var setter = function (value) {
202
+ setComponentState(value);
203
+ setValue(value, componentId);
136
204
  };
137
- for (var event_1 in events) {
138
- _loop_1(event_1);
139
- }
140
- return reactExports.createElement(InnerComponent, __assign({}, eventProps, config.inputs(componentState)));
205
+ return reactExports.createElement(InnerComponent, __assign({}, config.inputs(componentState, setter), ((_b = (_a = config.mapProps) === null || _a === void 0 ? void 0 : _a.call(config, props)) !== null && _b !== void 0 ? _b : {})));
141
206
  }
142
207
  EmbeddableWrapper.displayName = "embedded(".concat((_a = InnerComponent.displayName) !== null && _a !== void 0 ? _a : 'Editor', ")");
143
208
  return EmbeddableWrapper;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@embeddable.com/sdk-react",
3
- "version": "0.0.16",
3
+ "version": "0.1.0",
4
4
  "description": "Embeddable SDK React plugin/module responsible for React components bundling.",
5
5
  "keywords": [
6
6
  "embeddable",
package/scripts/build.js CHANGED
@@ -1,6 +1,7 @@
1
1
  const path = require("path");
2
2
  const { fork } = require('child_process');
3
3
  const oraP = import('ora');
4
+ const core = require("@embeddable.com/sdk-core/scripts");
4
5
 
5
6
  const {createContext} = require("./createContext");
6
7
  const {prepare} = require("./prepare");
@@ -30,6 +31,8 @@ async function build() {
30
31
  generateFork.on('exit', async () => {
31
32
  await cleanup(ctx);
32
33
  spinnerBuild.succeed("build completed");
34
+
35
+ await core.buildTypes(ctx);
33
36
  })
34
37
 
35
38
  }
@@ -9,11 +9,12 @@ function createContext (pluginRoot, clientRoot) {
9
9
  client: {
10
10
  rootDir: clientRoot,
11
11
  srcDir: path.resolve(clientRoot, 'src'), // TODO: should be specified via command parameters or from rc file.
12
- buildDir: path.resolve(clientRoot, '.embeddable-build')
12
+ buildDir: path.resolve(clientRoot, '.embeddable-build'),
13
13
  },
14
14
  outputOptions: { // TODO: should be specified via command parameters or from rc file.
15
15
  fileName: 'embeddable-prepared',
16
16
  buildName: 'embeddable-prepared-build',
17
+ typesEntryPointFilename: 'embeddable-types-entry-point.js',
17
18
  },
18
19
  };
19
20
  }
@@ -10,7 +10,7 @@ process.on('message', async ({ ctx }) => {
10
10
  process.exit();
11
11
  });
12
12
 
13
- const EMB_FILE_REGEX = /^(.*)\.emb\.[jt]s$/;
13
+ const EMB_FILE_REGEX = /^(.*)(?<!\.type)\.emb\.[jt]s$/;
14
14
 
15
15
  async function generate(ctx) {
16
16
  const filesList = await core.findEmbFiles(ctx.client.srcDir, EMB_FILE_REGEX);