How to use the @better-scroll/shared-utils.style.transform function in @better-scroll/shared-utils

it('should update position and size correctly when direction is horizontal', () => {
      // given

      indicatorOptions.direction = 'horizontal' as Direction
      indicator = new Indicator(bscroll, indicatorOptions)
      // when
      bscroll.trigger('refresh')
      // then
      expect(indicator.el.style.width).toBe('50px')
      expect(indicator.el.style[style.transform as any]).toBe('translateX(5px)')
    })

}
      const transformFnName = translaterMetaData[key][0]
      if (transformFnName) {
        const transformFnArgUnit = translaterMetaData[key][1]
        const transformFnArg = point[key]
        transformStyle.push(
          `${transformFnName}(${transformFnArg}${transformFnArgUnit})`
        )
      }
    })
    this.hooks.trigger(
      this.hooks.eventTypes.beforeTranslate,
      transformStyle,
      point
    )
    this.style[style.transform as any] = transformStyle.join(' ')
    this.hooks.trigger(this.hooks.eventTypes.translate, point)
  }

private rotateX(y: number) {
    const { rotate = 25 } = this.options
    for (let i = 0; i < this.items.length; i++) {
      let deg = rotate * (y / this.itemHeight + i)
      ;(this.items[i] as HTMLElement).style[
        style.transform as any
      ] = `rotateX(${deg}deg)`
    }
  }

private positionDom(
    list: Array,
    start: number,
    end: number
  ): { startPos: number; endPos: number } {
    const startPos = this.getStartPos(list, start)
    let pos = startPos
    for (let i = start; i < end; i++) {
      if (list[i].dom && list[i].pos !== pos) {
        list[i].dom.style[style.transform] = `translateY(${pos}px)`
        list[i].pos = pos
      }
      pos += list[i].height || DEFAULT_HEIGHT
    }

    return {
      startPos,
      endPos: pos
    }
  }