How to use the @bentley/ui-core.CheckBoxState.On function in @bentley/ui-core

private checkBoxClicked(stateChanges: Array<{ node: TreeNodeItem, newState: CheckBoxState }>) {
    const changedNodes: PhotoFolder[] = [];
    for (const stateChange of stateChanges) {
      if (!(stateChange.node instanceof PhotoFolder))
        continue;
      const photoFolder: PhotoFolder = stateChange.node as PhotoFolder;
      photoFolder.visible = (stateChange.newState === CheckBoxState.On);
      changedNodes.push(photoFolder);
      // need all the subnodes, too.
      const subNodes = photoFolder.getSubFolders();
      for (const subNode of subNodes) {
        changedNodes.push(subNode);
      }
    }

    // raise the changed event.
    if (changedNodes.length > 0) {
      changedNodes[0].photoTree.onTreeNodeChanged.raiseEvent(changedNodes);
      this.props.dataProvider.markerVisibilityChange();
    }
  }

private onCheckboxStateChange = async (stateChanges: Array<{ node: TreeNodeItem, newState: CheckBoxState }>) => {
    // istanbul ignore next
    if (!this._visibilityHandler)
      return;

    for (const { node, newState } of stateChanges) {
      // tslint:disable-next-line: no-floating-promises
      this._visibilityHandler.changeVisibility(node, newState === CheckBoxState.On);
    }
  }

private async onCheckboxStateChange(
    stateChanges: Array<{
      node: TreeNodeItem;
      newState: CheckBoxState;
    }>,
  ) {
    const nodesToEnable: TreeNodeItem[] = [];
    const nodesToDisable: TreeNodeItem[] = [];
    for (const { node, newState } of stateChanges) {
      if (newState === CheckBoxState.On) {
        nodesToEnable.push(node);
      } else {
        nodesToDisable.push(node);
      }
    }

    if (nodesToEnable.length > 0) {
      this._manageNodesState(nodesToEnable, true); // tslint:disable-line:no-floating-promises
    }

    if (nodesToDisable.length > 0) {
      this._manageNodesState(nodesToDisable, false); // tslint:disable-line:no-floating-promises
    }
  }

parents.forEach((parent) => {
      parent.checkBoxState = CheckBoxState.On;
      parent.labelBold = true;
      nodeIds.push(parent.id);
      promises.push(this.state.treeInfo!.dataProvider.getNodes(parent));
    });
    this.state.treeInfo!.dataProvider.onTreeNodeChanged.raiseEvent(parents);

private updateNodeCheckboxInfo(node: BeInspireTreeNode, status: CheckBoxInfo) {
    let hasChanges = false;
    if (node.itree!.checkboxTooltip !== status.tooltip) {
      node.itree!.checkboxTooltip = status.tooltip;
      hasChanges = true;
    }
    if (node.itree!.state!.checkboxVisible !== status.isVisible) {
      node.itree!.state!.checkboxVisible = status.isVisible;
      hasChanges = true;
    }
    if (node.itree!.state!.checkboxDisabled !== status.isDisabled) {
      node.itree!.state!.checkboxDisabled = status.isDisabled;
      hasChanges = true;
    }
    if (status.state === CheckBoxState.On && !node.itree!.state!.checked) {
      node.check();
      hasChanges = true;
    } else if (status.state === CheckBoxState.Off && node.itree!.state!.checked) {
      node.uncheck();
      hasChanges = true;
    }
    if (hasChanges) {
      node.markDirty();
      this.applyChanges();
    }
  }

private getNodeCheckBoxInfo(
    node: TreeNodeItem,
  ): CheckBoxInfo | Promise {
    const key = this.state.activeGroup.dataProvider.getNodeKey(node);
    const nodeId = NodeKey.isInstanceNodeKey(key) ? key.instanceKey.id : "";
    const item = this._getItem(nodeId);
    if (item && this.props.activeView) {
      const view = this.props.activeView.view as SpatialViewState;
      let state = CheckBoxState.Off;
      const group = this.state.activeGroup.id;
      if (
        (group === Groups.Models && view.modelSelector.models.has(item.key)) ||
        (group === Groups.Categories &&
          view.categorySelector.categories.has(item.key))
      )
        state = CheckBoxState.On;
      return { isDisabled: false, isVisible: true, state };
    }
    return {};
  }