Beacon Tooltip

Komponentti, joka sijoittaa majakan oppitunnille joko itsenäisesti tai liitettynä kohteeseen. Kun majakkaa liikutetaan tai klikataan, näytetään vihje.

Vaihtoehdot

• title | (string|node): työkaluvihjeen yläosassa näytettävä otsikko. Default: none.
• content | (string|node): työkaluvihjeen sisältö. Default: 'content comes here...'.
• event | string: jos asetus on click, työkaluvihko vaihtuu, kun majakkaa klikataan; jos asetus on hover, työkaluvihko aktivoituu leijuttamalla sitä.. Default: 'click'.
• placement | string: työkaluvihjeen sijainti suhteessa kohteeseen (joko top, top-alku, top-pääte, bottom, bottom-pääte, left, left-alku, left-pääte, right, right-alku, right-pääte, auto tai center).. Default: 'left'.
• target | string: luokan tai ID-valitsin elementille, johon työkaluvihje liitetään.. Default: ''.
• offset | number: työkaluvihjeen ja kohteen välinen etäisyys pikseleinä.. Default: 15.
• onChange | function: callback, joka käynnistetään työkaluvihkon tilan muuttuessa. Vastaanottaa kaksi argumenttia: action (open tai close) ja välitetyt props.. Default: onChange() {}.

Esimerkkejä

Live Editor

<BeaconTooltip content="Body of the tooltip..." title="Title comes here..." event="hover" placement="right" />

<BeaconTooltip
    content="Body of the tooltip..."
    title="Title comes here..."
    event="hover"
    placement="right"
/>

Tulos

ReferenceError: Provider is not defined