How to override tether-element classes

[anthonyLukes]

With the tether prop set to true I'm trying to override the default "tether-element" classes that get added to the tether drop-down. For my use case I need to conditionally add a css class to change the drop-down z-index when inside of react-modal. In my project I'm also using tether for tooltips and am able to do the following

<TetherComponent
    classes={{element: 'tether-element tether-element-in-modal'}}>
...
</TetherComponent>

I tried something similar but it doesn't appear to be changing the tether-element classes. (I tried tether-props as well as tetherProps)

<SimpleSelect
    tether
    tether-props={{classes: { element: 'tether-element tether-element-in-modal' }}}
    ... />

am I doing something wrong?

[Joyce-]

I ran into this issue as well. Is this a bug? tetherProps should go inside options.

From the source code in DropdownMenu

        return ReactTether((ref$ = import$({}, this.props.tetherProps), ref$.options = {
          attachment: "top left",
          targetAttachment: "bottom left",
          constraints: [{
            to: 'scrollParent'
          }],
        }, ref$), this.renderAnimatedDropdown({
          dynamicClassName: dynamicClassName
        }));