@itwin/components-react 3.2.1 → 3.2.4

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/CHANGELOG.md CHANGED
@@ -1,6 +1,23 @@
1
1
  # Change Log - @itwin/components-react
2
2
 
3
- This log was last generated on Tue, 07 Jun 2022 15:02:56 GMT and should not be manually modified.
3
+ This log was last generated on Tue, 21 Jun 2022 18:06:33 GMT and should not be manually modified.
4
+
5
+ ## 3.2.4
6
+ Tue, 21 Jun 2022 18:06:33 GMT
7
+
8
+ _Version update only_
9
+
10
+ ## 3.2.3
11
+ Fri, 17 Jun 2022 15:18:39 GMT
12
+
13
+ _Version update only_
14
+
15
+ ## 3.2.2
16
+ Fri, 10 Jun 2022 16:11:36 GMT
17
+
18
+ ### Updates
19
+
20
+ - Fix `useTreeModel` returning stale model for the given model source
4
21
 
5
22
  ## 3.2.1
6
23
  Tue, 07 Jun 2022 15:02:56 GMT
@@ -1 +1 @@
1
- {"version":3,"file":"TreeHooks.d.ts","sourceRoot":"","sources":["../../../../../src/components-react/tree/controlled/TreeHooks.ts"],"names":[],"mappings":"AAIA;;GAEG;AAIH,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEvE;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,WAAW,EAAE,eAAe,GAAG,SAAS,CAYpE;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,aAAa,SAAS,gBAAgB,EAAE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,iCAGlI;AAED;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,aAAa,SAAS,gBAAgB,EAAE,YAAY,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,EAAE,eAAe,sCAGzJ;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAAC,YAAY,EAAE,gBAAgB,mBAGhE;AAED;;;;;;;;GAQG;AACH,wBAAgB,oBAAoB,CAAC,cAAc,SAAS,gBAAgB,EAAE,eAAe,EAAE,CAAC,MAAM,cAAc,CAAC,GAAG,sBAAsB,oBAO7I"}
1
+ {"version":3,"file":"TreeHooks.d.ts","sourceRoot":"","sources":["../../../../../src/components-react/tree/controlled/TreeHooks.ts"],"names":[],"mappings":"AAIA;;GAEG;AAKH,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEvE;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,WAAW,EAAE,eAAe,GAAG,SAAS,CAMpE;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,aAAa,SAAS,gBAAgB,EAAE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,iCAGlI;AAED;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,aAAa,SAAS,gBAAgB,EAAE,YAAY,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,EAAE,eAAe,sCAGzJ;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAAC,YAAY,EAAE,gBAAgB,mBAGhE;AAED;;;;;;;;GAQG;AACH,wBAAgB,oBAAoB,CAAC,cAAc,SAAS,gBAAgB,EAAE,eAAe,EAAE,CAAC,MAAM,cAAc,CAAC,GAAG,sBAAsB,oBAO7I"}
@@ -10,6 +10,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
10
10
  exports.useTreeEventsHandler = exports.useTreeModelSource = exports.usePagedTreeNodeLoader = exports.useTreeNodeLoader = exports.useTreeModel = void 0;
11
11
  const react_1 = require("react");
12
12
  const core_react_1 = require("@itwin/core-react");
13
+ const UseRerender_1 = require("../../common/UseRerender");
13
14
  const TreeEventHandler_1 = require("./TreeEventHandler");
14
15
  const TreeModelSource_1 = require("./TreeModelSource");
15
16
  const TreeNodeLoader_1 = require("./TreeNodeLoader");
@@ -20,15 +21,11 @@ const TreeNodeLoader_1 = require("./TreeNodeLoader");
20
21
  * @public
21
22
  */
22
23
  function useTreeModel(modelSource) {
23
- const [model, setModel] = (0, react_1.useState)(modelSource.getModel());
24
+ const { rerender } = (0, UseRerender_1.useRerender)();
24
25
  (0, react_1.useEffect)(() => {
25
- const onModelChanged = () => {
26
- setModel(modelSource.getModel());
27
- };
28
- onModelChanged();
29
- return modelSource.onModelChanged.addListener(onModelChanged);
30
- }, [modelSource]);
31
- return model;
26
+ return modelSource.onModelChanged.addListener(rerender);
27
+ }, [modelSource, rerender]);
28
+ return modelSource.getModel();
32
29
  }
33
30
  exports.useTreeModel = useTreeModel;
34
31
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"TreeHooks.js","sourceRoot":"","sources":["../../../../../src/components-react/tree/controlled/TreeHooks.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,iCAAkE;AAClE,kDAAkD;AAElD,yDAA8E;AAE9E,uDAAoD;AACpD,qDAAuE;AAEvE;;;;;GAKG;AACH,SAAgB,YAAY,CAAC,WAA4B;IACvD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAC,WAAW,CAAC,QAAQ,EAAE,CAAC,CAAC;IAE3D,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,GAAG,EAAE;YAC1B,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,CAAC,CAAC;QACnC,CAAC,CAAC;QACF,cAAc,EAAE,CAAC;QACjB,OAAO,WAAW,CAAC,cAAc,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;IAChE,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,OAAO,KAAK,CAAC;AACf,CAAC;AAZD,oCAYC;AAED;;;;;GAKG;AACH,SAAgB,iBAAiB,CAAyC,YAA2B,EAAE,WAA4B;IACjI,MAAM,YAAY,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE,CAAC,IAAI,+BAAc,CAAC,YAAY,EAAE,WAAW,CAAC,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC,CAAC;IACnH,OAAO,IAAA,0BAAa,EAAC,YAAY,CAAC,CAAC;AACrC,CAAC;AAHD,8CAGC;AAED;;;;GAIG;AACH,SAAgB,sBAAsB,CAAyC,YAA2B,EAAE,QAAgB,EAAE,WAA4B;IACxJ,MAAM,YAAY,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE,CAAC,IAAI,oCAAmB,CAAC,YAAY,EAAE,WAAW,EAAE,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;IAC5I,OAAO,IAAA,0BAAa,EAAC,YAAY,CAAC,CAAC;AACrC,CAAC;AAHD,wDAGC;AAED;;;;;;;GAOG;AACH,SAAgB,kBAAkB,CAAC,YAA8B;IAC/D,0HAA0H;IAC1H,OAAO,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,IAAI,iCAAe,EAAE,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,kDAAkD;AACjH,CAAC;AAHD,gDAGC;AAED;;;;;;;;GAQG;AACH,SAAgB,oBAAoB,CAA0C,eAAgE;IAC5I,MAAM,OAAO,GAAG,IAAA,mBAAW,EAAC,GAAqB,EAAE;QACjD,IAAI,OAAO,eAAe,KAAK,UAAU;YACvC,OAAO,eAAe,EAAE,CAAC;QAC3B,OAAO,IAAI,mCAAgB,CAAC,eAAe,CAAC,CAAC;IAC/C,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IACtB,OAAO,IAAA,0BAAa,EAAC,OAAO,CAAC,CAAC;AAChC,CAAC;AAPD,oDAOC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Tree\r\n */\r\n\r\nimport { useCallback, useEffect, useMemo, useState } from \"react\";\r\nimport { useDisposable } from \"@itwin/core-react\";\r\nimport { TreeDataProvider } from \"../TreeDataProvider\";\r\nimport { TreeEventHandler, TreeEventHandlerParams } from \"./TreeEventHandler\";\r\nimport { TreeModel } from \"./TreeModel\";\r\nimport { TreeModelSource } from \"./TreeModelSource\";\r\nimport { PagedTreeNodeLoader, TreeNodeLoader } from \"./TreeNodeLoader\";\r\n\r\n/**\r\n * React hook that returns an immutable `TreeModel` whenever it changes in the given\r\n * `TreeModelSource`.\r\n *\r\n * @public\r\n */\r\nexport function useTreeModel(modelSource: TreeModelSource): TreeModel {\r\n const [model, setModel] = useState(modelSource.getModel());\r\n\r\n useEffect(() => {\r\n const onModelChanged = () => {\r\n setModel(modelSource.getModel());\r\n };\r\n onModelChanged();\r\n return modelSource.onModelChanged.addListener(onModelChanged);\r\n }, [modelSource]);\r\n\r\n return model;\r\n}\r\n\r\n/**\r\n * Custom hook which creates a nodes' loader using the supplied data provider and model source. The\r\n * loader pulls nodes from the data provider and puts them into the model source.\r\n *\r\n * @public\r\n */\r\nexport function useTreeNodeLoader<TDataProvider extends TreeDataProvider>(dataProvider: TDataProvider, modelSource: TreeModelSource) {\r\n const createLoader = useCallback(() => new TreeNodeLoader(dataProvider, modelSource), [dataProvider, modelSource]);\r\n return useDisposable(createLoader);\r\n}\r\n\r\n/**\r\n * Custom hook which creates a paging nodes' loader using the supplied data provider and model source. The loader pulls\r\n * nodes from the data provider and puts them into the model source.\r\n * @public\r\n */\r\nexport function usePagedTreeNodeLoader<TDataProvider extends TreeDataProvider>(dataProvider: TDataProvider, pageSize: number, modelSource: TreeModelSource) {\r\n const createLoader = useCallback(() => new PagedTreeNodeLoader(dataProvider, modelSource, pageSize), [dataProvider, modelSource, pageSize]);\r\n return useDisposable(createLoader);\r\n}\r\n\r\n/**\r\n * Custom hook which creates a `TreeModelSource`.\r\n *\r\n * @note The model source has no direct dependency on the data provider, but we want a fresh model\r\n * source whenever the data provider changes - that's the reason the hook takes a data provider.\r\n *\r\n * @public\r\n */\r\nexport function useTreeModelSource(dataProvider: TreeDataProvider) {\r\n // need to create new model source every time data provider changes although it does not need data provider to be created.\r\n return useMemo(() => new TreeModelSource(), [dataProvider]); // eslint-disable-line react-hooks/exhaustive-deps\r\n}\r\n\r\n/**\r\n * Custom hook which creates and takes care of disposing a TreeEventsHandler. The input is either a factory method\r\n * for a custom `TreeEventHandler` implementation or parameters for the default implementation.\r\n *\r\n * @note Caller must ensure `factoryOrParams` changes only when a new handler needs to be created. `useCallback` or `useMemo` can\r\n * be used for that purpose based on whether the input is a factory function or params object.\r\n *\r\n * @public\r\n */\r\nexport function useTreeEventsHandler<TEventsHandler extends TreeEventHandler>(factoryOrParams: (() => TEventsHandler) | TreeEventHandlerParams) {\r\n const factory = useCallback((): TreeEventHandler => {\r\n if (typeof factoryOrParams === \"function\")\r\n return factoryOrParams();\r\n return new TreeEventHandler(factoryOrParams);\r\n }, [factoryOrParams]);\r\n return useDisposable(factory);\r\n}\r\n"]}
1
+ {"version":3,"file":"TreeHooks.js","sourceRoot":"","sources":["../../../../../src/components-react/tree/controlled/TreeHooks.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,iCAAwD;AACxD,kDAAkD;AAClD,0DAAuD;AAEvD,yDAA8E;AAE9E,uDAAoD;AACpD,qDAAuE;AAEvE;;;;;GAKG;AACH,SAAgB,YAAY,CAAC,WAA4B;IACvD,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,yBAAW,GAAE,CAAC;IACnC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,OAAO,WAAW,CAAC,cAAc,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;IAC1D,CAAC,EAAE,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;IAC5B,OAAO,WAAW,CAAC,QAAQ,EAAE,CAAC;AAChC,CAAC;AAND,oCAMC;AAED;;;;;GAKG;AACH,SAAgB,iBAAiB,CAAyC,YAA2B,EAAE,WAA4B;IACjI,MAAM,YAAY,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE,CAAC,IAAI,+BAAc,CAAC,YAAY,EAAE,WAAW,CAAC,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC,CAAC;IACnH,OAAO,IAAA,0BAAa,EAAC,YAAY,CAAC,CAAC;AACrC,CAAC;AAHD,8CAGC;AAED;;;;GAIG;AACH,SAAgB,sBAAsB,CAAyC,YAA2B,EAAE,QAAgB,EAAE,WAA4B;IACxJ,MAAM,YAAY,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE,CAAC,IAAI,oCAAmB,CAAC,YAAY,EAAE,WAAW,EAAE,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;IAC5I,OAAO,IAAA,0BAAa,EAAC,YAAY,CAAC,CAAC;AACrC,CAAC;AAHD,wDAGC;AAED;;;;;;;GAOG;AACH,SAAgB,kBAAkB,CAAC,YAA8B;IAC/D,0HAA0H;IAC1H,OAAO,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,IAAI,iCAAe,EAAE,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,kDAAkD;AACjH,CAAC;AAHD,gDAGC;AAED;;;;;;;;GAQG;AACH,SAAgB,oBAAoB,CAA0C,eAAgE;IAC5I,MAAM,OAAO,GAAG,IAAA,mBAAW,EAAC,GAAqB,EAAE;QACjD,IAAI,OAAO,eAAe,KAAK,UAAU;YACvC,OAAO,eAAe,EAAE,CAAC;QAC3B,OAAO,IAAI,mCAAgB,CAAC,eAAe,CAAC,CAAC;IAC/C,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IACtB,OAAO,IAAA,0BAAa,EAAC,OAAO,CAAC,CAAC;AAChC,CAAC;AAPD,oDAOC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Tree\r\n */\r\n\r\nimport { useCallback, useEffect, useMemo } from \"react\";\r\nimport { useDisposable } from \"@itwin/core-react\";\r\nimport { useRerender } from \"../../common/UseRerender\";\r\nimport { TreeDataProvider } from \"../TreeDataProvider\";\r\nimport { TreeEventHandler, TreeEventHandlerParams } from \"./TreeEventHandler\";\r\nimport { TreeModel } from \"./TreeModel\";\r\nimport { TreeModelSource } from \"./TreeModelSource\";\r\nimport { PagedTreeNodeLoader, TreeNodeLoader } from \"./TreeNodeLoader\";\r\n\r\n/**\r\n * React hook that returns an immutable `TreeModel` whenever it changes in the given\r\n * `TreeModelSource`.\r\n *\r\n * @public\r\n */\r\nexport function useTreeModel(modelSource: TreeModelSource): TreeModel {\r\n const { rerender } = useRerender();\r\n useEffect(() => {\r\n return modelSource.onModelChanged.addListener(rerender);\r\n }, [modelSource, rerender]);\r\n return modelSource.getModel();\r\n}\r\n\r\n/**\r\n * Custom hook which creates a nodes' loader using the supplied data provider and model source. The\r\n * loader pulls nodes from the data provider and puts them into the model source.\r\n *\r\n * @public\r\n */\r\nexport function useTreeNodeLoader<TDataProvider extends TreeDataProvider>(dataProvider: TDataProvider, modelSource: TreeModelSource) {\r\n const createLoader = useCallback(() => new TreeNodeLoader(dataProvider, modelSource), [dataProvider, modelSource]);\r\n return useDisposable(createLoader);\r\n}\r\n\r\n/**\r\n * Custom hook which creates a paging nodes' loader using the supplied data provider and model source. The loader pulls\r\n * nodes from the data provider and puts them into the model source.\r\n * @public\r\n */\r\nexport function usePagedTreeNodeLoader<TDataProvider extends TreeDataProvider>(dataProvider: TDataProvider, pageSize: number, modelSource: TreeModelSource) {\r\n const createLoader = useCallback(() => new PagedTreeNodeLoader(dataProvider, modelSource, pageSize), [dataProvider, modelSource, pageSize]);\r\n return useDisposable(createLoader);\r\n}\r\n\r\n/**\r\n * Custom hook which creates a `TreeModelSource`.\r\n *\r\n * @note The model source has no direct dependency on the data provider, but we want a fresh model\r\n * source whenever the data provider changes - that's the reason the hook takes a data provider.\r\n *\r\n * @public\r\n */\r\nexport function useTreeModelSource(dataProvider: TreeDataProvider) {\r\n // need to create new model source every time data provider changes although it does not need data provider to be created.\r\n return useMemo(() => new TreeModelSource(), [dataProvider]); // eslint-disable-line react-hooks/exhaustive-deps\r\n}\r\n\r\n/**\r\n * Custom hook which creates and takes care of disposing a TreeEventsHandler. The input is either a factory method\r\n * for a custom `TreeEventHandler` implementation or parameters for the default implementation.\r\n *\r\n * @note Caller must ensure `factoryOrParams` changes only when a new handler needs to be created. `useCallback` or `useMemo` can\r\n * be used for that purpose based on whether the input is a factory function or params object.\r\n *\r\n * @public\r\n */\r\nexport function useTreeEventsHandler<TEventsHandler extends TreeEventHandler>(factoryOrParams: (() => TEventsHandler) | TreeEventHandlerParams) {\r\n const factory = useCallback((): TreeEventHandler => {\r\n if (typeof factoryOrParams === \"function\")\r\n return factoryOrParams();\r\n return new TreeEventHandler(factoryOrParams);\r\n }, [factoryOrParams]);\r\n return useDisposable(factory);\r\n}\r\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"TreeHooks.d.ts","sourceRoot":"","sources":["../../../../../src/components-react/tree/controlled/TreeHooks.ts"],"names":[],"mappings":"AAIA;;GAEG;AAIH,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEvE;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,WAAW,EAAE,eAAe,GAAG,SAAS,CAYpE;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,aAAa,SAAS,gBAAgB,EAAE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,iCAGlI;AAED;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,aAAa,SAAS,gBAAgB,EAAE,YAAY,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,EAAE,eAAe,sCAGzJ;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAAC,YAAY,EAAE,gBAAgB,mBAGhE;AAED;;;;;;;;GAQG;AACH,wBAAgB,oBAAoB,CAAC,cAAc,SAAS,gBAAgB,EAAE,eAAe,EAAE,CAAC,MAAM,cAAc,CAAC,GAAG,sBAAsB,oBAO7I"}
1
+ {"version":3,"file":"TreeHooks.d.ts","sourceRoot":"","sources":["../../../../../src/components-react/tree/controlled/TreeHooks.ts"],"names":[],"mappings":"AAIA;;GAEG;AAKH,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEvE;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,WAAW,EAAE,eAAe,GAAG,SAAS,CAMpE;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,aAAa,SAAS,gBAAgB,EAAE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,iCAGlI;AAED;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,aAAa,SAAS,gBAAgB,EAAE,YAAY,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,EAAE,eAAe,sCAGzJ;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAAC,YAAY,EAAE,gBAAgB,mBAGhE;AAED;;;;;;;;GAQG;AACH,wBAAgB,oBAAoB,CAAC,cAAc,SAAS,gBAAgB,EAAE,eAAe,EAAE,CAAC,MAAM,cAAc,CAAC,GAAG,sBAAsB,oBAO7I"}
@@ -5,8 +5,9 @@
5
5
  /** @packageDocumentation
6
6
  * @module Tree
7
7
  */
8
- import { useCallback, useEffect, useMemo, useState } from "react";
8
+ import { useCallback, useEffect, useMemo } from "react";
9
9
  import { useDisposable } from "@itwin/core-react";
10
+ import { useRerender } from "../../common/UseRerender";
10
11
  import { TreeEventHandler } from "./TreeEventHandler";
11
12
  import { TreeModelSource } from "./TreeModelSource";
12
13
  import { PagedTreeNodeLoader, TreeNodeLoader } from "./TreeNodeLoader";
@@ -17,15 +18,11 @@ import { PagedTreeNodeLoader, TreeNodeLoader } from "./TreeNodeLoader";
17
18
  * @public
18
19
  */
19
20
  export function useTreeModel(modelSource) {
20
- const [model, setModel] = useState(modelSource.getModel());
21
+ const { rerender } = useRerender();
21
22
  useEffect(() => {
22
- const onModelChanged = () => {
23
- setModel(modelSource.getModel());
24
- };
25
- onModelChanged();
26
- return modelSource.onModelChanged.addListener(onModelChanged);
27
- }, [modelSource]);
28
- return model;
23
+ return modelSource.onModelChanged.addListener(rerender);
24
+ }, [modelSource, rerender]);
25
+ return modelSource.getModel();
29
26
  }
30
27
  /**
31
28
  * Custom hook which creates a nodes' loader using the supplied data provider and model source. The
@@ -1 +1 @@
1
- {"version":3,"file":"TreeHooks.js","sourceRoot":"","sources":["../../../../../src/components-react/tree/controlled/TreeHooks.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,gBAAgB,EAA0B,MAAM,oBAAoB,CAAC;AAE9E,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEvE;;;;;GAKG;AACH,MAAM,UAAU,YAAY,CAAC,WAA4B;IACvD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,CAAC,CAAC;IAE3D,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,GAAG,EAAE;YAC1B,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,CAAC,CAAC;QACnC,CAAC,CAAC;QACF,cAAc,EAAE,CAAC;QACjB,OAAO,WAAW,CAAC,cAAc,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;IAChE,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,OAAO,KAAK,CAAC;AACf,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,iBAAiB,CAAyC,YAA2B,EAAE,WAA4B;IACjI,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,IAAI,cAAc,CAAC,YAAY,EAAE,WAAW,CAAC,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC,CAAC;IACnH,OAAO,aAAa,CAAC,YAAY,CAAC,CAAC;AACrC,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,sBAAsB,CAAyC,YAA2B,EAAE,QAAgB,EAAE,WAA4B;IACxJ,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,IAAI,mBAAmB,CAAC,YAAY,EAAE,WAAW,EAAE,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;IAC5I,OAAO,aAAa,CAAC,YAAY,CAAC,CAAC;AACrC,CAAC;AAED;;;;;;;GAOG;AACH,MAAM,UAAU,kBAAkB,CAAC,YAA8B;IAC/D,0HAA0H;IAC1H,OAAO,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,eAAe,EAAE,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,kDAAkD;AACjH,CAAC;AAED;;;;;;;;GAQG;AACH,MAAM,UAAU,oBAAoB,CAA0C,eAAgE;IAC5I,MAAM,OAAO,GAAG,WAAW,CAAC,GAAqB,EAAE;QACjD,IAAI,OAAO,eAAe,KAAK,UAAU;YACvC,OAAO,eAAe,EAAE,CAAC;QAC3B,OAAO,IAAI,gBAAgB,CAAC,eAAe,CAAC,CAAC;IAC/C,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IACtB,OAAO,aAAa,CAAC,OAAO,CAAC,CAAC;AAChC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Tree\r\n */\r\n\r\nimport { useCallback, useEffect, useMemo, useState } from \"react\";\r\nimport { useDisposable } from \"@itwin/core-react\";\r\nimport { TreeDataProvider } from \"../TreeDataProvider\";\r\nimport { TreeEventHandler, TreeEventHandlerParams } from \"./TreeEventHandler\";\r\nimport { TreeModel } from \"./TreeModel\";\r\nimport { TreeModelSource } from \"./TreeModelSource\";\r\nimport { PagedTreeNodeLoader, TreeNodeLoader } from \"./TreeNodeLoader\";\r\n\r\n/**\r\n * React hook that returns an immutable `TreeModel` whenever it changes in the given\r\n * `TreeModelSource`.\r\n *\r\n * @public\r\n */\r\nexport function useTreeModel(modelSource: TreeModelSource): TreeModel {\r\n const [model, setModel] = useState(modelSource.getModel());\r\n\r\n useEffect(() => {\r\n const onModelChanged = () => {\r\n setModel(modelSource.getModel());\r\n };\r\n onModelChanged();\r\n return modelSource.onModelChanged.addListener(onModelChanged);\r\n }, [modelSource]);\r\n\r\n return model;\r\n}\r\n\r\n/**\r\n * Custom hook which creates a nodes' loader using the supplied data provider and model source. The\r\n * loader pulls nodes from the data provider and puts them into the model source.\r\n *\r\n * @public\r\n */\r\nexport function useTreeNodeLoader<TDataProvider extends TreeDataProvider>(dataProvider: TDataProvider, modelSource: TreeModelSource) {\r\n const createLoader = useCallback(() => new TreeNodeLoader(dataProvider, modelSource), [dataProvider, modelSource]);\r\n return useDisposable(createLoader);\r\n}\r\n\r\n/**\r\n * Custom hook which creates a paging nodes' loader using the supplied data provider and model source. The loader pulls\r\n * nodes from the data provider and puts them into the model source.\r\n * @public\r\n */\r\nexport function usePagedTreeNodeLoader<TDataProvider extends TreeDataProvider>(dataProvider: TDataProvider, pageSize: number, modelSource: TreeModelSource) {\r\n const createLoader = useCallback(() => new PagedTreeNodeLoader(dataProvider, modelSource, pageSize), [dataProvider, modelSource, pageSize]);\r\n return useDisposable(createLoader);\r\n}\r\n\r\n/**\r\n * Custom hook which creates a `TreeModelSource`.\r\n *\r\n * @note The model source has no direct dependency on the data provider, but we want a fresh model\r\n * source whenever the data provider changes - that's the reason the hook takes a data provider.\r\n *\r\n * @public\r\n */\r\nexport function useTreeModelSource(dataProvider: TreeDataProvider) {\r\n // need to create new model source every time data provider changes although it does not need data provider to be created.\r\n return useMemo(() => new TreeModelSource(), [dataProvider]); // eslint-disable-line react-hooks/exhaustive-deps\r\n}\r\n\r\n/**\r\n * Custom hook which creates and takes care of disposing a TreeEventsHandler. The input is either a factory method\r\n * for a custom `TreeEventHandler` implementation or parameters for the default implementation.\r\n *\r\n * @note Caller must ensure `factoryOrParams` changes only when a new handler needs to be created. `useCallback` or `useMemo` can\r\n * be used for that purpose based on whether the input is a factory function or params object.\r\n *\r\n * @public\r\n */\r\nexport function useTreeEventsHandler<TEventsHandler extends TreeEventHandler>(factoryOrParams: (() => TEventsHandler) | TreeEventHandlerParams) {\r\n const factory = useCallback((): TreeEventHandler => {\r\n if (typeof factoryOrParams === \"function\")\r\n return factoryOrParams();\r\n return new TreeEventHandler(factoryOrParams);\r\n }, [factoryOrParams]);\r\n return useDisposable(factory);\r\n}\r\n"]}
1
+ {"version":3,"file":"TreeHooks.js","sourceRoot":"","sources":["../../../../../src/components-react/tree/controlled/TreeHooks.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEvD,OAAO,EAAE,gBAAgB,EAA0B,MAAM,oBAAoB,CAAC;AAE9E,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEvE;;;;;GAKG;AACH,MAAM,UAAU,YAAY,CAAC,WAA4B;IACvD,MAAM,EAAE,QAAQ,EAAE,GAAG,WAAW,EAAE,CAAC;IACnC,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,WAAW,CAAC,cAAc,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;IAC1D,CAAC,EAAE,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;IAC5B,OAAO,WAAW,CAAC,QAAQ,EAAE,CAAC;AAChC,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,iBAAiB,CAAyC,YAA2B,EAAE,WAA4B;IACjI,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,IAAI,cAAc,CAAC,YAAY,EAAE,WAAW,CAAC,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC,CAAC;IACnH,OAAO,aAAa,CAAC,YAAY,CAAC,CAAC;AACrC,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,sBAAsB,CAAyC,YAA2B,EAAE,QAAgB,EAAE,WAA4B;IACxJ,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,IAAI,mBAAmB,CAAC,YAAY,EAAE,WAAW,EAAE,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;IAC5I,OAAO,aAAa,CAAC,YAAY,CAAC,CAAC;AACrC,CAAC;AAED;;;;;;;GAOG;AACH,MAAM,UAAU,kBAAkB,CAAC,YAA8B;IAC/D,0HAA0H;IAC1H,OAAO,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,eAAe,EAAE,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,kDAAkD;AACjH,CAAC;AAED;;;;;;;;GAQG;AACH,MAAM,UAAU,oBAAoB,CAA0C,eAAgE;IAC5I,MAAM,OAAO,GAAG,WAAW,CAAC,GAAqB,EAAE;QACjD,IAAI,OAAO,eAAe,KAAK,UAAU;YACvC,OAAO,eAAe,EAAE,CAAC;QAC3B,OAAO,IAAI,gBAAgB,CAAC,eAAe,CAAC,CAAC;IAC/C,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IACtB,OAAO,aAAa,CAAC,OAAO,CAAC,CAAC;AAChC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Tree\r\n */\r\n\r\nimport { useCallback, useEffect, useMemo } from \"react\";\r\nimport { useDisposable } from \"@itwin/core-react\";\r\nimport { useRerender } from \"../../common/UseRerender\";\r\nimport { TreeDataProvider } from \"../TreeDataProvider\";\r\nimport { TreeEventHandler, TreeEventHandlerParams } from \"./TreeEventHandler\";\r\nimport { TreeModel } from \"./TreeModel\";\r\nimport { TreeModelSource } from \"./TreeModelSource\";\r\nimport { PagedTreeNodeLoader, TreeNodeLoader } from \"./TreeNodeLoader\";\r\n\r\n/**\r\n * React hook that returns an immutable `TreeModel` whenever it changes in the given\r\n * `TreeModelSource`.\r\n *\r\n * @public\r\n */\r\nexport function useTreeModel(modelSource: TreeModelSource): TreeModel {\r\n const { rerender } = useRerender();\r\n useEffect(() => {\r\n return modelSource.onModelChanged.addListener(rerender);\r\n }, [modelSource, rerender]);\r\n return modelSource.getModel();\r\n}\r\n\r\n/**\r\n * Custom hook which creates a nodes' loader using the supplied data provider and model source. The\r\n * loader pulls nodes from the data provider and puts them into the model source.\r\n *\r\n * @public\r\n */\r\nexport function useTreeNodeLoader<TDataProvider extends TreeDataProvider>(dataProvider: TDataProvider, modelSource: TreeModelSource) {\r\n const createLoader = useCallback(() => new TreeNodeLoader(dataProvider, modelSource), [dataProvider, modelSource]);\r\n return useDisposable(createLoader);\r\n}\r\n\r\n/**\r\n * Custom hook which creates a paging nodes' loader using the supplied data provider and model source. The loader pulls\r\n * nodes from the data provider and puts them into the model source.\r\n * @public\r\n */\r\nexport function usePagedTreeNodeLoader<TDataProvider extends TreeDataProvider>(dataProvider: TDataProvider, pageSize: number, modelSource: TreeModelSource) {\r\n const createLoader = useCallback(() => new PagedTreeNodeLoader(dataProvider, modelSource, pageSize), [dataProvider, modelSource, pageSize]);\r\n return useDisposable(createLoader);\r\n}\r\n\r\n/**\r\n * Custom hook which creates a `TreeModelSource`.\r\n *\r\n * @note The model source has no direct dependency on the data provider, but we want a fresh model\r\n * source whenever the data provider changes - that's the reason the hook takes a data provider.\r\n *\r\n * @public\r\n */\r\nexport function useTreeModelSource(dataProvider: TreeDataProvider) {\r\n // need to create new model source every time data provider changes although it does not need data provider to be created.\r\n return useMemo(() => new TreeModelSource(), [dataProvider]); // eslint-disable-line react-hooks/exhaustive-deps\r\n}\r\n\r\n/**\r\n * Custom hook which creates and takes care of disposing a TreeEventsHandler. The input is either a factory method\r\n * for a custom `TreeEventHandler` implementation or parameters for the default implementation.\r\n *\r\n * @note Caller must ensure `factoryOrParams` changes only when a new handler needs to be created. `useCallback` or `useMemo` can\r\n * be used for that purpose based on whether the input is a factory function or params object.\r\n *\r\n * @public\r\n */\r\nexport function useTreeEventsHandler<TEventsHandler extends TreeEventHandler>(factoryOrParams: (() => TEventsHandler) | TreeEventHandlerParams) {\r\n const factory = useCallback((): TreeEventHandler => {\r\n if (typeof factoryOrParams === \"function\")\r\n return factoryOrParams();\r\n return new TreeEventHandler(factoryOrParams);\r\n }, [factoryOrParams]);\r\n return useDisposable(factory);\r\n}\r\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@itwin/components-react",
3
- "version": "3.2.1",
3
+ "version": "3.2.4",
4
4
  "description": "iTwin.js UI complex components",
5
5
  "main": "lib/cjs/components-react.js",
6
6
  "module": "lib/esm/components-react.js",
@@ -20,9 +20,9 @@
20
20
  "url": "http://www.bentley.com"
21
21
  },
22
22
  "peerDependencies": {
23
- "@itwin/appui-abstract": "^3.2.1",
24
- "@itwin/core-bentley": "^3.2.1",
25
- "@itwin/core-react": "^3.2.1",
23
+ "@itwin/appui-abstract": "^3.2.4",
24
+ "@itwin/core-bentley": "^3.2.4",
25
+ "@itwin/core-react": "^3.2.4",
26
26
  "react": "^17.0.0",
27
27
  "react-dom": "^17.0.0"
28
28
  },
@@ -31,13 +31,13 @@
31
31
  "NOTE: All tools used by scripts in this package must be listed as devDependencies"
32
32
  ],
33
33
  "devDependencies": {
34
- "@itwin/appui-abstract": "3.2.1",
35
- "@itwin/build-tools": "3.2.1",
36
- "@itwin/core-bentley": "3.2.1",
37
- "@itwin/core-common": "3.2.1",
38
- "@itwin/core-i18n": "3.2.1",
39
- "@itwin/core-react": "3.2.1",
40
- "@itwin/eslint-plugin": "3.2.1",
34
+ "@itwin/appui-abstract": "3.2.4",
35
+ "@itwin/build-tools": "3.2.4",
36
+ "@itwin/core-bentley": "3.2.4",
37
+ "@itwin/core-common": "3.2.4",
38
+ "@itwin/core-i18n": "3.2.4",
39
+ "@itwin/core-react": "3.2.4",
40
+ "@itwin/eslint-plugin": "3.2.4",
41
41
  "@testing-library/dom": "^8.11.2",
42
42
  "@testing-library/react": "^12.0.0",
43
43
  "@testing-library/react-hooks": "^7.0.2",