@itwin/core-react 3.0.0-dev.181 → 3.0.0-dev.182

package/lib/cjs/core-react/messagebox/MessageBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessageBox.d.ts","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageBox.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAE3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAEzE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,WAAW;IAClD,6BAA6B;IAC7B,QAAQ,EAAE,eAAe,CAAC;IAC1B,oCAAoC;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,2FAA2F;IAC3F,aAAa,EAAE,eAAe,EAAE,CAAC;IACjC,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC7B,4CAA4C;IAC5C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,wDAAwD;IACxD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uCAAuC;IACvC,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACpC;AAED;;GAEG;AACH,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC;IAClE,OAAc,YAAY,EAAE,OAAO,CAAC,eAAe,CAAC,CAKlD;IAEc,MAAM,IAAI,GAAG,CAAC,OAAO;CAkBtC;AAED;;GAEG;AACH,MAAM,WAAW,qBAAsB,SAAQ,WAAW;IACxD,QAAQ,EAAE,eAAe,CAAC;CAC3B;AAED;;GAEG;AACH,qBAAa,gBAAiB,SAAQ,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC;WAChE,gBAAgB,CAAC,QAAQ,EAAE,eAAe,EAAE,MAAM,CAAC,EAAE,OAAO,GAAG,MAAM;IA2BnE,MAAM,IAAI,GAAG,CAAC,OAAO;CAgBtC"}
+{"version":3,"file":"MessageBox.d.ts","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageBox.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAE3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAEzE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,WAAW;IAClD,6BAA6B;IAC7B,QAAQ,EAAE,eAAe,CAAC;IAC1B,oCAAoC;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,2FAA2F;IAC3F,aAAa,EAAE,eAAe,EAAE,CAAC;IACjC,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC7B,4CAA4C;IAC5C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,wDAAwD;IACxD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uCAAuC;IACvC,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACpC;AAED;;GAEG;AACH,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC;IAClE,OAAc,YAAY,EAAE,OAAO,CAAC,eAAe,CAAC,CAKlD;IAEc,MAAM,IAAI,GAAG,CAAC,OAAO;CAkBtC;AAED;;GAEG;AACH,MAAM,WAAW,qBAAsB,SAAQ,WAAW;IACxD,QAAQ,EAAE,eAAe,CAAC;CAC3B;AAED;;GAEG;AACH,qBAAa,gBAAiB,SAAQ,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC;WAChE,gBAAgB,CAAC,QAAQ,EAAE,eAAe,EAAE,MAAM,CAAC,EAAE,OAAO,GAAG,MAAM;IA8BnE,MAAM,IAAI,GAAG,CAAC,OAAO;CAgBtC"}

package/lib/cjs/core-react/messagebox/MessageBox.js

@@ -37,6 +37,9 @@ class MessageContainer extends React.PureComponent {
         let iconClassName = "";
         switch (severity) {
             case appui_abstract_1.MessageSeverity.None:
+                iconClassName = " ";
+                break;
+            case appui_abstract_1.MessageSeverity.Success:
                 iconClassName = hollow ? "icon-status-success-hollow" : "icon-status-success" + " core-message-box-success";
                 break;
             case appui_abstract_1.MessageSeverity.Information:

package/lib/cjs/core-react/messagebox/MessageBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessageBox.js","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageBox.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,6BAA2B;AAC3B,2CAAoC;AACpC,+BAA+B;AAC/B,0DAAyE;AACzE,6CAA0C;AAyC1C;;GAEG;AACH,MAAa,UAAW,SAAQ,KAAK,CAAC,aAA8B;IAQlD,MAAM;QACpB,OAAO,CACL,oBAAC,eAAM,IACL,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,aAAa,EACvC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,EACzB,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAC3B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC/B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YACvB,oBAAC,gBAAgB,IAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,IACpH,IAAI,CAAC,KAAK,CAAC,QAAQ,CACH,CACZ,CACV,CAAC;IACJ,CAAC;;AAzBH,gCA0BC;AAzBe,uBAAY,GAA6B;IACrD,QAAQ,EAAE,GAAG;IACb,SAAS,EAAE,GAAG;IACd,KAAK,EAAE,OAAO;IACd,KAAK,EAAE,IAAI;CACZ,CAAC;AA6BJ;;GAEG;AACH,MAAa,gBAAiB,SAAQ,KAAK,CAAC,aAAoC;IACvE,MAAM,CAAC,gBAAgB,CAAC,QAAyB,EAAE,MAAgB;QACxE,IAAI,aAAa,GAAG,EAAE,CAAC;QAEvB,QAAQ,QAAQ,EAAE;YAChB,KAAK,gCAAe,CAAC,IAAI;gBACvB,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,4BAA4B,CAAC,CAAC,CAAC,qBAAqB,GAAG,2BAA2B,CAAC;gBAC5G,MAAM;YACR,KAAK,gCAAe,CAAC,WAAW;gBAC9B,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,WAAW,GAAG,+BAA+B,CAAC;gBAC5F,MAAM;YACR,KAAK,gCAAe,CAAC,QAAQ;gBAC3B,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,WAAW,GAAG,4BAA4B,CAAC;gBACzF,MAAM;YACR,KAAK,gCAAe,CAAC,OAAO;gBAC1B,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,GAAG,2BAA2B,CAAC,CAAE,8CAA8C;gBACrJ,MAAM;YACR,KAAK,gCAAe,CAAC,KAAK;gBACxB,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,mBAAmB,GAAG,yBAAyB,CAAC;gBACtG,MAAM;YACR,KAAK,gCAAe,CAAC,KAAK;gBACxB,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,sBAAsB,GAAG,yBAAyB,CAAC;gBACrG,MAAM;SACT;QAED,OAAO,aAAa,CAAC;IACvB,CAAC;IAEe,MAAM;QACpB,MAAM,aAAa,GAAG,IAAA,oBAAU,EAC9B,MAAM,EACN,uBAAuB,EACvB,gBAAgB,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CACvD,CAAC;QAEF,OAAO,CACL,6BAAK,SAAS,EAAC,4BAA4B;YACzC,6BAAK,SAAS,EAAE,aAAa,GAAI;YACjC,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,0BAA0B,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IAClG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAChB,CACF,CACP,CAAC;IACJ,CAAC;CACF;AA5CD,4CA4CC","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 Dialog\r\n */\r\n\r\nimport \"./MessageBox.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { DialogButtonDef, MessageSeverity } from \"@itwin/appui-abstract\";\r\nimport { Dialog } from \"../dialog/Dialog\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties for the [[MessageBox]] component\r\n * @public\r\n */\r\nexport interface MessageBoxProps extends CommonProps {\r\n  /** Severity of MessageBox */\r\n  severity: MessageSeverity;\r\n  /** whether to show dialog or not */\r\n  opened: boolean;\r\n  /** List of [[DialogButtonDef]] objects specifying buttons and associated onClick events */\r\n  buttonCluster: DialogButtonDef[];\r\n  /** Title to show in title bar of dialog  */\r\n  title?: string | JSX.Element;\r\n  /** onClick event for X button for dialog */\r\n  onClose?: () => void;\r\n  /** 'keyup' event for <Esc> key */\r\n  onEscape?: () => void;\r\n  /** minimum width that the dialog may be resized to. Default: 400 */\r\n  minWidth?: number;\r\n  /** minimum height that the dialog may be resized to. Default: 400 */\r\n  minHeight?: number;\r\n  /** initial width of dialog.\r\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\r\n   * Default: \"50%\"\r\n   */\r\n  width?: string | number;\r\n  /** initial height of dialog.\r\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\r\n   * Default: \"\"\r\n   */\r\n  height?: string | number;\r\n  /** Whether to show background overlay. Default: true */\r\n  modal?: boolean;\r\n  /** Custom CSS class name for the content */\r\n  contentClassName?: string;\r\n  /** Custom CSS Style for the content */\r\n  contentStyle?: React.CSSProperties;\r\n}\r\n\r\n/** Message Box React component.\r\n * @public\r\n */\r\nexport class MessageBox extends React.PureComponent<MessageBoxProps> {\r\n  public static defaultProps: Partial<MessageBoxProps> = {\r\n    minWidth: 400,\r\n    minHeight: 400,\r\n    width: \"512px\",\r\n    modal: true,\r\n  };\r\n\r\n  public override render(): JSX.Element {\r\n    return (\r\n      <Dialog\r\n        title={this.props.title}\r\n        buttonCluster={this.props.buttonCluster}\r\n        opened={this.props.opened}\r\n        width={this.props.width}\r\n        onClose={this.props.onClose}\r\n        onEscape={this.props.onEscape}\r\n        modal={this.props.modal}\r\n        className={this.props.className}\r\n        style={this.props.style} >\r\n        <MessageContainer severity={this.props.severity} className={this.props.contentClassName} style={this.props.contentStyle}>\r\n          {this.props.children}\r\n        </MessageContainer>\r\n      </Dialog>\r\n    );\r\n  }\r\n}\r\n\r\n/** Properties for the [[MessageContainer]] component\r\n * @public\r\n */\r\nexport interface MessageContainerProps extends CommonProps {\r\n  severity: MessageSeverity;\r\n}\r\n\r\n/** Message Container React component.\r\n * @public\r\n */\r\nexport class MessageContainer extends React.PureComponent<MessageContainerProps> {\r\n  public static getIconClassName(severity: MessageSeverity, hollow?: boolean): string {\r\n    let iconClassName = \"\";\r\n\r\n    switch (severity) {\r\n      case MessageSeverity.None:\r\n        iconClassName = hollow ? \"icon-status-success-hollow\" : \"icon-status-success\" + \" core-message-box-success\";\r\n        break;\r\n      case MessageSeverity.Information:\r\n        iconClassName = hollow ? \"icon-info-hollow\" : \"icon-info\" + \" core-message-box-information\";\r\n        break;\r\n      case MessageSeverity.Question:\r\n        iconClassName = hollow ? \"icon-help-hollow\" : \"icon-help\" + \" core-message-box-question\";\r\n        break;\r\n      case MessageSeverity.Warning:\r\n        iconClassName = hollow ? \"icon-status-warning\" : \"icon-status-warning\" + \" core-message-box-warning\";  // TODO - need icon-status-warning-hollow icon\r\n        break;\r\n      case MessageSeverity.Error:\r\n        iconClassName = hollow ? \"icon-status-error-hollow\" : \"icon-status-error\" + \" core-message-box-error\";\r\n        break;\r\n      case MessageSeverity.Fatal:\r\n        iconClassName = hollow ? \"icon-status-rejected\" : \"icon-status-rejected\" + \" core-message-box-fatal\";\r\n        break;\r\n    }\r\n\r\n    return iconClassName;\r\n  }\r\n\r\n  public override render(): JSX.Element {\r\n    const iconClassName = classnames(\r\n      \"icon\",\r\n      \"core-message-box-icon\",\r\n      MessageContainer.getIconClassName(this.props.severity),\r\n    );\r\n\r\n    return (\r\n      <div className=\"core-message-box-container\">\r\n        <div className={iconClassName} />\r\n        <div className={classnames(\"core-message-box-content\", this.props.className)} style={this.props.style}>\r\n          {this.props.children}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"MessageBox.js","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageBox.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 Dialog\r\n */\r\n\r\nimport \"./MessageBox.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { DialogButtonDef, MessageSeverity } from \"@itwin/appui-abstract\";\r\nimport { Dialog } from \"../dialog/Dialog\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties for the [[MessageBox]] component\r\n * @public\r\n */\r\nexport interface MessageBoxProps extends CommonProps {\r\n  /** Severity of MessageBox */\r\n  severity: MessageSeverity;\r\n  /** whether to show dialog or not */\r\n  opened: boolean;\r\n  /** List of [[DialogButtonDef]] objects specifying buttons and associated onClick events */\r\n  buttonCluster: DialogButtonDef[];\r\n  /** Title to show in title bar of dialog  */\r\n  title?: string | JSX.Element;\r\n  /** onClick event for X button for dialog */\r\n  onClose?: () => void;\r\n  /** 'keyup' event for <Esc> key */\r\n  onEscape?: () => void;\r\n  /** minimum width that the dialog may be resized to. Default: 400 */\r\n  minWidth?: number;\r\n  /** minimum height that the dialog may be resized to. Default: 400 */\r\n  minHeight?: number;\r\n  /** initial width of dialog.\r\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\r\n   * Default: \"50%\"\r\n   */\r\n  width?: string | number;\r\n  /** initial height of dialog.\r\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\r\n   * Default: \"\"\r\n   */\r\n  height?: string | number;\r\n  /** Whether to show background overlay. Default: true */\r\n  modal?: boolean;\r\n  /** Custom CSS class name for the content */\r\n  contentClassName?: string;\r\n  /** Custom CSS Style for the content */\r\n  contentStyle?: React.CSSProperties;\r\n}\r\n\r\n/** Message Box React component.\r\n * @public\r\n */\r\nexport class MessageBox extends React.PureComponent<MessageBoxProps> {\r\n  public static defaultProps: Partial<MessageBoxProps> = {\r\n    minWidth: 400,\r\n    minHeight: 400,\r\n    width: \"512px\",\r\n    modal: true,\r\n  };\r\n\r\n  public override render(): JSX.Element {\r\n    return (\r\n      <Dialog\r\n        title={this.props.title}\r\n        buttonCluster={this.props.buttonCluster}\r\n        opened={this.props.opened}\r\n        width={this.props.width}\r\n        onClose={this.props.onClose}\r\n        onEscape={this.props.onEscape}\r\n        modal={this.props.modal}\r\n        className={this.props.className}\r\n        style={this.props.style} >\r\n        <MessageContainer severity={this.props.severity} className={this.props.contentClassName} style={this.props.contentStyle}>\r\n          {this.props.children}\r\n        </MessageContainer>\r\n      </Dialog>\r\n    );\r\n  }\r\n}\r\n\r\n/** Properties for the [[MessageContainer]] component\r\n * @public\r\n */\r\nexport interface MessageContainerProps extends CommonProps {\r\n  severity: MessageSeverity;\r\n}\r\n\r\n/** Message Container React component.\r\n * @public\r\n */\r\nexport class MessageContainer extends React.PureComponent<MessageContainerProps> {\r\n  public static getIconClassName(severity: MessageSeverity, hollow?: boolean): string {\r\n    let iconClassName = \"\";\r\n\r\n    switch (severity) {\r\n      case MessageSeverity.None:\r\n        iconClassName = \" \";\r\n        break;\r\n      case MessageSeverity.Success:\r\n        iconClassName = hollow ? \"icon-status-success-hollow\" : \"icon-status-success\" + \" core-message-box-success\";\r\n        break;\r\n      case MessageSeverity.Information:\r\n        iconClassName = hollow ? \"icon-info-hollow\" : \"icon-info\" + \" core-message-box-information\";\r\n        break;\r\n      case MessageSeverity.Question:\r\n        iconClassName = hollow ? \"icon-help-hollow\" : \"icon-help\" + \" core-message-box-question\";\r\n        break;\r\n      case MessageSeverity.Warning:\r\n        iconClassName = hollow ? \"icon-status-warning\" : \"icon-status-warning\" + \" core-message-box-warning\";  // TODO - need icon-status-warning-hollow icon\r\n        break;\r\n      case MessageSeverity.Error:\r\n        iconClassName = hollow ? \"icon-status-error-hollow\" : \"icon-status-error\" + \" core-message-box-error\";\r\n        break;\r\n      case MessageSeverity.Fatal:\r\n        iconClassName = hollow ? \"icon-status-rejected\" : \"icon-status-rejected\" + \" core-message-box-fatal\";\r\n        break;\r\n    }\r\n\r\n    return iconClassName;\r\n  }\r\n\r\n  public override render(): JSX.Element {\r\n    const iconClassName = classnames(\r\n      \"icon\",\r\n      \"core-message-box-icon\",\r\n      MessageContainer.getIconClassName(this.props.severity),\r\n    );\r\n\r\n    return (\r\n      <div className=\"core-message-box-container\">\r\n        <div className={iconClassName} />\r\n        <div className={classnames(\"core-message-box-content\", this.props.className)} style={this.props.style}>\r\n          {this.props.children}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}

package/lib/cjs/core-react/tree/Node.d.ts.map

@@ -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;gBAC9C,KAAK,EAAE,aAAa;IAIhB,MAAM;IA4EtB,OAAO,CAAC,wBAAwB;IAMhC,OAAO,CAAC,iBAAiB,CAGvB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,uBAAuB,CAI7B;IAEF,OAAO,CAAC,QAAQ,CAId;CACH"}
+{"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;gBAC9C,KAAK,EAAE,aAAa;IAIhB,MAAM;IA0EtB,OAAO,CAAC,wBAAwB;IAMhC,OAAO,CAAC,iBAAiB,CAGvB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,uBAAuB,CAI7B;IAEF,OAAO,CAAC,QAAQ,CAId;CACH"}

package/lib/cjs/core-react/tree/Node.js

@@ -48,8 +48,6 @@ class TreeNode extends React.Component {
         let offset = this.props.level * exports.LEVEL_OFFSET;
         if (!this.props.isLoading && this.props.isLeaf)
             offset += EXPANSION_TOGGLE_WIDTH; // Add expansion toggle/loader width if they're not rendered
-        const loader = this.props.isLoading ? (React.createElement("div", { className: "loader" },
-            React.createElement(itwinui_react_1.ProgressRadial, { size: "x-small", indeterminate: true }))) : undefined;
         let checkbox;
         if (this.props.checkboxProps) {
             const props = {
@@ -74,7 +72,7 @@ class TreeNode extends React.Component {
         // eslint-disable-next-line jsx-a11y/click-events-have-key-events
         React.createElement("div", { className: className, style: this.props.style, "data-testid": this.props["data-testid"], onClick: this._onClick, onContextMenu: this.props.onContextMenu, onMouseDown: this.props.onMouseDown, onMouseUp: this.props.onMouseUp, onMouseMove: this.props.onMouseMove, role: "treeitem", tabIndex: -1 },
             React.createElement("div", { className: "contents", style: { marginLeft: offset }, "data-testid": this.createSubComponentTestId("contents") },
-                loader,
+                this.props.isLoading && React.createElement(itwinui_react_1.ProgressRadial, { size: "x-small", indeterminate: true }),
                 toggle,
                 checkbox,
                 icon,

package/lib/cjs/core-react/tree/Node.js.map

@@ -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    const loader = this.props.isLoading ? (<div className=\"loader\"><ProgressRadial size=\"x-small\" indeterminate /></div>) : undefined;\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          {loader}\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"]}
+{"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"]}

package/lib/cjs/core-react/tree/Node.scss

@@ -26,8 +26,8 @@ $node-font-size: $iui-font-size;
     align-items: center;
     width: 100%;
 
-    > .loader {
-      margin: auto 4px;
+    > .iui-progress-indicator-radial {
+      margin: 0 4px;
     }
 
     > .expansion-toggle {
@@ -50,15 +50,22 @@ $node-font-size: $iui-font-size;
         line-height: unset;
       }
     }
+
+    > .core-image-checkbox {
+      top: -1px;
+    }
   }
 
   &-icon {
     width: 16px;
-    height: 24px;
-    display: inline-block;
-    box-sizing: border-box;
-    padding: 5px 0;
-    margin-right: 5px;
+    margin: 0 5px;
+
+    > .bui-webfont-icon {
+      display: inline-block;
+      width: 16px;
+      text-align: center;
+      vertical-align: middle;
+    }
   }
 
   &.is-focused, &:focus {

package/lib/esm/core-react/messagebox/MessageBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessageBox.d.ts","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageBox.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAE3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAEzE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,WAAW;IAClD,6BAA6B;IAC7B,QAAQ,EAAE,eAAe,CAAC;IAC1B,oCAAoC;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,2FAA2F;IAC3F,aAAa,EAAE,eAAe,EAAE,CAAC;IACjC,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC7B,4CAA4C;IAC5C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,wDAAwD;IACxD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uCAAuC;IACvC,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACpC;AAED;;GAEG;AACH,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC;IAClE,OAAc,YAAY,EAAE,OAAO,CAAC,eAAe,CAAC,CAKlD;IAEc,MAAM,IAAI,GAAG,CAAC,OAAO;CAkBtC;AAED;;GAEG;AACH,MAAM,WAAW,qBAAsB,SAAQ,WAAW;IACxD,QAAQ,EAAE,eAAe,CAAC;CAC3B;AAED;;GAEG;AACH,qBAAa,gBAAiB,SAAQ,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC;WAChE,gBAAgB,CAAC,QAAQ,EAAE,eAAe,EAAE,MAAM,CAAC,EAAE,OAAO,GAAG,MAAM;IA2BnE,MAAM,IAAI,GAAG,CAAC,OAAO;CAgBtC"}
+{"version":3,"file":"MessageBox.d.ts","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageBox.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAE3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAEzE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,WAAW;IAClD,6BAA6B;IAC7B,QAAQ,EAAE,eAAe,CAAC;IAC1B,oCAAoC;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,2FAA2F;IAC3F,aAAa,EAAE,eAAe,EAAE,CAAC;IACjC,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC7B,4CAA4C;IAC5C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,wDAAwD;IACxD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uCAAuC;IACvC,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACpC;AAED;;GAEG;AACH,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC;IAClE,OAAc,YAAY,EAAE,OAAO,CAAC,eAAe,CAAC,CAKlD;IAEc,MAAM,IAAI,GAAG,CAAC,OAAO;CAkBtC;AAED;;GAEG;AACH,MAAM,WAAW,qBAAsB,SAAQ,WAAW;IACxD,QAAQ,EAAE,eAAe,CAAC;CAC3B;AAED;;GAEG;AACH,qBAAa,gBAAiB,SAAQ,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC;WAChE,gBAAgB,CAAC,QAAQ,EAAE,eAAe,EAAE,MAAM,CAAC,EAAE,OAAO,GAAG,MAAM;IA8BnE,MAAM,IAAI,GAAG,CAAC,OAAO;CAgBtC"}

package/lib/esm/core-react/messagebox/MessageBox.js

@@ -33,6 +33,9 @@ export class MessageContainer extends React.PureComponent {
         let iconClassName = "";
         switch (severity) {
             case MessageSeverity.None:
+                iconClassName = " ";
+                break;
+            case MessageSeverity.Success:
                 iconClassName = hollow ? "icon-status-success-hollow" : "icon-status-success" + " core-message-box-success";
                 break;
             case MessageSeverity.Information:

package/lib/esm/core-react/messagebox/MessageBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessageBox.js","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageBox.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAC3B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAmB,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAyC1C;;GAEG;AACH,MAAM,OAAO,UAAW,SAAQ,KAAK,CAAC,aAA8B;IAQlD,MAAM;QACpB,OAAO,CACL,oBAAC,MAAM,IACL,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,aAAa,EACvC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,EACzB,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAC3B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC/B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YACvB,oBAAC,gBAAgB,IAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,IACpH,IAAI,CAAC,KAAK,CAAC,QAAQ,CACH,CACZ,CACV,CAAC;IACJ,CAAC;;AAxBa,uBAAY,GAA6B;IACrD,QAAQ,EAAE,GAAG;IACb,SAAS,EAAE,GAAG;IACd,KAAK,EAAE,OAAO;IACd,KAAK,EAAE,IAAI;CACZ,CAAC;AA6BJ;;GAEG;AACH,MAAM,OAAO,gBAAiB,SAAQ,KAAK,CAAC,aAAoC;IACvE,MAAM,CAAC,gBAAgB,CAAC,QAAyB,EAAE,MAAgB;QACxE,IAAI,aAAa,GAAG,EAAE,CAAC;QAEvB,QAAQ,QAAQ,EAAE;YAChB,KAAK,eAAe,CAAC,IAAI;gBACvB,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,4BAA4B,CAAC,CAAC,CAAC,qBAAqB,GAAG,2BAA2B,CAAC;gBAC5G,MAAM;YACR,KAAK,eAAe,CAAC,WAAW;gBAC9B,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,WAAW,GAAG,+BAA+B,CAAC;gBAC5F,MAAM;YACR,KAAK,eAAe,CAAC,QAAQ;gBAC3B,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,WAAW,GAAG,4BAA4B,CAAC;gBACzF,MAAM;YACR,KAAK,eAAe,CAAC,OAAO;gBAC1B,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,GAAG,2BAA2B,CAAC,CAAE,8CAA8C;gBACrJ,MAAM;YACR,KAAK,eAAe,CAAC,KAAK;gBACxB,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,mBAAmB,GAAG,yBAAyB,CAAC;gBACtG,MAAM;YACR,KAAK,eAAe,CAAC,KAAK;gBACxB,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,sBAAsB,GAAG,yBAAyB,CAAC;gBACrG,MAAM;SACT;QAED,OAAO,aAAa,CAAC;IACvB,CAAC;IAEe,MAAM;QACpB,MAAM,aAAa,GAAG,UAAU,CAC9B,MAAM,EACN,uBAAuB,EACvB,gBAAgB,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CACvD,CAAC;QAEF,OAAO,CACL,6BAAK,SAAS,EAAC,4BAA4B;YACzC,6BAAK,SAAS,EAAE,aAAa,GAAI;YACjC,6BAAK,SAAS,EAAE,UAAU,CAAC,0BAA0B,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IAClG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAChB,CACF,CACP,CAAC;IACJ,CAAC;CACF","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 Dialog\r\n */\r\n\r\nimport \"./MessageBox.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { DialogButtonDef, MessageSeverity } from \"@itwin/appui-abstract\";\r\nimport { Dialog } from \"../dialog/Dialog\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties for the [[MessageBox]] component\r\n * @public\r\n */\r\nexport interface MessageBoxProps extends CommonProps {\r\n  /** Severity of MessageBox */\r\n  severity: MessageSeverity;\r\n  /** whether to show dialog or not */\r\n  opened: boolean;\r\n  /** List of [[DialogButtonDef]] objects specifying buttons and associated onClick events */\r\n  buttonCluster: DialogButtonDef[];\r\n  /** Title to show in title bar of dialog  */\r\n  title?: string | JSX.Element;\r\n  /** onClick event for X button for dialog */\r\n  onClose?: () => void;\r\n  /** 'keyup' event for <Esc> key */\r\n  onEscape?: () => void;\r\n  /** minimum width that the dialog may be resized to. Default: 400 */\r\n  minWidth?: number;\r\n  /** minimum height that the dialog may be resized to. Default: 400 */\r\n  minHeight?: number;\r\n  /** initial width of dialog.\r\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\r\n   * Default: \"50%\"\r\n   */\r\n  width?: string | number;\r\n  /** initial height of dialog.\r\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\r\n   * Default: \"\"\r\n   */\r\n  height?: string | number;\r\n  /** Whether to show background overlay. Default: true */\r\n  modal?: boolean;\r\n  /** Custom CSS class name for the content */\r\n  contentClassName?: string;\r\n  /** Custom CSS Style for the content */\r\n  contentStyle?: React.CSSProperties;\r\n}\r\n\r\n/** Message Box React component.\r\n * @public\r\n */\r\nexport class MessageBox extends React.PureComponent<MessageBoxProps> {\r\n  public static defaultProps: Partial<MessageBoxProps> = {\r\n    minWidth: 400,\r\n    minHeight: 400,\r\n    width: \"512px\",\r\n    modal: true,\r\n  };\r\n\r\n  public override render(): JSX.Element {\r\n    return (\r\n      <Dialog\r\n        title={this.props.title}\r\n        buttonCluster={this.props.buttonCluster}\r\n        opened={this.props.opened}\r\n        width={this.props.width}\r\n        onClose={this.props.onClose}\r\n        onEscape={this.props.onEscape}\r\n        modal={this.props.modal}\r\n        className={this.props.className}\r\n        style={this.props.style} >\r\n        <MessageContainer severity={this.props.severity} className={this.props.contentClassName} style={this.props.contentStyle}>\r\n          {this.props.children}\r\n        </MessageContainer>\r\n      </Dialog>\r\n    );\r\n  }\r\n}\r\n\r\n/** Properties for the [[MessageContainer]] component\r\n * @public\r\n */\r\nexport interface MessageContainerProps extends CommonProps {\r\n  severity: MessageSeverity;\r\n}\r\n\r\n/** Message Container React component.\r\n * @public\r\n */\r\nexport class MessageContainer extends React.PureComponent<MessageContainerProps> {\r\n  public static getIconClassName(severity: MessageSeverity, hollow?: boolean): string {\r\n    let iconClassName = \"\";\r\n\r\n    switch (severity) {\r\n      case MessageSeverity.None:\r\n        iconClassName = hollow ? \"icon-status-success-hollow\" : \"icon-status-success\" + \" core-message-box-success\";\r\n        break;\r\n      case MessageSeverity.Information:\r\n        iconClassName = hollow ? \"icon-info-hollow\" : \"icon-info\" + \" core-message-box-information\";\r\n        break;\r\n      case MessageSeverity.Question:\r\n        iconClassName = hollow ? \"icon-help-hollow\" : \"icon-help\" + \" core-message-box-question\";\r\n        break;\r\n      case MessageSeverity.Warning:\r\n        iconClassName = hollow ? \"icon-status-warning\" : \"icon-status-warning\" + \" core-message-box-warning\";  // TODO - need icon-status-warning-hollow icon\r\n        break;\r\n      case MessageSeverity.Error:\r\n        iconClassName = hollow ? \"icon-status-error-hollow\" : \"icon-status-error\" + \" core-message-box-error\";\r\n        break;\r\n      case MessageSeverity.Fatal:\r\n        iconClassName = hollow ? \"icon-status-rejected\" : \"icon-status-rejected\" + \" core-message-box-fatal\";\r\n        break;\r\n    }\r\n\r\n    return iconClassName;\r\n  }\r\n\r\n  public override render(): JSX.Element {\r\n    const iconClassName = classnames(\r\n      \"icon\",\r\n      \"core-message-box-icon\",\r\n      MessageContainer.getIconClassName(this.props.severity),\r\n    );\r\n\r\n    return (\r\n      <div className=\"core-message-box-container\">\r\n        <div className={iconClassName} />\r\n        <div className={classnames(\"core-message-box-content\", this.props.className)} style={this.props.style}>\r\n          {this.props.children}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"MessageBox.js","sourceRoot":"","sources":["../../../../src/core-react/messagebox/MessageBox.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 Dialog\r\n */\r\n\r\nimport \"./MessageBox.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { DialogButtonDef, MessageSeverity } from \"@itwin/appui-abstract\";\r\nimport { Dialog } from \"../dialog/Dialog\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties for the [[MessageBox]] component\r\n * @public\r\n */\r\nexport interface MessageBoxProps extends CommonProps {\r\n  /** Severity of MessageBox */\r\n  severity: MessageSeverity;\r\n  /** whether to show dialog or not */\r\n  opened: boolean;\r\n  /** List of [[DialogButtonDef]] objects specifying buttons and associated onClick events */\r\n  buttonCluster: DialogButtonDef[];\r\n  /** Title to show in title bar of dialog  */\r\n  title?: string | JSX.Element;\r\n  /** onClick event for X button for dialog */\r\n  onClose?: () => void;\r\n  /** 'keyup' event for <Esc> key */\r\n  onEscape?: () => void;\r\n  /** minimum width that the dialog may be resized to. Default: 400 */\r\n  minWidth?: number;\r\n  /** minimum height that the dialog may be resized to. Default: 400 */\r\n  minHeight?: number;\r\n  /** initial width of dialog.\r\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\r\n   * Default: \"50%\"\r\n   */\r\n  width?: string | number;\r\n  /** initial height of dialog.\r\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\r\n   * Default: \"\"\r\n   */\r\n  height?: string | number;\r\n  /** Whether to show background overlay. Default: true */\r\n  modal?: boolean;\r\n  /** Custom CSS class name for the content */\r\n  contentClassName?: string;\r\n  /** Custom CSS Style for the content */\r\n  contentStyle?: React.CSSProperties;\r\n}\r\n\r\n/** Message Box React component.\r\n * @public\r\n */\r\nexport class MessageBox extends React.PureComponent<MessageBoxProps> {\r\n  public static defaultProps: Partial<MessageBoxProps> = {\r\n    minWidth: 400,\r\n    minHeight: 400,\r\n    width: \"512px\",\r\n    modal: true,\r\n  };\r\n\r\n  public override render(): JSX.Element {\r\n    return (\r\n      <Dialog\r\n        title={this.props.title}\r\n        buttonCluster={this.props.buttonCluster}\r\n        opened={this.props.opened}\r\n        width={this.props.width}\r\n        onClose={this.props.onClose}\r\n        onEscape={this.props.onEscape}\r\n        modal={this.props.modal}\r\n        className={this.props.className}\r\n        style={this.props.style} >\r\n        <MessageContainer severity={this.props.severity} className={this.props.contentClassName} style={this.props.contentStyle}>\r\n          {this.props.children}\r\n        </MessageContainer>\r\n      </Dialog>\r\n    );\r\n  }\r\n}\r\n\r\n/** Properties for the [[MessageContainer]] component\r\n * @public\r\n */\r\nexport interface MessageContainerProps extends CommonProps {\r\n  severity: MessageSeverity;\r\n}\r\n\r\n/** Message Container React component.\r\n * @public\r\n */\r\nexport class MessageContainer extends React.PureComponent<MessageContainerProps> {\r\n  public static getIconClassName(severity: MessageSeverity, hollow?: boolean): string {\r\n    let iconClassName = \"\";\r\n\r\n    switch (severity) {\r\n      case MessageSeverity.None:\r\n        iconClassName = \" \";\r\n        break;\r\n      case MessageSeverity.Success:\r\n        iconClassName = hollow ? \"icon-status-success-hollow\" : \"icon-status-success\" + \" core-message-box-success\";\r\n        break;\r\n      case MessageSeverity.Information:\r\n        iconClassName = hollow ? \"icon-info-hollow\" : \"icon-info\" + \" core-message-box-information\";\r\n        break;\r\n      case MessageSeverity.Question:\r\n        iconClassName = hollow ? \"icon-help-hollow\" : \"icon-help\" + \" core-message-box-question\";\r\n        break;\r\n      case MessageSeverity.Warning:\r\n        iconClassName = hollow ? \"icon-status-warning\" : \"icon-status-warning\" + \" core-message-box-warning\";  // TODO - need icon-status-warning-hollow icon\r\n        break;\r\n      case MessageSeverity.Error:\r\n        iconClassName = hollow ? \"icon-status-error-hollow\" : \"icon-status-error\" + \" core-message-box-error\";\r\n        break;\r\n      case MessageSeverity.Fatal:\r\n        iconClassName = hollow ? \"icon-status-rejected\" : \"icon-status-rejected\" + \" core-message-box-fatal\";\r\n        break;\r\n    }\r\n\r\n    return iconClassName;\r\n  }\r\n\r\n  public override render(): JSX.Element {\r\n    const iconClassName = classnames(\r\n      \"icon\",\r\n      \"core-message-box-icon\",\r\n      MessageContainer.getIconClassName(this.props.severity),\r\n    );\r\n\r\n    return (\r\n      <div className=\"core-message-box-container\">\r\n        <div className={iconClassName} />\r\n        <div className={classnames(\"core-message-box-content\", this.props.className)} style={this.props.style}>\r\n          {this.props.children}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}

package/lib/esm/core-react/tree/Node.d.ts.map

@@ -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;gBAC9C,KAAK,EAAE,aAAa;IAIhB,MAAM;IA4EtB,OAAO,CAAC,wBAAwB;IAMhC,OAAO,CAAC,iBAAiB,CAGvB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,uBAAuB,CAI7B;IAEF,OAAO,CAAC,QAAQ,CAId;CACH"}
+{"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;gBAC9C,KAAK,EAAE,aAAa;IAIhB,MAAM;IA0EtB,OAAO,CAAC,wBAAwB;IAMhC,OAAO,CAAC,iBAAiB,CAGvB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,uBAAuB,CAI7B;IAEF,OAAO,CAAC,QAAQ,CAId;CACH"}

package/lib/esm/core-react/tree/Node.js

@@ -45,8 +45,6 @@ export class TreeNode extends React.Component {
         let offset = this.props.level * LEVEL_OFFSET;
         if (!this.props.isLoading && this.props.isLeaf)
             offset += EXPANSION_TOGGLE_WIDTH; // Add expansion toggle/loader width if they're not rendered
-        const loader = this.props.isLoading ? (React.createElement("div", { className: "loader" },
-            React.createElement(ProgressRadial, { size: "x-small", indeterminate: true }))) : undefined;
         let checkbox;
         if (this.props.checkboxProps) {
             const props = {
@@ -71,7 +69,7 @@ export class TreeNode extends React.Component {
         // eslint-disable-next-line jsx-a11y/click-events-have-key-events
         React.createElement("div", { className: className, style: this.props.style, "data-testid": this.props["data-testid"], onClick: this._onClick, onContextMenu: this.props.onContextMenu, onMouseDown: this.props.onMouseDown, onMouseUp: this.props.onMouseUp, onMouseMove: this.props.onMouseMove, role: "treeitem", tabIndex: -1 },
             React.createElement("div", { className: "contents", style: { marginLeft: offset }, "data-testid": this.createSubComponentTestId("contents") },
-                loader,
+                this.props.isLoading && React.createElement(ProgressRadial, { size: "x-small", indeterminate: true }),
                 toggle,
                 checkbox,
                 icon,

package/lib/esm/core-react/tree/Node.js.map

@@ -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    const loader = this.props.isLoading ? (<div className=\"loader\"><ProgressRadial size=\"x-small\" indeterminate /></div>) : undefined;\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          {loader}\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"]}
+{"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"]}

package/lib/esm/core-react/tree/Node.scss

@@ -26,8 +26,8 @@ $node-font-size: $iui-font-size;
     align-items: center;
     width: 100%;
 
-    > .loader {
-      margin: auto 4px;
+    > .iui-progress-indicator-radial {
+      margin: 0 4px;
     }
 
     > .expansion-toggle {
@@ -50,15 +50,22 @@ $node-font-size: $iui-font-size;
         line-height: unset;
       }
     }
+
+    > .core-image-checkbox {
+      top: -1px;
+    }
   }
 
   &-icon {
     width: 16px;
-    height: 24px;
-    display: inline-block;
-    box-sizing: border-box;
-    padding: 5px 0;
-    margin-right: 5px;
+    margin: 0 5px;
+
+    > .bui-webfont-icon {
+      display: inline-block;
+      width: 16px;
+      text-align: center;
+      vertical-align: middle;
+    }
   }
 
   &.is-focused, &:focus {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itwin/core-react",
-  "version": "3.0.0-dev.181",
+  "version": "3.0.0-dev.182",
   "description": "iTwin.js UI core components",
   "main": "lib/cjs/core-react.js",
   "module": "lib/esm/core-react.js",
@@ -23,8 +23,8 @@
     "url": "http://www.bentley.com"
   },
   "peerDependencies": {
-    "@itwin/appui-abstract": "^3.0.0-dev.181",
-    "@itwin/core-bentley": "^3.0.0-dev.181",
+    "@itwin/appui-abstract": "^3.0.0-dev.182",
+    "@itwin/core-bentley": "^3.0.0-dev.182",
     "react": "^17.0.0",
     "react-dom": "^17.0.0"
   },
@@ -33,12 +33,12 @@
     "NOTE: All tools used by scripts in this package must be listed as devDependencies"
   ],
   "devDependencies": {
-    "@itwin/appui-abstract": "3.0.0-dev.181",
-    "@itwin/build-tools": "3.0.0-dev.181",
-    "@itwin/core-bentley": "3.0.0-dev.181",
-    "@itwin/core-common": "3.0.0-dev.181",
-    "@itwin/core-i18n": "3.0.0-dev.181",
-    "@itwin/eslint-plugin": "3.0.0-dev.181",
+    "@itwin/appui-abstract": "3.0.0-dev.182",
+    "@itwin/build-tools": "3.0.0-dev.182",
+    "@itwin/core-bentley": "3.0.0-dev.182",
+    "@itwin/core-common": "3.0.0-dev.182",
+    "@itwin/core-i18n": "3.0.0-dev.182",
+    "@itwin/eslint-plugin": "3.0.0-dev.182",
     "@testing-library/react": "^12.0.0",
     "@testing-library/react-hooks": "^7.0.2",
     "@testing-library/user-event": "^13.2.1",