I'm trying to position a label (Text) above the a ...

# compose

[Travis Griggs]

I'm trying to position a label (Text) above the a Slider. I thought maybe I could do this with a ConstraintLayout, by creating a ref to the thumb (since M3 let's you customize and therefore modify the thumb) and then constraining my text to the thumbRef. But sadly, this did not work (the Text doesn't move at all):

ConstraintLayout(modifier = Modifier.fillMaxWidth().height(50.dp)) {
   var thumbRef = createRef()
   Text(text = recursLabel, modifier = Modifier.constrainAs(createRef()) {
      centerHorizontallyTo(thumbRef)
      bottom.linkTo(<http://thumbRef.top|thumbRef.top>, margin =  20.dp)
   })
   var interactionSource = remember { MutableInteractionSource() }
   Slider(
      value = recursPosition,
      onValueChange = { update -> recursPosition = update },
      interactionSource = interactionSource,
      steps = 6,
      onValueChangeFinished = { cue.recurs = recursValue },
      valueRange = 0f..7f,
      thumb = { state ->
         SliderDefaults.Thumb(interactionSource = interactionSource,
            modifier = Modifier.constrainAs(thumbRef) {}
         )
      }
   )
}

Is there a gotcha I missed above that is preventing this from working? Or am I just fundamentally barking up the wrong tree? (I had begun to do this with BoxWithConstraints and managing the offset, but that has its own issues/difficulties)