Ion-picker in React: modify options with ionPickerColChange

As a workaround you can mess with the DOM directly, the following Angular code shows only the one option in the second column when the first column value changes to 24.

    picker.addEventListener('ionPickerColChange', async (event: any) => {
      if (event.detail.name === "h") {
        if (event.detail.selectedIndex === 24) {
          this.showFirstOptionOnly(picker);
        } else if (this.onlyFirstOptionVisible) {
          this.showAllOptions(picker);
        }
      }
    });
    const promise = picker.present();
    promise.then(() => {
      const hourColumn = picker.columns[0];
      if (hourColumn.selectedIndex === 24) {
        this.showFirstOptionOnly(picker);
      }
    });

  private showFirstOptionOnly(picker: HTMLIonPickerElement) {
    this.onlyFirstOptionVisible = true;
    const minuteColumn = picker.columns[1];
    minuteColumn.prevSelected = minuteColumn.selectedIndex;
    minuteColumn.selectedIndex = 0;
    const optionElements = ModalPage.provideOptionElements(picker);
    for (let i = 1; i < optionElements.children.length; i++) {
      const htmlElement = optionElements.children[i] as HTMLElement;
      htmlElement.style.display = 'none';
    }
    const firstElement = optionElements.children[0] as HTMLElement;
    this.prevTransform = firstElement.style.transform;
    firstElement.style.transform = "rotateX(0deg) translate3d(0px,0px,90px)";
  }

  private showAllOptions(picker: HTMLIonPickerElement) {
    this.onlyFirstOptionVisible = false;
    const minuteColumn = picker.columns[1];
    minuteColumn.selectedIndex = minuteColumn.prevSelected;
    const optionElements = ModalPage.provideOptionElements(picker);
    for (let i = 1; i < optionElements.children.length; i++) {
      const htmlElement = optionElements.children[i] as HTMLElement;
      htmlElement.style.display = 'block';
    }
    if (this.prevTransform) {
      const firstElement = optionElements.children[0] as HTMLElement;
      firstElement.style.transform = this.prevTransform;
      this.prevTransform = null;
    }
  }

  private static provideOptionElements(picker: HTMLIonPickerElement) {
    return picker.children[2].children[1].children[2].children[0];
  }

You can adjust the code for your bespoke purposes.