Tooltip & Dialog box
Source page in Figma: Tooltip, Dialog box · 10 component sets · 1 standalone components
Index: ../component-registry.md · Workflows: ../workflows.md
Component Sets (10)
Section titled “Component Sets (10)”| Name | Key | Variants | Properties |
|---|---|---|---|
| Dialog box/Blue outline | 257629e81b8d78274a25bf1b21ed00147da69b8e | 24 | Show arrow#9782:26=bool (default True)Slot#35374:98=SLOT Position= Top | Bottom | Left | Right (default Left)Arrow Alignment= Default | Top | Bottom | Left | Right (default Top)Width mode= Hug | Fill (default Hug) |
| Dialog box/Brand outline | b2de6dffb80a8c198142657d64e74270efdfb70f | 24 | Show arrow#9782:26=bool (default True)🔄 Content#22142:0=instance-swap Slot#35374:123=SLOT Position= Top | Bottom | Left | Right (default Left)Arrow Alignment= Default | Top | Bottom | Left | Right (default Top)Width mode= Hug | Fill (default Hug) |
| Dialog box/Primary | 98012ecaf82878cfde2f00c4b002e674e8d98e15 | 24 | Show arrow#9782:13=bool (default True)Border#18938:0=bool (default False)Slot#35376:197=SLOT Position= Bottom | Left | Right | Top (default Left)Arrow Alignment= Bottom | Center | Left | Right | Top (default Top)Width mode= Hug | Fill (default Hug) |
| Dialog box/Success | 8393c087b526254c8671590eb6bf8be6579b5d81 | 24 | Show arrow#9782:13=bool (default True)Border#18938:0=bool (default False)Slot#35376:197=SLOT Position= Bottom | Left | Right | Top (default Left)Arrow Alignment= Bottom | Center | Left | Right | Top (default Top)Width mode= Hug | Fill (default Hug) |
| Dialog content/Inverse bg - General | b8f84cfd4ae8d52034b174fdc806edd05a64bb67 | 3 | Title#18936:0=bool (default True)✏️ Title#18936:3=text ✏️ Content#18936:6=text Icon#18938:25=bool (default True)🔄 Icon#18938:29=instance-swap 👁️ Close button#26737:3=bool (default True)Layout= Text only | + Icon | + Button (default Text only) |
| Dialog content/Neutral - General | 83c433825546b6937dec0de14e05608bd412e7d9 | 3 | Title#18936:0=bool (default True)✏️ Title#18936:3=text ✏️ Content#18936:6=text Icon#18938:25=bool (default True)🔄 Icon#18938:29=instance-swap 👁️ Close button#26737:7=bool (default True)Layout= Text only | + Icon | + Button (default Text only) |
| Tooltip / Dark tooltip | 34c4d71450977d9922c9580a3e6fce28a72ccc0a | 48 | Show arrow#9782:13=bool (default True)Close icon#21271:0=bool (default False)Slot#35376:148=SLOT Position= Bottom | Left | Right | Top (default Left)Arrow Alignment= Bottom | Center | Left | Right | Top (default Top)Width mode= Hug | Fill (default Hug)Size= Medium | Small (default Medium) |
| Tooltip / Definition / Light - No arrow tooltip | 4d630ae1781df5fef6910b33cf6b831b43ea16a1 | 2 | Tooltip Sample#7820:0=instance-swap Border= No | Yes (default Yes) |
| Tooltip / Light - Border tooltip | 9c70d48bfe99bca59fba61c3d61806946b68db21 | 48 | Show arrow#9782:26=bool (default True)Close icon#21271:49=bool (default False)R icon#29056:0=bool (default False)🔄 R icon#29056:25=instance-swap Content#35373:49=SLOT Position= Top | Bottom | Left | Right (default Top)Arrow Alignment= Top | Bottom | Middle | Left | Right | Center (default Left)Width mode= Hug | Fill (default Hug)Size= Medium | Large (default Medium) |
| Tooltip content/Inverse bg - General | 7f47c874ea41086825172b09b7355753386ac8e4 | 2 | Title#18936:0=bool (default True)✏️ Main#18936:3=text ✏️ Sub#18936:6=text 👁️ Subtext#26737:0=bool (default True)Layout= Text only | w Icon (default Text only) |
Standalone Components (1)
Section titled “Standalone Components (1)”| Name | Key |
|---|---|
| Tooltip content/General | 17471c6a4434add40af6a88e2f2a6078bf3d92b3 |