@spectrum-web-components/tooltip 0.33.2 → 0.33.3-overlay.61
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.
- package/custom-elements.json +77 -139
- package/package.json +4 -4
- package/src/Tooltip.d.ts +10 -32
- package/src/Tooltip.dev.js +102 -162
- package/src/Tooltip.dev.js.map +3 -3
- package/src/Tooltip.js +25 -5
- package/src/Tooltip.js.map +3 -3
- package/src/spectrum-config.js +120 -17
- package/src/spectrum-tooltip.css.dev.js +19 -19
- package/src/spectrum-tooltip.css.dev.js.map +1 -1
- package/src/spectrum-tooltip.css.js +19 -19
- package/src/spectrum-tooltip.css.js.map +1 -1
- package/src/tooltip.css.dev.js +23 -20
- package/src/tooltip.css.dev.js.map +2 -2
- package/src/tooltip.css.js +23 -20
- package/src/tooltip.css.js.map +2 -2
- package/stories/tooltip.stories.js +12 -15
- package/stories/tooltip.stories.js.map +2 -2
- package/test/tooltip.test.js +21 -57
- package/test/tooltip.test.js.map +2 -2
package/custom-elements.json
CHANGED
|
@@ -24,19 +24,66 @@
|
|
|
24
24
|
{
|
|
25
25
|
"kind": "class",
|
|
26
26
|
"description": "",
|
|
27
|
-
"name": "
|
|
28
|
-
"
|
|
27
|
+
"name": "TooltipOpenable",
|
|
28
|
+
"members": [
|
|
29
29
|
{
|
|
30
|
-
"
|
|
30
|
+
"kind": "field",
|
|
31
|
+
"name": "open",
|
|
31
32
|
"type": {
|
|
32
|
-
"text": "
|
|
33
|
+
"text": "boolean"
|
|
33
34
|
}
|
|
35
|
+
},
|
|
36
|
+
{
|
|
37
|
+
"kind": "field",
|
|
38
|
+
"name": "_open",
|
|
39
|
+
"type": {
|
|
40
|
+
"text": "boolean"
|
|
41
|
+
},
|
|
42
|
+
"privacy": "private",
|
|
43
|
+
"default": "false"
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
"kind": "field",
|
|
47
|
+
"name": "placement",
|
|
48
|
+
"type": {
|
|
49
|
+
"text": "Placement"
|
|
50
|
+
},
|
|
51
|
+
"attribute": "placement"
|
|
52
|
+
},
|
|
53
|
+
{
|
|
54
|
+
"kind": "field",
|
|
55
|
+
"name": "_placement",
|
|
56
|
+
"type": {
|
|
57
|
+
"text": "Placement"
|
|
58
|
+
},
|
|
59
|
+
"privacy": "private",
|
|
60
|
+
"default": "'top'"
|
|
61
|
+
},
|
|
62
|
+
{
|
|
63
|
+
"kind": "field",
|
|
64
|
+
"name": "tipElement",
|
|
65
|
+
"type": {
|
|
66
|
+
"text": "HTMLElement"
|
|
67
|
+
},
|
|
68
|
+
"readonly": true
|
|
69
|
+
}
|
|
70
|
+
],
|
|
71
|
+
"attributes": [
|
|
72
|
+
{
|
|
73
|
+
"name": "open"
|
|
74
|
+
},
|
|
75
|
+
{
|
|
76
|
+
"name": "placement",
|
|
77
|
+
"type": {
|
|
78
|
+
"text": "\"auto\" | \"auto-start\" | \"auto-end\" | \"top\" | \"bottom\" | \"right\" | \"left\" | \"top-start\" | \"top-end\" | \"bottom-start\" | \"bottom-end\" | \"right-start\" | \"right-end\" | \"left-start\" | \"left-end\""
|
|
79
|
+
},
|
|
80
|
+
"fieldName": "placement"
|
|
34
81
|
}
|
|
35
82
|
],
|
|
36
83
|
"superclass": {
|
|
37
84
|
"name": "HTMLElement"
|
|
38
85
|
},
|
|
39
|
-
"tagName": "tooltip-
|
|
86
|
+
"tagName": "sp-tooltip-openable",
|
|
40
87
|
"customElement": true
|
|
41
88
|
},
|
|
42
89
|
{
|
|
@@ -64,12 +111,6 @@
|
|
|
64
111
|
"default": "0",
|
|
65
112
|
"privacy": "private"
|
|
66
113
|
},
|
|
67
|
-
{
|
|
68
|
-
"kind": "field",
|
|
69
|
-
"name": "_tooltipId",
|
|
70
|
-
"privacy": "private",
|
|
71
|
-
"default": "`sp-tooltip-describedby-helper-${Tooltip.instanceCount++}`"
|
|
72
|
-
},
|
|
73
114
|
{
|
|
74
115
|
"kind": "field",
|
|
75
116
|
"name": "selfManaged",
|
|
@@ -91,15 +132,6 @@
|
|
|
91
132
|
"attribute": "offset",
|
|
92
133
|
"reflects": true
|
|
93
134
|
},
|
|
94
|
-
{
|
|
95
|
-
"kind": "field",
|
|
96
|
-
"name": "hadTooltipId",
|
|
97
|
-
"type": {
|
|
98
|
-
"text": "boolean"
|
|
99
|
-
},
|
|
100
|
-
"privacy": "private",
|
|
101
|
-
"default": "false"
|
|
102
|
-
},
|
|
103
135
|
{
|
|
104
136
|
"kind": "field",
|
|
105
137
|
"name": "open",
|
|
@@ -115,10 +147,9 @@
|
|
|
115
147
|
"kind": "field",
|
|
116
148
|
"name": "placement",
|
|
117
149
|
"type": {
|
|
118
|
-
"text": "\"auto\" | \"auto-start\" | \"auto-end\" | \"top\" | \"bottom\" | \"right\" | \"left\" | \"top-start\" | \"top-end\" | \"bottom-start\" | \"bottom-end\" | \"right-start\" | \"right-end\" | \"left-start\" | \"left-end\"
|
|
150
|
+
"text": "\"auto\" | \"auto-start\" | \"auto-end\" | \"top\" | \"bottom\" | \"right\" | \"left\" | \"top-start\" | \"top-end\" | \"bottom-start\" | \"bottom-end\" | \"right-start\" | \"right-end\" | \"left-start\" | \"left-end\""
|
|
119
151
|
},
|
|
120
152
|
"privacy": "public",
|
|
121
|
-
"default": "'top'",
|
|
122
153
|
"attribute": "placement",
|
|
123
154
|
"reflects": true
|
|
124
155
|
},
|
|
@@ -128,7 +159,7 @@
|
|
|
128
159
|
"type": {
|
|
129
160
|
"text": "HTMLSpanElement"
|
|
130
161
|
},
|
|
131
|
-
"privacy": "
|
|
162
|
+
"privacy": "public"
|
|
132
163
|
},
|
|
133
164
|
{
|
|
134
165
|
"kind": "field",
|
|
@@ -148,64 +179,20 @@
|
|
|
148
179
|
"privacy": "public",
|
|
149
180
|
"attribute": "variant"
|
|
150
181
|
},
|
|
151
|
-
{
|
|
152
|
-
"kind": "method",
|
|
153
|
-
"name": "onOverlayQuery",
|
|
154
|
-
"privacy": "public",
|
|
155
|
-
"return": {
|
|
156
|
-
"type": {
|
|
157
|
-
"text": "void"
|
|
158
|
-
}
|
|
159
|
-
},
|
|
160
|
-
"parameters": [
|
|
161
|
-
{
|
|
162
|
-
"name": "event",
|
|
163
|
-
"type": {
|
|
164
|
-
"text": "CustomEvent<OverlayDisplayQueryDetail>"
|
|
165
|
-
}
|
|
166
|
-
}
|
|
167
|
-
]
|
|
168
|
-
},
|
|
169
182
|
{
|
|
170
183
|
"kind": "field",
|
|
171
|
-
"name": "
|
|
172
|
-
"type": {
|
|
173
|
-
"text": "HTMLElement"
|
|
174
|
-
},
|
|
184
|
+
"name": "handleOpenOverlay",
|
|
175
185
|
"privacy": "private"
|
|
176
186
|
},
|
|
177
187
|
{
|
|
178
|
-
"kind": "
|
|
179
|
-
"name": "
|
|
180
|
-
"privacy": "
|
|
181
|
-
"return": {
|
|
182
|
-
"type": {
|
|
183
|
-
"text": "void"
|
|
184
|
-
}
|
|
185
|
-
}
|
|
186
|
-
},
|
|
187
|
-
{
|
|
188
|
-
"kind": "method",
|
|
189
|
-
"name": "overlayWillOpenCallback",
|
|
190
|
-
"privacy": "public",
|
|
191
|
-
"return": {
|
|
192
|
-
"type": {
|
|
193
|
-
"text": "void"
|
|
194
|
-
}
|
|
195
|
-
},
|
|
196
|
-
"parameters": [
|
|
197
|
-
{
|
|
198
|
-
"name": "{\n trigger,\n }",
|
|
199
|
-
"type": {
|
|
200
|
-
"text": "{\n trigger: HTMLElement;\n }"
|
|
201
|
-
}
|
|
202
|
-
}
|
|
203
|
-
]
|
|
188
|
+
"kind": "field",
|
|
189
|
+
"name": "handleCloseOverlay",
|
|
190
|
+
"privacy": "protected"
|
|
204
191
|
},
|
|
205
192
|
{
|
|
206
193
|
"kind": "method",
|
|
207
|
-
"name": "
|
|
208
|
-
"privacy": "
|
|
194
|
+
"name": "handleTransitionrun",
|
|
195
|
+
"privacy": "protected",
|
|
209
196
|
"return": {
|
|
210
197
|
"type": {
|
|
211
198
|
"text": "void"
|
|
@@ -213,17 +200,17 @@
|
|
|
213
200
|
},
|
|
214
201
|
"parameters": [
|
|
215
202
|
{
|
|
216
|
-
"name": "
|
|
203
|
+
"name": "event",
|
|
217
204
|
"type": {
|
|
218
|
-
"text": "
|
|
205
|
+
"text": "TransitionEvent"
|
|
219
206
|
}
|
|
220
207
|
}
|
|
221
208
|
]
|
|
222
209
|
},
|
|
223
210
|
{
|
|
224
211
|
"kind": "method",
|
|
225
|
-
"name": "
|
|
226
|
-
"privacy": "
|
|
212
|
+
"name": "handleTransitionend",
|
|
213
|
+
"privacy": "protected",
|
|
227
214
|
"return": {
|
|
228
215
|
"type": {
|
|
229
216
|
"text": "void"
|
|
@@ -231,65 +218,25 @@
|
|
|
231
218
|
},
|
|
232
219
|
"parameters": [
|
|
233
220
|
{
|
|
234
|
-
"name": "
|
|
221
|
+
"name": "event",
|
|
235
222
|
"type": {
|
|
236
|
-
"text": "
|
|
223
|
+
"text": "TransitionEvent"
|
|
237
224
|
}
|
|
238
225
|
}
|
|
239
226
|
]
|
|
240
|
-
}
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
"name": "removeProxy",
|
|
244
|
-
"privacy": "private",
|
|
245
|
-
"return": {
|
|
246
|
-
"type": {
|
|
247
|
-
"text": "void"
|
|
248
|
-
}
|
|
249
|
-
}
|
|
250
|
-
},
|
|
251
|
-
{
|
|
252
|
-
"kind": "field",
|
|
253
|
-
"name": "closeOverlayCallback",
|
|
254
|
-
"type": {
|
|
255
|
-
"text": "Promise<() => void> | undefined"
|
|
256
|
-
},
|
|
257
|
-
"privacy": "private"
|
|
258
|
-
},
|
|
227
|
+
}
|
|
228
|
+
],
|
|
229
|
+
"events": [
|
|
259
230
|
{
|
|
260
|
-
"
|
|
261
|
-
"name": "abortOverlay",
|
|
231
|
+
"name": "transitionrun",
|
|
262
232
|
"type": {
|
|
263
|
-
"text": "
|
|
264
|
-
}
|
|
265
|
-
"privacy": "private"
|
|
266
|
-
},
|
|
267
|
-
{
|
|
268
|
-
"kind": "field",
|
|
269
|
-
"name": "openOverlay",
|
|
270
|
-
"privacy": "private"
|
|
271
|
-
},
|
|
272
|
-
{
|
|
273
|
-
"kind": "field",
|
|
274
|
-
"name": "closeOverlay",
|
|
275
|
-
"privacy": "private"
|
|
233
|
+
"text": "TransitionEvent"
|
|
234
|
+
}
|
|
276
235
|
},
|
|
277
236
|
{
|
|
278
|
-
"
|
|
279
|
-
"name": "previousSlot",
|
|
237
|
+
"name": "transitionend",
|
|
280
238
|
"type": {
|
|
281
|
-
"text": "
|
|
282
|
-
},
|
|
283
|
-
"privacy": "private"
|
|
284
|
-
},
|
|
285
|
-
{
|
|
286
|
-
"kind": "method",
|
|
287
|
-
"name": "manageTooltip",
|
|
288
|
-
"privacy": "private",
|
|
289
|
-
"return": {
|
|
290
|
-
"type": {
|
|
291
|
-
"text": "void"
|
|
292
|
-
}
|
|
239
|
+
"text": "TransitionEvent"
|
|
293
240
|
}
|
|
294
241
|
}
|
|
295
242
|
],
|
|
@@ -297,9 +244,8 @@
|
|
|
297
244
|
{
|
|
298
245
|
"name": "placement",
|
|
299
246
|
"type": {
|
|
300
|
-
"text": "\"auto\" | \"auto-start\" | \"auto-end\" | \"top\" | \"bottom\" | \"right\" | \"left\" | \"top-start\" | \"top-end\" | \"bottom-start\" | \"bottom-end\" | \"right-start\" | \"right-end\" | \"left-start\" | \"left-end\"
|
|
247
|
+
"text": "\"auto\" | \"auto-start\" | \"auto-end\" | \"top\" | \"bottom\" | \"right\" | \"left\" | \"top-start\" | \"top-end\" | \"bottom-start\" | \"bottom-end\" | \"right-start\" | \"right-end\" | \"left-start\" | \"left-end\""
|
|
301
248
|
},
|
|
302
|
-
"default": "'top'",
|
|
303
249
|
"fieldName": "placement",
|
|
304
250
|
"attribute": "placement"
|
|
305
251
|
},
|
|
@@ -344,19 +290,11 @@
|
|
|
344
290
|
}
|
|
345
291
|
],
|
|
346
292
|
"exports": [
|
|
347
|
-
{
|
|
348
|
-
"kind": "js",
|
|
349
|
-
"name": "TooltipProxy",
|
|
350
|
-
"declaration": {
|
|
351
|
-
"name": "TooltipProxy",
|
|
352
|
-
"module": "src/Tooltip.ts"
|
|
353
|
-
}
|
|
354
|
-
},
|
|
355
293
|
{
|
|
356
294
|
"kind": "custom-element-definition",
|
|
357
|
-
"name": "tooltip-
|
|
295
|
+
"name": "sp-tooltip-openable",
|
|
358
296
|
"declaration": {
|
|
359
|
-
"name": "
|
|
297
|
+
"name": "TooltipOpenable",
|
|
360
298
|
"module": "src/Tooltip.ts"
|
|
361
299
|
}
|
|
362
300
|
},
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/tooltip",
|
|
3
|
-
"version": "0.33.
|
|
3
|
+
"version": "0.33.3-overlay.61+af969dcc2",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -57,8 +57,8 @@
|
|
|
57
57
|
"lit-html"
|
|
58
58
|
],
|
|
59
59
|
"dependencies": {
|
|
60
|
-
"@spectrum-web-components/base": "^0.33.
|
|
61
|
-
"@spectrum-web-components/overlay": "^0.33.
|
|
60
|
+
"@spectrum-web-components/base": "^0.33.3-overlay.61+af969dcc2",
|
|
61
|
+
"@spectrum-web-components/overlay": "^0.33.3-overlay.61+af969dcc2"
|
|
62
62
|
},
|
|
63
63
|
"devDependencies": {
|
|
64
64
|
"@spectrum-css/tooltip": "^4.0.10"
|
|
@@ -69,5 +69,5 @@
|
|
|
69
69
|
"./sp-*.js",
|
|
70
70
|
"./**/*.dev.js"
|
|
71
71
|
],
|
|
72
|
-
"gitHead": "
|
|
72
|
+
"gitHead": "af969dcc2f8c905648b3e5a5fad982d1f81ee080"
|
|
73
73
|
}
|
package/src/Tooltip.d.ts
CHANGED
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
import { CSSResultArray,
|
|
2
|
-
import type {
|
|
3
|
-
|
|
4
|
-
disconnectedCallback(): void;
|
|
5
|
-
}
|
|
1
|
+
import { CSSResultArray, SpectrumElement, TemplateResult } from '@spectrum-web-components/base';
|
|
2
|
+
import type { Placement } from '@spectrum-web-components/overlay';
|
|
3
|
+
import '@spectrum-web-components/overlay/sp-overlay.js';
|
|
6
4
|
/**
|
|
7
5
|
* @element sp-tooltip
|
|
8
6
|
*
|
|
@@ -15,41 +13,21 @@ export declare class Tooltip extends SpectrumElement {
|
|
|
15
13
|
* @private
|
|
16
14
|
*/
|
|
17
15
|
static instanceCount: number;
|
|
18
|
-
private _tooltipId;
|
|
19
16
|
selfManaged: boolean;
|
|
20
17
|
offset: number;
|
|
21
|
-
private hadTooltipId;
|
|
22
18
|
open: boolean;
|
|
23
19
|
/**
|
|
24
|
-
* @type {"auto" | "auto-start" | "auto-end" | "top" | "bottom" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end"
|
|
20
|
+
* @type {"auto" | "auto-start" | "auto-end" | "top" | "bottom" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end"}
|
|
25
21
|
* @attr
|
|
26
22
|
*/
|
|
27
|
-
placement
|
|
28
|
-
|
|
23
|
+
placement?: Placement;
|
|
24
|
+
tipElement: HTMLSpanElement;
|
|
29
25
|
private _variant;
|
|
30
26
|
get variant(): string;
|
|
31
27
|
set variant(variant: string);
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
overlayWillOpenCallback({ trigger, }: {
|
|
37
|
-
trigger: HTMLElement;
|
|
38
|
-
}): void;
|
|
39
|
-
overlayOpenCancelledCallback({ trigger, }: {
|
|
40
|
-
trigger: HTMLElement;
|
|
41
|
-
}): void;
|
|
42
|
-
overlayCloseCallback({ trigger }: {
|
|
43
|
-
trigger: HTMLElement;
|
|
44
|
-
}): void;
|
|
45
|
-
private removeProxy;
|
|
46
|
-
private closeOverlayCallback?;
|
|
47
|
-
private abortOverlay;
|
|
48
|
-
private openOverlay;
|
|
49
|
-
private closeOverlay;
|
|
50
|
-
private previousSlot?;
|
|
51
|
-
private manageTooltip;
|
|
28
|
+
private handleOpenOverlay;
|
|
29
|
+
protected handleCloseOverlay: () => void;
|
|
30
|
+
protected handleTransitionrun(event: TransitionEvent): void;
|
|
31
|
+
protected handleTransitionend(event: TransitionEvent): void;
|
|
52
32
|
render(): TemplateResult;
|
|
53
|
-
protected update(changed: PropertyValues<this>): Promise<void>;
|
|
54
|
-
protected updated(changed: PropertyValues<this>): void;
|
|
55
33
|
}
|