react-elmish 8.0.0-beta.1 → 8.1.0

package/README.md

@@ -20,14 +20,17 @@ This library brings the elmish pattern to react.
 - [Setup](#setup)
 - [Error handling](#error-handling)
 - [React life cycle management](#react-life-cycle-management)
+- [Deferring model updates and messages](#deferring-model-updates-and-messages)
+- [Call back parent components](#call-back-parent-components)
 - [Composition](#composition)
   - [With an `UpdateMap`](#with-an-updatemap)
-- [With an update function](#with-an-update-function)
-- [Call back parent components](#call-back-parent-components)
+  - [With an update function](#with-an-update-function)
+  - [Merge multiple subscriptions](#merge-multiple-subscriptions)
 - [Testing](#testing)
   - [Testing the init function](#testing-the-init-function)
   - [Testing the update handler](#testing-the-update-handler)
   - [Combine update and execCmd](#combine-update-and-execcmd)
+  - [Testing subscriptions](#testing-subscriptions)
   - [UI Tests](#ui-tests)
 - [Migrations](#migrations)
   - [From v1.x to v2.x](#from-v1x-to-v2x)
@@ -262,12 +265,6 @@ You can call one of the functions of that object:
 | `cmd.ofEither` | Calls a function (sync or async) and maps the result into a message. |
 | `cmd.ofSuccess` | Same as `ofEither` but ignores the error case. |
 | `cmd.ofError` | Same as `ofEither` but ignores the success case. |
-| `cmd.ofFunc.either` | Calls a synchronous function and maps the result into a message. |
-| `cmd.ofFunc.perform` | Same as `either` but ignores the error case.  |
-| `cmd.ofFunc.attempt` | Same as `either` but ignores the success case.  |
-| `cmd.ofPromise.either` | Calls an async function and maps the result into a message. |
-| `cmd.ofPromise.perform` | Same as `either` but ignores the error case. |
-| `cmd.ofPromise.attempt` | Same as `either` but ignores the success case. |
 | `cmd.ofSub` | Use this function to trigger a command in a subscription. |
 
 ### Dispatch a message
@@ -568,6 +565,97 @@ class App extends ElmComponent<Shared.Model, Shared.Message, Shared.Props> {
 
 In a functional component you can use the **useEffect** hook as normal.
 
+## Deferring model updates and messages
+
+Sometimes you want to always dispatch a message or update the model in all cases. You can use the `defer` function from the `options` parameter to do this. The `options` parameter is the fourth parameter of the `update` function.
+
+Without the `defer` function, you would have to return the model and the command in all cases:
+
+```ts
+const update: UpdateMap<Props, Model, Message> = {
+    deferSomething (_msg, model) {
+        if (model.someCondition) {
+            return [{ alwaysUpdate: "someValue", extra: "extra" }, cmd.ofMsg(Msg.alwaysExecute())];
+        }
+
+        return [{ alwaysUpdate: "someValue" }, cmd.ofMsg(Msg.doSomethingElse()), cmd.ofMsg(Msg.alwaysExecute())];
+    },
+
+    ...LoadSettings.update,
+};
+```
+
+Here we always want to update the model with the `alwaysUpdate` property and always dispatch the `alwaysExecute` message.
+
+With the `defer` function, you can do this:
+
+```ts
+const update: UpdateMap<Props, Model, Message> = {
+    deferSomething (_msg, model, _props, { defer }) {
+        defer({ alwaysUpdate: "someValue" }, cmd.ofMsg(Msg.alwaysExecute()));
+
+        if (model.someCondition) {
+            return [{ extra: "extra" }];
+        }
+
+        return [{}, cmd.ofMsg(Msg.doSomethingElse())];
+    },
+
+    ...LoadSettings.update,
+};
+```
+
+The `defer` function can be called multiple times. Model updates and commands are then aggregated. Model updates by the return value overwrite the deferred model updates, while deferred messages are dispatched after the returned messages.
+
+## Call back parent components
+
+Since each component has its own model and messages, communication with parent components is done via callback functions.
+
+To inform the parent component about some action, let's say to close a dialog form, you do the following:
+
+1. Create a message
+
+    ```ts Dialog.ts
+    export type Message =
+        ...
+        | { name: "close" }
+        ...
+
+    export const Msg = {
+        ...
+        close: (): Message => ({ name: "close" }),
+        ...
+    }
+    ```
+
+1. Define a callback function property in the **Props**:
+
+    ```ts Dialog.ts
+    export type Props = {
+        onClose: () => void,
+    };
+    ```
+
+1. Handle the message and call the callback function:
+
+    ```ts Dialog.ts
+    {
+        // ...
+        close () {
+            return [{}, cmd.ofError(props.onClose, Msg.error)];
+        }
+        // ...
+    };
+    ```
+
+1. In the **render** method of the parent component pass the callback as prop
+
+    ```tsx Parent.tsx
+    ...
+    <Dialog onClose={() => this.dispatch(Msg.closeDialog())}>
+    ...
+    ```
+
 ## Composition
 
 If you have some business logic that you want to reuse in other components, you can do this by using different sources for messages.
@@ -670,10 +758,20 @@ const update: UpdateMap<Props, Model, Message> = {
     },
 
     ...LoadSettings.update,
+
+    // You can overwrite the LoadSettings messages handlers here
+
+    settingsLoaded (_msg, _model, _props, { defer, callBase }) {
+        // Use defer and callBase to execute the original handler function:
+        defer(...callBase(LoadSettings.settingsLoaded));
+
+        // Do additional stuff
+        return [{ /* ... */ }];
+    }
 };
 ```
 
-## With an update function
+### With an update function
 
 Let's say you want to load some settings, you can write a module like this:
 
@@ -797,54 +895,20 @@ const updateComposition = (model: Model, msg: CompositionMessage): Elm.UpdateRet
 }
 ```
 
-## Call back parent components
+### Merge multiple subscriptions
 
-Since each component has its own model and messages, communication with parent components is done via callback functions.
-
-To inform the parent component about some action, let's say to close a dialog form, you do the following:
-
-1. Create a message
+If you use composition and thus have multiple subscriptions, you can merge them with the `mergeSubscriptions` function:
 
-    ```ts Dialog.ts
-    export type Message =
-        ...
-        | { name: "close" }
-        ...
-
-    export const Msg = {
-        ...
-        close: (): Message => ({ name: "close" }),
-        ...
-    }
-    ```
-
-1. Define a callback function property in the **Props**:
-
-    ```ts Dialog.ts
-    export type Props = {
-        onClose: () => void,
-    };
-    ```
-
-1. Handle the message and call the callback function:
-
-    ```ts Dialog.ts
-    {
-        // ...
-        close () {
-            return [{}, cmd.ofError(props.onClose, Msg.error)];
-        }
-        // ...
-    };
-    ```
+```ts
+import { mergeSubscriptions } from "react-elmish";
+import * as LoadSettings from "./LoadSettings";
 
-1. In the **render** method of the parent component pass the callback as prop
+function localSubscription (model: Model): SubscriptionResult<Message> {
+    // ...
+}
 
-    ```tsx Parent.tsx
-    ...
-    <Dialog onClose={() => this.dispatch(Msg.closeDialog())}>
-    ...
-    ```
+const subscription = mergeSubscriptions(LoadSettings.subscription, localSubscription);
+```
 
 ## Testing
 
@@ -903,7 +967,7 @@ const createUpdateArgs = getCreateUpdateArgs(init, () => ({ /* initial props */
 
 it("returns the correct model and cmd", async () => {
     // arrange
-    const args = createUpdateArgs(Msg.test(), { /* optionally override model here */ }, { /* optionally override props here */ });
+    const args = createUpdateArgs(Msg.test(), { /* optionally override model here */ }, { /* optionally override props here */ }, { /* optionally override options here */ });
 
     // act
     // Call the update handler
@@ -950,6 +1014,33 @@ it("returns the correct cmd", async () => {
 ...
 ```
 
+### Testing subscriptions
+
+It is almost the same as testing the `update` function. You can use the `getCreateModelAndProps` function to create a factory for the model and the props. Then use `execSubscription` to execute the subscriptions:
+
+```ts
+import { getCreateModelAndProps, execSubscription } from "react-elmish/dist/Testing";
+import { init, Msg, subscription } from "./MyComponent";
+
+const createModelAndProps = getCreateModelAndProps(init, () => ({ /* initial props */ }));
+
+it("dispatches the eventTriggered message", async () => {
+    // arrange
+    const mockDispatch = jest.fn();
+    const args = createModelAndProps({ /* optionally override model here */ }, { /* optionally override props here */ });
+    const dispose = execSubscription(subscription, mockDispatch, ...args);
+
+    // act
+    // Trigger events
+
+    // assert
+    expect(mockDispatch).toHaveBeenCalledWith(Msg.eventTriggered());
+
+    // Dispose the subscriptions if required
+    dispose();
+});
+```
+
 ### UI Tests
 
 To test UI components with a fake model you can use `renderWithModel` from the Testing namespace. The first parameter is a function to render your component (e.g. with **@testing-library/react**). The second parameter is the fake model. The third parameter is an optional options object, where you can also pass a fake `dispatch` function.

package/dist/Common.d.ts

@@ -1,5 +1,5 @@
-import { Cmd, Dispatch, Message } from "./Types";
+import type { Cmd, Dispatch, Message } from "./Types";
 declare function logMessage<TMessage extends Message>(name: string, msg: TMessage): void;
 declare function modelHasChanged<TModel>(currentModel: TModel, model: Partial<TModel>): boolean;
 declare function execCmd<TMessage>(dispatch: Dispatch<TMessage>, ...commands: (Cmd<TMessage> | undefined)[]): void;
-export { logMessage, modelHasChanged, execCmd, };
+export { execCmd, logMessage, modelHasChanged };

package/dist/Common.js

@@ -7,11 +7,14 @@ exports.execCmd = execCmd;
 exports.logMessage = logMessage;
 exports.modelHasChanged = modelHasChanged;
 var _Init = require("./Init");
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } 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 o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 function logMessage(name, msg) {
   var _Services$logger, _Services$logger2, _Services$dispatchMid;
-  (_Services$logger = _Init.Services.logger) === null || _Services$logger === void 0 ? void 0 : _Services$logger.info("Message from", name, msg.name);
-  (_Services$logger2 = _Init.Services.logger) === null || _Services$logger2 === void 0 ? void 0 : _Services$logger2.debug("Message from", name, msg);
-  (_Services$dispatchMid = _Init.Services.dispatchMiddleware) === null || _Services$dispatchMid === void 0 ? void 0 : _Services$dispatchMid.call(_Init.Services, msg);
+  (_Services$logger = _Init.Services.logger) === null || _Services$logger === void 0 || _Services$logger.info("Message from", name, msg.name);
+  (_Services$logger2 = _Init.Services.logger) === null || _Services$logger2 === void 0 || _Services$logger2.debug("Message from", name, msg);
+  (_Services$dispatchMid = _Init.Services.dispatchMiddleware) === null || _Services$dispatchMid === void 0 || _Services$dispatchMid.call(_Init.Services, msg);
 }
 function modelHasChanged(currentModel, model) {
   return !Object.is(model, currentModel) && Object.getOwnPropertyNames(model).length > 0;
@@ -20,10 +23,19 @@ function execCmd(dispatch) {
   for (var _len = arguments.length, commands = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
     commands[_key - 1] = arguments[_key];
   }
-  commands.forEach(function (cmd) {
-    return cmd === null || cmd === void 0 ? void 0 : cmd.forEach(function (call) {
-      return call(dispatch);
-    });
-  });
+  var _iterator = _createForOfIteratorHelper(commands.flat()),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var call = _step.value;
+      if (call) {
+        call(dispatch);
+      }
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
 }
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJfSW5pdCIsInJlcXVpcmUiLCJsb2dNZXNzYWdlIiwibmFtZSIsIm1zZyIsIl9TZXJ2aWNlcyRsb2dnZXIiLCJfU2VydmljZXMkbG9nZ2VyMiIsIl9TZXJ2aWNlcyRkaXNwYXRjaE1pZCIsIlNlcnZpY2VzIiwibG9nZ2VyIiwiaW5mbyIsImRlYnVnIiwiZGlzcGF0Y2hNaWRkbGV3YXJlIiwiY2FsbCIsIm1vZGVsSGFzQ2hhbmdlZCIsImN1cnJlbnRNb2RlbCIsIm1vZGVsIiwiT2JqZWN0IiwiaXMiLCJnZXRPd25Qcm9wZXJ0eU5hbWVzIiwibGVuZ3RoIiwiZXhlY0NtZCIsImRpc3BhdGNoIiwiX2xlbiIsImFyZ3VtZW50cyIsImNvbW1hbmRzIiwiQXJyYXkiLCJfa2V5IiwiZm9yRWFjaCIsImNtZCJdLCJzb3VyY2VzIjpbIi4uL3NyYy9Db21tb24udHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgU2VydmljZXMgfSBmcm9tIFwiLi9Jbml0XCI7XG5pbXBvcnQgeyBDbWQsIERpc3BhdGNoLCBNZXNzYWdlIH0gZnJvbSBcIi4vVHlwZXNcIjtcblxuZnVuY3Rpb24gbG9nTWVzc2FnZTxUTWVzc2FnZSBleHRlbmRzIE1lc3NhZ2U+IChuYW1lOiBzdHJpbmcsIG1zZzogVE1lc3NhZ2UpOiB2b2lkIHtcbiAgICBTZXJ2aWNlcy5sb2dnZXI/LmluZm8oXCJNZXNzYWdlIGZyb21cIiwgbmFtZSwgbXNnLm5hbWUpO1xuICAgIFNlcnZpY2VzLmxvZ2dlcj8uZGVidWcoXCJNZXNzYWdlIGZyb21cIiwgbmFtZSwgbXNnKTtcblxuICAgIFNlcnZpY2VzLmRpc3BhdGNoTWlkZGxld2FyZT8uKG1zZyk7XG59XG5cbmZ1bmN0aW9uIG1vZGVsSGFzQ2hhbmdlZDxUTW9kZWw+IChjdXJyZW50TW9kZWw6IFRNb2RlbCwgbW9kZWw6IFBhcnRpYWw8VE1vZGVsPik6IGJvb2xlYW4ge1xuICAgIHJldHVybiAhT2JqZWN0LmlzKG1vZGVsLCBjdXJyZW50TW9kZWwpICYmIE9iamVjdC5nZXRPd25Qcm9wZXJ0eU5hbWVzKG1vZGVsKS5sZW5ndGggPiAwO1xufVxuXG5mdW5jdGlvbiBleGVjQ21kPFRNZXNzYWdlPiAoZGlzcGF0Y2g6IERpc3BhdGNoPFRNZXNzYWdlPiwgLi4uY29tbWFuZHM6IChDbWQ8VE1lc3NhZ2U+IHwgdW5kZWZpbmVkKSBbXSk6IHZvaWQge1xuICAgIGNvbW1hbmRzLmZvckVhY2goY21kID0+IGNtZD8uZm9yRWFjaChjYWxsID0+IGNhbGwoZGlzcGF0Y2gpKSk7XG59XG5cbmV4cG9ydCB7XG4gICAgbG9nTWVzc2FnZSxcbiAgICBtb2RlbEhhc0NoYW5nZWQsXG4gICAgZXhlY0NtZCxcbn07Il0sIm1hcHBpbmdzIjoiOzs7Ozs7OztBQUFBLElBQUFBLEtBQUEsR0FBQUMsT0FBQTtBQUdBLFNBQVNDLFVBQVVBLENBQTRCQyxJQUFZLEVBQUVDLEdBQWEsRUFBUTtFQUFBLElBQUFDLGdCQUFBLEVBQUFDLGlCQUFBLEVBQUFDLHFCQUFBO0VBQzlFLENBQUFGLGdCQUFBLEdBQUFHLGNBQVEsQ0FBQ0MsTUFBTSxjQUFBSixnQkFBQSx1QkFBZkEsZ0JBQUEsQ0FBaUJLLElBQUksQ0FBQyxjQUFjLEVBQUVQLElBQUksRUFBRUMsR0FBRyxDQUFDRCxJQUFJLENBQUM7RUFDckQsQ0FBQUcsaUJBQUEsR0FBQUUsY0FBUSxDQUFDQyxNQUFNLGNBQUFILGlCQUFBLHVCQUFmQSxpQkFBQSxDQUFpQkssS0FBSyxDQUFDLGNBQWMsRUFBRVIsSUFBSSxFQUFFQyxHQUFHLENBQUM7RUFFakQsQ0FBQUcscUJBQUEsR0FBQUMsY0FBUSxDQUFDSSxrQkFBa0IsY0FBQUwscUJBQUEsdUJBQTNCQSxxQkFBQSxDQUFBTSxJQUFBLENBQUFMLGNBQVEsRUFBc0JKLEdBQUcsQ0FBQztBQUN0QztBQUVBLFNBQVNVLGVBQWVBLENBQVVDLFlBQW9CLEVBQUVDLEtBQXNCLEVBQVc7RUFDckYsT0FBTyxDQUFDQyxNQUFNLENBQUNDLEVBQUUsQ0FBQ0YsS0FBSyxFQUFFRCxZQUFZLENBQUMsSUFBSUUsTUFBTSxDQUFDRSxtQkFBbUIsQ0FBQ0gsS0FBSyxDQUFDLENBQUNJLE1BQU0sR0FBRyxDQUFDO0FBQzFGO0FBRUEsU0FBU0MsT0FBT0EsQ0FBWUMsUUFBNEIsRUFBcUQ7RUFBQSxTQUFBQyxJQUFBLEdBQUFDLFNBQUEsQ0FBQUosTUFBQSxFQUFoREssUUFBUSxPQUFBQyxLQUFBLENBQUFILElBQUEsT0FBQUEsSUFBQSxXQUFBSSxJQUFBLE1BQUFBLElBQUEsR0FBQUosSUFBQSxFQUFBSSxJQUFBO0lBQVJGLFFBQVEsQ0FBQUUsSUFBQSxRQUFBSCxTQUFBLENBQUFHLElBQUE7RUFBQTtFQUNqRUYsUUFBUSxDQUFDRyxPQUFPLENBQUMsVUFBQUMsR0FBRztJQUFBLE9BQUlBLEdBQUcsYUFBSEEsR0FBRyx1QkFBSEEsR0FBRyxDQUFFRCxPQUFPLENBQUMsVUFBQWYsSUFBSTtNQUFBLE9BQUlBLElBQUksQ0FBQ1MsUUFBUSxDQUFDO0lBQUEsRUFBQztFQUFBLEVBQUM7QUFDakUifQ==
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJfSW5pdCIsInJlcXVpcmUiLCJfY3JlYXRlRm9yT2ZJdGVyYXRvckhlbHBlciIsInIiLCJlIiwidCIsIlN5bWJvbCIsIml0ZXJhdG9yIiwiQXJyYXkiLCJpc0FycmF5IiwiX3Vuc3VwcG9ydGVkSXRlcmFibGVUb0FycmF5IiwibGVuZ3RoIiwiX24iLCJGIiwicyIsIm4iLCJkb25lIiwidmFsdWUiLCJmIiwiVHlwZUVycm9yIiwibyIsImEiLCJ1IiwiY2FsbCIsIm5leHQiLCJfYXJyYXlMaWtlVG9BcnJheSIsInRvU3RyaW5nIiwic2xpY2UiLCJjb25zdHJ1Y3RvciIsIm5hbWUiLCJmcm9tIiwidGVzdCIsImxvZ01lc3NhZ2UiLCJtc2ciLCJfU2VydmljZXMkbG9nZ2VyIiwiX1NlcnZpY2VzJGxvZ2dlcjIiLCJfU2VydmljZXMkZGlzcGF0Y2hNaWQiLCJTZXJ2aWNlcyIsImxvZ2dlciIsImluZm8iLCJkZWJ1ZyIsImRpc3BhdGNoTWlkZGxld2FyZSIsIm1vZGVsSGFzQ2hhbmdlZCIsImN1cnJlbnRNb2RlbCIsIm1vZGVsIiwiT2JqZWN0IiwiaXMiLCJnZXRPd25Qcm9wZXJ0eU5hbWVzIiwiZXhlY0NtZCIsImRpc3BhdGNoIiwiX2xlbiIsImFyZ3VtZW50cyIsImNvbW1hbmRzIiwiX2tleSIsIl9pdGVyYXRvciIsImZsYXQiLCJfc3RlcCIsImVyciJdLCJzb3VyY2VzIjpbIi4uL3NyYy9Db21tb24udHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgU2VydmljZXMgfSBmcm9tIFwiLi9Jbml0XCI7XG5pbXBvcnQgdHlwZSB7IENtZCwgRGlzcGF0Y2gsIE1lc3NhZ2UgfSBmcm9tIFwiLi9UeXBlc1wiO1xuXG5mdW5jdGlvbiBsb2dNZXNzYWdlPFRNZXNzYWdlIGV4dGVuZHMgTWVzc2FnZT4obmFtZTogc3RyaW5nLCBtc2c6IFRNZXNzYWdlKTogdm9pZCB7XG5cdFNlcnZpY2VzLmxvZ2dlcj8uaW5mbyhcIk1lc3NhZ2UgZnJvbVwiLCBuYW1lLCBtc2cubmFtZSk7XG5cdFNlcnZpY2VzLmxvZ2dlcj8uZGVidWcoXCJNZXNzYWdlIGZyb21cIiwgbmFtZSwgbXNnKTtcblxuXHRTZXJ2aWNlcy5kaXNwYXRjaE1pZGRsZXdhcmU/Lihtc2cpO1xufVxuXG5mdW5jdGlvbiBtb2RlbEhhc0NoYW5nZWQ8VE1vZGVsPihjdXJyZW50TW9kZWw6IFRNb2RlbCwgbW9kZWw6IFBhcnRpYWw8VE1vZGVsPik6IGJvb2xlYW4ge1xuXHRyZXR1cm4gIU9iamVjdC5pcyhtb2RlbCwgY3VycmVudE1vZGVsKSAmJiBPYmplY3QuZ2V0T3duUHJvcGVydHlOYW1lcyhtb2RlbCkubGVuZ3RoID4gMDtcbn1cblxuZnVuY3Rpb24gZXhlY0NtZDxUTWVzc2FnZT4oZGlzcGF0Y2g6IERpc3BhdGNoPFRNZXNzYWdlPiwgLi4uY29tbWFuZHM6IChDbWQ8VE1lc3NhZ2U+IHwgdW5kZWZpbmVkKVtdKTogdm9pZCB7XG5cdGZvciAoY29uc3QgY2FsbCBvZiBjb21tYW5kcy5mbGF0KCkpIHtcblx0XHRpZiAoY2FsbCkge1xuXHRcdFx0Y2FsbChkaXNwYXRjaCk7XG5cdFx0fVxuXHR9XG59XG5cbmV4cG9ydCB7IGV4ZWNDbWQsIGxvZ01lc3NhZ2UsIG1vZGVsSGFzQ2hhbmdlZCB9O1xuIl0sIm1hcHBpbmdzIjoiOzs7Ozs7OztBQUFBLElBQUFBLEtBQUEsR0FBQUMsT0FBQTtBQUFrQyxTQUFBQywyQkFBQUMsQ0FBQSxFQUFBQyxDQUFBLFFBQUFDLENBQUEseUJBQUFDLE1BQUEsSUFBQUgsQ0FBQSxDQUFBRyxNQUFBLENBQUFDLFFBQUEsS0FBQUosQ0FBQSxxQkFBQUUsQ0FBQSxRQUFBRyxLQUFBLENBQUFDLE9BQUEsQ0FBQU4sQ0FBQSxNQUFBRSxDQUFBLEdBQUFLLDJCQUFBLENBQUFQLENBQUEsTUFBQUMsQ0FBQSxJQUFBRCxDQUFBLHVCQUFBQSxDQUFBLENBQUFRLE1BQUEsSUFBQU4sQ0FBQSxLQUFBRixDQUFBLEdBQUFFLENBQUEsT0FBQU8sRUFBQSxNQUFBQyxDQUFBLFlBQUFBLEVBQUEsZUFBQUMs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

package/dist/ElmComponent.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { InitFunction, Message, UpdateFunction } from "./Types";
+import type { InitFunction, Message, UpdateFunction } from "./Types";
 /**
  * Abstract class for a react class component using the Elmish pattern.
  * @export
@@ -14,7 +14,7 @@ declare abstract class ElmComponent<TModel, TMessage extends Message, TProps> ex
     private initCommands;
     private readonly componentName;
     private readonly buffer;
-    private reentered;
+    private running;
     private mounted;
     private currentModel;
     /**
@@ -55,10 +55,11 @@ declare abstract class ElmComponent<TModel, TMessage extends Message, TProps> ex
      * @param {TModel} model The current model.
      * @param {TMessage} msg The message to process.
      * @param {TProps} props The props of the component.
+     * @param options The options for the update function.
      * @returns The new model (can also be an empty object {}) and an optional new message to dispatch.
      * @abstract
      * @memberof ElmComponent
      */
     abstract update: UpdateFunction<TProps, TModel, TMessage>;
 }
-export { ElmComponent, };
+export { ElmComponent };