@itwin/core-react 3.1.0-dev.24 → 3.1.0-dev.28
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 +52 -6
- package/lib/cjs/core-react/tree/Node.d.ts +1 -0
- package/lib/cjs/core-react/tree/Node.d.ts.map +1 -1
- package/lib/cjs/core-react/tree/Node.js +18 -3
- package/lib/cjs/core-react/tree/Node.js.map +1 -1
- package/lib/esm/core-react/tree/Node.d.ts +1 -0
- package/lib/esm/core-react/tree/Node.d.ts.map +1 -1
- package/lib/esm/core-react/tree/Node.js +18 -3
- package/lib/esm/core-react/tree/Node.js.map +1 -1
- package/package.json +9 -9
package/CHANGELOG.md
CHANGED
|
@@ -1,6 +1,52 @@
|
|
|
1
1
|
# Change Log - @itwin/core-react
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Mon, 24 Jan 2022 14:00:52 GMT and should not be manually modified.
|
|
4
|
+
|
|
5
|
+
## 3.0.0
|
|
6
|
+
Mon, 24 Jan 2022 14:00:52 GMT
|
|
7
|
+
|
|
8
|
+
### Updates
|
|
9
|
+
|
|
10
|
+
- Update NumberInput to select on focus and to capture Enter key
|
|
11
|
+
- Upgrade target to ES2019 and deliver both a CommonJs and ESModule version of package
|
|
12
|
+
- rename to @itwin/core-react
|
|
13
|
+
- remove ClientRequestContext and its subclasses
|
|
14
|
+
- Replace usage of I18N with generic Localization interface.
|
|
15
|
+
- Update snapshots
|
|
16
|
+
- Fix Select menu position when redered in a Popup.
|
|
17
|
+
- Support for TypeDoc v0.22.7. Fix various broken docs links.
|
|
18
|
+
- Deprecate obsolete code.
|
|
19
|
+
- Create empty frontstage and UiItemsProviders to populate it and update how ContentGroups are defined.
|
|
20
|
+
- Add missing public/beta types to the barrel file.
|
|
21
|
+
- Fix infinite loop crash in ContextMenu when the menu is too large to fit in the parent window.
|
|
22
|
+
- Fix issue with PopupContextMenu not closing when click occurs in a parent popup.
|
|
23
|
+
- Deprecate and promote apis
|
|
24
|
+
- Deprecate obsolete APIs. Publish beta APIs from last release.
|
|
25
|
+
- Upgraded itwinui-react to 1.16.2. Fixed editor sizes.
|
|
26
|
+
- Fixed small ExpandableBlock padding
|
|
27
|
+
- Remove files generated by bad merge
|
|
28
|
+
- Update disabled styling for NumberInput.
|
|
29
|
+
- Update styling on some status field items for better popup alignment.
|
|
30
|
+
- Update IconComponent SCSS to ensure color for inline svg is set.
|
|
31
|
+
- Allow size of NumberInput container to be sized via a style prop.
|
|
32
|
+
- Deprecated HorizontalTabs in ui-core. Removed older deprecated items. Updated NextVersion.md.
|
|
33
|
+
- Update to latest itwinui-react
|
|
34
|
+
- Incorporating iTwinUI-CSS and iTwinUI-React into iModel.js
|
|
35
|
+
- Moved iTwinUI style overrides to ui-core from ui-framework
|
|
36
|
+
- Rename ui directories to match new package names.
|
|
37
|
+
- Fix bug that sets the icon on MessageBox.NoSymbol the Success icon.
|
|
38
|
+
- Add prop that prevents popup children from unmounting when popup is closed.
|
|
39
|
+
- Update to React 17.
|
|
40
|
+
- Created imodel-components folder & package and moved color, lineweight, navigationaids, quantity, timeline & viewport. Deprecated MessageSeverity in ui-core & added it ui-abstract. Added MessagePresenter interface to ui-abstract.
|
|
41
|
+
- Remove react 16 peer dependency.
|
|
42
|
+
- Remove itwinUi css overrides.
|
|
43
|
+
- UiFramework and UiIModelComponent initialize method no longer take localization argument, uses IModelApp.localization internally.
|
|
44
|
+
- Fix vertical alignment of text in message box.
|
|
45
|
+
- Avoid error seen sometimes in Electron where resizeObserver.current is null.
|
|
46
|
+
- Fixed z-index of status messages to be on top of a dialog
|
|
47
|
+
- Deprecated ui-core Slider. Wrapped with one from iTwinUi-react to remove dependency on react-compound-slider.
|
|
48
|
+
- Update to latest types/react package
|
|
49
|
+
- Lock down and update version numbers so docs will build.
|
|
4
50
|
|
|
5
51
|
## 2.19.28
|
|
6
52
|
Wed, 12 Jan 2022 14:52:38 GMT
|
|
@@ -264,9 +310,9 @@ Mon, 24 May 2021 15:58:39 GMT
|
|
|
264
310
|
### Updates
|
|
265
311
|
|
|
266
312
|
- Wrap resizeObserver in a windows animation frame to prevent loop limit exceeded error.
|
|
267
|
-
- Add support for child popup windows.
|
|
313
|
+
- Add support for child popup windows.
|
|
268
314
|
- Improved Multi-Value column filtering in the Table component
|
|
269
|
-
- Update to latest classnames package
|
|
315
|
+
- Update to latest classnames package
|
|
270
316
|
- Fix GlobalContextMenu layout issue in presentation-test-app by setting display:none on anchoring div.
|
|
271
317
|
|
|
272
318
|
## 2.15.6
|
|
@@ -394,7 +440,7 @@ Thu, 28 Jan 2021 13:39:27 GMT
|
|
|
394
440
|
|
|
395
441
|
### Updates
|
|
396
442
|
|
|
397
|
-
- Update components that support providing refs via React.forwardRef to work better with document generation.
|
|
443
|
+
- Update components that support providing refs via React.forwardRef to work better with document generation.
|
|
398
444
|
- Add option to use a 'x-small' webfont icon.
|
|
399
445
|
- Add nested popup support to components that use HOC withOnOutsideClick.
|
|
400
446
|
- Fix bug processing zero value in Select options.
|
|
@@ -665,7 +711,7 @@ Tue, 28 Jul 2020 16:26:24 GMT
|
|
|
665
711
|
- Add support for a basic single selection aria compliant listbox.
|
|
666
712
|
- Checkboxes in lists & trees are out of place
|
|
667
713
|
- Disabled component styling. Fixed Dialog focus problems.
|
|
668
|
-
- Map Layer UX
|
|
714
|
+
- Map Layer UX
|
|
669
715
|
- Allowing Input component user to override the type
|
|
670
716
|
- Fix ThemeSelect formatOptionLabel prop to return React.ReactNode.
|
|
671
717
|
- Added Arrow key navigation in Tabs components. Added ItemKeyboardNavigator.
|
|
@@ -988,7 +1034,7 @@ Mon, 13 May 2019 15:52:05 GMT
|
|
|
988
1034
|
- Put sourcemap in npm package.
|
|
989
1035
|
- Added SignIn presentational component to ui-components. Removed --ignoreMissingTags extract-api option.
|
|
990
1036
|
- Require React & React-dom 16.8
|
|
991
|
-
- Setup a generic context for tracking client requests, and made various related enhancements to logging, usage tracking and authorization.
|
|
1037
|
+
- Setup a generic context for tracking client requests, and made various related enhancements to logging, usage tracking and authorization.
|
|
992
1038
|
- Added ViewportDialog in ui-test-app, ui-core/ContributeGuidelines.md. TSLint rules in ui-core for no-default-export & completed-docs. @beta release tags.
|
|
993
1039
|
- Update icons-generic-webfont version to latest available.
|
|
994
1040
|
- Added TableProp to hide header and supporting style changes
|
|
@@ -69,6 +69,7 @@ export interface TreeNodeProps extends CommonProps {
|
|
|
69
69
|
* @public
|
|
70
70
|
*/
|
|
71
71
|
export declare class TreeNode extends React.Component<TreeNodeProps> {
|
|
72
|
+
private checkboxWrapperRef;
|
|
72
73
|
constructor(props: TreeNodeProps);
|
|
73
74
|
render(): JSX.Element;
|
|
74
75
|
private createSubComponentTestId;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Node.d.ts","sourceRoot":"","sources":["../../../../src/core-react/tree/Node.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,aAAa,CAAC;AAErB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAY,aAAa,EAAkB,MAAM,sBAAsB,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAG1C;;GAEG;AACH,oBAAY,uBAAuB,GAAG,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,SAAS,CAAC,GAAG;IAClF,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,OAAO,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CACxC,CAAC;AAEF;;GAEG;AACH,oBAAY,oBAAoB,GAAG,CAAC,KAAK,EAAE,uBAAuB,KAAK,KAAK,CAAC,SAAS,CAAC;AAEvF;;GAEG;AACH,eAAO,MAAM,YAAY,KAAK,CAAC;AAI/B;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,4BAA4B;IAC5B,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,2BAA2B;IAC3B,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IAC5C,6CAA6C;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,aAAc,SAAQ,WAAW;IAChD,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC;IACxB;iBACa;IACb,aAAa,CAAC,EAAE,iBAAiB,CAAC;IAClC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC1C,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;IACpC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B,4EAA4E;IAC5E,eAAe,CAAC,EAAE;QAChB,6EAA6E;QAC7E,cAAc,CAAC,EAAE,oBAAoB,CAAC;KACvC,CAAC;IACF,CAAC,aAAa,CAAC,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED;;GAEG;AACH,qBAAa,QAAS,SAAQ,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"Node.d.ts","sourceRoot":"","sources":["../../../../src/core-react/tree/Node.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,aAAa,CAAC;AAErB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAY,aAAa,EAAkB,MAAM,sBAAsB,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAG1C;;GAEG;AACH,oBAAY,uBAAuB,GAAG,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,SAAS,CAAC,GAAG;IAClF,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,OAAO,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CACxC,CAAC;AAEF;;GAEG;AACH,oBAAY,oBAAoB,GAAG,CAAC,KAAK,EAAE,uBAAuB,KAAK,KAAK,CAAC,SAAS,CAAC;AAEvF;;GAEG;AACH,eAAO,MAAM,YAAY,KAAK,CAAC;AAI/B;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,4BAA4B;IAC5B,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,2BAA2B;IAC3B,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IAC5C,6CAA6C;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,aAAc,SAAQ,WAAW;IAChD,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC;IACxB;iBACa;IACb,aAAa,CAAC,EAAE,iBAAiB,CAAC;IAClC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC1C,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;IACpC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B,4EAA4E;IAC5E,eAAe,CAAC,EAAE;QAChB,6EAA6E;QAC7E,cAAc,CAAC,EAAE,oBAAoB,CAAC;KACvC,CAAC;IACF,CAAC,aAAa,CAAC,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED;;GAEG;AACH,qBAAa,QAAS,SAAQ,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC;IAC1D,OAAO,CAAC,kBAAkB,CAAqC;gBAEnD,KAAK,EAAE,aAAa;IAIhB,MAAM;IA8EtB,OAAO,CAAC,wBAAwB;IAMhC,OAAO,CAAC,iBAAiB,CAGvB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,uBAAuB,CAI7B;IAEF,OAAO,CAAC,QAAQ,CAQd;CACH"}
|
|
@@ -25,6 +25,7 @@ const EXPANSION_TOGGLE_WIDTH = 24;
|
|
|
25
25
|
class TreeNode extends React.Component {
|
|
26
26
|
constructor(props) {
|
|
27
27
|
super(props);
|
|
28
|
+
this.checkboxWrapperRef = React.createRef();
|
|
28
29
|
this._onCheckboxChange = (checked) => {
|
|
29
30
|
if (this.props.checkboxProps && this.props.checkboxProps.onClick && !this.props.checkboxProps.isDisabled)
|
|
30
31
|
this.props.checkboxProps.onClick(checked ? CheckBoxState_1.CheckBoxState.On : CheckBoxState_1.CheckBoxState.Off);
|
|
@@ -38,9 +39,13 @@ class TreeNode extends React.Component {
|
|
|
38
39
|
this.props.onClickExpansionToggle();
|
|
39
40
|
};
|
|
40
41
|
this._onClick = (e) => {
|
|
42
|
+
var _a, _b;
|
|
41
43
|
e.stopPropagation();
|
|
42
|
-
|
|
43
|
-
|
|
44
|
+
// ITwinUI-react has a bug that prevents us from stopping checkbox click event propagation to the parent element
|
|
45
|
+
if (!this.checkboxWrapperRef.current
|
|
46
|
+
|| (e.target instanceof Element && !isDescendant(this.checkboxWrapperRef.current, e.target))) {
|
|
47
|
+
(_b = (_a = this.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
|
|
48
|
+
}
|
|
44
49
|
};
|
|
45
50
|
}
|
|
46
51
|
render() {
|
|
@@ -63,7 +68,8 @@ class TreeNode extends React.Component {
|
|
|
63
68
|
checkbox = this.props.renderOverrides.renderCheckbox(props);
|
|
64
69
|
}
|
|
65
70
|
else {
|
|
66
|
-
checkbox = (React.createElement(
|
|
71
|
+
checkbox = (React.createElement("div", { ref: this.checkboxWrapperRef },
|
|
72
|
+
React.createElement(itwinui_react_1.Checkbox, { ...props, onChange: (e) => this._onCheckboxChange(e.target.checked), "data-testid": this.createSubComponentTestId("checkbox") })));
|
|
67
73
|
}
|
|
68
74
|
}
|
|
69
75
|
const icon = this.props.icon ? (React.createElement("div", { className: "core-tree-node-icon" }, this.props.icon)) : undefined;
|
|
@@ -86,4 +92,13 @@ class TreeNode extends React.Component {
|
|
|
86
92
|
}
|
|
87
93
|
}
|
|
88
94
|
exports.TreeNode = TreeNode;
|
|
95
|
+
function isDescendant(ancestor, descendant) {
|
|
96
|
+
while (descendant.parentElement !== null) {
|
|
97
|
+
if (descendant === ancestor) {
|
|
98
|
+
return true;
|
|
99
|
+
}
|
|
100
|
+
descendant = descendant.parentElement;
|
|
101
|
+
}
|
|
102
|
+
return false;
|
|
103
|
+
}
|
|
89
104
|
//# sourceMappingURL=Node.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Node.js","sourceRoot":"","sources":["../../../../src/core-react/tree/Node.tsx"],"names":[],"mappings":"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","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 \"./Node.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { Checkbox, CheckboxProps, ProgressRadial } from \"@itwin/itwinui-react\";\r\nimport { CheckBoxState } from \"../enums/CheckBoxState\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport { Omit } from \"../utils/typeUtils\";\r\nimport { ExpansionToggle } from \"./ExpansionToggle\";\r\n\r\n/** Props for node Checkbox renderer\r\n * @public\r\n */\r\nexport type NodeCheckboxRenderProps = Omit<CheckboxProps, \"onChange\" | \"onClick\"> & {\r\n onChange: (checked: boolean) => void;\r\n onClick: (e: React.MouseEvent) => void;\r\n};\r\n\r\n/** Type for node Checkbox renderer\r\n * @public\r\n */\r\nexport type NodeCheckboxRenderer = (props: NodeCheckboxRenderProps) => React.ReactNode;\r\n\r\n/** Number of pixels the node gets offset per each hierarchy level\r\n * @internal\r\n */\r\nexport const LEVEL_OFFSET = 20;\r\n\r\nconst EXPANSION_TOGGLE_WIDTH = 24;\r\n\r\n/** Properties for Tree Node CheckBox\r\n * @public\r\n */\r\nexport interface NodeCheckboxProps {\r\n /** State of the checkbox */\r\n state?: CheckBoxState;\r\n /** Click event callback */\r\n onClick?: (newState: CheckBoxState) => void;\r\n /** Indicates whether checkbox is disabled */\r\n isDisabled?: boolean;\r\n /** Tooltip to be displayed when mouse is hovered over checkbox */\r\n tooltip?: string;\r\n}\r\n\r\n/** Properties for the [[TreeNode]] React component\r\n * @public\r\n */\r\nexport interface TreeNodeProps extends CommonProps {\r\n label: React.ReactNode;\r\n level: number;\r\n icon?: React.ReactChild;\r\n /** Properties for the checkbox.\r\n * @public */\r\n checkboxProps?: NodeCheckboxProps;\r\n isLeaf?: boolean;\r\n isLoading?: boolean;\r\n isExpanded?: boolean;\r\n isFocused?: boolean;\r\n isSelected?: boolean;\r\n isHoverDisabled?: boolean;\r\n onClick?: (e: React.MouseEvent) => void;\r\n onContextMenu?: (e: React.MouseEvent) => void;\r\n onMouseMove?: (e: React.MouseEvent) => void;\r\n onMouseDown?: (e: React.MouseEvent) => void;\r\n onMouseUp?: (e: React.MouseEvent) => void;\r\n onClickExpansionToggle?: () => void;\r\n children?: React.ReactNode;\r\n\r\n /** Contains render overrides for different pieces of the node component. */\r\n renderOverrides?: {\r\n /** Callback to render a checkbox. Only called when checkbox is displayed. */\r\n renderCheckbox?: NodeCheckboxRenderer;\r\n };\r\n [\"data-testid\"]?: string;\r\n}\r\n\r\n/** Presentation React component for a Tree node\r\n * @public\r\n */\r\nexport class TreeNode extends React.Component<TreeNodeProps> {\r\n constructor(props: TreeNodeProps) {\r\n super(props);\r\n }\r\n\r\n public override render() {\r\n const className = classnames(\r\n \"core-tree-node\",\r\n this.props.isFocused && \"is-focused\",\r\n this.props.isSelected && \"is-selected\",\r\n this.props.isHoverDisabled && \"is-hover-disabled\",\r\n this.props.className);\r\n let offset = this.props.level * LEVEL_OFFSET;\r\n if (!this.props.isLoading && this.props.isLeaf)\r\n offset += EXPANSION_TOGGLE_WIDTH; // Add expansion toggle/loader width if they're not rendered\r\n\r\n let checkbox: React.ReactNode;\r\n if (this.props.checkboxProps) {\r\n const props: NodeCheckboxRenderProps = {\r\n label: \"\",\r\n checked: this.props.checkboxProps.state === CheckBoxState.On,\r\n indeterminate: this.props.checkboxProps.state === CheckBoxState.Partial,\r\n disabled: this.props.checkboxProps.isDisabled,\r\n title: this.props.checkboxProps.tooltip,\r\n onClick: this._onCheckboxClick,\r\n onChange: this._onCheckboxChange,\r\n };\r\n if (this.props.renderOverrides && this.props.renderOverrides.renderCheckbox) {\r\n checkbox = this.props.renderOverrides.renderCheckbox(props);\r\n } else {\r\n checkbox = (\r\n <Checkbox {...props}\r\n onChange={(e: React.ChangeEvent<HTMLInputElement>) => this._onCheckboxChange(e.target.checked)} data-testid={this.createSubComponentTestId(\"checkbox\")}\r\n />\r\n );\r\n }\r\n }\r\n\r\n const icon = this.props.icon ? (<div className=\"core-tree-node-icon\">{this.props.icon}</div>) : undefined;\r\n\r\n const toggle = (this.props.isLoading || this.props.isLeaf) ? undefined : (\r\n <ExpansionToggle\r\n className=\"expansion-toggle\"\r\n data-testid={this.createSubComponentTestId(\"expansion-toggle\")}\r\n onClick={this._onClickExpansionToggle}\r\n isExpanded={this.props.isExpanded}\r\n />\r\n );\r\n\r\n return (\r\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events\r\n <div\r\n className={className}\r\n style={this.props.style}\r\n data-testid={this.props[\"data-testid\"]}\r\n onClick={this._onClick}\r\n onContextMenu={this.props.onContextMenu}\r\n onMouseDown={this.props.onMouseDown}\r\n onMouseUp={this.props.onMouseUp}\r\n onMouseMove={this.props.onMouseMove}\r\n role=\"treeitem\"\r\n tabIndex={-1}\r\n >\r\n <div\r\n className=\"contents\"\r\n style={{ marginLeft: offset }}\r\n data-testid={this.createSubComponentTestId(\"contents\")}\r\n >\r\n {this.props.isLoading && <ProgressRadial size=\"x-small\" indeterminate />}\r\n {toggle}\r\n {checkbox}\r\n {icon}\r\n {this.props.label}\r\n </div>\r\n {this.props.children}\r\n </div>\r\n );\r\n }\r\n\r\n private createSubComponentTestId(subId: string): string | undefined {\r\n if (!this.props[\"data-testid\"])\r\n return undefined;\r\n return `${this.props[\"data-testid\"]}-${subId}`;\r\n }\r\n\r\n private _onCheckboxChange = (checked: boolean) => {\r\n if (this.props.checkboxProps && this.props.checkboxProps.onClick && !this.props.checkboxProps.isDisabled)\r\n this.props.checkboxProps.onClick(checked ? CheckBoxState.On : CheckBoxState.Off);\r\n };\r\n\r\n private _onCheckboxClick = (e: React.MouseEvent) => {\r\n e.stopPropagation();\r\n };\r\n\r\n private _onClickExpansionToggle = (e: React.MouseEvent<HTMLDivElement>) => {\r\n e.stopPropagation();\r\n if (this.props.onClickExpansionToggle)\r\n this.props.onClickExpansionToggle();\r\n };\r\n\r\n private _onClick = (e: React.MouseEvent<HTMLDivElement>) => {\r\n e.stopPropagation();\r\n if (this.props.onClick)\r\n this.props.onClick(e);\r\n };\r\n}\r\n"]}
|
|
1
|
+
{"version":3,"file":"Node.js","sourceRoot":"","sources":["../../../../src/core-react/tree/Node.tsx"],"names":[],"mappings":"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","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 \"./Node.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { Checkbox, CheckboxProps, ProgressRadial } from \"@itwin/itwinui-react\";\r\nimport { CheckBoxState } from \"../enums/CheckBoxState\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport { Omit } from \"../utils/typeUtils\";\r\nimport { ExpansionToggle } from \"./ExpansionToggle\";\r\n\r\n/** Props for node Checkbox renderer\r\n * @public\r\n */\r\nexport type NodeCheckboxRenderProps = Omit<CheckboxProps, \"onChange\" | \"onClick\"> & {\r\n onChange: (checked: boolean) => void;\r\n onClick: (e: React.MouseEvent) => void;\r\n};\r\n\r\n/** Type for node Checkbox renderer\r\n * @public\r\n */\r\nexport type NodeCheckboxRenderer = (props: NodeCheckboxRenderProps) => React.ReactNode;\r\n\r\n/** Number of pixels the node gets offset per each hierarchy level\r\n * @internal\r\n */\r\nexport const LEVEL_OFFSET = 20;\r\n\r\nconst EXPANSION_TOGGLE_WIDTH = 24;\r\n\r\n/** Properties for Tree Node CheckBox\r\n * @public\r\n */\r\nexport interface NodeCheckboxProps {\r\n /** State of the checkbox */\r\n state?: CheckBoxState;\r\n /** Click event callback */\r\n onClick?: (newState: CheckBoxState) => void;\r\n /** Indicates whether checkbox is disabled */\r\n isDisabled?: boolean;\r\n /** Tooltip to be displayed when mouse is hovered over checkbox */\r\n tooltip?: string;\r\n}\r\n\r\n/** Properties for the [[TreeNode]] React component\r\n * @public\r\n */\r\nexport interface TreeNodeProps extends CommonProps {\r\n label: React.ReactNode;\r\n level: number;\r\n icon?: React.ReactChild;\r\n /** Properties for the checkbox.\r\n * @public */\r\n checkboxProps?: NodeCheckboxProps;\r\n isLeaf?: boolean;\r\n isLoading?: boolean;\r\n isExpanded?: boolean;\r\n isFocused?: boolean;\r\n isSelected?: boolean;\r\n isHoverDisabled?: boolean;\r\n onClick?: (e: React.MouseEvent) => void;\r\n onContextMenu?: (e: React.MouseEvent) => void;\r\n onMouseMove?: (e: React.MouseEvent) => void;\r\n onMouseDown?: (e: React.MouseEvent) => void;\r\n onMouseUp?: (e: React.MouseEvent) => void;\r\n onClickExpansionToggle?: () => void;\r\n children?: React.ReactNode;\r\n\r\n /** Contains render overrides for different pieces of the node component. */\r\n renderOverrides?: {\r\n /** Callback to render a checkbox. Only called when checkbox is displayed. */\r\n renderCheckbox?: NodeCheckboxRenderer;\r\n };\r\n [\"data-testid\"]?: string;\r\n}\r\n\r\n/** Presentation React component for a Tree node\r\n * @public\r\n */\r\nexport class TreeNode extends React.Component<TreeNodeProps> {\r\n private checkboxWrapperRef = React.createRef<HTMLDivElement>();\r\n\r\n constructor(props: TreeNodeProps) {\r\n super(props);\r\n }\r\n\r\n public override render() {\r\n const className = classnames(\r\n \"core-tree-node\",\r\n this.props.isFocused && \"is-focused\",\r\n this.props.isSelected && \"is-selected\",\r\n this.props.isHoverDisabled && \"is-hover-disabled\",\r\n this.props.className);\r\n let offset = this.props.level * LEVEL_OFFSET;\r\n if (!this.props.isLoading && this.props.isLeaf)\r\n offset += EXPANSION_TOGGLE_WIDTH; // Add expansion toggle/loader width if they're not rendered\r\n\r\n let checkbox: React.ReactNode;\r\n if (this.props.checkboxProps) {\r\n const props: NodeCheckboxRenderProps = {\r\n label: \"\",\r\n checked: this.props.checkboxProps.state === CheckBoxState.On,\r\n indeterminate: this.props.checkboxProps.state === CheckBoxState.Partial,\r\n disabled: this.props.checkboxProps.isDisabled,\r\n title: this.props.checkboxProps.tooltip,\r\n onClick: this._onCheckboxClick,\r\n onChange: this._onCheckboxChange,\r\n };\r\n if (this.props.renderOverrides && this.props.renderOverrides.renderCheckbox) {\r\n checkbox = this.props.renderOverrides.renderCheckbox(props);\r\n } else {\r\n checkbox = (\r\n <div ref={this.checkboxWrapperRef}>\r\n <Checkbox\r\n {...props}\r\n onChange={(e: React.ChangeEvent<HTMLInputElement>) => this._onCheckboxChange(e.target.checked)}\r\n data-testid={this.createSubComponentTestId(\"checkbox\")}\r\n />\r\n </div>\r\n );\r\n }\r\n }\r\n\r\n const icon = this.props.icon ? (<div className=\"core-tree-node-icon\">{this.props.icon}</div>) : undefined;\r\n\r\n const toggle = (this.props.isLoading || this.props.isLeaf) ? undefined : (\r\n <ExpansionToggle\r\n className=\"expansion-toggle\"\r\n data-testid={this.createSubComponentTestId(\"expansion-toggle\")}\r\n onClick={this._onClickExpansionToggle}\r\n isExpanded={this.props.isExpanded}\r\n />\r\n );\r\n\r\n return (\r\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events\r\n <div\r\n className={className}\r\n style={this.props.style}\r\n data-testid={this.props[\"data-testid\"]}\r\n onClick={this._onClick}\r\n onContextMenu={this.props.onContextMenu}\r\n onMouseDown={this.props.onMouseDown}\r\n onMouseUp={this.props.onMouseUp}\r\n onMouseMove={this.props.onMouseMove}\r\n role=\"treeitem\"\r\n tabIndex={-1}\r\n >\r\n <div\r\n className=\"contents\"\r\n style={{ marginLeft: offset }}\r\n data-testid={this.createSubComponentTestId(\"contents\")}\r\n >\r\n {this.props.isLoading && <ProgressRadial size=\"x-small\" indeterminate />}\r\n {toggle}\r\n {checkbox}\r\n {icon}\r\n {this.props.label}\r\n </div>\r\n {this.props.children}\r\n </div>\r\n );\r\n }\r\n\r\n private createSubComponentTestId(subId: string): string | undefined {\r\n if (!this.props[\"data-testid\"])\r\n return undefined;\r\n return `${this.props[\"data-testid\"]}-${subId}`;\r\n }\r\n\r\n private _onCheckboxChange = (checked: boolean) => {\r\n if (this.props.checkboxProps && this.props.checkboxProps.onClick && !this.props.checkboxProps.isDisabled)\r\n this.props.checkboxProps.onClick(checked ? CheckBoxState.On : CheckBoxState.Off);\r\n };\r\n\r\n private _onCheckboxClick = (e: React.MouseEvent) => {\r\n e.stopPropagation();\r\n };\r\n\r\n private _onClickExpansionToggle = (e: React.MouseEvent<HTMLDivElement>) => {\r\n e.stopPropagation();\r\n if (this.props.onClickExpansionToggle)\r\n this.props.onClickExpansionToggle();\r\n };\r\n\r\n private _onClick = (e: React.MouseEvent<HTMLDivElement>) => {\r\n e.stopPropagation();\r\n\r\n // ITwinUI-react has a bug that prevents us from stopping checkbox click event propagation to the parent element\r\n if (!this.checkboxWrapperRef.current\r\n || (e.target instanceof Element && !isDescendant(this.checkboxWrapperRef.current, e.target))) {\r\n this.props.onClick?.(e);\r\n }\r\n };\r\n}\r\n\r\nfunction isDescendant(ancestor: Element, descendant: Element): boolean {\r\n while (descendant.parentElement !== null) {\r\n if (descendant === ancestor) {\r\n return true;\r\n }\r\n\r\n descendant = descendant.parentElement;\r\n }\r\n\r\n return false;\r\n}\r\n"]}
|
|
@@ -69,6 +69,7 @@ export interface TreeNodeProps extends CommonProps {
|
|
|
69
69
|
* @public
|
|
70
70
|
*/
|
|
71
71
|
export declare class TreeNode extends React.Component<TreeNodeProps> {
|
|
72
|
+
private checkboxWrapperRef;
|
|
72
73
|
constructor(props: TreeNodeProps);
|
|
73
74
|
render(): JSX.Element;
|
|
74
75
|
private createSubComponentTestId;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Node.d.ts","sourceRoot":"","sources":["../../../../src/core-react/tree/Node.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,aAAa,CAAC;AAErB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAY,aAAa,EAAkB,MAAM,sBAAsB,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAG1C;;GAEG;AACH,oBAAY,uBAAuB,GAAG,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,SAAS,CAAC,GAAG;IAClF,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,OAAO,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CACxC,CAAC;AAEF;;GAEG;AACH,oBAAY,oBAAoB,GAAG,CAAC,KAAK,EAAE,uBAAuB,KAAK,KAAK,CAAC,SAAS,CAAC;AAEvF;;GAEG;AACH,eAAO,MAAM,YAAY,KAAK,CAAC;AAI/B;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,4BAA4B;IAC5B,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,2BAA2B;IAC3B,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IAC5C,6CAA6C;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,aAAc,SAAQ,WAAW;IAChD,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC;IACxB;iBACa;IACb,aAAa,CAAC,EAAE,iBAAiB,CAAC;IAClC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC1C,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;IACpC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B,4EAA4E;IAC5E,eAAe,CAAC,EAAE;QAChB,6EAA6E;QAC7E,cAAc,CAAC,EAAE,oBAAoB,CAAC;KACvC,CAAC;IACF,CAAC,aAAa,CAAC,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED;;GAEG;AACH,qBAAa,QAAS,SAAQ,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"Node.d.ts","sourceRoot":"","sources":["../../../../src/core-react/tree/Node.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,aAAa,CAAC;AAErB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAY,aAAa,EAAkB,MAAM,sBAAsB,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAG1C;;GAEG;AACH,oBAAY,uBAAuB,GAAG,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,SAAS,CAAC,GAAG;IAClF,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,OAAO,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CACxC,CAAC;AAEF;;GAEG;AACH,oBAAY,oBAAoB,GAAG,CAAC,KAAK,EAAE,uBAAuB,KAAK,KAAK,CAAC,SAAS,CAAC;AAEvF;;GAEG;AACH,eAAO,MAAM,YAAY,KAAK,CAAC;AAI/B;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,4BAA4B;IAC5B,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,2BAA2B;IAC3B,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IAC5C,6CAA6C;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,aAAc,SAAQ,WAAW;IAChD,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC;IACxB;iBACa;IACb,aAAa,CAAC,EAAE,iBAAiB,CAAC;IAClC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC1C,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;IACpC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B,4EAA4E;IAC5E,eAAe,CAAC,EAAE;QAChB,6EAA6E;QAC7E,cAAc,CAAC,EAAE,oBAAoB,CAAC;KACvC,CAAC;IACF,CAAC,aAAa,CAAC,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED;;GAEG;AACH,qBAAa,QAAS,SAAQ,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC;IAC1D,OAAO,CAAC,kBAAkB,CAAqC;gBAEnD,KAAK,EAAE,aAAa;IAIhB,MAAM;IA8EtB,OAAO,CAAC,wBAAwB;IAMhC,OAAO,CAAC,iBAAiB,CAGvB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,uBAAuB,CAI7B;IAEF,OAAO,CAAC,QAAQ,CAQd;CACH"}
|
|
@@ -22,6 +22,7 @@ const EXPANSION_TOGGLE_WIDTH = 24;
|
|
|
22
22
|
export class TreeNode extends React.Component {
|
|
23
23
|
constructor(props) {
|
|
24
24
|
super(props);
|
|
25
|
+
this.checkboxWrapperRef = React.createRef();
|
|
25
26
|
this._onCheckboxChange = (checked) => {
|
|
26
27
|
if (this.props.checkboxProps && this.props.checkboxProps.onClick && !this.props.checkboxProps.isDisabled)
|
|
27
28
|
this.props.checkboxProps.onClick(checked ? CheckBoxState.On : CheckBoxState.Off);
|
|
@@ -35,9 +36,13 @@ export class TreeNode extends React.Component {
|
|
|
35
36
|
this.props.onClickExpansionToggle();
|
|
36
37
|
};
|
|
37
38
|
this._onClick = (e) => {
|
|
39
|
+
var _a, _b;
|
|
38
40
|
e.stopPropagation();
|
|
39
|
-
|
|
40
|
-
|
|
41
|
+
// ITwinUI-react has a bug that prevents us from stopping checkbox click event propagation to the parent element
|
|
42
|
+
if (!this.checkboxWrapperRef.current
|
|
43
|
+
|| (e.target instanceof Element && !isDescendant(this.checkboxWrapperRef.current, e.target))) {
|
|
44
|
+
(_b = (_a = this.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
|
|
45
|
+
}
|
|
41
46
|
};
|
|
42
47
|
}
|
|
43
48
|
render() {
|
|
@@ -60,7 +65,8 @@ export class TreeNode extends React.Component {
|
|
|
60
65
|
checkbox = this.props.renderOverrides.renderCheckbox(props);
|
|
61
66
|
}
|
|
62
67
|
else {
|
|
63
|
-
checkbox = (React.createElement(
|
|
68
|
+
checkbox = (React.createElement("div", { ref: this.checkboxWrapperRef },
|
|
69
|
+
React.createElement(Checkbox, { ...props, onChange: (e) => this._onCheckboxChange(e.target.checked), "data-testid": this.createSubComponentTestId("checkbox") })));
|
|
64
70
|
}
|
|
65
71
|
}
|
|
66
72
|
const icon = this.props.icon ? (React.createElement("div", { className: "core-tree-node-icon" }, this.props.icon)) : undefined;
|
|
@@ -82,4 +88,13 @@ export class TreeNode extends React.Component {
|
|
|
82
88
|
return `${this.props["data-testid"]}-${subId}`;
|
|
83
89
|
}
|
|
84
90
|
}
|
|
91
|
+
function isDescendant(ancestor, descendant) {
|
|
92
|
+
while (descendant.parentElement !== null) {
|
|
93
|
+
if (descendant === ancestor) {
|
|
94
|
+
return true;
|
|
95
|
+
}
|
|
96
|
+
descendant = descendant.parentElement;
|
|
97
|
+
}
|
|
98
|
+
return false;
|
|
99
|
+
}
|
|
85
100
|
//# sourceMappingURL=Node.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Node.js","sourceRoot":"","sources":["../../../../src/core-react/tree/Node.tsx"],"names":[],"mappings":"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","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 \"./Node.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { Checkbox, CheckboxProps, ProgressRadial } from \"@itwin/itwinui-react\";\r\nimport { CheckBoxState } from \"../enums/CheckBoxState\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport { Omit } from \"../utils/typeUtils\";\r\nimport { ExpansionToggle } from \"./ExpansionToggle\";\r\n\r\n/** Props for node Checkbox renderer\r\n * @public\r\n */\r\nexport type NodeCheckboxRenderProps = Omit<CheckboxProps, \"onChange\" | \"onClick\"> & {\r\n onChange: (checked: boolean) => void;\r\n onClick: (e: React.MouseEvent) => void;\r\n};\r\n\r\n/** Type for node Checkbox renderer\r\n * @public\r\n */\r\nexport type NodeCheckboxRenderer = (props: NodeCheckboxRenderProps) => React.ReactNode;\r\n\r\n/** Number of pixels the node gets offset per each hierarchy level\r\n * @internal\r\n */\r\nexport const LEVEL_OFFSET = 20;\r\n\r\nconst EXPANSION_TOGGLE_WIDTH = 24;\r\n\r\n/** Properties for Tree Node CheckBox\r\n * @public\r\n */\r\nexport interface NodeCheckboxProps {\r\n /** State of the checkbox */\r\n state?: CheckBoxState;\r\n /** Click event callback */\r\n onClick?: (newState: CheckBoxState) => void;\r\n /** Indicates whether checkbox is disabled */\r\n isDisabled?: boolean;\r\n /** Tooltip to be displayed when mouse is hovered over checkbox */\r\n tooltip?: string;\r\n}\r\n\r\n/** Properties for the [[TreeNode]] React component\r\n * @public\r\n */\r\nexport interface TreeNodeProps extends CommonProps {\r\n label: React.ReactNode;\r\n level: number;\r\n icon?: React.ReactChild;\r\n /** Properties for the checkbox.\r\n * @public */\r\n checkboxProps?: NodeCheckboxProps;\r\n isLeaf?: boolean;\r\n isLoading?: boolean;\r\n isExpanded?: boolean;\r\n isFocused?: boolean;\r\n isSelected?: boolean;\r\n isHoverDisabled?: boolean;\r\n onClick?: (e: React.MouseEvent) => void;\r\n onContextMenu?: (e: React.MouseEvent) => void;\r\n onMouseMove?: (e: React.MouseEvent) => void;\r\n onMouseDown?: (e: React.MouseEvent) => void;\r\n onMouseUp?: (e: React.MouseEvent) => void;\r\n onClickExpansionToggle?: () => void;\r\n children?: React.ReactNode;\r\n\r\n /** Contains render overrides for different pieces of the node component. */\r\n renderOverrides?: {\r\n /** Callback to render a checkbox. Only called when checkbox is displayed. */\r\n renderCheckbox?: NodeCheckboxRenderer;\r\n };\r\n [\"data-testid\"]?: string;\r\n}\r\n\r\n/** Presentation React component for a Tree node\r\n * @public\r\n */\r\nexport class TreeNode extends React.Component<TreeNodeProps> {\r\n constructor(props: TreeNodeProps) {\r\n super(props);\r\n }\r\n\r\n public override render() {\r\n const className = classnames(\r\n \"core-tree-node\",\r\n this.props.isFocused && \"is-focused\",\r\n this.props.isSelected && \"is-selected\",\r\n this.props.isHoverDisabled && \"is-hover-disabled\",\r\n this.props.className);\r\n let offset = this.props.level * LEVEL_OFFSET;\r\n if (!this.props.isLoading && this.props.isLeaf)\r\n offset += EXPANSION_TOGGLE_WIDTH; // Add expansion toggle/loader width if they're not rendered\r\n\r\n let checkbox: React.ReactNode;\r\n if (this.props.checkboxProps) {\r\n const props: NodeCheckboxRenderProps = {\r\n label: \"\",\r\n checked: this.props.checkboxProps.state === CheckBoxState.On,\r\n indeterminate: this.props.checkboxProps.state === CheckBoxState.Partial,\r\n disabled: this.props.checkboxProps.isDisabled,\r\n title: this.props.checkboxProps.tooltip,\r\n onClick: this._onCheckboxClick,\r\n onChange: this._onCheckboxChange,\r\n };\r\n if (this.props.renderOverrides && this.props.renderOverrides.renderCheckbox) {\r\n checkbox = this.props.renderOverrides.renderCheckbox(props);\r\n } else {\r\n checkbox = (\r\n <Checkbox {...props}\r\n onChange={(e: React.ChangeEvent<HTMLInputElement>) => this._onCheckboxChange(e.target.checked)} data-testid={this.createSubComponentTestId(\"checkbox\")}\r\n />\r\n );\r\n }\r\n }\r\n\r\n const icon = this.props.icon ? (<div className=\"core-tree-node-icon\">{this.props.icon}</div>) : undefined;\r\n\r\n const toggle = (this.props.isLoading || this.props.isLeaf) ? undefined : (\r\n <ExpansionToggle\r\n className=\"expansion-toggle\"\r\n data-testid={this.createSubComponentTestId(\"expansion-toggle\")}\r\n onClick={this._onClickExpansionToggle}\r\n isExpanded={this.props.isExpanded}\r\n />\r\n );\r\n\r\n return (\r\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events\r\n <div\r\n className={className}\r\n style={this.props.style}\r\n data-testid={this.props[\"data-testid\"]}\r\n onClick={this._onClick}\r\n onContextMenu={this.props.onContextMenu}\r\n onMouseDown={this.props.onMouseDown}\r\n onMouseUp={this.props.onMouseUp}\r\n onMouseMove={this.props.onMouseMove}\r\n role=\"treeitem\"\r\n tabIndex={-1}\r\n >\r\n <div\r\n className=\"contents\"\r\n style={{ marginLeft: offset }}\r\n data-testid={this.createSubComponentTestId(\"contents\")}\r\n >\r\n {this.props.isLoading && <ProgressRadial size=\"x-small\" indeterminate />}\r\n {toggle}\r\n {checkbox}\r\n {icon}\r\n {this.props.label}\r\n </div>\r\n {this.props.children}\r\n </div>\r\n );\r\n }\r\n\r\n private createSubComponentTestId(subId: string): string | undefined {\r\n if (!this.props[\"data-testid\"])\r\n return undefined;\r\n return `${this.props[\"data-testid\"]}-${subId}`;\r\n }\r\n\r\n private _onCheckboxChange = (checked: boolean) => {\r\n if (this.props.checkboxProps && this.props.checkboxProps.onClick && !this.props.checkboxProps.isDisabled)\r\n this.props.checkboxProps.onClick(checked ? CheckBoxState.On : CheckBoxState.Off);\r\n };\r\n\r\n private _onCheckboxClick = (e: React.MouseEvent) => {\r\n e.stopPropagation();\r\n };\r\n\r\n private _onClickExpansionToggle = (e: React.MouseEvent<HTMLDivElement>) => {\r\n e.stopPropagation();\r\n if (this.props.onClickExpansionToggle)\r\n this.props.onClickExpansionToggle();\r\n };\r\n\r\n private _onClick = (e: React.MouseEvent<HTMLDivElement>) => {\r\n e.stopPropagation();\r\n if (this.props.onClick)\r\n this.props.onClick(e);\r\n };\r\n}\r\n"]}
|
|
1
|
+
{"version":3,"file":"Node.js","sourceRoot":"","sources":["../../../../src/core-react/tree/Node.tsx"],"names":[],"mappings":"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","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 \"./Node.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { Checkbox, CheckboxProps, ProgressRadial } from \"@itwin/itwinui-react\";\r\nimport { CheckBoxState } from \"../enums/CheckBoxState\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport { Omit } from \"../utils/typeUtils\";\r\nimport { ExpansionToggle } from \"./ExpansionToggle\";\r\n\r\n/** Props for node Checkbox renderer\r\n * @public\r\n */\r\nexport type NodeCheckboxRenderProps = Omit<CheckboxProps, \"onChange\" | \"onClick\"> & {\r\n onChange: (checked: boolean) => void;\r\n onClick: (e: React.MouseEvent) => void;\r\n};\r\n\r\n/** Type for node Checkbox renderer\r\n * @public\r\n */\r\nexport type NodeCheckboxRenderer = (props: NodeCheckboxRenderProps) => React.ReactNode;\r\n\r\n/** Number of pixels the node gets offset per each hierarchy level\r\n * @internal\r\n */\r\nexport const LEVEL_OFFSET = 20;\r\n\r\nconst EXPANSION_TOGGLE_WIDTH = 24;\r\n\r\n/** Properties for Tree Node CheckBox\r\n * @public\r\n */\r\nexport interface NodeCheckboxProps {\r\n /** State of the checkbox */\r\n state?: CheckBoxState;\r\n /** Click event callback */\r\n onClick?: (newState: CheckBoxState) => void;\r\n /** Indicates whether checkbox is disabled */\r\n isDisabled?: boolean;\r\n /** Tooltip to be displayed when mouse is hovered over checkbox */\r\n tooltip?: string;\r\n}\r\n\r\n/** Properties for the [[TreeNode]] React component\r\n * @public\r\n */\r\nexport interface TreeNodeProps extends CommonProps {\r\n label: React.ReactNode;\r\n level: number;\r\n icon?: React.ReactChild;\r\n /** Properties for the checkbox.\r\n * @public */\r\n checkboxProps?: NodeCheckboxProps;\r\n isLeaf?: boolean;\r\n isLoading?: boolean;\r\n isExpanded?: boolean;\r\n isFocused?: boolean;\r\n isSelected?: boolean;\r\n isHoverDisabled?: boolean;\r\n onClick?: (e: React.MouseEvent) => void;\r\n onContextMenu?: (e: React.MouseEvent) => void;\r\n onMouseMove?: (e: React.MouseEvent) => void;\r\n onMouseDown?: (e: React.MouseEvent) => void;\r\n onMouseUp?: (e: React.MouseEvent) => void;\r\n onClickExpansionToggle?: () => void;\r\n children?: React.ReactNode;\r\n\r\n /** Contains render overrides for different pieces of the node component. */\r\n renderOverrides?: {\r\n /** Callback to render a checkbox. Only called when checkbox is displayed. */\r\n renderCheckbox?: NodeCheckboxRenderer;\r\n };\r\n [\"data-testid\"]?: string;\r\n}\r\n\r\n/** Presentation React component for a Tree node\r\n * @public\r\n */\r\nexport class TreeNode extends React.Component<TreeNodeProps> {\r\n private checkboxWrapperRef = React.createRef<HTMLDivElement>();\r\n\r\n constructor(props: TreeNodeProps) {\r\n super(props);\r\n }\r\n\r\n public override render() {\r\n const className = classnames(\r\n \"core-tree-node\",\r\n this.props.isFocused && \"is-focused\",\r\n this.props.isSelected && \"is-selected\",\r\n this.props.isHoverDisabled && \"is-hover-disabled\",\r\n this.props.className);\r\n let offset = this.props.level * LEVEL_OFFSET;\r\n if (!this.props.isLoading && this.props.isLeaf)\r\n offset += EXPANSION_TOGGLE_WIDTH; // Add expansion toggle/loader width if they're not rendered\r\n\r\n let checkbox: React.ReactNode;\r\n if (this.props.checkboxProps) {\r\n const props: NodeCheckboxRenderProps = {\r\n label: \"\",\r\n checked: this.props.checkboxProps.state === CheckBoxState.On,\r\n indeterminate: this.props.checkboxProps.state === CheckBoxState.Partial,\r\n disabled: this.props.checkboxProps.isDisabled,\r\n title: this.props.checkboxProps.tooltip,\r\n onClick: this._onCheckboxClick,\r\n onChange: this._onCheckboxChange,\r\n };\r\n if (this.props.renderOverrides && this.props.renderOverrides.renderCheckbox) {\r\n checkbox = this.props.renderOverrides.renderCheckbox(props);\r\n } else {\r\n checkbox = (\r\n <div ref={this.checkboxWrapperRef}>\r\n <Checkbox\r\n {...props}\r\n onChange={(e: React.ChangeEvent<HTMLInputElement>) => this._onCheckboxChange(e.target.checked)}\r\n data-testid={this.createSubComponentTestId(\"checkbox\")}\r\n />\r\n </div>\r\n );\r\n }\r\n }\r\n\r\n const icon = this.props.icon ? (<div className=\"core-tree-node-icon\">{this.props.icon}</div>) : undefined;\r\n\r\n const toggle = (this.props.isLoading || this.props.isLeaf) ? undefined : (\r\n <ExpansionToggle\r\n className=\"expansion-toggle\"\r\n data-testid={this.createSubComponentTestId(\"expansion-toggle\")}\r\n onClick={this._onClickExpansionToggle}\r\n isExpanded={this.props.isExpanded}\r\n />\r\n );\r\n\r\n return (\r\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events\r\n <div\r\n className={className}\r\n style={this.props.style}\r\n data-testid={this.props[\"data-testid\"]}\r\n onClick={this._onClick}\r\n onContextMenu={this.props.onContextMenu}\r\n onMouseDown={this.props.onMouseDown}\r\n onMouseUp={this.props.onMouseUp}\r\n onMouseMove={this.props.onMouseMove}\r\n role=\"treeitem\"\r\n tabIndex={-1}\r\n >\r\n <div\r\n className=\"contents\"\r\n style={{ marginLeft: offset }}\r\n data-testid={this.createSubComponentTestId(\"contents\")}\r\n >\r\n {this.props.isLoading && <ProgressRadial size=\"x-small\" indeterminate />}\r\n {toggle}\r\n {checkbox}\r\n {icon}\r\n {this.props.label}\r\n </div>\r\n {this.props.children}\r\n </div>\r\n );\r\n }\r\n\r\n private createSubComponentTestId(subId: string): string | undefined {\r\n if (!this.props[\"data-testid\"])\r\n return undefined;\r\n return `${this.props[\"data-testid\"]}-${subId}`;\r\n }\r\n\r\n private _onCheckboxChange = (checked: boolean) => {\r\n if (this.props.checkboxProps && this.props.checkboxProps.onClick && !this.props.checkboxProps.isDisabled)\r\n this.props.checkboxProps.onClick(checked ? CheckBoxState.On : CheckBoxState.Off);\r\n };\r\n\r\n private _onCheckboxClick = (e: React.MouseEvent) => {\r\n e.stopPropagation();\r\n };\r\n\r\n private _onClickExpansionToggle = (e: React.MouseEvent<HTMLDivElement>) => {\r\n e.stopPropagation();\r\n if (this.props.onClickExpansionToggle)\r\n this.props.onClickExpansionToggle();\r\n };\r\n\r\n private _onClick = (e: React.MouseEvent<HTMLDivElement>) => {\r\n e.stopPropagation();\r\n\r\n // ITwinUI-react has a bug that prevents us from stopping checkbox click event propagation to the parent element\r\n if (!this.checkboxWrapperRef.current\r\n || (e.target instanceof Element && !isDescendant(this.checkboxWrapperRef.current, e.target))) {\r\n this.props.onClick?.(e);\r\n }\r\n };\r\n}\r\n\r\nfunction isDescendant(ancestor: Element, descendant: Element): boolean {\r\n while (descendant.parentElement !== null) {\r\n if (descendant === ancestor) {\r\n return true;\r\n }\r\n\r\n descendant = descendant.parentElement;\r\n }\r\n\r\n return false;\r\n}\r\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@itwin/core-react",
|
|
3
|
-
"version": "3.1.0-dev.
|
|
3
|
+
"version": "3.1.0-dev.28",
|
|
4
4
|
"description": "iTwin.js UI core components",
|
|
5
5
|
"main": "lib/cjs/core-react.js",
|
|
6
6
|
"module": "lib/esm/core-react.js",
|
|
@@ -23,8 +23,8 @@
|
|
|
23
23
|
"url": "http://www.bentley.com"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|
|
26
|
-
"@itwin/appui-abstract": "^3.1.0-dev.
|
|
27
|
-
"@itwin/core-bentley": "^3.1.0-dev.
|
|
26
|
+
"@itwin/appui-abstract": "^3.1.0-dev.28",
|
|
27
|
+
"@itwin/core-bentley": "^3.1.0-dev.28",
|
|
28
28
|
"react": "^17.0.0",
|
|
29
29
|
"react-dom": "^17.0.0"
|
|
30
30
|
},
|
|
@@ -33,12 +33,12 @@
|
|
|
33
33
|
"NOTE: All tools used by scripts in this package must be listed as devDependencies"
|
|
34
34
|
],
|
|
35
35
|
"devDependencies": {
|
|
36
|
-
"@itwin/appui-abstract": "3.1.0-dev.
|
|
37
|
-
"@itwin/build-tools": "3.1.0-dev.
|
|
38
|
-
"@itwin/core-bentley": "3.1.0-dev.
|
|
39
|
-
"@itwin/core-common": "3.1.0-dev.
|
|
40
|
-
"@itwin/core-i18n": "3.1.0-dev.
|
|
41
|
-
"@itwin/eslint-plugin": "3.1.0-dev.
|
|
36
|
+
"@itwin/appui-abstract": "3.1.0-dev.28",
|
|
37
|
+
"@itwin/build-tools": "3.1.0-dev.28",
|
|
38
|
+
"@itwin/core-bentley": "3.1.0-dev.28",
|
|
39
|
+
"@itwin/core-common": "3.1.0-dev.28",
|
|
40
|
+
"@itwin/core-i18n": "3.1.0-dev.28",
|
|
41
|
+
"@itwin/eslint-plugin": "3.1.0-dev.28",
|
|
42
42
|
"@testing-library/react": "^12.0.0",
|
|
43
43
|
"@testing-library/react-hooks": "^7.0.2",
|
|
44
44
|
"@testing-library/user-event": "^13.2.1",
|