@designcrowd/fe-shared-lib 1.5.21 → 1.5.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (140) hide show
  1. package/dist/css/tailwind-brandCrowd.css +80 -3
  2. package/dist/css/tailwind-brandPage.css +76 -3
  3. package/dist/css/tailwind-crazyDomains.css +80 -3
  4. package/dist/css/tailwind-designCom.css +80 -3
  5. package/dist/css/tailwind-designCrowd.css +80 -3
  6. package/package.json +1 -1
  7. package/src/atoms/components/Icon/Icon.stories.js +2 -0
  8. package/src/atoms/components/Icon/Icon.vue +4 -0
  9. package/src/atoms/components/Icon/icons/digital-business-card-filled.vue +8 -0
  10. package/src/atoms/components/Icon/icons/link-in-bio-filled.vue +8 -0
  11. package/.storybook-static/assets/Auth-CV5AmoX8.css +0 -1
  12. package/.storybook-static/assets/Auth.stories-CX3sjxh5.js +0 -490
  13. package/.storybook-static/assets/AuthCrazyDomains.stories-Didj_VFa.js +0 -73
  14. package/.storybook-static/assets/Button-5UzSGUF6.css +0 -1
  15. package/.storybook-static/assets/Button-DtVlr_q3.js +0 -1
  16. package/.storybook-static/assets/ButtonGroup-Dfr7bNL2.css +0 -1
  17. package/.storybook-static/assets/ButtonGroup.stories-4EQk-ktb.js +0 -503
  18. package/.storybook-static/assets/ButtonPrimary-Bu6bXb_c.css +0 -1
  19. package/.storybook-static/assets/ButtonPrimary-DG9wNod9.js +0 -1
  20. package/.storybook-static/assets/Buttons.stories-B_KpeCzt.js +0 -761
  21. package/.storybook-static/assets/ButtonsCrazyDomains.stories-oZtahAmR.js +0 -199
  22. package/.storybook-static/assets/Checkbox.mixin-DkHpdvGa.js +0 -1
  23. package/.storybook-static/assets/Checkbox.stories-C67RL0ut.js +0 -203
  24. package/.storybook-static/assets/Checktile.stories-DN2wfzd6.js +0 -88
  25. package/.storybook-static/assets/CollapsiblePanel.stories-BkzrqfVG.js +0 -39
  26. package/.storybook-static/assets/ColorPicker.stories-85BQwpyF.js +0 -73
  27. package/.storybook-static/assets/CopyToClipboardText.stories-Csh5nVRs.js +0 -32
  28. package/.storybook-static/assets/Dropdown.stories-NNlxNopk.js +0 -159
  29. package/.storybook-static/assets/DropdownItem-CDX_V6Mi.js +0 -1
  30. package/.storybook-static/assets/DropdownItem-CLNmWtKh.css +0 -1
  31. package/.storybook-static/assets/FormControl.mixin-_gXRExB7.js +0 -1
  32. package/.storybook-static/assets/HashRouteModal.stories-Dy1_nLTJ.js +0 -64
  33. package/.storybook-static/assets/HelloBar-z54fob0q.js +0 -1
  34. package/.storybook-static/assets/HelloBar.stories-ClJ9_KRK.js +0 -342
  35. package/.storybook-static/assets/Icon-8mZGP41G.js +0 -144
  36. package/.storybook-static/assets/Icon.stories-BcXMvpuh.js +0 -126
  37. package/.storybook-static/assets/Icon.stories-D6ECVMta.js +0 -751
  38. package/.storybook-static/assets/Loader-D61Ki9P1.js +0 -1
  39. package/.storybook-static/assets/LogoBusinessBrandColours-B1_8hw0H.js +0 -1
  40. package/.storybook-static/assets/LogoBusinessBrandColours-DEFhAyxR.css +0 -1
  41. package/.storybook-static/assets/LogoBusinessBrandColours.stories-CIWe9ndn.js +0 -36
  42. package/.storybook-static/assets/Masonry-C2MNiGg0.css +0 -1
  43. package/.storybook-static/assets/Masonry.stories-CDT8kZCv.js +0 -71
  44. package/.storybook-static/assets/Modal-BQrpXSGA.js +0 -1
  45. package/.storybook-static/assets/Modal-BvVMN71n.css +0 -1
  46. package/.storybook-static/assets/Modal.stories-BycF7YL6.js +0 -345
  47. package/.storybook-static/assets/Notice.stories-BufkrC1b.js +0 -222
  48. package/.storybook-static/assets/NumberStepper-Blffv09R.css +0 -1
  49. package/.storybook-static/assets/NumberStepper.stories-6_y_lEgC.js +0 -64
  50. package/.storybook-static/assets/PaymentConfigList-wI1eTv5x.css +0 -1
  51. package/.storybook-static/assets/PaymentConfigList.stories-BlzzKrzz.js +0 -126
  52. package/.storybook-static/assets/Picture-Cq76CaoK.js +0 -1
  53. package/.storybook-static/assets/Picture.stories-BDqRm9_g.js +0 -119
  54. package/.storybook-static/assets/Pill-BsMeJhV9.js +0 -1
  55. package/.storybook-static/assets/Pill.stories-DUvzbtnS.js +0 -18
  56. package/.storybook-static/assets/PillBar-os4mJV3M.css +0 -1
  57. package/.storybook-static/assets/PillBar.stories-BUMLXBij.js +0 -41
  58. package/.storybook-static/assets/Price-DKOwLeD0.js +0 -1
  59. package/.storybook-static/assets/Price.stories-DlqrNUWI.js +0 -221
  60. package/.storybook-static/assets/PublishBrandPageModal-CLU8-If3.css +0 -1
  61. package/.storybook-static/assets/PublishBrandPageModal.stories-Dqobvq-n.js +0 -273
  62. package/.storybook-static/assets/SearchBar.stories-_wPX3-Rl.js +0 -12
  63. package/.storybook-static/assets/Select-Dw-zvSUg.css +0 -1
  64. package/.storybook-static/assets/Select.stories-BWINGxdY.js +0 -108
  65. package/.storybook-static/assets/SellDomainNameList.fixtures-LC6fjr_b.js +0 -1
  66. package/.storybook-static/assets/SellDomainNameListModal-ByK_ak0A.js +0 -1
  67. package/.storybook-static/assets/SellDomainNameListModal-CdfyEX1a.css +0 -1
  68. package/.storybook-static/assets/SellDomainNameListModal.stories-DrL8w2AY.js +0 -71
  69. package/.storybook-static/assets/SellDomainNameListSearchResult-1WuAKfzI.css +0 -1
  70. package/.storybook-static/assets/SellDomainNameListSearchResult-By0IpIM_.js +0 -1
  71. package/.storybook-static/assets/SellDomainNameSearchWithResults-BttjI4PH.js +0 -1
  72. package/.storybook-static/assets/SellDomainNameSearchWithResults.stories-Dm1Q8Cza.js +0 -37
  73. package/.storybook-static/assets/SellDomainNameWidget.stories-CKoz3WnZ.js +0 -36
  74. package/.storybook-static/assets/SignIn-DNYeJu86.css +0 -1
  75. package/.storybook-static/assets/SignIn-Dt8OJr0J.js +0 -1
  76. package/.storybook-static/assets/Slider-Cog2FFdj.css +0 -1
  77. package/.storybook-static/assets/Slider.stories-08DN2SFB.js +0 -141
  78. package/.storybook-static/assets/StarRating-BtKh7pzm.css +0 -1
  79. package/.storybook-static/assets/StarRating.stories-BEIj9ufA.js +0 -45
  80. package/.storybook-static/assets/TabMenu.stories-D9f0pyZI.js +0 -47
  81. package/.storybook-static/assets/TextCopyField-B04vTGbG.js +0 -1
  82. package/.storybook-static/assets/TextCopyField.stories-KD0WUWzA.js +0 -47
  83. package/.storybook-static/assets/TextInput-JK1M0hv6.js +0 -1
  84. package/.storybook-static/assets/TextInput.stories-BO0eQqBY.js +0 -233
  85. package/.storybook-static/assets/Textarea.stories-Bcn4sCkV.js +0 -207
  86. package/.storybook-static/assets/Toggle.stories-CuTFLoNh.js +0 -161
  87. package/.storybook-static/assets/Tooltip-DcSbUh5f.js +0 -1
  88. package/.storybook-static/assets/Tooltip-DyXIgFQH.css +0 -1
  89. package/.storybook-static/assets/Tooltip.stories-B0I_PBGG.js +0 -953
  90. package/.storybook-static/assets/UploadYourLogoApplication-EyTEQx-x.css +0 -9
  91. package/.storybook-static/assets/UploadYourLogoApplication.stories-Dixp1ynI.js +0 -194
  92. package/.storybook-static/assets/UploadYourLogoDropzone-DQqACf-e.css +0 -1
  93. package/.storybook-static/assets/UploadYourLogoDropzone-DouZtNvi.js +0 -24
  94. package/.storybook-static/assets/UploadYourLogoDropzone.stories-BHYeu4gz.js +0 -55
  95. package/.storybook-static/assets/UploadedLogoSearchResultCard.stories-D1KR63O4.js +0 -79
  96. package/.storybook-static/assets/_commonjsHelpers-D6-XlEtG.js +0 -1
  97. package/.storybook-static/assets/_plugin-vue_export-helper-DlAUqK2U.js +0 -1
  98. package/.storybook-static/assets/api-lSJGRrF2.js +0 -1
  99. package/.storybook-static/assets/axe-nGVJxRof.js +0 -30
  100. package/.storybook-static/assets/brand-crowd-api.client-DiPM1Wo-.js +0 -1
  101. package/.storybook-static/assets/bundled-translations-BZ57czTo.js +0 -1
  102. package/.storybook-static/assets/bundled-translations.de-DE-DXggTXB2.js +0 -1
  103. package/.storybook-static/assets/bundled-translations.es-ES-DtMmvicd.js +0 -1
  104. package/.storybook-static/assets/bundled-translations.fr-FR-BrQqbieG.js +0 -1
  105. package/.storybook-static/assets/bundled-translations.pt-PT-CpiWEAtr.js +0 -1
  106. package/.storybook-static/assets/carousel-CMMZ5MZ-.css +0 -1
  107. package/.storybook-static/assets/carousel.stories-o3eu2Qyc.js +0 -374
  108. package/.storybook-static/assets/event-constants-CMO9VQVu.js +0 -1
  109. package/.storybook-static/assets/iframe-C86bI_2U.js +0 -1126
  110. package/.storybook-static/assets/index-Bw-gCGc_.js +0 -6
  111. package/.storybook-static/assets/index-DhkYCT1V.js +0 -29
  112. package/.storybook-static/assets/matchers-7Z3WT2CE-T3xScrR7.js +0 -14
  113. package/.storybook-static/assets/tracking-ATsLLehC.js +0 -1
  114. package/.storybook-static/css/tailwind-brandCrowd.css +0 -2404
  115. package/.storybook-static/css/tailwind-brandPage.css +0 -2088
  116. package/.storybook-static/css/tailwind-crazyDomains.css +0 -2404
  117. package/.storybook-static/css/tailwind-designCom.css +0 -2404
  118. package/.storybook-static/css/tailwind-designCrowd.css +0 -2404
  119. package/.storybook-static/favicon.svg +0 -1
  120. package/.storybook-static/iframe.html +0 -694
  121. package/.storybook-static/index.html +0 -156
  122. package/.storybook-static/index.json +0 -1
  123. package/.storybook-static/nunito-sans-bold-italic.woff2 +0 -0
  124. package/.storybook-static/nunito-sans-bold.woff2 +0 -0
  125. package/.storybook-static/nunito-sans-italic.woff2 +0 -0
  126. package/.storybook-static/nunito-sans-regular.woff2 +0 -0
  127. package/.storybook-static/project.json +0 -1
  128. package/.storybook-static/sb-addons/a11y-1/manager-bundle.js +0 -5
  129. package/.storybook-static/sb-addons/links-2/manager-bundle.js +0 -3
  130. package/.storybook-static/sb-addons/storybook-core-server-presets-0/common-manager-bundle.js +0 -188
  131. package/.storybook-static/sb-addons/themes-3/manager-bundle.js +0 -3
  132. package/.storybook-static/sb-common-assets/favicon.svg +0 -1
  133. package/.storybook-static/sb-common-assets/nunito-sans-bold-italic.woff2 +0 -0
  134. package/.storybook-static/sb-common-assets/nunito-sans-bold.woff2 +0 -0
  135. package/.storybook-static/sb-common-assets/nunito-sans-italic.woff2 +0 -0
  136. package/.storybook-static/sb-common-assets/nunito-sans-regular.woff2 +0 -0
  137. package/.storybook-static/sb-manager/globals-module-info.js +0 -797
  138. package/.storybook-static/sb-manager/globals-runtime.js +0 -72062
  139. package/.storybook-static/sb-manager/globals.js +0 -34
  140. package/.storybook-static/sb-manager/runtime.js +0 -13002
package/.storybook-static/assets/Tooltip.stories-B0I_PBGG.js DELETED
@@ -1,953 +0,0 @@
1
- import{T as n}from"./Tooltip-DcSbUh5f.js";import"./Icon-8mZGP41G.js";import"./iframe-C86bI_2U.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const u={title:"Components/Tooltip",component:n},t=()=>({components:{Tooltip:n},template:`
2
- <table class="tw-w-full">
3
- <thead>
4
- <tr>
5
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans">Tooltip</th>
6
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans">Code</th>
7
- </tr>
8
- </thead>
9
- <tbody>
10
- <tr>
11
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans" colspan="2">Directions</th>
12
- </tr>
13
- <tr class="tw-bg-grayscale-200">
14
- <td class="tw-text-center tw-p-4">
15
- <Tooltip direction="bottom">
16
- <template v-slot:open>I am a tooltip on the bottom!</template>
17
- <template v-slot:content>
18
- I am some slot content!
19
- <br><br>
20
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
21
- <br><br>
22
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
23
- </template>
24
- </Tooltip>
25
- </td>
26
- <td class="tw-p-4">
27
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
28
- &lt;Tooltip direction="bottom"/&gt;
29
- ...
30
- &lt;Tooltip/&gt;
31
- </code>
32
- </td>
33
- </tr>
34
- <tr class="tw-bg-grayscale-200">
35
- <td class="tw-p-4">
36
- <Tooltip direction="right">
37
- <template v-slot:open>I am a tooltip on the right!</template>
38
- <template v-slot:content>
39
- I am some slot content!
40
- <br><br>
41
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
42
- <br><br>
43
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
44
- </template>
45
- </Tooltip>
46
- </td>
47
- <td class="tw-p-4">
48
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
49
- &lt;Tooltip direction="right"/&gt;
50
- ...
51
- &lt;Tooltip/&gt;
52
- </code>
53
- </td>
54
- </tr>
55
- <tr class="tw-bg-grayscale-200">
56
- <td class="tw-text-right tw-p-4">
57
- <Tooltip direction="left">
58
- <template v-slot:open>I am a tooltip on the left!</template>
59
- <template v-slot:content>
60
- I am some slot content!
61
- <br><br>
62
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
63
- <br><br>
64
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
65
- </template>
66
- </Tooltip>
67
- </td>
68
- <td class="tw-p-4">
69
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
70
- &lt;Tooltip direction="left"/&gt;
71
- ...
72
- &lt;Tooltip/&gt;
73
- </code>
74
- </td>
75
- </tr>
76
- <tr class="tw-bg-grayscale-200">
77
- <td class="tw-text-center tw-p-4">
78
- <Tooltip direction="top">
79
- <template v-slot:open>I am a tooltip on the top!</template>
80
- <template v-slot:content>
81
- I am some slot content!
82
- <br><br>
83
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
84
- <br><br>
85
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
86
- </template>
87
- </Tooltip>
88
- </td>
89
- <td class="tw-p-4">
90
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
91
- &lt;Tooltip direction="top"/&gt;
92
- ...
93
- &lt;Tooltip/&gt;
94
- </code>
95
- </td>
96
- </tr>
97
- <tr>
98
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans" colspan="2">Alignments</th>
99
- </tr>
100
- <tr class="tw-bg-grayscale-200">
101
- <td class="tw-text-center tw-p-4">
102
- <Tooltip direction="bottom" alignment="left">
103
- <template v-slot:open>I am a tooltip on the bottom, aligned to the left!</template>
104
- <template v-slot:content>
105
- I am some slot content!
106
- <br><br>
107
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
108
- <br><br>
109
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
110
- </template>
111
- </Tooltip>
112
- </td>
113
- <td class="tw-p-4">
114
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
115
- &lt;Tooltip direction="bottom" alignment="left"/&gt;
116
- ...
117
- &lt;Tooltip/&gt;
118
- </code>
119
- </td>
120
- </tr>
121
- <tr class="tw-bg-grayscale-200">
122
- <td class="tw-text-center tw-p-4">
123
- <Tooltip direction="bottom" alignment="right">
124
- <template v-slot:open>I am a tooltip on the bottom, aligned to the right!</template>
125
- <template v-slot:content>
126
- I am some slot content!
127
- <br><br>
128
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
129
- <br><br>
130
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
131
- </template>
132
- </Tooltip>
133
- </td>
134
- <td class="tw-p-4">
135
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
136
- &lt;Tooltip direction="bottom" alignment="right"/&gt;
137
- ...
138
- &lt;Tooltip/&gt;
139
- </code>
140
- </td>
141
- </tr>
142
- <tr class="tw-bg-grayscale-200">
143
- <td class="tw-text-center tw-p-4">
144
- <Tooltip direction="bottom" alignment="center">
145
- <template v-slot:open>I am a tooltip on the bottom, aligned to the center!</template>
146
- <template v-slot:content>
147
- I am some slot content!
148
- <br><br>
149
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
150
- <br><br>
151
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
152
- </template>
153
- </Tooltip>
154
- </td>
155
- <td class="tw-p-4">
156
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
157
- &lt;Tooltip direction="bottom" alignment="center"/&gt;
158
- ...
159
- &lt;Tooltip/&gt;
160
- </code>
161
- </td>
162
- </tr>
163
- <tr class="tw-bg-grayscale-200">
164
- <td class="tw-p-4">
165
- <Tooltip direction="right" alignment="top">
166
- <template v-slot:open>I am a tooltip on the right, aligned to the top!</template>
167
- <template v-slot:content>
168
- I am some slot content!
169
- <br><br>
170
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
171
- <br><br>
172
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
173
- </template>
174
- </Tooltip>
175
- </td>
176
- <td class="tw-p-4">
177
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
178
- &lt;Tooltip direction="right" alignment="top"/&gt;
179
- ...
180
- &lt;Tooltip/&gt;
181
- </code>
182
- </td>
183
- </tr>
184
- <tr class="tw-bg-grayscale-200">
185
- <td class="tw-p-4">
186
- <Tooltip direction="right" alignment="bottom">
187
- <template v-slot:open>I am a tooltip on the right, aligned to the bottom!</template>
188
- <template v-slot:content>
189
- I am some slot content!
190
- <br><br>
191
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
192
- <br><br>
193
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
194
- </template>
195
- </Tooltip>
196
- </td>
197
- <td class="tw-p-4">
198
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
199
- &lt;Tooltip direction="right" alignment="bottom"/&gt;
200
- ...
201
- &lt;Tooltip/&gt;
202
- </code>
203
- </td>
204
- </tr>
205
- <tr class="tw-bg-grayscale-200">
206
- <td class="tw-p-4">
207
- <Tooltip direction="right" alignment="middle">
208
- <template v-slot:open>I am a tooltip on the right, aligned to the middle!</template>
209
- <template v-slot:content>
210
- I am some slot content!
211
- <br><br>
212
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
213
- <br><br>
214
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
215
- </template>
216
- </Tooltip>
217
- </td>
218
- <td class="tw-p-4">
219
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
220
- &lt;Tooltip direction="right" alignment="middle"/&gt;
221
- ...
222
- &lt;Tooltip/&gt;
223
- </code>
224
- </td>
225
- </tr>
226
- <tr class="tw-bg-grayscale-200">
227
- <td class="tw-text-right tw-p-4">
228
- <Tooltip direction="left" alignment="top">
229
- <template v-slot:open>I am a tooltip on the left, aligned to the top!</template>
230
- <template v-slot:content>
231
- I am some slot content!
232
- <br><br>
233
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
234
- <br><br>
235
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
236
- </template>
237
- </Tooltip>
238
- </td>
239
- <td class="tw-p-4">
240
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
241
- &lt;Tooltip direction="left" alignment="top"/&gt;
242
- ...
243
- &lt;Tooltip/&gt;
244
- </code>
245
- </td>
246
- </tr>
247
- <tr class="tw-bg-grayscale-200">
248
- <td class="tw-text-right tw-p-4">
249
- <Tooltip direction="left" alignment="bottom">
250
- <template v-slot:open>I am a tooltip on the left, aligned to the bottom!</template>
251
- <template v-slot:content>
252
- I am some slot content!
253
- <br><br>
254
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
255
- <br><br>
256
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
257
- </template>
258
- </Tooltip>
259
- </td>
260
- <td class="tw-p-4">
261
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
262
- &lt;Tooltip direction="left" alignment="bottom"/&gt;
263
- ...
264
- &lt;Tooltip/&gt;
265
- </code>
266
- </td>
267
- </tr>
268
- <tr class="tw-bg-grayscale-200">
269
- <td class="tw-text-right tw-p-4">
270
- <Tooltip direction="left" alignment="middle">
271
- <template v-slot:open>I am a tooltip on the left, aligned to the middle!</template>
272
- <template v-slot:content>
273
- I am some slot content!
274
- <br><br>
275
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
276
- <br><br>
277
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
278
- </template>
279
- </Tooltip>
280
- </td>
281
- <td class="tw-p-4">
282
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
283
- &lt;Tooltip direction="left" alignment="middle"/&gt;
284
- ...
285
- &lt;Tooltip/&gt;
286
- </code>
287
- </td>
288
- </tr>
289
- <tr class="tw-bg-grayscale-200">
290
- <td class="tw-text-center tw-p-4">
291
- <Tooltip direction="top" alignment="left">
292
- <template v-slot:open>I am a tooltip on the top, aligned to the left!</template>
293
- <template v-slot:content>
294
- I am some slot content!
295
- <br><br>
296
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
297
- <br><br>
298
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
299
- </template>
300
- </Tooltip>
301
- </td>
302
- <td class="tw-p-4">
303
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
304
- &lt;Tooltip direction="top" alignment="left"/&gt;
305
- ...
306
- &lt;Tooltip/&gt;
307
- </code>
308
- </td>
309
- </tr>
310
- <tr class="tw-bg-grayscale-200">
311
- <td class="tw-text-center tw-p-4">
312
- <Tooltip direction="top" alignment="right">
313
- <template v-slot:open>I am a tooltip on the top, aligned to the right!</template>
314
- <template v-slot:content>
315
- I am some slot content!
316
- <br><br>
317
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
318
- <br><br>
319
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
320
- </template>
321
- </Tooltip>
322
- </td>
323
- <td class="tw-p-4">
324
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
325
- &lt;Tooltip direction="top" alignment="right"/&gt;
326
- ...
327
- &lt;Tooltip/&gt;
328
- </code>
329
- </td>
330
- </tr>
331
- <tr class="tw-bg-grayscale-200">
332
- <td class="tw-text-center tw-p-4">
333
- <Tooltip direction="top" alignment="center">
334
- <template v-slot:open>I am a tooltip on the top, aligned to the center!</template>
335
- <template v-slot:content>
336
- I am some slot content!
337
- <br><br>
338
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
339
- <br><br>
340
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
341
- </template>
342
- </Tooltip>
343
- </td>
344
- <td class="tw-p-4">
345
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
346
- &lt;Tooltip direction="top" alignment="center"/&gt;
347
- ...
348
- &lt;Tooltip/&gt;
349
- </code>
350
- </td>
351
- </tr>
352
- </tbody>
353
- </table>
354
- `}),e=()=>({components:{Tooltip:n},template:`
355
- <table class="tw-w-full">
356
- <thead>
357
- <tr>
358
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans">Tooltip</th>
359
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans">Code</th>
360
- </tr>
361
- </thead>
362
- <tbody>
363
- <tr class="tw-bg-grayscale-200">
364
- <td class="tw-p-4">
365
- <Tooltip color="info-500" direction="right">
366
- <template v-slot:open>I am an info tooltip!</template>
367
- <template v-slot:content>
368
- I am some slot content!
369
- <br><br>
370
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
371
- <br><br>
372
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
373
- </template>
374
- </Tooltip>
375
- </td>
376
- <td class="tw-p-4">
377
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
378
- &lt;Tooltip color="info-500" direction="right"/&gt;
379
- ...
380
- &lt;Tooltip/&gt;
381
- </code>
382
- </td>
383
- </tr>
384
- <tr class="tw-bg-grayscale-200">
385
- <td class="tw-p-4">
386
- <Tooltip color="secondary-500" direction="right">
387
- <template v-slot:open>I am an secondary tooltip!</template>
388
- <template v-slot:content>
389
- I am some slot content!
390
- <br><br>
391
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
392
- <br><br>
393
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
394
- </template>
395
- </Tooltip>
396
- </td>
397
- <td class="tw-p-4">
398
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
399
- &lt;Tooltip color="secondary-500" direction="right"/&gt;
400
- ...
401
- &lt;Tooltip/&gt;
402
- </code>
403
- </td>
404
- </tr>
405
- <tr class="tw-bg-grayscale-200">
406
- <td class="tw-p-4">
407
- <Tooltip color="success-500" direction="right">
408
- <template v-slot:open>I am an success tooltip!</template>
409
- <template v-slot:content>
410
- I am some slot content!
411
- <br><br>
412
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
413
- <br><br>
414
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
415
- </template>
416
- </Tooltip>
417
- </td>
418
- <td class="tw-p-4">
419
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
420
- &lt;Tooltip color="success-500" direction="right"/&gt;
421
- ...
422
- &lt;Tooltip/&gt;
423
- </code>
424
- </td>
425
- </tr>
426
- <tr class="tw-bg-grayscale-200">
427
- <td class="tw-p-4">
428
- <Tooltip color="warning-500" direction="right">
429
- <template v-slot:open>I am an warning tooltip!</template>
430
- <template v-slot:content>
431
- I am some slot content!
432
- <br><br>
433
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
434
- <br><br>
435
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
436
- </template>
437
- </Tooltip>
438
- </td>
439
- <td class="tw-p-4">
440
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
441
- &lt;Tooltip color="warning-500" direction="right"/&gt;
442
- ...
443
- &lt;Tooltip/&gt;
444
- </code>
445
- </td>
446
- </tr>
447
- <tr class="tw-bg-grayscale-200">
448
- <td class="tw-p-4">
449
- <Tooltip color="error-500" direction="right">
450
- <template v-slot:open>I am an error tooltip!</template>
451
- <template v-slot:content>
452
- I am some slot content!
453
- <br><br>
454
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
455
- <br><br>
456
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
457
- </template>
458
- </Tooltip>
459
- </td>
460
- <td class="tw-p-4">
461
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
462
- &lt;Tooltip color="error-500" direction="right"/&gt;
463
- ...
464
- &lt;Tooltip/&gt;
465
- </code>
466
- </td>
467
- </tr>
468
- </tbody>
469
- </table>
470
- `});var o,l,r;t.parameters={...t.parameters,docs:{...(o=t.parameters)==null?void 0:o.docs,source:{originalSource:`() => {
471
- return {
472
- components: {
473
- Tooltip
474
- },
475
- template: \`
476
- <table class="tw-w-full">
477
- <thead>
478
- <tr>
479
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans">Tooltip</th>
480
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans">Code</th>
481
- </tr>
482
- </thead>
483
- <tbody>
484
- <tr>
485
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans" colspan="2">Directions</th>
486
- </tr>
487
- <tr class="tw-bg-grayscale-200">
488
- <td class="tw-text-center tw-p-4">
489
- <Tooltip direction="bottom">
490
- <template v-slot:open>I am a tooltip on the bottom!</template>
491
- <template v-slot:content>
492
- I am some slot content!
493
- <br><br>
494
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
495
- <br><br>
496
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
497
- </template>
498
- </Tooltip>
499
- </td>
500
- <td class="tw-p-4">
501
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
502
- &lt;Tooltip direction="bottom"/&gt;
503
- ...
504
- &lt;Tooltip/&gt;
505
- </code>
506
- </td>
507
- </tr>
508
- <tr class="tw-bg-grayscale-200">
509
- <td class="tw-p-4">
510
- <Tooltip direction="right">
511
- <template v-slot:open>I am a tooltip on the right!</template>
512
- <template v-slot:content>
513
- I am some slot content!
514
- <br><br>
515
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
516
- <br><br>
517
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
518
- </template>
519
- </Tooltip>
520
- </td>
521
- <td class="tw-p-4">
522
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
523
- &lt;Tooltip direction="right"/&gt;
524
- ...
525
- &lt;Tooltip/&gt;
526
- </code>
527
- </td>
528
- </tr>
529
- <tr class="tw-bg-grayscale-200">
530
- <td class="tw-text-right tw-p-4">
531
- <Tooltip direction="left">
532
- <template v-slot:open>I am a tooltip on the left!</template>
533
- <template v-slot:content>
534
- I am some slot content!
535
- <br><br>
536
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
537
- <br><br>
538
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
539
- </template>
540
- </Tooltip>
541
- </td>
542
- <td class="tw-p-4">
543
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
544
- &lt;Tooltip direction="left"/&gt;
545
- ...
546
- &lt;Tooltip/&gt;
547
- </code>
548
- </td>
549
- </tr>
550
- <tr class="tw-bg-grayscale-200">
551
- <td class="tw-text-center tw-p-4">
552
- <Tooltip direction="top">
553
- <template v-slot:open>I am a tooltip on the top!</template>
554
- <template v-slot:content>
555
- I am some slot content!
556
- <br><br>
557
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
558
- <br><br>
559
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
560
- </template>
561
- </Tooltip>
562
- </td>
563
- <td class="tw-p-4">
564
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
565
- &lt;Tooltip direction="top"/&gt;
566
- ...
567
- &lt;Tooltip/&gt;
568
- </code>
569
- </td>
570
- </tr>
571
- <tr>
572
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans" colspan="2">Alignments</th>
573
- </tr>
574
- <tr class="tw-bg-grayscale-200">
575
- <td class="tw-text-center tw-p-4">
576
- <Tooltip direction="bottom" alignment="left">
577
- <template v-slot:open>I am a tooltip on the bottom, aligned to the left!</template>
578
- <template v-slot:content>
579
- I am some slot content!
580
- <br><br>
581
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
582
- <br><br>
583
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
584
- </template>
585
- </Tooltip>
586
- </td>
587
- <td class="tw-p-4">
588
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
589
- &lt;Tooltip direction="bottom" alignment="left"/&gt;
590
- ...
591
- &lt;Tooltip/&gt;
592
- </code>
593
- </td>
594
- </tr>
595
- <tr class="tw-bg-grayscale-200">
596
- <td class="tw-text-center tw-p-4">
597
- <Tooltip direction="bottom" alignment="right">
598
- <template v-slot:open>I am a tooltip on the bottom, aligned to the right!</template>
599
- <template v-slot:content>
600
- I am some slot content!
601
- <br><br>
602
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
603
- <br><br>
604
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
605
- </template>
606
- </Tooltip>
607
- </td>
608
- <td class="tw-p-4">
609
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
610
- &lt;Tooltip direction="bottom" alignment="right"/&gt;
611
- ...
612
- &lt;Tooltip/&gt;
613
- </code>
614
- </td>
615
- </tr>
616
- <tr class="tw-bg-grayscale-200">
617
- <td class="tw-text-center tw-p-4">
618
- <Tooltip direction="bottom" alignment="center">
619
- <template v-slot:open>I am a tooltip on the bottom, aligned to the center!</template>
620
- <template v-slot:content>
621
- I am some slot content!
622
- <br><br>
623
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
624
- <br><br>
625
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
626
- </template>
627
- </Tooltip>
628
- </td>
629
- <td class="tw-p-4">
630
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
631
- &lt;Tooltip direction="bottom" alignment="center"/&gt;
632
- ...
633
- &lt;Tooltip/&gt;
634
- </code>
635
- </td>
636
- </tr>
637
- <tr class="tw-bg-grayscale-200">
638
- <td class="tw-p-4">
639
- <Tooltip direction="right" alignment="top">
640
- <template v-slot:open>I am a tooltip on the right, aligned to the top!</template>
641
- <template v-slot:content>
642
- I am some slot content!
643
- <br><br>
644
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
645
- <br><br>
646
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
647
- </template>
648
- </Tooltip>
649
- </td>
650
- <td class="tw-p-4">
651
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
652
- &lt;Tooltip direction="right" alignment="top"/&gt;
653
- ...
654
- &lt;Tooltip/&gt;
655
- </code>
656
- </td>
657
- </tr>
658
- <tr class="tw-bg-grayscale-200">
659
- <td class="tw-p-4">
660
- <Tooltip direction="right" alignment="bottom">
661
- <template v-slot:open>I am a tooltip on the right, aligned to the bottom!</template>
662
- <template v-slot:content>
663
- I am some slot content!
664
- <br><br>
665
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
666
- <br><br>
667
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
668
- </template>
669
- </Tooltip>
670
- </td>
671
- <td class="tw-p-4">
672
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
673
- &lt;Tooltip direction="right" alignment="bottom"/&gt;
674
- ...
675
- &lt;Tooltip/&gt;
676
- </code>
677
- </td>
678
- </tr>
679
- <tr class="tw-bg-grayscale-200">
680
- <td class="tw-p-4">
681
- <Tooltip direction="right" alignment="middle">
682
- <template v-slot:open>I am a tooltip on the right, aligned to the middle!</template>
683
- <template v-slot:content>
684
- I am some slot content!
685
- <br><br>
686
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
687
- <br><br>
688
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
689
- </template>
690
- </Tooltip>
691
- </td>
692
- <td class="tw-p-4">
693
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
694
- &lt;Tooltip direction="right" alignment="middle"/&gt;
695
- ...
696
- &lt;Tooltip/&gt;
697
- </code>
698
- </td>
699
- </tr>
700
- <tr class="tw-bg-grayscale-200">
701
- <td class="tw-text-right tw-p-4">
702
- <Tooltip direction="left" alignment="top">
703
- <template v-slot:open>I am a tooltip on the left, aligned to the top!</template>
704
- <template v-slot:content>
705
- I am some slot content!
706
- <br><br>
707
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
708
- <br><br>
709
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
710
- </template>
711
- </Tooltip>
712
- </td>
713
- <td class="tw-p-4">
714
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
715
- &lt;Tooltip direction="left" alignment="top"/&gt;
716
- ...
717
- &lt;Tooltip/&gt;
718
- </code>
719
- </td>
720
- </tr>
721
- <tr class="tw-bg-grayscale-200">
722
- <td class="tw-text-right tw-p-4">
723
- <Tooltip direction="left" alignment="bottom">
724
- <template v-slot:open>I am a tooltip on the left, aligned to the bottom!</template>
725
- <template v-slot:content>
726
- I am some slot content!
727
- <br><br>
728
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
729
- <br><br>
730
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
731
- </template>
732
- </Tooltip>
733
- </td>
734
- <td class="tw-p-4">
735
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
736
- &lt;Tooltip direction="left" alignment="bottom"/&gt;
737
- ...
738
- &lt;Tooltip/&gt;
739
- </code>
740
- </td>
741
- </tr>
742
- <tr class="tw-bg-grayscale-200">
743
- <td class="tw-text-right tw-p-4">
744
- <Tooltip direction="left" alignment="middle">
745
- <template v-slot:open>I am a tooltip on the left, aligned to the middle!</template>
746
- <template v-slot:content>
747
- I am some slot content!
748
- <br><br>
749
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
750
- <br><br>
751
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
752
- </template>
753
- </Tooltip>
754
- </td>
755
- <td class="tw-p-4">
756
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
757
- &lt;Tooltip direction="left" alignment="middle"/&gt;
758
- ...
759
- &lt;Tooltip/&gt;
760
- </code>
761
- </td>
762
- </tr>
763
- <tr class="tw-bg-grayscale-200">
764
- <td class="tw-text-center tw-p-4">
765
- <Tooltip direction="top" alignment="left">
766
- <template v-slot:open>I am a tooltip on the top, aligned to the left!</template>
767
- <template v-slot:content>
768
- I am some slot content!
769
- <br><br>
770
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
771
- <br><br>
772
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
773
- </template>
774
- </Tooltip>
775
- </td>
776
- <td class="tw-p-4">
777
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
778
- &lt;Tooltip direction="top" alignment="left"/&gt;
779
- ...
780
- &lt;Tooltip/&gt;
781
- </code>
782
- </td>
783
- </tr>
784
- <tr class="tw-bg-grayscale-200">
785
- <td class="tw-text-center tw-p-4">
786
- <Tooltip direction="top" alignment="right">
787
- <template v-slot:open>I am a tooltip on the top, aligned to the right!</template>
788
- <template v-slot:content>
789
- I am some slot content!
790
- <br><br>
791
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
792
- <br><br>
793
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
794
- </template>
795
- </Tooltip>
796
- </td>
797
- <td class="tw-p-4">
798
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
799
- &lt;Tooltip direction="top" alignment="right"/&gt;
800
- ...
801
- &lt;Tooltip/&gt;
802
- </code>
803
- </td>
804
- </tr>
805
- <tr class="tw-bg-grayscale-200">
806
- <td class="tw-text-center tw-p-4">
807
- <Tooltip direction="top" alignment="center">
808
- <template v-slot:open>I am a tooltip on the top, aligned to the center!</template>
809
- <template v-slot:content>
810
- I am some slot content!
811
- <br><br>
812
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
813
- <br><br>
814
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
815
- </template>
816
- </Tooltip>
817
- </td>
818
- <td class="tw-p-4">
819
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
820
- &lt;Tooltip direction="top" alignment="center"/&gt;
821
- ...
822
- &lt;Tooltip/&gt;
823
- </code>
824
- </td>
825
- </tr>
826
- </tbody>
827
- </table>
828
- \`
829
- };
830
- }`,...(r=(l=t.parameters)==null?void 0:l.docs)==null?void 0:r.source}}};var a,i,s;e.parameters={...e.parameters,docs:{...(a=e.parameters)==null?void 0:a.docs,source:{originalSource:`() => {
831
- return {
832
- components: {
833
- Tooltip
834
- },
835
- template: \`
836
- <table class="tw-w-full">
837
- <thead>
838
- <tr>
839
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans">Tooltip</th>
840
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans">Code</th>
841
- </tr>
842
- </thead>
843
- <tbody>
844
- <tr class="tw-bg-grayscale-200">
845
- <td class="tw-p-4">
846
- <Tooltip color="info-500" direction="right">
847
- <template v-slot:open>I am an info tooltip!</template>
848
- <template v-slot:content>
849
- I am some slot content!
850
- <br><br>
851
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
852
- <br><br>
853
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
854
- </template>
855
- </Tooltip>
856
- </td>
857
- <td class="tw-p-4">
858
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
859
- &lt;Tooltip color="info-500" direction="right"/&gt;
860
- ...
861
- &lt;Tooltip/&gt;
862
- </code>
863
- </td>
864
- </tr>
865
- <tr class="tw-bg-grayscale-200">
866
- <td class="tw-p-4">
867
- <Tooltip color="secondary-500" direction="right">
868
- <template v-slot:open>I am an secondary tooltip!</template>
869
- <template v-slot:content>
870
- I am some slot content!
871
- <br><br>
872
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
873
- <br><br>
874
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
875
- </template>
876
- </Tooltip>
877
- </td>
878
- <td class="tw-p-4">
879
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
880
- &lt;Tooltip color="secondary-500" direction="right"/&gt;
881
- ...
882
- &lt;Tooltip/&gt;
883
- </code>
884
- </td>
885
- </tr>
886
- <tr class="tw-bg-grayscale-200">
887
- <td class="tw-p-4">
888
- <Tooltip color="success-500" direction="right">
889
- <template v-slot:open>I am an success tooltip!</template>
890
- <template v-slot:content>
891
- I am some slot content!
892
- <br><br>
893
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
894
- <br><br>
895
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
896
- </template>
897
- </Tooltip>
898
- </td>
899
- <td class="tw-p-4">
900
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
901
- &lt;Tooltip color="success-500" direction="right"/&gt;
902
- ...
903
- &lt;Tooltip/&gt;
904
- </code>
905
- </td>
906
- </tr>
907
- <tr class="tw-bg-grayscale-200">
908
- <td class="tw-p-4">
909
- <Tooltip color="warning-500" direction="right">
910
- <template v-slot:open>I am an warning tooltip!</template>
911
- <template v-slot:content>
912
- I am some slot content!
913
- <br><br>
914
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
915
- <br><br>
916
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
917
- </template>
918
- </Tooltip>
919
- </td>
920
- <td class="tw-p-4">
921
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
922
- &lt;Tooltip color="warning-500" direction="right"/&gt;
923
- ...
924
- &lt;Tooltip/&gt;
925
- </code>
926
- </td>
927
- </tr>
928
- <tr class="tw-bg-grayscale-200">
929
- <td class="tw-p-4">
930
- <Tooltip color="error-500" direction="right">
931
- <template v-slot:open>I am an error tooltip!</template>
932
- <template v-slot:content>
933
- I am some slot content!
934
- <br><br>
935
- Fusce gravida ligula eget maximus porta. Donec dictum augue nec sapien pharetra, et consectetur diam interdum.
936
- <br><br>
937
- Cras tristique scelerisque nulla id elementum. Nam nec nisi non lorem pellentesque pulvinar.
938
- </template>
939
- </Tooltip>
940
- </td>
941
- <td class="tw-p-4">
942
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
943
- &lt;Tooltip color="error-500" direction="right"/&gt;
944
- ...
945
- &lt;Tooltip/&gt;
946
- </code>
947
- </td>
948
- </tr>
949
- </tbody>
950
- </table>
951
- \`
952
- };
953
- }`,...(s=(i=e.parameters)==null?void 0:i.docs)==null?void 0:s.source}}};const g=["DirectionsAndAlignments","Colors"];export{e as Colors,t as DirectionsAndAlignments,g as __namedExportsOrder,u as default};